@medialane/ui 0.310.0 → 0.312.0

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 { CurrencyIcon } from \"./currency-icon.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { DualPrice } from \"./dual-price.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 PriceLine({\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  if (!usdValue) {\n    return (\n      <p className=\"text-2xs font-bold price-value inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={11} />}\n        {formatDisplayPrice(amountFormatted)}\n      </p>\n    );\n  }\n  const stable = isStableCurrency(currency);\n  return (\n    <>\n      <p className=\"text-2xs font-bold price-value\">\n        {usdValue}\n      </p>\n      <p className=\"text-2xs text-muted-foreground/70 inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={10} />}\n        {stable ? currency : `${formatDisplayPrice(amountFormatted)} ${currency}`}\n      </p>\n    </>\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=\"card-base\">\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 group-hover:scale-105 transition-transform duration-500\"\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-semibold line-clamp-2 break-words\">{name}</p>\n            <PriceLine 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=\"card-base\">\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 group-hover:scale-105 transition-transform duration-500\"\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-3\">\n          <div className=\"min-w-0\">\n            <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">{name}</p>\n          </div>\n\n          {order.price?.formatted && (\n            <DualPrice amountFormatted={order.price.formatted} currency={order.price.currency} usdValue={usdValue} scale=\"card\" />\n          )}\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=\"card-base\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-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-3 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-6 w-1/2 bg-muted animate-pulse rounded\" />\n        <div className=\"h-3 w-2/3 bg-muted animate-pulse rounded\" />\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 { CurrencyIcon } from \"./currency-icon.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { DualPrice } from \"./dual-price.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 PriceLine({\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  if (!usdValue) {\n    return (\n      <p className=\"text-2xs font-bold price-value inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={11} />}\n        {formatDisplayPrice(amountFormatted)}\n      </p>\n    );\n  }\n  const stable = isStableCurrency(currency);\n  return (\n    <>\n      <p className=\"text-2xs font-bold price-value\">\n        {usdValue}\n      </p>\n      <p className=\"text-2xs text-muted-foreground/70 inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={10} />}\n        {stable ? currency : `${formatDisplayPrice(amountFormatted)} ${currency}`}\n      </p>\n    </>\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=\"card-base group\">\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-semibold line-clamp-2 break-words\">{name}</p>\n            <PriceLine 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=\"card-base group\">\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-3\">\n          <div className=\"min-w-0\">\n            <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">{name}</p>\n          </div>\n\n          {order.price?.formatted && (\n            <DualPrice amountFormatted={order.price.formatted} currency={order.price.currency} usdValue={usdValue} scale=\"card\" />\n          )}\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=\"card-base\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-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-3 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-6 w-1/2 bg-muted animate-pulse rounded\" />\n        <div className=\"h-3 w-2/3 bg-muted animate-pulse rounded\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["buildAssetHref","Link"]}

package/dist/components/listing-card.js

@@ -46,7 +46,7 @@ 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: "card-base", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
+    return /* @__PURE__ */ jsx(MotionCard, { className: "card-base group", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
       /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ jsx(
         AnimatedTokenMedia,
         {
@@ -56,7 +56,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
           alt: name,
           mode: "fill",
           sizes: "(max-width: 640px) 33vw, 20vw",
-          className: "object-cover group-hover:scale-105 transition-transform duration-500",
+          className: "object-cover",
           imgError,
           onImageError: () => setImgError(true),
           fallback: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
@@ -69,7 +69,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ jsx(MotionCard, { className: "card-base", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
+  return /* @__PURE__ */ jsx(MotionCard, { className: "card-base group", children: /* @__PURE__ */ jsxs(Link, { href: assetHref, className: "block", children: [
     /* @__PURE__ */ jsx("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ jsx(
       AnimatedTokenMedia,
       {
@@ -79,7 +79,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
         alt: name,
         mode: "fill",
         sizes: "(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 25vw",
-        className: "object-cover group-hover:scale-105 transition-transform duration-500",
+        className: "object-cover",
         imgError,
         onImageError: () => setImgError(true),
         fallback: /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })

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 { CurrencyIcon } from \"./currency-icon.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { DualPrice } from \"./dual-price.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 PriceLine({\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  if (!usdValue) {\n    return (\n      <p className=\"text-2xs font-bold price-value inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={11} />}\n        {formatDisplayPrice(amountFormatted)}\n      </p>\n    );\n  }\n  const stable = isStableCurrency(currency);\n  return (\n    <>\n      <p className=\"text-2xs font-bold price-value\">\n        {usdValue}\n      </p>\n      <p className=\"text-2xs text-muted-foreground/70 inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={10} />}\n        {stable ? currency : `${formatDisplayPrice(amountFormatted)} ${currency}`}\n      </p>\n    </>\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=\"card-base\">\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 group-hover:scale-105 transition-transform duration-500\"\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-semibold line-clamp-2 break-words\">{name}</p>\n            <PriceLine 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=\"card-base\">\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 group-hover:scale-105 transition-transform duration-500\"\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-3\">\n          <div className=\"min-w-0\">\n            <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">{name}</p>\n          </div>\n\n          {order.price?.formatted && (\n            <DualPrice amountFormatted={order.price.formatted} currency={order.price.currency} usdValue={usdValue} scale=\"card\" />\n          )}\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=\"card-base\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-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-3 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-6 w-1/2 bg-muted animate-pulse rounded\" />\n        <div className=\"h-3 w-2/3 bg-muted animate-pulse rounded\" />\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 { CurrencyIcon } from \"./currency-icon.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice, isStableCurrency } from \"../utils/format.js\";\nimport { DualPrice } from \"./dual-price.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 PriceLine({\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  if (!usdValue) {\n    return (\n      <p className=\"text-2xs font-bold price-value inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={11} />}\n        {formatDisplayPrice(amountFormatted)}\n      </p>\n    );\n  }\n  const stable = isStableCurrency(currency);\n  return (\n    <>\n      <p className=\"text-2xs font-bold price-value\">\n        {usdValue}\n      </p>\n      <p className=\"text-2xs text-muted-foreground/70 inline-flex items-center gap-1\">\n        {currency && <CurrencyIcon symbol={currency} size={10} />}\n        {stable ? currency : `${formatDisplayPrice(amountFormatted)} ${currency}`}\n      </p>\n    </>\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=\"card-base group\">\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-semibold line-clamp-2 break-words\">{name}</p>\n            <PriceLine 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=\"card-base group\">\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-3\">\n          <div className=\"min-w-0\">\n            <p className=\"text-base font-semibold tracking-tight line-clamp-2 break-words leading-snug\">{name}</p>\n          </div>\n\n          {order.price?.formatted && (\n            <DualPrice amountFormatted={order.price.formatted} currency={order.price.currency} usdValue={usdValue} scale=\"card\" />\n          )}\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=\"card-base\">\n      <div className=\"aspect-square w-full bg-muted animate-pulse\" />\n      <div className=\"p-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-3 w-1/2 bg-muted animate-pulse rounded\" />\n        </div>\n        <div className=\"h-6 w-1/2 bg-muted animate-pulse rounded\" />\n        <div className=\"h-3 w-2/3 bg-muted animate-pulse rounded\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/media-wallet/media-wallet-send.cjs

@@ -39,7 +39,7 @@ var import_wallet_tokens = require("../../utils/media-wallet/wallet-tokens.js");
 var import_success_dialog = require("./success-dialog.js");
 var import_types = require("./types.js");
 var import_address = require("../../utils/address.js");
-var import_run_intent_calls = require("../../utils/run-intent-calls.js");
+var import_send_token = require("../../utils/send-token.js");
 var import_success_messages = require("../../utils/success-messages.js");
 var import_medialane_app = require("../medialane-app.js");
 function isValidStarknetAddress(address) {
@@ -122,10 +122,7 @@ function MediaWalletSend({
     const dest = to.trim();
     const amt = amountRaw;
     await run(async (signer) => {
-      const result = await (0, import_run_intent_calls.runIntentCalls)(
-        signer,
-        () => getClient().api.intents.create("transfer-token", { owner: signer.address, token: currency.address, recipient: dest, amount: amt.toString() })
-      );
+      const result = await (0, import_send_token.sendToken)(signer, getClient(), { token: currency.address, recipient: dest, amount: amt });
       setTxHash(result.txHash);
       return result;
     });

package/dist/components/media-wallet/media-wallet-send.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/media-wallet/media-wallet-send.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Account, CallData, cairo, validateAndParseAddress, type Call, type ProviderInterface } from \"starknet\";\nimport { parseAmount, formatAmount } from \"@medialane/sdk\";\nimport { ActionButton } from \"../action-button.js\";\nimport { CurrencyIcon } from \"../currency-icon.js\";\nimport { describeError } from \"../../utils/describe-error.js\";\nimport { useErc20Balance, useTokenBalance } from \"../../utils/media-wallet/use-erc20-balance.js\";\nimport { fmt, short } from \"../../utils/media-wallet/wallet-format.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { TrustNote } from \"./action-button.js\";\nimport { ActionModal, BusyOverlay } from \"./action-modal.js\";\nimport { CurrencySheet } from \"./currency-sheet.js\";\nimport { WALLET_TOKENS, type WalletToken } from \"../../utils/media-wallet/wallet-tokens.js\";\nimport { SuccessDialog } from \"./success-dialog.js\";\nimport { useMediaWalletApp, type MediaWalletView } from \"./types.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { runIntentCalls } from \"../../utils/run-intent-calls.js\";\nimport { successMessages } from \"../../utils/success-messages.js\";\nimport { useMedialaneApp } from \"../medialane-app.js\";\n\nfunction isValidStarknetAddress(address: string): boolean {\n  try {\n    validateAndParseAddress(address.trim());\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nasync function estimateSendFee(provider: ProviderInterface, address: string, token: string, to: string, amountRaw: bigint) {\n  const account = new Account({ provider, address, signer: \"0x1\", cairoVersion: \"1\" });\n  const call: Call = {\n    contractAddress: token,\n    entrypoint: \"transfer\",\n    calldata: CallData.compile({ recipient: to, amount: cairo.uint256(amountRaw) }),\n  };\n  const est = await account.estimateInvokeFee(call);\n  return { feeRaw: est.overall_fee, unit: est.unit };\n}\n\nexport function MediaWalletSend({\n  initialToken,\n  onNavigate,\n  onDone,\n}: {\n  initialToken?: WalletToken;\n  onNavigate: (view: MediaWalletView) => void;\n  onDone: () => void;\n}) {\n  const { useWalletSession, useWriteAction } = useMediaWalletApp();\n  const { getClient } = useMedialaneApp();\n  const { address } = useWalletSession();\n  const { run, status, reset, error } = useWriteAction();\n\n  const [currency, setCurrency] = useState<WalletToken>(initialToken ?? WALLET_TOKENS[0]);\n  const [pickerOpen, setPickerOpen] = useState(false);\n  const strk = useTokenBalance(\"STRK\", address);\n  const eth = useTokenBalance(\"ETH\", address);\n  const usdc = useTokenBalance(\"USDC\", address);\n  const wbtc = useTokenBalance(\"WBTC\", address);\n  \n  const pinnedBalancesBySymbol: Record<string, bigint | null> = {\n    STRK: strk.rawBalance, ETH: eth.rawBalance, USDC: usdc.rawBalance, WBTC: wbtc.rawBalance,\n  };\n  const { rawBalance: currencyBalance } = useErc20Balance(currency.address, address);\n\n  const [to, setTo] = useState(\"\");\n  const [amount, setAmount] = useState(\"\");\n  const [txHash, setTxHash] = useState<string | null>(null);\n\n  const [confirmOpen, setConfirmOpen] = useState(false);\n  const [fee, setFee] = useState<{ raw: bigint; unit: string } | null>(null);\n  const [feeError, setFeeError] = useState<string | null>(null);\n\n  const recipientValid = isValidStarknetAddress(to);\n  const sentMessage = successMessages.sent({ amount: amount.trim(), symbol: currency.symbol, to: shortenAddress(to.trim()) });\n  let amountRaw: bigint | null;\n  try {\n    amountRaw = amount.trim() ? BigInt(parseAmount(amount.trim(), currency.decimals)) : null;\n  } catch {\n    amountRaw = null;\n  }\n  const amountOverBalance = amountRaw != null && currencyBalance != null && amountRaw > currencyBalance;\n  const composeReady = recipientValid && amountRaw != null && amountRaw > 0n && !amountOverBalance;\n\n  const pasteRecipient = async () => {\n    try {\n      const text = await navigator.clipboard.readText();\n      if (text) setTo(text.trim());\n    } catch {\n\n    }\n  };\n\n  const setMax = () => {\n    if (currencyBalance == null) return;\n    setAmount(formatAmount(currencyBalance.toString(), currency.decimals));\n  };\n\n  const openReview = () => {\n    if (!address || !composeReady || amountRaw == null) return;\n    setFeeError(null);\n    setFee(null);\n    setConfirmOpen(true);\n    estimateSendFee(getClient().provider, address, currency.address, to.trim(), amountRaw)\n      .then((f) => setFee({ raw: f.feeRaw, unit: f.unit }))\n      .catch((e) => setFeeError(describeError(e).message));\n  };\n\n  const send = async () => {\n    if (!composeReady || amountRaw == null) return;\n    setConfirmOpen(false);\n    const dest = to.trim();\n    const amt = amountRaw;\n    await run(async (signer) => {\n      const result = await runIntentCalls(signer, () =>\n        getClient().api.intents.create(\"transfer-token\", { owner: signer.address, token: currency.address, recipient: dest, amount: amt.toString() }),\n      );\n      setTxHash(result.txHash);\n      return result;\n    });\n  };\n\n  return (\n    <main className=\"flex flex-col gap-6 px-5 pb-8 pt-2\">\n      <div className=\"flex items-center gap-3\">\n        <BackButton onBack={() => onNavigate({ name: \"home\" })} />\n        <h1 className=\"font-[family-name:var(--font-display)] text-2xl font-extrabold tracking-tight\">Send</h1>\n      </div>\n\n      {error && (\n        <div className=\"rounded-2xl border border-destructive/40 bg-destructive/10 p-3 text-xs leading-relaxed\">\n          {error}\n        </div>\n      )}\n\n      <div className=\"flex flex-col gap-3\">\n        <div>\n          <div className=\"flex items-center gap-2\">\n            <input\n              value={to}\n              onChange={(e) => setTo(e.target.value)}\n              placeholder=\"Recipient  0x…\"\n              spellCheck={false}\n              className=\"w-0 flex-1 rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 font-mono text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            {to.trim() === \"\" && (\n              <button\n                onClick={pasteRecipient}\n                className=\"shrink-0 rounded-2xl border border-border bg-foreground/[0.05] px-3 py-3 text-xs font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Paste\n              </button>\n            )}\n          </div>\n          {to.trim() !== \"\" && !recipientValid && (\n            <p className=\"mt-1.5 px-1 text-xs text-destructive\">Not a valid Starknet address.</p>\n          )}\n        </div>\n\n        <div>\n          <div className=\"relative\">\n            <input\n              value={amount}\n              onChange={(e) => setAmount(e.target.value.replace(/[^0-9.]/g, \"\"))}\n              placeholder=\"0.00\"\n              inputMode=\"decimal\"\n              className=\"w-full rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 pr-36 text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            <div className=\"absolute right-2.5 top-1/2 flex -translate-y-1/2 items-center gap-1.5\">\n              <button\n                onClick={setMax}\n                className=\"rounded-full bg-foreground/[0.06] px-2 py-1 text-2xs font-bold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                MAX\n              </button>\n              <button\n                onClick={() => setPickerOpen(true)}\n                className=\"flex items-center gap-1.5 rounded-full bg-foreground/[0.06] px-2.5 py-1 text-xs font-semibold\"\n              >\n                <CurrencyIcon symbol={currency.symbol} size={16} /> {currency.symbol}\n              </button>\n            </div>\n          </div>\n          <div className=\"mt-1.5 flex items-center justify-between px-1\">\n            <span className=\"text-xs text-muted-foreground\">\n              Balance: {currencyBalance != null ? fmt(currencyBalance, currency.decimals) : \"…\"}\n            </span>\n            {amountOverBalance && <span className=\"text-xs text-destructive\">Amount exceeds balance.</span>}\n          </div>\n        </div>\n\n        <ActionButton\n          action=\"offer\"\n          big\n          onClick={openReview}\n          disabled={status === \"processing\" || !composeReady}\n          className=\"mt-1 w-full disabled:pointer-events-none disabled:opacity-40\"\n        >\n          Review Transfer\n        </ActionButton>\n        <TrustNote>Gas paid from your balance. Transfers are permanent and recorded onchain.</TrustNote>\n      </div>\n\n      {pickerOpen && (\n        <CurrencySheet\n          title=\"Choose currency\"\n          tokens={WALLET_TOKENS}\n          balances={pinnedBalancesBySymbol}\n          onSelect={(t) => {\n            setCurrency(t);\n            setPickerOpen(false);\n          }}\n          onClose={() => setPickerOpen(false)}\n        />\n      )}\n\n      {confirmOpen && (\n        <ActionModal title=\"Review Transfer\" onClose={() => setConfirmOpen(false)}>\n          <div className=\"flex flex-col gap-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"grid h-10 w-10 shrink-0 place-items-center rounded-full bg-foreground/[0.06]\">\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                  <path d=\"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z\" />\n                </svg>\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"font-semibold\">Send</div>\n                <div className=\"truncate font-mono text-xs text-muted-foreground\">To: {short(to.trim())}</div>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.05] p-4\">\n              <CurrencyIcon symbol={currency.symbol} size={28} />\n              <div className=\"min-w-0 flex-1 font-semibold\">{currency.symbol}</div>\n              <div className=\"text-right font-semibold tabular-nums\">\n                −{amount.trim()} {currency.symbol}\n              </div>\n            </div>\n\n            <div className=\"flex flex-col divide-y divide-border/40 rounded-2xl bg-foreground/[0.05] px-4\">\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Amount</span>\n                <span className=\"font-medium\">{amount.trim()} {currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Recipient</span>\n                <span className=\"font-mono font-medium\">{short(to.trim())}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Contract</span>\n                <span className=\"font-medium\">{currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Call</span>\n                <span className=\"font-medium underline\">transfer</span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center justify-between rounded-2xl border border-border px-4 py-3 text-sm\">\n              <span className=\"text-muted-foreground\">Estimated fee</span>\n              <span className=\"font-medium\">\n                {feeError ? \"Unavailable\" : fee ? `${fmt(fee.raw, 18, 6)} ${fee.unit === \"FRI\" ? \"STRK\" : \"ETH\"}` : \"Estimating…\"}\n              </span>\n            </div>\n            {feeError && <p className=\"px-1 text-xs text-destructive\">Fee estimate failed: {feeError}</p>}\n\n            <div className=\"flex gap-3\">\n              <button\n                onClick={() => setConfirmOpen(false)}\n                className=\"flex-1 rounded-2xl border border-border py-3 text-sm font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Reject\n              </button>\n              <ActionButton action=\"offer\" big onClick={send} className=\"flex-1\">\n                Confirm\n              </ActionButton>\n            </div>\n          </div>\n        </ActionModal>\n      )}\n\n      {status === \"processing\" && <BusyOverlay label=\"Signing & sending…\" />}\n      {status === \"success\" && txHash && (\n        <SuccessDialog\n          title={sentMessage.title}\n          message={sentMessage.description}\n          txHash={txHash}\n          onClose={() => {\n            reset();\n            onDone();\n          }}\n        />\n      )}\n    </main>\n  );\n}\n"],"mappings":"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","names":["import_action_button"]}
+{"version":3,"sources":["../../../src/components/media-wallet/media-wallet-send.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Account, CallData, cairo, validateAndParseAddress, type Call, type ProviderInterface } from \"starknet\";\nimport { parseAmount, formatAmount } from \"@medialane/sdk\";\nimport { ActionButton } from \"../action-button.js\";\nimport { CurrencyIcon } from \"../currency-icon.js\";\nimport { describeError } from \"../../utils/describe-error.js\";\nimport { useErc20Balance, useTokenBalance } from \"../../utils/media-wallet/use-erc20-balance.js\";\nimport { fmt, short } from \"../../utils/media-wallet/wallet-format.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { TrustNote } from \"./action-button.js\";\nimport { ActionModal, BusyOverlay } from \"./action-modal.js\";\nimport { CurrencySheet } from \"./currency-sheet.js\";\nimport { WALLET_TOKENS, type WalletToken } from \"../../utils/media-wallet/wallet-tokens.js\";\nimport { SuccessDialog } from \"./success-dialog.js\";\nimport { useMediaWalletApp, type MediaWalletView } from \"./types.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { sendToken } from \"../../utils/send-token.js\";\nimport { successMessages } from \"../../utils/success-messages.js\";\nimport { useMedialaneApp } from \"../medialane-app.js\";\n\nfunction isValidStarknetAddress(address: string): boolean {\n  try {\n    validateAndParseAddress(address.trim());\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nasync function estimateSendFee(provider: ProviderInterface, address: string, token: string, to: string, amountRaw: bigint) {\n  const account = new Account({ provider, address, signer: \"0x1\", cairoVersion: \"1\" });\n  const call: Call = {\n    contractAddress: token,\n    entrypoint: \"transfer\",\n    calldata: CallData.compile({ recipient: to, amount: cairo.uint256(amountRaw) }),\n  };\n  const est = await account.estimateInvokeFee(call);\n  return { feeRaw: est.overall_fee, unit: est.unit };\n}\n\nexport function MediaWalletSend({\n  initialToken,\n  onNavigate,\n  onDone,\n}: {\n  initialToken?: WalletToken;\n  onNavigate: (view: MediaWalletView) => void;\n  onDone: () => void;\n}) {\n  const { useWalletSession, useWriteAction } = useMediaWalletApp();\n  const { getClient } = useMedialaneApp();\n  const { address } = useWalletSession();\n  const { run, status, reset, error } = useWriteAction();\n\n  const [currency, setCurrency] = useState<WalletToken>(initialToken ?? WALLET_TOKENS[0]);\n  const [pickerOpen, setPickerOpen] = useState(false);\n  const strk = useTokenBalance(\"STRK\", address);\n  const eth = useTokenBalance(\"ETH\", address);\n  const usdc = useTokenBalance(\"USDC\", address);\n  const wbtc = useTokenBalance(\"WBTC\", address);\n  \n  const pinnedBalancesBySymbol: Record<string, bigint | null> = {\n    STRK: strk.rawBalance, ETH: eth.rawBalance, USDC: usdc.rawBalance, WBTC: wbtc.rawBalance,\n  };\n  const { rawBalance: currencyBalance } = useErc20Balance(currency.address, address);\n\n  const [to, setTo] = useState(\"\");\n  const [amount, setAmount] = useState(\"\");\n  const [txHash, setTxHash] = useState<string | null>(null);\n\n  const [confirmOpen, setConfirmOpen] = useState(false);\n  const [fee, setFee] = useState<{ raw: bigint; unit: string } | null>(null);\n  const [feeError, setFeeError] = useState<string | null>(null);\n\n  const recipientValid = isValidStarknetAddress(to);\n  const sentMessage = successMessages.sent({ amount: amount.trim(), symbol: currency.symbol, to: shortenAddress(to.trim()) });\n  let amountRaw: bigint | null;\n  try {\n    amountRaw = amount.trim() ? BigInt(parseAmount(amount.trim(), currency.decimals)) : null;\n  } catch {\n    amountRaw = null;\n  }\n  const amountOverBalance = amountRaw != null && currencyBalance != null && amountRaw > currencyBalance;\n  const composeReady = recipientValid && amountRaw != null && amountRaw > 0n && !amountOverBalance;\n\n  const pasteRecipient = async () => {\n    try {\n      const text = await navigator.clipboard.readText();\n      if (text) setTo(text.trim());\n    } catch {\n\n    }\n  };\n\n  const setMax = () => {\n    if (currencyBalance == null) return;\n    setAmount(formatAmount(currencyBalance.toString(), currency.decimals));\n  };\n\n  const openReview = () => {\n    if (!address || !composeReady || amountRaw == null) return;\n    setFeeError(null);\n    setFee(null);\n    setConfirmOpen(true);\n    estimateSendFee(getClient().provider, address, currency.address, to.trim(), amountRaw)\n      .then((f) => setFee({ raw: f.feeRaw, unit: f.unit }))\n      .catch((e) => setFeeError(describeError(e).message));\n  };\n\n  const send = async () => {\n    if (!composeReady || amountRaw == null) return;\n    setConfirmOpen(false);\n    const dest = to.trim();\n    const amt = amountRaw;\n    await run(async (signer) => {\n      const result = await sendToken(signer, getClient(), { token: currency.address, recipient: dest, amount: amt });\n      setTxHash(result.txHash);\n      return result;\n    });\n  };\n\n  return (\n    <main className=\"flex flex-col gap-6 px-5 pb-8 pt-2\">\n      <div className=\"flex items-center gap-3\">\n        <BackButton onBack={() => onNavigate({ name: \"home\" })} />\n        <h1 className=\"font-[family-name:var(--font-display)] text-2xl font-extrabold tracking-tight\">Send</h1>\n      </div>\n\n      {error && (\n        <div className=\"rounded-2xl border border-destructive/40 bg-destructive/10 p-3 text-xs leading-relaxed\">\n          {error}\n        </div>\n      )}\n\n      <div className=\"flex flex-col gap-3\">\n        <div>\n          <div className=\"flex items-center gap-2\">\n            <input\n              value={to}\n              onChange={(e) => setTo(e.target.value)}\n              placeholder=\"Recipient  0x…\"\n              spellCheck={false}\n              className=\"w-0 flex-1 rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 font-mono text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            {to.trim() === \"\" && (\n              <button\n                onClick={pasteRecipient}\n                className=\"shrink-0 rounded-2xl border border-border bg-foreground/[0.05] px-3 py-3 text-xs font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Paste\n              </button>\n            )}\n          </div>\n          {to.trim() !== \"\" && !recipientValid && (\n            <p className=\"mt-1.5 px-1 text-xs text-destructive\">Not a valid Starknet address.</p>\n          )}\n        </div>\n\n        <div>\n          <div className=\"relative\">\n            <input\n              value={amount}\n              onChange={(e) => setAmount(e.target.value.replace(/[^0-9.]/g, \"\"))}\n              placeholder=\"0.00\"\n              inputMode=\"decimal\"\n              className=\"w-full rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 pr-36 text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            <div className=\"absolute right-2.5 top-1/2 flex -translate-y-1/2 items-center gap-1.5\">\n              <button\n                onClick={setMax}\n                className=\"rounded-full bg-foreground/[0.06] px-2 py-1 text-2xs font-bold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                MAX\n              </button>\n              <button\n                onClick={() => setPickerOpen(true)}\n                className=\"flex items-center gap-1.5 rounded-full bg-foreground/[0.06] px-2.5 py-1 text-xs font-semibold\"\n              >\n                <CurrencyIcon symbol={currency.symbol} size={16} /> {currency.symbol}\n              </button>\n            </div>\n          </div>\n          <div className=\"mt-1.5 flex items-center justify-between px-1\">\n            <span className=\"text-xs text-muted-foreground\">\n              Balance: {currencyBalance != null ? fmt(currencyBalance, currency.decimals) : \"…\"}\n            </span>\n            {amountOverBalance && <span className=\"text-xs text-destructive\">Amount exceeds balance.</span>}\n          </div>\n        </div>\n\n        <ActionButton\n          action=\"offer\"\n          big\n          onClick={openReview}\n          disabled={status === \"processing\" || !composeReady}\n          className=\"mt-1 w-full disabled:pointer-events-none disabled:opacity-40\"\n        >\n          Review Transfer\n        </ActionButton>\n        <TrustNote>Gas paid from your balance. Transfers are permanent and recorded onchain.</TrustNote>\n      </div>\n\n      {pickerOpen && (\n        <CurrencySheet\n          title=\"Choose currency\"\n          tokens={WALLET_TOKENS}\n          balances={pinnedBalancesBySymbol}\n          onSelect={(t) => {\n            setCurrency(t);\n            setPickerOpen(false);\n          }}\n          onClose={() => setPickerOpen(false)}\n        />\n      )}\n\n      {confirmOpen && (\n        <ActionModal title=\"Review Transfer\" onClose={() => setConfirmOpen(false)}>\n          <div className=\"flex flex-col gap-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"grid h-10 w-10 shrink-0 place-items-center rounded-full bg-foreground/[0.06]\">\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                  <path d=\"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z\" />\n                </svg>\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"font-semibold\">Send</div>\n                <div className=\"truncate font-mono text-xs text-muted-foreground\">To: {short(to.trim())}</div>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.05] p-4\">\n              <CurrencyIcon symbol={currency.symbol} size={28} />\n              <div className=\"min-w-0 flex-1 font-semibold\">{currency.symbol}</div>\n              <div className=\"text-right font-semibold tabular-nums\">\n                −{amount.trim()} {currency.symbol}\n              </div>\n            </div>\n\n            <div className=\"flex flex-col divide-y divide-border/40 rounded-2xl bg-foreground/[0.05] px-4\">\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Amount</span>\n                <span className=\"font-medium\">{amount.trim()} {currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Recipient</span>\n                <span className=\"font-mono font-medium\">{short(to.trim())}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Contract</span>\n                <span className=\"font-medium\">{currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Call</span>\n                <span className=\"font-medium underline\">transfer</span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center justify-between rounded-2xl border border-border px-4 py-3 text-sm\">\n              <span className=\"text-muted-foreground\">Estimated fee</span>\n              <span className=\"font-medium\">\n                {feeError ? \"Unavailable\" : fee ? `${fmt(fee.raw, 18, 6)} ${fee.unit === \"FRI\" ? \"STRK\" : \"ETH\"}` : \"Estimating…\"}\n              </span>\n            </div>\n            {feeError && <p className=\"px-1 text-xs text-destructive\">Fee estimate failed: {feeError}</p>}\n\n            <div className=\"flex gap-3\">\n              <button\n                onClick={() => setConfirmOpen(false)}\n                className=\"flex-1 rounded-2xl border border-border py-3 text-sm font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Reject\n              </button>\n              <ActionButton action=\"offer\" big onClick={send} className=\"flex-1\">\n                Confirm\n              </ActionButton>\n            </div>\n          </div>\n        </ActionModal>\n      )}\n\n      {status === \"processing\" && <BusyOverlay label=\"Signing & sending…\" />}\n      {status === \"success\" && txHash && (\n        <SuccessDialog\n          title={sentMessage.title}\n          message={sentMessage.description}\n          txHash={txHash}\n          onClose={() => {\n            reset();\n            onDone();\n          }}\n        />\n      )}\n    </main>\n  );\n}\n"],"mappings":"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","names":["import_action_button"]}

package/dist/components/media-wallet/media-wallet-send.js

@@ -16,7 +16,7 @@ import { WALLET_TOKENS } from "../../utils/media-wallet/wallet-tokens.js";
 import { SuccessDialog } from "./success-dialog.js";
 import { useMediaWalletApp } from "./types.js";
 import { shortenAddress } from "../../utils/address.js";
-import { runIntentCalls } from "../../utils/run-intent-calls.js";
+import { sendToken } from "../../utils/send-token.js";
 import { successMessages } from "../../utils/success-messages.js";
 import { useMedialaneApp } from "../medialane-app.js";
 function isValidStarknetAddress(address) {
@@ -99,10 +99,7 @@ function MediaWalletSend({
     const dest = to.trim();
     const amt = amountRaw;
     await run(async (signer) => {
-      const result = await runIntentCalls(
-        signer,
-        () => getClient().api.intents.create("transfer-token", { owner: signer.address, token: currency.address, recipient: dest, amount: amt.toString() })
-      );
+      const result = await sendToken(signer, getClient(), { token: currency.address, recipient: dest, amount: amt });
       setTxHash(result.txHash);
       return result;
     });

package/dist/components/media-wallet/media-wallet-send.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/media-wallet/media-wallet-send.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Account, CallData, cairo, validateAndParseAddress, type Call, type ProviderInterface } from \"starknet\";\nimport { parseAmount, formatAmount } from \"@medialane/sdk\";\nimport { ActionButton } from \"../action-button.js\";\nimport { CurrencyIcon } from \"../currency-icon.js\";\nimport { describeError } from \"../../utils/describe-error.js\";\nimport { useErc20Balance, useTokenBalance } from \"../../utils/media-wallet/use-erc20-balance.js\";\nimport { fmt, short } from \"../../utils/media-wallet/wallet-format.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { TrustNote } from \"./action-button.js\";\nimport { ActionModal, BusyOverlay } from \"./action-modal.js\";\nimport { CurrencySheet } from \"./currency-sheet.js\";\nimport { WALLET_TOKENS, type WalletToken } from \"../../utils/media-wallet/wallet-tokens.js\";\nimport { SuccessDialog } from \"./success-dialog.js\";\nimport { useMediaWalletApp, type MediaWalletView } from \"./types.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { runIntentCalls } from \"../../utils/run-intent-calls.js\";\nimport { successMessages } from \"../../utils/success-messages.js\";\nimport { useMedialaneApp } from \"../medialane-app.js\";\n\nfunction isValidStarknetAddress(address: string): boolean {\n  try {\n    validateAndParseAddress(address.trim());\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nasync function estimateSendFee(provider: ProviderInterface, address: string, token: string, to: string, amountRaw: bigint) {\n  const account = new Account({ provider, address, signer: \"0x1\", cairoVersion: \"1\" });\n  const call: Call = {\n    contractAddress: token,\n    entrypoint: \"transfer\",\n    calldata: CallData.compile({ recipient: to, amount: cairo.uint256(amountRaw) }),\n  };\n  const est = await account.estimateInvokeFee(call);\n  return { feeRaw: est.overall_fee, unit: est.unit };\n}\n\nexport function MediaWalletSend({\n  initialToken,\n  onNavigate,\n  onDone,\n}: {\n  initialToken?: WalletToken;\n  onNavigate: (view: MediaWalletView) => void;\n  onDone: () => void;\n}) {\n  const { useWalletSession, useWriteAction } = useMediaWalletApp();\n  const { getClient } = useMedialaneApp();\n  const { address } = useWalletSession();\n  const { run, status, reset, error } = useWriteAction();\n\n  const [currency, setCurrency] = useState<WalletToken>(initialToken ?? WALLET_TOKENS[0]);\n  const [pickerOpen, setPickerOpen] = useState(false);\n  const strk = useTokenBalance(\"STRK\", address);\n  const eth = useTokenBalance(\"ETH\", address);\n  const usdc = useTokenBalance(\"USDC\", address);\n  const wbtc = useTokenBalance(\"WBTC\", address);\n  \n  const pinnedBalancesBySymbol: Record<string, bigint | null> = {\n    STRK: strk.rawBalance, ETH: eth.rawBalance, USDC: usdc.rawBalance, WBTC: wbtc.rawBalance,\n  };\n  const { rawBalance: currencyBalance } = useErc20Balance(currency.address, address);\n\n  const [to, setTo] = useState(\"\");\n  const [amount, setAmount] = useState(\"\");\n  const [txHash, setTxHash] = useState<string | null>(null);\n\n  const [confirmOpen, setConfirmOpen] = useState(false);\n  const [fee, setFee] = useState<{ raw: bigint; unit: string } | null>(null);\n  const [feeError, setFeeError] = useState<string | null>(null);\n\n  const recipientValid = isValidStarknetAddress(to);\n  const sentMessage = successMessages.sent({ amount: amount.trim(), symbol: currency.symbol, to: shortenAddress(to.trim()) });\n  let amountRaw: bigint | null;\n  try {\n    amountRaw = amount.trim() ? BigInt(parseAmount(amount.trim(), currency.decimals)) : null;\n  } catch {\n    amountRaw = null;\n  }\n  const amountOverBalance = amountRaw != null && currencyBalance != null && amountRaw > currencyBalance;\n  const composeReady = recipientValid && amountRaw != null && amountRaw > 0n && !amountOverBalance;\n\n  const pasteRecipient = async () => {\n    try {\n      const text = await navigator.clipboard.readText();\n      if (text) setTo(text.trim());\n    } catch {\n\n    }\n  };\n\n  const setMax = () => {\n    if (currencyBalance == null) return;\n    setAmount(formatAmount(currencyBalance.toString(), currency.decimals));\n  };\n\n  const openReview = () => {\n    if (!address || !composeReady || amountRaw == null) return;\n    setFeeError(null);\n    setFee(null);\n    setConfirmOpen(true);\n    estimateSendFee(getClient().provider, address, currency.address, to.trim(), amountRaw)\n      .then((f) => setFee({ raw: f.feeRaw, unit: f.unit }))\n      .catch((e) => setFeeError(describeError(e).message));\n  };\n\n  const send = async () => {\n    if (!composeReady || amountRaw == null) return;\n    setConfirmOpen(false);\n    const dest = to.trim();\n    const amt = amountRaw;\n    await run(async (signer) => {\n      const result = await runIntentCalls(signer, () =>\n        getClient().api.intents.create(\"transfer-token\", { owner: signer.address, token: currency.address, recipient: dest, amount: amt.toString() }),\n      );\n      setTxHash(result.txHash);\n      return result;\n    });\n  };\n\n  return (\n    <main className=\"flex flex-col gap-6 px-5 pb-8 pt-2\">\n      <div className=\"flex items-center gap-3\">\n        <BackButton onBack={() => onNavigate({ name: \"home\" })} />\n        <h1 className=\"font-[family-name:var(--font-display)] text-2xl font-extrabold tracking-tight\">Send</h1>\n      </div>\n\n      {error && (\n        <div className=\"rounded-2xl border border-destructive/40 bg-destructive/10 p-3 text-xs leading-relaxed\">\n          {error}\n        </div>\n      )}\n\n      <div className=\"flex flex-col gap-3\">\n        <div>\n          <div className=\"flex items-center gap-2\">\n            <input\n              value={to}\n              onChange={(e) => setTo(e.target.value)}\n              placeholder=\"Recipient  0x…\"\n              spellCheck={false}\n              className=\"w-0 flex-1 rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 font-mono text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            {to.trim() === \"\" && (\n              <button\n                onClick={pasteRecipient}\n                className=\"shrink-0 rounded-2xl border border-border bg-foreground/[0.05] px-3 py-3 text-xs font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Paste\n              </button>\n            )}\n          </div>\n          {to.trim() !== \"\" && !recipientValid && (\n            <p className=\"mt-1.5 px-1 text-xs text-destructive\">Not a valid Starknet address.</p>\n          )}\n        </div>\n\n        <div>\n          <div className=\"relative\">\n            <input\n              value={amount}\n              onChange={(e) => setAmount(e.target.value.replace(/[^0-9.]/g, \"\"))}\n              placeholder=\"0.00\"\n              inputMode=\"decimal\"\n              className=\"w-full rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 pr-36 text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            <div className=\"absolute right-2.5 top-1/2 flex -translate-y-1/2 items-center gap-1.5\">\n              <button\n                onClick={setMax}\n                className=\"rounded-full bg-foreground/[0.06] px-2 py-1 text-2xs font-bold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                MAX\n              </button>\n              <button\n                onClick={() => setPickerOpen(true)}\n                className=\"flex items-center gap-1.5 rounded-full bg-foreground/[0.06] px-2.5 py-1 text-xs font-semibold\"\n              >\n                <CurrencyIcon symbol={currency.symbol} size={16} /> {currency.symbol}\n              </button>\n            </div>\n          </div>\n          <div className=\"mt-1.5 flex items-center justify-between px-1\">\n            <span className=\"text-xs text-muted-foreground\">\n              Balance: {currencyBalance != null ? fmt(currencyBalance, currency.decimals) : \"…\"}\n            </span>\n            {amountOverBalance && <span className=\"text-xs text-destructive\">Amount exceeds balance.</span>}\n          </div>\n        </div>\n\n        <ActionButton\n          action=\"offer\"\n          big\n          onClick={openReview}\n          disabled={status === \"processing\" || !composeReady}\n          className=\"mt-1 w-full disabled:pointer-events-none disabled:opacity-40\"\n        >\n          Review Transfer\n        </ActionButton>\n        <TrustNote>Gas paid from your balance. Transfers are permanent and recorded onchain.</TrustNote>\n      </div>\n\n      {pickerOpen && (\n        <CurrencySheet\n          title=\"Choose currency\"\n          tokens={WALLET_TOKENS}\n          balances={pinnedBalancesBySymbol}\n          onSelect={(t) => {\n            setCurrency(t);\n            setPickerOpen(false);\n          }}\n          onClose={() => setPickerOpen(false)}\n        />\n      )}\n\n      {confirmOpen && (\n        <ActionModal title=\"Review Transfer\" onClose={() => setConfirmOpen(false)}>\n          <div className=\"flex flex-col gap-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"grid h-10 w-10 shrink-0 place-items-center rounded-full bg-foreground/[0.06]\">\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                  <path d=\"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z\" />\n                </svg>\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"font-semibold\">Send</div>\n                <div className=\"truncate font-mono text-xs text-muted-foreground\">To: {short(to.trim())}</div>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.05] p-4\">\n              <CurrencyIcon symbol={currency.symbol} size={28} />\n              <div className=\"min-w-0 flex-1 font-semibold\">{currency.symbol}</div>\n              <div className=\"text-right font-semibold tabular-nums\">\n                −{amount.trim()} {currency.symbol}\n              </div>\n            </div>\n\n            <div className=\"flex flex-col divide-y divide-border/40 rounded-2xl bg-foreground/[0.05] px-4\">\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Amount</span>\n                <span className=\"font-medium\">{amount.trim()} {currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Recipient</span>\n                <span className=\"font-mono font-medium\">{short(to.trim())}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Contract</span>\n                <span className=\"font-medium\">{currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Call</span>\n                <span className=\"font-medium underline\">transfer</span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center justify-between rounded-2xl border border-border px-4 py-3 text-sm\">\n              <span className=\"text-muted-foreground\">Estimated fee</span>\n              <span className=\"font-medium\">\n                {feeError ? \"Unavailable\" : fee ? `${fmt(fee.raw, 18, 6)} ${fee.unit === \"FRI\" ? \"STRK\" : \"ETH\"}` : \"Estimating…\"}\n              </span>\n            </div>\n            {feeError && <p className=\"px-1 text-xs text-destructive\">Fee estimate failed: {feeError}</p>}\n\n            <div className=\"flex gap-3\">\n              <button\n                onClick={() => setConfirmOpen(false)}\n                className=\"flex-1 rounded-2xl border border-border py-3 text-sm font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Reject\n              </button>\n              <ActionButton action=\"offer\" big onClick={send} className=\"flex-1\">\n                Confirm\n              </ActionButton>\n            </div>\n          </div>\n        </ActionModal>\n      )}\n\n      {status === \"processing\" && <BusyOverlay label=\"Signing & sending…\" />}\n      {status === \"success\" && txHash && (\n        <SuccessDialog\n          title={sentMessage.title}\n          message={sentMessage.description}\n          txHash={txHash}\n          onClose={() => {\n            reset();\n            onDone();\n          }}\n        />\n      )}\n    </main>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components/media-wallet/media-wallet-send.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Account, CallData, cairo, validateAndParseAddress, type Call, type ProviderInterface } from \"starknet\";\nimport { parseAmount, formatAmount } from \"@medialane/sdk\";\nimport { ActionButton } from \"../action-button.js\";\nimport { CurrencyIcon } from \"../currency-icon.js\";\nimport { describeError } from \"../../utils/describe-error.js\";\nimport { useErc20Balance, useTokenBalance } from \"../../utils/media-wallet/use-erc20-balance.js\";\nimport { fmt, short } from \"../../utils/media-wallet/wallet-format.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { TrustNote } from \"./action-button.js\";\nimport { ActionModal, BusyOverlay } from \"./action-modal.js\";\nimport { CurrencySheet } from \"./currency-sheet.js\";\nimport { WALLET_TOKENS, type WalletToken } from \"../../utils/media-wallet/wallet-tokens.js\";\nimport { SuccessDialog } from \"./success-dialog.js\";\nimport { useMediaWalletApp, type MediaWalletView } from \"./types.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { sendToken } from \"../../utils/send-token.js\";\nimport { successMessages } from \"../../utils/success-messages.js\";\nimport { useMedialaneApp } from \"../medialane-app.js\";\n\nfunction isValidStarknetAddress(address: string): boolean {\n  try {\n    validateAndParseAddress(address.trim());\n    return true;\n  } catch {\n    return false;\n  }\n}\n\nasync function estimateSendFee(provider: ProviderInterface, address: string, token: string, to: string, amountRaw: bigint) {\n  const account = new Account({ provider, address, signer: \"0x1\", cairoVersion: \"1\" });\n  const call: Call = {\n    contractAddress: token,\n    entrypoint: \"transfer\",\n    calldata: CallData.compile({ recipient: to, amount: cairo.uint256(amountRaw) }),\n  };\n  const est = await account.estimateInvokeFee(call);\n  return { feeRaw: est.overall_fee, unit: est.unit };\n}\n\nexport function MediaWalletSend({\n  initialToken,\n  onNavigate,\n  onDone,\n}: {\n  initialToken?: WalletToken;\n  onNavigate: (view: MediaWalletView) => void;\n  onDone: () => void;\n}) {\n  const { useWalletSession, useWriteAction } = useMediaWalletApp();\n  const { getClient } = useMedialaneApp();\n  const { address } = useWalletSession();\n  const { run, status, reset, error } = useWriteAction();\n\n  const [currency, setCurrency] = useState<WalletToken>(initialToken ?? WALLET_TOKENS[0]);\n  const [pickerOpen, setPickerOpen] = useState(false);\n  const strk = useTokenBalance(\"STRK\", address);\n  const eth = useTokenBalance(\"ETH\", address);\n  const usdc = useTokenBalance(\"USDC\", address);\n  const wbtc = useTokenBalance(\"WBTC\", address);\n  \n  const pinnedBalancesBySymbol: Record<string, bigint | null> = {\n    STRK: strk.rawBalance, ETH: eth.rawBalance, USDC: usdc.rawBalance, WBTC: wbtc.rawBalance,\n  };\n  const { rawBalance: currencyBalance } = useErc20Balance(currency.address, address);\n\n  const [to, setTo] = useState(\"\");\n  const [amount, setAmount] = useState(\"\");\n  const [txHash, setTxHash] = useState<string | null>(null);\n\n  const [confirmOpen, setConfirmOpen] = useState(false);\n  const [fee, setFee] = useState<{ raw: bigint; unit: string } | null>(null);\n  const [feeError, setFeeError] = useState<string | null>(null);\n\n  const recipientValid = isValidStarknetAddress(to);\n  const sentMessage = successMessages.sent({ amount: amount.trim(), symbol: currency.symbol, to: shortenAddress(to.trim()) });\n  let amountRaw: bigint | null;\n  try {\n    amountRaw = amount.trim() ? BigInt(parseAmount(amount.trim(), currency.decimals)) : null;\n  } catch {\n    amountRaw = null;\n  }\n  const amountOverBalance = amountRaw != null && currencyBalance != null && amountRaw > currencyBalance;\n  const composeReady = recipientValid && amountRaw != null && amountRaw > 0n && !amountOverBalance;\n\n  const pasteRecipient = async () => {\n    try {\n      const text = await navigator.clipboard.readText();\n      if (text) setTo(text.trim());\n    } catch {\n\n    }\n  };\n\n  const setMax = () => {\n    if (currencyBalance == null) return;\n    setAmount(formatAmount(currencyBalance.toString(), currency.decimals));\n  };\n\n  const openReview = () => {\n    if (!address || !composeReady || amountRaw == null) return;\n    setFeeError(null);\n    setFee(null);\n    setConfirmOpen(true);\n    estimateSendFee(getClient().provider, address, currency.address, to.trim(), amountRaw)\n      .then((f) => setFee({ raw: f.feeRaw, unit: f.unit }))\n      .catch((e) => setFeeError(describeError(e).message));\n  };\n\n  const send = async () => {\n    if (!composeReady || amountRaw == null) return;\n    setConfirmOpen(false);\n    const dest = to.trim();\n    const amt = amountRaw;\n    await run(async (signer) => {\n      const result = await sendToken(signer, getClient(), { token: currency.address, recipient: dest, amount: amt });\n      setTxHash(result.txHash);\n      return result;\n    });\n  };\n\n  return (\n    <main className=\"flex flex-col gap-6 px-5 pb-8 pt-2\">\n      <div className=\"flex items-center gap-3\">\n        <BackButton onBack={() => onNavigate({ name: \"home\" })} />\n        <h1 className=\"font-[family-name:var(--font-display)] text-2xl font-extrabold tracking-tight\">Send</h1>\n      </div>\n\n      {error && (\n        <div className=\"rounded-2xl border border-destructive/40 bg-destructive/10 p-3 text-xs leading-relaxed\">\n          {error}\n        </div>\n      )}\n\n      <div className=\"flex flex-col gap-3\">\n        <div>\n          <div className=\"flex items-center gap-2\">\n            <input\n              value={to}\n              onChange={(e) => setTo(e.target.value)}\n              placeholder=\"Recipient  0x…\"\n              spellCheck={false}\n              className=\"w-0 flex-1 rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 font-mono text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            {to.trim() === \"\" && (\n              <button\n                onClick={pasteRecipient}\n                className=\"shrink-0 rounded-2xl border border-border bg-foreground/[0.05] px-3 py-3 text-xs font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Paste\n              </button>\n            )}\n          </div>\n          {to.trim() !== \"\" && !recipientValid && (\n            <p className=\"mt-1.5 px-1 text-xs text-destructive\">Not a valid Starknet address.</p>\n          )}\n        </div>\n\n        <div>\n          <div className=\"relative\">\n            <input\n              value={amount}\n              onChange={(e) => setAmount(e.target.value.replace(/[^0-9.]/g, \"\"))}\n              placeholder=\"0.00\"\n              inputMode=\"decimal\"\n              className=\"w-full rounded-2xl border border-border bg-foreground/[0.05] px-4 py-3 pr-36 text-sm outline-none transition-colors focus:border-brand-purple\"\n            />\n            <div className=\"absolute right-2.5 top-1/2 flex -translate-y-1/2 items-center gap-1.5\">\n              <button\n                onClick={setMax}\n                className=\"rounded-full bg-foreground/[0.06] px-2 py-1 text-2xs font-bold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                MAX\n              </button>\n              <button\n                onClick={() => setPickerOpen(true)}\n                className=\"flex items-center gap-1.5 rounded-full bg-foreground/[0.06] px-2.5 py-1 text-xs font-semibold\"\n              >\n                <CurrencyIcon symbol={currency.symbol} size={16} /> {currency.symbol}\n              </button>\n            </div>\n          </div>\n          <div className=\"mt-1.5 flex items-center justify-between px-1\">\n            <span className=\"text-xs text-muted-foreground\">\n              Balance: {currencyBalance != null ? fmt(currencyBalance, currency.decimals) : \"…\"}\n            </span>\n            {amountOverBalance && <span className=\"text-xs text-destructive\">Amount exceeds balance.</span>}\n          </div>\n        </div>\n\n        <ActionButton\n          action=\"offer\"\n          big\n          onClick={openReview}\n          disabled={status === \"processing\" || !composeReady}\n          className=\"mt-1 w-full disabled:pointer-events-none disabled:opacity-40\"\n        >\n          Review Transfer\n        </ActionButton>\n        <TrustNote>Gas paid from your balance. Transfers are permanent and recorded onchain.</TrustNote>\n      </div>\n\n      {pickerOpen && (\n        <CurrencySheet\n          title=\"Choose currency\"\n          tokens={WALLET_TOKENS}\n          balances={pinnedBalancesBySymbol}\n          onSelect={(t) => {\n            setCurrency(t);\n            setPickerOpen(false);\n          }}\n          onClose={() => setPickerOpen(false)}\n        />\n      )}\n\n      {confirmOpen && (\n        <ActionModal title=\"Review Transfer\" onClose={() => setConfirmOpen(false)}>\n          <div className=\"flex flex-col gap-4\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"grid h-10 w-10 shrink-0 place-items-center rounded-full bg-foreground/[0.06]\">\n                <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n                  <path d=\"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z\" />\n                </svg>\n              </div>\n              <div className=\"min-w-0 flex-1\">\n                <div className=\"font-semibold\">Send</div>\n                <div className=\"truncate font-mono text-xs text-muted-foreground\">To: {short(to.trim())}</div>\n              </div>\n            </div>\n\n            <div className=\"flex items-center gap-3 rounded-2xl bg-foreground/[0.05] p-4\">\n              <CurrencyIcon symbol={currency.symbol} size={28} />\n              <div className=\"min-w-0 flex-1 font-semibold\">{currency.symbol}</div>\n              <div className=\"text-right font-semibold tabular-nums\">\n                −{amount.trim()} {currency.symbol}\n              </div>\n            </div>\n\n            <div className=\"flex flex-col divide-y divide-border/40 rounded-2xl bg-foreground/[0.05] px-4\">\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Amount</span>\n                <span className=\"font-medium\">{amount.trim()} {currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Recipient</span>\n                <span className=\"font-mono font-medium\">{short(to.trim())}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Contract</span>\n                <span className=\"font-medium\">{currency.symbol}</span>\n              </div>\n              <div className=\"flex items-center justify-between py-3 text-sm\">\n                <span className=\"text-muted-foreground\">Call</span>\n                <span className=\"font-medium underline\">transfer</span>\n              </div>\n            </div>\n\n            <div className=\"flex items-center justify-between rounded-2xl border border-border px-4 py-3 text-sm\">\n              <span className=\"text-muted-foreground\">Estimated fee</span>\n              <span className=\"font-medium\">\n                {feeError ? \"Unavailable\" : fee ? `${fmt(fee.raw, 18, 6)} ${fee.unit === \"FRI\" ? \"STRK\" : \"ETH\"}` : \"Estimating…\"}\n              </span>\n            </div>\n            {feeError && <p className=\"px-1 text-xs text-destructive\">Fee estimate failed: {feeError}</p>}\n\n            <div className=\"flex gap-3\">\n              <button\n                onClick={() => setConfirmOpen(false)}\n                className=\"flex-1 rounded-2xl border border-border py-3 text-sm font-semibold text-muted-foreground transition-colors hover:text-foreground\"\n              >\n                Reject\n              </button>\n              <ActionButton action=\"offer\" big onClick={send} className=\"flex-1\">\n                Confirm\n              </ActionButton>\n            </div>\n          </div>\n        </ActionModal>\n      )}\n\n      {status === \"processing\" && <BusyOverlay label=\"Signing & sending…\" />}\n      {status === \"success\" && txHash && (\n        <SuccessDialog\n          title={sentMessage.title}\n          message={sentMessage.description}\n          txHash={txHash}\n          onClose={() => {\n            reset();\n            onDone();\n          }}\n        />\n      )}\n    </main>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/media-wallet/nft-strip.cjs

@@ -63,7 +63,7 @@ function NftStrip({
             alt: item.name,
             fill: true,
             unoptimized: true,
-            className: "object-cover transition-transform duration-200 group-hover:scale-[1.03]"
+            className: "object-cover card-media"
           }
         ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid h-full w-full place-items-center", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(AssetFallbackIcon, {}) })
       },

package/dist/components/media-wallet/nft-strip.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/media-wallet/nft-strip.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"../link.js\";\nimport Image from \"../image.js\";\nimport type { NftItem } from \"../../utils/media-wallet/nft-items.js\";\n\nexport function NftStrip({\n  items,\n  isLoading,\n  onNavigate,\n  resolveImage,\n}: {\n  items: NftItem[];\n  isLoading: boolean;\n  onNavigate?: () => void;\n  resolveImage: (uri: string | null | undefined) => string | null;\n}) {\n  if (isLoading) {\n    return (\n      <div data-testid=\"nft-strip-skeleton\" className=\"grid grid-cols-4 gap-2\">\n        {Array.from({ length: 4 }).map((_, i) => (\n          <div key={i} className=\"aspect-square animate-pulse rounded-xl bg-foreground/[0.06]\" />\n        ))}\n      </div>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        No NFTs yet — mint or collect your first one to see it here.\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-4 gap-2\">\n      {items.map((item) => {\n        const resolved = resolveImage(item.image);\n        return (\n          <Link\n            key={item.key}\n            href={item.href}\n            title={item.name}\n            onClick={onNavigate}\n            className=\"group relative aspect-square overflow-hidden rounded-xl bg-foreground/[0.06] transition-opacity hover:opacity-90\"\n          >\n            {resolved ? (\n              <Image\n                src={resolved}\n                alt={item.name}\n                fill\n                unoptimized\n                className=\"object-cover transition-transform duration-200 group-hover:scale-[1.03]\"\n              />\n            ) : (\n              <div className=\"grid h-full w-full place-items-center\">\n                <AssetFallbackIcon />\n              </div>\n            )}\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AssetFallbackIcon() {\n  return (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\" className=\"text-muted-foreground\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"3\" />\n      <circle cx=\"9\" cy=\"9\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" />\n      <path d=\"M21 15l-5-5-9 9\" />\n    </svg>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBU;AAnBV,kBAAiB;AACjB,mBAAkB;AAGX,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW;AACb,WACE,4CAAC,SAAI,eAAY,sBAAqB,WAAU,0BAC7C,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,4CAAC,SAAY,WAAU,iEAAb,CAA2E,CACtF,GACH;AAAA,EAEJ;AAEA,MAAI,MAAM,WAAW,GAAG;AACtB,WACE,4CAAC,OAAE,WAAU,iCAAgC,+EAE7C;AAAA,EAEJ;AAEA,SACE,4CAAC,SAAI,WAAU,0BACZ,gBAAM,IAAI,CAAC,SAAS;AACnB,UAAM,WAAW,aAAa,KAAK,KAAK;AACxC,WACE;AAAA,MAAC,YAAAA;AAAA,MAAA;AAAA,QAEC,MAAM,KAAK;AAAA,QACX,OAAO,KAAK;AAAA,QACZ,SAAS;AAAA,QACT,WAAU;AAAA,QAET,qBACC;AAAA,UAAC,aAAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK,KAAK;AAAA,YACV,MAAI;AAAA,YACJ,aAAW;AAAA,YACX,WAAU;AAAA;AAAA,QACZ,IAEA,4CAAC,SAAI,WAAU,yCACb,sDAAC,qBAAkB,GACrB;AAAA;AAAA,MAjBG,KAAK;AAAA,IAmBZ;AAAA,EAEJ,CAAC,GACH;AAEJ;AAEA,SAAS,oBAAoB;AAC3B,SACE,6CAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,WAAU,yBAAwB,eAAc,SAAQ,gBAAe,SACzK;AAAA,gDAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,IAChD,4CAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe,QAAO,QAAO;AAAA,IAChE,4CAAC,UAAK,GAAE,mBAAkB;AAAA,KAC5B;AAEJ;","names":["Link","Image"]}
+{"version":3,"sources":["../../../src/components/media-wallet/nft-strip.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"../link.js\";\nimport Image from \"../image.js\";\nimport type { NftItem } from \"../../utils/media-wallet/nft-items.js\";\n\nexport function NftStrip({\n  items,\n  isLoading,\n  onNavigate,\n  resolveImage,\n}: {\n  items: NftItem[];\n  isLoading: boolean;\n  onNavigate?: () => void;\n  resolveImage: (uri: string | null | undefined) => string | null;\n}) {\n  if (isLoading) {\n    return (\n      <div data-testid=\"nft-strip-skeleton\" className=\"grid grid-cols-4 gap-2\">\n        {Array.from({ length: 4 }).map((_, i) => (\n          <div key={i} className=\"aspect-square animate-pulse rounded-xl bg-foreground/[0.06]\" />\n        ))}\n      </div>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        No NFTs yet — mint or collect your first one to see it here.\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-4 gap-2\">\n      {items.map((item) => {\n        const resolved = resolveImage(item.image);\n        return (\n          <Link\n            key={item.key}\n            href={item.href}\n            title={item.name}\n            onClick={onNavigate}\n            className=\"group relative aspect-square overflow-hidden rounded-xl bg-foreground/[0.06] transition-opacity hover:opacity-90\"\n          >\n            {resolved ? (\n              <Image\n                src={resolved}\n                alt={item.name}\n                fill\n                unoptimized\n                className=\"object-cover card-media\"\n              />\n            ) : (\n              <div className=\"grid h-full w-full place-items-center\">\n                <AssetFallbackIcon />\n              </div>\n            )}\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AssetFallbackIcon() {\n  return (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\" className=\"text-muted-foreground\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"3\" />\n      <circle cx=\"9\" cy=\"9\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" />\n      <path d=\"M21 15l-5-5-9 9\" />\n    </svg>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBU;AAnBV,kBAAiB;AACjB,mBAAkB;AAGX,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW;AACb,WACE,4CAAC,SAAI,eAAY,sBAAqB,WAAU,0BAC7C,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,4CAAC,SAAY,WAAU,iEAAb,CAA2E,CACtF,GACH;AAAA,EAEJ;AAEA,MAAI,MAAM,WAAW,GAAG;AACtB,WACE,4CAAC,OAAE,WAAU,iCAAgC,+EAE7C;AAAA,EAEJ;AAEA,SACE,4CAAC,SAAI,WAAU,0BACZ,gBAAM,IAAI,CAAC,SAAS;AACnB,UAAM,WAAW,aAAa,KAAK,KAAK;AACxC,WACE;AAAA,MAAC,YAAAA;AAAA,MAAA;AAAA,QAEC,MAAM,KAAK;AAAA,QACX,OAAO,KAAK;AAAA,QACZ,SAAS;AAAA,QACT,WAAU;AAAA,QAET,qBACC;AAAA,UAAC,aAAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK,KAAK;AAAA,YACV,MAAI;AAAA,YACJ,aAAW;AAAA,YACX,WAAU;AAAA;AAAA,QACZ,IAEA,4CAAC,SAAI,WAAU,yCACb,sDAAC,qBAAkB,GACrB;AAAA;AAAA,MAjBG,KAAK;AAAA,IAmBZ;AAAA,EAEJ,CAAC,GACH;AAEJ;AAEA,SAAS,oBAAoB;AAC3B,SACE,6CAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,WAAU,yBAAwB,eAAc,SAAQ,gBAAe,SACzK;AAAA,gDAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,IAChD,4CAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe,QAAO,QAAO;AAAA,IAChE,4CAAC,UAAK,GAAE,mBAAkB;AAAA,KAC5B;AAEJ;","names":["Link","Image"]}

package/dist/components/media-wallet/nft-strip.js

@@ -30,7 +30,7 @@ function NftStrip({
             alt: item.name,
             fill: true,
             unoptimized: true,
-            className: "object-cover transition-transform duration-200 group-hover:scale-[1.03]"
+            className: "object-cover card-media"
           }
         ) : /* @__PURE__ */ jsx("div", { className: "grid h-full w-full place-items-center", children: /* @__PURE__ */ jsx(AssetFallbackIcon, {}) })
       },

package/dist/components/media-wallet/nft-strip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/media-wallet/nft-strip.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"../link.js\";\nimport Image from \"../image.js\";\nimport type { NftItem } from \"../../utils/media-wallet/nft-items.js\";\n\nexport function NftStrip({\n  items,\n  isLoading,\n  onNavigate,\n  resolveImage,\n}: {\n  items: NftItem[];\n  isLoading: boolean;\n  onNavigate?: () => void;\n  resolveImage: (uri: string | null | undefined) => string | null;\n}) {\n  if (isLoading) {\n    return (\n      <div data-testid=\"nft-strip-skeleton\" className=\"grid grid-cols-4 gap-2\">\n        {Array.from({ length: 4 }).map((_, i) => (\n          <div key={i} className=\"aspect-square animate-pulse rounded-xl bg-foreground/[0.06]\" />\n        ))}\n      </div>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        No NFTs yet — mint or collect your first one to see it here.\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-4 gap-2\">\n      {items.map((item) => {\n        const resolved = resolveImage(item.image);\n        return (\n          <Link\n            key={item.key}\n            href={item.href}\n            title={item.name}\n            onClick={onNavigate}\n            className=\"group relative aspect-square overflow-hidden rounded-xl bg-foreground/[0.06] transition-opacity hover:opacity-90\"\n          >\n            {resolved ? (\n              <Image\n                src={resolved}\n                alt={item.name}\n                fill\n                unoptimized\n                className=\"object-cover transition-transform duration-200 group-hover:scale-[1.03]\"\n              />\n            ) : (\n              <div className=\"grid h-full w-full place-items-center\">\n                <AssetFallbackIcon />\n              </div>\n            )}\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AssetFallbackIcon() {\n  return (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\" className=\"text-muted-foreground\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"3\" />\n      <circle cx=\"9\" cy=\"9\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" />\n      <path d=\"M21 15l-5-5-9 9\" />\n    </svg>\n  );\n}\n"],"mappings":";AAqBU,cAgDN,YAhDM;AAnBV,OAAO,UAAU;AACjB,OAAO,WAAW;AAGX,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW;AACb,WACE,oBAAC,SAAI,eAAY,sBAAqB,WAAU,0BAC7C,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,oBAAC,SAAY,WAAU,iEAAb,CAA2E,CACtF,GACH;AAAA,EAEJ;AAEA,MAAI,MAAM,WAAW,GAAG;AACtB,WACE,oBAAC,OAAE,WAAU,iCAAgC,+EAE7C;AAAA,EAEJ;AAEA,SACE,oBAAC,SAAI,WAAU,0BACZ,gBAAM,IAAI,CAAC,SAAS;AACnB,UAAM,WAAW,aAAa,KAAK,KAAK;AACxC,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,MAAM,KAAK;AAAA,QACX,OAAO,KAAK;AAAA,QACZ,SAAS;AAAA,QACT,WAAU;AAAA,QAET,qBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK,KAAK;AAAA,YACV,MAAI;AAAA,YACJ,aAAW;AAAA,YACX,WAAU;AAAA;AAAA,QACZ,IAEA,oBAAC,SAAI,WAAU,yCACb,8BAAC,qBAAkB,GACrB;AAAA;AAAA,MAjBG,KAAK;AAAA,IAmBZ;AAAA,EAEJ,CAAC,GACH;AAEJ;AAEA,SAAS,oBAAoB;AAC3B,SACE,qBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,WAAU,yBAAwB,eAAc,SAAQ,gBAAe,SACzK;AAAA,wBAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,IAChD,oBAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe,QAAO,QAAO;AAAA,IAChE,oBAAC,UAAK,GAAE,mBAAkB;AAAA,KAC5B;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/media-wallet/nft-strip.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"../link.js\";\nimport Image from \"../image.js\";\nimport type { NftItem } from \"../../utils/media-wallet/nft-items.js\";\n\nexport function NftStrip({\n  items,\n  isLoading,\n  onNavigate,\n  resolveImage,\n}: {\n  items: NftItem[];\n  isLoading: boolean;\n  onNavigate?: () => void;\n  resolveImage: (uri: string | null | undefined) => string | null;\n}) {\n  if (isLoading) {\n    return (\n      <div data-testid=\"nft-strip-skeleton\" className=\"grid grid-cols-4 gap-2\">\n        {Array.from({ length: 4 }).map((_, i) => (\n          <div key={i} className=\"aspect-square animate-pulse rounded-xl bg-foreground/[0.06]\" />\n        ))}\n      </div>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <p className=\"text-sm text-muted-foreground\">\n        No NFTs yet — mint or collect your first one to see it here.\n      </p>\n    );\n  }\n\n  return (\n    <div className=\"grid grid-cols-4 gap-2\">\n      {items.map((item) => {\n        const resolved = resolveImage(item.image);\n        return (\n          <Link\n            key={item.key}\n            href={item.href}\n            title={item.name}\n            onClick={onNavigate}\n            className=\"group relative aspect-square overflow-hidden rounded-xl bg-foreground/[0.06] transition-opacity hover:opacity-90\"\n          >\n            {resolved ? (\n              <Image\n                src={resolved}\n                alt={item.name}\n                fill\n                unoptimized\n                className=\"object-cover card-media\"\n              />\n            ) : (\n              <div className=\"grid h-full w-full place-items-center\">\n                <AssetFallbackIcon />\n              </div>\n            )}\n          </Link>\n        );\n      })}\n    </div>\n  );\n}\n\nfunction AssetFallbackIcon() {\n  return (\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"1.8\" className=\"text-muted-foreground\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\n      <rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"3\" />\n      <circle cx=\"9\" cy=\"9\" r=\"1.5\" fill=\"currentColor\" stroke=\"none\" />\n      <path d=\"M21 15l-5-5-9 9\" />\n    </svg>\n  );\n}\n"],"mappings":";AAqBU,cAgDN,YAhDM;AAnBV,OAAO,UAAU;AACjB,OAAO,WAAW;AAGX,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAKG;AACD,MAAI,WAAW;AACb,WACE,oBAAC,SAAI,eAAY,sBAAqB,WAAU,0BAC7C,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,oBAAC,SAAY,WAAU,iEAAb,CAA2E,CACtF,GACH;AAAA,EAEJ;AAEA,MAAI,MAAM,WAAW,GAAG;AACtB,WACE,oBAAC,OAAE,WAAU,iCAAgC,+EAE7C;AAAA,EAEJ;AAEA,SACE,oBAAC,SAAI,WAAU,0BACZ,gBAAM,IAAI,CAAC,SAAS;AACnB,UAAM,WAAW,aAAa,KAAK,KAAK;AACxC,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,MAAM,KAAK;AAAA,QACX,OAAO,KAAK;AAAA,QACZ,SAAS;AAAA,QACT,WAAU;AAAA,QAET,qBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK,KAAK;AAAA,YACV,MAAI;AAAA,YACJ,aAAW;AAAA,YACX,WAAU;AAAA;AAAA,QACZ,IAEA,oBAAC,SAAI,WAAU,yCACb,8BAAC,qBAAkB,GACrB;AAAA;AAAA,MAjBG,KAAK;AAAA,IAmBZ;AAAA,EAEJ,CAAC,GACH;AAEJ;AAEA,SAAS,oBAAoB;AAC3B,SACE,qBAAC,SAAI,OAAM,MAAK,QAAO,MAAK,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,OAAM,WAAU,yBAAwB,eAAc,SAAQ,gBAAe,SACzK;AAAA,wBAAC,UAAK,GAAE,KAAI,GAAE,KAAI,OAAM,MAAK,QAAO,MAAK,IAAG,KAAI;AAAA,IAChD,oBAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,OAAM,MAAK,gBAAe,QAAO,QAAO;AAAA,IAChE,oBAAC,UAAK,GAAE,mBAAkB;AAAA,KAC5B;AAEJ;","names":[]}

package/dist/components/remix-browse-page.cjs

@@ -87,7 +87,7 @@ function RemixableCard({ token }) {
             src: imageUrl,
             alt: name,
             fill: true,
-            className: "object-cover",
+            className: "object-cover card-media",
             onError: () => setImgError(true),
             unoptimized: true
           }

package/dist/components/remix-browse-page.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/remix-browse-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { useMedialaneClient } from \"../utils/use-medialane-client.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport type { ApiToken } from \"@medialane/sdk\";\nimport { GitBranch, ImageIcon, Inbox } from \"lucide-react\";\n\nconst PAGE_SIZE = 24;\n\nfunction useRemixableTokens() {\n  const client = useMedialaneClient();\n  const [tokens, setTokens] = useState<ApiToken[]>([]);\n  const [page, setPage] = useState(1);\n  const [isLoading, setIsLoading] = useState(true);\n  const [hasMore, setHasMore] = useState(false);\n  const [error, setError] = useState(false);\n\n  useEffect(() => {\n    let cancelled = false;\n    setIsLoading(true);\n    client.api.tokens.list({ derivatives: \"allowed\", limit: PAGE_SIZE, page })\n      .then((json) => {\n        if (cancelled) return;\n        setTokens((prev) => (page === 1 ? json.data : [...prev, ...json.data]));\n        setHasMore(page * PAGE_SIZE < (json.meta?.total ?? 0));\n      })\n      .catch(() => { if (!cancelled) setError(true); })\n      .finally(() => { if (!cancelled) setIsLoading(false); });\n    return () => { cancelled = true; };\n  }, [client, page]);\n\n  return { tokens, isLoading, hasMore, error, loadMore: () => setPage((p) => p + 1) };\n}\n\nfunction RemixableCard({ token }: { token: ApiToken }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(token.metadata?.image, { width: 480 });\n  const showImage = imageUrl && !imgError;\n  const name = token.metadata?.name ?? `#${token.tokenId}`;\n\n  return (\n    <Link\n      href={`/create/remix/${token.contractAddress}/${token.tokenId}`}\n      className=\"group flex flex-col rounded-2xl border border-border/60 bg-card overflow-hidden transition-colors sm:hover:border-brand-blue/50 active:scale-[0.99] motion-reduce:transform-none\"\n    >\n      <div className=\"relative aspect-square bg-muted overflow-hidden\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={name}\n            fill\n            className=\"object-cover\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 flex items-center justify-center\">\n            <ImageIcon className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n      <div className=\"p-4 space-y-1\">\n        <p className=\"font-semibold text-sm leading-tight truncate\">{name}</p>\n        <p className=\"text-xs text-muted-foreground\">\n          Derivatives: Allowed\n        </p>\n        <p className=\"text-xs font-semibold pt-1 inline-flex items-center gap-1.5\">\n          <GitBranch className=\"h-3 w-3\" />\n          Remix this work\n        </p>\n      </div>\n    </Link>\n  );\n}\n\nfunction RemixableCardSkeleton() {\n  return (\n    <div className=\"rounded-2xl border border-border/40 overflow-hidden\">\n      <Skeleton className=\"aspect-square rounded-none\" />\n      <div className=\"p-4 space-y-2\">\n        <Skeleton className=\"h-4 w-32\" />\n        <Skeleton className=\"h-3 w-24\" />\n      </div>\n    </div>\n  );\n}\n\nexport function RemixBrowsePage() {\n  const { tokens, isLoading, hasMore, error, loadMore } = useRemixableTokens();\n\n  return (\n    <div className=\"pb-16\">\n      <section className=\"px-4 pt-10 max-w-5xl mx-auto\">\n        <BackButton />\n        <FadeIn>\n          <div className=\"mt-6\">\n            <ServiceHeader\n              plain\n              icon={<GitBranch className=\"h-4 w-4 text-white\" />}\n              title=\"Remix\"\n              subtitle=\"Pick a work that is open to remixing. Attribution and royalties flow back to the original creator.\"\n            />\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 max-w-5xl mx-auto space-y-6\">\n        {isLoading && tokens.length === 0 ? (\n          <div className=\"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4\">\n            {Array.from({ length: 8 }).map((_, i) => (\n              <RemixableCardSkeleton key={i} />\n            ))}\n          </div>\n        ) : error && tokens.length === 0 ? (\n          <div className=\"bento-cell p-10 flex flex-col items-center gap-3 text-center\">\n            <p className=\"font-semibold\">Could not load works</p>\n            <p className=\"text-sm text-muted-foreground\">Check your connection and try again.</p>\n            <Button variant=\"outline\" size=\"sm\" onClick={() => location.reload()}>Retry</Button>\n          </div>\n        ) : tokens.length === 0 ? (\n          <FadeIn>\n            <div className=\"bento-cell p-10 flex flex-col items-center gap-4 text-center\">\n              <Inbox className=\"h-10 w-10 text-muted-foreground/30\" />\n              <div>\n                <p className=\"font-semibold\">No works open to remixing yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-sm\">\n                  Works appear here when their creator sets the license to allow derivatives.\n                </p>\n              </div>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <Stagger className=\"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4\">\n              {tokens.map((t) => (\n                <StaggerItem key={`${t.contractAddress}-${t.tokenId}`}>\n                  <RemixableCard token={t} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            {hasMore && (\n              <div className=\"flex justify-center\">\n                <Button variant=\"outline\" onClick={loadMore} disabled={isLoading}>\n                  {isLoading ? \"Loading…\" : \"Load more\"}\n                </Button>\n              </div>\n            )}\n          </>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":"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","names":["Link","Image"]}
+{"version":3,"sources":["../../src/components/remix-browse-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { useMedialaneClient } from \"../utils/use-medialane-client.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport type { ApiToken } from \"@medialane/sdk\";\nimport { GitBranch, ImageIcon, Inbox } from \"lucide-react\";\n\nconst PAGE_SIZE = 24;\n\nfunction useRemixableTokens() {\n  const client = useMedialaneClient();\n  const [tokens, setTokens] = useState<ApiToken[]>([]);\n  const [page, setPage] = useState(1);\n  const [isLoading, setIsLoading] = useState(true);\n  const [hasMore, setHasMore] = useState(false);\n  const [error, setError] = useState(false);\n\n  useEffect(() => {\n    let cancelled = false;\n    setIsLoading(true);\n    client.api.tokens.list({ derivatives: \"allowed\", limit: PAGE_SIZE, page })\n      .then((json) => {\n        if (cancelled) return;\n        setTokens((prev) => (page === 1 ? json.data : [...prev, ...json.data]));\n        setHasMore(page * PAGE_SIZE < (json.meta?.total ?? 0));\n      })\n      .catch(() => { if (!cancelled) setError(true); })\n      .finally(() => { if (!cancelled) setIsLoading(false); });\n    return () => { cancelled = true; };\n  }, [client, page]);\n\n  return { tokens, isLoading, hasMore, error, loadMore: () => setPage((p) => p + 1) };\n}\n\nfunction RemixableCard({ token }: { token: ApiToken }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(token.metadata?.image, { width: 480 });\n  const showImage = imageUrl && !imgError;\n  const name = token.metadata?.name ?? `#${token.tokenId}`;\n\n  return (\n    <Link\n      href={`/create/remix/${token.contractAddress}/${token.tokenId}`}\n      className=\"group flex flex-col rounded-2xl border border-border/60 bg-card overflow-hidden transition-colors sm:hover:border-brand-blue/50 active:scale-[0.99] motion-reduce:transform-none\"\n    >\n      <div className=\"relative aspect-square bg-muted overflow-hidden\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={name}\n            fill\n            className=\"object-cover card-media\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 flex items-center justify-center\">\n            <ImageIcon className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n      <div className=\"p-4 space-y-1\">\n        <p className=\"font-semibold text-sm leading-tight truncate\">{name}</p>\n        <p className=\"text-xs text-muted-foreground\">\n          Derivatives: Allowed\n        </p>\n        <p className=\"text-xs font-semibold pt-1 inline-flex items-center gap-1.5\">\n          <GitBranch className=\"h-3 w-3\" />\n          Remix this work\n        </p>\n      </div>\n    </Link>\n  );\n}\n\nfunction RemixableCardSkeleton() {\n  return (\n    <div className=\"rounded-2xl border border-border/40 overflow-hidden\">\n      <Skeleton className=\"aspect-square rounded-none\" />\n      <div className=\"p-4 space-y-2\">\n        <Skeleton className=\"h-4 w-32\" />\n        <Skeleton className=\"h-3 w-24\" />\n      </div>\n    </div>\n  );\n}\n\nexport function RemixBrowsePage() {\n  const { tokens, isLoading, hasMore, error, loadMore } = useRemixableTokens();\n\n  return (\n    <div className=\"pb-16\">\n      <section className=\"px-4 pt-10 max-w-5xl mx-auto\">\n        <BackButton />\n        <FadeIn>\n          <div className=\"mt-6\">\n            <ServiceHeader\n              plain\n              icon={<GitBranch className=\"h-4 w-4 text-white\" />}\n              title=\"Remix\"\n              subtitle=\"Pick a work that is open to remixing. Attribution and royalties flow back to the original creator.\"\n            />\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 max-w-5xl mx-auto space-y-6\">\n        {isLoading && tokens.length === 0 ? (\n          <div className=\"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4\">\n            {Array.from({ length: 8 }).map((_, i) => (\n              <RemixableCardSkeleton key={i} />\n            ))}\n          </div>\n        ) : error && tokens.length === 0 ? (\n          <div className=\"bento-cell p-10 flex flex-col items-center gap-3 text-center\">\n            <p className=\"font-semibold\">Could not load works</p>\n            <p className=\"text-sm text-muted-foreground\">Check your connection and try again.</p>\n            <Button variant=\"outline\" size=\"sm\" onClick={() => location.reload()}>Retry</Button>\n          </div>\n        ) : tokens.length === 0 ? (\n          <FadeIn>\n            <div className=\"bento-cell p-10 flex flex-col items-center gap-4 text-center\">\n              <Inbox className=\"h-10 w-10 text-muted-foreground/30\" />\n              <div>\n                <p className=\"font-semibold\">No works open to remixing yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-sm\">\n                  Works appear here when their creator sets the license to allow derivatives.\n                </p>\n              </div>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <Stagger className=\"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-4\">\n              {tokens.map((t) => (\n                <StaggerItem key={`${t.contractAddress}-${t.tokenId}`}>\n                  <RemixableCard token={t} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            {hasMore && (\n              <div className=\"flex justify-center\">\n                <Button variant=\"outline\" onClick={loadMore} disabled={isLoading}>\n                  {isLoading ? \"Loading…\" : \"Load more\"}\n                </Button>\n              </div>\n            )}\n          </>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuDU;AArDV,mBAAoC;AACpC,kBAAiB;AACjB,mBAAkB;AAClB,4BAA8B;AAC9B,yBAA2B;AAC3B,+BAA6C;AAC7C,sBAAyB;AACzB,oBAAuB;AACvB,kCAAmC;AACnC,2BAA4B;AAE5B,0BAA4C;AAE5C,MAAM,YAAY;AAElB,SAAS,qBAAqB;AAC5B,QAAM,aAAS,gDAAmB;AAClC,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAqB,CAAC,CAAC;AACnD,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC;AAClC,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,IAAI;AAC/C,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAC5C,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAS,KAAK;AAExC,8BAAU,MAAM;AACd,QAAI,YAAY;AAChB,iBAAa,IAAI;AACjB,WAAO,IAAI,OAAO,KAAK,EAAE,aAAa,WAAW,OAAO,WAAW,KAAK,CAAC,EACtE,KAAK,CAAC,SAAS;AACd,UAAI,UAAW;AACf,gBAAU,CAAC,SAAU,SAAS,IAAI,KAAK,OAAO,CAAC,GAAG,MAAM,GAAG,KAAK,IAAI,CAAE;AACtE,iBAAW,OAAO,aAAa,KAAK,MAAM,SAAS,EAAE;AAAA,IACvD,CAAC,EACA,MAAM,MAAM;AAAE,UAAI,CAAC,UAAW,UAAS,IAAI;AAAA,IAAG,CAAC,EAC/C,QAAQ,MAAM;AAAE,UAAI,CAAC,UAAW,cAAa,KAAK;AAAA,IAAG,CAAC;AACzD,WAAO,MAAM;AAAE,kBAAY;AAAA,IAAM;AAAA,EACnC,GAAG,CAAC,QAAQ,IAAI,CAAC;AAEjB,SAAO,EAAE,QAAQ,WAAW,SAAS,OAAO,UAAU,MAAM,QAAQ,CAAC,MAAM,IAAI,CAAC,EAAE;AACpF;AAEA,SAAS,cAAc,EAAE,MAAM,GAAwB;AACrD,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAC9C,QAAM,eAAW,kCAAY,EAAE,MAAM,UAAU,OAAO,EAAE,OAAO,IAAI,CAAC;AACpE,QAAM,YAAY,YAAY,CAAC;AAC/B,QAAM,OAAO,MAAM,UAAU,QAAQ,IAAI,MAAM,OAAO;AAEtD,SACE;AAAA,IAAC,YAAAA;AAAA,IAAA;AAAA,MACC,MAAM,iBAAiB,MAAM,eAAe,IAAI,MAAM,OAAO;AAAA,MAC7D,WAAU;AAAA,MAEV;AAAA,oDAAC,SAAI,WAAU,mDACZ,sBACC;AAAA,UAAC,aAAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK;AAAA,YACL,MAAI;AAAA,YACJ,WAAU;AAAA,YACV,SAAS,MAAM,YAAY,IAAI;AAAA,YAC/B,aAAW;AAAA;AAAA,QACb,IAEA,4CAAC,SAAI,WAAU,qDACb,sDAAC,iCAAU,WAAU,oCAAmC,GAC1D,GAEJ;AAAA,QACA,6CAAC,SAAI,WAAU,iBACb;AAAA,sDAAC,OAAE,WAAU,gDAAgD,gBAAK;AAAA,UAClE,4CAAC,OAAE,WAAU,iCAAgC,kCAE7C;AAAA,UACA,6CAAC,OAAE,WAAU,+DACX;AAAA,wDAAC,iCAAU,WAAU,WAAU;AAAA,YAAE;AAAA,aAEnC;AAAA,WACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,wBAAwB;AAC/B,SACE,6CAAC,SAAI,WAAU,uDACb;AAAA,gDAAC,4BAAS,WAAU,8BAA6B;AAAA,IACjD,6CAAC,SAAI,WAAU,iBACb;AAAA,kDAAC,4BAAS,WAAU,YAAW;AAAA,MAC/B,4CAAC,4BAAS,WAAU,YAAW;AAAA,OACjC;AAAA,KACF;AAEJ;AAEO,SAAS,kBAAkB;AAChC,QAAM,EAAE,QAAQ,WAAW,SAAS,OAAO,SAAS,IAAI,mBAAmB;AAE3E,SACE,6CAAC,SAAI,WAAU,SACb;AAAA,iDAAC,aAAQ,WAAU,gCACjB;AAAA,kDAAC,iCAAW;AAAA,MACZ,4CAAC,mCACC,sDAAC,SAAI,WAAU,QACb;AAAA,QAAC;AAAA;AAAA,UACC,OAAK;AAAA,UACL,MAAM,4CAAC,iCAAU,WAAU,sBAAqB;AAAA,UAChD,OAAM;AAAA,UACN,UAAS;AAAA;AAAA,MACX,GACF,GACF;AAAA,OACF;AAAA,IAEA,4CAAC,aAAQ,WAAU,yCAChB,uBAAa,OAAO,WAAW,IAC9B,4CAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,4CAAC,2BAA2B,CAAG,CAChC,GACH,IACE,SAAS,OAAO,WAAW,IAC7B,6CAAC,SAAI,WAAU,gEACb;AAAA,kDAAC,OAAE,WAAU,iBAAgB,kCAAoB;AAAA,MACjD,4CAAC,OAAE,WAAU,iCAAgC,kDAAoC;AAAA,MACjF,4CAAC,wBAAO,SAAQ,WAAU,MAAK,MAAK,SAAS,MAAM,SAAS,OAAO,GAAG,mBAAK;AAAA,OAC7E,IACE,OAAO,WAAW,IACpB,4CAAC,mCACC,uDAAC,SAAI,WAAU,gEACb;AAAA,kDAAC,6BAAM,WAAU,sCAAqC;AAAA,MACtD,6CAAC,SACC;AAAA,oDAAC,OAAE,WAAU,iBAAgB,2CAA6B;AAAA,QAC1D,4CAAC,OAAE,WAAU,+CAA8C,yFAE3D;AAAA,SACF;AAAA,OACF,GACF,IAEA,4EACE;AAAA,kDAAC,oCAAQ,WAAU,wDAChB,iBAAO,IAAI,CAAC,MACX,4CAAC,wCACC,sDAAC,iBAAc,OAAO,GAAG,KADT,GAAG,EAAE,eAAe,IAAI,EAAE,OAAO,EAEnD,CACD,GACH;AAAA,MACC,WACC,4CAAC,SAAI,WAAU,uBACb,sDAAC,wBAAO,SAAQ,WAAU,SAAS,UAAU,UAAU,WACpD,sBAAY,kBAAa,aAC5B,GACF;AAAA,OAEJ,GAEJ;AAAA,KACF;AAEJ;","names":["Link","Image"]}

package/dist/components/remix-browse-page.js

@@ -54,7 +54,7 @@ function RemixableCard({ token }) {
             src: imageUrl,
             alt: name,
             fill: true,
-            className: "object-cover",
+            className: "object-cover card-media",
             onError: () => setImgError(true),
             unoptimized: true
           }