@ludo.ninja/components 1.1.1 → 1.1.3

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

@@ -1,189 +1,54 @@
+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 { CollectionSlider, Description, DetailsAccordeon, Figcaption, MarketPlaces, Participants, PriceRank, Title, } from '@/components/assetPage';
 import AssetImage from '../media/AssetImage';
-
-var __makeTemplateObject =
-  (this && this.__makeTemplateObject) ||
-  function (cooked, raw) {
-    if (Object.defineProperty) {
-      Object.defineProperty(cooked, 'raw', { value: raw });
-    } else {
-      cooked.raw = raw;
-    }
-    return cooked;
-  };
-
-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 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()} />}
+    // 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()} />
+            ((_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} />
+          <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} />;
+    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;