@ludo.ninja/components 1.1.6 → 1.1.7

package/dist/components/CreationCard/index.jsx

@@ -1,73 +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 Skeleton from 'react-loading-skeleton';
-import styled, { css } from 'styled-components';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import useLikes from '@/hooks/likes';
-import { getIsActiveCreation, useToGalleryStore, } from '@/hooks/useToGalleryAsset';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { WhiteColor } from '@/styles/colors';
-import BoxShadow from '@/styles/mixins/boxShadow';
-import BoxTransform from '@/styles/mixins/boxTransform';
-import { CardHead } from '@/components/CreationCard/CardHead';
-import CardCheckBox from '@/system/Cards/CardCheckbox';
-import CardContent from '@/system/Cards/CardContent';
-import CardCategory from '@/system/Cards/CardContent/CardCategory';
-import CardLikes from '@/system/Cards/CardContent/CardLikes';
-import StyledCardHead from '@/system/Cards/Styles/Head';
-import StyledHeadIcons from '@/system/Cards/Styles/Headicons';
-import { Flex } from '@system';
-import { isProd } from '@/utils/env';
-// Styles
-var StyledRegularCard = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  position: relative;\n  background-color: ", ";\n  border-radius: 6px;\n  ", ";\n  ", ";\n  // ", "\n\n  min-height: ", ";\n\n  ", "\n  .linkRegularCard {\n    display: flex;\n    height: 100%;\n    flex-direction: column;\n  }\n\n  ", " {\n    width: 164px;\n    min-height: ", ";\n  }\n\n  ", " {\n    width: 154px;\n    min-height: ", ";\n  }\n\n  ", " {\n    border-radius: ", ";\n\n    min-height: ", ";\n  }\n"], ["\n  position: relative;\n  background-color: ", ";\n  border-radius: 6px;\n  ", ";\n  ", ";\n  // ", "\n\n  min-height: ", ";\n\n  ", "\n  .linkRegularCard {\n    display: flex;\n    height: 100%;\n    flex-direction: column;\n  }\n\n  ", " {\n    width: 164px;\n    min-height: ", ";\n  }\n\n  ", " {\n    width: 154px;\n    min-height: ", ";\n  }\n\n  ", " {\n    border-radius: ", ";\n\n    min-height: ", ";\n  }\n"])), WhiteColor, BoxShadow, BoxTransform, function (props) { return (props.isNeedTransform ? null : BoxTransform); }, function (props) { return (props.isNeedHeight ? '346px' : ''); }, function (props) {
-    return props.isShowCheckbox
-        ? css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n          ", " {\n            transition: 0.2s opacity ease-in;\n            opacity: 1 !important;\n          }\n        "], ["\n          ", " {\n            transition: 0.2s opacity ease-in;\n            opacity: 1 !important;\n          }\n        "])), StyledHeadIcons) : css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n          &:hover ", " {\n            transition: 0.2s opacity ease-in;\n            opacity: 1 !important;\n          }\n        "], ["\n          &:hover ", " {\n            transition: 0.2s opacity ease-in;\n            opacity: 1 !important;\n          }\n        "])), StyledHeadIcons);
-}, mediaQuery.maxWidthTablet, function (props) { return (props.isNeedHeight ? '258px' : ''); }, mediaQuery.mobile, function (props) { return (props.isNeedHeight ? '244px' : ''); }, mediaQuery.minWidthFourK, adaptiveValueCalc(6), function (props) {
-    return props.isNeedHeight ? adaptiveValueCalc(346) : '';
-});
-// Component
-export var CreationCardWithCheckboxState = function (props) {
-    var _a = useToGalleryStore(function (state) { return ({
-        toggleCreationToGallery: state.toggleCreationToGallery,
-        isActiveGalleryMode: state.isActiveGalleryMode,
-        creationsToGallery: state.creationsToGallery,
-    }); }), toggleCreationToGallery = _a.toggleCreationToGallery, isActiveGalleryMode = _a.isActiveGalleryMode, creationsToGallery = _a.creationsToGallery;
-    return (<CreationCard {...props} isShowCheckbox={isActiveGalleryMode} isActiveCheckbox={getIsActiveCreation(creationsToGallery, props.creation)} toggleCreationToGallery={toggleCreationToGallery}/>);
-};
-export var CreationCard = function (_a) {
-    var creationName = _a.creationName, creation = _a.creation, isNeedHeight = _a.isNeedHeight, likesDynamicInfo = _a.likesDynamicInfo, toolsForRemove = _a.toolsForRemove, isMobile = _a.isMobile, isLoadingLikes = _a.isLoadingLikes, isNeedShowMoreButton = _a.isNeedShowMoreButton, isUserProfile = _a.isUserProfile, _b = _a.isRegularCard, isRegularCard = _b === void 0 ? true : _b, isShowCheckbox = _a.isShowCheckbox, isActiveCheckbox = _a.isActiveCheckbox, toggleCreationToGallery = _a.toggleCreationToGallery, currentMyGalleryId = _a.currentMyGalleryId;
-    var _c = useLikes({
-        defaultLikesCount: (likesDynamicInfo === null || likesDynamicInfo === void 0 ? void 0 : likesDynamicInfo.likesNum) || creation.getLikes(),
-        defaultIsLiked: (likesDynamicInfo === null || likesDynamicInfo === void 0 ? void 0 : likesDynamicInfo.isLikedByUser) || creation.getIsLiked(),
-        itemType: creation.getItemType(),
-        removeOnDislike: toolsForRemove,
-        isLoadingLikes: isLoadingLikes,
-    }), likes = _c.likes, addLike = _c.addLike, deleteLike = _c.deleteLike;
-    // Todo cardLink
-    var isHide = isProd();
-    var HideLink = isHide ? React.Fragment : Link;
-    return (<StyledRegularCard isNeedHeight={isNeedHeight} isNeedTransform={isNeedShowMoreButton} isShowCheckbox={isShowCheckbox}>
-      {isShowCheckbox && (<CardCheckBox isActiveCheckbox={!!isActiveCheckbox} onChange={function () {
-                toggleCreationToGallery === null || toggleCreationToGallery === void 0 ? void 0 : toggleCreationToGallery(creation);
-            }}/>)}
-      <HideLink className="linkRegularCard" href={creation.getCreationLink()}>
-        <StyledCardHead>
-          {creation.detectMediaType().displaySingleMedia()}
-          <CardHead isRegularCard={!!isRegularCard} isIconLiked={likes.isLiked} creation={creation} addLikeToCard={addLike} deleteLikeFromCard={deleteLike} isUserProfile={isUserProfile || false} isDisabled={!!isLoadingLikes} isShowCheckbox={isShowCheckbox} currentMyGalleryId={currentMyGalleryId}/>
-        </StyledCardHead>
-        <CardContent creationName={creationName} firstName={creation.getCreatorAddress()} secondName={creation.getName()} cuttedSecondName={creation.getCuttedSecondName(!isMobile)} itemId={creation.getItemId()} isNeedShowMoreButton={isNeedShowMoreButton || false} href={creation.getCreationLink()}>
-          <Flex alignItems="end" justifyContent={'space-between'}>
-            <CardCategory label={creation.getLabel()}/>
-            {/* // Todo cardLikes */}
-            {!isProd() &&
-            (isLoadingLikes ? (<Skeleton style={{ borderRadius: '3px' }} height="100%" width="30px"/>) : (<CardLikes isLiked={likes.isLiked} likes={likes.likesCount}/>))}
-          </Flex>
-        </CardContent>
-      </HideLink>
-    </StyledRegularCard>);
-};
-var templateObject_1, templateObject_2, templateObject_3;

package/dist/components/addWalletsRedirectPage/index.js

@@ -1,25 +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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Image from 'next/image';
-import process from 'process';
-import styled from 'styled-components';
-import { getStaticDomain } from '@ludo.ninja/core';
-import { AccentColor, BlackColor, TextGray2Color, } from '@ludo.ninja/ui/build/styles/colors';
-import { rotate } from '@/styles/animations';
-import { Box, Flex, H1, H5 } from '@system';
-// Styles
-var StyledRedirectOpportunityIdPage = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding-top: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  user-select: none;\n\n  .loading {\n    display: inline-block;\n    width: 36px;\n    height: 36px;\n    border: 4px solid ", ";\n    border-radius: 50%;\n    border-top-color: transparent;\n    animation: ", " 1s ease-in-out infinite;\n    margin-top: 16px;\n  }\n"], ["\n  padding-top: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  user-select: none;\n\n  .loading {\n    display: inline-block;\n    width: 36px;\n    height: 36px;\n    border: 4px solid ", ";\n    border-radius: 50%;\n    border-top-color: transparent;\n    animation: ", " 1s ease-in-out infinite;\n    margin-top: 16px;\n  }\n"])), AccentColor, rotate);
-var StyledImage = styled(Image)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-bottom: 16px;\n"], ["\n  margin-bottom: 16px;\n"])));
-// Component
-var AddWalletsRedirectPage = function (_a) {
-    var walletType = _a.walletType;
-    return (_jsx(StyledRedirectOpportunityIdPage, { children: _jsx(Box, { children: _jsx(Flex, { flexDirection: "column", alignItems: 'center', children: _jsx(Box, { mt: 16, children: _jsxs(Flex, { flexDirection: "column", alignItems: 'center', children: [_jsx(StyledImage, { width: 74, height: 74, src: "".concat(getStaticDomain({
-                                    ENV: process.env.NEXT_PUBLIC_STATIC_DOMAIN,
-                                }), "/wallets/regular/").concat(walletType, ".svg"), alt: "".concat(walletType, " icon") }), _jsx(H1, { color: BlackColor, children: "Redirecting..." }), _jsx(H5, { mt: 8, color: TextGray2Color, textAlign: 'center', children: "Please wait while we add your new wallet" }), _jsx("div", { className: 'loading' })] }) }) }) }) }));
-};
-// Export
-export default AddWalletsRedirectPage;
-var templateObject_1, templateObject_2;

package/dist/components/addWalletsRedirectPage/index.jsx

@@ -1,40 +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 process from 'process';
-import styled from 'styled-components';
-import { getStaticDomain } from '@ludo.ninja/core';
-import { AccentColor, BlackColor, TextGray2Color, } from '@ludo.ninja/ui/build/styles/colors';
-import { rotate } from '@/styles/animations';
-import { Box, Flex, H1, H5 } from '@system';
-// Styles
-var StyledRedirectOpportunityIdPage = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding-top: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  user-select: none;\n\n  .loading {\n    display: inline-block;\n    width: 36px;\n    height: 36px;\n    border: 4px solid ", ";\n    border-radius: 50%;\n    border-top-color: transparent;\n    animation: ", " 1s ease-in-out infinite;\n    margin-top: 16px;\n  }\n"], ["\n  padding-top: 28px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  user-select: none;\n\n  .loading {\n    display: inline-block;\n    width: 36px;\n    height: 36px;\n    border: 4px solid ", ";\n    border-radius: 50%;\n    border-top-color: transparent;\n    animation: ", " 1s ease-in-out infinite;\n    margin-top: 16px;\n  }\n"])), AccentColor, rotate);
-var StyledImage = styled(Image)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  margin-bottom: 16px;\n"], ["\n  margin-bottom: 16px;\n"])));
-// Component
-var AddWalletsRedirectPage = function (_a) {
-    var walletType = _a.walletType;
-    return (<StyledRedirectOpportunityIdPage>
-      <Box>
-        <Flex flexDirection="column" alignItems={'center'}>
-          <Box mt={16}>
-            <Flex flexDirection="column" alignItems={'center'}>
-              <StyledImage width={74} height={74} src={"".concat(getStaticDomain({
-            ENV: process.env.NEXT_PUBLIC_STATIC_DOMAIN,
-        }), "/wallets/regular/").concat(walletType, ".svg")} alt={"".concat(walletType, " icon")}/>
-              <H1 color={BlackColor}>Redirecting...</H1>
-              <H5 mt={8} color={TextGray2Color} textAlign={'center'}>
-                {"Please wait while we add your new wallet"}
-              </H5>
-              <div className={'loading'}/>
-            </Flex>
-          </Box>
-        </Flex>
-      </Box>
-    </StyledRedirectOpportunityIdPage>);
-};
-// Export
-export default AddWalletsRedirectPage;
-var templateObject_1, templateObject_2;

package/dist/components/assetJSONLD.js

@@ -1,27 +0,0 @@
-// import { schema } from '@ludo.ninja/api';
-export var assetJSONLD = function () {
-    // const imageUrl = asset.medias?.[0]?.url;
-    // const user = asset.creatorsProfiles?.[0]?.username;
-    //
-    // return {
-    //   __html: `{
-    //     "@context": "http://schema.org",
-    //     "@type": "Article",
-    //     "mainEntityOfPage": {
-    //       "@type": "WebPage",
-    //       "@id": "${url}"
-    //     },
-    //     "headline": "${asset.name}",
-    //     "image": [
-    //       "${imageUrl}"
-    //     ],
-    //     "datePublished": "${Date.now().toString()}",
-    //     "dateModified": "${Date.now().toString()}",
-    //     "author": {
-    //       "@type": "Person",
-    //       "name": "${user}"
-    //     },
-    //     "description": "${asset.description}"
-    //   }`,
-    // };
-};

package/dist/components/assetJSONLD.jsx

@@ -1,27 +0,0 @@
-// import { schema } from '@ludo.ninja/api';
-export var assetJSONLD = function () {
-  // const imageUrl = asset.medias?.[0]?.url;
-  // const user = asset.creatorsProfiles?.[0]?.username;
-  //
-  // return {
-  //   __html: `{
-  //     "@context": "http://schema.org",
-  //     "@type": "Article",
-  //     "mainEntityOfPage": {
-  //       "@type": "WebPage",
-  //       "@id": "${url}"
-  //     },
-  //     "headline": "${asset.name}",
-  //     "image": [
-  //       "${imageUrl}"
-  //     ],
-  //     "datePublished": "${Date.now().toString()}",
-  //     "dateModified": "${Date.now().toString()}",
-  //     "author": {
-  //       "@type": "Person",
-  //       "name": "${user}"
-  //     },
-  //     "description": "${asset.description}"
-  //   }`,
-  // };
-};

package/dist/components/assetPage/assetLikes/index.js

@@ -1,53 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
-import Skeleton from 'react-loading-skeleton';
-import useLikes from '@/hooks/likes';
-import { useUserStore } from '@/modules/user/store';
-import IconWithButton from '@/system/Buttons/IconWithButton';
-import { getAdaptiveValueWithCheck4k } from '@/utils/adaptive/check4k';
-import { getAdaptiveScale } from '@/utils/adaptive/scale';
-import { redirectToLoginWindow } from '@/utils/auth';
-import { useWindowDimensionsWithServerInitial } from '@/utils/screen';
-import { LabelKeys } from '@/dto/common/ItemType';
-import HeartIcon from '@/public/showCaseIcons/heart.svg';
-var AssetLikes = function (_a) {
-    var assetId = _a.assetId, likesByUser = _a.likesByUser, isLikedByUser = _a.isLikedByUser;
-    var isSignedIn = useUserStore(function (state) { return state.isSignedIn; });
-    var _b = useLikes({
-        defaultLikesCount: likesByUser,
-        defaultIsLiked: isLikedByUser,
-        itemType: LabelKeys.asset,
-    }), likes = _b.likes, addLike = _b.addLike, deleteLike = _b.deleteLike, isLoading = _b.isLoading;
-    var handleLikes = function (isLiked) {
-        if (!isSignedIn) {
-            redirectToLoginWindow();
-        }
-        else {
-            !isLiked ? addLike(assetId) : deleteLike(assetId);
-        }
-    };
-    var onLikeBtnClick = function () { return handleLikes(likes.isLiked); };
-    var windowDimensions = useWindowDimensionsWithServerInitial().windowDimensions;
-    return (_jsx(_Fragment, { children: isLoading ? (_jsx(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") })) : (_jsx(IconWithButton, { variant: 'figcaption', text: likes.likesCount, onClick: onLikeBtnClick, children: _jsx("div", { style: {
-                    width: "".concat(getAdaptiveValueWithCheck4k({
-                        windowDimensions: windowDimensions,
-                        currentSize: 18,
-                    }), "px"),
-                    height: "".concat(getAdaptiveValueWithCheck4k({
-                        windowDimensions: windowDimensions,
-                        currentSize: 18,
-                    }), "px"),
-                }, children: _jsx(HeartIcon, { className: "icon ".concat(likes.isLiked ? 'liked' : ''), style: getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 }) }) }) })) }));
-};
-export default AssetLikes;

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

@@ -1,59 +0,0 @@
-import React from 'react';
-import Skeleton from 'react-loading-skeleton';
-import useLikes from '@/hooks/likes';
-import { useUserStore } from '@/modules/user/store';
-import IconWithButton from '@/system/Buttons/IconWithButton';
-import { getAdaptiveValueWithCheck4k } from '@/utils/adaptive/check4k';
-import { getAdaptiveScale } from '@/utils/adaptive/scale';
-import { redirectToLoginWindow } from '@/utils/auth';
-import { useWindowDimensionsWithServerInitial } from '@/utils/screen';
-import { LabelKeys } from '@/dto/common/ItemType';
-import HeartIcon from '@/public/showCaseIcons/heart.svg';
-var AssetLikes = function (_a) {
-    var assetId = _a.assetId, likesByUser = _a.likesByUser, isLikedByUser = _a.isLikedByUser;
-    var isSignedIn = useUserStore(function (state) { return state.isSignedIn; });
-    var _b = useLikes({
-        defaultLikesCount: likesByUser,
-        defaultIsLiked: isLikedByUser,
-        itemType: LabelKeys.asset,
-    }), likes = _b.likes, addLike = _b.addLike, deleteLike = _b.deleteLike, isLoading = _b.isLoading;
-    var handleLikes = function (isLiked) {
-        if (!isSignedIn) {
-            redirectToLoginWindow();
-        }
-        else {
-            !isLiked ? addLike(assetId) : deleteLike(assetId);
-        }
-    };
-    var onLikeBtnClick = function () { return handleLikes(likes.isLiked); };
-    var windowDimensions = useWindowDimensionsWithServerInitial().windowDimensions;
-    return (<>
-      {isLoading ? (<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")}/>) : (<IconWithButton variant={'figcaption'} text={likes.likesCount} onClick={onLikeBtnClick}>
-          <div style={{
-                width: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 18,
-                }), "px"),
-                height: "".concat(getAdaptiveValueWithCheck4k({
-                    windowDimensions: windowDimensions,
-                    currentSize: 18,
-                }), "px"),
-            }}>
-            <HeartIcon className={"icon ".concat(likes.isLiked ? 'liked' : '')} style={getAdaptiveScale({ windowDimensions: windowDimensions, currentSize: 1 })}/>
-          </div>
-        </IconWithButton>)}
-    </>);
-};
-export default AssetLikes;

package/dist/components/assetPage/assetNft/index.js

@@ -1,23 +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 { jsx as _jsx } from "react/jsx-runtime";
-import styled from 'styled-components';
-import { isImage } from '@ludo.ninja/core';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { Box, ExternalImage, Flex } from '@system';
-var ResponsiveImage = styled(ExternalImage)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  max-width: 320px;\n  max-height: 320px;\n\n  ", " {\n    max-width: 336px;\n    max-height: 336px;\n  }\n\n  ", " {\n    max-width: 508px;\n    max-height: 508px;\n  }\n"], ["\n  max-width: 320px;\n  max-height: 320px;\n\n  ", " {\n    max-width: 336px;\n    max-height: 336px;\n  }\n\n  ", " {\n    max-width: 508px;\n    max-height: 508px;\n  }\n"])), mediaQuery.tablet, mediaQuery.desktop);
-var EmptyState = function () { return (_jsx(Flex, { justifyContent: "center", children: _jsx(Box, { borderRadius: 16, overflow: "hidden" }) })); };
-export var AssetMedia = function (_a) {
-    var medias = _a.medias;
-    if (!(medias === null || medias === void 0 ? void 0 : medias.length) || medias.length > 1 || !medias[0])
-        return _jsx(EmptyState, {});
-    var media = medias[0];
-    var url = media.url, mimeType = media.mimeType;
-    if (url && isImage({ media: url, mimeType: mimeType, originalMimeType: null })) {
-        return (_jsx(Flex, { justifyContent: "center", children: _jsx(Box, { borderRadius: 16, overflow: "hidden", children: _jsx(ResponsiveImage, { src: url }) }) }));
-    }
-    return _jsx(EmptyState, {});
-};
-var templateObject_1;

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

@@ -1,29 +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 styled from 'styled-components';
-import { isImage } from '@ludo.ninja/core';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { Box, ExternalImage, Flex } from '@system';
-var ResponsiveImage = styled(ExternalImage)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  max-width: 320px;\n  max-height: 320px;\n\n  ", " {\n    max-width: 336px;\n    max-height: 336px;\n  }\n\n  ", " {\n    max-width: 508px;\n    max-height: 508px;\n  }\n"], ["\n  max-width: 320px;\n  max-height: 320px;\n\n  ", " {\n    max-width: 336px;\n    max-height: 336px;\n  }\n\n  ", " {\n    max-width: 508px;\n    max-height: 508px;\n  }\n"])), mediaQuery.tablet, mediaQuery.desktop);
-var EmptyState = function () { return (<Flex justifyContent="center">
-    <Box borderRadius={16} overflow="hidden"/>
-  </Flex>); };
-export var AssetMedia = function (_a) {
-    var medias = _a.medias;
-    if (!(medias === null || medias === void 0 ? void 0 : medias.length) || medias.length > 1 || !medias[0])
-        return <EmptyState />;
-    var media = medias[0];
-    var url = media.url, mimeType = media.mimeType;
-    if (url && isImage({ media: url, mimeType: mimeType, originalMimeType: null })) {
-        return (<Flex justifyContent="center">
-        <Box borderRadius={16} overflow="hidden">
-          <ResponsiveImage src={url}/>
-        </Box>
-      </Flex>);
-    }
-    return <EmptyState />;
-};
-var templateObject_1;

package/dist/components/assetPage/assetWrapper/index.js

@@ -1,37 +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 { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import styled from 'styled-components';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { useFetchAssetByBlockchain } from '@/api/server-assets/queries/useFetchAssetByBlockchain';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { CollectionSlider, Description, DetailsAccordeon, Figcaption, MarketPlaces, Participants, PriceRank, Title, } from '@/components/assetPage';
-import AssetImage from '../media/AssetImage';
-var AvatarContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n  margin-right: 60px;\n\n  ", " {\n    width: 335px;\n    margin-right: 30px;\n  }\n\n  ", " {\n    margin-right: 0;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: flex;\n\n    ", " {\n      display: none;\n    }\n  }\n\n  ", " {\n    width: ", ";\n    margin-right: ", ";\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n  margin-right: 60px;\n\n  ", " {\n    width: 335px;\n    margin-right: 30px;\n  }\n\n  ", " {\n    margin-right: 0;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: flex;\n\n    ", " {\n      display: none;\n    }\n  }\n\n  ", " {\n    width: ", ";\n    margin-right: ", ";\n  }\n"])), mediaQuery.desktop, mediaQuery.tablet, mediaQuery.mobile, mediaQuery.tablet, mediaQuery.minWidthFourK, adaptiveValueCalc(510), adaptiveValueCalc(60));
-var Wrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  flex-direction: row;\n  align-items: flex-start;\n\n  ", " {\n    flex-direction: column;\n    align-items: center;\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  flex-direction: row;\n  align-items: flex-start;\n\n  ", " {\n    flex-direction: column;\n    align-items: center;\n  }\n"])), mediaQuery.tablet);
-var Container = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: none;\n\n    ", " {\n      display: flex;\n      margin-bottom: 25px;\n    }\n  }\n  ", " {\n    width: ", ";\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: none;\n\n    ", " {\n      display: flex;\n      margin-bottom: 25px;\n    }\n  }\n  ", " {\n    width: ", ";\n  }\n"])), mediaQuery.desktop, mediaQuery.mobile, mediaQuery.tablet, mediaQuery.minWidthFourK, adaptiveValueCalc(510));
-var AssetComponents = function (_a) {
-    // const file2D = '/test/test.svg';
-    // const file3D =
-    // 'https://nfts.snowx.com/0xfe2674e976884844db9ff5e49b6bbca878ddac2d/2-artwork.glb';
-    // 'https://ipfs.io/ipfs/QmPsVLBHhczr6uF6AaWsS2fUcWuMFHBsUZi3BGKgSsDpxJ/2109.glb';
-    // const audio = "https://storage.googleapis.com/media-session/elephants-dream/the-wires.mp3";
-    // const video = "https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/360/Big_Buck_Bunny_360_10s_1MB.mp4";
-    var _b, _c;
-    var clientData = _a.clientData;
-    var isSlider = clientData.getIsSlider();
-    var markets = clientData.getMarkets();
-    return (_jsxs(_Fragment, { children: [isSlider && _jsx(CollectionSlider, { medias: clientData.getAssetMediaType() }), _jsxs(Wrapper, { children: [_jsxs(AvatarContainer, { children: [!isSlider &&
-                                ((_c = (_b = clientData.getAssetMediaType()[0]) === null || _b === void 0 ? void 0 : _b.displayLinkedMedia()) !== null && _c !== void 0 ? _c : (_jsx(AssetImage, { alt: "".concat(clientData.getName(), " ").concat(clientData.getAddress() || ''), imageUrl: '/noContent/noContent.svg', errorImg: '/noContent/noContent.svg' }))), _jsx(Figcaption, { asset: clientData }), _jsx(Description, { description: clientData.getDescription() })] }), _jsxs(Container, { children: [_jsx(Title, { collectionId: clientData.getCollection().collectionId, collectionTitle: clientData.getCollection().collectionTitle, collectionMedias: clientData.getCollection().collectionMedias, name: clientData.getName() }), _jsx(Participants, { creatorsAddresses: clientData.getCreatorsAddresses(), creatorsProfiles: clientData.getCreatorsProfiles(), ownersAddresses: clientData.getOwnersAddresses(), ownersProfiles: clientData.getOwnersProfiles() }), _jsx(PriceRank, { latestPriceAmount: clientData.getPrice().latestPriceAmount, latestPriceCurrency: clientData.getPrice().latestPriceCurrency, rank: clientData.getRank(), blockchain: clientData.getBlockchain() }), markets && _jsx(MarketPlaces, { markets: markets }), _jsx(Description, { description: clientData.getDescription() }), _jsx(DetailsAccordeon, { asset: clientData })] })] })] }));
-};
-var AssetWrapper = function (_a) {
-    var blockchain = _a.blockchain, address = _a.address, elrondId = _a.elrondId, tokenId = _a.tokenId;
-    var _b = useFetchAssetByBlockchain({ blockchain: blockchain, address: address, tokenId: tokenId, elrondId: elrondId }, null), clientData = _b.clientData, loading = _b.loading, error = _b.error;
-    if (loading || error || !clientData)
-        return null;
-    return _jsx(AssetComponents, { clientData: clientData });
-};
-export default AssetWrapper;
-var templateObject_1, templateObject_2, templateObject_3;

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

@@ -1,54 +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 styled from 'styled-components';
-import { adaptiveValueCalc } from '@ludo.ninja/ui/build/utils/4k';
-import { useFetchAssetByBlockchain } from '@/api/server-assets/queries/useFetchAssetByBlockchain';
-import { mediaQuery } from '@/styles/ScreenWidth';
-import { CollectionSlider, Description, DetailsAccordeon, Figcaption, MarketPlaces, Participants, PriceRank, Title, } from '@/components/assetPage';
-import AssetImage from '../media/AssetImage';
-var AvatarContainer = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n  margin-right: 60px;\n\n  ", " {\n    width: 335px;\n    margin-right: 30px;\n  }\n\n  ", " {\n    margin-right: 0;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: flex;\n\n    ", " {\n      display: none;\n    }\n  }\n\n  ", " {\n    width: ", ";\n    margin-right: ", ";\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n  margin-right: 60px;\n\n  ", " {\n    width: 335px;\n    margin-right: 30px;\n  }\n\n  ", " {\n    margin-right: 0;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: flex;\n\n    ", " {\n      display: none;\n    }\n  }\n\n  ", " {\n    width: ", ";\n    margin-right: ", ";\n  }\n"])), mediaQuery.desktop, mediaQuery.tablet, mediaQuery.mobile, mediaQuery.tablet, mediaQuery.minWidthFourK, adaptiveValueCalc(510), adaptiveValueCalc(60));
-var Wrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: flex;\n  justify-content: center;\n  flex-direction: row;\n  align-items: flex-start;\n\n  ", " {\n    flex-direction: column;\n    align-items: center;\n  }\n"], ["\n  display: flex;\n  justify-content: center;\n  flex-direction: row;\n  align-items: flex-start;\n\n  ", " {\n    flex-direction: column;\n    align-items: center;\n  }\n"])), mediaQuery.tablet);
-var Container = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: none;\n\n    ", " {\n      display: flex;\n      margin-bottom: 25px;\n    }\n  }\n  ", " {\n    width: ", ";\n  }\n"], ["\n  display: flex;\n  flex-direction: column;\n  width: 510px;\n\n  ", " {\n    width: 335px;\n  }\n\n  ", " {\n    width: 320px;\n  }\n\n  .description {\n    display: none;\n\n    ", " {\n      display: flex;\n      margin-bottom: 25px;\n    }\n  }\n  ", " {\n    width: ", ";\n  }\n"])), mediaQuery.desktop, mediaQuery.mobile, mediaQuery.tablet, mediaQuery.minWidthFourK, adaptiveValueCalc(510));
-var AssetComponents = function (_a) {
-    // const file2D = '/test/test.svg';
-    // const file3D =
-    // 'https://nfts.snowx.com/0xfe2674e976884844db9ff5e49b6bbca878ddac2d/2-artwork.glb';
-    // 'https://ipfs.io/ipfs/QmPsVLBHhczr6uF6AaWsS2fUcWuMFHBsUZi3BGKgSsDpxJ/2109.glb';
-    // const audio = "https://storage.googleapis.com/media-session/elephants-dream/the-wires.mp3";
-    // const video = "https://test-videos.co.uk/vids/bigbuckbunny/mp4/h264/360/Big_Buck_Bunny_360_10s_1MB.mp4";
-    var _b, _c;
-    var clientData = _a.clientData;
-    var isSlider = clientData.getIsSlider();
-    var markets = clientData.getMarkets();
-    return (<>
-      {isSlider && <CollectionSlider medias={clientData.getAssetMediaType()}/>}
-      <Wrapper>
-        <AvatarContainer>
-          {!isSlider &&
-            ((_c = (_b = clientData.getAssetMediaType()[0]) === null || _b === void 0 ? void 0 : _b.displayLinkedMedia()) !== null && _c !== void 0 ? _c : (<AssetImage alt={"".concat(clientData.getName(), " ").concat(clientData.getAddress() || '')} imageUrl={'/noContent/noContent.svg'} errorImg={'/noContent/noContent.svg'}/>))}
-          <Figcaption asset={clientData}/>
-          <Description description={clientData.getDescription()}/>
-        </AvatarContainer>
-        <Container>
-          <Title collectionId={clientData.getCollection().collectionId} collectionTitle={clientData.getCollection().collectionTitle} collectionMedias={clientData.getCollection().collectionMedias} name={clientData.getName()}/>
-          <Participants creatorsAddresses={clientData.getCreatorsAddresses()} creatorsProfiles={clientData.getCreatorsProfiles()} ownersAddresses={clientData.getOwnersAddresses()} ownersProfiles={clientData.getOwnersProfiles()}/>
-          <PriceRank latestPriceAmount={clientData.getPrice().latestPriceAmount} latestPriceCurrency={clientData.getPrice().latestPriceCurrency} rank={clientData.getRank()} blockchain={clientData.getBlockchain()}/>
-          {markets && <MarketPlaces markets={markets}/>}
-          <Description description={clientData.getDescription()}/>
-          <DetailsAccordeon asset={clientData}/>
-        </Container>
-      </Wrapper>
-    </>);
-};
-var AssetWrapper = function (_a) {
-    var blockchain = _a.blockchain, address = _a.address, elrondId = _a.elrondId, tokenId = _a.tokenId;
-    var _b = useFetchAssetByBlockchain({ blockchain: blockchain, address: address, tokenId: tokenId, elrondId: elrondId }, null), clientData = _b.clientData, loading = _b.loading, error = _b.error;
-    if (loading || error || !clientData)
-        return null;
-    return <AssetComponents clientData={clientData}/>;
-};
-export default AssetWrapper;
-var templateObject_1, templateObject_2, templateObject_3;

package/dist/components/assetPage/audioVideoPlayer/Duration.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { InactiveButtonColor } from '@/styles/colors';
-import { H5 } from '@system';
-export default function Duration(_a) {
-    var seconds = _a.seconds;
-    return (_jsx("time", { dateTime: "P".concat(Math.round(seconds), "S"), children: _jsx(H5, { color: InactiveButtonColor, children: format(seconds) }) }));
-}
-function format(seconds) {
-    var date = new Date(seconds * 1000);
-    var hh = date.getUTCHours();
-    var mm = date.getUTCMinutes();
-    var ss = pad(date.getUTCSeconds());
-    if (hh) {
-        return "".concat(hh, ":").concat(pad(mm), ":").concat(ss);
-    }
-    return "".concat(mm, ":").concat(ss);
-}
-function pad(string) {
-    return ('0' + string).slice(-2);
-}

package/dist/components/assetPage/audioVideoPlayer/Duration.jsx

@@ -1,27 +0,0 @@
-import React from 'react';
-
-import { InactiveButtonColor } from '@/styles/colors';
-
-import { H5 } from '@system';
-
-export default function Duration(_a) {
-  var seconds = _a.seconds;
-  return (
-    <time dateTime={'P'.concat(Math.round(seconds), 'S')}>
-      <H5 color={InactiveButtonColor}>{format(seconds)}</H5>
-    </time>
-  );
-}
-function format(seconds) {
-  var date = new Date(seconds * 1000);
-  var hh = date.getUTCHours();
-  var mm = date.getUTCMinutes();
-  var ss = pad(date.getUTCSeconds());
-  if (hh) {
-    return ''.concat(hh, ':').concat(pad(mm), ':').concat(ss);
-  }
-  return ''.concat(mm, ':').concat(ss);
-}
-function pad(string) {
-  return ('0' + string).slice(-2);
-}