@medialane/ui 0.149.1 → 0.150.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/asset-marketplace-panel.cjs.map +1 -1
- package/dist/components/asset-marketplace-panel.d.cts +0 -6
- package/dist/components/asset-marketplace-panel.d.ts +0 -6
- package/dist/components/asset-marketplace-panel.js.map +1 -1
- package/dist/components/asset-markets-tab.cjs +6 -3
- package/dist/components/asset-markets-tab.cjs.map +1 -1
- package/dist/components/asset-markets-tab.js +7 -4
- package/dist/components/asset-markets-tab.js.map +1 -1
- package/dist/components/collection-hero-banner.cjs +2 -0
- package/dist/components/collection-hero-banner.cjs.map +1 -1
- package/dist/components/collection-hero-banner.js +2 -0
- package/dist/components/collection-hero-banner.js.map +1 -1
- package/dist/components/fast-mint/fast-mint.cjs.map +1 -1
- package/dist/components/fast-mint/fast-mint.js.map +1 -1
- package/dist/components/fast-mint/mintable-collections.cjs.map +1 -1
- package/dist/components/fast-mint/mintable-collections.d.cts +0 -12
- package/dist/components/fast-mint/mintable-collections.d.ts +0 -12
- package/dist/components/fast-mint/mintable-collections.js.map +1 -1
- package/dist/components/medialane-collection-card.cjs +1 -1
- package/dist/components/medialane-collection-card.cjs.map +1 -1
- package/dist/components/medialane-collection-card.js +1 -1
- package/dist/components/medialane-collection-card.js.map +1 -1
- package/dist/components/theme-ambient-background.cjs +2 -0
- package/dist/components/theme-ambient-background.cjs.map +1 -1
- package/dist/components/theme-ambient-background.js +2 -0
- package/dist/components/theme-ambient-background.js.map +1 -1
- package/dist/utils/same-address.cjs.map +1 -1
- package/dist/utils/same-address.d.cts +0 -9
- package/dist/utils/same-address.d.ts +0 -9
- package/dist/utils/same-address.js.map +1 -1
- package/dist/utils/time.cjs.map +1 -1
- package/dist/utils/time.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n ShoppingCart, Tag, X,\n} from \"lucide-react\";\nimport { CurrencyIcon, CurrencyAmount } from \"./currency-icon.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { DualPrice } from \"./dual-price.js\";\nimport { EmailVerificationGate } from \"./email-verification-gate.js\";\nimport { formatDisplayPrice, parsePriceDisplay } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\n\nexport interface ApiOrderLike {\n orderHash: string;\n offerer: string;\n endTime: string;\n price: { formatted: string | null; currency: string | null };\n}\n\nexport interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {\n cheapest?: T;\n isOwner: boolean;\n isSignedIn: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n /**\n * Whether the viewer still holds editions that are not already listed.\n * Only consulted for multi-edition assets that already have a listing.\n * Undefined means unknown, and an unknown quantity must not hide a\n * legitimate action, so it shows.\n */\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n walletAddress?: string | null;\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\n renderAuthAction: (label: string) => ReactNode;\n\n renderHelp: (content: string) => ReactNode;\n onCancelClick: (order: T) => void;\n onAcceptBid: (order: T) => void;\n onOpenListing: () => void;\n onOpenTransfer: () => void;\n onOpenPurchase: (order: T) => void;\n onOpenOffer: () => void;\n onOpenRemix?: () => void;\n onProposeDeal?: () => void;\n\n showSponsorOption?: boolean;\n onOpenSponsorProposal?: () => void;\n\n showSponsorSolicitOption?: boolean;\n onOpenSponsorSolicit?: () => void;\n\n floorPriceRaw?: string | null;\n lastSaleRaw?: string | null;\n\n listingRequiresEmailVerification?: boolean;\n settingsHref?: string;\n}\n\nfunction StatRow({ floorPriceRaw, lastSaleRaw }: { floorPriceRaw?: string | null; lastSaleRaw?: string | null }) {\n const floor = floorPriceRaw ? parsePriceDisplay(floorPriceRaw) : null;\n const lastSale = lastSaleRaw ? parsePriceDisplay(lastSaleRaw) : null;\n if (!floor?.symbol && !lastSale?.symbol) return null;\n return (\n <div className=\"flex items-center gap-4 text-sm text-muted-foreground\">\n {floor?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Floor</span>\n <CurrencyAmount amount={floor.numStr} symbol={floor.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n {lastSale?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Last sale</span>\n <CurrencyAmount amount={lastSale.numStr} symbol={lastSale.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n cheapest,\n isOwner,\n isSignedIn,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n walletAddress,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n floorPriceRaw,\n lastSaleRaw,\n usdValue,\n listingRequiresEmailVerification = false,\n settingsHref = \"/settings\",\n renderAuthAction,\n renderHelp,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n // The indexer marks orders EXPIRED on a slow sweep, so a client can hold one\n // that lapsed minutes ago. Every action below is derived from the live set\n // rather than from status, because filling a lapsed order reverts on chain\n // and the gas for that revert is sponsored.\n const liveBids = activeBids.filter((bid) => !isExpired(bid.endTime));\n const liveCheapest = cheapest && !isExpired(cheapest.endTime) ? cheapest : undefined;\n const liveMyListing = myListing && !isExpired(myListing.endTime) ? myListing : null;\n\n const myBid = !isOwner && walletAddress\n ? liveBids.find((bid) => isSameAddress(bid.offerer, walletAddress)) ?? null\n : null;\n\n const canBuyMore =\n isERC1155 && isOwner && !!liveCheapest && !!walletAddress &&\n !isSameAddress(liveCheapest.offerer, walletAddress);\n\n if (isMarketLoading && !liveCheapest) {\n return (\n <div className=\"space-y-4\">\n <div className=\"h-9 w-32 rounded-md bg-muted animate-pulse\" />\n <div className=\"h-12 w-full rounded-2xl bg-muted animate-pulse\" />\n </div>\n );\n }\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {liveCheapest ? (\n <div className=\"space-y-4\">\n <DualPrice\n amountFormatted={liveCheapest.price.formatted}\n currency={liveCheapest.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={renderHelp(\n `${isOwner && !canBuyMore ? \"Your listing\" : \"Current price\"} · Expires ${timeUntil(liveCheapest.endTime)}`\n )}\n />\n\n {isOwner ? (\n <div className=\"space-y-2\">\n <div className=\"grid grid-cols-2 gap-2\">\n {liveMyListing ? (\n <ActionButton big\n icon={isProcessing ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <X className=\"h-4 w-4\" />}\n onClick={() => onCancelClick(liveMyListing)}\n disabled={isProcessing}\n tone=\"red\"\n renderHelp={renderHelp}\n >\n {isERC1155 ? \"Cancel My Listing\" : \"Cancel Listing\"}\n </ActionButton>\n ) : null}\n\n {(!liveMyListing || (isERC1155 && canListMoreEditions !== false)) ? (\n listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>\n {liveMyListing ? \"List More Editions\" : \"List on Marketplace\"}\n </ActionButton>\n )\n ) : null}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n\n {canBuyMore && (\n <>\n <div className=\"border-t border-border/40 pt-2 mt-1\" />\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest!)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n </div>\n </>\n )}\n </div>\n ) : isSignedIn ? (\n <>\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Create your own attributed derivative of this work.\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showDealOption && onProposeDeal ? (\n <ActionButton big\n action=\"license\"\n icon={<HandCoins className=\"h-4 w-4\" />}\n onClick={onProposeDeal}\n helpContent=\"Propose a license deal to the creator to use this work.\"\n renderHelp={renderHelp}\n >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n {!remixEnabled && !showDealOption ? (\n <p className=\"text-xs text-muted-foreground mt-2 leading-relaxed\">\n The creator marked this asset as no-derivatives.\n </p>\n ) : null}\n </>\n ) : (\n renderAuthAction(\"Sign in to trade\")\n )}\n </div>\n ) : (\n <div className=\"space-y-3\">\n <StatRow floorPriceRaw={floorPriceRaw} lastSaleRaw={lastSaleRaw} />\n {isOwner ? (\n <div className=\"grid grid-cols-2 gap-2\">\n {listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>List on Marketplace</ActionButton>\n )}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n ) : isSignedIn ? (\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n ) : (\n renderAuthAction(\"Sign in to make an offer\")\n )}\n </div>\n )}\n\n {myBid ? (\n <div className=\"rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3\">\n <div className=\"min-w-0 flex items-center gap-2.5\">\n <HandCoins className=\"h-4 w-4 text-amber-500 shrink-0\" />\n <div className=\"min-w-0\">\n <p className=\"text-xs font-semibold text-amber-500\">Your active offer</p>\n <p className=\"text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5\">\n <span className=\"font-bold text-foreground inline-flex items-center gap-1\">\n {formatDisplayPrice(myBid.price.formatted)}\n <CurrencyIcon symbol={myBid.price.currency ?? \"\"} size={12} />\n </span>\n <span>·</span>\n <Clock className=\"h-3 w-3\" />\n {timeUntil(myBid.endTime)}\n </p>\n </div>\n </div>\n <button\n className=\"shrink-0 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors flex items-center gap-1\"\n onClick={() => onCancelClick(myBid)}\n >\n <X className=\"h-3.5 w-3.5\" />\n Cancel\n </button>\n </div>\n ) : null}\n\n {isOwner && liveBids.length > 0 ? (\n <div className=\"rounded-xl bg-card/40 p-5 space-y-3\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"space-y-2\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 rounded-lg bg-muted/30 px-3 py-2\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n <span className=\"text-xs text-muted-foreground\">·</span>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n </div>\n <button\n disabled={isProcessing}\n onClick={() => onAcceptBid(bid)}\n className=\"inline-flex items-center gap-1.5 rounded-lg bg-primary px-3 py-1.5 text-xs font-semibold text-primary-foreground disabled:opacity-50\"\n >\n <CheckCircle className=\"h-3.5 w-3.5\" />\n Accept\n </button>\n </div>\n ))}\n </div>\n </div>\n ) : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n ShoppingCart, Tag, X,\n} from \"lucide-react\";\nimport { CurrencyIcon, CurrencyAmount } from \"./currency-icon.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { DualPrice } from \"./dual-price.js\";\nimport { EmailVerificationGate } from \"./email-verification-gate.js\";\nimport { formatDisplayPrice, parsePriceDisplay } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\n\nexport interface ApiOrderLike {\n orderHash: string;\n offerer: string;\n endTime: string;\n price: { formatted: string | null; currency: string | null };\n}\n\nexport interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {\n cheapest?: T;\n isOwner: boolean;\n isSignedIn: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n walletAddress?: string | null;\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\n renderAuthAction: (label: string) => ReactNode;\n\n renderHelp: (content: string) => ReactNode;\n onCancelClick: (order: T) => void;\n onAcceptBid: (order: T) => void;\n onOpenListing: () => void;\n onOpenTransfer: () => void;\n onOpenPurchase: (order: T) => void;\n onOpenOffer: () => void;\n onOpenRemix?: () => void;\n onProposeDeal?: () => void;\n\n showSponsorOption?: boolean;\n onOpenSponsorProposal?: () => void;\n\n showSponsorSolicitOption?: boolean;\n onOpenSponsorSolicit?: () => void;\n\n floorPriceRaw?: string | null;\n lastSaleRaw?: string | null;\n\n listingRequiresEmailVerification?: boolean;\n settingsHref?: string;\n}\n\nfunction StatRow({ floorPriceRaw, lastSaleRaw }: { floorPriceRaw?: string | null; lastSaleRaw?: string | null }) {\n const floor = floorPriceRaw ? parsePriceDisplay(floorPriceRaw) : null;\n const lastSale = lastSaleRaw ? parsePriceDisplay(lastSaleRaw) : null;\n if (!floor?.symbol && !lastSale?.symbol) return null;\n return (\n <div className=\"flex items-center gap-4 text-sm text-muted-foreground\">\n {floor?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Floor</span>\n <CurrencyAmount amount={floor.numStr} symbol={floor.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n {lastSale?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Last sale</span>\n <CurrencyAmount amount={lastSale.numStr} symbol={lastSale.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n cheapest,\n isOwner,\n isSignedIn,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n walletAddress,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n floorPriceRaw,\n lastSaleRaw,\n usdValue,\n listingRequiresEmailVerification = false,\n settingsHref = \"/settings\",\n renderAuthAction,\n renderHelp,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const liveBids = activeBids.filter((bid) => !isExpired(bid.endTime));\n const liveCheapest = cheapest && !isExpired(cheapest.endTime) ? cheapest : undefined;\n const liveMyListing = myListing && !isExpired(myListing.endTime) ? myListing : null;\n\n const myBid = !isOwner && walletAddress\n ? liveBids.find((bid) => isSameAddress(bid.offerer, walletAddress)) ?? null\n : null;\n\n const canBuyMore =\n isERC1155 && isOwner && !!liveCheapest && !!walletAddress &&\n !isSameAddress(liveCheapest.offerer, walletAddress);\n\n if (isMarketLoading && !liveCheapest) {\n return (\n <div className=\"space-y-4\">\n <div className=\"h-9 w-32 rounded-md bg-muted animate-pulse\" />\n <div className=\"h-12 w-full rounded-2xl bg-muted animate-pulse\" />\n </div>\n );\n }\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {liveCheapest ? (\n <div className=\"space-y-4\">\n <DualPrice\n amountFormatted={liveCheapest.price.formatted}\n currency={liveCheapest.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={renderHelp(\n `${isOwner && !canBuyMore ? \"Your listing\" : \"Current price\"} · Expires ${timeUntil(liveCheapest.endTime)}`\n )}\n />\n\n {isOwner ? (\n <div className=\"space-y-2\">\n <div className=\"grid grid-cols-2 gap-2\">\n {liveMyListing ? (\n <ActionButton big\n icon={isProcessing ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <X className=\"h-4 w-4\" />}\n onClick={() => onCancelClick(liveMyListing)}\n disabled={isProcessing}\n tone=\"red\"\n renderHelp={renderHelp}\n >\n {isERC1155 ? \"Cancel My Listing\" : \"Cancel Listing\"}\n </ActionButton>\n ) : null}\n\n {(!liveMyListing || (isERC1155 && canListMoreEditions !== false)) ? (\n listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>\n {liveMyListing ? \"List More Editions\" : \"List on Marketplace\"}\n </ActionButton>\n )\n ) : null}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n\n {canBuyMore && (\n <>\n <div className=\"border-t border-border/40 pt-2 mt-1\" />\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest!)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n </div>\n </>\n )}\n </div>\n ) : isSignedIn ? (\n <>\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Create your own attributed derivative of this work.\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showDealOption && onProposeDeal ? (\n <ActionButton big\n action=\"license\"\n icon={<HandCoins className=\"h-4 w-4\" />}\n onClick={onProposeDeal}\n helpContent=\"Propose a license deal to the creator to use this work.\"\n renderHelp={renderHelp}\n >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n {!remixEnabled && !showDealOption ? (\n <p className=\"text-xs text-muted-foreground mt-2 leading-relaxed\">\n The creator marked this asset as no-derivatives.\n </p>\n ) : null}\n </>\n ) : (\n renderAuthAction(\"Sign in to trade\")\n )}\n </div>\n ) : (\n <div className=\"space-y-3\">\n <StatRow floorPriceRaw={floorPriceRaw} lastSaleRaw={lastSaleRaw} />\n {isOwner ? (\n <div className=\"grid grid-cols-2 gap-2\">\n {listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>List on Marketplace</ActionButton>\n )}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n ) : isSignedIn ? (\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n ) : (\n renderAuthAction(\"Sign in to make an offer\")\n )}\n </div>\n )}\n\n {myBid ? (\n <div className=\"rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3\">\n <div className=\"min-w-0 flex items-center gap-2.5\">\n <HandCoins className=\"h-4 w-4 text-amber-500 shrink-0\" />\n <div className=\"min-w-0\">\n <p className=\"text-xs font-semibold text-amber-500\">Your active offer</p>\n <p className=\"text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5\">\n <span className=\"font-bold text-foreground inline-flex items-center gap-1\">\n {formatDisplayPrice(myBid.price.formatted)}\n <CurrencyIcon symbol={myBid.price.currency ?? \"\"} size={12} />\n </span>\n <span>·</span>\n <Clock className=\"h-3 w-3\" />\n {timeUntil(myBid.endTime)}\n </p>\n </div>\n </div>\n <button\n className=\"shrink-0 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors flex items-center gap-1\"\n onClick={() => onCancelClick(myBid)}\n >\n <X className=\"h-3.5 w-3.5\" />\n Cancel\n </button>\n </div>\n ) : null}\n\n {isOwner && liveBids.length > 0 ? (\n <div className=\"rounded-xl bg-card/40 p-5 space-y-3\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"space-y-2\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 rounded-lg bg-muted/30 px-3 py-2\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n <span className=\"text-xs text-muted-foreground\">·</span>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n </div>\n <button\n disabled={isProcessing}\n onClick={() => onAcceptBid(bid)}\n className=\"inline-flex items-center gap-1.5 rounded-lg bg-primary px-3 py-1.5 text-xs font-semibold text-primary-foreground disabled:opacity-50\"\n >\n <CheckCircle className=\"h-3.5 w-3.5\" />\n Accept\n </button>\n </div>\n ))}\n </div>\n </div>\n ) : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -16,12 +16,6 @@ interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {
|
|
|
16
16
|
isSignedIn: boolean;
|
|
17
17
|
isProcessing: boolean;
|
|
18
18
|
isERC1155: boolean;
|
|
19
|
-
/**
|
|
20
|
-
* Whether the viewer still holds editions that are not already listed.
|
|
21
|
-
* Only consulted for multi-edition assets that already have a listing.
|
|
22
|
-
* Undefined means unknown, and an unknown quantity must not hide a
|
|
23
|
-
* legitimate action, so it shows.
|
|
24
|
-
*/
|
|
25
19
|
canListMoreEditions?: boolean;
|
|
26
20
|
isMarketLoading?: boolean;
|
|
27
21
|
myListing: T | null;
|
|
@@ -16,12 +16,6 @@ interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {
|
|
|
16
16
|
isSignedIn: boolean;
|
|
17
17
|
isProcessing: boolean;
|
|
18
18
|
isERC1155: boolean;
|
|
19
|
-
/**
|
|
20
|
-
* Whether the viewer still holds editions that are not already listed.
|
|
21
|
-
* Only consulted for multi-edition assets that already have a listing.
|
|
22
|
-
* Undefined means unknown, and an unknown quantity must not hide a
|
|
23
|
-
* legitimate action, so it shows.
|
|
24
|
-
*/
|
|
25
19
|
canListMoreEditions?: boolean;
|
|
26
20
|
isMarketLoading?: boolean;
|
|
27
21
|
myListing: T | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n ShoppingCart, Tag, X,\n} from \"lucide-react\";\nimport { CurrencyIcon, CurrencyAmount } from \"./currency-icon.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { DualPrice } from \"./dual-price.js\";\nimport { EmailVerificationGate } from \"./email-verification-gate.js\";\nimport { formatDisplayPrice, parsePriceDisplay } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\n\nexport interface ApiOrderLike {\n orderHash: string;\n offerer: string;\n endTime: string;\n price: { formatted: string | null; currency: string | null };\n}\n\nexport interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {\n cheapest?: T;\n isOwner: boolean;\n isSignedIn: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n /**\n * Whether the viewer still holds editions that are not already listed.\n * Only consulted for multi-edition assets that already have a listing.\n * Undefined means unknown, and an unknown quantity must not hide a\n * legitimate action, so it shows.\n */\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n walletAddress?: string | null;\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\n renderAuthAction: (label: string) => ReactNode;\n\n renderHelp: (content: string) => ReactNode;\n onCancelClick: (order: T) => void;\n onAcceptBid: (order: T) => void;\n onOpenListing: () => void;\n onOpenTransfer: () => void;\n onOpenPurchase: (order: T) => void;\n onOpenOffer: () => void;\n onOpenRemix?: () => void;\n onProposeDeal?: () => void;\n\n showSponsorOption?: boolean;\n onOpenSponsorProposal?: () => void;\n\n showSponsorSolicitOption?: boolean;\n onOpenSponsorSolicit?: () => void;\n\n floorPriceRaw?: string | null;\n lastSaleRaw?: string | null;\n\n listingRequiresEmailVerification?: boolean;\n settingsHref?: string;\n}\n\nfunction StatRow({ floorPriceRaw, lastSaleRaw }: { floorPriceRaw?: string | null; lastSaleRaw?: string | null }) {\n const floor = floorPriceRaw ? parsePriceDisplay(floorPriceRaw) : null;\n const lastSale = lastSaleRaw ? parsePriceDisplay(lastSaleRaw) : null;\n if (!floor?.symbol && !lastSale?.symbol) return null;\n return (\n <div className=\"flex items-center gap-4 text-sm text-muted-foreground\">\n {floor?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Floor</span>\n <CurrencyAmount amount={floor.numStr} symbol={floor.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n {lastSale?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Last sale</span>\n <CurrencyAmount amount={lastSale.numStr} symbol={lastSale.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n cheapest,\n isOwner,\n isSignedIn,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n walletAddress,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n floorPriceRaw,\n lastSaleRaw,\n usdValue,\n listingRequiresEmailVerification = false,\n settingsHref = \"/settings\",\n renderAuthAction,\n renderHelp,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n // The indexer marks orders EXPIRED on a slow sweep, so a client can hold one\n // that lapsed minutes ago. Every action below is derived from the live set\n // rather than from status, because filling a lapsed order reverts on chain\n // and the gas for that revert is sponsored.\n const liveBids = activeBids.filter((bid) => !isExpired(bid.endTime));\n const liveCheapest = cheapest && !isExpired(cheapest.endTime) ? cheapest : undefined;\n const liveMyListing = myListing && !isExpired(myListing.endTime) ? myListing : null;\n\n const myBid = !isOwner && walletAddress\n ? liveBids.find((bid) => isSameAddress(bid.offerer, walletAddress)) ?? null\n : null;\n\n const canBuyMore =\n isERC1155 && isOwner && !!liveCheapest && !!walletAddress &&\n !isSameAddress(liveCheapest.offerer, walletAddress);\n\n if (isMarketLoading && !liveCheapest) {\n return (\n <div className=\"space-y-4\">\n <div className=\"h-9 w-32 rounded-md bg-muted animate-pulse\" />\n <div className=\"h-12 w-full rounded-2xl bg-muted animate-pulse\" />\n </div>\n );\n }\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {liveCheapest ? (\n <div className=\"space-y-4\">\n <DualPrice\n amountFormatted={liveCheapest.price.formatted}\n currency={liveCheapest.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={renderHelp(\n `${isOwner && !canBuyMore ? \"Your listing\" : \"Current price\"} · Expires ${timeUntil(liveCheapest.endTime)}`\n )}\n />\n\n {isOwner ? (\n <div className=\"space-y-2\">\n <div className=\"grid grid-cols-2 gap-2\">\n {liveMyListing ? (\n <ActionButton big\n icon={isProcessing ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <X className=\"h-4 w-4\" />}\n onClick={() => onCancelClick(liveMyListing)}\n disabled={isProcessing}\n tone=\"red\"\n renderHelp={renderHelp}\n >\n {isERC1155 ? \"Cancel My Listing\" : \"Cancel Listing\"}\n </ActionButton>\n ) : null}\n\n {(!liveMyListing || (isERC1155 && canListMoreEditions !== false)) ? (\n listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>\n {liveMyListing ? \"List More Editions\" : \"List on Marketplace\"}\n </ActionButton>\n )\n ) : null}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n\n {canBuyMore && (\n <>\n <div className=\"border-t border-border/40 pt-2 mt-1\" />\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest!)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n </div>\n </>\n )}\n </div>\n ) : isSignedIn ? (\n <>\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Create your own attributed derivative of this work.\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showDealOption && onProposeDeal ? (\n <ActionButton big\n action=\"license\"\n icon={<HandCoins className=\"h-4 w-4\" />}\n onClick={onProposeDeal}\n helpContent=\"Propose a license deal to the creator to use this work.\"\n renderHelp={renderHelp}\n >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n {!remixEnabled && !showDealOption ? (\n <p className=\"text-xs text-muted-foreground mt-2 leading-relaxed\">\n The creator marked this asset as no-derivatives.\n </p>\n ) : null}\n </>\n ) : (\n renderAuthAction(\"Sign in to trade\")\n )}\n </div>\n ) : (\n <div className=\"space-y-3\">\n <StatRow floorPriceRaw={floorPriceRaw} lastSaleRaw={lastSaleRaw} />\n {isOwner ? (\n <div className=\"grid grid-cols-2 gap-2\">\n {listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>List on Marketplace</ActionButton>\n )}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n ) : isSignedIn ? (\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n ) : (\n renderAuthAction(\"Sign in to make an offer\")\n )}\n </div>\n )}\n\n {myBid ? (\n <div className=\"rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3\">\n <div className=\"min-w-0 flex items-center gap-2.5\">\n <HandCoins className=\"h-4 w-4 text-amber-500 shrink-0\" />\n <div className=\"min-w-0\">\n <p className=\"text-xs font-semibold text-amber-500\">Your active offer</p>\n <p className=\"text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5\">\n <span className=\"font-bold text-foreground inline-flex items-center gap-1\">\n {formatDisplayPrice(myBid.price.formatted)}\n <CurrencyIcon symbol={myBid.price.currency ?? \"\"} size={12} />\n </span>\n <span>·</span>\n <Clock className=\"h-3 w-3\" />\n {timeUntil(myBid.endTime)}\n </p>\n </div>\n </div>\n <button\n className=\"shrink-0 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors flex items-center gap-1\"\n onClick={() => onCancelClick(myBid)}\n >\n <X className=\"h-3.5 w-3.5\" />\n Cancel\n </button>\n </div>\n ) : null}\n\n {isOwner && liveBids.length > 0 ? (\n <div className=\"rounded-xl bg-card/40 p-5 space-y-3\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"space-y-2\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 rounded-lg bg-muted/30 px-3 py-2\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n <span className=\"text-xs text-muted-foreground\">·</span>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n </div>\n <button\n disabled={isProcessing}\n onClick={() => onAcceptBid(bid)}\n className=\"inline-flex items-center gap-1.5 rounded-lg bg-primary px-3 py-1.5 text-xs font-semibold text-primary-foreground disabled:opacity-50\"\n >\n <CheckCircle className=\"h-3.5 w-3.5\" />\n Accept\n </button>\n </div>\n ))}\n </div>\n </div>\n ) : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n ShoppingCart, Tag, X,\n} from \"lucide-react\";\nimport { CurrencyIcon, CurrencyAmount } from \"./currency-icon.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { DualPrice } from \"./dual-price.js\";\nimport { EmailVerificationGate } from \"./email-verification-gate.js\";\nimport { formatDisplayPrice, parsePriceDisplay } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\n\nexport interface ApiOrderLike {\n orderHash: string;\n offerer: string;\n endTime: string;\n price: { formatted: string | null; currency: string | null };\n}\n\nexport interface AssetMarketplacePanelProps<T extends ApiOrderLike = ApiOrderLike> {\n cheapest?: T;\n isOwner: boolean;\n isSignedIn: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n walletAddress?: string | null;\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\n renderAuthAction: (label: string) => ReactNode;\n\n renderHelp: (content: string) => ReactNode;\n onCancelClick: (order: T) => void;\n onAcceptBid: (order: T) => void;\n onOpenListing: () => void;\n onOpenTransfer: () => void;\n onOpenPurchase: (order: T) => void;\n onOpenOffer: () => void;\n onOpenRemix?: () => void;\n onProposeDeal?: () => void;\n\n showSponsorOption?: boolean;\n onOpenSponsorProposal?: () => void;\n\n showSponsorSolicitOption?: boolean;\n onOpenSponsorSolicit?: () => void;\n\n floorPriceRaw?: string | null;\n lastSaleRaw?: string | null;\n\n listingRequiresEmailVerification?: boolean;\n settingsHref?: string;\n}\n\nfunction StatRow({ floorPriceRaw, lastSaleRaw }: { floorPriceRaw?: string | null; lastSaleRaw?: string | null }) {\n const floor = floorPriceRaw ? parsePriceDisplay(floorPriceRaw) : null;\n const lastSale = lastSaleRaw ? parsePriceDisplay(lastSaleRaw) : null;\n if (!floor?.symbol && !lastSale?.symbol) return null;\n return (\n <div className=\"flex items-center gap-4 text-sm text-muted-foreground\">\n {floor?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Floor</span>\n <CurrencyAmount amount={floor.numStr} symbol={floor.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n {lastSale?.symbol && (\n <span className=\"flex items-center gap-1.5\">\n <span>Last sale</span>\n <CurrencyAmount amount={lastSale.numStr} symbol={lastSale.symbol} iconSize={12} amountClassName=\"text-foreground font-semibold\" />\n </span>\n )}\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n cheapest,\n isOwner,\n isSignedIn,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n walletAddress,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n floorPriceRaw,\n lastSaleRaw,\n usdValue,\n listingRequiresEmailVerification = false,\n settingsHref = \"/settings\",\n renderAuthAction,\n renderHelp,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const liveBids = activeBids.filter((bid) => !isExpired(bid.endTime));\n const liveCheapest = cheapest && !isExpired(cheapest.endTime) ? cheapest : undefined;\n const liveMyListing = myListing && !isExpired(myListing.endTime) ? myListing : null;\n\n const myBid = !isOwner && walletAddress\n ? liveBids.find((bid) => isSameAddress(bid.offerer, walletAddress)) ?? null\n : null;\n\n const canBuyMore =\n isERC1155 && isOwner && !!liveCheapest && !!walletAddress &&\n !isSameAddress(liveCheapest.offerer, walletAddress);\n\n if (isMarketLoading && !liveCheapest) {\n return (\n <div className=\"space-y-4\">\n <div className=\"h-9 w-32 rounded-md bg-muted animate-pulse\" />\n <div className=\"h-12 w-full rounded-2xl bg-muted animate-pulse\" />\n </div>\n );\n }\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {liveCheapest ? (\n <div className=\"space-y-4\">\n <DualPrice\n amountFormatted={liveCheapest.price.formatted}\n currency={liveCheapest.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={renderHelp(\n `${isOwner && !canBuyMore ? \"Your listing\" : \"Current price\"} · Expires ${timeUntil(liveCheapest.endTime)}`\n )}\n />\n\n {isOwner ? (\n <div className=\"space-y-2\">\n <div className=\"grid grid-cols-2 gap-2\">\n {liveMyListing ? (\n <ActionButton big\n icon={isProcessing ? <Loader2 className=\"h-4 w-4 animate-spin\" /> : <X className=\"h-4 w-4\" />}\n onClick={() => onCancelClick(liveMyListing)}\n disabled={isProcessing}\n tone=\"red\"\n renderHelp={renderHelp}\n >\n {isERC1155 ? \"Cancel My Listing\" : \"Cancel Listing\"}\n </ActionButton>\n ) : null}\n\n {(!liveMyListing || (isERC1155 && canListMoreEditions !== false)) ? (\n listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>\n {liveMyListing ? \"List More Editions\" : \"List on Marketplace\"}\n </ActionButton>\n )\n ) : null}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n\n {canBuyMore && (\n <>\n <div className=\"border-t border-border/40 pt-2 mt-1\" />\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest!)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n </div>\n </>\n )}\n </div>\n ) : isSignedIn ? (\n <>\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"buy\" icon={<ShoppingCart className=\"h-4 w-4\" />} onClick={() => onOpenPurchase(liveCheapest)} renderHelp={renderHelp}>Buy</ActionButton>\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Create your own attributed derivative of this work.\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showDealOption && onProposeDeal ? (\n <ActionButton big\n action=\"license\"\n icon={<HandCoins className=\"h-4 w-4\" />}\n onClick={onProposeDeal}\n helpContent=\"Propose a license deal to the creator to use this work.\"\n renderHelp={renderHelp}\n >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n {!remixEnabled && !showDealOption ? (\n <p className=\"text-xs text-muted-foreground mt-2 leading-relaxed\">\n The creator marked this asset as no-derivatives.\n </p>\n ) : null}\n </>\n ) : (\n renderAuthAction(\"Sign in to trade\")\n )}\n </div>\n ) : (\n <div className=\"space-y-3\">\n <StatRow floorPriceRaw={floorPriceRaw} lastSaleRaw={lastSaleRaw} />\n {isOwner ? (\n <div className=\"grid grid-cols-2 gap-2\">\n {listingRequiresEmailVerification ? (\n <EmailVerificationGate reason=\"list assets for sale\" settingsHref={settingsHref} />\n ) : (\n <ActionButton big tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing} renderHelp={renderHelp}>List on Marketplace</ActionButton>\n )}\n <ActionButton big tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer} renderHelp={renderHelp}>Transfer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorSolicit}\n helpContent=\"Let sponsors bid on a license for this asset.\"\n renderHelp={renderHelp}\n >\n Open for Sponsorship\n </ActionButton>\n ) : null}\n </div>\n ) : isSignedIn ? (\n <div className=\"grid grid-cols-2 gap-2\">\n <ActionButton big action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer} renderHelp={renderHelp}>Make offer</ActionButton>\n {remixEnabled && onOpenRemix ? (\n <ActionButton big\n action=\"remix\"\n icon={<GitBranch className=\"h-4 w-4\" />}\n onClick={onOpenRemix}\n helpContent=\"Build a licensed derivative of this digital asset — your remix is minted as a new onchain NFT linked to the original\"\n renderHelp={renderHelp}\n >\n Remix\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton big\n tone=\"blue\"\n icon={<Handshake className=\"h-4 w-4\" />}\n onClick={onOpenSponsorProposal}\n helpContent=\"Propose to sponsor this creator's work — pay them directly for a license, no escrow.\"\n renderHelp={renderHelp}\n >\n Sponsor this IP\n </ActionButton>\n ) : null}\n </div>\n ) : (\n renderAuthAction(\"Sign in to make an offer\")\n )}\n </div>\n )}\n\n {myBid ? (\n <div className=\"rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3\">\n <div className=\"min-w-0 flex items-center gap-2.5\">\n <HandCoins className=\"h-4 w-4 text-amber-500 shrink-0\" />\n <div className=\"min-w-0\">\n <p className=\"text-xs font-semibold text-amber-500\">Your active offer</p>\n <p className=\"text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5\">\n <span className=\"font-bold text-foreground inline-flex items-center gap-1\">\n {formatDisplayPrice(myBid.price.formatted)}\n <CurrencyIcon symbol={myBid.price.currency ?? \"\"} size={12} />\n </span>\n <span>·</span>\n <Clock className=\"h-3 w-3\" />\n {timeUntil(myBid.endTime)}\n </p>\n </div>\n </div>\n <button\n className=\"shrink-0 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors flex items-center gap-1\"\n onClick={() => onCancelClick(myBid)}\n >\n <X className=\"h-3.5 w-3.5\" />\n Cancel\n </button>\n </div>\n ) : null}\n\n {isOwner && liveBids.length > 0 ? (\n <div className=\"rounded-xl bg-card/40 p-5 space-y-3\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"space-y-2\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 rounded-lg bg-muted/30 px-3 py-2\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n <span className=\"text-xs text-muted-foreground\">·</span>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n </div>\n <button\n disabled={isProcessing}\n onClick={() => onAcceptBid(bid)}\n className=\"inline-flex items-center gap-1.5 rounded-lg bg-primary px-3 py-1.5 text-xs font-semibold text-primary-foreground disabled:opacity-50\"\n >\n <CheckCircle className=\"h-3.5 w-3.5\" />\n Accept\n </button>\n </div>\n ))}\n </div>\n </div>\n ) : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -27,6 +27,7 @@ var import_address_display = require("./address-display.js");
|
|
|
27
27
|
var import_currency_icon = require("./currency-icon.js");
|
|
28
28
|
var import_format = require("../utils/format.js");
|
|
29
29
|
var import_time = require("../utils/time.js");
|
|
30
|
+
var import_same_address = require("../utils/same-address.js");
|
|
30
31
|
var import_cn = require("../utils/cn.js");
|
|
31
32
|
var import_lucide_react = require("lucide-react");
|
|
32
33
|
function ActionButton({
|
|
@@ -57,11 +58,13 @@ function AssetMarketsTab({
|
|
|
57
58
|
onCancelClick,
|
|
58
59
|
onAcceptClick
|
|
59
60
|
}) {
|
|
61
|
+
const liveListings = activeListings.filter((o) => !(0, import_time.isExpired)(o.endTime));
|
|
62
|
+
const liveBids = activeBids.filter((o) => !(0, import_time.isExpired)(o.endTime));
|
|
60
63
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mt-4 space-y-6", children: [
|
|
61
64
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
62
65
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Listings" }),
|
|
63
|
-
|
|
64
|
-
const isMyOrder =
|
|
66
|
+
liveListings.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground py-4 text-center", children: "No active listings." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-xl border border-border divide-y divide-border", children: liveListings.map((order) => {
|
|
67
|
+
const isMyOrder = (0, import_same_address.isSameAddress)(order.offerer, walletAddress);
|
|
65
68
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between px-4 py-3 gap-4", children: [
|
|
66
69
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
|
|
67
70
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "font-bold text-sm inline-flex items-center gap-1.5", children: [
|
|
@@ -82,7 +85,7 @@ function AssetMarketsTab({
|
|
|
82
85
|
] }),
|
|
83
86
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
84
87
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Offers" }),
|
|
85
|
-
|
|
88
|
+
liveBids.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground py-4 text-center", children: "No active offers." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-xl border border-border divide-y divide-border", children: liveBids.map((bid) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between px-4 py-3 gap-4", children: [
|
|
86
89
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
|
|
87
90
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "font-bold text-sm", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
88
91
|
(0, import_format.formatDisplayPrice)(bid.price.formatted),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-markets-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { timeUntil } from \"../utils/time.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { Clock, CheckCircle } from \"lucide-react\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nfunction ActionButton({\n variant = \"default\",\n className,\n ...props\n}: React.ButtonHTMLAttributes<HTMLButtonElement> & { variant?: \"default\" | \"destructive\" }) {\n return (\n <button\n className={cn(\n \"inline-flex items-center justify-center h-9 rounded-md px-3 text-xs font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n variant === \"destructive\"\n ? \"bg-destructive text-destructive-foreground hover:bg-destructive/90\"\n : \"bg-primary text-primary-foreground hover:bg-primary/90\",\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface AssetMarketsTabProps {\n activeListings: ApiOrder[];\n activeBids: ApiOrder[];\n walletAddress?: string;\n isOwner: boolean;\n isProcessing: boolean;\n onBuyClick: (order: ApiOrder) => void;\n onCancelClick: (order: ApiOrder) => void;\n onAcceptClick: (order: ApiOrder) => void;\n}\n\nexport function AssetMarketsTab({\n activeListings,\n activeBids,\n walletAddress,\n isOwner,\n isProcessing,\n onBuyClick,\n onCancelClick,\n onAcceptClick,\n}: AssetMarketsTabProps) {\n return (\n <div className=\"mt-4 space-y-6\">\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Listings</p>\n {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-markets-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { Clock, CheckCircle } from \"lucide-react\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nfunction ActionButton({\n variant = \"default\",\n className,\n ...props\n}: React.ButtonHTMLAttributes<HTMLButtonElement> & { variant?: \"default\" | \"destructive\" }) {\n return (\n <button\n className={cn(\n \"inline-flex items-center justify-center h-9 rounded-md px-3 text-xs font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n variant === \"destructive\"\n ? \"bg-destructive text-destructive-foreground hover:bg-destructive/90\"\n : \"bg-primary text-primary-foreground hover:bg-primary/90\",\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface AssetMarketsTabProps {\n activeListings: ApiOrder[];\n activeBids: ApiOrder[];\n walletAddress?: string;\n isOwner: boolean;\n isProcessing: boolean;\n onBuyClick: (order: ApiOrder) => void;\n onCancelClick: (order: ApiOrder) => void;\n onAcceptClick: (order: ApiOrder) => void;\n}\n\nexport function AssetMarketsTab({\n activeListings,\n activeBids,\n walletAddress,\n isOwner,\n isProcessing,\n onBuyClick,\n onCancelClick,\n onAcceptClick,\n}: AssetMarketsTabProps) {\n const liveListings = activeListings.filter((o) => !isExpired(o.endTime));\n const liveBids = activeBids.filter((o) => !isExpired(o.endTime));\n\n return (\n <div className=\"mt-4 space-y-6\">\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Listings</p>\n {liveListings.length === 0 ? (\n <p className=\"text-sm text-muted-foreground py-4 text-center\">No active listings.</p>\n ) : (\n <div className=\"rounded-xl border border-border divide-y divide-border\">\n {liveListings.map((order) => {\n const isMyOrder = isSameAddress(order.offerer, walletAddress);\n return (\n <div key={order.orderHash} className=\"flex items-center justify-between px-4 py-3 gap-4\">\n <div className=\"min-w-0\">\n <p className=\"font-bold text-sm inline-flex items-center gap-1.5\">\n {formatDisplayPrice(order.price.formatted)}\n <CurrencyIcon symbol={order.price.currency ?? \"\"} size={14} />\n </p>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground mt-0.5\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(order.endTime)}\n </div>\n </div>\n <div className=\"flex items-center gap-2 shrink-0\">\n <AddressDisplay address={order.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n {isMyOrder ? (\n <ActionButton variant=\"destructive\" disabled={isProcessing} onClick={() => onCancelClick(order)}>\n Cancel\n </ActionButton>\n ) : (\n <ActionButton onClick={() => onBuyClick(order)}>Buy</ActionButton>\n )}\n </div>\n </div>\n );\n })}\n </div>\n )}\n </div>\n\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Offers</p>\n {liveBids.length === 0 ? (\n <p className=\"text-sm text-muted-foreground py-4 text-center\">No active offers.</p>\n ) : (\n <div className=\"rounded-xl border border-border divide-y divide-border\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between px-4 py-3 gap-4\">\n <div className=\"min-w-0\">\n <p className=\"font-bold text-sm\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground mt-0.5\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n <div className=\"flex items-center gap-2 shrink-0\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n {isOwner && (\n <ActionButton disabled={isProcessing} onClick={() => onAcceptClick(bid)}>\n <CheckCircle className=\"h-3.5 w-3.5 mr-1.5\" />\n Accept\n </ActionButton>\n )}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -3,7 +3,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import { AddressDisplay } from "./address-display.js";
|
|
4
4
|
import { CurrencyIcon } from "./currency-icon.js";
|
|
5
5
|
import { formatDisplayPrice } from "../utils/format.js";
|
|
6
|
-
import { timeUntil } from "../utils/time.js";
|
|
6
|
+
import { isExpired, timeUntil } from "../utils/time.js";
|
|
7
|
+
import { isSameAddress } from "../utils/same-address.js";
|
|
7
8
|
import { cn } from "../utils/cn.js";
|
|
8
9
|
import { Clock, CheckCircle } from "lucide-react";
|
|
9
10
|
function ActionButton({
|
|
@@ -34,11 +35,13 @@ function AssetMarketsTab({
|
|
|
34
35
|
onCancelClick,
|
|
35
36
|
onAcceptClick
|
|
36
37
|
}) {
|
|
38
|
+
const liveListings = activeListings.filter((o) => !isExpired(o.endTime));
|
|
39
|
+
const liveBids = activeBids.filter((o) => !isExpired(o.endTime));
|
|
37
40
|
return /* @__PURE__ */ jsxs("div", { className: "mt-4 space-y-6", children: [
|
|
38
41
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
39
42
|
/* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Listings" }),
|
|
40
|
-
|
|
41
|
-
const isMyOrder =
|
|
43
|
+
liveListings.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground py-4 text-center", children: "No active listings." }) : /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-border divide-y divide-border", children: liveListings.map((order) => {
|
|
44
|
+
const isMyOrder = isSameAddress(order.offerer, walletAddress);
|
|
42
45
|
return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-3 gap-4", children: [
|
|
43
46
|
/* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
|
|
44
47
|
/* @__PURE__ */ jsxs("p", { className: "font-bold text-sm inline-flex items-center gap-1.5", children: [
|
|
@@ -59,7 +62,7 @@ function AssetMarketsTab({
|
|
|
59
62
|
] }),
|
|
60
63
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
61
64
|
/* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-muted-foreground mb-2", children: "Offers" }),
|
|
62
|
-
|
|
65
|
+
liveBids.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground py-4 text-center", children: "No active offers." }) : /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-border divide-y divide-border", children: liveBids.map((bid) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-4 py-3 gap-4", children: [
|
|
63
66
|
/* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
|
|
64
67
|
/* @__PURE__ */ jsx("p", { className: "font-bold text-sm", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
|
|
65
68
|
formatDisplayPrice(bid.price.formatted),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-markets-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { timeUntil } from \"../utils/time.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { Clock, CheckCircle } from \"lucide-react\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nfunction ActionButton({\n variant = \"default\",\n className,\n ...props\n}: React.ButtonHTMLAttributes<HTMLButtonElement> & { variant?: \"default\" | \"destructive\" }) {\n return (\n <button\n className={cn(\n \"inline-flex items-center justify-center h-9 rounded-md px-3 text-xs font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n variant === \"destructive\"\n ? \"bg-destructive text-destructive-foreground hover:bg-destructive/90\"\n : \"bg-primary text-primary-foreground hover:bg-primary/90\",\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface AssetMarketsTabProps {\n activeListings: ApiOrder[];\n activeBids: ApiOrder[];\n walletAddress?: string;\n isOwner: boolean;\n isProcessing: boolean;\n onBuyClick: (order: ApiOrder) => void;\n onCancelClick: (order: ApiOrder) => void;\n onAcceptClick: (order: ApiOrder) => void;\n}\n\nexport function AssetMarketsTab({\n activeListings,\n activeBids,\n walletAddress,\n isOwner,\n isProcessing,\n onBuyClick,\n onCancelClick,\n onAcceptClick,\n}: AssetMarketsTabProps) {\n return (\n <div className=\"mt-4 space-y-6\">\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Listings</p>\n {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-markets-tab.tsx"],"sourcesContent":["\"use client\";\n\nimport { AddressDisplay } from \"./address-display.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { Clock, CheckCircle } from \"lucide-react\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nfunction ActionButton({\n variant = \"default\",\n className,\n ...props\n}: React.ButtonHTMLAttributes<HTMLButtonElement> & { variant?: \"default\" | \"destructive\" }) {\n return (\n <button\n className={cn(\n \"inline-flex items-center justify-center h-9 rounded-md px-3 text-xs font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n variant === \"destructive\"\n ? \"bg-destructive text-destructive-foreground hover:bg-destructive/90\"\n : \"bg-primary text-primary-foreground hover:bg-primary/90\",\n className,\n )}\n {...props}\n />\n );\n}\n\ninterface AssetMarketsTabProps {\n activeListings: ApiOrder[];\n activeBids: ApiOrder[];\n walletAddress?: string;\n isOwner: boolean;\n isProcessing: boolean;\n onBuyClick: (order: ApiOrder) => void;\n onCancelClick: (order: ApiOrder) => void;\n onAcceptClick: (order: ApiOrder) => void;\n}\n\nexport function AssetMarketsTab({\n activeListings,\n activeBids,\n walletAddress,\n isOwner,\n isProcessing,\n onBuyClick,\n onCancelClick,\n onAcceptClick,\n}: AssetMarketsTabProps) {\n const liveListings = activeListings.filter((o) => !isExpired(o.endTime));\n const liveBids = activeBids.filter((o) => !isExpired(o.endTime));\n\n return (\n <div className=\"mt-4 space-y-6\">\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Listings</p>\n {liveListings.length === 0 ? (\n <p className=\"text-sm text-muted-foreground py-4 text-center\">No active listings.</p>\n ) : (\n <div className=\"rounded-xl border border-border divide-y divide-border\">\n {liveListings.map((order) => {\n const isMyOrder = isSameAddress(order.offerer, walletAddress);\n return (\n <div key={order.orderHash} className=\"flex items-center justify-between px-4 py-3 gap-4\">\n <div className=\"min-w-0\">\n <p className=\"font-bold text-sm inline-flex items-center gap-1.5\">\n {formatDisplayPrice(order.price.formatted)}\n <CurrencyIcon symbol={order.price.currency ?? \"\"} size={14} />\n </p>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground mt-0.5\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(order.endTime)}\n </div>\n </div>\n <div className=\"flex items-center gap-2 shrink-0\">\n <AddressDisplay address={order.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n {isMyOrder ? (\n <ActionButton variant=\"destructive\" disabled={isProcessing} onClick={() => onCancelClick(order)}>\n Cancel\n </ActionButton>\n ) : (\n <ActionButton onClick={() => onBuyClick(order)}>Buy</ActionButton>\n )}\n </div>\n </div>\n );\n })}\n </div>\n )}\n </div>\n\n <div>\n <p className=\"text-xs font-semibold text-muted-foreground mb-2\">Offers</p>\n {liveBids.length === 0 ? (\n <p className=\"text-sm text-muted-foreground py-4 text-center\">No active offers.</p>\n ) : (\n <div className=\"rounded-xl border border-border divide-y divide-border\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between px-4 py-3 gap-4\">\n <div className=\"min-w-0\">\n <p className=\"font-bold text-sm\">\n <span className=\"inline-flex items-center gap-1.5\">\n {formatDisplayPrice(bid.price.formatted)}\n <CurrencyIcon symbol={bid.price.currency ?? \"\"} size={14} />\n </span>\n </p>\n <div className=\"flex items-center gap-1 text-xs text-muted-foreground mt-0.5\">\n <Clock className=\"h-3 w-3\" />\n {timeUntil(bid.endTime)}\n </div>\n </div>\n <div className=\"flex items-center gap-2 shrink-0\">\n <AddressDisplay address={bid.offerer} chars={4} showCopy={false} className=\"text-xs text-muted-foreground\" />\n {isOwner && (\n <ActionButton disabled={isProcessing} onClick={() => onAcceptClick(bid)}>\n <CheckCircle className=\"h-3.5 w-3.5 mr-1.5\" />\n Accept\n </ActionButton>\n )}\n </div>\n </div>\n ))}\n </div>\n )}\n </div>\n </div>\n );\n}\n"],"mappings":";AAiBI,cAmDgB,YAnDhB;AAfJ,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AACnC,SAAS,WAAW,iBAAiB;AACrC,SAAS,qBAAqB;AAC9B,SAAS,UAAU;AACnB,SAAS,OAAO,mBAAmB;AAGnC,SAAS,aAAa;AAAA,EACpB,UAAU;AAAA,EACV;AAAA,EACA,GAAG;AACL,GAA4F;AAC1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,YAAY,gBACR,uEACA;AAAA,QACJ;AAAA,MACF;AAAA,MACC,GAAG;AAAA;AAAA,EACN;AAEJ;AAaO,SAAS,gBAAgB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,eAAe,eAAe,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC;AACvE,QAAM,WAAW,WAAW,OAAO,CAAC,MAAM,CAAC,UAAU,EAAE,OAAO,CAAC;AAE/D,SACE,qBAAC,SAAI,WAAU,kBACb;AAAA,yBAAC,SACC;AAAA,0BAAC,OAAE,WAAU,oDAAmD,sBAAQ;AAAA,MACvE,aAAa,WAAW,IACvB,oBAAC,OAAE,WAAU,kDAAiD,iCAAmB,IAEjF,oBAAC,SAAI,WAAU,0DACZ,uBAAa,IAAI,CAAC,UAAU;AAC3B,cAAM,YAAY,cAAc,MAAM,SAAS,aAAa;AAC5D,eACE,qBAAC,SAA0B,WAAU,qDACnC;AAAA,+BAAC,SAAI,WAAU,WACb;AAAA,iCAAC,OAAE,WAAU,sDACV;AAAA,iCAAmB,MAAM,MAAM,SAAS;AAAA,cACzC,oBAAC,gBAAa,QAAQ,MAAM,MAAM,YAAY,IAAI,MAAM,IAAI;AAAA,eAC9D;AAAA,YACA,qBAAC,SAAI,WAAU,gEACb;AAAA,kCAAC,SAAM,WAAU,WAAU;AAAA,cAC1B,UAAU,MAAM,OAAO;AAAA,eAC1B;AAAA,aACF;AAAA,UACA,qBAAC,SAAI,WAAU,oCACb;AAAA,gCAAC,kBAAe,SAAS,MAAM,SAAS,OAAO,GAAG,UAAU,OAAO,WAAU,iCAAgC;AAAA,YAC5G,YACC,oBAAC,gBAAa,SAAQ,eAAc,UAAU,cAAc,SAAS,MAAM,cAAc,KAAK,GAAG,oBAEjG,IAEA,oBAAC,gBAAa,SAAS,MAAM,WAAW,KAAK,GAAG,iBAAG;AAAA,aAEvD;AAAA,aApBQ,MAAM,SAqBhB;AAAA,MAEJ,CAAC,GACH;AAAA,OAEJ;AAAA,IAEA,qBAAC,SACC;AAAA,0BAAC,OAAE,WAAU,oDAAmD,oBAAM;AAAA,MACrE,SAAS,WAAW,IACnB,oBAAC,OAAE,WAAU,kDAAiD,+BAAiB,IAE/E,oBAAC,SAAI,WAAU,0DACZ,mBAAS,IAAI,CAAC,QACb,qBAAC,SAAwB,WAAU,qDACjC;AAAA,6BAAC,SAAI,WAAU,WACb;AAAA,8BAAC,OAAE,WAAU,qBACX,+BAAC,UAAK,WAAU,oCACb;AAAA,+BAAmB,IAAI,MAAM,SAAS;AAAA,YACvC,oBAAC,gBAAa,QAAQ,IAAI,MAAM,YAAY,IAAI,MAAM,IAAI;AAAA,aAC5D,GACF;AAAA,UACA,qBAAC,SAAI,WAAU,gEACb;AAAA,gCAAC,SAAM,WAAU,WAAU;AAAA,YAC1B,UAAU,IAAI,OAAO;AAAA,aACxB;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,oCACb;AAAA,8BAAC,kBAAe,SAAS,IAAI,SAAS,OAAO,GAAG,UAAU,OAAO,WAAU,iCAAgC;AAAA,UAC1G,WACC,qBAAC,gBAAa,UAAU,cAAc,SAAS,MAAM,cAAc,GAAG,GACpE;AAAA,gCAAC,eAAY,WAAU,sBAAqB;AAAA,YAAE;AAAA,aAEhD;AAAA,WAEJ;AAAA,WArBQ,IAAI,SAsBd,CACD,GACH;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -47,6 +47,8 @@ function CollectionHeroBanner({
|
|
|
47
47
|
src: bannerUrl,
|
|
48
48
|
alt: "",
|
|
49
49
|
"aria-hidden": true,
|
|
50
|
+
loading: "lazy",
|
|
51
|
+
decoding: "async",
|
|
50
52
|
className: "absolute inset-0 w-full h-full object-cover opacity-20 scale-110",
|
|
51
53
|
style: { filter: "blur(60px) saturate(1.5)" }
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/collection-hero-banner.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion, useScroll, useTransform, useReducedMotion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { Skeleton } from \"./skeleton.js\";\n\nexport interface CollectionHeroStat {\n label: string;\n display: string;\n\n symbol?: string | null;\n}\n\nexport interface CollectionHeroBannerProps {\n bannerUrl: string | null;\n loading?: boolean;\n standard?: string | null;\n symbol?: string | null;\n name: string;\n stats: CollectionHeroStat[];\n className?: string;\n\n /** Extra content rendered alongside the standard/symbol eyebrow pills —\n * e.g. a creator level badge on a creator profile reusing this banner. */\n eyebrowSlot?: React.ReactNode;\n}\n\nexport function CollectionHeroBanner({\n bannerUrl,\n loading = false,\n standard,\n symbol,\n name,\n stats,\n className,\n eyebrowSlot,\n}: CollectionHeroBannerProps) {\n const { scrollY } = useScroll();\n const shouldReduce = useReducedMotion();\n const y = useTransform(scrollY, [0, 500], [0, shouldReduce ? 0 : 150]);\n\n return (\n <>\n\n <div className=\"fixed inset-0 -z-10 overflow-hidden pointer-events-none\">\n {bannerUrl && (\n <img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n className=\"absolute inset-0 w-full h-full object-cover opacity-20 scale-110\"\n style={{ filter: \"blur(60px) saturate(1.5)\" }}\n />\n )}\n </div>\n\n {loading ? (\n <Skeleton className={cn(\"w-full h-[50svh]\", className)} />\n ) : (\n <div className={cn(\"relative w-full overflow-hidden h-[50svh]\", className)}>\n {bannerUrl ? (\n <motion.img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n style={{ y }}\n className=\"absolute inset-0 w-full h-full object-cover scale-110\"\n />\n ) : (\n <div className=\"absolute inset-0 w-full h-full bg-muted\" />\n )}\n\n <div className=\"absolute bottom-0 left-0 right-0 px-4 sm:px-6 pb-4 sm:pb-6 space-y-3 z-10\">\n {(standard || symbol || eyebrowSlot) && (\n <div className=\"flex items-center gap-2 flex-wrap\">\n {standard === \"ERC1155\" ? (\n <Eyebrow>Multi-edition NFT</Eyebrow>\n ) : standard === \"ERC721\" ? (\n <Eyebrow>Single NFT</Eyebrow>\n ) : null}\n {symbol && <Eyebrow className=\"tabular-nums\">{symbol}</Eyebrow>}\n {eyebrowSlot}\n </div>\n )}\n\n <h1\n className=\"text-3xl sm:text-5xl lg:text-7xl font-bold text-white leading-tight\"\n style={{ textShadow: \"0 1px 12px rgba(0,0,0,0.4)\" }}\n >\n {name}\n </h1>\n\n <div className=\"flex gap-2 flex-wrap\">\n {stats.map(({ label, display, symbol: statSymbol }) => (\n <div\n key={label}\n className={cn(\n \"bg-white/15 backdrop-blur-md rounded-xl px-3 py-2 flex flex-col justify-center shrink-0\",\n statSymbol ? \"min-w-[80px]\" : \"min-w-[60px] items-center text-center\"\n )}\n >\n <p className=\"text-[9px] text-white/70 mb-1\">{label}</p>\n {statSymbol ? (\n <div className=\"flex items-center gap-1.5\">\n <CurrencyIcon symbol={statSymbol} size={15} />\n <p className=\"text-sm sm:text-base font-bold text-white tabular-nums leading-tight truncate\">\n {display}\n </p>\n </div>\n ) : (\n <p className=\"text-base sm:text-lg font-bold text-white tabular-nums leading-tight\">{display}</p>\n )}\n </div>\n ))}\n </div>\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction Eyebrow({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <span\n className={cn(\n \"text-[11px] font-semibold text-white/90 bg-white/15 backdrop-blur-md rounded-full px-2.5 py-0.5\",\n className\n )}\n >\n {children}\n </span>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2CI;AAzCJ,2BAAkE;AAClE,gBAAmB;AACnB,2BAA6B;AAC7B,sBAAyB;AAuBlB,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,EAAE,QAAQ,QAAI,gCAAU;AAC9B,QAAM,mBAAe,uCAAiB;AACtC,QAAM,QAAI,mCAAa,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,eAAe,IAAI,GAAG,CAAC;AAErE,SACE,4EAEE;AAAA,gDAAC,SAAI,WAAU,2DACZ,uBACC;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAI;AAAA,QACJ,eAAW;AAAA,QACX,WAAU;AAAA,QACV,OAAO,EAAE,QAAQ,2BAA2B;AAAA;AAAA,IAC9C,GAEJ;AAAA,IAEC,UACC,4CAAC,4BAAS,eAAW,cAAG,oBAAoB,SAAS,GAAG,IAExD,6CAAC,SAAI,eAAW,cAAG,6CAA6C,SAAS,GACtE;AAAA,kBACC;AAAA,QAAC,4BAAO;AAAA,QAAP;AAAA,UACC,KAAK;AAAA,UACL,KAAI;AAAA,UACJ,eAAW;AAAA,UACX,OAAO,EAAE,EAAE;AAAA,UACX,WAAU;AAAA;AAAA,MACZ,IAEA,4CAAC,SAAI,WAAU,2CAA0C;AAAA,MAG3D,6CAAC,SAAI,WAAU,6EACX;AAAA,qBAAY,UAAU,gBACtB,6CAAC,SAAI,WAAU,qCACZ;AAAA,uBAAa,YACZ,4CAAC,WAAQ,+BAAiB,IACxB,aAAa,WACf,4CAAC,WAAQ,wBAAU,IACjB;AAAA,UACH,UAAU,4CAAC,WAAQ,WAAU,gBAAgB,kBAAO;AAAA,UACpD;AAAA,WACH;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO,EAAE,YAAY,6BAA6B;AAAA,YAEjD;AAAA;AAAA,QACH;AAAA,QAEA,4CAAC,SAAI,WAAU,wBACZ,gBAAM,IAAI,CAAC,EAAE,OAAO,SAAS,QAAQ,WAAW,MAC/C;AAAA,UAAC;AAAA;AAAA,YAEC,eAAW;AAAA,cACT;AAAA,cACA,aAAa,iBAAiB;AAAA,YAChC;AAAA,YAEA;AAAA,0DAAC,OAAE,WAAU,iCAAiC,iBAAM;AAAA,cACnD,aACC,6CAAC,SAAI,WAAU,6BACb;AAAA,4DAAC,qCAAa,QAAQ,YAAY,MAAM,IAAI;AAAA,gBAC5C,4CAAC,OAAE,WAAU,iFACV,mBACH;AAAA,iBACF,IAEA,4CAAC,OAAE,WAAU,wEAAwE,mBAAQ;AAAA;AAAA;AAAA,UAf1F;AAAA,QAiBP,CACD,GACH;AAAA,SACF;AAAA,OACF;AAAA,KAEJ;AAEJ;AAEA,SAAS,QAAQ,EAAE,UAAU,UAAU,GAAsD;AAC3F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/collection-hero-banner.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion, useScroll, useTransform, useReducedMotion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { Skeleton } from \"./skeleton.js\";\n\nexport interface CollectionHeroStat {\n label: string;\n display: string;\n\n symbol?: string | null;\n}\n\nexport interface CollectionHeroBannerProps {\n bannerUrl: string | null;\n loading?: boolean;\n standard?: string | null;\n symbol?: string | null;\n name: string;\n stats: CollectionHeroStat[];\n className?: string;\n\n /** Extra content rendered alongside the standard/symbol eyebrow pills —\n * e.g. a creator level badge on a creator profile reusing this banner. */\n eyebrowSlot?: React.ReactNode;\n}\n\nexport function CollectionHeroBanner({\n bannerUrl,\n loading = false,\n standard,\n symbol,\n name,\n stats,\n className,\n eyebrowSlot,\n}: CollectionHeroBannerProps) {\n const { scrollY } = useScroll();\n const shouldReduce = useReducedMotion();\n const y = useTransform(scrollY, [0, 500], [0, shouldReduce ? 0 : 150]);\n\n return (\n <>\n\n <div className=\"fixed inset-0 -z-10 overflow-hidden pointer-events-none\">\n {bannerUrl && (\n <img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n loading=\"lazy\"\n decoding=\"async\"\n className=\"absolute inset-0 w-full h-full object-cover opacity-20 scale-110\"\n style={{ filter: \"blur(60px) saturate(1.5)\" }}\n />\n )}\n </div>\n\n {loading ? (\n <Skeleton className={cn(\"w-full h-[50svh]\", className)} />\n ) : (\n <div className={cn(\"relative w-full overflow-hidden h-[50svh]\", className)}>\n {bannerUrl ? (\n <motion.img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n style={{ y }}\n className=\"absolute inset-0 w-full h-full object-cover scale-110\"\n />\n ) : (\n <div className=\"absolute inset-0 w-full h-full bg-muted\" />\n )}\n\n <div className=\"absolute bottom-0 left-0 right-0 px-4 sm:px-6 pb-4 sm:pb-6 space-y-3 z-10\">\n {(standard || symbol || eyebrowSlot) && (\n <div className=\"flex items-center gap-2 flex-wrap\">\n {standard === \"ERC1155\" ? (\n <Eyebrow>Multi-edition NFT</Eyebrow>\n ) : standard === \"ERC721\" ? (\n <Eyebrow>Single NFT</Eyebrow>\n ) : null}\n {symbol && <Eyebrow className=\"tabular-nums\">{symbol}</Eyebrow>}\n {eyebrowSlot}\n </div>\n )}\n\n <h1\n className=\"text-3xl sm:text-5xl lg:text-7xl font-bold text-white leading-tight\"\n style={{ textShadow: \"0 1px 12px rgba(0,0,0,0.4)\" }}\n >\n {name}\n </h1>\n\n <div className=\"flex gap-2 flex-wrap\">\n {stats.map(({ label, display, symbol: statSymbol }) => (\n <div\n key={label}\n className={cn(\n \"bg-white/15 backdrop-blur-md rounded-xl px-3 py-2 flex flex-col justify-center shrink-0\",\n statSymbol ? \"min-w-[80px]\" : \"min-w-[60px] items-center text-center\"\n )}\n >\n <p className=\"text-[9px] text-white/70 mb-1\">{label}</p>\n {statSymbol ? (\n <div className=\"flex items-center gap-1.5\">\n <CurrencyIcon symbol={statSymbol} size={15} />\n <p className=\"text-sm sm:text-base font-bold text-white tabular-nums leading-tight truncate\">\n {display}\n </p>\n </div>\n ) : (\n <p className=\"text-base sm:text-lg font-bold text-white tabular-nums leading-tight\">{display}</p>\n )}\n </div>\n ))}\n </div>\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction Eyebrow({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <span\n className={cn(\n \"text-[11px] font-semibold text-white/90 bg-white/15 backdrop-blur-md rounded-full px-2.5 py-0.5\",\n className\n )}\n >\n {children}\n </span>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA2CI;AAzCJ,2BAAkE;AAClE,gBAAmB;AACnB,2BAA6B;AAC7B,sBAAyB;AAuBlB,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,EAAE,QAAQ,QAAI,gCAAU;AAC9B,QAAM,mBAAe,uCAAiB;AACtC,QAAM,QAAI,mCAAa,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,eAAe,IAAI,GAAG,CAAC;AAErE,SACE,4EAEE;AAAA,gDAAC,SAAI,WAAU,2DACZ,uBACC;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAI;AAAA,QACJ,eAAW;AAAA,QACX,SAAQ;AAAA,QACR,UAAS;AAAA,QACT,WAAU;AAAA,QACV,OAAO,EAAE,QAAQ,2BAA2B;AAAA;AAAA,IAC9C,GAEJ;AAAA,IAEC,UACC,4CAAC,4BAAS,eAAW,cAAG,oBAAoB,SAAS,GAAG,IAExD,6CAAC,SAAI,eAAW,cAAG,6CAA6C,SAAS,GACtE;AAAA,kBACC;AAAA,QAAC,4BAAO;AAAA,QAAP;AAAA,UACC,KAAK;AAAA,UACL,KAAI;AAAA,UACJ,eAAW;AAAA,UACX,OAAO,EAAE,EAAE;AAAA,UACX,WAAU;AAAA;AAAA,MACZ,IAEA,4CAAC,SAAI,WAAU,2CAA0C;AAAA,MAG3D,6CAAC,SAAI,WAAU,6EACX;AAAA,qBAAY,UAAU,gBACtB,6CAAC,SAAI,WAAU,qCACZ;AAAA,uBAAa,YACZ,4CAAC,WAAQ,+BAAiB,IACxB,aAAa,WACf,4CAAC,WAAQ,wBAAU,IACjB;AAAA,UACH,UAAU,4CAAC,WAAQ,WAAU,gBAAgB,kBAAO;AAAA,UACpD;AAAA,WACH;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO,EAAE,YAAY,6BAA6B;AAAA,YAEjD;AAAA;AAAA,QACH;AAAA,QAEA,4CAAC,SAAI,WAAU,wBACZ,gBAAM,IAAI,CAAC,EAAE,OAAO,SAAS,QAAQ,WAAW,MAC/C;AAAA,UAAC;AAAA;AAAA,YAEC,eAAW;AAAA,cACT;AAAA,cACA,aAAa,iBAAiB;AAAA,YAChC;AAAA,YAEA;AAAA,0DAAC,OAAE,WAAU,iCAAiC,iBAAM;AAAA,cACnD,aACC,6CAAC,SAAI,WAAU,6BACb;AAAA,4DAAC,qCAAa,QAAQ,YAAY,MAAM,IAAI;AAAA,gBAC5C,4CAAC,OAAE,WAAU,iFACV,mBACH;AAAA,iBACF,IAEA,4CAAC,OAAE,WAAU,wEAAwE,mBAAQ;AAAA;AAAA;AAAA,UAf1F;AAAA,QAiBP,CACD,GACH;AAAA,SACF;AAAA,OACF;AAAA,KAEJ;AAEJ;AAEA,SAAS,QAAQ,EAAE,UAAU,UAAU,GAAsD;AAC3F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}
|
|
@@ -24,6 +24,8 @@ function CollectionHeroBanner({
|
|
|
24
24
|
src: bannerUrl,
|
|
25
25
|
alt: "",
|
|
26
26
|
"aria-hidden": true,
|
|
27
|
+
loading: "lazy",
|
|
28
|
+
decoding: "async",
|
|
27
29
|
className: "absolute inset-0 w-full h-full object-cover opacity-20 scale-110",
|
|
28
30
|
style: { filter: "blur(60px) saturate(1.5)" }
|
|
29
31
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/collection-hero-banner.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion, useScroll, useTransform, useReducedMotion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { Skeleton } from \"./skeleton.js\";\n\nexport interface CollectionHeroStat {\n label: string;\n display: string;\n\n symbol?: string | null;\n}\n\nexport interface CollectionHeroBannerProps {\n bannerUrl: string | null;\n loading?: boolean;\n standard?: string | null;\n symbol?: string | null;\n name: string;\n stats: CollectionHeroStat[];\n className?: string;\n\n /** Extra content rendered alongside the standard/symbol eyebrow pills —\n * e.g. a creator level badge on a creator profile reusing this banner. */\n eyebrowSlot?: React.ReactNode;\n}\n\nexport function CollectionHeroBanner({\n bannerUrl,\n loading = false,\n standard,\n symbol,\n name,\n stats,\n className,\n eyebrowSlot,\n}: CollectionHeroBannerProps) {\n const { scrollY } = useScroll();\n const shouldReduce = useReducedMotion();\n const y = useTransform(scrollY, [0, 500], [0, shouldReduce ? 0 : 150]);\n\n return (\n <>\n\n <div className=\"fixed inset-0 -z-10 overflow-hidden pointer-events-none\">\n {bannerUrl && (\n <img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n className=\"absolute inset-0 w-full h-full object-cover opacity-20 scale-110\"\n style={{ filter: \"blur(60px) saturate(1.5)\" }}\n />\n )}\n </div>\n\n {loading ? (\n <Skeleton className={cn(\"w-full h-[50svh]\", className)} />\n ) : (\n <div className={cn(\"relative w-full overflow-hidden h-[50svh]\", className)}>\n {bannerUrl ? (\n <motion.img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n style={{ y }}\n className=\"absolute inset-0 w-full h-full object-cover scale-110\"\n />\n ) : (\n <div className=\"absolute inset-0 w-full h-full bg-muted\" />\n )}\n\n <div className=\"absolute bottom-0 left-0 right-0 px-4 sm:px-6 pb-4 sm:pb-6 space-y-3 z-10\">\n {(standard || symbol || eyebrowSlot) && (\n <div className=\"flex items-center gap-2 flex-wrap\">\n {standard === \"ERC1155\" ? (\n <Eyebrow>Multi-edition NFT</Eyebrow>\n ) : standard === \"ERC721\" ? (\n <Eyebrow>Single NFT</Eyebrow>\n ) : null}\n {symbol && <Eyebrow className=\"tabular-nums\">{symbol}</Eyebrow>}\n {eyebrowSlot}\n </div>\n )}\n\n <h1\n className=\"text-3xl sm:text-5xl lg:text-7xl font-bold text-white leading-tight\"\n style={{ textShadow: \"0 1px 12px rgba(0,0,0,0.4)\" }}\n >\n {name}\n </h1>\n\n <div className=\"flex gap-2 flex-wrap\">\n {stats.map(({ label, display, symbol: statSymbol }) => (\n <div\n key={label}\n className={cn(\n \"bg-white/15 backdrop-blur-md rounded-xl px-3 py-2 flex flex-col justify-center shrink-0\",\n statSymbol ? \"min-w-[80px]\" : \"min-w-[60px] items-center text-center\"\n )}\n >\n <p className=\"text-[9px] text-white/70 mb-1\">{label}</p>\n {statSymbol ? (\n <div className=\"flex items-center gap-1.5\">\n <CurrencyIcon symbol={statSymbol} size={15} />\n <p className=\"text-sm sm:text-base font-bold text-white tabular-nums leading-tight truncate\">\n {display}\n </p>\n </div>\n ) : (\n <p className=\"text-base sm:text-lg font-bold text-white tabular-nums leading-tight\">{display}</p>\n )}\n </div>\n ))}\n </div>\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction Eyebrow({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <span\n className={cn(\n \"text-[11px] font-semibold text-white/90 bg-white/15 backdrop-blur-md rounded-full px-2.5 py-0.5\",\n className\n )}\n >\n {children}\n </span>\n );\n}\n"],"mappings":";AA2CI,mBAIM,
|
|
1
|
+
{"version":3,"sources":["../../src/components/collection-hero-banner.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion, useScroll, useTransform, useReducedMotion } from \"framer-motion\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { Skeleton } from \"./skeleton.js\";\n\nexport interface CollectionHeroStat {\n label: string;\n display: string;\n\n symbol?: string | null;\n}\n\nexport interface CollectionHeroBannerProps {\n bannerUrl: string | null;\n loading?: boolean;\n standard?: string | null;\n symbol?: string | null;\n name: string;\n stats: CollectionHeroStat[];\n className?: string;\n\n /** Extra content rendered alongside the standard/symbol eyebrow pills —\n * e.g. a creator level badge on a creator profile reusing this banner. */\n eyebrowSlot?: React.ReactNode;\n}\n\nexport function CollectionHeroBanner({\n bannerUrl,\n loading = false,\n standard,\n symbol,\n name,\n stats,\n className,\n eyebrowSlot,\n}: CollectionHeroBannerProps) {\n const { scrollY } = useScroll();\n const shouldReduce = useReducedMotion();\n const y = useTransform(scrollY, [0, 500], [0, shouldReduce ? 0 : 150]);\n\n return (\n <>\n\n <div className=\"fixed inset-0 -z-10 overflow-hidden pointer-events-none\">\n {bannerUrl && (\n <img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n loading=\"lazy\"\n decoding=\"async\"\n className=\"absolute inset-0 w-full h-full object-cover opacity-20 scale-110\"\n style={{ filter: \"blur(60px) saturate(1.5)\" }}\n />\n )}\n </div>\n\n {loading ? (\n <Skeleton className={cn(\"w-full h-[50svh]\", className)} />\n ) : (\n <div className={cn(\"relative w-full overflow-hidden h-[50svh]\", className)}>\n {bannerUrl ? (\n <motion.img\n src={bannerUrl}\n alt=\"\"\n aria-hidden\n style={{ y }}\n className=\"absolute inset-0 w-full h-full object-cover scale-110\"\n />\n ) : (\n <div className=\"absolute inset-0 w-full h-full bg-muted\" />\n )}\n\n <div className=\"absolute bottom-0 left-0 right-0 px-4 sm:px-6 pb-4 sm:pb-6 space-y-3 z-10\">\n {(standard || symbol || eyebrowSlot) && (\n <div className=\"flex items-center gap-2 flex-wrap\">\n {standard === \"ERC1155\" ? (\n <Eyebrow>Multi-edition NFT</Eyebrow>\n ) : standard === \"ERC721\" ? (\n <Eyebrow>Single NFT</Eyebrow>\n ) : null}\n {symbol && <Eyebrow className=\"tabular-nums\">{symbol}</Eyebrow>}\n {eyebrowSlot}\n </div>\n )}\n\n <h1\n className=\"text-3xl sm:text-5xl lg:text-7xl font-bold text-white leading-tight\"\n style={{ textShadow: \"0 1px 12px rgba(0,0,0,0.4)\" }}\n >\n {name}\n </h1>\n\n <div className=\"flex gap-2 flex-wrap\">\n {stats.map(({ label, display, symbol: statSymbol }) => (\n <div\n key={label}\n className={cn(\n \"bg-white/15 backdrop-blur-md rounded-xl px-3 py-2 flex flex-col justify-center shrink-0\",\n statSymbol ? \"min-w-[80px]\" : \"min-w-[60px] items-center text-center\"\n )}\n >\n <p className=\"text-[9px] text-white/70 mb-1\">{label}</p>\n {statSymbol ? (\n <div className=\"flex items-center gap-1.5\">\n <CurrencyIcon symbol={statSymbol} size={15} />\n <p className=\"text-sm sm:text-base font-bold text-white tabular-nums leading-tight truncate\">\n {display}\n </p>\n </div>\n ) : (\n <p className=\"text-base sm:text-lg font-bold text-white tabular-nums leading-tight\">{display}</p>\n )}\n </div>\n ))}\n </div>\n </div>\n </div>\n )}\n </>\n );\n}\n\nfunction Eyebrow({ children, className }: { children: React.ReactNode; className?: string }) {\n return (\n <span\n className={cn(\n \"text-[11px] font-semibold text-white/90 bg-white/15 backdrop-blur-md rounded-full px-2.5 py-0.5\",\n className\n )}\n >\n {children}\n </span>\n );\n}\n"],"mappings":";AA2CI,mBAIM,KA8BI,YAlCV;AAzCJ,SAAS,QAAQ,WAAW,cAAc,wBAAwB;AAClE,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AAuBlB,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,EAAE,QAAQ,IAAI,UAAU;AAC9B,QAAM,eAAe,iBAAiB;AACtC,QAAM,IAAI,aAAa,SAAS,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,eAAe,IAAI,GAAG,CAAC;AAErE,SACE,iCAEE;AAAA,wBAAC,SAAI,WAAU,2DACZ,uBACC;AAAA,MAAC;AAAA;AAAA,QACC,KAAK;AAAA,QACL,KAAI;AAAA,QACJ,eAAW;AAAA,QACX,SAAQ;AAAA,QACR,UAAS;AAAA,QACT,WAAU;AAAA,QACV,OAAO,EAAE,QAAQ,2BAA2B;AAAA;AAAA,IAC9C,GAEJ;AAAA,IAEC,UACC,oBAAC,YAAS,WAAW,GAAG,oBAAoB,SAAS,GAAG,IAExD,qBAAC,SAAI,WAAW,GAAG,6CAA6C,SAAS,GACtE;AAAA,kBACC;AAAA,QAAC,OAAO;AAAA,QAAP;AAAA,UACC,KAAK;AAAA,UACL,KAAI;AAAA,UACJ,eAAW;AAAA,UACX,OAAO,EAAE,EAAE;AAAA,UACX,WAAU;AAAA;AAAA,MACZ,IAEA,oBAAC,SAAI,WAAU,2CAA0C;AAAA,MAG3D,qBAAC,SAAI,WAAU,6EACX;AAAA,qBAAY,UAAU,gBACtB,qBAAC,SAAI,WAAU,qCACZ;AAAA,uBAAa,YACZ,oBAAC,WAAQ,+BAAiB,IACxB,aAAa,WACf,oBAAC,WAAQ,wBAAU,IACjB;AAAA,UACH,UAAU,oBAAC,WAAQ,WAAU,gBAAgB,kBAAO;AAAA,UACpD;AAAA,WACH;AAAA,QAGF;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO,EAAE,YAAY,6BAA6B;AAAA,YAEjD;AAAA;AAAA,QACH;AAAA,QAEA,oBAAC,SAAI,WAAU,wBACZ,gBAAM,IAAI,CAAC,EAAE,OAAO,SAAS,QAAQ,WAAW,MAC/C;AAAA,UAAC;AAAA;AAAA,YAEC,WAAW;AAAA,cACT;AAAA,cACA,aAAa,iBAAiB;AAAA,YAChC;AAAA,YAEA;AAAA,kCAAC,OAAE,WAAU,iCAAiC,iBAAM;AAAA,cACnD,aACC,qBAAC,SAAI,WAAU,6BACb;AAAA,oCAAC,gBAAa,QAAQ,YAAY,MAAM,IAAI;AAAA,gBAC5C,oBAAC,OAAE,WAAU,iFACV,mBACH;AAAA,iBACF,IAEA,oBAAC,OAAE,WAAU,wEAAwE,mBAAQ;AAAA;AAAA;AAAA,UAf1F;AAAA,QAiBP,CACD,GACH;AAAA,SACF;AAAA,OACF;AAAA,KAEJ;AAEJ;AAEA,SAAS,QAAQ,EAAE,UAAU,UAAU,GAAsD;AAC3F,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;","names":[]}
|