@medialane/ui 0.260.0 → 0.261.2

package/dist/components/asset-access-cards.cjs

@@ -19,57 +19,48 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var asset_access_cards_exports = {};
 __export(asset_access_cards_exports, {
-  AssetAccessCards: () => AssetAccessCards,
-  CompanionAppCard: () => CompanionAppCard
+  AssetAccessButtons: () => AssetAccessButtons,
+  CompanionAppButton: () => CompanionAppButton
 });
 module.exports = __toCommonJS(asset_access_cards_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_lucide_react = require("lucide-react");
 var import_sdk = require("@medialane/sdk");
+var import_lucide_react = require("lucide-react");
 var import_medialane_app = require("./medialane-app.js");
+var import_action_button = require("./action-button.js");
+var import_button = require("./button.js");
 var import_cn = require("../utils/cn.js");
-const CARD = "group flex h-full w-full items-start gap-3 rounded-2xl border border-transparent p-4 text-left transition-colors";
-function CardBody({ icon: Icon, iconClassName, title, description }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white", iconClassName), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "h-[18px] w-[18px]" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-bold leading-snug", children: title }),
-      description ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-0.5 text-xs leading-relaxed text-muted-foreground", children: description }) : null
-    ] })
-  ] });
-}
-function CompanionAppCard({ asset }) {
+function CompanionAppButton({ asset }) {
   const { companion } = (0, import_medialane_app.useMedialaneApp)();
   if (!companion) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  const Icon = companion.icon;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_button.Button, { asChild: true, variant: "outline", className: "h-[46px] w-full rounded-[13px] font-semibold", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "a",
     {
       href: `${companion.origin}${(0, import_sdk.assetHref)(asset.chain.toUpperCase(), asset.contractAddress, asset.tokenId)}`,
       target: "_blank",
       rel: "noopener noreferrer",
-      className: (0, import_cn.cn)(CARD, "bg-gradient-to-br from-brand-rose/15 via-brand-orange/10 to-transparent hover:border-brand-orange/30"),
-      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardBody, { icon: companion.icon, iconClassName: "from-brand-rose to-brand-orange", title: companion.title, description: companion.description })
+      title: companion.description,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" }),
+        companion.title
+      ]
     }
-  );
+  ) });
 }
-function AssetAccessCards({ asset, stacked = false }) {
+function AssetAccessButtons({ asset, stacked = false }) {
   const { onRequireWallet, connectLabel = "Sign in", connectDescription, companion } = (0, import_medialane_app.useMedialaneApp)();
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_cn.cn)("grid grid-cols-1 gap-3 items-stretch", companion && !stacked && "sm:grid-cols-2"), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      "button",
-      {
-        type: "button",
-        onClick: onRequireWallet,
-        className: (0, import_cn.cn)(CARD, "bg-gradient-to-br from-brand-blue/15 via-brand-purple/10 to-transparent hover:border-brand-purple/30"),
-        children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardBody, { icon: import_lucide_react.Wallet, iconClassName: "from-brand-blue to-brand-purple", title: connectLabel, description: connectDescription })
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CompanionAppCard, { asset })
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_cn.cn)("grid grid-cols-1 gap-2", companion && !stacked && "sm:grid-cols-2"), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_action_button.ActionButton, { action: "buy", icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Wallet, { className: "h-4 w-4" }), onClick: onRequireWallet, className: "w-full", children: connectLabel }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CompanionAppButton, { asset })
+    ] }),
+    connectDescription ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground", children: connectDescription }) : null
   ] });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  AssetAccessCards,
-  CompanionAppCard
+  AssetAccessButtons,
+  CompanionAppButton
 });
 //# sourceMappingURL=asset-access-cards.cjs.map

package/dist/components/asset-access-cards.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/asset-access-cards.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ElementType } from \"react\";\nimport { Wallet } from \"lucide-react\";\nimport { assetHref, type Chain } from \"@medialane/sdk\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CARD = \"group flex h-full w-full items-start gap-3 rounded-2xl border border-transparent p-4 text-left transition-colors\";\n\nfunction CardBody({ icon: Icon, iconClassName, title, description }: { icon: ElementType; iconClassName: string; title: string; description?: string }) {\n  return (\n    <>\n      <div className={cn(\"mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white\", iconClassName)}>\n        <Icon className=\"h-[18px] w-[18px]\" />\n      </div>\n      <div className=\"min-w-0 flex-1\">\n        <p className=\"text-sm font-bold leading-snug\">{title}</p>\n        {description ? <p className=\"mt-0.5 text-xs leading-relaxed text-muted-foreground\">{description}</p> : null}\n      </div>\n    </>\n  );\n}\n\nexport function CompanionAppCard({ asset }: { asset: AssetRef }) {\n  const { companion } = useMedialaneApp();\n  if (!companion) return null;\n  return (\n    <a\n      href={`${companion.origin}${assetHref(asset.chain.toUpperCase() as Chain, asset.contractAddress, asset.tokenId)}`}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      className={cn(CARD, \"bg-gradient-to-br from-brand-rose/15 via-brand-orange/10 to-transparent hover:border-brand-orange/30\")}\n    >\n      <CardBody icon={companion.icon} iconClassName=\"from-brand-rose to-brand-orange\" title={companion.title} description={companion.description} />\n    </a>\n  );\n}\n\nexport function AssetAccessCards({ asset, stacked = false }: { asset: AssetRef; stacked?: boolean }) {\n  const { onRequireWallet, connectLabel = \"Sign in\", connectDescription, companion } = useMedialaneApp();\n  return (\n    <div className={cn(\"grid grid-cols-1 gap-3 items-stretch\", companion && !stacked && \"sm:grid-cols-2\")}>\n      <button\n        type=\"button\"\n        onClick={onRequireWallet}\n        className={cn(CARD, \"bg-gradient-to-br from-brand-blue/15 via-brand-purple/10 to-transparent hover:border-brand-purple/30\")}\n      >\n        <CardBody icon={Wallet} iconClassName=\"from-brand-blue to-brand-purple\" title={connectLabel} description={connectDescription} />\n      </button>\n      <CompanionAppCard asset={asset} />\n    </div>\n  );\n}\n\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYI;AATJ,0BAAuB;AACvB,iBAAsC;AACtC,2BAA+C;AAC/C,gBAAmB;AAEnB,MAAM,OAAO;AAEb,SAAS,SAAS,EAAE,MAAM,MAAM,eAAe,OAAO,YAAY,GAAsF;AACtJ,SACE,4EACE;AAAA,gDAAC,SAAI,eAAW,cAAG,oGAAoG,aAAa,GAClI,sDAAC,QAAK,WAAU,qBAAoB,GACtC;AAAA,IACA,6CAAC,SAAI,WAAU,kBACb;AAAA,kDAAC,OAAE,WAAU,kCAAkC,iBAAM;AAAA,MACpD,cAAc,4CAAC,OAAE,WAAU,wDAAwD,uBAAY,IAAO;AAAA,OACzG;AAAA,KACF;AAEJ;AAEO,SAAS,iBAAiB,EAAE,MAAM,GAAwB;AAC/D,QAAM,EAAE,UAAU,QAAI,sCAAgB;AACtC,MAAI,CAAC,UAAW,QAAO;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,UAAU,MAAM,OAAG,sBAAU,MAAM,MAAM,YAAY,GAAY,MAAM,iBAAiB,MAAM,OAAO,CAAC;AAAA,MAC/G,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,eAAW,cAAG,MAAM,sGAAsG;AAAA,MAE1H,sDAAC,YAAS,MAAM,UAAU,MAAM,eAAc,mCAAkC,OAAO,UAAU,OAAO,aAAa,UAAU,aAAa;AAAA;AAAA,EAC9I;AAEJ;AAEO,SAAS,iBAAiB,EAAE,OAAO,UAAU,MAAM,GAA2C;AACnG,QAAM,EAAE,iBAAiB,eAAe,WAAW,oBAAoB,UAAU,QAAI,sCAAgB;AACrG,SACE,6CAAC,SAAI,eAAW,cAAG,wCAAwC,aAAa,CAAC,WAAW,gBAAgB,GAClG;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,eAAW,cAAG,MAAM,sGAAsG;AAAA,QAE1H,sDAAC,YAAS,MAAM,4BAAQ,eAAc,mCAAkC,OAAO,cAAc,aAAa,oBAAoB;AAAA;AAAA,IAChI;AAAA,IACA,4CAAC,oBAAiB,OAAc;AAAA,KAClC;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/asset-access-cards.tsx"],"sourcesContent":["\"use client\";\n\nimport { assetHref, type Chain } from \"@medialane/sdk\";\nimport { Wallet } from \"lucide-react\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { Button } from \"./button.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport function CompanionAppButton({ asset }: { asset: AssetRef }) {\n  const { companion } = useMedialaneApp();\n  if (!companion) return null;\n  const Icon = companion.icon;\n  return (\n    <Button asChild variant=\"outline\" className=\"h-[46px] w-full rounded-[13px] font-semibold\">\n      <a\n        href={`${companion.origin}${assetHref(asset.chain.toUpperCase() as Chain, asset.contractAddress, asset.tokenId)}`}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        title={companion.description}\n      >\n        <Icon className=\"h-4 w-4\" />\n        {companion.title}\n      </a>\n    </Button>\n  );\n}\n\nexport function AssetAccessButtons({ asset, stacked = false }: { asset: AssetRef; stacked?: boolean }) {\n  const { onRequireWallet, connectLabel = \"Sign in\", connectDescription, companion } = useMedialaneApp();\n  return (\n    <div className=\"space-y-2\">\n      <div className={cn(\"grid grid-cols-1 gap-2\", companion && !stacked && \"sm:grid-cols-2\")}>\n        <ActionButton action=\"buy\" icon={<Wallet className=\"h-4 w-4\" />} onClick={onRequireWallet} className=\"w-full\">\n          {connectLabel}\n        </ActionButton>\n        <CompanionAppButton asset={asset} />\n      </div>\n      {connectDescription ? <p className=\"text-xs text-muted-foreground\">{connectDescription}</p> : null}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAeM;AAbN,iBAAsC;AACtC,0BAAuB;AACvB,2BAA+C;AAC/C,2BAA6B;AAC7B,oBAAuB;AACvB,gBAAmB;AAEZ,SAAS,mBAAmB,EAAE,MAAM,GAAwB;AACjE,QAAM,EAAE,UAAU,QAAI,sCAAgB;AACtC,MAAI,CAAC,UAAW,QAAO;AACvB,QAAM,OAAO,UAAU;AACvB,SACE,4CAAC,wBAAO,SAAO,MAAC,SAAQ,WAAU,WAAU,gDAC1C;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,UAAU,MAAM,OAAG,sBAAU,MAAM,MAAM,YAAY,GAAY,MAAM,iBAAiB,MAAM,OAAO,CAAC;AAAA,MAC/G,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,OAAO,UAAU;AAAA,MAEjB;AAAA,oDAAC,QAAK,WAAU,WAAU;AAAA,QACzB,UAAU;AAAA;AAAA;AAAA,EACb,GACF;AAEJ;AAEO,SAAS,mBAAmB,EAAE,OAAO,UAAU,MAAM,GAA2C;AACrG,QAAM,EAAE,iBAAiB,eAAe,WAAW,oBAAoB,UAAU,QAAI,sCAAgB;AACrG,SACE,6CAAC,SAAI,WAAU,aACb;AAAA,iDAAC,SAAI,eAAW,cAAG,0BAA0B,aAAa,CAAC,WAAW,gBAAgB,GACpF;AAAA,kDAAC,qCAAa,QAAO,OAAM,MAAM,4CAAC,8BAAO,WAAU,WAAU,GAAI,SAAS,iBAAiB,WAAU,UAClG,wBACH;AAAA,MACA,4CAAC,sBAAmB,OAAc;AAAA,OACpC;AAAA,IACC,qBAAqB,4CAAC,OAAE,WAAU,iCAAiC,8BAAmB,IAAO;AAAA,KAChG;AAEJ;","names":[]}

package/dist/components/asset-access-cards.d.cts

@@ -7,12 +7,12 @@ import 'starknet';
 import '@medialane/sdk';
 import '../utils/ipfs.cjs';
 
-declare function CompanionAppCard({ asset }: {
+declare function CompanionAppButton({ asset }: {
     asset: AssetRef;
 }): react_jsx_runtime.JSX.Element | null;
-declare function AssetAccessCards({ asset, stacked }: {
+declare function AssetAccessButtons({ asset, stacked }: {
     asset: AssetRef;
     stacked?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
-export { AssetAccessCards, CompanionAppCard };
+export { AssetAccessButtons, CompanionAppButton };

package/dist/components/asset-access-cards.d.ts

@@ -7,12 +7,12 @@ import 'starknet';
 import '@medialane/sdk';
 import '../utils/ipfs.js';
 
-declare function CompanionAppCard({ asset }: {
+declare function CompanionAppButton({ asset }: {
     asset: AssetRef;
 }): react_jsx_runtime.JSX.Element | null;
-declare function AssetAccessCards({ asset, stacked }: {
+declare function AssetAccessButtons({ asset, stacked }: {
     asset: AssetRef;
     stacked?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
-export { AssetAccessCards, CompanionAppCard };
+export { AssetAccessButtons, CompanionAppButton };

package/dist/components/asset-access-cards.js

@@ -1,50 +1,41 @@
 "use client";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Wallet } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { assetHref } from "@medialane/sdk";
+import { Wallet } from "lucide-react";
 import { useMedialaneApp } from "./medialane-app.js";
+import { ActionButton } from "./action-button.js";
+import { Button } from "./button.js";
 import { cn } from "../utils/cn.js";
-const CARD = "group flex h-full w-full items-start gap-3 rounded-2xl border border-transparent p-4 text-left transition-colors";
-function CardBody({ icon: Icon, iconClassName, title, description }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx("div", { className: cn("mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white", iconClassName), children: /* @__PURE__ */ jsx(Icon, { className: "h-[18px] w-[18px]" }) }),
-    /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsx("p", { className: "text-sm font-bold leading-snug", children: title }),
-      description ? /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-xs leading-relaxed text-muted-foreground", children: description }) : null
-    ] })
-  ] });
-}
-function CompanionAppCard({ asset }) {
+function CompanionAppButton({ asset }) {
   const { companion } = useMedialaneApp();
   if (!companion) return null;
-  return /* @__PURE__ */ jsx(
+  const Icon = companion.icon;
+  return /* @__PURE__ */ jsx(Button, { asChild: true, variant: "outline", className: "h-[46px] w-full rounded-[13px] font-semibold", children: /* @__PURE__ */ jsxs(
     "a",
     {
       href: `${companion.origin}${assetHref(asset.chain.toUpperCase(), asset.contractAddress, asset.tokenId)}`,
       target: "_blank",
       rel: "noopener noreferrer",
-      className: cn(CARD, "bg-gradient-to-br from-brand-rose/15 via-brand-orange/10 to-transparent hover:border-brand-orange/30"),
-      children: /* @__PURE__ */ jsx(CardBody, { icon: companion.icon, iconClassName: "from-brand-rose to-brand-orange", title: companion.title, description: companion.description })
+      title: companion.description,
+      children: [
+        /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
+        companion.title
+      ]
     }
-  );
+  ) });
 }
-function AssetAccessCards({ asset, stacked = false }) {
+function AssetAccessButtons({ asset, stacked = false }) {
   const { onRequireWallet, connectLabel = "Sign in", connectDescription, companion } = useMedialaneApp();
-  return /* @__PURE__ */ jsxs("div", { className: cn("grid grid-cols-1 gap-3 items-stretch", companion && !stacked && "sm:grid-cols-2"), children: [
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        onClick: onRequireWallet,
-        className: cn(CARD, "bg-gradient-to-br from-brand-blue/15 via-brand-purple/10 to-transparent hover:border-brand-purple/30"),
-        children: /* @__PURE__ */ jsx(CardBody, { icon: Wallet, iconClassName: "from-brand-blue to-brand-purple", title: connectLabel, description: connectDescription })
-      }
-    ),
-    /* @__PURE__ */ jsx(CompanionAppCard, { asset })
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: cn("grid grid-cols-1 gap-2", companion && !stacked && "sm:grid-cols-2"), children: [
+      /* @__PURE__ */ jsx(ActionButton, { action: "buy", icon: /* @__PURE__ */ jsx(Wallet, { className: "h-4 w-4" }), onClick: onRequireWallet, className: "w-full", children: connectLabel }),
+      /* @__PURE__ */ jsx(CompanionAppButton, { asset })
+    ] }),
+    connectDescription ? /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: connectDescription }) : null
   ] });
 }
 export {
-  AssetAccessCards,
-  CompanionAppCard
+  AssetAccessButtons,
+  CompanionAppButton
 };
 //# sourceMappingURL=asset-access-cards.js.map

package/dist/components/asset-access-cards.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/asset-access-cards.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ElementType } from \"react\";\nimport { Wallet } from \"lucide-react\";\nimport { assetHref, type Chain } from \"@medialane/sdk\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CARD = \"group flex h-full w-full items-start gap-3 rounded-2xl border border-transparent p-4 text-left transition-colors\";\n\nfunction CardBody({ icon: Icon, iconClassName, title, description }: { icon: ElementType; iconClassName: string; title: string; description?: string }) {\n  return (\n    <>\n      <div className={cn(\"mt-0.5 flex h-9 w-9 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br text-white\", iconClassName)}>\n        <Icon className=\"h-[18px] w-[18px]\" />\n      </div>\n      <div className=\"min-w-0 flex-1\">\n        <p className=\"text-sm font-bold leading-snug\">{title}</p>\n        {description ? <p className=\"mt-0.5 text-xs leading-relaxed text-muted-foreground\">{description}</p> : null}\n      </div>\n    </>\n  );\n}\n\nexport function CompanionAppCard({ asset }: { asset: AssetRef }) {\n  const { companion } = useMedialaneApp();\n  if (!companion) return null;\n  return (\n    <a\n      href={`${companion.origin}${assetHref(asset.chain.toUpperCase() as Chain, asset.contractAddress, asset.tokenId)}`}\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      className={cn(CARD, \"bg-gradient-to-br from-brand-rose/15 via-brand-orange/10 to-transparent hover:border-brand-orange/30\")}\n    >\n      <CardBody icon={companion.icon} iconClassName=\"from-brand-rose to-brand-orange\" title={companion.title} description={companion.description} />\n    </a>\n  );\n}\n\nexport function AssetAccessCards({ asset, stacked = false }: { asset: AssetRef; stacked?: boolean }) {\n  const { onRequireWallet, connectLabel = \"Sign in\", connectDescription, companion } = useMedialaneApp();\n  return (\n    <div className={cn(\"grid grid-cols-1 gap-3 items-stretch\", companion && !stacked && \"sm:grid-cols-2\")}>\n      <button\n        type=\"button\"\n        onClick={onRequireWallet}\n        className={cn(CARD, \"bg-gradient-to-br from-brand-blue/15 via-brand-purple/10 to-transparent hover:border-brand-purple/30\")}\n      >\n        <CardBody icon={Wallet} iconClassName=\"from-brand-blue to-brand-purple\" title={connectLabel} description={connectDescription} />\n      </button>\n      <CompanionAppCard asset={asset} />\n    </div>\n  );\n}\n\n"],"mappings":";AAYI,mBAEI,KAEF,YAJF;AATJ,SAAS,cAAc;AACvB,SAAS,iBAA6B;AACtC,SAAS,uBAAsC;AAC/C,SAAS,UAAU;AAEnB,MAAM,OAAO;AAEb,SAAS,SAAS,EAAE,MAAM,MAAM,eAAe,OAAO,YAAY,GAAsF;AACtJ,SACE,iCACE;AAAA,wBAAC,SAAI,WAAW,GAAG,oGAAoG,aAAa,GAClI,8BAAC,QAAK,WAAU,qBAAoB,GACtC;AAAA,IACA,qBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,OAAE,WAAU,kCAAkC,iBAAM;AAAA,MACpD,cAAc,oBAAC,OAAE,WAAU,wDAAwD,uBAAY,IAAO;AAAA,OACzG;AAAA,KACF;AAEJ;AAEO,SAAS,iBAAiB,EAAE,MAAM,GAAwB;AAC/D,QAAM,EAAE,UAAU,IAAI,gBAAgB;AACtC,MAAI,CAAC,UAAW,QAAO;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,UAAU,MAAM,GAAG,UAAU,MAAM,MAAM,YAAY,GAAY,MAAM,iBAAiB,MAAM,OAAO,CAAC;AAAA,MAC/G,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,WAAW,GAAG,MAAM,sGAAsG;AAAA,MAE1H,8BAAC,YAAS,MAAM,UAAU,MAAM,eAAc,mCAAkC,OAAO,UAAU,OAAO,aAAa,UAAU,aAAa;AAAA;AAAA,EAC9I;AAEJ;AAEO,SAAS,iBAAiB,EAAE,OAAO,UAAU,MAAM,GAA2C;AACnG,QAAM,EAAE,iBAAiB,eAAe,WAAW,oBAAoB,UAAU,IAAI,gBAAgB;AACrG,SACE,qBAAC,SAAI,WAAW,GAAG,wCAAwC,aAAa,CAAC,WAAW,gBAAgB,GAClG;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS;AAAA,QACT,WAAW,GAAG,MAAM,sGAAsG;AAAA,QAE1H,8BAAC,YAAS,MAAM,QAAQ,eAAc,mCAAkC,OAAO,cAAc,aAAa,oBAAoB;AAAA;AAAA,IAChI;AAAA,IACA,oBAAC,oBAAiB,OAAc;AAAA,KAClC;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/asset-access-cards.tsx"],"sourcesContent":["\"use client\";\n\nimport { assetHref, type Chain } from \"@medialane/sdk\";\nimport { Wallet } from \"lucide-react\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.js\";\nimport { ActionButton } from \"./action-button.js\";\nimport { Button } from \"./button.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport function CompanionAppButton({ asset }: { asset: AssetRef }) {\n  const { companion } = useMedialaneApp();\n  if (!companion) return null;\n  const Icon = companion.icon;\n  return (\n    <Button asChild variant=\"outline\" className=\"h-[46px] w-full rounded-[13px] font-semibold\">\n      <a\n        href={`${companion.origin}${assetHref(asset.chain.toUpperCase() as Chain, asset.contractAddress, asset.tokenId)}`}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        title={companion.description}\n      >\n        <Icon className=\"h-4 w-4\" />\n        {companion.title}\n      </a>\n    </Button>\n  );\n}\n\nexport function AssetAccessButtons({ asset, stacked = false }: { asset: AssetRef; stacked?: boolean }) {\n  const { onRequireWallet, connectLabel = \"Sign in\", connectDescription, companion } = useMedialaneApp();\n  return (\n    <div className=\"space-y-2\">\n      <div className={cn(\"grid grid-cols-1 gap-2\", companion && !stacked && \"sm:grid-cols-2\")}>\n        <ActionButton action=\"buy\" icon={<Wallet className=\"h-4 w-4\" />} onClick={onRequireWallet} className=\"w-full\">\n          {connectLabel}\n        </ActionButton>\n        <CompanionAppButton asset={asset} />\n      </div>\n      {connectDescription ? <p className=\"text-xs text-muted-foreground\">{connectDescription}</p> : null}\n    </div>\n  );\n}\n"],"mappings":";AAeM,SAME,KANF;AAbN,SAAS,iBAA6B;AACtC,SAAS,cAAc;AACvB,SAAS,uBAAsC;AAC/C,SAAS,oBAAoB;AAC7B,SAAS,cAAc;AACvB,SAAS,UAAU;AAEZ,SAAS,mBAAmB,EAAE,MAAM,GAAwB;AACjE,QAAM,EAAE,UAAU,IAAI,gBAAgB;AACtC,MAAI,CAAC,UAAW,QAAO;AACvB,QAAM,OAAO,UAAU;AACvB,SACE,oBAAC,UAAO,SAAO,MAAC,SAAQ,WAAU,WAAU,gDAC1C;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,UAAU,MAAM,GAAG,UAAU,MAAM,MAAM,YAAY,GAAY,MAAM,iBAAiB,MAAM,OAAO,CAAC;AAAA,MAC/G,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,OAAO,UAAU;AAAA,MAEjB;AAAA,4BAAC,QAAK,WAAU,WAAU;AAAA,QACzB,UAAU;AAAA;AAAA;AAAA,EACb,GACF;AAEJ;AAEO,SAAS,mBAAmB,EAAE,OAAO,UAAU,MAAM,GAA2C;AACrG,QAAM,EAAE,iBAAiB,eAAe,WAAW,oBAAoB,UAAU,IAAI,gBAAgB;AACrG,SACE,qBAAC,SAAI,WAAU,aACb;AAAA,yBAAC,SAAI,WAAW,GAAG,0BAA0B,aAAa,CAAC,WAAW,gBAAgB,GACpF;AAAA,0BAAC,gBAAa,QAAO,OAAM,MAAM,oBAAC,UAAO,WAAU,WAAU,GAAI,SAAS,iBAAiB,WAAU,UAClG,wBACH;AAAA,MACA,oBAAC,sBAAmB,OAAc;AAAA,OACpC;AAAA,IACC,qBAAqB,oBAAC,OAAE,WAAU,iCAAiC,8BAAmB,IAAO;AAAA,KAChG;AAEJ;","names":[]}

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

@@ -32,22 +32,18 @@ var import_format = require("../utils/format.js");
 var import_time = require("../utils/time.js");
 var import_same_address = require("../utils/same-address.js");
 var import_cn = require("../utils/cn.js");
+var import_help_icon = require("./help-icon.js");
 var import_asset_access_cards = require("./asset-access-cards.js");
 var import_medialane_app = require("./medialane-app.js");
-var import_help_icon = require("./help-icon.js");
 function ActionRow({ children }) {
   const odd = import_react.Children.toArray(children).length % 2 === 1;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("grid grid-cols-2 gap-2", odd && "[&>*:first-child]:col-span-2"), children });
 }
-function PriceLine({ label, order, usdValue }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-sm text-muted-foreground", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyAmount, { amount: (0, import_format.formatDisplayPrice)(order.price.formatted), symbol: order.price.currency ?? "", iconSize: 14, amountClassName: "text-base font-bold text-foreground tabular-nums" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-foreground", children: order.price.currency }),
-    usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "tabular-nums", children: [
-      "\xB7 ",
-      usdValue
-    ] }) : null,
+function PriceBlock({ order, usdValue }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
+    /* @__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" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-lg font-semibold text-foreground", children: order.price.currency }),
+    usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm tabular-nums text-muted-foreground", children: usdValue }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_help_icon.HelpIcon, { content: `Expires ${(0, import_time.timeUntil)(order.endTime)}` })
   ] });
 }
@@ -102,17 +98,16 @@ function AssetMarketplacePanel({
     }
   ) : null;
   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" });
-  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_action_button.ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
+  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? isOwner ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_action_button.ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Buy" }),
     /* @__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" }),
     usdValue ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
       "\xB7 ",
       usdValue
     ] }) : null
-  ] }) : null;
-  const listedPrice = !isOwner && !isSignedIn && liveCheapest ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PriceLine, { label: "Price", order: liveCheapest, usdValue }) : null;
+  ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_action_button.ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: "Buy now" }) : null;
+  const listedPrice = !isOwner && liveCheapest ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PriceBlock, { order: liveCheapest, usdValue }) : null;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative space-y-4", children: [
-    listedPrice,
     isOwner ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ActionRow, { children: [
         liveMyListing ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
@@ -148,31 +143,34 @@ function AssetMarketplacePanel({
         ) : null
       ] }),
       buyButton ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ActionRow, { children: buyButton }) : null
-    ] }) : isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "space-y-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ActionRow, { children: [
-      buyButton,
-      offerButton,
-      remixButton,
-      showDealOption && onProposeDeal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_action_button.ActionButton,
-        {
-          action: "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.",
-          children: "License"
-        }
-      ) : null,
-      showSponsorOption && onOpenSponsorProposal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_action_button.ActionButton,
-        {
-          tone: "blue",
-          icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Handshake, { className: "h-4 w-4" }),
-          onClick: onOpenSponsorProposal,
-          helpContent: "Propose to sponsor this creator's work \u2014 pay them directly for a license, no escrow.",
-          children: "Sponsor"
-        }
-      ) : null
-    ] }) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_asset_access_cards.AssetAccessCards, { asset, stacked: compact }),
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4", children: [
+      listedPrice,
+      isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ActionRow, { children: [
+        buyButton,
+        offerButton,
+        remixButton,
+        showDealOption && onProposeDeal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_action_button.ActionButton,
+          {
+            action: "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.",
+            children: "License"
+          }
+        ) : null,
+        showSponsorOption && onOpenSponsorProposal ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_action_button.ActionButton,
+          {
+            tone: "blue",
+            icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Handshake, { className: "h-4 w-4" }),
+            onClick: onOpenSponsorProposal,
+            helpContent: "Propose to sponsor this creator's work \u2014 pay them directly for a license, no escrow.",
+            children: "Sponsor"
+          }
+        ) : null
+      ] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_asset_access_cards.AssetAccessButtons, { asset, stacked: compact })
+    ] }),
     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" }),
@@ -236,7 +234,7 @@ function AssetMarketplacePanel({
         )
       ] }, bid.orderHash)) })
     ] }) : null,
-    isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_asset_access_cards.CompanionAppCard, { asset }) : null
+    isSignedIn ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_asset_access_cards.CompanionAppButton, { asset }) : null
   ] }) });
 }
 // Annotate the CommonJS export names for ESM import in node:

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

@@ -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 { AssetAccessCards, CompanionAppCard } from \"./asset-access-cards.js\";\nimport { useMedialaneApp, type AssetRef } from \"./medialane-app.js\";\nimport { HelpIcon } from \"./help-icon.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\", odd && \"[&>*:first-child]:col-span-2\")}>{children}</div>;\n}\n\nfunction PriceLine({ label, order, usdValue }: { label: string; order: ApiOrderLike; usdValue?: string | null }) {\n  return (\n    <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1 text-sm text-muted-foreground\">\n      <span>{label}</span>\n      <CurrencyAmount amount={formatDisplayPrice(order.price.formatted)} symbol={order.price.currency ?? \"\"} iconSize={14} amountClassName=\"text-base font-bold text-foreground tabular-nums\" />\n      <span className=\"font-semibold text-foreground\">{order.price.currency}</span>\n      {usdValue ? <span className=\"tabular-nums\">· {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    <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  ) : null;\n\n  const listedPrice = !isOwner && !isSignedIn && liveCheapest ? (\n    <PriceLine label=\"Price\" order={liveCheapest} usdValue={usdValue} />\n  ) : null;\n\n  return (\n    <div className=\"relative\">\n\n      <div className=\"relative space-y-4\">\n        {listedPrice}\n\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 ? \"List more\" : \"List for sale\"}\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        ) : isSignedIn ? (\n          <div className=\"space-y-3\">\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          </div>\n        ) : (\n          <AssetAccessCards asset={asset} stacked={compact} />\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 ? <CompanionAppCard asset={asset} /> : null}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"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\", 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 ? \"List more\" : \"List for sale\"}\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} /> : null}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

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

@@ -19,22 +19,18 @@ import { formatDisplayPrice } from "../utils/format.js";
 import { isExpired, timeUntil } from "../utils/time.js";
 import { isSameAddress } from "../utils/same-address.js";
 import { cn } from "../utils/cn.js";
-import { AssetAccessCards, CompanionAppCard } from "./asset-access-cards.js";
-import { useMedialaneApp } from "./medialane-app.js";
 import { HelpIcon } from "./help-icon.js";
+import { AssetAccessButtons, CompanionAppButton } from "./asset-access-cards.js";
+import { useMedialaneApp } from "./medialane-app.js";
 function ActionRow({ children }) {
   const odd = Children.toArray(children).length % 2 === 1;
   return /* @__PURE__ */ jsx("div", { className: cn("grid grid-cols-2 gap-2", odd && "[&>*:first-child]:col-span-2"), children });
 }
-function PriceLine({ label, order, usdValue }) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-sm text-muted-foreground", children: [
-    /* @__PURE__ */ jsx("span", { children: label }),
-    /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(order.price.formatted), symbol: order.price.currency ?? "", iconSize: 14, amountClassName: "text-base font-bold text-foreground tabular-nums" }),
-    /* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground", children: order.price.currency }),
-    usdValue ? /* @__PURE__ */ jsxs("span", { className: "tabular-nums", children: [
-      "\xB7 ",
-      usdValue
-    ] }) : null,
+function PriceBlock({ order, usdValue }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [
+    /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(order.price.formatted), symbol: order.price.currency ?? "", iconSize: 26, amountClassName: "text-3xl font-bold text-foreground tabular-nums" }),
+    /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold text-foreground", children: order.price.currency }),
+    usdValue ? /* @__PURE__ */ jsx("span", { className: "text-sm tabular-nums text-muted-foreground", children: usdValue }) : null,
     /* @__PURE__ */ jsx(HelpIcon, { content: `Expires ${timeUntil(order.endTime)}` })
   ] });
 }
@@ -89,17 +85,16 @@ function AssetMarketplacePanel({
     }
   ) : null;
   const offerButton = /* @__PURE__ */ jsx(ActionButton, { action: "offer", icon: /* @__PURE__ */ jsx(HandCoins, { className: "h-4 w-4" }), onClick: onOpenOffer, children: "Make offer" });
-  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? /* @__PURE__ */ jsxs(ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
+  const buyButton = liveCheapest && (!isOwner || canBuyMore) ? isOwner ? /* @__PURE__ */ jsxs(ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: [
     /* @__PURE__ */ jsx("span", { children: "Buy" }),
     /* @__PURE__ */ jsx(CurrencyAmount, { amount: formatDisplayPrice(liveCheapest.price.formatted), symbol: liveCheapest.price.currency ?? "", iconSize: 14, amountClassName: "tabular-nums" }),
     usdValue ? /* @__PURE__ */ jsxs("span", { className: "font-normal text-muted-foreground tabular-nums", children: [
       "\xB7 ",
       usdValue
     ] }) : null
-  ] }) : null;
-  const listedPrice = !isOwner && !isSignedIn && liveCheapest ? /* @__PURE__ */ jsx(PriceLine, { label: "Price", order: liveCheapest, usdValue }) : null;
+  ] }) : /* @__PURE__ */ jsx(ActionButton, { action: "buy", onClick: () => onOpenPurchase(liveCheapest), children: "Buy now" }) : null;
+  const listedPrice = !isOwner && liveCheapest ? /* @__PURE__ */ jsx(PriceBlock, { order: liveCheapest, usdValue }) : null;
   return /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs("div", { className: "relative space-y-4", children: [
-    listedPrice,
     isOwner ? /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
       /* @__PURE__ */ jsxs(ActionRow, { children: [
         liveMyListing ? /* @__PURE__ */ jsxs(
@@ -135,31 +130,34 @@ function AssetMarketplacePanel({
         ) : null
       ] }),
       buyButton ? /* @__PURE__ */ jsx(ActionRow, { children: buyButton }) : null
-    ] }) : isSignedIn ? /* @__PURE__ */ jsx("div", { className: "space-y-3", children: /* @__PURE__ */ jsxs(ActionRow, { children: [
-      buyButton,
-      offerButton,
-      remixButton,
-      showDealOption && onProposeDeal ? /* @__PURE__ */ jsx(
-        ActionButton,
-        {
-          action: "license",
-          icon: /* @__PURE__ */ jsx(HandCoins, { className: "h-4 w-4" }),
-          onClick: onProposeDeal,
-          helpContent: "Propose a license deal to the creator to use this work.",
-          children: "License"
-        }
-      ) : null,
-      showSponsorOption && onOpenSponsorProposal ? /* @__PURE__ */ jsx(
-        ActionButton,
-        {
-          tone: "blue",
-          icon: /* @__PURE__ */ jsx(Handshake, { className: "h-4 w-4" }),
-          onClick: onOpenSponsorProposal,
-          helpContent: "Propose to sponsor this creator's work \u2014 pay them directly for a license, no escrow.",
-          children: "Sponsor"
-        }
-      ) : null
-    ] }) }) : /* @__PURE__ */ jsx(AssetAccessCards, { asset, stacked: compact }),
+    ] }) : /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      listedPrice,
+      isSignedIn ? /* @__PURE__ */ jsxs(ActionRow, { children: [
+        buyButton,
+        offerButton,
+        remixButton,
+        showDealOption && onProposeDeal ? /* @__PURE__ */ jsx(
+          ActionButton,
+          {
+            action: "license",
+            icon: /* @__PURE__ */ jsx(HandCoins, { className: "h-4 w-4" }),
+            onClick: onProposeDeal,
+            helpContent: "Propose a license deal to the creator to use this work.",
+            children: "License"
+          }
+        ) : null,
+        showSponsorOption && onOpenSponsorProposal ? /* @__PURE__ */ jsx(
+          ActionButton,
+          {
+            tone: "blue",
+            icon: /* @__PURE__ */ jsx(Handshake, { className: "h-4 w-4" }),
+            onClick: onOpenSponsorProposal,
+            helpContent: "Propose to sponsor this creator's work \u2014 pay them directly for a license, no escrow.",
+            children: "Sponsor"
+          }
+        ) : null
+      ] }) : /* @__PURE__ */ jsx(AssetAccessButtons, { asset, stacked: compact })
+    ] }),
     myBid ? /* @__PURE__ */ jsxs("div", { className: "rounded-xl bg-amber-500/8 px-4 py-3 flex items-center justify-between gap-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex items-center gap-2.5", children: [
         /* @__PURE__ */ jsx(HandCoins, { className: "h-4 w-4 text-amber-500 shrink-0" }),
@@ -223,7 +221,7 @@ function AssetMarketplacePanel({
         )
       ] }, bid.orderHash)) })
     ] }) : null,
-    isSignedIn ? /* @__PURE__ */ jsx(CompanionAppCard, { asset }) : null
+    isSignedIn ? /* @__PURE__ */ jsx(CompanionAppButton, { asset }) : null
   ] }) });
 }
 export {