@ludo.ninja/components 1.9.3 → 1.9.4

package/dist/components/profile/profileSkeleton/{index.js → index.jsx}

@@ -17,19 +17,25 @@ var StyledProfileSkeleton = styled_components_1.default.div(templateObject_1 ||
 var ProfileSkeletonWrapper = function (_a) {
     var profilesCount = _a.profilesCount;
     var arr = Array.from(Array(profilesCount).keys());
-    return (react_1.default.createElement(react_1.default.Fragment, null, arr.map(function () { return (react_1.default.createElement(exports.ProfileSkeleton, { key: Math.random() })); })));
+    return (<>
+      {arr.map(function () { return (<exports.ProfileSkeleton key={Math.random()}/>); })}
+    </>);
 };
 exports.ProfileSkeletonWrapper = ProfileSkeletonWrapper;
 // Component
 var ProfileSkeleton = function () {
-    return (react_1.default.createElement(StyledProfileSkeleton, null,
-        react_1.default.createElement("div", { className: "cardLink" },
-            react_1.default.createElement(react_loading_skeleton_1.default, { className: 'cardLinkIcon' }),
-            react_1.default.createElement("div", { className: 'cardLinkContent' },
-                react_1.default.createElement("div", { className: 'content' },
-                    react_1.default.createElement(react_loading_skeleton_1.default, { className: 'caption', width: '100%', height: '18px' }),
-                    react_1.default.createElement(react_loading_skeleton_1.default, { className: 'text', width: '80px', height: '16px' })),
-                react_1.default.createElement(react_loading_skeleton_1.default, { className: 'text', width: '60px', height: '25px', style: { borderRadius: '25px', marginTop: '7px' } })))));
+    return (<StyledProfileSkeleton>
+      <div className={"cardLink"}>
+        <react_loading_skeleton_1.default className={'cardLinkIcon'}/>
+        <div className={'cardLinkContent'}>
+          <div className={'content'}>
+            <react_loading_skeleton_1.default className={'caption'} width={'100%'} height={'18px'}/>
+            <react_loading_skeleton_1.default className={'text'} width={'80px'} height={'16px'}/>
+          </div>
+          <react_loading_skeleton_1.default className={'text'} width={'60px'} height={'25px'} style={{ borderRadius: '25px', marginTop: '7px' }}/>
+        </div>
+      </div>
+    </StyledProfileSkeleton>);
 };
 exports.ProfileSkeleton = ProfileSkeleton;
 var templateObject_1;

package/dist/components/profile/profileUserCards/{index.js → index.jsx}

@@ -13,7 +13,7 @@ var styled_components_1 = __importDefault(require("styled-components"));
 var StyledProfileUserCards = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: 24px 0;\n  display: grid;\n  grid-template-columns: 1fr 1fr 1fr 1fr;\n  gap: 24px;\n\n  @media (max-width: 1199px) {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  @media (max-width: 600px) {\n    gap: 12px;\n    grid-template-columns: 1fr;\n  }\n"], ["\n  margin: 24px 0;\n  display: grid;\n  grid-template-columns: 1fr 1fr 1fr 1fr;\n  gap: 24px;\n\n  @media (max-width: 1199px) {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  @media (max-width: 600px) {\n    gap: 12px;\n    grid-template-columns: 1fr;\n  }\n"])));
 var ProfileUserCards = function (_a) {
     var children = _a.children;
-    return react_1.default.createElement(StyledProfileUserCards, null, children);
+    return <StyledProfileUserCards>{children}</StyledProfileUserCards>;
 };
 exports.ProfileUserCards = ProfileUserCards;
 var templateObject_1;

package/dist/components/profile/profileUserCards/profileUserCard/{index.js → index.jsx}

@@ -131,27 +131,32 @@ var ProfileUserCard = function (_a) {
             }
         });
     }); };
-    return (react_1.default.createElement(StyledProfileUserCard, null,
-        react_1.default.createElement(link_1.default, { href: "/profile/".concat(userId, "/nfts"), className: "cardLink" },
-            react_1.default.createElement(ImageInterceptor_1.ImageInterceptor, { borderRadiusSkeleton: '50%' },
-                react_1.default.createElement(image_1.default, { src: userPic, className: 'cardLinkIcon', width: windowDimensions && windowDimensions.windowWidth < 1200
-                        ? 42
-                        : (0, check4k_1.getAdaptiveValueWithCheck4k)({
-                            windowDimensions: windowDimensions,
-                            currentSize: 72,
-                        }), height: windowDimensions && windowDimensions.windowWidth < 1200
-                        ? 42
-                        : (0, check4k_1.getAdaptiveValueWithCheck4k)({
-                            windowDimensions: windowDimensions,
-                            currentSize: 72,
-                        }), alt: 'avatar' })),
-            react_1.default.createElement("div", { className: 'cardLinkContent' },
-                react_1.default.createElement("div", { className: 'content' },
-                    react_1.default.createElement("h4", { className: 'caption' }, userName),
-                    Boolean(followings) && (react_1.default.createElement("p", { className: 'text' },
-                        followings,
-                        " Followers"))),
-                isNeedRenderBtn && (react_1.default.createElement("div", { className: 'button' }, isFollowed ? (react_1.default.createElement(SecondaryButton_1.default, { variant: 'disabled', text: 'Unfollow', onClick: handleUnFollow })) : (react_1.default.createElement(SecondaryButton_1.default, { variant: 'regular', text: '+ Follow', onClick: handleFollow }))))))));
+    return (<StyledProfileUserCard>
+      <link_1.default href={"/profile/".concat(userId, "/nfts")} className={"cardLink"}>
+        <ImageInterceptor_1.ImageInterceptor borderRadiusSkeleton={'50%'}>
+          <image_1.default src={userPic} className={'cardLinkIcon'} width={windowDimensions && windowDimensions.windowWidth < 1200
+            ? 42
+            : (0, check4k_1.getAdaptiveValueWithCheck4k)({
+                windowDimensions: windowDimensions,
+                currentSize: 72,
+            })} height={windowDimensions && windowDimensions.windowWidth < 1200
+            ? 42
+            : (0, check4k_1.getAdaptiveValueWithCheck4k)({
+                windowDimensions: windowDimensions,
+                currentSize: 72,
+            })} alt={'avatar'}/>
+        </ImageInterceptor_1.ImageInterceptor>
+        <div className={'cardLinkContent'}>
+          <div className={'content'}>
+            <h4 className={'caption'}>{userName}</h4>
+            {Boolean(followings) && (<p className={'text'}>{followings} Followers</p>)}
+          </div>
+          {isNeedRenderBtn && (<div className={'button'}>
+              {isFollowed ? (<SecondaryButton_1.default variant={'disabled'} text={'Unfollow'} onClick={handleUnFollow}/>) : (<SecondaryButton_1.default variant={'regular'} text={'+ Follow'} onClick={handleFollow}/>)}
+            </div>)}
+        </div>
+      </link_1.default>
+    </StyledProfileUserCard>);
 };
 exports.ProfileUserCard = ProfileUserCard;
 var templateObject_1;

package/dist/components/profile/rank/{index.js → index.jsx}

@@ -21,13 +21,21 @@ var RangeValue = styled_components_1.default.div(templateObject_2 || (templateOb
 // Components
 var ProfileRank = function (_a) {
     var rank = _a.rank;
-    return (react_1.default.createElement(_system_1.Box, null,
-        react_1.default.createElement(_system_1.H6, { color: colors_1.TextGrayColor, mb: 4 }, "LUDO RANK"),
-        react_1.default.createElement(_system_1.Flex, null,
-            react_1.default.createElement(_system_1.Flex, { alignItems: "center", borderRadius: 6, width: '100%' },
-                react_1.default.createElement(_system_1.H2, { mr: 16, color: colors_1.BlackColor }, rank ? rank : 'unknown'),
-                react_1.default.createElement(RangeContainer, null,
-                    react_1.default.createElement(RangeValue, { rankValue: rank, style: { width: "".concat(rank, "%") } }))))));
+    return (<_system_1.Box>
+      <_system_1.H6 color={colors_1.TextGrayColor} mb={4}>
+        LUDO RANK
+      </_system_1.H6>
+      <_system_1.Flex>
+        <_system_1.Flex alignItems="center" borderRadius={6} width={'100%'}>
+          <_system_1.H2 mr={16} color={colors_1.BlackColor}>
+            {rank ? rank : 'unknown'}
+          </_system_1.H2>
+          <RangeContainer>
+            <RangeValue rankValue={rank} style={{ width: "".concat(rank, "%") }}/>
+          </RangeContainer>
+        </_system_1.Flex>
+      </_system_1.Flex>
+    </_system_1.Box>);
 };
 exports.ProfileRank = ProfileRank;
 var templateObject_1, templateObject_2;

package/dist/components/profile/stats/{index.js → index.jsx}

@@ -19,10 +19,18 @@ var StyledProfileStats = styled_components_1.default.div(templateObject_1 || (te
 // Components
 var ProfileStats = function (_a) {
     var rank = _a.rank;
-    return (react_1.default.createElement(StyledProfileStats, null,
-        react_1.default.createElement(Palete_1.default, null,
-            react_1.default.createElement("div", { className: "profileStatsBlock" },
-                react_1.default.createElement(rank_1.ProfileRank, { rank: rank })))));
+    return (<StyledProfileStats>
+      <Palete_1.default>
+        <div className="profileStatsBlock">
+          <rank_1.ProfileRank rank={rank}/>
+        </div>
+      </Palete_1.default>
+      {/*{isSignedIn() && profileId !== getUser()?.userId && (*/}
+      {/*  <div className={'profileStatsWorth'}>*/}
+      {/*    <ProfileNetWorth />*/}
+      {/*  </div>*/}
+      {/*)}*/}
+    </StyledProfileStats>);
 };
 exports.ProfileStats = ProfileStats;
 var templateObject_1;

package/dist/components/profile/wallets/{index.js → index.jsx}

@@ -43,31 +43,39 @@ var ProfileWallets = function () {
     var renderUserWallets = function () {
         return userWallets === null || userWallets === void 0 ? void 0 : userWallets.map(function (userWallet) {
             var blockChain = new core_1.BlockChainEntity(userWallet.blockchain);
-            return (react_1.default.createElement("div", { key: userWallet.address, className: "wallet_item" },
-                react_1.default.createElement(image_1.default, { src: blockChain.getBlockChainIconRegular({
-                        domain: (0, env_1.getStaticENVDomain)(),
-                    }), className: 'icon', width: 16, height: 16, alt: blockChain.getBlockChainIconRegular({
-                        domain: (0, env_1.getStaticENVDomain)(),
-                    }) }),
-                (0, utils_1.shortenedText)(userWallet === null || userWallet === void 0 ? void 0 : userWallet.address)));
+            return (<div key={userWallet.address} className={"wallet_item"}>
+          <image_1.default src={blockChain.getBlockChainIconRegular({
+                    domain: (0, env_1.getStaticENVDomain)(),
+                })} className={'icon'} width={16} height={16} alt={blockChain.getBlockChainIconRegular({
+                    domain: (0, env_1.getStaticENVDomain)(),
+                })}/>
+          {(0, utils_1.shortenedText)(userWallet === null || userWallet === void 0 ? void 0 : userWallet.address)}
+        </div>);
         });
     };
     if (!isSignedIn)
         return null;
     var user = new URLSearchParams(getUser).toString();
-    return (react_1.default.createElement(StyledProfileWallets, null,
-        react_1.default.createElement(Palete_1.default, null,
-            react_1.default.createElement(_system_1.Flex, { justifyContent: "space-between", alignItems: "center" },
-                react_1.default.createElement(_system_1.H5, { color: colors_1.BlackColor }, "Wallets"),
-                react_1.default.createElement("div", { className: 'manageBtn', onClick: function () { return openModalSidebarPortal(react_1.default.createElement(myWallets_1.default, null)); } },
-                    react_1.default.createElement(_system_2.SmallText, { color: colors_1.AccentColor }, "Manage"))),
-            react_1.default.createElement("div", { className: 'wallets' }, renderUserWallets()),
-            react_1.default.createElement("div", { className: 'add_wallets', onClick: function () {
-                    window.open("".concat(process_1.default.env.NEXT_PUBLIC_AUTH_HOST, "/add_wallets/?").concat(user, "&fallback_url=").concat(window.location.href.replace(/\s/g, '')), '_self');
-                } },
-                react_1.default.createElement("div", { className: 'icon' },
-                    react_1.default.createElement(plus_svg_1.default, { style: (0, scale_1.getAdaptiveScale)({ windowDimensions: windowDimensions, currentSize: 1 }) })),
-                react_1.default.createElement(_system_2.SmallText, { color: colors_1.AccentColor }, "Add new")))));
+    return (<StyledProfileWallets>
+      <Palete_1.default>
+        <_system_1.Flex justifyContent="space-between" alignItems="center">
+          <_system_1.H5 color={colors_1.BlackColor}>Wallets</_system_1.H5>
+          <div className={'manageBtn'} onClick={function () { return openModalSidebarPortal(<myWallets_1.default />); }}>
+            <_system_2.SmallText color={colors_1.AccentColor}>Manage</_system_2.SmallText>
+          </div>
+        </_system_1.Flex>
+        <div className={'wallets'}>{renderUserWallets()}</div>
+        <div className={'add_wallets'} onClick={function () {
+            window.open("".concat(process_1.default.env.NEXT_PUBLIC_AUTH_HOST, "/add_wallets/?").concat(user, "&fallback_url=").concat(window.location.href.replace(/\s/g, '')), '_self');
+        }}>
+          <div className={'icon'}>
+            <plus_svg_1.default style={(0, scale_1.getAdaptiveScale)({ windowDimensions: windowDimensions, currentSize: 1 })}/>
+          </div>
+
+          <_system_2.SmallText color={colors_1.AccentColor}>Add new</_system_2.SmallText>
+        </div>
+      </Palete_1.default>
+    </StyledProfileWallets>);
 };
 exports.ProfileWallets = ProfileWallets;
 var templateObject_1;

package/dist/components/profile/wrapper/{index.js → index.jsx}

@@ -9,9 +9,17 @@ var profile_1 = require("@/components/profile");
 // Components
 var ProfileWrapper = function (_a) {
     var profile = _a.profile, url = _a.url, children = _a.children;
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(profile_1.ProfilePageHead, { userUrl: url, profile: profile }),
-        react_1.default.createElement(profile_1.ProfileInfo, { profile: profile }),
-        children));
+    return (<>
+      <profile_1.ProfilePageHead userUrl={url} profile={profile}/>
+
+      <profile_1.ProfileInfo profile={profile}/>
+
+      {children}
+
+      {/*<script*/}
+      {/*  type="application/ld+json"*/}
+      {/*  dangerouslySetInnerHTML={profileJSONLD(profile as schema.IProfile, '')}*/}
+      {/*/>*/}
+    </>);
 };
 exports.ProfileWrapper = ProfileWrapper;

package/dist/components/registrationPage/registrationSelectBox/{index.js → index.jsx}

@@ -17,8 +17,9 @@ var StyledRegistrationSelectBox = styled_components_1.default.div(templateObject
 }, function (props) { return (props.isSelected ? 0.8 : 0.5); }, colors_1.BlackColor, colors_1.WhiteColor, colors_1.WhiteColor);
 var RegistrationSelectBox = function (_a) {
     var name = _a.name, image = _a.image, selected = _a.selected, onClick = _a.onClick;
-    return (react_1.default.createElement(StyledRegistrationSelectBox, { isSelected: selected, image: image, onClick: function () { return onClick(name); } },
-        react_1.default.createElement("h2", { className: 'text' }, name)));
+    return (<StyledRegistrationSelectBox isSelected={selected} image={image} onClick={function () { return onClick(name); }}>
+      <h2 className={'text'}>{name}</h2>
+    </StyledRegistrationSelectBox>);
 };
 exports.default = RegistrationSelectBox;
 var templateObject_1;

package/dist/components/registrationPage/registrationSelection/{index.js → index.jsx}

@@ -22,21 +22,35 @@ var StyledRegistrationSelection = styled_components_1.default.div(templateObject
 // Components
 var RegistrationSelection = function (_a) {
     var step = _a.step, title = _a.title, subtitle = _a.subtitle, maxSteps = _a.maxSteps, values = _a.values, selectedNames = _a.selectedNames, saveValue = _a.saveValue, onClick = _a.onClick, onSaveClick = _a.onSaveClick, text = _a.text;
-    return (react_1.default.createElement(StyledRegistrationSelection, null,
-        react_1.default.createElement("div", { className: "info" },
-            react_1.default.createElement(_system_1.Box, null,
-                react_1.default.createElement(_system_1.Flex, { justifyContent: 'center' },
-                    react_1.default.createElement(StyledCaption, { color: colors_1.AccentColor, mr: 10 }, "Step ".concat(step, "/").concat(maxSteps, " - ")),
-                    react_1.default.createElement(StyledCaption, { color: colors_2.BlackColor }, title)),
-                react_1.default.createElement(_system_1.H3, { color: colors_2.TextGrayColor, mt: 16, mb: 4, fontSize: 18, textAlign: 'center' }, subtitle),
-                react_1.default.createElement(ui_1.MainText, { fontSize: 13, textAlign: 'center', color: colors_2.TextGrayColor }, text))),
-        react_1.default.createElement("div", { className: "content" },
-            react_1.default.createElement("div", { className: "content-values" }, values === null || values === void 0 ? void 0 : values.map(function (_a) {
-                var name = _a.name, imageUrl = _a.imageUrl;
-                return (react_1.default.createElement(registrationPage_1.RegistrationSelectBox, { key: name, name: name, image: imageUrl, selected: selectedNames.includes(name), onClick: onClick }));
-            })),
-            react_1.default.createElement("div", { className: "content-next" },
-                react_1.default.createElement(MainButton_1.default, { onClick: onSaveClick, variant: "primaryM", text: saveValue })))));
+    return (<StyledRegistrationSelection>
+    <div className="info">
+      <_system_1.Box>
+        <_system_1.Flex justifyContent={'center'}>
+          <StyledCaption color={colors_1.AccentColor} mr={10}>{"Step ".concat(step, "/").concat(maxSteps, " - ")}</StyledCaption>
+          <StyledCaption color={colors_2.BlackColor}>{title}</StyledCaption>
+        </_system_1.Flex>
+        <_system_1.H3 color={colors_2.TextGrayColor} mt={16} mb={4} fontSize={18} textAlign={'center'}>
+          {subtitle}
+        </_system_1.H3>
+        <ui_1.MainText fontSize={13} textAlign={'center'} color={colors_2.TextGrayColor}>
+          {text}
+        </ui_1.MainText>
+      </_system_1.Box>
+    </div>
+
+    <div className="content">
+      <div className="content-values">
+        {values === null || values === void 0 ? void 0 : values.map(function (_a) {
+            var name = _a.name, imageUrl = _a.imageUrl;
+            return (<registrationPage_1.RegistrationSelectBox key={name} name={name} image={imageUrl} selected={selectedNames.includes(name)} onClick={onClick}/>);
+        })}
+      </div>
+
+      <div className="content-next">
+        <MainButton_1.default onClick={onSaveClick} variant="primaryM" text={saveValue}/>
+      </div>
+    </div>
+  </StyledRegistrationSelection>);
 };
 // Export
 exports.default = RegistrationSelection;

package/dist/components/rewards/FAQ/{index.js → index.jsx}

@@ -101,10 +101,10 @@ var FAQ_ITEMS = [
 // Component
 var ArrowIconResize = function () {
     var windowDimensions = (0, screen_1.useWindowDimensionsWithServerInitial)().windowDimensions;
-    return (react_1.default.createElement(arrow_up_light_svg_1.default, { style: (0, scale_1.getAdaptiveScale)({
+    return (<arrow_up_light_svg_1.default style={(0, scale_1.getAdaptiveScale)({
             windowDimensions: windowDimensions,
             currentSize: 1,
-        }) }));
+        })}/>);
 };
 var FAQRewards = function () {
     var _a = (0, react_1.useState)(Array(3).fill(false)), openTopics = _a[0], setOpenTopics = _a[1];
@@ -115,17 +115,25 @@ var FAQRewards = function () {
             return newOpenTopics;
         });
     };
-    return (react_1.default.createElement(StyledFAQRewards, null,
-        react_1.default.createElement(TitleFAQ, null, "Frequently Asked Questions"),
-        react_1.default.createElement(_system_1.Flex, { flexDirection: "column", width: "100%" }, FAQ_ITEMS.map(function (_a) {
+    return (<StyledFAQRewards>
+      <TitleFAQ>Frequently Asked Questions</TitleFAQ>
+      <_system_1.Flex flexDirection="column" width="100%">
+        {FAQ_ITEMS.map(function (_a) {
             var id = _a.id, title = _a.title, description = _a.description;
-            return (react_1.default.createElement(StyledFlexDivider, { key: id },
-                react_1.default.createElement(StyledTitleWrapper, null,
-                    react_1.default.createElement(AccordionTitle, null, title),
-                    react_1.default.createElement(StyledArrowIcon, { isShow: openTopics[id], onClick: function () { return toggleDescription(id); } },
-                        react_1.default.createElement(ArrowIconResize, null))),
-                react_1.default.createElement("p", { className: "faq_desc ".concat(openTopics[id] ? 'open' : '') }, description)));
-        }))));
+            return (<StyledFlexDivider key={id}>
+            <StyledTitleWrapper>
+              <AccordionTitle>{title}</AccordionTitle>
+              <StyledArrowIcon isShow={openTopics[id]} onClick={function () { return toggleDescription(id); }}>
+                <ArrowIconResize />
+              </StyledArrowIcon>
+            </StyledTitleWrapper>
+            <p className={"faq_desc ".concat(openTopics[id] ? 'open' : '')}>
+              {description}
+            </p>
+          </StyledFlexDivider>);
+        })}
+      </_system_1.Flex>
+    </StyledFAQRewards>);
 };
 // Export
 exports.default = FAQRewards;

package/dist/components/rewards/clarifications/{index.js → index.jsx}

@@ -30,24 +30,34 @@ var StyledFlex = (0, styled_components_1.default)(_system_1.Flex)(templateObject
 // Component
 var Clarifications = function (_a) {
     var goalsArr = _a.goalsArr;
-    return (React.createElement(StyledClarifications, null,
-        React.createElement(_system_1.Flex, { flexDirection: "column", width: "100%", style: { gap: '16px' } },
-            React.createElement(_system_1.H3, { style: {
-                    lineHeight: '1.5',
-                    fontWeight: 600,
-                    fontSize: '2.4em',
-                    textAlign: 'center',
-                    fontFamily: vars_1.poppinsFontVarCss.css,
-                }, color: colors_1.WhiteColor }, "How does it work?"),
-            React.createElement("p", { className: "clar_desc" }, "Further developing and growing NFT Trader for our team has been an exciting journey so far.")),
-        React.createElement(_system_1.Flex, { flexDirection: "column", width: "100%" }, goalsArr && goalsArr.length > 0
+    return (<StyledClarifications>
+      <_system_1.Flex flexDirection="column" width="100%" style={{ gap: '16px' }}>
+        <_system_1.H3 style={{
+            lineHeight: '1.5',
+            fontWeight: 600,
+            fontSize: '2.4em',
+            textAlign: 'center',
+            fontFamily: vars_1.poppinsFontVarCss.css,
+        }} color={colors_1.WhiteColor}>
+          How does it work?
+        </_system_1.H3>
+        <p className={"clar_desc"}>
+          Further developing and growing NFT Trader for our team has been an
+          exciting journey so far.
+        </p>
+      </_system_1.Flex>
+      <_system_1.Flex flexDirection="column" width="100%">
+        {goalsArr && goalsArr.length > 0
             ? goalsArr.map(function (_a) {
                 var desc = _a.desc, expPerTime = _a.expPerTime;
-                return (React.createElement(StyledFlex, { key: desc + expPerTime },
-                    React.createElement("p", { className: "goal_desc" }, desc),
-                    React.createElement("p", { className: "goal_exp" }, expPerTime)));
+                return (<StyledFlex key={desc + expPerTime}>
+                <p className={"goal_desc"}>{desc}</p>
+                <p className={"goal_exp"}>{expPerTime}</p>
+              </StyledFlex>);
             })
-            : null)));
+            : null}
+      </_system_1.Flex>
+    </StyledClarifications>);
 };
 //Export
 exports.default = Clarifications;

package/dist/components/rewards/logoBottom/{index.js → index.jsx}

@@ -18,11 +18,12 @@ var StyledBottomLogo = (0, styled_components_1.default)(_system_1.Flex)(template
 // Component
 var BottomLogo = function () {
     var windowDimensions = (0, screen_1.useWindowDimensionsWithServerInitial)().windowDimensions;
-    return (React.createElement(StyledBottomLogo, null,
-        React.createElement(main_logo_dark_svg_1.default, { className: 'bottom_logo', style: (0, scale_1.getAdaptiveScale)({
-                windowDimensions: windowDimensions,
-                currentSize: 0.8,
-            }) })));
+    return (<StyledBottomLogo>
+      <main_logo_dark_svg_1.default className={'bottom_logo'} style={(0, scale_1.getAdaptiveScale)({
+            windowDimensions: windowDimensions,
+            currentSize: 0.8,
+        })}/>
+    </StyledBottomLogo>);
 };
 // Export
 exports.default = BottomLogo;

package/dist/components/rewards/prograssBar/{index.js → index.jsx}

@@ -23,9 +23,11 @@ var StyledProgress = styled_components_1.default.div(templateObject_1 || (templa
 //   Component
 var ProgressBar = function (_a) {
     var height = _a.height, percent = _a.percent, isUserTab = _a.isUserTab;
-    return (React.createElement(React.Fragment, null,
-        React.createElement(StyledProgress, { percent: percent, height: height, isForUser: isUserTab },
-            React.createElement("div", { className: "progress_fill" }))));
+    return (<>
+      <StyledProgress percent={percent} height={height} isForUser={isUserTab}>
+        <div className="progress_fill"></div>
+      </StyledProgress>
+    </>);
 };
 // Export
 exports.default = ProgressBar;

package/dist/components/rewards/seasonBanner/{index.js → index.jsx}

@@ -21,8 +21,9 @@ var SeasonTitle = (0, styled_components_1.default)(_system_1.H2)(templateObject_
 // Component
 var SeasonsTab = function (_a) {
     var title = _a.title;
-    return (React.createElement(StyledSeasons, null,
-        React.createElement(SeasonTitle, null, title !== null && title !== void 0 ? title : 'Seasons coming soon...')));
+    return (<StyledSeasons>
+      <SeasonTitle>{title !== null && title !== void 0 ? title : 'Seasons coming soon...'}</SeasonTitle>
+    </StyledSeasons>);
 };
 //Export
 exports.default = SeasonsTab;

package/dist/components/rewards/taskExpTab/{index.js → index.jsx}

@@ -39,25 +39,37 @@ var TaskTitle = (0, styled_components_1.default)(_system_1.H5)(templateObject_2
 // Component
 var TaskExpTab = function (_a) {
     var taskTitle = _a.taskTitle, taskDesc = _a.taskDesc, ernExp = _a.ernExp, segmentsNumber = _a.segmentsNumber, partDone = _a.partDone, partReq = _a.partReq, action = _a.action;
-    return (React.createElement(StyledTaskExpTab, null,
-        React.createElement(_system_1.Flex, { justifyContent: "space-between", width: "100%" },
-            React.createElement(TaskTitle, null, taskTitle !== null && taskTitle !== void 0 ? taskTitle : 'Another task'),
-            React.createElement(_system_1.Flex, { className: 'gap_8' },
-                React.createElement("p", { className: "erned_exp" },
-                    segmentsNumber !== 1 ? "from ".concat(ernExp) : ernExp,
-                    " XP"),
-                React.createElement("img", { src: '/rewardsPage/XP_logo.svg', alt: "Experience logo", className: "exp_logo" }))),
-        React.createElement(_system_1.Flex, { justifyContent: segmentsNumber ? 'space-between' : 'center', className: "task_content" },
-            React.createElement("p", { className: "task_desc" }, taskDesc !== null && taskDesc !== void 0 ? taskDesc : 'Another task text goes here.'),
-            segmentsNumber ? (React.createElement(_system_1.Flex, { className: 'gap_8', flexDirection: 'column' },
-                React.createElement(_system_1.Flex, { className: 'gap_8', width: "100%" }, Array.from(Array(segmentsNumber)).map(function (_, index) {
-                    return (React.createElement(prograssBar_1.default, { key: index, height: 12, percent: partDone > index ? 100 : 0 }));
-                })),
-                React.createElement(_system_1.Flex, { justifyContent: "space-between", width: "100%" },
-                    React.createElement("p", { className: "task_part_complete" }, "0"),
-                    React.createElement("p", { className: "task_part_requried" }, partReq)))) : null),
-        action && (React.createElement(_system_1.Flex, { justifyContent: 'center' },
-            React.createElement(rewardsButton_1.default, { onClick: action.onClick }, action.text)))));
+    return (<StyledTaskExpTab>
+      <_system_1.Flex justifyContent="space-between" width="100%">
+        <TaskTitle>{taskTitle !== null && taskTitle !== void 0 ? taskTitle : 'Another task'}</TaskTitle>
+        <_system_1.Flex className={'gap_8'}>
+          <p className={"erned_exp"}>
+            {segmentsNumber !== 1 ? "from ".concat(ernExp) : ernExp} XP
+          </p>
+          <img src={'/rewardsPage/XP_logo.svg'} alt="Experience logo" className="exp_logo"/>
+        </_system_1.Flex>
+      </_system_1.Flex>
+      <_system_1.Flex justifyContent={segmentsNumber ? 'space-between' : 'center'} className={"task_content"}>
+        <p className={"task_desc"}>
+          {taskDesc !== null && taskDesc !== void 0 ? taskDesc : 'Another task text goes here.'}
+        </p>
+        {segmentsNumber ? (<_system_1.Flex className={'gap_8'} flexDirection={'column'}>
+            <_system_1.Flex className={'gap_8'} width="100%">
+              {Array.from(Array(segmentsNumber)).map(function (_, index) {
+                return (<prograssBar_1.default key={index} height={12} percent={partDone > index ? 100 : 0}/>);
+            })}
+            </_system_1.Flex>
+
+            <_system_1.Flex justifyContent="space-between" width="100%">
+              <p className={"task_part_complete"}>0</p>
+              <p className={"task_part_requried"}>{partReq}</p>
+            </_system_1.Flex>
+          </_system_1.Flex>) : null}
+      </_system_1.Flex>
+      {action && (<_system_1.Flex justifyContent={'center'}>
+          <rewardsButton_1.default onClick={action.onClick}>{action.text}</rewardsButton_1.default>
+        </_system_1.Flex>)}
+    </StyledTaskExpTab>);
 };
 // Export
 exports.default = TaskExpTab;

package/dist/components/rewards/tasksGrid/{index.js → index.jsx}

@@ -133,9 +133,12 @@ var Tasks = function (_a) {
     }, []);
     if (!(tasks === null || tasks === void 0 ? void 0 : tasks.length))
         return null;
-    return (React.createElement(StyledTasks, null,
-        React.createElement(SH3, null, "Tasks"),
-        React.createElement(StyledGrid, null, tasks === null || tasks === void 0 ? void 0 : tasks.map(function (task) { return (React.createElement(taskExpTab_1.default, { key: Number(task.taskId), taskTitle: task.name || 'No name', taskDesc: task.description || 'No description', ernExp: (task === null || task === void 0 ? void 0 : task.minPointsAward) || 0, segmentsNumber: (task === null || task === void 0 ? void 0 : task.maxRepeats) || 0, partDone: (task === null || task === void 0 ? void 0 : task.repeatsCompleted) || 0, partReq: (task === null || task === void 0 ? void 0 : task.maxRepeats) || 0, action: task.taskType ? BUTTONS_BY_TASK_TYPE[task.taskType] : undefined })); }))));
+    return (<StyledTasks>
+      <SH3>Tasks</SH3>
+      <StyledGrid>
+        {tasks === null || tasks === void 0 ? void 0 : tasks.map(function (task) { return (<taskExpTab_1.default key={Number(task.taskId)} taskTitle={task.name || 'No name'} taskDesc={task.description || 'No description'} ernExp={(task === null || task === void 0 ? void 0 : task.minPointsAward) || 0} segmentsNumber={(task === null || task === void 0 ? void 0 : task.maxRepeats) || 0} partDone={(task === null || task === void 0 ? void 0 : task.repeatsCompleted) || 0} partReq={(task === null || task === void 0 ? void 0 : task.maxRepeats) || 0} action={task.taskType ? BUTTONS_BY_TASK_TYPE[task.taskType] : undefined}/>); })}
+      </StyledGrid>
+    </StyledTasks>);
 };
 // Export
 exports.default = Tasks;