@medialane/ui 0.34.0 → 0.34.1
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/dist/components/asset-collection-bar.cjs +3 -7
- package/dist/components/asset-collection-bar.cjs.map +1 -1
- package/dist/components/asset-collection-bar.d.cts +5 -3
- package/dist/components/asset-collection-bar.d.ts +5 -3
- package/dist/components/asset-collection-bar.js +3 -7
- package/dist/components/asset-collection-bar.js.map +1 -1
- package/dist/components/asset-top-sections.cjs +9 -4
- package/dist/components/asset-top-sections.cjs.map +1 -1
- package/dist/components/asset-top-sections.d.cts +2 -1
- package/dist/components/asset-top-sections.d.ts +2 -1
- package/dist/components/asset-top-sections.js +9 -4
- package/dist/components/asset-top-sections.js.map +1 -1
- package/package.json +1 -1
|
@@ -36,15 +36,12 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
36
36
|
var import_image = __toESM(require("next/image"), 1);
|
|
37
37
|
var import_link = __toESM(require("next/link"), 1);
|
|
38
38
|
var import_lucide_react = require("lucide-react");
|
|
39
|
-
var import_ip_type_badge = require("./ip-type-badge.js");
|
|
40
39
|
var import_share_button = require("./share-button.js");
|
|
41
|
-
var import_ipfs = require("../utils/ipfs.js");
|
|
42
40
|
var import_cn = require("../utils/cn.js");
|
|
43
41
|
function AssetCollectionBar({
|
|
44
42
|
collectionName,
|
|
45
43
|
collectionImage,
|
|
46
44
|
collectionHref,
|
|
47
|
-
ipType,
|
|
48
45
|
contractExplorerHref,
|
|
49
46
|
shareTitle,
|
|
50
47
|
onReportClick,
|
|
@@ -59,9 +56,8 @@ function AssetCollectionBar({
|
|
|
59
56
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-2xl bg-card/40 px-4 py-3 space-y-3", children: [
|
|
60
57
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between gap-3", children: [
|
|
61
58
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_link.default, { href: collectionHref, className: "flex items-center gap-3 min-w-0 group", children: [
|
|
62
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src:
|
|
63
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName })
|
|
64
|
-
ipType ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "sm" }) : null
|
|
59
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: collectionImage, alt: "", fill: true, className: "object-cover", unoptimized: true }) : null }),
|
|
60
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName })
|
|
65
61
|
] }),
|
|
66
62
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-1 shrink-0 text-muted-foreground", children: [
|
|
67
63
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -110,7 +106,7 @@ function AssetCollectionBar({
|
|
|
110
106
|
"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition",
|
|
111
107
|
isCurrent ? "ring-primary" : "ring-transparent hover:ring-border"
|
|
112
108
|
),
|
|
113
|
-
children: sibling.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src:
|
|
109
|
+
children: sibling.image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: sibling.image, alt: "", fill: true, className: "object-cover", unoptimized: true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-full w-full bg-muted" })
|
|
114
110
|
},
|
|
115
111
|
sibling.tokenId
|
|
116
112
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport { ShareButton } from \"./share-button.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface AssetCollectionBarSibling {\n tokenId: string;\n /** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). `null` renders a placeholder. */\n image: string | null;\n}\n\nexport interface AssetCollectionBarProps {\n collectionName: string;\n /** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). */\n collectionImage?: string | null;\n collectionHref: string;\n contractExplorerHref: string;\n shareTitle: string;\n onReportClick: () => void;\n currentTokenId: string;\n siblingTokens: AssetCollectionBarSibling[];\n onNavigate: (tokenId: string) => void;\n}\n\n/**\n * Consolidated collection identity bar: avatar+name and\n * explorer/share/report utility icons on one row, with a filmstrip of\n * collection siblings on a second row for browsing (replaces plain-text\n * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the\n * aurora-glow design language instead of an OpenSea-style boxed panel.\n * IP-type is asset-level, not collection-level — it lives in `AssetHeaderBlock`.\n */\nexport function AssetCollectionBar({\n collectionName,\n collectionImage,\n collectionHref,\n contractExplorerHref,\n shareTitle,\n onReportClick,\n currentTokenId,\n siblingTokens,\n onNavigate,\n}: AssetCollectionBarProps) {\n const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));\n const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;\n const nextToken =\n currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;\n const showFilmstrip = siblingTokens.length > 1;\n\n return (\n <div className=\"rounded-2xl bg-card/40 px-4 py-3 space-y-3\">\n <div className=\"flex items-center justify-between gap-3\">\n <Link href={collectionHref} className=\"flex items-center gap-3 min-w-0 group\">\n <div className=\"relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition\">\n {collectionImage ? (\n <Image src={collectionImage} alt=\"\" fill className=\"object-cover\" unoptimized />\n ) : null}\n </div>\n <p className=\"text-sm font-semibold truncate group-hover:text-primary transition-colors\">\n {collectionName}\n </p>\n </Link>\n\n <div className=\"flex items-center gap-1 shrink-0 text-muted-foreground\">\n <a\n href={contractExplorerHref}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n title=\"View contract\"\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n >\n <ExternalLink className=\"h-4 w-4\" />\n </a>\n <ShareButton title={shareTitle} variant=\"ghost\" size=\"icon\" />\n <button\n type=\"button\"\n title=\"Report this asset\"\n onClick={onReportClick}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n >\n <Flag className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n\n {showFilmstrip ? (\n <div className=\"flex items-center gap-1.5\">\n <button\n type=\"button\"\n disabled={!prevToken}\n onClick={() => prevToken && onNavigate(prevToken.tokenId)}\n className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n >\n <ChevronLeft className=\"h-4 w-4\" />\n </button>\n <div className=\"flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n {siblingTokens.map((sibling) => {\n const isCurrent = String(sibling.tokenId) === String(currentTokenId);\n return (\n <button\n key={sibling.tokenId}\n type=\"button\"\n onClick={() => onNavigate(sibling.tokenId)}\n className={cn(\n \"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition\",\n isCurrent ? \"ring-primary\" : \"ring-transparent hover:ring-border\"\n )}\n >\n {sibling.image ? (\n <Image src={sibling.image} alt=\"\" fill className=\"object-cover\" unoptimized />\n ) : (\n <div className=\"h-full w-full bg-muted\" />\n )}\n </button>\n );\n })}\n </div>\n <button\n type=\"button\"\n disabled={!nextToken}\n onClick={() => nextToken && onNavigate(nextToken.tokenId)}\n className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n >\n <ChevronRight className=\"h-4 w-4\" />\n </button>\n </div>\n ) : null}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAuDQ;AArDR,mBAAkB;AAClB,kBAAiB;AACjB,0BAA8D;AAC9D,0BAA4B;AAC5B,gBAAmB;AA6BZ,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,eAAe,cAAc,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,MAAM,OAAO,cAAc,CAAC;AAChG,QAAM,YAAY,eAAe,IAAI,cAAc,eAAe,CAAC,IAAI;AACvE,QAAM,YACJ,gBAAgB,KAAK,eAAe,cAAc,SAAS,IAAI,cAAc,eAAe,CAAC,IAAI;AACnG,QAAM,gBAAgB,cAAc,SAAS;AAE7C,SACE,6CAAC,SAAI,WAAU,8CACb;AAAA,iDAAC,SAAI,WAAU,2CACb;AAAA,mDAAC,YAAAA,SAAA,EAAK,MAAM,gBAAgB,WAAU,yCACpC;AAAA,oDAAC,SAAI,WAAU,0KACZ,4BACC,4CAAC,aAAAC,SAAA,EAAM,KAAK,iBAAiB,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAC5E,MACN;AAAA,QACA,4CAAC,OAAE,WAAU,6EACV,0BACH;AAAA,SACF;AAAA,MAEA,6CAAC,SAAI,WAAU,0DACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YAEV,sDAAC,oCAAa,WAAU,WAAU;AAAA;AAAA,QACpC;AAAA,QACA,4CAAC,mCAAY,OAAO,YAAY,SAAQ,SAAQ,MAAK,QAAO;AAAA,QAC5D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAM;AAAA,YACN,SAAS;AAAA,YACT,WAAU;AAAA,YAEV,sDAAC,4BAAK,WAAU,WAAU;AAAA;AAAA,QAC5B;AAAA,SACF;AAAA,OACF;AAAA,IAEC,gBACC,6CAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,sDAAC,mCAAY,WAAU,WAAU;AAAA;AAAA,MACnC;AAAA,MACA,4CAAC,SAAI,WAAU,8GACZ,wBAAc,IAAI,CAAC,YAAY;AAC9B,cAAM,YAAY,OAAO,QAAQ,OAAO,MAAM,OAAO,cAAc;AACnE,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,WAAW,QAAQ,OAAO;AAAA,YACzC,eAAW;AAAA,cACT;AAAA,cACA,YAAY,iBAAiB;AAAA,YAC/B;AAAA,YAEC,kBAAQ,QACP,4CAAC,aAAAA,SAAA,EAAM,KAAK,QAAQ,OAAO,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAE5E,4CAAC,SAAI,WAAU,0BAAyB;AAAA;AAAA,UAXrC,QAAQ;AAAA,QAaf;AAAA,MAEJ,CAAC,GACH;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,sDAAC,oCAAa,WAAU,WAAU;AAAA;AAAA,MACpC;AAAA,OACF,IACE;AAAA,KACN;AAEJ;","names":["Link","Image"]}
|
|
@@ -2,13 +2,14 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
|
2
2
|
|
|
3
3
|
interface AssetCollectionBarSibling {
|
|
4
4
|
tokenId: string;
|
|
5
|
+
/** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). `null` renders a placeholder. */
|
|
5
6
|
image: string | null;
|
|
6
7
|
}
|
|
7
8
|
interface AssetCollectionBarProps {
|
|
8
9
|
collectionName: string;
|
|
10
|
+
/** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). */
|
|
9
11
|
collectionImage?: string | null;
|
|
10
12
|
collectionHref: string;
|
|
11
|
-
ipType?: string | null;
|
|
12
13
|
contractExplorerHref: string;
|
|
13
14
|
shareTitle: string;
|
|
14
15
|
onReportClick: () => void;
|
|
@@ -17,12 +18,13 @@ interface AssetCollectionBarProps {
|
|
|
17
18
|
onNavigate: (tokenId: string) => void;
|
|
18
19
|
}
|
|
19
20
|
/**
|
|
20
|
-
* Consolidated collection identity bar: avatar+name
|
|
21
|
+
* Consolidated collection identity bar: avatar+name and
|
|
21
22
|
* explorer/share/report utility icons on one row, with a filmstrip of
|
|
22
23
|
* collection siblings on a second row for browsing (replaces plain-text
|
|
23
24
|
* Prev/Next). Soft `bg-card/40` surface, no hard border — matches the
|
|
24
25
|
* aurora-glow design language instead of an OpenSea-style boxed panel.
|
|
26
|
+
* IP-type is asset-level, not collection-level — it lives in `AssetHeaderBlock`.
|
|
25
27
|
*/
|
|
26
|
-
declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref,
|
|
28
|
+
declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref, contractExplorerHref, shareTitle, onReportClick, currentTokenId, siblingTokens, onNavigate, }: AssetCollectionBarProps): react_jsx_runtime.JSX.Element;
|
|
27
29
|
|
|
28
30
|
export { AssetCollectionBar, type AssetCollectionBarProps, type AssetCollectionBarSibling };
|
|
@@ -2,13 +2,14 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
|
2
2
|
|
|
3
3
|
interface AssetCollectionBarSibling {
|
|
4
4
|
tokenId: string;
|
|
5
|
+
/** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). `null` renders a placeholder. */
|
|
5
6
|
image: string | null;
|
|
6
7
|
}
|
|
7
8
|
interface AssetCollectionBarProps {
|
|
8
9
|
collectionName: string;
|
|
10
|
+
/** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). */
|
|
9
11
|
collectionImage?: string | null;
|
|
10
12
|
collectionHref: string;
|
|
11
|
-
ipType?: string | null;
|
|
12
13
|
contractExplorerHref: string;
|
|
13
14
|
shareTitle: string;
|
|
14
15
|
onReportClick: () => void;
|
|
@@ -17,12 +18,13 @@ interface AssetCollectionBarProps {
|
|
|
17
18
|
onNavigate: (tokenId: string) => void;
|
|
18
19
|
}
|
|
19
20
|
/**
|
|
20
|
-
* Consolidated collection identity bar: avatar+name
|
|
21
|
+
* Consolidated collection identity bar: avatar+name and
|
|
21
22
|
* explorer/share/report utility icons on one row, with a filmstrip of
|
|
22
23
|
* collection siblings on a second row for browsing (replaces plain-text
|
|
23
24
|
* Prev/Next). Soft `bg-card/40` surface, no hard border — matches the
|
|
24
25
|
* aurora-glow design language instead of an OpenSea-style boxed panel.
|
|
26
|
+
* IP-type is asset-level, not collection-level — it lives in `AssetHeaderBlock`.
|
|
25
27
|
*/
|
|
26
|
-
declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref,
|
|
28
|
+
declare function AssetCollectionBar({ collectionName, collectionImage, collectionHref, contractExplorerHref, shareTitle, onReportClick, currentTokenId, siblingTokens, onNavigate, }: AssetCollectionBarProps): react_jsx_runtime.JSX.Element;
|
|
27
29
|
|
|
28
30
|
export { AssetCollectionBar, type AssetCollectionBarProps, type AssetCollectionBarSibling };
|
|
@@ -3,15 +3,12 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import Image from "next/image";
|
|
4
4
|
import Link from "next/link";
|
|
5
5
|
import { ChevronLeft, ChevronRight, ExternalLink, Flag } from "lucide-react";
|
|
6
|
-
import { IpTypeBadge } from "./ip-type-badge.js";
|
|
7
6
|
import { ShareButton } from "./share-button.js";
|
|
8
|
-
import { ipfsToHttp } from "../utils/ipfs.js";
|
|
9
7
|
import { cn } from "../utils/cn.js";
|
|
10
8
|
function AssetCollectionBar({
|
|
11
9
|
collectionName,
|
|
12
10
|
collectionImage,
|
|
13
11
|
collectionHref,
|
|
14
|
-
ipType,
|
|
15
12
|
contractExplorerHref,
|
|
16
13
|
shareTitle,
|
|
17
14
|
onReportClick,
|
|
@@ -26,9 +23,8 @@ function AssetCollectionBar({
|
|
|
26
23
|
return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl bg-card/40 px-4 py-3 space-y-3", children: [
|
|
27
24
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-3", children: [
|
|
28
25
|
/* @__PURE__ */ jsxs(Link, { href: collectionHref, className: "flex items-center gap-3 min-w-0 group", children: [
|
|
29
|
-
/* @__PURE__ */ jsx("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ jsx(Image, { src:
|
|
30
|
-
/* @__PURE__ */ jsx("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName })
|
|
31
|
-
ipType ? /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "sm" }) : null
|
|
26
|
+
/* @__PURE__ */ jsx("div", { className: "relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition", children: collectionImage ? /* @__PURE__ */ jsx(Image, { src: collectionImage, alt: "", fill: true, className: "object-cover", unoptimized: true }) : null }),
|
|
27
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm font-semibold truncate group-hover:text-primary transition-colors", children: collectionName })
|
|
32
28
|
] }),
|
|
33
29
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1 shrink-0 text-muted-foreground", children: [
|
|
34
30
|
/* @__PURE__ */ jsx(
|
|
@@ -77,7 +73,7 @@ function AssetCollectionBar({
|
|
|
77
73
|
"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition",
|
|
78
74
|
isCurrent ? "ring-primary" : "ring-transparent hover:ring-border"
|
|
79
75
|
),
|
|
80
|
-
children: sibling.image ? /* @__PURE__ */ jsx(Image, { src:
|
|
76
|
+
children: sibling.image ? /* @__PURE__ */ jsx(Image, { src: sibling.image, alt: "", fill: true, className: "object-cover", unoptimized: true }) : /* @__PURE__ */ jsx("div", { className: "h-full w-full bg-muted" })
|
|
81
77
|
},
|
|
82
78
|
sibling.tokenId
|
|
83
79
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-collection-bar.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { ChevronLeft, ChevronRight, ExternalLink, Flag } from \"lucide-react\";\nimport { ShareButton } from \"./share-button.js\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface AssetCollectionBarSibling {\n tokenId: string;\n /** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). `null` renders a placeholder. */\n image: string | null;\n}\n\nexport interface AssetCollectionBarProps {\n collectionName: string;\n /** Already-resolved, ready-to-render src (e.g. via the caller's ipfsToHttp). */\n collectionImage?: string | null;\n collectionHref: string;\n contractExplorerHref: string;\n shareTitle: string;\n onReportClick: () => void;\n currentTokenId: string;\n siblingTokens: AssetCollectionBarSibling[];\n onNavigate: (tokenId: string) => void;\n}\n\n/**\n * Consolidated collection identity bar: avatar+name and\n * explorer/share/report utility icons on one row, with a filmstrip of\n * collection siblings on a second row for browsing (replaces plain-text\n * Prev/Next). Soft `bg-card/40` surface, no hard border — matches the\n * aurora-glow design language instead of an OpenSea-style boxed panel.\n * IP-type is asset-level, not collection-level — it lives in `AssetHeaderBlock`.\n */\nexport function AssetCollectionBar({\n collectionName,\n collectionImage,\n collectionHref,\n contractExplorerHref,\n shareTitle,\n onReportClick,\n currentTokenId,\n siblingTokens,\n onNavigate,\n}: AssetCollectionBarProps) {\n const currentIndex = siblingTokens.findIndex((t) => String(t.tokenId) === String(currentTokenId));\n const prevToken = currentIndex > 0 ? siblingTokens[currentIndex - 1] : null;\n const nextToken =\n currentIndex >= 0 && currentIndex < siblingTokens.length - 1 ? siblingTokens[currentIndex + 1] : null;\n const showFilmstrip = siblingTokens.length > 1;\n\n return (\n <div className=\"rounded-2xl bg-card/40 px-4 py-3 space-y-3\">\n <div className=\"flex items-center justify-between gap-3\">\n <Link href={collectionHref} className=\"flex items-center gap-3 min-w-0 group\">\n <div className=\"relative h-10 w-10 rounded-xl overflow-hidden shrink-0 bg-gradient-to-br from-primary/20 to-purple-500/20 ring-1 ring-border/60 group-hover:ring-primary/40 transition\">\n {collectionImage ? (\n <Image src={collectionImage} alt=\"\" fill className=\"object-cover\" unoptimized />\n ) : null}\n </div>\n <p className=\"text-sm font-semibold truncate group-hover:text-primary transition-colors\">\n {collectionName}\n </p>\n </Link>\n\n <div className=\"flex items-center gap-1 shrink-0 text-muted-foreground\">\n <a\n href={contractExplorerHref}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n title=\"View contract\"\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n >\n <ExternalLink className=\"h-4 w-4\" />\n </a>\n <ShareButton title={shareTitle} variant=\"ghost\" size=\"icon\" />\n <button\n type=\"button\"\n title=\"Report this asset\"\n onClick={onReportClick}\n className=\"inline-flex h-9 w-9 items-center justify-center rounded-lg hover:bg-muted/50 hover:text-foreground transition-colors\"\n >\n <Flag className=\"h-4 w-4\" />\n </button>\n </div>\n </div>\n\n {showFilmstrip ? (\n <div className=\"flex items-center gap-1.5\">\n <button\n type=\"button\"\n disabled={!prevToken}\n onClick={() => prevToken && onNavigate(prevToken.tokenId)}\n className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n >\n <ChevronLeft className=\"h-4 w-4\" />\n </button>\n <div className=\"flex items-center gap-2 overflow-x-auto scroll-smooth [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\">\n {siblingTokens.map((sibling) => {\n const isCurrent = String(sibling.tokenId) === String(currentTokenId);\n return (\n <button\n key={sibling.tokenId}\n type=\"button\"\n onClick={() => onNavigate(sibling.tokenId)}\n className={cn(\n \"relative h-11 w-11 shrink-0 rounded-lg overflow-hidden ring-2 transition\",\n isCurrent ? \"ring-primary\" : \"ring-transparent hover:ring-border\"\n )}\n >\n {sibling.image ? (\n <Image src={sibling.image} alt=\"\" fill className=\"object-cover\" unoptimized />\n ) : (\n <div className=\"h-full w-full bg-muted\" />\n )}\n </button>\n );\n })}\n </div>\n <button\n type=\"button\"\n disabled={!nextToken}\n onClick={() => nextToken && onNavigate(nextToken.tokenId)}\n className=\"shrink-0 inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition hover:text-foreground active:scale-95 disabled:opacity-30 disabled:pointer-events-none\"\n >\n <ChevronRight className=\"h-4 w-4\" />\n </button>\n </div>\n ) : null}\n </div>\n );\n}\n"],"mappings":";AAuDQ,SAGM,KAHN;AArDR,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,aAAa,cAAc,cAAc,YAAY;AAC9D,SAAS,mBAAmB;AAC5B,SAAS,UAAU;AA6BZ,SAAS,mBAAmB;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA4B;AAC1B,QAAM,eAAe,cAAc,UAAU,CAAC,MAAM,OAAO,EAAE,OAAO,MAAM,OAAO,cAAc,CAAC;AAChG,QAAM,YAAY,eAAe,IAAI,cAAc,eAAe,CAAC,IAAI;AACvE,QAAM,YACJ,gBAAgB,KAAK,eAAe,cAAc,SAAS,IAAI,cAAc,eAAe,CAAC,IAAI;AACnG,QAAM,gBAAgB,cAAc,SAAS;AAE7C,SACE,qBAAC,SAAI,WAAU,8CACb;AAAA,yBAAC,SAAI,WAAU,2CACb;AAAA,2BAAC,QAAK,MAAM,gBAAgB,WAAU,yCACpC;AAAA,4BAAC,SAAI,WAAU,0KACZ,4BACC,oBAAC,SAAM,KAAK,iBAAiB,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAC5E,MACN;AAAA,QACA,oBAAC,OAAE,WAAU,6EACV,0BACH;AAAA,SACF;AAAA,MAEA,qBAAC,SAAI,WAAU,0DACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,QAAO;AAAA,YACP,KAAI;AAAA,YACJ,OAAM;AAAA,YACN,WAAU;AAAA,YAEV,8BAAC,gBAAa,WAAU,WAAU;AAAA;AAAA,QACpC;AAAA,QACA,oBAAC,eAAY,OAAO,YAAY,SAAQ,SAAQ,MAAK,QAAO;AAAA,QAC5D;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAM;AAAA,YACN,SAAS;AAAA,YACT,WAAU;AAAA,YAEV,8BAAC,QAAK,WAAU,WAAU;AAAA;AAAA,QAC5B;AAAA,SACF;AAAA,OACF;AAAA,IAEC,gBACC,qBAAC,SAAI,WAAU,6BACb;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,8BAAC,eAAY,WAAU,WAAU;AAAA;AAAA,MACnC;AAAA,MACA,oBAAC,SAAI,WAAU,8GACZ,wBAAc,IAAI,CAAC,YAAY;AAC9B,cAAM,YAAY,OAAO,QAAQ,OAAO,MAAM,OAAO,cAAc;AACnE,eACE;AAAA,UAAC;AAAA;AAAA,YAEC,MAAK;AAAA,YACL,SAAS,MAAM,WAAW,QAAQ,OAAO;AAAA,YACzC,WAAW;AAAA,cACT;AAAA,cACA,YAAY,iBAAiB;AAAA,YAC/B;AAAA,YAEC,kBAAQ,QACP,oBAAC,SAAM,KAAK,QAAQ,OAAO,KAAI,IAAG,MAAI,MAAC,WAAU,gBAAe,aAAW,MAAC,IAE5E,oBAAC,SAAI,WAAU,0BAAyB;AAAA;AAAA,UAXrC,QAAQ;AAAA,QAaf;AAAA,MAEJ,CAAC,GACH;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,aAAa,WAAW,UAAU,OAAO;AAAA,UACxD,WAAU;AAAA,UAEV,8BAAC,gBAAa,WAAU,WAAU;AAAA;AAAA,MACpC;AAAA,OACF,IACE;AAAA,KACN;AAEJ;","names":[]}
|
|
@@ -40,6 +40,7 @@ var import_link = __toESM(require("next/link"), 1);
|
|
|
40
40
|
var import_framer_motion = require("framer-motion");
|
|
41
41
|
var import_address_display = require("./address-display.js");
|
|
42
42
|
var import_parent_attribution_banner = require("./parent-attribution-banner.js");
|
|
43
|
+
var import_ip_type_badge = require("./ip-type-badge.js");
|
|
43
44
|
var import_lucide_react = require("lucide-react");
|
|
44
45
|
function AssetMediaColumn({
|
|
45
46
|
shouldReduce,
|
|
@@ -86,6 +87,7 @@ function AssetMediaColumn({
|
|
|
86
87
|
function AssetHeaderBlock({
|
|
87
88
|
name,
|
|
88
89
|
description,
|
|
90
|
+
ipType,
|
|
89
91
|
showMultiEditionBadge = false,
|
|
90
92
|
parentContract,
|
|
91
93
|
parentTokenId,
|
|
@@ -100,10 +102,6 @@ function AssetHeaderBlock({
|
|
|
100
102
|
parentName: `Token #${parentTokenId}`
|
|
101
103
|
}
|
|
102
104
|
) }) : null,
|
|
103
|
-
showMultiEditionBadge ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex items-center gap-2 flex-wrap mb-2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500", children: [
|
|
104
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: "h-3 w-3" }),
|
|
105
|
-
"Multi-edition"
|
|
106
|
-
] }) }) : null,
|
|
107
105
|
ownerAddress ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-1 flex items-center gap-1.5 text-xs text-muted-foreground", children: [
|
|
108
106
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold uppercase tracking-wider", children: "Owner" }),
|
|
109
107
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -116,6 +114,13 @@ function AssetHeaderBlock({
|
|
|
116
114
|
)
|
|
117
115
|
] }) : null,
|
|
118
116
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", { className: "text-3xl lg:text-5xl font-bold", children: name }),
|
|
117
|
+
ipType || showMultiEditionBadge ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 flex-wrap mt-2", children: [
|
|
118
|
+
ipType ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ip_type_badge.IpTypeBadge, { ipType, size: "md" }) : null,
|
|
119
|
+
showMultiEditionBadge ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500", children: [
|
|
120
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Layers, { className: "h-3 w-3" }),
|
|
121
|
+
"Multi-edition"
|
|
122
|
+
] }) : null
|
|
123
|
+
] }) : null,
|
|
119
124
|
description ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground leading-relaxed mt-1", children: description }) : null
|
|
120
125
|
] });
|
|
121
126
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-top-sections.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { motion } from \"framer-motion\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ParentAttributionBanner } from \"./parent-attribution-banner.js\";\nimport { Layers, Users } from \"lucide-react\";\n\ninterface AssetMediaColumnProps {\n shouldReduce: boolean;\n image: string;\n imageAlt: string;\n imgError: boolean;\n onImageError: () => void;\n fallback: React.ReactNode;\n stats?: Array<{\n value: string;\n label: string;\n icon: React.ReactNode;\n }>;\n}\n\nexport function AssetMediaColumn({\n shouldReduce,\n image,\n imageAlt,\n imgError,\n onImageError,\n fallback,\n stats,\n}: AssetMediaColumnProps) {\n return (\n <motion.div\n initial={shouldReduce ? false : { scale: 1.0, opacity: 0 }}\n animate={{ scale: 1.02, opacity: 1 }}\n transition={{ duration: 0.6, ease: \"easeOut\" }}\n className=\"overflow-hidden rounded-xl lg:sticky lg:top-16\"\n >\n <div className=\"rounded-2xl overflow-hidden border border-border bg-muted\">\n {image && !imgError ? (\n <Image\n src={image}\n alt={imageAlt}\n width={0}\n height={0}\n sizes=\"(max-width: 1024px) 100vw, 66vw\"\n className=\"w-full h-auto\"\n onError={onImageError}\n crossOrigin=\"anonymous\"\n priority\n />\n ) : (\n fallback\n )}\n </div>\n\n {stats && stats.length > 0 ? (\n <div className={`grid gap-3 mt-4 ${stats.length === 2 ? \"grid-cols-2\" : \"grid-cols-1\"}`}>\n {stats.map((stat) => (\n <div key={stat.label} className=\"rounded-xl border border-border bg-muted/20 p-4 text-center\">\n <p className=\"text-2xl font-black\">{stat.value}</p>\n <div className=\"flex items-center justify-center gap-1 text-xs text-muted-foreground mt-1\">\n {stat.icon}\n {stat.label}\n </div>\n </div>\n ))}\n </div>\n ) : null}\n </motion.div>\n );\n}\n\ninterface AssetHeaderBlockProps {\n name: string;\n description?: string | null;\n showMultiEditionBadge?: boolean;\n parentContract?: string | null;\n parentTokenId?: string | null;\n ownerAddress?: string | null;\n}\n\nexport function AssetHeaderBlock({\n name,\n description,\n showMultiEditionBadge = false,\n parentContract,\n parentTokenId,\n ownerAddress,\n}: AssetHeaderBlockProps) {\n return (\n <div>\n {parentContract && parentTokenId ? (\n <div className=\"mb-3\">\n <ParentAttributionBanner\n parentContract={parentContract}\n parentTokenId={parentTokenId}\n parentName={`Token #${parentTokenId}`}\n />\n </div>\n ) : null}\n {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-top-sections.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { motion } from \"framer-motion\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ParentAttributionBanner } from \"./parent-attribution-banner.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { Layers, Users } from \"lucide-react\";\n\ninterface AssetMediaColumnProps {\n shouldReduce: boolean;\n image: string;\n imageAlt: string;\n imgError: boolean;\n onImageError: () => void;\n fallback: React.ReactNode;\n stats?: Array<{\n value: string;\n label: string;\n icon: React.ReactNode;\n }>;\n}\n\nexport function AssetMediaColumn({\n shouldReduce,\n image,\n imageAlt,\n imgError,\n onImageError,\n fallback,\n stats,\n}: AssetMediaColumnProps) {\n return (\n <motion.div\n initial={shouldReduce ? false : { scale: 1.0, opacity: 0 }}\n animate={{ scale: 1.02, opacity: 1 }}\n transition={{ duration: 0.6, ease: \"easeOut\" }}\n className=\"overflow-hidden rounded-xl lg:sticky lg:top-16\"\n >\n <div className=\"rounded-2xl overflow-hidden border border-border bg-muted\">\n {image && !imgError ? (\n <Image\n src={image}\n alt={imageAlt}\n width={0}\n height={0}\n sizes=\"(max-width: 1024px) 100vw, 66vw\"\n className=\"w-full h-auto\"\n onError={onImageError}\n crossOrigin=\"anonymous\"\n priority\n />\n ) : (\n fallback\n )}\n </div>\n\n {stats && stats.length > 0 ? (\n <div className={`grid gap-3 mt-4 ${stats.length === 2 ? \"grid-cols-2\" : \"grid-cols-1\"}`}>\n {stats.map((stat) => (\n <div key={stat.label} className=\"rounded-xl border border-border bg-muted/20 p-4 text-center\">\n <p className=\"text-2xl font-black\">{stat.value}</p>\n <div className=\"flex items-center justify-center gap-1 text-xs text-muted-foreground mt-1\">\n {stat.icon}\n {stat.label}\n </div>\n </div>\n ))}\n </div>\n ) : null}\n </motion.div>\n );\n}\n\ninterface AssetHeaderBlockProps {\n name: string;\n description?: string | null;\n ipType?: string | null;\n showMultiEditionBadge?: boolean;\n parentContract?: string | null;\n parentTokenId?: string | null;\n ownerAddress?: string | null;\n}\n\nexport function AssetHeaderBlock({\n name,\n description,\n ipType,\n showMultiEditionBadge = false,\n parentContract,\n parentTokenId,\n ownerAddress,\n}: AssetHeaderBlockProps) {\n return (\n <div>\n {parentContract && parentTokenId ? (\n <div className=\"mb-3\">\n <ParentAttributionBanner\n parentContract={parentContract}\n parentTokenId={parentTokenId}\n parentName={`Token #${parentTokenId}`}\n />\n </div>\n ) : null}\n {ownerAddress ? (\n <div className=\"mb-1 flex items-center gap-1.5 text-xs text-muted-foreground\">\n <span className=\"font-semibold uppercase tracking-wider\">Owner</span>\n <Link\n href={`/creator/${ownerAddress}`}\n className=\"hover:text-primary transition-colors font-medium\"\n >\n <AddressDisplay address={ownerAddress} />\n </Link>\n </div>\n ) : null}\n <h1 className=\"text-3xl lg:text-5xl font-bold\">{name}</h1>\n {ipType || showMultiEditionBadge ? (\n <div className=\"flex items-center gap-2 flex-wrap mt-2\">\n {ipType ? <IpTypeBadge ipType={ipType} size=\"md\" /> : null}\n {showMultiEditionBadge ? (\n <span className=\"inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500\">\n <Layers className=\"h-3 w-3\" />\n Multi-edition\n </span>\n ) : null}\n </div>\n ) : null}\n {description ? (\n <p className=\"text-sm text-muted-foreground leading-relaxed mt-1\">{description}</p>\n ) : null}\n </div>\n );\n}\n\nexport function buildEditionStats(totalEditions: number, uniqueOwners: number) {\n return [\n {\n value: totalEditions.toLocaleString(),\n label: \"editions minted\",\n icon: <Layers className=\"h-3 w-3\" />,\n },\n {\n value: uniqueOwners.toLocaleString(),\n label: \"unique owners\",\n icon: <Users className=\"h-3 w-3\" />,\n },\n ];\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0CU;AAxCV,mBAAkB;AAClB,kBAAiB;AACjB,2BAAuB;AACvB,6BAA+B;AAC/B,uCAAwC;AACxC,2BAA4B;AAC5B,0BAA8B;AAgBvB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACE;AAAA,IAAC,4BAAO;AAAA,IAAP;AAAA,MACC,SAAS,eAAe,QAAQ,EAAE,OAAO,GAAK,SAAS,EAAE;AAAA,MACzD,SAAS,EAAE,OAAO,MAAM,SAAS,EAAE;AAAA,MACnC,YAAY,EAAE,UAAU,KAAK,MAAM,UAAU;AAAA,MAC7C,WAAU;AAAA,MAEV;AAAA,oDAAC,SAAI,WAAU,6DACZ,mBAAS,CAAC,WACT;AAAA,UAAC,aAAAA;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK;AAAA,YACL,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,OAAM;AAAA,YACN,WAAU;AAAA,YACV,SAAS;AAAA,YACT,aAAY;AAAA,YACZ,UAAQ;AAAA;AAAA,QACV,IAEA,UAEJ;AAAA,QAEC,SAAS,MAAM,SAAS,IACvB,4CAAC,SAAI,WAAW,mBAAmB,MAAM,WAAW,IAAI,gBAAgB,aAAa,IAClF,gBAAM,IAAI,CAAC,SACV,6CAAC,SAAqB,WAAU,+DAC9B;AAAA,sDAAC,OAAE,WAAU,uBAAuB,eAAK,OAAM;AAAA,UAC/C,6CAAC,SAAI,WAAU,6EACZ;AAAA,iBAAK;AAAA,YACL,KAAK;AAAA,aACR;AAAA,aALQ,KAAK,KAMf,CACD,GACH,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;AAYO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACE,6CAAC,SACE;AAAA,sBAAkB,gBACjB,4CAAC,SAAI,WAAU,QACb;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,YAAY,UAAU,aAAa;AAAA;AAAA,IACrC,GACF,IACE;AAAA,IACH,eACC,6CAAC,SAAI,WAAU,gEACb;AAAA,kDAAC,UAAK,WAAU,0CAAyC,mBAAK;AAAA,MAC9D;AAAA,QAAC,YAAAC;AAAA,QAAA;AAAA,UACC,MAAM,YAAY,YAAY;AAAA,UAC9B,WAAU;AAAA,UAEV,sDAAC,yCAAe,SAAS,cAAc;AAAA;AAAA,MACzC;AAAA,OACF,IACE;AAAA,IACJ,4CAAC,QAAG,WAAU,kCAAkC,gBAAK;AAAA,IACpD,UAAU,wBACT,6CAAC,SAAI,WAAU,0CACZ;AAAA,eAAS,4CAAC,oCAAY,QAAgB,MAAK,MAAK,IAAK;AAAA,MACrD,wBACC,6CAAC,UAAK,WAAU,kJACd;AAAA,oDAAC,8BAAO,WAAU,WAAU;AAAA,QAAE;AAAA,SAEhC,IACE;AAAA,OACN,IACE;AAAA,IACH,cACC,4CAAC,OAAE,WAAU,sDAAsD,uBAAY,IAC7E;AAAA,KACN;AAEJ;AAEO,SAAS,kBAAkB,eAAuB,cAAsB;AAC7E,SAAO;AAAA,IACL;AAAA,MACE,OAAO,cAAc,eAAe;AAAA,MACpC,OAAO;AAAA,MACP,MAAM,4CAAC,8BAAO,WAAU,WAAU;AAAA,IACpC;AAAA,IACA;AAAA,MACE,OAAO,aAAa,eAAe;AAAA,MACnC,OAAO;AAAA,MACP,MAAM,4CAAC,6BAAM,WAAU,WAAU;AAAA,IACnC;AAAA,EACF;AACF;","names":["Image","Link"]}
|
|
@@ -17,12 +17,13 @@ declare function AssetMediaColumn({ shouldReduce, image, imageAlt, imgError, onI
|
|
|
17
17
|
interface AssetHeaderBlockProps {
|
|
18
18
|
name: string;
|
|
19
19
|
description?: string | null;
|
|
20
|
+
ipType?: string | null;
|
|
20
21
|
showMultiEditionBadge?: boolean;
|
|
21
22
|
parentContract?: string | null;
|
|
22
23
|
parentTokenId?: string | null;
|
|
23
24
|
ownerAddress?: string | null;
|
|
24
25
|
}
|
|
25
|
-
declare function AssetHeaderBlock({ name, description, showMultiEditionBadge, parentContract, parentTokenId, ownerAddress, }: AssetHeaderBlockProps): react_jsx_runtime.JSX.Element;
|
|
26
|
+
declare function AssetHeaderBlock({ name, description, ipType, showMultiEditionBadge, parentContract, parentTokenId, ownerAddress, }: AssetHeaderBlockProps): react_jsx_runtime.JSX.Element;
|
|
26
27
|
declare function buildEditionStats(totalEditions: number, uniqueOwners: number): {
|
|
27
28
|
value: string;
|
|
28
29
|
label: string;
|
|
@@ -17,12 +17,13 @@ declare function AssetMediaColumn({ shouldReduce, image, imageAlt, imgError, onI
|
|
|
17
17
|
interface AssetHeaderBlockProps {
|
|
18
18
|
name: string;
|
|
19
19
|
description?: string | null;
|
|
20
|
+
ipType?: string | null;
|
|
20
21
|
showMultiEditionBadge?: boolean;
|
|
21
22
|
parentContract?: string | null;
|
|
22
23
|
parentTokenId?: string | null;
|
|
23
24
|
ownerAddress?: string | null;
|
|
24
25
|
}
|
|
25
|
-
declare function AssetHeaderBlock({ name, description, showMultiEditionBadge, parentContract, parentTokenId, ownerAddress, }: AssetHeaderBlockProps): react_jsx_runtime.JSX.Element;
|
|
26
|
+
declare function AssetHeaderBlock({ name, description, ipType, showMultiEditionBadge, parentContract, parentTokenId, ownerAddress, }: AssetHeaderBlockProps): react_jsx_runtime.JSX.Element;
|
|
26
27
|
declare function buildEditionStats(totalEditions: number, uniqueOwners: number): {
|
|
27
28
|
value: string;
|
|
28
29
|
label: string;
|
|
@@ -5,6 +5,7 @@ import Link from "next/link";
|
|
|
5
5
|
import { motion } from "framer-motion";
|
|
6
6
|
import { AddressDisplay } from "./address-display.js";
|
|
7
7
|
import { ParentAttributionBanner } from "./parent-attribution-banner.js";
|
|
8
|
+
import { IpTypeBadge } from "./ip-type-badge.js";
|
|
8
9
|
import { Layers, Users } from "lucide-react";
|
|
9
10
|
function AssetMediaColumn({
|
|
10
11
|
shouldReduce,
|
|
@@ -51,6 +52,7 @@ function AssetMediaColumn({
|
|
|
51
52
|
function AssetHeaderBlock({
|
|
52
53
|
name,
|
|
53
54
|
description,
|
|
55
|
+
ipType,
|
|
54
56
|
showMultiEditionBadge = false,
|
|
55
57
|
parentContract,
|
|
56
58
|
parentTokenId,
|
|
@@ -65,10 +67,6 @@ function AssetHeaderBlock({
|
|
|
65
67
|
parentName: `Token #${parentTokenId}`
|
|
66
68
|
}
|
|
67
69
|
) }) : null,
|
|
68
|
-
showMultiEditionBadge ? /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 flex-wrap mb-2", children: /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500", children: [
|
|
69
|
-
/* @__PURE__ */ jsx(Layers, { className: "h-3 w-3" }),
|
|
70
|
-
"Multi-edition"
|
|
71
|
-
] }) }) : null,
|
|
72
70
|
ownerAddress ? /* @__PURE__ */ jsxs("div", { className: "mb-1 flex items-center gap-1.5 text-xs text-muted-foreground", children: [
|
|
73
71
|
/* @__PURE__ */ jsx("span", { className: "font-semibold uppercase tracking-wider", children: "Owner" }),
|
|
74
72
|
/* @__PURE__ */ jsx(
|
|
@@ -81,6 +79,13 @@ function AssetHeaderBlock({
|
|
|
81
79
|
)
|
|
82
80
|
] }) : null,
|
|
83
81
|
/* @__PURE__ */ jsx("h1", { className: "text-3xl lg:text-5xl font-bold", children: name }),
|
|
82
|
+
ipType || showMultiEditionBadge ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 flex-wrap mt-2", children: [
|
|
83
|
+
ipType ? /* @__PURE__ */ jsx(IpTypeBadge, { ipType, size: "md" }) : null,
|
|
84
|
+
showMultiEditionBadge ? /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500", children: [
|
|
85
|
+
/* @__PURE__ */ jsx(Layers, { className: "h-3 w-3" }),
|
|
86
|
+
"Multi-edition"
|
|
87
|
+
] }) : null
|
|
88
|
+
] }) : null,
|
|
84
89
|
description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground leading-relaxed mt-1", children: description }) : null
|
|
85
90
|
] });
|
|
86
91
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/asset-top-sections.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { motion } from \"framer-motion\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ParentAttributionBanner } from \"./parent-attribution-banner.js\";\nimport { Layers, Users } from \"lucide-react\";\n\ninterface AssetMediaColumnProps {\n shouldReduce: boolean;\n image: string;\n imageAlt: string;\n imgError: boolean;\n onImageError: () => void;\n fallback: React.ReactNode;\n stats?: Array<{\n value: string;\n label: string;\n icon: React.ReactNode;\n }>;\n}\n\nexport function AssetMediaColumn({\n shouldReduce,\n image,\n imageAlt,\n imgError,\n onImageError,\n fallback,\n stats,\n}: AssetMediaColumnProps) {\n return (\n <motion.div\n initial={shouldReduce ? false : { scale: 1.0, opacity: 0 }}\n animate={{ scale: 1.02, opacity: 1 }}\n transition={{ duration: 0.6, ease: \"easeOut\" }}\n className=\"overflow-hidden rounded-xl lg:sticky lg:top-16\"\n >\n <div className=\"rounded-2xl overflow-hidden border border-border bg-muted\">\n {image && !imgError ? (\n <Image\n src={image}\n alt={imageAlt}\n width={0}\n height={0}\n sizes=\"(max-width: 1024px) 100vw, 66vw\"\n className=\"w-full h-auto\"\n onError={onImageError}\n crossOrigin=\"anonymous\"\n priority\n />\n ) : (\n fallback\n )}\n </div>\n\n {stats && stats.length > 0 ? (\n <div className={`grid gap-3 mt-4 ${stats.length === 2 ? \"grid-cols-2\" : \"grid-cols-1\"}`}>\n {stats.map((stat) => (\n <div key={stat.label} className=\"rounded-xl border border-border bg-muted/20 p-4 text-center\">\n <p className=\"text-2xl font-black\">{stat.value}</p>\n <div className=\"flex items-center justify-center gap-1 text-xs text-muted-foreground mt-1\">\n {stat.icon}\n {stat.label}\n </div>\n </div>\n ))}\n </div>\n ) : null}\n </motion.div>\n );\n}\n\ninterface AssetHeaderBlockProps {\n name: string;\n description?: string | null;\n showMultiEditionBadge?: boolean;\n parentContract?: string | null;\n parentTokenId?: string | null;\n ownerAddress?: string | null;\n}\n\nexport function AssetHeaderBlock({\n name,\n description,\n showMultiEditionBadge = false,\n parentContract,\n parentTokenId,\n ownerAddress,\n}: AssetHeaderBlockProps) {\n return (\n <div>\n {parentContract && parentTokenId ? (\n <div className=\"mb-3\">\n <ParentAttributionBanner\n parentContract={parentContract}\n parentTokenId={parentTokenId}\n parentName={`Token #${parentTokenId}`}\n />\n </div>\n ) : null}\n {
|
|
1
|
+
{"version":3,"sources":["../../src/components/asset-top-sections.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { motion } from \"framer-motion\";\nimport { AddressDisplay } from \"./address-display.js\";\nimport { ParentAttributionBanner } from \"./parent-attribution-banner.js\";\nimport { IpTypeBadge } from \"./ip-type-badge.js\";\nimport { Layers, Users } from \"lucide-react\";\n\ninterface AssetMediaColumnProps {\n shouldReduce: boolean;\n image: string;\n imageAlt: string;\n imgError: boolean;\n onImageError: () => void;\n fallback: React.ReactNode;\n stats?: Array<{\n value: string;\n label: string;\n icon: React.ReactNode;\n }>;\n}\n\nexport function AssetMediaColumn({\n shouldReduce,\n image,\n imageAlt,\n imgError,\n onImageError,\n fallback,\n stats,\n}: AssetMediaColumnProps) {\n return (\n <motion.div\n initial={shouldReduce ? false : { scale: 1.0, opacity: 0 }}\n animate={{ scale: 1.02, opacity: 1 }}\n transition={{ duration: 0.6, ease: \"easeOut\" }}\n className=\"overflow-hidden rounded-xl lg:sticky lg:top-16\"\n >\n <div className=\"rounded-2xl overflow-hidden border border-border bg-muted\">\n {image && !imgError ? (\n <Image\n src={image}\n alt={imageAlt}\n width={0}\n height={0}\n sizes=\"(max-width: 1024px) 100vw, 66vw\"\n className=\"w-full h-auto\"\n onError={onImageError}\n crossOrigin=\"anonymous\"\n priority\n />\n ) : (\n fallback\n )}\n </div>\n\n {stats && stats.length > 0 ? (\n <div className={`grid gap-3 mt-4 ${stats.length === 2 ? \"grid-cols-2\" : \"grid-cols-1\"}`}>\n {stats.map((stat) => (\n <div key={stat.label} className=\"rounded-xl border border-border bg-muted/20 p-4 text-center\">\n <p className=\"text-2xl font-black\">{stat.value}</p>\n <div className=\"flex items-center justify-center gap-1 text-xs text-muted-foreground mt-1\">\n {stat.icon}\n {stat.label}\n </div>\n </div>\n ))}\n </div>\n ) : null}\n </motion.div>\n );\n}\n\ninterface AssetHeaderBlockProps {\n name: string;\n description?: string | null;\n ipType?: string | null;\n showMultiEditionBadge?: boolean;\n parentContract?: string | null;\n parentTokenId?: string | null;\n ownerAddress?: string | null;\n}\n\nexport function AssetHeaderBlock({\n name,\n description,\n ipType,\n showMultiEditionBadge = false,\n parentContract,\n parentTokenId,\n ownerAddress,\n}: AssetHeaderBlockProps) {\n return (\n <div>\n {parentContract && parentTokenId ? (\n <div className=\"mb-3\">\n <ParentAttributionBanner\n parentContract={parentContract}\n parentTokenId={parentTokenId}\n parentName={`Token #${parentTokenId}`}\n />\n </div>\n ) : null}\n {ownerAddress ? (\n <div className=\"mb-1 flex items-center gap-1.5 text-xs text-muted-foreground\">\n <span className=\"font-semibold uppercase tracking-wider\">Owner</span>\n <Link\n href={`/creator/${ownerAddress}`}\n className=\"hover:text-primary transition-colors font-medium\"\n >\n <AddressDisplay address={ownerAddress} />\n </Link>\n </div>\n ) : null}\n <h1 className=\"text-3xl lg:text-5xl font-bold\">{name}</h1>\n {ipType || showMultiEditionBadge ? (\n <div className=\"flex items-center gap-2 flex-wrap mt-2\">\n {ipType ? <IpTypeBadge ipType={ipType} size=\"md\" /> : null}\n {showMultiEditionBadge ? (\n <span className=\"inline-flex items-center gap-1 text-[11px] font-semibold px-2.5 py-1 rounded-full border border-violet-500/30 bg-violet-500/10 text-violet-500\">\n <Layers className=\"h-3 w-3\" />\n Multi-edition\n </span>\n ) : null}\n </div>\n ) : null}\n {description ? (\n <p className=\"text-sm text-muted-foreground leading-relaxed mt-1\">{description}</p>\n ) : null}\n </div>\n );\n}\n\nexport function buildEditionStats(totalEditions: number, uniqueOwners: number) {\n return [\n {\n value: totalEditions.toLocaleString(),\n label: \"editions minted\",\n icon: <Layers className=\"h-3 w-3\" />,\n },\n {\n value: uniqueOwners.toLocaleString(),\n label: \"unique owners\",\n icon: <Users className=\"h-3 w-3\" />,\n },\n ];\n}\n"],"mappings":";AA0CU,cAqBI,YArBJ;AAxCV,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAC/B,SAAS,+BAA+B;AACxC,SAAS,mBAAmB;AAC5B,SAAS,QAAQ,aAAa;AAgBvB,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACE;AAAA,IAAC,OAAO;AAAA,IAAP;AAAA,MACC,SAAS,eAAe,QAAQ,EAAE,OAAO,GAAK,SAAS,EAAE;AAAA,MACzD,SAAS,EAAE,OAAO,MAAM,SAAS,EAAE;AAAA,MACnC,YAAY,EAAE,UAAU,KAAK,MAAM,UAAU;AAAA,MAC7C,WAAU;AAAA,MAEV;AAAA,4BAAC,SAAI,WAAU,6DACZ,mBAAS,CAAC,WACT;AAAA,UAAC;AAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK;AAAA,YACL,OAAO;AAAA,YACP,QAAQ;AAAA,YACR,OAAM;AAAA,YACN,WAAU;AAAA,YACV,SAAS;AAAA,YACT,aAAY;AAAA,YACZ,UAAQ;AAAA;AAAA,QACV,IAEA,UAEJ;AAAA,QAEC,SAAS,MAAM,SAAS,IACvB,oBAAC,SAAI,WAAW,mBAAmB,MAAM,WAAW,IAAI,gBAAgB,aAAa,IAClF,gBAAM,IAAI,CAAC,SACV,qBAAC,SAAqB,WAAU,+DAC9B;AAAA,8BAAC,OAAE,WAAU,uBAAuB,eAAK,OAAM;AAAA,UAC/C,qBAAC,SAAI,WAAU,6EACZ;AAAA,iBAAK;AAAA,YACL,KAAK;AAAA,aACR;AAAA,aALQ,KAAK,KAMf,CACD,GACH,IACE;AAAA;AAAA;AAAA,EACN;AAEJ;AAYO,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA,wBAAwB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,GAA0B;AACxB,SACE,qBAAC,SACE;AAAA,sBAAkB,gBACjB,oBAAC,SAAI,WAAU,QACb;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,YAAY,UAAU,aAAa;AAAA;AAAA,IACrC,GACF,IACE;AAAA,IACH,eACC,qBAAC,SAAI,WAAU,gEACb;AAAA,0BAAC,UAAK,WAAU,0CAAyC,mBAAK;AAAA,MAC9D;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,YAAY,YAAY;AAAA,UAC9B,WAAU;AAAA,UAEV,8BAAC,kBAAe,SAAS,cAAc;AAAA;AAAA,MACzC;AAAA,OACF,IACE;AAAA,IACJ,oBAAC,QAAG,WAAU,kCAAkC,gBAAK;AAAA,IACpD,UAAU,wBACT,qBAAC,SAAI,WAAU,0CACZ;AAAA,eAAS,oBAAC,eAAY,QAAgB,MAAK,MAAK,IAAK;AAAA,MACrD,wBACC,qBAAC,UAAK,WAAU,kJACd;AAAA,4BAAC,UAAO,WAAU,WAAU;AAAA,QAAE;AAAA,SAEhC,IACE;AAAA,OACN,IACE;AAAA,IACH,cACC,oBAAC,OAAE,WAAU,sDAAsD,uBAAY,IAC7E;AAAA,KACN;AAEJ;AAEO,SAAS,kBAAkB,eAAuB,cAAsB;AAC7E,SAAO;AAAA,IACL;AAAA,MACE,OAAO,cAAc,eAAe;AAAA,MACpC,OAAO;AAAA,MACP,MAAM,oBAAC,UAAO,WAAU,WAAU;AAAA,IACpC;AAAA,IACA;AAAA,MACE,OAAO,aAAa,eAAe;AAAA,MACnC,OAAO;AAAA,MACP,MAAM,oBAAC,SAAM,WAAU,WAAU;AAAA,IACnC;AAAA,EACF;AACF;","names":[]}
|