@medialane/ui 0.99.0 → 0.100.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -0
- package/dist/components/action-button.cjs +1 -3
- package/dist/components/action-button.cjs.map +1 -1
- package/dist/components/action-button.js +1 -3
- package/dist/components/action-button.js.map +1 -1
- package/dist/components/activity-card.cjs +3 -3
- package/dist/components/activity-card.cjs.map +1 -1
- package/dist/components/activity-card.js +3 -3
- package/dist/components/activity-card.js.map +1 -1
- package/dist/components/activity-feed-shell.cjs +1 -1
- package/dist/components/activity-feed-shell.cjs.map +1 -1
- package/dist/components/activity-feed-shell.js +1 -1
- package/dist/components/activity-feed-shell.js.map +1 -1
- package/dist/components/activity-row.cjs +3 -3
- package/dist/components/activity-row.cjs.map +1 -1
- package/dist/components/activity-row.js +3 -3
- package/dist/components/activity-row.js.map +1 -1
- package/dist/components/activity-ticker.cjs +1 -1
- package/dist/components/activity-ticker.cjs.map +1 -1
- package/dist/components/activity-ticker.js +1 -1
- package/dist/components/activity-ticker.js.map +1 -1
- package/dist/components/asset-card.cjs +2 -2
- package/dist/components/asset-card.cjs.map +1 -1
- package/dist/components/asset-card.js +2 -2
- package/dist/components/asset-card.js.map +1 -1
- package/dist/components/asset-license-summary.cjs +2 -2
- package/dist/components/asset-license-summary.cjs.map +1 -1
- package/dist/components/asset-license-summary.js +2 -2
- package/dist/components/asset-license-summary.js.map +1 -1
- package/dist/components/asset-overview-content.cjs +2 -2
- package/dist/components/asset-overview-content.cjs.map +1 -1
- package/dist/components/asset-overview-content.js +2 -2
- package/dist/components/asset-overview-content.js.map +1 -1
- package/dist/components/asset-picker-cell.cjs +1 -1
- package/dist/components/asset-picker-cell.cjs.map +1 -1
- package/dist/components/asset-picker-cell.js +1 -1
- package/dist/components/asset-picker-cell.js.map +1 -1
- package/dist/components/asset-top-sections.cjs +1 -1
- package/dist/components/asset-top-sections.cjs.map +1 -1
- package/dist/components/asset-top-sections.js +1 -1
- package/dist/components/asset-top-sections.js.map +1 -1
- package/dist/components/asset-utility-icons.cjs +2 -2
- package/dist/components/asset-utility-icons.cjs.map +1 -1
- package/dist/components/asset-utility-icons.js +2 -2
- package/dist/components/asset-utility-icons.js.map +1 -1
- package/dist/components/claim-rail.cjs +1 -1
- package/dist/components/claim-rail.cjs.map +1 -1
- package/dist/components/claim-rail.js +1 -1
- package/dist/components/claim-rail.js.map +1 -1
- package/dist/components/coin-card.cjs +4 -4
- package/dist/components/coin-card.cjs.map +1 -1
- package/dist/components/coin-card.js +4 -4
- package/dist/components/coin-card.js.map +1 -1
- package/dist/components/coin-launch-preview.cjs +5 -5
- package/dist/components/coin-launch-preview.cjs.map +1 -1
- package/dist/components/coin-launch-preview.js +5 -5
- package/dist/components/coin-launch-preview.js.map +1 -1
- package/dist/components/coins-explorer.cjs +3 -3
- package/dist/components/coins-explorer.cjs.map +1 -1
- package/dist/components/coins-explorer.js +3 -3
- package/dist/components/coins-explorer.js.map +1 -1
- package/dist/components/collection-card.cjs +6 -6
- package/dist/components/collection-card.cjs.map +1 -1
- package/dist/components/collection-card.js +6 -6
- package/dist/components/collection-card.js.map +1 -1
- package/dist/components/collection-filters.cjs +5 -5
- package/dist/components/collection-filters.cjs.map +1 -1
- package/dist/components/collection-filters.js +5 -5
- package/dist/components/collection-filters.js.map +1 -1
- package/dist/components/community-rewards-section.cjs +2 -2
- package/dist/components/community-rewards-section.cjs.map +1 -1
- package/dist/components/community-rewards-section.js +2 -2
- package/dist/components/community-rewards-section.js.map +1 -1
- package/dist/components/discover-feed-section.cjs +1 -1
- package/dist/components/discover-feed-section.cjs.map +1 -1
- package/dist/components/discover-feed-section.js +1 -1
- package/dist/components/discover-feed-section.js.map +1 -1
- package/dist/components/featured-carousel.cjs +4 -4
- package/dist/components/featured-carousel.cjs.map +1 -1
- package/dist/components/featured-carousel.js +4 -4
- package/dist/components/featured-carousel.js.map +1 -1
- package/dist/components/gradient-button.cjs +1 -1
- package/dist/components/gradient-button.cjs.map +1 -1
- package/dist/components/gradient-button.js +1 -1
- package/dist/components/gradient-button.js.map +1 -1
- package/dist/components/hero-slider.cjs +2 -2
- package/dist/components/hero-slider.cjs.map +1 -1
- package/dist/components/hero-slider.js +2 -2
- package/dist/components/hero-slider.js.map +1 -1
- package/dist/components/launchpad-filter-bar.cjs +1 -1
- package/dist/components/launchpad-filter-bar.cjs.map +1 -1
- package/dist/components/launchpad-filter-bar.js +1 -1
- package/dist/components/launchpad-filter-bar.js.map +1 -1
- package/dist/components/launchpad-services.cjs +5 -5
- package/dist/components/launchpad-services.cjs.map +1 -1
- package/dist/components/launchpad-services.js +5 -5
- package/dist/components/launchpad-services.js.map +1 -1
- package/dist/components/launchpad-strip.cjs +4 -4
- package/dist/components/launchpad-strip.cjs.map +1 -1
- package/dist/components/launchpad-strip.js +4 -4
- package/dist/components/launchpad-strip.js.map +1 -1
- package/dist/components/listing-card.cjs +7 -7
- package/dist/components/listing-card.cjs.map +1 -1
- package/dist/components/listing-card.js +7 -7
- package/dist/components/listing-card.js.map +1 -1
- package/dist/components/medialane-collection-card.cjs +2 -2
- package/dist/components/medialane-collection-card.cjs.map +1 -1
- package/dist/components/medialane-collection-card.js +2 -2
- package/dist/components/medialane-collection-card.js.map +1 -1
- package/dist/components/nav-command-menu.cjs +5 -5
- package/dist/components/nav-command-menu.cjs.map +1 -1
- package/dist/components/nav-command-menu.js +5 -5
- package/dist/components/nav-command-menu.js.map +1 -1
- package/dist/components/nav-shell.cjs +2 -2
- package/dist/components/nav-shell.cjs.map +1 -1
- package/dist/components/nav-shell.js +2 -2
- package/dist/components/nav-shell.js.map +1 -1
- package/dist/components/portfolio-chip-filter.cjs +1 -1
- package/dist/components/portfolio-chip-filter.cjs.map +1 -1
- package/dist/components/portfolio-chip-filter.js +1 -1
- package/dist/components/portfolio-chip-filter.js.map +1 -1
- package/dist/components/portfolio-nav.cjs +2 -2
- package/dist/components/portfolio-nav.cjs.map +1 -1
- package/dist/components/portfolio-nav.js +2 -2
- package/dist/components/portfolio-nav.js.map +1 -1
- package/dist/components/rewards/journey-path.cjs +2 -2
- package/dist/components/rewards/journey-path.cjs.map +1 -1
- package/dist/components/rewards/journey-path.js +2 -2
- package/dist/components/rewards/journey-path.js.map +1 -1
- package/dist/components/rewards/leaderboard-table.cjs +1 -1
- package/dist/components/rewards/leaderboard-table.cjs.map +1 -1
- package/dist/components/rewards/leaderboard-table.js +1 -1
- package/dist/components/rewards/leaderboard-table.js.map +1 -1
- package/dist/components/rewards/level-badge.cjs +1 -1
- package/dist/components/rewards/level-badge.cjs.map +1 -1
- package/dist/components/rewards/level-badge.js +1 -1
- package/dist/components/rewards/level-badge.js.map +1 -1
- package/dist/components/rewards/level-ladder.cjs +2 -2
- package/dist/components/rewards/level-ladder.cjs.map +1 -1
- package/dist/components/rewards/level-ladder.js +2 -2
- package/dist/components/rewards/level-ladder.js.map +1 -1
- package/dist/components/scroll-section.cjs +1 -1
- package/dist/components/scroll-section.cjs.map +1 -1
- package/dist/components/scroll-section.js +1 -1
- package/dist/components/scroll-section.js.map +1 -1
- package/dist/components/share-button.cjs +1 -1
- package/dist/components/share-button.cjs.map +1 -1
- package/dist/components/share-button.js +1 -1
- package/dist/components/share-button.js.map +1 -1
- package/dist/components/stat-tile.cjs +3 -3
- package/dist/components/stat-tile.cjs.map +1 -1
- package/dist/components/stat-tile.js +3 -3
- package/dist/components/stat-tile.js.map +1 -1
- package/dist/components/token-card.cjs +4 -4
- package/dist/components/token-card.cjs.map +1 -1
- package/dist/components/token-card.js +4 -4
- package/dist/components/token-card.js.map +1 -1
- package/dist/data/brand.cjs +0 -14
- package/dist/data/brand.cjs.map +1 -1
- package/dist/data/brand.d.cts +0 -14
- package/dist/data/brand.d.ts +0 -14
- package/dist/data/brand.js +0 -14
- package/dist/data/brand.js.map +1 -1
- package/dist/medialane.css +4 -0
- package/dist/preset/tailwind.cjs +16 -8
- package/dist/preset/tailwind.cjs.map +1 -1
- package/dist/preset/tailwind.js +16 -8
- package/dist/preset/tailwind.js.map +1 -1
- package/package.json +6 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/leaderboard-table.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { LevelBadge } from \"./level-badge.js\";\n\nexport interface LeaderboardEntryLike {\n /** Kept for API compatibility with the backend's ordered response — not\n * rendered. This is a scoreboard, not a ranking: no \"#1/#2/#3\", no podium\n * colors. Order in the array is still the sort order the caller gets. */\n rank: number;\n address: string;\n publicId?: string | null;\n totalXp: number;\n currentLevel: number;\n currentLevelName: string;\n badgeColor: string;\n}\n\nexport interface LeaderboardTableProps {\n entries: LeaderboardEntryLike[];\n /** The viewer's address — its row gets highlighted. */\n highlightAddress?: string | null;\n /** Render the address cell (e.g. a profile link). Defaults to a shortened address. */\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Scoreboard rows: address, level chip, points. No position number or\n * podium coloring — this celebrates participation, not competition. */\nexport function LeaderboardTable({ entries, highlightAddress, renderAddress, className }: LeaderboardTableProps) {\n return (\n <div className={cn(\"overflow-hidden rounded-xl border border-border\", className)}>\n {entries.map((e) => {\n const isViewer = highlightAddress != null && e.address === highlightAddress;\n return (\n <div\n key={e.address}\n className={cn(\n \"flex items-center gap-3 border-b border-border/60 bg-card px-3 py-2.5 last:border-b-0 sm:px-4\",\n isViewer && \"bg-primary/10\"\n )}\n >\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n {isViewer && <span className=\"ml-1.5 text-xs text-muted-foreground\">(you)</span>}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" className=\"hidden sm:inline-flex\" />\n <span className=\"shrink-0 text-sm font-semibold tabular-nums\"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/leaderboard-table.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { LevelBadge } from \"./level-badge.js\";\n\nexport interface LeaderboardEntryLike {\n /** Kept for API compatibility with the backend's ordered response — not\n * rendered. This is a scoreboard, not a ranking: no \"#1/#2/#3\", no podium\n * colors. Order in the array is still the sort order the caller gets. */\n rank: number;\n address: string;\n publicId?: string | null;\n totalXp: number;\n currentLevel: number;\n currentLevelName: string;\n badgeColor: string;\n}\n\nexport interface LeaderboardTableProps {\n entries: LeaderboardEntryLike[];\n /** The viewer's address — its row gets highlighted. */\n highlightAddress?: string | null;\n /** Render the address cell (e.g. a profile link). Defaults to a shortened address. */\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Scoreboard rows: address, level chip, points. No position number or\n * podium coloring — this celebrates participation, not competition. */\nexport function LeaderboardTable({ entries, highlightAddress, renderAddress, className }: LeaderboardTableProps) {\n return (\n <div className={cn(\"overflow-hidden rounded-xl border border-border\", className)}>\n {entries.map((e) => {\n const isViewer = highlightAddress != null && e.address === highlightAddress;\n return (\n <div\n key={e.address}\n className={cn(\n \"flex items-center gap-3 border-b border-border/60 bg-card px-3 py-2.5 last:border-b-0 sm:px-4\",\n isViewer && \"bg-primary/10\"\n )}\n >\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n {isViewer && <span className=\"ml-1.5 text-xs text-muted-foreground\">(you)</span>}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" className=\"hidden sm:inline-flex\" />\n <span className=\"shrink-0 text-sm font-semibold tabular-nums\">\n {e.totalXp.toLocaleString()}\n <span className=\"ml-1 text-xs font-normal text-muted-foreground\">XP</span>\n </span>\n </div>\n );\n })}\n </div>\n );\n}\n\nexport interface LeaderboardWidgetProps {\n entries: LeaderboardEntryLike[];\n title?: string;\n /** Link to the full scoreboard (\"/rewards\"). */\n href?: string;\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Compact card for homepage/discover rails — same no-ranking scoreboard rows. */\nexport function LeaderboardWidget({ entries, title = \"Community Rewards\", href, renderAddress, className }: LeaderboardWidgetProps) {\n if (entries.length === 0) return null;\n return (\n <section className={cn(\"rounded-xl border border-border bg-card p-4 sm:p-5\", className)}>\n <div className=\"mb-3 flex items-center justify-between\">\n <h2 className=\"text-base font-black\">{title}</h2>\n {href && (\n <a href={href} className=\"text-xs font-semibold text-muted-foreground active:opacity-70\">\n View scoreboard →\n </a>\n )}\n </div>\n <ol className=\"space-y-2.5\">\n {entries.map((e) => (\n <li key={e.address} className=\"flex items-center gap-2.5\">\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" />\n </li>\n ))}\n </ol>\n </section>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0CY;AAzCZ,gBAAmB;AACnB,qBAA+B;AAC/B,yBAA2B;AA0BpB,SAAS,iBAAiB,EAAE,SAAS,kBAAkB,eAAe,UAAU,GAA0B;AAC/G,SACE,4CAAC,SAAI,eAAW,cAAG,mDAAmD,SAAS,GAC5E,kBAAQ,IAAI,CAAC,MAAM;AAClB,UAAM,WAAW,oBAAoB,QAAQ,EAAE,YAAY;AAC3D,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,eAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,QACd;AAAA,QAEA;AAAA,uDAAC,UAAK,WAAU,+CACb;AAAA,4BAAgB,cAAc,EAAE,OAAO,QAAI,+BAAe,EAAE,OAAO;AAAA,YACnE,YAAY,4CAAC,UAAK,WAAU,wCAAuC,mBAAK;AAAA,aAC3E;AAAA,UACA,4CAAC,iCAAW,OAAO,EAAE,cAAc,MAAM,EAAE,kBAAkB,YAAY,EAAE,YAAY,MAAK,MAAK,WAAU,yBAAwB;AAAA,UACnI,6CAAC,UAAK,WAAU,+CACb;AAAA,cAAE,QAAQ,eAAe;AAAA,YAC1B,4CAAC,UAAK,WAAU,kDAAiD,gBAAE;AAAA,aACrE;AAAA;AAAA;AAAA,MAdK,EAAE;AAAA,IAeT;AAAA,EAEJ,CAAC,GACH;AAEJ;AAYO,SAAS,kBAAkB,EAAE,SAAS,QAAQ,qBAAqB,MAAM,eAAe,UAAU,GAA2B;AAClI,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE,6CAAC,aAAQ,eAAW,cAAG,sDAAsD,SAAS,GACpF;AAAA,iDAAC,SAAI,WAAU,0CACb;AAAA,kDAAC,QAAG,WAAU,wBAAwB,iBAAM;AAAA,MAC3C,QACC,4CAAC,OAAE,MAAY,WAAU,iEAAgE,oCAEzF;AAAA,OAEJ;AAAA,IACA,4CAAC,QAAG,WAAU,eACX,kBAAQ,IAAI,CAAC,MACZ,6CAAC,QAAmB,WAAU,6BAC5B;AAAA,kDAAC,UAAK,WAAU,+CACb,0BAAgB,cAAc,EAAE,OAAO,QAAI,+BAAe,EAAE,OAAO,GACtE;AAAA,MACA,4CAAC,iCAAW,OAAO,EAAE,cAAc,MAAM,EAAE,kBAAkB,YAAY,EAAE,YAAY,MAAK,MAAK;AAAA,SAJ1F,EAAE,OAKX,CACD,GACH;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -20,7 +20,7 @@ function LeaderboardTable({ entries, highlightAddress, renderAddress, className
|
|
|
20
20
|
/* @__PURE__ */ jsx(LevelBadge, { level: e.currentLevel, name: e.currentLevelName, badgeColor: e.badgeColor, size: "sm", className: "hidden sm:inline-flex" }),
|
|
21
21
|
/* @__PURE__ */ jsxs("span", { className: "shrink-0 text-sm font-semibold tabular-nums", children: [
|
|
22
22
|
e.totalXp.toLocaleString(),
|
|
23
|
-
"
|
|
23
|
+
/* @__PURE__ */ jsx("span", { className: "ml-1 text-xs font-normal text-muted-foreground", children: "XP" })
|
|
24
24
|
] })
|
|
25
25
|
]
|
|
26
26
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/leaderboard-table.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { LevelBadge } from \"./level-badge.js\";\n\nexport interface LeaderboardEntryLike {\n /** Kept for API compatibility with the backend's ordered response — not\n * rendered. This is a scoreboard, not a ranking: no \"#1/#2/#3\", no podium\n * colors. Order in the array is still the sort order the caller gets. */\n rank: number;\n address: string;\n publicId?: string | null;\n totalXp: number;\n currentLevel: number;\n currentLevelName: string;\n badgeColor: string;\n}\n\nexport interface LeaderboardTableProps {\n entries: LeaderboardEntryLike[];\n /** The viewer's address — its row gets highlighted. */\n highlightAddress?: string | null;\n /** Render the address cell (e.g. a profile link). Defaults to a shortened address. */\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Scoreboard rows: address, level chip, points. No position number or\n * podium coloring — this celebrates participation, not competition. */\nexport function LeaderboardTable({ entries, highlightAddress, renderAddress, className }: LeaderboardTableProps) {\n return (\n <div className={cn(\"overflow-hidden rounded-xl border border-border\", className)}>\n {entries.map((e) => {\n const isViewer = highlightAddress != null && e.address === highlightAddress;\n return (\n <div\n key={e.address}\n className={cn(\n \"flex items-center gap-3 border-b border-border/60 bg-card px-3 py-2.5 last:border-b-0 sm:px-4\",\n isViewer && \"bg-primary/10\"\n )}\n >\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n {isViewer && <span className=\"ml-1.5 text-xs text-muted-foreground\">(you)</span>}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" className=\"hidden sm:inline-flex\" />\n <span className=\"shrink-0 text-sm font-semibold tabular-nums\"
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/leaderboard-table.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { cn } from \"../../utils/cn.js\";\nimport { shortenAddress } from \"../../utils/address.js\";\nimport { LevelBadge } from \"./level-badge.js\";\n\nexport interface LeaderboardEntryLike {\n /** Kept for API compatibility with the backend's ordered response — not\n * rendered. This is a scoreboard, not a ranking: no \"#1/#2/#3\", no podium\n * colors. Order in the array is still the sort order the caller gets. */\n rank: number;\n address: string;\n publicId?: string | null;\n totalXp: number;\n currentLevel: number;\n currentLevelName: string;\n badgeColor: string;\n}\n\nexport interface LeaderboardTableProps {\n entries: LeaderboardEntryLike[];\n /** The viewer's address — its row gets highlighted. */\n highlightAddress?: string | null;\n /** Render the address cell (e.g. a profile link). Defaults to a shortened address. */\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Scoreboard rows: address, level chip, points. No position number or\n * podium coloring — this celebrates participation, not competition. */\nexport function LeaderboardTable({ entries, highlightAddress, renderAddress, className }: LeaderboardTableProps) {\n return (\n <div className={cn(\"overflow-hidden rounded-xl border border-border\", className)}>\n {entries.map((e) => {\n const isViewer = highlightAddress != null && e.address === highlightAddress;\n return (\n <div\n key={e.address}\n className={cn(\n \"flex items-center gap-3 border-b border-border/60 bg-card px-3 py-2.5 last:border-b-0 sm:px-4\",\n isViewer && \"bg-primary/10\"\n )}\n >\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n {isViewer && <span className=\"ml-1.5 text-xs text-muted-foreground\">(you)</span>}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" className=\"hidden sm:inline-flex\" />\n <span className=\"shrink-0 text-sm font-semibold tabular-nums\">\n {e.totalXp.toLocaleString()}\n <span className=\"ml-1 text-xs font-normal text-muted-foreground\">XP</span>\n </span>\n </div>\n );\n })}\n </div>\n );\n}\n\nexport interface LeaderboardWidgetProps {\n entries: LeaderboardEntryLike[];\n title?: string;\n /** Link to the full scoreboard (\"/rewards\"). */\n href?: string;\n renderAddress?: (address: string) => ReactNode;\n className?: string;\n}\n\n/** Compact card for homepage/discover rails — same no-ranking scoreboard rows. */\nexport function LeaderboardWidget({ entries, title = \"Community Rewards\", href, renderAddress, className }: LeaderboardWidgetProps) {\n if (entries.length === 0) return null;\n return (\n <section className={cn(\"rounded-xl border border-border bg-card p-4 sm:p-5\", className)}>\n <div className=\"mb-3 flex items-center justify-between\">\n <h2 className=\"text-base font-black\">{title}</h2>\n {href && (\n <a href={href} className=\"text-xs font-semibold text-muted-foreground active:opacity-70\">\n View scoreboard →\n </a>\n )}\n </div>\n <ol className=\"space-y-2.5\">\n {entries.map((e) => (\n <li key={e.address} className=\"flex items-center gap-2.5\">\n <span className=\"min-w-0 flex-1 truncate text-sm font-medium\">\n {renderAddress ? renderAddress(e.address) : shortenAddress(e.address)}\n </span>\n <LevelBadge level={e.currentLevel} name={e.currentLevelName} badgeColor={e.badgeColor} size=\"sm\" />\n </li>\n ))}\n </ol>\n </section>\n );\n}\n"],"mappings":"AA0CY,SAEe,KAFf;AAzCZ,SAAS,UAAU;AACnB,SAAS,sBAAsB;AAC/B,SAAS,kBAAkB;AA0BpB,SAAS,iBAAiB,EAAE,SAAS,kBAAkB,eAAe,UAAU,GAA0B;AAC/G,SACE,oBAAC,SAAI,WAAW,GAAG,mDAAmD,SAAS,GAC5E,kBAAQ,IAAI,CAAC,MAAM;AAClB,UAAM,WAAW,oBAAoB,QAAQ,EAAE,YAAY;AAC3D,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,WAAW;AAAA,UACT;AAAA,UACA,YAAY;AAAA,QACd;AAAA,QAEA;AAAA,+BAAC,UAAK,WAAU,+CACb;AAAA,4BAAgB,cAAc,EAAE,OAAO,IAAI,eAAe,EAAE,OAAO;AAAA,YACnE,YAAY,oBAAC,UAAK,WAAU,wCAAuC,mBAAK;AAAA,aAC3E;AAAA,UACA,oBAAC,cAAW,OAAO,EAAE,cAAc,MAAM,EAAE,kBAAkB,YAAY,EAAE,YAAY,MAAK,MAAK,WAAU,yBAAwB;AAAA,UACnI,qBAAC,UAAK,WAAU,+CACb;AAAA,cAAE,QAAQ,eAAe;AAAA,YAC1B,oBAAC,UAAK,WAAU,kDAAiD,gBAAE;AAAA,aACrE;AAAA;AAAA;AAAA,MAdK,EAAE;AAAA,IAeT;AAAA,EAEJ,CAAC,GACH;AAEJ;AAYO,SAAS,kBAAkB,EAAE,SAAS,QAAQ,qBAAqB,MAAM,eAAe,UAAU,GAA2B;AAClI,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE,qBAAC,aAAQ,WAAW,GAAG,sDAAsD,SAAS,GACpF;AAAA,yBAAC,SAAI,WAAU,0CACb;AAAA,0BAAC,QAAG,WAAU,wBAAwB,iBAAM;AAAA,MAC3C,QACC,oBAAC,OAAE,MAAY,WAAU,iEAAgE,oCAEzF;AAAA,OAEJ;AAAA,IACA,oBAAC,QAAG,WAAU,eACX,kBAAQ,IAAI,CAAC,MACZ,qBAAC,QAAmB,WAAU,6BAC5B;AAAA,0BAAC,UAAK,WAAU,+CACb,0BAAgB,cAAc,EAAE,OAAO,IAAI,eAAe,EAAE,OAAO,GACtE;AAAA,MACA,oBAAC,cAAW,OAAO,EAAE,cAAc,MAAM,EAAE,kBAAkB,YAAY,EAAE,YAAY,MAAK,MAAK;AAAA,SAJ1F,EAAE,OAKX,CACD,GACH;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -25,7 +25,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
25
25
|
var import_cn = require("../../utils/cn.js");
|
|
26
26
|
function LevelBadge({ level, name, badgeColor, size = "md", className }) {
|
|
27
27
|
const sizeClasses = {
|
|
28
|
-
sm: "h-5 px-1.5 gap-1 text-
|
|
28
|
+
sm: "h-5 px-1.5 gap-1 text-2xs",
|
|
29
29
|
md: "h-6 px-2 gap-1.5 text-xs",
|
|
30
30
|
lg: "h-8 px-3 gap-2 text-sm"
|
|
31
31
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n level: number;\n name: string;\n badgeColor: string;\n size?: \"sm\" | \"md\" | \"lg\";\n className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n * the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n * available on hover via the native title tooltip. Pure presentation — the\n * consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n const sizeClasses = {\n sm: \"h-5 px-1.5 gap-1 text-
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n level: number;\n name: string;\n badgeColor: string;\n size?: \"sm\" | \"md\" | \"lg\";\n className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n * the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n * available on hover via the native title tooltip. Pure presentation — the\n * consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n const sizeClasses = {\n sm: \"h-5 px-1.5 gap-1 text-2xs\",\n md: \"h-6 px-2 gap-1.5 text-xs\",\n lg: \"h-8 px-3 gap-2 text-sm\",\n };\n\n const dotSizes = {\n sm: \"h-1.5 w-1.5\",\n md: \"h-2 w-2\",\n lg: \"h-2.5 w-2.5\",\n };\n\n return (\n <span\n title={`Level ${level}`}\n className={cn(\n \"inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap\",\n sizeClasses[size],\n className\n )}\n style={{ borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor }}\n >\n <span className={cn(\"rounded-full shrink-0\", dotSizes[size])} style={{ backgroundColor: badgeColor }} />\n {name}\n </span>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BI;AA5BJ,gBAAmB;AAcZ,SAAS,WAAW,EAAE,OAAO,MAAM,YAAY,OAAO,MAAM,UAAU,GAAoB;AAC/F,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,eAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,GAAG,UAAU,MAAM,iBAAiB,GAAG,UAAU,MAAM,OAAO,WAAW;AAAA,MAE/F;AAAA,oDAAC,UAAK,eAAW,cAAG,yBAAyB,SAAS,IAAI,CAAC,GAAG,OAAO,EAAE,iBAAiB,WAAW,GAAG;AAAA,QACrG;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
|
|
@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { cn } from "../../utils/cn.js";
|
|
3
3
|
function LevelBadge({ level, name, badgeColor, size = "md", className }) {
|
|
4
4
|
const sizeClasses = {
|
|
5
|
-
sm: "h-5 px-1.5 gap-1 text-
|
|
5
|
+
sm: "h-5 px-1.5 gap-1 text-2xs",
|
|
6
6
|
md: "h-6 px-2 gap-1.5 text-xs",
|
|
7
7
|
lg: "h-8 px-3 gap-2 text-sm"
|
|
8
8
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n level: number;\n name: string;\n badgeColor: string;\n size?: \"sm\" | \"md\" | \"lg\";\n className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n * the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n * available on hover via the native title tooltip. Pure presentation — the\n * consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n const sizeClasses = {\n sm: \"h-5 px-1.5 gap-1 text-
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/level-badge.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelBadgeProps {\n level: number;\n name: string;\n badgeColor: string;\n size?: \"sm\" | \"md\" | \"lg\";\n className?: string;\n}\n\n/** Color-coded level chip — shows the level's title only (\"Voyager\"), not\n * the raw number (\"Lv.6 Voyager\" read as UI noise). The level is still\n * available on hover via the native title tooltip. Pure presentation — the\n * consuming app supplies level data from the rewards API. */\nexport function LevelBadge({ level, name, badgeColor, size = \"md\", className }: LevelBadgeProps) {\n const sizeClasses = {\n sm: \"h-5 px-1.5 gap-1 text-2xs\",\n md: \"h-6 px-2 gap-1.5 text-xs\",\n lg: \"h-8 px-3 gap-2 text-sm\",\n };\n\n const dotSizes = {\n sm: \"h-1.5 w-1.5\",\n md: \"h-2 w-2\",\n lg: \"h-2.5 w-2.5\",\n };\n\n return (\n <span\n title={`Level ${level}`}\n className={cn(\n \"inline-flex items-center rounded-full border font-semibold tracking-tight whitespace-nowrap\",\n sizeClasses[size],\n className\n )}\n style={{ borderColor: `${badgeColor}60`, backgroundColor: `${badgeColor}18`, color: badgeColor }}\n >\n <span className={cn(\"rounded-full shrink-0\", dotSizes[size])} style={{ backgroundColor: badgeColor }} />\n {name}\n </span>\n );\n}\n"],"mappings":"AA4BI,SASE,KATF;AA5BJ,SAAS,UAAU;AAcZ,SAAS,WAAW,EAAE,OAAO,MAAM,YAAY,OAAO,MAAM,UAAU,GAAoB;AAC/F,QAAM,cAAc;AAAA,IAClB,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,QAAM,WAAW;AAAA,IACf,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EACN;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,SAAS,KAAK;AAAA,MACrB,WAAW;AAAA,QACT;AAAA,QACA,YAAY,IAAI;AAAA,QAChB;AAAA,MACF;AAAA,MACA,OAAO,EAAE,aAAa,GAAG,UAAU,MAAM,iBAAiB,GAAG,UAAU,MAAM,OAAO,WAAW;AAAA,MAE/F;AAAA,4BAAC,UAAK,WAAW,GAAG,yBAAyB,SAAS,IAAI,CAAC,GAAG,OAAO,EAAE,iBAAiB,WAAW,GAAG;AAAA,QACrG;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
|
|
@@ -39,8 +39,8 @@ function LevelLadder({ levels, currentLevel, className }) {
|
|
|
39
39
|
backgroundColor: state === "current" ? `${l.badgeColor}22` : `${l.badgeColor}0d`
|
|
40
40
|
},
|
|
41
41
|
children: [
|
|
42
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-
|
|
43
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "whitespace-nowrap text-
|
|
42
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-2xs font-black tabular-nums", style: { color: l.badgeColor }, children: l.level }),
|
|
43
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "whitespace-nowrap text-2xs font-semibold", style: { color: l.badgeColor }, children: l.name })
|
|
44
44
|
]
|
|
45
45
|
},
|
|
46
46
|
l.level
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/level-ladder.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelLadderProps {\n levels: { level: number; name: string; xpRequired: number; badgeColor: string }[];\n currentLevel: number;\n className?: string;\n}\n\n/** The full level arc as a horizontally scrollable chip rail; the current\n * level is highlighted, passed levels render solid, future ones muted. */\nexport function LevelLadder({ levels, currentLevel, className }: LevelLadderProps) {\n return (\n <div className={cn(\"flex gap-2 overflow-x-auto pb-2\", className)}>\n {levels.map((l) => {\n const state = l.level < currentLevel ? \"done\" : l.level === currentLevel ? \"current\" : \"future\";\n return (\n <div\n key={l.level}\n title={`${l.xpRequired.toLocaleString()} XP`}\n className={cn(\n \"flex shrink-0 select-none flex-col items-center gap-0.5 rounded-lg border px-2.5 py-1.5\",\n state === \"future\" && \"opacity-45\"\n )}\n style={{\n borderColor: state === \"current\" ? l.badgeColor : `${l.badgeColor}40`,\n backgroundColor: state === \"current\" ? `${l.badgeColor}22` : `${l.badgeColor}0d`,\n }}\n >\n <span className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/level-ladder.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelLadderProps {\n levels: { level: number; name: string; xpRequired: number; badgeColor: string }[];\n currentLevel: number;\n className?: string;\n}\n\n/** The full level arc as a horizontally scrollable chip rail; the current\n * level is highlighted, passed levels render solid, future ones muted. */\nexport function LevelLadder({ levels, currentLevel, className }: LevelLadderProps) {\n return (\n <div className={cn(\"flex gap-2 overflow-x-auto pb-2\", className)}>\n {levels.map((l) => {\n const state = l.level < currentLevel ? \"done\" : l.level === currentLevel ? \"current\" : \"future\";\n return (\n <div\n key={l.level}\n title={`${l.xpRequired.toLocaleString()} XP`}\n className={cn(\n \"flex shrink-0 select-none flex-col items-center gap-0.5 rounded-lg border px-2.5 py-1.5\",\n state === \"future\" && \"opacity-45\"\n )}\n style={{\n borderColor: state === \"current\" ? l.badgeColor : `${l.badgeColor}40`,\n backgroundColor: state === \"current\" ? `${l.badgeColor}22` : `${l.badgeColor}0d`,\n }}\n >\n <span className=\"text-2xs font-black tabular-nums\" style={{ color: l.badgeColor }}>\n {l.level}\n </span>\n <span className=\"whitespace-nowrap text-2xs font-semibold\" style={{ color: l.badgeColor }}>\n {l.name}\n </span>\n </div>\n );\n })}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBU;AAhBV,gBAAmB;AAUZ,SAAS,YAAY,EAAE,QAAQ,cAAc,UAAU,GAAqB;AACjF,SACE,4CAAC,SAAI,eAAW,cAAG,mCAAmC,SAAS,GAC5D,iBAAO,IAAI,CAAC,MAAM;AACjB,UAAM,QAAQ,EAAE,QAAQ,eAAe,SAAS,EAAE,UAAU,eAAe,YAAY;AACvF,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,OAAO,GAAG,EAAE,WAAW,eAAe,CAAC;AAAA,QACvC,eAAW;AAAA,UACT;AAAA,UACA,UAAU,YAAY;AAAA,QACxB;AAAA,QACA,OAAO;AAAA,UACL,aAAa,UAAU,YAAY,EAAE,aAAa,GAAG,EAAE,UAAU;AAAA,UACjE,iBAAiB,UAAU,YAAY,GAAG,EAAE,UAAU,OAAO,GAAG,EAAE,UAAU;AAAA,QAC9E;AAAA,QAEA;AAAA,sDAAC,UAAK,WAAU,oCAAmC,OAAO,EAAE,OAAO,EAAE,WAAW,GAC7E,YAAE,OACL;AAAA,UACA,4CAAC,UAAK,WAAU,4CAA2C,OAAO,EAAE,OAAO,EAAE,WAAW,GACrF,YAAE,MACL;AAAA;AAAA;AAAA,MAhBK,EAAE;AAAA,IAiBT;AAAA,EAEJ,CAAC,GACH;AAEJ;","names":[]}
|
|
@@ -16,8 +16,8 @@ function LevelLadder({ levels, currentLevel, className }) {
|
|
|
16
16
|
backgroundColor: state === "current" ? `${l.badgeColor}22` : `${l.badgeColor}0d`
|
|
17
17
|
},
|
|
18
18
|
children: [
|
|
19
|
-
/* @__PURE__ */ jsx("span", { className: "text-
|
|
20
|
-
/* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-
|
|
19
|
+
/* @__PURE__ */ jsx("span", { className: "text-2xs font-black tabular-nums", style: { color: l.badgeColor }, children: l.level }),
|
|
20
|
+
/* @__PURE__ */ jsx("span", { className: "whitespace-nowrap text-2xs font-semibold", style: { color: l.badgeColor }, children: l.name })
|
|
21
21
|
]
|
|
22
22
|
},
|
|
23
23
|
l.level
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/rewards/level-ladder.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelLadderProps {\n levels: { level: number; name: string; xpRequired: number; badgeColor: string }[];\n currentLevel: number;\n className?: string;\n}\n\n/** The full level arc as a horizontally scrollable chip rail; the current\n * level is highlighted, passed levels render solid, future ones muted. */\nexport function LevelLadder({ levels, currentLevel, className }: LevelLadderProps) {\n return (\n <div className={cn(\"flex gap-2 overflow-x-auto pb-2\", className)}>\n {levels.map((l) => {\n const state = l.level < currentLevel ? \"done\" : l.level === currentLevel ? \"current\" : \"future\";\n return (\n <div\n key={l.level}\n title={`${l.xpRequired.toLocaleString()} XP`}\n className={cn(\n \"flex shrink-0 select-none flex-col items-center gap-0.5 rounded-lg border px-2.5 py-1.5\",\n state === \"future\" && \"opacity-45\"\n )}\n style={{\n borderColor: state === \"current\" ? l.badgeColor : `${l.badgeColor}40`,\n backgroundColor: state === \"current\" ? `${l.badgeColor}22` : `${l.badgeColor}0d`,\n }}\n >\n <span className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../../src/components/rewards/level-ladder.tsx"],"sourcesContent":["import { cn } from \"../../utils/cn.js\";\n\nexport interface LevelLadderProps {\n levels: { level: number; name: string; xpRequired: number; badgeColor: string }[];\n currentLevel: number;\n className?: string;\n}\n\n/** The full level arc as a horizontally scrollable chip rail; the current\n * level is highlighted, passed levels render solid, future ones muted. */\nexport function LevelLadder({ levels, currentLevel, className }: LevelLadderProps) {\n return (\n <div className={cn(\"flex gap-2 overflow-x-auto pb-2\", className)}>\n {levels.map((l) => {\n const state = l.level < currentLevel ? \"done\" : l.level === currentLevel ? \"current\" : \"future\";\n return (\n <div\n key={l.level}\n title={`${l.xpRequired.toLocaleString()} XP`}\n className={cn(\n \"flex shrink-0 select-none flex-col items-center gap-0.5 rounded-lg border px-2.5 py-1.5\",\n state === \"future\" && \"opacity-45\"\n )}\n style={{\n borderColor: state === \"current\" ? l.badgeColor : `${l.badgeColor}40`,\n backgroundColor: state === \"current\" ? `${l.badgeColor}22` : `${l.badgeColor}0d`,\n }}\n >\n <span className=\"text-2xs font-black tabular-nums\" style={{ color: l.badgeColor }}>\n {l.level}\n </span>\n <span className=\"whitespace-nowrap text-2xs font-semibold\" style={{ color: l.badgeColor }}>\n {l.name}\n </span>\n </div>\n );\n })}\n </div>\n );\n}\n"],"mappings":"AAgBU,SAYE,KAZF;AAhBV,SAAS,UAAU;AAUZ,SAAS,YAAY,EAAE,QAAQ,cAAc,UAAU,GAAqB;AACjF,SACE,oBAAC,SAAI,WAAW,GAAG,mCAAmC,SAAS,GAC5D,iBAAO,IAAI,CAAC,MAAM;AACjB,UAAM,QAAQ,EAAE,QAAQ,eAAe,SAAS,EAAE,UAAU,eAAe,YAAY;AACvF,WACE;AAAA,MAAC;AAAA;AAAA,QAEC,OAAO,GAAG,EAAE,WAAW,eAAe,CAAC;AAAA,QACvC,WAAW;AAAA,UACT;AAAA,UACA,UAAU,YAAY;AAAA,QACxB;AAAA,QACA,OAAO;AAAA,UACL,aAAa,UAAU,YAAY,EAAE,aAAa,GAAG,EAAE,UAAU;AAAA,UACjE,iBAAiB,UAAU,YAAY,GAAG,EAAE,UAAU,OAAO,GAAG,EAAE,UAAU;AAAA,QAC9E;AAAA,QAEA;AAAA,8BAAC,UAAK,WAAU,oCAAmC,OAAO,EAAE,OAAO,EAAE,WAAW,GAC7E,YAAE,OACL;AAAA,UACA,oBAAC,UAAK,WAAU,4CAA2C,OAAO,EAAE,OAAO,EAAE,WAAW,GACrF,YAAE,MACL;AAAA;AAAA;AAAA,MAhBK,EAAE;AAAA,IAiBT;AAAA,EAEJ,CAAC,GACH;AAEJ;","names":[]}
|
|
@@ -50,7 +50,7 @@ function ScrollSection({
|
|
|
50
50
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`, children: icon }),
|
|
51
51
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
52
52
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg sm:text-xl font-semibold leading-none", children: title }),
|
|
53
|
-
subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-
|
|
53
|
+
subtitle && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs text-muted-foreground mt-1", children: subtitle })
|
|
54
54
|
] })
|
|
55
55
|
] }),
|
|
56
56
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/scroll-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\n\nexport interface ScrollSectionProps {\n /** Icon element rendered inside the colored badge */\n icon: React.ReactNode;\n /** Tailwind classes for the icon badge (background + shadow) */\n iconBg: string;\n title: string;\n /** Optional small line under the title (e.g. \"Updated 1m ago\") */\n subtitle?: React.ReactNode;\n /** \"See all\" link destination */\n href: string;\n /** Button label — defaults to \"See all\" */\n linkLabel?: string;\n /** Scroll items: wrap each in a sized snap-start div */\n children: React.ReactNode;\n}\n\nexport function ScrollSection({\n icon,\n iconBg,\n title,\n subtitle,\n href,\n linkLabel = \"See all\",\n children,\n}: ScrollSectionProps) {\n return (\n <section className=\"space-y-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2.5\">\n <div className={`h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`}>\n {icon}\n </div>\n <div>\n <h2 className=\"text-lg sm:text-xl font-semibold leading-none\">{title}</h2>\n {subtitle && <p className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../src/components/scroll-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\n\nexport interface ScrollSectionProps {\n /** Icon element rendered inside the colored badge */\n icon: React.ReactNode;\n /** Tailwind classes for the icon badge (background + shadow) */\n iconBg: string;\n title: string;\n /** Optional small line under the title (e.g. \"Updated 1m ago\") */\n subtitle?: React.ReactNode;\n /** \"See all\" link destination */\n href: string;\n /** Button label — defaults to \"See all\" */\n linkLabel?: string;\n /** Scroll items: wrap each in a sized snap-start div */\n children: React.ReactNode;\n}\n\nexport function ScrollSection({\n icon,\n iconBg,\n title,\n subtitle,\n href,\n linkLabel = \"See all\",\n children,\n}: ScrollSectionProps) {\n return (\n <section className=\"space-y-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2.5\">\n <div className={`h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`}>\n {icon}\n </div>\n <div>\n <h2 className=\"text-lg sm:text-xl font-semibold leading-none\">{title}</h2>\n {subtitle && <p className=\"text-2xs text-muted-foreground mt-1\">{subtitle}</p>}\n </div>\n </div>\n <Link\n href={href}\n className=\"inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground px-3 py-1.5 rounded-md hover:bg-accent transition-colors\"\n >\n {linkLabel} <ArrowRight className=\"h-3.5 w-3.5\" />\n </Link>\n </div>\n\n <div className=\"w-full overflow-x-auto scrollbar-hide\">\n <div className=\"flex gap-5 sm:gap-6 snap-x snap-mandatory pb-2\" style={{ width: \"max-content\" }}>\n {children}\n </div>\n </div>\n </section>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAkCU;AAhCV,kBAAiB;AACjB,0BAA2B;AAkBpB,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AACF,GAAuB;AACrB,SACE,6CAAC,aAAQ,WAAU,aACjB;AAAA,iDAAC,SAAI,WAAU,qCACb;AAAA,mDAAC,SAAI,WAAU,6BACb;AAAA,oDAAC,SAAI,WAAW,uDAAuD,MAAM,IAC1E,gBACH;AAAA,QACA,6CAAC,SACC;AAAA,sDAAC,QAAG,WAAU,iDAAiD,iBAAM;AAAA,UACpE,YAAY,4CAAC,OAAE,WAAU,uCAAuC,oBAAS;AAAA,WAC5E;AAAA,SACF;AAAA,MACA;AAAA,QAAC,YAAAA;AAAA,QAAA;AAAA,UACC;AAAA,UACA,WAAU;AAAA,UAET;AAAA;AAAA,YAAU;AAAA,YAAC,4CAAC,kCAAW,WAAU,eAAc;AAAA;AAAA;AAAA,MAClD;AAAA,OACF;AAAA,IAEA,4CAAC,SAAI,WAAU,yCACb,sDAAC,SAAI,WAAU,kDAAiD,OAAO,EAAE,OAAO,cAAc,GAC3F,UACH,GACF;AAAA,KACF;AAEJ;","names":["Link"]}
|
|
@@ -17,7 +17,7 @@ function ScrollSection({
|
|
|
17
17
|
/* @__PURE__ */ jsx("div", { className: `h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`, children: icon }),
|
|
18
18
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
19
19
|
/* @__PURE__ */ jsx("h2", { className: "text-lg sm:text-xl font-semibold leading-none", children: title }),
|
|
20
|
-
subtitle && /* @__PURE__ */ jsx("p", { className: "text-
|
|
20
|
+
subtitle && /* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground mt-1", children: subtitle })
|
|
21
21
|
] })
|
|
22
22
|
] }),
|
|
23
23
|
/* @__PURE__ */ jsxs(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/scroll-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\n\nexport interface ScrollSectionProps {\n /** Icon element rendered inside the colored badge */\n icon: React.ReactNode;\n /** Tailwind classes for the icon badge (background + shadow) */\n iconBg: string;\n title: string;\n /** Optional small line under the title (e.g. \"Updated 1m ago\") */\n subtitle?: React.ReactNode;\n /** \"See all\" link destination */\n href: string;\n /** Button label — defaults to \"See all\" */\n linkLabel?: string;\n /** Scroll items: wrap each in a sized snap-start div */\n children: React.ReactNode;\n}\n\nexport function ScrollSection({\n icon,\n iconBg,\n title,\n subtitle,\n href,\n linkLabel = \"See all\",\n children,\n}: ScrollSectionProps) {\n return (\n <section className=\"space-y-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2.5\">\n <div className={`h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`}>\n {icon}\n </div>\n <div>\n <h2 className=\"text-lg sm:text-xl font-semibold leading-none\">{title}</h2>\n {subtitle && <p className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../src/components/scroll-section.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport { ArrowRight } from \"lucide-react\";\n\nexport interface ScrollSectionProps {\n /** Icon element rendered inside the colored badge */\n icon: React.ReactNode;\n /** Tailwind classes for the icon badge (background + shadow) */\n iconBg: string;\n title: string;\n /** Optional small line under the title (e.g. \"Updated 1m ago\") */\n subtitle?: React.ReactNode;\n /** \"See all\" link destination */\n href: string;\n /** Button label — defaults to \"See all\" */\n linkLabel?: string;\n /** Scroll items: wrap each in a sized snap-start div */\n children: React.ReactNode;\n}\n\nexport function ScrollSection({\n icon,\n iconBg,\n title,\n subtitle,\n href,\n linkLabel = \"See all\",\n children,\n}: ScrollSectionProps) {\n return (\n <section className=\"space-y-4\">\n <div className=\"flex items-center justify-between\">\n <div className=\"flex items-center gap-2.5\">\n <div className={`h-7 w-7 rounded-lg flex items-center justify-center ${iconBg}`}>\n {icon}\n </div>\n <div>\n <h2 className=\"text-lg sm:text-xl font-semibold leading-none\">{title}</h2>\n {subtitle && <p className=\"text-2xs text-muted-foreground mt-1\">{subtitle}</p>}\n </div>\n </div>\n <Link\n href={href}\n className=\"inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground px-3 py-1.5 rounded-md hover:bg-accent transition-colors\"\n >\n {linkLabel} <ArrowRight className=\"h-3.5 w-3.5\" />\n </Link>\n </div>\n\n <div className=\"w-full overflow-x-auto scrollbar-hide\">\n <div className=\"flex gap-5 sm:gap-6 snap-x snap-mandatory pb-2\" style={{ width: \"max-content\" }}>\n {children}\n </div>\n </div>\n </section>\n );\n}\n"],"mappings":";AAkCU,cAGA,YAHA;AAhCV,OAAO,UAAU;AACjB,SAAS,kBAAkB;AAkBpB,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ;AACF,GAAuB;AACrB,SACE,qBAAC,aAAQ,WAAU,aACjB;AAAA,yBAAC,SAAI,WAAU,qCACb;AAAA,2BAAC,SAAI,WAAU,6BACb;AAAA,4BAAC,SAAI,WAAW,uDAAuD,MAAM,IAC1E,gBACH;AAAA,QACA,qBAAC,SACC;AAAA,8BAAC,QAAG,WAAU,iDAAiD,iBAAM;AAAA,UACpE,YAAY,oBAAC,OAAE,WAAU,uCAAuC,oBAAS;AAAA,WAC5E;AAAA,SACF;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAU;AAAA,UAET;AAAA;AAAA,YAAU;AAAA,YAAC,oBAAC,cAAW,WAAU,eAAc;AAAA;AAAA;AAAA,MAClD;AAAA,OACF;AAAA,IAEA,oBAAC,SAAI,WAAU,yCACb,8BAAC,SAAI,WAAU,kDAAiD,OAAO,EAAE,OAAO,cAAc,GAC3F,UACH,GACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -36,7 +36,7 @@ const SIZE_CLASSES = {
|
|
|
36
36
|
sm: "h-9 px-3 text-xs rounded-md",
|
|
37
37
|
default: "h-10 px-4 py-2 text-sm rounded-md",
|
|
38
38
|
lg: "h-11 px-8 text-sm rounded-md",
|
|
39
|
-
icon: "h-
|
|
39
|
+
icon: "min-h-11 min-w-11 rounded-md"
|
|
40
40
|
};
|
|
41
41
|
function ShareButton({
|
|
42
42
|
title,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/share-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Share2, Check } from \"lucide-react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ShareButtonProps {\n title: string;\n url?: string;\n variant?: \"outline\" | \"ghost\" | \"default\";\n size?: \"sm\" | \"default\" | \"lg\" | \"icon\";\n className?: string;\n}\n\nconst VARIANT_CLASSES: Record<NonNullable<ShareButtonProps[\"variant\"]>, string> = {\n outline: \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n};\n\nconst SIZE_CLASSES: Record<NonNullable<ShareButtonProps[\"size\"]>, string> = {\n sm: \"h-9 px-3 text-xs rounded-md\",\n default: \"h-10 px-4 py-2 text-sm rounded-md\",\n lg: \"h-11 px-8 text-sm rounded-md\",\n icon: \"h-
|
|
1
|
+
{"version":3,"sources":["../../src/components/share-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Share2, Check } from \"lucide-react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ShareButtonProps {\n title: string;\n url?: string;\n variant?: \"outline\" | \"ghost\" | \"default\";\n size?: \"sm\" | \"default\" | \"lg\" | \"icon\";\n className?: string;\n}\n\nconst VARIANT_CLASSES: Record<NonNullable<ShareButtonProps[\"variant\"]>, string> = {\n outline: \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n};\n\nconst SIZE_CLASSES: Record<NonNullable<ShareButtonProps[\"size\"]>, string> = {\n sm: \"h-9 px-3 text-xs rounded-md\",\n default: \"h-10 px-4 py-2 text-sm rounded-md\",\n lg: \"h-11 px-8 text-sm rounded-md\",\n icon: \"min-h-11 min-w-11 rounded-md\",\n};\n\nexport function ShareButton({\n title,\n url,\n variant = \"outline\",\n size = \"sm\",\n className,\n}: ShareButtonProps) {\n const [copied, setCopied] = useState(false);\n\n const handleShare = async () => {\n const shareUrl = url ?? (typeof window !== \"undefined\" ? window.location.href : \"\");\n if (typeof navigator !== \"undefined\" && navigator.share) {\n try {\n await navigator.share({ title, url: shareUrl });\n } catch {\n // User cancelled — ignore\n }\n } else {\n await navigator.clipboard.writeText(shareUrl);\n setCopied(true);\n toast.success(\"Link copied to clipboard\");\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <button\n onClick={handleShare}\n className={cn(\n \"inline-flex items-center justify-center font-medium transition-colors\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n VARIANT_CLASSES[variant],\n SIZE_CLASSES[size],\n className\n )}\n >\n {copied\n ? <Check className=\"h-3.5 w-3.5 text-emerald-500\" />\n : <Share2 className=\"h-3.5 w-3.5\" />\n }\n {size !== \"icon\" && (\n <span className=\"ml-1.5\">{copied ? \"Copied\" : \"Share\"}</span>\n )}\n </button>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsDI;AApDJ,mBAAyB;AACzB,0BAA8B;AAC9B,oBAAsB;AACtB,gBAAmB;AAUnB,MAAM,kBAA4E;AAAA,EAChF,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AACX;AAEA,MAAM,eAAsE;AAAA,EAC1E,IAAI;AAAA,EACJ,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AACF,GAAqB;AACnB,QAAM,CAAC,QAAQ,SAAS,QAAI,uBAAS,KAAK;AAE1C,QAAM,cAAc,YAAY;AAC9B,UAAM,WAAW,QAAQ,OAAO,WAAW,cAAc,OAAO,SAAS,OAAO;AAChF,QAAI,OAAO,cAAc,eAAe,UAAU,OAAO;AACvD,UAAI;AACF,cAAM,UAAU,MAAM,EAAE,OAAO,KAAK,SAAS,CAAC;AAAA,MAChD,QAAQ;AAAA,MAER;AAAA,IACF,OAAO;AACL,YAAM,UAAU,UAAU,UAAU,QAAQ;AAC5C,gBAAU,IAAI;AACd,0BAAM,QAAQ,0BAA0B;AACxC,iBAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AAAA,IACzC;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,eAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB,OAAO;AAAA,QACvB,aAAa,IAAI;AAAA,QACjB;AAAA,MACF;AAAA,MAEC;AAAA,iBACG,4CAAC,6BAAM,WAAU,gCAA+B,IAChD,4CAAC,8BAAO,WAAU,eAAc;AAAA,QAEnC,SAAS,UACR,4CAAC,UAAK,WAAU,UAAU,mBAAS,WAAW,SAAQ;AAAA;AAAA;AAAA,EAE1D;AAEJ;","names":[]}
|
|
@@ -13,7 +13,7 @@ const SIZE_CLASSES = {
|
|
|
13
13
|
sm: "h-9 px-3 text-xs rounded-md",
|
|
14
14
|
default: "h-10 px-4 py-2 text-sm rounded-md",
|
|
15
15
|
lg: "h-11 px-8 text-sm rounded-md",
|
|
16
|
-
icon: "h-
|
|
16
|
+
icon: "min-h-11 min-w-11 rounded-md"
|
|
17
17
|
};
|
|
18
18
|
function ShareButton({
|
|
19
19
|
title,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/share-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Share2, Check } from \"lucide-react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ShareButtonProps {\n title: string;\n url?: string;\n variant?: \"outline\" | \"ghost\" | \"default\";\n size?: \"sm\" | \"default\" | \"lg\" | \"icon\";\n className?: string;\n}\n\nconst VARIANT_CLASSES: Record<NonNullable<ShareButtonProps[\"variant\"]>, string> = {\n outline: \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n};\n\nconst SIZE_CLASSES: Record<NonNullable<ShareButtonProps[\"size\"]>, string> = {\n sm: \"h-9 px-3 text-xs rounded-md\",\n default: \"h-10 px-4 py-2 text-sm rounded-md\",\n lg: \"h-11 px-8 text-sm rounded-md\",\n icon: \"h-
|
|
1
|
+
{"version":3,"sources":["../../src/components/share-button.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { Share2, Check } from \"lucide-react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ShareButtonProps {\n title: string;\n url?: string;\n variant?: \"outline\" | \"ghost\" | \"default\";\n size?: \"sm\" | \"default\" | \"lg\" | \"icon\";\n className?: string;\n}\n\nconst VARIANT_CLASSES: Record<NonNullable<ShareButtonProps[\"variant\"]>, string> = {\n outline: \"border border-input bg-background hover:bg-accent hover:text-accent-foreground\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n};\n\nconst SIZE_CLASSES: Record<NonNullable<ShareButtonProps[\"size\"]>, string> = {\n sm: \"h-9 px-3 text-xs rounded-md\",\n default: \"h-10 px-4 py-2 text-sm rounded-md\",\n lg: \"h-11 px-8 text-sm rounded-md\",\n icon: \"min-h-11 min-w-11 rounded-md\",\n};\n\nexport function ShareButton({\n title,\n url,\n variant = \"outline\",\n size = \"sm\",\n className,\n}: ShareButtonProps) {\n const [copied, setCopied] = useState(false);\n\n const handleShare = async () => {\n const shareUrl = url ?? (typeof window !== \"undefined\" ? window.location.href : \"\");\n if (typeof navigator !== \"undefined\" && navigator.share) {\n try {\n await navigator.share({ title, url: shareUrl });\n } catch {\n // User cancelled — ignore\n }\n } else {\n await navigator.clipboard.writeText(shareUrl);\n setCopied(true);\n toast.success(\"Link copied to clipboard\");\n setTimeout(() => setCopied(false), 2000);\n }\n };\n\n return (\n <button\n onClick={handleShare}\n className={cn(\n \"inline-flex items-center justify-center font-medium transition-colors\",\n \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n VARIANT_CLASSES[variant],\n SIZE_CLASSES[size],\n className\n )}\n >\n {copied\n ? <Check className=\"h-3.5 w-3.5 text-emerald-500\" />\n : <Share2 className=\"h-3.5 w-3.5\" />\n }\n {size !== \"icon\" && (\n <span className=\"ml-1.5\">{copied ? \"Copied\" : \"Share\"}</span>\n )}\n </button>\n );\n}\n"],"mappings":";AAsDI,SAYM,KAZN;AApDJ,SAAS,gBAAgB;AACzB,SAAS,QAAQ,aAAa;AAC9B,SAAS,aAAa;AACtB,SAAS,UAAU;AAUnB,MAAM,kBAA4E;AAAA,EAChF,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AACX;AAEA,MAAM,eAAsE;AAAA,EAC1E,IAAI;AAAA,EACJ,SAAS;AAAA,EACT,IAAI;AAAA,EACJ,MAAM;AACR;AAEO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP;AACF,GAAqB;AACnB,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,KAAK;AAE1C,QAAM,cAAc,YAAY;AAC9B,UAAM,WAAW,QAAQ,OAAO,WAAW,cAAc,OAAO,SAAS,OAAO;AAChF,QAAI,OAAO,cAAc,eAAe,UAAU,OAAO;AACvD,UAAI;AACF,cAAM,UAAU,MAAM,EAAE,OAAO,KAAK,SAAS,CAAC;AAAA,MAChD,QAAQ;AAAA,MAER;AAAA,IACF,OAAO;AACL,YAAM,UAAU,UAAU,UAAU,QAAQ;AAC5C,gBAAU,IAAI;AACd,YAAM,QAAQ,0BAA0B;AACxC,iBAAW,MAAM,UAAU,KAAK,GAAG,GAAI;AAAA,IACzC;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,gBAAgB,OAAO;AAAA,QACvB,aAAa,IAAI;AAAA,QACjB;AAAA,MACF;AAAA,MAEC;AAAA,iBACG,oBAAC,SAAM,WAAU,gCAA+B,IAChD,oBAAC,UAAO,WAAU,eAAc;AAAA,QAEnC,SAAS,UACR,oBAAC,UAAK,WAAU,UAAU,mBAAS,WAAW,SAAQ;AAAA;AAAA;AAAA,EAE1D;AAEJ;","names":[]}
|
|
@@ -51,7 +51,7 @@ function StatTile({
|
|
|
51
51
|
children: value
|
|
52
52
|
}
|
|
53
53
|
),
|
|
54
|
-
sub && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-
|
|
54
|
+
sub && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-2xs text-muted-foreground", children: sub }),
|
|
55
55
|
children
|
|
56
56
|
]
|
|
57
57
|
}
|
|
@@ -63,8 +63,8 @@ function StatPill({ value, label, className }) {
|
|
|
63
63
|
{
|
|
64
64
|
className: `inline-flex items-baseline gap-2 px-4 py-2 rounded-full bg-muted ${className ?? ""}`,
|
|
65
65
|
children: [
|
|
66
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-
|
|
67
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-
|
|
66
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-base font-bold text-foreground tabular-nums", children: value }),
|
|
67
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm text-muted-foreground", children: label })
|
|
68
68
|
]
|
|
69
69
|
}
|
|
70
70
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/stat-tile.tsx"],"sourcesContent":["// Bento stat tile and header stat pill — the design system's data-display primitives.\n\nexport interface StatTileProps {\n label: string;\n /** Shown as the primary value. Pass \"—\" (em dash) for unknown, never zero. */\n value?: string | number | null;\n /** Secondary line below the value. */\n sub?: string;\n /** Override color for the value text (e.g. brand-blue for positive deltas). */\n accent?: string;\n /** Large 22px value variant. */\n big?: boolean;\n radius?: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function StatTile({\n label,\n value,\n sub,\n accent,\n big,\n radius = 16,\n children,\n className,\n}: StatTileProps) {\n return (\n <div\n className={`bg-muted border border-border flex flex-col gap-1 min-w-0 ${className ?? ''}`}\n style={{ borderRadius: radius, padding: '12px 14px' }}\n >\n <span className=\"text-[10.5px] font-semibold tracking-[0.06em] uppercase text-muted-foreground\">\n {label}\n </span>\n {value != null && (\n <span\n className=\"font-semibold leading-none tracking-tight tabular-nums\"\n style={{\n fontSize: big ? 22 : 16,\n color: accent,\n }}\n >\n {value}\n </span>\n )}\n {sub && (\n <span className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../src/components/stat-tile.tsx"],"sourcesContent":["// Bento stat tile and header stat pill — the design system's data-display primitives.\n\nexport interface StatTileProps {\n label: string;\n /** Shown as the primary value. Pass \"—\" (em dash) for unknown, never zero. */\n value?: string | number | null;\n /** Secondary line below the value. */\n sub?: string;\n /** Override color for the value text (e.g. brand-blue for positive deltas). */\n accent?: string;\n /** Large 22px value variant. */\n big?: boolean;\n radius?: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function StatTile({\n label,\n value,\n sub,\n accent,\n big,\n radius = 16,\n children,\n className,\n}: StatTileProps) {\n return (\n <div\n className={`bg-muted border border-border flex flex-col gap-1 min-w-0 ${className ?? ''}`}\n style={{ borderRadius: radius, padding: '12px 14px' }}\n >\n <span className=\"text-[10.5px] font-semibold tracking-[0.06em] uppercase text-muted-foreground\">\n {label}\n </span>\n {value != null && (\n <span\n className=\"font-semibold leading-none tracking-tight tabular-nums\"\n style={{\n fontSize: big ? 22 : 16,\n color: accent,\n }}\n >\n {value}\n </span>\n )}\n {sub && (\n <span className=\"text-2xs text-muted-foreground\">{sub}</span>\n )}\n {children}\n </div>\n );\n}\n\nexport interface StatPillProps {\n value: string | number;\n label: string;\n className?: string;\n}\n\nexport function StatPill({ value, label, className }: StatPillProps) {\n return (\n <div\n className={`inline-flex items-baseline gap-2 px-4 py-2 rounded-full bg-muted ${className ?? ''}`}\n >\n <span className=\"text-base font-bold text-foreground tabular-nums\">\n {value}\n </span>\n <span className=\"text-sm text-muted-foreground\">{label}</span>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BI;AAXG,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAAkB;AAChB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,6DAA6D,aAAa,EAAE;AAAA,MACvF,OAAO,EAAE,cAAc,QAAQ,SAAS,YAAY;AAAA,MAEpD;AAAA,oDAAC,UAAK,WAAU,iFACb,iBACH;AAAA,QACC,SAAS,QACR;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO;AAAA,cACL,UAAU,MAAM,KAAK;AAAA,cACrB,OAAO;AAAA,YACT;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QAED,OACC,4CAAC,UAAK,WAAU,kCAAkC,eAAI;AAAA,QAEvD;AAAA;AAAA;AAAA,EACH;AAEJ;AAQO,SAAS,SAAS,EAAE,OAAO,OAAO,UAAU,GAAkB;AACnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,oEAAoE,aAAa,EAAE;AAAA,MAE9F;AAAA,oDAAC,UAAK,WAAU,oDACb,iBACH;AAAA,QACA,4CAAC,UAAK,WAAU,iCAAiC,iBAAM;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}
|
|
@@ -27,7 +27,7 @@ function StatTile({
|
|
|
27
27
|
children: value
|
|
28
28
|
}
|
|
29
29
|
),
|
|
30
|
-
sub && /* @__PURE__ */ jsx("span", { className: "text-
|
|
30
|
+
sub && /* @__PURE__ */ jsx("span", { className: "text-2xs text-muted-foreground", children: sub }),
|
|
31
31
|
children
|
|
32
32
|
]
|
|
33
33
|
}
|
|
@@ -39,8 +39,8 @@ function StatPill({ value, label, className }) {
|
|
|
39
39
|
{
|
|
40
40
|
className: `inline-flex items-baseline gap-2 px-4 py-2 rounded-full bg-muted ${className ?? ""}`,
|
|
41
41
|
children: [
|
|
42
|
-
/* @__PURE__ */ jsx("span", { className: "text-
|
|
43
|
-
/* @__PURE__ */ jsx("span", { className: "text-
|
|
42
|
+
/* @__PURE__ */ jsx("span", { className: "text-base font-bold text-foreground tabular-nums", children: value }),
|
|
43
|
+
/* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: label })
|
|
44
44
|
]
|
|
45
45
|
}
|
|
46
46
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/stat-tile.tsx"],"sourcesContent":["// Bento stat tile and header stat pill — the design system's data-display primitives.\n\nexport interface StatTileProps {\n label: string;\n /** Shown as the primary value. Pass \"—\" (em dash) for unknown, never zero. */\n value?: string | number | null;\n /** Secondary line below the value. */\n sub?: string;\n /** Override color for the value text (e.g. brand-blue for positive deltas). */\n accent?: string;\n /** Large 22px value variant. */\n big?: boolean;\n radius?: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function StatTile({\n label,\n value,\n sub,\n accent,\n big,\n radius = 16,\n children,\n className,\n}: StatTileProps) {\n return (\n <div\n className={`bg-muted border border-border flex flex-col gap-1 min-w-0 ${className ?? ''}`}\n style={{ borderRadius: radius, padding: '12px 14px' }}\n >\n <span className=\"text-[10.5px] font-semibold tracking-[0.06em] uppercase text-muted-foreground\">\n {label}\n </span>\n {value != null && (\n <span\n className=\"font-semibold leading-none tracking-tight tabular-nums\"\n style={{\n fontSize: big ? 22 : 16,\n color: accent,\n }}\n >\n {value}\n </span>\n )}\n {sub && (\n <span className=\"text-
|
|
1
|
+
{"version":3,"sources":["../../src/components/stat-tile.tsx"],"sourcesContent":["// Bento stat tile and header stat pill — the design system's data-display primitives.\n\nexport interface StatTileProps {\n label: string;\n /** Shown as the primary value. Pass \"—\" (em dash) for unknown, never zero. */\n value?: string | number | null;\n /** Secondary line below the value. */\n sub?: string;\n /** Override color for the value text (e.g. brand-blue for positive deltas). */\n accent?: string;\n /** Large 22px value variant. */\n big?: boolean;\n radius?: number;\n children?: React.ReactNode;\n className?: string;\n}\n\nexport function StatTile({\n label,\n value,\n sub,\n accent,\n big,\n radius = 16,\n children,\n className,\n}: StatTileProps) {\n return (\n <div\n className={`bg-muted border border-border flex flex-col gap-1 min-w-0 ${className ?? ''}`}\n style={{ borderRadius: radius, padding: '12px 14px' }}\n >\n <span className=\"text-[10.5px] font-semibold tracking-[0.06em] uppercase text-muted-foreground\">\n {label}\n </span>\n {value != null && (\n <span\n className=\"font-semibold leading-none tracking-tight tabular-nums\"\n style={{\n fontSize: big ? 22 : 16,\n color: accent,\n }}\n >\n {value}\n </span>\n )}\n {sub && (\n <span className=\"text-2xs text-muted-foreground\">{sub}</span>\n )}\n {children}\n </div>\n );\n}\n\nexport interface StatPillProps {\n value: string | number;\n label: string;\n className?: string;\n}\n\nexport function StatPill({ value, label, className }: StatPillProps) {\n return (\n <div\n className={`inline-flex items-baseline gap-2 px-4 py-2 rounded-full bg-muted ${className ?? ''}`}\n >\n <span className=\"text-base font-bold text-foreground tabular-nums\">\n {value}\n </span>\n <span className=\"text-sm text-muted-foreground\">{label}</span>\n </div>\n );\n}\n"],"mappings":"AA4BI,SAIE,KAJF;AAXG,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AACF,GAAkB;AAChB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,6DAA6D,aAAa,EAAE;AAAA,MACvF,OAAO,EAAE,cAAc,QAAQ,SAAS,YAAY;AAAA,MAEpD;AAAA,4BAAC,UAAK,WAAU,iFACb,iBACH;AAAA,QACC,SAAS,QACR;AAAA,UAAC;AAAA;AAAA,YACC,WAAU;AAAA,YACV,OAAO;AAAA,cACL,UAAU,MAAM,KAAK;AAAA,cACrB,OAAO;AAAA,YACT;AAAA,YAEC;AAAA;AAAA,QACH;AAAA,QAED,OACC,oBAAC,UAAK,WAAU,kCAAkC,eAAI;AAAA,QAEvD;AAAA;AAAA;AAAA,EACH;AAEJ;AAQO,SAAS,SAAS,EAAE,OAAO,OAAO,UAAU,GAAkB;AACnE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,oEAAoE,aAAa,EAAE;AAAA,MAE9F;AAAA,4BAAC,UAAK,WAAU,oDACb,iBACH;AAAA,QACA,oBAAC,UAAK,WAAU,iCAAiC,iBAAM;AAAA;AAAA;AAAA,EACzD;AAEJ;","names":[]}
|
|
@@ -101,25 +101,25 @@ function TokenCard({
|
|
|
101
101
|
] }) })
|
|
102
102
|
}
|
|
103
103
|
),
|
|
104
|
-
listingOrder && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-
|
|
104
|
+
listingOrder && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm", children: [
|
|
105
105
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: listingOrder.price.currency ?? "", size: 10 }),
|
|
106
106
|
(0, import_format.formatDisplayPrice)(listingOrder.price.formatted),
|
|
107
107
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground font-normal", children: listingOrder.price.currency })
|
|
108
108
|
] }) }),
|
|
109
109
|
(token.metadataStatus === "PENDING" || token.metadataStatus === "FETCHING") && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5", children: [
|
|
110
110
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Loader2, { className: "h-3 w-3 animate-spin text-white/70" }),
|
|
111
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-
|
|
111
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-2xs text-white/70", children: "Indexing\u2026" })
|
|
112
112
|
] })
|
|
113
113
|
] }),
|
|
114
114
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "px-3 pt-2.5 pb-4 flex-1", children: [
|
|
115
115
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-base font-bold line-clamp-2 leading-snug", children: name }),
|
|
116
116
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1.5 mt-1.5 flex-wrap", children: [
|
|
117
117
|
ipType && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "sm" }),
|
|
118
|
-
creator ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-
|
|
118
|
+
creator ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-2xs tabular-nums text-muted-foreground/60 truncate", children: [
|
|
119
119
|
creator.slice(0, 8),
|
|
120
120
|
"\u2026",
|
|
121
121
|
creator.slice(-6)
|
|
122
|
-
] }) : token.metadata?.description ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-
|
|
122
|
+
] }) : token.metadata?.description ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs text-muted-foreground truncate leading-snug", children: token.metadata.description }) : null
|
|
123
123
|
] })
|
|
124
124
|
] })
|
|
125
125
|
] }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n token: ApiToken;\n isOwner?: boolean;\n onList?: (token: ApiToken) => void;\n onTransfer?: (token: ApiToken) => void;\n onCancel?: (token: ApiToken) => void;\n onBuy?: (token: ApiToken) => void;\n onOffer?: (token: ApiToken) => void;\n onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n token,\n isOwner = false,\n onList,\n onTransfer,\n onCancel,\n onBuy,\n onOffer,\n onReport,\n}: TokenCardProps) {\n const name = token.metadata?.name || `Token #${token.tokenId}`;\n const image = ipfsToHttp(token.metadata?.image);\n const animationUrl = token.metadata?.animationUrl ?? null;\n const ipType = token.metadata?.ipType;\n\n // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n const listingOrder = token.activeOrders?.find(\n (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n );\n\n const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n const chain = token.chain.toUpperCase() as Chain;\n const live = isLivingRenderCollection(chain, token.contractAddress);\n const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n const collectionHref = buildCollectionHref(chain, token.contractAddress);\n const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n const handleBuy = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onBuy?.(token);\n };\n\n const handleOffer = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onOffer?.(token);\n };\n\n return (\n <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n {/* ── Clickable image + info ─────────────────────────────── */}\n <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n {/* Image */}\n <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\n <AnimatedTokenMedia\n image={image}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n </div>\n }\n />\n\n {/* Price chip — bottom right overlay */}\n {listingOrder && (\n <div className=\"absolute bottom-2 right-2 z-10\">\n <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-[11px] font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n {formatDisplayPrice(listingOrder.price.formatted)}\n <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n </span>\n </div>\n )}\n\n {/* Indexing indicator */}\n {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-[10px] text-white/70\">Indexing…</span>\n </div>\n )}\n </div>\n\n {/* Info */}\n <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n {creator ? (\n <p className=\"text-[10px] tabular-nums text-muted-foreground/60 truncate\">\n {creator.slice(0, 8)}…{creator.slice(-6)}\n </p>\n ) : token.metadata?.description ? (\n <p className=\"text-[10px] text-muted-foreground truncate leading-snug\">\n {token.metadata.description}\n </p>\n ) : null}\n </div>\n </div>\n </Link>\n\n {/* ── Action row ────────────────────────────────────────── */}\n <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n {/* Expand */}\n <Link\n href={assetHref}\n className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n title=\"View asset\"\n >\n <ArrowUpRight className=\"h-3.5 w-3.5\" />\n </Link>\n\n {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n {isOwner ? (\n listingOrder ? (\n <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n View\n </Link>\n ) : (\n <button\n className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n >\n <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n List\n </button>\n )\n ) : listingOrder ? (\n <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\n <button\n className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n onClick={handleBuy}\n >\n <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n Buy\n </button>\n </div>\n ) : (\n <button\n className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n onClick={handleOffer}\n >\n <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n Offer\n </button>\n )}\n\n {/* 3-dot menu */}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <button\n className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n aria-label=\"More actions\"\n >\n <MoreHorizontal className=\"h-3.5 w-3.5\" />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n <DropdownMenuItem asChild>\n <Link href={assetHref} className=\"flex items-center gap-2\">\n <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View asset\n </Link>\n </DropdownMenuItem>\n\n <DropdownMenuSeparator />\n\n {isOwner ? (\n <>\n {!listingOrder && onList && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n onClick={() => onList(token)}\n >\n <Tag className=\"h-3.5 w-3.5\" />\n List\n </DropdownMenuItem>\n )}\n {onTransfer && (\n <DropdownMenuItem\n className=\"flex items-center gap-2\"\n onClick={() => onTransfer(token)}\n >\n <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n Transfer\n </DropdownMenuItem>\n )}\n {listingOrder && onCancel && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n onClick={() => onCancel(token)}\n >\n <XCircle className=\"h-3.5 w-3.5\" />\n Cancel listing\n </DropdownMenuItem>\n )}\n </>\n ) : (\n <>\n {listingOrder && onBuy && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n onClick={handleBuy}\n >\n <Zap className=\"h-3.5 w-3.5\" />\n <span className=\"flex items-center gap-1\">\n Buy —\n <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n {formatDisplayPrice(listingOrder.price.formatted)}\n </span>\n </DropdownMenuItem>\n )}\n {onOffer && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n onClick={handleOffer}\n >\n <HandCoins className=\"h-3.5 w-3.5\" />\n Make offer\n </DropdownMenuItem>\n )}\n </>\n )}\n\n <DropdownMenuItem asChild>\n <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n <GitBranch className=\"h-3.5 w-3.5\" />\n Remix\n </Link>\n </DropdownMenuItem>\n\n <DropdownMenuSeparator />\n\n <DropdownMenuItem asChild>\n <Link href={collectionHref} className=\"flex items-center gap-2\">\n <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View collection\n </Link>\n </DropdownMenuItem>\n\n {(owner ?? creator) && (\n <DropdownMenuItem asChild>\n <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View owner\n </Link>\n </DropdownMenuItem>\n )}\n\n {onReport && (\n <>\n <DropdownMenuSeparator />\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n onClick={() => onReport(token)}\n >\n <Flag className=\"h-3.5 w-3.5\" />\n Report\n </DropdownMenuItem>\n </>\n )}\n\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n </div>\n );\n}\n\nexport function TokenCardSkeleton() {\n return (\n <div className=\"card-base overflow-hidden\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n <div className=\"px-3 pb-3 flex gap-1.5\">\n <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":["buildAssetHref","buildCollectionHref","Link"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/token-card.tsx"],"sourcesContent":["\"use client\";\n\nimport Link from \"next/link\";\nimport {\n Loader2, ArrowUpRight, MoreHorizontal, Zap, HandCoins, Tag,\n Layers, GitBranch, Flag, UserCircle2, ArrowRightLeft, XCircle,\n} from \"lucide-react\";\nimport {\n DropdownMenu, DropdownMenuContent, DropdownMenuItem,\n DropdownMenuSeparator, DropdownMenuTrigger,\n} from \"./dropdown-menu.js\";\nimport { cn } from \"../utils/cn.js\";\nimport { ipfsToHttp } from \"../utils/ipfs.js\";\nimport { formatDisplayPrice } from \"../utils/format.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { AnimatedTokenMedia } from \"./animated-token-media.js\";\nimport { isLivingRenderCollection } from \"../data/living-render-collections.js\";\nimport { assetHref as buildAssetHref, collectionHref as buildCollectionHref } from \"@medialane/sdk\";\nimport type { ApiToken, Chain } from \"@medialane/sdk\";\n\nconst BTN_BASE = \"h-8 rounded-[9px] flex items-center justify-center gap-1.5 text-xs font-semibold transition-all active:scale-[0.98] shadow-none border-0\";\nconst BTN_OUTLINE = cn(BTN_BASE, \"border border-border/60 text-foreground hover:bg-muted/60\");\n\nexport interface TokenCardProps {\n token: ApiToken;\n isOwner?: boolean;\n onList?: (token: ApiToken) => void;\n onTransfer?: (token: ApiToken) => void;\n onCancel?: (token: ApiToken) => void;\n onBuy?: (token: ApiToken) => void;\n onOffer?: (token: ApiToken) => void;\n onReport?: (token: ApiToken) => void;\n}\n\nexport function TokenCard({\n token,\n isOwner = false,\n onList,\n onTransfer,\n onCancel,\n onBuy,\n onOffer,\n onReport,\n}: TokenCardProps) {\n const name = token.metadata?.name || `Token #${token.tokenId}`;\n const image = ipfsToHttp(token.metadata?.image);\n const animationUrl = token.metadata?.animationUrl ?? null;\n const ipType = token.metadata?.ipType;\n\n // First listing-type active order (offer.itemType = ERC721 or ERC1155)\n const listingOrder = token.activeOrders?.find(\n (o) => o.offer.itemType === \"ERC721\" || o.offer.itemType === \"ERC1155\"\n );\n\n const creatorAttr = token.metadata?.attributes?.find((a) => a.trait_type === \"Creator\");\n const creator = typeof creatorAttr?.value === \"string\" ? creatorAttr.value : null;\n const owner = token.balances?.[0]?.owner ?? token.owner ?? null;\n\n const chain = token.chain.toUpperCase() as Chain;\n const live = isLivingRenderCollection(chain, token.contractAddress);\n const assetHref = buildAssetHref(chain, token.contractAddress, token.tokenId);\n const collectionHref = buildCollectionHref(chain, token.contractAddress);\n const remixHref = `/create/remix/${token.contractAddress}/${token.tokenId}`;\n\n const handleBuy = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onBuy?.(token);\n };\n\n const handleOffer = (e: React.MouseEvent) => {\n e.preventDefault();\n e.stopPropagation();\n onOffer?.(token);\n };\n\n return (\n <div className=\"card-base relative overflow-hidden flex flex-col w-full\">\n\n {/* ── Clickable image + info ─────────────────────────────── */}\n <Link href={assetHref} className=\"flex flex-col flex-1\">\n\n {/* Image */}\n <div className=\"relative aspect-square bg-muted overflow-hidden shrink-0\">\n <AnimatedTokenMedia\n image={image}\n animationUrl={animationUrl}\n live={live}\n alt={name}\n mode=\"fill\"\n sizes=\"(max-width: 640px) 50vw, (max-width: 1024px) 33vw, 22vw\"\n className=\"object-cover\"\n fallback={\n <div className=\"absolute inset-0 flex items-center justify-center bg-gradient-to-br from-brand-purple/15 to-brand-blue/15\">\n <span className=\"text-2xl tabular-nums text-muted-foreground\">#{token.tokenId}</span>\n </div>\n }\n />\n\n {/* Price chip — bottom right overlay */}\n {listingOrder && (\n <div className=\"absolute bottom-2 right-2 z-10\">\n <span className=\"inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm\">\n <CurrencyIcon symbol={listingOrder.price.currency ?? \"\"} size={10} />\n {formatDisplayPrice(listingOrder.price.formatted)}\n <span className=\"text-muted-foreground font-normal\">{listingOrder.price.currency}</span>\n </span>\n </div>\n )}\n\n {/* Indexing indicator */}\n {(token.metadataStatus === \"PENDING\" || token.metadataStatus === \"FETCHING\") && (\n <div className=\"absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5\">\n <Loader2 className=\"h-3 w-3 animate-spin text-white/70\" />\n <span className=\"text-2xs text-white/70\">Indexing…</span>\n </div>\n )}\n </div>\n\n {/* Info */}\n <div className=\"px-3 pt-2.5 pb-4 flex-1\">\n <p className=\"text-base font-bold line-clamp-2 leading-snug\">{name}</p>\n <div className=\"flex items-center gap-1.5 mt-1.5 flex-wrap\">\n {ipType && <IpTypeBadge ipType={ipType as any} size=\"sm\" />}\n {creator ? (\n <p className=\"text-2xs tabular-nums text-muted-foreground/60 truncate\">\n {creator.slice(0, 8)}…{creator.slice(-6)}\n </p>\n ) : token.metadata?.description ? (\n <p className=\"text-2xs text-muted-foreground truncate leading-snug\">\n {token.metadata.description}\n </p>\n ) : null}\n </div>\n </div>\n </Link>\n\n {/* ── Action row ────────────────────────────────────────── */}\n <div className=\"px-3 pb-3 flex items-center gap-1.5\">\n\n {/* Expand */}\n <Link\n href={assetHref}\n className={cn(BTN_OUTLINE, \"w-8 shrink-0 px-0\")}\n title=\"View asset\"\n >\n <ArrowUpRight className=\"h-3.5 w-3.5\" />\n </Link>\n\n {/* Owner: List (or Listed label) — Buyer: Buy / Make offer */}\n {isOwner ? (\n listingOrder ? (\n <Link href={assetHref} className={cn(BTN_OUTLINE, \"flex-1\")}>\n <ArrowUpRight className=\"h-3.5 w-3.5 mr-1.5\" />\n View\n </Link>\n ) : (\n <button\n className={cn(BTN_OUTLINE, \"flex-1 text-brand-purple border-brand-purple/30 hover:bg-brand-purple/10 hover:text-brand-purple\")}\n onClick={(e) => { e.preventDefault(); e.stopPropagation(); onList?.(token); }}\n >\n <Tag className=\"h-3.5 w-3.5 mr-1.5\" />\n List\n </button>\n )\n ) : listingOrder ? (\n <div className=\"btn-border-animated p-[1.5px] rounded-[10px] flex-1 h-8\">\n <button\n className=\"w-full h-full rounded-[9px] bg-background flex items-center justify-center gap-1.5 text-xs font-semibold text-foreground hover:bg-muted/60 transition-all active:scale-[0.98]\"\n onClick={handleBuy}\n >\n <Zap className=\"h-3.5 w-3.5 shrink-0\" />\n Buy\n </button>\n </div>\n ) : (\n <button\n className={cn(BTN_OUTLINE, \"flex-1 text-brand-orange border-brand-orange/30 hover:bg-brand-orange/10 hover:text-brand-orange\")}\n onClick={handleOffer}\n >\n <HandCoins className=\"h-3.5 w-3.5 mr-1.5\" />\n Offer\n </button>\n )}\n\n {/* 3-dot menu */}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <button\n className={cn(BTN_OUTLINE, \"w-8 p-0 shrink-0\")}\n aria-label=\"More actions\"\n >\n <MoreHorizontal className=\"h-3.5 w-3.5\" />\n </button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\" className=\"w-52\">\n\n <DropdownMenuItem asChild>\n <Link href={assetHref} className=\"flex items-center gap-2\">\n <ArrowUpRight className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View asset\n </Link>\n </DropdownMenuItem>\n\n <DropdownMenuSeparator />\n\n {isOwner ? (\n <>\n {!listingOrder && onList && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\"\n onClick={() => onList(token)}\n >\n <Tag className=\"h-3.5 w-3.5\" />\n List\n </DropdownMenuItem>\n )}\n {onTransfer && (\n <DropdownMenuItem\n className=\"flex items-center gap-2\"\n onClick={() => onTransfer(token)}\n >\n <ArrowRightLeft className=\"h-3.5 w-3.5 text-muted-foreground\" />\n Transfer\n </DropdownMenuItem>\n )}\n {listingOrder && onCancel && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n onClick={() => onCancel(token)}\n >\n <XCircle className=\"h-3.5 w-3.5\" />\n Cancel listing\n </DropdownMenuItem>\n )}\n </>\n ) : (\n <>\n {listingOrder && onBuy && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-blue focus:text-brand-blue\"\n onClick={handleBuy}\n >\n <Zap className=\"h-3.5 w-3.5\" />\n <span className=\"flex items-center gap-1\">\n Buy —\n <CurrencyIcon symbol={listingOrder.price.currency} size={12} />\n {formatDisplayPrice(listingOrder.price.formatted)}\n </span>\n </DropdownMenuItem>\n )}\n {onOffer && (\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-brand-orange focus:text-brand-orange\"\n onClick={handleOffer}\n >\n <HandCoins className=\"h-3.5 w-3.5\" />\n Make offer\n </DropdownMenuItem>\n )}\n </>\n )}\n\n <DropdownMenuItem asChild>\n <Link href={remixHref} className=\"flex items-center gap-2 text-brand-purple focus:text-brand-purple\">\n <GitBranch className=\"h-3.5 w-3.5\" />\n Remix\n </Link>\n </DropdownMenuItem>\n\n <DropdownMenuSeparator />\n\n <DropdownMenuItem asChild>\n <Link href={collectionHref} className=\"flex items-center gap-2\">\n <Layers className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View collection\n </Link>\n </DropdownMenuItem>\n\n {(owner ?? creator) && (\n <DropdownMenuItem asChild>\n <Link href={`/account/${owner ?? creator}`} className=\"flex items-center gap-2\">\n <UserCircle2 className=\"h-3.5 w-3.5 text-muted-foreground\" />\n View owner\n </Link>\n </DropdownMenuItem>\n )}\n\n {onReport && (\n <>\n <DropdownMenuSeparator />\n <DropdownMenuItem\n className=\"flex items-center gap-2 text-muted-foreground focus:text-muted-foreground\"\n onClick={() => onReport(token)}\n >\n <Flag className=\"h-3.5 w-3.5\" />\n Report\n </DropdownMenuItem>\n </>\n )}\n\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n </div>\n );\n}\n\nexport function TokenCardSkeleton() {\n return (\n <div className=\"card-base overflow-hidden\">\n <div className=\"aspect-square w-full animate-pulse bg-muted\" />\n <div className=\"px-3 pt-2.5 pb-3 space-y-1.5\">\n <div className=\"h-4 w-3/4 rounded-md animate-pulse bg-muted\" />\n <div className=\"h-2.5 w-2/5 rounded-md animate-pulse bg-muted\" />\n </div>\n <div className=\"px-3 pb-3 flex gap-1.5\">\n <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n <div className=\"h-8 flex-1 rounded-[9px] animate-pulse bg-muted\" />\n <div className=\"h-8 w-8 rounded-[9px] animate-pulse bg-muted shrink-0\" />\n </div>\n </div>\n );\n}\n"],"mappings":"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","names":["buildAssetHref","buildCollectionHref","Link"]}
|
|
@@ -86,25 +86,25 @@ function TokenCard({
|
|
|
86
86
|
] }) })
|
|
87
87
|
}
|
|
88
88
|
),
|
|
89
|
-
listingOrder && /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-
|
|
89
|
+
listingOrder && /* @__PURE__ */ jsx("div", { className: "absolute bottom-2 right-2 z-10", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 px-2 py-1 rounded-full text-2xs font-bold bg-background/90 backdrop-blur-sm border border-border/40 shadow-sm", children: [
|
|
90
90
|
/* @__PURE__ */ jsx(CurrencyIcon, { symbol: listingOrder.price.currency ?? "", size: 10 }),
|
|
91
91
|
formatDisplayPrice(listingOrder.price.formatted),
|
|
92
92
|
/* @__PURE__ */ jsx("span", { className: "text-muted-foreground font-normal", children: listingOrder.price.currency })
|
|
93
93
|
] }) }),
|
|
94
94
|
(token.metadataStatus === "PENDING" || token.metadataStatus === "FETCHING") && /* @__PURE__ */ jsxs("div", { className: "absolute bottom-0 inset-x-0 flex items-center justify-center gap-1.5 bg-black/50 backdrop-blur-sm py-1.5", children: [
|
|
95
95
|
/* @__PURE__ */ jsx(Loader2, { className: "h-3 w-3 animate-spin text-white/70" }),
|
|
96
|
-
/* @__PURE__ */ jsx("span", { className: "text-
|
|
96
|
+
/* @__PURE__ */ jsx("span", { className: "text-2xs text-white/70", children: "Indexing\u2026" })
|
|
97
97
|
] })
|
|
98
98
|
] }),
|
|
99
99
|
/* @__PURE__ */ jsxs("div", { className: "px-3 pt-2.5 pb-4 flex-1", children: [
|
|
100
100
|
/* @__PURE__ */ jsx("p", { className: "text-base font-bold line-clamp-2 leading-snug", children: name }),
|
|
101
101
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mt-1.5 flex-wrap", children: [
|
|
102
102
|
ipType && /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm" }),
|
|
103
|
-
creator ? /* @__PURE__ */ jsxs("p", { className: "text-
|
|
103
|
+
creator ? /* @__PURE__ */ jsxs("p", { className: "text-2xs tabular-nums text-muted-foreground/60 truncate", children: [
|
|
104
104
|
creator.slice(0, 8),
|
|
105
105
|
"\u2026",
|
|
106
106
|
creator.slice(-6)
|
|
107
|
-
] }) : token.metadata?.description ? /* @__PURE__ */ jsx("p", { className: "text-
|
|
107
|
+
] }) : token.metadata?.description ? /* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground truncate leading-snug", children: token.metadata.description }) : null
|
|
108
108
|
] })
|
|
109
109
|
] })
|
|
110
110
|
] }),
|