@medialane/ui 0.138.0 → 0.140.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/badge.d.cts +1 -1
- package/dist/components/badge.d.ts +1 -1
- package/dist/components/button.d.cts +2 -2
- package/dist/components/button.d.ts +2 -2
- package/dist/components/claim-rail.cjs +14 -4
- package/dist/components/claim-rail.cjs.map +1 -1
- package/dist/components/claim-rail.d.cts +4 -1
- package/dist/components/claim-rail.d.ts +4 -1
- package/dist/components/claim-rail.js +14 -4
- package/dist/components/claim-rail.js.map +1 -1
- package/dist/components/coin-launch-preview.cjs +34 -27
- package/dist/components/coin-launch-preview.cjs.map +1 -1
- package/dist/components/coin-launch-preview.d.cts +1 -0
- package/dist/components/coin-launch-preview.d.ts +1 -0
- package/dist/components/coin-launch-preview.js +34 -27
- package/dist/components/coin-launch-preview.js.map +1 -1
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ import * as React from 'react';
|
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
5
|
|
|
6
6
|
declare const badgeVariants: (props?: ({
|
|
7
|
-
variant?: "
|
|
7
|
+
variant?: "outline" | "default" | "destructive" | "secondary" | null | undefined;
|
|
8
8
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
9
|
interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
|
|
10
10
|
}
|
|
@@ -4,7 +4,7 @@ import * as React from 'react';
|
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
5
|
|
|
6
6
|
declare const badgeVariants: (props?: ({
|
|
7
|
-
variant?: "
|
|
7
|
+
variant?: "outline" | "default" | "destructive" | "secondary" | null | undefined;
|
|
8
8
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
9
|
interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
|
|
10
10
|
}
|
|
@@ -3,8 +3,8 @@ import * as React from 'react';
|
|
|
3
3
|
import { VariantProps } from 'class-variance-authority';
|
|
4
4
|
|
|
5
5
|
declare const buttonVariants: (props?: ({
|
|
6
|
-
variant?: "link" | "
|
|
7
|
-
size?: "
|
|
6
|
+
variant?: "link" | "ghost" | "outline" | "default" | "destructive" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
|
|
7
|
+
size?: "default" | "icon" | "sm" | "lg" | null | undefined;
|
|
8
8
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
9
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
10
10
|
asChild?: boolean;
|
|
@@ -3,8 +3,8 @@ import * as React from 'react';
|
|
|
3
3
|
import { VariantProps } from 'class-variance-authority';
|
|
4
4
|
|
|
5
5
|
declare const buttonVariants: (props?: ({
|
|
6
|
-
variant?: "link" | "
|
|
7
|
-
size?: "
|
|
6
|
+
variant?: "link" | "ghost" | "outline" | "default" | "destructive" | "secondary" | "premium" | "tonal" | "gradient-border" | "gradient-fill" | null | undefined;
|
|
7
|
+
size?: "default" | "icon" | "sm" | "lg" | null | undefined;
|
|
8
8
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
9
9
|
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
10
10
|
asChild?: boolean;
|
|
@@ -23,12 +23,22 @@ __export(claim_rail_exports, {
|
|
|
23
23
|
module.exports = __toCommonJS(claim_rail_exports);
|
|
24
24
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
25
|
var import_lucide_react = require("lucide-react");
|
|
26
|
-
|
|
26
|
+
var import_cn = require("../utils/cn.js");
|
|
27
|
+
function ClaimRail({
|
|
28
|
+
included,
|
|
29
|
+
steps,
|
|
30
|
+
trustLead,
|
|
31
|
+
trust,
|
|
32
|
+
trustIcon: TrustIcon = import_lucide_react.ShieldCheck,
|
|
33
|
+
includedAccentClass = "bg-brand-blue/10 text-brand-blue",
|
|
34
|
+
stepAccentClass = "bg-brand-purple/10 text-brand-purple",
|
|
35
|
+
trustAccentClass = "text-brand-orange"
|
|
36
|
+
}) {
|
|
27
37
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-2xl bg-muted/50 dark:bg-card divide-y divide-border/60 overflow-hidden", children: [
|
|
28
38
|
included && included.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "p-5", children: [
|
|
29
39
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "section-label", children: "What's included" }),
|
|
30
40
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("ul", { className: "mt-4 space-y-4", children: included.map(({ icon: Icon, title, desc }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex items-start gap-3", children: [
|
|
31
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "h-8 w-8 rounded-lg
|
|
41
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: (0, import_cn.cn)("h-8 w-8 rounded-lg flex items-center justify-center shrink-0", includedAccentClass), children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { className: "h-4 w-4" }) }),
|
|
32
42
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0", children: [
|
|
33
43
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm font-semibold text-foreground", children: title }),
|
|
34
44
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground leading-relaxed mt-0.5", children: desc })
|
|
@@ -38,12 +48,12 @@ function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon = i
|
|
|
38
48
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "p-5", children: [
|
|
39
49
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "section-label", children: "How it works" }),
|
|
40
50
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("ol", { className: "mt-4 space-y-3", children: steps.map((label, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("li", { className: "flex items-center gap-3", children: [
|
|
41
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "h-8 w-8 rounded-lg
|
|
51
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_cn.cn)("h-8 w-8 rounded-lg flex items-center justify-center shrink-0 text-sm font-bold tabular-nums", stepAccentClass), children: i + 1 }),
|
|
42
52
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-sm text-foreground/90", children: label })
|
|
43
53
|
] }, label)) })
|
|
44
54
|
] }),
|
|
45
55
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", { className: "p-5 bg-muted/40 flex items-start gap-3", children: [
|
|
46
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TrustIcon, { className: "h-5 w-5
|
|
56
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TrustIcon, { className: (0, import_cn.cn)("h-5 w-5 shrink-0 mt-0.5", trustAccentClass) }),
|
|
47
57
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-sm text-muted-foreground leading-relaxed", children: [
|
|
48
58
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "font-semibold text-foreground", children: trustLead }),
|
|
49
59
|
" ",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/claim-rail.tsx"],"sourcesContent":["import { ShieldCheck, type LucideIcon } from \"lucide-react\";\n\nexport interface ClaimRailProps {\n\n included?: { icon: LucideIcon; title: string; desc: string }[];\n\n steps: string[];\n\n trustLead: string;\n trust: string;\n\n trustIcon?: LucideIcon;\n}\n\nexport function ClaimRail({
|
|
1
|
+
{"version":3,"sources":["../../src/components/claim-rail.tsx"],"sourcesContent":["import { ShieldCheck, type LucideIcon } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ClaimRailProps {\n\n included?: { icon: LucideIcon; title: string; desc: string }[];\n\n steps: string[];\n\n trustLead: string;\n trust: string;\n\n trustIcon?: LucideIcon;\n\n includedAccentClass?: string;\n stepAccentClass?: string;\n trustAccentClass?: string;\n}\n\nexport function ClaimRail({\n included,\n steps,\n trustLead,\n trust,\n trustIcon: TrustIcon = ShieldCheck,\n includedAccentClass = \"bg-brand-blue/10 text-brand-blue\",\n stepAccentClass = \"bg-brand-purple/10 text-brand-purple\",\n trustAccentClass = \"text-brand-orange\",\n}: ClaimRailProps) {\n return (\n <div className=\"rounded-2xl bg-muted/50 dark:bg-card divide-y divide-border/60 overflow-hidden\">\n {included && included.length > 0 && (\n <section className=\"p-5\">\n <p className=\"section-label\">What's included</p>\n <ul className=\"mt-4 space-y-4\">\n {included.map(({ icon: Icon, title, desc }) => (\n <li key={title} className=\"flex items-start gap-3\">\n <div className={cn(\"h-8 w-8 rounded-lg flex items-center justify-center shrink-0\", includedAccentClass)}>\n <Icon className=\"h-4 w-4\" />\n </div>\n <div className=\"min-w-0\">\n <p className=\"text-sm font-semibold text-foreground\">{title}</p>\n <p className=\"text-sm text-muted-foreground leading-relaxed mt-0.5\">{desc}</p>\n </div>\n </li>\n ))}\n </ul>\n </section>\n )}\n\n <section className=\"p-5\">\n <p className=\"section-label\">How it works</p>\n <ol className=\"mt-4 space-y-3\">\n {steps.map((label, i) => (\n <li key={label} className=\"flex items-center gap-3\">\n <span className={cn(\"h-8 w-8 rounded-lg flex items-center justify-center shrink-0 text-sm font-bold tabular-nums\", stepAccentClass)}>\n {i + 1}\n </span>\n <span className=\"text-sm text-foreground/90\">{label}</span>\n </li>\n ))}\n </ol>\n </section>\n\n <section className=\"p-5 bg-muted/40 flex items-start gap-3\">\n <TrustIcon className={cn(\"h-5 w-5 shrink-0 mt-0.5\", trustAccentClass)} />\n <p className=\"text-sm text-muted-foreground leading-relaxed\">\n <span className=\"font-semibold text-foreground\">{trustLead}</span> {trust}\n </p>\n </section>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCU;AAjCV,0BAA6C;AAC7C,gBAAmB;AAkBZ,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW,YAAY;AAAA,EACvB,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,mBAAmB;AACrB,GAAmB;AACjB,SACE,6CAAC,SAAI,WAAU,kFACZ;AAAA,gBAAY,SAAS,SAAS,KAC7B,6CAAC,aAAQ,WAAU,OACjB;AAAA,kDAAC,OAAE,WAAU,iBAAgB,6BAAoB;AAAA,MACjD,4CAAC,QAAG,WAAU,kBACX,mBAAS,IAAI,CAAC,EAAE,MAAM,MAAM,OAAO,KAAK,MACvC,6CAAC,QAAe,WAAU,0BACxB;AAAA,oDAAC,SAAI,eAAW,cAAG,gEAAgE,mBAAmB,GACpG,sDAAC,QAAK,WAAU,WAAU,GAC5B;AAAA,QACA,6CAAC,SAAI,WAAU,WACb;AAAA,sDAAC,OAAE,WAAU,yCAAyC,iBAAM;AAAA,UAC5D,4CAAC,OAAE,WAAU,wDAAwD,gBAAK;AAAA,WAC5E;AAAA,WAPO,KAQT,CACD,GACH;AAAA,OACF;AAAA,IAGF,6CAAC,aAAQ,WAAU,OACjB;AAAA,kDAAC,OAAE,WAAU,iBAAgB,0BAAY;AAAA,MACzC,4CAAC,QAAG,WAAU,kBACX,gBAAM,IAAI,CAAC,OAAO,MACjB,6CAAC,QAAe,WAAU,2BACxB;AAAA,oDAAC,UAAK,eAAW,cAAG,+FAA+F,eAAe,GAC/H,cAAI,GACP;AAAA,QACA,4CAAC,UAAK,WAAU,8BAA8B,iBAAM;AAAA,WAJ7C,KAKT,CACD,GACH;AAAA,OACF;AAAA,IAEA,6CAAC,aAAQ,WAAU,0CACjB;AAAA,kDAAC,aAAU,eAAW,cAAG,2BAA2B,gBAAgB,GAAG;AAAA,MACvE,6CAAC,OAAE,WAAU,iDACX;AAAA,oDAAC,UAAK,WAAU,iCAAiC,qBAAU;AAAA,QAAO;AAAA,QAAE;AAAA,SACtE;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -11,7 +11,10 @@ interface ClaimRailProps {
|
|
|
11
11
|
trustLead: string;
|
|
12
12
|
trust: string;
|
|
13
13
|
trustIcon?: LucideIcon;
|
|
14
|
+
includedAccentClass?: string;
|
|
15
|
+
stepAccentClass?: string;
|
|
16
|
+
trustAccentClass?: string;
|
|
14
17
|
}
|
|
15
|
-
declare function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon }: ClaimRailProps): react_jsx_runtime.JSX.Element;
|
|
18
|
+
declare function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon, includedAccentClass, stepAccentClass, trustAccentClass, }: ClaimRailProps): react_jsx_runtime.JSX.Element;
|
|
16
19
|
|
|
17
20
|
export { ClaimRail, type ClaimRailProps };
|
|
@@ -11,7 +11,10 @@ interface ClaimRailProps {
|
|
|
11
11
|
trustLead: string;
|
|
12
12
|
trust: string;
|
|
13
13
|
trustIcon?: LucideIcon;
|
|
14
|
+
includedAccentClass?: string;
|
|
15
|
+
stepAccentClass?: string;
|
|
16
|
+
trustAccentClass?: string;
|
|
14
17
|
}
|
|
15
|
-
declare function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon }: ClaimRailProps): react_jsx_runtime.JSX.Element;
|
|
18
|
+
declare function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon, includedAccentClass, stepAccentClass, trustAccentClass, }: ClaimRailProps): react_jsx_runtime.JSX.Element;
|
|
16
19
|
|
|
17
20
|
export { ClaimRail, type ClaimRailProps };
|
|
@@ -1,11 +1,21 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { ShieldCheck } from "lucide-react";
|
|
3
|
-
|
|
3
|
+
import { cn } from "../utils/cn.js";
|
|
4
|
+
function ClaimRail({
|
|
5
|
+
included,
|
|
6
|
+
steps,
|
|
7
|
+
trustLead,
|
|
8
|
+
trust,
|
|
9
|
+
trustIcon: TrustIcon = ShieldCheck,
|
|
10
|
+
includedAccentClass = "bg-brand-blue/10 text-brand-blue",
|
|
11
|
+
stepAccentClass = "bg-brand-purple/10 text-brand-purple",
|
|
12
|
+
trustAccentClass = "text-brand-orange"
|
|
13
|
+
}) {
|
|
4
14
|
return /* @__PURE__ */ jsxs("div", { className: "rounded-2xl bg-muted/50 dark:bg-card divide-y divide-border/60 overflow-hidden", children: [
|
|
5
15
|
included && included.length > 0 && /* @__PURE__ */ jsxs("section", { className: "p-5", children: [
|
|
6
16
|
/* @__PURE__ */ jsx("p", { className: "section-label", children: "What's included" }),
|
|
7
17
|
/* @__PURE__ */ jsx("ul", { className: "mt-4 space-y-4", children: included.map(({ icon: Icon, title, desc }) => /* @__PURE__ */ jsxs("li", { className: "flex items-start gap-3", children: [
|
|
8
|
-
/* @__PURE__ */ jsx("div", { className: "h-8 w-8 rounded-lg
|
|
18
|
+
/* @__PURE__ */ jsx("div", { className: cn("h-8 w-8 rounded-lg flex items-center justify-center shrink-0", includedAccentClass), children: /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }) }),
|
|
9
19
|
/* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
|
|
10
20
|
/* @__PURE__ */ jsx("p", { className: "text-sm font-semibold text-foreground", children: title }),
|
|
11
21
|
/* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground leading-relaxed mt-0.5", children: desc })
|
|
@@ -15,12 +25,12 @@ function ClaimRail({ included, steps, trustLead, trust, trustIcon: TrustIcon = S
|
|
|
15
25
|
/* @__PURE__ */ jsxs("section", { className: "p-5", children: [
|
|
16
26
|
/* @__PURE__ */ jsx("p", { className: "section-label", children: "How it works" }),
|
|
17
27
|
/* @__PURE__ */ jsx("ol", { className: "mt-4 space-y-3", children: steps.map((label, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-3", children: [
|
|
18
|
-
/* @__PURE__ */ jsx("span", { className: "h-8 w-8 rounded-lg
|
|
28
|
+
/* @__PURE__ */ jsx("span", { className: cn("h-8 w-8 rounded-lg flex items-center justify-center shrink-0 text-sm font-bold tabular-nums", stepAccentClass), children: i + 1 }),
|
|
19
29
|
/* @__PURE__ */ jsx("span", { className: "text-sm text-foreground/90", children: label })
|
|
20
30
|
] }, label)) })
|
|
21
31
|
] }),
|
|
22
32
|
/* @__PURE__ */ jsxs("section", { className: "p-5 bg-muted/40 flex items-start gap-3", children: [
|
|
23
|
-
/* @__PURE__ */ jsx(TrustIcon, { className: "h-5 w-5
|
|
33
|
+
/* @__PURE__ */ jsx(TrustIcon, { className: cn("h-5 w-5 shrink-0 mt-0.5", trustAccentClass) }),
|
|
24
34
|
/* @__PURE__ */ jsxs("p", { className: "text-sm text-muted-foreground leading-relaxed", children: [
|
|
25
35
|
/* @__PURE__ */ jsx("span", { className: "font-semibold text-foreground", children: trustLead }),
|
|
26
36
|
" ",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/claim-rail.tsx"],"sourcesContent":["import { ShieldCheck, type LucideIcon } from \"lucide-react\";\n\nexport interface ClaimRailProps {\n\n included?: { icon: LucideIcon; title: string; desc: string }[];\n\n steps: string[];\n\n trustLead: string;\n trust: string;\n\n trustIcon?: LucideIcon;\n}\n\nexport function ClaimRail({
|
|
1
|
+
{"version":3,"sources":["../../src/components/claim-rail.tsx"],"sourcesContent":["import { ShieldCheck, type LucideIcon } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface ClaimRailProps {\n\n included?: { icon: LucideIcon; title: string; desc: string }[];\n\n steps: string[];\n\n trustLead: string;\n trust: string;\n\n trustIcon?: LucideIcon;\n\n includedAccentClass?: string;\n stepAccentClass?: string;\n trustAccentClass?: string;\n}\n\nexport function ClaimRail({\n included,\n steps,\n trustLead,\n trust,\n trustIcon: TrustIcon = ShieldCheck,\n includedAccentClass = \"bg-brand-blue/10 text-brand-blue\",\n stepAccentClass = \"bg-brand-purple/10 text-brand-purple\",\n trustAccentClass = \"text-brand-orange\",\n}: ClaimRailProps) {\n return (\n <div className=\"rounded-2xl bg-muted/50 dark:bg-card divide-y divide-border/60 overflow-hidden\">\n {included && included.length > 0 && (\n <section className=\"p-5\">\n <p className=\"section-label\">What's included</p>\n <ul className=\"mt-4 space-y-4\">\n {included.map(({ icon: Icon, title, desc }) => (\n <li key={title} className=\"flex items-start gap-3\">\n <div className={cn(\"h-8 w-8 rounded-lg flex items-center justify-center shrink-0\", includedAccentClass)}>\n <Icon className=\"h-4 w-4\" />\n </div>\n <div className=\"min-w-0\">\n <p className=\"text-sm font-semibold text-foreground\">{title}</p>\n <p className=\"text-sm text-muted-foreground leading-relaxed mt-0.5\">{desc}</p>\n </div>\n </li>\n ))}\n </ul>\n </section>\n )}\n\n <section className=\"p-5\">\n <p className=\"section-label\">How it works</p>\n <ol className=\"mt-4 space-y-3\">\n {steps.map((label, i) => (\n <li key={label} className=\"flex items-center gap-3\">\n <span className={cn(\"h-8 w-8 rounded-lg flex items-center justify-center shrink-0 text-sm font-bold tabular-nums\", stepAccentClass)}>\n {i + 1}\n </span>\n <span className=\"text-sm text-foreground/90\">{label}</span>\n </li>\n ))}\n </ol>\n </section>\n\n <section className=\"p-5 bg-muted/40 flex items-start gap-3\">\n <TrustIcon className={cn(\"h-5 w-5 shrink-0 mt-0.5\", trustAccentClass)} />\n <p className=\"text-sm text-muted-foreground leading-relaxed\">\n <span className=\"font-semibold text-foreground\">{trustLead}</span> {trust}\n </p>\n </section>\n </div>\n );\n}\n"],"mappings":"AAiCU,cAOM,YAPN;AAjCV,SAAS,mBAAoC;AAC7C,SAAS,UAAU;AAkBZ,SAAS,UAAU;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW,YAAY;AAAA,EACvB,sBAAsB;AAAA,EACtB,kBAAkB;AAAA,EAClB,mBAAmB;AACrB,GAAmB;AACjB,SACE,qBAAC,SAAI,WAAU,kFACZ;AAAA,gBAAY,SAAS,SAAS,KAC7B,qBAAC,aAAQ,WAAU,OACjB;AAAA,0BAAC,OAAE,WAAU,iBAAgB,6BAAoB;AAAA,MACjD,oBAAC,QAAG,WAAU,kBACX,mBAAS,IAAI,CAAC,EAAE,MAAM,MAAM,OAAO,KAAK,MACvC,qBAAC,QAAe,WAAU,0BACxB;AAAA,4BAAC,SAAI,WAAW,GAAG,gEAAgE,mBAAmB,GACpG,8BAAC,QAAK,WAAU,WAAU,GAC5B;AAAA,QACA,qBAAC,SAAI,WAAU,WACb;AAAA,8BAAC,OAAE,WAAU,yCAAyC,iBAAM;AAAA,UAC5D,oBAAC,OAAE,WAAU,wDAAwD,gBAAK;AAAA,WAC5E;AAAA,WAPO,KAQT,CACD,GACH;AAAA,OACF;AAAA,IAGF,qBAAC,aAAQ,WAAU,OACjB;AAAA,0BAAC,OAAE,WAAU,iBAAgB,0BAAY;AAAA,MACzC,oBAAC,QAAG,WAAU,kBACX,gBAAM,IAAI,CAAC,OAAO,MACjB,qBAAC,QAAe,WAAU,2BACxB;AAAA,4BAAC,UAAK,WAAW,GAAG,+FAA+F,eAAe,GAC/H,cAAI,GACP;AAAA,QACA,oBAAC,UAAK,WAAU,8BAA8B,iBAAM;AAAA,WAJ7C,KAKT,CACD,GACH;AAAA,OACF;AAAA,IAEA,qBAAC,aAAQ,WAAU,0CACjB;AAAA,0BAAC,aAAU,WAAW,GAAG,2BAA2B,gBAAgB,GAAG;AAAA,MACvE,qBAAC,OAAE,WAAU,iDACX;AAAA,4BAAC,UAAK,WAAU,iCAAiC,qBAAU;AAAA,QAAO;AAAA,QAAE;AAAA,SACtE;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -36,60 +36,67 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
36
36
|
var import_image = __toESM(require("./image.js"), 1);
|
|
37
37
|
var import_lucide_react = require("lucide-react");
|
|
38
38
|
var import_cn = require("../utils/cn.js");
|
|
39
|
-
|
|
40
|
-
const COIN_GRADIENT = "linear-gradient(135deg, #
|
|
39
|
+
var import_currency_icon = require("./currency-icon.js");
|
|
40
|
+
const COIN_GRADIENT = "linear-gradient(135deg, #d5520b, #e175b0)";
|
|
41
|
+
function StatValue({ children }) {
|
|
42
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "inline-flex items-center gap-1 font-bold tabular-nums text-brand-maeve", children });
|
|
43
|
+
}
|
|
41
44
|
function CoinLaunchPreview({ data, className }) {
|
|
42
|
-
const { name, symbol, description, imageUrl, supplyHuman, quoteSymbol, teamPct } = data;
|
|
43
|
-
const marketCap = supplyHuman != null ? supplyHuman *
|
|
45
|
+
const { name, symbol, description, imageUrl, supplyHuman, price, quoteSymbol, teamPct } = data;
|
|
46
|
+
const marketCap = supplyHuman != null ? supplyHuman * price : null;
|
|
44
47
|
const yourCoins = supplyHuman != null ? supplyHuman * (teamPct / 100) : null;
|
|
45
48
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: (0, import_cn.cn)("rounded-2xl bg-muted/50 dark:bg-card overflow-hidden", className), children: [
|
|
46
49
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "px-5 pt-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "section-label", children: "Live preview" }) }),
|
|
47
50
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-5 space-y-4", children: [
|
|
48
51
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center gap-3", children: [
|
|
49
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "shrink-0 rounded-full p-[2px]", style: { background: COIN_GRADIENT }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center", children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: imageUrl, alt: "", fill: true, sizes: "56px", className: "object-cover", unoptimized: true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.TrendingUp, { className: "h-6 w-6 text-brand-
|
|
52
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "shrink-0 rounded-full p-[2px]", style: { background: COIN_GRADIENT }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center", children: imageUrl ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_image.default, { src: imageUrl, alt: "", fill: true, sizes: "56px", className: "object-cover", unoptimized: true }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_react.TrendingUp, { className: "h-6 w-6 text-brand-orange/70" }) }) }),
|
|
50
53
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "min-w-0 flex-1", children: [
|
|
51
54
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: (0, import_cn.cn)("font-bold text-lg leading-snug truncate", !name && "text-muted-foreground/50"), children: name || "Your coin" }),
|
|
52
55
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground tabular-nums", children: symbol ? `$${symbol}` : "$SYMBOL" })
|
|
53
56
|
] })
|
|
54
57
|
] }),
|
|
55
58
|
description ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-sm text-muted-foreground leading-relaxed line-clamp-3", children: description }) : null,
|
|
56
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "
|
|
59
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "rounded-xl bg-muted/50 dark:bg-muted/30 p-4 space-y-3", children: [
|
|
57
60
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
58
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs uppercase tracking-wide text-muted-foreground", children: "
|
|
59
|
-
/* @__PURE__ */ (0, import_jsx_runtime.
|
|
60
|
-
|
|
61
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs uppercase tracking-wide text-muted-foreground", children: "Market cap" }),
|
|
62
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xl", children: marketCap != null ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(StatValue, { children: [
|
|
63
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: quoteSymbol, size: 18 }),
|
|
64
|
+
marketCap.toLocaleString(),
|
|
61
65
|
" ",
|
|
62
66
|
quoteSymbol
|
|
63
|
-
] })
|
|
67
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: "\u2014" }) })
|
|
64
68
|
] }),
|
|
65
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
|
|
66
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("
|
|
67
|
-
/* @__PURE__ */ (0, import_jsx_runtime.
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
69
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between text-sm border-t border-border/60 pt-3", children: [
|
|
70
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground", children: "Launch price" }),
|
|
71
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "inline-flex items-center gap-1 font-semibold tabular-nums", children: [
|
|
72
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_currency_icon.CurrencyIcon, { symbol: quoteSymbol, size: 14 }),
|
|
73
|
+
price,
|
|
74
|
+
" ",
|
|
75
|
+
quoteSymbol,
|
|
76
|
+
" / coin"
|
|
77
|
+
] })
|
|
72
78
|
] })
|
|
73
79
|
] }),
|
|
74
80
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-1.5", children: [
|
|
75
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
] }),
|
|
79
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex justify-between text-2xs text-muted-foreground", children: [
|
|
80
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-medium text-brand-rose", children: [
|
|
81
|
-
"You ",
|
|
81
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between text-sm", children: [
|
|
82
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "font-medium text-brand-orange", children: [
|
|
83
|
+
"You keep ",
|
|
82
84
|
teamPct,
|
|
83
|
-
"%"
|
|
85
|
+
"%",
|
|
86
|
+
yourCoins != null ? ` \xB7 ${yourCoins.toLocaleString()} ${symbol || "coins"}` : ""
|
|
84
87
|
] }),
|
|
85
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { children: [
|
|
88
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: "text-muted-foreground", children: [
|
|
86
89
|
"Community ",
|
|
87
90
|
100 - teamPct,
|
|
88
91
|
"%"
|
|
89
92
|
] })
|
|
93
|
+
] }),
|
|
94
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex h-2.5 rounded-full overflow-hidden bg-muted-foreground/15", children: [
|
|
95
|
+
teamPct > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { width: `${teamPct}%`, background: COIN_GRADIENT } }),
|
|
96
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "flex-1" })
|
|
90
97
|
] })
|
|
91
98
|
] }),
|
|
92
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs text-muted-foreground/70", children: "Liquidity
|
|
99
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-2xs text-muted-foreground/70", children: "Liquidity locks permanently at launch." })
|
|
93
100
|
] })
|
|
94
101
|
] });
|
|
95
102
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/coin-launch-preview.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { TrendingUp } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface CoinPreviewData {\n name: string;\n symbol: string;\n description: string;\n\n imageUrl: string | null;\n\n supplyHuman: number | null;\n quoteSymbol: string;\n teamPct: number;\n}\n\nconst
|
|
1
|
+
{"version":3,"sources":["../../src/components/coin-launch-preview.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { TrendingUp } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\n\nexport interface CoinPreviewData {\n name: string;\n symbol: string;\n description: string;\n\n imageUrl: string | null;\n\n supplyHuman: number | null;\n price: number;\n quoteSymbol: string;\n teamPct: number;\n}\n\nconst COIN_GRADIENT = \"linear-gradient(135deg, #d5520b, #e175b0)\";\n\nfunction StatValue({ children }: { children: React.ReactNode }) {\n return (\n <span className=\"inline-flex items-center gap-1 font-bold tabular-nums text-brand-maeve\">\n {children}\n </span>\n );\n}\n\nexport function CoinLaunchPreview({ data, className }: { data: CoinPreviewData; className?: string }) {\n const { name, symbol, description, imageUrl, supplyHuman, price, quoteSymbol, teamPct } = data;\n const marketCap = supplyHuman != null ? supplyHuman * price : null;\n const yourCoins = supplyHuman != null ? supplyHuman * (teamPct / 100) : null;\n\n return (\n <div className={cn(\"rounded-2xl bg-muted/50 dark:bg-card overflow-hidden\", className)}>\n <div className=\"px-5 pt-4\">\n <p className=\"section-label\">Live preview</p>\n </div>\n\n <div className=\"p-5 space-y-4\">\n\n <div className=\"flex items-center gap-3\">\n <div className=\"shrink-0 rounded-full p-[2px]\" style={{ background: COIN_GRADIENT }}>\n <div className=\"relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center\">\n {imageUrl ? (\n <Image src={imageUrl} alt=\"\" fill sizes=\"56px\" className=\"object-cover\" unoptimized />\n ) : (\n <TrendingUp className=\"h-6 w-6 text-brand-orange/70\" />\n )}\n </div>\n </div>\n <div className=\"min-w-0 flex-1\">\n <p className={cn(\"font-bold text-lg leading-snug truncate\", !name && \"text-muted-foreground/50\")}>\n {name || \"Your coin\"}\n </p>\n <p className=\"text-sm text-muted-foreground tabular-nums\">{symbol ? `$${symbol}` : \"$SYMBOL\"}</p>\n </div>\n </div>\n\n {description ? (\n <p className=\"text-sm text-muted-foreground leading-relaxed line-clamp-3\">{description}</p>\n ) : null}\n\n <div className=\"rounded-xl bg-muted/50 dark:bg-muted/30 p-4 space-y-3\">\n <div>\n <p className=\"text-2xs uppercase tracking-wide text-muted-foreground\">Market cap</p>\n <p className=\"text-2xl\">\n {marketCap != null ? (\n <StatValue>\n <CurrencyIcon symbol={quoteSymbol} size={18} />\n {marketCap.toLocaleString()} {quoteSymbol}\n </StatValue>\n ) : (\n <span className=\"text-muted-foreground\">—</span>\n )}\n </p>\n </div>\n <div className=\"flex items-center justify-between text-sm border-t border-border/60 pt-3\">\n <span className=\"text-muted-foreground\">Launch price</span>\n <span className=\"inline-flex items-center gap-1 font-semibold tabular-nums\">\n <CurrencyIcon symbol={quoteSymbol} size={14} />\n {price} {quoteSymbol} / coin\n </span>\n </div>\n </div>\n\n <div className=\"space-y-1.5\">\n <div className=\"flex items-center justify-between text-sm\">\n <span className=\"font-medium text-brand-orange\">\n You keep {teamPct}%{yourCoins != null ? ` · ${yourCoins.toLocaleString()} ${symbol || \"coins\"}` : \"\"}\n </span>\n <span className=\"text-muted-foreground\">Community {100 - teamPct}%</span>\n </div>\n <div className=\"flex h-2.5 rounded-full overflow-hidden bg-muted-foreground/15\">\n {teamPct > 0 && <div style={{ width: `${teamPct}%`, background: COIN_GRADIENT }} />}\n <div className=\"flex-1\" />\n </div>\n </div>\n\n <p className=\"text-2xs text-muted-foreground/70\">\n Liquidity locks permanently at launch.\n </p>\n </div>\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAwBI;AAtBJ,mBAAkB;AAClB,0BAA2B;AAC3B,gBAAmB;AACnB,2BAA6B;AAe7B,MAAM,gBAAgB;AAEtB,SAAS,UAAU,EAAE,SAAS,GAAkC;AAC9D,SACE,4CAAC,UAAK,WAAU,0EACb,UACH;AAEJ;AAEO,SAAS,kBAAkB,EAAE,MAAM,UAAU,GAAkD;AACpG,QAAM,EAAE,MAAM,QAAQ,aAAa,UAAU,aAAa,OAAO,aAAa,QAAQ,IAAI;AAC1F,QAAM,YAAY,eAAe,OAAO,cAAc,QAAQ;AAC9D,QAAM,YAAY,eAAe,OAAO,eAAe,UAAU,OAAO;AAExE,SACE,6CAAC,SAAI,eAAW,cAAG,wDAAwD,SAAS,GAClF;AAAA,gDAAC,SAAI,WAAU,aACb,sDAAC,OAAE,WAAU,iBAAgB,0BAAY,GAC3C;AAAA,IAEA,6CAAC,SAAI,WAAU,iBAEb;AAAA,mDAAC,SAAI,WAAU,2BACb;AAAA,oDAAC,SAAI,WAAU,iCAAgC,OAAO,EAAE,YAAY,cAAc,GAChF,sDAAC,SAAI,WAAU,4FACZ,qBACC,4CAAC,aAAAA,SAAA,EAAM,KAAK,UAAU,KAAI,IAAG,MAAI,MAAC,OAAM,QAAO,WAAU,gBAAe,aAAW,MAAC,IAEpF,4CAAC,kCAAW,WAAU,gCAA+B,GAEzD,GACF;AAAA,QACA,6CAAC,SAAI,WAAU,kBACb;AAAA,sDAAC,OAAE,eAAW,cAAG,2CAA2C,CAAC,QAAQ,0BAA0B,GAC5F,kBAAQ,aACX;AAAA,UACA,4CAAC,OAAE,WAAU,8CAA8C,mBAAS,IAAI,MAAM,KAAK,WAAU;AAAA,WAC/F;AAAA,SACF;AAAA,MAEC,cACC,4CAAC,OAAE,WAAU,8DAA8D,uBAAY,IACrF;AAAA,MAEJ,6CAAC,SAAI,WAAU,yDACb;AAAA,qDAAC,SACC;AAAA,sDAAC,OAAE,WAAU,0DAAyD,wBAAU;AAAA,UAChF,4CAAC,OAAE,WAAU,YACV,uBAAa,OACZ,6CAAC,aACC;AAAA,wDAAC,qCAAa,QAAQ,aAAa,MAAM,IAAI;AAAA,YAC5C,UAAU,eAAe;AAAA,YAAE;AAAA,YAAE;AAAA,aAChC,IAEA,4CAAC,UAAK,WAAU,yBAAwB,oBAAC,GAE7C;AAAA,WACF;AAAA,QACA,6CAAC,SAAI,WAAU,4EACb;AAAA,sDAAC,UAAK,WAAU,yBAAwB,0BAAY;AAAA,UACpD,6CAAC,UAAK,WAAU,6DACd;AAAA,wDAAC,qCAAa,QAAQ,aAAa,MAAM,IAAI;AAAA,YAC5C;AAAA,YAAM;AAAA,YAAE;AAAA,YAAY;AAAA,aACvB;AAAA,WACF;AAAA,SACF;AAAA,MAEA,6CAAC,SAAI,WAAU,eACb;AAAA,qDAAC,SAAI,WAAU,6CACb;AAAA,uDAAC,UAAK,WAAU,iCAAgC;AAAA;AAAA,YACpC;AAAA,YAAQ;AAAA,YAAE,aAAa,OAAO,SAAM,UAAU,eAAe,CAAC,IAAI,UAAU,OAAO,KAAK;AAAA,aACpG;AAAA,UACA,6CAAC,UAAK,WAAU,yBAAwB;AAAA;AAAA,YAAW,MAAM;AAAA,YAAQ;AAAA,aAAC;AAAA,WACpE;AAAA,QACA,6CAAC,SAAI,WAAU,kEACZ;AAAA,oBAAU,KAAK,4CAAC,SAAI,OAAO,EAAE,OAAO,GAAG,OAAO,KAAK,YAAY,cAAc,GAAG;AAAA,UACjF,4CAAC,SAAI,WAAU,UAAS;AAAA,WAC1B;AAAA,SACF;AAAA,MAEA,4CAAC,OAAE,WAAU,qCAAoC,oDAEjD;AAAA,OACF;AAAA,KACF;AAEJ;","names":["Image"]}
|
|
@@ -3,60 +3,67 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import Image from "./image.js";
|
|
4
4
|
import { TrendingUp } from "lucide-react";
|
|
5
5
|
import { cn } from "../utils/cn.js";
|
|
6
|
-
|
|
7
|
-
const COIN_GRADIENT = "linear-gradient(135deg, #
|
|
6
|
+
import { CurrencyIcon } from "./currency-icon.js";
|
|
7
|
+
const COIN_GRADIENT = "linear-gradient(135deg, #d5520b, #e175b0)";
|
|
8
|
+
function StatValue({ children }) {
|
|
9
|
+
return /* @__PURE__ */ jsx("span", { className: "inline-flex items-center gap-1 font-bold tabular-nums text-brand-maeve", children });
|
|
10
|
+
}
|
|
8
11
|
function CoinLaunchPreview({ data, className }) {
|
|
9
|
-
const { name, symbol, description, imageUrl, supplyHuman, quoteSymbol, teamPct } = data;
|
|
10
|
-
const marketCap = supplyHuman != null ? supplyHuman *
|
|
12
|
+
const { name, symbol, description, imageUrl, supplyHuman, price, quoteSymbol, teamPct } = data;
|
|
13
|
+
const marketCap = supplyHuman != null ? supplyHuman * price : null;
|
|
11
14
|
const yourCoins = supplyHuman != null ? supplyHuman * (teamPct / 100) : null;
|
|
12
15
|
return /* @__PURE__ */ jsxs("div", { className: cn("rounded-2xl bg-muted/50 dark:bg-card overflow-hidden", className), children: [
|
|
13
16
|
/* @__PURE__ */ jsx("div", { className: "px-5 pt-4", children: /* @__PURE__ */ jsx("p", { className: "section-label", children: "Live preview" }) }),
|
|
14
17
|
/* @__PURE__ */ jsxs("div", { className: "p-5 space-y-4", children: [
|
|
15
18
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
|
|
16
|
-
/* @__PURE__ */ jsx("div", { className: "shrink-0 rounded-full p-[2px]", style: { background: COIN_GRADIENT }, children: /* @__PURE__ */ jsx("div", { className: "relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center", children: imageUrl ? /* @__PURE__ */ jsx(Image, { src: imageUrl, alt: "", fill: true, sizes: "56px", className: "object-cover", unoptimized: true }) : /* @__PURE__ */ jsx(TrendingUp, { className: "h-6 w-6 text-brand-
|
|
19
|
+
/* @__PURE__ */ jsx("div", { className: "shrink-0 rounded-full p-[2px]", style: { background: COIN_GRADIENT }, children: /* @__PURE__ */ jsx("div", { className: "relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center", children: imageUrl ? /* @__PURE__ */ jsx(Image, { src: imageUrl, alt: "", fill: true, sizes: "56px", className: "object-cover", unoptimized: true }) : /* @__PURE__ */ jsx(TrendingUp, { className: "h-6 w-6 text-brand-orange/70" }) }) }),
|
|
17
20
|
/* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
|
|
18
21
|
/* @__PURE__ */ jsx("p", { className: cn("font-bold text-lg leading-snug truncate", !name && "text-muted-foreground/50"), children: name || "Your coin" }),
|
|
19
22
|
/* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground tabular-nums", children: symbol ? `$${symbol}` : "$SYMBOL" })
|
|
20
23
|
] })
|
|
21
24
|
] }),
|
|
22
25
|
description ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground leading-relaxed line-clamp-3", children: description }) : null,
|
|
23
|
-
/* @__PURE__ */ jsxs("div", { className: "
|
|
26
|
+
/* @__PURE__ */ jsxs("div", { className: "rounded-xl bg-muted/50 dark:bg-muted/30 p-4 space-y-3", children: [
|
|
24
27
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
25
|
-
/* @__PURE__ */ jsx("p", { className: "text-2xs uppercase tracking-wide text-muted-foreground", children: "
|
|
26
|
-
/* @__PURE__ */
|
|
27
|
-
|
|
28
|
+
/* @__PURE__ */ jsx("p", { className: "text-2xs uppercase tracking-wide text-muted-foreground", children: "Market cap" }),
|
|
29
|
+
/* @__PURE__ */ jsx("p", { className: "text-2xl", children: marketCap != null ? /* @__PURE__ */ jsxs(StatValue, { children: [
|
|
30
|
+
/* @__PURE__ */ jsx(CurrencyIcon, { symbol: quoteSymbol, size: 18 }),
|
|
31
|
+
marketCap.toLocaleString(),
|
|
28
32
|
" ",
|
|
29
33
|
quoteSymbol
|
|
30
|
-
] })
|
|
34
|
+
] }) : /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" }) })
|
|
31
35
|
] }),
|
|
32
|
-
/* @__PURE__ */ jsxs("div", { children: [
|
|
33
|
-
/* @__PURE__ */ jsx("
|
|
34
|
-
/* @__PURE__ */
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-sm border-t border-border/60 pt-3", children: [
|
|
37
|
+
/* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Launch price" }),
|
|
38
|
+
/* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-1 font-semibold tabular-nums", children: [
|
|
39
|
+
/* @__PURE__ */ jsx(CurrencyIcon, { symbol: quoteSymbol, size: 14 }),
|
|
40
|
+
price,
|
|
41
|
+
" ",
|
|
42
|
+
quoteSymbol,
|
|
43
|
+
" / coin"
|
|
44
|
+
] })
|
|
39
45
|
] })
|
|
40
46
|
] }),
|
|
41
47
|
/* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
|
|
42
|
-
/* @__PURE__ */ jsxs("div", { className: "flex
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
] }),
|
|
46
|
-
/* @__PURE__ */ jsxs("div", { className: "flex justify-between text-2xs text-muted-foreground", children: [
|
|
47
|
-
/* @__PURE__ */ jsxs("span", { className: "font-medium text-brand-rose", children: [
|
|
48
|
-
"You ",
|
|
48
|
+
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-sm", children: [
|
|
49
|
+
/* @__PURE__ */ jsxs("span", { className: "font-medium text-brand-orange", children: [
|
|
50
|
+
"You keep ",
|
|
49
51
|
teamPct,
|
|
50
|
-
"%"
|
|
52
|
+
"%",
|
|
53
|
+
yourCoins != null ? ` \xB7 ${yourCoins.toLocaleString()} ${symbol || "coins"}` : ""
|
|
51
54
|
] }),
|
|
52
|
-
/* @__PURE__ */ jsxs("span", { children: [
|
|
55
|
+
/* @__PURE__ */ jsxs("span", { className: "text-muted-foreground", children: [
|
|
53
56
|
"Community ",
|
|
54
57
|
100 - teamPct,
|
|
55
58
|
"%"
|
|
56
59
|
] })
|
|
60
|
+
] }),
|
|
61
|
+
/* @__PURE__ */ jsxs("div", { className: "flex h-2.5 rounded-full overflow-hidden bg-muted-foreground/15", children: [
|
|
62
|
+
teamPct > 0 && /* @__PURE__ */ jsx("div", { style: { width: `${teamPct}%`, background: COIN_GRADIENT } }),
|
|
63
|
+
/* @__PURE__ */ jsx("div", { className: "flex-1" })
|
|
57
64
|
] })
|
|
58
65
|
] }),
|
|
59
|
-
/* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground/70", children: "Liquidity
|
|
66
|
+
/* @__PURE__ */ jsx("p", { className: "text-2xs text-muted-foreground/70", children: "Liquidity locks permanently at launch." })
|
|
60
67
|
] })
|
|
61
68
|
] });
|
|
62
69
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/coin-launch-preview.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { TrendingUp } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\n\nexport interface CoinPreviewData {\n name: string;\n symbol: string;\n description: string;\n\n imageUrl: string | null;\n\n supplyHuman: number | null;\n quoteSymbol: string;\n teamPct: number;\n}\n\nconst
|
|
1
|
+
{"version":3,"sources":["../../src/components/coin-launch-preview.tsx"],"sourcesContent":["\"use client\";\n\nimport Image from \"./image.js\";\nimport { TrendingUp } from \"lucide-react\";\nimport { cn } from \"../utils/cn.js\";\nimport { CurrencyIcon } from \"./currency-icon.js\";\n\nexport interface CoinPreviewData {\n name: string;\n symbol: string;\n description: string;\n\n imageUrl: string | null;\n\n supplyHuman: number | null;\n price: number;\n quoteSymbol: string;\n teamPct: number;\n}\n\nconst COIN_GRADIENT = \"linear-gradient(135deg, #d5520b, #e175b0)\";\n\nfunction StatValue({ children }: { children: React.ReactNode }) {\n return (\n <span className=\"inline-flex items-center gap-1 font-bold tabular-nums text-brand-maeve\">\n {children}\n </span>\n );\n}\n\nexport function CoinLaunchPreview({ data, className }: { data: CoinPreviewData; className?: string }) {\n const { name, symbol, description, imageUrl, supplyHuman, price, quoteSymbol, teamPct } = data;\n const marketCap = supplyHuman != null ? supplyHuman * price : null;\n const yourCoins = supplyHuman != null ? supplyHuman * (teamPct / 100) : null;\n\n return (\n <div className={cn(\"rounded-2xl bg-muted/50 dark:bg-card overflow-hidden\", className)}>\n <div className=\"px-5 pt-4\">\n <p className=\"section-label\">Live preview</p>\n </div>\n\n <div className=\"p-5 space-y-4\">\n\n <div className=\"flex items-center gap-3\">\n <div className=\"shrink-0 rounded-full p-[2px]\" style={{ background: COIN_GRADIENT }}>\n <div className=\"relative h-14 w-14 rounded-full overflow-hidden bg-card flex items-center justify-center\">\n {imageUrl ? (\n <Image src={imageUrl} alt=\"\" fill sizes=\"56px\" className=\"object-cover\" unoptimized />\n ) : (\n <TrendingUp className=\"h-6 w-6 text-brand-orange/70\" />\n )}\n </div>\n </div>\n <div className=\"min-w-0 flex-1\">\n <p className={cn(\"font-bold text-lg leading-snug truncate\", !name && \"text-muted-foreground/50\")}>\n {name || \"Your coin\"}\n </p>\n <p className=\"text-sm text-muted-foreground tabular-nums\">{symbol ? `$${symbol}` : \"$SYMBOL\"}</p>\n </div>\n </div>\n\n {description ? (\n <p className=\"text-sm text-muted-foreground leading-relaxed line-clamp-3\">{description}</p>\n ) : null}\n\n <div className=\"rounded-xl bg-muted/50 dark:bg-muted/30 p-4 space-y-3\">\n <div>\n <p className=\"text-2xs uppercase tracking-wide text-muted-foreground\">Market cap</p>\n <p className=\"text-2xl\">\n {marketCap != null ? (\n <StatValue>\n <CurrencyIcon symbol={quoteSymbol} size={18} />\n {marketCap.toLocaleString()} {quoteSymbol}\n </StatValue>\n ) : (\n <span className=\"text-muted-foreground\">—</span>\n )}\n </p>\n </div>\n <div className=\"flex items-center justify-between text-sm border-t border-border/60 pt-3\">\n <span className=\"text-muted-foreground\">Launch price</span>\n <span className=\"inline-flex items-center gap-1 font-semibold tabular-nums\">\n <CurrencyIcon symbol={quoteSymbol} size={14} />\n {price} {quoteSymbol} / coin\n </span>\n </div>\n </div>\n\n <div className=\"space-y-1.5\">\n <div className=\"flex items-center justify-between text-sm\">\n <span className=\"font-medium text-brand-orange\">\n You keep {teamPct}%{yourCoins != null ? ` · ${yourCoins.toLocaleString()} ${symbol || \"coins\"}` : \"\"}\n </span>\n <span className=\"text-muted-foreground\">Community {100 - teamPct}%</span>\n </div>\n <div className=\"flex h-2.5 rounded-full overflow-hidden bg-muted-foreground/15\">\n {teamPct > 0 && <div style={{ width: `${teamPct}%`, background: COIN_GRADIENT }} />}\n <div className=\"flex-1\" />\n </div>\n </div>\n\n <p className=\"text-2xs text-muted-foreground/70\">\n Liquidity locks permanently at launch.\n </p>\n </div>\n </div>\n );\n}\n"],"mappings":";AAwBI,cA6BM,YA7BN;AAtBJ,OAAO,WAAW;AAClB,SAAS,kBAAkB;AAC3B,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAe7B,MAAM,gBAAgB;AAEtB,SAAS,UAAU,EAAE,SAAS,GAAkC;AAC9D,SACE,oBAAC,UAAK,WAAU,0EACb,UACH;AAEJ;AAEO,SAAS,kBAAkB,EAAE,MAAM,UAAU,GAAkD;AACpG,QAAM,EAAE,MAAM,QAAQ,aAAa,UAAU,aAAa,OAAO,aAAa,QAAQ,IAAI;AAC1F,QAAM,YAAY,eAAe,OAAO,cAAc,QAAQ;AAC9D,QAAM,YAAY,eAAe,OAAO,eAAe,UAAU,OAAO;AAExE,SACE,qBAAC,SAAI,WAAW,GAAG,wDAAwD,SAAS,GAClF;AAAA,wBAAC,SAAI,WAAU,aACb,8BAAC,OAAE,WAAU,iBAAgB,0BAAY,GAC3C;AAAA,IAEA,qBAAC,SAAI,WAAU,iBAEb;AAAA,2BAAC,SAAI,WAAU,2BACb;AAAA,4BAAC,SAAI,WAAU,iCAAgC,OAAO,EAAE,YAAY,cAAc,GAChF,8BAAC,SAAI,WAAU,4FACZ,qBACC,oBAAC,SAAM,KAAK,UAAU,KAAI,IAAG,MAAI,MAAC,OAAM,QAAO,WAAU,gBAAe,aAAW,MAAC,IAEpF,oBAAC,cAAW,WAAU,gCAA+B,GAEzD,GACF;AAAA,QACA,qBAAC,SAAI,WAAU,kBACb;AAAA,8BAAC,OAAE,WAAW,GAAG,2CAA2C,CAAC,QAAQ,0BAA0B,GAC5F,kBAAQ,aACX;AAAA,UACA,oBAAC,OAAE,WAAU,8CAA8C,mBAAS,IAAI,MAAM,KAAK,WAAU;AAAA,WAC/F;AAAA,SACF;AAAA,MAEC,cACC,oBAAC,OAAE,WAAU,8DAA8D,uBAAY,IACrF;AAAA,MAEJ,qBAAC,SAAI,WAAU,yDACb;AAAA,6BAAC,SACC;AAAA,8BAAC,OAAE,WAAU,0DAAyD,wBAAU;AAAA,UAChF,oBAAC,OAAE,WAAU,YACV,uBAAa,OACZ,qBAAC,aACC;AAAA,gCAAC,gBAAa,QAAQ,aAAa,MAAM,IAAI;AAAA,YAC5C,UAAU,eAAe;AAAA,YAAE;AAAA,YAAE;AAAA,aAChC,IAEA,oBAAC,UAAK,WAAU,yBAAwB,oBAAC,GAE7C;AAAA,WACF;AAAA,QACA,qBAAC,SAAI,WAAU,4EACb;AAAA,8BAAC,UAAK,WAAU,yBAAwB,0BAAY;AAAA,UACpD,qBAAC,UAAK,WAAU,6DACd;AAAA,gCAAC,gBAAa,QAAQ,aAAa,MAAM,IAAI;AAAA,YAC5C;AAAA,YAAM;AAAA,YAAE;AAAA,YAAY;AAAA,aACvB;AAAA,WACF;AAAA,SACF;AAAA,MAEA,qBAAC,SAAI,WAAU,eACb;AAAA,6BAAC,SAAI,WAAU,6CACb;AAAA,+BAAC,UAAK,WAAU,iCAAgC;AAAA;AAAA,YACpC;AAAA,YAAQ;AAAA,YAAE,aAAa,OAAO,SAAM,UAAU,eAAe,CAAC,IAAI,UAAU,OAAO,KAAK;AAAA,aACpG;AAAA,UACA,qBAAC,UAAK,WAAU,yBAAwB;AAAA;AAAA,YAAW,MAAM;AAAA,YAAQ;AAAA,aAAC;AAAA,WACpE;AAAA,QACA,qBAAC,SAAI,WAAU,kEACZ;AAAA,oBAAU,KAAK,oBAAC,SAAI,OAAO,EAAE,OAAO,GAAG,OAAO,KAAK,YAAY,cAAc,GAAG;AAAA,UACjF,oBAAC,SAAI,WAAU,UAAS;AAAA,WAC1B;AAAA,SACF;AAAA,MAEA,oBAAC,OAAE,WAAU,qCAAoC,oDAEjD;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
|