@zoralabs/nft-components - npm Package Compare versions

Comparing version 0.1.11 to 0.1.12

dist/components/CountdownDisplay.d.ts

@@ -6,2 +6,17 @@ /// <reference types="react" />
 };
+export declare const TimeDisplayMap: {
+    d: string;
+    h: string;
+    m: string;
+    s: string;
+};
+export declare const splitDurationSegments: (difference: number) => {
+    d: number;
+    h: number;
+    m: number;
+    s: number;
+};
+export declare const DurationDisplay: ({ duration }: {
+    duration: number;
+}) => JSX.Element;
 export declare const CountdownDisplay: (props: CountdownDisplayProps) => JSX.Element;

dist/components/CountdownDisplay.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CountdownDisplay = void 0;
+exports.CountdownDisplay = exports.DurationDisplay = exports.splitDurationSegments = exports.TimeDisplayMap = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
@@ -12,18 +12,50 @@ const react_1 = require("react");
 }
-const CountdownDisplay = (props) => {
-    const getTimeLeft = (to, from) => {
-        if (!from) {
-            return null;
+exports.TimeDisplayMap = {
+    d: "day",
+    h: "hour",
+    m: "minute",
+    s: "second",
+};
+const splitDurationSegments = (difference) => ({
+    d: Math.floor(difference / (3600 * 24)),
+    h: Math.floor(difference / 3600) % 24,
+    m: Math.floor((difference / 60) % 60),
+    s: Math.floor(difference % 60),
+});
+exports.splitDurationSegments = splitDurationSegments;
+const getTimeLeft = (to, from) => {
+    if (from === undefined) {
+        return null;
+    }
+    let difference = to - from;
+    if (difference < 0) {
+        difference = 0;
+    }
+    return exports.splitDurationSegments(difference);
+};
+const DurationDisplay = ({ duration }) => {
+    const renderSegmentText = (segmentName, segmentValue) => {
+        if (segmentValue === 0) {
+            return "";
         }
-        let difference = to - from;
-        if (difference < 0) {
-            difference = 0;
+        if (segmentValue === 1) {
+            return `${segmentValue} ${exports.TimeDisplayMap[segmentName]}`;
         }
-        return {
-            d: Math.floor(difference / (3600 * 24)),
-            h: Math.floor(difference / 3600) % 24,
-            m: Math.floor((difference / 60) % 60),
-            s: Math.floor(difference % 60),
-        };
+        return `${segmentValue} ${exports.TimeDisplayMap[segmentName]}s`;
     };
+    const durationSegments = exports.splitDurationSegments(duration);
+    const singleSegment = Object.values(durationSegments)
+        .map((segment) => segment === 0)
+        .reduce((last, now) => last + (now ? 0 : 1), 0);
+    if (singleSegment <= 1) {
+        return (jsx_runtime_1.jsx(react_1.Fragment, { children: Object.keys(durationSegments)
+                .map((segment) => 
+            // @ts-ignore: ignoring due to key type erasure with string
+            renderSegmentText(segment, durationSegments[segment]))
+                .join("") }, void 0));
+    }
+    return jsx_runtime_1.jsx(exports.CountdownDisplay, { from: 0, to: duration }, void 0);
+};
+exports.DurationDisplay = DurationDisplay;
+const CountdownDisplay = (props) => {
     const [timeLeft, setTimeLeft] = react_1.useState(getTimeLeft(getNumber(props.to), getNumber(props.from === undefined ? new Date().getTime() / 1000 : props.from)));
@@ -30,0 +62,0 @@ const updateTimeLeft = react_1.useCallback(() => {

dist/constants/strings.d.ts

@@ -101,2 +101,7 @@ export declare const Strings: {
     /**
+     * Title for auction duration informationbox
+     * @default Auction duration
+     */
+    AUCTION_PENDING_DURATION: string;
+    /**
      * Header for the box to show creator equity
@@ -107,2 +112,12 @@ * @default Creator equity
     /**
+     * Information for curator fee box header
+     * @default Curator fee
+     */
+    CURATOR_FEE: string;
+    /**
+     * Header showing curator information on NFT full page
+     * @default  of proceeds go to the curator
+     */
+    CURATOR_PROCEEDS_DESC: string;
+    /**
      * Sold for view on full view page auction info box
@@ -109,0 +124,0 @@ * @default Sold for

dist/constants/strings.js

@@ -104,2 +104,7 @@ "use strict";
     /**
+     * Title for auction duration informationbox
+     * @default Auction duration
+     */
+    AUCTION_PENDING_DURATION: "Duration",
+    /**
      * Header for the box to show creator equity
@@ -110,2 +115,12 @@ * @default Creator equity
     /**
+     * Information for curator fee box header
+     * @default Curator fee
+     */
+    CURATOR_FEE: "Curator fee",
+    /**
+     * Header showing curator information on NFT full page
+     * @default  of proceeds go to the curator
+     */
+    CURATOR_PROCEEDS_DESC: " of proceeds go to the curator",
+    /**
      * Sold for view on full view page auction info box
@@ -112,0 +127,0 @@ * @default Sold for

dist/constants/style.d.ts

@@ -71,2 +71,3 @@ import { ThemeOptionsType } from "./theme";
         fullInfoCreatorEquityContainer: (_: any) => string;
+        fullInfoCuratorFeeContainer: (_: any) => string;
         fullInfoProofAuthenticityContainer: (_: any) => string;
@@ -73,0 +74,0 @@ fullProofLink: (theme: ThemeOptionsType) => string;

dist/constants/style.js

@@ -284,2 +284,5 @@ "use strict";
     `,
+        fullInfoCuratorFeeContainer: (_) => css_1.css `
+      margin-top: 20px;
+    `,
         fullInfoProofAuthenticityContainer: (_) => css_1.css `
@@ -286,0 +289,0 @@ margin-top: 20px;

dist/context/useMediaContext.d.ts

@@ -855,2 +855,3 @@ import type { Strings } from "../constants/strings";
             fullInfoCreatorEquityContainer: (_: any) => string;
+            fullInfoCuratorFeeContainer: (_: any) => string;
             fullInfoProofAuthenticityContainer: (_: any) => string;
@@ -1475,3 +1476,6 @@ fullProofLink: (theme: {
         NFT_HISTORY: string;
+        AUCTION_PENDING_DURATION: string;
         CREATOR_EQUITY: string;
+        CURATOR_FEE: string;
+        CURATOR_PROCEEDS_DESC: string;
         AUCTION_SOLD_FOR: string;
@@ -1478,0 +1482,0 @@ BID_HISTORY_BID: string;

dist/nft-full/AuctionInfo.js

@@ -71,31 +71,2 @@ "use strict";
     }
-    // if (
-    //   data.pricing.reserve &&
-    //   data.pricing.status === AuctionStateInfo.RESERVE_AUCTION_ENDED &&
-    //   data.pricing.reserve.currentBid
-    // ) {
-    //   const highestPreviousBid = data.pricing.reserve.currentBid;
-    //   return (
-    //     <AuctionInfoWrapper titleString="AUCTION_SOLD_FOR">
-    //       <PricingString pricing={highestPreviousBid.pricing} />
-    //       <div {...getStyles("fullInfoSpacer", { width: 15 })} />
-    //       <div {...getStyles("fullLabel")}>{getString("WINNER")}</div>
-    //       <AddressView address={highestPreviousBid.bidder.id} />
-    //     </AuctionInfoWrapper>
-    //   );
-    // }
-    // if (
-    //   data.pricing.reserve &&
-    //   data.pricing.status === AuctionStateInfo.RESERVE_AUCTION_FINISHED
-    // ) {
-    //   const highestPreviousBid = data.pricing.reserve.previousBids[0];
-    //   return (
-    //     <AuctionInfoWrapper titleString="AUCTION_SOLD_FOR">
-    //       <PricingString pricing={highestPreviousBid.pricing} />
-    //       <div {...getStyles("fullInfoSpacer", { width: 15 })} />
-    //       <div {...getStyles("fullLabel")}>{getString("WINNER")}</div>
-    //       <AddressView address={highestPreviousBid.bidder.id} />
-    //     </AuctionInfoWrapper>
-    //   );
-    // }
     if (showPerpetual &&
@@ -114,4 +85,7 @@ data.pricing.auctionType === nft_hooks_1.AuctionType.PERPETUAL &&
                 data.pricing.auctionType === nft_hooks_1.AuctionType.RESERVE &&
-                    ((_c = data.pricing.reserve) === null || _c === void 0 ? void 0 : _c.reservePrice) && (jsx_runtime_1.jsx(PricingString_1.PricingString, { pricing: data.pricing.reserve.reservePrice }, void 0))] }), void 0) }), void 0));
+                    ((_c = data.pricing.reserve) === null || _c === void 0 ? void 0 : _c.reservePrice) && (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [jsx_runtime_1.jsx(PricingString_1.PricingString, { pricing: data.pricing.reserve.reservePrice }, void 0),
+                        jsx_runtime_1.jsxs("div", { children: [jsx_runtime_1.jsx("div", { style: { height: "20px" } }, void 0),
+                                jsx_runtime_1.jsx("div", Object.assign({}, getStyles("fullLabel"), { children: getString("AUCTION_PENDING_DURATION") }), void 0),
+                                jsx_runtime_1.jsx(CountdownDisplay_1.DurationDisplay, { duration: data.pricing.reserve.duration }, void 0)] }, void 0)] }, void 0))] }), void 0) }), void 0));
 };
 exports.AuctionInfo = AuctionInfo;

dist/nft-full/CreatorEquity.js

@@ -28,12 +28,12 @@ "use strict";
 const InfoContainer_1 = require("./InfoContainer");
+const AddressView_1 = require("../components/AddressView");
 const CreatorEquity = () => {
-    var _a;
+    var _a, _b, _c;
     const { nft: { data }, } = react_1.useContext(NFTDataContext_1.NFTDataContext);
-    const { getStyles } = useMediaContext_1.useMediaContext();
+    const { getStyles, getString } = useMediaContext_1.useMediaContext();
     const getContent = (bidSharePercentage) => (jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [Math.floor(bidSharePercentage), "%"] }, void 0));
-    if (!data || !("zoraNFT" in data) || !data.zoraNFT) {
-        return jsx_runtime_1.jsx(react_1.default.Fragment, {}, void 0);
-    }
-    return (jsx_runtime_1.jsx(InfoContainer_1.InfoContainer, Object.assign({ titleString: "CREATOR_EQUITY" }, { children: jsx_runtime_1.jsx("div", Object.assign({}, getStyles("fullInfoCreatorEquityContainer"), { children: getContent((_a = data.zoraNFT) === null || _a === void 0 ? void 0 : _a.creatorBidSharePercentage) }), void 0) }), void 0));
+    return (jsx_runtime_1.jsxs(jsx_runtime_1.Fragment, { children: [data && "zoraNFT" in data && data.zoraNFT && (jsx_runtime_1.jsx(InfoContainer_1.InfoContainer, Object.assign({ titleString: "CREATOR_EQUITY" }, { children: jsx_runtime_1.jsx("div", Object.assign({}, getStyles("fullInfoCreatorEquityContainer"), { children: getContent((_a = data.zoraNFT) === null || _a === void 0 ? void 0 : _a.creatorBidSharePercentage) }), void 0) }), void 0)),
+            data && data.pricing.reserve && ((_b = data.pricing.reserve) === null || _b === void 0 ? void 0 : _b.curatorFeePercentage) > 0 && (jsx_runtime_1.jsx(InfoContainer_1.InfoContainer, Object.assign({ titleString: "CURATOR_FEE" }, { children: jsx_runtime_1.jsxs("div", Object.assign({}, getStyles("fullInfoCuratorFeeContainer"), { children: [jsx_runtime_1.jsxs("p", { children: [getContent((_c = data.pricing.reserve) === null || _c === void 0 ? void 0 : _c.curatorFeePercentage), " ", getString('CURATOR_PROCEEDS_DESC')] }, void 0),
+                        jsx_runtime_1.jsx("p", { children: jsx_runtime_1.jsx(AddressView_1.AddressView, { address: data.pricing.reserve.curator.id }, void 0) }, void 0)] }), void 0) }), void 0))] }, void 0));
 };
 exports.CreatorEquity = CreatorEquity;

dist/nft-full/ProofAuthenticity.js

@@ -38,3 +38,3 @@ "use strict";
             (data === null || data === void 0 ? void 0 : data.nft.metadataURI);
-        const infoUrlLabelText = (infoURL === null || infoURL === void 0 ? void 0 : infoURL.includes("ipfs"))
+        const infoUrlLabelText = (infoURL === null || infoURL === void 0 ? void 0 : infoURL.includes("/ipfs/")) || (infoURL === null || infoURL === void 0 ? void 0 : infoURL.startsWith("ipfs://"))
             ? "VIEW_IPFS"
@@ -41,0 +41,0 @@ : "VIEW_METADATA";

package.json

 {
   "name": "@zoralabs/nft-components",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "description": "NFT Media Rendering Components",
@@ -13,3 +13,3 @@ "typings": "dist/index.d.ts",
   "author": "Zora",
-  "license": "MIT",
+  "license": "GPL-3.0",
   "private": false,
@@ -16,0 +16,0 @@ "dependencies": {

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

Copyleft License

License

(Experimental) Copyleft license information was found.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Non-permissive License

License

(Experimental) A license not known to be considered permissive was found.

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

249296

increased by17.45%

Lines of code

4833

increased by1.26%

Worsened metrics

Number of low license alerts

3

increased byInfinity%

License quality

70

decreased by-30%

No dependency changes