@ludo.ninja/components 1.1.2 → 1.1.3

package/dist/system/Img/Userpic/index.jsx

@@ -1,171 +1,73 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 import React, { useEffect } from 'react';
-
 import Image from 'next/image';
 import Link from 'next/link';
-
 import Skeleton from 'react-loading-skeleton';
 import styled from 'styled-components';
-
 import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-
 import { useUserStore } from '@/modules/user/store';
-
 import useFetchUserpic from '@/api/server-medias/queries/useFetchUserPic';
-
 import { mediaQuery } from '@/styles/ScreenWidth';
 import BoxTransform from '@/styles/mixins/boxTransform';
-
 import { ImageInterceptor } from '@/system/Img/ImageInterceptor';
-
 import { getMediaENVDomain } from '@/utils/env';
-
 import DefaultUserPicIcon from '@/public/defaultUserpics/defaultUserpic.svg';
-
-var __makeTemplateObject =
-  (this && this.__makeTemplateObject) ||
-  function (cooked, raw) {
-    if (Object.defineProperty) {
-      Object.defineProperty(cooked, 'raw', { value: raw });
-    } else {
-      cooked.raw = raw;
-    }
-    return cooked;
-  };
-
 // Styles
-var StyledHeaderUserPic = styled.div(
-  templateObject_1 ||
-    (templateObject_1 = __makeTemplateObject(
-      [
-        '\n  ',
-        '\n  .userPicBlock {\n    display: flex;\n  }\n\n  .userPicImage {\n    border-radius: 50%;\n    width: ',
-        ';\n    height: ',
-        ';\n\n    ',
-        ' {\n      width: ',
-        ';\n      height: ',
-        ';\n    }\n  }\n',
-      ],
-      [
-        '\n  ',
-        '\n  .userPicBlock {\n    display: flex;\n  }\n\n  .userPicImage {\n    border-radius: 50%;\n    width: ',
-        ';\n    height: ',
-        ';\n\n    ',
-        ' {\n      width: ',
-        ';\n      height: ',
-        ';\n    }\n  }\n',
-      ]
-    )),
-  function (props) {
-    return props.isNeedBoxTransform ? BoxTransform : null;
-  },
-  function (props) {
-    return props.imageWidth;
-  },
-  function (props) {
-    return props.imageHeight;
-  },
-  mediaQuery.minWidthFourK,
-  function (props) {
+var StyledHeaderUserPic = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", "\n  .userPicBlock {\n    display: flex;\n  }\n\n  .userPicImage {\n    border-radius: 50%;\n    width: ", ";\n    height: ", ";\n\n    ", " {\n      width: ", ";\n      height: ", ";\n    }\n  }\n"], ["\n  ", "\n  .userPicBlock {\n    display: flex;\n  }\n\n  .userPicImage {\n    border-radius: 50%;\n    width: ", ";\n    height: ", ";\n\n    ", " {\n      width: ", ";\n      height: ", ";\n    }\n  }\n"])), function (props) { return (props.isNeedBoxTransform ? BoxTransform : null); }, function (props) { return props.imageWidth; }, function (props) { return props.imageHeight; }, mediaQuery.minWidthFourK, function (props) {
     return adaptiveValueCalc(Number(props.imageWidth.replace('px', '')));
-  },
-  function (props) {
+}, function (props) {
     return adaptiveValueCalc(Number(props.imageHeight.replace('px', '')));
-  }
-);
+});
 // Component
 var UserPic = function (_a) {
-  var userId = _a.userId,
-    width = _a.width,
-    height = _a.height,
-    isNeedBoxTransform = _a.isNeedBoxTransform,
-    children = _a.children;
-  var _b = useUserStore(function (state) {
-      return {
+    var userId = _a.userId, width = _a.width, height = _a.height, isNeedBoxTransform = _a.isNeedBoxTransform, children = _a.children;
+    var _b = useUserStore(function (state) { return ({
         isSignedIn: state.isSignedIn,
         isLoadingProfileData: state.isLoadingProfileData,
         profileData: state.profileData,
-      };
-    }),
-    isSignedIn = _b.isSignedIn,
-    isLoadingProfileData = _b.isLoadingProfileData,
-    profileData = _b.profileData;
-  var _c = useFetchUserpic(),
-    load = _c.load,
-    userPic = _c.userPic,
-    loading = _c.loading;
-  var profileUserPic = (
-    profileData === null || profileData === void 0
-      ? void 0
-      : profileData
-          .getUserPic({
-            mediaDomain: getMediaENVDomain(),
-          })
-          .includes('1.svg')
-  )
-    ? null
-    : profileData === null || profileData === void 0
-    ? void 0
-    : profileData.getUserPic({
+    }); }), isSignedIn = _b.isSignedIn, isLoadingProfileData = _b.isLoadingProfileData, profileData = _b.profileData;
+    var _c = useFetchUserpic(), load = _c.load, userPic = _c.userPic, loading = _c.loading;
+    var profileUserPic = (profileData === null || profileData === void 0 ? void 0 : profileData.getUserPic({
         mediaDomain: getMediaENVDomain(),
-      });
-  useEffect(
-    function () {
-      if (
-        isSignedIn &&
-        !isLoadingProfileData &&
-        (profileData === null || profileData === void 0
-          ? void 0
-          : profileData
-              .getUserPic({
+    }).includes('1.svg'))
+        ? null
+        : profileData === null || profileData === void 0 ? void 0 : profileData.getUserPic({
+            mediaDomain: getMediaENVDomain(),
+        });
+    useEffect(function () {
+        if (isSignedIn &&
+            !isLoadingProfileData &&
+            (profileData === null || profileData === void 0 ? void 0 : profileData.getUserPic({
                 mediaDomain: getMediaENVDomain(),
-              })
-              .includes('1.svg'))
-      ) {
-        load(userId);
-      }
-    },
-    [userId, isSignedIn, isLoadingProfileData, profileData]
-  );
-  var renderDefaultUserPic = function () {
-    return <DefaultUserPicIcon className={'userPicImage'} />;
-  };
-  var renderImage = function () {
-    return (
-      <ImageInterceptor borderRadiusSkeleton={'50%'}>
-        <Image
-          src={profileUserPic || userPic}
-          className={'userPicImage'}
-          width={width}
-          height={height}
-          priority={true}
-          alt={'ludo ninja userPick'}
-        />
-      </ImageInterceptor>
-    );
-  };
-  var renderImageOrDefaultUserPic = function () {
-    return profileUserPic || userPic ? renderImage() : renderDefaultUserPic();
-  };
-  var renderSkeleton = function () {
-    return <Skeleton className={'userPicImage'} />;
-  };
-  return (
-    <StyledHeaderUserPic
-      isNeedBoxTransform={isNeedBoxTransform}
-      imageWidth={''.concat(width, 'px')}
-      imageHeight={''.concat(height, 'px')}
-    >
-      <Link
-        href={'/profile/'.concat(userId, '/nfts')}
-        className={'userPicBlock'}
-      >
+            }).includes('1.svg'))) {
+            load(userId);
+        }
+    }, [userId, isSignedIn, isLoadingProfileData, profileData]);
+    var renderDefaultUserPic = function () {
+        return <DefaultUserPicIcon className={'userPicImage'}/>;
+    };
+    var renderImage = function () {
+        return (<ImageInterceptor borderRadiusSkeleton={'50%'}>
+        <Image src={(profileUserPic || userPic)} className={'userPicImage'} width={width} height={height} priority={true} alt={'ludo ninja userPick'}/>
+      </ImageInterceptor>);
+    };
+    var renderImageOrDefaultUserPic = function () {
+        return profileUserPic || userPic ? renderImage() : renderDefaultUserPic();
+    };
+    var renderSkeleton = function () {
+        return <Skeleton className={'userPicImage'}/>;
+    };
+    return (<StyledHeaderUserPic isNeedBoxTransform={isNeedBoxTransform} imageWidth={"".concat(width, "px")} imageHeight={"".concat(height, "px")}>
+      <Link href={"/profile/".concat(userId, "/nfts")} className={'userPicBlock'}>
         {loading || isLoadingProfileData
-          ? renderSkeleton()
-          : renderImageOrDefaultUserPic()}
+            ? renderSkeleton()
+            : renderImageOrDefaultUserPic()}
         {children}
       </Link>
-    </StyledHeaderUserPic>
-  );
+    </StyledHeaderUserPic>);
 };
 // Export
 export default UserPic;

package/dist/system/Labels/ExperienceLabel/ExperienceLabel.test.jsx

@@ -1,54 +1,49 @@
 import React from 'react';
-
 import { render, screen } from '@testing-library/react';
-
 import ExperienceLabel from '../ExperienceLabel';
-
 // Mock the Next.js Image component
 jest.mock('next/image', function () {
-  return function Image() {
-    return <img alt="Experience logo" width={20} height={20} />;
-  };
+    return function Image() {
+        return <img alt="Experience logo" width={20} height={20}/>;
+    };
 });
 describe('ExperienceLabel Component', function () {
-  test('renders with value and link', function () {
-    var props = {
-      value: 100,
-      link: '/profile/123',
-      loading: false,
-    };
-    render(<ExperienceLabel {...props} />);
-    var xpText = screen.getByText('100 XP');
-    expect(xpText).toBeInTheDocument();
-    var imageAltText = screen.getByAltText('Experience logo');
-    expect(imageAltText).toBeInTheDocument();
-    var linkElement = screen.getByRole('link', { name: /100 XP/i });
-    expect(linkElement).toHaveAttribute('href', '/profile/123');
-  });
-  test('renders loading skeleton', function () {
-    var props = {
-      value: 0,
-      link: '/profile/123',
-      loading: true,
-    };
-    render(
-      <div data-testid={'test_container'}>
-        <ExperienceLabel {...props} />
-      </div>
-    );
-    var skeletonElement = screen
-      .getByTestId('test_container')
-      .querySelector('.react-loading-skeleton');
-    expect(skeletonElement).toBeInTheDocument();
-  });
-  test('does not render when value is falsy', function () {
-    var props = {
-      value: 0,
-      link: '/profile/123',
-      loading: false,
-    };
-    render(<ExperienceLabel {...props} />);
-    var xpText = screen.queryByText('0 XP');
-    expect(xpText).not.toBeInTheDocument();
-  });
+    test('renders with value and link', function () {
+        var props = {
+            value: 100,
+            link: '/profile/123',
+            loading: false,
+        };
+        render(<ExperienceLabel {...props}/>);
+        var xpText = screen.getByText('100 XP');
+        expect(xpText).toBeInTheDocument();
+        var imageAltText = screen.getByAltText('Experience logo');
+        expect(imageAltText).toBeInTheDocument();
+        var linkElement = screen.getByRole('link', { name: /100 XP/i });
+        expect(linkElement).toHaveAttribute('href', '/profile/123');
+    });
+    test('renders loading skeleton', function () {
+        var props = {
+            value: 0,
+            link: '/profile/123',
+            loading: true,
+        };
+        render(<div data-testid={'test_container'}>
+        <ExperienceLabel {...props}/>
+      </div>);
+        var skeletonElement = screen
+            .getByTestId('test_container')
+            .querySelector('.react-loading-skeleton');
+        expect(skeletonElement).toBeInTheDocument();
+    });
+    test('does not render when value is falsy', function () {
+        var props = {
+            value: 0,
+            link: '/profile/123',
+            loading: false,
+        };
+        render(<ExperienceLabel {...props}/>);
+        var xpText = screen.queryByText('0 XP');
+        expect(xpText).not.toBeInTheDocument();
+    });
 });

package/dist/system/Labels/ExperienceLabel/index.jsx

@@ -1,131 +1,38 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 import React from 'react';
-
 import Image from 'next/image';
 import Link from 'next/link';
-
 import styled from 'styled-components';
-
 import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-
 import { mediaQuery } from '@/styles/ScreenWidth';
 import BoxShadow from '@/styles/mixins/boxShadow';
 import BoxTransform from '@/styles/mixins/boxTransform';
-
 import SkeletonLabel from '@/system/Labels/SkeletonLabel';
-
 import { poppinsFontVarCss } from '@/fonts/vars';
-
-var __makeTemplateObject =
-  (this && this.__makeTemplateObject) ||
-  function (cooked, raw) {
-    if (Object.defineProperty) {
-      Object.defineProperty(cooked, 'raw', { value: raw });
-    } else {
-      cooked.raw = raw;
-    }
-    return cooked;
-  };
-
 // Styles
-var StyledExpTab = styled(Link)(
-  templateObject_1 ||
-    (templateObject_1 = __makeTemplateObject(
-      [
-        '\n  ',
-        ';\n  ',
-        ';\n  display: flex;\n  gap: 8px;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 8px 5px 6px;\n  max-width: max-content;\n  min-width: 116px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ',
-        ';\n\n  .value {\n    font-family: ',
-        ';\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ',
-        ';\n  }\n  ',
-        ' {\n    gap: ',
-        ';\n    padding: ',
-        ' ',
-        '\n      ',
-        ' ',
-        ';\n    min-width: ',
-        ';\n    min-height: ',
-        ';\n    border-radius: ',
-        ';\n\n    img {\n      width: ',
-        ';\n      height: ',
-        ';\n    }\n\n    .value {\n      font-size: ',
-        ';\n    }\n  }\n',
-      ],
-      [
-        '\n  ',
-        ';\n  ',
-        ';\n  display: flex;\n  gap: 8px;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 8px 5px 6px;\n  max-width: max-content;\n  min-width: 116px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ',
-        ';\n\n  .value {\n    font-family: ',
-        ';\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ',
-        ';\n  }\n  ',
-        ' {\n    gap: ',
-        ';\n    padding: ',
-        ' ',
-        '\n      ',
-        ' ',
-        ';\n    min-width: ',
-        ';\n    min-height: ',
-        ';\n    border-radius: ',
-        ';\n\n    img {\n      width: ',
-        ';\n      height: ',
-        ';\n    }\n\n    .value {\n      font-size: ',
-        ';\n    }\n  }\n',
-      ]
-    )),
-  BoxShadow,
-  BoxTransform,
-  function (_a) {
+var StyledExpTab = styled(Link)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", ";\n  ", ";\n  display: flex;\n  gap: 8px;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 8px 5px 6px;\n  max-width: max-content;\n  min-width: 116px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ", ";\n\n  .value {\n    font-family: ", ";\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ", ";\n  }\n  ", " {\n    gap: ", ";\n    padding: ", " ", "\n      ", " ", ";\n    min-width: ", ";\n    min-height: ", ";\n    border-radius: ", ";\n\n    img {\n      width: ", ";\n      height: ", ";\n    }\n\n    .value {\n      font-size: ", ";\n    }\n  }\n"], ["\n  ", ";\n  ", ";\n  display: flex;\n  gap: 8px;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 8px 5px 6px;\n  max-width: max-content;\n  min-width: 116px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ", ";\n\n  .value {\n    font-family: ", ";\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ", ";\n  }\n  ", " {\n    gap: ", ";\n    padding: ", " ", "\n      ", " ", ";\n    min-width: ", ";\n    min-height: ", ";\n    border-radius: ", ";\n\n    img {\n      width: ", ";\n      height: ", ";\n    }\n\n    .value {\n      font-size: ", ";\n    }\n  }\n"])), BoxShadow, BoxTransform, function (_a) {
     var _b, _c;
     var theme = _a.theme;
-    return (_c =
-      (_b = theme.colors) === null || _b === void 0
-        ? void 0
-        : _b.experienceGradientLabel) === null || _c === void 0
-      ? void 0
-      : _c.gradient;
-  },
-  poppinsFontVarCss.css,
-  function (_a) {
+    return (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.experienceGradientLabel) === null || _c === void 0 ? void 0 : _c.gradient;
+}, poppinsFontVarCss.css, function (_a) {
     var _b, _c;
     var theme = _a.theme;
-    return (_c =
-      (_b = theme.colors) === null || _b === void 0
-        ? void 0
-        : _b.experienceGradientLabel) === null || _c === void 0
-      ? void 0
-      : _c.color;
-  },
-  mediaQuery.minWidthFourK,
-  adaptiveValueCalc(8),
-  adaptiveValueCalc(5),
-  adaptiveValueCalc(8),
-  adaptiveValueCalc(5),
-  adaptiveValueCalc(6),
-  adaptiveValueCalc(116),
-  adaptiveValueCalc(32),
-  adaptiveValueCalc(24),
-  adaptiveValueCalc(20),
-  adaptiveValueCalc(20),
-  adaptiveValueCalc(16)
-);
+    return (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.experienceGradientLabel) === null || _c === void 0 ? void 0 : _c.color;
+}, mediaQuery.minWidthFourK, adaptiveValueCalc(8), adaptiveValueCalc(5), adaptiveValueCalc(8), adaptiveValueCalc(5), adaptiveValueCalc(6), adaptiveValueCalc(116), adaptiveValueCalc(32), adaptiveValueCalc(24), adaptiveValueCalc(20), adaptiveValueCalc(20), adaptiveValueCalc(16));
 //Component
 var ExperienceLabel = function (_a) {
-  var _b = _a.value,
-    value = _b === void 0 ? 0 : _b,
-    link = _a.link,
-    loading = _a.loading;
-  if (loading) return <SkeletonLabel />;
-  if (!value) return null;
-  return (
-    <StyledExpTab href={link}>
-      <Image
-        src={'/rewardsPage/XP_logo.svg'}
-        alt="Experience logo"
-        width={20}
-        height={20}
-      />
-      <p className={'value'}>{value} XP</p>
-    </StyledExpTab>
-  );
+    var _b = _a.value, value = _b === void 0 ? 0 : _b, link = _a.link, loading = _a.loading;
+    if (loading)
+        return <SkeletonLabel />;
+    if (!value)
+        return null;
+    return (<StyledExpTab href={link}>
+      <Image src={'/rewardsPage/XP_logo.svg'} alt="Experience logo" width={20} height={20}/>
+      <p className={"value"}>{value} XP</p>
+    </StyledExpTab>);
 };
 export default ExperienceLabel;
 var templateObject_1;

package/dist/system/Labels/InviteLabel/InviteLabel.test.jsx

@@ -1,46 +1,41 @@
 import React from 'react';
-
 import { render, screen } from '@testing-library/react';
-
 import InviteLabel from '../InviteLabel';
-
 describe('InviteLabel Component', function () {
-  test('renders with value and link', function () {
-    var props = {
-      value: 50,
-      link: '/invite/123',
-      loading: false,
-    };
-    render(<InviteLabel {...props} />);
-    var inviteText = screen.getByText('50 invites');
-    expect(inviteText).toBeInTheDocument();
-    var linkElement = screen.getByRole('link', { name: /50 invites/i });
-    expect(linkElement).toHaveAttribute('href', '/invite/123');
-  });
-  test('renders loading skeleton', function () {
-    var props = {
-      value: 0,
-      link: '/invite/123',
-      loading: true,
-    };
-    render(
-      <div data-testid={'test_container'}>
-        <InviteLabel {...props} />
-      </div>
-    );
-    var skeletonElement = screen
-      .getByTestId('test_container')
-      .querySelector('.react-loading-skeleton');
-    expect(skeletonElement).toBeInTheDocument();
-  });
-  test('does not render when value is falsy', function () {
-    var props = {
-      value: 0,
-      link: '/invite/123',
-      loading: false,
-    };
-    render(<InviteLabel {...props} />);
-    var inviteText = screen.queryByText('0 invites');
-    expect(inviteText).not.toBeInTheDocument();
-  });
+    test('renders with value and link', function () {
+        var props = {
+            value: 50,
+            link: '/invite/123',
+            loading: false,
+        };
+        render(<InviteLabel {...props}/>);
+        var inviteText = screen.getByText('50 invites');
+        expect(inviteText).toBeInTheDocument();
+        var linkElement = screen.getByRole('link', { name: /50 invites/i });
+        expect(linkElement).toHaveAttribute('href', '/invite/123');
+    });
+    test('renders loading skeleton', function () {
+        var props = {
+            value: 0,
+            link: '/invite/123',
+            loading: true,
+        };
+        render(<div data-testid={'test_container'}>
+        <InviteLabel {...props}/>
+      </div>);
+        var skeletonElement = screen
+            .getByTestId('test_container')
+            .querySelector('.react-loading-skeleton');
+        expect(skeletonElement).toBeInTheDocument();
+    });
+    test('does not render when value is falsy', function () {
+        var props = {
+            value: 0,
+            link: '/invite/123',
+            loading: false,
+        };
+        render(<InviteLabel {...props}/>);
+        var inviteText = screen.queryByText('0 invites');
+        expect(inviteText).not.toBeInTheDocument();
+    });
 });

package/dist/system/Labels/InviteLabel/index.jsx

@@ -1,84 +1,34 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
 import React from 'react';
-
 import Link from 'next/link';
-
 import styled from 'styled-components';
-
 import BoxShadow from '@/styles/mixins/boxShadow';
 import BoxTransform from '@/styles/mixins/boxTransform';
-
 import SkeletonLabel from '@/system/Labels/SkeletonLabel';
-
 import { poppinsFontVarCss } from '@/fonts/vars';
-
-var __makeTemplateObject =
-  (this && this.__makeTemplateObject) ||
-  function (cooked, raw) {
-    if (Object.defineProperty) {
-      Object.defineProperty(cooked, 'raw', { value: raw });
-    } else {
-      cooked.raw = raw;
-    }
-    return cooked;
-  };
-
 // Styles
-var StyledExpTab = styled(Link)(
-  templateObject_1 ||
-    (templateObject_1 = __makeTemplateObject(
-      [
-        '\n  ',
-        ';\n  ',
-        ';\n  display: flex;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 16px;\n  max-width: max-content;\n  min-width: 99px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ',
-        ';\n\n  .value {\n    font-family: ',
-        ';\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ',
-        ';\n  }\n',
-      ],
-      [
-        '\n  ',
-        ';\n  ',
-        ';\n  display: flex;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 16px;\n  max-width: max-content;\n  min-width: 99px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ',
-        ';\n\n  .value {\n    font-family: ',
-        ';\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ',
-        ';\n  }\n',
-      ]
-    )),
-  BoxShadow,
-  BoxTransform,
-  function (_a) {
+var StyledExpTab = styled(Link)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  ", ";\n  ", ";\n  display: flex;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 16px;\n  max-width: max-content;\n  min-width: 99px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ", ";\n\n  .value {\n    font-family: ", ";\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ", ";\n  }\n"], ["\n  ", ";\n  ", ";\n  display: flex;\n  user-select: none;\n  justify-content: flex-start;\n  align-items: center;\n  padding: 5px 16px;\n  max-width: max-content;\n  min-width: 99px;\n  min-height: 32px;\n  border-radius: 24px;\n  background: ", ";\n\n  .value {\n    font-family: ", ";\n    font-size: 1.6em;\n    font-weight: 600;\n    line-height: 1.3;\n    color: ", ";\n  }\n"])), BoxShadow, BoxTransform, function (_a) {
     var _b, _c;
     var theme = _a.theme;
-    return (_c =
-      (_b = theme.colors) === null || _b === void 0
-        ? void 0
-        : _b.inviteCodesGradientLabel) === null || _c === void 0
-      ? void 0
-      : _c.gradient;
-  },
-  poppinsFontVarCss.css,
-  function (_a) {
+    return (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.inviteCodesGradientLabel) === null || _c === void 0 ? void 0 : _c.gradient;
+}, poppinsFontVarCss.css, function (_a) {
     var _b, _c;
     var theme = _a.theme;
-    return (_c =
-      (_b = theme.colors) === null || _b === void 0
-        ? void 0
-        : _b.inviteCodesGradientLabel) === null || _c === void 0
-      ? void 0
-      : _c.color;
-  }
-);
+    return (_c = (_b = theme.colors) === null || _b === void 0 ? void 0 : _b.inviteCodesGradientLabel) === null || _c === void 0 ? void 0 : _c.color;
+});
 //Component
 var InviteLabel = function (_a) {
-  var value = _a.value,
-    link = _a.link,
-    loading = _a.loading;
-  if (loading) return <SkeletonLabel />;
-  if (!value) return null;
-  return (
-    <StyledExpTab href={link}>
-      <p className={'value '}>{''.concat(value, ' invites')}</p>
-    </StyledExpTab>
-  );
+    var value = _a.value, link = _a.link, loading = _a.loading;
+    if (loading)
+        return <SkeletonLabel />;
+    if (!value)
+        return null;
+    return (<StyledExpTab href={link}>
+      <p className={"value "}>{"".concat(value, " invites")}</p>
+    </StyledExpTab>);
 };
 export default InviteLabel;
 var templateObject_1;

package/dist/system/Labels/SkeletonLabel/index.jsx

@@ -1,3 +1,2 @@
 import SkeletonLabel from '@ludo.ninja/ui/build/system/Labels/SkeletonLabel';
-
 export default SkeletonLabel;