@medialane/ui 0.328.0 → 0.330.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.
Files changed (57) hide show
  1. package/dist/components/asset-card.cjs +4 -4
  2. package/dist/components/asset-card.cjs.map +1 -1
  3. package/dist/components/asset-card.js +4 -4
  4. package/dist/components/asset-card.js.map +1 -1
  5. package/dist/components/asset-marketplace-panel.cjs +23 -26
  6. package/dist/components/asset-marketplace-panel.cjs.map +1 -1
  7. package/dist/components/asset-marketplace-panel.js +23 -26
  8. package/dist/components/asset-marketplace-panel.js.map +1 -1
  9. package/dist/components/badge.d.cts +1 -1
  10. package/dist/components/badge.d.ts +1 -1
  11. package/dist/components/button.d.cts +1 -1
  12. package/dist/components/button.d.ts +1 -1
  13. package/dist/components/coin-row.cjs +3 -3
  14. package/dist/components/coin-row.cjs.map +1 -1
  15. package/dist/components/coin-row.js +3 -3
  16. package/dist/components/coin-row.js.map +1 -1
  17. package/dist/components/discover-page.cjs +2 -0
  18. package/dist/components/discover-page.cjs.map +1 -1
  19. package/dist/components/discover-page.js +2 -0
  20. package/dist/components/discover-page.js.map +1 -1
  21. package/dist/components/discover-principles.cjs +51 -0
  22. package/dist/components/discover-principles.cjs.map +1 -0
  23. package/dist/components/discover-principles.d.cts +5 -0
  24. package/dist/components/discover-principles.d.ts +5 -0
  25. package/dist/components/discover-principles.js +38 -0
  26. package/dist/components/discover-principles.js.map +1 -0
  27. package/dist/components/launchpad/edition-mint-schema.d.cts +2 -2
  28. package/dist/components/launchpad/edition-mint-schema.d.ts +2 -2
  29. package/dist/components/listing-card.cjs +2 -14
  30. package/dist/components/listing-card.cjs.map +1 -1
  31. package/dist/components/listing-card.js +2 -14
  32. package/dist/components/listing-card.js.map +1 -1
  33. package/dist/components/price-display.cjs +115 -0
  34. package/dist/components/price-display.cjs.map +1 -0
  35. package/dist/components/price-display.d.cts +44 -0
  36. package/dist/components/price-display.d.ts +44 -0
  37. package/dist/components/price-display.js +91 -0
  38. package/dist/components/price-display.js.map +1 -0
  39. package/dist/components/token-card.cjs +4 -4
  40. package/dist/components/token-card.cjs.map +1 -1
  41. package/dist/components/token-card.js +4 -4
  42. package/dist/components/token-card.js.map +1 -1
  43. package/dist/utils/format.cjs +9 -0
  44. package/dist/utils/format.cjs.map +1 -1
  45. package/dist/utils/format.d.cts +2 -1
  46. package/dist/utils/format.d.ts +2 -1
  47. package/dist/utils/format.js +8 -0
  48. package/dist/utils/format.js.map +1 -1
  49. package/dist/utils/media-wallet/use-erc20-balance.d.cts +1 -1
  50. package/dist/utils/media-wallet/use-erc20-balance.d.ts +1 -1
  51. package/package.json +1 -1
  52. package/dist/components/dual-price.cjs +0 -164
  53. package/dist/components/dual-price.cjs.map +0 -1
  54. package/dist/components/dual-price.d.cts +0 -53
  55. package/dist/components/dual-price.d.ts +0 -53
  56. package/dist/components/dual-price.js +0 -138
  57. package/dist/components/dual-price.js.map +0 -1
@@ -37,7 +37,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
37
37
  var import_link = __toESM(require("./link.js"), 1);
38
38
  var import_lucide_react = require("lucide-react");
39
39
  var import_cn = require("../utils/cn.js");
40
- var import_dual_price = require("./dual-price.js");
40
+ var import_price_display = require("./price-display.js");
41
41
  var import_ip_type_badge = require("./ip-type-badge.js");
42
42
  var import_soulbound_card = require("./soulbound-card.js");
43
43
  var import_animated_token_media = require("./animated-token-media.js");
@@ -97,13 +97,13 @@ function AssetCard({
97
97
  subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground line-clamp-1 leading-snug", children: subtitle })
98
98
  ] }),
99
99
  soulbound && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_soulbound_card.SoulboundBadge, {}),
100
- hasPrice && !indexing && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-1.5 text-sm tabular-nums pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
101
- import_dual_price.PriceChipContent,
100
+ hasPrice && !indexing && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "pt-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
101
+ import_price_display.PriceDisplay,
102
102
  {
103
103
  amountFormatted: price.formatted,
104
104
  currency: price.currency,
105
105
  usdValue: price.usdValue,
106
- tone: "solid"
106
+ scale: "card"
107
107
  }
108
108
  ) })
109
109
  ] })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"./link.js\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { PriceChipContent } from \"./dual-price.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { SoulboundBadge } from \"./soulbound-card.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nexport interface AssetCardPrice {\n formatted?: string | null;\n currency?: string | null;\n\n usdValue?: string | null;\n}\n\nexport interface AssetCardProps {\n\n href: string;\n\n name: string;\n\n image?: string | null;\n\n animationUrl?: string | null;\n\n live?: boolean;\n\n subtitle?: string | null;\n\n ipType?: string | null;\n\n price?: AssetCardPrice | null;\n\n fallbackId?: string | null;\n\n indexing?: boolean;\n\n soulbound?: boolean;\n\n ipTypeBaseUrl?: string;\n className?: string;\n}\n\nexport function AssetCard({\n href,\n name,\n image,\n animationUrl,\n live = false,\n subtitle,\n ipType,\n price,\n fallbackId,\n indexing = false,\n soulbound = false,\n ipTypeBaseUrl = \"\",\n className,\n}: AssetCardProps) {\n const resolveImage = useImageUrl();\n const resolved = resolveImage(image, { width: 480 });\n const hasPrice = !!price?.formatted;\n\n return (\n <div\n className={cn(\n \"group relative flex flex-col w-full overflow-hidden rounded-xl bg-card\",\n className\n )}\n >\n\n {ipType && (\n <div className=\"absolute top-2 right-2 z-10\">\n <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n </div>\n )}\n\n <Link href={href} className=\"block relative aspect-square bg-muted overflow-hidden\">\n <AnimatedTokenMedia\n image={resolved}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n #{fallbackId ?? \"?\"}\n </span>\n </div>\n }\n />\n\n {indexing && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-2xs text-white/70\">Indexing…</span>\n </div>\n )}\n </Link>\n\n <div className=\"px-3 py-3 space-y-1\">\n <Link href={href} className=\"block min-w-0\">\n <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">\n {name}\n </p>\n {subtitle && (\n <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n {subtitle}\n </p>\n )}\n </Link>\n\n {soulbound && <SoulboundBadge />}\n\n {hasPrice && !indexing && (\n <div className=\"flex items-center gap-1.5 text-sm tabular-nums pt-0.5\">\n <PriceChipContent\n amountFormatted={price!.formatted}\n currency={price!.currency}\n usdValue={price!.usdValue}\n tone=\"solid\"\n />\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport function AssetCardSkeleton() {\n return (\n <div className=\"flex flex-col w-full overflow-hidden rounded-xl bg-card\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 py-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2EU;AAzEV,kBAAiB;AACjB,0BAAwB;AACxB,gBAAmB;AACnB,wBAAiC;AACjC,2BAA4B;AAC5B,4BAA+B;AAC/B,kCAAmC;AACnC,2BAA4B;AAqCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,mBAAe,kCAAY;AACjC,QAAM,WAAW,aAAa,OAAO,EAAE,OAAO,IAAI,CAAC;AACnD,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGC;AAAA,kBACC,4CAAC,SAAI,WAAU,+BACb,sDAAC,oCAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,QAGF,6CAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,yDAC1B;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA,KAAK;AAAA,cACL,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAU;AAAA,cACV,UACE,4CAAC,SAAI,WAAU,+HACb,uDAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,gBACvE,cAAc;AAAA,iBAClB,GACF;AAAA;AAAA,UAEJ;AAAA,UAEC,YACC,6CAAC,SAAI,WAAU,4GACb;AAAA,wDAAC,+BAAQ,WAAU,sCAAqC;AAAA,YACxD,4CAAC,UAAK,WAAU,0BAAyB,4BAAS;AAAA,aACpD;AAAA,WAEJ;AAAA,QAEA,6CAAC,SAAI,WAAU,uBACb;AAAA,uDAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,iBAC1B;AAAA,wDAAC,OAAE,WAAU,gFACV,gBACH;AAAA,YACC,YACC,4CAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,aAAa,4CAAC,wCAAe;AAAA,UAE7B,YAAY,CAAC,YACZ,4CAAC,SAAI,WAAU,yDACb;AAAA,YAAC;AAAA;AAAA,cACC,iBAAiB,MAAO;AAAA,cACxB,UAAU,MAAO;AAAA,cACjB,UAAU,MAAO;AAAA,cACjB,MAAK;AAAA;AAAA,UACP,GACF;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,6CAAC,SAAI,WAAU,2DACb;AAAA,gDAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,6CAAC,SAAI,WAAU,yBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":["Link"]}
1
+ {"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"./link.js\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { PriceDisplay } from \"./price-display.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { SoulboundBadge } from \"./soulbound-card.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nexport interface AssetCardPrice {\n formatted?: string | null;\n currency?: string | null;\n\n usdValue?: string | null;\n}\n\nexport interface AssetCardProps {\n\n href: string;\n\n name: string;\n\n image?: string | null;\n\n animationUrl?: string | null;\n\n live?: boolean;\n\n subtitle?: string | null;\n\n ipType?: string | null;\n\n price?: AssetCardPrice | null;\n\n fallbackId?: string | null;\n\n indexing?: boolean;\n\n soulbound?: boolean;\n\n ipTypeBaseUrl?: string;\n className?: string;\n}\n\nexport function AssetCard({\n href,\n name,\n image,\n animationUrl,\n live = false,\n subtitle,\n ipType,\n price,\n fallbackId,\n indexing = false,\n soulbound = false,\n ipTypeBaseUrl = \"\",\n className,\n}: AssetCardProps) {\n const resolveImage = useImageUrl();\n const resolved = resolveImage(image, { width: 480 });\n const hasPrice = !!price?.formatted;\n\n return (\n <div\n className={cn(\n \"group relative flex flex-col w-full overflow-hidden rounded-xl bg-card\",\n className\n )}\n >\n\n {ipType && (\n <div className=\"absolute top-2 right-2 z-10\">\n <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n </div>\n )}\n\n <Link href={href} className=\"block relative aspect-square bg-muted overflow-hidden\">\n <AnimatedTokenMedia\n image={resolved}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n #{fallbackId ?? \"?\"}\n </span>\n </div>\n }\n />\n\n {indexing && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-2xs text-white/70\">Indexing…</span>\n </div>\n )}\n </Link>\n\n <div className=\"px-3 py-3 space-y-1\">\n <Link href={href} className=\"block min-w-0\">\n <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">\n {name}\n </p>\n {subtitle && (\n <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n {subtitle}\n </p>\n )}\n </Link>\n\n {soulbound && <SoulboundBadge />}\n\n {hasPrice && !indexing && (\n <div className=\"pt-0.5\">\n <PriceDisplay\n amountFormatted={price!.formatted}\n currency={price!.currency}\n usdValue={price!.usdValue}\n scale=\"card\"\n />\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport function AssetCardSkeleton() {\n return (\n <div className=\"flex flex-col w-full overflow-hidden rounded-xl bg-card\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 py-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2EU;AAzEV,kBAAiB;AACjB,0BAAwB;AACxB,gBAAmB;AACnB,2BAA6B;AAC7B,2BAA4B;AAC5B,4BAA+B;AAC/B,kCAAmC;AACnC,2BAA4B;AAqCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,mBAAe,kCAAY;AACjC,QAAM,WAAW,aAAa,OAAO,EAAE,OAAO,IAAI,CAAC;AACnD,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGC;AAAA,kBACC,4CAAC,SAAI,WAAU,+BACb,sDAAC,oCAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,QAGF,6CAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,yDAC1B;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA,KAAK;AAAA,cACL,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAU;AAAA,cACV,UACE,4CAAC,SAAI,WAAU,+HACb,uDAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,gBACvE,cAAc;AAAA,iBAClB,GACF;AAAA;AAAA,UAEJ;AAAA,UAEC,YACC,6CAAC,SAAI,WAAU,4GACb;AAAA,wDAAC,+BAAQ,WAAU,sCAAqC;AAAA,YACxD,4CAAC,UAAK,WAAU,0BAAyB,4BAAS;AAAA,aACpD;AAAA,WAEJ;AAAA,QAEA,6CAAC,SAAI,WAAU,uBACb;AAAA,uDAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,iBAC1B;AAAA,wDAAC,OAAE,WAAU,gFACV,gBACH;AAAA,YACC,YACC,4CAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,aAAa,4CAAC,wCAAe;AAAA,UAE7B,YAAY,CAAC,YACZ,4CAAC,SAAI,WAAU,UACb;AAAA,YAAC;AAAA;AAAA,cACC,iBAAiB,MAAO;AAAA,cACxB,UAAU,MAAO;AAAA,cACjB,UAAU,MAAO;AAAA,cACjB,OAAM;AAAA;AAAA,UACR,GACF;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,6CAAC,SAAI,WAAU,2DACb;AAAA,gDAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,6CAAC,SAAI,WAAU,yBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":["Link"]}
@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
3
3
  import Link from "./link.js";
4
4
  import { Loader2 } from "lucide-react";
5
5
  import { cn } from "../utils/cn.js";
6
- import { PriceChipContent } from "./dual-price.js";
6
+ import { PriceDisplay } from "./price-display.js";
7
7
  import { IpTypeBadge } from "./ip-type-badge.js";
8
8
  import { SoulboundBadge } from "./soulbound-card.js";
9
9
  import { AnimatedTokenMedia } from "./animated-token-media.js";
@@ -63,13 +63,13 @@ function AssetCard({
63
63
  subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground line-clamp-1 leading-snug", children: subtitle })
64
64
  ] }),
65
65
  soulbound && /* @__PURE__ */ jsx(SoulboundBadge, {}),
66
- hasPrice && !indexing && /* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5 text-sm tabular-nums pt-0.5", children: /* @__PURE__ */ jsx(
67
- PriceChipContent,
66
+ hasPrice && !indexing && /* @__PURE__ */ jsx("div", { className: "pt-0.5", children: /* @__PURE__ */ jsx(
67
+ PriceDisplay,
68
68
  {
69
69
  amountFormatted: price.formatted,
70
70
  currency: price.currency,
71
71
  usdValue: price.usdValue,
72
- tone: "solid"
72
+ scale: "card"
73
73
  }
74
74
  ) })
75
75
  ] })
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"./link.js\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { PriceChipContent } from \"./dual-price.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { SoulboundBadge } from \"./soulbound-card.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nexport interface AssetCardPrice {\n formatted?: string | null;\n currency?: string | null;\n\n usdValue?: string | null;\n}\n\nexport interface AssetCardProps {\n\n href: string;\n\n name: string;\n\n image?: string | null;\n\n animationUrl?: string | null;\n\n live?: boolean;\n\n subtitle?: string | null;\n\n ipType?: string | null;\n\n price?: AssetCardPrice | null;\n\n fallbackId?: string | null;\n\n indexing?: boolean;\n\n soulbound?: boolean;\n\n ipTypeBaseUrl?: string;\n className?: string;\n}\n\nexport function AssetCard({\n href,\n name,\n image,\n animationUrl,\n live = false,\n subtitle,\n ipType,\n price,\n fallbackId,\n indexing = false,\n soulbound = false,\n ipTypeBaseUrl = \"\",\n className,\n}: AssetCardProps) {\n const resolveImage = useImageUrl();\n const resolved = resolveImage(image, { width: 480 });\n const hasPrice = !!price?.formatted;\n\n return (\n <div\n className={cn(\n \"group relative flex flex-col w-full overflow-hidden rounded-xl bg-card\",\n className\n )}\n >\n\n {ipType && (\n <div className=\"absolute top-2 right-2 z-10\">\n <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n </div>\n )}\n\n <Link href={href} className=\"block relative aspect-square bg-muted overflow-hidden\">\n <AnimatedTokenMedia\n image={resolved}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n #{fallbackId ?? \"?\"}\n </span>\n </div>\n }\n />\n\n {indexing && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-2xs text-white/70\">Indexing…</span>\n </div>\n )}\n </Link>\n\n <div className=\"px-3 py-3 space-y-1\">\n <Link href={href} className=\"block min-w-0\">\n <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">\n {name}\n </p>\n {subtitle && (\n <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n {subtitle}\n </p>\n )}\n </Link>\n\n {soulbound && <SoulboundBadge />}\n\n {hasPrice && !indexing && (\n <div className=\"flex items-center gap-1.5 text-sm tabular-nums pt-0.5\">\n <PriceChipContent\n amountFormatted={price!.formatted}\n currency={price!.currency}\n usdValue={price!.usdValue}\n tone=\"solid\"\n />\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport function AssetCardSkeleton() {\n return (\n <div className=\"flex flex-col w-full overflow-hidden rounded-xl bg-card\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 py-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n </div>\n );\n}\n"],"mappings":";AA2EU,cAeI,YAfJ;AAzEV,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,UAAU;AACnB,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAqCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,eAAe,YAAY;AACjC,QAAM,WAAW,aAAa,OAAO,EAAE,OAAO,IAAI,CAAC;AACnD,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGC;AAAA,kBACC,oBAAC,SAAI,WAAU,+BACb,8BAAC,eAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,QAGF,qBAAC,QAAK,MAAY,WAAU,yDAC1B;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA,KAAK;AAAA,cACL,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAU;AAAA,cACV,UACE,oBAAC,SAAI,WAAU,+HACb,+BAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,gBACvE,cAAc;AAAA,iBAClB,GACF;AAAA;AAAA,UAEJ;AAAA,UAEC,YACC,qBAAC,SAAI,WAAU,4GACb;AAAA,gCAAC,WAAQ,WAAU,sCAAqC;AAAA,YACxD,oBAAC,UAAK,WAAU,0BAAyB,4BAAS;AAAA,aACpD;AAAA,WAEJ;AAAA,QAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,+BAAC,QAAK,MAAY,WAAU,iBAC1B;AAAA,gCAAC,OAAE,WAAU,gFACV,gBACH;AAAA,YACC,YACC,oBAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,aAAa,oBAAC,kBAAe;AAAA,UAE7B,YAAY,CAAC,YACZ,oBAAC,SAAI,WAAU,yDACb;AAAA,YAAC;AAAA;AAAA,cACC,iBAAiB,MAAO;AAAA,cACxB,UAAU,MAAO;AAAA,cACjB,UAAU,MAAO;AAAA,cACjB,MAAK;AAAA;AAAA,UACP,GACF;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,qBAAC,SAAI,WAAU,2DACb;AAAA,wBAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,qBAAC,SAAI,WAAU,yBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"./link.js\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { PriceDisplay } from \"./price-display.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { SoulboundBadge } from \"./soulbound-card.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nexport interface AssetCardPrice {\n formatted?: string | null;\n currency?: string | null;\n\n usdValue?: string | null;\n}\n\nexport interface AssetCardProps {\n\n href: string;\n\n name: string;\n\n image?: string | null;\n\n animationUrl?: string | null;\n\n live?: boolean;\n\n subtitle?: string | null;\n\n ipType?: string | null;\n\n price?: AssetCardPrice | null;\n\n fallbackId?: string | null;\n\n indexing?: boolean;\n\n soulbound?: boolean;\n\n ipTypeBaseUrl?: string;\n className?: string;\n}\n\nexport function AssetCard({\n href,\n name,\n image,\n animationUrl,\n live = false,\n subtitle,\n ipType,\n price,\n fallbackId,\n indexing = false,\n soulbound = false,\n ipTypeBaseUrl = \"\",\n className,\n}: AssetCardProps) {\n const resolveImage = useImageUrl();\n const resolved = resolveImage(image, { width: 480 });\n const hasPrice = !!price?.formatted;\n\n return (\n <div\n className={cn(\n \"group relative flex flex-col w-full overflow-hidden rounded-xl bg-card\",\n className\n )}\n >\n\n {ipType && (\n <div className=\"absolute top-2 right-2 z-10\">\n <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n </div>\n )}\n\n <Link href={href} className=\"block relative aspect-square bg-muted overflow-hidden\">\n <AnimatedTokenMedia\n image={resolved}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n #{fallbackId ?? \"?\"}\n </span>\n </div>\n }\n />\n\n {indexing && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-2xs text-white/70\">Indexing…</span>\n </div>\n )}\n </Link>\n\n <div className=\"px-3 py-3 space-y-1\">\n <Link href={href} className=\"block min-w-0\">\n <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">\n {name}\n </p>\n {subtitle && (\n <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n {subtitle}\n </p>\n )}\n </Link>\n\n {soulbound && <SoulboundBadge />}\n\n {hasPrice && !indexing && (\n <div className=\"pt-0.5\">\n <PriceDisplay\n amountFormatted={price!.formatted}\n currency={price!.currency}\n usdValue={price!.usdValue}\n scale=\"card\"\n />\n </div>\n )}\n </div>\n </div>\n );\n}\n\nexport function AssetCardSkeleton() {\n return (\n <div className=\"flex flex-col w-full overflow-hidden rounded-xl bg-card\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 py-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n </div>\n );\n}\n"],"mappings":";AA2EU,cAeI,YAfJ;AAzEV,OAAO,UAAU;AACjB,SAAS,eAAe;AACxB,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,sBAAsB;AAC/B,SAAS,0BAA0B;AACnC,SAAS,mBAAmB;AAqCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,eAAe,YAAY;AACjC,QAAM,WAAW,aAAa,OAAO,EAAE,OAAO,IAAI,CAAC;AACnD,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGC;AAAA,kBACC,oBAAC,SAAI,WAAU,+BACb,8BAAC,eAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,QAGF,qBAAC,QAAK,MAAY,WAAU,yDAC1B;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,OAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA,KAAK;AAAA,cACL,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAU;AAAA,cACV,UACE,oBAAC,SAAI,WAAU,+HACb,+BAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,gBACvE,cAAc;AAAA,iBAClB,GACF;AAAA;AAAA,UAEJ;AAAA,UAEC,YACC,qBAAC,SAAI,WAAU,4GACb;AAAA,gCAAC,WAAQ,WAAU,sCAAqC;AAAA,YACxD,oBAAC,UAAK,WAAU,0BAAyB,4BAAS;AAAA,aACpD;AAAA,WAEJ;AAAA,QAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,+BAAC,QAAK,MAAY,WAAU,iBAC1B;AAAA,gCAAC,OAAE,WAAU,gFACV,gBACH;AAAA,YACC,YACC,oBAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,aAAa,oBAAC,kBAAe;AAAA,UAE7B,YAAY,CAAC,YACZ,oBAAC,SAAI,WAAU,UACb;AAAA,YAAC;AAAA;AAAA,cACC,iBAAiB,MAAO;AAAA,cACxB,UAAU,MAAO;AAAA,cACjB,UAAU,MAAO;AAAA,cACjB,OAAM;AAAA;AAAA,UACR,GACF;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,qBAAC,SAAI,WAAU,2DACb;AAAA,wBAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,qBAAC,SAAI,WAAU,yBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":[]}
@@ -25,10 +25,9 @@ module.exports = __toCommonJS(asset_marketplace_panel_exports);
25
25
  var import_jsx_runtime = require("react/jsx-runtime");
26
26
  var import_react = require("react");
27
27
  var import_lucide_react = require("lucide-react");
28
- var import_currency_icon = require("./currency-icon.js");
28
+ var import_price_display = require("./price-display.js");
29
29
  var import_address_display = require("./address-display.js");
30
30
  var import_action_button = require("./action-button.js");
31
- var import_format = require("../utils/format.js");
32
31
  var import_time = require("../utils/time.js");
33
32
  var import_same_address = require("../utils/same-address.js");
34
33
  var import_cn = require("../utils/cn.js");
@@ -40,12 +39,16 @@ function ActionRow({ children }) {
40
39
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36", odd && "[&>*:first-child]:col-span-2"), children });
41
40
  }
42
41
  function PriceBlock({ order, usdValue }) {
43
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
44
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: (0, import_format.formatDisplayPrice)(order.price.formatted), symbol: order.price.currency ?? "", iconSize: 26, amountClassName: "text-3xl font-bold text-foreground tabular-nums" }),
45
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-lg font-semibold text-foreground", children: order.price.currency }),
46
- usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm tabular-nums text-muted-foreground", children: usdValue }) : null,
47
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_help_icon.HelpIcon, { content: `Expires ${(0, import_time.timeUntil)(order.endTime)}` })
48
- ] });
42
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
43
+ import_price_display.PriceDisplay,
44
+ {
45
+ amountFormatted: order.price.formatted,
46
+ currency: order.price.currency,
47
+ usdValue,
48
+ scale: "hero",
49
+ trailing: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_help_icon.HelpIcon, { content: `Expires ${(0, import_time.timeUntil)(order.endTime)}` })
50
+ }
51
+ );
49
52
  }
50
53
  function AssetMarketplacePanel({
51
54
  asset,
@@ -100,11 +103,7 @@ function AssetMarketplacePanel({
100
103
  const offerButton = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_action_button.ActionButton, { action: "offer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, children: "Make offer" });
101
104
  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? isOwner ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_action_button.ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
102
105
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Buy" }),
103
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: (0, import_format.formatDisplayPrice)(liveCheapest.price.formatted), symbol: liveCheapest.price.currency ?? "", iconSize: 14, amountClassName: "tabular-nums" }),
104
- usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
105
- "\xB7 ",
106
- usdValue
107
- ] }) : null
106
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_price_display.PriceDisplay, { amountFormatted: liveCheapest.price.formatted, currency: liveCheapest.price.currency, usdValue, scale: "card" })
108
107
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_action_button.ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: "Buy now" }) : null;
109
108
  const listedPrice = !isOwner && liveCheapest ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PriceBlock, { order: liveCheapest, usdValue }) : null;
110
109
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative space-y-4", children: [
@@ -120,11 +119,15 @@ function AssetMarketplacePanel({
120
119
  helpContent: `Expires ${(0, import_time.timeUntil)(liveMyListing.endTime)}`,
121
120
  children: [
122
121
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Cancel listing" }),
123
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: (0, import_format.formatDisplayPrice)(liveMyListing.price.formatted), symbol: liveMyListing.price.currency ?? "", iconSize: 14, amountClassName: "tabular-nums" }),
124
- liveMyListing.orderHash === liveCheapest?.orderHash && usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
125
- "\xB7 ",
126
- usdValue
127
- ] }) : null
122
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
123
+ import_price_display.PriceDisplay,
124
+ {
125
+ amountFormatted: liveMyListing.price.formatted,
126
+ currency: liveMyListing.price.currency,
127
+ usdValue: liveMyListing.orderHash === liveCheapest?.orderHash ? usdValue : null,
128
+ scale: "card"
129
+ }
130
+ )
128
131
  ]
129
132
  }
130
133
  ) : null,
@@ -177,10 +180,7 @@ function AssetMarketplacePanel({
177
180
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
178
181
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-semibold text-amber-500", children: "Your active offer" }),
179
182
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5", children: [
180
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-bold text-foreground inline-flex items-center gap-1", children: [
181
- (0, import_format.formatDisplayPrice)(myBid.price.formatted),
182
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: myBid.price.currency ?? "", size: 12 })
183
- ] }),
183
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_price_display.PriceDisplay, { amountFormatted: myBid.price.formatted, currency: myBid.price.currency, scale: "row" }),
184
184
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "\xB7" }),
185
185
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Clock, { className: "h-3 w-3" }),
186
186
  (0, import_time.timeUntil)(myBid.endTime)
@@ -207,10 +207,7 @@ function AssetMarketplacePanel({
207
207
  ] }),
208
208
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "divide-y divide-border/40", children: liveBids.map((bid) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 py-2.5", children: [
209
209
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
210
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-bold", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1.5", children: [
211
- (0, import_format.formatDisplayPrice)(bid.price.formatted),
212
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: bid.price.currency ?? "", size: 14 })
213
- ] }) }),
210
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-bold", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_price_display.PriceDisplay, { amountFormatted: bid.price.formatted, currency: bid.price.currency, scale: "row" }) }),
214
211
  /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
215
212
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_address_display.AddressDisplay, { address: bid.offerer, chars: 4, showCopy: false, className: "text-xs text-muted-foreground" }),
216
213
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs text-muted-foreground", children: "\xB7" }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport { Children, type ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n 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 { 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 { HelpIcon } from \"./help-icon.js\";\nimport { AssetAccessButtons, CompanionAppButton } from \"./asset-access-cards.js\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.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 asset: AssetRef;\n compact?: boolean;\n cheapest?: T;\n isOwner: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\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\n}\n\nfunction ActionRow({ children }: { children: ReactNode }) {\n const odd = Children.toArray(children).length % 2 === 1;\n return <div className={cn(\"grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36\", odd && \"[&>*:first-child]:col-span-2\")}>{children}</div>;\n}\n\nfunction PriceBlock({ order, usdValue }: { order: ApiOrderLike; usdValue?: string | null }) {\n return (\n <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n <CurrencyAmount amount={formatDisplayPrice(order.price.formatted)} symbol={order.price.currency ?? \"\"} iconSize={26} amountClassName=\"text-3xl font-bold text-foreground tabular-nums\" />\n <span className=\"text-lg font-semibold text-foreground\">{order.price.currency}</span>\n {usdValue ? <span className=\"text-sm tabular-nums text-muted-foreground\">{usdValue}</span> : null}\n <HelpIcon content={`Expires ${timeUntil(order.endTime)}`} />\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n asset,\n compact = false,\n cheapest,\n isOwner,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n usdValue,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const { walletAddress } = useMedialaneApp();\n const isSignedIn = !!walletAddress;\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 const remixButton = remixEnabled && onOpenRemix ? (\n <ActionButton\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 >\n Remix\n </ActionButton>\n ) : null;\n\n const offerButton = (\n <ActionButton action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer}>\n Make offer\n </ActionButton>\n );\n\n const buyButton = liveCheapest && (!isOwner || canBuyMore) ? (\n isOwner ? (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n <span>Buy</span>\n <CurrencyAmount amount={formatDisplayPrice(liveCheapest.price.formatted)} symbol={liveCheapest.price.currency ?? \"\"} iconSize={14} amountClassName=\"tabular-nums\" />\n {usdValue ? <span className=\"font-normal text-muted-foreground tabular-nums\">· {usdValue}</span> : null}\n </ActionButton>\n ) : (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n Buy now\n </ActionButton>\n )\n ) : null;\n\n const listedPrice = !isOwner && liveCheapest ? <PriceBlock order={liveCheapest} usdValue={usdValue} /> : null;\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {isOwner ? (\n <div className=\"space-y-3\">\n <ActionRow>\n {liveMyListing ? (\n <ActionButton\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 helpContent={`Expires ${timeUntil(liveMyListing.endTime)}`}\n >\n <span>Cancel listing</span>\n <CurrencyAmount amount={formatDisplayPrice(liveMyListing.price.formatted)} symbol={liveMyListing.price.currency ?? \"\"} iconSize={14} amountClassName=\"tabular-nums\" />\n {liveMyListing.orderHash === liveCheapest?.orderHash && usdValue ? <span className=\"font-normal text-muted-foreground tabular-nums\">· {usdValue}</span> : null}\n </ActionButton>\n ) : null}\n {!liveMyListing || (isERC1155 && canListMoreEditions !== false) ? (\n <ActionButton tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing}>\n {liveMyListing ? \"Sell more\" : \"Sell\"}\n </ActionButton>\n ) : null}\n <ActionButton tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer}>Transfer</ActionButton>\n {remixButton}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton\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 >\n Open for sponsorship\n </ActionButton>\n ) : null}\n </ActionRow>\n {buyButton ? <ActionRow>{buyButton}</ActionRow> : null}\n </div>\n ) : (\n <div className=\"space-y-4\">\n {listedPrice}\n {isSignedIn ? (\n <ActionRow>\n {buyButton}\n {offerButton}\n {remixButton}\n {showDealOption && onProposeDeal ? (\n <ActionButton\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 >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton\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 >\n Sponsor\n </ActionButton>\n ) : null}\n </ActionRow>\n ) : (\n <AssetAccessButtons asset={asset} stacked={compact} />\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=\"space-y-2\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"divide-y divide-border/40\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 py-2.5\">\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\n {isSignedIn ? <CompanionAppButton asset={asset} variant=\"link\" /> : 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 { Children, type ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n Tag, X,\n} from \"lucide-react\";\nimport { PriceDisplay } from \"./price-display.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { HelpIcon } from \"./help-icon.js\";\nimport { AssetAccessButtons, CompanionAppButton } from \"./asset-access-cards.js\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.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 asset: AssetRef;\n compact?: boolean;\n cheapest?: T;\n isOwner: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\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\n}\n\nfunction ActionRow({ children }: { children: ReactNode }) {\n const odd = Children.toArray(children).length % 2 === 1;\n return <div className={cn(\"grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36\", odd && \"[&>*:first-child]:col-span-2\")}>{children}</div>;\n}\n\nfunction PriceBlock({ order, usdValue }: { order: ApiOrderLike; usdValue?: string | null }) {\n return (\n <PriceDisplay\n amountFormatted={order.price.formatted}\n currency={order.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={<HelpIcon content={`Expires ${timeUntil(order.endTime)}`} />}\n />\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n asset,\n compact = false,\n cheapest,\n isOwner,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n usdValue,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const { walletAddress } = useMedialaneApp();\n const isSignedIn = !!walletAddress;\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 const remixButton = remixEnabled && onOpenRemix ? (\n <ActionButton\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 >\n Remix\n </ActionButton>\n ) : null;\n\n const offerButton = (\n <ActionButton action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer}>\n Make offer\n </ActionButton>\n );\n\n const buyButton = liveCheapest && (!isOwner || canBuyMore) ? (\n isOwner ? (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n <span>Buy</span>\n <PriceDisplay amountFormatted={liveCheapest.price.formatted} currency={liveCheapest.price.currency} usdValue={usdValue} scale=\"card\" />\n </ActionButton>\n ) : (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n Buy now\n </ActionButton>\n )\n ) : null;\n\n const listedPrice = !isOwner && liveCheapest ? <PriceBlock order={liveCheapest} usdValue={usdValue} /> : null;\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {isOwner ? (\n <div className=\"space-y-3\">\n <ActionRow>\n {liveMyListing ? (\n <ActionButton\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 helpContent={`Expires ${timeUntil(liveMyListing.endTime)}`}\n >\n <span>Cancel listing</span>\n <PriceDisplay\n amountFormatted={liveMyListing.price.formatted}\n currency={liveMyListing.price.currency}\n usdValue={liveMyListing.orderHash === liveCheapest?.orderHash ? usdValue : null}\n scale=\"card\"\n />\n </ActionButton>\n ) : null}\n {!liveMyListing || (isERC1155 && canListMoreEditions !== false) ? (\n <ActionButton tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing}>\n {liveMyListing ? \"Sell more\" : \"Sell\"}\n </ActionButton>\n ) : null}\n <ActionButton tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer}>Transfer</ActionButton>\n {remixButton}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton\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 >\n Open for sponsorship\n </ActionButton>\n ) : null}\n </ActionRow>\n {buyButton ? <ActionRow>{buyButton}</ActionRow> : null}\n </div>\n ) : (\n <div className=\"space-y-4\">\n {listedPrice}\n {isSignedIn ? (\n <ActionRow>\n {buyButton}\n {offerButton}\n {remixButton}\n {showDealOption && onProposeDeal ? (\n <ActionButton\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 >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton\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 >\n Sponsor\n </ActionButton>\n ) : null}\n </ActionRow>\n ) : (\n <AssetAccessButtons asset={asset} stacked={compact} />\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 <PriceDisplay amountFormatted={myBid.price.formatted} currency={myBid.price.currency} scale=\"row\" />\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=\"space-y-2\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"divide-y divide-border/40\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 py-2.5\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <PriceDisplay amountFormatted={bid.price.formatted} currency={bid.price.currency} scale=\"row\" />\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\n {isSignedIn ? <CompanionAppButton asset={asset} variant=\"link\" /> : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
@@ -12,10 +12,9 @@ import {
12
12
  Tag,
13
13
  X
14
14
  } from "lucide-react";
15
- import { CurrencyIcon, CurrencyAmount } from "./currency-icon.js";
15
+ import { PriceDisplay } from "./price-display.js";
16
16
  import { AddressDisplay } from "./address-display.js";
17
17
  import { ActionButton } from "./action-button.js";
18
- import { formatDisplayPrice } from "../utils/format.js";
19
18
  import { isExpired, timeUntil } from "../utils/time.js";
20
19
  import { isSameAddress } from "../utils/same-address.js";
21
20
  import { cn } from "../utils/cn.js";
@@ -27,12 +26,16 @@ function ActionRow({ children }) {
27
26
  return /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36", odd && "[&>*:first-child]:col-span-2"), children });
28
27
  }
29
28
  function PriceBlock({ order, usdValue }) {
30
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
31
- /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(order.price.formatted), symbol: order.price.currency ?? "", iconSize: 26, amountClassName: "text-3xl font-bold text-foreground tabular-nums" }),
32
- /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold text-foreground", children: order.price.currency }),
33
- usdValue ? /* @__PURE__ */ jsx("span", { className: "text-sm tabular-nums text-muted-foreground", children: usdValue }) : null,
34
- /* @__PURE__ */ jsx(HelpIcon, { content: `Expires ${timeUntil(order.endTime)}` })
35
- ] });
29
+ return /* @__PURE__ */ jsx(
30
+ PriceDisplay,
31
+ {
32
+ amountFormatted: order.price.formatted,
33
+ currency: order.price.currency,
34
+ usdValue,
35
+ scale: "hero",
36
+ trailing: /* @__PURE__ */ jsx(HelpIcon, { content: `Expires ${timeUntil(order.endTime)}` })
37
+ }
38
+ );
36
39
  }
37
40
  function AssetMarketplacePanel({
38
41
  asset,
@@ -87,11 +90,7 @@ function AssetMarketplacePanel({
87
90
  const offerButton = /* @__PURE__ */ jsx(ActionButton, { action: "offer", icon: /* @__PURE__ */ jsx(HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, children: "Make offer" });
88
91
  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? isOwner ? /* @__PURE__ */ jsxs(ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
89
92
  /* @__PURE__ */ jsx("span", { children: "Buy" }),
90
- /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(liveCheapest.price.formatted), symbol: liveCheapest.price.currency ?? "", iconSize: 14, amountClassName: "tabular-nums" }),
91
- usdValue ? /* @__PURE__ */ jsxs("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
92
- "\xB7 ",
93
- usdValue
94
- ] }) : null
93
+ /* @__PURE__ */ jsx(PriceDisplay, { amountFormatted: liveCheapest.price.formatted, currency: liveCheapest.price.currency, usdValue, scale: "card" })
95
94
  ] }) : /* @__PURE__ */ jsx(ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: "Buy now" }) : null;
96
95
  const listedPrice = !isOwner && liveCheapest ? /* @__PURE__ */ jsx(PriceBlock, { order: liveCheapest, usdValue }) : null;
97
96
  return /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs("div", { className: "relative space-y-4", children: [
@@ -107,11 +106,15 @@ function AssetMarketplacePanel({
107
106
  helpContent: `Expires ${timeUntil(liveMyListing.endTime)}`,
108
107
  children: [
109
108
  /* @__PURE__ */ jsx("span", { children: "Cancel listing" }),
110
- /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(liveMyListing.price.formatted), symbol: liveMyListing.price.currency ?? "", iconSize: 14, amountClassName: "tabular-nums" }),
111
- liveMyListing.orderHash === liveCheapest?.orderHash && usdValue ? /* @__PURE__ */ jsxs("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
112
- "\xB7 ",
113
- usdValue
114
- ] }) : null
109
+ /* @__PURE__ */ jsx(
110
+ PriceDisplay,
111
+ {
112
+ amountFormatted: liveMyListing.price.formatted,
113
+ currency: liveMyListing.price.currency,
114
+ usdValue: liveMyListing.orderHash === liveCheapest?.orderHash ? usdValue : null,
115
+ scale: "card"
116
+ }
117
+ )
115
118
  ]
116
119
  }
117
120
  ) : null,
@@ -164,10 +167,7 @@ function AssetMarketplacePanel({
164
167
  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
165
168
  /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-amber-500", children: "Your active offer" }),
166
169
  /* @__PURE__ */ jsxs("p", { className: "text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5", children: [
167
- /* @__PURE__ */ jsxs("span", { className: "font-bold text-foreground inline-flex items-center gap-1", children: [
168
- formatDisplayPrice(myBid.price.formatted),
169
- /* @__PURE__ */ jsx(CurrencyIcon, { symbol: myBid.price.currency ?? "", size: 12 })
170
- ] }),
170
+ /* @__PURE__ */ jsx(PriceDisplay, { amountFormatted: myBid.price.formatted, currency: myBid.price.currency, scale: "row" }),
171
171
  /* @__PURE__ */ jsx("span", { children: "\xB7" }),
172
172
  /* @__PURE__ */ jsx(Clock, { className: "h-3 w-3" }),
173
173
  timeUntil(myBid.endTime)
@@ -194,10 +194,7 @@ function AssetMarketplacePanel({
194
194
  ] }),
195
195
  /* @__PURE__ */ jsx("div", { className: "divide-y divide-border/40", children: liveBids.map((bid) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3 py-2.5", children: [
196
196
  /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
197
- /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1.5", children: [
198
- formatDisplayPrice(bid.price.formatted),
199
- /* @__PURE__ */ jsx(CurrencyIcon, { symbol: bid.price.currency ?? "", size: 14 })
200
- ] }) }),
197
+ /* @__PURE__ */ jsx("p", { className: "text-sm font-bold", children: /* @__PURE__ */ jsx(PriceDisplay, { amountFormatted: bid.price.formatted, currency: bid.price.currency, scale: "row" }) }),
201
198
  /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5", children: [
202
199
  /* @__PURE__ */ jsx(AddressDisplay, { address: bid.offerer, chars: 4, showCopy: false, className: "text-xs text-muted-foreground" }),
203
200
  /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "\xB7" }),
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport { Children, type ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n 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 { 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 { HelpIcon } from \"./help-icon.js\";\nimport { AssetAccessButtons, CompanionAppButton } from \"./asset-access-cards.js\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.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 asset: AssetRef;\n compact?: boolean;\n cheapest?: T;\n isOwner: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\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\n}\n\nfunction ActionRow({ children }: { children: ReactNode }) {\n const odd = Children.toArray(children).length % 2 === 1;\n return <div className={cn(\"grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36\", odd && \"[&>*:first-child]:col-span-2\")}>{children}</div>;\n}\n\nfunction PriceBlock({ order, usdValue }: { order: ApiOrderLike; usdValue?: string | null }) {\n return (\n <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1\">\n <CurrencyAmount amount={formatDisplayPrice(order.price.formatted)} symbol={order.price.currency ?? \"\"} iconSize={26} amountClassName=\"text-3xl font-bold text-foreground tabular-nums\" />\n <span className=\"text-lg font-semibold text-foreground\">{order.price.currency}</span>\n {usdValue ? <span className=\"text-sm tabular-nums text-muted-foreground\">{usdValue}</span> : null}\n <HelpIcon content={`Expires ${timeUntil(order.endTime)}`} />\n </div>\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n asset,\n compact = false,\n cheapest,\n isOwner,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n usdValue,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const { walletAddress } = useMedialaneApp();\n const isSignedIn = !!walletAddress;\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 const remixButton = remixEnabled && onOpenRemix ? (\n <ActionButton\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 >\n Remix\n </ActionButton>\n ) : null;\n\n const offerButton = (\n <ActionButton action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer}>\n Make offer\n </ActionButton>\n );\n\n const buyButton = liveCheapest && (!isOwner || canBuyMore) ? (\n isOwner ? (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n <span>Buy</span>\n <CurrencyAmount amount={formatDisplayPrice(liveCheapest.price.formatted)} symbol={liveCheapest.price.currency ?? \"\"} iconSize={14} amountClassName=\"tabular-nums\" />\n {usdValue ? <span className=\"font-normal text-muted-foreground tabular-nums\">· {usdValue}</span> : null}\n </ActionButton>\n ) : (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n Buy now\n </ActionButton>\n )\n ) : null;\n\n const listedPrice = !isOwner && liveCheapest ? <PriceBlock order={liveCheapest} usdValue={usdValue} /> : null;\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {isOwner ? (\n <div className=\"space-y-3\">\n <ActionRow>\n {liveMyListing ? (\n <ActionButton\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 helpContent={`Expires ${timeUntil(liveMyListing.endTime)}`}\n >\n <span>Cancel listing</span>\n <CurrencyAmount amount={formatDisplayPrice(liveMyListing.price.formatted)} symbol={liveMyListing.price.currency ?? \"\"} iconSize={14} amountClassName=\"tabular-nums\" />\n {liveMyListing.orderHash === liveCheapest?.orderHash && usdValue ? <span className=\"font-normal text-muted-foreground tabular-nums\">· {usdValue}</span> : null}\n </ActionButton>\n ) : null}\n {!liveMyListing || (isERC1155 && canListMoreEditions !== false) ? (\n <ActionButton tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing}>\n {liveMyListing ? \"Sell more\" : \"Sell\"}\n </ActionButton>\n ) : null}\n <ActionButton tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer}>Transfer</ActionButton>\n {remixButton}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton\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 >\n Open for sponsorship\n </ActionButton>\n ) : null}\n </ActionRow>\n {buyButton ? <ActionRow>{buyButton}</ActionRow> : null}\n </div>\n ) : (\n <div className=\"space-y-4\">\n {listedPrice}\n {isSignedIn ? (\n <ActionRow>\n {buyButton}\n {offerButton}\n {remixButton}\n {showDealOption && onProposeDeal ? (\n <ActionButton\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 >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton\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 >\n Sponsor\n </ActionButton>\n ) : null}\n </ActionRow>\n ) : (\n <AssetAccessButtons asset={asset} stacked={compact} />\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=\"space-y-2\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"divide-y divide-border/40\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 py-2.5\">\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\n {isSignedIn ? <CompanionAppButton asset={asset} variant=\"link\" /> : null}\n </div>\n </div>\n );\n}\n"],"mappings":";AA6DS,cAKL,YALK;AA3DT,SAAS,gBAAgC;AACzC;AAAA,EACE;AAAA,EAAgB;AAAA,EAAa;AAAA,EAAO;AAAA,EAAW;AAAA,EAAW;AAAA,EAAW;AAAA,EACrE;AAAA,EAAK;AAAA,OACA;AACP,SAAS,cAAc,sBAAsB;AAC7C,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AACnC,SAAS,WAAW,iBAAiB;AACrC,SAAS,qBAAqB;AAC9B,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,oBAAoB,0BAA0B;AACvD,SAAS,uBAAsC;AA2C/C,SAAS,UAAU,EAAE,SAAS,GAA4B;AACxD,QAAM,MAAM,SAAS,QAAQ,QAAQ,EAAE,SAAS,MAAM;AACtD,SAAO,oBAAC,SAAI,WAAW,GAAG,iEAAiE,OAAO,8BAA8B,GAAI,UAAS;AAC/I;AAEA,SAAS,WAAW,EAAE,OAAO,SAAS,GAAsD;AAC1F,SACE,qBAAC,SAAI,WAAU,+CACb;AAAA,wBAAC,kBAAe,QAAQ,mBAAmB,MAAM,MAAM,SAAS,GAAG,QAAQ,MAAM,MAAM,YAAY,IAAI,UAAU,IAAI,iBAAgB,mDAAkD;AAAA,IACvL,oBAAC,UAAK,WAAU,yCAAyC,gBAAM,MAAM,UAAS;AAAA,IAC7E,WAAW,oBAAC,UAAK,WAAU,8CAA8C,oBAAS,IAAU;AAAA,IAC7F,oBAAC,YAAS,SAAS,WAAW,UAAU,MAAM,OAAO,CAAC,IAAI;AAAA,KAC5D;AAEJ;AAEO,SAAS,sBAA6D;AAAA,EAC3E;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB;AAAA,EACA,2BAA2B;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAkC;AAChC,QAAM,EAAE,cAAc,IAAI,gBAAgB;AAC1C,QAAM,aAAa,CAAC,CAAC;AACrB,QAAM,WAAW,WAAW,OAAO,CAAC,QAAQ,CAAC,UAAU,IAAI,OAAO,CAAC;AACnE,QAAM,eAAe,YAAY,CAAC,UAAU,SAAS,OAAO,IAAI,WAAW;AAC3E,QAAM,gBAAgB,aAAa,CAAC,UAAU,UAAU,OAAO,IAAI,YAAY;AAE/E,QAAM,QAAQ,CAAC,WAAW,gBACtB,SAAS,KAAK,CAAC,QAAQ,cAAc,IAAI,SAAS,aAAa,CAAC,KAAK,OACrE;AAEJ,QAAM,aACJ,aAAa,WAAW,CAAC,CAAC,gBAAgB,CAAC,CAAC,iBAC5C,CAAC,cAAc,aAAa,SAAS,aAAa;AAEpD,MAAI,mBAAmB,CAAC,cAAc;AACpC,WACE,qBAAC,SAAI,WAAU,aACb;AAAA,0BAAC,SAAI,WAAU,8CAA6C;AAAA,MAC5D,oBAAC,SAAI,WAAU,kDAAiD;AAAA,OAClE;AAAA,EAEJ;AAEA,QAAM,cAAc,gBAAgB,cAClC;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,MAAM,oBAAC,aAAU,WAAU,WAAU;AAAA,MACrC,SAAS;AAAA,MACT,aAAY;AAAA,MACb;AAAA;AAAA,EAED,IACE;AAEJ,QAAM,cACJ,oBAAC,gBAAa,QAAO,SAAQ,MAAM,oBAAC,aAAU,WAAU,WAAU,GAAI,SAAS,aAAa,wBAE5F;AAGF,QAAM,YAAY,iBAAiB,CAAC,WAAW,cAC7C,UACE,qBAAC,gBAAa,QAAO,OAAM,SAAS,MAAM,eAAe,YAAY,GACnE;AAAA,wBAAC,UAAK,iBAAG;AAAA,IACT,oBAAC,kBAAe,QAAQ,mBAAmB,aAAa,MAAM,SAAS,GAAG,QAAQ,aAAa,MAAM,YAAY,IAAI,UAAU,IAAI,iBAAgB,gBAAe;AAAA,IACjK,WAAW,qBAAC,UAAK,WAAU,kDAAiD;AAAA;AAAA,MAAG;AAAA,OAAS,IAAU;AAAA,KACrG,IAEA,oBAAC,gBAAa,QAAO,OAAM,SAAS,MAAM,eAAe,YAAY,GAAG,qBAExE,IAEA;AAEJ,QAAM,cAAc,CAAC,WAAW,eAAe,oBAAC,cAAW,OAAO,cAAc,UAAoB,IAAK;AAEzG,SACE,oBAAC,SAAI,WAAU,YAEb,+BAAC,SAAI,WAAU,sBACZ;AAAA,cACC,qBAAC,SAAI,WAAU,aACb;AAAA,2BAAC,aACE;AAAA,wBACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,eAAe,oBAAC,WAAQ,WAAU,wBAAuB,IAAK,oBAAC,KAAE,WAAU,WAAU;AAAA,YAC3F,SAAS,MAAM,cAAc,aAAa;AAAA,YAC1C,UAAU;AAAA,YACV,MAAK;AAAA,YACL,aAAa,WAAW,UAAU,cAAc,OAAO,CAAC;AAAA,YAExD;AAAA,kCAAC,UAAK,4BAAc;AAAA,cACpB,oBAAC,kBAAe,QAAQ,mBAAmB,cAAc,MAAM,SAAS,GAAG,QAAQ,cAAc,MAAM,YAAY,IAAI,UAAU,IAAI,iBAAgB,gBAAe;AAAA,cACnK,cAAc,cAAc,cAAc,aAAa,WAAW,qBAAC,UAAK,WAAU,kDAAiD;AAAA;AAAA,gBAAG;AAAA,iBAAS,IAAU;AAAA;AAAA;AAAA,QAC5J,IACE;AAAA,QACH,CAAC,iBAAkB,aAAa,wBAAwB,QACvD,oBAAC,gBAAa,MAAK,QAAO,MAAM,oBAAC,OAAI,WAAU,WAAU,GAAI,SAAS,eACnE,0BAAgB,cAAc,QACjC,IACE;AAAA,QACJ,oBAAC,gBAAa,MAAK,UAAS,MAAM,oBAAC,kBAAe,WAAU,WAAU,GAAI,SAAS,gBAAgB,sBAAQ;AAAA,QAC1G;AAAA,QACA,4BAA4B,uBAC3B;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,MAAM,oBAAC,aAAU,WAAU,WAAU;AAAA,YACrC,SAAS;AAAA,YACT,aAAY;AAAA,YACb;AAAA;AAAA,QAED,IACE;AAAA,SACN;AAAA,MACC,YAAY,oBAAC,aAAW,qBAAU,IAAe;AAAA,OACpD,IAEA,qBAAC,SAAI,WAAU,aACZ;AAAA;AAAA,MACA,aACC,qBAAC,aACE;AAAA;AAAA,QACA;AAAA,QACA;AAAA,QACA,kBAAkB,gBACjB;AAAA,UAAC;AAAA;AAAA,YACC,QAAO;AAAA,YACP,MAAM,oBAAC,aAAU,WAAU,WAAU;AAAA,YACrC,SAAS;AAAA,YACT,aAAY;AAAA,YACb;AAAA;AAAA,QAED,IACE;AAAA,QACH,qBAAqB,wBACpB;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,MAAM,oBAAC,aAAU,WAAU,WAAU;AAAA,YACrC,SAAS;AAAA,YACT,aAAY;AAAA,YACb;AAAA;AAAA,QAED,IACE;AAAA,SACN,IAEA,oBAAC,sBAAmB,OAAc,SAAS,SAAS;AAAA,OAExD;AAAA,IAGD,QACC,qBAAC,SAAI,WAAU,+EACb;AAAA,2BAAC,SAAI,WAAU,qCACb;AAAA,4BAAC,aAAU,WAAU,mCAAkC;AAAA,QACvD,qBAAC,SAAI,WAAU,WACb;AAAA,8BAAC,OAAE,WAAU,wCAAuC,+BAAiB;AAAA,UACrE,qBAAC,OAAE,WAAU,kEACX;AAAA,iCAAC,UAAK,WAAU,4DACb;AAAA,iCAAmB,MAAM,MAAM,SAAS;AAAA,cACzC,oBAAC,gBAAa,QAAQ,MAAM,MAAM,YAAY,IAAI,MAAM,IAAI;AAAA,eAC9D;AAAA,YACA,oBAAC,UAAK,kBAAC;AAAA,YACP,oBAAC,SAAM,WAAU,WAAU;AAAA,YAC1B,UAAU,MAAM,OAAO;AAAA,aAC1B;AAAA,WACF;AAAA,SACF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS,MAAM,cAAc,KAAK;AAAA,UAElC;AAAA,gCAAC,KAAE,WAAU,eAAc;AAAA,YAAE;AAAA;AAAA;AAAA,MAE/B;AAAA,OACF,IACE;AAAA,IAEH,WAAW,SAAS,SAAS,IAC5B,qBAAC,SAAI,WAAU,aACb;AAAA,2BAAC,OAAE,WAAU,+CAA8C;AAAA;AAAA,QACvC,SAAS;AAAA,QAAO;AAAA,SACpC;AAAA,MACA,oBAAC,SAAI,WAAU,6BACZ,mBAAS,IAAI,CAAC,QACb,qBAAC,SAAwB,WAAU,kDACjC;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,kCACb;AAAA,gCAAC,kBAAe,SAAS,IAAI,SAAS,OAAO,GAAG,UAAU,OAAO,WAAU,iCAAgC;AAAA,YAC3G,oBAAC,UAAK,WAAU,iCAAgC,kBAAC;AAAA,YACjD,qBAAC,SAAI,WAAU,yDACb;AAAA,kCAAC,SAAM,WAAU,WAAU;AAAA,cAC1B,UAAU,IAAI,OAAO;AAAA,eACxB;AAAA,aACF;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACV,SAAS,MAAM,YAAY,GAAG;AAAA,YAC9B,WAAU;AAAA,YAEV;AAAA,kCAAC,eAAY,WAAU,eAAc;AAAA,cAAE;AAAA;AAAA;AAAA,QAEzC;AAAA,WAxBQ,IAAI,SAyBd,CACD,GACH;AAAA,OACF,IACE;AAAA,IAEH,aAAa,oBAAC,sBAAmB,OAAc,SAAQ,QAAO,IAAK;AAAA,KACtE,GACF;AAEJ;","names":[]}
1
+ {"version":3,"sources":["../../src/components/asset-marketplace-panel.tsx"],"sourcesContent":["\"use client\";\n\nimport { Children, type ReactNode } from \"react\";\nimport {\n ArrowRightLeft, CheckCircle, Clock, GitBranch, HandCoins, Handshake, Loader2,\n Tag, X,\n} from \"lucide-react\";\nimport { PriceDisplay } from \"./price-display.js\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { isExpired, timeUntil } from \"../utils/time.js\";\nimport { isSameAddress } from \"../utils/same-address.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { HelpIcon } from \"./help-icon.js\";\nimport { AssetAccessButtons, CompanionAppButton } from \"./asset-access-cards.js\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.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 asset: AssetRef;\n compact?: boolean;\n cheapest?: T;\n isOwner: boolean;\n isProcessing: boolean;\n isERC1155: boolean;\n canListMoreEditions?: boolean;\n isMarketLoading?: boolean;\n myListing: T | null;\n activeBids: T[];\n remixEnabled?: boolean;\n showDealOption?: boolean;\n\n usdValue?: string | null;\n\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\n}\n\nfunction ActionRow({ children }: { children: ReactNode }) {\n const odd = Children.toArray(children).length % 2 === 1;\n return <div className={cn(\"grid grid-cols-2 gap-2 sm:flex sm:flex-wrap sm:[&>*]:min-w-36\", odd && \"[&>*:first-child]:col-span-2\")}>{children}</div>;\n}\n\nfunction PriceBlock({ order, usdValue }: { order: ApiOrderLike; usdValue?: string | null }) {\n return (\n <PriceDisplay\n amountFormatted={order.price.formatted}\n currency={order.price.currency}\n usdValue={usdValue}\n scale=\"hero\"\n trailing={<HelpIcon content={`Expires ${timeUntil(order.endTime)}`} />}\n />\n );\n}\n\nexport function AssetMarketplacePanel<T extends ApiOrderLike = ApiOrderLike>({\n asset,\n compact = false,\n cheapest,\n isOwner,\n isProcessing,\n isERC1155,\n canListMoreEditions,\n isMarketLoading = false,\n myListing,\n activeBids,\n remixEnabled = false,\n showDealOption = false,\n showSponsorOption = false,\n onOpenSponsorProposal,\n showSponsorSolicitOption = false,\n onOpenSponsorSolicit,\n usdValue,\n onCancelClick,\n onAcceptBid,\n onOpenListing,\n onOpenTransfer,\n onOpenPurchase,\n onOpenOffer,\n onOpenRemix,\n onProposeDeal,\n}: AssetMarketplacePanelProps<T>) {\n const { walletAddress } = useMedialaneApp();\n const isSignedIn = !!walletAddress;\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 const remixButton = remixEnabled && onOpenRemix ? (\n <ActionButton\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 >\n Remix\n </ActionButton>\n ) : null;\n\n const offerButton = (\n <ActionButton action=\"offer\" icon={<HandCoins className=\"h-4 w-4\" />} onClick={onOpenOffer}>\n Make offer\n </ActionButton>\n );\n\n const buyButton = liveCheapest && (!isOwner || canBuyMore) ? (\n isOwner ? (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n <span>Buy</span>\n <PriceDisplay amountFormatted={liveCheapest.price.formatted} currency={liveCheapest.price.currency} usdValue={usdValue} scale=\"card\" />\n </ActionButton>\n ) : (\n <ActionButton action=\"buy\" onClick={() => onOpenPurchase(liveCheapest)}>\n Buy now\n </ActionButton>\n )\n ) : null;\n\n const listedPrice = !isOwner && liveCheapest ? <PriceBlock order={liveCheapest} usdValue={usdValue} /> : null;\n\n return (\n <div className=\"relative\">\n\n <div className=\"relative space-y-4\">\n {isOwner ? (\n <div className=\"space-y-3\">\n <ActionRow>\n {liveMyListing ? (\n <ActionButton\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 helpContent={`Expires ${timeUntil(liveMyListing.endTime)}`}\n >\n <span>Cancel listing</span>\n <PriceDisplay\n amountFormatted={liveMyListing.price.formatted}\n currency={liveMyListing.price.currency}\n usdValue={liveMyListing.orderHash === liveCheapest?.orderHash ? usdValue : null}\n scale=\"card\"\n />\n </ActionButton>\n ) : null}\n {!liveMyListing || (isERC1155 && canListMoreEditions !== false) ? (\n <ActionButton tone=\"blue\" icon={<Tag className=\"h-4 w-4\" />} onClick={onOpenListing}>\n {liveMyListing ? \"Sell more\" : \"Sell\"}\n </ActionButton>\n ) : null}\n <ActionButton tone=\"orange\" icon={<ArrowRightLeft className=\"h-4 w-4\" />} onClick={onOpenTransfer}>Transfer</ActionButton>\n {remixButton}\n {showSponsorSolicitOption && onOpenSponsorSolicit ? (\n <ActionButton\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 >\n Open for sponsorship\n </ActionButton>\n ) : null}\n </ActionRow>\n {buyButton ? <ActionRow>{buyButton}</ActionRow> : null}\n </div>\n ) : (\n <div className=\"space-y-4\">\n {listedPrice}\n {isSignedIn ? (\n <ActionRow>\n {buyButton}\n {offerButton}\n {remixButton}\n {showDealOption && onProposeDeal ? (\n <ActionButton\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 >\n License\n </ActionButton>\n ) : null}\n {showSponsorOption && onOpenSponsorProposal ? (\n <ActionButton\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 >\n Sponsor\n </ActionButton>\n ) : null}\n </ActionRow>\n ) : (\n <AssetAccessButtons asset={asset} stacked={compact} />\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 <PriceDisplay amountFormatted={myBid.price.formatted} currency={myBid.price.currency} scale=\"row\" />\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=\"space-y-2\">\n <p className=\"text-xs font-semibold text-muted-foreground\">\n Incoming offers ({liveBids.length})\n </p>\n <div className=\"divide-y divide-border/40\">\n {liveBids.map((bid) => (\n <div key={bid.orderHash} className=\"flex items-center justify-between gap-3 py-2.5\">\n <div className=\"min-w-0\">\n <p className=\"text-sm font-bold\">\n <PriceDisplay amountFormatted={bid.price.formatted} currency={bid.price.currency} scale=\"row\" />\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\n {isSignedIn ? <CompanionAppButton asset={asset} variant=\"link\" /> : null}\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":[]}
@@ -4,7 +4,7 @@ import * as React from 'react';
4
4
  import { VariantProps } from 'class-variance-authority';
5
5
 
6
6
  declare const badgeVariants: (props?: ({
7
- variant?: "outline" | "default" | "destructive" | "secondary" | null | undefined;
7
+ variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
8
8
  } & class_variance_authority_types.ClassProp) | undefined) => string;
9
9
  interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
10
10
  }
@@ -4,7 +4,7 @@ import * as React from 'react';
4
4
  import { VariantProps } from 'class-variance-authority';
5
5
 
6
6
  declare const badgeVariants: (props?: ({
7
- variant?: "outline" | "default" | "destructive" | "secondary" | null | undefined;
7
+ variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
8
8
  } & class_variance_authority_types.ClassProp) | undefined) => string;
9
9
  interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
10
10
  }
@@ -3,7 +3,7 @@ import * as React from 'react';
3
3
  import { VariantProps } from 'class-variance-authority';
4
4
 
5
5
  declare const buttonVariants: (props?: ({
6
- variant?: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
6
+ variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
7
7
  size?: "default" | "icon" | "sm" | "lg" | null | undefined;
8
8
  } & class_variance_authority_types.ClassProp) | undefined) => string;
9
9
  interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
@@ -3,7 +3,7 @@ import * as React from 'react';
3
3
  import { VariantProps } from 'class-variance-authority';
4
4
 
5
5
  declare const buttonVariants: (props?: ({
6
- variant?: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
6
+ variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
7
7
  size?: "default" | "icon" | "sm" | "lg" | null | undefined;
8
8
  } & class_variance_authority_types.ClassProp) | undefined) => string;
9
9
  interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
@@ -39,7 +39,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
39
39
  var import_link = __toESM(require("./link.js"), 1);
40
40
  var import_image = __toESM(require("./image.js"), 1);
41
41
  var import_cn = require("../utils/cn.js");
42
- var import_dual_price = require("./dual-price.js");
42
+ var import_price_display = require("./price-display.js");
43
43
  var import_coins = require("../data/coins.js");
44
44
  var import_format = require("../utils/format.js");
45
45
  var import_use_image_url = require("../utils/use-image-url.js");
@@ -80,13 +80,13 @@ function PriceCell({ price, status, isLoading }) {
80
80
  }
81
81
  const usd = price.quoteUsdRate != null ? (0, import_format.formatUsdPrice)(price.quotePerCoin * price.quoteUsdRate) : null;
82
82
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
83
- import_dual_price.DualPrice,
83
+ import_price_display.PriceDisplay,
84
84
  {
85
85
  amountFormatted: String(price.quotePerCoin),
86
86
  currency: price.quoteSymbol,
87
87
  usdValue: usd,
88
88
  scale: "card",
89
- secondaryClassName: "hidden sm:flex"
89
+ pillClassName: "hidden sm:inline-flex"
90
90
  }
91
91
  ) });
92
92
  }