@ludo.ninja/components 1.9.4 → 1.9.5

package/dist/system/Modals/Modal/{index.jsx → index.js}

@@ -23,10 +23,9 @@ var Modal = function () {
     }); }), contentModals = _a.contentModals, isModalOpen = _a.isModalOpen, closeModal = _a.closeModal, stylesModals = _a.stylesModals;
     if (!isModalOpen)
         return null;
-    return (<StyledModal style={stylesModals ? stylesModals : undefined}>
-      <img src="/modal/close.svg" alt="close" width={24} height={24} className={'modalCloseIcon'} onClick={closeModal}/>
-      <div className="modalContent">{contentModals}</div>
-    </StyledModal>);
+    return (react_1.default.createElement(StyledModal, { style: stylesModals ? stylesModals : undefined },
+        react_1.default.createElement("img", { src: "/modal/close.svg", alt: "close", width: 24, height: 24, className: 'modalCloseIcon', onClick: closeModal }),
+        react_1.default.createElement("div", { className: "modalContent" }, contentModals)));
 };
 exports.default = Modal;
 var templateObject_1;

package/dist/system/Modals/ModalSidebar/{CreatorModalSidebarPortal.jsx → CreatorModalSidebarPortal.js}

@@ -43,6 +43,6 @@ var CreatorModalSidebarPortal = function () {
     if (!isOpenModalSidebarPortal) {
         return null;
     }
-    return (<ModalSidebarPortal closeModal={closeModalSidebarPortal} component={contentModals}/>);
+    return (React.createElement(ModalSidebarPortal, { closeModal: closeModalSidebarPortal, component: contentModals }));
 };
 exports.CreatorModalSidebarPortal = CreatorModalSidebarPortal;

package/dist/system/Modals/ModalSidebar/{ModalSidebar.test.jsx → ModalSidebar.test.js}

@@ -15,12 +15,12 @@ describe('Modal Component', function () {
         var closeModalMock = jest.fn();
         // Mock the useUiStore hook
         ui_1.useUiStore.mockReturnValue({
-            contentModals: <div>test open</div>,
+            contentModals: react_1.default.createElement("div", null, "test open"),
             isModalSidebarOpen: true,
             closeModalSidebar: closeModalMock,
         });
         // Render the Modal component
-        (0, react_2.render)(<index_1.default />);
+        (0, react_2.render)(react_1.default.createElement(index_1.default, null));
         // Check if the modal content is in the document
         var labelElement = react_2.screen.getByText('test open');
         expect(labelElement).toBeInTheDocument();

package/dist/system/Modals/ModalSidebar/{ModalSidebarPortal.jsx → ModalSidebarPortal.js}

@@ -11,11 +11,9 @@ var ModalSidebar_1 = require("@/system/Modals/ModalSidebar");
 // minimize dom tree for optimize virtualization
 var ModalSidebarPortal = function (_a) {
     var component = _a.component, closeModal = _a.closeModal;
-    return (<utils_1.PortalCreator>
-    <ModalSidebar_1.StyledModalSidebar>
-      <img src="/modal/close.svg" alt="close" width={24} height={24} className={'modalCloseIcon'} onClick={closeModal}/>
-      <div className="modalContent">{component}</div>
-    </ModalSidebar_1.StyledModalSidebar>
-  </utils_1.PortalCreator>);
+    return (react_1.default.createElement(utils_1.PortalCreator, null,
+        react_1.default.createElement(ModalSidebar_1.StyledModalSidebar, null,
+            react_1.default.createElement("img", { src: "/modal/close.svg", alt: "close", width: 24, height: 24, className: 'modalCloseIcon', onClick: closeModal }),
+            react_1.default.createElement("div", { className: "modalContent" }, component))));
 };
 exports.ModalSidebarPortal = ModalSidebarPortal;

package/dist/system/Modals/ModalSidebar/{index.jsx → index.js}

@@ -23,10 +23,9 @@ var ModalSidebar = function () {
     }); }), contentModals = _a.contentModals, isModalSidebarOpen = _a.isModalSidebarOpen, closeModalSidebar = _a.closeModalSidebar;
     if (!isModalSidebarOpen)
         return null;
-    return (<exports.StyledModalSidebar>
-      <img src="/modal/close.svg" alt="close" width={24} height={24} className={'modalCloseIcon'} onClick={closeModalSidebar}/>
-      <div className="modalContent">{contentModals}</div>
-    </exports.StyledModalSidebar>);
+    return (react_1.default.createElement(exports.StyledModalSidebar, null,
+        react_1.default.createElement("img", { src: "/modal/close.svg", alt: "close", width: 24, height: 24, className: 'modalCloseIcon', onClick: closeModalSidebar }),
+        react_1.default.createElement("div", { className: "modalContent" }, contentModals)));
 };
 exports.default = ModalSidebar;
 var templateObject_1;

package/dist/system/Overlay/{Overlay.test.jsx → Overlay.test.js}

@@ -17,9 +17,8 @@ describe('Overlay Component', function () {
         isOverlayActive: false,
     };
     var renderComponent = function () {
-        return (0, react_2.render)(<div data-testid={'dialog'}>
-        <Overlay_1.default />
-      </div>);
+        return (0, react_2.render)(react_1.default.createElement("div", { "data-testid": 'dialog' },
+            react_1.default.createElement(Overlay_1.default, null)));
     };
     beforeEach(function () {
         ui_1.useUiStore.mockReturnValue(mockUseUiStore);

package/dist/system/Overlay/{index.jsx → index.js}

@@ -20,9 +20,8 @@ var Overlay = function () {
         closeOverlay: state.closeOverlay,
         isOverlayActive: state.isOverlayActive,
     }); }), closeOverlay = _a.closeOverlay, isOverlayActive = _a.isOverlayActive;
-    return (<StyledOverlay isActive={isOverlayActive} onClick={closeOverlay}>
-      <div className={'blur'}></div>
-    </StyledOverlay>);
+    return (react_1.default.createElement(StyledOverlay, { isActive: isOverlayActive, onClick: closeOverlay },
+        react_1.default.createElement("div", { className: 'blur' })));
 };
 // Export
 exports.default = Overlay;

package/dist/system/{ShareIconResize.jsx → ShareIconResize.js}

@@ -16,12 +16,11 @@ var share_svg_1 = __importDefault(require("@/public/iconButton/share.svg"));
 var SIcon = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"])), styles_1.mediaQuery.minWidthFourK, (0, _4k_1.adaptiveValueCalc)(19), (0, _4k_1.adaptiveValueCalc)(20));
 var ShareIconResize = function () {
     var windowDimensions = (0, utils_1.useWindowDimensionsWithServerInitial)().windowDimensions;
-    return (<SIcon>
-      <share_svg_1.default style={(0, utils_1.getAdaptiveScale)({
-            windowDimensions: windowDimensions,
-            currentSize: 1,
-        })}/>
-    </SIcon>);
+    return (React.createElement(SIcon, null,
+        React.createElement(share_svg_1.default, { style: (0, utils_1.getAdaptiveScale)({
+                windowDimensions: windowDimensions,
+                currentSize: 1,
+            }) })));
 };
 exports.ShareIconResize = ShareIconResize;
 var templateObject_1;

package/dist/system/Tabs/TabNavLink/{TabNavLink.test.jsx → TabNavLink.test.js}

@@ -14,7 +14,7 @@ var tabNavLink = { label: 'Tab 1', value: 'tab1', id: 1 };
 var setActiveTab = jest.fn();
 describe('TabsNavLink Component', function () {
     test('renders tab link with correct label', function () {
-        (0, react_2.render)(<TabNavLink_1.default tabNavLink={tabNavLink} activeNavLink={false}/>);
+        (0, react_2.render)(react_1.default.createElement(TabNavLink_1.default, { tabNavLink: tabNavLink, activeNavLink: false }));
         var tabLink = react_2.screen.getByText('Tab 1');
         expect(tabLink).toBeInTheDocument();
         expect(tabLink).toHaveStyleRule('color', colors_1.TextDarkGrayColor);
@@ -23,7 +23,7 @@ describe('TabsNavLink Component', function () {
         });
     });
     test('renders tab link with active style', function () {
-        (0, react_2.render)(<TabNavLink_1.default tabNavLink={tabNavLink} activeNavLink={true}/>);
+        (0, react_2.render)(react_1.default.createElement(TabNavLink_1.default, { tabNavLink: tabNavLink, activeNavLink: true }));
         var tabLink = react_2.screen.getByText('Tab 1');
         expect(tabLink).toBeInTheDocument();
         expect(tabLink).toHaveStyleRule('color', colors_1.BlackColor);
@@ -32,7 +32,7 @@ describe('TabsNavLink Component', function () {
         });
     });
     test('calls setActiveTab when clicked', function () {
-        (0, react_2.render)(<TabNavLink_1.default tabNavLink={tabNavLink} activeNavLink={false} setActiveTab={setActiveTab}/>);
+        (0, react_2.render)(react_1.default.createElement(TabNavLink_1.default, { tabNavLink: tabNavLink, activeNavLink: false, setActiveTab: setActiveTab }));
         var tabLink = react_2.screen.getByText('Tab 1');
         react_2.fireEvent.click(tabLink);
         expect(setActiveTab).toHaveBeenCalledWith(tabNavLink);

package/dist/system/Tabs/TabNavLink/{index.jsx → index.js}

@@ -19,9 +19,7 @@ exports.StyledTabsNavLink = styled_components_1.default.div(templateObject_1 ||
 // Component
 var TabsNavLink = function (_a) {
     var tabNavLink = _a.tabNavLink, activeNavLink = _a.activeNavLink, setActiveTab = _a.setActiveTab;
-    return (<exports.StyledTabsNavLink isActive={activeNavLink} onClick={function () { return (setActiveTab ? setActiveTab(tabNavLink) : null); }}>
-      {tabNavLink.label}
-    </exports.StyledTabsNavLink>);
+    return (react_1.default.createElement(exports.StyledTabsNavLink, { isActive: activeNavLink, onClick: function () { return (setActiveTab ? setActiveTab(tabNavLink) : null); } }, tabNavLink.label));
 };
 // Export
 exports.default = TabsNavLink;

package/dist/system/Tabs/TabsNav/{TabsNav.test.jsx → TabsNav.test.js}

@@ -18,24 +18,24 @@ var activeTab = { id: 1, label: 'Tab 1' };
 var setActiveTab = jest.fn();
 describe('TabsNav Component', function () {
     test('renders all tabs correctly', function () {
-        (0, react_2.render)(<TabsNav_1.default tabsData={tabsData} activeTab={activeTab}/>);
+        (0, react_2.render)(react_1.default.createElement(TabsNav_1.default, { tabsData: tabsData, activeTab: activeTab }));
         var tab1 = react_2.screen.getByText('Tab 1');
         var tab2 = react_2.screen.getByText('Tab 2');
         expect(tab1).toBeInTheDocument();
         expect(tab2).toBeInTheDocument();
     });
     test('applies active styles to the active tab', function () {
-        (0, react_2.render)(<TabsNav_1.default tabsData={tabsData} activeTab={activeTab} setActiveTab={setActiveTab}/>);
+        (0, react_2.render)(react_1.default.createElement(TabsNav_1.default, { tabsData: tabsData, activeTab: activeTab, setActiveTab: setActiveTab }));
         var activeTabElement = react_2.screen.getByText('Tab 1');
         expect(activeTabElement).toHaveStyleRule('color', colors_1.BlackColor);
     });
     test('applies inactive styles to inactive tabs', function () {
-        (0, react_2.render)(<TabsNav_1.default tabsData={tabsData} activeTab={activeTab} setActiveTab={setActiveTab}/>);
+        (0, react_2.render)(react_1.default.createElement(TabsNav_1.default, { tabsData: tabsData, activeTab: activeTab, setActiveTab: setActiveTab }));
         var inactiveTabElement = react_2.screen.getByText('Tab 2');
         expect(inactiveTabElement).toHaveStyleRule('color', colors_1.TextDarkGrayColor);
     });
     test('calls setActiveTab when a tab is clicked', function () {
-        (0, react_2.render)(<TabsNav_1.default tabsData={tabsData} activeTab={activeTab} setActiveTab={setActiveTab}/>);
+        (0, react_2.render)(react_1.default.createElement(TabsNav_1.default, { tabsData: tabsData, activeTab: activeTab, setActiveTab: setActiveTab }));
         var tab2 = react_2.screen.getByText('Tab 2');
         react_2.fireEvent.click(tab2);
         expect(setActiveTab).toHaveBeenCalledWith(tabsData[1]);

package/dist/system/Tabs/TabsNav/{index.jsx → index.js}

@@ -18,10 +18,10 @@ var TabsNav = function (_a) {
     var tabsData = _a.tabsData, activeTab = _a.activeTab, setActiveTab = _a.setActiveTab;
     var renderSortItems = function () {
         return tabsData.map(function (data) {
-            return (<TabNavLink_1.default key={data.id} activeNavLink={(activeTab === null || activeTab === void 0 ? void 0 : activeTab.id) === data.id} tabNavLink={data} setActiveTab={setActiveTab}/>);
+            return (react_1.default.createElement(TabNavLink_1.default, { key: data.id, activeNavLink: (activeTab === null || activeTab === void 0 ? void 0 : activeTab.id) === data.id, tabNavLink: data, setActiveTab: setActiveTab }));
         });
     };
-    return <exports.StyledTabsNav>{renderSortItems()}</exports.StyledTabsNav>;
+    return react_1.default.createElement(exports.StyledTabsNav, null, renderSortItems());
 };
 // Export
 exports.default = TabsNav;

package/dist/system/Tabs/TabsPanel/{TabsPanel.test.jsx → TabsPanel.test.js}

@@ -10,29 +10,25 @@ require("jest-styled-components");
 var TabsPanel_1 = __importDefault(require("../TabsPanel"));
 describe('TabPanel Component', function () {
     test('renders children when isActive is true', function () {
-        (0, react_2.render)(<TabsPanel_1.default isActive={true}>
-        <div>Content</div>
-      </TabsPanel_1.default>);
+        (0, react_2.render)(react_1.default.createElement(TabsPanel_1.default, { isActive: true },
+            react_1.default.createElement("div", null, "Content")));
         var content = react_2.screen.getByText('Content');
         expect(content).toBeInTheDocument();
     });
     test('does not render children when isActive is false', function () {
-        (0, react_2.render)(<TabsPanel_1.default isActive={false}>
-        <div>Content</div>
-      </TabsPanel_1.default>);
+        (0, react_2.render)(react_1.default.createElement(TabsPanel_1.default, { isActive: false },
+            react_1.default.createElement("div", null, "Content")));
         var content = react_2.screen.queryByText('Content');
         expect(content).not.toBeInTheDocument();
     });
     test('applies correct styles based on isActive prop', function () {
         var _a;
-        var rerender = (0, react_2.render)(<TabsPanel_1.default isActive={true}>
-        <div>Content</div>
-      </TabsPanel_1.default>).rerender;
+        var rerender = (0, react_2.render)(react_1.default.createElement(TabsPanel_1.default, { isActive: true },
+            react_1.default.createElement("div", null, "Content"))).rerender;
         var activePanel = react_2.screen.getByText('Content').parentElement;
         expect(activePanel).toHaveStyleRule('display', 'block');
-        rerender(<TabsPanel_1.default isActive={false}>
-        <div>Content</div>
-      </TabsPanel_1.default>);
+        rerender(react_1.default.createElement(TabsPanel_1.default, { isActive: false },
+            react_1.default.createElement("div", null, "Content")));
         var inactivePanel = (_a = react_2.screen.queryByText('Content')) === null || _a === void 0 ? void 0 : _a.parentElement;
         if (inactivePanel) {
             expect(inactivePanel).toHaveStyleRule('display', 'none');

package/dist/system/Tabs/TabsPanel/{index.jsx → index.js}

@@ -14,7 +14,7 @@ var StyledTabPanel = styled_components_1.default.div(templateObject_1 || (templa
 // Component
 var TabPanel = function (_a) {
     var isActive = _a.isActive, children = _a.children;
-    return (<StyledTabPanel isActive={isActive}>{isActive && children}</StyledTabPanel>);
+    return (react_1.default.createElement(StyledTabPanel, { isActive: isActive }, isActive && children));
 };
 // Export
 exports.default = TabPanel;