@medialane/ui 0.56.0 → 0.57.1

package/dist/components/asset-card.cjs

@@ -58,7 +58,6 @@ function AssetCard({
   const [imgError, setImgError] = (0, import_react.useState)(false);
   const resolved = image ? (0, import_ipfs.ipfsToHttp)(image) : null;
   const hasPrice = !!price?.formatted;
-  const showFooter = !!ipType || hasPrice;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
     "div",
     {
@@ -67,7 +66,7 @@ function AssetCard({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href, className: "block", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative aspect-square bg-muted overflow-hidden", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_link.default, { href, className: "block p-1.5 pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative aspect-[4/5] rounded-[12px] bg-muted overflow-hidden ring-1 ring-border/50", children: [
           resolved && !imgError ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             import_image.default,
             {
@@ -79,10 +78,14 @@ function AssetCard({
               className: "object-cover transition-transform duration-500 group-hover:scale-105",
               onError: () => setImgError(true)
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-2xl font-mono text-muted-foreground", children: [
+          ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-sm font-semibold text-muted-foreground tabular-nums", children: [
             "#",
             fallbackId ?? "?"
           ] }) }),
+          hasPrice && !indexing && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "absolute bottom-2 right-2 inline-flex items-center gap-1 text-xs font-bold text-white/95 backdrop-blur-md bg-black/40 rounded-full px-2.5 py-1 tabular-nums", children: [
+            price.currency && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: price.currency, size: 12 }),
+            (0, import_format.formatDisplayPrice)(price.formatted)
+          ] }),
           indexing && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5", children: [
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Loader2, { className: "h-3 w-3 animate-spin text-white/70" }),
             /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-[10px] text-white/70", children: "Indexing\u2026" })
@@ -90,16 +93,17 @@ function AssetCard({
         ] }) }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex flex-col gap-1.5 px-3 py-3", children: [
           /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href, className: "block min-w-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-bold line-clamp-1 leading-snug", children: name }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              "p",
+              {
+                className: "text-[15px] font-bold line-clamp-1 leading-snug",
+                style: { fontFamily: "var(--font-display, inherit)" },
+                children: name
+              }
+            ),
             subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-muted-foreground line-clamp-1 leading-snug", children: subtitle })
           ] }),
-          showFooter && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-            ipType ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "sm", baseUrl: ipTypeBaseUrl }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {}),
-            hasPrice && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex shrink-0 items-center gap-1 text-sm font-bold leading-none", children: [
-              price.currency && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: price.currency, size: 12 }),
-              (0, import_format.formatDisplayPrice)(price.formatted)
-            ] })
-          ] })
+          ipType && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "sm", baseUrl: ipTypeBaseUrl }) })
         ] })
       ]
     }
@@ -107,7 +111,7 @@ function AssetCard({
 }
 function AssetCardSkeleton() {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "card-base flex flex-col w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "aspect-square w-full animate-pulse bg-muted" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "p-1.5 pb-0", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "aspect-[4/5] w-full animate-pulse bg-muted rounded-[12px]" }) }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-3 py-3 space-y-1.5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-4 w-3/4 rounded-md animate-pulse bg-muted" }),
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-3.5 w-2/5 rounded-md animate-pulse bg-muted" })

package/dist/components/asset-card.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport Image from \"next/image\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\n\nexport interface AssetCardPrice {\n  formatted?: string | null;\n  currency?: string | null;\n}\n\nexport interface AssetCardProps {\n  /** Asset detail link. */\n  href: string;\n  /** Asset title. */\n  name: string;\n  /** Raw image (ipfs:// or http) — resolved internally. */\n  image?: string | null;\n  /** Secondary line under the title (collection or description). */\n  subtitle?: string | null;\n  /** IP type (apiValue or label) — renders the icon badge on the footer left. */\n  ipType?: string | null;\n  /** Listing price; omit/null shows no price. */\n  price?: AssetCardPrice | null;\n  /** Shown when the image is missing/errors (e.g. token id). */\n  fallbackId?: string | null;\n  /** Show the \"Indexing…\" overlay. */\n  indexing?: boolean;\n  /** Base URL for the ipType badge link. Default \"\" (relative). */\n  ipTypeBaseUrl?: string;\n  className?: string;\n}\n\n/**\n * The platform's shared asset card — lean and presentational.\n *\n * Intentionally has no action buttons, dropdowns or dialogs: the image and\n * text are the only interactive surface (a single asset link), which keeps\n * browse grids and carousels fast even when many cards render. Surfaces that\n * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.\n *\n * Layout: square image → title → optional subtitle → footer row with the\n * (optional) ipType icon on the left and the (optional) price on the right.\n */\nexport function AssetCard({\n  href,\n  name,\n  image,\n  subtitle,\n  ipType,\n  price,\n  fallbackId,\n  indexing = false,\n  ipTypeBaseUrl = \"\",\n  className,\n}: AssetCardProps) {\n  const [imgError, setImgError] = useState(false);\n  const resolved = image ? ipfsToHttp(image) : null;\n  const hasPrice = !!price?.formatted;\n  const showFooter = !!ipType || hasPrice;\n\n  return (\n    <div\n      className={cn(\n        \"card-base group relative flex flex-col w-full transition-colors hover:border-foreground/20\",\n        className\n      )}\n    >\n      {/* Image */}\n      <Link href={href} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden\">\n          {resolved && !imgError ? (\n            <Image\n              src={resolved}\n              alt={name}\n              fill\n              unoptimized\n              sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n              className=\"object-cover transition-transform duration-500 group-hover:scale-105\"\n              onError={() => setImgError(true)}\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n              <span className=\"text-2xl font-mono text-muted-foreground\">\n                #{fallbackId ?? \"?\"}\n              </span>\n            </div>\n          )}\n\n          {indexing && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n      </Link>\n\n      {/* Body */}\n      <div className=\"flex flex-col gap-1.5 px-3 py-3\">\n        <Link href={href} className=\"block min-w-0\">\n          <p className=\"text-sm font-bold line-clamp-1 leading-snug\">{name}</p>\n          {subtitle && (\n            <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n              {subtitle}\n            </p>\n          )}\n        </Link>\n\n        {showFooter && (\n          <div className=\"flex items-center justify-between gap-2\">\n            {ipType ? (\n              <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n            ) : (\n              <span />\n            )}\n            {hasPrice && (\n              <span className=\"inline-flex shrink-0 items-center gap-1 text-sm font-bold leading-none\">\n                {price!.currency && <CurrencyIcon symbol={price!.currency} size={12} />}\n                {formatDisplayPrice(price!.formatted!)}\n              </span>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport function AssetCardSkeleton() {\n  return (\n    <div className=\"card-base flex flex-col w-full\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 py-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA8EY;AA5EZ,mBAAyB;AACzB,kBAAiB;AACjB,mBAAkB;AAClB,0BAAwB;AACxB,gBAAmB;AACnB,kBAA2B;AAC3B,oBAAmC;AACnC,2BAA6B;AAC7B,2BAA4B;AAwCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,WAAW,YAAQ,wBAAW,KAAK,IAAI;AAC7C,QAAM,WAAW,CAAC,CAAC,OAAO;AAC1B,QAAM,aAAa,CAAC,CAAC,UAAU;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGA;AAAA,oDAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,SAC1B,uDAAC,SAAI,WAAU,mDACZ;AAAA,sBAAY,CAAC,WACZ;AAAA,YAAC,aAAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAI;AAAA,cACJ,aAAW;AAAA,cACX,OAAM;AAAA,cACN,WAAU;AAAA,cACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,UACjC,IAEA,4CAAC,SAAI,WAAU,6GACb,uDAAC,UAAK,WAAU,4CAA2C;AAAA;AAAA,YACvD,cAAc;AAAA,aAClB,GACF;AAAA,UAGD,YACC,6CAAC,SAAI,WAAU,4GACb;AAAA,wDAAC,+BAAQ,WAAU,sCAAqC;AAAA,YACxD,4CAAC,UAAK,WAAU,6BAA4B,4BAAS;AAAA,aACvD;AAAA,WAEJ,GACF;AAAA,QAGA,6CAAC,SAAI,WAAU,mCACb;AAAA,uDAAC,YAAAD,SAAA,EAAK,MAAY,WAAU,iBAC1B;AAAA,wDAAC,OAAE,WAAU,+CAA+C,gBAAK;AAAA,YAChE,YACC,4CAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,cACC,6CAAC,SAAI,WAAU,2CACZ;AAAA,qBACC,4CAAC,oCAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,IAE/D,4CAAC,UAAK;AAAA,YAEP,YACC,6CAAC,UAAK,WAAU,0EACb;AAAA,oBAAO,YAAY,4CAAC,qCAAa,QAAQ,MAAO,UAAU,MAAM,IAAI;AAAA,kBACpE,kCAAmB,MAAO,SAAU;AAAA,eACvC;AAAA,aAEJ;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,6CAAC,SAAI,WAAU,kCACb;AAAA,gDAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,6CAAC,SAAI,WAAU,yBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":["Link","Image"]}
+{"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport Image from \"next/image\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\n\nexport interface AssetCardPrice {\n  formatted?: string | null;\n  currency?: string | null;\n}\n\nexport interface AssetCardProps {\n  /** Asset detail link. */\n  href: string;\n  /** Asset title. */\n  name: string;\n  /** Raw image (ipfs:// or http) — resolved internally. */\n  image?: string | null;\n  /** Secondary line under the title (collection or description). */\n  subtitle?: string | null;\n  /** IP type (apiValue or label) — renders the icon badge on the footer left. */\n  ipType?: string | null;\n  /** Listing price; omit/null shows no price. */\n  price?: AssetCardPrice | null;\n  /** Shown when the image is missing/errors (e.g. token id). */\n  fallbackId?: string | null;\n  /** Show the \"Indexing…\" overlay. */\n  indexing?: boolean;\n  /** Base URL for the ipType badge link. Default \"\" (relative). */\n  ipTypeBaseUrl?: string;\n  className?: string;\n}\n\n/**\n * The platform's shared asset card — lean and presentational.\n *\n * Intentionally has no action buttons, dropdowns or dialogs: the image and\n * text are the only interactive surface (a single asset link), which keeps\n * browse grids and carousels fast even when many cards render. Surfaces that\n * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.\n *\n * Layout: inset 4:5 artwork (gallery ratio, echoing the Medialane Collection\n * Card) with the price as a glass pill on the artwork (the collection cards'\n * Floor-pill vocabulary) → display-face title → optional subtitle → optional\n * ipType badge.\n */\nexport function AssetCard({\n  href,\n  name,\n  image,\n  subtitle,\n  ipType,\n  price,\n  fallbackId,\n  indexing = false,\n  ipTypeBaseUrl = \"\",\n  className,\n}: AssetCardProps) {\n  const [imgError, setImgError] = useState(false);\n  const resolved = image ? ipfsToHttp(image) : null;\n  const hasPrice = !!price?.formatted;\n\n  return (\n    <div\n      className={cn(\n        \"card-base group relative flex flex-col w-full transition-colors hover:border-foreground/20\",\n        className\n      )}\n    >\n      {/* Artwork — inset with a gallery 4:5 ratio, like the Collection Card */}\n      <Link href={href} className=\"block p-1.5 pb-0\">\n        <div className=\"relative aspect-[4/5] rounded-[12px] bg-muted overflow-hidden ring-1 ring-border/50\">\n          {resolved && !imgError ? (\n            <Image\n              src={resolved}\n              alt={name}\n              fill\n              unoptimized\n              sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n              className=\"object-cover transition-transform duration-500 group-hover:scale-105\"\n              onError={() => setImgError(true)}\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n              <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n                #{fallbackId ?? \"?\"}\n              </span>\n            </div>\n          )}\n\n          {/* Price pill — anchored on the artwork, same glass chip as the\n              collection cards' Floor pill */}\n          {hasPrice && !indexing && (\n            <span className=\"absolute bottom-2 right-2 inline-flex items-center gap-1 text-xs font-bold text-white/95 backdrop-blur-md bg-black/40 rounded-full px-2.5 py-1 tabular-nums\">\n              {price!.currency && <CurrencyIcon symbol={price!.currency} size={12} />}\n              {formatDisplayPrice(price!.formatted!)}\n            </span>\n          )}\n\n          {indexing && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n      </Link>\n\n      {/* Body */}\n      <div className=\"flex flex-col gap-1.5 px-3 py-3\">\n        <Link href={href} className=\"block min-w-0\">\n          <p\n            className=\"text-[15px] font-bold line-clamp-1 leading-snug\"\n            style={{ fontFamily: \"var(--font-display, inherit)\" }}\n          >\n            {name}\n          </p>\n          {subtitle && (\n            <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n              {subtitle}\n            </p>\n          )}\n        </Link>\n\n        {ipType && (\n          <div className=\"flex items-center\">\n            <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport function AssetCardSkeleton() {\n  return (\n    <div className=\"card-base flex flex-col w-full\">\n      <div className=\"p-1.5 pb-0\">\n        <div className=\"aspect-[4/5] w-full animate-pulse bg-muted rounded-[12px]\" />\n      </div>\n      <div className=\"px-3 py-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA+EY;AA7EZ,mBAAyB;AACzB,kBAAiB;AACjB,mBAAkB;AAClB,0BAAwB;AACxB,gBAAmB;AACnB,kBAA2B;AAC3B,oBAAmC;AACnC,2BAA6B;AAC7B,2BAA4B;AA0CrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,WAAW,YAAQ,wBAAW,KAAK,IAAI;AAC7C,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGA;AAAA,oDAAC,YAAAA,SAAA,EAAK,MAAY,WAAU,oBAC1B,uDAAC,SAAI,WAAU,uFACZ;AAAA,sBAAY,CAAC,WACZ;AAAA,YAAC,aAAAC;AAAA,YAAA;AAAA,cACC,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAI;AAAA,cACJ,aAAW;AAAA,cACX,OAAM;AAAA,cACN,WAAU;AAAA,cACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,UACjC,IAEA,4CAAC,SAAI,WAAU,+HACb,uDAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,YACvE,cAAc;AAAA,aAClB,GACF;AAAA,UAKD,YAAY,CAAC,YACZ,6CAAC,UAAK,WAAU,+JACb;AAAA,kBAAO,YAAY,4CAAC,qCAAa,QAAQ,MAAO,UAAU,MAAM,IAAI;AAAA,gBACpE,kCAAmB,MAAO,SAAU;AAAA,aACvC;AAAA,UAGD,YACC,6CAAC,SAAI,WAAU,4GACb;AAAA,wDAAC,+BAAQ,WAAU,sCAAqC;AAAA,YACxD,4CAAC,UAAK,WAAU,6BAA4B,4BAAS;AAAA,aACvD;AAAA,WAEJ,GACF;AAAA,QAGA,6CAAC,SAAI,WAAU,mCACb;AAAA,uDAAC,YAAAD,SAAA,EAAK,MAAY,WAAU,iBAC1B;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO,EAAE,YAAY,+BAA+B;AAAA,gBAEnD;AAAA;AAAA,YACH;AAAA,YACC,YACC,4CAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,UACC,4CAAC,SAAI,WAAU,qBACb,sDAAC,oCAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,6CAAC,SAAI,WAAU,kCACb;AAAA,gDAAC,SAAI,WAAU,cACb,sDAAC,SAAI,WAAU,6DAA4D,GAC7E;AAAA,IACA,6CAAC,SAAI,WAAU,yBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":["Link","Image"]}

package/dist/components/asset-card.d.cts

@@ -33,8 +33,10 @@ interface AssetCardProps {
  * browse grids and carousels fast even when many cards render. Surfaces that
  * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.
  *
- * Layout: square image → title → optional subtitle → footer row with the
- * (optional) ipType icon on the left and the (optional) price on the right.
+ * Layout: inset 4:5 artwork (gallery ratio, echoing the Medialane Collection
+ * Card) with the price as a glass pill on the artwork (the collection cards'
+ * Floor-pill vocabulary) → display-face title → optional subtitle → optional
+ * ipType badge.
  */
 declare function AssetCard({ href, name, image, subtitle, ipType, price, fallbackId, indexing, ipTypeBaseUrl, className, }: AssetCardProps): react_jsx_runtime.JSX.Element;
 declare function AssetCardSkeleton(): react_jsx_runtime.JSX.Element;

package/dist/components/asset-card.d.ts

@@ -33,8 +33,10 @@ interface AssetCardProps {
  * browse grids and carousels fast even when many cards render. Surfaces that
  * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.
  *
- * Layout: square image → title → optional subtitle → footer row with the
- * (optional) ipType icon on the left and the (optional) price on the right.
+ * Layout: inset 4:5 artwork (gallery ratio, echoing the Medialane Collection
+ * Card) with the price as a glass pill on the artwork (the collection cards'
+ * Floor-pill vocabulary) → display-face title → optional subtitle → optional
+ * ipType badge.
  */
 declare function AssetCard({ href, name, image, subtitle, ipType, price, fallbackId, indexing, ipTypeBaseUrl, className, }: AssetCardProps): react_jsx_runtime.JSX.Element;
 declare function AssetCardSkeleton(): react_jsx_runtime.JSX.Element;

package/dist/components/asset-card.js

@@ -24,7 +24,6 @@ function AssetCard({
   const [imgError, setImgError] = useState(false);
   const resolved = image ? ipfsToHttp(image) : null;
   const hasPrice = !!price?.formatted;
-  const showFooter = !!ipType || hasPrice;
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -33,7 +32,7 @@ function AssetCard({
         className
       ),
       children: [
-        /* @__PURE__ */ jsx(Link, { href, className: "block", children: /* @__PURE__ */ jsxs("div", { className: "relative aspect-square bg-muted overflow-hidden", children: [
+        /* @__PURE__ */ jsx(Link, { href, className: "block p-1.5 pb-0", children: /* @__PURE__ */ jsxs("div", { className: "relative aspect-[4/5] rounded-[12px] bg-muted overflow-hidden ring-1 ring-border/50", children: [
           resolved && !imgError ? /* @__PURE__ */ jsx(
             Image,
             {
@@ -45,10 +44,14 @@ function AssetCard({
               className: "object-cover transition-transform duration-500 group-hover:scale-105",
               onError: () => setImgError(true)
             }
-          ) : /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15", children: /* @__PURE__ */ jsxs("span", { className: "text-2xl font-mono text-muted-foreground", children: [
+          ) : /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25", children: /* @__PURE__ */ jsxs("span", { className: "text-sm font-semibold text-muted-foreground tabular-nums", children: [
             "#",
             fallbackId ?? "?"
           ] }) }),
+          hasPrice && !indexing && /* @__PURE__ */ jsxs("span", { className: "absolute bottom-2 right-2 inline-flex items-center gap-1 text-xs font-bold text-white/95 backdrop-blur-md bg-black/40 rounded-full px-2.5 py-1 tabular-nums", children: [
+            price.currency && /* @__PURE__ */ jsx(CurrencyIcon, { symbol: price.currency, size: 12 }),
+            formatDisplayPrice(price.formatted)
+          ] }),
           indexing && /* @__PURE__ */ jsxs("div", { className: "absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5", children: [
             /* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin text-white/70" }),
             /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/70", children: "Indexing\u2026" })
@@ -56,16 +59,17 @@ function AssetCard({
         ] }) }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5 px-3 py-3", children: [
           /* @__PURE__ */ jsxs(Link, { href, className: "block min-w-0", children: [
-            /* @__PURE__ */ jsx("p", { className: "text-sm font-bold line-clamp-1 leading-snug", children: name }),
+            /* @__PURE__ */ jsx(
+              "p",
+              {
+                className: "text-[15px] font-bold line-clamp-1 leading-snug",
+                style: { fontFamily: "var(--font-display, inherit)" },
+                children: name
+              }
+            ),
             subtitle && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground line-clamp-1 leading-snug", children: subtitle })
           ] }),
-          showFooter && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
-            ipType ? /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm", baseUrl: ipTypeBaseUrl }) : /* @__PURE__ */ jsx("span", {}),
-            hasPrice && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1 text-sm font-bold leading-none", children: [
-              price.currency && /* @__PURE__ */ jsx(CurrencyIcon, { symbol: price.currency, size: 12 }),
-              formatDisplayPrice(price.formatted)
-            ] })
-          ] })
+          ipType && /* @__PURE__ */ jsx("div", { className: "flex items-center", children: /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm", baseUrl: ipTypeBaseUrl }) })
         ] })
       ]
     }
@@ -73,7 +77,7 @@ function AssetCard({
 }
 function AssetCardSkeleton() {
   return /* @__PURE__ */ jsxs("div", { className: "card-base flex flex-col w-full", children: [
-    /* @__PURE__ */ jsx("div", { className: "aspect-square w-full animate-pulse bg-muted" }),
+    /* @__PURE__ */ jsx("div", { className: "p-1.5 pb-0", children: /* @__PURE__ */ jsx("div", { className: "aspect-[4/5] w-full animate-pulse bg-muted rounded-[12px]" }) }),
     /* @__PURE__ */ jsxs("div", { className: "px-3 py-3 space-y-1.5", children: [
       /* @__PURE__ */ jsx("div", { className: "h-4 w-3/4 rounded-md animate-pulse bg-muted" }),
       /* @__PURE__ */ jsx("div", { className: "h-3.5 w-2/5 rounded-md animate-pulse bg-muted" })

package/dist/components/asset-card.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport Image from \"next/image\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\n\nexport interface AssetCardPrice {\n  formatted?: string | null;\n  currency?: string | null;\n}\n\nexport interface AssetCardProps {\n  /** Asset detail link. */\n  href: string;\n  /** Asset title. */\n  name: string;\n  /** Raw image (ipfs:// or http) — resolved internally. */\n  image?: string | null;\n  /** Secondary line under the title (collection or description). */\n  subtitle?: string | null;\n  /** IP type (apiValue or label) — renders the icon badge on the footer left. */\n  ipType?: string | null;\n  /** Listing price; omit/null shows no price. */\n  price?: AssetCardPrice | null;\n  /** Shown when the image is missing/errors (e.g. token id). */\n  fallbackId?: string | null;\n  /** Show the \"Indexing…\" overlay. */\n  indexing?: boolean;\n  /** Base URL for the ipType badge link. Default \"\" (relative). */\n  ipTypeBaseUrl?: string;\n  className?: string;\n}\n\n/**\n * The platform's shared asset card — lean and presentational.\n *\n * Intentionally has no action buttons, dropdowns or dialogs: the image and\n * text are the only interactive surface (a single asset link), which keeps\n * browse grids and carousels fast even when many cards render. Surfaces that\n * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.\n *\n * Layout: square image → title → optional subtitle → footer row with the\n * (optional) ipType icon on the left and the (optional) price on the right.\n */\nexport function AssetCard({\n  href,\n  name,\n  image,\n  subtitle,\n  ipType,\n  price,\n  fallbackId,\n  indexing = false,\n  ipTypeBaseUrl = \"\",\n  className,\n}: AssetCardProps) {\n  const [imgError, setImgError] = useState(false);\n  const resolved = image ? ipfsToHttp(image) : null;\n  const hasPrice = !!price?.formatted;\n  const showFooter = !!ipType || hasPrice;\n\n  return (\n    <div\n      className={cn(\n        \"card-base group relative flex flex-col w-full transition-colors hover:border-foreground/20\",\n        className\n      )}\n    >\n      {/* Image */}\n      <Link href={href} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden\">\n          {resolved && !imgError ? (\n            <Image\n              src={resolved}\n              alt={name}\n              fill\n              unoptimized\n              sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n              className=\"object-cover transition-transform duration-500 group-hover:scale-105\"\n              onError={() => setImgError(true)}\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n              <span className=\"text-2xl font-mono text-muted-foreground\">\n                #{fallbackId ?? \"?\"}\n              </span>\n            </div>\n          )}\n\n          {indexing && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n      </Link>\n\n      {/* Body */}\n      <div className=\"flex flex-col gap-1.5 px-3 py-3\">\n        <Link href={href} className=\"block min-w-0\">\n          <p className=\"text-sm font-bold line-clamp-1 leading-snug\">{name}</p>\n          {subtitle && (\n            <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n              {subtitle}\n            </p>\n          )}\n        </Link>\n\n        {showFooter && (\n          <div className=\"flex items-center justify-between gap-2\">\n            {ipType ? (\n              <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n            ) : (\n              <span />\n            )}\n            {hasPrice && (\n              <span className=\"inline-flex shrink-0 items-center gap-1 text-sm font-bold leading-none\">\n                {price!.currency && <CurrencyIcon symbol={price!.currency} size={12} />}\n                {formatDisplayPrice(price!.formatted!)}\n              </span>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport function AssetCardSkeleton() {\n  return (\n    <div className=\"card-base flex flex-col w-full\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 py-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA8EY,cAWE,YAXF;AA5EZ,SAAS,gBAAgB;AACzB,OAAO,UAAU;AACjB,OAAO,WAAW;AAClB,SAAS,eAAe;AACxB,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAC3B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAwCrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,QAAQ,WAAW,KAAK,IAAI;AAC7C,QAAM,WAAW,CAAC,CAAC,OAAO;AAC1B,QAAM,aAAa,CAAC,CAAC,UAAU;AAE/B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGA;AAAA,4BAAC,QAAK,MAAY,WAAU,SAC1B,+BAAC,SAAI,WAAU,mDACZ;AAAA,sBAAY,CAAC,WACZ;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAI;AAAA,cACJ,aAAW;AAAA,cACX,OAAM;AAAA,cACN,WAAU;AAAA,cACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,UACjC,IAEA,oBAAC,SAAI,WAAU,6GACb,+BAAC,UAAK,WAAU,4CAA2C;AAAA;AAAA,YACvD,cAAc;AAAA,aAClB,GACF;AAAA,UAGD,YACC,qBAAC,SAAI,WAAU,4GACb;AAAA,gCAAC,WAAQ,WAAU,sCAAqC;AAAA,YACxD,oBAAC,UAAK,WAAU,6BAA4B,4BAAS;AAAA,aACvD;AAAA,WAEJ,GACF;AAAA,QAGA,qBAAC,SAAI,WAAU,mCACb;AAAA,+BAAC,QAAK,MAAY,WAAU,iBAC1B;AAAA,gCAAC,OAAE,WAAU,+CAA+C,gBAAK;AAAA,YAChE,YACC,oBAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,cACC,qBAAC,SAAI,WAAU,2CACZ;AAAA,qBACC,oBAAC,eAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,IAE/D,oBAAC,UAAK;AAAA,YAEP,YACC,qBAAC,UAAK,WAAU,0EACb;AAAA,oBAAO,YAAY,oBAAC,gBAAa,QAAQ,MAAO,UAAU,MAAM,IAAI;AAAA,cACpE,mBAAmB,MAAO,SAAU;AAAA,eACvC;AAAA,aAEJ;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,qBAAC,SAAI,WAAU,kCACb;AAAA,wBAAC,SAAI,WAAU,+CAA8C;AAAA,IAC7D,qBAAC,SAAI,WAAU,yBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/asset-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"next/link\";\nimport Image from \"next/image\";\nimport { Loader2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\n\nexport interface AssetCardPrice {\n  formatted?: string | null;\n  currency?: string | null;\n}\n\nexport interface AssetCardProps {\n  /** Asset detail link. */\n  href: string;\n  /** Asset title. */\n  name: string;\n  /** Raw image (ipfs:// or http) — resolved internally. */\n  image?: string | null;\n  /** Secondary line under the title (collection or description). */\n  subtitle?: string | null;\n  /** IP type (apiValue or label) — renders the icon badge on the footer left. */\n  ipType?: string | null;\n  /** Listing price; omit/null shows no price. */\n  price?: AssetCardPrice | null;\n  /** Shown when the image is missing/errors (e.g. token id). */\n  fallbackId?: string | null;\n  /** Show the \"Indexing…\" overlay. */\n  indexing?: boolean;\n  /** Base URL for the ipType badge link. Default \"\" (relative). */\n  ipTypeBaseUrl?: string;\n  className?: string;\n}\n\n/**\n * The platform's shared asset card — lean and presentational.\n *\n * Intentionally has no action buttons, dropdowns or dialogs: the image and\n * text are the only interactive surface (a single asset link), which keeps\n * browse grids and carousels fast even when many cards render. Surfaces that\n * need owner/marketplace actions use the richer `TokenCard` / `ListingCard`.\n *\n * Layout: inset 4:5 artwork (gallery ratio, echoing the Medialane Collection\n * Card) with the price as a glass pill on the artwork (the collection cards'\n * Floor-pill vocabulary) → display-face title → optional subtitle → optional\n * ipType badge.\n */\nexport function AssetCard({\n  href,\n  name,\n  image,\n  subtitle,\n  ipType,\n  price,\n  fallbackId,\n  indexing = false,\n  ipTypeBaseUrl = \"\",\n  className,\n}: AssetCardProps) {\n  const [imgError, setImgError] = useState(false);\n  const resolved = image ? ipfsToHttp(image) : null;\n  const hasPrice = !!price?.formatted;\n\n  return (\n    <div\n      className={cn(\n        \"card-base group relative flex flex-col w-full transition-colors hover:border-foreground/20\",\n        className\n      )}\n    >\n      {/* Artwork — inset with a gallery 4:5 ratio, like the Collection Card */}\n      <Link href={href} className=\"block p-1.5 pb-0\">\n        <div className=\"relative aspect-[4/5] rounded-[12px] bg-muted overflow-hidden ring-1 ring-border/50\">\n          {resolved && !imgError ? (\n            <Image\n              src={resolved}\n              alt={name}\n              fill\n              unoptimized\n              sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n              className=\"object-cover transition-transform duration-500 group-hover:scale-105\"\n              onError={() => setImgError(true)}\n            />\n          ) : (\n            <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-blue/25 via-brand-purple/25 to-brand-rose/25\">\n              <span className=\"text-sm font-semibold text-muted-foreground tabular-nums\">\n                #{fallbackId ?? \"?\"}\n              </span>\n            </div>\n          )}\n\n          {/* Price pill — anchored on the artwork, same glass chip as the\n              collection cards' Floor pill */}\n          {hasPrice && !indexing && (\n            <span className=\"absolute bottom-2 right-2 inline-flex items-center gap-1 text-xs font-bold text-white/95 backdrop-blur-md bg-black/40 rounded-full px-2.5 py-1 tabular-nums\">\n              {price!.currency && <CurrencyIcon symbol={price!.currency} size={12} />}\n              {formatDisplayPrice(price!.formatted!)}\n            </span>\n          )}\n\n          {indexing && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n      </Link>\n\n      {/* Body */}\n      <div className=\"flex flex-col gap-1.5 px-3 py-3\">\n        <Link href={href} className=\"block min-w-0\">\n          <p\n            className=\"text-[15px] font-bold line-clamp-1 leading-snug\"\n            style={{ fontFamily: \"var(--font-display, inherit)\" }}\n          >\n            {name}\n          </p>\n          {subtitle && (\n            <p className=\"text-xs text-muted-foreground line-clamp-1 leading-snug\">\n              {subtitle}\n            </p>\n          )}\n        </Link>\n\n        {ipType && (\n          <div className=\"flex items-center\">\n            <IpTypeBadge ipType={ipType} size=\"sm\" baseUrl={ipTypeBaseUrl} />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\nexport function AssetCardSkeleton() {\n  return (\n    <div className=\"card-base flex flex-col w-full\">\n      <div className=\"p-1.5 pb-0\">\n        <div className=\"aspect-[4/5] w-full animate-pulse bg-muted rounded-[12px]\" />\n      </div>\n      <div className=\"px-3 py-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-3.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA+EY,cAWE,YAXF;AA7EZ,SAAS,gBAAgB;AACzB,OAAO,UAAU;AACjB,OAAO,WAAW;AAClB,SAAS,eAAe;AACxB,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAC3B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AA0CrB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,gBAAgB;AAAA,EAChB;AACF,GAAmB;AACjB,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,QAAQ,WAAW,KAAK,IAAI;AAC7C,QAAM,WAAW,CAAC,CAAC,OAAO;AAE1B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MACF;AAAA,MAGA;AAAA,4BAAC,QAAK,MAAY,WAAU,oBAC1B,+BAAC,SAAI,WAAU,uFACZ;AAAA,sBAAY,CAAC,WACZ;AAAA,YAAC;AAAA;AAAA,cACC,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAI;AAAA,cACJ,aAAW;AAAA,cACX,OAAM;AAAA,cACN,WAAU;AAAA,cACV,SAAS,MAAM,YAAY,IAAI;AAAA;AAAA,UACjC,IAEA,oBAAC,SAAI,WAAU,+HACb,+BAAC,UAAK,WAAU,4DAA2D;AAAA;AAAA,YACvE,cAAc;AAAA,aAClB,GACF;AAAA,UAKD,YAAY,CAAC,YACZ,qBAAC,UAAK,WAAU,+JACb;AAAA,kBAAO,YAAY,oBAAC,gBAAa,QAAQ,MAAO,UAAU,MAAM,IAAI;AAAA,YACpE,mBAAmB,MAAO,SAAU;AAAA,aACvC;AAAA,UAGD,YACC,qBAAC,SAAI,WAAU,4GACb;AAAA,gCAAC,WAAQ,WAAU,sCAAqC;AAAA,YACxD,oBAAC,UAAK,WAAU,6BAA4B,4BAAS;AAAA,aACvD;AAAA,WAEJ,GACF;AAAA,QAGA,qBAAC,SAAI,WAAU,mCACb;AAAA,+BAAC,QAAK,MAAY,WAAU,iBAC1B;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,WAAU;AAAA,gBACV,OAAO,EAAE,YAAY,+BAA+B;AAAA,gBAEnD;AAAA;AAAA,YACH;AAAA,YACC,YACC,oBAAC,OAAE,WAAU,2DACV,oBACH;AAAA,aAEJ;AAAA,UAEC,UACC,oBAAC,SAAI,WAAU,qBACb,8BAAC,eAAY,QAAgB,MAAK,MAAK,SAAS,eAAe,GACjE;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,oBAAoB;AAClC,SACE,qBAAC,SAAI,WAAU,kCACb;AAAA,wBAAC,SAAI,WAAU,cACb,8BAAC,SAAI,WAAU,6DAA4D,GAC7E;AAAA,IACA,qBAAC,SAAI,WAAU,yBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,iDAAgD;AAAA,OACjE;AAAA,KACF;AAEJ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@medialane/ui",
-  "version": "0.56.0",
+  "version": "0.57.1",
   "description": "Shared UI components for Medialane apps",
   "type": "module",
   "main": "./dist/index.cjs",