@ludo.ninja/components 1.1.5 → 1.1.7

package/dist/components/assetPage/figCaption/index.jsx

@@ -1,208 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __generator = (this && this.__generator) || function (thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (g && (g = 0, op[0] && (_ = 0)), _) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-};
-import React, { useMemo } from 'react';
-import Skeleton from 'react-loading-skeleton';
-import styled from 'styled-components';
-import { authCookies } from '@ludo.ninja/api';
-import { alertVariants } from '@ludo.ninja/ui/build/system/Alert/type';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { copyToClipboard } from '@ludo.ninja/utils';
-import { useUserStore } from '@/modules/user/store';
-import { useUiStore } from '@/store/ui';
-import useFetchDynamicAssetLikes from '@/api/server-assets/queries/useFetchDynamicAssetLikes';
-import { ScreenWidth, mediaQuery } from '@/styles/ScreenWidth';
-import { BlackColor, TextDarkGrayColor, TextGrayColor } from '@/styles/colors';
-import AssetLikes from '@/components/assetPage/assetLikes';
-import { MoreDropDown } from '@/components/assetPage/moreDropDown';
-import AddAssetToFavoriteList from '@/components/favoriteList/add/addAssetToFavoriteList';
-import AddAssetToGallery from '@/components/gallery/add/addAssetToGallery';
-// import MoreIcon from '@/public/creation/card/moreBtn.svg';
-import ShareDialog from '@/components/shareDialog';
-import IconWithButton from '@/system/Buttons/IconWithButton';
-import StyledLikes from '@/system/Cards/Styles/Likes';
-import { Flex } from '@system';
-import { getAdaptiveValueWithCheck4k } from '@/utils/adaptive/check4k';
-import { getAdaptiveScale } from '@/utils/adaptive/scale';
-import { useWindowDimensionsWithServerInitial } from '@/utils/screen';
-import GalleryIcon from '@/public/assetPage/favorite.svg';
-import FavoriteIcon from '@/public/assetPage/flag.svg';
-import ShareIcon from '@/public/assetPage/shareWithDots.svg';
-var ImageDetails = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ", ";\n  }\n\n  ", " {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ", ";\n    }\n\n    :hover {\n      path {\n        fill: ", ";\n      }\n    }\n  }\n\n  ", " {\n    margin-top: ", ";\n    width: ", ";\n\n    ", " {\n      margin-right: ", ";\n    }\n  }\n"], ["\n  margin-top: 16px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n    margin-top: 16px;\n  }\n\n  @media (max-width: 767px) {\n    margin-top: 24px;\n    align-items: center;\n    width: 100%;\n    margin-right: 0;\n  }\n\n  h5:hover {\n    color: ", ";\n  }\n\n  ", " {\n    margin-right: 20px;\n    cursor: pointer;\n  }\n\n  .icon.liked {\n    path {\n      fill: #f94c66;\n    }\n  }\n\n  .shareIconStyle {\n    path {\n      stroke: none;\n      fill: ", ";\n    }\n\n    :hover {\n      path {\n        fill: ", ";\n      }\n    }\n  }\n\n  ", " {\n    margin-top: ", ";\n    width: ", ";\n\n    ", " {\n      margin-right: ", ";\n    }\n  }\n"])), mediaQuery.desktop, BlackColor, StyledLikes, TextDarkGrayColor, TextGrayColor, mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(510), StyledLikes, adaptiveValueCalc(20));
-var SIconResizeWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(16));
-export var Figcaption = function (_a) {
-    var _b;
-    var asset = _a.asset;
-    var isSignedIn = useUserStore(function (state) { return state.isSignedIn; });
-    var getUser = useUserStore(function (state) { return state.user; });
-    var _c = useFetchDynamicAssetLikes({
-        assetId: (asset === null || asset === void 0 ? void 0 : asset.getAssetId()) || '',
-    }), likesByUser = _c.likesByUser, isLikedByUser = _c.isLikedByUser, loading = _c.loading;
-    var url = typeof window !== 'undefined'
-        ? window.location.origin + window.location.pathname
-        : null;
-    var _d = useUiStore(function (state) { return ({
-        openModal: state.openModal,
-        closeModal: state.closeModal,
-        openAlert: state.openAlert,
-        openModalSidebarPortal: state.openModalSidebarPortal,
-    }); }), openModal = _d.openModal, closeModal = _d.closeModal, openModalSidebarPortal = _d.openModalSidebarPortal, openAlert = _d.openAlert;
-    var userId = authCookies.getCookies().userId;
-    var _e = useWindowDimensionsWithServerInitial(), windowDimensions = _e.windowDimensions, isMobile = _e.isMobile;
-    var currentDimensions = (windowDimensions === null || windowDimensions === void 0 ? void 0 : windowDimensions.windowWidth) || 1440;
-    // const isCreator = useMemo(
-    //   () =>
-    //     Boolean(
-    //       asset?.getCreatorsProfiles() &&
-    //         asset
-    //           ?.getCreatorsProfiles()
-    //           .filter((item: schema.IProfile) => item?.userId === userId)
-    //     ),
-    //   [asset?.getCreatorsProfiles()]
-    // );
-    var isOwner = useMemo(function () {
-        return (asset === null || asset === void 0 ? void 0 : asset.getOwnersProfiles().filter(function (item) { return (item === null || item === void 0 ? void 0 : item.userId) === userId; }).length) !== 0;
-    }, [asset === null || asset === void 0 ? void 0 : asset.getOwnersProfiles()]);
-    var onShareBtnClick = function () {
-        var title = (asset === null || asset === void 0 ? void 0 : asset.getName()) || undefined;
-        openModal(<ShareDialog link={url} onHide={closeModal} params={{
-                telegram: {
-                    title: title,
-                },
-                whatsapp: {
-                    title: title,
-                },
-                twitter: {
-                    title: title,
-                    hashtags: ['ludo', 'nft'],
-                },
-                reddit: {
-                    title: title,
-                },
-                facebook: {
-                    quote: title,
-                    hashtag: '#ludo',
-                },
-            }}/>);
-    };
-    var onAddFavoriteClick = function () {
-        return openModalSidebarPortal(<AddAssetToFavoriteList ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}/>);
-    };
-    var onAddGalleryClick = function () {
-        return openModalSidebarPortal(<AddAssetToGallery ids={[asset === null || asset === void 0 ? void 0 : asset.getAssetId()]}/>);
-    };
-    return (<ImageDetails>
-      <Flex alignItems="center">
-        {loading ? (<Skeleton style={{
-                borderRadius: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 3,
-                }), "px"),
-                marginRight: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 16.8,
-                }), "px"),
-            }} height="100%" width={"".concat(getAdaptiveValueWithCheck4k({
-                windowDimensions: windowDimensions,
-                currentSize: 30,
-            }), "px")}/>) : (<AssetLikes assetId={(asset === null || asset === void 0 ? void 0 : asset.getAssetId()) || ''} isLikedByUser={isLikedByUser} likesByUser={likesByUser}/>)}
-
-        {isSignedIn && (<>
-            {(((asset === null || asset === void 0 ? void 0 : asset.getCreatorsAddresses()) &&
-                ((_b = asset === null || asset === void 0 ? void 0 : asset.getCreatorsAddresses()) === null || _b === void 0 ? void 0 : _b[0]) === (getUser === null || getUser === void 0 ? void 0 : getUser.wallets[0])) ||
-                isOwner) && (<IconWithButton variant={'figcaption'} text={currentDimensions > ScreenWidth.DESKTOP
-                    ? 'Add to Gallery'
-                    : '+ Gallery'} onClick={onAddGalleryClick}>
-                <SIconResizeWrapper>
-                  <GalleryIcon style={getAdaptiveScale({
-                    windowDimensions: windowDimensions,
-                    currentSize: 1,
-                })}/>
-                </SIconResizeWrapper>
-              </IconWithButton>)}
-            <IconWithButton variant={'figcaption'} text={currentDimensions > ScreenWidth.DESKTOP
-                ? 'Add to Favourite list'
-                : '+Fave list'} onClick={onAddFavoriteClick}>
-              <SIconResizeWrapper>
-                <FavoriteIcon style={getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 })}/>
-              </SIconResizeWrapper>
-            </IconWithButton>
-          </>)}
-      </Flex>
-      <Flex>
-        {!isMobile && (<IconWithButton variant={'share'} text={''} onClick={onShareBtnClick}>
-            <SIconResizeWrapper>
-              <ShareIcon className="shareIconStyle" style={getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 })}/>
-            </SIconResizeWrapper>
-          </IconWithButton>)}
-
-        <MoreDropDown items={[
-            // {
-            //   id: 'make',
-            //   title: 'Make profile picture',
-            // },
-            {
-                id: 'copy',
-                title: 'Copy link',
-                onClick: function () {
-                    return __awaiter(this, void 0, void 0, function () {
-                        return __generator(this, function (_a) {
-                            switch (_a.label) {
-                                case 0: return [4 /*yield*/, copyToClipboard(window.location.href)];
-                                case 1:
-                                    _a.sent();
-                                    openAlert({
-                                        type: alertVariants.copied,
-                                    });
-                                    return [2 /*return*/];
-                            }
-                        });
-                    });
-                },
-            },
-            // {
-            //   id: 'Hide',
-            //   title: 'Hide'
-            // }
-        ]}/>
-      </Flex>
-    </ImageDetails>);
-};
-var templateObject_1, templateObject_2;

package/dist/components/assetPage/index.js

@@ -1,13 +0,0 @@
-export { Participants } from './participants';
-export { Title } from './tittle';
-export { AssetMedia } from './assetNft';
-export { PriceRank } from './priceRank';
-export { Properties } from './properties';
-export { Information } from './information';
-export { DetailsAccordeon } from './detailsAccordeon';
-export { Description } from './description';
-export { MarketPlaces } from './marketPlaces';
-export { CollectionSlider } from './slider';
-export { AudioVideoPlayer } from './audioVideoPlayer';
-export { Viewer3D } from './viewer3D';
-export { Figcaption } from './figCaption';

package/dist/components/assetPage/information/index.jsx

@@ -1,87 +0,0 @@
-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 moment from 'moment';
-import styled from 'styled-components';
-import { BlackColor } from '@ludo.ninja/ui/build/styles/colors';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { shortenedText } from '@ludo.ninja/utils';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { AccentColor, TextGrayColor } from '@/styles/colors';
-import { Flex, H5 } from '@system';
-import { CopyButton } from '@/utils/copyBtn';
-import { getStaticENVDomain } from '@/utils/env';
-import { useWindowDimensions } from '@/utils/screen';
-import { poppinsFontVarCss } from '@/fonts/vars';
-var StyledImage = styled.img(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: 50%;\n  width: 16px;\n  height: 16px;\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  border-radius: 50%;\n  width: 16px;\n  height: 16px;\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(16));
-var BoxOverflow = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  text-align: right;\n  white-space: nowrap;\n  width: 90px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  ", " {\n    width: ", ";\n  }\n"], ["\n  text-align: right;\n  white-space: nowrap;\n  width: 90px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  ", " {\n    width: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(90));
-var FlexOverflow = styled(Flex)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  justify-content: space-between;\n  gap: 8px;\n  margin-bottom: 8px;\n\n  * {\n    white-space: nowrap;\n  }\n\n  ", " {\n    gap: ", ";\n    margin-bottom: ", ";\n  }\n"], ["\n  justify-content: space-between;\n  gap: 8px;\n  margin-bottom: 8px;\n\n  * {\n    white-space: nowrap;\n  }\n\n  ", " {\n    gap: ", ";\n    margin-bottom: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(8), adaptiveValueCalc(8));
-var OverflowH5 = styled(H5)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  text-overflow: ellipsis;\n  overflow: hidden;\n"], ["\n  text-overflow: ellipsis;\n  overflow: hidden;\n"])));
-var SBlockchain = styled(Flex)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  text-align: center;\n  align-items: center;\n  width: max-content;\n  background: ", ";\n  transition: background-color 0.2s ease-in;\n  padding: 4px 8px;\n  border-radius: 6px;\n  gap: 6px;\n\n  p {\n    color: ", ";\n    font-family: ", ";\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 22px;\n  }\n\n  &:hover {\n    background: ", ";\n  }\n\n  ", " {\n    padding: ", " ", ";\n    border-radius: ", ";\n    gap: ", ";\n\n    p {\n      font-size: ", ";\n      line-height: ", ";\n    }\n  }\n"], ["\n  text-align: center;\n  align-items: center;\n  width: max-content;\n  background: ", ";\n  transition: background-color 0.2s ease-in;\n  padding: 4px 8px;\n  border-radius: 6px;\n  gap: 6px;\n\n  p {\n    color: ", ";\n    font-family: ", ";\n    font-size: 15px;\n    font-weight: 500;\n    line-height: 22px;\n  }\n\n  &:hover {\n    background: ", ";\n  }\n\n  ", " {\n    padding: ", " ", ";\n    border-radius: ", ";\n    gap: ", ";\n\n    p {\n      font-size: ", ";\n      line-height: ", ";\n    }\n  }\n"])), function (_a) {
-    var theme = _a.theme;
-    return theme.colors.buttonInactive;
-}, BlackColor, poppinsFontVarCss.css, function (_a) {
-    var theme = _a.theme;
-    return theme.colors.accentHoverBg;
-}, mediaQuery.minWidthFourK, adaptiveValueCalc(4), adaptiveValueCalc(8), adaptiveValueCalc(6), adaptiveValueCalc(6), adaptiveValueCalc(15), adaptiveValueCalc(22));
-var SFlex = styled(Flex)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  margin-bottom: 8px;\n\n  ", " {\n    margin-bottom: ", ";\n  }\n"], ["\n  margin-bottom: 8px;\n\n  ", " {\n    margin-bottom: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(8));
-export var Information = function (_a) {
-    var asset = _a.asset;
-    var tokenId = asset.getTokenId();
-    var splittedAssetId = asset.getSplitedAssetId();
-    var address = asset.getAddress();
-    var blockChain = asset.getBlockchain();
-    var blockTimestamp = asset.getBlockTimestamp();
-    var id = tokenId ? tokenId : splittedAssetId;
-    var idTittle = tokenId ? 'Token ID' : 'ID';
-    var deviceType = useWindowDimensions().deviceType;
-    var isDesktop = deviceType === 'isDesktop';
-    var styleOverflow = isDesktop
-        ? { overflow: 'hidden' }
-        : undefined;
-    return (<Flex flexDirection="column" justifyContent="space-between">
-      <SFlex justifyContent="space-between" alignItems="center">
-        <H5 color={TextGrayColor}>Blockchain</H5>
-        <Link href={"/search/nfts?blockchain=".concat(blockChain.getBlockChainPrivateLabel())}>
-          <SBlockchain>
-            <p>{blockChain.getBlockChainPublicLabel()}</p>
-            <StyledImage width={16} height={16} src={blockChain.getBlockChainIconRegular({
-            domain: getStaticENVDomain(),
-        })} alt={blockChain.getBlockChainPublicLabel()}/>
-          </SBlockchain>
-        </Link>
-      </SFlex>
-      {address && (<FlexOverflow>
-          <H5 color={TextGrayColor}>Contract Address</H5>
-          <CopyButton value={address} style={styleOverflow}>
-            {isDesktop ? (<OverflowH5 color={AccentColor} title={address}>
-                {address}
-              </OverflowH5>) : (<H5 color={AccentColor} title={address}>
-                {shortenedText(address)}
-              </H5>)}
-          </CopyButton>
-        </FlexOverflow>)}
-      <FlexOverflow>
-        <H5 color={TextGrayColor}>{idTittle}</H5>
-        <CopyButton value={id} style={styleOverflow}>
-          {isDesktop ? (<OverflowH5 color={AccentColor} title={id}>
-              {id}
-            </OverflowH5>) : (<BoxOverflow>
-              <H5 color={AccentColor} title={id}>
-                <BoxOverflow>{id}</BoxOverflow>
-              </H5>
-            </BoxOverflow>)}
-        </CopyButton>
-      </FlexOverflow>
-      {blockTimestamp && (<SFlex justifyContent="space-between">
-          <H5 color={TextGrayColor}>Added on</H5>
-          <H5 color={TextGrayColor}>
-            {moment(blockTimestamp * 1000).format('LL')}
-          </H5>
-        </SFlex>)}
-    </Flex>);
-};
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/assetPage/marketPlaces/index.jsx

@@ -1,35 +0,0 @@
-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 { getStaticENVDomain } from '@/utils/env';
-var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: 30px 0 0 0;\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n\n  ", " {\n    margin: 20px 0 0;\n  }\n\n  ", " {\n    margin: ", " 0 0 0;\n  }\n"], ["\n  margin: 30px 0 0 0;\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n\n  ", " {\n    margin: 20px 0 0;\n  }\n\n  ", " {\n    margin: ", " 0 0 0;\n  }\n"])), mediaQuery.tablet, mediaQuery.minWidthFourK, adaptiveValueCalc(30));
-var StyledImage = styled(Image)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  ", ";\n  ", ";\n  border-radius: 6px;\n  margin: 0 7px 6px 0;\n  width: 40px;\n  height: 40px;\n\n  ", " {\n    border-radius: ", ";\n    margin: 0 ", " ", " 0;\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  ", ";\n  ", ";\n  border-radius: 6px;\n  margin: 0 7px 6px 0;\n  width: 40px;\n  height: 40px;\n\n  ", " {\n    border-radius: ", ";\n    margin: 0 ", " ", " 0;\n    width: ", ";\n    height: ", ";\n  }\n"])), BoxShadow, BoxTransform, mediaQuery.minWidthFourK, adaptiveValueCalc(6), adaptiveValueCalc(7), adaptiveValueCalc(6), adaptiveValueCalc(40), adaptiveValueCalc(40));
-var MarketLinkWrapper = function (_a) {
-    var market = _a.market, children = _a.children;
-    if (market.getMarketPlaceUrl()) {
-        return (<Link target="_blank" title={market.getMarketPlaceName()} href={market.getMarketPlaceUrl()}>
-        {children}
-      </Link>);
-    }
-    return <>{children}</>;
-};
-export var MarketPlaces = function (_a) {
-    var markets = _a.markets;
-    return (<Container>
-    {markets === null || markets === void 0 ? void 0 : markets.map(function (market) { return (<MarketLinkWrapper key={market.getMarketPlaceId()} market={market}>
-        <StyledImage width={40} height={40} src={market.getMarketPlaceIconRegular({
-                domain: getStaticENVDomain(),
-            })} alt={market.getMarketPlaceName()}/>
-      </MarketLinkWrapper>); })}
-  </Container>);
-};
-var templateObject_1, templateObject_2;

package/dist/components/assetPage/media/AssetImage/index.jsx

@@ -1,76 +0,0 @@
-var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-};
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import React, { useLayoutEffect, useRef, useState } from 'react';
-import Link from 'next/link';
-import Skeleton from 'react-loading-skeleton';
-import styled, { css } from 'styled-components';
-import { AccentColor, InactiveButtonColor, WhiteColor, } from '@ludo.ninja/ui/build/styles/colors';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { defineImgProportion } from '@/utils/imageProportionsSize';
-import { poppinsFontVarCss } from '@/fonts/vars';
-var SScreenshotContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  border-radius: 16px;\n  overflow: hidden;\n  background-color: ", ";\n  transition: background-color 150ms;\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  .link {\n    display: flex;\n    align-items: center;\n    padding: 10px;\n    width: 100%;\n    height: 48px;\n\n    ", " {\n      height: 42px;\n    }\n\n    span {\n      text-align: center;\n      color: ", ";\n      font-family: ", ";\n      font-size: 15px;\n      font-weight: 500;\n      line-height: 22px;\n      width: 100%;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n\n  ", " {\n    border-radius: ", ";\n\n    .link {\n      padding: ", ";\n      height: ", ";\n\n      span {\n        font-size: ", ";\n        line-height: ", ";\n      }\n    }\n  }\n"], ["\n  border-radius: 16px;\n  overflow: hidden;\n  background-color: ", ";\n  transition: background-color 150ms;\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  .link {\n    display: flex;\n    align-items: center;\n    padding: 10px;\n    width: 100%;\n    height: 48px;\n\n    ", " {\n      height: 42px;\n    }\n\n    span {\n      text-align: center;\n      color: ", ";\n      font-family: ", ";\n      font-size: 15px;\n      font-weight: 500;\n      line-height: 22px;\n      width: 100%;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n\n  ", " {\n    border-radius: ", ";\n\n    .link {\n      padding: ", ";\n      height: ", ";\n\n      span {\n        font-size: ", ";\n        line-height: ", ";\n      }\n    }\n  }\n"])), WhiteColor, InactiveButtonColor, mediaQuery.desktop, AccentColor, poppinsFontVarCss.css, mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(10), adaptiveValueCalc(48), adaptiveValueCalc(15), adaptiveValueCalc(22));
-var ImageContainer = styled.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n  display: flex;\n  position: relative;\n  align-self: center;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n\n  & img {\n    object-fit: contain;\n    aspect-ratio: auto;\n    width: 100%;\n    border-radius: 16px;\n    max-height: 510px;\n    max-width: 510px;\n  }\n\n  ", "\n  ", " {\n    & img {\n      border-radius: ", ";\n      max-height: ", ";\n      max-width: ", ";\n    }\n\n    ", "\n  }\n"], ["\n  display: flex;\n  position: relative;\n  align-self: center;\n  justify-content: center;\n  align-items: center;\n  overflow: hidden;\n\n  & img {\n    object-fit: contain;\n    aspect-ratio: auto;\n    width: 100%;\n    border-radius: 16px;\n    max-height: 510px;\n    max-width: 510px;\n  }\n\n  ", "\n  ", " {\n    & img {\n      border-radius: ", ";\n      max-height: ", ";\n      max-width: ", ";\n    }\n\n    ", "\n  }\n"])), function (props) {
-    return props.isScreenshot
-        ? css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          width: 508px;\n          height: 244px;\n\n          ", " {\n            width: 336px;\n            height: 164px;\n          }\n\n          ", " {\n            width: 320px;\n            height: 154px;\n          }\n        "], ["\n          width: 508px;\n          height: 244px;\n\n          ", " {\n            width: 336px;\n            height: 164px;\n          }\n\n          ", " {\n            width: 320px;\n            height: 154px;\n          }\n        "])), mediaQuery.desktop, mediaQuery.mobile) : css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n          border-radius: 16px;\n          width: 510px;\n          height: 510px;\n\n          ", " {\n            width: 335px;\n            height: 335px;\n          }\n\n          ", " {\n            width: 320px;\n            height: 320px;\n          }\n        "], ["\n          border-radius: 16px;\n          width: 510px;\n          height: 510px;\n\n          ", " {\n            width: 335px;\n            height: 335px;\n          }\n\n          ", " {\n            width: 320px;\n            height: 320px;\n          }\n        "])), mediaQuery.desktop, mediaQuery.mobile);
-}, mediaQuery.minWidthFourK, adaptiveValueCalc(16), adaptiveValueCalc(510), adaptiveValueCalc(510), function (props) {
-    return props.isScreenshot
-        ? css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n            width: ", ";\n            height: ", ";\n          "], ["\n            width: ", ";\n            height: ", ";\n          "])), adaptiveValueCalc(508), adaptiveValueCalc(244)) : css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n            border-radius: ", ";\n            width: ", ";\n            height: ", ";\n          "], ["\n            border-radius: ", ";\n            width: ", ";\n            height: ", ";\n          "])), adaptiveValueCalc(16), adaptiveValueCalc(510), adaptiveValueCalc(510));
-});
-var AssetImage = function (_a) {
-    var imageUrl = _a.imageUrl, errorImg = _a.errorImg, originalUrl = _a.originalUrl, alt = _a.alt, isScreenshot = _a.isScreenshot;
-    var _b = useState({}), size = _b[0], setSize = _b[1];
-    var _c = useState(true), loading = _c[0], setLoading = _c[1];
-    var ref = useRef(null);
-    useLayoutEffect(function () {
-        var _a = defineImgProportion(ref, 80), width = _a.width, height = _a.height;
-        if (imageUrl && parseFloat(height) && parseFloat(width)) {
-            defineImgProportion(ref, 80);
-            setSize({ width: width, height: height });
-        }
-    }, [imageUrl]);
-    var LinkComponent = originalUrl ? Link : React.Fragment;
-    var ScreenShotContainer = isScreenshot
-        ? SScreenshotContainer
-        : React.Fragment;
-    return (<LinkComponent href={"".concat(originalUrl)} target="_blank">
-      <ScreenShotContainer>
-        <ImageContainer isScreenshot={isScreenshot}>
-          {loading && (<Skeleton height={'100%'} width={'100%'} style={{
-                lineHeight: 'normal',
-                position: 'absolute',
-                top: 0,
-                left: 0,
-                visibility: "".concat(loading ? 'hidden' : 'visible'),
-            }}/>)}
-          <img alt={alt} ref={ref} src={imageUrl} onError={function (e) {
-            e.target.src = errorImg;
-            setSize({ width: '100%', height: '100%' });
-        }} onLoad={function () { return setLoading(false); }} style={__assign({ opacity: loading ? '0' : '1' }, (isScreenshot
-            ? {
-                maxHeight: '100%',
-                maxWidth: '100%',
-            }
-            : size))}/>
-        </ImageContainer>
-        {isScreenshot && originalUrl && (<div className="link" title={originalUrl}>
-            <span>{originalUrl}</span>
-          </div>)}
-      </ScreenShotContainer>
-    </LinkComponent>);
-};
-export default AssetImage;
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;

package/dist/components/assetPage/moreDropDown/index.jsx

@@ -1,60 +0,0 @@
-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, { useState } from 'react';
-import styled, { css } from 'styled-components';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { ClickAwayListener } from '@ludo.ninja/utils';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { BackgroundColorLight, BlackColor, TextGrayColor, WhiteColor, } from '@/styles/colors';
-import IconWithButton from '@/system/Buttons/IconWithButton';
-import { getAdaptiveScale } from '@/utils/adaptive/scale';
-import { useWindowDimensionsWithServerInitial } from '@/utils/screen';
-import { dmsansFontVarCss } from '@/fonts/vars';
-import MoreIcon from '@/public/creation/card/moreBtn.svg';
-var SContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n\n  & > *:first-child {\n    width: 24px;\n    height: 24px;\n\n    ", " {\n      width: ", ";\n      height: ", ";\n    }\n  }\n"], ["\n  position: relative;\n\n  & > *:first-child {\n    width: 24px;\n    height: 24px;\n\n    ", " {\n      width: ", ";\n      height: ", ";\n    }\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(24), adaptiveValueCalc(24));
-var SContent = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  position: absolute;\n  padding: 8px;\n  top: calc(100% + 8px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n\n  transition: opacity 200ms;\n\n  pointer-events: ", ";\n  opacity: ", ";\n\n  border-radius: 6px;\n  background: ", ";\n  box-shadow: 0px 8px 16px -16px rgba(33, 21, 95, 0.1);\n  width: 184px;\n\n  ", " {\n    padding: ", ";\n    top: calc(100% + ", ");\n    border-radius: ", ";\n    box-shadow: 0 ", " ", "\n      ", " rgba(33, 21, 95, 0.1);\n    width: ", ";\n  }\n"], ["\n  position: absolute;\n  padding: 8px;\n  top: calc(100% + 8px);\n  right: 0;\n  display: flex;\n  flex-direction: column;\n\n  transition: opacity 200ms;\n\n  pointer-events: ", ";\n  opacity: ", ";\n\n  border-radius: 6px;\n  background: ", ";\n  box-shadow: 0px 8px 16px -16px rgba(33, 21, 95, 0.1);\n  width: 184px;\n\n  ", " {\n    padding: ", ";\n    top: calc(100% + ", ");\n    border-radius: ", ";\n    box-shadow: 0 ", " ", "\n      ", " rgba(33, 21, 95, 0.1);\n    width: ", ";\n  }\n"])), function (props) { return (props.isOpen ? 'unset' : 'none'); }, function (props) { return (props.isOpen ? '1' : '0'); }, WhiteColor, mediaQuery.minWidthFourK, adaptiveValueCalc(8), adaptiveValueCalc(8), adaptiveValueCalc(6), adaptiveValueCalc(8), adaptiveValueCalc(16), adaptiveValueCalc(-16), adaptiveValueCalc(184));
-var hover = css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  color: ", ";\n  border-radius: 4px;\n  background: ", ";\n\n  ", " {\n    border-radius: ", ";\n  }\n"], ["\n  color: ", ";\n  border-radius: 4px;\n  background: ", ";\n\n  ", " {\n    border-radius: ", ";\n  }\n"])), BlackColor, BackgroundColorLight, mediaQuery.minWidthFourK, adaptiveValueCalc(4));
-var SButton = styled.button(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  font-family: ", ";\n  padding: 6px 8px;\n  color: ", ";\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 18px;\n  outline: none;\n  border: none;\n  background: inherit;\n  transition: background-color 200ms;\n  text-align: left;\n\n  &:active {\n    ", "\n  }\n\n  @media (hover: hover) {\n    &:hover {\n      ", "\n    }\n  }\n\n  ", " {\n    padding: ", " ", ";\n    font-size: ", ";\n    line-height: ", ";\n  }\n"], ["\n  font-family: ", ";\n  padding: 6px 8px;\n  color: ", ";\n  font-size: 13px;\n  font-weight: 400;\n  line-height: 18px;\n  outline: none;\n  border: none;\n  background: inherit;\n  transition: background-color 200ms;\n  text-align: left;\n\n  &:active {\n    ", "\n  }\n\n  @media (hover: hover) {\n    &:hover {\n      ", "\n    }\n  }\n\n  ", " {\n    padding: ", " ", ";\n    font-size: ", ";\n    line-height: ", ";\n  }\n"])), dmsansFontVarCss.css, TextGrayColor, hover, hover, mediaQuery.minWidthFourK, adaptiveValueCalc(6), adaptiveValueCalc(8), adaptiveValueCalc(13), adaptiveValueCalc(18));
-var SIcon = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  ", " {\n    width: ", ";\n    height: ", ";\n  }\n"])), mediaQuery.minWidthFourK, adaptiveValueCalc(17), adaptiveValueCalc(4));
-var IconResize = function () {
-    var windowDimensions = useWindowDimensionsWithServerInitial().windowDimensions;
-    return (<SIcon>
-      <MoreIcon style={getAdaptiveScale({
-            windowDimensions: windowDimensions,
-            currentSize: 1,
-        })}/>
-    </SIcon>);
-};
-export var MoreDropDown = function (_a) {
-    var items = _a.items;
-    var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
-    var handle = {
-        close: function () {
-            setIsOpen(false);
-        },
-        toggle: function () {
-            setIsOpen(function (prev) { return !prev; });
-        },
-    };
-    return (<ClickAwayListener onClickAway={handle.close}>
-      <SContainer>
-        <IconWithButton variant={'dots'} onClick={handle.toggle}>
-          <IconResize />
-        </IconWithButton>
-        <SContent isOpen={isOpen}>
-          {items.map(function (_a) {
-            var title = _a.title, onClick = _a.onClick, id = _a.id;
-            return (<SButton key={id} onClick={function () {
-                    onClick === null || onClick === void 0 ? void 0 : onClick();
-                    handle.close();
-                }}>
-              <span>{title}</span>
-            </SButton>);
-        })}
-        </SContent>
-      </SContainer>
-    </ClickAwayListener>);
-};
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5;