@medialane/ui 0.323.0 → 0.324.0

package/dist/components/button.d.cts

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
     size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/button.d.ts

@@ -3,7 +3,7 @@ import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
 
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "link" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
     size?: "default" | "icon" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {

package/dist/components/currency-icon.cjs

@@ -30,7 +30,8 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var currency_icon_exports = {};
 __export(currency_icon_exports, {
   CurrencyAmount: () => CurrencyAmount,
-  CurrencyIcon: () => CurrencyIcon
+  CurrencyIcon: () => CurrencyIcon,
+  hasCurrencyIcon: () => hasCurrencyIcon
 });
 module.exports = __toCommonJS(currency_icon_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -43,6 +44,9 @@ const CURRENCY_ICON_PATHS = {
   STRK: "/strk.svg",
   WBTC: "/btc.svg"
 };
+function hasCurrencyIcon(symbol) {
+  return !!symbol && symbol in CURRENCY_ICON_PATHS;
+}
 function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = "" }) {
   const path = symbol ? CURRENCY_ICON_PATHS[symbol] : void 0;
   if (!path) return null;
@@ -74,6 +78,7 @@ function CurrencyAmount({
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CurrencyAmount,
-  CurrencyIcon
+  CurrencyIcon,
+  hasCurrencyIcon
 });
 //# sourceMappingURL=currency-icon.cjs.map

package/dist/components/currency-icon.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/currency-icon.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CURRENCY_ICON_PATHS: Record<string, string> = {\n  USDC: \"/usdc.svg\",\n  USDT: \"/usdt.svg\",\n  ETH: \"/eth.svg\",\n  STRK: \"/strk.svg\",\n  WBTC: \"/btc.svg\",\n};\n\nexport interface CurrencyIconProps {\n  symbol: string | null | undefined;\n  size?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = \"\" }: CurrencyIconProps) {\n  const path = symbol ? CURRENCY_ICON_PATHS[symbol] : undefined;\n  if (!path) return null;\n  return (\n    <Image\n      src={`${iconsBasePath}${path}`}\n      alt={symbol ?? \"\"}\n      width={size}\n      height={size}\n      className={cn(\"inline-block shrink-0\", className)}\n      unoptimized\n    />\n  );\n}\n\nexport interface CurrencyAmountProps {\n  amount: string;\n  symbol: string | null | undefined;\n  amountClassName?: string;\n  iconSize?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyAmount({\n  amount,\n  symbol,\n  amountClassName,\n  iconSize = 14,\n  className,\n  iconsBasePath,\n}: CurrencyAmountProps) {\n  return (\n    <span className={cn(\"inline-flex items-center gap-1\", className)}>\n      <CurrencyIcon symbol={symbol} size={iconSize} iconsBasePath={iconsBasePath} />\n      <span className={amountClassName}>{amount}</span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBI;AAvBJ,mBAAkB;AAClB,gBAAmB;AAEnB,MAAM,sBAA8C;AAAA,EAClD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AACR;AAUO,SAAS,aAAa,EAAE,QAAQ,OAAO,IAAI,WAAW,gBAAgB,GAAG,GAAsB;AACpG,QAAM,OAAO,SAAS,oBAAoB,MAAM,IAAI;AACpD,MAAI,CAAC,KAAM,QAAO;AAClB,SACE;AAAA,IAAC,aAAAA;AAAA,IAAA;AAAA,MACC,KAAK,GAAG,aAAa,GAAG,IAAI;AAAA,MAC5B,KAAK,UAAU;AAAA,MACf,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,eAAW,cAAG,yBAAyB,SAAS;AAAA,MAChD,aAAW;AAAA;AAAA,EACb;AAEJ;AAYO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAwB;AACtB,SACE,6CAAC,UAAK,eAAW,cAAG,kCAAkC,SAAS,GAC7D;AAAA,gDAAC,gBAAa,QAAgB,MAAM,UAAU,eAA8B;AAAA,IAC5E,4CAAC,UAAK,WAAW,iBAAkB,kBAAO;AAAA,KAC5C;AAEJ;","names":["Image"]}
+{"version":3,"sources":["../../src/components/currency-icon.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CURRENCY_ICON_PATHS: Record<string, string> = {\n  USDC: \"/usdc.svg\",\n  USDT: \"/usdt.svg\",\n  ETH: \"/eth.svg\",\n  STRK: \"/strk.svg\",\n  WBTC: \"/btc.svg\",\n};\n\nexport function hasCurrencyIcon(symbol: string | null | undefined): boolean {\n  return !!symbol && symbol in CURRENCY_ICON_PATHS;\n}\n\nexport interface CurrencyIconProps {\n  symbol: string | null | undefined;\n  size?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = \"\" }: CurrencyIconProps) {\n  const path = symbol ? CURRENCY_ICON_PATHS[symbol] : undefined;\n  if (!path) return null;\n  return (\n    <Image\n      src={`${iconsBasePath}${path}`}\n      alt={symbol ?? \"\"}\n      width={size}\n      height={size}\n      className={cn(\"inline-block shrink-0\", className)}\n      unoptimized\n    />\n  );\n}\n\nexport interface CurrencyAmountProps {\n  amount: string;\n  symbol: string | null | undefined;\n  amountClassName?: string;\n  iconSize?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyAmount({\n  amount,\n  symbol,\n  amountClassName,\n  iconSize = 14,\n  className,\n  iconsBasePath,\n}: CurrencyAmountProps) {\n  return (\n    <span className={cn(\"inline-flex items-center gap-1\", className)}>\n      <CurrencyIcon symbol={symbol} size={iconSize} iconsBasePath={iconsBasePath} />\n      <span className={amountClassName}>{amount}</span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA6BI;AA3BJ,mBAAkB;AAClB,gBAAmB;AAEnB,MAAM,sBAA8C;AAAA,EAClD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AACR;AAEO,SAAS,gBAAgB,QAA4C;AAC1E,SAAO,CAAC,CAAC,UAAU,UAAU;AAC/B;AAUO,SAAS,aAAa,EAAE,QAAQ,OAAO,IAAI,WAAW,gBAAgB,GAAG,GAAsB;AACpG,QAAM,OAAO,SAAS,oBAAoB,MAAM,IAAI;AACpD,MAAI,CAAC,KAAM,QAAO;AAClB,SACE;AAAA,IAAC,aAAAA;AAAA,IAAA;AAAA,MACC,KAAK,GAAG,aAAa,GAAG,IAAI;AAAA,MAC5B,KAAK,UAAU;AAAA,MACf,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,eAAW,cAAG,yBAAyB,SAAS;AAAA,MAChD,aAAW;AAAA;AAAA,EACb;AAEJ;AAYO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAwB;AACtB,SACE,6CAAC,UAAK,eAAW,cAAG,kCAAkC,SAAS,GAC7D;AAAA,gDAAC,gBAAa,QAAgB,MAAM,UAAU,eAA8B;AAAA,IAC5E,4CAAC,UAAK,WAAW,iBAAkB,kBAAO;AAAA,KAC5C;AAEJ;","names":["Image"]}

package/dist/components/currency-icon.d.cts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+declare function hasCurrencyIcon(symbol: string | null | undefined): boolean;
 interface CurrencyIconProps {
     symbol: string | null | undefined;
     size?: number;
@@ -17,4 +18,4 @@ interface CurrencyAmountProps {
 }
 declare function CurrencyAmount({ amount, symbol, amountClassName, iconSize, className, iconsBasePath, }: CurrencyAmountProps): react_jsx_runtime.JSX.Element;
 
-export { CurrencyAmount, type CurrencyAmountProps, CurrencyIcon, type CurrencyIconProps };
+export { CurrencyAmount, type CurrencyAmountProps, CurrencyIcon, type CurrencyIconProps, hasCurrencyIcon };

package/dist/components/currency-icon.d.ts

@@ -1,5 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+declare function hasCurrencyIcon(symbol: string | null | undefined): boolean;
 interface CurrencyIconProps {
     symbol: string | null | undefined;
     size?: number;
@@ -17,4 +18,4 @@ interface CurrencyAmountProps {
 }
 declare function CurrencyAmount({ amount, symbol, amountClassName, iconSize, className, iconsBasePath, }: CurrencyAmountProps): react_jsx_runtime.JSX.Element;
 
-export { CurrencyAmount, type CurrencyAmountProps, CurrencyIcon, type CurrencyIconProps };
+export { CurrencyAmount, type CurrencyAmountProps, CurrencyIcon, type CurrencyIconProps, hasCurrencyIcon };

package/dist/components/currency-icon.js

@@ -9,6 +9,9 @@ const CURRENCY_ICON_PATHS = {
   STRK: "/strk.svg",
   WBTC: "/btc.svg"
 };
+function hasCurrencyIcon(symbol) {
+  return !!symbol && symbol in CURRENCY_ICON_PATHS;
+}
 function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = "" }) {
   const path = symbol ? CURRENCY_ICON_PATHS[symbol] : void 0;
   if (!path) return null;
@@ -39,6 +42,7 @@ function CurrencyAmount({
 }
 export {
   CurrencyAmount,
-  CurrencyIcon
+  CurrencyIcon,
+  hasCurrencyIcon
 };
 //# sourceMappingURL=currency-icon.js.map

package/dist/components/currency-icon.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/currency-icon.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CURRENCY_ICON_PATHS: Record<string, string> = {\n  USDC: \"/usdc.svg\",\n  USDT: \"/usdt.svg\",\n  ETH: \"/eth.svg\",\n  STRK: \"/strk.svg\",\n  WBTC: \"/btc.svg\",\n};\n\nexport interface CurrencyIconProps {\n  symbol: string | null | undefined;\n  size?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = \"\" }: CurrencyIconProps) {\n  const path = symbol ? CURRENCY_ICON_PATHS[symbol] : undefined;\n  if (!path) return null;\n  return (\n    <Image\n      src={`${iconsBasePath}${path}`}\n      alt={symbol ?? \"\"}\n      width={size}\n      height={size}\n      className={cn(\"inline-block shrink-0\", className)}\n      unoptimized\n    />\n  );\n}\n\nexport interface CurrencyAmountProps {\n  amount: string;\n  symbol: string | null | undefined;\n  amountClassName?: string;\n  iconSize?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyAmount({\n  amount,\n  symbol,\n  amountClassName,\n  iconSize = 14,\n  className,\n  iconsBasePath,\n}: CurrencyAmountProps) {\n  return (\n    <span className={cn(\"inline-flex items-center gap-1\", className)}>\n      <CurrencyIcon symbol={symbol} size={iconSize} iconsBasePath={iconsBasePath} />\n      <span className={amountClassName}>{amount}</span>\n    </span>\n  );\n}\n"],"mappings":";AAyBI,cA8BA,YA9BA;AAvBJ,OAAO,WAAW;AAClB,SAAS,UAAU;AAEnB,MAAM,sBAA8C;AAAA,EAClD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AACR;AAUO,SAAS,aAAa,EAAE,QAAQ,OAAO,IAAI,WAAW,gBAAgB,GAAG,GAAsB;AACpG,QAAM,OAAO,SAAS,oBAAoB,MAAM,IAAI;AACpD,MAAI,CAAC,KAAM,QAAO;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,GAAG,aAAa,GAAG,IAAI;AAAA,MAC5B,KAAK,UAAU;AAAA,MACf,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,WAAW,GAAG,yBAAyB,SAAS;AAAA,MAChD,aAAW;AAAA;AAAA,EACb;AAEJ;AAYO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAwB;AACtB,SACE,qBAAC,UAAK,WAAW,GAAG,kCAAkC,SAAS,GAC7D;AAAA,wBAAC,gBAAa,QAAgB,MAAM,UAAU,eAA8B;AAAA,IAC5E,oBAAC,UAAK,WAAW,iBAAkB,kBAAO;AAAA,KAC5C;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/currency-icon.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { cn } from \"../utils/cn.js\";\n\nconst CURRENCY_ICON_PATHS: Record<string, string> = {\n  USDC: \"/usdc.svg\",\n  USDT: \"/usdt.svg\",\n  ETH: \"/eth.svg\",\n  STRK: \"/strk.svg\",\n  WBTC: \"/btc.svg\",\n};\n\nexport function hasCurrencyIcon(symbol: string | null | undefined): boolean {\n  return !!symbol && symbol in CURRENCY_ICON_PATHS;\n}\n\nexport interface CurrencyIconProps {\n  symbol: string | null | undefined;\n  size?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyIcon({ symbol, size = 16, className, iconsBasePath = \"\" }: CurrencyIconProps) {\n  const path = symbol ? CURRENCY_ICON_PATHS[symbol] : undefined;\n  if (!path) return null;\n  return (\n    <Image\n      src={`${iconsBasePath}${path}`}\n      alt={symbol ?? \"\"}\n      width={size}\n      height={size}\n      className={cn(\"inline-block shrink-0\", className)}\n      unoptimized\n    />\n  );\n}\n\nexport interface CurrencyAmountProps {\n  amount: string;\n  symbol: string | null | undefined;\n  amountClassName?: string;\n  iconSize?: number;\n  className?: string;\n\n  iconsBasePath?: string;\n}\n\nexport function CurrencyAmount({\n  amount,\n  symbol,\n  amountClassName,\n  iconSize = 14,\n  className,\n  iconsBasePath,\n}: CurrencyAmountProps) {\n  return (\n    <span className={cn(\"inline-flex items-center gap-1\", className)}>\n      <CurrencyIcon symbol={symbol} size={iconSize} iconsBasePath={iconsBasePath} />\n      <span className={amountClassName}>{amount}</span>\n    </span>\n  );\n}\n"],"mappings":";AA6BI,cA8BA,YA9BA;AA3BJ,OAAO,WAAW;AAClB,SAAS,UAAU;AAEnB,MAAM,sBAA8C;AAAA,EAClD,MAAM;AAAA,EACN,MAAM;AAAA,EACN,KAAK;AAAA,EACL,MAAM;AAAA,EACN,MAAM;AACR;AAEO,SAAS,gBAAgB,QAA4C;AAC1E,SAAO,CAAC,CAAC,UAAU,UAAU;AAC/B;AAUO,SAAS,aAAa,EAAE,QAAQ,OAAO,IAAI,WAAW,gBAAgB,GAAG,GAAsB;AACpG,QAAM,OAAO,SAAS,oBAAoB,MAAM,IAAI;AACpD,MAAI,CAAC,KAAM,QAAO;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,GAAG,aAAa,GAAG,IAAI;AAAA,MAC5B,KAAK,UAAU;AAAA,MACf,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,WAAW,GAAG,yBAAyB,SAAS;AAAA,MAChD,aAAW;AAAA;AAAA,EACb;AAEJ;AAYO,SAAS,eAAe;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAwB;AACtB,SACE,qBAAC,UAAK,WAAW,GAAG,kCAAkC,SAAS,GAC7D;AAAA,wBAAC,gBAAa,QAAgB,MAAM,UAAU,eAA8B;AAAA,IAC5E,oBAAC,UAAK,WAAW,iBAAkB,kBAAO;AAAA,KAC5C;AAEJ;","names":[]}

package/dist/components/fast-mint/fast-mint.d.cts

@@ -1,10 +1,10 @@
-import * as React from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import { FastMintProps } from './types.cjs';
 import 'starknet';
 import '@medialane/sdk';
 import '@medialane/sdk/starknet';
 
-declare function FastMint(props: FastMintProps): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
+declare function FastMint(props: FastMintProps): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
 
 export { FastMint };

package/dist/components/fast-mint/fast-mint.d.ts

@@ -1,10 +1,10 @@
-import * as React from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import { FastMintProps } from './types.js';
 import 'starknet';
 import '@medialane/sdk';
 import '@medialane/sdk/starknet';
 
-declare function FastMint(props: FastMintProps): string | number | bigint | boolean | react_jsx_runtime.JSX.Element | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null | undefined;
+declare function FastMint(props: FastMintProps): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
 
 export { FastMint };

package/dist/components/listing-card.cjs

@@ -39,6 +39,7 @@ var import_link = __toESM(require("./link.js"), 1);
 var import_lucide_react = require("lucide-react");
 var import_motion_primitives = require("./motion-primitives.js");
 var import_animated_token_media = require("./animated-token-media.js");
+var import_currency_icon = require("./currency-icon.js");
 var import_cn = require("../utils/cn.js");
 var import_format = require("../utils/format.js");
 var import_time = require("../utils/time.js");
@@ -53,10 +54,14 @@ function CardPrice({
   if (!amountFormatted) return null;
   const amount = (0, import_format.formatDisplayPrice)(amountFormatted);
   const primary = usdValue ?? amount;
-  const secondary = !usdValue ? currency : (0, import_format.isStableCurrency)(currency) ? currency : `${amount} ${currency}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "flex items-baseline gap-1.5 tabular-nums", children: [
+  const showAmount = !!usdValue && !(0, import_format.isStableCurrency)(currency);
+  const marker = (0, import_currency_icon.hasCurrencyIcon)(currency) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: currency, size: 14 }) : currency;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "flex items-center gap-1.5 tabular-nums", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-base font-bold tracking-tight", children: primary }),
-    secondary && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs text-muted-foreground", children: secondary })
+    marker || showAmount ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
+      marker,
+      showAmount ? amount : null
+    ] }) : null
   ] });
 }
 function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }) {
@@ -71,8 +76,8 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
   const assetHref = (0, import_sdk.assetHref)("STARKNET", order.nftContract ?? "", order.nftTokenId ?? "");
   const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);
   if (compact) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "group", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden rounded-xl", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_animated_token_media.AnimatedTokenMedia,
         {
           image,
@@ -87,15 +92,15 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
           fallback: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
         }
       ) }),
-      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-0.5 pt-2.5 space-y-0.5", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-2.5 space-y-0.5", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs font-medium truncate", children: name }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardPrice, { amountFormatted: order.price?.formatted, currency: order.price?.currency, usdValue }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs text-muted-foreground", children: (0, import_time.timeAgo)(order.createdAt) })
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "group", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden rounded-xl", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_animated_token_media.AnimatedTokenMedia,
       {
         image,
@@ -110,7 +115,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
         fallback: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-0.5 pt-3 space-y-2.5", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-3.5 space-y-2.5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0 space-y-1", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-medium truncate", children: name }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardPrice, { amountFormatted: order.price?.formatted, currency: order.price?.currency, usdValue })
@@ -172,9 +177,9 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
   ] }) });
 }
 function ListingCardSkeleton() {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "aspect-square w-full rounded-xl bg-muted animate-pulse" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-0.5 pt-3 space-y-2.5", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "aspect-square w-full bg-muted animate-pulse" }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-3.5 space-y-2.5", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1", children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-4 w-3/4 bg-muted animate-pulse rounded" }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-5 w-1/2 bg-muted animate-pulse rounded" })

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/listing-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport { ShoppingCart, Check, Zap, ArrowUpRight } from \"lucide-react\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, type ApiOrder, type Chain } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\ntype OrderWithAnimation = ApiOrder & { token: (ApiOrder[\"token\"] & { animationUrl?: string | null }) | null };\n\nfunction CardPrice({\n  amountFormatted, currency, usdValue,\n}: {\n  amountFormatted: string | null | undefined;\n  currency: string | null | undefined;\n  usdValue?: string | null;\n}) {\n  if (!amountFormatted) return null;\n  const amount = formatDisplayPrice(amountFormatted);\n  const primary = usdValue ?? amount;\n  const secondary = !usdValue ? currency : isStableCurrency(currency) ? currency : `${amount} ${currency}`;\n  return (\n    <p className=\"flex items-baseline gap-1.5 tabular-nums\">\n      <span className=\"text-base font-bold tracking-tight\">{primary}</span>\n      {secondary && <span className=\"text-xs text-muted-foreground\">{secondary}</span>}\n    </p>\n  );\n}\n\nexport interface ListingCardProps {\n  order: ApiOrder;\n  inCart?: boolean;\n  onBuy?: (order: ApiOrder) => void;\n  onCart?: (order: ApiOrder) => void;\n\n  overflowMenu?: React.ReactNode;\n\n  primaryAction?: React.ReactNode;\n  compact?: boolean;\n\n  imageUrl?: string | null;\n\n  usdValue?: string | null;\n}\n\nexport function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }: ListingCardProps) {\n  const resolveImage = useImageUrl();\n  const order = rawOrder as OrderWithAnimation;\n  const [imgError, setImgError] = useState(false);\n  const isListing = order.offer.itemType === \"ERC721\" || order.offer.itemType === \"ERC1155\";\n  const name = order.token?.name ?? `Token #${order.nftTokenId}`;\n  const image = imageUrl !== undefined ? imageUrl : (order.token?.image ? resolveImage(order.token.image, { width: 480 }) : null);\n\n  const animationUrl = order.token?.animationUrl ?? null;\n  const live = !!(order.chain && order.nftContract) && isLivingRenderCollection(order.chain.toUpperCase() as Chain, order.nftContract!);\n  const assetHref = buildAssetHref(\"STARKNET\", order.nftContract ?? \"\", order.nftTokenId ?? \"\");\n\n  const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);\n\n  if (compact) {\n    return (\n      <MotionCard className=\"group\">\n        <Link href={assetHref} className=\"block\">\n          <div className=\"relative aspect-square bg-muted overflow-hidden rounded-xl\">\n            <AnimatedTokenMedia\n              image={image}\n              animationUrl={animationUrl}\n              live={live}\n              alt={name}\n              mode=\"fill\"\n              sizes=\"(max-width: 640px) 33vw, 20vw\"\n              className=\"object-cover\"\n              imgError={imgError}\n              onImageError={() => setImgError(true)}\n              fallback={\n                <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n              }\n            />\n          </div>\n          <div className=\"px-0.5 pt-2.5 space-y-0.5\">\n            <p className=\"text-xs font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n            <p className=\"text-2xs text-muted-foreground\">{timeAgo(order.createdAt)}</p>\n          </div>\n        </Link>\n      </MotionCard>\n    );\n  }\n\n  return (\n    <MotionCard className=\"group\">\n      <Link href={assetHref} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden rounded-xl\">\n          <AnimatedTokenMedia\n            image={image}\n            animationUrl={animationUrl}\n            live={live}\n            alt={name}\n            mode=\"fill\"\n            sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 25vw\"\n            className=\"object-cover\"\n            imgError={imgError}\n            onImageError={() => setImgError(true)}\n            fallback={\n              <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n            }\n          />\n        </div>\n\n        <div className=\"px-0.5 pt-3 space-y-2.5\">\n          <div className=\"min-w-0 space-y-1\">\n            <p className=\"text-sm font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n          </div>\n\n          {showActionBar && (\n            <div className=\"flex items-center gap-1.5\">\n              {isListing ? (\n                primaryAction ? (\n                  primaryAction\n                ) : onBuy ? (\n                  <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-9\">\n                    <button\n                      className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                      onClick={(e) => { e.preventDefault(); onBuy(order); }}\n                    >\n                      <Zap className=\"h-3.5 w-3.5 shrink-0\" /> Buy\n                    </button>\n                  </div>\n                ) : (\n                  <Link\n                    href={assetHref}\n                    className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                  >\n                    <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View\n                  </Link>\n                )\n              ) : (\n                <Link\n                  href={assetHref}\n                  className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                >\n                  <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View asset\n                </Link>\n              )}\n              {onCart && (\n                <button\n                  className={cn(\n                    \"min-h-11 min-w-11 shrink-0 rounded-[9px] border flex items-center justify-center transition-colors\",\n                    inCart\n                      ? \"border-brand-orange/50 bg-brand-orange/10 text-brand-orange\"\n                      : \"border-border bg-background hover:bg-muted text-foreground\"\n                  )}\n                  onClick={(e) => { e.preventDefault(); if (!inCart) onCart(order); }}\n                  disabled={inCart}\n                  aria-label={inCart ? \"Added to cart\" : \"Add to cart\"}\n                >\n                  {inCart ? <Check className=\"h-3.5 w-3.5\" /> : <ShoppingCart className=\"h-3.5 w-3.5\" />}\n                </button>\n              )}\n              {overflowMenu}\n            </div>\n          )}\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function ListingCardSkeleton() {\n  return (\n    <div>\n      <div className=\"aspect-square w-full rounded-xl bg-muted animate-pulse\" />\n      <div className=\"px-0.5 pt-3 space-y-2.5\">\n        <div className=\"space-y-1\">\n          <div className=\"h-4 w-3/4 bg-muted animate-pulse rounded\" />\n          <div className=\"h-5 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-9 w-full bg-muted animate-pulse rounded-[9px]\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["buildAssetHref","Link"]}
+{"version":3,"sources":["../../src/components/listing-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport { ShoppingCart, Check, Zap, ArrowUpRight } from \"lucide-react\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { CurrencyIcon, hasCurrencyIcon } from \"./currency-icon.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, type ApiOrder, type Chain } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\ntype OrderWithAnimation = ApiOrder & { token: (ApiOrder[\"token\"] & { animationUrl?: string | null }) | null };\n\nfunction CardPrice({\n  amountFormatted, currency, usdValue,\n}: {\n  amountFormatted: string | null | undefined;\n  currency: string | null | undefined;\n  usdValue?: string | null;\n}) {\n  if (!amountFormatted) return null;\n  const amount = formatDisplayPrice(amountFormatted);\n  const primary = usdValue ?? amount;\n  const showAmount = !!usdValue && !isStableCurrency(currency);\n  const marker = hasCurrencyIcon(currency) ? <CurrencyIcon symbol={currency} size={14} /> : currency;\n  return (\n    <p className=\"flex items-center gap-1.5 tabular-nums\">\n      <span className=\"text-base font-bold tracking-tight\">{primary}</span>\n      {marker || showAmount ? (\n        <span className=\"inline-flex items-center gap-1 text-xs text-muted-foreground\">\n          {marker}\n          {showAmount ? amount : null}\n        </span>\n      ) : null}\n    </p>\n  );\n}\n\nexport interface ListingCardProps {\n  order: ApiOrder;\n  inCart?: boolean;\n  onBuy?: (order: ApiOrder) => void;\n  onCart?: (order: ApiOrder) => void;\n\n  overflowMenu?: React.ReactNode;\n\n  primaryAction?: React.ReactNode;\n  compact?: boolean;\n\n  imageUrl?: string | null;\n\n  usdValue?: string | null;\n}\n\nexport function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }: ListingCardProps) {\n  const resolveImage = useImageUrl();\n  const order = rawOrder as OrderWithAnimation;\n  const [imgError, setImgError] = useState(false);\n  const isListing = order.offer.itemType === \"ERC721\" || order.offer.itemType === \"ERC1155\";\n  const name = order.token?.name ?? `Token #${order.nftTokenId}`;\n  const image = imageUrl !== undefined ? imageUrl : (order.token?.image ? resolveImage(order.token.image, { width: 480 }) : null);\n\n  const animationUrl = order.token?.animationUrl ?? null;\n  const live = !!(order.chain && order.nftContract) && isLivingRenderCollection(order.chain.toUpperCase() as Chain, order.nftContract!);\n  const assetHref = buildAssetHref(\"STARKNET\", order.nftContract ?? \"\", order.nftTokenId ?? \"\");\n\n  const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);\n\n  if (compact) {\n    return (\n      <MotionCard className=\"group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n        <Link href={assetHref} className=\"block\">\n          <div className=\"relative aspect-square bg-muted overflow-hidden\">\n            <AnimatedTokenMedia\n              image={image}\n              animationUrl={animationUrl}\n              live={live}\n              alt={name}\n              mode=\"fill\"\n              sizes=\"(max-width: 640px) 33vw, 20vw\"\n              className=\"object-cover\"\n              imgError={imgError}\n              onImageError={() => setImgError(true)}\n              fallback={\n                <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n              }\n            />\n          </div>\n          <div className=\"p-2.5 space-y-0.5\">\n            <p className=\"text-xs font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n            <p className=\"text-2xs text-muted-foreground\">{timeAgo(order.createdAt)}</p>\n          </div>\n        </Link>\n      </MotionCard>\n    );\n  }\n\n  return (\n    <MotionCard className=\"group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n      <Link href={assetHref} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden\">\n          <AnimatedTokenMedia\n            image={image}\n            animationUrl={animationUrl}\n            live={live}\n            alt={name}\n            mode=\"fill\"\n            sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 25vw\"\n            className=\"object-cover\"\n            imgError={imgError}\n            onImageError={() => setImgError(true)}\n            fallback={\n              <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n            }\n          />\n        </div>\n\n        <div className=\"p-3.5 space-y-2.5\">\n          <div className=\"min-w-0 space-y-1\">\n            <p className=\"text-sm font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n          </div>\n\n          {showActionBar && (\n            <div className=\"flex items-center gap-1.5\">\n              {isListing ? (\n                primaryAction ? (\n                  primaryAction\n                ) : onBuy ? (\n                  <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-9\">\n                    <button\n                      className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                      onClick={(e) => { e.preventDefault(); onBuy(order); }}\n                    >\n                      <Zap className=\"h-3.5 w-3.5 shrink-0\" /> Buy\n                    </button>\n                  </div>\n                ) : (\n                  <Link\n                    href={assetHref}\n                    className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                  >\n                    <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View\n                  </Link>\n                )\n              ) : (\n                <Link\n                  href={assetHref}\n                  className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                >\n                  <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View asset\n                </Link>\n              )}\n              {onCart && (\n                <button\n                  className={cn(\n                    \"min-h-11 min-w-11 shrink-0 rounded-[9px] border flex items-center justify-center transition-colors\",\n                    inCart\n                      ? \"border-brand-orange/50 bg-brand-orange/10 text-brand-orange\"\n                      : \"border-border bg-background hover:bg-muted text-foreground\"\n                  )}\n                  onClick={(e) => { e.preventDefault(); if (!inCart) onCart(order); }}\n                  disabled={inCart}\n                  aria-label={inCart ? \"Added to cart\" : \"Add to cart\"}\n                >\n                  {inCart ? <Check className=\"h-3.5 w-3.5\" /> : <ShoppingCart className=\"h-3.5 w-3.5\" />}\n                </button>\n              )}\n              {overflowMenu}\n            </div>\n          )}\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function ListingCardSkeleton() {\n  return (\n    <div className=\"overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-3.5 space-y-2.5\">\n        <div className=\"space-y-1\">\n          <div className=\"h-4 w-3/4 bg-muted animate-pulse rounded\" />\n          <div className=\"h-5 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-9 w-full bg-muted animate-pulse rounded-[9px]\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["buildAssetHref","Link"]}

package/dist/components/listing-card.js

@@ -5,6 +5,7 @@ import Link from "./link.js";
 import { ShoppingCart, Check, Zap, ArrowUpRight } from "lucide-react";
 import { MotionCard } from "./motion-primitives.js";
 import { AnimatedTokenMedia } from "./animated-token-media.js";
+import { CurrencyIcon, hasCurrencyIcon } from "./currency-icon.js";
 import { cn } from "../utils/cn.js";
 import { formatDisplayPrice, isStableCurrency } from "../utils/format.js";
 import { timeAgo } from "../utils/time.js";
@@ -19,10 +20,14 @@ function CardPrice({
   if (!amountFormatted) return null;
   const amount = formatDisplayPrice(amountFormatted);
   const primary = usdValue ?? amount;
-  const secondary = !usdValue ? currency : isStableCurrency(currency) ? currency : `${amount} ${currency}`;
-  return /* @__PURE__ */ jsxs("p", { className: "flex items-baseline gap-1.5 tabular-nums", children: [
+  const showAmount = !!usdValue && !isStableCurrency(currency);
+  const marker = hasCurrencyIcon(currency) ? /* @__PURE__ */ jsx(CurrencyIcon, { symbol: currency, size: 14 }) : currency;
+  return /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-1.5 tabular-nums", children: [
     /* @__PURE__ */ jsx("span", { className: "text-base font-bold tracking-tight", children: primary }),
-    secondary && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: secondary })
+    marker || showAmount ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 text-xs text-muted-foreground", children: [
+      marker,
+      showAmount ? amount : null
+    ] }) : null
   ] });
 }
 function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }) {
@@ -37,8 +42,8 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
   const assetHref = buildAssetHref("STARKNET", order.nftContract ?? "", order.nftTokenId ?? "");
   const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);
   if (compact) {
-    return /* @__PURE__ */ jsx(MotionCard, { className: "group", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
-      /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden rounded-xl", children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx(MotionCard, { className: "group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
+      /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ jsx(
         AnimatedTokenMedia,
         {
           image,
@@ -53,15 +58,15 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
           fallback: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
         }
       ) }),
-      /* @__PURE__ */ jsxs("div", { className: "px-0.5 pt-2.5 space-y-0.5", children: [
+      /* @__PURE__ */ jsxs("div", { className: "p-2.5 space-y-0.5", children: [
         /* @__PURE__ */ jsx("p", { className: "text-xs font-medium truncate", children: name }),
         /* @__PURE__ */ jsx(CardPrice, { amountFormatted: order.price?.formatted, currency: order.price?.currency, usdValue }),
         /* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground", children: timeAgo(order.createdAt) })
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ jsx(MotionCard, { className: "group", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
-    /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden rounded-xl", children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(MotionCard, { className: "group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
+    /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ jsx(
       AnimatedTokenMedia,
       {
         image,
@@ -76,7 +81,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
         fallback: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
       }
     ) }),
-    /* @__PURE__ */ jsxs("div", { className: "px-0.5 pt-3 space-y-2.5", children: [
+    /* @__PURE__ */ jsxs("div", { className: "p-3.5 space-y-2.5", children: [
       /* @__PURE__ */ jsxs("div", { className: "min-w-0 space-y-1", children: [
         /* @__PURE__ */ jsx("p", { className: "text-sm font-medium truncate", children: name }),
         /* @__PURE__ */ jsx(CardPrice, { amountFormatted: order.price?.formatted, currency: order.price?.currency, usdValue })
@@ -138,9 +143,9 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
   ] }) });
 }
 function ListingCardSkeleton() {
-  return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsx("div", { className: "aspect-square w-full rounded-xl bg-muted animate-pulse" }),
-    /* @__PURE__ */ jsxs("div", { className: "px-0.5 pt-3 space-y-2.5", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card", children: [
+    /* @__PURE__ */ jsx("div", { className: "aspect-square w-full bg-muted animate-pulse" }),
+    /* @__PURE__ */ jsxs("div", { className: "p-3.5 space-y-2.5", children: [
       /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
         /* @__PURE__ */ jsx("div", { className: "h-4 w-3/4 bg-muted animate-pulse rounded" }),
         /* @__PURE__ */ jsx("div", { className: "h-5 w-1/2 bg-muted animate-pulse rounded" })

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/listing-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport { ShoppingCart, Check, Zap, ArrowUpRight } from \"lucide-react\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, type ApiOrder, type Chain } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\ntype OrderWithAnimation = ApiOrder & { token: (ApiOrder[\"token\"] & { animationUrl?: string | null }) | null };\n\nfunction CardPrice({\n  amountFormatted, currency, usdValue,\n}: {\n  amountFormatted: string | null | undefined;\n  currency: string | null | undefined;\n  usdValue?: string | null;\n}) {\n  if (!amountFormatted) return null;\n  const amount = formatDisplayPrice(amountFormatted);\n  const primary = usdValue ?? amount;\n  const secondary = !usdValue ? currency : isStableCurrency(currency) ? currency : `${amount} ${currency}`;\n  return (\n    <p className=\"flex items-baseline gap-1.5 tabular-nums\">\n      <span className=\"text-base font-bold tracking-tight\">{primary}</span>\n      {secondary && <span className=\"text-xs text-muted-foreground\">{secondary}</span>}\n    </p>\n  );\n}\n\nexport interface ListingCardProps {\n  order: ApiOrder;\n  inCart?: boolean;\n  onBuy?: (order: ApiOrder) => void;\n  onCart?: (order: ApiOrder) => void;\n\n  overflowMenu?: React.ReactNode;\n\n  primaryAction?: React.ReactNode;\n  compact?: boolean;\n\n  imageUrl?: string | null;\n\n  usdValue?: string | null;\n}\n\nexport function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }: ListingCardProps) {\n  const resolveImage = useImageUrl();\n  const order = rawOrder as OrderWithAnimation;\n  const [imgError, setImgError] = useState(false);\n  const isListing = order.offer.itemType === \"ERC721\" || order.offer.itemType === \"ERC1155\";\n  const name = order.token?.name ?? `Token #${order.nftTokenId}`;\n  const image = imageUrl !== undefined ? imageUrl : (order.token?.image ? resolveImage(order.token.image, { width: 480 }) : null);\n\n  const animationUrl = order.token?.animationUrl ?? null;\n  const live = !!(order.chain && order.nftContract) && isLivingRenderCollection(order.chain.toUpperCase() as Chain, order.nftContract!);\n  const assetHref = buildAssetHref(\"STARKNET\", order.nftContract ?? \"\", order.nftTokenId ?? \"\");\n\n  const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);\n\n  if (compact) {\n    return (\n      <MotionCard className=\"group\">\n        <Link href={assetHref} className=\"block\">\n          <div className=\"relative aspect-square bg-muted overflow-hidden rounded-xl\">\n            <AnimatedTokenMedia\n              image={image}\n              animationUrl={animationUrl}\n              live={live}\n              alt={name}\n              mode=\"fill\"\n              sizes=\"(max-width: 640px) 33vw, 20vw\"\n              className=\"object-cover\"\n              imgError={imgError}\n              onImageError={() => setImgError(true)}\n              fallback={\n                <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n              }\n            />\n          </div>\n          <div className=\"px-0.5 pt-2.5 space-y-0.5\">\n            <p className=\"text-xs font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n            <p className=\"text-2xs text-muted-foreground\">{timeAgo(order.createdAt)}</p>\n          </div>\n        </Link>\n      </MotionCard>\n    );\n  }\n\n  return (\n    <MotionCard className=\"group\">\n      <Link href={assetHref} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden rounded-xl\">\n          <AnimatedTokenMedia\n            image={image}\n            animationUrl={animationUrl}\n            live={live}\n            alt={name}\n            mode=\"fill\"\n            sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 25vw\"\n            className=\"object-cover\"\n            imgError={imgError}\n            onImageError={() => setImgError(true)}\n            fallback={\n              <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n            }\n          />\n        </div>\n\n        <div className=\"px-0.5 pt-3 space-y-2.5\">\n          <div className=\"min-w-0 space-y-1\">\n            <p className=\"text-sm font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n          </div>\n\n          {showActionBar && (\n            <div className=\"flex items-center gap-1.5\">\n              {isListing ? (\n                primaryAction ? (\n                  primaryAction\n                ) : onBuy ? (\n                  <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-9\">\n                    <button\n                      className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                      onClick={(e) => { e.preventDefault(); onBuy(order); }}\n                    >\n                      <Zap className=\"h-3.5 w-3.5 shrink-0\" /> Buy\n                    </button>\n                  </div>\n                ) : (\n                  <Link\n                    href={assetHref}\n                    className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                  >\n                    <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View\n                  </Link>\n                )\n              ) : (\n                <Link\n                  href={assetHref}\n                  className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                >\n                  <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View asset\n                </Link>\n              )}\n              {onCart && (\n                <button\n                  className={cn(\n                    \"min-h-11 min-w-11 shrink-0 rounded-[9px] border flex items-center justify-center transition-colors\",\n                    inCart\n                      ? \"border-brand-orange/50 bg-brand-orange/10 text-brand-orange\"\n                      : \"border-border bg-background hover:bg-muted text-foreground\"\n                  )}\n                  onClick={(e) => { e.preventDefault(); if (!inCart) onCart(order); }}\n                  disabled={inCart}\n                  aria-label={inCart ? \"Added to cart\" : \"Add to cart\"}\n                >\n                  {inCart ? <Check className=\"h-3.5 w-3.5\" /> : <ShoppingCart className=\"h-3.5 w-3.5\" />}\n                </button>\n              )}\n              {overflowMenu}\n            </div>\n          )}\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function ListingCardSkeleton() {\n  return (\n    <div>\n      <div className=\"aspect-square w-full rounded-xl bg-muted animate-pulse\" />\n      <div className=\"px-0.5 pt-3 space-y-2.5\">\n        <div className=\"space-y-1\">\n          <div className=\"h-4 w-3/4 bg-muted animate-pulse rounded\" />\n          <div className=\"h-5 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-9 w-full bg-muted animate-pulse rounded-[9px]\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/listing-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport { ShoppingCart, Check, Zap, ArrowUpRight } from \"lucide-react\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { CurrencyIcon, hasCurrencyIcon } from \"./currency-icon.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { timeAgo } from \"../utils/time.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, type ApiOrder, type Chain } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\ntype OrderWithAnimation = ApiOrder & { token: (ApiOrder[\"token\"] & { animationUrl?: string | null }) | null };\n\nfunction CardPrice({\n  amountFormatted, currency, usdValue,\n}: {\n  amountFormatted: string | null | undefined;\n  currency: string | null | undefined;\n  usdValue?: string | null;\n}) {\n  if (!amountFormatted) return null;\n  const amount = formatDisplayPrice(amountFormatted);\n  const primary = usdValue ?? amount;\n  const showAmount = !!usdValue && !isStableCurrency(currency);\n  const marker = hasCurrencyIcon(currency) ? <CurrencyIcon symbol={currency} size={14} /> : currency;\n  return (\n    <p className=\"flex items-center gap-1.5 tabular-nums\">\n      <span className=\"text-base font-bold tracking-tight\">{primary}</span>\n      {marker || showAmount ? (\n        <span className=\"inline-flex items-center gap-1 text-xs text-muted-foreground\">\n          {marker}\n          {showAmount ? amount : null}\n        </span>\n      ) : null}\n    </p>\n  );\n}\n\nexport interface ListingCardProps {\n  order: ApiOrder;\n  inCart?: boolean;\n  onBuy?: (order: ApiOrder) => void;\n  onCart?: (order: ApiOrder) => void;\n\n  overflowMenu?: React.ReactNode;\n\n  primaryAction?: React.ReactNode;\n  compact?: boolean;\n\n  imageUrl?: string | null;\n\n  usdValue?: string | null;\n}\n\nexport function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowMenu, primaryAction, compact = false, imageUrl, usdValue }: ListingCardProps) {\n  const resolveImage = useImageUrl();\n  const order = rawOrder as OrderWithAnimation;\n  const [imgError, setImgError] = useState(false);\n  const isListing = order.offer.itemType === \"ERC721\" || order.offer.itemType === \"ERC1155\";\n  const name = order.token?.name ?? `Token #${order.nftTokenId}`;\n  const image = imageUrl !== undefined ? imageUrl : (order.token?.image ? resolveImage(order.token.image, { width: 480 }) : null);\n\n  const animationUrl = order.token?.animationUrl ?? null;\n  const live = !!(order.chain && order.nftContract) && isLivingRenderCollection(order.chain.toUpperCase() as Chain, order.nftContract!);\n  const assetHref = buildAssetHref(\"STARKNET\", order.nftContract ?? \"\", order.nftTokenId ?? \"\");\n\n  const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);\n\n  if (compact) {\n    return (\n      <MotionCard className=\"group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n        <Link href={assetHref} className=\"block\">\n          <div className=\"relative aspect-square bg-muted overflow-hidden\">\n            <AnimatedTokenMedia\n              image={image}\n              animationUrl={animationUrl}\n              live={live}\n              alt={name}\n              mode=\"fill\"\n              sizes=\"(max-width: 640px) 33vw, 20vw\"\n              className=\"object-cover\"\n              imgError={imgError}\n              onImageError={() => setImgError(true)}\n              fallback={\n                <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n              }\n            />\n          </div>\n          <div className=\"p-2.5 space-y-0.5\">\n            <p className=\"text-xs font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n            <p className=\"text-2xs text-muted-foreground\">{timeAgo(order.createdAt)}</p>\n          </div>\n        </Link>\n      </MotionCard>\n    );\n  }\n\n  return (\n    <MotionCard className=\"group overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n      <Link href={assetHref} className=\"block\">\n        <div className=\"relative aspect-square bg-muted overflow-hidden\">\n          <AnimatedTokenMedia\n            image={image}\n            animationUrl={animationUrl}\n            live={live}\n            alt={name}\n            mode=\"fill\"\n            sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 25vw\"\n            className=\"object-cover\"\n            imgError={imgError}\n            onImageError={() => setImgError(true)}\n            fallback={\n              <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\" />\n            }\n          />\n        </div>\n\n        <div className=\"p-3.5 space-y-2.5\">\n          <div className=\"min-w-0 space-y-1\">\n            <p className=\"text-sm font-medium truncate\">{name}</p>\n            <CardPrice amountFormatted={order.price?.formatted} currency={order.price?.currency} usdValue={usdValue} />\n          </div>\n\n          {showActionBar && (\n            <div className=\"flex items-center gap-1.5\">\n              {isListing ? (\n                primaryAction ? (\n                  primaryAction\n                ) : onBuy ? (\n                  <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-9\">\n                    <button\n                      className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                      onClick={(e) => { e.preventDefault(); onBuy(order); }}\n                    >\n                      <Zap className=\"h-3.5 w-3.5 shrink-0\" /> Buy\n                    </button>\n                  </div>\n                ) : (\n                  <Link\n                    href={assetHref}\n                    className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                  >\n                    <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View\n                  </Link>\n                )\n              ) : (\n                <Link\n                  href={assetHref}\n                  className=\"flex-1 h-9 inline-flex items-center justify-center gap-1.5 rounded-[9px] border border-border bg-background text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n                >\n                  <ArrowUpRight className=\"h-3.5 w-3.5 shrink-0\" /> View asset\n                </Link>\n              )}\n              {onCart && (\n                <button\n                  className={cn(\n                    \"min-h-11 min-w-11 shrink-0 rounded-[9px] border flex items-center justify-center transition-colors\",\n                    inCart\n                      ? \"border-brand-orange/50 bg-brand-orange/10 text-brand-orange\"\n                      : \"border-border bg-background hover:bg-muted text-foreground\"\n                  )}\n                  onClick={(e) => { e.preventDefault(); if (!inCart) onCart(order); }}\n                  disabled={inCart}\n                  aria-label={inCart ? \"Added to cart\" : \"Add to cart\"}\n                >\n                  {inCart ? <Check className=\"h-3.5 w-3.5\" /> : <ShoppingCart className=\"h-3.5 w-3.5\" />}\n                </button>\n              )}\n              {overflowMenu}\n            </div>\n          )}\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function ListingCardSkeleton() {\n  return (\n    <div className=\"overflow-hidden rounded-[calc(var(--radius)*1.25)] bg-card\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-3.5 space-y-2.5\">\n        <div className=\"space-y-1\">\n          <div className=\"h-4 w-3/4 bg-muted animate-pulse rounded\" />\n          <div className=\"h-5 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-9 w-full bg-muted animate-pulse rounded-[9px]\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/utils/media-wallet/use-erc20-balance.d.cts

@@ -7,7 +7,7 @@ declare function useTokenBalance(symbol: string | null, holderAddress: string |
     rawBalance: bigint | null;
     isLoading: boolean;
     error: any;
-    decimals: 8 | 6 | 18;
+    decimals: 6 | 8 | 18;
 };
 declare function hasSufficientBalance(rawBalance: bigint | null, requiredHuman: string, decimals: number): boolean | null;
 

package/dist/utils/media-wallet/use-erc20-balance.d.ts

@@ -7,7 +7,7 @@ declare function useTokenBalance(symbol: string | null, holderAddress: string |
     rawBalance: bigint | null;
     isLoading: boolean;
     error: any;
-    decimals: 8 | 6 | 18;
+    decimals: 6 | 8 | 18;
 };
 declare function hasSufficientBalance(rawBalance: bigint | null, requiredHuman: string, decimals: number): boolean | null;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@medialane/ui",
-  "version": "0.323.0",
+  "version": "0.324.0",
   "description": "Shared UI components for Medialane apps",
   "type": "module",
   "sideEffects": false,