@ludo.ninja/components 1.9.2 → 1.9.4

package/dist/components/filters/{index.js → index.jsx}

@@ -44,8 +44,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
-var store_1 = require("@ludo.ninja/components/src/store");
-var styles_1 = require("@ludo.ninja/components/src/styles");
+var store_1 = require("@ludo.ninja/components/dist/store");
+var styles_1 = require("@ludo.ninja/components/dist/styles");
 var applyResetBtns_1 = __importDefault(require("@/components/filters/applyResetBtns"));
 var mobileFilters_1 = __importDefault(require("@/components/filters/mobileFilters"));
 var sidebarFilters_1 = __importDefault(require("@/components/sidebar/sidebarFilters"));
@@ -78,33 +78,41 @@ var Filters = function (_a) {
         closeOverlay();
         setSidebarOpen(false);
     };
-    return (react_1.default.createElement(StyledFilters, null,
-        !isMobile &&
-            selectData.map(function (select) { return (react_1.default.createElement("div", { key: select.id, className: "select ".concat(select.data.selectName) },
-                react_1.default.createElement(DesktopSelect_1.default, { defaultOptionValue: filterInput[select.data.selectName], options: select.data.selectOptions, isLoading: false, onChangeHandler: filterInputHandler, name: select.data.selectName }))); }),
-        isMobile && (react_1.default.createElement(react_1.default.Fragment, null,
-            react_1.default.createElement("div", { className: 'filterButton' },
-                react_1.default.createElement("button", { onClick: function (e) {
-                        e.stopPropagation();
-                        e.preventDefault();
-                        openOverLay();
-                        setSidebarOpen(true);
-                    } },
-                    "Filters",
-                    selectedFiltersCount ? (react_1.default.createElement("span", { className: 'counter' }, selectedFiltersCount)) : null)),
-            react_1.default.createElement(sidebarFilters_1.default, { isOpen: isSideBarOpen, handleClose: function () {
-                    setMobileFilterInput(filterInput);
-                    closeFiltersMobile();
-                } },
-                react_1.default.createElement(mobileFilters_1.default, null, selectData.map(function (select) { return (react_1.default.createElement(MobileSelect_1.default, { key: select.id, defaultOptionValue: mobileFilterInput[select.data
-                        .selectName], options: select.data.selectOptions, name: select.data.selectName, onChangeHandler: handleMobileFilters })); })),
-                react_1.default.createElement(applyResetBtns_1.default, { onReset: function () {
-                        handleResetFilter();
-                        closeFiltersMobile();
-                    }, onApply: function () {
-                        handleMobileFilterInput(mobileFilterInput);
-                        closeFiltersMobile();
-                    } }))))));
+    return (<StyledFilters>
+      {!isMobile &&
+            selectData.map(function (select) { return (<div key={select.id} className={"select ".concat(select.data.selectName)}>
+            <DesktopSelect_1.default defaultOptionValue={filterInput[select.data.selectName]} options={select.data.selectOptions} isLoading={false} onChangeHandler={filterInputHandler} name={select.data.selectName}/>
+          </div>); })}
+      {isMobile && (<>
+          <div className={'filterButton'}>
+            <button onClick={function (e) {
+                e.stopPropagation();
+                e.preventDefault();
+                openOverLay();
+                setSidebarOpen(true);
+            }}>
+              Filters
+              {selectedFiltersCount ? (<span className={'counter'}>{selectedFiltersCount}</span>) : null}
+            </button>
+          </div>
+          <sidebarFilters_1.default isOpen={isSideBarOpen} handleClose={function () {
+                setMobileFilterInput(filterInput);
+                closeFiltersMobile();
+            }}>
+            <mobileFilters_1.default>
+              {selectData.map(function (select) { return (<MobileSelect_1.default key={select.id} defaultOptionValue={mobileFilterInput[select.data
+                    .selectName]} options={select.data.selectOptions} name={select.data.selectName} onChangeHandler={handleMobileFilters}/>); })}
+            </mobileFilters_1.default>
+            <applyResetBtns_1.default onReset={function () {
+                handleResetFilter();
+                closeFiltersMobile();
+            }} onApply={function () {
+                handleMobileFilterInput(mobileFilterInput);
+                closeFiltersMobile();
+            }}/>
+          </sidebarFilters_1.default>
+        </>)}
+    </StyledFilters>);
 };
 // Export
 exports.default = Filters;

package/dist/components/filters/mobileFilters/{index.js → index.jsx}

@@ -14,7 +14,7 @@ var StyledMobileFilters = styled_components_1.default.div(templateObject_1 || (t
 // Component
 var MobileFilters = function (_a) {
     var children = _a.children;
-    return react_1.default.createElement(StyledMobileFilters, null, children);
+    return <StyledMobileFilters>{children}</StyledMobileFilters>;
 };
 // Export
 exports.default = MobileFilters;

package/dist/components/filters/setsFiltersForm/{index.js → index.jsx}

@@ -72,10 +72,17 @@ var SetsFiltersForm = function (_a) {
     var handleChangeBlockchainTimeResult = function (value) {
         setSelectedBlockchainTimeResult(value);
     };
-    return (react_1.default.createElement(StyledSetsFiltersForm, null,
-        react_1.default.createElement(DropDown_1.default, { caption: 'Type', fallBackOnClose: handleChangeSearchResult }, selectTypeSearchResult.map(function (select) { return (react_1.default.createElement(RadioInput_1.default, { key: select.id, radioLabel: select.label, radioValue: select.id, handleChange: handleChangeSearchResult, radioChecked: selectedSearchResult === select.id })); })),
-        react_1.default.createElement(DropDown_1.default, { caption: 'Category', fallBackOnClose: handleChangeBlockchainCategoryResult }, selectBlockchainCategoryResult.map(function (select) { return (react_1.default.createElement(RadioInput_1.default, { key: select.id, radioLabel: select.label, radioValue: select.id, handleChange: handleChangeBlockchainCategoryResult, radioChecked: selectedSearchResult === select.id })); })),
-        react_1.default.createElement(DropDown_1.default, { caption: 'Time', fallBackOnClose: handleChangeBlockchainTimeResult }, selectBlockchainTimeResult.map(function (select) { return (react_1.default.createElement(RadioInput_1.default, { key: select.id, radioLabel: select.label, radioValue: select.id, handleChange: handleChangeBlockchainTimeResult, radioChecked: selectedSearchResult === select.id })); }))));
+    return (<StyledSetsFiltersForm>
+      <DropDown_1.default caption={'Type'} fallBackOnClose={handleChangeSearchResult}>
+        {selectTypeSearchResult.map(function (select) { return (<RadioInput_1.default key={select.id} radioLabel={select.label} radioValue={select.id} handleChange={handleChangeSearchResult} radioChecked={selectedSearchResult === select.id}/>); })}
+      </DropDown_1.default>
+      <DropDown_1.default caption={'Category'} fallBackOnClose={handleChangeBlockchainCategoryResult}>
+        {selectBlockchainCategoryResult.map(function (select) { return (<RadioInput_1.default key={select.id} radioLabel={select.label} radioValue={select.id} handleChange={handleChangeBlockchainCategoryResult} radioChecked={selectedSearchResult === select.id}/>); })}
+      </DropDown_1.default>
+      <DropDown_1.default caption={'Time'} fallBackOnClose={handleChangeBlockchainTimeResult}>
+        {selectBlockchainTimeResult.map(function (select) { return (<RadioInput_1.default key={select.id} radioLabel={select.label} radioValue={select.id} handleChange={handleChangeBlockchainTimeResult} radioChecked={selectedSearchResult === select.id}/>); })}
+      </DropDown_1.default>
+    </StyledSetsFiltersForm>);
 };
 // Export
 exports.default = SetsFiltersForm;

package/dist/components/forms/form/{index.js → index.jsx}

@@ -47,7 +47,7 @@ var react_hook_form_1 = require("react-hook-form");
 var styled_components_1 = __importDefault(require("styled-components"));
 var colors_1 = require("@ludo.ninja/ui/build/styles/colors");
 var Text_1 = require("@ludo.ninja/ui/build/system/Text");
-var styles_1 = require("@ludo.ninja/components/src/styles");
+var styles_1 = require("@ludo.ninja/components/dist/styles");
 var MainButton_1 = __importDefault(require("@/system/Buttons/MainButton"));
 var Forms_1 = require("@/system/Forms");
 var DatePicker_1 = __importDefault(require("@/system/Forms/DatePicker"));
@@ -90,47 +90,57 @@ var Form = function (_a) {
         var registerProp = register(inputProps.name, inputProps.validations);
         switch (inputProps.type) {
             case 'textArea':
-                return (react_1.default.createElement(Forms_1.BasicTextArea, { register: registerProp, error: errorProp, data: dataProp, isNeedBiggerArea: false }));
+                return (<Forms_1.BasicTextArea register={registerProp} error={errorProp} data={dataProp} isNeedBiggerArea={false}/>);
             case 'checkbox':
-                return (react_1.default.createElement(react_1.default.Fragment, null, (_a = inputProps.options) === null || _a === void 0 ? void 0 : _a.map(function (option) {
-                    var isCheckboxWithInput = option.value === 'other';
-                    var registerTextInput = isCheckboxWithInput
-                        ? register("".concat(inputProps.name, "-other-checkbox"))
-                        : undefined;
-                    return (react_1.default.createElement(Forms_1.CheckboxInput, { key: option.value, register: registerProp, error: errorProp, data: dataProp, label: option.desc, value: option.value, withInput: isCheckboxWithInput, innerTextInputRef: registerTextInput }));
-                })));
+                return (<>
+            {(_a = inputProps.options) === null || _a === void 0 ? void 0 : _a.map(function (option) {
+                        var isCheckboxWithInput = option.value === 'other';
+                        var registerTextInput = isCheckboxWithInput
+                            ? register("".concat(inputProps.name, "-other-checkbox"))
+                            : undefined;
+                        return (<Forms_1.CheckboxInput key={option.value} register={registerProp} error={errorProp} data={dataProp} label={option.desc} value={option.value} withInput={isCheckboxWithInput} innerTextInputRef={registerTextInput}/>);
+                    })}
+          </>);
             case 'radio':
-                return (react_1.default.createElement(react_1.default.Fragment, null, (_b = inputProps.options) === null || _b === void 0 ? void 0 : _b.map(function (option) {
-                    var isRadioWithInput = option.value === 'other';
-                    var registerTextInput = isRadioWithInput
-                        ? register("".concat(inputProps.name, "-other-radio"))
-                        : undefined;
-                    return (react_1.default.createElement(react_hook_form_1.Controller, { key: option.desc, name: inputProps.name, control: control, render: function (_a) {
-                            var field = _a.field;
-                            return (react_1.default.createElement(RadioInput, { key: option.value, radioLabel: option.desc, radioValue: option.value, handleChange: field.onChange, radioChecked: field.value === option.value, withInput: isRadioWithInput, innerTextInputRef: registerTextInput, setFocus: setFocus }));
-                        } }));
-                })));
+                return (<>
+            {(_b = inputProps.options) === null || _b === void 0 ? void 0 : _b.map(function (option) {
+                        var isRadioWithInput = option.value === 'other';
+                        var registerTextInput = isRadioWithInput
+                            ? register("".concat(inputProps.name, "-other-radio"))
+                            : undefined;
+                        return (<react_hook_form_1.Controller key={option.desc} name={inputProps.name} control={control} render={function (_a) {
+                                var field = _a.field;
+                                return (<RadioInput key={option.value} radioLabel={option.desc} radioValue={option.value} handleChange={field.onChange} radioChecked={field.value === option.value} withInput={isRadioWithInput} innerTextInputRef={registerTextInput} setFocus={setFocus}/>);
+                            }}/>);
+                    })}
+          </>);
             case 'date':
-                return (react_1.default.createElement(DatePicker_1.default, { register: registerProp, error: errorProp, control: control, name: inputProps.name }));
+                return (<DatePicker_1.default register={registerProp} error={errorProp} control={control} name={inputProps.name}/>);
             default:
-                return (react_1.default.createElement(Forms_1.Input, { register: registerProp, error: errorProp, data: dataProp }));
+                return (<Forms_1.Input register={registerProp} error={errorProp} data={dataProp}/>);
         }
     };
-    return (react_1.default.createElement(Wrapper, null,
-        react_1.default.createElement(FormWrapper, { onSubmit: handleSubmit(onSubmit) },
-            react_1.default.createElement(Title, null, formTitle),
-            react_1.default.createElement(Description, null, formDescription),
-            inputs.map(function (input) {
-                var _a;
-                return (react_1.default.createElement(StyledInputGroup, { key: input.name },
-                    react_1.default.createElement(InputTitle, null,
-                        ((_a = input.validations) === null || _a === void 0 ? void 0 : _a.required) ? '*' : '',
-                        input.label),
-                    getInput(input)));
-            }),
-            react_1.default.createElement(_system_1.Flex, { justifyContent: "space-between", style: { marginTop: 44 } },
-                react_1.default.createElement(MainButton_1.default, { onClick: function (e) { var _a; return (_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.blur(); }, disabled: !isDirty || !isValid, variant: "primaryM", text: submitLoading ? react_1.default.createElement(react_bootstrap_1.Spinner, { variant: "light" }) : 'Submit', type: 'submit' }),
-                react_1.default.createElement(MainButton_1.default, { onClick: function (e) { var _a; return (_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.blur(); }, disabled: !isDirty, variant: "secondary", text: submitLoading ? react_1.default.createElement(react_bootstrap_1.Spinner, { variant: "light" }) : 'Clear Form', type: 'reset' })))));
+    return (<Wrapper>
+      <FormWrapper onSubmit={handleSubmit(onSubmit)}>
+        <Title>{formTitle}</Title>
+        <Description>{formDescription}</Description>
+        {inputs.map(function (input) {
+            var _a;
+            return (<StyledInputGroup key={input.name}>
+            <InputTitle>
+              {((_a = input.validations) === null || _a === void 0 ? void 0 : _a.required) ? '*' : ''}
+              {input.label}
+            </InputTitle>
+            {getInput(input)}
+          </StyledInputGroup>);
+        })}
+
+        <_system_1.Flex justifyContent="space-between" style={{ marginTop: 44 }}>
+          <MainButton_1.default onClick={function (e) { var _a; return (_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.blur(); }} disabled={!isDirty || !isValid} variant="primaryM" text={submitLoading ? <react_bootstrap_1.Spinner variant="light"/> : 'Submit'} type={'submit'}/>
+          <MainButton_1.default onClick={function (e) { var _a; return (_a = e === null || e === void 0 ? void 0 : e.currentTarget) === null || _a === void 0 ? void 0 : _a.blur(); }} disabled={!isDirty} variant="secondary" text={submitLoading ? <react_bootstrap_1.Spinner variant="light"/> : 'Clear Form'} type={'reset'}/>
+        </_system_1.Flex>
+      </FormWrapper>
+    </Wrapper>);
 };
 exports.default = Form;
 var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7;

package/dist/components/forms/formsNavigation/{index.js → index.jsx}

@@ -34,7 +34,7 @@ var react_1 = __importStar(require("react"));
 var link_1 = __importDefault(require("next/link"));
 var router_1 = require("next/router");
 var styled_components_1 = __importDefault(require("styled-components"));
-var styles_1 = require("@ludo.ninja/components/src/styles");
+var styles_1 = require("@ludo.ninja/components/dist/styles");
 var types_1 = require("@/components/forms/types");
 var _system_1 = require("@system");
 var back_svg_1 = __importDefault(require("@/public/settings_page/back.svg"));
@@ -62,12 +62,20 @@ var FormsNavigation = function () {
     var _b = (0, react_1.useState)(false), isOpen = _b[0], setIsOpen = _b[1];
     var router = (0, router_1.useRouter)();
     var activeTab = (_a = router === null || router === void 0 ? void 0 : router.query) === null || _a === void 0 ? void 0 : _a.formId;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(StyledFlex, { isOpen: isOpen }, isOpen ? (react_1.default.createElement(back_svg_1.default, { onClick: function () { return setIsOpen(false); } })) : (react_1.default.createElement(burger_menu_svg_1.default, { onClick: function () { return setIsOpen(true); } }))),
-        react_1.default.createElement(Wrapper, { className: "mobile_menu ".concat(isOpen ? 'show' : 'hide') },
-            react_1.default.createElement(List, null, NAVIGATION_TABS.map(function (tab) { return (react_1.default.createElement("li", { onClick: function () { return setIsOpen(false); }, key: tab.slug, className: "".concat(activeTab === tab.slug ? 'activeTab' : '', " ") },
-                react_1.default.createElement(link_1.default, { href: "/forms/".concat(tab.slug), className: 'link' },
-                    react_1.default.createElement("span", null, tab.label)))); })))));
+    return (<>
+      <StyledFlex isOpen={isOpen}>
+        {isOpen ? (<back_svg_1.default onClick={function () { return setIsOpen(false); }}/>) : (<burger_menu_svg_1.default onClick={function () { return setIsOpen(true); }}/>)}
+      </StyledFlex>
+      <Wrapper className={"mobile_menu ".concat(isOpen ? 'show' : 'hide')}>
+        <List>
+          {NAVIGATION_TABS.map(function (tab) { return (<li onClick={function () { return setIsOpen(false); }} key={tab.slug} className={"".concat(activeTab === tab.slug ? 'activeTab' : '', " ")}>
+              <link_1.default href={"/forms/".concat(tab.slug)} className={'link'}>
+                <span>{tab.label}</span>
+              </link_1.default>
+            </li>); })}
+        </List>
+      </Wrapper>
+    </>);
 };
 exports.default = FormsNavigation;
 var templateObject_1, templateObject_2, templateObject_3;

package/dist/components/forms/formsTemplate/{index.js → index.jsx}

@@ -95,9 +95,9 @@ var react_google_recaptcha_v3_1 = require("react-google-recaptcha-v3");
 var styled_components_1 = __importDefault(require("styled-components"));
 var api_1 = require("@ludo.ninja/api");
 var type_1 = require("@ludo.ninja/ui/build/system/Alert/type");
-var modules_1 = require("@ludo.ninja/components/src/modules");
-var store_1 = require("@ludo.ninja/components/src/store");
-var styles_1 = require("@ludo.ninja/components/src/styles");
+var modules_1 = require("@ludo.ninja/components/dist/modules");
+var store_1 = require("@ludo.ninja/components/dist/store");
+var styles_1 = require("@ludo.ninja/components/dist/styles");
 var form_1 = __importDefault(require("@/components/forms/form"));
 var formsNavigation_1 = __importDefault(require("@/components/forms/formsNavigation"));
 var types_1 = require("@/components/forms/types");
@@ -167,9 +167,10 @@ var FormsTemplate = function () {
     if (!form) {
         return null;
     }
-    return (react_1.default.createElement(Wrapper, null,
-        react_1.default.createElement(formsNavigation_1.default, null),
-        react_1.default.createElement(form_1.default, { formDescription: form.formDescription, formTitle: form.formTitle, inputs: form.inputs, onSubmit: handleSubmit, submitLoading: loading, initialValues: initialValues })));
+    return (<Wrapper>
+      <formsNavigation_1.default />
+      <form_1.default formDescription={form.formDescription} formTitle={form.formTitle} inputs={form.inputs} onSubmit={handleSubmit} submitLoading={loading} initialValues={initialValues}/>
+    </Wrapper>);
 };
 var getServerSideProps = function (ctx) { return __awaiter(void 0, void 0, void 0, function () {
     var query, formId, form;

package/dist/components/gallery/add/addAssetToGallery/{index.js → index.jsx}

@@ -65,7 +65,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importStar(require("react"));
 var chooseGalleryItems_1 = __importDefault(require("@/modules/gallery/ui/chooseGalleryItems"));
 var createGalleryForm_1 = __importDefault(require("@/modules/gallery/ui/createGalleryForm"));
-var ui_1 = require("@ludo.ninja/components/src/store/ui");
+var ui_1 = require("@ludo.ninja/components/dist/store/ui");
 var useAddAssetsToGallery_1 = require("@/api/server-galleries/mutations/useAddAssetsToGallery");
 var useCreateGallery_1 = require("@/api/server-galleries/mutations/useCreateGallery");
 // Component
@@ -86,9 +86,11 @@ var AddAssetToGallery = function (_a) {
             }
         });
     }); };
-    return (react_1.default.createElement("div", null, isNeedAddGallery ? (react_1.default.createElement(createGalleryForm_1.default, { setAddGallery: setAddGallery, title: 'Create Gallery', inputPlaceHolderText: 'Gallery Name', 
+    return (<div>
+      {isNeedAddGallery ? (<createGalleryForm_1.default setAddGallery={setAddGallery} title={'Create Gallery'} inputPlaceHolderText={'Gallery Name'} 
         // ids={ids}
-        createMethod: createGallery, error: errorCreateGallery })) : (react_1.default.createElement(chooseGalleryItems_1.default, { setAddGallery: setAddGallery, title: 'Add to Gallery', titleBtn: '+ New Gallery', ids: ids, addMethod: addMethod, isAdded: isAdded, error: error, isGetMyGalleries: true }))));
+        createMethod={createGallery} error={errorCreateGallery}/>) : (<chooseGalleryItems_1.default setAddGallery={setAddGallery} title={'Add to Gallery'} titleBtn={'+ New Gallery'} ids={ids} addMethod={addMethod} isAdded={isAdded} error={error} isGetMyGalleries/>)}
+    </div>);
 };
 // Export
 exports.default = AddAssetToGallery;

package/dist/components/gallery/add/addCreationToGallery/{index.js → index.jsx}

@@ -72,7 +72,7 @@ var useToGalleryAsset_1 = require("@/hooks/useToGalleryAsset");
 var chooseGalleryItems_1 = __importDefault(require("@/modules/gallery/ui/chooseGalleryItems"));
 var createGalleryForm_1 = __importDefault(require("@/modules/gallery/ui/createGalleryForm"));
 var itemsPreview_1 = __importDefault(require("@/modules/gallery/ui/itemsPreview"));
-var ui_1 = require("@ludo.ninja/components/src/store/ui");
+var ui_1 = require("@ludo.ninja/components/dist/store/ui");
 var useAddCreationsToGallery_1 = require("@/api/server-galleries/mutations/useAddCreationsToGallery");
 var useCreateGallery_1 = require("@/api/server-galleries/mutations/useCreateGallery");
 // Styles
@@ -101,13 +101,14 @@ var AddCreationToGallery = function () {
         });
     }); };
     var ids = creationsToGallery.map(function (creations) { return creations.getCreationId(); });
-    return (react_1.default.createElement(StyledAddGallery, null,
-        react_1.default.createElement(itemsPreview_1.default, { creations: creationsToGallery, title: 'Add to Gallery', deleteMethod: function (itemId) {
-                removeCreationFromGalleryWithCallback(itemId, closeModalSidebarPortal);
-            } }),
-        isNeedAddGallery ? (react_1.default.createElement(createGalleryForm_1.default, { setAddGallery: setAddGallery, 
-            // ids={ids as string[]}
-            title: 'Create Gallery', createMethod: createGallery, inputPlaceHolderText: 'Gallery Name', error: errorCreateGallery })) : (react_1.default.createElement(chooseGalleryItems_1.default, { setAddGallery: setAddGallery, title: 'Choose Gallery', titleBtn: '+ New Gallery', ids: ids, addMethod: addMethod, isAdded: isAdded, error: error, isGetMyGalleries: true }))));
+    return (<StyledAddGallery>
+      <itemsPreview_1.default creations={creationsToGallery} title={'Add to Gallery'} deleteMethod={function (itemId) {
+            removeCreationFromGalleryWithCallback(itemId, closeModalSidebarPortal);
+        }}/>
+      {isNeedAddGallery ? (<createGalleryForm_1.default setAddGallery={setAddGallery} 
+        // ids={ids as string[]}
+        title={'Create Gallery'} createMethod={createGallery} inputPlaceHolderText={'Gallery Name'} error={errorCreateGallery}/>) : (<chooseGalleryItems_1.default setAddGallery={setAddGallery} title={'Choose Gallery'} titleBtn={'+ New Gallery'} ids={ids} addMethod={addMethod} isAdded={isAdded} error={error} isGetMyGalleries/>)}
+    </StyledAddGallery>);
 };
 // Export
 exports.default = AddCreationToGallery;

package/dist/components/gradientLabel/{index.js → index.jsx}

@@ -17,7 +17,7 @@ var vars_1 = require("@/fonts/vars");
 var StyledGradientLabel = (0, styled_components_1.default)(_system_1.H3)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-family: ", ";\n  user-select: none;\n  border-radius: 24px;\n  ", ";\n  ", ";\n  display: inline-block;\n  padding: 5px 16px;\n  background: linear-gradient(\n    89deg,\n    rgba(190, 249, 209, 0.6) 6.88%,\n    rgba(98, 218, 255, 0.6) 53.34%,\n    rgba(171, 228, 251, 0.6) 93.43%\n  );\n  color: #5748bc;\n"], ["\n  font-family: ", ";\n  user-select: none;\n  border-radius: 24px;\n  ", ";\n  ", ";\n  display: inline-block;\n  padding: 5px 16px;\n  background: linear-gradient(\n    89deg,\n    rgba(190, 249, 209, 0.6) 6.88%,\n    rgba(98, 218, 255, 0.6) 53.34%,\n    rgba(171, 228, 251, 0.6) 93.43%\n  );\n  color: #5748bc;\n"])), vars_1.poppinsFontVarCss.css, boxShadow_1.default, boxTransform_1.default);
 // Component
 var GradientLabel = function () {
-    return react_1.default.createElement(StyledGradientLabel, null, "5 invites");
+    return <StyledGradientLabel>5 invites</StyledGradientLabel>;
 };
 // Export
 exports.default = GradientLabel;

package/dist/components/headers/components/headerExperienceLabel/{index.js → index.jsx}

@@ -9,9 +9,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var styled_components_1 = __importDefault(require("styled-components"));
 var _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
-var modules_1 = require("@ludo.ninja/components/src/modules");
-var styles_1 = require("@ludo.ninja/components/src/styles");
-var system_1 = __importDefault(require("@ludo.ninja/components/src/system"));
+var modules_1 = require("@ludo.ninja/components/dist/modules");
+var styles_1 = require("@ludo.ninja/components/dist/styles");
+var system_1 = __importDefault(require("@ludo.ninja/components/dist/system"));
 // Styles
 var StyledHeaderExperienceLabel = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-right: 20px;\n  ", " {\n    margin-right: ", ";\n  }\n"], ["\n  margin-right: 20px;\n  ", " {\n    margin-right: ", ";\n  }\n"])), styles_1.mediaQuery.minWidthFourK, (0, _4k_1.adaptiveValueCalc)(20));
 // Component
@@ -24,8 +24,9 @@ var HeaderExperienceLabel = function (_a) {
     }); }), userExp = _b.userExp, isLoadingExp = _b.isLoadingExp, errorExp = _b.errorExp;
     if (!userId)
         return null;
-    return (React.createElement(StyledHeaderExperienceLabel, null,
-        React.createElement(system_1.default, { value: userExp.xps, link: "/rewards/".concat(userId), loading: isLoadingExp || !!errorExp })));
+    return (<StyledHeaderExperienceLabel>
+      <system_1.default value={userExp.xps} link={"/rewards/".concat(userId)} loading={isLoadingExp || !!errorExp}/>
+    </StyledHeaderExperienceLabel>);
 };
 // Export
 exports.default = HeaderExperienceLabel;

package/dist/components/headers/components/headerUserPic/{index.js → index.jsx}

@@ -10,8 +10,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = __importDefault(require("react"));
 var styled_components_1 = __importDefault(require("styled-components"));
 var _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
-var styles_1 = require("@ludo.ninja/components/src/styles");
-var system_1 = __importDefault(require("@ludo.ninja/components/src/system"));
+var styles_1 = require("@ludo.ninja/components/dist/styles");
+var system_1 = __importDefault(require("@ludo.ninja/components/dist/system"));
 // Styles
 var StyledHeaderUserPick = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-right: 24px;\n\n  ", " {\n    margin-right: 8px;\n  }\n  ", " {\n    margin-right: ", ";\n  }\n"], ["\n  margin-right: 24px;\n\n  ", " {\n    margin-right: 8px;\n  }\n  ", " {\n    margin-right: ", ";\n  }\n"])), styles_1.mediaQuery.mobile, styles_1.mediaQuery.minWidthFourK, (0, _4k_1.adaptiveValueCalc)(24));
 // Component
@@ -19,8 +19,9 @@ var HeaderUserPick = function (_a) {
     var userId = _a.userId;
     if (!userId)
         return null;
-    return (react_1.default.createElement(StyledHeaderUserPick, null,
-        react_1.default.createElement(system_1.default, { width: 32, height: 32, userId: userId, isNeedBoxTransform: true })));
+    return (<StyledHeaderUserPick>
+      <system_1.default width={32} height={32} userId={userId} isNeedBoxTransform={true}/>
+    </StyledHeaderUserPick>);
 };
 // Export
 exports.default = HeaderUserPick;

package/dist/components/headers/header/{index.js → index.jsx}

@@ -7,7 +7,7 @@ var react_1 = __importDefault(require("react"));
 var link_1 = __importDefault(require("next/link"));
 var header_1 = require("@ludo.ninja/ui/build/components/header");
 var store_1 = require("@/modules/user/store");
-var ui_1 = require("@ludo.ninja/components/src/store/ui");
+var ui_1 = require("@ludo.ninja/components/dist/store/ui");
 var headerExperienceLabel_1 = __importDefault(require("@/components/headers/components/headerExperienceLabel"));
 var headerUserPic_1 = __importDefault(require("@/components/headers/components/headerUserPic"));
 var auth_1 = require("@/utils/auth");
@@ -16,17 +16,17 @@ var Header = function () {
     var isSignedIn = (0, store_1.useUserStore)(function (state) { return state.isSignedIn; });
     var getUser = (0, store_1.useUserStore)(function (state) { return state.user; });
     var openSidebar = (0, ui_1.useUiStore)(function (state) { return state.openSidebar; });
-    return (react_1.default.createElement(header_1.Header, { isAuthorized: isSignedIn, handle: {
+    return (<header_1.Header isAuthorized={isSignedIn} handle={{
             login: auth_1.redirectToLoginWindow,
             openSidebar: openSidebar,
-        }, slots: {
-            headerExpLabel: (react_1.default.createElement(headerExperienceLabel_1.default, { userId: (getUser === null || getUser === void 0 ? void 0 : getUser.userId) || '' })),
-            headerUserPick: react_1.default.createElement(headerUserPic_1.default, { userId: (getUser === null || getUser === void 0 ? void 0 : getUser.userId) || '' }),
+        }} slots={{
+            headerExpLabel: (<headerExperienceLabel_1.default userId={(getUser === null || getUser === void 0 ? void 0 : getUser.userId) || ''}/>),
+            headerUserPick: <headerUserPic_1.default userId={(getUser === null || getUser === void 0 ? void 0 : getUser.userId) || ''}/>,
             logoLinkComponent: function (_a) {
                 var children = _a.children;
-                return react_1.default.createElement(link_1.default, { href: '/' }, children);
+                return <link_1.default href={'/'}>{children}</link_1.default>;
             },
-        } }));
+        }}/>);
 };
 // Export
 exports.default = Header;

package/dist/components/headers/headerSearch/{index.js → index.jsx}

@@ -7,7 +7,7 @@ var react_1 = __importDefault(require("react"));
 var link_1 = __importDefault(require("next/link"));
 var header_1 = require("@ludo.ninja/ui/build/components/header");
 var store_1 = require("@/modules/user/store");
-var ui_1 = require("@ludo.ninja/components/src/store/ui");
+var ui_1 = require("@ludo.ninja/components/dist/store/ui");
 var headerExperienceLabel_1 = __importDefault(require("@/components/headers/components/headerExperienceLabel"));
 var headerUserPic_1 = __importDefault(require("@/components/headers/components/headerUserPic"));
 var searchSimpleInput_1 = __importDefault(require("@/components/search/searchSimpleInput"));
@@ -18,22 +18,22 @@ var HeaderSearch = function () {
     var openSidebar = (0, ui_1.useUiStore)(function (state) { return state.openSidebar; });
     var isSignedIn = (0, store_1.useUserStore)(function (state) { return state.isSignedIn; });
     var getUser = (0, store_1.useUserStore)(function (state) { return state.user; });
-    return (react_1.default.createElement(header_1.Header, { isAuthorized: isSignedIn, handle: {
+    return (<header_1.Header isAuthorized={isSignedIn} handle={{
             login: auth_1.redirectToLoginWindow,
             openSidebar: openSidebar,
-        }, slots: {
-            headerExpLabel: (react_1.default.createElement(headerExperienceLabel_1.default, { userId: (getUser === null || getUser === void 0 ? void 0 : getUser.userId) || '' })),
-            headerUserPick: react_1.default.createElement(headerUserPic_1.default, { userId: (getUser === null || getUser === void 0 ? void 0 : getUser.userId) || '' }),
+        }} slots={{
+            headerExpLabel: (<headerExperienceLabel_1.default userId={(getUser === null || getUser === void 0 ? void 0 : getUser.userId) || ''}/>),
+            headerUserPick: <headerUserPic_1.default userId={(getUser === null || getUser === void 0 ? void 0 : getUser.userId) || ''}/>,
             logoLinkComponent: function (_a) {
                 var children = _a.children;
-                return react_1.default.createElement(link_1.default, { href: '/' }, children);
+                return <link_1.default href={'/'}>{children}</link_1.default>;
             },
             searchInput: function (_a) {
                 var setInputFocused = _a.setInputFocused;
                 // Todo seacrh pages, hide search input from header
-                return (0, env_1.isProd)({ ENV: isProdENV }) ? undefined : (react_1.default.createElement(searchSimpleInput_1.default, { onFocusHandler: setInputFocused }));
+                return (0, env_1.isProd)({ ENV: isProdENV }) ? undefined : (<searchSimpleInput_1.default onFocusHandler={setInputFocused}/>);
             },
-        }, isSearchStyles: true, isActivatedTheme: true }));
+        }} isSearchStyles isActivatedTheme/>);
 };
 // Export
 exports.default = HeaderSearch;

package/dist/components/headers/headerSimple/{index.js → index.jsx}

@@ -21,12 +21,14 @@ var HeaderSimple = function () {
     var windowWidth = (0, screen_1.getWindowDimensions)().windowWidth;
     var renderDesktopLogoOrMobile = function () {
         var isMobile = windowWidth <= 768;
-        return (react_1.default.createElement(image_1.default, { width: isMobile ? 31 : 116, height: isMobile ? 32 : 28, priority: true, src: isMobile ? '/logo/mobile_logo.svg' : '/logo/main_logo.svg', alt: "Ludo - a right place for NFT art" }));
+        return (<image_1.default width={isMobile ? 31 : 116} height={isMobile ? 32 : 28} priority={true} src={isMobile ? '/logo/mobile_logo.svg' : '/logo/main_logo.svg'} alt="Ludo - a right place for NFT art"/>);
     };
     var scrollDirection = (0, utils_1.useScrollDirection)();
-    return (react_1.default.createElement(StyledHeaderSimple, { className: scrollDirection },
-        react_1.default.createElement("div", { className: 'logo' },
-            react_1.default.createElement(link_1.default, { href: '/' }, renderDesktopLogoOrMobile()))));
+    return (<StyledHeaderSimple className={scrollDirection}>
+      <div className={'logo'}>
+        <link_1.default href={'/'}>{renderDesktopLogoOrMobile()}</link_1.default>
+      </div>
+    </StyledHeaderSimple>);
 };
 // Export
 exports.default = HeaderSimple;

package/dist/components/inviteCodesForms/getEarlyAccessForm/{index.js → index.jsx}

@@ -160,22 +160,32 @@ var GetEarlyAccessForm = function () {
             }
         });
     }); };
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(styles_1.FormHeader, null,
-            react_1.default.createElement(link_1.default, { href: process_1.default.env.NEXT_PUBLIC_WELCOME_HOST, className: "caption" },
-                "Welcome to",
-                react_1.default.createElement(image_1.default, { src: "".concat((0, core_1.getStaticDomain)({
-                        ENV: process_1.default.env.NEXT_PUBLIC_STATIC_DOMAIN,
-                    }), "/logo/main/main.svg"), alt: 'main svg', width: 116, height: 28 }))),
-        react_1.default.createElement(styles_1.FormContent, { onSubmit: handleSubmit(onSubmit) },
-            react_1.default.createElement(Forms_1.Input, { register: registerInviteCode, error: errorInviteCode, data: dataInviteCode }),
-            react_1.default.createElement(styles_1.FormSubmitBtn, null,
-                react_1.default.createElement(MainButton_1.default, { onClick: function () { return null; }, type: 'submit', disabled: !isDirty || !isValid || loading, variant: "primaryM", text: 'Join' }))),
-        react_1.default.createElement(styles_1.FormFooter, null,
-            react_1.default.createElement(ui_1.SmallText, null,
-                react_1.default.createElement("a", { style: { padding: '0 5px 0 0' }, href: "https://gleam.io/vlWxW/ludo-x-invite-code", target: "_blank" }, "Start the simple onboarding process"),
-                "to get your personal invite code to Ludo X."),
-            react_1.default.createElement(styles_1.FormLogOutBtn, null,
-                react_1.default.createElement(MainButton_1.default, { onClick: handleLogOut, type: 'button', variant: "outline", text: btnText })))));
+    return (<>
+      <styles_1.FormHeader>
+        <link_1.default href={process_1.default.env.NEXT_PUBLIC_WELCOME_HOST} className="caption">
+          Welcome to
+          <image_1.default src={"".concat((0, core_1.getStaticDomain)({
+            ENV: process_1.default.env.NEXT_PUBLIC_STATIC_DOMAIN,
+        }), "/logo/main/main.svg")} alt={'main svg'} width={116} height={28}/>
+        </link_1.default>
+      </styles_1.FormHeader>
+      <styles_1.FormContent onSubmit={handleSubmit(onSubmit)}>
+        <Forms_1.Input register={registerInviteCode} error={errorInviteCode} data={dataInviteCode}/>
+        <styles_1.FormSubmitBtn>
+          <MainButton_1.default onClick={function () { return null; }} type={'submit'} disabled={!isDirty || !isValid || loading} variant="primaryM" text={'Join'}/>
+        </styles_1.FormSubmitBtn>
+      </styles_1.FormContent>
+      <styles_1.FormFooter>
+        <ui_1.SmallText>
+          <a style={{ padding: '0 5px 0 0' }} href="https://gleam.io/vlWxW/ludo-x-invite-code" target="_blank">
+            Start the simple onboarding process
+          </a>
+          to get your personal invite code to Ludo X.
+        </ui_1.SmallText>
+        <styles_1.FormLogOutBtn>
+          <MainButton_1.default onClick={handleLogOut} type={'button'} variant="outline" text={btnText}/>
+        </styles_1.FormLogOutBtn>
+      </styles_1.FormFooter>
+    </>);
 };
 exports.default = GetEarlyAccessForm;