function HoverableListLinks({ items }) { return /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, items.map((item, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "hover:bg-[#636e72] p-2 cursor-pointer", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, item))); } function HoverableListLinksStory() { const sampleItems = [ "Item 1", "Item 2", "Item 3" ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HoverableListLinks, { items: sampleItems, __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this })); } function HoverableLinkList({ items }) { return /*#__PURE__*/ React.createElement("ul", { __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, items.map((item)=>{ const key = item; return /*#__PURE__*/ React.createElement("li", { key: key, className: "hover:bg-[#636e72] p-2 cursor-pointer", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, item); })); } function HoverableLinkListStory() { const itemsList = [ "Item 1", "Item 2", "Item 3" ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HoverableLinkList, { items: itemsList, __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this })); } function HoverableItemList({ title, linkItems, hoverableListItems }) { return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-roboto text-[#2d3436] mb-4", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, title), /*#__PURE__*/ React.createElement(HoverableLinkList, { items: linkItems, __source: { fileName: "", lineNumber: 5, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(HoverableListLinks, { items: hoverableListItems, __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this })); } function HoverableItemListStory() { const links = [ "CPA Lead", "OfferWall", "Affiliate Network", "Tracking Software" ]; const hoverableLinksItems = [ "Link1", "Link2", "Link3", "Link4" ]; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 16, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HoverableItemList, { title: "CPA Grip", linkItems: links, hoverableListItems: hoverableLinksItems, __source: { fileName: "", lineNumber: 17, columnNumber: 7 }, __self: this })); } function MainComponent() { const links = [ "CPA Lead", "OfferWall", "Affiliate Network", "Tracking Software" ]; const hoverableLinksItems = [ "Link1", "Link2", "Link3", "Link4" ]; return /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(HoverableItemList, { title: "CPA Grip", linkItems: links, hoverableListItems: hoverableLinksItems, __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this })); }