@fanvue/ui 2.2.0 → 2.4.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/cjs/components/EmptyState/EmptyState.cjs +84 -0
- package/dist/cjs/components/EmptyState/EmptyState.cjs.map +1 -0
- package/dist/cjs/components/Icons/FacebookIcon.cjs +48 -0
- package/dist/cjs/components/Icons/FacebookIcon.cjs.map +1 -0
- package/dist/cjs/components/Icons/GoogleIcon.cjs +71 -0
- package/dist/cjs/components/Icons/GoogleIcon.cjs.map +1 -0
- package/dist/cjs/components/Icons/TwitterIcon.cjs +48 -0
- package/dist/cjs/components/Icons/TwitterIcon.cjs.map +1 -0
- package/dist/cjs/components/Logo/Logo.cjs +9 -50
- package/dist/cjs/components/Logo/Logo.cjs.map +1 -1
- package/dist/cjs/index.cjs +8 -0
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/components/EmptyState/EmptyState.mjs +67 -0
- package/dist/components/EmptyState/EmptyState.mjs.map +1 -0
- package/dist/components/Icons/FacebookIcon.mjs +31 -0
- package/dist/components/Icons/FacebookIcon.mjs.map +1 -0
- package/dist/components/Icons/GoogleIcon.mjs +54 -0
- package/dist/components/Icons/GoogleIcon.mjs.map +1 -0
- package/dist/components/Icons/TwitterIcon.mjs +31 -0
- package/dist/components/Icons/TwitterIcon.mjs.map +1 -0
- package/dist/components/Logo/Logo.mjs +9 -50
- package/dist/components/Logo/Logo.mjs.map +1 -1
- package/dist/index.d.ts +34 -0
- package/dist/index.mjs +8 -0
- package/dist/index.mjs.map +1 -1
- package/package.json +4 -2
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const cn = require("../../utils/cn.cjs");
|
|
7
|
+
function _interopNamespaceDefault(e) {
|
|
8
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
9
|
+
if (e) {
|
|
10
|
+
for (const k in e) {
|
|
11
|
+
if (k !== "default") {
|
|
12
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
13
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: () => e[k]
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
n.default = e;
|
|
21
|
+
return Object.freeze(n);
|
|
22
|
+
}
|
|
23
|
+
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
24
|
+
const EmptyState = React__namespace.forwardRef(
|
|
25
|
+
({
|
|
26
|
+
className,
|
|
27
|
+
variant = "default",
|
|
28
|
+
title,
|
|
29
|
+
description,
|
|
30
|
+
media,
|
|
31
|
+
primaryAction,
|
|
32
|
+
secondaryAction,
|
|
33
|
+
...props
|
|
34
|
+
}, ref) => {
|
|
35
|
+
const isCentered = variant === "centered";
|
|
36
|
+
const titleId = React__namespace.useId();
|
|
37
|
+
const regionLabelledBy = title !== void 0 && title !== null && title !== false ? titleId : void 0;
|
|
38
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
39
|
+
"section",
|
|
40
|
+
{
|
|
41
|
+
ref,
|
|
42
|
+
"aria-labelledby": regionLabelledBy,
|
|
43
|
+
"data-testid": "empty-state",
|
|
44
|
+
className: cn.cn(
|
|
45
|
+
"flex w-full max-w-[375px] flex-col gap-6",
|
|
46
|
+
isCentered ? "items-center text-center" : "items-start text-left",
|
|
47
|
+
className
|
|
48
|
+
),
|
|
49
|
+
...props,
|
|
50
|
+
children: [
|
|
51
|
+
media !== void 0 && media !== null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-[280px] w-full overflow-hidden rounded-md", children: media }),
|
|
52
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
53
|
+
"div",
|
|
54
|
+
{
|
|
55
|
+
className: cn.cn("flex w-full flex-col gap-6", isCentered ? "items-center" : "items-start"),
|
|
56
|
+
children: [
|
|
57
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
58
|
+
"div",
|
|
59
|
+
{
|
|
60
|
+
className: cn.cn(
|
|
61
|
+
"flex w-full flex-col gap-4",
|
|
62
|
+
isCentered ? "items-center" : "items-start"
|
|
63
|
+
),
|
|
64
|
+
children: [
|
|
65
|
+
title !== void 0 && title !== null && title !== false && /* @__PURE__ */ jsxRuntime.jsx("div", { id: titleId, className: "typography-bold-heading-lg text-content-primary", children: title }),
|
|
66
|
+
description !== void 0 && description !== null && description !== false && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "typography-regular-body-lg text-content-secondary", children: description })
|
|
67
|
+
]
|
|
68
|
+
}
|
|
69
|
+
),
|
|
70
|
+
primaryAction !== void 0 && primaryAction !== null || secondaryAction !== void 0 && secondaryAction !== null ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn.cn("flex flex-col gap-4", isCentered ? "items-center" : "items-start"), children: [
|
|
71
|
+
primaryAction,
|
|
72
|
+
secondaryAction
|
|
73
|
+
] }) : null
|
|
74
|
+
]
|
|
75
|
+
}
|
|
76
|
+
)
|
|
77
|
+
]
|
|
78
|
+
}
|
|
79
|
+
);
|
|
80
|
+
}
|
|
81
|
+
);
|
|
82
|
+
EmptyState.displayName = "EmptyState";
|
|
83
|
+
exports.EmptyState = EmptyState;
|
|
84
|
+
//# sourceMappingURL=EmptyState.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyState.cjs","sources":["../../../../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nexport type EmptyStateVariant = \"default\" | \"centered\";\n\nexport interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLElement>, \"title\"> {\n /**\n * Matches Figma property `Property 1` (`Default` / `centered`).\n * @default \"default\"\n */\n variant?: EmptyStateVariant;\n /** Main heading. */\n title?: React.ReactNode;\n /** Supporting body copy. */\n description?: React.ReactNode;\n /** Top visual/illustration slot. */\n media?: React.ReactNode;\n /** Primary call-to-action node. */\n primaryAction?: React.ReactNode;\n /** Optional secondary action rendered below primary. */\n secondaryAction?: React.ReactNode;\n}\n\nexport const EmptyState = React.forwardRef<HTMLElement, EmptyStateProps>(\n (\n {\n className,\n variant = \"default\",\n title,\n description,\n media,\n primaryAction,\n secondaryAction,\n ...props\n },\n ref,\n ) => {\n const isCentered = variant === \"centered\";\n const titleId = React.useId();\n const regionLabelledBy =\n title !== undefined && title !== null && title !== false ? titleId : undefined;\n\n return (\n <section\n ref={ref}\n aria-labelledby={regionLabelledBy}\n data-testid=\"empty-state\"\n className={cn(\n \"flex w-full max-w-[375px] flex-col gap-6\",\n isCentered ? \"items-center text-center\" : \"items-start text-left\",\n className,\n )}\n {...props}\n >\n {media !== undefined && media !== null && (\n <div className=\"h-[280px] w-full overflow-hidden rounded-md\">{media}</div>\n )}\n\n <div\n className={cn(\"flex w-full flex-col gap-6\", isCentered ? \"items-center\" : \"items-start\")}\n >\n <div\n className={cn(\n \"flex w-full flex-col gap-4\",\n isCentered ? \"items-center\" : \"items-start\",\n )}\n >\n {title !== undefined && title !== null && title !== false && (\n <div id={titleId} className=\"typography-bold-heading-lg text-content-primary\">\n {title}\n </div>\n )}\n {description !== undefined && description !== null && description !== false && (\n <p className=\"typography-regular-body-lg text-content-secondary\">{description}</p>\n )}\n </div>\n\n {(primaryAction !== undefined && primaryAction !== null) ||\n (secondaryAction !== undefined && secondaryAction !== null) ? (\n <div className={cn(\"flex flex-col gap-4\", isCentered ? \"items-center\" : \"items-start\")}>\n {primaryAction}\n {secondaryAction}\n </div>\n ) : null}\n </div>\n </section>\n );\n },\n);\n\nEmptyState.displayName = \"EmptyState\";\n"],"names":["React","jsxs","cn","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,aAAaA,iBAAM;AAAA,EAC9B,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,aAAa,YAAY;AAC/B,UAAM,UAAUA,iBAAM,MAAA;AACtB,UAAM,mBACJ,UAAU,UAAa,UAAU,QAAQ,UAAU,QAAQ,UAAU;AAEvE,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,mBAAiB;AAAA,QACjB,eAAY;AAAA,QACZ,WAAWC,GAAAA;AAAAA,UACT;AAAA,UACA,aAAa,6BAA6B;AAAA,UAC1C;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,UAAU,UAAa,UAAU,uCAC/B,OAAA,EAAI,WAAU,+CAA+C,UAAA,MAAA,CAAM;AAAA,UAGtED,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWC,GAAAA,GAAG,8BAA8B,aAAa,iBAAiB,aAAa;AAAA,cAEvF,UAAA;AAAA,gBAAAD,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWC,GAAAA;AAAAA,sBACT;AAAA,sBACA,aAAa,iBAAiB;AAAA,oBAAA;AAAA,oBAG/B,UAAA;AAAA,sBAAA,UAAU,UAAa,UAAU,QAAQ,UAAU,SAClDC,2BAAAA,IAAC,OAAA,EAAI,IAAI,SAAS,WAAU,mDACzB,UAAA,OACH;AAAA,sBAED,gBAAgB,UAAa,gBAAgB,QAAQ,gBAAgB,SACpEA,+BAAC,KAAA,EAAE,WAAU,qDAAqD,UAAA,YAAA,CAAY;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAIhF,kBAAkB,UAAa,kBAAkB,QAClD,oBAAoB,UAAa,oBAAoB,OACpDF,2BAAAA,KAAC,OAAA,EAAI,WAAWC,GAAAA,GAAG,uBAAuB,aAAa,iBAAiB,aAAa,GAClF,UAAA;AAAA,kBAAA;AAAA,kBACA;AAAA,gBAAA,EAAA,CACH,IACE;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,WAAW,cAAc;;"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const cn = require("../../utils/cn.cjs");
|
|
7
|
+
function _interopNamespaceDefault(e) {
|
|
8
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
9
|
+
if (e) {
|
|
10
|
+
for (const k in e) {
|
|
11
|
+
if (k !== "default") {
|
|
12
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
13
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: () => e[k]
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
n.default = e;
|
|
21
|
+
return Object.freeze(n);
|
|
22
|
+
}
|
|
23
|
+
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
24
|
+
const FacebookIcon = React__namespace.forwardRef(
|
|
25
|
+
({ className, ...props }, ref) => {
|
|
26
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
27
|
+
"svg",
|
|
28
|
+
{
|
|
29
|
+
ref,
|
|
30
|
+
viewBox: "0 0 14 14",
|
|
31
|
+
fill: "none",
|
|
32
|
+
"aria-hidden": "true",
|
|
33
|
+
className: cn.cn("size-6", className),
|
|
34
|
+
...props,
|
|
35
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
36
|
+
"path",
|
|
37
|
+
{
|
|
38
|
+
fill: "currentColor",
|
|
39
|
+
d: "M5.30892 13.8448V9.17272H3.86575V7.02576H5.30892V6.1007C5.30892 3.70902 6.38692 2.6007 8.72608 2.6007C8.96 2.6007 9.28317 2.62529 9.58242 2.66101C9.80656 2.68416 10.0289 2.7223 10.248 2.77518V4.7219C10.1213 4.71004 9.99428 4.70301 9.86708 4.70082C9.72459 4.69711 9.58204 4.69535 9.4395 4.69555C9.02708 4.69555 8.70508 4.75176 8.46242 4.87646C8.29928 4.95861 8.16214 5.08471 8.06633 5.24063C7.91583 5.48653 7.84817 5.82318 7.84817 6.26639V7.02576H10.1342L9.90908 8.25703L9.74167 9.17272H7.84817V14C11.3143 13.5796 14 10.6177 14 7.02576C14 3.14578 10.8657 0 7 0C3.13425 0 0 3.14578 0 7.02576C0 10.3208 2.25983 13.0855 5.30892 13.8448Z"
|
|
40
|
+
}
|
|
41
|
+
)
|
|
42
|
+
}
|
|
43
|
+
);
|
|
44
|
+
}
|
|
45
|
+
);
|
|
46
|
+
FacebookIcon.displayName = "FacebookIcon";
|
|
47
|
+
exports.FacebookIcon = FacebookIcon;
|
|
48
|
+
//# sourceMappingURL=FacebookIcon.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FacebookIcon.cjs","sources":["../../../../src/components/Icons/FacebookIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const FacebookIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M5.30892 13.8448V9.17272H3.86575V7.02576H5.30892V6.1007C5.30892 3.70902 6.38692 2.6007 8.72608 2.6007C8.96 2.6007 9.28317 2.62529 9.58242 2.66101C9.80656 2.68416 10.0289 2.7223 10.248 2.77518V4.7219C10.1213 4.71004 9.99428 4.70301 9.86708 4.70082C9.72459 4.69711 9.58204 4.69535 9.4395 4.69555C9.02708 4.69555 8.70508 4.75176 8.46242 4.87646C8.29928 4.95861 8.16214 5.08471 8.06633 5.24063C7.91583 5.48653 7.84817 5.82318 7.84817 6.26639V7.02576H10.1342L9.90908 8.25703L9.74167 9.17272H7.84817V14C11.3143 13.5796 14 10.6177 14 7.02576C14 3.14578 10.8657 0 7 0C3.13425 0 0 3.14578 0 7.02576C0 10.3208 2.25983 13.0855 5.30892 13.8448Z\"\n />\n </svg>\n );\n },\n);\n\nFacebookIcon.displayName = \"FacebookIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,eAAeA,iBAAM;AAAA,EAChC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,aAAa,cAAc;;"}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const cn = require("../../utils/cn.cjs");
|
|
7
|
+
function _interopNamespaceDefault(e) {
|
|
8
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
9
|
+
if (e) {
|
|
10
|
+
for (const k in e) {
|
|
11
|
+
if (k !== "default") {
|
|
12
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
13
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: () => e[k]
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
n.default = e;
|
|
21
|
+
return Object.freeze(n);
|
|
22
|
+
}
|
|
23
|
+
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
24
|
+
const GoogleIcon = React__namespace.forwardRef(
|
|
25
|
+
({ className, ...props }, ref) => {
|
|
26
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
27
|
+
"svg",
|
|
28
|
+
{
|
|
29
|
+
ref,
|
|
30
|
+
viewBox: "0 0 14 14",
|
|
31
|
+
fill: "none",
|
|
32
|
+
"aria-hidden": "true",
|
|
33
|
+
className: cn.cn("size-6", className),
|
|
34
|
+
...props,
|
|
35
|
+
children: [
|
|
36
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
37
|
+
"path",
|
|
38
|
+
{
|
|
39
|
+
fill: "currentColor",
|
|
40
|
+
d: "M13.9998 7.1514C13.9998 6.67404 13.946 6.19668 13.8922 5.71932H7.1355V8.42834H10.9654C10.803 9.27726 10.3174 10.073 9.56208 10.5504V12.3096H11.8811C13.2295 11.1036 13.9998 9.29864 13.9998 7.1514Z"
|
|
41
|
+
}
|
|
42
|
+
),
|
|
43
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
44
|
+
"path",
|
|
45
|
+
{
|
|
46
|
+
fill: "currentColor",
|
|
47
|
+
d: "M7.13543 14.0001C9.07918 14.0001 10.6985 13.3637 11.8811 12.3095L9.56201 10.5503C8.91402 10.9745 8.10405 11.2399 7.13543 11.2399C5.30037 11.2399 3.6811 10.0194 3.14181 8.32117H0.769226V10.1272C1.97847 12.5186 4.40679 14.0001 7.13543 14.0001Z"
|
|
48
|
+
}
|
|
49
|
+
),
|
|
50
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
51
|
+
"path",
|
|
52
|
+
{
|
|
53
|
+
fill: "currentColor",
|
|
54
|
+
d: "M3.14189 8.32119C2.81917 7.47226 2.81917 6.51704 3.14189 5.61497V3.80896H0.769305C-0.256002 5.77374 -0.256002 8.10928 0.769305 10.1272L3.14189 8.32119Z"
|
|
55
|
+
}
|
|
56
|
+
),
|
|
57
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
58
|
+
"path",
|
|
59
|
+
{
|
|
60
|
+
fill: "currentColor",
|
|
61
|
+
d: "M7.13548 2.76042C8.1579 2.76042 9.12652 3.13291 9.88188 3.82475L11.9349 1.80997C10.6447 0.640284 8.91407 -0.0492764 7.18927 0.00386894C4.46063 0.00386894 1.97852 1.48536 0.822762 3.87678L3.19535 5.68279C3.68085 3.98459 5.30012 2.76042 7.13548 2.76042Z"
|
|
62
|
+
}
|
|
63
|
+
)
|
|
64
|
+
]
|
|
65
|
+
}
|
|
66
|
+
);
|
|
67
|
+
}
|
|
68
|
+
);
|
|
69
|
+
GoogleIcon.displayName = "GoogleIcon";
|
|
70
|
+
exports.GoogleIcon = GoogleIcon;
|
|
71
|
+
//# sourceMappingURL=GoogleIcon.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GoogleIcon.cjs","sources":["../../../../src/components/Icons/GoogleIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const GoogleIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M13.9998 7.1514C13.9998 6.67404 13.946 6.19668 13.8922 5.71932H7.1355V8.42834H10.9654C10.803 9.27726 10.3174 10.073 9.56208 10.5504V12.3096H11.8811C13.2295 11.1036 13.9998 9.29864 13.9998 7.1514Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M7.13543 14.0001C9.07918 14.0001 10.6985 13.3637 11.8811 12.3095L9.56201 10.5503C8.91402 10.9745 8.10405 11.2399 7.13543 11.2399C5.30037 11.2399 3.6811 10.0194 3.14181 8.32117H0.769226V10.1272C1.97847 12.5186 4.40679 14.0001 7.13543 14.0001Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M3.14189 8.32119C2.81917 7.47226 2.81917 6.51704 3.14189 5.61497V3.80896H0.769305C-0.256002 5.77374 -0.256002 8.10928 0.769305 10.1272L3.14189 8.32119Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M7.13548 2.76042C8.1579 2.76042 9.12652 3.13291 9.88188 3.82475L11.9349 1.80997C10.6447 0.640284 8.91407 -0.0492764 7.18927 0.00386894C4.46063 0.00386894 1.97852 1.48536 0.822762 3.87678L3.19535 5.68279C3.68085 3.98459 5.30012 2.76042 7.13548 2.76042Z\"\n />\n </svg>\n );\n },\n);\n\nGoogleIcon.displayName = \"GoogleIcon\";\n"],"names":["React","jsxs","cn","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,aAAaA,iBAAM;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAAC,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJA,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,QACJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,WAAW,cAAc;;"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
4
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
5
|
+
const React = require("react");
|
|
6
|
+
const cn = require("../../utils/cn.cjs");
|
|
7
|
+
function _interopNamespaceDefault(e) {
|
|
8
|
+
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
9
|
+
if (e) {
|
|
10
|
+
for (const k in e) {
|
|
11
|
+
if (k !== "default") {
|
|
12
|
+
const d = Object.getOwnPropertyDescriptor(e, k);
|
|
13
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: () => e[k]
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
n.default = e;
|
|
21
|
+
return Object.freeze(n);
|
|
22
|
+
}
|
|
23
|
+
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
24
|
+
const TwitterIcon = React__namespace.forwardRef(
|
|
25
|
+
({ className, ...props }, ref) => {
|
|
26
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
27
|
+
"svg",
|
|
28
|
+
{
|
|
29
|
+
ref,
|
|
30
|
+
viewBox: "0 0 14 14",
|
|
31
|
+
fill: "none",
|
|
32
|
+
"aria-hidden": "true",
|
|
33
|
+
className: cn.cn("size-6", className),
|
|
34
|
+
...props,
|
|
35
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
36
|
+
"path",
|
|
37
|
+
{
|
|
38
|
+
fill: "currentColor",
|
|
39
|
+
d: "M11.0306 0H13.1817L8.49148 5.57953L14 13.1596H9.6908L6.30348 8.55739L2.42757 13.1596H0.275308L5.28626 7.19433L0 0.000606537H4.4275L7.4962 4.20241L11.0306 0ZM10.2752 11.817H11.4665L3.78737 1.26538H2.50918L10.2752 11.817Z"
|
|
40
|
+
}
|
|
41
|
+
)
|
|
42
|
+
}
|
|
43
|
+
);
|
|
44
|
+
}
|
|
45
|
+
);
|
|
46
|
+
TwitterIcon.displayName = "TwitterIcon";
|
|
47
|
+
exports.TwitterIcon = TwitterIcon;
|
|
48
|
+
//# sourceMappingURL=TwitterIcon.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TwitterIcon.cjs","sources":["../../../../src/components/Icons/TwitterIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TwitterIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M11.0306 0H13.1817L8.49148 5.57953L14 13.1596H9.6908L6.30348 8.55739L2.42757 13.1596H0.275308L5.28626 7.19433L0 0.000606537H4.4275L7.4962 4.20241L11.0306 0ZM10.2752 11.817H11.4665L3.78737 1.26538H2.50918L10.2752 11.817Z\"\n />\n </svg>\n );\n },\n);\n\nTwitterIcon.displayName = \"TwitterIcon\";\n"],"names":["React","jsx","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIO,MAAM,cAAcA,iBAAM;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAAD,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,YAAY,cAAc;;"}
|
|
@@ -60,7 +60,7 @@ const getLogoColors = (color, variant) => {
|
|
|
60
60
|
};
|
|
61
61
|
};
|
|
62
62
|
const WordmarkSVG = ({ className }) => {
|
|
63
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
63
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
64
64
|
"svg",
|
|
65
65
|
{
|
|
66
66
|
width: "128",
|
|
@@ -71,54 +71,13 @@ const WordmarkSVG = ({ className }) => {
|
|
|
71
71
|
"aria-hidden": "true",
|
|
72
72
|
className,
|
|
73
73
|
"data-testid": "logo-wordmark",
|
|
74
|
-
children:
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
),
|
|
82
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
83
|
-
"path",
|
|
84
|
-
{
|
|
85
|
-
fillRule: "evenodd",
|
|
86
|
-
clipRule: "evenodd",
|
|
87
|
-
d: "M112.349 28.7166C114.006 29.5722 115.891 30 118.004 30C119.635 30 121.132 29.7193 122.496 29.1578C123.859 28.5963 125.022 27.754 125.985 26.631L122.616 23.262C122.028 23.9305 121.346 24.4385 120.571 24.7861C119.795 25.107 118.926 25.2674 117.964 25.2674C116.921 25.2674 116.012 25.0535 115.236 24.6257C114.488 24.1711 113.899 23.5428 113.472 22.7406C113.337 22.4624 113.225 22.166 113.135 21.8515L127.108 21.8182C127.215 21.3102 127.282 20.869 127.308 20.4947C127.362 20.0936 127.389 19.7193 127.389 19.3717C127.389 17.4733 126.961 15.7888 126.105 14.3182C125.276 12.8476 124.127 11.6979 122.656 10.869C121.185 10.0401 119.488 9.62568 117.562 9.62568C115.584 9.62568 113.806 10.0669 112.228 10.9492C110.651 11.8316 109.394 13.0481 108.458 14.5989C107.549 16.123 107.095 17.861 107.095 19.8128C107.095 21.7647 107.562 23.516 108.498 25.0668C109.434 26.6176 110.718 27.8342 112.349 28.7166ZM113.138 17.6391C113.218 17.3577 113.316 17.093 113.431 16.8449C113.833 16.0428 114.381 15.4278 115.076 15C115.798 14.5455 116.64 14.3182 117.603 14.3182C118.512 14.3182 119.274 14.5187 119.889 14.9198C120.53 15.2941 121.012 15.8556 121.333 16.6043C121.467 16.9061 121.575 17.243 121.658 17.615L113.138 17.6391Z",
|
|
88
|
-
fill: "currentColor"
|
|
89
|
-
}
|
|
90
|
-
),
|
|
91
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
92
|
-
"path",
|
|
93
|
-
{
|
|
94
|
-
d: "M90.6482 28.9171C92.0386 29.639 93.6295 30 95.421 30C97.2124 30 98.7899 29.639 100.154 28.9171C101.517 28.1684 102.587 27.1524 103.362 25.869C104.138 24.5588 104.525 23.0481 104.525 21.3369V10.0668H98.3889V21.2968C98.3889 22.3128 98.1215 23.115 97.5867 23.7032C97.052 24.2647 96.33 24.5454 95.421 24.5454C94.7792 24.5454 94.2311 24.4118 93.7766 24.1444C93.322 23.877 92.9744 23.5027 92.7338 23.0214C92.5199 22.5401 92.4129 21.9652 92.4129 21.2968V10.0668H86.2766V21.377C86.2766 23.0615 86.6643 24.5588 87.4397 25.869C88.2151 27.1524 89.2846 28.1684 90.6482 28.9171Z",
|
|
95
|
-
fill: "currentColor"
|
|
96
|
-
}
|
|
97
|
-
),
|
|
98
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
99
|
-
"path",
|
|
100
|
-
{
|
|
101
|
-
d: "M71.3524 29.5588L63.0904 10.0668H69.708L73.8792 22.1333L78.0503 10.0668H84.5476L76.2856 29.5588H71.3524Z",
|
|
102
|
-
fill: "currentColor"
|
|
103
|
-
}
|
|
104
|
-
),
|
|
105
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
106
|
-
"path",
|
|
107
|
-
{
|
|
108
|
-
d: "M55.1386 18.4492V29.5588H61.2749V17.0855C61.2749 15.7486 60.9541 14.5187 60.3124 13.3957C59.6707 12.2727 58.7883 11.377 57.6653 10.7085C56.5691 10.0134 55.299 9.66576 53.8552 9.66576C52.3578 9.66576 51.0076 9.98662 49.8044 10.6283C49.2874 10.8986 48.8195 11.2204 48.4006 11.5939V10.0668H42.2642V29.5588H48.4006V18.4492C48.4006 17.7807 48.5477 17.1925 48.8418 16.6845C49.1359 16.1497 49.537 15.7486 50.045 15.4813C50.553 15.1872 51.1413 15.0401 51.8097 15.0401C52.7723 15.0401 53.561 15.3609 54.176 16.0027C54.8177 16.6176 55.1386 17.4331 55.1386 18.4492Z",
|
|
109
|
-
fill: "currentColor"
|
|
110
|
-
}
|
|
111
|
-
),
|
|
112
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
113
|
-
"path",
|
|
114
|
-
{
|
|
115
|
-
fillRule: "evenodd",
|
|
116
|
-
clipRule: "evenodd",
|
|
117
|
-
d: "M26.5533 29.9599C24.7619 29.9599 23.1576 29.5187 21.7405 28.6363C20.3501 27.754 19.2405 26.5508 18.4116 25.0267C17.6094 23.5027 17.2084 21.7647 17.2084 19.8128C17.2084 17.8609 17.6094 16.123 18.4116 14.5989C19.2405 13.0749 20.3501 11.8716 21.7405 10.9893C23.1576 10.1069 24.7619 9.66576 26.5533 9.66576C27.8635 9.66576 29.0399 9.91977 30.0827 10.4278C30.7839 10.7608 31.3988 11.1801 31.9276 11.6855V10.0668H37.9437V29.5588H31.9276V27.9791C31.4153 28.4634 30.8137 28.8697 30.1228 29.1978C29.0533 29.7059 27.8635 29.9599 26.5533 29.9599ZM27.7966 24.4251C29.1068 24.4251 30.1629 23.9973 30.9651 23.1417C31.7672 22.2593 32.1683 21.1497 32.1683 19.8128C32.1683 18.9037 31.9811 18.1016 31.6068 17.4064C31.2592 16.7112 30.7512 16.1765 30.0827 15.8021C29.441 15.4011 28.6923 15.2005 27.8367 15.2005C26.9811 15.2005 26.2191 15.4011 25.5506 15.8021C24.9089 16.1765 24.3875 16.7112 23.9865 17.4064C23.6121 18.1016 23.425 18.9037 23.425 19.8128C23.425 20.6952 23.6121 21.4839 23.9865 22.1791C24.3608 22.8743 24.8822 23.4224 25.5506 23.8235C26.2191 24.2246 26.9677 24.4251 27.7966 24.4251Z",
|
|
118
|
-
fill: "currentColor"
|
|
119
|
-
}
|
|
120
|
-
)
|
|
121
|
-
]
|
|
74
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
75
|
+
"path",
|
|
76
|
+
{
|
|
77
|
+
d: "M89.0679 20.1823C89.0679 23.4373 90.1256 25.553 93.0961 25.553C95.9847 25.553 98.1815 23.0304 98.1815 17.7818V8.01701H102.902V29.0523H98.2629V25.3495C97.1238 27.75 95.2114 29.6218 91.9566 29.6218C86.464 29.6218 84.3888 26.0006 84.3888 21.1589V8.01701H89.0679V20.1823ZM116.586 7.44485C123.787 7.44485 126.717 12.9782 126.757 18.9592C126.757 19.1627 126.757 19.4883 126.716 19.8544H110.523C110.889 23.5569 113.249 25.8353 116.586 25.8353C118.986 25.8353 121.02 24.8995 121.752 22.8245H126.432C125.211 27.0966 121.59 29.6192 116.586 29.6192C110.279 29.6192 106.007 25.1028 106.007 18.4707C106.007 12.0829 110.483 7.44485 116.586 7.44485ZM29.0135 7.40527C35.971 7.40527 37.8834 11.5958 37.8834 16.112V24.2089C37.8834 25.7957 37.965 27.8301 38.2091 29.0508H33.408C33.3266 28.237 33.2858 27.4232 33.2858 26.5688V25.5922H33.2451C32.5534 27.301 30.7633 29.5795 26.5726 29.5796C21.8122 29.5796 19.1673 26.6501 19.1673 23.3137C19.1674 17.4955 26.2876 17.0073 29.3391 16.5191C32.0245 16.1122 33.2451 15.5831 33.2451 13.7929C33.2451 12.1248 31.6581 11.067 29.0949 11.067C26.8165 11.067 25.1484 12.3691 24.6601 14.4441H20.1846C20.7135 11.1078 23.5208 7.40535 29.0135 7.40527ZM66.6676 8.01701C68.4577 13.5504 70.2072 18.8399 71.9568 24.3326H71.9973C73.5435 19.2874 75.4559 13.5911 77.2055 8.01701H82.2099C79.606 15.0559 77.0835 22.0134 74.5202 29.0523H69.312L61.6223 8.01701H66.6676ZM18.3094 4.15021H4.92328V12.2878H17.2107V16.3973H4.92328V29.0508H0V0H18.3094V4.15021ZM52.6473 7.44485C58.099 7.44493 60.2147 11.066 60.2147 15.9077V29.0497H55.536V16.8839C55.536 13.629 54.437 11.5133 51.5078 11.5133C48.5783 11.5133 46.4216 14.036 46.4216 19.2845V29.0497H41.7024V8.01436H46.3406V11.7168C47.4392 9.31627 49.3921 7.44485 52.6473 7.44485ZM33.3265 17.0886C32.879 18.2685 31.7802 19.2856 28.1997 19.9773C25.3111 20.5062 23.8464 21.4015 23.8464 23.1509C23.8464 24.8191 25.2704 26.04 27.7523 26.04C30.5597 26.04 33.3265 24.2902 33.3265 19.2857V17.0886ZM116.586 11.1066C113.249 11.1066 111.011 13.263 110.564 16.5179H122.119C121.834 13.5071 120.085 11.1066 116.586 11.1066Z",
|
|
78
|
+
fill: "currentColor"
|
|
79
|
+
}
|
|
80
|
+
)
|
|
122
81
|
}
|
|
123
82
|
);
|
|
124
83
|
};
|
|
@@ -135,7 +94,7 @@ const Logo = React__namespace.forwardRef(
|
|
|
135
94
|
"data-testid": "logo",
|
|
136
95
|
className: cn.cn(
|
|
137
96
|
"inline-flex items-center text-content-primary",
|
|
138
|
-
variant === "portrait" ? "flex-col" : "flex-row",
|
|
97
|
+
variant === "portrait" ? "flex-col gap-2" : "flex-row",
|
|
139
98
|
variant === "full" && "gap-2",
|
|
140
99
|
className
|
|
141
100
|
),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Logo.cjs","sources":["../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nconst getLogoColors = (color: LogoColor, variant: LogoVariant) => {\n if (color === \"fullColour\") {\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"decolour\") {\n return {\n iconClass: \"fill-[#151515] dark:fill-[#ffffff]\",\n iconInnerClass: \"fill-[#ffffff] dark:fill-[#151515]\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"whiteAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand-inverted\",\n };\n }\n\n if (color === \"blackAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-black)\"\n : \"var(--color-brand-primary-default)\",\n iconInner:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand\",\n };\n }\n\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Default to adaptive color\n };\n};\n\n/** Layout variant of the logo. */\nexport type LogoVariant = \"full\" | \"icon\" | \"wordmark\" | \"portrait\";\n/** Colour scheme of the logo. */\nexport type LogoColor = \"fullColour\" | \"decolour\" | \"whiteAlways\" | \"blackAlways\";\n\nexport interface LogoProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Layout variant of the logo. @default \"full\" */\n variant?: LogoVariant;\n /** Colour scheme of the logo. @default \"fullColour\" */\n color?: LogoColor;\n /**\n * Accessible label for the logo. Required when `type` is `\"icon\"` and\n * the logo is used inside interactive contexts (links, buttons).\n *\n * @example \"Fanvue home\"\n */\n \"aria-label\"?: string;\n}\n\nconst WordmarkSVG = ({ className }: { className?: string }) => {\n return (\n <svg\n width=\"128\"\n height=\"30\"\n viewBox=\"0 0 128 30\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n className={className}\n data-testid=\"logo-wordmark\"\n >\n <path\n d=\"M4.29144 15.2807V29.5588H10.4278V15.2807H16.0428V10.0668H10.4278V8.18181C10.4278 7.35294 10.6684 6.69786 11.1497 6.21658C11.631 5.73529 12.2861 5.49465 13.115 5.49465C13.5695 5.49465 13.9572 5.57486 14.2781 5.73529C14.6257 5.86898 14.9331 6.06951 15.2005 6.33689L19.0508 2.48663C18.3021 1.71123 17.4198 1.10963 16.4037 0.681819C15.4144 0.227273 14.2513 0 12.9144 0C11.1497 0 9.62566 0.374331 8.34224 1.12299C7.05882 1.84492 6.05615 2.84759 5.33422 4.13102C4.63903 5.3877 4.29144 6.80481 4.29144 8.38235V10.0668H0V15.2807H4.29144Z\"\n fill=\"currentColor\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M112.349 28.7166C114.006 29.5722 115.891 30 118.004 30C119.635 30 121.132 29.7193 122.496 29.1578C123.859 28.5963 125.022 27.754 125.985 26.631L122.616 23.262C122.028 23.9305 121.346 24.4385 120.571 24.7861C119.795 25.107 118.926 25.2674 117.964 25.2674C116.921 25.2674 116.012 25.0535 115.236 24.6257C114.488 24.1711 113.899 23.5428 113.472 22.7406C113.337 22.4624 113.225 22.166 113.135 21.8515L127.108 21.8182C127.215 21.3102 127.282 20.869 127.308 20.4947C127.362 20.0936 127.389 19.7193 127.389 19.3717C127.389 17.4733 126.961 15.7888 126.105 14.3182C125.276 12.8476 124.127 11.6979 122.656 10.869C121.185 10.0401 119.488 9.62568 117.562 9.62568C115.584 9.62568 113.806 10.0669 112.228 10.9492C110.651 11.8316 109.394 13.0481 108.458 14.5989C107.549 16.123 107.095 17.861 107.095 19.8128C107.095 21.7647 107.562 23.516 108.498 25.0668C109.434 26.6176 110.718 27.8342 112.349 28.7166ZM113.138 17.6391C113.218 17.3577 113.316 17.093 113.431 16.8449C113.833 16.0428 114.381 15.4278 115.076 15C115.798 14.5455 116.64 14.3182 117.603 14.3182C118.512 14.3182 119.274 14.5187 119.889 14.9198C120.53 15.2941 121.012 15.8556 121.333 16.6043C121.467 16.9061 121.575 17.243 121.658 17.615L113.138 17.6391Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M90.6482 28.9171C92.0386 29.639 93.6295 30 95.421 30C97.2124 30 98.7899 29.639 100.154 28.9171C101.517 28.1684 102.587 27.1524 103.362 25.869C104.138 24.5588 104.525 23.0481 104.525 21.3369V10.0668H98.3889V21.2968C98.3889 22.3128 98.1215 23.115 97.5867 23.7032C97.052 24.2647 96.33 24.5454 95.421 24.5454C94.7792 24.5454 94.2311 24.4118 93.7766 24.1444C93.322 23.877 92.9744 23.5027 92.7338 23.0214C92.5199 22.5401 92.4129 21.9652 92.4129 21.2968V10.0668H86.2766V21.377C86.2766 23.0615 86.6643 24.5588 87.4397 25.869C88.2151 27.1524 89.2846 28.1684 90.6482 28.9171Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M71.3524 29.5588L63.0904 10.0668H69.708L73.8792 22.1333L78.0503 10.0668H84.5476L76.2856 29.5588H71.3524Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M55.1386 18.4492V29.5588H61.2749V17.0855C61.2749 15.7486 60.9541 14.5187 60.3124 13.3957C59.6707 12.2727 58.7883 11.377 57.6653 10.7085C56.5691 10.0134 55.299 9.66576 53.8552 9.66576C52.3578 9.66576 51.0076 9.98662 49.8044 10.6283C49.2874 10.8986 48.8195 11.2204 48.4006 11.5939V10.0668H42.2642V29.5588H48.4006V18.4492C48.4006 17.7807 48.5477 17.1925 48.8418 16.6845C49.1359 16.1497 49.537 15.7486 50.045 15.4813C50.553 15.1872 51.1413 15.0401 51.8097 15.0401C52.7723 15.0401 53.561 15.3609 54.176 16.0027C54.8177 16.6176 55.1386 17.4331 55.1386 18.4492Z\"\n fill=\"currentColor\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M26.5533 29.9599C24.7619 29.9599 23.1576 29.5187 21.7405 28.6363C20.3501 27.754 19.2405 26.5508 18.4116 25.0267C17.6094 23.5027 17.2084 21.7647 17.2084 19.8128C17.2084 17.8609 17.6094 16.123 18.4116 14.5989C19.2405 13.0749 20.3501 11.8716 21.7405 10.9893C23.1576 10.1069 24.7619 9.66576 26.5533 9.66576C27.8635 9.66576 29.0399 9.91977 30.0827 10.4278C30.7839 10.7608 31.3988 11.1801 31.9276 11.6855V10.0668H37.9437V29.5588H31.9276V27.9791C31.4153 28.4634 30.8137 28.8697 30.1228 29.1978C29.0533 29.7059 27.8635 29.9599 26.5533 29.9599ZM27.7966 24.4251C29.1068 24.4251 30.1629 23.9973 30.9651 23.1417C31.7672 22.2593 32.1683 21.1497 32.1683 19.8128C32.1683 18.9037 31.9811 18.1016 31.6068 17.4064C31.2592 16.7112 30.7512 16.1765 30.0827 15.8021C29.441 15.4011 28.6923 15.2005 27.8367 15.2005C26.9811 15.2005 26.2191 15.4011 25.5506 15.8021C24.9089 16.1765 24.3875 16.7112 23.9865 17.4064C23.6121 18.1016 23.425 18.9037 23.425 19.8128C23.425 20.6952 23.6121 21.4839 23.9865 22.1791C24.3608 22.8743 24.8822 23.4224 25.5506 23.8235C26.2191 24.2246 26.9677 24.4251 27.7966 24.4251Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\n/**\n * The Fanvue brand logo. Supports full (icon + wordmark), icon-only, wordmark-only,\n * and portrait (stacked) layouts with multiple colour schemes.\n *\n * @example\n * ```tsx\n * <Logo type=\"full\" color=\"fullColour\" />\n * ```\n */\nexport const Logo = React.forwardRef<HTMLDivElement, LogoProps>(\n ({ className, variant = \"full\", color = \"fullColour\", ...props }, ref) => {\n const colors = getLogoColors(color, variant);\n const showIcon = variant === \"full\" || variant === \"icon\" || variant === \"portrait\";\n const showWordmark = variant === \"full\" || variant === \"wordmark\" || variant === \"portrait\";\n\n // When aria-label is provided, add role=\"img\" for proper accessibility\n const ariaProps = props[\"aria-label\"] ? { role: \"img\" as const } : {};\n\n return (\n <div\n ref={ref}\n data-testid=\"logo\"\n className={cn(\n \"inline-flex items-center text-content-primary\",\n variant === \"portrait\" ? \"flex-col\" : \"flex-row\",\n variant === \"full\" && \"gap-2\",\n className,\n )}\n {...ariaProps}\n {...props}\n >\n {showIcon && (\n <svg\n viewBox=\"0 0 39 39\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn(\"shrink-0\", variant === \"icon\" ? \"h-10 w-10\" : \"h-8 w-8\")}\n aria-hidden=\"true\"\n data-testid=\"logo-icon\"\n >\n <path\n d=\"M0 11.2339C0 5.02957 5.02957 0 11.2339 0H27.7661C33.9704 0 39 5.02957 39 11.2339V27.7661C39 33.9704 33.9704 39 27.7661 39H11.2339C5.02957 39 0 33.9704 0 27.7661V11.2339Z\"\n {...(color === \"decolour\" ? { className: colors.iconClass } : { fill: colors.icon })}\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.277 30.5825C11.4418 30.5825 11.0355 29.8659 11.2059 29.1153C11.4275 28.0916 12.5838 25.0548 11.7145 23.6899C10.4361 21.6938 7.25562 21.9838 6.5397 20.9602C6.02371 20.2089 6.48355 19.478 7.19738 19.0493C8.79967 18.0257 11.902 18.3157 14.9191 16.3025C16.5895 15.2106 18.1237 12.9927 18.993 11.662C20.2203 9.78527 20.7487 9.39287 23.3226 9.39287H32.3376C33.7574 9.39287 34.202 11.8036 31.8852 12.0686C31.2886 12.1368 29.6977 12.3757 27.4306 12.6487C25.2658 12.9216 20.4589 13.5728 22.351 16.6608C23.7658 18.2816 26.7488 18.0769 27.4306 19.0493C27.9238 19.7225 27.4875 20.4384 26.9505 20.7824C25.3311 21.8061 21.8737 21.6938 18.8566 23.6899C16.8111 25.0548 15.1478 28.0916 14.4659 29.1153C13.9716 29.8659 13.1293 30.5825 12.294 30.5825H12.277Z\"\n {...(color === \"decolour\"\n ? { className: colors.iconInnerClass }\n : { fill: colors.iconInner })}\n />\n </svg>\n )}\n {showWordmark && <WordmarkSVG className={cn(colors.textClass)} />}\n </div>\n );\n },\n);\n\nLogo.displayName = \"Logo\";\n"],"names":["jsxs","jsx","React","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAGA,MAAM,gBAAgB,CAAC,OAAkB,YAAyB;AAChE,MAAI,UAAU,cAAc;AAC1B,WAAO;AAAA,MACL,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,YAAY;AACxB,WAAO;AAAA,MACL,WAAW;AAAA,MACX,gBAAgB;AAAA,MAChB,WAAW;AAAA;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,eAAe;AAC3B,WAAO;AAAA,MACL,MACE,YAAY,SACR,uCACA;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,eAAe;AAC3B,WAAO;AAAA,MACL,MACE,YAAY,SACR,uCACA;AAAA,MACN,WACE,YAAY,SACR,uCACA;AAAA,MACN,WAAW;AAAA,IAAA;AAAA,EAEf;AAEA,SAAO;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,WAAW;AAAA;AAAA,EAAA;AAEf;AAqBA,MAAM,cAAc,CAAC,EAAE,gBAAwC;AAC7D,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MACN,eAAY;AAAA,MACZ;AAAA,MACA,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAAC,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAEPA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,UAAS;AAAA,YACT,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAEPA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAEPA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAEPA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,QAEPA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,UAAS;AAAA,YACT,GAAE;AAAA,YACF,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACP;AAAA,IAAA;AAAA,EAAA;AAGN;AAWO,MAAM,OAAOC,iBAAM;AAAA,EACxB,CAAC,EAAE,WAAW,UAAU,QAAQ,QAAQ,cAAc,GAAG,MAAA,GAAS,QAAQ;AACxE,UAAM,SAAS,cAAc,OAAO,OAAO;AAC3C,UAAM,WAAW,YAAY,UAAU,YAAY,UAAU,YAAY;AACzE,UAAM,eAAe,YAAY,UAAU,YAAY,cAAc,YAAY;AAGjF,UAAM,YAAY,MAAM,YAAY,IAAI,EAAE,MAAM,MAAA,IAAmB,CAAA;AAEnE,WACEF,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,eAAY;AAAA,QACZ,WAAWG,GAAAA;AAAAA,UACT;AAAA,UACA,YAAY,aAAa,aAAa;AAAA,UACtC,YAAY,UAAU;AAAA,UACtB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QACH,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,YACCH,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAWG,GAAAA,GAAG,YAAY,YAAY,SAAS,cAAc,SAAS;AAAA,cACtE,eAAY;AAAA,cACZ,eAAY;AAAA,cAEZ,UAAA;AAAA,gBAAAF,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,GAAE;AAAA,oBACD,GAAI,UAAU,aAAa,EAAE,WAAW,OAAO,cAAc,EAAE,MAAM,OAAO,KAAA;AAAA,kBAAK;AAAA,gBAAA;AAAA,gBAEpFA,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAS;AAAA,oBACT,UAAS;AAAA,oBACT,GAAE;AAAA,oBACD,GAAI,UAAU,aACX,EAAE,WAAW,OAAO,mBACpB,EAAE,MAAM,OAAO,UAAA;AAAA,kBAAU;AAAA,gBAAA;AAAA,cAC/B;AAAA,YAAA;AAAA,UAAA;AAAA,UAGH,gBAAgBA,2BAAAA,IAAC,aAAA,EAAY,WAAWE,MAAG,OAAO,SAAS,EAAA,CAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGrE;AACF;AAEA,KAAK,cAAc;;"}
|
|
1
|
+
{"version":3,"file":"Logo.cjs","sources":["../../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nconst getLogoColors = (color: LogoColor, variant: LogoVariant) => {\n if (color === \"fullColour\") {\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"decolour\") {\n return {\n iconClass: \"fill-[#151515] dark:fill-[#ffffff]\",\n iconInnerClass: \"fill-[#ffffff] dark:fill-[#151515]\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"whiteAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand-inverted\",\n };\n }\n\n if (color === \"blackAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-black)\"\n : \"var(--color-brand-primary-default)\",\n iconInner:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand\",\n };\n }\n\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Default to adaptive color\n };\n};\n\n/** Layout variant of the logo. */\nexport type LogoVariant = \"full\" | \"icon\" | \"wordmark\" | \"portrait\";\n/** Colour scheme of the logo. */\nexport type LogoColor = \"fullColour\" | \"decolour\" | \"whiteAlways\" | \"blackAlways\";\n\nexport interface LogoProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Layout variant of the logo. @default \"full\" */\n variant?: LogoVariant;\n /** Colour scheme of the logo. @default \"fullColour\" */\n color?: LogoColor;\n /**\n * Accessible label for the logo. Required when `type` is `\"icon\"` and\n * the logo is used inside interactive contexts (links, buttons).\n *\n * @example \"Fanvue home\"\n */\n \"aria-label\"?: string;\n}\n\nconst WordmarkSVG = ({ className }: { className?: string }) => {\n return (\n <svg\n width=\"128\"\n height=\"30\"\n viewBox=\"0 0 128 30\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n className={className}\n data-testid=\"logo-wordmark\"\n >\n <path\n d=\"M89.0679 20.1823C89.0679 23.4373 90.1256 25.553 93.0961 25.553C95.9847 25.553 98.1815 23.0304 98.1815 17.7818V8.01701H102.902V29.0523H98.2629V25.3495C97.1238 27.75 95.2114 29.6218 91.9566 29.6218C86.464 29.6218 84.3888 26.0006 84.3888 21.1589V8.01701H89.0679V20.1823ZM116.586 7.44485C123.787 7.44485 126.717 12.9782 126.757 18.9592C126.757 19.1627 126.757 19.4883 126.716 19.8544H110.523C110.889 23.5569 113.249 25.8353 116.586 25.8353C118.986 25.8353 121.02 24.8995 121.752 22.8245H126.432C125.211 27.0966 121.59 29.6192 116.586 29.6192C110.279 29.6192 106.007 25.1028 106.007 18.4707C106.007 12.0829 110.483 7.44485 116.586 7.44485ZM29.0135 7.40527C35.971 7.40527 37.8834 11.5958 37.8834 16.112V24.2089C37.8834 25.7957 37.965 27.8301 38.2091 29.0508H33.408C33.3266 28.237 33.2858 27.4232 33.2858 26.5688V25.5922H33.2451C32.5534 27.301 30.7633 29.5795 26.5726 29.5796C21.8122 29.5796 19.1673 26.6501 19.1673 23.3137C19.1674 17.4955 26.2876 17.0073 29.3391 16.5191C32.0245 16.1122 33.2451 15.5831 33.2451 13.7929C33.2451 12.1248 31.6581 11.067 29.0949 11.067C26.8165 11.067 25.1484 12.3691 24.6601 14.4441H20.1846C20.7135 11.1078 23.5208 7.40535 29.0135 7.40527ZM66.6676 8.01701C68.4577 13.5504 70.2072 18.8399 71.9568 24.3326H71.9973C73.5435 19.2874 75.4559 13.5911 77.2055 8.01701H82.2099C79.606 15.0559 77.0835 22.0134 74.5202 29.0523H69.312L61.6223 8.01701H66.6676ZM18.3094 4.15021H4.92328V12.2878H17.2107V16.3973H4.92328V29.0508H0V0H18.3094V4.15021ZM52.6473 7.44485C58.099 7.44493 60.2147 11.066 60.2147 15.9077V29.0497H55.536V16.8839C55.536 13.629 54.437 11.5133 51.5078 11.5133C48.5783 11.5133 46.4216 14.036 46.4216 19.2845V29.0497H41.7024V8.01436H46.3406V11.7168C47.4392 9.31627 49.3921 7.44485 52.6473 7.44485ZM33.3265 17.0886C32.879 18.2685 31.7802 19.2856 28.1997 19.9773C25.3111 20.5062 23.8464 21.4015 23.8464 23.1509C23.8464 24.8191 25.2704 26.04 27.7523 26.04C30.5597 26.04 33.3265 24.2902 33.3265 19.2857V17.0886ZM116.586 11.1066C113.249 11.1066 111.011 13.263 110.564 16.5179H122.119C121.834 13.5071 120.085 11.1066 116.586 11.1066Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\n/**\n * The Fanvue brand logo. Supports full (icon + wordmark), icon-only, wordmark-only,\n * and portrait (stacked) layouts with multiple colour schemes.\n *\n * @example\n * ```tsx\n * <Logo type=\"full\" color=\"fullColour\" />\n * ```\n */\nexport const Logo = React.forwardRef<HTMLDivElement, LogoProps>(\n ({ className, variant = \"full\", color = \"fullColour\", ...props }, ref) => {\n const colors = getLogoColors(color, variant);\n const showIcon = variant === \"full\" || variant === \"icon\" || variant === \"portrait\";\n const showWordmark = variant === \"full\" || variant === \"wordmark\" || variant === \"portrait\";\n\n // When aria-label is provided, add role=\"img\" for proper accessibility\n const ariaProps = props[\"aria-label\"] ? { role: \"img\" as const } : {};\n\n return (\n <div\n ref={ref}\n data-testid=\"logo\"\n className={cn(\n \"inline-flex items-center text-content-primary\",\n variant === \"portrait\" ? \"flex-col gap-2\" : \"flex-row\",\n variant === \"full\" && \"gap-2\",\n className,\n )}\n {...ariaProps}\n {...props}\n >\n {showIcon && (\n <svg\n viewBox=\"0 0 39 39\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn(\"shrink-0\", variant === \"icon\" ? \"h-10 w-10\" : \"h-8 w-8\")}\n aria-hidden=\"true\"\n data-testid=\"logo-icon\"\n >\n <path\n d=\"M0 11.2339C0 5.02957 5.02957 0 11.2339 0H27.7661C33.9704 0 39 5.02957 39 11.2339V27.7661C39 33.9704 33.9704 39 27.7661 39H11.2339C5.02957 39 0 33.9704 0 27.7661V11.2339Z\"\n {...(color === \"decolour\" ? { className: colors.iconClass } : { fill: colors.icon })}\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.277 30.5825C11.4418 30.5825 11.0355 29.8659 11.2059 29.1153C11.4275 28.0916 12.5838 25.0548 11.7145 23.6899C10.4361 21.6938 7.25562 21.9838 6.5397 20.9602C6.02371 20.2089 6.48355 19.478 7.19738 19.0493C8.79967 18.0257 11.902 18.3157 14.9191 16.3025C16.5895 15.2106 18.1237 12.9927 18.993 11.662C20.2203 9.78527 20.7487 9.39287 23.3226 9.39287H32.3376C33.7574 9.39287 34.202 11.8036 31.8852 12.0686C31.2886 12.1368 29.6977 12.3757 27.4306 12.6487C25.2658 12.9216 20.4589 13.5728 22.351 16.6608C23.7658 18.2816 26.7488 18.0769 27.4306 19.0493C27.9238 19.7225 27.4875 20.4384 26.9505 20.7824C25.3311 21.8061 21.8737 21.6938 18.8566 23.6899C16.8111 25.0548 15.1478 28.0916 14.4659 29.1153C13.9716 29.8659 13.1293 30.5825 12.294 30.5825H12.277Z\"\n {...(color === \"decolour\"\n ? { className: colors.iconInnerClass }\n : { fill: colors.iconInner })}\n />\n </svg>\n )}\n {showWordmark && <WordmarkSVG className={cn(colors.textClass)} />}\n </div>\n );\n },\n);\n\nLogo.displayName = \"Logo\";\n"],"names":["jsx","React","jsxs","cn"],"mappings":"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"}
|
package/dist/cjs/index.cjs
CHANGED
|
@@ -24,6 +24,7 @@ const Dialog = require("./components/Dialog/Dialog.cjs");
|
|
|
24
24
|
const Divider = require("./components/Divider/Divider.cjs");
|
|
25
25
|
const Drawer = require("./components/Drawer/Drawer.cjs");
|
|
26
26
|
const DropdownMenu = require("./components/DropdownMenu/DropdownMenu.cjs");
|
|
27
|
+
const EmptyState = require("./components/EmptyState/EmptyState.cjs");
|
|
27
28
|
const IconButton = require("./components/IconButton/IconButton.cjs");
|
|
28
29
|
const AddIcon = require("./components/Icons/AddIcon.cjs");
|
|
29
30
|
const AIIcon = require("./components/Icons/AIIcon.cjs");
|
|
@@ -70,6 +71,7 @@ const ExpandIcon = require("./components/Icons/ExpandIcon.cjs");
|
|
|
70
71
|
const EyeClosedIcon = require("./components/Icons/EyeClosedIcon.cjs");
|
|
71
72
|
const EyeIcon = require("./components/Icons/EyeIcon.cjs");
|
|
72
73
|
const EyeSlashIcon = require("./components/Icons/EyeSlashIcon.cjs");
|
|
74
|
+
const FacebookIcon = require("./components/Icons/FacebookIcon.cjs");
|
|
73
75
|
const FlagIcon = require("./components/Icons/FlagIcon.cjs");
|
|
74
76
|
const FlameIcon = require("./components/Icons/FlameIcon.cjs");
|
|
75
77
|
const FolderIcon = require("./components/Icons/FolderIcon.cjs");
|
|
@@ -77,6 +79,7 @@ const ForwardIcon = require("./components/Icons/ForwardIcon.cjs");
|
|
|
77
79
|
const GalleryIcon = require("./components/Icons/GalleryIcon.cjs");
|
|
78
80
|
const GenderIcon = require("./components/Icons/GenderIcon.cjs");
|
|
79
81
|
const GiftIcon = require("./components/Icons/GiftIcon.cjs");
|
|
82
|
+
const GoogleIcon = require("./components/Icons/GoogleIcon.cjs");
|
|
80
83
|
const HelpIcon = require("./components/Icons/HelpIcon.cjs");
|
|
81
84
|
const HomeIcon = require("./components/Icons/HomeIcon.cjs");
|
|
82
85
|
const HourglassIcon = require("./components/Icons/HourglassIcon.cjs");
|
|
@@ -134,6 +137,7 @@ const TickCircleOffIcon = require("./components/Icons/TickCircleOffIcon.cjs");
|
|
|
134
137
|
const TickIcon = require("./components/Icons/TickIcon.cjs");
|
|
135
138
|
const TrashBinIcon = require("./components/Icons/TrashBinIcon.cjs");
|
|
136
139
|
const TrophyIcon = require("./components/Icons/TrophyIcon.cjs");
|
|
140
|
+
const TwitterIcon = require("./components/Icons/TwitterIcon.cjs");
|
|
137
141
|
const UploadCloudIcon = require("./components/Icons/UploadCloudIcon.cjs");
|
|
138
142
|
const UploadIcon = require("./components/Icons/UploadIcon.cjs");
|
|
139
143
|
const UserCircleIcon = require("./components/Icons/UserCircleIcon.cjs");
|
|
@@ -236,6 +240,7 @@ exports.DropdownMenuItem = DropdownMenu.DropdownMenuItem;
|
|
|
236
240
|
exports.DropdownMenuLabel = DropdownMenu.DropdownMenuLabel;
|
|
237
241
|
exports.DropdownMenuSeparator = DropdownMenu.DropdownMenuSeparator;
|
|
238
242
|
exports.DropdownMenuTrigger = DropdownMenu.DropdownMenuTrigger;
|
|
243
|
+
exports.EmptyState = EmptyState.EmptyState;
|
|
239
244
|
exports.IconButton = IconButton.IconButton;
|
|
240
245
|
exports.AddIcon = AddIcon.AddIcon;
|
|
241
246
|
exports.AIIcon = AIIcon.AIIcon;
|
|
@@ -282,6 +287,7 @@ exports.ExpandIcon = ExpandIcon.ExpandIcon;
|
|
|
282
287
|
exports.EyeClosedIcon = EyeClosedIcon.EyeClosedIcon;
|
|
283
288
|
exports.EyeIcon = EyeIcon.EyeIcon;
|
|
284
289
|
exports.EyeSlashIcon = EyeSlashIcon.EyeSlashIcon;
|
|
290
|
+
exports.FacebookIcon = FacebookIcon.FacebookIcon;
|
|
285
291
|
exports.FlagIcon = FlagIcon.FlagIcon;
|
|
286
292
|
exports.FlameIcon = FlameIcon.FlameIcon;
|
|
287
293
|
exports.FolderIcon = FolderIcon.FolderIcon;
|
|
@@ -289,6 +295,7 @@ exports.ForwardIcon = ForwardIcon.ForwardIcon;
|
|
|
289
295
|
exports.GalleryIcon = GalleryIcon.GalleryIcon;
|
|
290
296
|
exports.GenderIcon = GenderIcon.GenderIcon;
|
|
291
297
|
exports.GiftIcon = GiftIcon.GiftIcon;
|
|
298
|
+
exports.GoogleIcon = GoogleIcon.GoogleIcon;
|
|
292
299
|
exports.HelpIcon = HelpIcon.HelpIcon;
|
|
293
300
|
exports.HomeIcon = HomeIcon.HomeIcon;
|
|
294
301
|
exports.HourglassIcon = HourglassIcon.HourglassIcon;
|
|
@@ -346,6 +353,7 @@ exports.TickCircleOffIcon = TickCircleOffIcon.TickCircleOffIcon;
|
|
|
346
353
|
exports.TickIcon = TickIcon.TickIcon;
|
|
347
354
|
exports.TrashBinIcon = TrashBinIcon.TrashBinIcon;
|
|
348
355
|
exports.TrophyIcon = TrophyIcon.TrophyIcon;
|
|
356
|
+
exports.TwitterIcon = TwitterIcon.TwitterIcon;
|
|
349
357
|
exports.UploadCloudIcon = UploadCloudIcon.UploadCloudIcon;
|
|
350
358
|
exports.UploadIcon = UploadIcon.UploadIcon;
|
|
351
359
|
exports.UserCircleIcon = UserCircleIcon.UserCircleIcon;
|
package/dist/cjs/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../../utils/cn.mjs";
|
|
5
|
+
const EmptyState = React.forwardRef(
|
|
6
|
+
({
|
|
7
|
+
className,
|
|
8
|
+
variant = "default",
|
|
9
|
+
title,
|
|
10
|
+
description,
|
|
11
|
+
media,
|
|
12
|
+
primaryAction,
|
|
13
|
+
secondaryAction,
|
|
14
|
+
...props
|
|
15
|
+
}, ref) => {
|
|
16
|
+
const isCentered = variant === "centered";
|
|
17
|
+
const titleId = React.useId();
|
|
18
|
+
const regionLabelledBy = title !== void 0 && title !== null && title !== false ? titleId : void 0;
|
|
19
|
+
return /* @__PURE__ */ jsxs(
|
|
20
|
+
"section",
|
|
21
|
+
{
|
|
22
|
+
ref,
|
|
23
|
+
"aria-labelledby": regionLabelledBy,
|
|
24
|
+
"data-testid": "empty-state",
|
|
25
|
+
className: cn(
|
|
26
|
+
"flex w-full max-w-[375px] flex-col gap-6",
|
|
27
|
+
isCentered ? "items-center text-center" : "items-start text-left",
|
|
28
|
+
className
|
|
29
|
+
),
|
|
30
|
+
...props,
|
|
31
|
+
children: [
|
|
32
|
+
media !== void 0 && media !== null && /* @__PURE__ */ jsx("div", { className: "h-[280px] w-full overflow-hidden rounded-md", children: media }),
|
|
33
|
+
/* @__PURE__ */ jsxs(
|
|
34
|
+
"div",
|
|
35
|
+
{
|
|
36
|
+
className: cn("flex w-full flex-col gap-6", isCentered ? "items-center" : "items-start"),
|
|
37
|
+
children: [
|
|
38
|
+
/* @__PURE__ */ jsxs(
|
|
39
|
+
"div",
|
|
40
|
+
{
|
|
41
|
+
className: cn(
|
|
42
|
+
"flex w-full flex-col gap-4",
|
|
43
|
+
isCentered ? "items-center" : "items-start"
|
|
44
|
+
),
|
|
45
|
+
children: [
|
|
46
|
+
title !== void 0 && title !== null && title !== false && /* @__PURE__ */ jsx("div", { id: titleId, className: "typography-bold-heading-lg text-content-primary", children: title }),
|
|
47
|
+
description !== void 0 && description !== null && description !== false && /* @__PURE__ */ jsx("p", { className: "typography-regular-body-lg text-content-secondary", children: description })
|
|
48
|
+
]
|
|
49
|
+
}
|
|
50
|
+
),
|
|
51
|
+
primaryAction !== void 0 && primaryAction !== null || secondaryAction !== void 0 && secondaryAction !== null ? /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-4", isCentered ? "items-center" : "items-start"), children: [
|
|
52
|
+
primaryAction,
|
|
53
|
+
secondaryAction
|
|
54
|
+
] }) : null
|
|
55
|
+
]
|
|
56
|
+
}
|
|
57
|
+
)
|
|
58
|
+
]
|
|
59
|
+
}
|
|
60
|
+
);
|
|
61
|
+
}
|
|
62
|
+
);
|
|
63
|
+
EmptyState.displayName = "EmptyState";
|
|
64
|
+
export {
|
|
65
|
+
EmptyState
|
|
66
|
+
};
|
|
67
|
+
//# sourceMappingURL=EmptyState.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmptyState.mjs","sources":["../../../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nexport type EmptyStateVariant = \"default\" | \"centered\";\n\nexport interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLElement>, \"title\"> {\n /**\n * Matches Figma property `Property 1` (`Default` / `centered`).\n * @default \"default\"\n */\n variant?: EmptyStateVariant;\n /** Main heading. */\n title?: React.ReactNode;\n /** Supporting body copy. */\n description?: React.ReactNode;\n /** Top visual/illustration slot. */\n media?: React.ReactNode;\n /** Primary call-to-action node. */\n primaryAction?: React.ReactNode;\n /** Optional secondary action rendered below primary. */\n secondaryAction?: React.ReactNode;\n}\n\nexport const EmptyState = React.forwardRef<HTMLElement, EmptyStateProps>(\n (\n {\n className,\n variant = \"default\",\n title,\n description,\n media,\n primaryAction,\n secondaryAction,\n ...props\n },\n ref,\n ) => {\n const isCentered = variant === \"centered\";\n const titleId = React.useId();\n const regionLabelledBy =\n title !== undefined && title !== null && title !== false ? titleId : undefined;\n\n return (\n <section\n ref={ref}\n aria-labelledby={regionLabelledBy}\n data-testid=\"empty-state\"\n className={cn(\n \"flex w-full max-w-[375px] flex-col gap-6\",\n isCentered ? \"items-center text-center\" : \"items-start text-left\",\n className,\n )}\n {...props}\n >\n {media !== undefined && media !== null && (\n <div className=\"h-[280px] w-full overflow-hidden rounded-md\">{media}</div>\n )}\n\n <div\n className={cn(\"flex w-full flex-col gap-6\", isCentered ? \"items-center\" : \"items-start\")}\n >\n <div\n className={cn(\n \"flex w-full flex-col gap-4\",\n isCentered ? \"items-center\" : \"items-start\",\n )}\n >\n {title !== undefined && title !== null && title !== false && (\n <div id={titleId} className=\"typography-bold-heading-lg text-content-primary\">\n {title}\n </div>\n )}\n {description !== undefined && description !== null && description !== false && (\n <p className=\"typography-regular-body-lg text-content-secondary\">{description}</p>\n )}\n </div>\n\n {(primaryAction !== undefined && primaryAction !== null) ||\n (secondaryAction !== undefined && secondaryAction !== null) ? (\n <div className={cn(\"flex flex-col gap-4\", isCentered ? \"items-center\" : \"items-start\")}>\n {primaryAction}\n {secondaryAction}\n </div>\n ) : null}\n </div>\n </section>\n );\n },\n);\n\nEmptyState.displayName = \"EmptyState\";\n"],"names":[],"mappings":";;;;AAuBO,MAAM,aAAa,MAAM;AAAA,EAC9B,CACE;AAAA,IACE;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,GAEL,QACG;AACH,UAAM,aAAa,YAAY;AAC/B,UAAM,UAAU,MAAM,MAAA;AACtB,UAAM,mBACJ,UAAU,UAAa,UAAU,QAAQ,UAAU,QAAQ,UAAU;AAEvE,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,mBAAiB;AAAA,QACjB,eAAY;AAAA,QACZ,WAAW;AAAA,UACT;AAAA,UACA,aAAa,6BAA6B;AAAA,UAC1C;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,UAAU,UAAa,UAAU,4BAC/B,OAAA,EAAI,WAAU,+CAA+C,UAAA,MAAA,CAAM;AAAA,UAGtE;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,GAAG,8BAA8B,aAAa,iBAAiB,aAAa;AAAA,cAEvF,UAAA;AAAA,gBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAW;AAAA,sBACT;AAAA,sBACA,aAAa,iBAAiB;AAAA,oBAAA;AAAA,oBAG/B,UAAA;AAAA,sBAAA,UAAU,UAAa,UAAU,QAAQ,UAAU,SAClD,oBAAC,OAAA,EAAI,IAAI,SAAS,WAAU,mDACzB,UAAA,OACH;AAAA,sBAED,gBAAgB,UAAa,gBAAgB,QAAQ,gBAAgB,SACpE,oBAAC,KAAA,EAAE,WAAU,qDAAqD,UAAA,YAAA,CAAY;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAIhF,kBAAkB,UAAa,kBAAkB,QAClD,oBAAoB,UAAa,oBAAoB,OACpD,qBAAC,OAAA,EAAI,WAAW,GAAG,uBAAuB,aAAa,iBAAiB,aAAa,GAClF,UAAA;AAAA,kBAAA;AAAA,kBACA;AAAA,gBAAA,EAAA,CACH,IACE;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,WAAW,cAAc;"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../../utils/cn.mjs";
|
|
5
|
+
const FacebookIcon = React.forwardRef(
|
|
6
|
+
({ className, ...props }, ref) => {
|
|
7
|
+
return /* @__PURE__ */ jsx(
|
|
8
|
+
"svg",
|
|
9
|
+
{
|
|
10
|
+
ref,
|
|
11
|
+
viewBox: "0 0 14 14",
|
|
12
|
+
fill: "none",
|
|
13
|
+
"aria-hidden": "true",
|
|
14
|
+
className: cn("size-6", className),
|
|
15
|
+
...props,
|
|
16
|
+
children: /* @__PURE__ */ jsx(
|
|
17
|
+
"path",
|
|
18
|
+
{
|
|
19
|
+
fill: "currentColor",
|
|
20
|
+
d: "M5.30892 13.8448V9.17272H3.86575V7.02576H5.30892V6.1007C5.30892 3.70902 6.38692 2.6007 8.72608 2.6007C8.96 2.6007 9.28317 2.62529 9.58242 2.66101C9.80656 2.68416 10.0289 2.7223 10.248 2.77518V4.7219C10.1213 4.71004 9.99428 4.70301 9.86708 4.70082C9.72459 4.69711 9.58204 4.69535 9.4395 4.69555C9.02708 4.69555 8.70508 4.75176 8.46242 4.87646C8.29928 4.95861 8.16214 5.08471 8.06633 5.24063C7.91583 5.48653 7.84817 5.82318 7.84817 6.26639V7.02576H10.1342L9.90908 8.25703L9.74167 9.17272H7.84817V14C11.3143 13.5796 14 10.6177 14 7.02576C14 3.14578 10.8657 0 7 0C3.13425 0 0 3.14578 0 7.02576C0 10.3208 2.25983 13.0855 5.30892 13.8448Z"
|
|
21
|
+
}
|
|
22
|
+
)
|
|
23
|
+
}
|
|
24
|
+
);
|
|
25
|
+
}
|
|
26
|
+
);
|
|
27
|
+
FacebookIcon.displayName = "FacebookIcon";
|
|
28
|
+
export {
|
|
29
|
+
FacebookIcon
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=FacebookIcon.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FacebookIcon.mjs","sources":["../../../src/components/Icons/FacebookIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const FacebookIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M5.30892 13.8448V9.17272H3.86575V7.02576H5.30892V6.1007C5.30892 3.70902 6.38692 2.6007 8.72608 2.6007C8.96 2.6007 9.28317 2.62529 9.58242 2.66101C9.80656 2.68416 10.0289 2.7223 10.248 2.77518V4.7219C10.1213 4.71004 9.99428 4.70301 9.86708 4.70082C9.72459 4.69711 9.58204 4.69535 9.4395 4.69555C9.02708 4.69555 8.70508 4.75176 8.46242 4.87646C8.29928 4.95861 8.16214 5.08471 8.06633 5.24063C7.91583 5.48653 7.84817 5.82318 7.84817 6.26639V7.02576H10.1342L9.90908 8.25703L9.74167 9.17272H7.84817V14C11.3143 13.5796 14 10.6177 14 7.02576C14 3.14578 10.8657 0 7 0C3.13425 0 0 3.14578 0 7.02576C0 10.3208 2.25983 13.0855 5.30892 13.8448Z\"\n />\n </svg>\n );\n },\n);\n\nFacebookIcon.displayName = \"FacebookIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,eAAe,MAAM;AAAA,EAChC,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,aAAa,cAAc;"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../../utils/cn.mjs";
|
|
5
|
+
const GoogleIcon = React.forwardRef(
|
|
6
|
+
({ className, ...props }, ref) => {
|
|
7
|
+
return /* @__PURE__ */ jsxs(
|
|
8
|
+
"svg",
|
|
9
|
+
{
|
|
10
|
+
ref,
|
|
11
|
+
viewBox: "0 0 14 14",
|
|
12
|
+
fill: "none",
|
|
13
|
+
"aria-hidden": "true",
|
|
14
|
+
className: cn("size-6", className),
|
|
15
|
+
...props,
|
|
16
|
+
children: [
|
|
17
|
+
/* @__PURE__ */ jsx(
|
|
18
|
+
"path",
|
|
19
|
+
{
|
|
20
|
+
fill: "currentColor",
|
|
21
|
+
d: "M13.9998 7.1514C13.9998 6.67404 13.946 6.19668 13.8922 5.71932H7.1355V8.42834H10.9654C10.803 9.27726 10.3174 10.073 9.56208 10.5504V12.3096H11.8811C13.2295 11.1036 13.9998 9.29864 13.9998 7.1514Z"
|
|
22
|
+
}
|
|
23
|
+
),
|
|
24
|
+
/* @__PURE__ */ jsx(
|
|
25
|
+
"path",
|
|
26
|
+
{
|
|
27
|
+
fill: "currentColor",
|
|
28
|
+
d: "M7.13543 14.0001C9.07918 14.0001 10.6985 13.3637 11.8811 12.3095L9.56201 10.5503C8.91402 10.9745 8.10405 11.2399 7.13543 11.2399C5.30037 11.2399 3.6811 10.0194 3.14181 8.32117H0.769226V10.1272C1.97847 12.5186 4.40679 14.0001 7.13543 14.0001Z"
|
|
29
|
+
}
|
|
30
|
+
),
|
|
31
|
+
/* @__PURE__ */ jsx(
|
|
32
|
+
"path",
|
|
33
|
+
{
|
|
34
|
+
fill: "currentColor",
|
|
35
|
+
d: "M3.14189 8.32119C2.81917 7.47226 2.81917 6.51704 3.14189 5.61497V3.80896H0.769305C-0.256002 5.77374 -0.256002 8.10928 0.769305 10.1272L3.14189 8.32119Z"
|
|
36
|
+
}
|
|
37
|
+
),
|
|
38
|
+
/* @__PURE__ */ jsx(
|
|
39
|
+
"path",
|
|
40
|
+
{
|
|
41
|
+
fill: "currentColor",
|
|
42
|
+
d: "M7.13548 2.76042C8.1579 2.76042 9.12652 3.13291 9.88188 3.82475L11.9349 1.80997C10.6447 0.640284 8.91407 -0.0492764 7.18927 0.00386894C4.46063 0.00386894 1.97852 1.48536 0.822762 3.87678L3.19535 5.68279C3.68085 3.98459 5.30012 2.76042 7.13548 2.76042Z"
|
|
43
|
+
}
|
|
44
|
+
)
|
|
45
|
+
]
|
|
46
|
+
}
|
|
47
|
+
);
|
|
48
|
+
}
|
|
49
|
+
);
|
|
50
|
+
GoogleIcon.displayName = "GoogleIcon";
|
|
51
|
+
export {
|
|
52
|
+
GoogleIcon
|
|
53
|
+
};
|
|
54
|
+
//# sourceMappingURL=GoogleIcon.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"GoogleIcon.mjs","sources":["../../../src/components/Icons/GoogleIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const GoogleIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M13.9998 7.1514C13.9998 6.67404 13.946 6.19668 13.8922 5.71932H7.1355V8.42834H10.9654C10.803 9.27726 10.3174 10.073 9.56208 10.5504V12.3096H11.8811C13.2295 11.1036 13.9998 9.29864 13.9998 7.1514Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M7.13543 14.0001C9.07918 14.0001 10.6985 13.3637 11.8811 12.3095L9.56201 10.5503C8.91402 10.9745 8.10405 11.2399 7.13543 11.2399C5.30037 11.2399 3.6811 10.0194 3.14181 8.32117H0.769226V10.1272C1.97847 12.5186 4.40679 14.0001 7.13543 14.0001Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M3.14189 8.32119C2.81917 7.47226 2.81917 6.51704 3.14189 5.61497V3.80896H0.769305C-0.256002 5.77374 -0.256002 8.10928 0.769305 10.1272L3.14189 8.32119Z\"\n />\n <path\n fill=\"currentColor\"\n d=\"M7.13548 2.76042C8.1579 2.76042 9.12652 3.13291 9.88188 3.82475L11.9349 1.80997C10.6447 0.640284 8.91407 -0.0492764 7.18927 0.00386894C4.46063 0.00386894 1.97852 1.48536 0.822762 3.87678L3.19535 5.68279C3.68085 3.98459 5.30012 2.76042 7.13548 2.76042Z\"\n />\n </svg>\n );\n },\n);\n\nGoogleIcon.displayName = \"GoogleIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,aAAa,MAAM;AAAA,EAC9B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,UAEJ;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,GAAE;AAAA,YAAA;AAAA,UAAA;AAAA,QACJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,WAAW,cAAc;"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import { cn } from "../../utils/cn.mjs";
|
|
5
|
+
const TwitterIcon = React.forwardRef(
|
|
6
|
+
({ className, ...props }, ref) => {
|
|
7
|
+
return /* @__PURE__ */ jsx(
|
|
8
|
+
"svg",
|
|
9
|
+
{
|
|
10
|
+
ref,
|
|
11
|
+
viewBox: "0 0 14 14",
|
|
12
|
+
fill: "none",
|
|
13
|
+
"aria-hidden": "true",
|
|
14
|
+
className: cn("size-6", className),
|
|
15
|
+
...props,
|
|
16
|
+
children: /* @__PURE__ */ jsx(
|
|
17
|
+
"path",
|
|
18
|
+
{
|
|
19
|
+
fill: "currentColor",
|
|
20
|
+
d: "M11.0306 0H13.1817L8.49148 5.57953L14 13.1596H9.6908L6.30348 8.55739L2.42757 13.1596H0.275308L5.28626 7.19433L0 0.000606537H4.4275L7.4962 4.20241L11.0306 0ZM10.2752 11.817H11.4665L3.78737 1.26538H2.50918L10.2752 11.817Z"
|
|
21
|
+
}
|
|
22
|
+
)
|
|
23
|
+
}
|
|
24
|
+
);
|
|
25
|
+
}
|
|
26
|
+
);
|
|
27
|
+
TwitterIcon.displayName = "TwitterIcon";
|
|
28
|
+
export {
|
|
29
|
+
TwitterIcon
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=TwitterIcon.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TwitterIcon.mjs","sources":["../../../src/components/Icons/TwitterIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { IconProps } from \"./types\";\n\nexport const TwitterIcon = React.forwardRef<SVGSVGElement, IconProps>(\n ({ className, ...props }, ref) => {\n return (\n <svg\n ref={ref}\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(\"size-6\", className)}\n {...props}\n >\n <path\n fill=\"currentColor\"\n d=\"M11.0306 0H13.1817L8.49148 5.57953L14 13.1596H9.6908L6.30348 8.55739L2.42757 13.1596H0.275308L5.28626 7.19433L0 0.000606537H4.4275L7.4962 4.20241L11.0306 0ZM10.2752 11.817H11.4665L3.78737 1.26538H2.50918L10.2752 11.817Z\"\n />\n </svg>\n );\n },\n);\n\nTwitterIcon.displayName = \"TwitterIcon\";\n"],"names":[],"mappings":";;;;AAIO,MAAM,cAAc,MAAM;AAAA,EAC/B,CAAC,EAAE,WAAW,GAAG,MAAA,GAAS,QAAQ;AAChC,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,UAAU,SAAS;AAAA,QAChC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,GAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAGN;AACF;AAEA,YAAY,cAAc;"}
|
|
@@ -41,7 +41,7 @@ const getLogoColors = (color, variant) => {
|
|
|
41
41
|
};
|
|
42
42
|
};
|
|
43
43
|
const WordmarkSVG = ({ className }) => {
|
|
44
|
-
return /* @__PURE__ */
|
|
44
|
+
return /* @__PURE__ */ jsx(
|
|
45
45
|
"svg",
|
|
46
46
|
{
|
|
47
47
|
width: "128",
|
|
@@ -52,54 +52,13 @@ const WordmarkSVG = ({ className }) => {
|
|
|
52
52
|
"aria-hidden": "true",
|
|
53
53
|
className,
|
|
54
54
|
"data-testid": "logo-wordmark",
|
|
55
|
-
children:
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
),
|
|
63
|
-
/* @__PURE__ */ jsx(
|
|
64
|
-
"path",
|
|
65
|
-
{
|
|
66
|
-
fillRule: "evenodd",
|
|
67
|
-
clipRule: "evenodd",
|
|
68
|
-
d: "M112.349 28.7166C114.006 29.5722 115.891 30 118.004 30C119.635 30 121.132 29.7193 122.496 29.1578C123.859 28.5963 125.022 27.754 125.985 26.631L122.616 23.262C122.028 23.9305 121.346 24.4385 120.571 24.7861C119.795 25.107 118.926 25.2674 117.964 25.2674C116.921 25.2674 116.012 25.0535 115.236 24.6257C114.488 24.1711 113.899 23.5428 113.472 22.7406C113.337 22.4624 113.225 22.166 113.135 21.8515L127.108 21.8182C127.215 21.3102 127.282 20.869 127.308 20.4947C127.362 20.0936 127.389 19.7193 127.389 19.3717C127.389 17.4733 126.961 15.7888 126.105 14.3182C125.276 12.8476 124.127 11.6979 122.656 10.869C121.185 10.0401 119.488 9.62568 117.562 9.62568C115.584 9.62568 113.806 10.0669 112.228 10.9492C110.651 11.8316 109.394 13.0481 108.458 14.5989C107.549 16.123 107.095 17.861 107.095 19.8128C107.095 21.7647 107.562 23.516 108.498 25.0668C109.434 26.6176 110.718 27.8342 112.349 28.7166ZM113.138 17.6391C113.218 17.3577 113.316 17.093 113.431 16.8449C113.833 16.0428 114.381 15.4278 115.076 15C115.798 14.5455 116.64 14.3182 117.603 14.3182C118.512 14.3182 119.274 14.5187 119.889 14.9198C120.53 15.2941 121.012 15.8556 121.333 16.6043C121.467 16.9061 121.575 17.243 121.658 17.615L113.138 17.6391Z",
|
|
69
|
-
fill: "currentColor"
|
|
70
|
-
}
|
|
71
|
-
),
|
|
72
|
-
/* @__PURE__ */ jsx(
|
|
73
|
-
"path",
|
|
74
|
-
{
|
|
75
|
-
d: "M90.6482 28.9171C92.0386 29.639 93.6295 30 95.421 30C97.2124 30 98.7899 29.639 100.154 28.9171C101.517 28.1684 102.587 27.1524 103.362 25.869C104.138 24.5588 104.525 23.0481 104.525 21.3369V10.0668H98.3889V21.2968C98.3889 22.3128 98.1215 23.115 97.5867 23.7032C97.052 24.2647 96.33 24.5454 95.421 24.5454C94.7792 24.5454 94.2311 24.4118 93.7766 24.1444C93.322 23.877 92.9744 23.5027 92.7338 23.0214C92.5199 22.5401 92.4129 21.9652 92.4129 21.2968V10.0668H86.2766V21.377C86.2766 23.0615 86.6643 24.5588 87.4397 25.869C88.2151 27.1524 89.2846 28.1684 90.6482 28.9171Z",
|
|
76
|
-
fill: "currentColor"
|
|
77
|
-
}
|
|
78
|
-
),
|
|
79
|
-
/* @__PURE__ */ jsx(
|
|
80
|
-
"path",
|
|
81
|
-
{
|
|
82
|
-
d: "M71.3524 29.5588L63.0904 10.0668H69.708L73.8792 22.1333L78.0503 10.0668H84.5476L76.2856 29.5588H71.3524Z",
|
|
83
|
-
fill: "currentColor"
|
|
84
|
-
}
|
|
85
|
-
),
|
|
86
|
-
/* @__PURE__ */ jsx(
|
|
87
|
-
"path",
|
|
88
|
-
{
|
|
89
|
-
d: "M55.1386 18.4492V29.5588H61.2749V17.0855C61.2749 15.7486 60.9541 14.5187 60.3124 13.3957C59.6707 12.2727 58.7883 11.377 57.6653 10.7085C56.5691 10.0134 55.299 9.66576 53.8552 9.66576C52.3578 9.66576 51.0076 9.98662 49.8044 10.6283C49.2874 10.8986 48.8195 11.2204 48.4006 11.5939V10.0668H42.2642V29.5588H48.4006V18.4492C48.4006 17.7807 48.5477 17.1925 48.8418 16.6845C49.1359 16.1497 49.537 15.7486 50.045 15.4813C50.553 15.1872 51.1413 15.0401 51.8097 15.0401C52.7723 15.0401 53.561 15.3609 54.176 16.0027C54.8177 16.6176 55.1386 17.4331 55.1386 18.4492Z",
|
|
90
|
-
fill: "currentColor"
|
|
91
|
-
}
|
|
92
|
-
),
|
|
93
|
-
/* @__PURE__ */ jsx(
|
|
94
|
-
"path",
|
|
95
|
-
{
|
|
96
|
-
fillRule: "evenodd",
|
|
97
|
-
clipRule: "evenodd",
|
|
98
|
-
d: "M26.5533 29.9599C24.7619 29.9599 23.1576 29.5187 21.7405 28.6363C20.3501 27.754 19.2405 26.5508 18.4116 25.0267C17.6094 23.5027 17.2084 21.7647 17.2084 19.8128C17.2084 17.8609 17.6094 16.123 18.4116 14.5989C19.2405 13.0749 20.3501 11.8716 21.7405 10.9893C23.1576 10.1069 24.7619 9.66576 26.5533 9.66576C27.8635 9.66576 29.0399 9.91977 30.0827 10.4278C30.7839 10.7608 31.3988 11.1801 31.9276 11.6855V10.0668H37.9437V29.5588H31.9276V27.9791C31.4153 28.4634 30.8137 28.8697 30.1228 29.1978C29.0533 29.7059 27.8635 29.9599 26.5533 29.9599ZM27.7966 24.4251C29.1068 24.4251 30.1629 23.9973 30.9651 23.1417C31.7672 22.2593 32.1683 21.1497 32.1683 19.8128C32.1683 18.9037 31.9811 18.1016 31.6068 17.4064C31.2592 16.7112 30.7512 16.1765 30.0827 15.8021C29.441 15.4011 28.6923 15.2005 27.8367 15.2005C26.9811 15.2005 26.2191 15.4011 25.5506 15.8021C24.9089 16.1765 24.3875 16.7112 23.9865 17.4064C23.6121 18.1016 23.425 18.9037 23.425 19.8128C23.425 20.6952 23.6121 21.4839 23.9865 22.1791C24.3608 22.8743 24.8822 23.4224 25.5506 23.8235C26.2191 24.2246 26.9677 24.4251 27.7966 24.4251Z",
|
|
99
|
-
fill: "currentColor"
|
|
100
|
-
}
|
|
101
|
-
)
|
|
102
|
-
]
|
|
55
|
+
children: /* @__PURE__ */ jsx(
|
|
56
|
+
"path",
|
|
57
|
+
{
|
|
58
|
+
d: "M89.0679 20.1823C89.0679 23.4373 90.1256 25.553 93.0961 25.553C95.9847 25.553 98.1815 23.0304 98.1815 17.7818V8.01701H102.902V29.0523H98.2629V25.3495C97.1238 27.75 95.2114 29.6218 91.9566 29.6218C86.464 29.6218 84.3888 26.0006 84.3888 21.1589V8.01701H89.0679V20.1823ZM116.586 7.44485C123.787 7.44485 126.717 12.9782 126.757 18.9592C126.757 19.1627 126.757 19.4883 126.716 19.8544H110.523C110.889 23.5569 113.249 25.8353 116.586 25.8353C118.986 25.8353 121.02 24.8995 121.752 22.8245H126.432C125.211 27.0966 121.59 29.6192 116.586 29.6192C110.279 29.6192 106.007 25.1028 106.007 18.4707C106.007 12.0829 110.483 7.44485 116.586 7.44485ZM29.0135 7.40527C35.971 7.40527 37.8834 11.5958 37.8834 16.112V24.2089C37.8834 25.7957 37.965 27.8301 38.2091 29.0508H33.408C33.3266 28.237 33.2858 27.4232 33.2858 26.5688V25.5922H33.2451C32.5534 27.301 30.7633 29.5795 26.5726 29.5796C21.8122 29.5796 19.1673 26.6501 19.1673 23.3137C19.1674 17.4955 26.2876 17.0073 29.3391 16.5191C32.0245 16.1122 33.2451 15.5831 33.2451 13.7929C33.2451 12.1248 31.6581 11.067 29.0949 11.067C26.8165 11.067 25.1484 12.3691 24.6601 14.4441H20.1846C20.7135 11.1078 23.5208 7.40535 29.0135 7.40527ZM66.6676 8.01701C68.4577 13.5504 70.2072 18.8399 71.9568 24.3326H71.9973C73.5435 19.2874 75.4559 13.5911 77.2055 8.01701H82.2099C79.606 15.0559 77.0835 22.0134 74.5202 29.0523H69.312L61.6223 8.01701H66.6676ZM18.3094 4.15021H4.92328V12.2878H17.2107V16.3973H4.92328V29.0508H0V0H18.3094V4.15021ZM52.6473 7.44485C58.099 7.44493 60.2147 11.066 60.2147 15.9077V29.0497H55.536V16.8839C55.536 13.629 54.437 11.5133 51.5078 11.5133C48.5783 11.5133 46.4216 14.036 46.4216 19.2845V29.0497H41.7024V8.01436H46.3406V11.7168C47.4392 9.31627 49.3921 7.44485 52.6473 7.44485ZM33.3265 17.0886C32.879 18.2685 31.7802 19.2856 28.1997 19.9773C25.3111 20.5062 23.8464 21.4015 23.8464 23.1509C23.8464 24.8191 25.2704 26.04 27.7523 26.04C30.5597 26.04 33.3265 24.2902 33.3265 19.2857V17.0886ZM116.586 11.1066C113.249 11.1066 111.011 13.263 110.564 16.5179H122.119C121.834 13.5071 120.085 11.1066 116.586 11.1066Z",
|
|
59
|
+
fill: "currentColor"
|
|
60
|
+
}
|
|
61
|
+
)
|
|
103
62
|
}
|
|
104
63
|
);
|
|
105
64
|
};
|
|
@@ -116,7 +75,7 @@ const Logo = React.forwardRef(
|
|
|
116
75
|
"data-testid": "logo",
|
|
117
76
|
className: cn(
|
|
118
77
|
"inline-flex items-center text-content-primary",
|
|
119
|
-
variant === "portrait" ? "flex-col" : "flex-row",
|
|
78
|
+
variant === "portrait" ? "flex-col gap-2" : "flex-row",
|
|
120
79
|
variant === "full" && "gap-2",
|
|
121
80
|
className
|
|
122
81
|
),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Logo.mjs","sources":["../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nconst getLogoColors = (color: LogoColor, variant: LogoVariant) => {\n if (color === \"fullColour\") {\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"decolour\") {\n return {\n iconClass: \"fill-[#151515] dark:fill-[#ffffff]\",\n iconInnerClass: \"fill-[#ffffff] dark:fill-[#151515]\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"whiteAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand-inverted\",\n };\n }\n\n if (color === \"blackAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-black)\"\n : \"var(--color-brand-primary-default)\",\n iconInner:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand\",\n };\n }\n\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Default to adaptive color\n };\n};\n\n/** Layout variant of the logo. */\nexport type LogoVariant = \"full\" | \"icon\" | \"wordmark\" | \"portrait\";\n/** Colour scheme of the logo. */\nexport type LogoColor = \"fullColour\" | \"decolour\" | \"whiteAlways\" | \"blackAlways\";\n\nexport interface LogoProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Layout variant of the logo. @default \"full\" */\n variant?: LogoVariant;\n /** Colour scheme of the logo. @default \"fullColour\" */\n color?: LogoColor;\n /**\n * Accessible label for the logo. Required when `type` is `\"icon\"` and\n * the logo is used inside interactive contexts (links, buttons).\n *\n * @example \"Fanvue home\"\n */\n \"aria-label\"?: string;\n}\n\nconst WordmarkSVG = ({ className }: { className?: string }) => {\n return (\n <svg\n width=\"128\"\n height=\"30\"\n viewBox=\"0 0 128 30\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n className={className}\n data-testid=\"logo-wordmark\"\n >\n <path\n d=\"M4.29144 15.2807V29.5588H10.4278V15.2807H16.0428V10.0668H10.4278V8.18181C10.4278 7.35294 10.6684 6.69786 11.1497 6.21658C11.631 5.73529 12.2861 5.49465 13.115 5.49465C13.5695 5.49465 13.9572 5.57486 14.2781 5.73529C14.6257 5.86898 14.9331 6.06951 15.2005 6.33689L19.0508 2.48663C18.3021 1.71123 17.4198 1.10963 16.4037 0.681819C15.4144 0.227273 14.2513 0 12.9144 0C11.1497 0 9.62566 0.374331 8.34224 1.12299C7.05882 1.84492 6.05615 2.84759 5.33422 4.13102C4.63903 5.3877 4.29144 6.80481 4.29144 8.38235V10.0668H0V15.2807H4.29144Z\"\n fill=\"currentColor\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M112.349 28.7166C114.006 29.5722 115.891 30 118.004 30C119.635 30 121.132 29.7193 122.496 29.1578C123.859 28.5963 125.022 27.754 125.985 26.631L122.616 23.262C122.028 23.9305 121.346 24.4385 120.571 24.7861C119.795 25.107 118.926 25.2674 117.964 25.2674C116.921 25.2674 116.012 25.0535 115.236 24.6257C114.488 24.1711 113.899 23.5428 113.472 22.7406C113.337 22.4624 113.225 22.166 113.135 21.8515L127.108 21.8182C127.215 21.3102 127.282 20.869 127.308 20.4947C127.362 20.0936 127.389 19.7193 127.389 19.3717C127.389 17.4733 126.961 15.7888 126.105 14.3182C125.276 12.8476 124.127 11.6979 122.656 10.869C121.185 10.0401 119.488 9.62568 117.562 9.62568C115.584 9.62568 113.806 10.0669 112.228 10.9492C110.651 11.8316 109.394 13.0481 108.458 14.5989C107.549 16.123 107.095 17.861 107.095 19.8128C107.095 21.7647 107.562 23.516 108.498 25.0668C109.434 26.6176 110.718 27.8342 112.349 28.7166ZM113.138 17.6391C113.218 17.3577 113.316 17.093 113.431 16.8449C113.833 16.0428 114.381 15.4278 115.076 15C115.798 14.5455 116.64 14.3182 117.603 14.3182C118.512 14.3182 119.274 14.5187 119.889 14.9198C120.53 15.2941 121.012 15.8556 121.333 16.6043C121.467 16.9061 121.575 17.243 121.658 17.615L113.138 17.6391Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M90.6482 28.9171C92.0386 29.639 93.6295 30 95.421 30C97.2124 30 98.7899 29.639 100.154 28.9171C101.517 28.1684 102.587 27.1524 103.362 25.869C104.138 24.5588 104.525 23.0481 104.525 21.3369V10.0668H98.3889V21.2968C98.3889 22.3128 98.1215 23.115 97.5867 23.7032C97.052 24.2647 96.33 24.5454 95.421 24.5454C94.7792 24.5454 94.2311 24.4118 93.7766 24.1444C93.322 23.877 92.9744 23.5027 92.7338 23.0214C92.5199 22.5401 92.4129 21.9652 92.4129 21.2968V10.0668H86.2766V21.377C86.2766 23.0615 86.6643 24.5588 87.4397 25.869C88.2151 27.1524 89.2846 28.1684 90.6482 28.9171Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M71.3524 29.5588L63.0904 10.0668H69.708L73.8792 22.1333L78.0503 10.0668H84.5476L76.2856 29.5588H71.3524Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M55.1386 18.4492V29.5588H61.2749V17.0855C61.2749 15.7486 60.9541 14.5187 60.3124 13.3957C59.6707 12.2727 58.7883 11.377 57.6653 10.7085C56.5691 10.0134 55.299 9.66576 53.8552 9.66576C52.3578 9.66576 51.0076 9.98662 49.8044 10.6283C49.2874 10.8986 48.8195 11.2204 48.4006 11.5939V10.0668H42.2642V29.5588H48.4006V18.4492C48.4006 17.7807 48.5477 17.1925 48.8418 16.6845C49.1359 16.1497 49.537 15.7486 50.045 15.4813C50.553 15.1872 51.1413 15.0401 51.8097 15.0401C52.7723 15.0401 53.561 15.3609 54.176 16.0027C54.8177 16.6176 55.1386 17.4331 55.1386 18.4492Z\"\n fill=\"currentColor\"\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M26.5533 29.9599C24.7619 29.9599 23.1576 29.5187 21.7405 28.6363C20.3501 27.754 19.2405 26.5508 18.4116 25.0267C17.6094 23.5027 17.2084 21.7647 17.2084 19.8128C17.2084 17.8609 17.6094 16.123 18.4116 14.5989C19.2405 13.0749 20.3501 11.8716 21.7405 10.9893C23.1576 10.1069 24.7619 9.66576 26.5533 9.66576C27.8635 9.66576 29.0399 9.91977 30.0827 10.4278C30.7839 10.7608 31.3988 11.1801 31.9276 11.6855V10.0668H37.9437V29.5588H31.9276V27.9791C31.4153 28.4634 30.8137 28.8697 30.1228 29.1978C29.0533 29.7059 27.8635 29.9599 26.5533 29.9599ZM27.7966 24.4251C29.1068 24.4251 30.1629 23.9973 30.9651 23.1417C31.7672 22.2593 32.1683 21.1497 32.1683 19.8128C32.1683 18.9037 31.9811 18.1016 31.6068 17.4064C31.2592 16.7112 30.7512 16.1765 30.0827 15.8021C29.441 15.4011 28.6923 15.2005 27.8367 15.2005C26.9811 15.2005 26.2191 15.4011 25.5506 15.8021C24.9089 16.1765 24.3875 16.7112 23.9865 17.4064C23.6121 18.1016 23.425 18.9037 23.425 19.8128C23.425 20.6952 23.6121 21.4839 23.9865 22.1791C24.3608 22.8743 24.8822 23.4224 25.5506 23.8235C26.2191 24.2246 26.9677 24.4251 27.7966 24.4251Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\n/**\n * The Fanvue brand logo. Supports full (icon + wordmark), icon-only, wordmark-only,\n * and portrait (stacked) layouts with multiple colour schemes.\n *\n * @example\n * ```tsx\n * <Logo type=\"full\" color=\"fullColour\" />\n * ```\n */\nexport const Logo = React.forwardRef<HTMLDivElement, LogoProps>(\n ({ className, variant = \"full\", color = \"fullColour\", ...props }, ref) => {\n const colors = getLogoColors(color, variant);\n const showIcon = variant === \"full\" || variant === \"icon\" || variant === \"portrait\";\n const showWordmark = variant === \"full\" || variant === \"wordmark\" || variant === \"portrait\";\n\n // When aria-label is provided, add role=\"img\" for proper accessibility\n const ariaProps = props[\"aria-label\"] ? { role: \"img\" as const } : {};\n\n return (\n <div\n ref={ref}\n data-testid=\"logo\"\n className={cn(\n \"inline-flex items-center text-content-primary\",\n variant === \"portrait\" ? \"flex-col\" : \"flex-row\",\n variant === \"full\" && \"gap-2\",\n className,\n )}\n {...ariaProps}\n {...props}\n >\n {showIcon && (\n <svg\n viewBox=\"0 0 39 39\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn(\"shrink-0\", variant === \"icon\" ? \"h-10 w-10\" : \"h-8 w-8\")}\n aria-hidden=\"true\"\n data-testid=\"logo-icon\"\n >\n <path\n d=\"M0 11.2339C0 5.02957 5.02957 0 11.2339 0H27.7661C33.9704 0 39 5.02957 39 11.2339V27.7661C39 33.9704 33.9704 39 27.7661 39H11.2339C5.02957 39 0 33.9704 0 27.7661V11.2339Z\"\n {...(color === \"decolour\" ? { className: colors.iconClass } : { fill: colors.icon })}\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.277 30.5825C11.4418 30.5825 11.0355 29.8659 11.2059 29.1153C11.4275 28.0916 12.5838 25.0548 11.7145 23.6899C10.4361 21.6938 7.25562 21.9838 6.5397 20.9602C6.02371 20.2089 6.48355 19.478 7.19738 19.0493C8.79967 18.0257 11.902 18.3157 14.9191 16.3025C16.5895 15.2106 18.1237 12.9927 18.993 11.662C20.2203 9.78527 20.7487 9.39287 23.3226 9.39287H32.3376C33.7574 9.39287 34.202 11.8036 31.8852 12.0686C31.2886 12.1368 29.6977 12.3757 27.4306 12.6487C25.2658 12.9216 20.4589 13.5728 22.351 16.6608C23.7658 18.2816 26.7488 18.0769 27.4306 19.0493C27.9238 19.7225 27.4875 20.4384 26.9505 20.7824C25.3311 21.8061 21.8737 21.6938 18.8566 23.6899C16.8111 25.0548 15.1478 28.0916 14.4659 29.1153C13.9716 29.8659 13.1293 30.5825 12.294 30.5825H12.277Z\"\n {...(color === \"decolour\"\n ? { className: colors.iconInnerClass }\n : { fill: colors.iconInner })}\n />\n </svg>\n )}\n {showWordmark && <WordmarkSVG className={cn(colors.textClass)} />}\n </div>\n );\n },\n);\n\nLogo.displayName = \"Logo\";\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Logo.mjs","sources":["../../../src/components/Logo/Logo.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../../utils/cn\";\n\nconst getLogoColors = (color: LogoColor, variant: LogoVariant) => {\n if (color === \"fullColour\") {\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"decolour\") {\n return {\n iconClass: \"fill-[#151515] dark:fill-[#ffffff]\",\n iconInnerClass: \"fill-[#ffffff] dark:fill-[#151515]\",\n textClass: \"\", // Uses parent's text-content-primary\n };\n }\n\n if (color === \"whiteAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand-inverted\",\n };\n }\n\n if (color === \"blackAlways\") {\n return {\n icon:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-black)\"\n : \"var(--color-brand-primary-default)\",\n iconInner:\n variant === \"icon\"\n ? \"var(--primitives-color-gray-white)\"\n : \"var(--primitives-color-gray-black)\",\n textClass: \"text-content-on-brand\",\n };\n }\n\n return {\n icon: \"var(--color-brand-primary-default)\",\n iconInner: \"var(--primitives-color-gray-black)\",\n textClass: \"\", // Default to adaptive color\n };\n};\n\n/** Layout variant of the logo. */\nexport type LogoVariant = \"full\" | \"icon\" | \"wordmark\" | \"portrait\";\n/** Colour scheme of the logo. */\nexport type LogoColor = \"fullColour\" | \"decolour\" | \"whiteAlways\" | \"blackAlways\";\n\nexport interface LogoProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Layout variant of the logo. @default \"full\" */\n variant?: LogoVariant;\n /** Colour scheme of the logo. @default \"fullColour\" */\n color?: LogoColor;\n /**\n * Accessible label for the logo. Required when `type` is `\"icon\"` and\n * the logo is used inside interactive contexts (links, buttons).\n *\n * @example \"Fanvue home\"\n */\n \"aria-label\"?: string;\n}\n\nconst WordmarkSVG = ({ className }: { className?: string }) => {\n return (\n <svg\n width=\"128\"\n height=\"30\"\n viewBox=\"0 0 128 30\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n className={className}\n data-testid=\"logo-wordmark\"\n >\n <path\n d=\"M89.0679 20.1823C89.0679 23.4373 90.1256 25.553 93.0961 25.553C95.9847 25.553 98.1815 23.0304 98.1815 17.7818V8.01701H102.902V29.0523H98.2629V25.3495C97.1238 27.75 95.2114 29.6218 91.9566 29.6218C86.464 29.6218 84.3888 26.0006 84.3888 21.1589V8.01701H89.0679V20.1823ZM116.586 7.44485C123.787 7.44485 126.717 12.9782 126.757 18.9592C126.757 19.1627 126.757 19.4883 126.716 19.8544H110.523C110.889 23.5569 113.249 25.8353 116.586 25.8353C118.986 25.8353 121.02 24.8995 121.752 22.8245H126.432C125.211 27.0966 121.59 29.6192 116.586 29.6192C110.279 29.6192 106.007 25.1028 106.007 18.4707C106.007 12.0829 110.483 7.44485 116.586 7.44485ZM29.0135 7.40527C35.971 7.40527 37.8834 11.5958 37.8834 16.112V24.2089C37.8834 25.7957 37.965 27.8301 38.2091 29.0508H33.408C33.3266 28.237 33.2858 27.4232 33.2858 26.5688V25.5922H33.2451C32.5534 27.301 30.7633 29.5795 26.5726 29.5796C21.8122 29.5796 19.1673 26.6501 19.1673 23.3137C19.1674 17.4955 26.2876 17.0073 29.3391 16.5191C32.0245 16.1122 33.2451 15.5831 33.2451 13.7929C33.2451 12.1248 31.6581 11.067 29.0949 11.067C26.8165 11.067 25.1484 12.3691 24.6601 14.4441H20.1846C20.7135 11.1078 23.5208 7.40535 29.0135 7.40527ZM66.6676 8.01701C68.4577 13.5504 70.2072 18.8399 71.9568 24.3326H71.9973C73.5435 19.2874 75.4559 13.5911 77.2055 8.01701H82.2099C79.606 15.0559 77.0835 22.0134 74.5202 29.0523H69.312L61.6223 8.01701H66.6676ZM18.3094 4.15021H4.92328V12.2878H17.2107V16.3973H4.92328V29.0508H0V0H18.3094V4.15021ZM52.6473 7.44485C58.099 7.44493 60.2147 11.066 60.2147 15.9077V29.0497H55.536V16.8839C55.536 13.629 54.437 11.5133 51.5078 11.5133C48.5783 11.5133 46.4216 14.036 46.4216 19.2845V29.0497H41.7024V8.01436H46.3406V11.7168C47.4392 9.31627 49.3921 7.44485 52.6473 7.44485ZM33.3265 17.0886C32.879 18.2685 31.7802 19.2856 28.1997 19.9773C25.3111 20.5062 23.8464 21.4015 23.8464 23.1509C23.8464 24.8191 25.2704 26.04 27.7523 26.04C30.5597 26.04 33.3265 24.2902 33.3265 19.2857V17.0886ZM116.586 11.1066C113.249 11.1066 111.011 13.263 110.564 16.5179H122.119C121.834 13.5071 120.085 11.1066 116.586 11.1066Z\"\n fill=\"currentColor\"\n />\n </svg>\n );\n};\n\n/**\n * The Fanvue brand logo. Supports full (icon + wordmark), icon-only, wordmark-only,\n * and portrait (stacked) layouts with multiple colour schemes.\n *\n * @example\n * ```tsx\n * <Logo type=\"full\" color=\"fullColour\" />\n * ```\n */\nexport const Logo = React.forwardRef<HTMLDivElement, LogoProps>(\n ({ className, variant = \"full\", color = \"fullColour\", ...props }, ref) => {\n const colors = getLogoColors(color, variant);\n const showIcon = variant === \"full\" || variant === \"icon\" || variant === \"portrait\";\n const showWordmark = variant === \"full\" || variant === \"wordmark\" || variant === \"portrait\";\n\n // When aria-label is provided, add role=\"img\" for proper accessibility\n const ariaProps = props[\"aria-label\"] ? { role: \"img\" as const } : {};\n\n return (\n <div\n ref={ref}\n data-testid=\"logo\"\n className={cn(\n \"inline-flex items-center text-content-primary\",\n variant === \"portrait\" ? \"flex-col gap-2\" : \"flex-row\",\n variant === \"full\" && \"gap-2\",\n className,\n )}\n {...ariaProps}\n {...props}\n >\n {showIcon && (\n <svg\n viewBox=\"0 0 39 39\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={cn(\"shrink-0\", variant === \"icon\" ? \"h-10 w-10\" : \"h-8 w-8\")}\n aria-hidden=\"true\"\n data-testid=\"logo-icon\"\n >\n <path\n d=\"M0 11.2339C0 5.02957 5.02957 0 11.2339 0H27.7661C33.9704 0 39 5.02957 39 11.2339V27.7661C39 33.9704 33.9704 39 27.7661 39H11.2339C5.02957 39 0 33.9704 0 27.7661V11.2339Z\"\n {...(color === \"decolour\" ? { className: colors.iconClass } : { fill: colors.icon })}\n />\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M12.277 30.5825C11.4418 30.5825 11.0355 29.8659 11.2059 29.1153C11.4275 28.0916 12.5838 25.0548 11.7145 23.6899C10.4361 21.6938 7.25562 21.9838 6.5397 20.9602C6.02371 20.2089 6.48355 19.478 7.19738 19.0493C8.79967 18.0257 11.902 18.3157 14.9191 16.3025C16.5895 15.2106 18.1237 12.9927 18.993 11.662C20.2203 9.78527 20.7487 9.39287 23.3226 9.39287H32.3376C33.7574 9.39287 34.202 11.8036 31.8852 12.0686C31.2886 12.1368 29.6977 12.3757 27.4306 12.6487C25.2658 12.9216 20.4589 13.5728 22.351 16.6608C23.7658 18.2816 26.7488 18.0769 27.4306 19.0493C27.9238 19.7225 27.4875 20.4384 26.9505 20.7824C25.3311 21.8061 21.8737 21.6938 18.8566 23.6899C16.8111 25.0548 15.1478 28.0916 14.4659 29.1153C13.9716 29.8659 13.1293 30.5825 12.294 30.5825H12.277Z\"\n {...(color === \"decolour\"\n ? { className: colors.iconInnerClass }\n : { fill: colors.iconInner })}\n />\n </svg>\n )}\n {showWordmark && <WordmarkSVG className={cn(colors.textClass)} />}\n </div>\n );\n },\n);\n\nLogo.displayName = \"Logo\";\n"],"names":[],"mappings":";;;;AAGA,MAAM,gBAAgB,CAAC,OAAkB,YAAyB;AAChE,MAAI,UAAU,cAAc;AAC1B,WAAO;AAAA,MACL,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,YAAY;AACxB,WAAO;AAAA,MACL,WAAW;AAAA,MACX,gBAAgB;AAAA,MAChB,WAAW;AAAA;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,eAAe;AAC3B,WAAO;AAAA,MACL,MACE,YAAY,SACR,uCACA;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,IAAA;AAAA,EAEf;AAEA,MAAI,UAAU,eAAe;AAC3B,WAAO;AAAA,MACL,MACE,YAAY,SACR,uCACA;AAAA,MACN,WACE,YAAY,SACR,uCACA;AAAA,MACN,WAAW;AAAA,IAAA;AAAA,EAEf;AAEA,SAAO;AAAA,IACL,MAAM;AAAA,IACN,WAAW;AAAA,IACX,WAAW;AAAA;AAAA,EAAA;AAEf;AAqBA,MAAM,cAAc,CAAC,EAAE,gBAAwC;AAC7D,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,OAAM;AAAA,MACN,eAAY;AAAA,MACZ;AAAA,MACA,eAAY;AAAA,MAEZ,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,GAAE;AAAA,UACF,MAAK;AAAA,QAAA;AAAA,MAAA;AAAA,IACP;AAAA,EAAA;AAGN;AAWO,MAAM,OAAO,MAAM;AAAA,EACxB,CAAC,EAAE,WAAW,UAAU,QAAQ,QAAQ,cAAc,GAAG,MAAA,GAAS,QAAQ;AACxE,UAAM,SAAS,cAAc,OAAO,OAAO;AAC3C,UAAM,WAAW,YAAY,UAAU,YAAY,UAAU,YAAY;AACzE,UAAM,eAAe,YAAY,UAAU,YAAY,cAAc,YAAY;AAGjF,UAAM,YAAY,MAAM,YAAY,IAAI,EAAE,MAAM,MAAA,IAAmB,CAAA;AAEnE,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,eAAY;AAAA,QACZ,WAAW;AAAA,UACT;AAAA,UACA,YAAY,aAAa,mBAAmB;AAAA,UAC5C,YAAY,UAAU;AAAA,UACtB;AAAA,QAAA;AAAA,QAED,GAAG;AAAA,QACH,GAAG;AAAA,QAEH,UAAA;AAAA,UAAA,YACC;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,OAAM;AAAA,cACN,WAAW,GAAG,YAAY,YAAY,SAAS,cAAc,SAAS;AAAA,cACtE,eAAY;AAAA,cACZ,eAAY;AAAA,cAEZ,UAAA;AAAA,gBAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,GAAE;AAAA,oBACD,GAAI,UAAU,aAAa,EAAE,WAAW,OAAO,cAAc,EAAE,MAAM,OAAO,KAAA;AAAA,kBAAK;AAAA,gBAAA;AAAA,gBAEpF;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAS;AAAA,oBACT,UAAS;AAAA,oBACT,GAAE;AAAA,oBACD,GAAI,UAAU,aACX,EAAE,WAAW,OAAO,mBACpB,EAAE,MAAM,OAAO,UAAA;AAAA,kBAAU;AAAA,gBAAA;AAAA,cAC/B;AAAA,YAAA;AAAA,UAAA;AAAA,UAGH,gBAAgB,oBAAC,aAAA,EAAY,WAAW,GAAG,OAAO,SAAS,EAAA,CAAG;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAGrE;AACF;AAEA,KAAK,cAAc;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1249,6 +1249,28 @@ export declare const EmojiIcon: React_2.ForwardRefExoticComponent<React_2.SVGAtt
|
|
|
1249
1249
|
className?: string;
|
|
1250
1250
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
1251
1251
|
|
|
1252
|
+
export declare const EmptyState: React_2.ForwardRefExoticComponent<EmptyStateProps & React_2.RefAttributes<HTMLElement>>;
|
|
1253
|
+
|
|
1254
|
+
export declare interface EmptyStateProps extends Omit<React_2.HTMLAttributes<HTMLElement>, "title"> {
|
|
1255
|
+
/**
|
|
1256
|
+
* Matches Figma property `Property 1` (`Default` / `centered`).
|
|
1257
|
+
* @default "default"
|
|
1258
|
+
*/
|
|
1259
|
+
variant?: EmptyStateVariant;
|
|
1260
|
+
/** Main heading. */
|
|
1261
|
+
title?: React_2.ReactNode;
|
|
1262
|
+
/** Supporting body copy. */
|
|
1263
|
+
description?: React_2.ReactNode;
|
|
1264
|
+
/** Top visual/illustration slot. */
|
|
1265
|
+
media?: React_2.ReactNode;
|
|
1266
|
+
/** Primary call-to-action node. */
|
|
1267
|
+
primaryAction?: React_2.ReactNode;
|
|
1268
|
+
/** Optional secondary action rendered below primary. */
|
|
1269
|
+
secondaryAction?: React_2.ReactNode;
|
|
1270
|
+
}
|
|
1271
|
+
|
|
1272
|
+
export declare type EmptyStateVariant = "default" | "centered";
|
|
1273
|
+
|
|
1252
1274
|
/** An "×" inside a filled circle icon for error states (20 × 20). */
|
|
1253
1275
|
export declare const ErrorCircleIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
1254
1276
|
className?: string;
|
|
@@ -1276,6 +1298,10 @@ export declare const EyeSlashIcon: React_2.ForwardRefExoticComponent<React_2.SVG
|
|
|
1276
1298
|
className?: string;
|
|
1277
1299
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
1278
1300
|
|
|
1301
|
+
export declare const FacebookIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
1302
|
+
className?: string;
|
|
1303
|
+
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
1304
|
+
|
|
1279
1305
|
export declare const FlagIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
1280
1306
|
className?: string;
|
|
1281
1307
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
@@ -1304,6 +1330,10 @@ export declare const GiftIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttr
|
|
|
1304
1330
|
className?: string;
|
|
1305
1331
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
1306
1332
|
|
|
1333
|
+
export declare const GoogleIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
1334
|
+
className?: string;
|
|
1335
|
+
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
1336
|
+
|
|
1307
1337
|
export declare const HelpIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
1308
1338
|
className?: string;
|
|
1309
1339
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
@@ -2729,6 +2759,10 @@ export declare const TrophyIcon: React_2.ForwardRefExoticComponent<React_2.SVGAt
|
|
|
2729
2759
|
className?: string;
|
|
2730
2760
|
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
2731
2761
|
|
|
2762
|
+
export declare const TwitterIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
2763
|
+
className?: string;
|
|
2764
|
+
} & React_2.RefAttributes<SVGSVGElement>>;
|
|
2765
|
+
|
|
2732
2766
|
/** An upload-to-cloud icon with an upward arrow (20 × 20). */
|
|
2733
2767
|
export declare const UploadCloudIcon: React_2.ForwardRefExoticComponent<React_2.SVGAttributes<SVGSVGElement> & {
|
|
2734
2768
|
className?: string;
|
package/dist/index.mjs
CHANGED
|
@@ -22,6 +22,7 @@ import { Dialog, DialogBody, DialogClose, DialogContent, DialogDescription, Dial
|
|
|
22
22
|
import { Divider } from "./components/Divider/Divider.mjs";
|
|
23
23
|
import { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerTitle, DrawerTrigger } from "./components/Drawer/Drawer.mjs";
|
|
24
24
|
import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from "./components/DropdownMenu/DropdownMenu.mjs";
|
|
25
|
+
import { EmptyState } from "./components/EmptyState/EmptyState.mjs";
|
|
25
26
|
import { IconButton } from "./components/IconButton/IconButton.mjs";
|
|
26
27
|
import { AddIcon } from "./components/Icons/AddIcon.mjs";
|
|
27
28
|
import { AIIcon } from "./components/Icons/AIIcon.mjs";
|
|
@@ -68,6 +69,7 @@ import { ExpandIcon } from "./components/Icons/ExpandIcon.mjs";
|
|
|
68
69
|
import { EyeClosedIcon } from "./components/Icons/EyeClosedIcon.mjs";
|
|
69
70
|
import { EyeIcon } from "./components/Icons/EyeIcon.mjs";
|
|
70
71
|
import { EyeSlashIcon } from "./components/Icons/EyeSlashIcon.mjs";
|
|
72
|
+
import { FacebookIcon } from "./components/Icons/FacebookIcon.mjs";
|
|
71
73
|
import { FlagIcon } from "./components/Icons/FlagIcon.mjs";
|
|
72
74
|
import { FlameIcon } from "./components/Icons/FlameIcon.mjs";
|
|
73
75
|
import { FolderIcon } from "./components/Icons/FolderIcon.mjs";
|
|
@@ -75,6 +77,7 @@ import { ForwardIcon } from "./components/Icons/ForwardIcon.mjs";
|
|
|
75
77
|
import { GalleryIcon } from "./components/Icons/GalleryIcon.mjs";
|
|
76
78
|
import { GenderIcon } from "./components/Icons/GenderIcon.mjs";
|
|
77
79
|
import { GiftIcon } from "./components/Icons/GiftIcon.mjs";
|
|
80
|
+
import { GoogleIcon } from "./components/Icons/GoogleIcon.mjs";
|
|
78
81
|
import { HelpIcon } from "./components/Icons/HelpIcon.mjs";
|
|
79
82
|
import { HomeIcon } from "./components/Icons/HomeIcon.mjs";
|
|
80
83
|
import { HourglassIcon } from "./components/Icons/HourglassIcon.mjs";
|
|
@@ -132,6 +135,7 @@ import { TickCircleOffIcon } from "./components/Icons/TickCircleOffIcon.mjs";
|
|
|
132
135
|
import { TickIcon } from "./components/Icons/TickIcon.mjs";
|
|
133
136
|
import { TrashBinIcon } from "./components/Icons/TrashBinIcon.mjs";
|
|
134
137
|
import { TrophyIcon } from "./components/Icons/TrophyIcon.mjs";
|
|
138
|
+
import { TwitterIcon } from "./components/Icons/TwitterIcon.mjs";
|
|
135
139
|
import { UploadCloudIcon } from "./components/Icons/UploadCloudIcon.mjs";
|
|
136
140
|
import { UploadIcon } from "./components/Icons/UploadIcon.mjs";
|
|
137
141
|
import { UserCircleIcon } from "./components/Icons/UserCircleIcon.mjs";
|
|
@@ -273,12 +277,14 @@ export {
|
|
|
273
277
|
DropdownMenuTrigger,
|
|
274
278
|
EditIcon,
|
|
275
279
|
EmojiIcon,
|
|
280
|
+
EmptyState,
|
|
276
281
|
ErrorCircleIcon,
|
|
277
282
|
ErrorIcon,
|
|
278
283
|
ExpandIcon,
|
|
279
284
|
EyeClosedIcon,
|
|
280
285
|
EyeIcon,
|
|
281
286
|
EyeSlashIcon,
|
|
287
|
+
FacebookIcon,
|
|
282
288
|
FlagIcon,
|
|
283
289
|
FlameIcon,
|
|
284
290
|
FolderIcon,
|
|
@@ -286,6 +292,7 @@ export {
|
|
|
286
292
|
GalleryIcon,
|
|
287
293
|
GenderIcon,
|
|
288
294
|
GiftIcon,
|
|
295
|
+
GoogleIcon,
|
|
289
296
|
HelpIcon,
|
|
290
297
|
HomeIcon,
|
|
291
298
|
HourglassIcon,
|
|
@@ -403,6 +410,7 @@ export {
|
|
|
403
410
|
TooltipTrigger,
|
|
404
411
|
TrashBinIcon,
|
|
405
412
|
TrophyIcon,
|
|
413
|
+
TwitterIcon,
|
|
406
414
|
UploadCloudIcon,
|
|
407
415
|
UploadIcon,
|
|
408
416
|
UserCircleIcon,
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fanvue/ui",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.4.0",
|
|
4
4
|
"description": "React component library built with Tailwind CSS for Fanvue ecosystem",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org",
|
|
@@ -158,7 +158,9 @@
|
|
|
158
158
|
"qs": ">=6.14.2",
|
|
159
159
|
"minimatch": ">=10.2.3",
|
|
160
160
|
"rollup": ">=4.59.0",
|
|
161
|
-
"storybook": ">=10.2.10"
|
|
161
|
+
"storybook": ">=10.2.10",
|
|
162
|
+
"picomatch": ">=4.0.4",
|
|
163
|
+
"micromatch>picomatch": "2.3.2"
|
|
162
164
|
}
|
|
163
165
|
},
|
|
164
166
|
"size-limit": [
|