@zoralabs/nft-components - npm Package Compare versions

Comparing version 0.0.19 to 0.0.20

dist/constants/strings.d.ts

@@ -146,2 +146,17 @@ export declare const Strings: {
     /**
+     * Shown on media proposal card for proposed by user
+     * @default Proposed by
+     */
+    PROPOSED_BY: string;
+    /**
+     * Shown on media proposal card for curator share
+     * @default Curator share
+     */
+    PROPOSAL_CURATOR_SHARE: string;
+    /**
+     * Shown on media proposal card for accepted auctions
+     * @default Accepted
+     */
+    PROPOSAL_ACCEPTED: string;
+    /**
      * String to show while pricing is loading
@@ -148,0 +163,0 @@ * @default ...

dist/constants/strings.js

@@ -149,2 +149,17 @@ "use strict";
     /**
+     * Shown on media proposal card for proposed by user
+     * @default Proposed by
+     */
+    PROPOSED_BY: "Proposed by",
+    /**
+     * Shown on media proposal card for curator share
+     * @default Curator share
+     */
+    PROPOSAL_CURATOR_SHARE: "Curator share",
+    /**
+     * Shown on media proposal card for accepted auctions
+     * @default Accepted
+     */
+    PROPOSAL_ACCEPTED: "Accepted",
+    /**
      * String to show while pricing is loading
@@ -151,0 +166,0 @@ * @default ...

dist/constants/style.d.ts

@@ -9,2 +9,6 @@ import { ThemeOptionsType } from "./theme";
         };
+        nftProposalCard: {
+            mediaWidth: string;
+            mediaHeight: string;
+        };
         textBlockPadding: string;
@@ -48,2 +52,6 @@ borderStyle: string;
         fullPageHistoryItem: (theme: ThemeOptionsType) => string[];
+        nftProposalMediaWrapper: (theme: ThemeOptionsType) => string;
+        nftProposalInfoLayout: (theme: ThemeOptionsType) => string;
+        nftProposalActionList: (_: ThemeOptionsType) => string;
+        nftProposalLabel: (theme: ThemeOptionsType) => string[];
         fullPageHistoryItemDatestamp: (theme: ThemeOptionsType) => string[];
@@ -64,2 +72,9 @@ fullPageDataGrid: (_: ThemeOptionsType) => string;
         pricingAmount: (theme: ThemeOptionsType) => string;
+        nftProposal: (theme: ThemeOptionsType) => string;
+        nftProposalActions: () => string;
+        nftProposalActionButton: (theme: ThemeOptionsType, { action }: {
+            action: "approve" | "deny";
+        }) => string;
+        nftProposalAcceptedPill: (theme: ThemeOptionsType) => string;
+        nftProposalTitle: (theme: ThemeOptionsType) => string;
         mediaLoader: (_: ThemeOptionsType, { mediaLoaded, isFullPage }: any) => string;
@@ -66,0 +81,0 @@ mediaObject: (_: ThemeOptionsType, { mediaLoaded, isFullPage }: any) => string;

dist/constants/style.js

@@ -38,2 +38,5 @@ "use strict";
 `;
+function renderSVG(svg) {
+    return `background-image: url("data:image/svg+xml,${encodeURIComponent(svg)}");`;
+}
 exports.Style = {
@@ -124,3 +127,3 @@ theme: theme_1.ThemeOptions,
         fullDescription: (theme) => css_1.css `
-      font-size: ${theme.fontSizeFull};
+      font-size: ${theme.fontSizeFull}px;
       margin: 10px 0;
@@ -130,3 +133,3 @@ `,
             css_1.css `
-        font-size: ${theme.fontSizeFull};
+        font-size: ${theme.fontSizeFull}px;
       `,
@@ -153,2 +156,45 @@ theme.titleFont,
         ],
+        nftProposalMediaWrapper: (theme) => css_1.css `
+      border-radius: 4px;
+      display: flex;
+      height: ${theme.nftProposalCard.mediaHeight};
+      justify-content: center;
+      overflow: hidden;
+      position: relative;
+      width: ${theme.nftProposalCard.mediaWidth};
+    `,
+        nftProposalInfoLayout: (theme) => css_1.css `
+      flex-grow: 1;
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 10px;
+      margin: 0 30px;
+      position: relative;
+
+      &:after {
+        content: " ";
+        position: absolute;
+        top: 10px;
+        bottom: 10px;
+        right: 5px;
+        border-right: ${theme.borderStyle};
+        border-right-width: 1px;
+      }
+    `,
+        nftProposalActionList: (_) => css_1.css `
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      grid-template-rows: repeat(2, 1fr);
+      gap: 10px;
+      padding: 5px 0;
+    `,
+        nftProposalLabel: (theme) => [
+            css_1.css `
+        text-transform: uppercase;
+        font-size: 12px;
+        margin-bottom: 10px;
+        opacity: 0.5;
+      `,
+            theme.bodyFont,
+        ],
         fullPageHistoryItemDatestamp: (theme) => [
@@ -199,3 +245,3 @@ css_1.css `
         opacity: 0.5;
-        background-image: url("data:image/svg+xml,${encodeURIComponent(svg_icons_1.SVG_NEXT_ICON)}");
+        ${renderSVG(svg_icons_1.SVG_NEXT_ICON)}
         color: #eee;
@@ -240,2 +286,43 @@ right: 20px;
         pricingAmount: (theme) => theme.titleFont,
+        nftProposal: (theme) => css_1.css `
+      border: ${theme.borderStyle};
+      border-radius: ${theme.defaultBorderRadius}px;
+      display: flex;
+      padding: 20px;
+    `,
+        nftProposalActions: () => css_1.css `
+      grid-area: 1 / 2 / span 1 / span 2;
+      text-align: right;
+    `,
+        nftProposalActionButton: (theme, { action }) => css_1.css `
+      border-radius: 1000px;
+      background-color: ${theme.buttonColor.background};
+      background-repeat: no-repeat;
+      color: transparent;
+      width: 40px;
+      height: 40px;
+      background-position: center;
+      border: 0;
+      cursor: pointer;
+
+      ${action === "approve" && `margin-right: 15px;`}
+
+      ${action === "approve" && renderSVG(svg_icons_1.SVG_AUCTION_APPROVE)}
+      ${action === "deny" && renderSVG(svg_icons_1.SVG_AUCTION_DENY)}
+    `,
+        nftProposalAcceptedPill: (theme) => css_1.css `
+      color: #009165;
+      background: rgba(64, 193, 154, 0.2);
+      padding: 5px 10px;
+      display: inline-block;
+      border-radius: 4px;
+
+      ${theme.bodyFont}
+    `,
+        nftProposalTitle: (theme) => css_1.css `
+      font-size: 40px;
+      grid-column: 1 / 3;
+
+      ${theme.titleFont}
+    `,
         mediaLoader: (_, { mediaLoaded, isFullPage }) => css_1.css `
@@ -298,3 +385,4 @@ pointer-events: none;
       ${CENTER_FULL_CONTAINER}
-      ${isFullPage ? `
+      ${isFullPage
+            ? `
         opacity: 0;
@@ -306,3 +394,4 @@ &:hover {
         transition-delay: 0 0.3s;
-      ` : "display: none;"}
+      `
+            : "display: none;"}
     `,
@@ -312,3 +401,3 @@ mediaFullscreenButton: (_) => css_1.css `
       background-color: #000;
-      background-image: url("data:image/svg+xml,${encodeURIComponent(svg_icons_1.SVG_FULLSCREEN)}");
+      ${renderSVG(svg_icons_1.SVG_FULLSCREEN)}
     `,
@@ -315,0 +404,0 @@ mediaMuteButton: (_, { muted }) => css_1.css `

dist/constants/svg-icons.d.ts

@@ -7,1 +7,3 @@ export declare const SVG_NEXT_ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 24 24\"><title>arrow-top-right</title><g stroke-linecap=\"square\" stroke-linejoin=\"miter\" stroke-width=\"2\" fill=\"currentColor\" stroke=\"currentColor\"><line fill=\"none\" stroke-miterlimit=\"10\" x1=\"2\" y1=\"22\" x2=\"22\" y2=\"2\" stroke-linecap=\"butt\"></line> <polyline fill=\"none\" stroke=\"currentColor\" stroke-miterlimit=\"10\" points=\"12,2 22,2 22,12 \"></polyline></g></svg>";
 export declare const SVG_FULLSCREEN = "<svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M2 6H0V1C0 0.4 0.4 0 1 0H6V2H2V6Z\" fill=\"white\"/> <path d=\"M16 6H14V2H10V0H15C15.6 0 16 0.4 16 1V6Z\" fill=\"white\"/> <path d=\"M15 16H10V14H14V10H16V15C16 15.6 15.6 16 15 16Z\" fill=\"white\"/> <path d=\"M6 16H1C0.4 16 0 15.6 0 15V10H2V14H6V16Z\" fill=\"white\"/> </svg> ";
+export declare const SVG_AUCTION_APPROVE = "<svg width=\"24\" height=\"18\" viewBox=\"0 0 24 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M2 7.5L9.5 15L22.5 2\" stroke=\"black\" stroke-width=\"3\"/> </svg>";
+export declare const SVG_AUCTION_DENY = "<svg width=\"17\" height=\"17\" viewBox=\"0 0 17 17\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M2 2L8.75 8.75M15.5 15.5L8.75 8.75M8.75 8.75L15.5 2L2 15.5\" stroke=\"black\" stroke-width=\"3\"/> </svg>";

dist/constants/svg-icons.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SVG_FULLSCREEN = exports.SVG_UNMUTED = exports.SVG_MUTED = exports.SVG_PAUSE = exports.SVG_PLAY_ARROW = exports.SVG_NEXT_ICON = void 0;
+exports.SVG_AUCTION_DENY = exports.SVG_AUCTION_APPROVE = exports.SVG_FULLSCREEN = exports.SVG_UNMUTED = exports.SVG_MUTED = exports.SVG_PAUSE = exports.SVG_PLAY_ARROW = exports.SVG_NEXT_ICON = void 0;
 exports.SVG_NEXT_ICON = '<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"><title>arrow-top-right</title><g stroke-linecap="square" stroke-linejoin="miter" stroke-width="2" fill="currentColor" stroke="currentColor"><line fill="none" stroke-miterlimit="10" x1="2" y1="22" x2="22" y2="2" stroke-linecap="butt"></line> <polyline fill="none" stroke="currentColor" stroke-miterlimit="10" points="12,2 22,2 22,12 "></polyline></g></svg>';
@@ -10,1 +10,3 @@ exports.SVG_PLAY_ARROW = '<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M28 16C28 15.7 27.8 15.4 27.6 15.2L9.6 2.19998C9.3 1.99998 8.9 1.89998 8.5 2.09998C8.2 2.29998 8 2.59998 8 2.99998V29C8 29.4 8.2 29.7 8.5 29.9C8.7 30 8.8 30 9 30C9.2 30 9.4 29.9 9.6 29.8L27.6 16.8C27.8 16.6 28 16.3 28 16Z" fill="black"/> </svg>';
 exports.SVG_FULLSCREEN = '<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M2 6H0V1C0 0.4 0.4 0 1 0H6V2H2V6Z" fill="white"/> <path d="M16 6H14V2H10V0H15C15.6 0 16 0.4 16 1V6Z" fill="white"/> <path d="M15 16H10V14H14V10H16V15C16 15.6 15.6 16 15 16Z" fill="white"/> <path d="M6 16H1C0.4 16 0 15.6 0 15V10H2V14H6V16Z" fill="white"/> </svg> ';
+exports.SVG_AUCTION_APPROVE = '<svg width="24" height="18" viewBox="0 0 24 18" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M2 7.5L9.5 15L22.5 2" stroke="black" stroke-width="3"/> </svg>';
+exports.SVG_AUCTION_DENY = '<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M2 2L8.75 8.75M15.5 15.5L8.75 8.75M8.75 8.75L15.5 2L2 15.5" stroke="black" stroke-width="3"/> </svg>';

dist/constants/theme.d.ts

@@ -11,2 +11,6 @@ export declare const ThemeOptions: {
     };
+    nftProposalCard: {
+        mediaWidth: string;
+        mediaHeight: string;
+    };
     /**
@@ -13,0 +17,0 @@ * Padding for preview card text block

dist/constants/theme.js

@@ -14,2 +14,6 @@ "use strict";
     },
+    nftProposalCard: {
+        mediaWidth: '160px',
+        mediaHeight: '160px',
+    },
     /**
@@ -16,0 +20,0 @@ * Padding for preview card text block

dist/context/useMediaContext.d.ts

@@ -14,2 +14,6 @@ import { Strings } from "../constants/strings";
             };
+            nftProposalCard: {
+                mediaWidth: string;
+                mediaHeight: string;
+            };
             textBlockPadding: string;
@@ -42,2 +46,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -69,2 +77,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -96,2 +108,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -123,2 +139,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -150,2 +170,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -177,2 +201,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -206,2 +234,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -233,2 +265,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -260,2 +296,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -287,2 +327,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -314,2 +358,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -341,2 +389,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -368,2 +420,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -395,2 +451,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -422,2 +482,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -443,2 +507,122 @@ borderStyle: string;
             }) => string[];
+            nftProposalMediaWrapper: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
+            nftProposalInfoLayout: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
+            nftProposalActionList: (_: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
+            nftProposalLabel: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string[];
             fullPageHistoryItemDatestamp: (theme: {
@@ -450,2 +634,6 @@ previewCard: {
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -477,2 +665,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -504,2 +696,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -538,2 +734,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -565,2 +765,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -592,2 +796,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -619,2 +827,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -646,2 +858,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -667,2 +883,125 @@ borderStyle: string;
             }) => string;
+            nftProposal: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
+            nftProposalActions: () => string;
+            nftProposalActionButton: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }, { action }: {
+                action: "deny" | "approve";
+            }) => string;
+            nftProposalAcceptedPill: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
+            nftProposalTitle: (theme: {
+                previewCard: {
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
+                textBlockPadding: string;
+                borderStyle: string;
+                lineSpacing: number;
+                maximumPricingDecimals: number;
+                linkColor: string;
+                bodyFont: string;
+                titleFont: string;
+                headerFont: string;
+                mediaContentFont: {
+                    fontFamily: string;
+                };
+                buttonColor: {
+                    primaryBackground: string;
+                    primaryText: string;
+                    background: string;
+                    text: string;
+                };
+                defaultBorderRadius: number;
+                fontSizeFull: number;
+            }) => string;
             mediaLoader: (_: {
@@ -674,2 +1013,6 @@ previewCard: {
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -701,2 +1044,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -728,2 +1075,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -755,2 +1106,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -782,2 +1137,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -809,2 +1168,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -838,2 +1201,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -865,2 +1232,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -892,2 +1263,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -919,2 +1294,6 @@ borderStyle: string;
                 };
+                nftProposalCard: {
+                    mediaWidth: string;
+                    mediaHeight: string;
+                };
                 textBlockPadding: string;
@@ -973,2 +1352,5 @@ borderStyle: string;
         BID_HISTORY_MINTED: string;
+        PROPOSED_BY: string;
+        PROPOSAL_CURATOR_SHARE: string;
+        PROPOSAL_ACCEPTED: string;
         PRICING_LOADING: string;
@@ -975,0 +1357,0 @@ NO_PRICING_PLACEHOLDER: string;

dist/utils/useSyncRef.js

@@ -11,3 +11,3 @@ "use strict";
         if (source && source.current && target) {
-            if (typeof target === 'function') {
+            if (typeof target === "function") {
                 target(source.current);
@@ -14,0 +14,0 @@ }

package.json

 {
   "name": "@zoralabs/nft-components",
-  "version": "0.0.19",
+  "version": "0.0.20",
   "description": "NFT Media Rendering Components",
@@ -5,0 +5,0 @@ "typings": "dist/index.d.ts",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

177899

increased by18.43%

Number of package files

95

increased by9.2%

Lines of code

3956

increased by19.52%

No dependency changes