function BluePhoneIcon({ color = "#007bff" }) { return /*#__PURE__*/ React.createElement("div", { className: `text-[${color}] cursor-pointer font-roboto`, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, "📱"); } function BluePhoneIconStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BluePhoneIcon, { __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(BluePhoneIcon, { color: "#0056b3", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this })); } function BluePhoneIcon2({ color, onClick }) { return /*#__PURE__*/ React.createElement("div", { className: `text-[${color}] cursor-pointer`, onClick: onClick, __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, "📱"); } function BluePhoneIcon2Story() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 11, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(BluePhoneIcon2, { color: "#007bff", onClick: ()=>console.log("Phone icon clicked"), __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this })); } function MainComponent({ selected, onClick }) { return /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between bg-[#f0f0f0] p-4 w-full", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { onClick: ()=>onClick('item1'), __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, selected === 'item1' ? /*#__PURE__*/ React.createElement(BluePhoneIcon, { color: "#34d399", __source: { fileName: "", lineNumber: 5, columnNumber: 33 }, __self: this }) : /*#__PURE__*/ React.createElement(BluePhoneIcon2, { color: "#007bff", onClick: ()=>onClick('item1'), __source: { fileName: "", lineNumber: 5, columnNumber: 69 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto ml-2", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, "Item 1")), /*#__PURE__*/ React.createElement("div", { onClick: ()=>onClick('item2'), __source: { fileName: "", lineNumber: 8, columnNumber: 7 }, __self: this }, selected === 'item2' ? /*#__PURE__*/ React.createElement(BluePhoneIcon, { color: "#34d399", __source: { fileName: "", lineNumber: 9, columnNumber: 33 }, __self: this }) : /*#__PURE__*/ React.createElement(BluePhoneIcon2, { color: "#007bff", onClick: ()=>onClick('item2'), __source: { fileName: "", lineNumber: 9, columnNumber: 69 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto ml-2", __source: { fileName: "", lineNumber: 10, columnNumber: 9 }, __self: this }, "Item 2")), /*#__PURE__*/ React.createElement("div", { onClick: ()=>onClick('item3'), __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, selected === 'item3' ? /*#__PURE__*/ React.createElement(BluePhoneIcon, { color: "#34d399", __source: { fileName: "", lineNumber: 13, columnNumber: 33 }, __self: this }) : /*#__PURE__*/ React.createElement(BluePhoneIcon2, { color: "#007bff", onClick: ()=>onClick('item3'), __source: { fileName: "", lineNumber: 13, columnNumber: 69 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-roboto ml-2", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Item 3"))); } function StoryComponent() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(MainComponent, { selected: "item1", onClick: console.log, __source: { fileName: "", lineNumber: 23, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { selected: "item2", onClick: console.log, __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(MainComponent, { selected: "item3", onClick: console.log, __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this })); }