@medialane/ui 0.27.0 → 0.29.0

package/README.md

@@ -233,6 +233,7 @@ The package uses [tsup](https://tsup.egoist.dev/) and outputs ESM + CJS + type d
 
 | Version | Added |
 |---|---|
+| **v0.28.0** | `StepNav` (presentation-only step indicator — solid active dot, outlined check for done, filling connector, accent-themed). `ServiceFormShell` gains an `aboveForm` slot (left column, between header and form — e.g. a stepper) and a **sticky right rail** on desktop. Lets the Creator Coin page adopt the standard form layout |
 | **v0.27.0** | `ServiceHeader` gains a `plain` variant (neutral border, no brand gradient); `ServiceFormShell` renders the header `plain` so create/mint form pages carry the gradient border only on the form, not the header. Standalone headers (browse pages, coin page, `/claim` hub) keep the gradient |
 | **v0.26.0** | `LaunchpadServiceCard` "living color cards" high-fidelity pass: per-hue aurora light-leaks, gradient icon tile, hairline gradient frame that ignites on interaction, staggered entrance reveal, press/hover microinteractions, animated CTA arrow; roomier grid gaps + section rhythm. Touch-first, reduced-motion safe |
 | **v0.25.0** | `CoinsExplorer`/`CoinCard` refined: kind label over the artwork (brand hues, not red), quote-currency icon on price, marketplace-style Filters dialog; dropped the Verified badge / FDV / holders / per-card glow / Trade button |

package/dist/components/asset-collection-bar.cjs

@@ -0,0 +1,135 @@
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var asset_collection_bar_exports = {};
+__export(asset_collection_bar_exports, {
+  AssetCollectionBar: () => AssetCollectionBar
+});
+module.exports = __toCommonJS(asset_collection_bar_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_image = __toESM(require("next/image"), 1);
+var import_link = __toESM(require("next/link"), 1);
+var import_lucide_react = require("lucide-react");
+var import_ip_type_badge = require("./ip-type-badge.js");
+var import_share_button = require("./share-button.js");
+var import_ipfs = require("../utils/ipfs.js");
+var import_cn = require("../utils/cn.js");
+function AssetCollectionBar({
+  collectionName,
+  collectionImage,
+  collectionHref,
+  ipType,
+  contractExplorerHref,
+  shareTitle,
+  onReportClick,
+  currentTokenId,
+  siblingTokens,
+  onNavigate
+}) {
+  const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));
+  const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;
+  const nextToken = currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;
+  const showFilmstrip = siblingTokens.length > 1;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-2xl bg-card/40 px-4 py-3 space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: collectionHref, className: "flex items-center gap-3 min-w-0 group", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: (0, import_ipfs.ipfsToHttp)(collectionImage), alt: "", fill: true, className: "object-cover", unoptimized: true }) : null }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName }),
+        ipType ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "sm" }) : null
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1 shrink-0 text-muted-foreground", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "a",
+          {
+            href: contractExplorerHref,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            title: "View contract",
+            className: "inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ExternalLink, { className: "h-4 w-4" })
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_share_button.ShareButton, { title: shareTitle, variant: "ghost", size: "icon" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            title: "Report this asset",
+            onClick: onReportClick,
+            className: "inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors",
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Flag, { className: "h-4 w-4" })
+          }
+        )
+      ] })
+    ] }),
+    showFilmstrip ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          disabled: !prevToken,
+          onClick: () => prevToken && onNavigate(prevToken.tokenId),
+          className: "shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none",
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronLeft, { className: "h-4 w-4" })
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: siblingTokens.map((sibling) => {
+        const isCurrent = String(sibling.tokenId) === String(currentTokenId);
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => onNavigate(sibling.tokenId),
+            className: (0, import_cn.cn)(
+              "relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition",
+              isCurrent ? "ring-primary" : "ring-transparent hover:ring-border"
+            ),
+            children: sibling.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: (0, import_ipfs.ipfsToHttp)(sibling.image), alt: "", fill: true, className: "object-cover", unoptimized: true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-full w-full bg-muted" })
+          },
+          sibling.tokenId
+        );
+      }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          disabled: !nextToken,
+          onClick: () => nextToken && onNavigate(nextToken.tokenId),
+          className: "shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none",
+          children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronRight, { className: "h-4 w-4" })
+        }
+      )
+    ] }) : null
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AssetCollectionBar
+});
+//# sourceMappingURL=asset-collection-bar.cjs.map

package/dist/components/asset-collection-bar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { ShareButton } from \"./share-button.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface AssetCollectionBarSibling {\n  tokenId: string;\n  image: string | null;\n}\n\nexport interface AssetCollectionBarProps {\n  collectionName: string;\n  collectionImage?: string | null;\n  collectionHref: string;\n  ipType?: string | null;\n  contractExplorerHref: string;\n  shareTitle: string;\n  onReportClick: () => void;\n  currentTokenId: string;\n  siblingTokens: AssetCollectionBarSibling[];\n  onNavigate: (tokenId: string) => void;\n}\n\n/**\n * Consolidated collection identity bar: avatar+name, IP-type pill, and\n * explorer/share/report utility icons on one row, with a filmstrip of\n * collection siblings on a second row for browsing (replaces plain-text\n * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the\n * aurora-glow design language instead of an OpenSea-style boxed panel.\n */\nexport function AssetCollectionBar({\n  collectionName,\n  collectionImage,\n  collectionHref,\n  ipType,\n  contractExplorerHref,\n  shareTitle,\n  onReportClick,\n  currentTokenId,\n  siblingTokens,\n  onNavigate,\n}: AssetCollectionBarProps) {\n  const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));\n  const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;\n  const nextToken =\n    currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;\n  const showFilmstrip = siblingTokens.length > 1;\n\n  return (\n    <div className=\"rounded-2xl bg-card/40 px-4 py-3 space-y-3\">\n      <div className=\"flex items-center justify-between gap-3\">\n        <Link href={collectionHref} className=\"flex items-center gap-3 min-w-0 group\">\n          <div className=\"relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition\">\n            {collectionImage ? (\n              <Image src={ipfsToHttp(collectionImage)} alt=\"\" fill className=\"object-cover\" unoptimized />\n            ) : null}\n          </div>\n          <p className=\"text-sm font-semibold truncate group-hover:text-primary transition-colors\">\n            {collectionName}\n          </p>\n          {ipType ? <IpTypeBadge ipType={ipType} size=\"sm\" /> : null}\n        </Link>\n\n        <div className=\"flex items-center gap-1 shrink-0 text-muted-foreground\">\n          <a\n            href={contractExplorerHref}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            title=\"View contract\"\n            className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n          >\n            <ExternalLink className=\"h-4 w-4\" />\n          </a>\n          <ShareButton title={shareTitle} variant=\"ghost\" size=\"icon\" />\n          <button\n            type=\"button\"\n            title=\"Report this asset\"\n            onClick={onReportClick}\n            className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n          >\n            <Flag className=\"h-4 w-4\" />\n          </button>\n        </div>\n      </div>\n\n      {showFilmstrip ? (\n        <div className=\"flex items-center gap-1.5\">\n          <button\n            type=\"button\"\n            disabled={!prevToken}\n            onClick={() => prevToken && onNavigate(prevToken.tokenId)}\n            className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n          >\n            <ChevronLeft className=\"h-4 w-4\" />\n          </button>\n          <div className=\"flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n            {siblingTokens.map((sibling) => {\n              const isCurrent = String(sibling.tokenId) === String(currentTokenId);\n              return (\n                <button\n                  key={sibling.tokenId}\n                  type=\"button\"\n                  onClick={() => onNavigate(sibling.tokenId)}\n                  className={cn(\n                    \"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition\",\n                    isCurrent ? \"ring-primary\" : \"ring-transparent hover:ring-border\"\n                  )}\n                >\n                  {sibling.image ? (\n                    <Image src={ipfsToHttp(sibling.image)} alt=\"\" fill className=\"object-cover\" unoptimized />\n                  ) : (\n                    <div className=\"h-full w-full bg-muted\" />\n                  )}\n                </button>\n              );\n            })}\n          </div>\n          <button\n            type=\"button\"\n            disabled={!nextToken}\n            onClick={() => nextToken && onNavigate(nextToken.tokenId)}\n            className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n          >\n            <ChevronRight className=\"h-4 w-4\" />\n          </button>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwDQ;AAtDR,mBAAkB;AAClB,kBAAiB;AACjB,0BAA8D;AAC9D,2BAA4B;AAC5B,0BAA4B;AAC5B,kBAA2B;AAC3B,gBAAmB;AA2BZ,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,eAAe,cAAc,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,MAAM,OAAO,cAAc,CAAC;AAChG,QAAM,YAAY,eAAe,IAAI,cAAc,eAAe,CAAC,IAAI;AACvE,QAAM,YACJ,gBAAgB,KAAK,eAAe,cAAc,SAAS,IAAI,cAAc,eAAe,CAAC,IAAI;AACnG,QAAM,gBAAgB,cAAc,SAAS;AAE7C,SACE,6CAAC,SAAI,WAAU,8CACb;AAAA,iDAAC,SAAI,WAAU,2CACb;AAAA,mDAAC,YAAAA,SAAA,EAAK,MAAM,gBAAgB,WAAU,yCACpC;AAAA,oDAAC,SAAI,WAAU,0KACZ,4BACC,4CAAC,aAAAC,SAAA,EAAM,SAAK,wBAAW,eAAe,GAAG,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IACxF,MACN;AAAA,QACA,4CAAC,OAAE,WAAU,6EACV,0BACH;AAAA,QACC,SAAS,4CAAC,oCAAY,QAAgB,MAAK,MAAK,IAAK;AAAA,SACxD;AAAA,MAEA,6CAAC,SAAI,WAAU,0DACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YAEV,sDAAC,oCAAa,WAAU,WAAU;AAAA;AAAA,QACpC;AAAA,QACA,4CAAC,mCAAY,OAAO,YAAY,SAAQ,SAAQ,MAAK,QAAO;AAAA,QAC5D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAM;AAAA,YACN,SAAS;AAAA,YACT,WAAU;AAAA,YAEV,sDAAC,4BAAK,WAAU,WAAU;AAAA;AAAA,QAC5B;AAAA,SACF;AAAA,OACF;AAAA,IAEC,gBACC,6CAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,sDAAC,mCAAY,WAAU,WAAU;AAAA;AAAA,MACnC;AAAA,MACA,4CAAC,SAAI,WAAU,8GACZ,wBAAc,IAAI,CAAC,YAAY;AAC9B,cAAM,YAAY,OAAO,QAAQ,OAAO,MAAM,OAAO,cAAc;AACnE,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,WAAW,QAAQ,OAAO;AAAA,YACzC,eAAW;AAAA,cACT;AAAA,cACA,YAAY,iBAAiB;AAAA,YAC/B;AAAA,YAEC,kBAAQ,QACP,4CAAC,aAAAA,SAAA,EAAM,SAAK,wBAAW,QAAQ,KAAK,GAAG,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAExF,4CAAC,SAAI,WAAU,0BAAyB;AAAA;AAAA,UAXrC,QAAQ;AAAA,QAaf;AAAA,MAEJ,CAAC,GACH;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,sDAAC,oCAAa,WAAU,WAAU;AAAA;AAAA,MACpC;AAAA,OACF,IACE;AAAA,KACN;AAEJ;","names":["Link","Image"]}

package/dist/components/asset-collection-bar.d.cts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface AssetCollectionBarSibling {
+    tokenId: string;
+    image: string | null;
+}
+interface AssetCollectionBarProps {
+    collectionName: string;
+    collectionImage?: string | null;
+    collectionHref: string;
+    ipType?: string | null;
+    contractExplorerHref: string;
+    shareTitle: string;
+    onReportClick: () => void;
+    currentTokenId: string;
+    siblingTokens: AssetCollectionBarSibling[];
+    onNavigate: (tokenId: string) => void;
+}
+/**
+ * Consolidated collection identity bar: avatar+name, IP-type pill, and
+ * explorer/share/report utility icons on one row, with a filmstrip of
+ * collection siblings on a second row for browsing (replaces plain-text
+ * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the
+ * aurora-glow design language instead of an OpenSea-style boxed panel.
+ */
+declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref, ipType, contractExplorerHref, shareTitle, onReportClick, currentTokenId, siblingTokens, onNavigate, }: AssetCollectionBarProps): react_jsx_runtime.JSX.Element;
+
+export { AssetCollectionBar, type AssetCollectionBarProps, type AssetCollectionBarSibling };

package/dist/components/asset-collection-bar.d.ts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface AssetCollectionBarSibling {
+    tokenId: string;
+    image: string | null;
+}
+interface AssetCollectionBarProps {
+    collectionName: string;
+    collectionImage?: string | null;
+    collectionHref: string;
+    ipType?: string | null;
+    contractExplorerHref: string;
+    shareTitle: string;
+    onReportClick: () => void;
+    currentTokenId: string;
+    siblingTokens: AssetCollectionBarSibling[];
+    onNavigate: (tokenId: string) => void;
+}
+/**
+ * Consolidated collection identity bar: avatar+name, IP-type pill, and
+ * explorer/share/report utility icons on one row, with a filmstrip of
+ * collection siblings on a second row for browsing (replaces plain-text
+ * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the
+ * aurora-glow design language instead of an OpenSea-style boxed panel.
+ */
+declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref, ipType, contractExplorerHref, shareTitle, onReportClick, currentTokenId, siblingTokens, onNavigate, }: AssetCollectionBarProps): react_jsx_runtime.JSX.Element;
+
+export { AssetCollectionBar, type AssetCollectionBarProps, type AssetCollectionBarSibling };

package/dist/components/asset-collection-bar.js

@@ -0,0 +1,101 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import Image from "next/image";
+import Link from "next/link";
+import { ChevronLeft, ChevronRight, ExternalLink, Flag } from "lucide-react";
+import { IpTypeBadge } from "./ip-type-badge.js";
+import { ShareButton } from "./share-button.js";
+import { ipfsToHttp } from "../utils/ipfs.js";
+import { cn } from "../utils/cn.js";
+function AssetCollectionBar({
+  collectionName,
+  collectionImage,
+  collectionHref,
+  ipType,
+  contractExplorerHref,
+  shareTitle,
+  onReportClick,
+  currentTokenId,
+  siblingTokens,
+  onNavigate
+}) {
+  const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));
+  const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;
+  const nextToken = currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;
+  const showFilmstrip = siblingTokens.length > 1;
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl bg-card/40 px-4 py-3 space-y-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
+      /* @__PURE__ */ jsxs(Link, { href: collectionHref, className: "flex items-center gap-3 min-w-0 group", children: [
+        /* @__PURE__ */ jsx("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ jsx(Image, { src: ipfsToHttp(collectionImage), alt: "", fill: true, className: "object-cover", unoptimized: true }) : null }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName }),
+        ipType ? /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm" }) : null
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 shrink-0 text-muted-foreground", children: [
+        /* @__PURE__ */ jsx(
+          "a",
+          {
+            href: contractExplorerHref,
+            target: "_blank",
+            rel: "noopener noreferrer",
+            title: "View contract",
+            className: "inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors",
+            children: /* @__PURE__ */ jsx(ExternalLink, { className: "h-4 w-4" })
+          }
+        ),
+        /* @__PURE__ */ jsx(ShareButton, { title: shareTitle, variant: "ghost", size: "icon" }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            title: "Report this asset",
+            onClick: onReportClick,
+            className: "inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors",
+            children: /* @__PURE__ */ jsx(Flag, { className: "h-4 w-4" })
+          }
+        )
+      ] })
+    ] }),
+    showFilmstrip ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          disabled: !prevToken,
+          onClick: () => prevToken && onNavigate(prevToken.tokenId),
+          className: "shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none",
+          children: /* @__PURE__ */ jsx(ChevronLeft, { className: "h-4 w-4" })
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", children: siblingTokens.map((sibling) => {
+        const isCurrent = String(sibling.tokenId) === String(currentTokenId);
+        return /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => onNavigate(sibling.tokenId),
+            className: cn(
+              "relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition",
+              isCurrent ? "ring-primary" : "ring-transparent hover:ring-border"
+            ),
+            children: sibling.image ? /* @__PURE__ */ jsx(Image, { src: ipfsToHttp(sibling.image), alt: "", fill: true, className: "object-cover", unoptimized: true }) : /* @__PURE__ */ jsx("div", { className: "h-full w-full bg-muted" })
+          },
+          sibling.tokenId
+        );
+      }) }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          disabled: !nextToken,
+          onClick: () => nextToken && onNavigate(nextToken.tokenId),
+          className: "shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none",
+          children: /* @__PURE__ */ jsx(ChevronRight, { className: "h-4 w-4" })
+        }
+      )
+    ] }) : null
+  ] });
+}
+export {
+  AssetCollectionBar
+};
+//# sourceMappingURL=asset-collection-bar.js.map

package/dist/components/asset-collection-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { ShareButton } from \"./share-button.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface AssetCollectionBarSibling {\n  tokenId: string;\n  image: string | null;\n}\n\nexport interface AssetCollectionBarProps {\n  collectionName: string;\n  collectionImage?: string | null;\n  collectionHref: string;\n  ipType?: string | null;\n  contractExplorerHref: string;\n  shareTitle: string;\n  onReportClick: () => void;\n  currentTokenId: string;\n  siblingTokens: AssetCollectionBarSibling[];\n  onNavigate: (tokenId: string) => void;\n}\n\n/**\n * Consolidated collection identity bar: avatar+name, IP-type pill, and\n * explorer/share/report utility icons on one row, with a filmstrip of\n * collection siblings on a second row for browsing (replaces plain-text\n * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the\n * aurora-glow design language instead of an OpenSea-style boxed panel.\n */\nexport function AssetCollectionBar({\n  collectionName,\n  collectionImage,\n  collectionHref,\n  ipType,\n  contractExplorerHref,\n  shareTitle,\n  onReportClick,\n  currentTokenId,\n  siblingTokens,\n  onNavigate,\n}: AssetCollectionBarProps) {\n  const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));\n  const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;\n  const nextToken =\n    currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;\n  const showFilmstrip = siblingTokens.length > 1;\n\n  return (\n    <div className=\"rounded-2xl bg-card/40 px-4 py-3 space-y-3\">\n      <div className=\"flex items-center justify-between gap-3\">\n        <Link href={collectionHref} className=\"flex items-center gap-3 min-w-0 group\">\n          <div className=\"relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition\">\n            {collectionImage ? (\n              <Image src={ipfsToHttp(collectionImage)} alt=\"\" fill className=\"object-cover\" unoptimized />\n            ) : null}\n          </div>\n          <p className=\"text-sm font-semibold truncate group-hover:text-primary transition-colors\">\n            {collectionName}\n          </p>\n          {ipType ? <IpTypeBadge ipType={ipType} size=\"sm\" /> : null}\n        </Link>\n\n        <div className=\"flex items-center gap-1 shrink-0 text-muted-foreground\">\n          <a\n            href={contractExplorerHref}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            title=\"View contract\"\n            className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n          >\n            <ExternalLink className=\"h-4 w-4\" />\n          </a>\n          <ShareButton title={shareTitle} variant=\"ghost\" size=\"icon\" />\n          <button\n            type=\"button\"\n            title=\"Report this asset\"\n            onClick={onReportClick}\n            className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n          >\n            <Flag className=\"h-4 w-4\" />\n          </button>\n        </div>\n      </div>\n\n      {showFilmstrip ? (\n        <div className=\"flex items-center gap-1.5\">\n          <button\n            type=\"button\"\n            disabled={!prevToken}\n            onClick={() => prevToken && onNavigate(prevToken.tokenId)}\n            className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n          >\n            <ChevronLeft className=\"h-4 w-4\" />\n          </button>\n          <div className=\"flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n            {siblingTokens.map((sibling) => {\n              const isCurrent = String(sibling.tokenId) === String(currentTokenId);\n              return (\n                <button\n                  key={sibling.tokenId}\n                  type=\"button\"\n                  onClick={() => onNavigate(sibling.tokenId)}\n                  className={cn(\n                    \"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition\",\n                    isCurrent ? \"ring-primary\" : \"ring-transparent hover:ring-border\"\n                  )}\n                >\n                  {sibling.image ? (\n                    <Image src={ipfsToHttp(sibling.image)} alt=\"\" fill className=\"object-cover\" unoptimized />\n                  ) : (\n                    <div className=\"h-full w-full bg-muted\" />\n                  )}\n                </button>\n              );\n            })}\n          </div>\n          <button\n            type=\"button\"\n            disabled={!nextToken}\n            onClick={() => nextToken && onNavigate(nextToken.tokenId)}\n            className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n          >\n            <ChevronRight className=\"h-4 w-4\" />\n          </button>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":";AAwDQ,SAGM,KAHN;AAtDR,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,aAAa,cAAc,cAAc,YAAY;AAC9D,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AA2BZ,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,eAAe,cAAc,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,MAAM,OAAO,cAAc,CAAC;AAChG,QAAM,YAAY,eAAe,IAAI,cAAc,eAAe,CAAC,IAAI;AACvE,QAAM,YACJ,gBAAgB,KAAK,eAAe,cAAc,SAAS,IAAI,cAAc,eAAe,CAAC,IAAI;AACnG,QAAM,gBAAgB,cAAc,SAAS;AAE7C,SACE,qBAAC,SAAI,WAAU,8CACb;AAAA,yBAAC,SAAI,WAAU,2CACb;AAAA,2BAAC,QAAK,MAAM,gBAAgB,WAAU,yCACpC;AAAA,4BAAC,SAAI,WAAU,0KACZ,4BACC,oBAAC,SAAM,KAAK,WAAW,eAAe,GAAG,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IACxF,MACN;AAAA,QACA,oBAAC,OAAE,WAAU,6EACV,0BACH;AAAA,QACC,SAAS,oBAAC,eAAY,QAAgB,MAAK,MAAK,IAAK;AAAA,SACxD;AAAA,MAEA,qBAAC,SAAI,WAAU,0DACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YAEV,8BAAC,gBAAa,WAAU,WAAU;AAAA;AAAA,QACpC;AAAA,QACA,oBAAC,eAAY,OAAO,YAAY,SAAQ,SAAQ,MAAK,QAAO;AAAA,QAC5D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAM;AAAA,YACN,SAAS;AAAA,YACT,WAAU;AAAA,YAEV,8BAAC,QAAK,WAAU,WAAU;AAAA;AAAA,QAC5B;AAAA,SACF;AAAA,OACF;AAAA,IAEC,gBACC,qBAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,8BAAC,eAAY,WAAU,WAAU;AAAA;AAAA,MACnC;AAAA,MACA,oBAAC,SAAI,WAAU,8GACZ,wBAAc,IAAI,CAAC,YAAY;AAC9B,cAAM,YAAY,OAAO,QAAQ,OAAO,MAAM,OAAO,cAAc;AACnE,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,WAAW,QAAQ,OAAO;AAAA,YACzC,WAAW;AAAA,cACT;AAAA,cACA,YAAY,iBAAiB;AAAA,YAC/B;AAAA,YAEC,kBAAQ,QACP,oBAAC,SAAM,KAAK,WAAW,QAAQ,KAAK,GAAG,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAExF,oBAAC,SAAI,WAAU,0BAAyB;AAAA;AAAA,UAXrC,QAAQ;AAAA,QAaf;AAAA,MAEJ,CAAC,GACH;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,8BAAC,gBAAa,WAAU,WAAU;AAAA;AAAA,MACpC;AAAA,OACF,IACE;AAAA,KACN;AAEJ;","names":[]}

package/dist/components/asset-marketplace-panel.cjs

@@ -0,0 +1,284 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var asset_marketplace_panel_exports = {};
+__export(asset_marketplace_panel_exports, {
+  AssetMarketplacePanel: () => AssetMarketplacePanel
+});
+module.exports = __toCommonJS(asset_marketplace_panel_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_lucide_react = require("lucide-react");
+var import_currency_icon = require("./currency-icon.js");
+var import_address_display = require("./address-display.js");
+var import_format = require("../utils/format.js");
+var import_time = require("../utils/time.js");
+const actionToneClass = {
+  blue: "bg-brand-blue",
+  orange: "bg-brand-orange",
+  purple: "bg-brand-purple",
+  destructive: "bg-destructive",
+  transparent: "bg-transparent"
+};
+function ActionButton({ label, icon, onClick, tone, disabled = false, helpContent, renderHelp }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `btn-border-animated p-[1px] rounded-2xl ${disabled ? "opacity-40 pointer-events-none" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "button",
+    {
+      className: `w-full h-10 rounded-[15px] flex items-center justify-center gap-2 px-3 text-sm font-semibold text-white transition-all hover:brightness-110 active:scale-[0.98] disabled:opacity-50 ${actionToneClass[tone]}`,
+      disabled,
+      onClick,
+      children: [
+        icon,
+        label,
+        helpContent ? renderHelp(helpContent) : null
+      ]
+    }
+  ) });
+}
+function StatRow({ floorPriceRaw, lastSaleRaw }) {
+  if (!floorPriceRaw && !lastSaleRaw) return null;
+  const floor = floorPriceRaw ? (0, import_format.parsePriceDisplay)(floorPriceRaw) : null;
+  const lastSale = lastSaleRaw ? (0, import_format.parsePriceDisplay)(lastSaleRaw) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-4 text-xs text-muted-foreground", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uppercase tracking-wider font-semibold", children: "Floor" }),
+      floor && floor.symbol ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: floor.numStr, symbol: floor.symbol, iconSize: 12, amountClassName: "text-foreground font-semibold" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-foreground font-semibold", children: "\u2014" })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "flex items-center gap-1.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "uppercase tracking-wider font-semibold", children: "Last sale" }),
+      lastSale && lastSale.symbol ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: lastSale.numStr, symbol: lastSale.symbol, iconSize: 12, amountClassName: "text-foreground font-semibold" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-foreground font-semibold", children: "\u2014" })
+    ] })
+  ] });
+}
+function AssetMarketplacePanel({
+  cheapest,
+  isOwner,
+  isSignedIn,
+  isProcessing,
+  isERC1155,
+  isMarketLoading = false,
+  myListing,
+  activeBids,
+  walletAddress,
+  remixEnabled = false,
+  showDealOption = false,
+  floorPriceRaw,
+  lastSaleRaw,
+  renderAuthAction,
+  renderHelp,
+  onCancelClick,
+  onAcceptBid,
+  onOpenListing,
+  onOpenTransfer,
+  onOpenPurchase,
+  onOpenOffer,
+  onOpenRemix,
+  onProposeDeal
+}) {
+  const myBid = !isOwner && walletAddress ? activeBids.find((bid) => bid.offerer.toLowerCase() === walletAddress.toLowerCase()) ?? null : null;
+  const canBuyMore = isERC1155 && isOwner && !!cheapest && !!walletAddress && cheapest.offerer.toLowerCase() !== walletAddress.toLowerCase();
+  if (isMarketLoading && !cheapest) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-9 w-32 rounded-md bg-muted animate-pulse" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-12 w-full rounded-2xl bg-muted animate-pulse" })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "div",
+      {
+        "aria-hidden": true,
+        className: "aurora-purple pointer-events-none",
+        style: { position: "absolute", width: 280, height: 280, top: -60, left: "20%" }
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative space-y-4", children: [
+      cheapest ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-baseline gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: cheapest.price.currency ?? "", size: 26 }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-4xl font-bold tracking-tight", children: (0, import_format.formatDisplayPrice)(cheapest.price.formatted) }),
+          renderHelp(
+            `${isOwner && !canBuyMore ? "Your listing" : "Current price"} \xB7 Expires ${(0, import_time.timeUntil)(cheapest.endTime)}`
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatRow, { floorPriceRaw, lastSaleRaw }),
+        isOwner ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+            myListing ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              ActionButton,
+              {
+                label: "Cancel",
+                icon: isProcessing ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Loader2, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, { className: "h-4 w-4" }),
+                onClick: () => onCancelClick(myListing),
+                disabled: isProcessing,
+                tone: "destructive",
+                renderHelp
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "List", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Tag, { className: "h-4 w-4" }), onClick: onOpenListing, tone: "blue", renderHelp }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Transfer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRightLeft, { className: "h-4 w-4" }), onClick: onOpenTransfer, tone: "orange", renderHelp }),
+            remixEnabled && onOpenRemix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              ActionButton,
+              {
+                label: "Remix",
+                icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.GitBranch, { className: "h-4 w-4" }),
+                onClick: onOpenRemix,
+                helpContent: "Build a licensed derivative of this digital asset \u2014 your remix is minted as a new onchain NFT linked to the original",
+                tone: "purple",
+                renderHelp
+              }
+            ) : null
+          ] }),
+          canBuyMore && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "border-t border-border/40 pt-2 mt-1" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Buy", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ShoppingCart, { className: "h-4 w-4" }), onClick: () => onOpenPurchase(cheapest), tone: "transparent", renderHelp }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Make offer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, tone: "orange", renderHelp })
+            ] })
+          ] })
+        ] }) : isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Buy", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ShoppingCart, { className: "h-4 w-4" }), onClick: () => onOpenPurchase(cheapest), tone: "transparent", renderHelp }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Make offer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, tone: "orange", renderHelp }),
+            remixEnabled && onOpenRemix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              ActionButton,
+              {
+                label: "Remix",
+                icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.GitBranch, { className: "h-4 w-4" }),
+                onClick: onOpenRemix,
+                helpContent: "Create your own attributed derivative of this work.",
+                tone: "purple",
+                renderHelp
+              }
+            ) : null,
+            showDealOption && onProposeDeal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              ActionButton,
+              {
+                label: "License",
+                icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4" }),
+                onClick: onProposeDeal,
+                helpContent: "Propose a license deal to the creator to use this work.",
+                tone: "blue",
+                renderHelp
+              }
+            ) : null
+          ] }),
+          !remixEnabled && !showDealOption ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground mt-2 leading-relaxed", children: "The creator marked this asset as no-derivatives." }) : null
+        ] }) : renderAuthAction("Sign in to trade")
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatRow, { floorPriceRaw, lastSaleRaw }),
+        isOwner ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "List", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Tag, { className: "h-4 w-4" }), onClick: onOpenListing, tone: "transparent", renderHelp }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Transfer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRightLeft, { className: "h-4 w-4" }), onClick: onOpenTransfer, tone: "orange", renderHelp }),
+          remixEnabled && onOpenRemix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            ActionButton,
+            {
+              label: "Remix",
+              icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.GitBranch, { className: "h-4 w-4" }),
+              onClick: onOpenRemix,
+              helpContent: "Build a licensed derivative of this digital asset \u2014 your remix is minted as a new onchain NFT linked to the original",
+              tone: "purple",
+              renderHelp
+            }
+          ) : null
+        ] }) : isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionButton, { label: "Make offer", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, tone: "orange", renderHelp }),
+          remixEnabled && onOpenRemix ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            ActionButton,
+            {
+              label: "Remix",
+              icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.GitBranch, { className: "h-4 w-4" }),
+              onClick: onOpenRemix,
+              helpContent: "Build a licensed derivative of this digital asset \u2014 your remix is minted as a new onchain NFT linked to the original",
+              tone: "purple",
+              renderHelp
+            }
+          ) : null
+        ] }) : renderAuthAction("Sign in to make an offer")
+      ] }),
+      myBid ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0 flex items-center gap-2.5", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.HandCoins, { className: "h-4 w-4 text-amber-500 shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-semibold text-amber-500", children: "Your active offer" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-xs text-muted-foreground flex items-center gap-1.5 mt-0.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-bold text-foreground inline-flex items-center gap-1", children: [
+                (0, import_format.formatDisplayPrice)(myBid.price.formatted),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: myBid.price.currency ?? "", size: 12 })
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "\xB7" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Clock, { className: "h-3 w-3" }),
+              (0, import_time.timeUntil)(myBid.endTime)
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "button",
+          {
+            className: "shrink-0 text-xs font-semibold text-red-400 hover:text-red-300 transition-colors flex items-center gap-1",
+            onClick: () => onCancelClick(myBid),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.X, { className: "h-3.5 w-3.5" }),
+              "Cancel"
+            ]
+          }
+        )
+      ] }) : null,
+      isOwner && activeBids.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-xl bg-card/40 p-5 space-y-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-xs font-semibold uppercase tracking-wider text-muted-foreground", children: [
+          "Incoming offers (",
+          activeBids.length,
+          ")"
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-2", children: activeBids.map((bid) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3 rounded-lg bg-muted/30 px-3 py-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
+            /* @__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: [
+              (0, import_format.formatDisplayPrice)(bid.price.formatted),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: bid.price.currency ?? "", size: 14 })
+            ] }) }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_address_display.AddressDisplay, { address: bid.offerer, chars: 4, showCopy: false, className: "text-xs text-muted-foreground" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs text-muted-foreground", children: "\xB7" }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1 text-xs text-muted-foreground", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Clock, { className: "h-3 w-3" }),
+                (0, import_time.timeUntil)(bid.endTime)
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            "button",
+            {
+              disabled: isProcessing,
+              onClick: () => onAcceptBid(bid),
+              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",
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.CheckCircle, { className: "h-3.5 w-3.5" }),
+                "Accept"
+              ]
+            }
+          )
+        ] }, bid.orderHash)) })
+      ] }) : null
+    ] })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  AssetMarketplacePanel
+});
+//# sourceMappingURL=asset-marketplace-panel.cjs.map