@medialane/ui 0.183.0 → 0.184.0

package/dist/components/drop/page/drop-page.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/drop/page/drop-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useMemo, useState } from \"react\";\nimport { Package } from \"lucide-react\";\nimport type { ResolvedFeeConfig } from \"@medialane/sdk\";\nimport { dropMintState } from \"@medialane/sdk/starknet\";\nimport Image from \"../../image.js\";\nimport { CreatorChip } from \"../../creator-chip.js\";\nimport { ShareButton } from \"../../share-button.js\";\nimport { Skeleton } from \"../../skeleton.js\";\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"../../tabs.js\";\nimport { AssetLicenseSummary } from \"../../asset-license-summary.js\";\nimport { TokenCard } from \"../../token-card.js\";\nimport { DropActionBox } from \"./drop-action-box.js\";\nimport { DropActivityList } from \"./drop-activity.js\";\nimport { DropManage } from \"./drop-manage.js\";\nimport { DropMintDialog } from \"./drop-mint-dialog.js\";\nimport { GradientButton } from \"../../gradient-button.js\";\nimport { ipfsToHttp } from \"../../../utils/ipfs.js\";\nimport { useCollectionTokens } from \"../../../utils/use-collections.js\";\nimport { useDrop, useDropChain, useDropFile, useDropMints } from \"../../../utils/use-drops.js\";\nimport { useNow } from \"../../../utils/drop/use-now.js\";\nimport { actionBoxView } from \"../../../utils/drop/view.js\";\nimport { claimProofFor } from \"../../../utils/drop/claim-proof.js\";\nimport { manageDrop, mintDrop, saveExclusiveContent } from \"../../../utils/drop/actions.js\";\nimport type { DropAppProps } from \"../../../utils/drop/types.js\";\n\ntype TokenFile = { image?: string; attributes?: { trait_type?: string; value?: string }[] };\n\nexport function DropPage(props: DropAppProps & { contract: string; feeConfig: ResolvedFeeConfig; initialTab?: string; portfolioHref?: string }) {\n  const { contract, getClient, provider, walletAddress } = props;\n  const { drop: indexed, isLoading } = useDrop(getClient, contract);\n  const chain = useDropChain(provider, contract, walletAddress);\n  const { mints, mutate: refreshMints } = useDropMints(getClient, contract);\n  const collectionFile = useDropFile<{ drop_kind?: string }>(getClient, indexed?.baseUri ?? null, \"collection.json\");\n  const firstToken = useDropFile<TokenFile>(getClient, indexed?.baseUri ?? null, \"1\");\n  const { tokens } = useCollectionTokens(getClient, contract, 1, 24);\n  const now = useNow();\n  const [quantity, setQuantity] = useState(1n);\n  const [minting, setMinting] = useState(false);\n  const proof = useMemo(\n    () => (typeof window === \"undefined\" ? null : claimProofFor(window.localStorage, contract, window.location.hash, \"drop-proof\")),\n    [contract],\n  );\n\n  if (isLoading && !chain.drop) {\n    return <div className=\"grid gap-8 lg:grid-cols-2\"><Skeleton className=\"aspect-square rounded-2xl\" /><Skeleton className=\"h-96 rounded-2xl\" /></div>;\n  }\n  if (!indexed && !chain.drop) {\n    return (\n      <div className=\"space-y-3 py-24 text-center\">\n        <Package className=\"mx-auto h-10 w-10 text-muted-foreground/30\" />\n        <p className=\"text-sm text-muted-foreground\">This drop wasn't found. A new drop can take a minute to appear.</p>\n      </div>\n    );\n  }\n\n  const onchain = chain.drop;\n  const mint = dropMintState({ drop: onchain, wallet: walletAddress, claimed: chain.claimed, proof, balance: chain.balance, feeConfig: props.feeConfig, now });\n  const view = onchain ? actionBoxView({ drop: onchain, mint, quantity, feeConfig: props.feeConfig, now }) : null;\n  const isOrganizer = !!walletAddress && !!onchain && BigInt(walletAddress) === BigInt(onchain.organizer);\n  const isCollection = collectionFile?.drop_kind === \"collection\";\n  const art = firstToken?.image ?? indexed?.image ?? null;\n  const name = indexed?.name ?? \"Drop\";\n  const deps = async () => ({ client: getClient(), provider, signer: await props.getSigner() });\n\n  const onAction = () => {\n    if (!view) return;\n    if (view.button.action === \"sign-in\") props.onRequireWallet();\n    if (view.button.action === \"mint\") setMinting(true);\n  };\n\n  return (\n    <div className=\"space-y-10 pb-28 lg:pb-0\">\n      <div className=\"grid gap-8 lg:grid-cols-2 lg:gap-10\">\n        <div className=\"relative aspect-square overflow-hidden rounded-2xl bg-muted\">\n          {art && <Image src={ipfsToHttp(art)} alt={name} fill unoptimized className=\"object-cover\" />}\n        </div>\n        <div className=\"space-y-5\">\n          <div className=\"flex items-start justify-between gap-3\">\n            <div className=\"space-y-1\">\n              <h1 className=\"text-3xl font-semibold\">{name}</h1>\n              {onchain && <CreatorChip getClient={getClient} address={onchain.organizer} />}\n            </div>\n            <ShareButton title={name} variant=\"outline\" size=\"sm\" />\n          </div>\n          {view && onchain && (\n            <div className=\"hidden lg:block\">\n              <DropActionBox view={view} minted={onchain.totalMinted} maxSupply={onchain.maxSupply} quantity={quantity} onQuantity={setQuantity} onAction={onAction} />\n            </div>\n          )}\n        </div>\n      </div>\n\n      {view && onchain && (\n        <div className=\"lg:hidden\">\n          <DropActionBox view={view} minted={onchain.totalMinted} maxSupply={onchain.maxSupply} quantity={quantity} onQuantity={setQuantity} onAction={onAction} />\n          <div className=\"fixed inset-x-0 bottom-0 z-30 border-t border-border bg-background/95 p-3 backdrop-blur\">\n            <GradientButton disabled={view.button.action === \"none\"} onClick={onAction}>{view.button.label}</GradientButton>\n          </div>\n        </div>\n      )}\n\n      <Tabs defaultValue={props.initialTab === \"manage\" && isOrganizer ? \"manage\" : \"about\"}>\n        <TabsList>\n          <TabsTrigger value=\"about\">About</TabsTrigger>\n          {isCollection && <TabsTrigger value=\"items\">Items</TabsTrigger>}\n          <TabsTrigger value=\"activity\">Activity</TabsTrigger>\n          <TabsTrigger value=\"license\">License</TabsTrigger>\n          {isOrganizer && <TabsTrigger value=\"manage\">Manage</TabsTrigger>}\n        </TabsList>\n        <TabsContent value=\"about\" className=\"pt-6\">\n          <p className=\"whitespace-pre-line text-sm leading-relaxed text-muted-foreground\">{indexed?.description || \"No description.\"}</p>\n        </TabsContent>\n        {isCollection && (\n          <TabsContent value=\"items\" className=\"pt-6\">\n            <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4\">{tokens.map((t) => <TokenCard key={t.tokenId} token={t} />)}</div>\n          </TabsContent>\n        )}\n        <TabsContent value=\"activity\" className=\"pt-6\"><DropActivityList mints={mints} /></TabsContent>\n        <TabsContent value=\"license\" className=\"pt-6\"><AssetLicenseSummary attributes={firstToken?.attributes ?? []} /></TabsContent>\n        {isOrganizer && onchain && (\n          <TabsContent value=\"manage\" className=\"pt-6\">\n            <DropManage\n              contract={contract}\n              indexed={indexed}\n              onchain={onchain}\n              mints={mints}\n              run={async (params) => {\n                await manageDrop(await deps(), { owner: walletAddress!, collection: contract, ...params });\n                await Promise.all([chain.mutate(), refreshMints()]);\n              }}\n              saveExclusive={(value) => saveExclusiveContent(getClient(), contract, value)}\n            />\n          </TabsContent>\n        )}\n      </Tabs>\n\n      {view && minting && (\n        <DropMintDialog\n          open\n          onClose={() => setMinting(false)}\n          name={name}\n          quantity={quantity > view.maxQuantity ? view.maxQuantity : quantity}\n          totalText={view.totalText}\n          portfolioHref={props.portfolioHref ?? \"/portfolio\"}\n          onMint={async () => {\n            const res = await mintDrop(await deps(), { claimer: walletAddress!, collection: contract, quantity: quantity > view.maxQuantity ? view.maxQuantity : quantity, proof });\n            await Promise.all([chain.mutate(), refreshMints()]);\n            return res;\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["Image"]}

package/dist/components/drop/page/drop-page.d.cts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ResolvedFeeConfig } from '@medialane/sdk';
+import { DropAppProps } from '../../../utils/drop/types.cjs';
+import 'starknet';
+import '@medialane/sdk/starknet';
+import '../../fast-mint/types.cjs';
+import 'react';
+
+declare function DropPage(props: DropAppProps & {
+    contract: string;
+    feeConfig: ResolvedFeeConfig;
+    initialTab?: string;
+    portfolioHref?: string;
+}): react_jsx_runtime.JSX.Element;
+
+export { DropPage };

package/dist/components/drop/page/drop-page.d.ts

@@ -0,0 +1,16 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ResolvedFeeConfig } from '@medialane/sdk';
+import { DropAppProps } from '../../../utils/drop/types.js';
+import 'starknet';
+import '@medialane/sdk/starknet';
+import '../../fast-mint/types.js';
+import 'react';
+
+declare function DropPage(props: DropAppProps & {
+    contract: string;
+    feeConfig: ResolvedFeeConfig;
+    initialTab?: string;
+    portfolioHref?: string;
+}): react_jsx_runtime.JSX.Element;
+
+export { DropPage };

package/dist/components/drop/page/drop-page.js

@@ -0,0 +1,131 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo, useState } from "react";
+import { Package } from "lucide-react";
+import { dropMintState } from "@medialane/sdk/starknet";
+import Image from "../../image.js";
+import { CreatorChip } from "../../creator-chip.js";
+import { ShareButton } from "../../share-button.js";
+import { Skeleton } from "../../skeleton.js";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../tabs.js";
+import { AssetLicenseSummary } from "../../asset-license-summary.js";
+import { TokenCard } from "../../token-card.js";
+import { DropActionBox } from "./drop-action-box.js";
+import { DropActivityList } from "./drop-activity.js";
+import { DropManage } from "./drop-manage.js";
+import { DropMintDialog } from "./drop-mint-dialog.js";
+import { GradientButton } from "../../gradient-button.js";
+import { ipfsToHttp } from "../../../utils/ipfs.js";
+import { useCollectionTokens } from "../../../utils/use-collections.js";
+import { useDrop, useDropChain, useDropFile, useDropMints } from "../../../utils/use-drops.js";
+import { useNow } from "../../../utils/drop/use-now.js";
+import { actionBoxView } from "../../../utils/drop/view.js";
+import { claimProofFor } from "../../../utils/drop/claim-proof.js";
+import { manageDrop, mintDrop, saveExclusiveContent } from "../../../utils/drop/actions.js";
+function DropPage(props) {
+  const { contract, getClient, provider, walletAddress } = props;
+  const { drop: indexed, isLoading } = useDrop(getClient, contract);
+  const chain = useDropChain(provider, contract, walletAddress);
+  const { mints, mutate: refreshMints } = useDropMints(getClient, contract);
+  const collectionFile = useDropFile(getClient, indexed?.baseUri ?? null, "collection.json");
+  const firstToken = useDropFile(getClient, indexed?.baseUri ?? null, "1");
+  const { tokens } = useCollectionTokens(getClient, contract, 1, 24);
+  const now = useNow();
+  const [quantity, setQuantity] = useState(1n);
+  const [minting, setMinting] = useState(false);
+  const proof = useMemo(
+    () => typeof window === "undefined" ? null : claimProofFor(window.localStorage, contract, window.location.hash, "drop-proof"),
+    [contract]
+  );
+  if (isLoading && !chain.drop) {
+    return /* @__PURE__ */ jsxs("div", { className: "grid gap-8 lg:grid-cols-2", children: [
+      /* @__PURE__ */ jsx(Skeleton, { className: "aspect-square rounded-2xl" }),
+      /* @__PURE__ */ jsx(Skeleton, { className: "h-96 rounded-2xl" })
+    ] });
+  }
+  if (!indexed && !chain.drop) {
+    return /* @__PURE__ */ jsxs("div", { className: "space-y-3 py-24 text-center", children: [
+      /* @__PURE__ */ jsx(Package, { className: "mx-auto h-10 w-10 text-muted-foreground/30" }),
+      /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: "This drop wasn't found. A new drop can take a minute to appear." })
+    ] });
+  }
+  const onchain = chain.drop;
+  const mint = dropMintState({ drop: onchain, wallet: walletAddress, claimed: chain.claimed, proof, balance: chain.balance, feeConfig: props.feeConfig, now });
+  const view = onchain ? actionBoxView({ drop: onchain, mint, quantity, feeConfig: props.feeConfig, now }) : null;
+  const isOrganizer = !!walletAddress && !!onchain && BigInt(walletAddress) === BigInt(onchain.organizer);
+  const isCollection = collectionFile?.drop_kind === "collection";
+  const art = firstToken?.image ?? indexed?.image ?? null;
+  const name = indexed?.name ?? "Drop";
+  const deps = async () => ({ client: getClient(), provider, signer: await props.getSigner() });
+  const onAction = () => {
+    if (!view) return;
+    if (view.button.action === "sign-in") props.onRequireWallet();
+    if (view.button.action === "mint") setMinting(true);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-10 pb-28 lg:pb-0", children: [
+    /* @__PURE__ */ jsxs("div", { className: "grid gap-8 lg:grid-cols-2 lg:gap-10", children: [
+      /* @__PURE__ */ jsx("div", { className: "relative aspect-square overflow-hidden rounded-2xl bg-muted", children: art && /* @__PURE__ */ jsx(Image, { src: ipfsToHttp(art), alt: name, fill: true, unoptimized: true, className: "object-cover" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-5", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ jsx("h1", { className: "text-3xl font-semibold", children: name }),
+            onchain && /* @__PURE__ */ jsx(CreatorChip, { getClient, address: onchain.organizer })
+          ] }),
+          /* @__PURE__ */ jsx(ShareButton, { title: name, variant: "outline", size: "sm" })
+        ] }),
+        view && onchain && /* @__PURE__ */ jsx("div", { className: "hidden lg:block", children: /* @__PURE__ */ jsx(DropActionBox, { view, minted: onchain.totalMinted, maxSupply: onchain.maxSupply, quantity, onQuantity: setQuantity, onAction }) })
+      ] })
+    ] }),
+    view && onchain && /* @__PURE__ */ jsxs("div", { className: "lg:hidden", children: [
+      /* @__PURE__ */ jsx(DropActionBox, { view, minted: onchain.totalMinted, maxSupply: onchain.maxSupply, quantity, onQuantity: setQuantity, onAction }),
+      /* @__PURE__ */ jsx("div", { className: "fixed inset-x-0 bottom-0 z-30 border-t border-border bg-background/95 p-3 backdrop-blur", children: /* @__PURE__ */ jsx(GradientButton, { disabled: view.button.action === "none", onClick: onAction, children: view.button.label }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Tabs, { defaultValue: props.initialTab === "manage" && isOrganizer ? "manage" : "about", children: [
+      /* @__PURE__ */ jsxs(TabsList, { children: [
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "about", children: "About" }),
+        isCollection && /* @__PURE__ */ jsx(TabsTrigger, { value: "items", children: "Items" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "activity", children: "Activity" }),
+        /* @__PURE__ */ jsx(TabsTrigger, { value: "license", children: "License" }),
+        isOrganizer && /* @__PURE__ */ jsx(TabsTrigger, { value: "manage", children: "Manage" })
+      ] }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "about", className: "pt-6", children: /* @__PURE__ */ jsx("p", { className: "whitespace-pre-line text-sm leading-relaxed text-muted-foreground", children: indexed?.description || "No description." }) }),
+      isCollection && /* @__PURE__ */ jsx(TabsContent, { value: "items", className: "pt-6", children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4", children: tokens.map((t) => /* @__PURE__ */ jsx(TokenCard, { token: t }, t.tokenId)) }) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "activity", className: "pt-6", children: /* @__PURE__ */ jsx(DropActivityList, { mints }) }),
+      /* @__PURE__ */ jsx(TabsContent, { value: "license", className: "pt-6", children: /* @__PURE__ */ jsx(AssetLicenseSummary, { attributes: firstToken?.attributes ?? [] }) }),
+      isOrganizer && onchain && /* @__PURE__ */ jsx(TabsContent, { value: "manage", className: "pt-6", children: /* @__PURE__ */ jsx(
+        DropManage,
+        {
+          contract,
+          indexed,
+          onchain,
+          mints,
+          run: async (params) => {
+            await manageDrop(await deps(), { owner: walletAddress, collection: contract, ...params });
+            await Promise.all([chain.mutate(), refreshMints()]);
+          },
+          saveExclusive: (value) => saveExclusiveContent(getClient(), contract, value)
+        }
+      ) })
+    ] }),
+    view && minting && /* @__PURE__ */ jsx(
+      DropMintDialog,
+      {
+        open: true,
+        onClose: () => setMinting(false),
+        name,
+        quantity: quantity > view.maxQuantity ? view.maxQuantity : quantity,
+        totalText: view.totalText,
+        portfolioHref: props.portfolioHref ?? "/portfolio",
+        onMint: async () => {
+          const res = await mintDrop(await deps(), { claimer: walletAddress, collection: contract, quantity: quantity > view.maxQuantity ? view.maxQuantity : quantity, proof });
+          await Promise.all([chain.mutate(), refreshMints()]);
+          return res;
+        }
+      }
+    )
+  ] });
+}
+export {
+  DropPage
+};
+//# sourceMappingURL=drop-page.js.map

package/dist/components/drop/page/drop-page.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/drop/page/drop-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useMemo, useState } from \"react\";\nimport { Package } from \"lucide-react\";\nimport type { ResolvedFeeConfig } from \"@medialane/sdk\";\nimport { dropMintState } from \"@medialane/sdk/starknet\";\nimport Image from \"../../image.js\";\nimport { CreatorChip } from \"../../creator-chip.js\";\nimport { ShareButton } from \"../../share-button.js\";\nimport { Skeleton } from \"../../skeleton.js\";\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"../../tabs.js\";\nimport { AssetLicenseSummary } from \"../../asset-license-summary.js\";\nimport { TokenCard } from \"../../token-card.js\";\nimport { DropActionBox } from \"./drop-action-box.js\";\nimport { DropActivityList } from \"./drop-activity.js\";\nimport { DropManage } from \"./drop-manage.js\";\nimport { DropMintDialog } from \"./drop-mint-dialog.js\";\nimport { GradientButton } from \"../../gradient-button.js\";\nimport { ipfsToHttp } from \"../../../utils/ipfs.js\";\nimport { useCollectionTokens } from \"../../../utils/use-collections.js\";\nimport { useDrop, useDropChain, useDropFile, useDropMints } from \"../../../utils/use-drops.js\";\nimport { useNow } from \"../../../utils/drop/use-now.js\";\nimport { actionBoxView } from \"../../../utils/drop/view.js\";\nimport { claimProofFor } from \"../../../utils/drop/claim-proof.js\";\nimport { manageDrop, mintDrop, saveExclusiveContent } from \"../../../utils/drop/actions.js\";\nimport type { DropAppProps } from \"../../../utils/drop/types.js\";\n\ntype TokenFile = { image?: string; attributes?: { trait_type?: string; value?: string }[] };\n\nexport function DropPage(props: DropAppProps & { contract: string; feeConfig: ResolvedFeeConfig; initialTab?: string; portfolioHref?: string }) {\n  const { contract, getClient, provider, walletAddress } = props;\n  const { drop: indexed, isLoading } = useDrop(getClient, contract);\n  const chain = useDropChain(provider, contract, walletAddress);\n  const { mints, mutate: refreshMints } = useDropMints(getClient, contract);\n  const collectionFile = useDropFile<{ drop_kind?: string }>(getClient, indexed?.baseUri ?? null, \"collection.json\");\n  const firstToken = useDropFile<TokenFile>(getClient, indexed?.baseUri ?? null, \"1\");\n  const { tokens } = useCollectionTokens(getClient, contract, 1, 24);\n  const now = useNow();\n  const [quantity, setQuantity] = useState(1n);\n  const [minting, setMinting] = useState(false);\n  const proof = useMemo(\n    () => (typeof window === \"undefined\" ? null : claimProofFor(window.localStorage, contract, window.location.hash, \"drop-proof\")),\n    [contract],\n  );\n\n  if (isLoading && !chain.drop) {\n    return <div className=\"grid gap-8 lg:grid-cols-2\"><Skeleton className=\"aspect-square rounded-2xl\" /><Skeleton className=\"h-96 rounded-2xl\" /></div>;\n  }\n  if (!indexed && !chain.drop) {\n    return (\n      <div className=\"space-y-3 py-24 text-center\">\n        <Package className=\"mx-auto h-10 w-10 text-muted-foreground/30\" />\n        <p className=\"text-sm text-muted-foreground\">This drop wasn't found. A new drop can take a minute to appear.</p>\n      </div>\n    );\n  }\n\n  const onchain = chain.drop;\n  const mint = dropMintState({ drop: onchain, wallet: walletAddress, claimed: chain.claimed, proof, balance: chain.balance, feeConfig: props.feeConfig, now });\n  const view = onchain ? actionBoxView({ drop: onchain, mint, quantity, feeConfig: props.feeConfig, now }) : null;\n  const isOrganizer = !!walletAddress && !!onchain && BigInt(walletAddress) === BigInt(onchain.organizer);\n  const isCollection = collectionFile?.drop_kind === \"collection\";\n  const art = firstToken?.image ?? indexed?.image ?? null;\n  const name = indexed?.name ?? \"Drop\";\n  const deps = async () => ({ client: getClient(), provider, signer: await props.getSigner() });\n\n  const onAction = () => {\n    if (!view) return;\n    if (view.button.action === \"sign-in\") props.onRequireWallet();\n    if (view.button.action === \"mint\") setMinting(true);\n  };\n\n  return (\n    <div className=\"space-y-10 pb-28 lg:pb-0\">\n      <div className=\"grid gap-8 lg:grid-cols-2 lg:gap-10\">\n        <div className=\"relative aspect-square overflow-hidden rounded-2xl bg-muted\">\n          {art && <Image src={ipfsToHttp(art)} alt={name} fill unoptimized className=\"object-cover\" />}\n        </div>\n        <div className=\"space-y-5\">\n          <div className=\"flex items-start justify-between gap-3\">\n            <div className=\"space-y-1\">\n              <h1 className=\"text-3xl font-semibold\">{name}</h1>\n              {onchain && <CreatorChip getClient={getClient} address={onchain.organizer} />}\n            </div>\n            <ShareButton title={name} variant=\"outline\" size=\"sm\" />\n          </div>\n          {view && onchain && (\n            <div className=\"hidden lg:block\">\n              <DropActionBox view={view} minted={onchain.totalMinted} maxSupply={onchain.maxSupply} quantity={quantity} onQuantity={setQuantity} onAction={onAction} />\n            </div>\n          )}\n        </div>\n      </div>\n\n      {view && onchain && (\n        <div className=\"lg:hidden\">\n          <DropActionBox view={view} minted={onchain.totalMinted} maxSupply={onchain.maxSupply} quantity={quantity} onQuantity={setQuantity} onAction={onAction} />\n          <div className=\"fixed inset-x-0 bottom-0 z-30 border-t border-border bg-background/95 p-3 backdrop-blur\">\n            <GradientButton disabled={view.button.action === \"none\"} onClick={onAction}>{view.button.label}</GradientButton>\n          </div>\n        </div>\n      )}\n\n      <Tabs defaultValue={props.initialTab === \"manage\" && isOrganizer ? \"manage\" : \"about\"}>\n        <TabsList>\n          <TabsTrigger value=\"about\">About</TabsTrigger>\n          {isCollection && <TabsTrigger value=\"items\">Items</TabsTrigger>}\n          <TabsTrigger value=\"activity\">Activity</TabsTrigger>\n          <TabsTrigger value=\"license\">License</TabsTrigger>\n          {isOrganizer && <TabsTrigger value=\"manage\">Manage</TabsTrigger>}\n        </TabsList>\n        <TabsContent value=\"about\" className=\"pt-6\">\n          <p className=\"whitespace-pre-line text-sm leading-relaxed text-muted-foreground\">{indexed?.description || \"No description.\"}</p>\n        </TabsContent>\n        {isCollection && (\n          <TabsContent value=\"items\" className=\"pt-6\">\n            <div className=\"grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-4\">{tokens.map((t) => <TokenCard key={t.tokenId} token={t} />)}</div>\n          </TabsContent>\n        )}\n        <TabsContent value=\"activity\" className=\"pt-6\"><DropActivityList mints={mints} /></TabsContent>\n        <TabsContent value=\"license\" className=\"pt-6\"><AssetLicenseSummary attributes={firstToken?.attributes ?? []} /></TabsContent>\n        {isOrganizer && onchain && (\n          <TabsContent value=\"manage\" className=\"pt-6\">\n            <DropManage\n              contract={contract}\n              indexed={indexed}\n              onchain={onchain}\n              mints={mints}\n              run={async (params) => {\n                await manageDrop(await deps(), { owner: walletAddress!, collection: contract, ...params });\n                await Promise.all([chain.mutate(), refreshMints()]);\n              }}\n              saveExclusive={(value) => saveExclusiveContent(getClient(), contract, value)}\n            />\n          </TabsContent>\n        )}\n      </Tabs>\n\n      {view && minting && (\n        <DropMintDialog\n          open\n          onClose={() => setMinting(false)}\n          name={name}\n          quantity={quantity > view.maxQuantity ? view.maxQuantity : quantity}\n          totalText={view.totalText}\n          portfolioHref={props.portfolioHref ?? \"/portfolio\"}\n          onMint={async () => {\n            const res = await mintDrop(await deps(), { claimer: walletAddress!, collection: contract, quantity: quantity > view.maxQuantity ? view.maxQuantity : quantity, proof });\n            await Promise.all([chain.mutate(), refreshMints()]);\n            return res;\n          }}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/drop-status-display.cjs

@@ -19,40 +19,24 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var drop_status_display_exports = {};
 __export(drop_status_display_exports, {
-  DropPriceDisplay: () => DropPriceDisplay,
   DropStatusBadge: () => DropStatusBadge,
   DropSupplyProgress: () => DropSupplyProgress
 });
 module.exports = __toCommonJS(drop_status_display_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_sdk = require("@medialane/sdk");
 var import_cn = require("../utils/cn.js");
-function getTokenByAddress(address) {
-  return (0, import_sdk.getListableTokens)().find(
-    (t) => (0, import_sdk.normalizeAddress)("STARKNET", t.address) === (0, import_sdk.normalizeAddress)("STARKNET", address)
-  ) ?? null;
-}
-function DropStatusBadge({ status }) {
+function DropStatusBadge({ phase }) {
   const map = {
     live: { label: "Live", cls: "text-green-400 bg-green-500/10" },
     upcoming: { label: "Upcoming", cls: "text-brand-blue bg-brand-blue/10" },
     ended: { label: "Ended", cls: "text-muted-foreground bg-muted" },
-    sold_out: { label: "Sold out", cls: "text-brand-orange bg-brand-orange/10" }
+    "sold-out": { label: "Sold out", cls: "text-brand-orange bg-brand-orange/10" }
   };
-  const { label, cls } = map[status];
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    "span",
-    {
-      className: (0, import_cn.cn)(
-        "inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1",
-        cls
-      ),
-      children: [
-        status === "live" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse" }),
-        label
-      ]
-    }
-  );
+  const { label, cls } = map[phase];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: (0, import_cn.cn)("inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1", cls), children: [
+    phase === "live" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse" }),
+    label
+  ] });
 }
 function DropSupplyProgress({ minted, max }) {
   const pct = max > 0 ? Math.min(100, minted / max * 100) : 0;
@@ -80,23 +64,8 @@ function DropSupplyProgress({ minted, max }) {
     ] })
   ] });
 }
-function DropPriceDisplay({ conditions }) {
-  if (conditions.price === "0" || conditions.paymentToken === "0x0") {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-1.5 text-sm font-semibold text-green-500", children: "Free mint" });
-  }
-  const token = getTokenByAddress(conditions.paymentToken);
-  const decimals = token?.decimals ?? 18;
-  const priceNum = Number(BigInt(conditions.price) * 10000n / BigInt(10 ** decimals)) / 1e4;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5 text-sm font-semibold", children: [
-    priceNum,
-    " ",
-    token?.symbol ?? "tokens",
-    " per token"
-  ] });
-}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  DropPriceDisplay,
   DropStatusBadge,
   DropSupplyProgress
 });

package/dist/components/drop-status-display.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/drop-status-display.tsx"],"sourcesContent":["\"use client\";\n\nimport { getListableTokens, normalizeAddress } from \"@medialane/sdk\";\nimport { cn } from \"../utils/cn.js\";\nimport type { DropConditions, DropStatus } from \"../utils/drop-status.js\";\n\nfunction getTokenByAddress(address: string) {\n  return (\n    getListableTokens().find(\n      (t) => normalizeAddress(\"STARKNET\", t.address) === normalizeAddress(\"STARKNET\", address)\n    ) ?? null\n  );\n}\n\nexport function DropStatusBadge({ status }: { status: DropStatus }) {\n  const map = {\n    live:     { label: \"Live\",     cls: \"text-green-400 bg-green-500/10\"   },\n    upcoming: { label: \"Upcoming\", cls: \"text-brand-blue bg-brand-blue/10\"     },\n    ended:    { label: \"Ended\",    cls: \"text-muted-foreground bg-muted\"   },\n    sold_out: { label: \"Sold out\", cls: \"text-brand-orange bg-brand-orange/10\" },\n  } as const;\n  const { label, cls } = map[status];\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1\",\n        cls\n      )}\n    >\n      {status === \"live\" && <span className=\"h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse\" />}\n      {label}\n    </span>\n  );\n}\n\nexport function DropSupplyProgress({ minted, max }: { minted: number; max: number }) {\n  const pct = max > 0 ? Math.min(100, (minted / max) * 100) : 0;\n  return (\n    <div className=\"space-y-1.5\">\n      <div className=\"flex justify-between text-xs text-muted-foreground\">\n        <span>{minted.toLocaleString()} minted</span>\n        <span>of {max.toLocaleString()}</span>\n      </div>\n      <div className=\"h-2 rounded-full bg-muted overflow-hidden\">\n        <div\n          className=\"h-full rounded-full bg-brand-orange transition-all duration-500\"\n          style={{ width: `${pct}%` }}\n        />\n      </div>\n      <p className=\"text-xs text-muted-foreground\">{pct.toFixed(1)}% claimed</p>\n    </div>\n  );\n}\n\nexport function DropPriceDisplay({ conditions }: { conditions: DropConditions }) {\n  if (conditions.price === \"0\" || conditions.paymentToken === \"0x0\") {\n    return (\n      <div className=\"flex items-center gap-1.5 text-sm font-semibold text-green-500\">\n        Free mint\n      </div>\n    );\n  }\n  const token = getTokenByAddress(conditions.paymentToken);\n  const decimals = token?.decimals ?? 18;\n  const priceNum = Number(BigInt(conditions.price) * 10000n / BigInt(10 ** decimals)) / 10000;\n  return (\n    <div className=\"flex items-center gap-1.5 text-sm font-semibold\">\n      {priceNum} {token?.symbol ?? \"tokens\"} per token\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBI;AArBJ,iBAAoD;AACpD,gBAAmB;AAGnB,SAAS,kBAAkB,SAAiB;AAC1C,aACE,8BAAkB,EAAE;AAAA,IAClB,CAAC,UAAM,6BAAiB,YAAY,EAAE,OAAO,UAAM,6BAAiB,YAAY,OAAO;AAAA,EACzF,KAAK;AAET;AAEO,SAAS,gBAAgB,EAAE,OAAO,GAA2B;AAClE,QAAM,MAAM;AAAA,IACV,MAAU,EAAE,OAAO,QAAY,KAAK,iCAAmC;AAAA,IACvE,UAAU,EAAE,OAAO,YAAY,KAAK,mCAAuC;AAAA,IAC3E,OAAU,EAAE,OAAO,SAAY,KAAK,iCAAmC;AAAA,IACvE,UAAU,EAAE,OAAO,YAAY,KAAK,uCAAuC;AAAA,EAC7E;AACA,QAAM,EAAE,OAAO,IAAI,IAAI,IAAI,MAAM;AACjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,mBAAW,UAAU,4CAAC,UAAK,WAAU,uDAAsD;AAAA,QAC3F;AAAA;AAAA;AAAA,EACH;AAEJ;AAEO,SAAS,mBAAmB,EAAE,QAAQ,IAAI,GAAoC;AACnF,QAAM,MAAM,MAAM,IAAI,KAAK,IAAI,KAAM,SAAS,MAAO,GAAG,IAAI;AAC5D,SACE,6CAAC,SAAI,WAAU,eACb;AAAA,iDAAC,SAAI,WAAU,sDACb;AAAA,mDAAC,UAAM;AAAA,eAAO,eAAe;AAAA,QAAE;AAAA,SAAO;AAAA,MACtC,6CAAC,UAAK;AAAA;AAAA,QAAI,IAAI,eAAe;AAAA,SAAE;AAAA,OACjC;AAAA,IACA,4CAAC,SAAI,WAAU,6CACb;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,GAAG,GAAG,IAAI;AAAA;AAAA,IAC5B,GACF;AAAA,IACA,6CAAC,OAAE,WAAU,iCAAiC;AAAA,UAAI,QAAQ,CAAC;AAAA,MAAE;AAAA,OAAS;AAAA,KACxE;AAEJ;AAEO,SAAS,iBAAiB,EAAE,WAAW,GAAmC;AAC/E,MAAI,WAAW,UAAU,OAAO,WAAW,iBAAiB,OAAO;AACjE,WACE,4CAAC,SAAI,WAAU,kEAAiE,uBAEhF;AAAA,EAEJ;AACA,QAAM,QAAQ,kBAAkB,WAAW,YAAY;AACvD,QAAM,WAAW,OAAO,YAAY;AACpC,QAAM,WAAW,OAAO,OAAO,WAAW,KAAK,IAAI,SAAS,OAAO,MAAM,QAAQ,CAAC,IAAI;AACtF,SACE,6CAAC,SAAI,WAAU,mDACZ;AAAA;AAAA,IAAS;AAAA,IAAE,OAAO,UAAU;AAAA,IAAS;AAAA,KACxC;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/drop-status-display.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\nimport type { DropPhase } from \"../utils/drop/view.js\";\n\nexport function DropStatusBadge({ phase }: { phase: DropPhase }) {\n  const map = {\n    live:       { label: \"Live\",     cls: \"text-green-400 bg-green-500/10\" },\n    upcoming:   { label: \"Upcoming\", cls: \"text-brand-blue bg-brand-blue/10\" },\n    ended:      { label: \"Ended\",    cls: \"text-muted-foreground bg-muted\" },\n    \"sold-out\": { label: \"Sold out\", cls: \"text-brand-orange bg-brand-orange/10\" },\n  } as const;\n  const { label, cls } = map[phase];\n  return (\n    <span className={cn(\"inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1\", cls)}>\n      {phase === \"live\" && <span className=\"h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse\" />}\n      {label}\n    </span>\n  );\n}\n\nexport function DropSupplyProgress({ minted, max }: { minted: number; max: number }) {\n  const pct = max > 0 ? Math.min(100, (minted / max) * 100) : 0;\n  return (\n    <div className=\"space-y-1.5\">\n      <div className=\"flex justify-between text-xs text-muted-foreground\">\n        <span>{minted.toLocaleString()} minted</span>\n        <span>of {max.toLocaleString()}</span>\n      </div>\n      <div className=\"h-2 rounded-full bg-muted overflow-hidden\">\n        <div\n          className=\"h-full rounded-full bg-brand-orange transition-all duration-500\"\n          style={{ width: `${pct}%` }}\n        />\n      </div>\n      <p className=\"text-xs text-muted-foreground\">{pct.toFixed(1)}% claimed</p>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcI;AAZJ,gBAAmB;AAGZ,SAAS,gBAAgB,EAAE,MAAM,GAAyB;AAC/D,QAAM,MAAM;AAAA,IACV,MAAY,EAAE,OAAO,QAAY,KAAK,iCAAiC;AAAA,IACvE,UAAY,EAAE,OAAO,YAAY,KAAK,mCAAmC;AAAA,IACzE,OAAY,EAAE,OAAO,SAAY,KAAK,iCAAiC;AAAA,IACvE,YAAY,EAAE,OAAO,YAAY,KAAK,uCAAuC;AAAA,EAC/E;AACA,QAAM,EAAE,OAAO,IAAI,IAAI,IAAI,KAAK;AAChC,SACE,6CAAC,UAAK,eAAW,cAAG,qGAAqG,GAAG,GACzH;AAAA,cAAU,UAAU,4CAAC,UAAK,WAAU,uDAAsD;AAAA,IAC1F;AAAA,KACH;AAEJ;AAEO,SAAS,mBAAmB,EAAE,QAAQ,IAAI,GAAoC;AACnF,QAAM,MAAM,MAAM,IAAI,KAAK,IAAI,KAAM,SAAS,MAAO,GAAG,IAAI;AAC5D,SACE,6CAAC,SAAI,WAAU,eACb;AAAA,iDAAC,SAAI,WAAU,sDACb;AAAA,mDAAC,UAAM;AAAA,eAAO,eAAe;AAAA,QAAE;AAAA,SAAO;AAAA,MACtC,6CAAC,UAAK;AAAA;AAAA,QAAI,IAAI,eAAe;AAAA,SAAE;AAAA,OACjC;AAAA,IACA,4CAAC,SAAI,WAAU,6CACb;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,GAAG,GAAG,IAAI;AAAA;AAAA,IAC5B,GACF;AAAA,IACA,6CAAC,OAAE,WAAU,iCAAiC;AAAA,UAAI,QAAQ,CAAC;AAAA,MAAE;AAAA,OAAS;AAAA,KACxE;AAEJ;","names":[]}

package/dist/components/drop-status-display.d.cts

@@ -1,15 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { DropConditions, DropStatus } from '../utils/drop-status.cjs';
+import { DropPhase } from '../utils/drop/view.cjs';
+import '@medialane/sdk';
+import '@medialane/sdk/starknet';
 
-declare function DropStatusBadge({ status }: {
-    status: DropStatus;
+declare function DropStatusBadge({ phase }: {
+    phase: DropPhase;
 }): react_jsx_runtime.JSX.Element;
 declare function DropSupplyProgress({ minted, max }: {
     minted: number;
     max: number;
 }): react_jsx_runtime.JSX.Element;
-declare function DropPriceDisplay({ conditions }: {
-    conditions: DropConditions;
-}): react_jsx_runtime.JSX.Element;
 
-export { DropPriceDisplay, DropStatusBadge, DropSupplyProgress };
+export { DropStatusBadge, DropSupplyProgress };

package/dist/components/drop-status-display.d.ts

@@ -1,15 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { DropConditions, DropStatus } from '../utils/drop-status.js';
+import { DropPhase } from '../utils/drop/view.js';
+import '@medialane/sdk';
+import '@medialane/sdk/starknet';
 
-declare function DropStatusBadge({ status }: {
-    status: DropStatus;
+declare function DropStatusBadge({ phase }: {
+    phase: DropPhase;
 }): react_jsx_runtime.JSX.Element;
 declare function DropSupplyProgress({ minted, max }: {
     minted: number;
     max: number;
 }): react_jsx_runtime.JSX.Element;
-declare function DropPriceDisplay({ conditions }: {
-    conditions: DropConditions;
-}): react_jsx_runtime.JSX.Element;
 
-export { DropPriceDisplay, DropStatusBadge, DropSupplyProgress };
+export { DropStatusBadge, DropSupplyProgress };

package/dist/components/drop-status-display.js

@@ -1,33 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { getListableTokens, normalizeAddress } from "@medialane/sdk";
 import { cn } from "../utils/cn.js";
-function getTokenByAddress(address) {
-  return getListableTokens().find(
-    (t) => normalizeAddress("STARKNET", t.address) === normalizeAddress("STARKNET", address)
-  ) ?? null;
-}
-function DropStatusBadge({ status }) {
+function DropStatusBadge({ phase }) {
   const map = {
     live: { label: "Live", cls: "text-green-400 bg-green-500/10" },
     upcoming: { label: "Upcoming", cls: "text-brand-blue bg-brand-blue/10" },
     ended: { label: "Ended", cls: "text-muted-foreground bg-muted" },
-    sold_out: { label: "Sold out", cls: "text-brand-orange bg-brand-orange/10" }
+    "sold-out": { label: "Sold out", cls: "text-brand-orange bg-brand-orange/10" }
   };
-  const { label, cls } = map[status];
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      className: cn(
-        "inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1",
-        cls
-      ),
-      children: [
-        status === "live" && /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse" }),
-        label
-      ]
-    }
-  );
+  const { label, cls } = map[phase];
+  return /* @__PURE__ */ jsxs("span", { className: cn("inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1", cls), children: [
+    phase === "live" && /* @__PURE__ */ jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse" }),
+    label
+  ] });
 }
 function DropSupplyProgress({ minted, max }) {
   const pct = max > 0 ? Math.min(100, minted / max * 100) : 0;
@@ -55,22 +40,7 @@ function DropSupplyProgress({ minted, max }) {
     ] })
   ] });
 }
-function DropPriceDisplay({ conditions }) {
-  if (conditions.price === "0" || conditions.paymentToken === "0x0") {
-    return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 text-sm font-semibold text-green-500", children: "Free mint" });
-  }
-  const token = getTokenByAddress(conditions.paymentToken);
-  const decimals = token?.decimals ?? 18;
-  const priceNum = Number(BigInt(conditions.price) * 10000n / BigInt(10 ** decimals)) / 1e4;
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 text-sm font-semibold", children: [
-    priceNum,
-    " ",
-    token?.symbol ?? "tokens",
-    " per token"
-  ] });
-}
 export {
-  DropPriceDisplay,
   DropStatusBadge,
   DropSupplyProgress
 };

package/dist/components/drop-status-display.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/drop-status-display.tsx"],"sourcesContent":["\"use client\";\n\nimport { getListableTokens, normalizeAddress } from \"@medialane/sdk\";\nimport { cn } from \"../utils/cn.js\";\nimport type { DropConditions, DropStatus } from \"../utils/drop-status.js\";\n\nfunction getTokenByAddress(address: string) {\n  return (\n    getListableTokens().find(\n      (t) => normalizeAddress(\"STARKNET\", t.address) === normalizeAddress(\"STARKNET\", address)\n    ) ?? null\n  );\n}\n\nexport function DropStatusBadge({ status }: { status: DropStatus }) {\n  const map = {\n    live:     { label: \"Live\",     cls: \"text-green-400 bg-green-500/10\"   },\n    upcoming: { label: \"Upcoming\", cls: \"text-brand-blue bg-brand-blue/10\"     },\n    ended:    { label: \"Ended\",    cls: \"text-muted-foreground bg-muted\"   },\n    sold_out: { label: \"Sold out\", cls: \"text-brand-orange bg-brand-orange/10\" },\n  } as const;\n  const { label, cls } = map[status];\n  return (\n    <span\n      className={cn(\n        \"inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1\",\n        cls\n      )}\n    >\n      {status === \"live\" && <span className=\"h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse\" />}\n      {label}\n    </span>\n  );\n}\n\nexport function DropSupplyProgress({ minted, max }: { minted: number; max: number }) {\n  const pct = max > 0 ? Math.min(100, (minted / max) * 100) : 0;\n  return (\n    <div className=\"space-y-1.5\">\n      <div className=\"flex justify-between text-xs text-muted-foreground\">\n        <span>{minted.toLocaleString()} minted</span>\n        <span>of {max.toLocaleString()}</span>\n      </div>\n      <div className=\"h-2 rounded-full bg-muted overflow-hidden\">\n        <div\n          className=\"h-full rounded-full bg-brand-orange transition-all duration-500\"\n          style={{ width: `${pct}%` }}\n        />\n      </div>\n      <p className=\"text-xs text-muted-foreground\">{pct.toFixed(1)}% claimed</p>\n    </div>\n  );\n}\n\nexport function DropPriceDisplay({ conditions }: { conditions: DropConditions }) {\n  if (conditions.price === \"0\" || conditions.paymentToken === \"0x0\") {\n    return (\n      <div className=\"flex items-center gap-1.5 text-sm font-semibold text-green-500\">\n        Free mint\n      </div>\n    );\n  }\n  const token = getTokenByAddress(conditions.paymentToken);\n  const decimals = token?.decimals ?? 18;\n  const priceNum = Number(BigInt(conditions.price) * 10000n / BigInt(10 ** decimals)) / 10000;\n  return (\n    <div className=\"flex items-center gap-1.5 text-sm font-semibold\">\n      {priceNum} {token?.symbol ?? \"tokens\"} per token\n    </div>\n  );\n}\n"],"mappings":";AAuBI,SAMwB,KANxB;AArBJ,SAAS,mBAAmB,wBAAwB;AACpD,SAAS,UAAU;AAGnB,SAAS,kBAAkB,SAAiB;AAC1C,SACE,kBAAkB,EAAE;AAAA,IAClB,CAAC,MAAM,iBAAiB,YAAY,EAAE,OAAO,MAAM,iBAAiB,YAAY,OAAO;AAAA,EACzF,KAAK;AAET;AAEO,SAAS,gBAAgB,EAAE,OAAO,GAA2B;AAClE,QAAM,MAAM;AAAA,IACV,MAAU,EAAE,OAAO,QAAY,KAAK,iCAAmC;AAAA,IACvE,UAAU,EAAE,OAAO,YAAY,KAAK,mCAAuC;AAAA,IAC3E,OAAU,EAAE,OAAO,SAAY,KAAK,iCAAmC;AAAA,IACvE,UAAU,EAAE,OAAO,YAAY,KAAK,uCAAuC;AAAA,EAC7E;AACA,QAAM,EAAE,OAAO,IAAI,IAAI,IAAI,MAAM;AACjC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA,mBAAW,UAAU,oBAAC,UAAK,WAAU,uDAAsD;AAAA,QAC3F;AAAA;AAAA;AAAA,EACH;AAEJ;AAEO,SAAS,mBAAmB,EAAE,QAAQ,IAAI,GAAoC;AACnF,QAAM,MAAM,MAAM,IAAI,KAAK,IAAI,KAAM,SAAS,MAAO,GAAG,IAAI;AAC5D,SACE,qBAAC,SAAI,WAAU,eACb;AAAA,yBAAC,SAAI,WAAU,sDACb;AAAA,2BAAC,UAAM;AAAA,eAAO,eAAe;AAAA,QAAE;AAAA,SAAO;AAAA,MACtC,qBAAC,UAAK;AAAA;AAAA,QAAI,IAAI,eAAe;AAAA,SAAE;AAAA,OACjC;AAAA,IACA,oBAAC,SAAI,WAAU,6CACb;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,GAAG,GAAG,IAAI;AAAA;AAAA,IAC5B,GACF;AAAA,IACA,qBAAC,OAAE,WAAU,iCAAiC;AAAA,UAAI,QAAQ,CAAC;AAAA,MAAE;AAAA,OAAS;AAAA,KACxE;AAEJ;AAEO,SAAS,iBAAiB,EAAE,WAAW,GAAmC;AAC/E,MAAI,WAAW,UAAU,OAAO,WAAW,iBAAiB,OAAO;AACjE,WACE,oBAAC,SAAI,WAAU,kEAAiE,uBAEhF;AAAA,EAEJ;AACA,QAAM,QAAQ,kBAAkB,WAAW,YAAY;AACvD,QAAM,WAAW,OAAO,YAAY;AACpC,QAAM,WAAW,OAAO,OAAO,WAAW,KAAK,IAAI,SAAS,OAAO,MAAM,QAAQ,CAAC,IAAI;AACtF,SACE,qBAAC,SAAI,WAAU,mDACZ;AAAA;AAAA,IAAS;AAAA,IAAE,OAAO,UAAU;AAAA,IAAS;AAAA,KACxC;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/drop-status-display.tsx"],"sourcesContent":["\"use client\";\n\nimport { cn } from \"../utils/cn.js\";\nimport type { DropPhase } from \"../utils/drop/view.js\";\n\nexport function DropStatusBadge({ phase }: { phase: DropPhase }) {\n  const map = {\n    live:       { label: \"Live\",     cls: \"text-green-400 bg-green-500/10\" },\n    upcoming:   { label: \"Upcoming\", cls: \"text-brand-blue bg-brand-blue/10\" },\n    ended:      { label: \"Ended\",    cls: \"text-muted-foreground bg-muted\" },\n    \"sold-out\": { label: \"Sold out\", cls: \"text-brand-orange bg-brand-orange/10\" },\n  } as const;\n  const { label, cls } = map[phase];\n  return (\n    <span className={cn(\"inline-flex items-center gap-1 text-xs font-bold uppercase tracking-widest rounded-full px-3 py-1\", cls)}>\n      {phase === \"live\" && <span className=\"h-1.5 w-1.5 rounded-full bg-green-400 animate-pulse\" />}\n      {label}\n    </span>\n  );\n}\n\nexport function DropSupplyProgress({ minted, max }: { minted: number; max: number }) {\n  const pct = max > 0 ? Math.min(100, (minted / max) * 100) : 0;\n  return (\n    <div className=\"space-y-1.5\">\n      <div className=\"flex justify-between text-xs text-muted-foreground\">\n        <span>{minted.toLocaleString()} minted</span>\n        <span>of {max.toLocaleString()}</span>\n      </div>\n      <div className=\"h-2 rounded-full bg-muted overflow-hidden\">\n        <div\n          className=\"h-full rounded-full bg-brand-orange transition-all duration-500\"\n          style={{ width: `${pct}%` }}\n        />\n      </div>\n      <p className=\"text-xs text-muted-foreground\">{pct.toFixed(1)}% claimed</p>\n    </div>\n  );\n}\n"],"mappings":";AAcI,SACuB,KADvB;AAZJ,SAAS,UAAU;AAGZ,SAAS,gBAAgB,EAAE,MAAM,GAAyB;AAC/D,QAAM,MAAM;AAAA,IACV,MAAY,EAAE,OAAO,QAAY,KAAK,iCAAiC;AAAA,IACvE,UAAY,EAAE,OAAO,YAAY,KAAK,mCAAmC;AAAA,IACzE,OAAY,EAAE,OAAO,SAAY,KAAK,iCAAiC;AAAA,IACvE,YAAY,EAAE,OAAO,YAAY,KAAK,uCAAuC;AAAA,EAC/E;AACA,QAAM,EAAE,OAAO,IAAI,IAAI,IAAI,KAAK;AAChC,SACE,qBAAC,UAAK,WAAW,GAAG,qGAAqG,GAAG,GACzH;AAAA,cAAU,UAAU,oBAAC,UAAK,WAAU,uDAAsD;AAAA,IAC1F;AAAA,KACH;AAEJ;AAEO,SAAS,mBAAmB,EAAE,QAAQ,IAAI,GAAoC;AACnF,QAAM,MAAM,MAAM,IAAI,KAAK,IAAI,KAAM,SAAS,MAAO,GAAG,IAAI;AAC5D,SACE,qBAAC,SAAI,WAAU,eACb;AAAA,yBAAC,SAAI,WAAU,sDACb;AAAA,2BAAC,UAAM;AAAA,eAAO,eAAe;AAAA,QAAE;AAAA,SAAO;AAAA,MACtC,qBAAC,UAAK;AAAA;AAAA,QAAI,IAAI,eAAe;AAAA,SAAE;AAAA,OACjC;AAAA,IACA,oBAAC,SAAI,WAAU,6CACb;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,OAAO,GAAG,GAAG,IAAI;AAAA;AAAA,IAC5B,GACF;AAAA,IACA,qBAAC,OAAE,WAAU,iCAAiC;AAAA,UAAI,QAAQ,CAAC;AAAA,MAAE;AAAA,OAAS;AAAA,KACxE;AAEJ;","names":[]}

package/dist/components/image.d.cts

@@ -1 +1,3 @@
 export { default } from 'next/image';
+import 'next/link';
+import 'next/navigation';

package/dist/components/image.d.ts

@@ -1 +1,3 @@
 export { default } from 'next/image';
+import 'next/link';
+import 'next/navigation';