@medialane/ui 0.99.1 → 0.100.1

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n  Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n  Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n  DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n  token: ApiToken;\n  isOwner?: boolean;\n  onList?: (token: ApiToken) => void;\n  onTransfer?: (token: ApiToken) => void;\n  onCancel?: (token: ApiToken) => void;\n  onBuy?: (token: ApiToken) => void;\n  onOffer?: (token: ApiToken) => void;\n  onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n  token,\n  isOwner = false,\n  onList,\n  onTransfer,\n  onCancel,\n  onBuy,\n  onOffer,\n  onReport,\n}: TokenCardProps) {\n  const name = token.metadata?.name || `Token #${token.tokenId}`;\n  const image = ipfsToHttp(token.metadata?.image);\n  const animationUrl = token.metadata?.animationUrl ?? null;\n  const ipType = token.metadata?.ipType;\n\n  // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n  const listingOrder = token.activeOrders?.find(\n    (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n  );\n\n  const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n  const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n  const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n  const chain = token.chain.toUpperCase() as Chain;\n  const live = isLivingRenderCollection(chain, token.contractAddress);\n  const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n  const collectionHref = buildCollectionHref(chain, token.contractAddress);\n  const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n  const handleBuy = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onBuy?.(token);\n  };\n\n  const handleOffer = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onOffer?.(token);\n  };\n\n  return (\n    <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n      {/* ── Clickable image + info ─────────────────────────────── */}\n      <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n        {/* Image */}\n        <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\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, 22vw\"\n            className=\"object-cover\"\n            fallback={\n              <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n                <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n              </div>\n            }\n          />\n\n          {/* Price chip — bottom right overlay */}\n          {listingOrder && (\n            <div className=\"absolute bottom-2 right-2 z-10\">\n              <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-[11px] font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n                <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n                {formatDisplayPrice(listingOrder.price.formatted)}\n                <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n              </span>\n            </div>\n          )}\n\n          {/* Indexing indicator */}\n          {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n\n        {/* Info */}\n        <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n          <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n          <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n            {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n            {creator ? (\n              <p className=\"text-[10px] tabular-nums text-muted-foreground/60 truncate\">\n                {creator.slice(0, 8)}…{creator.slice(-6)}\n              </p>\n            ) : token.metadata?.description ? (\n              <p className=\"text-[10px] text-muted-foreground truncate leading-snug\">\n                {token.metadata.description}\n              </p>\n            ) : null}\n          </div>\n        </div>\n      </Link>\n\n      {/* ── Action row ────────────────────────────────────────── */}\n      <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n        {/* Expand */}\n        <Link\n          href={assetHref}\n          className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n          title=\"View asset\"\n        >\n          <ArrowUpRight className=\"h-3.5 w-3.5\" />\n        </Link>\n\n        {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n        {isOwner ? (\n          listingOrder ? (\n            <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n              <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n              View\n            </Link>\n          ) : (\n            <button\n              className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n              onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n            >\n              <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n              List\n            </button>\n          )\n        ) : listingOrder ? (\n          <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\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={handleBuy}\n            >\n              <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n              Buy\n            </button>\n          </div>\n        ) : (\n          <button\n            className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n            onClick={handleOffer}\n          >\n            <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n            Offer\n          </button>\n        )}\n\n        {/* 3-dot menu */}\n        <DropdownMenu>\n          <DropdownMenuTrigger asChild>\n            <button\n              className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n              aria-label=\"More actions\"\n            >\n              <MoreHorizontal className=\"h-3.5 w-3.5\" />\n            </button>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n            <DropdownMenuItem asChild>\n              <Link href={assetHref} className=\"flex items-center gap-2\">\n                <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View asset\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            {isOwner ? (\n              <>\n                {!listingOrder && onList && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n                    onClick={() => onList(token)}\n                  >\n                    <Tag className=\"h-3.5 w-3.5\" />\n                    List\n                  </DropdownMenuItem>\n                )}\n                {onTransfer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2\"\n                    onClick={() => onTransfer(token)}\n                  >\n                    <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                    Transfer\n                  </DropdownMenuItem>\n                )}\n                {listingOrder && onCancel && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={() => onCancel(token)}\n                  >\n                    <XCircle className=\"h-3.5 w-3.5\" />\n                    Cancel listing\n                  </DropdownMenuItem>\n                )}\n              </>\n            ) : (\n              <>\n                {listingOrder && onBuy && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n                    onClick={handleBuy}\n                  >\n                    <Zap className=\"h-3.5 w-3.5\" />\n                    <span className=\"flex items-center gap-1\">\n                      Buy —\n                      <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n                      {formatDisplayPrice(listingOrder.price.formatted)}\n                    </span>\n                  </DropdownMenuItem>\n                )}\n                {onOffer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={handleOffer}\n                  >\n                    <HandCoins className=\"h-3.5 w-3.5\" />\n                    Make offer\n                  </DropdownMenuItem>\n                )}\n              </>\n            )}\n\n            <DropdownMenuItem asChild>\n              <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n                <GitBranch className=\"h-3.5 w-3.5\" />\n                Remix\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            <DropdownMenuItem asChild>\n              <Link href={collectionHref} className=\"flex items-center gap-2\">\n                <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View collection\n              </Link>\n            </DropdownMenuItem>\n\n            {(owner ?? creator) && (\n              <DropdownMenuItem asChild>\n                <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n                  <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                  View owner\n                </Link>\n              </DropdownMenuItem>\n            )}\n\n            {onReport && (\n              <>\n                <DropdownMenuSeparator />\n                <DropdownMenuItem\n                  className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n                  onClick={() => onReport(token)}\n                >\n                  <Flag className=\"h-3.5 w-3.5\" />\n                  Report\n                </DropdownMenuItem>\n              </>\n            )}\n\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </div>\n    </div>\n  );\n}\n\nexport function TokenCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n      <div className=\"px-3 pb-3 flex gap-1.5\">\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n        <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["buildAssetHref","buildCollectionHref","Link"]}
+{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n  Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n  Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n  DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n  token: ApiToken;\n  isOwner?: boolean;\n  onList?: (token: ApiToken) => void;\n  onTransfer?: (token: ApiToken) => void;\n  onCancel?: (token: ApiToken) => void;\n  onBuy?: (token: ApiToken) => void;\n  onOffer?: (token: ApiToken) => void;\n  onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n  token,\n  isOwner = false,\n  onList,\n  onTransfer,\n  onCancel,\n  onBuy,\n  onOffer,\n  onReport,\n}: TokenCardProps) {\n  const name = token.metadata?.name || `Token #${token.tokenId}`;\n  const image = ipfsToHttp(token.metadata?.image);\n  const animationUrl = token.metadata?.animationUrl ?? null;\n  const ipType = token.metadata?.ipType;\n\n  // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n  const listingOrder = token.activeOrders?.find(\n    (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n  );\n\n  const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n  const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n  const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n  const chain = token.chain.toUpperCase() as Chain;\n  const live = isLivingRenderCollection(chain, token.contractAddress);\n  const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n  const collectionHref = buildCollectionHref(chain, token.contractAddress);\n  const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n  const handleBuy = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onBuy?.(token);\n  };\n\n  const handleOffer = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onOffer?.(token);\n  };\n\n  return (\n    <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n      {/* ── Clickable image + info ─────────────────────────────── */}\n      <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n        {/* Image */}\n        <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\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, 22vw\"\n            className=\"object-cover\"\n            fallback={\n              <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n                <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n              </div>\n            }\n          />\n\n          {/* Price chip — bottom right overlay */}\n          {listingOrder && (\n            <div className=\"absolute bottom-2 right-2 z-10\">\n              <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n                <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n                {formatDisplayPrice(listingOrder.price.formatted)}\n                <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n              </span>\n            </div>\n          )}\n\n          {/* Indexing indicator */}\n          {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-2xs text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n\n        {/* Info */}\n        <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n          <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n          <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n            {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n            {creator ? (\n              <p className=\"text-2xs tabular-nums text-muted-foreground/60 truncate\">\n                {creator.slice(0, 8)}…{creator.slice(-6)}\n              </p>\n            ) : token.metadata?.description ? (\n              <p className=\"text-2xs text-muted-foreground truncate leading-snug\">\n                {token.metadata.description}\n              </p>\n            ) : null}\n          </div>\n        </div>\n      </Link>\n\n      {/* ── Action row ────────────────────────────────────────── */}\n      <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n        {/* Expand */}\n        <Link\n          href={assetHref}\n          className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n          title=\"View asset\"\n        >\n          <ArrowUpRight className=\"h-3.5 w-3.5\" />\n        </Link>\n\n        {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n        {isOwner ? (\n          listingOrder ? (\n            <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n              <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n              View\n            </Link>\n          ) : (\n            <button\n              className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n              onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n            >\n              <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n              List\n            </button>\n          )\n        ) : listingOrder ? (\n          <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\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={handleBuy}\n            >\n              <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n              Buy\n            </button>\n          </div>\n        ) : (\n          <button\n            className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n            onClick={handleOffer}\n          >\n            <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n            Offer\n          </button>\n        )}\n\n        {/* 3-dot menu */}\n        <DropdownMenu>\n          <DropdownMenuTrigger asChild>\n            <button\n              className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n              aria-label=\"More actions\"\n            >\n              <MoreHorizontal className=\"h-3.5 w-3.5\" />\n            </button>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n            <DropdownMenuItem asChild>\n              <Link href={assetHref} className=\"flex items-center gap-2\">\n                <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View asset\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            {isOwner ? (\n              <>\n                {!listingOrder && onList && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n                    onClick={() => onList(token)}\n                  >\n                    <Tag className=\"h-3.5 w-3.5\" />\n                    List\n                  </DropdownMenuItem>\n                )}\n                {onTransfer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2\"\n                    onClick={() => onTransfer(token)}\n                  >\n                    <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                    Transfer\n                  </DropdownMenuItem>\n                )}\n                {listingOrder && onCancel && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={() => onCancel(token)}\n                  >\n                    <XCircle className=\"h-3.5 w-3.5\" />\n                    Cancel listing\n                  </DropdownMenuItem>\n                )}\n              </>\n            ) : (\n              <>\n                {listingOrder && onBuy && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n                    onClick={handleBuy}\n                  >\n                    <Zap className=\"h-3.5 w-3.5\" />\n                    <span className=\"flex items-center gap-1\">\n                      Buy —\n                      <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n                      {formatDisplayPrice(listingOrder.price.formatted)}\n                    </span>\n                  </DropdownMenuItem>\n                )}\n                {onOffer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={handleOffer}\n                  >\n                    <HandCoins className=\"h-3.5 w-3.5\" />\n                    Make offer\n                  </DropdownMenuItem>\n                )}\n              </>\n            )}\n\n            <DropdownMenuItem asChild>\n              <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n                <GitBranch className=\"h-3.5 w-3.5\" />\n                Remix\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            <DropdownMenuItem asChild>\n              <Link href={collectionHref} className=\"flex items-center gap-2\">\n                <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View collection\n              </Link>\n            </DropdownMenuItem>\n\n            {(owner ?? creator) && (\n              <DropdownMenuItem asChild>\n                <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n                  <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                  View owner\n                </Link>\n              </DropdownMenuItem>\n            )}\n\n            {onReport && (\n              <>\n                <DropdownMenuSeparator />\n                <DropdownMenuItem\n                  className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n                  onClick={() => onReport(token)}\n                >\n                  <Flag className=\"h-3.5 w-3.5\" />\n                  Report\n                </DropdownMenuItem>\n              </>\n            )}\n\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </div>\n    </div>\n  );\n}\n\nexport function TokenCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n      <div className=\"px-3 pb-3 flex gap-1.5\">\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n        <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":["buildAssetHref","buildCollectionHref","Link"]}

package/dist/components/token-card.js

@@ -86,25 +86,25 @@ function TokenCard({
             ] }) })
           }
         ),
-        listingOrder && /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-[11px] font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm", children: [
+        listingOrder && /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm", children: [
           /* @__PURE__ */ jsx(CurrencyIcon, { symbol: listingOrder.price.currency ?? "", size: 10 }),
           formatDisplayPrice(listingOrder.price.formatted),
           /* @__PURE__ */ jsx("span", { className: "text-muted-foreground font-normal", children: listingOrder.price.currency })
         ] }) }),
         (token.metadataStatus === "PENDING" || token.metadataStatus === "FETCHING") && /* @__PURE__ */ jsxs("div", { className: "absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5", children: [
           /* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin text-white/70" }),
-          /* @__PURE__ */ jsx("span", { className: "text-[10px] text-white/70", children: "Indexing\u2026" })
+          /* @__PURE__ */ jsx("span", { className: "text-2xs text-white/70", children: "Indexing\u2026" })
         ] })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "px-3 pt-2.5 pb-4 flex-1", children: [
         /* @__PURE__ */ jsx("p", { className: "text-base font-bold line-clamp-2 leading-snug", children: name }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mt-1.5 flex-wrap", children: [
           ipType && /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm" }),
-          creator ? /* @__PURE__ */ jsxs("p", { className: "text-[10px] tabular-nums text-muted-foreground/60 truncate", children: [
+          creator ? /* @__PURE__ */ jsxs("p", { className: "text-2xs tabular-nums text-muted-foreground/60 truncate", children: [
             creator.slice(0, 8),
             "\u2026",
             creator.slice(-6)
-          ] }) : token.metadata?.description ? /* @__PURE__ */ jsx("p", { className: "text-[10px] text-muted-foreground truncate leading-snug", children: token.metadata.description }) : null
+          ] }) : token.metadata?.description ? /* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground truncate leading-snug", children: token.metadata.description }) : null
         ] })
       ] })
     ] }),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n  Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n  Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n  DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n  token: ApiToken;\n  isOwner?: boolean;\n  onList?: (token: ApiToken) => void;\n  onTransfer?: (token: ApiToken) => void;\n  onCancel?: (token: ApiToken) => void;\n  onBuy?: (token: ApiToken) => void;\n  onOffer?: (token: ApiToken) => void;\n  onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n  token,\n  isOwner = false,\n  onList,\n  onTransfer,\n  onCancel,\n  onBuy,\n  onOffer,\n  onReport,\n}: TokenCardProps) {\n  const name = token.metadata?.name || `Token #${token.tokenId}`;\n  const image = ipfsToHttp(token.metadata?.image);\n  const animationUrl = token.metadata?.animationUrl ?? null;\n  const ipType = token.metadata?.ipType;\n\n  // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n  const listingOrder = token.activeOrders?.find(\n    (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n  );\n\n  const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n  const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n  const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n  const chain = token.chain.toUpperCase() as Chain;\n  const live = isLivingRenderCollection(chain, token.contractAddress);\n  const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n  const collectionHref = buildCollectionHref(chain, token.contractAddress);\n  const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n  const handleBuy = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onBuy?.(token);\n  };\n\n  const handleOffer = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onOffer?.(token);\n  };\n\n  return (\n    <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n      {/* ── Clickable image + info ─────────────────────────────── */}\n      <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n        {/* Image */}\n        <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\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, 22vw\"\n            className=\"object-cover\"\n            fallback={\n              <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n                <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n              </div>\n            }\n          />\n\n          {/* Price chip — bottom right overlay */}\n          {listingOrder && (\n            <div className=\"absolute bottom-2 right-2 z-10\">\n              <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-[11px] font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n                <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n                {formatDisplayPrice(listingOrder.price.formatted)}\n                <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n              </span>\n            </div>\n          )}\n\n          {/* Indexing indicator */}\n          {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-[10px] text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n\n        {/* Info */}\n        <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n          <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n          <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n            {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n            {creator ? (\n              <p className=\"text-[10px] tabular-nums text-muted-foreground/60 truncate\">\n                {creator.slice(0, 8)}…{creator.slice(-6)}\n              </p>\n            ) : token.metadata?.description ? (\n              <p className=\"text-[10px] text-muted-foreground truncate leading-snug\">\n                {token.metadata.description}\n              </p>\n            ) : null}\n          </div>\n        </div>\n      </Link>\n\n      {/* ── Action row ────────────────────────────────────────── */}\n      <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n        {/* Expand */}\n        <Link\n          href={assetHref}\n          className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n          title=\"View asset\"\n        >\n          <ArrowUpRight className=\"h-3.5 w-3.5\" />\n        </Link>\n\n        {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n        {isOwner ? (\n          listingOrder ? (\n            <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n              <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n              View\n            </Link>\n          ) : (\n            <button\n              className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n              onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n            >\n              <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n              List\n            </button>\n          )\n        ) : listingOrder ? (\n          <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\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={handleBuy}\n            >\n              <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n              Buy\n            </button>\n          </div>\n        ) : (\n          <button\n            className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n            onClick={handleOffer}\n          >\n            <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n            Offer\n          </button>\n        )}\n\n        {/* 3-dot menu */}\n        <DropdownMenu>\n          <DropdownMenuTrigger asChild>\n            <button\n              className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n              aria-label=\"More actions\"\n            >\n              <MoreHorizontal className=\"h-3.5 w-3.5\" />\n            </button>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n            <DropdownMenuItem asChild>\n              <Link href={assetHref} className=\"flex items-center gap-2\">\n                <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View asset\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            {isOwner ? (\n              <>\n                {!listingOrder && onList && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n                    onClick={() => onList(token)}\n                  >\n                    <Tag className=\"h-3.5 w-3.5\" />\n                    List\n                  </DropdownMenuItem>\n                )}\n                {onTransfer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2\"\n                    onClick={() => onTransfer(token)}\n                  >\n                    <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                    Transfer\n                  </DropdownMenuItem>\n                )}\n                {listingOrder && onCancel && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={() => onCancel(token)}\n                  >\n                    <XCircle className=\"h-3.5 w-3.5\" />\n                    Cancel listing\n                  </DropdownMenuItem>\n                )}\n              </>\n            ) : (\n              <>\n                {listingOrder && onBuy && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n                    onClick={handleBuy}\n                  >\n                    <Zap className=\"h-3.5 w-3.5\" />\n                    <span className=\"flex items-center gap-1\">\n                      Buy —\n                      <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n                      {formatDisplayPrice(listingOrder.price.formatted)}\n                    </span>\n                  </DropdownMenuItem>\n                )}\n                {onOffer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={handleOffer}\n                  >\n                    <HandCoins className=\"h-3.5 w-3.5\" />\n                    Make offer\n                  </DropdownMenuItem>\n                )}\n              </>\n            )}\n\n            <DropdownMenuItem asChild>\n              <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n                <GitBranch className=\"h-3.5 w-3.5\" />\n                Remix\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            <DropdownMenuItem asChild>\n              <Link href={collectionHref} className=\"flex items-center gap-2\">\n                <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View collection\n              </Link>\n            </DropdownMenuItem>\n\n            {(owner ?? creator) && (\n              <DropdownMenuItem asChild>\n                <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n                  <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                  View owner\n                </Link>\n              </DropdownMenuItem>\n            )}\n\n            {onReport && (\n              <>\n                <DropdownMenuSeparator />\n                <DropdownMenuItem\n                  className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n                  onClick={() => onReport(token)}\n                >\n                  <Flag className=\"h-3.5 w-3.5\" />\n                  Report\n                </DropdownMenuItem>\n              </>\n            )}\n\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </div>\n    </div>\n  );\n}\n\nexport function TokenCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n      <div className=\"px-3 pb-3 flex gap-1.5\">\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n        <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n  Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n  Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n  DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n  DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n  token: ApiToken;\n  isOwner?: boolean;\n  onList?: (token: ApiToken) => void;\n  onTransfer?: (token: ApiToken) => void;\n  onCancel?: (token: ApiToken) => void;\n  onBuy?: (token: ApiToken) => void;\n  onOffer?: (token: ApiToken) => void;\n  onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n  token,\n  isOwner = false,\n  onList,\n  onTransfer,\n  onCancel,\n  onBuy,\n  onOffer,\n  onReport,\n}: TokenCardProps) {\n  const name = token.metadata?.name || `Token #${token.tokenId}`;\n  const image = ipfsToHttp(token.metadata?.image);\n  const animationUrl = token.metadata?.animationUrl ?? null;\n  const ipType = token.metadata?.ipType;\n\n  // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n  const listingOrder = token.activeOrders?.find(\n    (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n  );\n\n  const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n  const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n  const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n  const chain = token.chain.toUpperCase() as Chain;\n  const live = isLivingRenderCollection(chain, token.contractAddress);\n  const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n  const collectionHref = buildCollectionHref(chain, token.contractAddress);\n  const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n  const handleBuy = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onBuy?.(token);\n  };\n\n  const handleOffer = (e: React.MouseEvent) => {\n    e.preventDefault();\n    e.stopPropagation();\n    onOffer?.(token);\n  };\n\n  return (\n    <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n      {/* ── Clickable image + info ─────────────────────────────── */}\n      <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n        {/* Image */}\n        <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\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, 22vw\"\n            className=\"object-cover\"\n            fallback={\n              <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n                <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n              </div>\n            }\n          />\n\n          {/* Price chip — bottom right overlay */}\n          {listingOrder && (\n            <div className=\"absolute bottom-2 right-2 z-10\">\n              <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n                <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n                {formatDisplayPrice(listingOrder.price.formatted)}\n                <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n              </span>\n            </div>\n          )}\n\n          {/* Indexing indicator */}\n          {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n            <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n              <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n              <span className=\"text-2xs text-white/70\">Indexing…</span>\n            </div>\n          )}\n        </div>\n\n        {/* Info */}\n        <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n          <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n          <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n            {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n            {creator ? (\n              <p className=\"text-2xs tabular-nums text-muted-foreground/60 truncate\">\n                {creator.slice(0, 8)}…{creator.slice(-6)}\n              </p>\n            ) : token.metadata?.description ? (\n              <p className=\"text-2xs text-muted-foreground truncate leading-snug\">\n                {token.metadata.description}\n              </p>\n            ) : null}\n          </div>\n        </div>\n      </Link>\n\n      {/* ── Action row ────────────────────────────────────────── */}\n      <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n        {/* Expand */}\n        <Link\n          href={assetHref}\n          className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n          title=\"View asset\"\n        >\n          <ArrowUpRight className=\"h-3.5 w-3.5\" />\n        </Link>\n\n        {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n        {isOwner ? (\n          listingOrder ? (\n            <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n              <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n              View\n            </Link>\n          ) : (\n            <button\n              className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n              onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n            >\n              <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n              List\n            </button>\n          )\n        ) : listingOrder ? (\n          <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\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={handleBuy}\n            >\n              <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n              Buy\n            </button>\n          </div>\n        ) : (\n          <button\n            className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n            onClick={handleOffer}\n          >\n            <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n            Offer\n          </button>\n        )}\n\n        {/* 3-dot menu */}\n        <DropdownMenu>\n          <DropdownMenuTrigger asChild>\n            <button\n              className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n              aria-label=\"More actions\"\n            >\n              <MoreHorizontal className=\"h-3.5 w-3.5\" />\n            </button>\n          </DropdownMenuTrigger>\n          <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n            <DropdownMenuItem asChild>\n              <Link href={assetHref} className=\"flex items-center gap-2\">\n                <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View asset\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            {isOwner ? (\n              <>\n                {!listingOrder && onList && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n                    onClick={() => onList(token)}\n                  >\n                    <Tag className=\"h-3.5 w-3.5\" />\n                    List\n                  </DropdownMenuItem>\n                )}\n                {onTransfer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2\"\n                    onClick={() => onTransfer(token)}\n                  >\n                    <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                    Transfer\n                  </DropdownMenuItem>\n                )}\n                {listingOrder && onCancel && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={() => onCancel(token)}\n                  >\n                    <XCircle className=\"h-3.5 w-3.5\" />\n                    Cancel listing\n                  </DropdownMenuItem>\n                )}\n              </>\n            ) : (\n              <>\n                {listingOrder && onBuy && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n                    onClick={handleBuy}\n                  >\n                    <Zap className=\"h-3.5 w-3.5\" />\n                    <span className=\"flex items-center gap-1\">\n                      Buy —\n                      <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n                      {formatDisplayPrice(listingOrder.price.formatted)}\n                    </span>\n                  </DropdownMenuItem>\n                )}\n                {onOffer && (\n                  <DropdownMenuItem\n                    className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n                    onClick={handleOffer}\n                  >\n                    <HandCoins className=\"h-3.5 w-3.5\" />\n                    Make offer\n                  </DropdownMenuItem>\n                )}\n              </>\n            )}\n\n            <DropdownMenuItem asChild>\n              <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n                <GitBranch className=\"h-3.5 w-3.5\" />\n                Remix\n              </Link>\n            </DropdownMenuItem>\n\n            <DropdownMenuSeparator />\n\n            <DropdownMenuItem asChild>\n              <Link href={collectionHref} className=\"flex items-center gap-2\">\n                <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                View collection\n              </Link>\n            </DropdownMenuItem>\n\n            {(owner ?? creator) && (\n              <DropdownMenuItem asChild>\n                <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n                  <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n                  View owner\n                </Link>\n              </DropdownMenuItem>\n            )}\n\n            {onReport && (\n              <>\n                <DropdownMenuSeparator />\n                <DropdownMenuItem\n                  className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n                  onClick={() => onReport(token)}\n                >\n                  <Flag className=\"h-3.5 w-3.5\" />\n                  Report\n                </DropdownMenuItem>\n              </>\n            )}\n\n          </DropdownMenuContent>\n        </DropdownMenu>\n      </div>\n    </div>\n  );\n}\n\nexport function TokenCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n      <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n        <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n        <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n      </div>\n      <div className=\"px-3 pb-3 flex gap-1.5\">\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n        <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n        <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/data/brand.cjs

@@ -29,20 +29,6 @@ const BRAND = {
     from: "from-brand-blue/20",
     to: "to-brand-blue/20"
   },
-  electric: {
-    text: "text-brand-electric",
-    bg: "bg-brand-electric/10",
-    bgSolid: "bg-brand-electric/15",
-    from: "from-brand-electric/20",
-    to: "to-brand-electric/20"
-  },
-  indigo: {
-    text: "text-brand-indigo",
-    bg: "bg-brand-indigo/10",
-    bgSolid: "bg-brand-indigo/15",
-    from: "from-brand-indigo/20",
-    to: "to-brand-indigo/20"
-  },
   purple: {
     text: "text-brand-purple",
     bg: "bg-brand-purple/10",

package/dist/data/brand.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data/brand.ts"],"sourcesContent":["/**\n * Typed Tailwind class constants for Medialane brand colors.\n * Mirrors the brand color extensions defined in the Tailwind preset.\n * Keeping these as string literals ensures JIT picks them up via the\n * consumer's content scan of node_modules/@medialane/ui/dist.\n */\nexport const BRAND = {\n  blue: {\n    text:    \"text-brand-blue\",\n    bg:      \"bg-brand-blue/10\",\n    bgSolid: \"bg-brand-blue/15\",\n    from:    \"from-brand-blue/20\",\n    to:      \"to-brand-blue/20\",\n  },\n  electric: {\n    text:    \"text-brand-electric\",\n    bg:      \"bg-brand-electric/10\",\n    bgSolid: \"bg-brand-electric/15\",\n    from:    \"from-brand-electric/20\",\n    to:      \"to-brand-electric/20\",\n  },\n  indigo: {\n    text:    \"text-brand-indigo\",\n    bg:      \"bg-brand-indigo/10\",\n    bgSolid: \"bg-brand-indigo/15\",\n    from:    \"from-brand-indigo/20\",\n    to:      \"to-brand-indigo/20\",\n  },\n  purple: {\n    text:    \"text-brand-purple\",\n    bg:      \"bg-brand-purple/10\",\n    bgSolid: \"bg-brand-purple/15\",\n    from:    \"from-brand-purple/20\",\n    to:      \"to-brand-purple/20\",\n  },\n  rose: {\n    text:    \"text-brand-rose\",\n    bg:      \"bg-brand-rose/10\",\n    bgSolid: \"bg-brand-rose/15\",\n    from:    \"from-brand-rose/20\",\n    to:      \"to-brand-rose/20\",\n  },\n  orange: {\n    text:    \"text-brand-orange\",\n    bg:      \"bg-brand-orange/10\",\n    bgSolid: \"bg-brand-orange/15\",\n    from:    \"from-brand-orange/20\",\n    to:      \"to-brand-orange/20\",\n  },\n  price: {\n    text:    \"text-brand-price\",\n    bg:      \"bg-brand-price/10\",\n    bgSolid: \"bg-brand-price/15\",\n  },\n  navy: {\n    text:    \"text-brand-navy\",\n    bg:      \"bg-brand-navy/10\",\n    from:    \"from-brand-navy/10\",\n    to:      \"to-brand-navy/10\",\n  },\n} as const;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMO,MAAM,QAAQ;AAAA,EACnB,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AACF;","names":[]}
+{"version":3,"sources":["../../src/data/brand.ts"],"sourcesContent":["/**\n * Typed Tailwind class constants for Medialane brand colors.\n * Mirrors the brand color extensions defined in the Tailwind preset.\n * Keeping these as string literals ensures JIT picks them up via the\n * consumer's content scan of node_modules/@medialane/ui/dist.\n */\nexport const BRAND = {\n  blue: {\n    text:    \"text-brand-blue\",\n    bg:      \"bg-brand-blue/10\",\n    bgSolid: \"bg-brand-blue/15\",\n    from:    \"from-brand-blue/20\",\n    to:      \"to-brand-blue/20\",\n  },\n  purple: {\n    text:    \"text-brand-purple\",\n    bg:      \"bg-brand-purple/10\",\n    bgSolid: \"bg-brand-purple/15\",\n    from:    \"from-brand-purple/20\",\n    to:      \"to-brand-purple/20\",\n  },\n  rose: {\n    text:    \"text-brand-rose\",\n    bg:      \"bg-brand-rose/10\",\n    bgSolid: \"bg-brand-rose/15\",\n    from:    \"from-brand-rose/20\",\n    to:      \"to-brand-rose/20\",\n  },\n  orange: {\n    text:    \"text-brand-orange\",\n    bg:      \"bg-brand-orange/10\",\n    bgSolid: \"bg-brand-orange/15\",\n    from:    \"from-brand-orange/20\",\n    to:      \"to-brand-orange/20\",\n  },\n  price: {\n    text:    \"text-brand-price\",\n    bg:      \"bg-brand-price/10\",\n    bgSolid: \"bg-brand-price/15\",\n  },\n  navy: {\n    text:    \"text-brand-navy\",\n    bg:      \"bg-brand-navy/10\",\n    from:    \"from-brand-navy/10\",\n    to:      \"to-brand-navy/10\",\n  },\n} as const;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMO,MAAM,QAAQ;AAAA,EACnB,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AACF;","names":[]}

package/dist/data/brand.d.cts

@@ -12,20 +12,6 @@ declare const BRAND: {
         readonly from: "from-brand-blue/20";
         readonly to: "to-brand-blue/20";
     };
-    readonly electric: {
-        readonly text: "text-brand-electric";
-        readonly bg: "bg-brand-electric/10";
-        readonly bgSolid: "bg-brand-electric/15";
-        readonly from: "from-brand-electric/20";
-        readonly to: "to-brand-electric/20";
-    };
-    readonly indigo: {
-        readonly text: "text-brand-indigo";
-        readonly bg: "bg-brand-indigo/10";
-        readonly bgSolid: "bg-brand-indigo/15";
-        readonly from: "from-brand-indigo/20";
-        readonly to: "to-brand-indigo/20";
-    };
     readonly purple: {
         readonly text: "text-brand-purple";
         readonly bg: "bg-brand-purple/10";

package/dist/data/brand.d.ts

@@ -12,20 +12,6 @@ declare const BRAND: {
         readonly from: "from-brand-blue/20";
         readonly to: "to-brand-blue/20";
     };
-    readonly electric: {
-        readonly text: "text-brand-electric";
-        readonly bg: "bg-brand-electric/10";
-        readonly bgSolid: "bg-brand-electric/15";
-        readonly from: "from-brand-electric/20";
-        readonly to: "to-brand-electric/20";
-    };
-    readonly indigo: {
-        readonly text: "text-brand-indigo";
-        readonly bg: "bg-brand-indigo/10";
-        readonly bgSolid: "bg-brand-indigo/15";
-        readonly from: "from-brand-indigo/20";
-        readonly to: "to-brand-indigo/20";
-    };
     readonly purple: {
         readonly text: "text-brand-purple";
         readonly bg: "bg-brand-purple/10";

package/dist/data/brand.js

@@ -6,20 +6,6 @@ const BRAND = {
     from: "from-brand-blue/20",
     to: "to-brand-blue/20"
   },
-  electric: {
-    text: "text-brand-electric",
-    bg: "bg-brand-electric/10",
-    bgSolid: "bg-brand-electric/15",
-    from: "from-brand-electric/20",
-    to: "to-brand-electric/20"
-  },
-  indigo: {
-    text: "text-brand-indigo",
-    bg: "bg-brand-indigo/10",
-    bgSolid: "bg-brand-indigo/15",
-    from: "from-brand-indigo/20",
-    to: "to-brand-indigo/20"
-  },
   purple: {
     text: "text-brand-purple",
     bg: "bg-brand-purple/10",

package/dist/data/brand.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/data/brand.ts"],"sourcesContent":["/**\n * Typed Tailwind class constants for Medialane brand colors.\n * Mirrors the brand color extensions defined in the Tailwind preset.\n * Keeping these as string literals ensures JIT picks them up via the\n * consumer's content scan of node_modules/@medialane/ui/dist.\n */\nexport const BRAND = {\n  blue: {\n    text:    \"text-brand-blue\",\n    bg:      \"bg-brand-blue/10\",\n    bgSolid: \"bg-brand-blue/15\",\n    from:    \"from-brand-blue/20\",\n    to:      \"to-brand-blue/20\",\n  },\n  electric: {\n    text:    \"text-brand-electric\",\n    bg:      \"bg-brand-electric/10\",\n    bgSolid: \"bg-brand-electric/15\",\n    from:    \"from-brand-electric/20\",\n    to:      \"to-brand-electric/20\",\n  },\n  indigo: {\n    text:    \"text-brand-indigo\",\n    bg:      \"bg-brand-indigo/10\",\n    bgSolid: \"bg-brand-indigo/15\",\n    from:    \"from-brand-indigo/20\",\n    to:      \"to-brand-indigo/20\",\n  },\n  purple: {\n    text:    \"text-brand-purple\",\n    bg:      \"bg-brand-purple/10\",\n    bgSolid: \"bg-brand-purple/15\",\n    from:    \"from-brand-purple/20\",\n    to:      \"to-brand-purple/20\",\n  },\n  rose: {\n    text:    \"text-brand-rose\",\n    bg:      \"bg-brand-rose/10\",\n    bgSolid: \"bg-brand-rose/15\",\n    from:    \"from-brand-rose/20\",\n    to:      \"to-brand-rose/20\",\n  },\n  orange: {\n    text:    \"text-brand-orange\",\n    bg:      \"bg-brand-orange/10\",\n    bgSolid: \"bg-brand-orange/15\",\n    from:    \"from-brand-orange/20\",\n    to:      \"to-brand-orange/20\",\n  },\n  price: {\n    text:    \"text-brand-price\",\n    bg:      \"bg-brand-price/10\",\n    bgSolid: \"bg-brand-price/15\",\n  },\n  navy: {\n    text:    \"text-brand-navy\",\n    bg:      \"bg-brand-navy/10\",\n    from:    \"from-brand-navy/10\",\n    to:      \"to-brand-navy/10\",\n  },\n} as const;\n"],"mappings":"AAMO,MAAM,QAAQ;AAAA,EACnB,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,UAAU;AAAA,IACR,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AACF;","names":[]}
+{"version":3,"sources":["../../src/data/brand.ts"],"sourcesContent":["/**\n * Typed Tailwind class constants for Medialane brand colors.\n * Mirrors the brand color extensions defined in the Tailwind preset.\n * Keeping these as string literals ensures JIT picks them up via the\n * consumer's content scan of node_modules/@medialane/ui/dist.\n */\nexport const BRAND = {\n  blue: {\n    text:    \"text-brand-blue\",\n    bg:      \"bg-brand-blue/10\",\n    bgSolid: \"bg-brand-blue/15\",\n    from:    \"from-brand-blue/20\",\n    to:      \"to-brand-blue/20\",\n  },\n  purple: {\n    text:    \"text-brand-purple\",\n    bg:      \"bg-brand-purple/10\",\n    bgSolid: \"bg-brand-purple/15\",\n    from:    \"from-brand-purple/20\",\n    to:      \"to-brand-purple/20\",\n  },\n  rose: {\n    text:    \"text-brand-rose\",\n    bg:      \"bg-brand-rose/10\",\n    bgSolid: \"bg-brand-rose/15\",\n    from:    \"from-brand-rose/20\",\n    to:      \"to-brand-rose/20\",\n  },\n  orange: {\n    text:    \"text-brand-orange\",\n    bg:      \"bg-brand-orange/10\",\n    bgSolid: \"bg-brand-orange/15\",\n    from:    \"from-brand-orange/20\",\n    to:      \"to-brand-orange/20\",\n  },\n  price: {\n    text:    \"text-brand-price\",\n    bg:      \"bg-brand-price/10\",\n    bgSolid: \"bg-brand-price/15\",\n  },\n  navy: {\n    text:    \"text-brand-navy\",\n    bg:      \"bg-brand-navy/10\",\n    from:    \"from-brand-navy/10\",\n    to:      \"to-brand-navy/10\",\n  },\n} as const;\n"],"mappings":"AAMO,MAAM,QAAQ;AAAA,EACnB,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,QAAQ;AAAA,IACN,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,MAAS;AAAA,IACT,IAAS;AAAA,IACT,SAAS;AAAA,EACX;AAAA,EACA,MAAM;AAAA,IACJ,MAAS;AAAA,IACT,IAAS;AAAA,IACT,MAAS;AAAA,IACT,IAAS;AAAA,EACX;AACF;","names":[]}

package/dist/medialane.css

@@ -12,6 +12,10 @@
 .scrollbar-hide { scrollbar-width: none; }
 .scrollbar-hide::-webkit-scrollbar { display: none; }
 
+/* ── Safe-area insets (notched/home-indicator devices) ──────────────────── */
+.pb-safe { padding-bottom: max(env(safe-area-inset-bottom), 0px); }
+.pt-safe { padding-top: max(env(safe-area-inset-top), 0px); }
+
 /* ── Glass ────────────────────────────────────────────────────────────── */
 .glass {
   background: rgba(10, 14, 30, 0.60);

package/dist/preset/tailwind.cjs

@@ -25,14 +25,16 @@ const medialanePreset = {
   theme: {
     extend: {
       colors: {
-        "brand-blue": "#3b7bff",
-        "brand-electric": "#1a17ff",
-        "brand-indigo": "#5b4ce6",
-        "brand-purple": "#8a5cf6",
-        "brand-rose": "#f6608f",
-        "brand-orange": "#fb8b46",
-        "brand-price": "#f97316",
-        "brand-navy": "#0a0e1f"
+        // Each resolves via the app's own --brand-* CSS var when defined
+        // (medialane-io, medialane-starknet); the fallback keeps every
+        // color working standalone for any consumer that defines none
+        // (medialane-portal today, or a future app).
+        "brand-blue": "hsl(var(--brand-blue, 220 100% 62%))",
+        "brand-purple": "hsl(var(--brand-purple, 258 90% 66%))",
+        "brand-rose": "hsl(var(--brand-rose, 341 89% 67%))",
+        "brand-orange": "hsl(var(--brand-orange, 23 96% 63%))",
+        "brand-price": "hsl(var(--brand-price, 25 95% 53%))",
+        "brand-navy": "hsl(var(--brand-navy, 229 51% 8%))"
       },
       borderRadius: {
         brand: "11px"
@@ -41,6 +43,12 @@ const medialanePreset = {
         // Brand display face (headings). Apps define --font-display via
         // next/font (Urbanist); falls back to the body face when unset.
         display: ["var(--font-display)", "Urbanist", "Inter", "system-ui", "sans-serif"]
+      },
+      fontSize: {
+        // Floor for true micro-text (timestamps, counts) — nothing in the
+        // package should go below this. Everything else uses Tailwind's
+        // built-in scale (xs=12px and up).
+        "2xs": ["11px", { lineHeight: "14px" }]
       }
     }
   }

package/dist/preset/tailwind.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preset/tailwind.ts"],"sourcesContent":["import type { Config } from \"tailwindcss\";\n\nconst medialanePreset: Partial<Config> = {\n  theme: {\n    extend: {\n      colors: {\n        \"brand-blue\":     \"#3b7bff\",\n        \"brand-electric\": \"#1a17ff\",\n        \"brand-indigo\":   \"#5b4ce6\",\n        \"brand-purple\":   \"#8a5cf6\",\n        \"brand-rose\":     \"#f6608f\",\n        \"brand-orange\":   \"#fb8b46\",\n        \"brand-price\":    \"#f97316\",\n        \"brand-navy\":     \"#0a0e1f\",\n      },\n      borderRadius: {\n        brand: \"11px\",\n      },\n      fontFamily: {\n        // Brand display face (headings). Apps define --font-display via\n        // next/font (Urbanist); falls back to the body face when unset.\n        display: [\"var(--font-display)\", \"Urbanist\", \"Inter\", \"system-ui\", \"sans-serif\"],\n      },\n    },\n  },\n};\n\nexport default medialanePreset;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,MAAM,kBAAmC;AAAA,EACvC,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,QAAQ;AAAA,QACN,cAAkB;AAAA,QAClB,kBAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,eAAkB;AAAA,QAClB,cAAkB;AAAA,MACpB;AAAA,MACA,cAAc;AAAA,QACZ,OAAO;AAAA,MACT;AAAA,MACA,YAAY;AAAA;AAAA;AAAA,QAGV,SAAS,CAAC,uBAAuB,YAAY,SAAS,aAAa,YAAY;AAAA,MACjF;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAO,mBAAQ;","names":[]}
+{"version":3,"sources":["../../src/preset/tailwind.ts"],"sourcesContent":["import type { Config } from \"tailwindcss\";\n\nconst medialanePreset: Partial<Config> = {\n  theme: {\n    extend: {\n      colors: {\n        // Each resolves via the app's own --brand-* CSS var when defined\n        // (medialane-io, medialane-starknet); the fallback keeps every\n        // color working standalone for any consumer that defines none\n        // (medialane-portal today, or a future app).\n        \"brand-blue\":     \"hsl(var(--brand-blue, 220 100% 62%))\",\n        \"brand-purple\":   \"hsl(var(--brand-purple, 258 90% 66%))\",\n        \"brand-rose\":     \"hsl(var(--brand-rose, 341 89% 67%))\",\n        \"brand-orange\":   \"hsl(var(--brand-orange, 23 96% 63%))\",\n        \"brand-price\":    \"hsl(var(--brand-price, 25 95% 53%))\",\n        \"brand-navy\":     \"hsl(var(--brand-navy, 229 51% 8%))\",\n      },\n      borderRadius: {\n        brand: \"11px\",\n      },\n      fontFamily: {\n        // Brand display face (headings). Apps define --font-display via\n        // next/font (Urbanist); falls back to the body face when unset.\n        display: [\"var(--font-display)\", \"Urbanist\", \"Inter\", \"system-ui\", \"sans-serif\"],\n      },\n      fontSize: {\n        // Floor for true micro-text (timestamps, counts) — nothing in the\n        // package should go below this. Everything else uses Tailwind's\n        // built-in scale (xs=12px and up).\n        \"2xs\": [\"11px\", { lineHeight: \"14px\" }],\n      },\n    },\n  },\n};\n\nexport default medialanePreset;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,MAAM,kBAAmC;AAAA,EACvC,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAKN,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,eAAkB;AAAA,QAClB,cAAkB;AAAA,MACpB;AAAA,MACA,cAAc;AAAA,QACZ,OAAO;AAAA,MACT;AAAA,MACA,YAAY;AAAA;AAAA;AAAA,QAGV,SAAS,CAAC,uBAAuB,YAAY,SAAS,aAAa,YAAY;AAAA,MACjF;AAAA,MACA,UAAU;AAAA;AAAA;AAAA;AAAA,QAIR,OAAO,CAAC,QAAQ,EAAE,YAAY,OAAO,CAAC;AAAA,MACxC;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAO,mBAAQ;","names":[]}

package/dist/preset/tailwind.js

@@ -2,14 +2,16 @@ const medialanePreset = {
   theme: {
     extend: {
       colors: {
-        "brand-blue": "#3b7bff",
-        "brand-electric": "#1a17ff",
-        "brand-indigo": "#5b4ce6",
-        "brand-purple": "#8a5cf6",
-        "brand-rose": "#f6608f",
-        "brand-orange": "#fb8b46",
-        "brand-price": "#f97316",
-        "brand-navy": "#0a0e1f"
+        // Each resolves via the app's own --brand-* CSS var when defined
+        // (medialane-io, medialane-starknet); the fallback keeps every
+        // color working standalone for any consumer that defines none
+        // (medialane-portal today, or a future app).
+        "brand-blue": "hsl(var(--brand-blue, 220 100% 62%))",
+        "brand-purple": "hsl(var(--brand-purple, 258 90% 66%))",
+        "brand-rose": "hsl(var(--brand-rose, 341 89% 67%))",
+        "brand-orange": "hsl(var(--brand-orange, 23 96% 63%))",
+        "brand-price": "hsl(var(--brand-price, 25 95% 53%))",
+        "brand-navy": "hsl(var(--brand-navy, 229 51% 8%))"
       },
       borderRadius: {
         brand: "11px"
@@ -18,6 +20,12 @@ const medialanePreset = {
         // Brand display face (headings). Apps define --font-display via
         // next/font (Urbanist); falls back to the body face when unset.
         display: ["var(--font-display)", "Urbanist", "Inter", "system-ui", "sans-serif"]
+      },
+      fontSize: {
+        // Floor for true micro-text (timestamps, counts) — nothing in the
+        // package should go below this. Everything else uses Tailwind's
+        // built-in scale (xs=12px and up).
+        "2xs": ["11px", { lineHeight: "14px" }]
       }
     }
   }

package/dist/preset/tailwind.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preset/tailwind.ts"],"sourcesContent":["import type { Config } from \"tailwindcss\";\n\nconst medialanePreset: Partial<Config> = {\n  theme: {\n    extend: {\n      colors: {\n        \"brand-blue\":     \"#3b7bff\",\n        \"brand-electric\": \"#1a17ff\",\n        \"brand-indigo\":   \"#5b4ce6\",\n        \"brand-purple\":   \"#8a5cf6\",\n        \"brand-rose\":     \"#f6608f\",\n        \"brand-orange\":   \"#fb8b46\",\n        \"brand-price\":    \"#f97316\",\n        \"brand-navy\":     \"#0a0e1f\",\n      },\n      borderRadius: {\n        brand: \"11px\",\n      },\n      fontFamily: {\n        // Brand display face (headings). Apps define --font-display via\n        // next/font (Urbanist); falls back to the body face when unset.\n        display: [\"var(--font-display)\", \"Urbanist\", \"Inter\", \"system-ui\", \"sans-serif\"],\n      },\n    },\n  },\n};\n\nexport default medialanePreset;\n"],"mappings":"AAEA,MAAM,kBAAmC;AAAA,EACvC,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,QAAQ;AAAA,QACN,cAAkB;AAAA,QAClB,kBAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,eAAkB;AAAA,QAClB,cAAkB;AAAA,MACpB;AAAA,MACA,cAAc;AAAA,QACZ,OAAO;AAAA,MACT;AAAA,MACA,YAAY;AAAA;AAAA;AAAA,QAGV,SAAS,CAAC,uBAAuB,YAAY,SAAS,aAAa,YAAY;AAAA,MACjF;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAO,mBAAQ;","names":[]}
+{"version":3,"sources":["../../src/preset/tailwind.ts"],"sourcesContent":["import type { Config } from \"tailwindcss\";\n\nconst medialanePreset: Partial<Config> = {\n  theme: {\n    extend: {\n      colors: {\n        // Each resolves via the app's own --brand-* CSS var when defined\n        // (medialane-io, medialane-starknet); the fallback keeps every\n        // color working standalone for any consumer that defines none\n        // (medialane-portal today, or a future app).\n        \"brand-blue\":     \"hsl(var(--brand-blue, 220 100% 62%))\",\n        \"brand-purple\":   \"hsl(var(--brand-purple, 258 90% 66%))\",\n        \"brand-rose\":     \"hsl(var(--brand-rose, 341 89% 67%))\",\n        \"brand-orange\":   \"hsl(var(--brand-orange, 23 96% 63%))\",\n        \"brand-price\":    \"hsl(var(--brand-price, 25 95% 53%))\",\n        \"brand-navy\":     \"hsl(var(--brand-navy, 229 51% 8%))\",\n      },\n      borderRadius: {\n        brand: \"11px\",\n      },\n      fontFamily: {\n        // Brand display face (headings). Apps define --font-display via\n        // next/font (Urbanist); falls back to the body face when unset.\n        display: [\"var(--font-display)\", \"Urbanist\", \"Inter\", \"system-ui\", \"sans-serif\"],\n      },\n      fontSize: {\n        // Floor for true micro-text (timestamps, counts) — nothing in the\n        // package should go below this. Everything else uses Tailwind's\n        // built-in scale (xs=12px and up).\n        \"2xs\": [\"11px\", { lineHeight: \"14px\" }],\n      },\n    },\n  },\n};\n\nexport default medialanePreset;\n"],"mappings":"AAEA,MAAM,kBAAmC;AAAA,EACvC,OAAO;AAAA,IACL,QAAQ;AAAA,MACN,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA,QAKN,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,cAAkB;AAAA,QAClB,gBAAkB;AAAA,QAClB,eAAkB;AAAA,QAClB,cAAkB;AAAA,MACpB;AAAA,MACA,cAAc;AAAA,QACZ,OAAO;AAAA,MACT;AAAA,MACA,YAAY;AAAA;AAAA;AAAA,QAGV,SAAS,CAAC,uBAAuB,YAAY,SAAS,aAAa,YAAY;AAAA,MACjF;AAAA,MACA,UAAU;AAAA;AAAA;AAAA;AAAA,QAIR,OAAO,CAAC,QAAQ,EAAE,YAAY,OAAO,CAAC;AAAA,MACxC;AAAA,IACF;AAAA,EACF;AACF;AAEA,IAAO,mBAAQ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@medialane/ui",
-  "version": "0.99.1",
+  "version": "0.100.1",
   "description": "Shared UI components for Medialane apps",
   "type": "module",
   "sideEffects": false,
@@ -45,7 +45,8 @@
   "scripts": {
     "build": "tsup",
     "dev": "tsup --watch",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "preview": "vite --config preview/vite.config.ts"
   },
   "peerDependencies": {
     "@medialane/sdk": ">=0.73.0",
@@ -67,6 +68,7 @@
     "@types/bun": "^1.3.14",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^6.0.5",
     "clsx": "^2.0.0",
     "cmdk": "^1.1.1",
     "framer-motion": "^11.0.0",
@@ -80,6 +82,7 @@
     "tailwind-merge": "^2.0.0",
     "tailwindcss": "^3.0.0",
     "tsup": "^8.0.0",
-    "typescript": "^5.6.0"
+    "typescript": "^5.6.0",
+    "vite": "^8.2.1"
   }
 }