function IntegrationHubComponent({ title, integrationsList, onExploreClick }) { return /*#__PURE__*/ React.createElement("div", { className: "font-roboto flex flex-col items-center justify-center min-h-screen bg-[#f0f0f2]", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center p-4 w-full md:w-[600px] bg-white shadow-lg rounded-lg", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-semibold text-[#38488f]", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 6, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl text-[#121212]", __source: { fileName: "", lineNumber: 7, columnNumber: 11 }, __self: this }, "Available Integrations"), /*#__PURE__*/ React.createElement("ul", { className: "list-disc pl-5 text-left mt-2", __source: { fileName: "", lineNumber: 8, columnNumber: 11 }, __self: this }, integrationsList.map((integration, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 10, columnNumber: 15 }, __self: this }, integration)))), /*#__PURE__*/ React.createElement("button", { onClick: onExploreClick, className: "mt-4 px-4 py-2 bg-[#38488f] text-white rounded hover:bg-[#303f9f] transition-colors", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Explore Integrations"))); } function IntegrationHubComponentStory() { const integrations = [ 'Google Translate', 'Chat GPT', 'Google Search', 'Web Scraping', 'Local Business Data' ]; const handleExploreClick = ()=>{ console.log('Explore Integrations clicked'); }; return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 27, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(IntegrationHubComponent, { title: "Integration Hub", integrationsList: integrations, onExploreClick: handleExploreClick, __source: { fileName: "", lineNumber: 28, columnNumber: 7 }, __self: this })); } function MainComponent() { const integrations = [ 'Google Translate', 'Chat GPT', 'Google Search', 'Web Scraping', 'Local Business Data' ]; const handleExploreClick = ()=>{ console.log('Explore Integrations clicked'); }; return /*#__PURE__*/ React.createElement(IntegrationHubComponent, { title: "Integration Hub", integrationsList: integrations, onExploreClick: handleExploreClick, __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }); }