@medialane/ui 0.309.0 → 0.311.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/collection-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Loader2, Settings2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport type { ApiCollection } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nfunction parseFloorPrice(floor: string | null | undefined): { amount: string; symbol: string } | null {\n  if (!floor) return null;\n  const formatted = formatDisplayPrice(floor);\n  const parts = formatted.trim().split(/\\s+/);\n  if (parts.length < 2) return null;\n  const symbol = parts[parts.length - 1];\n  const amount = parts.slice(0, -1).join(\" \");\n  return { amount, symbol };\n}\n\nexport interface CollectionCardProps {\n  collection: ApiCollection;\n\n  href?: string;\n\n  settingsHref?: string;\n  className?: string;\n}\n\nexport function CollectionCard({ collection, href, settingsHref, className }: CollectionCardProps) {\n  const resolveImage = useImageUrl();\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = resolveImage(collection.image, { width: 480 });\n  const showImage = imageUrl && !imgError;\n  const floor = parseFloorPrice(collection.floorPrice);\n\n  return (\n    <MotionCard className={cn(\"card-base group relative\", className)}>\n      {settingsHref && (\n        <Link\n          href={settingsHref}\n          onClick={(e) => e.stopPropagation()}\n          className=\"absolute top-2 right-2 z-10 min-h-11 min-w-11 rounded-full flex items-center justify-center\"\n          aria-label=\"Collection settings\"\n        >\n          <span className=\"flex h-7 w-7 items-center justify-center rounded-full bg-black/40 backdrop-blur-sm text-white/70 hover:text-white hover:bg-black/60 transition-colors\">\n            <Settings2 className=\"h-3.5 w-3.5\" />\n          </span>\n        </Link>\n      )}\n\n      <Link href={href ?? `/collections/${collection.contractAddress}`} className=\"block relative h-full\">\n        <div className=\"relative aspect-square w-full overflow-hidden bg-muted\">\n          {showImage ? (\n            <Image\n              src={imageUrl}\n              alt={collection.name ?? \"Collection\"}\n              fill\n              className=\"object-cover transition-transform duration-500 group-hover:scale-105\"\n              onError={() => setImgError(true)}\n              unoptimized\n            />\n          ) : (\n            <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/30 via-brand-blue/20 to-brand-navy/40\" />\n          )}\n\n          <div className=\"absolute inset-x-2 bottom-2 flex flex-col items-start gap-1\">\n            {!collection.name && collection.metadataStatus === \"PENDING\" ? (\n              <span className=\"flex items-center gap-1 rounded-full px-2.5 py-1 text-2xs text-white bg-black/30 backdrop-blur-md\">\n                <Loader2 className=\"h-2.5 w-2.5 animate-spin\" />\n                Indexing…\n              </span>\n            ) : (\n              <p className=\"max-w-full truncate rounded-full px-3 py-1 text-sm font-bold leading-tight text-white bg-black/30 backdrop-blur-md\">\n                {collection.name ?? \"Unnamed Collection\"}\n              </p>\n            )}\n\n            {(collection.totalSupply != null || floor) && (\n              <div className=\"flex flex-wrap items-center gap-1\">\n                {collection.totalSupply != null && (\n                  <span className=\"rounded-full px-2.5 py-1 text-2xs font-medium text-white bg-black/30 backdrop-blur-md\">\n                    {collection.totalSupply.toLocaleString()}\n                  </span>\n                )}\n                {floor && (\n                  <span className=\"inline-flex items-center gap-1 rounded-full px-2.5 py-1 text-2xs font-bold text-white bg-black/30 backdrop-blur-md\">\n                    Floor\n                    <CurrencyIcon symbol={floor.symbol} size={10} />\n                    {floor.amount}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function CollectionCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"relative aspect-square w-full overflow-hidden bg-muted\">\n        <div className=\"absolute inset-0 animate-pulse bg-muted\" />\n        <div className=\"absolute bottom-3 left-3 right-3 space-y-1.5\">\n          <div className=\"h-4 w-2/3 rounded-md bg-muted-foreground/20 animate-pulse\" />\n          <div className=\"h-3 w-1/3 rounded-md bg-muted-foreground/20 animate-pulse\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAiDY,cAsBE,YAtBF;AA/CZ,SAAS,gBAAgB;AACzB,OAAO,UAAU;AACjB,OAAO,WAAW;AAClB,SAAS,SAAS,iBAAiB;AACnC,SAAS,UAAU;AACnB,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAE7B,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB,OAA6E;AACpG,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,YAAY,mBAAmB,KAAK;AAC1C,QAAM,QAAQ,UAAU,KAAK,EAAE,MAAM,KAAK;AAC1C,MAAI,MAAM,SAAS,EAAG,QAAO;AAC7B,QAAM,SAAS,MAAM,MAAM,SAAS,CAAC;AACrC,QAAM,SAAS,MAAM,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG;AAC1C,SAAO,EAAE,QAAQ,OAAO;AAC1B;AAWO,SAAS,eAAe,EAAE,YAAY,MAAM,cAAc,UAAU,GAAwB;AACjG,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,aAAa,WAAW,OAAO,EAAE,OAAO,IAAI,CAAC;AAC9D,QAAM,YAAY,YAAY,CAAC;AAC/B,QAAM,QAAQ,gBAAgB,WAAW,UAAU;AAEnD,SACE,qBAAC,cAAW,WAAW,GAAG,4BAA4B,SAAS,GAC5D;AAAA,oBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC,WAAU;AAAA,QACV,cAAW;AAAA,QAEX,8BAAC,UAAK,WAAU,yJACd,8BAAC,aAAU,WAAU,eAAc,GACrC;AAAA;AAAA,IACF;AAAA,IAGF,oBAAC,QAAK,MAAM,QAAQ,gBAAgB,WAAW,eAAe,IAAI,WAAU,yBAC1E,+BAAC,SAAI,WAAU,0DACZ;AAAA,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,KAAK,WAAW,QAAQ;AAAA,UACxB,MAAI;AAAA,UACJ,WAAU;AAAA,UACV,SAAS,MAAM,YAAY,IAAI;AAAA,UAC/B,aAAW;AAAA;AAAA,MACb,IAEA,oBAAC,SAAI,WAAU,8FAA6F;AAAA,MAG9G,qBAAC,SAAI,WAAU,+DACZ;AAAA,SAAC,WAAW,QAAQ,WAAW,mBAAmB,YACjD,qBAAC,UAAK,WAAU,qGACd;AAAA,8BAAC,WAAQ,WAAU,4BAA2B;AAAA,UAAE;AAAA,WAElD,IAEA,oBAAC,OAAE,WAAU,sHACV,qBAAW,QAAQ,sBACtB;AAAA,SAGA,WAAW,eAAe,QAAQ,UAClC,qBAAC,SAAI,WAAU,qCACZ;AAAA,qBAAW,eAAe,QACzB,oBAAC,UAAK,WAAU,yFACb,qBAAW,YAAY,eAAe,GACzC;AAAA,UAED,SACC,qBAAC,UAAK,WAAU,sHAAqH;AAAA;AAAA,YAEnI,oBAAC,gBAAa,QAAQ,MAAM,QAAQ,MAAM,IAAI;AAAA,YAC7C,MAAM;AAAA,aACT;AAAA,WAEJ;AAAA,SAEJ;AAAA,OACF,GACF;AAAA,KACF;AAEJ;AAEO,SAAS,yBAAyB;AACvC,SACE,oBAAC,SAAI,WAAU,6BACb,+BAAC,SAAI,WAAU,0DACb;AAAA,wBAAC,SAAI,WAAU,2CAA0C;AAAA,IACzD,qBAAC,SAAI,WAAU,gDACb;AAAA,0BAAC,SAAI,WAAU,6DAA4D;AAAA,MAC3E,oBAAC,SAAI,WAAU,6DAA4D;AAAA,OAC7E;AAAA,KACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/collection-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Loader2, Settings2 } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { MotionCard } from \"./motion-primitives.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport type { ApiCollection } from \"@medialane/sdk\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\n\nfunction parseFloorPrice(floor: string | null | undefined): { amount: string; symbol: string } | null {\n  if (!floor) return null;\n  const formatted = formatDisplayPrice(floor);\n  const parts = formatted.trim().split(/\\s+/);\n  if (parts.length < 2) return null;\n  const symbol = parts[parts.length - 1];\n  const amount = parts.slice(0, -1).join(\" \");\n  return { amount, symbol };\n}\n\nexport interface CollectionCardProps {\n  collection: ApiCollection;\n\n  href?: string;\n\n  settingsHref?: string;\n  className?: string;\n}\n\nexport function CollectionCard({ collection, href, settingsHref, className }: CollectionCardProps) {\n  const resolveImage = useImageUrl();\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = resolveImage(collection.image, { width: 480 });\n  const showImage = imageUrl && !imgError;\n  const floor = parseFloorPrice(collection.floorPrice);\n\n  return (\n    <MotionCard className={cn(\"card-base group relative\", className)}>\n      {settingsHref && (\n        <Link\n          href={settingsHref}\n          onClick={(e) => e.stopPropagation()}\n          className=\"absolute top-2 right-2 z-10 min-h-11 min-w-11 rounded-full flex items-center justify-center\"\n          aria-label=\"Collection settings\"\n        >\n          <span className=\"flex h-7 w-7 items-center justify-center rounded-full bg-black/40 backdrop-blur-sm text-white/70 hover:text-white hover:bg-black/60 transition-colors\">\n            <Settings2 className=\"h-3.5 w-3.5\" />\n          </span>\n        </Link>\n      )}\n\n      <Link href={href ?? `/collections/${collection.contractAddress}`} className=\"block relative h-full\">\n        <div className=\"relative aspect-square w-full overflow-hidden bg-muted\">\n          {showImage ? (\n            <Image\n              src={imageUrl}\n              alt={collection.name ?? \"Collection\"}\n              fill\n              className=\"object-cover card-media\"\n              onError={() => setImgError(true)}\n              unoptimized\n            />\n          ) : (\n            <div className=\"absolute inset-0 bg-gradient-to-br from-brand-purple/30 via-brand-blue/20 to-brand-navy/40\" />\n          )}\n\n          <div className=\"absolute inset-x-2 bottom-2 flex flex-col items-start gap-1\">\n            {!collection.name && collection.metadataStatus === \"PENDING\" ? (\n              <span className=\"flex items-center gap-1 rounded-full px-2.5 py-1 text-2xs text-white bg-black/30 backdrop-blur-md\">\n                <Loader2 className=\"h-2.5 w-2.5 animate-spin\" />\n                Indexing…\n              </span>\n            ) : (\n              <p className=\"max-w-full truncate rounded-full px-3 py-1 text-sm font-bold leading-tight text-white bg-black/30 backdrop-blur-md\">\n                {collection.name ?? \"Unnamed Collection\"}\n              </p>\n            )}\n\n            {(collection.totalSupply != null || floor) && (\n              <div className=\"flex flex-wrap items-center gap-1\">\n                {collection.totalSupply != null && (\n                  <span className=\"rounded-full px-2.5 py-1 text-2xs font-medium text-white bg-black/30 backdrop-blur-md\">\n                    {collection.totalSupply.toLocaleString()}\n                  </span>\n                )}\n                {floor && (\n                  <span className=\"inline-flex items-center gap-1 rounded-full px-2.5 py-1 text-2xs font-bold text-white bg-black/30 backdrop-blur-md\">\n                    Floor\n                    <CurrencyIcon symbol={floor.symbol} size={10} />\n                    {floor.amount}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n        </div>\n      </Link>\n    </MotionCard>\n  );\n}\n\nexport function CollectionCardSkeleton() {\n  return (\n    <div className=\"card-base overflow-hidden\">\n      <div className=\"relative aspect-square w-full overflow-hidden bg-muted\">\n        <div className=\"absolute inset-0 animate-pulse bg-muted\" />\n        <div className=\"absolute bottom-3 left-3 right-3 space-y-1.5\">\n          <div className=\"h-4 w-2/3 rounded-md bg-muted-foreground/20 animate-pulse\" />\n          <div className=\"h-3 w-1/3 rounded-md bg-muted-foreground/20 animate-pulse\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AAiDY,cAsBE,YAtBF;AA/CZ,SAAS,gBAAgB;AACzB,OAAO,UAAU;AACjB,OAAO,WAAW;AAClB,SAAS,SAAS,iBAAiB;AACnC,SAAS,UAAU;AACnB,SAAS,0BAA0B;AACnC,SAAS,kBAAkB;AAC3B,SAAS,oBAAoB;AAE7B,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB,OAA6E;AACpG,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,YAAY,mBAAmB,KAAK;AAC1C,QAAM,QAAQ,UAAU,KAAK,EAAE,MAAM,KAAK;AAC1C,MAAI,MAAM,SAAS,EAAG,QAAO;AAC7B,QAAM,SAAS,MAAM,MAAM,SAAS,CAAC;AACrC,QAAM,SAAS,MAAM,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG;AAC1C,SAAO,EAAE,QAAQ,OAAO;AAC1B;AAWO,SAAS,eAAe,EAAE,YAAY,MAAM,cAAc,UAAU,GAAwB;AACjG,QAAM,eAAe,YAAY;AACjC,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,QAAM,WAAW,aAAa,WAAW,OAAO,EAAE,OAAO,IAAI,CAAC;AAC9D,QAAM,YAAY,YAAY,CAAC;AAC/B,QAAM,QAAQ,gBAAgB,WAAW,UAAU;AAEnD,SACE,qBAAC,cAAW,WAAW,GAAG,4BAA4B,SAAS,GAC5D;AAAA,oBACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAM;AAAA,QACN,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,QAClC,WAAU;AAAA,QACV,cAAW;AAAA,QAEX,8BAAC,UAAK,WAAU,yJACd,8BAAC,aAAU,WAAU,eAAc,GACrC;AAAA;AAAA,IACF;AAAA,IAGF,oBAAC,QAAK,MAAM,QAAQ,gBAAgB,WAAW,eAAe,IAAI,WAAU,yBAC1E,+BAAC,SAAI,WAAU,0DACZ;AAAA,kBACC;AAAA,QAAC;AAAA;AAAA,UACC,KAAK;AAAA,UACL,KAAK,WAAW,QAAQ;AAAA,UACxB,MAAI;AAAA,UACJ,WAAU;AAAA,UACV,SAAS,MAAM,YAAY,IAAI;AAAA,UAC/B,aAAW;AAAA;AAAA,MACb,IAEA,oBAAC,SAAI,WAAU,8FAA6F;AAAA,MAG9G,qBAAC,SAAI,WAAU,+DACZ;AAAA,SAAC,WAAW,QAAQ,WAAW,mBAAmB,YACjD,qBAAC,UAAK,WAAU,qGACd;AAAA,8BAAC,WAAQ,WAAU,4BAA2B;AAAA,UAAE;AAAA,WAElD,IAEA,oBAAC,OAAE,WAAU,sHACV,qBAAW,QAAQ,sBACtB;AAAA,SAGA,WAAW,eAAe,QAAQ,UAClC,qBAAC,SAAI,WAAU,qCACZ;AAAA,qBAAW,eAAe,QACzB,oBAAC,UAAK,WAAU,yFACb,qBAAW,YAAY,eAAe,GACzC;AAAA,UAED,SACC,qBAAC,UAAK,WAAU,sHAAqH;AAAA;AAAA,YAEnI,oBAAC,gBAAa,QAAQ,MAAM,QAAQ,MAAM,IAAI;AAAA,YAC7C,MAAM;AAAA,aACT;AAAA,WAEJ;AAAA,SAEJ;AAAA,OACF,GACF;AAAA,KACF;AAEJ;AAEO,SAAS,yBAAyB;AACvC,SACE,oBAAC,SAAI,WAAU,6BACb,+BAAC,SAAI,WAAU,0DACb;AAAA,wBAAC,SAAI,WAAU,2CAA0C;AAAA,IACzD,qBAAC,SAAI,WAAU,gDACb;AAAA,0BAAC,SAAI,WAAU,6DAA4D;AAAA,MAC3E,oBAAC,SAAI,WAAU,6DAA4D;AAAA,OAC7E;AAAA,KACF,GACF;AAEJ;","names":[]}

package/dist/components/creators-page.cjs

@@ -66,7 +66,7 @@ function CreatorCard({ creator }) {
     import_link.default,
     {
       href: (0, import_sdk.profileHref)({ username: creator.username, address: creator.walletAddress }),
-      className: "block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none",
+      className: "group block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none",
       children: [
         resolvedImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           import_image.default,
@@ -76,7 +76,7 @@ function CreatorCard({ creator }) {
             "aria-hidden": true,
             fill: true,
             sizes: "(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw",
-            className: "absolute inset-0 w-full h-full object-cover",
+            className: "absolute inset-0 w-full h-full object-cover card-media",
             unoptimized: true
           }
         ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0", style: { background: fallbackGradient } }),

package/dist/components/creators-page.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/creators-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useRef, useEffect } from \"react\";\nimport { profileHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Input } from \"./input.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { BRAND } from \"../data/brand.js\";\nimport { useCreators } from \"../utils/use-creators.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { Search, Users, Palette, Globe, Twitter, X } from \"lucide-react\";\nimport type { ApiCreatorProfile } from \"@medialane/sdk\";\n\nfunction CreatorCard({ creator }: { creator: ApiCreatorProfile }) {\n  const resolveImage = useImageUrl();\n  const avatarUrl = resolveImage(creator.avatarImage);\n  const { identity, name } = profileIdentity({\n    username: creator.username,\n    name: creator.name,\n    walletAddress: creator.walletAddress,\n  });\n\n  const hue = (creator.username ?? \"a\").split(\"\").reduce((acc, c) => acc + c.charCodeAt(0), 0) % 360;\n  const hue2 = (hue + 60) % 360;\n  const fallbackGradient = `linear-gradient(135deg, hsl(${hue},55%,35%), hsl(${hue2},50%,22%))`;\n\n  const { collections } = useCollectionsByOwner(!avatarUrl ? creator.walletAddress : null);\n  const fallbackImage = resolveImage(collections[0]?.image);\n\n  const resolvedImage = avatarUrl ?? fallbackImage;\n\n  return (\n    <Link\n      href={profileHref({ username: creator.username, address: creator.walletAddress })}\n      className=\"block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none\"\n    >\n\n      {resolvedImage ? (\n        <Image\n          src={resolvedImage}\n          alt=\"\"\n          aria-hidden\n          fill\n          sizes=\"(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw\"\n          className=\"absolute inset-0 w-full h-full object-cover\"\n          unoptimized\n        />\n      ) : (\n        <div className=\"absolute inset-0\" style={{ background: fallbackGradient }} />\n      )}\n\n      <div className=\"absolute inset-0 bg-gradient-to-t from-black/90 via-black/20 to-transparent\" />\n\n      {(creator.twitterUrl || creator.websiteUrl) && (\n        <div className=\"absolute top-3 right-3 flex items-center gap-1.5 z-10\">\n          {creator.twitterUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Twitter className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n          {creator.websiteUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Globe className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n        </div>\n      )}\n\n      <div className=\"absolute bottom-0 inset-x-0 p-4 space-y-2.5 z-10\">\n\n        <div\n          className=\"h-11 w-11 rounded-full ring-2 ring-white/20 overflow-hidden flex items-center justify-center shrink-0\"\n          style={!resolvedImage ? { background: fallbackGradient } : {}}\n        >\n          {resolvedImage ? (\n            <Image src={resolvedImage} alt={identity} width={44} height={44} className=\"h-full w-full object-cover\" unoptimized />\n          ) : (\n            <span className=\"text-base font-black text-white select-none\">\n              {identity.replace(\"@\", \"\").charAt(0).toUpperCase()}\n            </span>\n          )}\n        </div>\n\n        <div>\n          <p className=\"font-bold text-white text-base leading-snug truncate\">{identity}</p>\n          {name && (\n            <p className=\"text-xs text-white/55 mt-0.5 truncate\">{name}</p>\n          )}\n        </div>\n\n        {creator.bio && (\n          <p className=\"text-2xs text-white/65 line-clamp-2 leading-relaxed\">\n            {creator.bio}\n          </p>\n        )}\n      </div>\n    </Link>\n  );\n}\n\nfunction CreatorCardSkeleton() {\n  return <Skeleton className=\"aspect-square w-full rounded-2xl\" />;\n}\n\nexport function CreatorsPage() {\n  const [search, setSearch] = useState(\"\");\n  const [debouncedSearch, setDebouncedSearch] = useState(\"\");\n  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [page, setPage] = useState(1);\n  const [allCreators, setAllCreators] = useState<ApiCreatorProfile[]>([]);\n  const prevSearch = useRef<string | undefined>(undefined);\n\n  function handleSearch(value: string) {\n    setSearch(value);\n    if (debounceRef.current) clearTimeout(debounceRef.current);\n    debounceRef.current = setTimeout(() => setDebouncedSearch(value), 300);\n  }\n\n  function clearSearch() {\n    setSearch(\"\");\n    setDebouncedSearch(\"\");\n  }\n\n  const { creators, total, isLoading } = useCreators(debouncedSearch || undefined, page, 20);\n\n  useEffect(() => {\n    if (prevSearch.current !== debouncedSearch) {\n      prevSearch.current = debouncedSearch;\n      setPage(1);\n      setAllCreators([]);\n    }\n  }, [debouncedSearch]);\n\n  useEffect(() => {\n    if (isLoading || creators.length === 0) return;\n    setAllCreators((prev) => {\n      const seen = new Set(prev.map((c) => c.walletAddress));\n      const next = creators.filter((c) => !seen.has(c.walletAddress));\n      return page === 1 ? creators : [...prev, ...next];\n    });\n  }, [creators, isLoading, page]);\n\n  const isInitialLoading = isLoading && allCreators.length === 0;\n\n  return (\n    <div className=\"pb-16\">\n\n      <section className=\"relative border-b border-border/50 overflow-hidden\">\n        <div className=\"px-4 sm:px-6 lg:px-8 py-14 sm:py-20\">\n          <FadeIn>\n            <span className=\"pill-badge mb-5 inline-flex\">\n              <Users className=\"h-3 w-3\" />\n              Creator Network\n            </span>\n          </FadeIn>\n          <FadeIn delay={0.08}>\n            <h1 className=\"text-3xl sm:text-4xl lg:text-5xl font-semibold leading-tight mb-3\">\n              Meet the{\" \"}\n              <span className=\"gradient-text\">Creators</span>\n            </h1>\n          </FadeIn>\n          <FadeIn delay={0.16}>\n            <p className=\"text-muted-foreground text-base max-w-lg leading-relaxed mb-6\">\n              Discover the artists, writers, and builders publishing their work on Medialane.\n            </p>\n          </FadeIn>\n\n          <FadeIn delay={0.22}>\n            <div className=\"flex flex-col sm:flex-row items-start sm:items-center gap-4\">\n              {!isInitialLoading && total > 0 && (\n                <div className=\"flex items-center gap-2 rounded-full border border-border bg-card/80 px-4 py-1.5 text-sm\">\n                  <Palette className={`h-3.5 w-3.5 ${BRAND.purple.text}`} />\n                  <span className=\"font-bold\">{total}</span>\n                  <span className=\"text-muted-foreground\">creator{total !== 1 ? \"s\" : \"\"}</span>\n                </div>\n              )}\n\n              <div className=\"relative w-full sm:max-w-xs\">\n                <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none\" />\n                <Input\n                  className=\"pl-9 pr-9\"\n                  placeholder=\"Search by name or username…\"\n                  value={search}\n                  onChange={(e) => handleSearch(e.target.value)}\n                />\n                {search && (\n                  <button\n                    onClick={clearSearch}\n                    className=\"absolute right-2.5 top-1/2 -translate-y-1/2 h-5 w-5 rounded-full bg-muted flex items-center justify-center hover:bg-muted/80 transition-colors\"\n                  >\n                    <X className=\"h-3 w-3 text-muted-foreground\" />\n                  </button>\n                )}\n              </div>\n            </div>\n          </FadeIn>\n        </div>\n      </section>\n\n      <section className=\"px-4 sm:px-6 lg:px-8 py-8\">\n        {isInitialLoading ? (\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {Array.from({ length: 12 }).map((_, i) => <CreatorCardSkeleton key={i} />)}\n          </div>\n        ) : allCreators.length > 0 ? (\n          <>\n            {debouncedSearch && (\n              <p className=\"text-sm text-muted-foreground mb-4\">\n                {allCreators.length} result{allCreators.length !== 1 ? \"s\" : \"\"} for &ldquo;{debouncedSearch}&rdquo;\n              </p>\n            )}\n            <Stagger className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n              {allCreators.map((c) => (\n                <StaggerItem key={c.walletAddress}>\n                  <CreatorCard creator={c} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            <LoadMoreSentinel\n              hasMore={allCreators.length < total}\n              isLoading={isLoading}\n              onLoadMore={() => setPage((p) => p + 1)}\n            />\n          </>\n        ) : (\n          <div className=\"py-24 text-center space-y-4\">\n            <div className=\"h-16 w-16 rounded-2xl bg-muted flex items-center justify-center mx-auto\">\n              <Users className=\"h-8 w-8 text-muted-foreground/40\" />\n            </div>\n            <div className=\"space-y-1\">\n              <p className=\"font-semibold text-lg\">\n                {debouncedSearch ? `No creators found for \"${debouncedSearch}\"` : \"No creators yet\"}\n              </p>\n              <p className=\"text-sm text-muted-foreground\">\n                {debouncedSearch ? \"Try a different search term\" : \"Be the first to claim your username in Profile Settings\"}\n              </p>\n            </div>\n            {!debouncedSearch && (\n              <Button asChild variant=\"outline\">\n                <Link href=\"/settings\">Claim username</Link>\n              </Button>\n            )}\n          </div>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4CQ;AA1CR,mBAA4C;AAC5C,iBAA4B;AAC5B,kBAAiB;AACjB,mBAAkB;AAClB,mBAAsB;AACtB,oBAAuB;AACvB,sBAAyB;AACzB,gCAAiC;AACjC,+BAA6C;AAC7C,mBAAsB;AACtB,0BAA4B;AAC5B,6BAAsC;AACtC,8BAAgC;AAChC,2BAA4B;AAC5B,0BAA0D;AAG1D,SAAS,YAAY,EAAE,QAAQ,GAAmC;AAChE,QAAM,mBAAe,kCAAY;AACjC,QAAM,YAAY,aAAa,QAAQ,WAAW;AAClD,QAAM,EAAE,UAAU,KAAK,QAAI,yCAAgB;AAAA,IACzC,UAAU,QAAQ;AAAA,IAClB,MAAM,QAAQ;AAAA,IACd,eAAe,QAAQ;AAAA,EACzB,CAAC;AAED,QAAM,OAAO,QAAQ,YAAY,KAAK,MAAM,EAAE,EAAE,OAAO,CAAC,KAAK,MAAM,MAAM,EAAE,WAAW,CAAC,GAAG,CAAC,IAAI;AAC/F,QAAM,QAAQ,MAAM,MAAM;AAC1B,QAAM,mBAAmB,+BAA+B,GAAG,kBAAkB,IAAI;AAEjF,QAAM,EAAE,YAAY,QAAI,8CAAsB,CAAC,YAAY,QAAQ,gBAAgB,IAAI;AACvF,QAAM,gBAAgB,aAAa,YAAY,CAAC,GAAG,KAAK;AAExD,QAAM,gBAAgB,aAAa;AAEnC,SACE;AAAA,IAAC,YAAAA;AAAA,IAAA;AAAA,MACC,UAAM,wBAAY,EAAE,UAAU,QAAQ,UAAU,SAAS,QAAQ,cAAc,CAAC;AAAA,MAChF,WAAU;AAAA,MAGT;AAAA,wBACC;AAAA,UAAC,aAAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAI;AAAA,YACJ,eAAW;AAAA,YACX,MAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YACV,aAAW;AAAA;AAAA,QACb,IAEA,4CAAC,SAAI,WAAU,oBAAmB,OAAO,EAAE,YAAY,iBAAiB,GAAG;AAAA,QAG7E,4CAAC,SAAI,WAAU,+EAA8E;AAAA,SAE3F,QAAQ,cAAc,QAAQ,eAC9B,6CAAC,SAAI,WAAU,yDACZ;AAAA,kBAAQ,cACP,4CAAC,UAAK,WAAU,6GACd,sDAAC,+BAAQ,WAAU,6BAA4B,GACjD;AAAA,UAED,QAAQ,cACP,4CAAC,UAAK,WAAU,6GACd,sDAAC,6BAAM,WAAU,6BAA4B,GAC/C;AAAA,WAEJ;AAAA,QAGF,6CAAC,SAAI,WAAU,oDAEb;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,OAAO,CAAC,gBAAgB,EAAE,YAAY,iBAAiB,IAAI,CAAC;AAAA,cAE3D,0BACC,4CAAC,aAAAA,SAAA,EAAM,KAAK,eAAe,KAAK,UAAU,OAAO,IAAI,QAAQ,IAAI,WAAU,8BAA6B,aAAW,MAAC,IAEpH,4CAAC,UAAK,WAAU,+CACb,mBAAS,QAAQ,KAAK,EAAE,EAAE,OAAO,CAAC,EAAE,YAAY,GACnD;AAAA;AAAA,UAEJ;AAAA,UAEA,6CAAC,SACC;AAAA,wDAAC,OAAE,WAAU,wDAAwD,oBAAS;AAAA,YAC7E,QACC,4CAAC,OAAE,WAAU,yCAAyC,gBAAK;AAAA,aAE/D;AAAA,UAEC,QAAQ,OACP,4CAAC,OAAE,WAAU,uDACV,kBAAQ,KACX;AAAA,WAEJ;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,SAAS,sBAAsB;AAC7B,SAAO,4CAAC,4BAAS,WAAU,oCAAmC;AAChE;AAEO,SAAS,eAAe;AAC7B,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,EAAE;AACvC,QAAM,CAAC,iBAAiB,kBAAkB,QAAI,uBAAS,EAAE;AACzD,QAAM,kBAAc,qBAA6C,IAAI;AACrE,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC;AAClC,QAAM,CAAC,aAAa,cAAc,QAAI,uBAA8B,CAAC,CAAC;AACtE,QAAM,iBAAa,qBAA2B,MAAS;AAEvD,WAAS,aAAa,OAAe;AACnC,cAAU,KAAK;AACf,QAAI,YAAY,QAAS,cAAa,YAAY,OAAO;AACzD,gBAAY,UAAU,WAAW,MAAM,mBAAmB,KAAK,GAAG,GAAG;AAAA,EACvE;AAEA,WAAS,cAAc;AACrB,cAAU,EAAE;AACZ,uBAAmB,EAAE;AAAA,EACvB;AAEA,QAAM,EAAE,UAAU,OAAO,UAAU,QAAI,iCAAY,mBAAmB,QAAW,MAAM,EAAE;AAEzF,8BAAU,MAAM;AACd,QAAI,WAAW,YAAY,iBAAiB;AAC1C,iBAAW,UAAU;AACrB,cAAQ,CAAC;AACT,qBAAe,CAAC,CAAC;AAAA,IACnB;AAAA,EACF,GAAG,CAAC,eAAe,CAAC;AAEpB,8BAAU,MAAM;AACd,QAAI,aAAa,SAAS,WAAW,EAAG;AACxC,mBAAe,CAAC,SAAS;AACvB,YAAM,OAAO,IAAI,IAAI,KAAK,IAAI,CAAC,MAAM,EAAE,aAAa,CAAC;AACrD,YAAM,OAAO,SAAS,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,EAAE,aAAa,CAAC;AAC9D,aAAO,SAAS,IAAI,WAAW,CAAC,GAAG,MAAM,GAAG,IAAI;AAAA,IAClD,CAAC;AAAA,EACH,GAAG,CAAC,UAAU,WAAW,IAAI,CAAC;AAE9B,QAAM,mBAAmB,aAAa,YAAY,WAAW;AAE7D,SACE,6CAAC,SAAI,WAAU,SAEb;AAAA,gDAAC,aAAQ,WAAU,sDACjB,uDAAC,SAAI,WAAU,uCACb;AAAA,kDAAC,mCACC,uDAAC,UAAK,WAAU,+BACd;AAAA,oDAAC,6BAAM,WAAU,WAAU;AAAA,QAAE;AAAA,SAE/B,GACF;AAAA,MACA,4CAAC,mCAAO,OAAO,MACb,uDAAC,QAAG,WAAU,qEAAoE;AAAA;AAAA,QACvE;AAAA,QACT,4CAAC,UAAK,WAAU,iBAAgB,sBAAQ;AAAA,SAC1C,GACF;AAAA,MACA,4CAAC,mCAAO,OAAO,MACb,sDAAC,OAAE,WAAU,iEAAgE,6FAE7E,GACF;AAAA,MAEA,4CAAC,mCAAO,OAAO,MACb,uDAAC,SAAI,WAAU,+DACZ;AAAA,SAAC,oBAAoB,QAAQ,KAC5B,6CAAC,SAAI,WAAU,4FACb;AAAA,sDAAC,+BAAQ,WAAW,eAAe,mBAAM,OAAO,IAAI,IAAI;AAAA,UACxD,4CAAC,UAAK,WAAU,aAAa,iBAAM;AAAA,UACnC,6CAAC,UAAK,WAAU,yBAAwB;AAAA;AAAA,YAAQ,UAAU,IAAI,MAAM;AAAA,aAAG;AAAA,WACzE;AAAA,QAGF,6CAAC,SAAI,WAAU,+BACb;AAAA,sDAAC,8BAAO,WAAU,8FAA6F;AAAA,UAC/G;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,aAAY;AAAA,cACZ,OAAO;AAAA,cACP,UAAU,CAAC,MAAM,aAAa,EAAE,OAAO,KAAK;AAAA;AAAA,UAC9C;AAAA,UACC,UACC;AAAA,YAAC;AAAA;AAAA,cACC,SAAS;AAAA,cACT,WAAU;AAAA,cAEV,sDAAC,yBAAE,WAAU,iCAAgC;AAAA;AAAA,UAC/C;AAAA,WAEJ;AAAA,SACF,GACF;AAAA,OACF,GACF;AAAA,IAEA,4CAAC,aAAQ,WAAU,6BAChB,6BACC,4CAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,GAAG,CAAC,EAAE,IAAI,CAAC,GAAG,MAAM,4CAAC,yBAAyB,CAAG,CAAE,GAC3E,IACE,YAAY,SAAS,IACvB,4EACG;AAAA,yBACC,6CAAC,OAAE,WAAU,sCACV;AAAA,oBAAY;AAAA,QAAO;AAAA,QAAQ,YAAY,WAAW,IAAI,MAAM;AAAA,QAAG;AAAA,QAAa;AAAA,QAAgB;AAAA,SAC/F;AAAA,MAEF,4CAAC,oCAAQ,WAAU,wDAChB,sBAAY,IAAI,CAAC,MAChB,4CAAC,wCACC,sDAAC,eAAY,SAAS,GAAG,KADT,EAAE,aAEpB,CACD,GACH;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,SAAS,YAAY,SAAS;AAAA,UAC9B;AAAA,UACA,YAAY,MAAM,QAAQ,CAAC,MAAM,IAAI,CAAC;AAAA;AAAA,MACxC;AAAA,OACF,IAEA,6CAAC,SAAI,WAAU,+BACb;AAAA,kDAAC,SAAI,WAAU,2EACb,sDAAC,6BAAM,WAAU,oCAAmC,GACtD;AAAA,MACA,6CAAC,SAAI,WAAU,aACb;AAAA,oDAAC,OAAE,WAAU,yBACV,4BAAkB,0BAA0B,eAAe,MAAM,mBACpE;AAAA,QACA,4CAAC,OAAE,WAAU,iCACV,4BAAkB,gCAAgC,2DACrD;AAAA,SACF;AAAA,MACC,CAAC,mBACA,4CAAC,wBAAO,SAAO,MAAC,SAAQ,WACtB,sDAAC,YAAAD,SAAA,EAAK,MAAK,aAAY,4BAAc,GACvC;AAAA,OAEJ,GAEJ;AAAA,KACF;AAEJ;","names":["Link","Image"]}
+{"version":3,"sources":["../../src/components/creators-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useRef, useEffect } from \"react\";\nimport { profileHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Input } from \"./input.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { BRAND } from \"../data/brand.js\";\nimport { useCreators } from \"../utils/use-creators.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { Search, Users, Palette, Globe, Twitter, X } from \"lucide-react\";\nimport type { ApiCreatorProfile } from \"@medialane/sdk\";\n\nfunction CreatorCard({ creator }: { creator: ApiCreatorProfile }) {\n  const resolveImage = useImageUrl();\n  const avatarUrl = resolveImage(creator.avatarImage);\n  const { identity, name } = profileIdentity({\n    username: creator.username,\n    name: creator.name,\n    walletAddress: creator.walletAddress,\n  });\n\n  const hue = (creator.username ?? \"a\").split(\"\").reduce((acc, c) => acc + c.charCodeAt(0), 0) % 360;\n  const hue2 = (hue + 60) % 360;\n  const fallbackGradient = `linear-gradient(135deg, hsl(${hue},55%,35%), hsl(${hue2},50%,22%))`;\n\n  const { collections } = useCollectionsByOwner(!avatarUrl ? creator.walletAddress : null);\n  const fallbackImage = resolveImage(collections[0]?.image);\n\n  const resolvedImage = avatarUrl ?? fallbackImage;\n\n  return (\n    <Link\n      href={profileHref({ username: creator.username, address: creator.walletAddress })}\n      className=\"group block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none\"\n    >\n\n      {resolvedImage ? (\n        <Image\n          src={resolvedImage}\n          alt=\"\"\n          aria-hidden\n          fill\n          sizes=\"(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw\"\n          className=\"absolute inset-0 w-full h-full object-cover card-media\"\n          unoptimized\n        />\n      ) : (\n        <div className=\"absolute inset-0\" style={{ background: fallbackGradient }} />\n      )}\n\n      <div className=\"absolute inset-0 bg-gradient-to-t from-black/90 via-black/20 to-transparent\" />\n\n      {(creator.twitterUrl || creator.websiteUrl) && (\n        <div className=\"absolute top-3 right-3 flex items-center gap-1.5 z-10\">\n          {creator.twitterUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Twitter className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n          {creator.websiteUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Globe className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n        </div>\n      )}\n\n      <div className=\"absolute bottom-0 inset-x-0 p-4 space-y-2.5 z-10\">\n\n        <div\n          className=\"h-11 w-11 rounded-full ring-2 ring-white/20 overflow-hidden flex items-center justify-center shrink-0\"\n          style={!resolvedImage ? { background: fallbackGradient } : {}}\n        >\n          {resolvedImage ? (\n            <Image src={resolvedImage} alt={identity} width={44} height={44} className=\"h-full w-full object-cover\" unoptimized />\n          ) : (\n            <span className=\"text-base font-black text-white select-none\">\n              {identity.replace(\"@\", \"\").charAt(0).toUpperCase()}\n            </span>\n          )}\n        </div>\n\n        <div>\n          <p className=\"font-bold text-white text-base leading-snug truncate\">{identity}</p>\n          {name && (\n            <p className=\"text-xs text-white/55 mt-0.5 truncate\">{name}</p>\n          )}\n        </div>\n\n        {creator.bio && (\n          <p className=\"text-2xs text-white/65 line-clamp-2 leading-relaxed\">\n            {creator.bio}\n          </p>\n        )}\n      </div>\n    </Link>\n  );\n}\n\nfunction CreatorCardSkeleton() {\n  return <Skeleton className=\"aspect-square w-full rounded-2xl\" />;\n}\n\nexport function CreatorsPage() {\n  const [search, setSearch] = useState(\"\");\n  const [debouncedSearch, setDebouncedSearch] = useState(\"\");\n  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [page, setPage] = useState(1);\n  const [allCreators, setAllCreators] = useState<ApiCreatorProfile[]>([]);\n  const prevSearch = useRef<string | undefined>(undefined);\n\n  function handleSearch(value: string) {\n    setSearch(value);\n    if (debounceRef.current) clearTimeout(debounceRef.current);\n    debounceRef.current = setTimeout(() => setDebouncedSearch(value), 300);\n  }\n\n  function clearSearch() {\n    setSearch(\"\");\n    setDebouncedSearch(\"\");\n  }\n\n  const { creators, total, isLoading } = useCreators(debouncedSearch || undefined, page, 20);\n\n  useEffect(() => {\n    if (prevSearch.current !== debouncedSearch) {\n      prevSearch.current = debouncedSearch;\n      setPage(1);\n      setAllCreators([]);\n    }\n  }, [debouncedSearch]);\n\n  useEffect(() => {\n    if (isLoading || creators.length === 0) return;\n    setAllCreators((prev) => {\n      const seen = new Set(prev.map((c) => c.walletAddress));\n      const next = creators.filter((c) => !seen.has(c.walletAddress));\n      return page === 1 ? creators : [...prev, ...next];\n    });\n  }, [creators, isLoading, page]);\n\n  const isInitialLoading = isLoading && allCreators.length === 0;\n\n  return (\n    <div className=\"pb-16\">\n\n      <section className=\"relative border-b border-border/50 overflow-hidden\">\n        <div className=\"px-4 sm:px-6 lg:px-8 py-14 sm:py-20\">\n          <FadeIn>\n            <span className=\"pill-badge mb-5 inline-flex\">\n              <Users className=\"h-3 w-3\" />\n              Creator Network\n            </span>\n          </FadeIn>\n          <FadeIn delay={0.08}>\n            <h1 className=\"text-3xl sm:text-4xl lg:text-5xl font-semibold leading-tight mb-3\">\n              Meet the{\" \"}\n              <span className=\"gradient-text\">Creators</span>\n            </h1>\n          </FadeIn>\n          <FadeIn delay={0.16}>\n            <p className=\"text-muted-foreground text-base max-w-lg leading-relaxed mb-6\">\n              Discover the artists, writers, and builders publishing their work on Medialane.\n            </p>\n          </FadeIn>\n\n          <FadeIn delay={0.22}>\n            <div className=\"flex flex-col sm:flex-row items-start sm:items-center gap-4\">\n              {!isInitialLoading && total > 0 && (\n                <div className=\"flex items-center gap-2 rounded-full border border-border bg-card/80 px-4 py-1.5 text-sm\">\n                  <Palette className={`h-3.5 w-3.5 ${BRAND.purple.text}`} />\n                  <span className=\"font-bold\">{total}</span>\n                  <span className=\"text-muted-foreground\">creator{total !== 1 ? \"s\" : \"\"}</span>\n                </div>\n              )}\n\n              <div className=\"relative w-full sm:max-w-xs\">\n                <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none\" />\n                <Input\n                  className=\"pl-9 pr-9\"\n                  placeholder=\"Search by name or username…\"\n                  value={search}\n                  onChange={(e) => handleSearch(e.target.value)}\n                />\n                {search && (\n                  <button\n                    onClick={clearSearch}\n                    className=\"absolute right-2.5 top-1/2 -translate-y-1/2 h-5 w-5 rounded-full bg-muted flex items-center justify-center hover:bg-muted/80 transition-colors\"\n                  >\n                    <X className=\"h-3 w-3 text-muted-foreground\" />\n                  </button>\n                )}\n              </div>\n            </div>\n          </FadeIn>\n        </div>\n      </section>\n\n      <section className=\"px-4 sm:px-6 lg:px-8 py-8\">\n        {isInitialLoading ? (\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {Array.from({ length: 12 }).map((_, i) => <CreatorCardSkeleton key={i} />)}\n          </div>\n        ) : allCreators.length > 0 ? (\n          <>\n            {debouncedSearch && (\n              <p className=\"text-sm text-muted-foreground mb-4\">\n                {allCreators.length} result{allCreators.length !== 1 ? \"s\" : \"\"} for &ldquo;{debouncedSearch}&rdquo;\n              </p>\n            )}\n            <Stagger className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n              {allCreators.map((c) => (\n                <StaggerItem key={c.walletAddress}>\n                  <CreatorCard creator={c} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            <LoadMoreSentinel\n              hasMore={allCreators.length < total}\n              isLoading={isLoading}\n              onLoadMore={() => setPage((p) => p + 1)}\n            />\n          </>\n        ) : (\n          <div className=\"py-24 text-center space-y-4\">\n            <div className=\"h-16 w-16 rounded-2xl bg-muted flex items-center justify-center mx-auto\">\n              <Users className=\"h-8 w-8 text-muted-foreground/40\" />\n            </div>\n            <div className=\"space-y-1\">\n              <p className=\"font-semibold text-lg\">\n                {debouncedSearch ? `No creators found for \"${debouncedSearch}\"` : \"No creators yet\"}\n              </p>\n              <p className=\"text-sm text-muted-foreground\">\n                {debouncedSearch ? \"Try a different search term\" : \"Be the first to claim your username in Profile Settings\"}\n              </p>\n            </div>\n            {!debouncedSearch && (\n              <Button asChild variant=\"outline\">\n                <Link href=\"/settings\">Claim username</Link>\n              </Button>\n            )}\n          </div>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":"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","names":["Link","Image"]}

package/dist/components/creators-page.js

@@ -33,7 +33,7 @@ function CreatorCard({ creator }) {
     Link,
     {
       href: profileHref({ username: creator.username, address: creator.walletAddress }),
-      className: "block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none",
+      className: "group block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none",
       children: [
         resolvedImage ? /* @__PURE__ */ jsx(
           Image,
@@ -43,7 +43,7 @@ function CreatorCard({ creator }) {
             "aria-hidden": true,
             fill: true,
             sizes: "(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw",
-            className: "absolute inset-0 w-full h-full object-cover",
+            className: "absolute inset-0 w-full h-full object-cover card-media",
             unoptimized: true
           }
         ) : /* @__PURE__ */ jsx("div", { className: "absolute inset-0", style: { background: fallbackGradient } }),

package/dist/components/creators-page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/creators-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useRef, useEffect } from \"react\";\nimport { profileHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Input } from \"./input.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { BRAND } from \"../data/brand.js\";\nimport { useCreators } from \"../utils/use-creators.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { Search, Users, Palette, Globe, Twitter, X } from \"lucide-react\";\nimport type { ApiCreatorProfile } from \"@medialane/sdk\";\n\nfunction CreatorCard({ creator }: { creator: ApiCreatorProfile }) {\n  const resolveImage = useImageUrl();\n  const avatarUrl = resolveImage(creator.avatarImage);\n  const { identity, name } = profileIdentity({\n    username: creator.username,\n    name: creator.name,\n    walletAddress: creator.walletAddress,\n  });\n\n  const hue = (creator.username ?? \"a\").split(\"\").reduce((acc, c) => acc + c.charCodeAt(0), 0) % 360;\n  const hue2 = (hue + 60) % 360;\n  const fallbackGradient = `linear-gradient(135deg, hsl(${hue},55%,35%), hsl(${hue2},50%,22%))`;\n\n  const { collections } = useCollectionsByOwner(!avatarUrl ? creator.walletAddress : null);\n  const fallbackImage = resolveImage(collections[0]?.image);\n\n  const resolvedImage = avatarUrl ?? fallbackImage;\n\n  return (\n    <Link\n      href={profileHref({ username: creator.username, address: creator.walletAddress })}\n      className=\"block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none\"\n    >\n\n      {resolvedImage ? (\n        <Image\n          src={resolvedImage}\n          alt=\"\"\n          aria-hidden\n          fill\n          sizes=\"(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw\"\n          className=\"absolute inset-0 w-full h-full object-cover\"\n          unoptimized\n        />\n      ) : (\n        <div className=\"absolute inset-0\" style={{ background: fallbackGradient }} />\n      )}\n\n      <div className=\"absolute inset-0 bg-gradient-to-t from-black/90 via-black/20 to-transparent\" />\n\n      {(creator.twitterUrl || creator.websiteUrl) && (\n        <div className=\"absolute top-3 right-3 flex items-center gap-1.5 z-10\">\n          {creator.twitterUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Twitter className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n          {creator.websiteUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Globe className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n        </div>\n      )}\n\n      <div className=\"absolute bottom-0 inset-x-0 p-4 space-y-2.5 z-10\">\n\n        <div\n          className=\"h-11 w-11 rounded-full ring-2 ring-white/20 overflow-hidden flex items-center justify-center shrink-0\"\n          style={!resolvedImage ? { background: fallbackGradient } : {}}\n        >\n          {resolvedImage ? (\n            <Image src={resolvedImage} alt={identity} width={44} height={44} className=\"h-full w-full object-cover\" unoptimized />\n          ) : (\n            <span className=\"text-base font-black text-white select-none\">\n              {identity.replace(\"@\", \"\").charAt(0).toUpperCase()}\n            </span>\n          )}\n        </div>\n\n        <div>\n          <p className=\"font-bold text-white text-base leading-snug truncate\">{identity}</p>\n          {name && (\n            <p className=\"text-xs text-white/55 mt-0.5 truncate\">{name}</p>\n          )}\n        </div>\n\n        {creator.bio && (\n          <p className=\"text-2xs text-white/65 line-clamp-2 leading-relaxed\">\n            {creator.bio}\n          </p>\n        )}\n      </div>\n    </Link>\n  );\n}\n\nfunction CreatorCardSkeleton() {\n  return <Skeleton className=\"aspect-square w-full rounded-2xl\" />;\n}\n\nexport function CreatorsPage() {\n  const [search, setSearch] = useState(\"\");\n  const [debouncedSearch, setDebouncedSearch] = useState(\"\");\n  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [page, setPage] = useState(1);\n  const [allCreators, setAllCreators] = useState<ApiCreatorProfile[]>([]);\n  const prevSearch = useRef<string | undefined>(undefined);\n\n  function handleSearch(value: string) {\n    setSearch(value);\n    if (debounceRef.current) clearTimeout(debounceRef.current);\n    debounceRef.current = setTimeout(() => setDebouncedSearch(value), 300);\n  }\n\n  function clearSearch() {\n    setSearch(\"\");\n    setDebouncedSearch(\"\");\n  }\n\n  const { creators, total, isLoading } = useCreators(debouncedSearch || undefined, page, 20);\n\n  useEffect(() => {\n    if (prevSearch.current !== debouncedSearch) {\n      prevSearch.current = debouncedSearch;\n      setPage(1);\n      setAllCreators([]);\n    }\n  }, [debouncedSearch]);\n\n  useEffect(() => {\n    if (isLoading || creators.length === 0) return;\n    setAllCreators((prev) => {\n      const seen = new Set(prev.map((c) => c.walletAddress));\n      const next = creators.filter((c) => !seen.has(c.walletAddress));\n      return page === 1 ? creators : [...prev, ...next];\n    });\n  }, [creators, isLoading, page]);\n\n  const isInitialLoading = isLoading && allCreators.length === 0;\n\n  return (\n    <div className=\"pb-16\">\n\n      <section className=\"relative border-b border-border/50 overflow-hidden\">\n        <div className=\"px-4 sm:px-6 lg:px-8 py-14 sm:py-20\">\n          <FadeIn>\n            <span className=\"pill-badge mb-5 inline-flex\">\n              <Users className=\"h-3 w-3\" />\n              Creator Network\n            </span>\n          </FadeIn>\n          <FadeIn delay={0.08}>\n            <h1 className=\"text-3xl sm:text-4xl lg:text-5xl font-semibold leading-tight mb-3\">\n              Meet the{\" \"}\n              <span className=\"gradient-text\">Creators</span>\n            </h1>\n          </FadeIn>\n          <FadeIn delay={0.16}>\n            <p className=\"text-muted-foreground text-base max-w-lg leading-relaxed mb-6\">\n              Discover the artists, writers, and builders publishing their work on Medialane.\n            </p>\n          </FadeIn>\n\n          <FadeIn delay={0.22}>\n            <div className=\"flex flex-col sm:flex-row items-start sm:items-center gap-4\">\n              {!isInitialLoading && total > 0 && (\n                <div className=\"flex items-center gap-2 rounded-full border border-border bg-card/80 px-4 py-1.5 text-sm\">\n                  <Palette className={`h-3.5 w-3.5 ${BRAND.purple.text}`} />\n                  <span className=\"font-bold\">{total}</span>\n                  <span className=\"text-muted-foreground\">creator{total !== 1 ? \"s\" : \"\"}</span>\n                </div>\n              )}\n\n              <div className=\"relative w-full sm:max-w-xs\">\n                <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none\" />\n                <Input\n                  className=\"pl-9 pr-9\"\n                  placeholder=\"Search by name or username…\"\n                  value={search}\n                  onChange={(e) => handleSearch(e.target.value)}\n                />\n                {search && (\n                  <button\n                    onClick={clearSearch}\n                    className=\"absolute right-2.5 top-1/2 -translate-y-1/2 h-5 w-5 rounded-full bg-muted flex items-center justify-center hover:bg-muted/80 transition-colors\"\n                  >\n                    <X className=\"h-3 w-3 text-muted-foreground\" />\n                  </button>\n                )}\n              </div>\n            </div>\n          </FadeIn>\n        </div>\n      </section>\n\n      <section className=\"px-4 sm:px-6 lg:px-8 py-8\">\n        {isInitialLoading ? (\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {Array.from({ length: 12 }).map((_, i) => <CreatorCardSkeleton key={i} />)}\n          </div>\n        ) : allCreators.length > 0 ? (\n          <>\n            {debouncedSearch && (\n              <p className=\"text-sm text-muted-foreground mb-4\">\n                {allCreators.length} result{allCreators.length !== 1 ? \"s\" : \"\"} for &ldquo;{debouncedSearch}&rdquo;\n              </p>\n            )}\n            <Stagger className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n              {allCreators.map((c) => (\n                <StaggerItem key={c.walletAddress}>\n                  <CreatorCard creator={c} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            <LoadMoreSentinel\n              hasMore={allCreators.length < total}\n              isLoading={isLoading}\n              onLoadMore={() => setPage((p) => p + 1)}\n            />\n          </>\n        ) : (\n          <div className=\"py-24 text-center space-y-4\">\n            <div className=\"h-16 w-16 rounded-2xl bg-muted flex items-center justify-center mx-auto\">\n              <Users className=\"h-8 w-8 text-muted-foreground/40\" />\n            </div>\n            <div className=\"space-y-1\">\n              <p className=\"font-semibold text-lg\">\n                {debouncedSearch ? `No creators found for \"${debouncedSearch}\"` : \"No creators yet\"}\n              </p>\n              <p className=\"text-sm text-muted-foreground\">\n                {debouncedSearch ? \"Try a different search term\" : \"Be the first to claim your username in Profile Settings\"}\n              </p>\n            </div>\n            {!debouncedSearch && (\n              <Button asChild variant=\"outline\">\n                <Link href=\"/settings\">Claim username</Link>\n              </Button>\n            )}\n          </div>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/creators-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useRef, useEffect } from \"react\";\nimport { profileHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { Input } from \"./input.js\";\nimport { Button } from \"./button.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { LoadMoreSentinel } from \"./load-more-sentinel.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { BRAND } from \"../data/brand.js\";\nimport { useCreators } from \"../utils/use-creators.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { profileIdentity } from \"../utils/profile-identity.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport { Search, Users, Palette, Globe, Twitter, X } from \"lucide-react\";\nimport type { ApiCreatorProfile } from \"@medialane/sdk\";\n\nfunction CreatorCard({ creator }: { creator: ApiCreatorProfile }) {\n  const resolveImage = useImageUrl();\n  const avatarUrl = resolveImage(creator.avatarImage);\n  const { identity, name } = profileIdentity({\n    username: creator.username,\n    name: creator.name,\n    walletAddress: creator.walletAddress,\n  });\n\n  const hue = (creator.username ?? \"a\").split(\"\").reduce((acc, c) => acc + c.charCodeAt(0), 0) % 360;\n  const hue2 = (hue + 60) % 360;\n  const fallbackGradient = `linear-gradient(135deg, hsl(${hue},55%,35%), hsl(${hue2},50%,22%))`;\n\n  const { collections } = useCollectionsByOwner(!avatarUrl ? creator.walletAddress : null);\n  const fallbackImage = resolveImage(collections[0]?.image);\n\n  const resolvedImage = avatarUrl ?? fallbackImage;\n\n  return (\n    <Link\n      href={profileHref({ username: creator.username, address: creator.walletAddress })}\n      className=\"group block relative aspect-square overflow-hidden rounded-2xl active:scale-[0.98] transition-transform duration-150 select-none\"\n    >\n\n      {resolvedImage ? (\n        <Image\n          src={resolvedImage}\n          alt=\"\"\n          aria-hidden\n          fill\n          sizes=\"(min-width: 1024px) 25vw, (min-width: 640px) 50vw, 100vw\"\n          className=\"absolute inset-0 w-full h-full object-cover card-media\"\n          unoptimized\n        />\n      ) : (\n        <div className=\"absolute inset-0\" style={{ background: fallbackGradient }} />\n      )}\n\n      <div className=\"absolute inset-0 bg-gradient-to-t from-black/90 via-black/20 to-transparent\" />\n\n      {(creator.twitterUrl || creator.websiteUrl) && (\n        <div className=\"absolute top-3 right-3 flex items-center gap-1.5 z-10\">\n          {creator.twitterUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Twitter className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n          {creator.websiteUrl && (\n            <span className=\"h-7 w-7 rounded-full bg-black/40 backdrop-blur-sm border border-white/10 flex items-center justify-center\">\n              <Globe className=\"h-3.5 w-3.5 text-white/80\" />\n            </span>\n          )}\n        </div>\n      )}\n\n      <div className=\"absolute bottom-0 inset-x-0 p-4 space-y-2.5 z-10\">\n\n        <div\n          className=\"h-11 w-11 rounded-full ring-2 ring-white/20 overflow-hidden flex items-center justify-center shrink-0\"\n          style={!resolvedImage ? { background: fallbackGradient } : {}}\n        >\n          {resolvedImage ? (\n            <Image src={resolvedImage} alt={identity} width={44} height={44} className=\"h-full w-full object-cover\" unoptimized />\n          ) : (\n            <span className=\"text-base font-black text-white select-none\">\n              {identity.replace(\"@\", \"\").charAt(0).toUpperCase()}\n            </span>\n          )}\n        </div>\n\n        <div>\n          <p className=\"font-bold text-white text-base leading-snug truncate\">{identity}</p>\n          {name && (\n            <p className=\"text-xs text-white/55 mt-0.5 truncate\">{name}</p>\n          )}\n        </div>\n\n        {creator.bio && (\n          <p className=\"text-2xs text-white/65 line-clamp-2 leading-relaxed\">\n            {creator.bio}\n          </p>\n        )}\n      </div>\n    </Link>\n  );\n}\n\nfunction CreatorCardSkeleton() {\n  return <Skeleton className=\"aspect-square w-full rounded-2xl\" />;\n}\n\nexport function CreatorsPage() {\n  const [search, setSearch] = useState(\"\");\n  const [debouncedSearch, setDebouncedSearch] = useState(\"\");\n  const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n  const [page, setPage] = useState(1);\n  const [allCreators, setAllCreators] = useState<ApiCreatorProfile[]>([]);\n  const prevSearch = useRef<string | undefined>(undefined);\n\n  function handleSearch(value: string) {\n    setSearch(value);\n    if (debounceRef.current) clearTimeout(debounceRef.current);\n    debounceRef.current = setTimeout(() => setDebouncedSearch(value), 300);\n  }\n\n  function clearSearch() {\n    setSearch(\"\");\n    setDebouncedSearch(\"\");\n  }\n\n  const { creators, total, isLoading } = useCreators(debouncedSearch || undefined, page, 20);\n\n  useEffect(() => {\n    if (prevSearch.current !== debouncedSearch) {\n      prevSearch.current = debouncedSearch;\n      setPage(1);\n      setAllCreators([]);\n    }\n  }, [debouncedSearch]);\n\n  useEffect(() => {\n    if (isLoading || creators.length === 0) return;\n    setAllCreators((prev) => {\n      const seen = new Set(prev.map((c) => c.walletAddress));\n      const next = creators.filter((c) => !seen.has(c.walletAddress));\n      return page === 1 ? creators : [...prev, ...next];\n    });\n  }, [creators, isLoading, page]);\n\n  const isInitialLoading = isLoading && allCreators.length === 0;\n\n  return (\n    <div className=\"pb-16\">\n\n      <section className=\"relative border-b border-border/50 overflow-hidden\">\n        <div className=\"px-4 sm:px-6 lg:px-8 py-14 sm:py-20\">\n          <FadeIn>\n            <span className=\"pill-badge mb-5 inline-flex\">\n              <Users className=\"h-3 w-3\" />\n              Creator Network\n            </span>\n          </FadeIn>\n          <FadeIn delay={0.08}>\n            <h1 className=\"text-3xl sm:text-4xl lg:text-5xl font-semibold leading-tight mb-3\">\n              Meet the{\" \"}\n              <span className=\"gradient-text\">Creators</span>\n            </h1>\n          </FadeIn>\n          <FadeIn delay={0.16}>\n            <p className=\"text-muted-foreground text-base max-w-lg leading-relaxed mb-6\">\n              Discover the artists, writers, and builders publishing their work on Medialane.\n            </p>\n          </FadeIn>\n\n          <FadeIn delay={0.22}>\n            <div className=\"flex flex-col sm:flex-row items-start sm:items-center gap-4\">\n              {!isInitialLoading && total > 0 && (\n                <div className=\"flex items-center gap-2 rounded-full border border-border bg-card/80 px-4 py-1.5 text-sm\">\n                  <Palette className={`h-3.5 w-3.5 ${BRAND.purple.text}`} />\n                  <span className=\"font-bold\">{total}</span>\n                  <span className=\"text-muted-foreground\">creator{total !== 1 ? \"s\" : \"\"}</span>\n                </div>\n              )}\n\n              <div className=\"relative w-full sm:max-w-xs\">\n                <Search className=\"absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none\" />\n                <Input\n                  className=\"pl-9 pr-9\"\n                  placeholder=\"Search by name or username…\"\n                  value={search}\n                  onChange={(e) => handleSearch(e.target.value)}\n                />\n                {search && (\n                  <button\n                    onClick={clearSearch}\n                    className=\"absolute right-2.5 top-1/2 -translate-y-1/2 h-5 w-5 rounded-full bg-muted flex items-center justify-center hover:bg-muted/80 transition-colors\"\n                  >\n                    <X className=\"h-3 w-3 text-muted-foreground\" />\n                  </button>\n                )}\n              </div>\n            </div>\n          </FadeIn>\n        </div>\n      </section>\n\n      <section className=\"px-4 sm:px-6 lg:px-8 py-8\">\n        {isInitialLoading ? (\n          <div className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n            {Array.from({ length: 12 }).map((_, i) => <CreatorCardSkeleton key={i} />)}\n          </div>\n        ) : allCreators.length > 0 ? (\n          <>\n            {debouncedSearch && (\n              <p className=\"text-sm text-muted-foreground mb-4\">\n                {allCreators.length} result{allCreators.length !== 1 ? \"s\" : \"\"} for &ldquo;{debouncedSearch}&rdquo;\n              </p>\n            )}\n            <Stagger className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4\">\n              {allCreators.map((c) => (\n                <StaggerItem key={c.walletAddress}>\n                  <CreatorCard creator={c} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n            <LoadMoreSentinel\n              hasMore={allCreators.length < total}\n              isLoading={isLoading}\n              onLoadMore={() => setPage((p) => p + 1)}\n            />\n          </>\n        ) : (\n          <div className=\"py-24 text-center space-y-4\">\n            <div className=\"h-16 w-16 rounded-2xl bg-muted flex items-center justify-center mx-auto\">\n              <Users className=\"h-8 w-8 text-muted-foreground/40\" />\n            </div>\n            <div className=\"space-y-1\">\n              <p className=\"font-semibold text-lg\">\n                {debouncedSearch ? `No creators found for \"${debouncedSearch}\"` : \"No creators yet\"}\n              </p>\n              <p className=\"text-sm text-muted-foreground\">\n                {debouncedSearch ? \"Try a different search term\" : \"Be the first to claim your username in Profile Settings\"}\n              </p>\n            </div>\n            {!debouncedSearch && (\n              <Button asChild variant=\"outline\">\n                <Link href=\"/settings\">Claim username</Link>\n              </Button>\n            )}\n          </div>\n        )}\n      </section>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/drop/drop-card.cjs

@@ -52,7 +52,7 @@ function DropCard({ drop, now, manage }) {
       className: "group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative aspect-square bg-muted", children: [
-          image && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: image, alt: drop.name ?? "Drop", fill: true, unoptimized: true, className: "object-cover transition-transform group-hover:scale-[1.02]" }),
+          image && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: image, alt: drop.name ?? "Drop", fill: true, unoptimized: true, className: "object-cover card-media" }),
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute left-3 top-3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_drop_status.DropStatusBadge, { phase }) })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1 p-4", children: [

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drop/drop-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { dropHref, type ApiDrop } from \"@medialane/sdk\";\nimport Image from \"../image.js\";\nimport Link from \"../link.js\";\nimport { DropStatusBadge } from \"./drop-status.js\";\nimport { dropPhase } from \"../../utils/drop/view.js\";\nimport { priceLabel, supplyLabel } from \"../../utils/drop/sale.js\";\nimport { useImageUrl } from \"../../utils/use-image-url.js\";\n\nexport interface DropCardProps {\n  drop: ApiDrop;\n  now: number;\n  /** Organizer view: links to the Manage tab. */\n  manage?: boolean;\n}\n\nexport function DropCard({ drop, now, manage }: DropCardProps) {\n  const image = useImageUrl()(drop.image);\n  const phase = dropPhase(drop.terms, BigInt(drop.maxSupply), BigInt(drop.minted), now);\n  return (\n    <Link\n      href={`${dropHref(drop.contractAddress)}${manage ? \"?tab=manage\" : \"\"}`}\n      className=\"group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40\"\n    >\n      <div className=\"relative aspect-square bg-muted\">\n        {image && (\n          <Image src={image} alt={drop.name ?? \"Drop\"} fill unoptimized className=\"object-cover transition-transform group-hover:scale-[1.02]\" />\n        )}\n        <div className=\"absolute left-3 top-3\"><DropStatusBadge phase={phase} /></div>\n      </div>\n      <div className=\"space-y-1 p-4\">\n        <p className=\"truncate font-semibold\">{drop.name ?? \"Untitled drop\"}</p>\n        <div className=\"flex justify-between gap-2 text-xs text-muted-foreground\">\n          <span>{priceLabel(drop.terms.price, drop.terms.paymentToken)}</span>\n          <span>{supplyLabel(drop.minted, drop.maxSupply)}</span>\n        </div>\n        {manage && <p className=\"pt-1 text-xs font-semibold text-primary\">Manage</p>}\n      </div>\n    </Link>\n  );\n}\n\nexport function DropGrid({ drops, now, manage }: { drops: ApiDrop[]; now: number; manage?: boolean }) {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {drops.map((d) => <DropCard key={d.contractAddress} drop={d} now={now} manage={manage} />)}\n    </div>\n  );\n}\n\nexport function DropGridSkeleton() {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {Array.from({ length: 6 }).map((_, i) => (\n        <div key={i} className=\"overflow-hidden rounded-2xl border border-border bg-card\">\n          <div className=\"aspect-square animate-pulse bg-muted\" />\n          <div className=\"space-y-2 p-4\">\n            <div className=\"h-4 w-2/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-3 w-1/2 animate-pulse rounded-md bg-muted\" />\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBM;AAvBN,iBAAuC;AACvC,mBAAkB;AAClB,kBAAiB;AACjB,yBAAgC;AAChC,kBAA0B;AAC1B,kBAAwC;AACxC,2BAA4B;AASrB,SAAS,SAAS,EAAE,MAAM,KAAK,OAAO,GAAkB;AAC7D,QAAM,YAAQ,kCAAY,EAAE,KAAK,KAAK;AACtC,QAAM,YAAQ,uBAAU,KAAK,OAAO,OAAO,KAAK,SAAS,GAAG,OAAO,KAAK,MAAM,GAAG,GAAG;AACpF,SACE;AAAA,IAAC,YAAAA;AAAA,IAAA;AAAA,MACC,MAAM,OAAG,qBAAS,KAAK,eAAe,CAAC,GAAG,SAAS,gBAAgB,EAAE;AAAA,MACrE,WAAU;AAAA,MAEV;AAAA,qDAAC,SAAI,WAAU,mCACZ;AAAA,mBACC,4CAAC,aAAAC,SAAA,EAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,QAAQ,MAAI,MAAC,aAAW,MAAC,WAAU,8DAA6D;AAAA,UAEvI,4CAAC,SAAI,WAAU,yBAAwB,sDAAC,sCAAgB,OAAc,GAAE;AAAA,WAC1E;AAAA,QACA,6CAAC,SAAI,WAAU,iBACb;AAAA,sDAAC,OAAE,WAAU,0BAA0B,eAAK,QAAQ,iBAAgB;AAAA,UACpE,6CAAC,SAAI,WAAU,4DACb;AAAA,wDAAC,UAAM,sCAAW,KAAK,MAAM,OAAO,KAAK,MAAM,YAAY,GAAE;AAAA,YAC7D,4CAAC,UAAM,uCAAY,KAAK,QAAQ,KAAK,SAAS,GAAE;AAAA,aAClD;AAAA,UACC,UAAU,4CAAC,OAAE,WAAU,2CAA0C,oBAAM;AAAA,WAC1E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,SAAS,EAAE,OAAO,KAAK,OAAO,GAAwD;AACpG,SACE,4CAAC,SAAI,WAAU,wDACZ,gBAAM,IAAI,CAAC,MAAM,4CAAC,YAAiC,MAAM,GAAG,KAAU,UAAtC,EAAE,eAAoD,CAAE,GAC3F;AAEJ;AAEO,SAAS,mBAAmB;AACjC,SACE,4CAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,6CAAC,SAAY,WAAU,4DACrB;AAAA,gDAAC,SAAI,WAAU,wCAAuC;AAAA,IACtD,6CAAC,SAAI,WAAU,iBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,+CAA8C;AAAA,OAC/D;AAAA,OALQ,CAMV,CACD,GACH;AAEJ;","names":["Link","Image"]}
+{"version":3,"sources":["../../../src/components/drop/drop-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { dropHref, type ApiDrop } from \"@medialane/sdk\";\nimport Image from \"../image.js\";\nimport Link from \"../link.js\";\nimport { DropStatusBadge } from \"./drop-status.js\";\nimport { dropPhase } from \"../../utils/drop/view.js\";\nimport { priceLabel, supplyLabel } from \"../../utils/drop/sale.js\";\nimport { useImageUrl } from \"../../utils/use-image-url.js\";\n\nexport interface DropCardProps {\n  drop: ApiDrop;\n  now: number;\n  /** Organizer view: links to the Manage tab. */\n  manage?: boolean;\n}\n\nexport function DropCard({ drop, now, manage }: DropCardProps) {\n  const image = useImageUrl()(drop.image);\n  const phase = dropPhase(drop.terms, BigInt(drop.maxSupply), BigInt(drop.minted), now);\n  return (\n    <Link\n      href={`${dropHref(drop.contractAddress)}${manage ? \"?tab=manage\" : \"\"}`}\n      className=\"group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40\"\n    >\n      <div className=\"relative aspect-square bg-muted\">\n        {image && (\n          <Image src={image} alt={drop.name ?? \"Drop\"} fill unoptimized className=\"object-cover card-media\" />\n        )}\n        <div className=\"absolute left-3 top-3\"><DropStatusBadge phase={phase} /></div>\n      </div>\n      <div className=\"space-y-1 p-4\">\n        <p className=\"truncate font-semibold\">{drop.name ?? \"Untitled drop\"}</p>\n        <div className=\"flex justify-between gap-2 text-xs text-muted-foreground\">\n          <span>{priceLabel(drop.terms.price, drop.terms.paymentToken)}</span>\n          <span>{supplyLabel(drop.minted, drop.maxSupply)}</span>\n        </div>\n        {manage && <p className=\"pt-1 text-xs font-semibold text-primary\">Manage</p>}\n      </div>\n    </Link>\n  );\n}\n\nexport function DropGrid({ drops, now, manage }: { drops: ApiDrop[]; now: number; manage?: boolean }) {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {drops.map((d) => <DropCard key={d.contractAddress} drop={d} now={now} manage={manage} />)}\n    </div>\n  );\n}\n\nexport function DropGridSkeleton() {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {Array.from({ length: 6 }).map((_, i) => (\n        <div key={i} className=\"overflow-hidden rounded-2xl border border-border bg-card\">\n          <div className=\"aspect-square animate-pulse bg-muted\" />\n          <div className=\"space-y-2 p-4\">\n            <div className=\"h-4 w-2/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-3 w-1/2 animate-pulse rounded-md bg-muted\" />\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBM;AAvBN,iBAAuC;AACvC,mBAAkB;AAClB,kBAAiB;AACjB,yBAAgC;AAChC,kBAA0B;AAC1B,kBAAwC;AACxC,2BAA4B;AASrB,SAAS,SAAS,EAAE,MAAM,KAAK,OAAO,GAAkB;AAC7D,QAAM,YAAQ,kCAAY,EAAE,KAAK,KAAK;AACtC,QAAM,YAAQ,uBAAU,KAAK,OAAO,OAAO,KAAK,SAAS,GAAG,OAAO,KAAK,MAAM,GAAG,GAAG;AACpF,SACE;AAAA,IAAC,YAAAA;AAAA,IAAA;AAAA,MACC,MAAM,OAAG,qBAAS,KAAK,eAAe,CAAC,GAAG,SAAS,gBAAgB,EAAE;AAAA,MACrE,WAAU;AAAA,MAEV;AAAA,qDAAC,SAAI,WAAU,mCACZ;AAAA,mBACC,4CAAC,aAAAC,SAAA,EAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,QAAQ,MAAI,MAAC,aAAW,MAAC,WAAU,2BAA0B;AAAA,UAEpG,4CAAC,SAAI,WAAU,yBAAwB,sDAAC,sCAAgB,OAAc,GAAE;AAAA,WAC1E;AAAA,QACA,6CAAC,SAAI,WAAU,iBACb;AAAA,sDAAC,OAAE,WAAU,0BAA0B,eAAK,QAAQ,iBAAgB;AAAA,UACpE,6CAAC,SAAI,WAAU,4DACb;AAAA,wDAAC,UAAM,sCAAW,KAAK,MAAM,OAAO,KAAK,MAAM,YAAY,GAAE;AAAA,YAC7D,4CAAC,UAAM,uCAAY,KAAK,QAAQ,KAAK,SAAS,GAAE;AAAA,aAClD;AAAA,UACC,UAAU,4CAAC,OAAE,WAAU,2CAA0C,oBAAM;AAAA,WAC1E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,SAAS,EAAE,OAAO,KAAK,OAAO,GAAwD;AACpG,SACE,4CAAC,SAAI,WAAU,wDACZ,gBAAM,IAAI,CAAC,MAAM,4CAAC,YAAiC,MAAM,GAAG,KAAU,UAAtC,EAAE,eAAoD,CAAE,GAC3F;AAEJ;AAEO,SAAS,mBAAmB;AACjC,SACE,4CAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,6CAAC,SAAY,WAAU,4DACrB;AAAA,gDAAC,SAAI,WAAU,wCAAuC;AAAA,IACtD,6CAAC,SAAI,WAAU,iBACb;AAAA,kDAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,4CAAC,SAAI,WAAU,+CAA8C;AAAA,OAC/D;AAAA,OALQ,CAMV,CACD,GACH;AAEJ;","names":["Link","Image"]}

package/dist/components/drop/drop-card.js

@@ -17,7 +17,7 @@ function DropCard({ drop, now, manage }) {
       className: "group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40",
       children: [
         /* @__PURE__ */ jsxs("div", { className: "relative aspect-square bg-muted", children: [
-          image && /* @__PURE__ */ jsx(Image, { src: image, alt: drop.name ?? "Drop", fill: true, unoptimized: true, className: "object-cover transition-transform group-hover:scale-[1.02]" }),
+          image && /* @__PURE__ */ jsx(Image, { src: image, alt: drop.name ?? "Drop", fill: true, unoptimized: true, className: "object-cover card-media" }),
           /* @__PURE__ */ jsx("div", { className: "absolute left-3 top-3", children: /* @__PURE__ */ jsx(DropStatusBadge, { phase }) })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-1 p-4", children: [

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/drop/drop-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { dropHref, type ApiDrop } from \"@medialane/sdk\";\nimport Image from \"../image.js\";\nimport Link from \"../link.js\";\nimport { DropStatusBadge } from \"./drop-status.js\";\nimport { dropPhase } from \"../../utils/drop/view.js\";\nimport { priceLabel, supplyLabel } from \"../../utils/drop/sale.js\";\nimport { useImageUrl } from \"../../utils/use-image-url.js\";\n\nexport interface DropCardProps {\n  drop: ApiDrop;\n  now: number;\n  /** Organizer view: links to the Manage tab. */\n  manage?: boolean;\n}\n\nexport function DropCard({ drop, now, manage }: DropCardProps) {\n  const image = useImageUrl()(drop.image);\n  const phase = dropPhase(drop.terms, BigInt(drop.maxSupply), BigInt(drop.minted), now);\n  return (\n    <Link\n      href={`${dropHref(drop.contractAddress)}${manage ? \"?tab=manage\" : \"\"}`}\n      className=\"group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40\"\n    >\n      <div className=\"relative aspect-square bg-muted\">\n        {image && (\n          <Image src={image} alt={drop.name ?? \"Drop\"} fill unoptimized className=\"object-cover transition-transform group-hover:scale-[1.02]\" />\n        )}\n        <div className=\"absolute left-3 top-3\"><DropStatusBadge phase={phase} /></div>\n      </div>\n      <div className=\"space-y-1 p-4\">\n        <p className=\"truncate font-semibold\">{drop.name ?? \"Untitled drop\"}</p>\n        <div className=\"flex justify-between gap-2 text-xs text-muted-foreground\">\n          <span>{priceLabel(drop.terms.price, drop.terms.paymentToken)}</span>\n          <span>{supplyLabel(drop.minted, drop.maxSupply)}</span>\n        </div>\n        {manage && <p className=\"pt-1 text-xs font-semibold text-primary\">Manage</p>}\n      </div>\n    </Link>\n  );\n}\n\nexport function DropGrid({ drops, now, manage }: { drops: ApiDrop[]; now: number; manage?: boolean }) {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {drops.map((d) => <DropCard key={d.contractAddress} drop={d} now={now} manage={manage} />)}\n    </div>\n  );\n}\n\nexport function DropGridSkeleton() {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {Array.from({ length: 6 }).map((_, i) => (\n        <div key={i} className=\"overflow-hidden rounded-2xl border border-border bg-card\">\n          <div className=\"aspect-square animate-pulse bg-muted\" />\n          <div className=\"space-y-2 p-4\">\n            <div className=\"h-4 w-2/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-3 w-1/2 animate-pulse rounded-md bg-muted\" />\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";AAyBM,SAEI,KAFJ;AAvBN,SAAS,gBAA8B;AACvC,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,uBAAuB;AAChC,SAAS,iBAAiB;AAC1B,SAAS,YAAY,mBAAmB;AACxC,SAAS,mBAAmB;AASrB,SAAS,SAAS,EAAE,MAAM,KAAK,OAAO,GAAkB;AAC7D,QAAM,QAAQ,YAAY,EAAE,KAAK,KAAK;AACtC,QAAM,QAAQ,UAAU,KAAK,OAAO,OAAO,KAAK,SAAS,GAAG,OAAO,KAAK,MAAM,GAAG,GAAG;AACpF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,SAAS,KAAK,eAAe,CAAC,GAAG,SAAS,gBAAgB,EAAE;AAAA,MACrE,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,mCACZ;AAAA,mBACC,oBAAC,SAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,QAAQ,MAAI,MAAC,aAAW,MAAC,WAAU,8DAA6D;AAAA,UAEvI,oBAAC,SAAI,WAAU,yBAAwB,8BAAC,mBAAgB,OAAc,GAAE;AAAA,WAC1E;AAAA,QACA,qBAAC,SAAI,WAAU,iBACb;AAAA,8BAAC,OAAE,WAAU,0BAA0B,eAAK,QAAQ,iBAAgB;AAAA,UACpE,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,UAAM,qBAAW,KAAK,MAAM,OAAO,KAAK,MAAM,YAAY,GAAE;AAAA,YAC7D,oBAAC,UAAM,sBAAY,KAAK,QAAQ,KAAK,SAAS,GAAE;AAAA,aAClD;AAAA,UACC,UAAU,oBAAC,OAAE,WAAU,2CAA0C,oBAAM;AAAA,WAC1E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,SAAS,EAAE,OAAO,KAAK,OAAO,GAAwD;AACpG,SACE,oBAAC,SAAI,WAAU,wDACZ,gBAAM,IAAI,CAAC,MAAM,oBAAC,YAAiC,MAAM,GAAG,KAAU,UAAtC,EAAE,eAAoD,CAAE,GAC3F;AAEJ;AAEO,SAAS,mBAAmB;AACjC,SACE,oBAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,qBAAC,SAAY,WAAU,4DACrB;AAAA,wBAAC,SAAI,WAAU,wCAAuC;AAAA,IACtD,qBAAC,SAAI,WAAU,iBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,+CAA8C;AAAA,OAC/D;AAAA,OALQ,CAMV,CACD,GACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/drop/drop-card.tsx"],"sourcesContent":["\"use client\";\n\nimport { dropHref, type ApiDrop } from \"@medialane/sdk\";\nimport Image from \"../image.js\";\nimport Link from \"../link.js\";\nimport { DropStatusBadge } from \"./drop-status.js\";\nimport { dropPhase } from \"../../utils/drop/view.js\";\nimport { priceLabel, supplyLabel } from \"../../utils/drop/sale.js\";\nimport { useImageUrl } from \"../../utils/use-image-url.js\";\n\nexport interface DropCardProps {\n  drop: ApiDrop;\n  now: number;\n  /** Organizer view: links to the Manage tab. */\n  manage?: boolean;\n}\n\nexport function DropCard({ drop, now, manage }: DropCardProps) {\n  const image = useImageUrl()(drop.image);\n  const phase = dropPhase(drop.terms, BigInt(drop.maxSupply), BigInt(drop.minted), now);\n  return (\n    <Link\n      href={`${dropHref(drop.contractAddress)}${manage ? \"?tab=manage\" : \"\"}`}\n      className=\"group block rounded-2xl border border-border bg-card overflow-hidden transition-colors hover:border-primary/40\"\n    >\n      <div className=\"relative aspect-square bg-muted\">\n        {image && (\n          <Image src={image} alt={drop.name ?? \"Drop\"} fill unoptimized className=\"object-cover card-media\" />\n        )}\n        <div className=\"absolute left-3 top-3\"><DropStatusBadge phase={phase} /></div>\n      </div>\n      <div className=\"space-y-1 p-4\">\n        <p className=\"truncate font-semibold\">{drop.name ?? \"Untitled drop\"}</p>\n        <div className=\"flex justify-between gap-2 text-xs text-muted-foreground\">\n          <span>{priceLabel(drop.terms.price, drop.terms.paymentToken)}</span>\n          <span>{supplyLabel(drop.minted, drop.maxSupply)}</span>\n        </div>\n        {manage && <p className=\"pt-1 text-xs font-semibold text-primary\">Manage</p>}\n      </div>\n    </Link>\n  );\n}\n\nexport function DropGrid({ drops, now, manage }: { drops: ApiDrop[]; now: number; manage?: boolean }) {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {drops.map((d) => <DropCard key={d.contractAddress} drop={d} now={now} manage={manage} />)}\n    </div>\n  );\n}\n\nexport function DropGridSkeleton() {\n  return (\n    <div className=\"grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3\">\n      {Array.from({ length: 6 }).map((_, i) => (\n        <div key={i} className=\"overflow-hidden rounded-2xl border border-border bg-card\">\n          <div className=\"aspect-square animate-pulse bg-muted\" />\n          <div className=\"space-y-2 p-4\">\n            <div className=\"h-4 w-2/3 animate-pulse rounded-md bg-muted\" />\n            <div className=\"h-3 w-1/2 animate-pulse rounded-md bg-muted\" />\n          </div>\n        </div>\n      ))}\n    </div>\n  );\n}\n"],"mappings":";AAyBM,SAEI,KAFJ;AAvBN,SAAS,gBAA8B;AACvC,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,uBAAuB;AAChC,SAAS,iBAAiB;AAC1B,SAAS,YAAY,mBAAmB;AACxC,SAAS,mBAAmB;AASrB,SAAS,SAAS,EAAE,MAAM,KAAK,OAAO,GAAkB;AAC7D,QAAM,QAAQ,YAAY,EAAE,KAAK,KAAK;AACtC,QAAM,QAAQ,UAAU,KAAK,OAAO,OAAO,KAAK,SAAS,GAAG,OAAO,KAAK,MAAM,GAAG,GAAG;AACpF,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM,GAAG,SAAS,KAAK,eAAe,CAAC,GAAG,SAAS,gBAAgB,EAAE;AAAA,MACrE,WAAU;AAAA,MAEV;AAAA,6BAAC,SAAI,WAAU,mCACZ;AAAA,mBACC,oBAAC,SAAM,KAAK,OAAO,KAAK,KAAK,QAAQ,QAAQ,MAAI,MAAC,aAAW,MAAC,WAAU,2BAA0B;AAAA,UAEpG,oBAAC,SAAI,WAAU,yBAAwB,8BAAC,mBAAgB,OAAc,GAAE;AAAA,WAC1E;AAAA,QACA,qBAAC,SAAI,WAAU,iBACb;AAAA,8BAAC,OAAE,WAAU,0BAA0B,eAAK,QAAQ,iBAAgB;AAAA,UACpE,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,UAAM,qBAAW,KAAK,MAAM,OAAO,KAAK,MAAM,YAAY,GAAE;AAAA,YAC7D,oBAAC,UAAM,sBAAY,KAAK,QAAQ,KAAK,SAAS,GAAE;AAAA,aAClD;AAAA,UACC,UAAU,oBAAC,OAAE,WAAU,2CAA0C,oBAAM;AAAA,WAC1E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEO,SAAS,SAAS,EAAE,OAAO,KAAK,OAAO,GAAwD;AACpG,SACE,oBAAC,SAAI,WAAU,wDACZ,gBAAM,IAAI,CAAC,MAAM,oBAAC,YAAiC,MAAM,GAAG,KAAU,UAAtC,EAAE,eAAoD,CAAE,GAC3F;AAEJ;AAEO,SAAS,mBAAmB;AACjC,SACE,oBAAC,SAAI,WAAU,wDACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MACjC,qBAAC,SAAY,WAAU,4DACrB;AAAA,wBAAC,SAAI,WAAU,wCAAuC;AAAA,IACtD,qBAAC,SAAI,WAAU,iBACb;AAAA,0BAAC,SAAI,WAAU,+CAA8C;AAAA,MAC7D,oBAAC,SAAI,WAAU,+CAA8C;AAAA,OAC/D;AAAA,OALQ,CAMV,CACD,GACH;AAEJ;","names":[]}

package/dist/components/editions-page.cjs

@@ -58,7 +58,7 @@ function CollectionRow({ col }) {
         src: imageUrl,
         alt: col.name ?? "",
         fill: true,
-        className: "object-cover",
+        className: "object-cover card-media",
         onError: () => setImgError(true),
         unoptimized: true
       }

package/dist/components/editions-page.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/editions-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useMemo } from \"react\";\nimport { collectionHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { SignInPrompt } from \"./sign-in-prompt.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport {\n  Layers, Sparkles, Plus, ArrowRight, Package,\n  ExternalLink, Inbox,\n} from \"lucide-react\";\nimport type { ApiCollection } from \"@medialane/sdk\";\n\nfunction CollectionRow({ col }: { col: ApiCollection }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(col.image, { width: 128 });\n  const showImage = imageUrl && !imgError;\n\n  return (\n    <div className=\"group bento-cell overflow-hidden flex flex-col sm:flex-row items-stretch\">\n\n      <div className=\"relative w-full sm:w-32 aspect-square shrink-0 overflow-hidden bg-muted sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={col.name ?? \"\"}\n            fill\n            className=\"object-cover\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 bg-muted flex items-center justify-center\">\n            <Layers className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n\n      <div className=\"flex flex-col justify-between gap-4 p-5 flex-1 min-w-0\">\n        <div className=\"space-y-1\">\n          <div className=\"flex items-start justify-between gap-2\">\n            <div className=\"min-w-0\">\n              <p className=\"font-bold text-base leading-tight truncate\">\n                {col.name ?? \"Unnamed Collection\"}\n              </p>\n              {col.symbol && (\n                <p className=\"text-xs tabular-nums text-muted-foreground mt-0.5\">{col.symbol}</p>\n              )}\n            </div>\n            <Link\n              href={collectionHref(\"STARKNET\", col.contractAddress)}\n              className=\"shrink-0 text-muted-foreground/50 hover:text-muted-foreground transition-colors\"\n              title=\"View collection page\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" />\n            </Link>\n          </div>\n\n          {col.description && (\n            <p className=\"text-xs text-muted-foreground leading-relaxed line-clamp-2\">\n              {col.description}\n            </p>\n          )}\n\n          <div className=\"flex items-center gap-3 pt-1\">\n            <div className=\"flex items-center gap-1.5 text-xs text-muted-foreground\">\n              <Package className=\"h-3 w-3\" />\n              <span>\n                {col.totalSupply != null\n                  ? `${col.totalSupply.toLocaleString()} token${col.totalSupply !== 1 ? \"s\" : \"\"}`\n                  : \"No tokens yet\"}\n              </span>\n            </div>\n            {col.holderCount != null && col.holderCount > 0 && (\n              <div className=\"text-xs text-muted-foreground\">\n                {col.holderCount.toLocaleString()} holder{col.holderCount !== 1 ? \"s\" : \"\"}\n              </div>\n            )}\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Link\n            href={`/launchpad/nfteditions/${col.contractAddress}/mint`}\n            className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n          >\n            <Sparkles className=\"h-3.5 w-3.5\" />\n            Mint editions\n          </Link>\n          <Button variant=\"outline\" size=\"sm\" asChild>\n            <Link href={collectionHref(\"STARKNET\", col.contractAddress)}>\n              View collection\n            </Link>\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction CollectionRowSkeleton() {\n  return (\n    <div className=\"bento-cell overflow-hidden flex flex-col sm:flex-row\">\n      <Skeleton className=\"w-full sm:w-32 aspect-square shrink-0 rounded-none sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\" />\n      <div className=\"flex flex-col gap-3 p-5 flex-1\">\n        <Skeleton className=\"h-5 w-48\" />\n        <Skeleton className=\"h-3 w-24\" />\n        <Skeleton className=\"h-3 w-64\" />\n        <div className=\"flex gap-2 mt-auto\">\n          <Skeleton className=\"h-9 w-32 rounded-xl\" />\n          <Skeleton className=\"h-9 w-28 rounded-xl\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function EditionsPage() {\n  const { walletAddress, walletLoading } = useMedialaneApp();\n  const { collections, isLoading } = useCollectionsByOwner(walletAddress);\n\n  const erc1155 = useMemo(\n    () => collections.filter((c) => c.standard === \"ERC1155\"),\n    [collections]\n  );\n\n  return (\n    <div className=\"pb-16\">\n\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={<Layers className=\"h-4 w-4 text-white\" />}\n              title=\"Limited Editions\"\n              subtitle=\"Pick one of your editions collections and mint new pieces into it.\"\n            />\n          </div>\n        </FadeIn>\n        <FadeIn delay={0.08}>\n          <div className=\"mt-6 flex items-center gap-3\">\n            <Link\n              href=\"/launchpad/nfteditions/create\"\n              className=\"flex items-center gap-2 h-10 px-5 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n            >\n              <Plus className=\"h-4 w-4\" />\n              New collection\n            </Link>\n            <Button variant=\"outline\" size=\"sm\" asChild>\n              <a href=\"https://docs.medialane.io/learn/ip-collection-1155\" target=\"_blank\" rel=\"noopener noreferrer\">\n                Learn more <ArrowRight className=\"h-3.5 w-3.5 ml-1\" />\n              </a>\n            </Button>\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 space-y-5 max-w-5xl mx-auto\">\n        {!walletAddress && !walletLoading ? (\n          <SignInPrompt icon={<Layers className=\"h-10 w-10 text-muted-foreground/30\" />} title=\"Sign in to see your collections\" />\n        ) : isLoading || walletLoading ? (\n          <div className=\"space-y-3\">\n            {Array.from({ length: 3 }).map((_, i) => (\n              <CollectionRowSkeleton key={i} />\n            ))}\n          </div>\n        ) : erc1155.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 editions collections yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-xs\">\n                  Create your first editions collection to start minting.\n                </p>\n              </div>\n              <Link\n                href=\"/launchpad/nfteditions/create\"\n                className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n              >\n                <Plus className=\"h-4 w-4\" />\n                Create your first collection\n              </Link>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <div className=\"flex items-center justify-between\">\n              <p className=\"text-sm font-medium text-muted-foreground\">\n                {erc1155.length} collection{erc1155.length !== 1 ? \"s\" : \"\"}\n              </p>\n            </div>\n            <Stagger className=\"space-y-3\">\n              {erc1155.map((col) => (\n                <StaggerItem key={col.contractAddress}>\n                  <CollectionRow col={col} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n          </>\n        )}\n      </section>\n\n    </div>\n  );\n}\n"],"mappings":"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","names":["Image","Link"]}
+{"version":3,"sources":["../../src/components/editions-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useMemo } from \"react\";\nimport { collectionHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { SignInPrompt } from \"./sign-in-prompt.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport {\n  Layers, Sparkles, Plus, ArrowRight, Package,\n  ExternalLink, Inbox,\n} from \"lucide-react\";\nimport type { ApiCollection } from \"@medialane/sdk\";\n\nfunction CollectionRow({ col }: { col: ApiCollection }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(col.image, { width: 128 });\n  const showImage = imageUrl && !imgError;\n\n  return (\n    <div className=\"group bento-cell overflow-hidden flex flex-col sm:flex-row items-stretch\">\n\n      <div className=\"relative w-full sm:w-32 aspect-square shrink-0 overflow-hidden bg-muted sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={col.name ?? \"\"}\n            fill\n            className=\"object-cover card-media\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 bg-muted flex items-center justify-center\">\n            <Layers className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n\n      <div className=\"flex flex-col justify-between gap-4 p-5 flex-1 min-w-0\">\n        <div className=\"space-y-1\">\n          <div className=\"flex items-start justify-between gap-2\">\n            <div className=\"min-w-0\">\n              <p className=\"font-bold text-base leading-tight truncate\">\n                {col.name ?? \"Unnamed Collection\"}\n              </p>\n              {col.symbol && (\n                <p className=\"text-xs tabular-nums text-muted-foreground mt-0.5\">{col.symbol}</p>\n              )}\n            </div>\n            <Link\n              href={collectionHref(\"STARKNET\", col.contractAddress)}\n              className=\"shrink-0 text-muted-foreground/50 hover:text-muted-foreground transition-colors\"\n              title=\"View collection page\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" />\n            </Link>\n          </div>\n\n          {col.description && (\n            <p className=\"text-xs text-muted-foreground leading-relaxed line-clamp-2\">\n              {col.description}\n            </p>\n          )}\n\n          <div className=\"flex items-center gap-3 pt-1\">\n            <div className=\"flex items-center gap-1.5 text-xs text-muted-foreground\">\n              <Package className=\"h-3 w-3\" />\n              <span>\n                {col.totalSupply != null\n                  ? `${col.totalSupply.toLocaleString()} token${col.totalSupply !== 1 ? \"s\" : \"\"}`\n                  : \"No tokens yet\"}\n              </span>\n            </div>\n            {col.holderCount != null && col.holderCount > 0 && (\n              <div className=\"text-xs text-muted-foreground\">\n                {col.holderCount.toLocaleString()} holder{col.holderCount !== 1 ? \"s\" : \"\"}\n              </div>\n            )}\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Link\n            href={`/launchpad/nfteditions/${col.contractAddress}/mint`}\n            className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n          >\n            <Sparkles className=\"h-3.5 w-3.5\" />\n            Mint editions\n          </Link>\n          <Button variant=\"outline\" size=\"sm\" asChild>\n            <Link href={collectionHref(\"STARKNET\", col.contractAddress)}>\n              View collection\n            </Link>\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction CollectionRowSkeleton() {\n  return (\n    <div className=\"bento-cell overflow-hidden flex flex-col sm:flex-row\">\n      <Skeleton className=\"w-full sm:w-32 aspect-square shrink-0 rounded-none sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\" />\n      <div className=\"flex flex-col gap-3 p-5 flex-1\">\n        <Skeleton className=\"h-5 w-48\" />\n        <Skeleton className=\"h-3 w-24\" />\n        <Skeleton className=\"h-3 w-64\" />\n        <div className=\"flex gap-2 mt-auto\">\n          <Skeleton className=\"h-9 w-32 rounded-xl\" />\n          <Skeleton className=\"h-9 w-28 rounded-xl\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function EditionsPage() {\n  const { walletAddress, walletLoading } = useMedialaneApp();\n  const { collections, isLoading } = useCollectionsByOwner(walletAddress);\n\n  const erc1155 = useMemo(\n    () => collections.filter((c) => c.standard === \"ERC1155\"),\n    [collections]\n  );\n\n  return (\n    <div className=\"pb-16\">\n\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={<Layers className=\"h-4 w-4 text-white\" />}\n              title=\"Limited Editions\"\n              subtitle=\"Pick one of your editions collections and mint new pieces into it.\"\n            />\n          </div>\n        </FadeIn>\n        <FadeIn delay={0.08}>\n          <div className=\"mt-6 flex items-center gap-3\">\n            <Link\n              href=\"/launchpad/nfteditions/create\"\n              className=\"flex items-center gap-2 h-10 px-5 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n            >\n              <Plus className=\"h-4 w-4\" />\n              New collection\n            </Link>\n            <Button variant=\"outline\" size=\"sm\" asChild>\n              <a href=\"https://docs.medialane.io/learn/ip-collection-1155\" target=\"_blank\" rel=\"noopener noreferrer\">\n                Learn more <ArrowRight className=\"h-3.5 w-3.5 ml-1\" />\n              </a>\n            </Button>\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 space-y-5 max-w-5xl mx-auto\">\n        {!walletAddress && !walletLoading ? (\n          <SignInPrompt icon={<Layers className=\"h-10 w-10 text-muted-foreground/30\" />} title=\"Sign in to see your collections\" />\n        ) : isLoading || walletLoading ? (\n          <div className=\"space-y-3\">\n            {Array.from({ length: 3 }).map((_, i) => (\n              <CollectionRowSkeleton key={i} />\n            ))}\n          </div>\n        ) : erc1155.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 editions collections yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-xs\">\n                  Create your first editions collection to start minting.\n                </p>\n              </div>\n              <Link\n                href=\"/launchpad/nfteditions/create\"\n                className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n              >\n                <Plus className=\"h-4 w-4\" />\n                Create your first collection\n              </Link>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <div className=\"flex items-center justify-between\">\n              <p className=\"text-sm font-medium text-muted-foreground\">\n                {erc1155.length} collection{erc1155.length !== 1 ? \"s\" : \"\"}\n              </p>\n            </div>\n            <Stagger className=\"space-y-3\">\n              {erc1155.map((col) => (\n                <StaggerItem key={col.contractAddress}>\n                  <CollectionRow col={col} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n          </>\n        )}\n      </section>\n\n    </div>\n  );\n}\n"],"mappings":"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","names":["Image","Link"]}

package/dist/components/editions-page.js

@@ -33,7 +33,7 @@ function CollectionRow({ col }) {
         src: imageUrl,
         alt: col.name ?? "",
         fill: true,
-        className: "object-cover",
+        className: "object-cover card-media",
         onError: () => setImgError(true),
         unoptimized: true
       }

package/dist/components/editions-page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/editions-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useMemo } from \"react\";\nimport { collectionHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { SignInPrompt } from \"./sign-in-prompt.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport {\n  Layers, Sparkles, Plus, ArrowRight, Package,\n  ExternalLink, Inbox,\n} from \"lucide-react\";\nimport type { ApiCollection } from \"@medialane/sdk\";\n\nfunction CollectionRow({ col }: { col: ApiCollection }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(col.image, { width: 128 });\n  const showImage = imageUrl && !imgError;\n\n  return (\n    <div className=\"group bento-cell overflow-hidden flex flex-col sm:flex-row items-stretch\">\n\n      <div className=\"relative w-full sm:w-32 aspect-square shrink-0 overflow-hidden bg-muted sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={col.name ?? \"\"}\n            fill\n            className=\"object-cover\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 bg-muted flex items-center justify-center\">\n            <Layers className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n\n      <div className=\"flex flex-col justify-between gap-4 p-5 flex-1 min-w-0\">\n        <div className=\"space-y-1\">\n          <div className=\"flex items-start justify-between gap-2\">\n            <div className=\"min-w-0\">\n              <p className=\"font-bold text-base leading-tight truncate\">\n                {col.name ?? \"Unnamed Collection\"}\n              </p>\n              {col.symbol && (\n                <p className=\"text-xs tabular-nums text-muted-foreground mt-0.5\">{col.symbol}</p>\n              )}\n            </div>\n            <Link\n              href={collectionHref(\"STARKNET\", col.contractAddress)}\n              className=\"shrink-0 text-muted-foreground/50 hover:text-muted-foreground transition-colors\"\n              title=\"View collection page\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" />\n            </Link>\n          </div>\n\n          {col.description && (\n            <p className=\"text-xs text-muted-foreground leading-relaxed line-clamp-2\">\n              {col.description}\n            </p>\n          )}\n\n          <div className=\"flex items-center gap-3 pt-1\">\n            <div className=\"flex items-center gap-1.5 text-xs text-muted-foreground\">\n              <Package className=\"h-3 w-3\" />\n              <span>\n                {col.totalSupply != null\n                  ? `${col.totalSupply.toLocaleString()} token${col.totalSupply !== 1 ? \"s\" : \"\"}`\n                  : \"No tokens yet\"}\n              </span>\n            </div>\n            {col.holderCount != null && col.holderCount > 0 && (\n              <div className=\"text-xs text-muted-foreground\">\n                {col.holderCount.toLocaleString()} holder{col.holderCount !== 1 ? \"s\" : \"\"}\n              </div>\n            )}\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Link\n            href={`/launchpad/nfteditions/${col.contractAddress}/mint`}\n            className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n          >\n            <Sparkles className=\"h-3.5 w-3.5\" />\n            Mint editions\n          </Link>\n          <Button variant=\"outline\" size=\"sm\" asChild>\n            <Link href={collectionHref(\"STARKNET\", col.contractAddress)}>\n              View collection\n            </Link>\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction CollectionRowSkeleton() {\n  return (\n    <div className=\"bento-cell overflow-hidden flex flex-col sm:flex-row\">\n      <Skeleton className=\"w-full sm:w-32 aspect-square shrink-0 rounded-none sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\" />\n      <div className=\"flex flex-col gap-3 p-5 flex-1\">\n        <Skeleton className=\"h-5 w-48\" />\n        <Skeleton className=\"h-3 w-24\" />\n        <Skeleton className=\"h-3 w-64\" />\n        <div className=\"flex gap-2 mt-auto\">\n          <Skeleton className=\"h-9 w-32 rounded-xl\" />\n          <Skeleton className=\"h-9 w-28 rounded-xl\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function EditionsPage() {\n  const { walletAddress, walletLoading } = useMedialaneApp();\n  const { collections, isLoading } = useCollectionsByOwner(walletAddress);\n\n  const erc1155 = useMemo(\n    () => collections.filter((c) => c.standard === \"ERC1155\"),\n    [collections]\n  );\n\n  return (\n    <div className=\"pb-16\">\n\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={<Layers className=\"h-4 w-4 text-white\" />}\n              title=\"Limited Editions\"\n              subtitle=\"Pick one of your editions collections and mint new pieces into it.\"\n            />\n          </div>\n        </FadeIn>\n        <FadeIn delay={0.08}>\n          <div className=\"mt-6 flex items-center gap-3\">\n            <Link\n              href=\"/launchpad/nfteditions/create\"\n              className=\"flex items-center gap-2 h-10 px-5 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n            >\n              <Plus className=\"h-4 w-4\" />\n              New collection\n            </Link>\n            <Button variant=\"outline\" size=\"sm\" asChild>\n              <a href=\"https://docs.medialane.io/learn/ip-collection-1155\" target=\"_blank\" rel=\"noopener noreferrer\">\n                Learn more <ArrowRight className=\"h-3.5 w-3.5 ml-1\" />\n              </a>\n            </Button>\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 space-y-5 max-w-5xl mx-auto\">\n        {!walletAddress && !walletLoading ? (\n          <SignInPrompt icon={<Layers className=\"h-10 w-10 text-muted-foreground/30\" />} title=\"Sign in to see your collections\" />\n        ) : isLoading || walletLoading ? (\n          <div className=\"space-y-3\">\n            {Array.from({ length: 3 }).map((_, i) => (\n              <CollectionRowSkeleton key={i} />\n            ))}\n          </div>\n        ) : erc1155.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 editions collections yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-xs\">\n                  Create your first editions collection to start minting.\n                </p>\n              </div>\n              <Link\n                href=\"/launchpad/nfteditions/create\"\n                className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n              >\n                <Plus className=\"h-4 w-4\" />\n                Create your first collection\n              </Link>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <div className=\"flex items-center justify-between\">\n              <p className=\"text-sm font-medium text-muted-foreground\">\n                {erc1155.length} collection{erc1155.length !== 1 ? \"s\" : \"\"}\n              </p>\n            </div>\n            <Stagger className=\"space-y-3\">\n              {erc1155.map((col) => (\n                <StaggerItem key={col.contractAddress}>\n                  <CollectionRow col={col} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n          </>\n        )}\n      </section>\n\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/editions-page.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState, useMemo } from \"react\";\nimport { collectionHref } from \"@medialane/sdk\";\nimport Link from \"./link.js\";\nimport Image from \"./image.js\";\nimport { ServiceHeader } from \"./service-header.js\";\nimport { FadeIn, Stagger, StaggerItem } from \"./motion-primitives.js\";\nimport { Skeleton } from \"./skeleton.js\";\nimport { Button } from \"./button.js\";\nimport { BackButton } from \"./back-button.js\";\nimport { SignInPrompt } from \"./sign-in-prompt.js\";\nimport { useMedialaneApp } from \"./medialane-app.js\";\nimport { useCollectionsByOwner } from \"../utils/use-collections.js\";\nimport { useImageUrl } from \"../utils/use-image-url.js\";\nimport {\n  Layers, Sparkles, Plus, ArrowRight, Package,\n  ExternalLink, Inbox,\n} from \"lucide-react\";\nimport type { ApiCollection } from \"@medialane/sdk\";\n\nfunction CollectionRow({ col }: { col: ApiCollection }) {\n  const [imgError, setImgError] = useState(false);\n  const imageUrl = useImageUrl()(col.image, { width: 128 });\n  const showImage = imageUrl && !imgError;\n\n  return (\n    <div className=\"group bento-cell overflow-hidden flex flex-col sm:flex-row items-stretch\">\n\n      <div className=\"relative w-full sm:w-32 aspect-square shrink-0 overflow-hidden bg-muted sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\">\n        {showImage ? (\n          <Image\n            src={imageUrl}\n            alt={col.name ?? \"\"}\n            fill\n            className=\"object-cover card-media\"\n            onError={() => setImgError(true)}\n            unoptimized\n          />\n        ) : (\n          <div className=\"absolute inset-0 bg-muted flex items-center justify-center\">\n            <Layers className=\"h-8 w-8 text-muted-foreground/30\" />\n          </div>\n        )}\n      </div>\n\n      <div className=\"flex flex-col justify-between gap-4 p-5 flex-1 min-w-0\">\n        <div className=\"space-y-1\">\n          <div className=\"flex items-start justify-between gap-2\">\n            <div className=\"min-w-0\">\n              <p className=\"font-bold text-base leading-tight truncate\">\n                {col.name ?? \"Unnamed Collection\"}\n              </p>\n              {col.symbol && (\n                <p className=\"text-xs tabular-nums text-muted-foreground mt-0.5\">{col.symbol}</p>\n              )}\n            </div>\n            <Link\n              href={collectionHref(\"STARKNET\", col.contractAddress)}\n              className=\"shrink-0 text-muted-foreground/50 hover:text-muted-foreground transition-colors\"\n              title=\"View collection page\"\n            >\n              <ExternalLink className=\"h-3.5 w-3.5\" />\n            </Link>\n          </div>\n\n          {col.description && (\n            <p className=\"text-xs text-muted-foreground leading-relaxed line-clamp-2\">\n              {col.description}\n            </p>\n          )}\n\n          <div className=\"flex items-center gap-3 pt-1\">\n            <div className=\"flex items-center gap-1.5 text-xs text-muted-foreground\">\n              <Package className=\"h-3 w-3\" />\n              <span>\n                {col.totalSupply != null\n                  ? `${col.totalSupply.toLocaleString()} token${col.totalSupply !== 1 ? \"s\" : \"\"}`\n                  : \"No tokens yet\"}\n              </span>\n            </div>\n            {col.holderCount != null && col.holderCount > 0 && (\n              <div className=\"text-xs text-muted-foreground\">\n                {col.holderCount.toLocaleString()} holder{col.holderCount !== 1 ? \"s\" : \"\"}\n              </div>\n            )}\n          </div>\n        </div>\n\n        <div className=\"flex items-center gap-2\">\n          <Link\n            href={`/launchpad/nfteditions/${col.contractAddress}/mint`}\n            className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n          >\n            <Sparkles className=\"h-3.5 w-3.5\" />\n            Mint editions\n          </Link>\n          <Button variant=\"outline\" size=\"sm\" asChild>\n            <Link href={collectionHref(\"STARKNET\", col.contractAddress)}>\n              View collection\n            </Link>\n          </Button>\n        </div>\n      </div>\n    </div>\n  );\n}\n\nfunction CollectionRowSkeleton() {\n  return (\n    <div className=\"bento-cell overflow-hidden flex flex-col sm:flex-row\">\n      <Skeleton className=\"w-full sm:w-32 aspect-square shrink-0 rounded-none sm:self-start sm:m-5 sm:mr-0 sm:rounded-xl\" />\n      <div className=\"flex flex-col gap-3 p-5 flex-1\">\n        <Skeleton className=\"h-5 w-48\" />\n        <Skeleton className=\"h-3 w-24\" />\n        <Skeleton className=\"h-3 w-64\" />\n        <div className=\"flex gap-2 mt-auto\">\n          <Skeleton className=\"h-9 w-32 rounded-xl\" />\n          <Skeleton className=\"h-9 w-28 rounded-xl\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n\nexport function EditionsPage() {\n  const { walletAddress, walletLoading } = useMedialaneApp();\n  const { collections, isLoading } = useCollectionsByOwner(walletAddress);\n\n  const erc1155 = useMemo(\n    () => collections.filter((c) => c.standard === \"ERC1155\"),\n    [collections]\n  );\n\n  return (\n    <div className=\"pb-16\">\n\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={<Layers className=\"h-4 w-4 text-white\" />}\n              title=\"Limited Editions\"\n              subtitle=\"Pick one of your editions collections and mint new pieces into it.\"\n            />\n          </div>\n        </FadeIn>\n        <FadeIn delay={0.08}>\n          <div className=\"mt-6 flex items-center gap-3\">\n            <Link\n              href=\"/launchpad/nfteditions/create\"\n              className=\"flex items-center gap-2 h-10 px-5 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n            >\n              <Plus className=\"h-4 w-4\" />\n              New collection\n            </Link>\n            <Button variant=\"outline\" size=\"sm\" asChild>\n              <a href=\"https://docs.medialane.io/learn/ip-collection-1155\" target=\"_blank\" rel=\"noopener noreferrer\">\n                Learn more <ArrowRight className=\"h-3.5 w-3.5 ml-1\" />\n              </a>\n            </Button>\n          </div>\n        </FadeIn>\n      </section>\n\n      <section className=\"px-4 pt-8 space-y-5 max-w-5xl mx-auto\">\n        {!walletAddress && !walletLoading ? (\n          <SignInPrompt icon={<Layers className=\"h-10 w-10 text-muted-foreground/30\" />} title=\"Sign in to see your collections\" />\n        ) : isLoading || walletLoading ? (\n          <div className=\"space-y-3\">\n            {Array.from({ length: 3 }).map((_, i) => (\n              <CollectionRowSkeleton key={i} />\n            ))}\n          </div>\n        ) : erc1155.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 editions collections yet</p>\n                <p className=\"text-sm text-muted-foreground mt-1 max-w-xs\">\n                  Create your first editions collection to start minting.\n                </p>\n              </div>\n              <Link\n                href=\"/launchpad/nfteditions/create\"\n                className=\"flex items-center gap-2 h-9 px-4 rounded-xl text-sm font-semibold text-white bg-brand-purple hover:brightness-110 transition-colors\"\n              >\n                <Plus className=\"h-4 w-4\" />\n                Create your first collection\n              </Link>\n            </div>\n          </FadeIn>\n        ) : (\n          <>\n            <div className=\"flex items-center justify-between\">\n              <p className=\"text-sm font-medium text-muted-foreground\">\n                {erc1155.length} collection{erc1155.length !== 1 ? \"s\" : \"\"}\n              </p>\n            </div>\n            <Stagger className=\"space-y-3\">\n              {erc1155.map((col) => (\n                <StaggerItem key={col.contractAddress}>\n                  <CollectionRow col={col} />\n                </StaggerItem>\n              ))}\n            </Stagger>\n          </>\n        )}\n      </section>\n\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

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

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

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

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

package/dist/components/launchpad/edition-mint-schema.d.cts

@@ -15,8 +15,8 @@ declare const editionMintSchema: zod.ZodObject<{
     aiPolicy: zod.ZodEnum<["Allowed", "Not Allowed", "Training Only"]>;
     royalty: zod.ZodNumber;
 }, "strip", zod.ZodTypeAny, {
-    name: string;
     value: string;
+    name: string;
     ipType: "Audio" | "Video" | "Art" | "Photography" | "NFT" | "Software" | "RWA" | "Patents" | "Posts" | "Publications" | "Documents" | "Custom";
     licenseType: string;
     commercialUse: "Yes" | "No";
@@ -29,8 +29,8 @@ declare const editionMintSchema: zod.ZodObject<{
     description?: string | undefined;
     external_url?: string | undefined;
 }, {
-    name: string;
     value: string;
+    name: string;
     ipType: "Audio" | "Video" | "Art" | "Photography" | "NFT" | "Software" | "RWA" | "Patents" | "Posts" | "Publications" | "Documents" | "Custom";
     licenseType: string;
     commercialUse: "Yes" | "No";

package/dist/components/launchpad/edition-mint-schema.d.ts

@@ -15,8 +15,8 @@ declare const editionMintSchema: zod.ZodObject<{
     aiPolicy: zod.ZodEnum<["Allowed", "Not Allowed", "Training Only"]>;
     royalty: zod.ZodNumber;
 }, "strip", zod.ZodTypeAny, {
-    name: string;
     value: string;
+    name: string;
     ipType: "Audio" | "Video" | "Art" | "Photography" | "NFT" | "Software" | "RWA" | "Patents" | "Posts" | "Publications" | "Documents" | "Custom";
     licenseType: string;
     commercialUse: "Yes" | "No";
@@ -29,8 +29,8 @@ declare const editionMintSchema: zod.ZodObject<{
     description?: string | undefined;
     external_url?: string | undefined;
 }, {
-    name: string;
     value: string;
+    name: string;
     ipType: "Audio" | "Video" | "Art" | "Photography" | "NFT" | "Software" | "RWA" | "Patents" | "Posts" | "Publications" | "Documents" | "Custom";
     licenseType: string;
     commercialUse: "Yes" | "No";

package/dist/components/listing-card.cjs

@@ -80,7 +80,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
   const assetHref = (0, import_sdk.assetHref)("STARKNET", order.nftContract ?? "", order.nftTokenId ?? "");
   const showActionBar = !!(onBuy || onCart || overflowMenu || primaryAction);
   if (compact) {
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "card-base", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "card-base group", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
       /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
         import_animated_token_media.AnimatedTokenMedia,
         {
@@ -90,7 +90,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__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })
@@ -103,7 +103,7 @@ function ListingCard({ order: rawOrder, inCart = false, onBuy, onCart, overflowM
       ] })
     ] }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "card-base", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.MotionCard, { className: "card-base group", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: assetHref, className: "block", children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative aspect-square bg-muted overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
       import_animated_token_media.AnimatedTokenMedia,
       {
@@ -113,7 +113,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__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/15 to-brand-blue/15" })