function SidebarItem({ text, icon, selected, onSelect, showDropdown = false }) { const handleClick = ()=>onSelect(text); return /*#__PURE__*/ React.createElement("div", { className: `p-3 flex items-center ${selected ? 'bg-white text-[#1B438A]' : 'text-white'} cursor-pointer`, onClick: handleClick, style: { gap: '20px', padding: '12px' }, __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${icon} w-[20px] h-[20px] text-white`, __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-base", __source: { fileName: "", lineNumber: 11, columnNumber: 7 }, __self: this }, text), showDropdown && /*#__PURE__*/ React.createElement("div", { className: "ml-auto", __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-chevron-down text-white", __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }))); } function SidebarItemStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 23, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SidebarItem, { text: "Dashboard", icon: "fas fa-home", selected: false, onSelect: (item)=>console.log(`${item} selected`), __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(SidebarItem, { text: "Settings", icon: "fas fa-cog", selected: true, onSelect: (item)=>console.log(`${item} selected`), __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(SidebarItem, { text: "Messages", icon: "fas fa-envelope", selected: false, onSelect: (item)=>console.log(`${item} selected`), showDropdown: true, __source: { fileName: "", lineNumber: 26, columnNumber: 7 }, __self: this })); } function MainComponent({ onSelect }) { const [selectedItem, setSelectedItem] = React.useState("Anasayfa"); const items = [ { text: "Anasayfa", icon: "fas fa-home", selected: selectedItem === "Anasayfa" }, { text: "ÇekMatik", icon: "fas fa-money-check-alt", selected: selectedItem === "ÇekMatik" }, { text: "İşlemlerim", icon: "fas fa-exchange-alt", selected: selectedItem === "İşlemlerim" }, { text: "Raporlar", icon: "fas fa-chart-line", selected: selectedItem === "Raporlar", showDropdown: true }, { text: "Bize Ulaşın", icon: "fas fa-envelope", selected: selectedItem === "Bize Ulaşın" }, { text: "Duyurular", icon: "fas fa-bullhorn", selected: selectedItem === "Duyurular" } ]; const handleSelect = (text)=>{ setSelectedItem(text); onSelect(text); }; return /*#__PURE__*/ React.createElement("div", { className: "h-screen bg-[#1B438A] rounded-r-3xl text-white flex flex-col", style: { paddingLeft: '12px', paddingRight: '12px' }, __source: { fileName: "", lineNumber: 19, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center font-semibold py-4", style: { gap: '12px' }, __source: { fileName: "", lineNumber: 20, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 21, columnNumber: 9 }, __self: this }, "Business Factoring"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-building", __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this })), items.map((item, index)=>/*#__PURE__*/ React.createElement(SidebarItem, { key: item.text, text: item.text, icon: item.icon, selected: item.selected, onSelect: handleSelect, showDropdown: item.showDropdown, style: { borderTop: index === 0 ? '1px solid lightgray' : '', borderBottom: '1px solid lightgray' }, __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { onSelect: (item)=>console.log(`${item} selected`), __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this })); }