@ludo.ninja/components 2.0.1 → 2.0.2

package/build/system/Cards/MultiMediaCard/index.js

@@ -0,0 +1,130 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const link_1 = __importDefault(require("next/link"));
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+const colors_1 = require("@/styles/colors");
+const boxShadow_1 = __importDefault(require("@/styles/mixins/boxShadow"));
+const boxTransform_1 = __importDefault(require("@/styles/mixins/boxTransform"));
+const CardContent_1 = __importDefault(require("@/system/Cards/CardContent"));
+const CardLikes_1 = __importDefault(require("@/system/Cards/CardContent/CardLikes"));
+const MultiHead_1 = __importDefault(require("@/system/Cards/Styles/MultiHead"));
+const system_1 = require("@/system");
+const defaultImage_svg_1 = __importDefault(require("@/public/gallery/defaultImage.svg"));
+const CardCategory_1 = __importDefault(require("../CardContent/CardCategory"));
+const CardImage_1 = __importDefault(require("../CardMedia/CardImage"));
+// Styles
+const StyledMultiCard = styled_components_1.default.div `
+  position: relative;
+  background-color: ${colors_1.WhiteColor};
+  border-radius: 6px;
+  ${boxShadow_1.default};
+  ${boxTransform_1.default};
+  @media (max-width: 1200px) {
+    height: max-content;
+  }
+
+  .media {
+    width: 100%;
+    height: 100%;
+    aspect-ratio: 1 / 1;
+
+    & svg {
+      width: 100%;
+      height: 100%;
+    }
+
+    & img {
+      border-radius: 3px;
+    }
+
+    & span {
+      display: none;
+    }
+
+    & video {
+      border-radius: 3px;
+    }
+  }
+
+  .media.digital {
+    position: relative;
+
+    & svg {
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      bottom: 0;
+      right: 0;
+
+      & circle,
+      & path {
+        transform: scale(0.5);
+      }
+    }
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    border-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+    .media {
+      & img {
+        border-radius: ${(0, _4k_1.adaptiveValueCalc)(3)};
+      }
+      & video {
+        border-radius: ${(0, _4k_1.adaptiveValueCalc)(3)};
+      }
+    }
+
+    .media.digital {
+      & svg {
+        width: ${(0, _4k_1.adaptiveValueCalc)(20)};
+        height: ${(0, _4k_1.adaptiveValueCalc)(20)};
+      }
+    }
+  }
+`;
+// Component
+const MultiMediaCard = ({ gallery, assets, collections, }) => {
+    const mediaTemplate = (mediaKey, media) => {
+        return ((0, jsx_runtime_1.jsx)("div", { className: media.type?.name === 'CardVideo' || media.type?.name === 'CardAudio'
+                ? 'media digital'
+                : 'media', children: media }, mediaKey));
+    };
+    const renderMedia = () => {
+        // if (
+        //   (!assets || assets.length === 0) &&
+        //   (!collections || collections.length === 0)
+        // )
+        //   return null;
+        const galleryCreationIds = gallery.getGalleryCreationIds();
+        const cardsMedia = [];
+        for (let i = 0; i < 4; i++) {
+            const creationId = galleryCreationIds[i];
+            const asset = assets?.find((asset) => {
+                return creationId === asset.getCreationId();
+            });
+            const collection = collections?.find((collection) => collection.getCreationId() ===
+                creationId?.split('.').splice(1).join('.'));
+            if (asset) {
+                cardsMedia.push(mediaTemplate(i, asset.detectMediaType().displaySingleMedia()));
+            }
+            else if (collection) {
+                cardsMedia.push(mediaTemplate(i, (0, jsx_runtime_1.jsx)(CardImage_1.default, { alt: `${collection.getName()} ${collection.getAddress() || ''}`, imgSrc: collection.getOriginalUrls()?.[0] ?? '', errorImg: '/noContent/noContent.svg' })));
+            }
+            else {
+                cardsMedia.push(mediaTemplate(i, (0, jsx_runtime_1.jsx)(defaultImage_svg_1.default, {})));
+            }
+        }
+        return cardsMedia;
+    };
+    const secondName = gallery.getGalleryUsername() !== '' ? gallery.getGalleryUsername() : '';
+    // const userCreationAddresses = gallery?.getGalleryCreations()[0]?.getOwnersAddresses();
+    return ((0, jsx_runtime_1.jsx)(StyledMultiCard, { children: (0, jsx_runtime_1.jsxs)(link_1.default, { href: gallery.getCreationLink(), children: [(0, jsx_runtime_1.jsx)(MultiHead_1.default, { children: renderMedia() }), (0, jsx_runtime_1.jsx)(CardContent_1.default, { firstName: gallery.getGalleryName(), secondName: secondName, wallets: gallery.getGalleryUserWallets(), isNeedShowMoreButton: false, itemId: gallery.getGalleryId(), children: (0, jsx_runtime_1.jsxs)(system_1.Flex, { alignItems: "flex-end", justifyContent: 'space-between', children: [(0, jsx_runtime_1.jsx)(CardCategory_1.default, { label: gallery.getLabel() }), (0, jsx_runtime_1.jsx)(CardLikes_1.default, { isLiked: false, likes: 0 })] }) })] }) }));
+};
+// Export
+exports.default = MultiMediaCard;

package/build/system/Cards/Styles/Content.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const StyledContentCard: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default StyledContentCard;

package/build/system/Cards/Styles/Content.js

@@ -0,0 +1,40 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+// Styles
+const styled_components_1 = __importDefault(require("styled-components"));
+const colors_1 = require("@/styles/colors");
+const typography_1 = require("@/styles/typography");
+const StyledContentCard = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  padding: 12px 16px;
+  height: auto;
+
+  &Header {
+    display: flex;
+    justify-content: space-between;
+
+    &Artist {
+      .artist_name {
+        ${typography_1.TextSmall};
+        color: ${colors_1.TextGrayColor};
+        line-height: 1.39em;
+      }
+      .art_name {
+        ${typography_1.MainText};
+        color: ${colors_1.BlackColor};
+        line-height: 1.47em;
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  @media (max-width: 1040px) {
+    height: auto;
+    padding: 12px;
+  }
+`;
+exports.default = StyledContentCard;

package/build/system/Cards/Styles/Head.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const StyledCardHead: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default StyledCardHead;

package/build/system/Cards/Styles/Head.js

@@ -0,0 +1,45 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+// Styles
+const StyledCardHead = styled_components_1.default.div `
+  position: relative;
+  height: 252px;
+  width: 252px;
+  margin: 0 auto;
+
+  .playIcon,
+  .pauseIcon {
+    position: absolute;
+    right: 6%;
+    bottom: 6%;
+
+    :hover {
+      circle {
+        opacity: 0.6;
+        fill: #12183a;
+      }
+    }
+  }
+
+  @media (max-width: 1200px) {
+    height: 164px;
+    width: 164px;
+  }
+
+  @media (max-width: 767px) {
+    height: 154px;
+    width: 154px;
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    height: ${(0, _4k_1.adaptiveValueCalc)(252)};
+    width: ${(0, _4k_1.adaptiveValueCalc)(252)};
+  }
+`;
+exports.default = StyledCardHead;

package/build/system/Cards/Styles/Headicons.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const StyledHeadIcons: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isMobile: boolean;
+}>> & string;
+export default StyledHeadIcons;

package/build/system/Cards/Styles/Headicons.js

@@ -0,0 +1,121 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+// Styles
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+const colors_1 = require("@/styles/colors");
+const StyledHeadIcons = styled_components_1.default.div `
+  transition: 0.2s opacity ease-out;
+  opacity: 0;
+
+  &:before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 100px;
+    border-top-left-radius: 6px;
+    border-top-right-radius: 6px;
+    background: linear-gradient(180deg, #12183a 0%, rgba(18, 24, 58, 0) 100%);
+    opacity: 0.3;
+  }
+
+  .rank {
+    position: absolute;
+    top: 16px;
+    left: 16px;
+  }
+
+  .icons {
+    position: absolute;
+    top: 16px;
+    right: 7px;
+    display: flex;
+  }
+
+  .icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: ${colors_1.WhiteColor};
+    border-radius: 6px;
+    width: ${(props) => (props.isMobile ? '24px' : '36px')};
+    height: ${(props) => (props.isMobile ? '24px' : '36px')};
+
+    svg {
+      overflow: visible;
+      will-change: transform;
+      transition: transform 0.2s;
+      transform: scale(1);
+      width: ${(props) => (props.isMobile ? '13px' : '20px')};
+      height: ${(props) => (props.isMobile ? '12px' : '18px')};
+
+      path {
+        fill: ${colors_1.TextDarkGrayColor};
+        transition: fill 0.2s;
+      }
+    }
+
+    :hover svg {
+      transform: scale(1.1);
+      transition: transform 0.2s;
+
+      path {
+        fill: ${colors_1.BlackColor};
+        transition: fill 0.2s;
+      }
+    }
+  }
+
+  .icon.like {
+    margin-left: 12px;
+  }
+
+  .icon.like.liked {
+    svg path {
+      fill: #f94c66;
+    }
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    &:before {
+      height: ${(0, _4k_1.adaptiveValueCalc)(100)};
+      border-top-left-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+      border-top-right-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+    }
+
+    .rank {
+      top: ${(0, _4k_1.adaptiveValueCalc)(16)};
+      left: ${(0, _4k_1.adaptiveValueCalc)(16)};
+    }
+
+    .icons {
+      top: ${(0, _4k_1.adaptiveValueCalc)(16)};
+      right: ${(0, _4k_1.adaptiveValueCalc)(7)};
+    }
+
+    .icon {
+      border-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+      width: ${(props) => (props.isMobile ? '24px' : (0, _4k_1.adaptiveValueCalc)(36))};
+      height: ${(props) => (props.isMobile ? '24px' : (0, _4k_1.adaptiveValueCalc)(36))};
+
+      svg {
+        width: ${(props) => (props.isMobile ? '13px' : (0, _4k_1.adaptiveValueCalc)(20))};
+        height: ${(props) => (props.isMobile ? '12px' : (0, _4k_1.adaptiveValueCalc)(18))};
+      }
+    }
+
+    .icon.like {
+      margin-left: ${(0, _4k_1.adaptiveValueCalc)(12)};
+    }
+  }
+`;
+StyledHeadIcons.defaultProps = {
+    isMobile: false,
+};
+exports.default = StyledHeadIcons;

package/build/system/Cards/Styles/Image.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const StyledImg: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {
+    isLoading: boolean;
+}>> & string;
+export default StyledImg;

package/build/system/Cards/Styles/Image.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+const StyledImg = styled_components_1.default.img `
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+  opacity: ${(props) => (props.isLoading ? '0' : '1')};
+  transition: opacity ease-in 0.3s;
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    border-top-left-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+    border-top-right-radius: ${(0, _4k_1.adaptiveValueCalc)(6)};
+  }
+`;
+exports.default = StyledImg;

package/build/system/Cards/Styles/Likes.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const StyledLikes: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    isLiked: boolean;
+}>> & string;
+export default StyledLikes;

package/build/system/Cards/Styles/Likes.js

@@ -0,0 +1,53 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+const colors_1 = require("@/styles/colors");
+const typography_1 = require("@/styles/typography");
+// Styles
+const StyledLikes = styled_components_1.default.div `
+  display: flex;
+  align-items: end;
+
+  .icon {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 18px;
+    height: 18px;
+    margin-right: 5px;
+
+    path {
+      fill: ${(props) => (props.isLiked ? '#F94C66' : '#cfd5ea')};
+      transition: fill 0.2s;
+    }
+
+    :hover path {
+      fill: ${(props) => (props.isLiked ? '' : '#696F90')};
+    }
+  }
+
+  .counter {
+    ${typography_1.MainText};
+    font-size: 15px;
+    color: ${colors_1.TextGrayColor};
+    line-height: 1;
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    .icon {
+      width: ${(0, _4k_1.adaptiveValueCalc)(18)};
+      height: ${(0, _4k_1.adaptiveValueCalc)(18)};
+      margin-right: ${(0, _4k_1.adaptiveValueCalc)(5)};
+    }
+
+    .counter {
+      font-size: ${(0, _4k_1.adaptiveValueCalc)(15)};
+    }
+  }
+`;
+exports.default = StyledLikes;

package/build/system/Cards/Styles/MultiHead.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const StyledMultiHead: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default StyledMultiHead;

package/build/system/Cards/Styles/MultiHead.js

@@ -0,0 +1,44 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_components_1 = __importDefault(require("styled-components"));
+const _4k_1 = require("@ludo.ninja/ui/build/utils/4k");
+const ScreenWidth_1 = require("@/styles/ScreenWidth");
+// Styles
+const StyledMultiHead = styled_components_1.default.div `
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-auto-rows: 114px;
+  gap: 8px;
+  position: relative;
+  height: 252px;
+  width: 252px;
+  cursor: pointer;
+  padding: 8px;
+
+  @media (max-width: 1200px) {
+    height: 75%;
+    width: 100%;
+    grid-auto-rows: auto;
+    gap: 5.21px;
+    padding: 5.21px;
+  }
+
+  @media (max-width: 767px) {
+    height: 75%;
+    width: 100%;
+    gap: 4px;
+    padding: 4px;
+  }
+
+  ${ScreenWidth_1.mediaQuery.minWidthFourK} {
+    grid-auto-rows: ${(0, _4k_1.adaptiveValueCalc)(114)};
+    gap: ${(0, _4k_1.adaptiveValueCalc)(8)};
+    padding: ${(0, _4k_1.adaptiveValueCalc)(8)};
+    height: ${(0, _4k_1.adaptiveValueCalc)(252)};
+    width: ${(0, _4k_1.adaptiveValueCalc)(252)};
+  }
+`;
+exports.default = StyledMultiHead;

package/build/system/Cards/Styles/Video.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const StyledVideo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").VideoHTMLAttributes<HTMLVideoElement>, HTMLVideoElement>, never>> & string;
+export default StyledVideo;

package/build/system/Cards/Styles/Video.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const styled_components_1 = __importDefault(require("styled-components"));
+const StyledVideo = styled_components_1.default.video `
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+  border-top-left-radius: 6px;
+  border-top-right-radius: 6px;
+`;
+exports.default = StyledVideo;

package/build/system/CardsHolderWithSkeleton/CardsHolder/CardsError/index.d.ts

@@ -0,0 +1,4 @@
+declare const CardsError: ({ refetch }: {
+    refetch: () => Promise<void>;
+}) => import("react/jsx-runtime").JSX.Element;
+export default CardsError;

package/build/system/CardsHolderWithSkeleton/CardsHolder/CardsError/index.js

@@ -0,0 +1,48 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const styled_components_1 = __importDefault(require("styled-components"));
+const animations_1 = require("@/styles/animations");
+const colors_1 = require("@/styles/colors");
+const vars_1 = require("@/fonts/vars");
+const refresh_svg_1 = __importDefault(require("@/public/error/refresh.svg"));
+// Styles
+const StyledCardsError = styled_components_1.default.div `
+  padding-top: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+
+  .icon {
+    margin-bottom: 24px;
+    cursor: pointer;
+    animation: ${animations_1.rotateReverse} 2s infinite linear;
+  }
+  .text {
+    max-width: 308px;
+    text-align: center;
+    color: ${colors_1.TextGrayColor};
+    user-select: none;
+    font-family: ${vars_1.poppinsFontVarCss.css};
+    font-size: 18px;
+    font-weight: 600;
+    line-height: 26px;
+  }
+`;
+// Component
+const CardsError = ({ refetch }) => {
+    const [isAnimated, setIsAnimated] = (0, react_1.useState)(false);
+    const handleAnimation = async () => {
+        setIsAnimated(true);
+        await refetch();
+        setIsAnimated(false);
+    };
+    return ((0, jsx_runtime_1.jsxs)(StyledCardsError, { children: [(0, jsx_runtime_1.jsx)(refresh_svg_1.default, { className: 'icon', onClick: handleAnimation }), !isAnimated && ((0, jsx_runtime_1.jsx)("h2", { className: 'text', children: "Whoops! Something went wrong. Let's try to refresh it!" }))] }));
+};
+// Export
+exports.default = CardsError;

package/build/system/CardsHolderWithSkeleton/CardsHolder/CardsNoResults/index.d.ts

@@ -0,0 +1,4 @@
+declare const CardsNoResults: ({ noFoundText }: {
+    noFoundText: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export default CardsNoResults;

package/build/system/CardsHolderWithSkeleton/CardsHolder/CardsNoResults/index.js

@@ -0,0 +1,34 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const styled_components_1 = __importDefault(require("styled-components"));
+const colors_1 = require("@/styles/colors");
+const typography_1 = require("@/styles/typography");
+const no_found_svg_1 = __importDefault(require("@/public/search/no_found.svg"));
+// Styles
+const StyledNoResults = styled_components_1.default.div `
+  user-select: none;
+  padding-top: 60px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+
+  .icon {
+    margin-bottom: 38px;
+  }
+
+  .text {
+    ${typography_1.FH3};
+    color: ${colors_1.TextGrayColor};
+  }
+`;
+// Component
+const CardsNoResults = ({ noFoundText }) => {
+    return ((0, jsx_runtime_1.jsxs)(StyledNoResults, { children: [(0, jsx_runtime_1.jsx)(no_found_svg_1.default, { className: 'icon' }), (0, jsx_runtime_1.jsx)("p", { className: 'text', children: noFoundText })] }));
+};
+// Export
+exports.default = CardsNoResults;

package/build/system/CardsHolderWithSkeleton/CardsHolder/CardsSkeleton/index.d.ts

@@ -0,0 +1,5 @@
+declare const CardsSkeleton: ({ cardCount }: {
+    cardCount: number;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const CardSkeleton: () => import("react/jsx-runtime").JSX.Element;
+export default CardsSkeleton;