@medialane/ui 0.3.1 → 0.3.2
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/discover-collections-strip.cjs +111 -0
- package/dist/components/discover-collections-strip.cjs.map +1 -0
- package/dist/components/discover-collections-strip.d.cts +12 -0
- package/dist/components/discover-collections-strip.d.ts +12 -0
- package/dist/components/discover-collections-strip.js +87 -0
- package/dist/components/discover-collections-strip.js.map +1 -0
- package/dist/components/discover-creators-strip.cjs +131 -0
- package/dist/components/discover-creators-strip.cjs.map +1 -0
- package/dist/components/discover-creators-strip.d.cts +12 -0
- package/dist/components/discover-creators-strip.d.ts +12 -0
- package/dist/components/discover-creators-strip.js +107 -0
- package/dist/components/discover-creators-strip.js.map +1 -0
- package/dist/components/discover-feed-section.cjs +96 -0
- package/dist/components/discover-feed-section.cjs.map +1 -0
- package/dist/components/discover-feed-section.d.cts +18 -0
- package/dist/components/discover-feed-section.d.ts +18 -0
- package/dist/components/discover-feed-section.js +72 -0
- package/dist/components/discover-feed-section.js.map +1 -0
- package/dist/components/discover-hero.cjs +87 -0
- package/dist/components/discover-hero.cjs.map +1 -0
- package/dist/components/discover-hero.d.cts +16 -0
- package/dist/components/discover-hero.d.ts +16 -0
- package/dist/components/discover-hero.js +63 -0
- package/dist/components/discover-hero.js.map +1 -0
- package/dist/components/featured-carousel.cjs +181 -0
- package/dist/components/featured-carousel.cjs.map +1 -0
- package/dist/components/featured-carousel.d.cts +13 -0
- package/dist/components/featured-carousel.d.ts +13 -0
- package/dist/components/featured-carousel.js +156 -0
- package/dist/components/featured-carousel.js.map +1 -0
- package/dist/index.cjs +17 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +5 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.js +11 -0
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var discover_feed_section_exports = {};
|
|
21
|
+
__export(discover_feed_section_exports, {
|
|
22
|
+
DiscoverFeedSection: () => DiscoverFeedSection
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(discover_feed_section_exports);
|
|
25
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
+
var import_lucide_react = require("lucide-react");
|
|
27
|
+
var import_motion_primitives = require("./motion-primitives.js");
|
|
28
|
+
var import_listing_card = require("./listing-card.js");
|
|
29
|
+
var import_activity_feed_shell = require("./activity-feed-shell.js");
|
|
30
|
+
var import_activity_row = require("./activity-row.js");
|
|
31
|
+
function DiscoverFeedSection({
|
|
32
|
+
orders,
|
|
33
|
+
isLoading,
|
|
34
|
+
activities,
|
|
35
|
+
activitiesLoading,
|
|
36
|
+
lastUpdated,
|
|
37
|
+
getAssetHref = (c, t) => `/asset/${c}/${t}`,
|
|
38
|
+
getActorHref = (a) => `/creator/${a}`,
|
|
39
|
+
explorerUrl = "https://voyager.online",
|
|
40
|
+
marketplaceHref = "/marketplace",
|
|
41
|
+
activitiesHref = "/activities"
|
|
42
|
+
}) {
|
|
43
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-8", children: [
|
|
44
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.FadeIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-3", children: [
|
|
45
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
46
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
47
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "section-label", children: "Markets" }),
|
|
48
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
|
|
49
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Tag, { className: "h-4 w-4 text-brand-rose" }),
|
|
50
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-lg font-bold", children: "Activity" })
|
|
51
|
+
] })
|
|
52
|
+
] }),
|
|
53
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
54
|
+
"a",
|
|
55
|
+
{
|
|
56
|
+
href: marketplaceHref,
|
|
57
|
+
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",
|
|
58
|
+
children: "View all"
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
] }),
|
|
62
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-3 gap-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCardSkeleton, {}, i)) }) : orders.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "rounded-xl border border-border py-12 text-center text-sm text-muted-foreground", children: "No active listings yet." }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "grid grid-cols-3 gap-3", children: orders.map((o) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_listing_card.ListingCard, { order: o, compact: true }, o.orderHash)) })
|
|
63
|
+
] }) }),
|
|
64
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.FadeIn, { delay: 0.08, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
65
|
+
import_activity_feed_shell.ActivityFeedShell,
|
|
66
|
+
{
|
|
67
|
+
title: "Community",
|
|
68
|
+
href: activitiesHref,
|
|
69
|
+
hrefLabel: "Activities",
|
|
70
|
+
lastUpdated,
|
|
71
|
+
isLoading: activitiesLoading,
|
|
72
|
+
children: activities.map((act, i) => {
|
|
73
|
+
const key = act.txHash ? `${act.txHash}-${act.type}-${act.nftTokenId ?? ""}` : `activity-${i}`;
|
|
74
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
75
|
+
import_activity_row.ActivityRow,
|
|
76
|
+
{
|
|
77
|
+
activity: act,
|
|
78
|
+
showActor: true,
|
|
79
|
+
showExplorer: false,
|
|
80
|
+
compact: true,
|
|
81
|
+
getAssetHref,
|
|
82
|
+
getActorHref,
|
|
83
|
+
explorerUrl
|
|
84
|
+
},
|
|
85
|
+
key
|
|
86
|
+
);
|
|
87
|
+
})
|
|
88
|
+
}
|
|
89
|
+
) })
|
|
90
|
+
] });
|
|
91
|
+
}
|
|
92
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
93
|
+
0 && (module.exports = {
|
|
94
|
+
DiscoverFeedSection
|
|
95
|
+
});
|
|
96
|
+
//# sourceMappingURL=discover-feed-section.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/discover-feed-section.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tag } from \"lucide-react\";\nimport { FadeIn } from \"./motion-primitives.js\";\nimport { ListingCard, ListingCardSkeleton } from \"./listing-card.js\";\nimport { ActivityFeedShell } from \"./activity-feed-shell.js\";\nimport { ActivityRow } from \"./activity-row.js\";\nimport type { ApiOrder, ApiActivity } from \"@medialane/sdk\";\n\nexport interface DiscoverFeedSectionProps {\n orders: ApiOrder[];\n isLoading: boolean;\n activities: ApiActivity[];\n activitiesLoading: boolean;\n lastUpdated: string;\n getAssetHref?: (contract: string, tokenId: string) => string;\n getActorHref?: (address: string) => string;\n explorerUrl?: string;\n marketplaceHref?: string;\n activitiesHref?: string;\n}\n\nexport function DiscoverFeedSection({\n orders,\n isLoading,\n activities,\n activitiesLoading,\n lastUpdated,\n getAssetHref = (c, t) => `/asset/${c}/${t}`,\n getActorHref = (a) => `/creator/${a}`,\n explorerUrl = \"https://voyager.online\",\n marketplaceHref = \"/marketplace\",\n activitiesHref = \"/activities\",\n}: DiscoverFeedSectionProps) {\n return (\n <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-8\">\n {/* New Listings */}\n <FadeIn>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"section-label\">Markets</p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <Tag className=\"h-4 w-4 text-brand-rose\" />\n <h2 className=\"text-lg font-bold\">Activity</h2>\n </div>\n </div>\n <a\n href={marketplaceHref}\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 View all\n </a>\n </div>\n\n {isLoading ? (\n <div className=\"grid grid-cols-3 gap-3\">\n {Array.from({ length: 6 }).map((_, i) => <ListingCardSkeleton key={i} />)}\n </div>\n ) : orders.length === 0 ? (\n <div className=\"rounded-xl border border-border py-12 text-center text-sm text-muted-foreground\">\n No active listings yet.\n </div>\n ) : (\n <div className=\"grid grid-cols-3 gap-3\">\n {orders.map((o) => (\n <ListingCard key={o.orderHash} order={o} compact />\n ))}\n </div>\n )}\n </div>\n </FadeIn>\n\n {/* Recent Activity */}\n <FadeIn delay={0.08}>\n <ActivityFeedShell\n title=\"Community\"\n href={activitiesHref}\n hrefLabel=\"Activities\"\n lastUpdated={lastUpdated}\n isLoading={activitiesLoading}\n >\n {activities.map((act, i) => {\n const key = act.txHash\n ? `${act.txHash}-${act.type}-${act.nftTokenId ?? \"\"}`\n : `activity-${i}`;\n return (\n <ActivityRow\n key={key}\n activity={act}\n showActor\n showExplorer={false}\n compact\n getAssetHref={getAssetHref}\n getActorHref={getActorHref}\n explorerUrl={explorerUrl}\n />\n );\n })}\n </ActivityFeedShell>\n </FadeIn>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAyCc;AAvCd,0BAAoB;AACpB,+BAAuB;AACvB,0BAAiD;AACjD,iCAAkC;AAClC,0BAA4B;AAgBrB,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,CAAC,GAAG,MAAM,UAAU,CAAC,IAAI,CAAC;AAAA,EACzC,eAAe,CAAC,MAAM,YAAY,CAAC;AAAA,EACnC,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,iBAAiB;AACnB,GAA6B;AAC3B,SACE,6CAAC,SAAI,WAAU,yCAEb;AAAA,gDAAC,mCACC,uDAAC,SAAI,WAAU,aACb;AAAA,mDAAC,SAAI,WAAU,qCACb;AAAA,qDAAC,SACC;AAAA,sDAAC,OAAE,WAAU,iBAAgB,qBAAO;AAAA,UACpC,6CAAC,SAAI,WAAU,kCACb;AAAA,wDAAC,2BAAI,WAAU,2BAA0B;AAAA,YACzC,4CAAC,QAAG,WAAU,qBAAoB,sBAAQ;AAAA,aAC5C;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAU;AAAA,YACX;AAAA;AAAA,QAED;AAAA,SACF;AAAA,MAEC,YACC,4CAAC,SAAI,WAAU,0BACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MAAM,4CAAC,6CAAyB,CAAG,CAAE,GAC1E,IACE,OAAO,WAAW,IACpB,4CAAC,SAAI,WAAU,mFAAkF,qCAEjG,IAEA,4CAAC,SAAI,WAAU,0BACZ,iBAAO,IAAI,CAAC,MACX,4CAAC,mCAA8B,OAAO,GAAG,SAAO,QAA9B,EAAE,SAA6B,CAClD,GACH;AAAA,OAEJ,GACF;AAAA,IAGA,4CAAC,mCAAO,OAAO,MACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,MAAM;AAAA,QACN,WAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,QAEV,qBAAW,IAAI,CAAC,KAAK,MAAM;AAC1B,gBAAM,MAAM,IAAI,SACZ,GAAG,IAAI,MAAM,IAAI,IAAI,IAAI,IAAI,IAAI,cAAc,EAAE,KACjD,YAAY,CAAC;AACjB,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,UAAU;AAAA,cACV,WAAS;AAAA,cACT,cAAc;AAAA,cACd,SAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA;AAAA;AAAA,YAPK;AAAA,UAQP;AAAA,QAEJ,CAAC;AAAA;AAAA,IACH,GACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ApiOrder, ApiActivity } from '@medialane/sdk';
|
|
3
|
+
|
|
4
|
+
interface DiscoverFeedSectionProps {
|
|
5
|
+
orders: ApiOrder[];
|
|
6
|
+
isLoading: boolean;
|
|
7
|
+
activities: ApiActivity[];
|
|
8
|
+
activitiesLoading: boolean;
|
|
9
|
+
lastUpdated: string;
|
|
10
|
+
getAssetHref?: (contract: string, tokenId: string) => string;
|
|
11
|
+
getActorHref?: (address: string) => string;
|
|
12
|
+
explorerUrl?: string;
|
|
13
|
+
marketplaceHref?: string;
|
|
14
|
+
activitiesHref?: string;
|
|
15
|
+
}
|
|
16
|
+
declare function DiscoverFeedSection({ orders, isLoading, activities, activitiesLoading, lastUpdated, getAssetHref, getActorHref, explorerUrl, marketplaceHref, activitiesHref, }: DiscoverFeedSectionProps): react_jsx_runtime.JSX.Element;
|
|
17
|
+
|
|
18
|
+
export { DiscoverFeedSection, type DiscoverFeedSectionProps };
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ApiOrder, ApiActivity } from '@medialane/sdk';
|
|
3
|
+
|
|
4
|
+
interface DiscoverFeedSectionProps {
|
|
5
|
+
orders: ApiOrder[];
|
|
6
|
+
isLoading: boolean;
|
|
7
|
+
activities: ApiActivity[];
|
|
8
|
+
activitiesLoading: boolean;
|
|
9
|
+
lastUpdated: string;
|
|
10
|
+
getAssetHref?: (contract: string, tokenId: string) => string;
|
|
11
|
+
getActorHref?: (address: string) => string;
|
|
12
|
+
explorerUrl?: string;
|
|
13
|
+
marketplaceHref?: string;
|
|
14
|
+
activitiesHref?: string;
|
|
15
|
+
}
|
|
16
|
+
declare function DiscoverFeedSection({ orders, isLoading, activities, activitiesLoading, lastUpdated, getAssetHref, getActorHref, explorerUrl, marketplaceHref, activitiesHref, }: DiscoverFeedSectionProps): react_jsx_runtime.JSX.Element;
|
|
17
|
+
|
|
18
|
+
export { DiscoverFeedSection, type DiscoverFeedSectionProps };
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { Tag } from "lucide-react";
|
|
4
|
+
import { FadeIn } from "./motion-primitives.js";
|
|
5
|
+
import { ListingCard, ListingCardSkeleton } from "./listing-card.js";
|
|
6
|
+
import { ActivityFeedShell } from "./activity-feed-shell.js";
|
|
7
|
+
import { ActivityRow } from "./activity-row.js";
|
|
8
|
+
function DiscoverFeedSection({
|
|
9
|
+
orders,
|
|
10
|
+
isLoading,
|
|
11
|
+
activities,
|
|
12
|
+
activitiesLoading,
|
|
13
|
+
lastUpdated,
|
|
14
|
+
getAssetHref = (c, t) => `/asset/${c}/${t}`,
|
|
15
|
+
getActorHref = (a) => `/creator/${a}`,
|
|
16
|
+
explorerUrl = "https://voyager.online",
|
|
17
|
+
marketplaceHref = "/marketplace",
|
|
18
|
+
activitiesHref = "/activities"
|
|
19
|
+
}) {
|
|
20
|
+
return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-2 gap-8", children: [
|
|
21
|
+
/* @__PURE__ */ jsx(FadeIn, { children: /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
|
|
22
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
|
|
23
|
+
/* @__PURE__ */ jsxs("div", { children: [
|
|
24
|
+
/* @__PURE__ */ jsx("p", { className: "section-label", children: "Markets" }),
|
|
25
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5", children: [
|
|
26
|
+
/* @__PURE__ */ jsx(Tag, { className: "h-4 w-4 text-brand-rose" }),
|
|
27
|
+
/* @__PURE__ */ jsx("h2", { className: "text-lg font-bold", children: "Activity" })
|
|
28
|
+
] })
|
|
29
|
+
] }),
|
|
30
|
+
/* @__PURE__ */ jsx(
|
|
31
|
+
"a",
|
|
32
|
+
{
|
|
33
|
+
href: marketplaceHref,
|
|
34
|
+
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",
|
|
35
|
+
children: "View all"
|
|
36
|
+
}
|
|
37
|
+
)
|
|
38
|
+
] }),
|
|
39
|
+
isLoading ? /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-3", children: Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ jsx(ListingCardSkeleton, {}, i)) }) : orders.length === 0 ? /* @__PURE__ */ jsx("div", { className: "rounded-xl border border-border py-12 text-center text-sm text-muted-foreground", children: "No active listings yet." }) : /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-3", children: orders.map((o) => /* @__PURE__ */ jsx(ListingCard, { order: o, compact: true }, o.orderHash)) })
|
|
40
|
+
] }) }),
|
|
41
|
+
/* @__PURE__ */ jsx(FadeIn, { delay: 0.08, children: /* @__PURE__ */ jsx(
|
|
42
|
+
ActivityFeedShell,
|
|
43
|
+
{
|
|
44
|
+
title: "Community",
|
|
45
|
+
href: activitiesHref,
|
|
46
|
+
hrefLabel: "Activities",
|
|
47
|
+
lastUpdated,
|
|
48
|
+
isLoading: activitiesLoading,
|
|
49
|
+
children: activities.map((act, i) => {
|
|
50
|
+
const key = act.txHash ? `${act.txHash}-${act.type}-${act.nftTokenId ?? ""}` : `activity-${i}`;
|
|
51
|
+
return /* @__PURE__ */ jsx(
|
|
52
|
+
ActivityRow,
|
|
53
|
+
{
|
|
54
|
+
activity: act,
|
|
55
|
+
showActor: true,
|
|
56
|
+
showExplorer: false,
|
|
57
|
+
compact: true,
|
|
58
|
+
getAssetHref,
|
|
59
|
+
getActorHref,
|
|
60
|
+
explorerUrl
|
|
61
|
+
},
|
|
62
|
+
key
|
|
63
|
+
);
|
|
64
|
+
})
|
|
65
|
+
}
|
|
66
|
+
) })
|
|
67
|
+
] });
|
|
68
|
+
}
|
|
69
|
+
export {
|
|
70
|
+
DiscoverFeedSection
|
|
71
|
+
};
|
|
72
|
+
//# sourceMappingURL=discover-feed-section.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/discover-feed-section.tsx"],"sourcesContent":["\"use client\";\n\nimport { Tag } from \"lucide-react\";\nimport { FadeIn } from \"./motion-primitives.js\";\nimport { ListingCard, ListingCardSkeleton } from \"./listing-card.js\";\nimport { ActivityFeedShell } from \"./activity-feed-shell.js\";\nimport { ActivityRow } from \"./activity-row.js\";\nimport type { ApiOrder, ApiActivity } from \"@medialane/sdk\";\n\nexport interface DiscoverFeedSectionProps {\n orders: ApiOrder[];\n isLoading: boolean;\n activities: ApiActivity[];\n activitiesLoading: boolean;\n lastUpdated: string;\n getAssetHref?: (contract: string, tokenId: string) => string;\n getActorHref?: (address: string) => string;\n explorerUrl?: string;\n marketplaceHref?: string;\n activitiesHref?: string;\n}\n\nexport function DiscoverFeedSection({\n orders,\n isLoading,\n activities,\n activitiesLoading,\n lastUpdated,\n getAssetHref = (c, t) => `/asset/${c}/${t}`,\n getActorHref = (a) => `/creator/${a}`,\n explorerUrl = \"https://voyager.online\",\n marketplaceHref = \"/marketplace\",\n activitiesHref = \"/activities\",\n}: DiscoverFeedSectionProps) {\n return (\n <div className=\"grid grid-cols-1 lg:grid-cols-2 gap-8\">\n {/* New Listings */}\n <FadeIn>\n <div className=\"space-y-3\">\n <div className=\"flex items-center justify-between\">\n <div>\n <p className=\"section-label\">Markets</p>\n <div className=\"flex items-center gap-2 mt-0.5\">\n <Tag className=\"h-4 w-4 text-brand-rose\" />\n <h2 className=\"text-lg font-bold\">Activity</h2>\n </div>\n </div>\n <a\n href={marketplaceHref}\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 View all\n </a>\n </div>\n\n {isLoading ? (\n <div className=\"grid grid-cols-3 gap-3\">\n {Array.from({ length: 6 }).map((_, i) => <ListingCardSkeleton key={i} />)}\n </div>\n ) : orders.length === 0 ? (\n <div className=\"rounded-xl border border-border py-12 text-center text-sm text-muted-foreground\">\n No active listings yet.\n </div>\n ) : (\n <div className=\"grid grid-cols-3 gap-3\">\n {orders.map((o) => (\n <ListingCard key={o.orderHash} order={o} compact />\n ))}\n </div>\n )}\n </div>\n </FadeIn>\n\n {/* Recent Activity */}\n <FadeIn delay={0.08}>\n <ActivityFeedShell\n title=\"Community\"\n href={activitiesHref}\n hrefLabel=\"Activities\"\n lastUpdated={lastUpdated}\n isLoading={activitiesLoading}\n >\n {activities.map((act, i) => {\n const key = act.txHash\n ? `${act.txHash}-${act.type}-${act.nftTokenId ?? \"\"}`\n : `activity-${i}`;\n return (\n <ActivityRow\n key={key}\n activity={act}\n showActor\n showExplorer={false}\n compact\n getAssetHref={getAssetHref}\n getActorHref={getActorHref}\n explorerUrl={explorerUrl}\n />\n );\n })}\n </ActivityFeedShell>\n </FadeIn>\n </div>\n );\n}\n"],"mappings":";AAyCc,cACA,YADA;AAvCd,SAAS,WAAW;AACpB,SAAS,cAAc;AACvB,SAAS,aAAa,2BAA2B;AACjD,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAgBrB,SAAS,oBAAoB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe,CAAC,GAAG,MAAM,UAAU,CAAC,IAAI,CAAC;AAAA,EACzC,eAAe,CAAC,MAAM,YAAY,CAAC;AAAA,EACnC,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,iBAAiB;AACnB,GAA6B;AAC3B,SACE,qBAAC,SAAI,WAAU,yCAEb;AAAA,wBAAC,UACC,+BAAC,SAAI,WAAU,aACb;AAAA,2BAAC,SAAI,WAAU,qCACb;AAAA,6BAAC,SACC;AAAA,8BAAC,OAAE,WAAU,iBAAgB,qBAAO;AAAA,UACpC,qBAAC,SAAI,WAAU,kCACb;AAAA,gCAAC,OAAI,WAAU,2BAA0B;AAAA,YACzC,oBAAC,QAAG,WAAU,qBAAoB,sBAAQ;AAAA,aAC5C;AAAA,WACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAU;AAAA,YACX;AAAA;AAAA,QAED;AAAA,SACF;AAAA,MAEC,YACC,oBAAC,SAAI,WAAU,0BACZ,gBAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,GAAG,MAAM,oBAAC,yBAAyB,CAAG,CAAE,GAC1E,IACE,OAAO,WAAW,IACpB,oBAAC,SAAI,WAAU,mFAAkF,qCAEjG,IAEA,oBAAC,SAAI,WAAU,0BACZ,iBAAO,IAAI,CAAC,MACX,oBAAC,eAA8B,OAAO,GAAG,SAAO,QAA9B,EAAE,SAA6B,CAClD,GACH;AAAA,OAEJ,GACF;AAAA,IAGA,oBAAC,UAAO,OAAO,MACb;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,MAAM;AAAA,QACN,WAAU;AAAA,QACV;AAAA,QACA,WAAW;AAAA,QAEV,qBAAW,IAAI,CAAC,KAAK,MAAM;AAC1B,gBAAM,MAAM,IAAI,SACZ,GAAG,IAAI,MAAM,IAAI,IAAI,IAAI,IAAI,IAAI,cAAc,EAAE,KACjD,YAAY,CAAC;AACjB,iBACE;AAAA,YAAC;AAAA;AAAA,cAEC,UAAU;AAAA,cACV,WAAS;AAAA,cACT,cAAc;AAAA,cACd,SAAO;AAAA,cACP;AAAA,cACA;AAAA,cACA;AAAA;AAAA,YAPK;AAAA,UAQP;AAAA,QAEJ,CAAC;AAAA;AAAA,IACH,GACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var discover_hero_exports = {};
|
|
21
|
+
__export(discover_hero_exports, {
|
|
22
|
+
DiscoverHero: () => DiscoverHero
|
|
23
|
+
});
|
|
24
|
+
module.exports = __toCommonJS(discover_hero_exports);
|
|
25
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
+
var import_framer_motion = require("framer-motion");
|
|
27
|
+
var import_motion_primitives = require("./motion-primitives.js");
|
|
28
|
+
var import_activity_ticker = require("./activity-ticker.js");
|
|
29
|
+
function DiscoverHero({
|
|
30
|
+
stats,
|
|
31
|
+
orders,
|
|
32
|
+
badgeText = "Creative Works",
|
|
33
|
+
headlineText = "Create, share & explore"
|
|
34
|
+
}) {
|
|
35
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-6 pt-2 pb-6 border-b border-border/50", children: [
|
|
36
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
37
|
+
import_framer_motion.motion.div,
|
|
38
|
+
{
|
|
39
|
+
initial: { opacity: 0, y: 12 },
|
|
40
|
+
animate: { opacity: 1, y: 0 },
|
|
41
|
+
transition: { duration: 0.4, ease: import_motion_primitives.EASE_OUT },
|
|
42
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "pill-badge", children: badgeText })
|
|
43
|
+
}
|
|
44
|
+
),
|
|
45
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
46
|
+
import_framer_motion.motion.div,
|
|
47
|
+
{
|
|
48
|
+
className: "text-3xl sm:text-4xl lg:text-5xl font-black leading-[1.1]",
|
|
49
|
+
style: { perspective: "800px" },
|
|
50
|
+
initial: { opacity: 0, y: 16 },
|
|
51
|
+
animate: { opacity: 1, y: 0 },
|
|
52
|
+
transition: { duration: 0.5, delay: 0.1, ease: import_motion_primitives.EASE_OUT },
|
|
53
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "gradient-text", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.KineticWords, { text: headlineText }) })
|
|
54
|
+
}
|
|
55
|
+
),
|
|
56
|
+
stats && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
57
|
+
import_framer_motion.motion.div,
|
|
58
|
+
{
|
|
59
|
+
className: "flex flex-wrap gap-2",
|
|
60
|
+
initial: { opacity: 0 },
|
|
61
|
+
animate: { opacity: 1 },
|
|
62
|
+
transition: { duration: 0.4, delay: 0.35, ease: import_motion_primitives.EASE_OUT },
|
|
63
|
+
children: [
|
|
64
|
+
{ label: "Collections", value: stats.collections },
|
|
65
|
+
{ label: "Assets", value: stats.tokens },
|
|
66
|
+
{ label: "Sales", value: stats.sales }
|
|
67
|
+
].map(({ label, value }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
68
|
+
"div",
|
|
69
|
+
{
|
|
70
|
+
className: "flex items-center gap-1.5 rounded-full border border-border bg-card px-3.5 py-1.5 text-sm",
|
|
71
|
+
children: [
|
|
72
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-bold tabular-nums", children: value?.toLocaleString() ?? "\u2014" }),
|
|
73
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: label })
|
|
74
|
+
]
|
|
75
|
+
},
|
|
76
|
+
label
|
|
77
|
+
))
|
|
78
|
+
}
|
|
79
|
+
),
|
|
80
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_activity_ticker.ActivityTicker, { orders })
|
|
81
|
+
] });
|
|
82
|
+
}
|
|
83
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
84
|
+
0 && (module.exports = {
|
|
85
|
+
DiscoverHero
|
|
86
|
+
});
|
|
87
|
+
//# sourceMappingURL=discover-hero.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/discover-hero.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion } from \"framer-motion\";\nimport { KineticWords, EASE_OUT } from \"./motion-primitives.js\";\nimport { ActivityTicker } from \"./activity-ticker.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface DiscoverHeroProps {\n stats: { collections: number; tokens: number; sales: number } | null;\n orders: ApiOrder[];\n badgeText?: string;\n headlineText?: string;\n}\n\nexport function DiscoverHero({\n stats,\n orders,\n badgeText = \"Creative Works\",\n headlineText = \"Create, share & explore\",\n}: DiscoverHeroProps) {\n return (\n <div className=\"space-y-6 pt-2 pb-6 border-b border-border/50\">\n {/* Badge */}\n <motion.div\n initial={{ opacity: 0, y: 12 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.4, ease: EASE_OUT }}\n >\n <span className=\"pill-badge\">{badgeText}</span>\n </motion.div>\n\n {/* Headline */}\n <motion.div\n className=\"text-3xl sm:text-4xl lg:text-5xl font-black leading-[1.1]\"\n style={{ perspective: \"800px\" }}\n initial={{ opacity: 0, y: 16 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.5, delay: 0.1, ease: EASE_OUT }}\n >\n <span className=\"gradient-text\">\n <KineticWords text={headlineText} />\n </span>\n </motion.div>\n\n {/* Stats chips */}\n {stats && (\n <motion.div\n className=\"flex flex-wrap gap-2\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.4, delay: 0.35, ease: EASE_OUT }}\n >\n {[\n { label: \"Collections\", value: stats.collections },\n { label: \"Assets\", value: stats.tokens },\n { label: \"Sales\", value: stats.sales },\n ].map(({ label, value }) => (\n <div\n key={label}\n className=\"flex items-center gap-1.5 rounded-full border border-border bg-card px-3.5 py-1.5 text-sm\"\n >\n <span className=\"font-bold tabular-nums\">{value?.toLocaleString() ?? \"—\"}</span>\n <span className=\"text-muted-foreground\">{label}</span>\n </div>\n ))}\n </motion.div>\n )}\n\n {/* Scrolling ticker */}\n <ActivityTicker orders={orders} />\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA4BQ;AA1BR,2BAAuB;AACvB,+BAAuC;AACvC,6BAA+B;AAUxB,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,eAAe;AACjB,GAAsB;AACpB,SACE,6CAAC,SAAI,WAAU,iDAEb;AAAA;AAAA,MAAC,4BAAO;AAAA,MAAP;AAAA,QACC,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,YAAY,EAAE,UAAU,KAAK,MAAM,kCAAS;AAAA,QAE5C,sDAAC,UAAK,WAAU,cAAc,qBAAU;AAAA;AAAA,IAC1C;AAAA,IAGA;AAAA,MAAC,4BAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,aAAa,QAAQ;AAAA,QAC9B,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,YAAY,EAAE,UAAU,KAAK,OAAO,KAAK,MAAM,kCAAS;AAAA,QAExD,sDAAC,UAAK,WAAU,iBACd,sDAAC,yCAAa,MAAM,cAAc,GACpC;AAAA;AAAA,IACF;AAAA,IAGC,SACC;AAAA,MAAC,4BAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,YAAY,EAAE,UAAU,KAAK,OAAO,MAAM,MAAM,kCAAS;AAAA,QAExD;AAAA,UACC,EAAE,OAAO,eAAe,OAAO,MAAM,YAAY;AAAA,UACjD,EAAE,OAAO,UAAU,OAAO,MAAM,OAAO;AAAA,UACvC,EAAE,OAAO,SAAS,OAAO,MAAM,MAAM;AAAA,QACvC,EAAE,IAAI,CAAC,EAAE,OAAO,MAAM,MACpB;AAAA,UAAC;AAAA;AAAA,YAEC,WAAU;AAAA,YAEV;AAAA,0DAAC,UAAK,WAAU,0BAA0B,iBAAO,eAAe,KAAK,UAAI;AAAA,cACzE,4CAAC,UAAK,WAAU,yBAAyB,iBAAM;AAAA;AAAA;AAAA,UAJ1C;AAAA,QAKP,CACD;AAAA;AAAA,IACH;AAAA,IAIF,4CAAC,yCAAe,QAAgB;AAAA,KAClC;AAEJ;","names":[]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ApiOrder } from '@medialane/sdk';
|
|
3
|
+
|
|
4
|
+
interface DiscoverHeroProps {
|
|
5
|
+
stats: {
|
|
6
|
+
collections: number;
|
|
7
|
+
tokens: number;
|
|
8
|
+
sales: number;
|
|
9
|
+
} | null;
|
|
10
|
+
orders: ApiOrder[];
|
|
11
|
+
badgeText?: string;
|
|
12
|
+
headlineText?: string;
|
|
13
|
+
}
|
|
14
|
+
declare function DiscoverHero({ stats, orders, badgeText, headlineText, }: DiscoverHeroProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { DiscoverHero, type DiscoverHeroProps };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { ApiOrder } from '@medialane/sdk';
|
|
3
|
+
|
|
4
|
+
interface DiscoverHeroProps {
|
|
5
|
+
stats: {
|
|
6
|
+
collections: number;
|
|
7
|
+
tokens: number;
|
|
8
|
+
sales: number;
|
|
9
|
+
} | null;
|
|
10
|
+
orders: ApiOrder[];
|
|
11
|
+
badgeText?: string;
|
|
12
|
+
headlineText?: string;
|
|
13
|
+
}
|
|
14
|
+
declare function DiscoverHero({ stats, orders, badgeText, headlineText, }: DiscoverHeroProps): react_jsx_runtime.JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { DiscoverHero, type DiscoverHeroProps };
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { motion } from "framer-motion";
|
|
4
|
+
import { KineticWords, EASE_OUT } from "./motion-primitives.js";
|
|
5
|
+
import { ActivityTicker } from "./activity-ticker.js";
|
|
6
|
+
function DiscoverHero({
|
|
7
|
+
stats,
|
|
8
|
+
orders,
|
|
9
|
+
badgeText = "Creative Works",
|
|
10
|
+
headlineText = "Create, share & explore"
|
|
11
|
+
}) {
|
|
12
|
+
return /* @__PURE__ */ jsxs("div", { className: "space-y-6 pt-2 pb-6 border-b border-border/50", children: [
|
|
13
|
+
/* @__PURE__ */ jsx(
|
|
14
|
+
motion.div,
|
|
15
|
+
{
|
|
16
|
+
initial: { opacity: 0, y: 12 },
|
|
17
|
+
animate: { opacity: 1, y: 0 },
|
|
18
|
+
transition: { duration: 0.4, ease: EASE_OUT },
|
|
19
|
+
children: /* @__PURE__ */ jsx("span", { className: "pill-badge", children: badgeText })
|
|
20
|
+
}
|
|
21
|
+
),
|
|
22
|
+
/* @__PURE__ */ jsx(
|
|
23
|
+
motion.div,
|
|
24
|
+
{
|
|
25
|
+
className: "text-3xl sm:text-4xl lg:text-5xl font-black leading-[1.1]",
|
|
26
|
+
style: { perspective: "800px" },
|
|
27
|
+
initial: { opacity: 0, y: 16 },
|
|
28
|
+
animate: { opacity: 1, y: 0 },
|
|
29
|
+
transition: { duration: 0.5, delay: 0.1, ease: EASE_OUT },
|
|
30
|
+
children: /* @__PURE__ */ jsx("span", { className: "gradient-text", children: /* @__PURE__ */ jsx(KineticWords, { text: headlineText }) })
|
|
31
|
+
}
|
|
32
|
+
),
|
|
33
|
+
stats && /* @__PURE__ */ jsx(
|
|
34
|
+
motion.div,
|
|
35
|
+
{
|
|
36
|
+
className: "flex flex-wrap gap-2",
|
|
37
|
+
initial: { opacity: 0 },
|
|
38
|
+
animate: { opacity: 1 },
|
|
39
|
+
transition: { duration: 0.4, delay: 0.35, ease: EASE_OUT },
|
|
40
|
+
children: [
|
|
41
|
+
{ label: "Collections", value: stats.collections },
|
|
42
|
+
{ label: "Assets", value: stats.tokens },
|
|
43
|
+
{ label: "Sales", value: stats.sales }
|
|
44
|
+
].map(({ label, value }) => /* @__PURE__ */ jsxs(
|
|
45
|
+
"div",
|
|
46
|
+
{
|
|
47
|
+
className: "flex items-center gap-1.5 rounded-full border border-border bg-card px-3.5 py-1.5 text-sm",
|
|
48
|
+
children: [
|
|
49
|
+
/* @__PURE__ */ jsx("span", { className: "font-bold tabular-nums", children: value?.toLocaleString() ?? "\u2014" }),
|
|
50
|
+
/* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: label })
|
|
51
|
+
]
|
|
52
|
+
},
|
|
53
|
+
label
|
|
54
|
+
))
|
|
55
|
+
}
|
|
56
|
+
),
|
|
57
|
+
/* @__PURE__ */ jsx(ActivityTicker, { orders })
|
|
58
|
+
] });
|
|
59
|
+
}
|
|
60
|
+
export {
|
|
61
|
+
DiscoverHero
|
|
62
|
+
};
|
|
63
|
+
//# sourceMappingURL=discover-hero.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/discover-hero.tsx"],"sourcesContent":["\"use client\";\n\nimport { motion } from \"framer-motion\";\nimport { KineticWords, EASE_OUT } from \"./motion-primitives.js\";\nimport { ActivityTicker } from \"./activity-ticker.js\";\nimport type { ApiOrder } from \"@medialane/sdk\";\n\nexport interface DiscoverHeroProps {\n stats: { collections: number; tokens: number; sales: number } | null;\n orders: ApiOrder[];\n badgeText?: string;\n headlineText?: string;\n}\n\nexport function DiscoverHero({\n stats,\n orders,\n badgeText = \"Creative Works\",\n headlineText = \"Create, share & explore\",\n}: DiscoverHeroProps) {\n return (\n <div className=\"space-y-6 pt-2 pb-6 border-b border-border/50\">\n {/* Badge */}\n <motion.div\n initial={{ opacity: 0, y: 12 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.4, ease: EASE_OUT }}\n >\n <span className=\"pill-badge\">{badgeText}</span>\n </motion.div>\n\n {/* Headline */}\n <motion.div\n className=\"text-3xl sm:text-4xl lg:text-5xl font-black leading-[1.1]\"\n style={{ perspective: \"800px\" }}\n initial={{ opacity: 0, y: 16 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ duration: 0.5, delay: 0.1, ease: EASE_OUT }}\n >\n <span className=\"gradient-text\">\n <KineticWords text={headlineText} />\n </span>\n </motion.div>\n\n {/* Stats chips */}\n {stats && (\n <motion.div\n className=\"flex flex-wrap gap-2\"\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={{ duration: 0.4, delay: 0.35, ease: EASE_OUT }}\n >\n {[\n { label: \"Collections\", value: stats.collections },\n { label: \"Assets\", value: stats.tokens },\n { label: \"Sales\", value: stats.sales },\n ].map(({ label, value }) => (\n <div\n key={label}\n className=\"flex items-center gap-1.5 rounded-full border border-border bg-card px-3.5 py-1.5 text-sm\"\n >\n <span className=\"font-bold tabular-nums\">{value?.toLocaleString() ?? \"—\"}</span>\n <span className=\"text-muted-foreground\">{label}</span>\n </div>\n ))}\n </motion.div>\n )}\n\n {/* Scrolling ticker */}\n <ActivityTicker orders={orders} />\n </div>\n );\n}\n"],"mappings":";AA4BQ,cA6BI,YA7BJ;AA1BR,SAAS,cAAc;AACvB,SAAS,cAAc,gBAAgB;AACvC,SAAS,sBAAsB;AAUxB,SAAS,aAAa;AAAA,EAC3B;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,eAAe;AACjB,GAAsB;AACpB,SACE,qBAAC,SAAI,WAAU,iDAEb;AAAA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,YAAY,EAAE,UAAU,KAAK,MAAM,SAAS;AAAA,QAE5C,8BAAC,UAAK,WAAU,cAAc,qBAAU;AAAA;AAAA,IAC1C;AAAA,IAGA;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,aAAa,QAAQ;AAAA,QAC9B,SAAS,EAAE,SAAS,GAAG,GAAG,GAAG;AAAA,QAC7B,SAAS,EAAE,SAAS,GAAG,GAAG,EAAE;AAAA,QAC5B,YAAY,EAAE,UAAU,KAAK,OAAO,KAAK,MAAM,SAAS;AAAA,QAExD,8BAAC,UAAK,WAAU,iBACd,8BAAC,gBAAa,MAAM,cAAc,GACpC;AAAA;AAAA,IACF;AAAA,IAGC,SACC;AAAA,MAAC,OAAO;AAAA,MAAP;AAAA,QACC,WAAU;AAAA,QACV,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,SAAS,EAAE,SAAS,EAAE;AAAA,QACtB,YAAY,EAAE,UAAU,KAAK,OAAO,MAAM,MAAM,SAAS;AAAA,QAExD;AAAA,UACC,EAAE,OAAO,eAAe,OAAO,MAAM,YAAY;AAAA,UACjD,EAAE,OAAO,UAAU,OAAO,MAAM,OAAO;AAAA,UACvC,EAAE,OAAO,SAAS,OAAO,MAAM,MAAM;AAAA,QACvC,EAAE,IAAI,CAAC,EAAE,OAAO,MAAM,MACpB;AAAA,UAAC;AAAA;AAAA,YAEC,WAAU;AAAA,YAEV;AAAA,kCAAC,UAAK,WAAU,0BAA0B,iBAAO,eAAe,KAAK,UAAI;AAAA,cACzE,oBAAC,UAAK,WAAU,yBAAyB,iBAAM;AAAA;AAAA;AAAA,UAJ1C;AAAA,QAKP,CACD;AAAA;AAAA,IACH;AAAA,IAIF,oBAAC,kBAAe,QAAgB;AAAA,KAClC;AAEJ;","names":[]}
|
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
var featured_carousel_exports = {};
|
|
21
|
+
__export(featured_carousel_exports, {
|
|
22
|
+
FeaturedCarousel: () => FeaturedCarousel,
|
|
23
|
+
FeaturedCarouselSkeleton: () => FeaturedCarouselSkeleton
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(featured_carousel_exports);
|
|
26
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
27
|
+
var import_react = require("react");
|
|
28
|
+
var import_framer_motion = require("framer-motion");
|
|
29
|
+
var import_lucide_react = require("lucide-react");
|
|
30
|
+
var import_motion_primitives = require("./motion-primitives.js");
|
|
31
|
+
var import_ipfs = require("../utils/ipfs.js");
|
|
32
|
+
var import_format = require("../utils/format.js");
|
|
33
|
+
function Slide({ collection, href }) {
|
|
34
|
+
const name = collection.name ?? "Featured Collection";
|
|
35
|
+
const image = collection.image ? (0, import_ipfs.ipfsToHttp)(collection.image) : null;
|
|
36
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative w-full h-full", children: [
|
|
37
|
+
image ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
38
|
+
"img",
|
|
39
|
+
{
|
|
40
|
+
src: image,
|
|
41
|
+
alt: name,
|
|
42
|
+
loading: "lazy",
|
|
43
|
+
className: "absolute inset-0 w-full h-full object-cover"
|
|
44
|
+
}
|
|
45
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-br from-brand-purple/30 via-brand-blue/20 to-brand-navy/40" }),
|
|
46
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-t from-black/85 via-black/30 to-black/10" }),
|
|
47
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute inset-0 bg-gradient-to-r from-black/50 via-transparent to-transparent" }),
|
|
48
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "absolute bottom-0 left-0 right-0 p-5 sm:p-8 lg:p-10", children: [
|
|
49
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-2xl sm:text-3xl lg:text-4xl font-black text-white leading-tight mb-3 max-w-lg", children: name }),
|
|
50
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-4 mb-5", children: [
|
|
51
|
+
collection.totalSupply != null && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-sm text-white/70", children: [
|
|
52
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-bold text-white", children: collection.totalSupply }),
|
|
53
|
+
" items"
|
|
54
|
+
] }),
|
|
55
|
+
collection.floorPrice && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-sm text-white/70", children: [
|
|
56
|
+
"Floor",
|
|
57
|
+
" ",
|
|
58
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-bold text-brand-orange", children: (0, import_format.formatDisplayPrice)(collection.floorPrice) })
|
|
59
|
+
] })
|
|
60
|
+
] }),
|
|
61
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
62
|
+
"a",
|
|
63
|
+
{
|
|
64
|
+
href,
|
|
65
|
+
className: "inline-flex items-center gap-2 text-sm font-semibold px-4 py-2 rounded-lg bg-white/15 hover:bg-white/25 text-white border border-white/20 backdrop-blur-sm transition-colors",
|
|
66
|
+
children: [
|
|
67
|
+
"View Collection ",
|
|
68
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-3.5 w-3.5" })
|
|
69
|
+
]
|
|
70
|
+
}
|
|
71
|
+
)
|
|
72
|
+
] })
|
|
73
|
+
] });
|
|
74
|
+
}
|
|
75
|
+
function FeaturedCarouselSkeleton() {
|
|
76
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.FadeIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "space-y-4", children: [
|
|
77
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
|
|
78
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Sparkles, { className: "h-4 w-4 text-brand-purple" }),
|
|
79
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-xl font-bold", children: "Featured Collections" })
|
|
80
|
+
] }),
|
|
81
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "-mx-4 sm:-mx-6 lg:-mx-8 aspect-[16/7] sm:aspect-[21/9] bg-muted animate-pulse" })
|
|
82
|
+
] }) });
|
|
83
|
+
}
|
|
84
|
+
function FeaturedCarousel({
|
|
85
|
+
collections,
|
|
86
|
+
isLoading,
|
|
87
|
+
getHref,
|
|
88
|
+
allCollectionsHref = "/collections"
|
|
89
|
+
}) {
|
|
90
|
+
const [active, setActive] = (0, import_react.useState)(0);
|
|
91
|
+
const [paused, setPaused] = (0, import_react.useState)(false);
|
|
92
|
+
const total = collections.length;
|
|
93
|
+
const next = (0, import_react.useCallback)(() => setActive((p) => (p + 1) % total), [total]);
|
|
94
|
+
const prev = (0, import_react.useCallback)(() => setActive((p) => (p - 1 + total) % total), [total]);
|
|
95
|
+
(0, import_react.useEffect)(() => {
|
|
96
|
+
setActive(0);
|
|
97
|
+
}, [total]);
|
|
98
|
+
(0, import_react.useEffect)(() => {
|
|
99
|
+
if (paused || total <= 1) return;
|
|
100
|
+
const id = setInterval(next, 6e3);
|
|
101
|
+
return () => clearInterval(id);
|
|
102
|
+
}, [next, paused, total]);
|
|
103
|
+
if (isLoading) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FeaturedCarouselSkeleton, {});
|
|
104
|
+
if (total === 0) return null;
|
|
105
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_motion_primitives.FadeIn, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "space-y-4", children: [
|
|
106
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
107
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-2 mt-0.5", children: [
|
|
108
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.Sparkles, { className: "h-4 w-4 text-brand-purple" }),
|
|
109
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { className: "text-xl font-bold", children: "Featured Collections" })
|
|
110
|
+
] }),
|
|
111
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
112
|
+
"a",
|
|
113
|
+
{
|
|
114
|
+
href: allCollectionsHref,
|
|
115
|
+
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",
|
|
116
|
+
children: [
|
|
117
|
+
"View all ",
|
|
118
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ArrowRight, { className: "h-3.5 w-3.5" })
|
|
119
|
+
]
|
|
120
|
+
}
|
|
121
|
+
)
|
|
122
|
+
] }),
|
|
123
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
124
|
+
"div",
|
|
125
|
+
{
|
|
126
|
+
className: "-mx-4 sm:-mx-6 lg:-mx-8 relative overflow-hidden aspect-[16/7] sm:aspect-[21/9] bg-muted",
|
|
127
|
+
onMouseEnter: () => setPaused(true),
|
|
128
|
+
onMouseLeave: () => setPaused(false),
|
|
129
|
+
children: [
|
|
130
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_framer_motion.AnimatePresence, { mode: "wait", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
131
|
+
import_framer_motion.motion.div,
|
|
132
|
+
{
|
|
133
|
+
className: "absolute inset-0",
|
|
134
|
+
initial: { opacity: 0, x: 40 },
|
|
135
|
+
animate: { opacity: 1, x: 0 },
|
|
136
|
+
exit: { opacity: 0, x: -40 },
|
|
137
|
+
transition: { duration: 0.45, ease: import_motion_primitives.EASE_OUT },
|
|
138
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Slide, { collection: collections[active], href: getHref(collections[active]) })
|
|
139
|
+
},
|
|
140
|
+
active
|
|
141
|
+
) }),
|
|
142
|
+
total > 1 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
143
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
144
|
+
"button",
|
|
145
|
+
{
|
|
146
|
+
onClick: prev,
|
|
147
|
+
className: "absolute left-3 top-1/2 -translate-y-1/2 h-9 w-9 rounded-full bg-black/40 border border-white/10 backdrop-blur-sm flex items-center justify-center text-white hover:bg-black/60 transition-colors z-10",
|
|
148
|
+
"aria-label": "Previous",
|
|
149
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronLeft, { className: "h-4 w-4" })
|
|
150
|
+
}
|
|
151
|
+
),
|
|
152
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
153
|
+
"button",
|
|
154
|
+
{
|
|
155
|
+
onClick: next,
|
|
156
|
+
className: "absolute right-3 top-1/2 -translate-y-1/2 h-9 w-9 rounded-full bg-black/40 border border-white/10 backdrop-blur-sm flex items-center justify-center text-white hover:bg-black/60 transition-colors z-10",
|
|
157
|
+
"aria-label": "Next",
|
|
158
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.ChevronRight, { className: "h-4 w-4" })
|
|
159
|
+
}
|
|
160
|
+
)
|
|
161
|
+
] }),
|
|
162
|
+
total > 1 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "absolute bottom-4 left-1/2 -translate-x-1/2 flex items-center gap-1.5 z-10", children: collections.map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
163
|
+
"button",
|
|
164
|
+
{
|
|
165
|
+
onClick: () => setActive(i),
|
|
166
|
+
className: `h-1.5 rounded-full transition-all duration-300 ${i === active ? "w-6 bg-white" : "w-1.5 bg-white/40 hover:bg-white/70"}`,
|
|
167
|
+
"aria-label": `Go to slide ${i + 1}`
|
|
168
|
+
},
|
|
169
|
+
i
|
|
170
|
+
)) })
|
|
171
|
+
]
|
|
172
|
+
}
|
|
173
|
+
)
|
|
174
|
+
] }) });
|
|
175
|
+
}
|
|
176
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
177
|
+
0 && (module.exports = {
|
|
178
|
+
FeaturedCarousel,
|
|
179
|
+
FeaturedCarouselSkeleton
|
|
180
|
+
});
|
|
181
|
+
//# sourceMappingURL=featured-carousel.cjs.map
|