@fanvue/ui 2.11.0 → 2.12.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.
|
@@ -26,20 +26,39 @@ const SIZE_CLASS = {
|
|
|
26
26
|
24: "size-6",
|
|
27
27
|
32: "size-8"
|
|
28
28
|
};
|
|
29
|
+
const LAYER_TRANSITION = "motion-safe:transition-opacity motion-safe:duration-150 motion-safe:ease-in-out";
|
|
30
|
+
const renderPath = (p) => p.sw !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
|
|
31
|
+
"path",
|
|
32
|
+
{
|
|
33
|
+
d: p.d,
|
|
34
|
+
stroke: "currentColor",
|
|
35
|
+
strokeWidth: p.sw,
|
|
36
|
+
strokeLinecap: "round",
|
|
37
|
+
strokeLinejoin: "round"
|
|
38
|
+
},
|
|
39
|
+
p.d
|
|
40
|
+
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
41
|
+
"path",
|
|
42
|
+
{
|
|
43
|
+
d: p.d,
|
|
44
|
+
fill: "currentColor",
|
|
45
|
+
fillRule: p.eo ? "evenodd" : void 0,
|
|
46
|
+
clipRule: p.eo ? "evenodd" : void 0
|
|
47
|
+
},
|
|
48
|
+
p.d
|
|
49
|
+
);
|
|
29
50
|
const BaseIcon = React__namespace.forwardRef(
|
|
30
51
|
({ variants, size = 24, filled, className, ...props }, ref) => {
|
|
31
52
|
const v = variants[size];
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
);
|
|
40
|
-
}
|
|
53
|
+
const outlined = v?.outlined ?? [];
|
|
54
|
+
const filledPaths = v?.filled;
|
|
55
|
+
const showFilled = !!(filled && filledPaths);
|
|
56
|
+
if (filled && !filledPaths && v && process.env.NODE_ENV !== "production") {
|
|
57
|
+
console.warn(
|
|
58
|
+
`[fanvue/ui] Icon at size=${size} has no 'filled' variant; falling back to outlined.`
|
|
59
|
+
);
|
|
41
60
|
}
|
|
42
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
61
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
43
62
|
"svg",
|
|
44
63
|
{
|
|
45
64
|
ref,
|
|
@@ -48,28 +67,10 @@ const BaseIcon = React__namespace.forwardRef(
|
|
|
48
67
|
"aria-hidden": "true",
|
|
49
68
|
className: cn.cn(SIZE_CLASS[size], className),
|
|
50
69
|
...props,
|
|
51
|
-
children:
|
|
52
|
-
(
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
d: p.d,
|
|
56
|
-
stroke: "currentColor",
|
|
57
|
-
strokeWidth: p.sw,
|
|
58
|
-
strokeLinecap: "round",
|
|
59
|
-
strokeLinejoin: "round"
|
|
60
|
-
},
|
|
61
|
-
p.d
|
|
62
|
-
) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
63
|
-
"path",
|
|
64
|
-
{
|
|
65
|
-
d: p.d,
|
|
66
|
-
fill: "currentColor",
|
|
67
|
-
fillRule: p.eo ? "evenodd" : void 0,
|
|
68
|
-
clipRule: p.eo ? "evenodd" : void 0
|
|
69
|
-
},
|
|
70
|
-
p.d
|
|
71
|
-
)
|
|
72
|
-
)
|
|
70
|
+
children: [
|
|
71
|
+
/* @__PURE__ */ jsxRuntime.jsx("g", { className: cn.cn(LAYER_TRANSITION, showFilled ? "opacity-0" : "opacity-100"), children: outlined.map(renderPath) }),
|
|
72
|
+
filledPaths && /* @__PURE__ */ jsxRuntime.jsx("g", { className: cn.cn(LAYER_TRANSITION, showFilled ? "opacity-100" : "opacity-0"), children: filledPaths.map(renderPath) })
|
|
73
|
+
]
|
|
73
74
|
}
|
|
74
75
|
);
|
|
75
76
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseIcon.cjs","sources":["../../../../src/components/Icons/BaseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { BaseIconProps, IconSize, IconVariants } from \"./types\";\n\nconst SIZE_CLASS: Record<IconSize, string> = {\n 16: \"size-4\",\n 24: \"size-6\",\n 32: \"size-8\",\n};\n\ninterface InternalBaseIconProps extends BaseIconProps {\n variants: IconVariants;\n}\n\n/**\n * Internal renderer for prop-based icons. Each public icon (e.g. `HeartIcon`)\n * is a thin wrapper that supplies its own `variants` table and re-exports\n * {@link BaseIconProps} as `*IconProps`. Not exported from the package.\n */\nexport const BaseIcon = React.forwardRef<SVGSVGElement, InternalBaseIconProps>(\n ({ variants, size = 24, filled, className, ...props }, ref) => {\n const v = variants[size];\n
|
|
1
|
+
{"version":3,"file":"BaseIcon.cjs","sources":["../../../../src/components/Icons/BaseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { BaseIconProps, IconPath, IconSize, IconVariants } from \"./types\";\n\nconst SIZE_CLASS: Record<IconSize, string> = {\n 16: \"size-4\",\n 24: \"size-6\",\n 32: \"size-8\",\n};\n\nconst LAYER_TRANSITION =\n \"motion-safe:transition-opacity motion-safe:duration-150 motion-safe:ease-in-out\";\n\ninterface InternalBaseIconProps extends BaseIconProps {\n variants: IconVariants;\n}\n\nconst renderPath = (p: IconPath) =>\n p.sw !== undefined ? (\n <path\n key={p.d}\n d={p.d}\n stroke=\"currentColor\"\n strokeWidth={p.sw}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n ) : (\n <path\n key={p.d}\n d={p.d}\n fill=\"currentColor\"\n fillRule={p.eo ? \"evenodd\" : undefined}\n clipRule={p.eo ? \"evenodd\" : undefined}\n />\n );\n\n/**\n * Internal renderer for prop-based icons. Each public icon (e.g. `HeartIcon`)\n * is a thin wrapper that supplies its own `variants` table and re-exports\n * {@link BaseIconProps} as `*IconProps`. Not exported from the package.\n *\n * When a `filled` variant exists, both layers are rendered simultaneously and\n * the `filled` prop crossfades between them. The same `<svg>` and `<g>` nodes\n * persist across toggles so the transition is visible rather than an instant\n * remount.\n */\nexport const BaseIcon = React.forwardRef<SVGSVGElement, InternalBaseIconProps>(\n ({ variants, size = 24, filled, className, ...props }, ref) => {\n const v = variants[size];\n const outlined = v?.outlined ?? [];\n const filledPaths = v?.filled;\n const showFilled = !!(filled && filledPaths);\n\n if (filled && !filledPaths && v && process.env.NODE_ENV !== \"production\") {\n console.warn(\n `[fanvue/ui] Icon at size=${size} has no 'filled' variant; falling back to outlined.`,\n );\n }\n\n return (\n <svg\n ref={ref}\n viewBox={`0 0 ${size} ${size}`}\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(SIZE_CLASS[size], className)}\n {...props}\n >\n <g className={cn(LAYER_TRANSITION, showFilled ? \"opacity-0\" : \"opacity-100\")}>\n {outlined.map(renderPath)}\n </g>\n {filledPaths && (\n <g className={cn(LAYER_TRANSITION, showFilled ? \"opacity-100\" : \"opacity-0\")}>\n {filledPaths.map(renderPath)}\n </g>\n )}\n </svg>\n );\n },\n);\n\nBaseIcon.displayName = \"BaseIcon\";\n"],"names":["jsx","React","jsxs","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAIA,MAAM,aAAuC;AAAA,EAC3C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,mBACJ;AAMF,MAAM,aAAa,CAAC,MAClB,EAAE,OAAO,SACPA,2BAAAA;AAAAA,EAAC;AAAA,EAAA;AAAA,IAEC,GAAG,EAAE;AAAA,IACL,QAAO;AAAA,IACP,aAAa,EAAE;AAAA,IACf,eAAc;AAAA,IACd,gBAAe;AAAA,EAAA;AAAA,EALV,EAAE;AAMT,IAEAA,2BAAAA;AAAAA,EAAC;AAAA,EAAA;AAAA,IAEC,GAAG,EAAE;AAAA,IACL,MAAK;AAAA,IACL,UAAU,EAAE,KAAK,YAAY;AAAA,IAC7B,UAAU,EAAE,KAAK,YAAY;AAAA,EAAA;AAAA,EAJxB,EAAE;AAKT;AAaG,MAAM,WAAWC,iBAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,OAAO,IAAI,QAAQ,WAAW,GAAG,MAAA,GAAS,QAAQ;AAC7D,UAAM,IAAI,SAAS,IAAI;AACvB,UAAM,WAAW,GAAG,YAAY,CAAA;AAChC,UAAM,cAAc,GAAG;AACvB,UAAM,aAAa,CAAC,EAAE,UAAU;AAEhC,QAAI,UAAU,CAAC,eAAe,KAAK,QAAQ,IAAI,aAAa,cAAc;AACxE,cAAQ;AAAA,QACN,4BAA4B,IAAI;AAAA,MAAA;AAAA,IAEpC;AAEA,WACEC,2BAAAA;AAAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAS,OAAO,IAAI,IAAI,IAAI;AAAA,QAC5B,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAWC,GAAAA,GAAG,WAAW,IAAI,GAAG,SAAS;AAAA,QACxC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAAH,2BAAAA,IAAC,KAAA,EAAE,WAAWG,GAAAA,GAAG,kBAAkB,aAAa,cAAc,aAAa,GACxE,UAAA,SAAS,IAAI,UAAU,EAAA,CAC1B;AAAA,UACC,eACCH,2BAAAA,IAAC,KAAA,EAAE,WAAWG,GAAAA,GAAG,kBAAkB,aAAa,gBAAgB,WAAW,GACxE,UAAA,YAAY,IAAI,UAAU,EAAA,CAC7B;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,SAAS,cAAc;;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { cn } from "../../utils/cn.mjs";
|
|
5
5
|
const SIZE_CLASS = {
|
|
@@ -7,20 +7,39 @@ const SIZE_CLASS = {
|
|
|
7
7
|
24: "size-6",
|
|
8
8
|
32: "size-8"
|
|
9
9
|
};
|
|
10
|
+
const LAYER_TRANSITION = "motion-safe:transition-opacity motion-safe:duration-150 motion-safe:ease-in-out";
|
|
11
|
+
const renderPath = (p) => p.sw !== void 0 ? /* @__PURE__ */ jsx(
|
|
12
|
+
"path",
|
|
13
|
+
{
|
|
14
|
+
d: p.d,
|
|
15
|
+
stroke: "currentColor",
|
|
16
|
+
strokeWidth: p.sw,
|
|
17
|
+
strokeLinecap: "round",
|
|
18
|
+
strokeLinejoin: "round"
|
|
19
|
+
},
|
|
20
|
+
p.d
|
|
21
|
+
) : /* @__PURE__ */ jsx(
|
|
22
|
+
"path",
|
|
23
|
+
{
|
|
24
|
+
d: p.d,
|
|
25
|
+
fill: "currentColor",
|
|
26
|
+
fillRule: p.eo ? "evenodd" : void 0,
|
|
27
|
+
clipRule: p.eo ? "evenodd" : void 0
|
|
28
|
+
},
|
|
29
|
+
p.d
|
|
30
|
+
);
|
|
10
31
|
const BaseIcon = React.forwardRef(
|
|
11
32
|
({ variants, size = 24, filled, className, ...props }, ref) => {
|
|
12
33
|
const v = variants[size];
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
);
|
|
21
|
-
}
|
|
34
|
+
const outlined = v?.outlined ?? [];
|
|
35
|
+
const filledPaths = v?.filled;
|
|
36
|
+
const showFilled = !!(filled && filledPaths);
|
|
37
|
+
if (filled && !filledPaths && v && process.env.NODE_ENV !== "production") {
|
|
38
|
+
console.warn(
|
|
39
|
+
`[fanvue/ui] Icon at size=${size} has no 'filled' variant; falling back to outlined.`
|
|
40
|
+
);
|
|
22
41
|
}
|
|
23
|
-
return /* @__PURE__ */
|
|
42
|
+
return /* @__PURE__ */ jsxs(
|
|
24
43
|
"svg",
|
|
25
44
|
{
|
|
26
45
|
ref,
|
|
@@ -29,28 +48,10 @@ const BaseIcon = React.forwardRef(
|
|
|
29
48
|
"aria-hidden": "true",
|
|
30
49
|
className: cn(SIZE_CLASS[size], className),
|
|
31
50
|
...props,
|
|
32
|
-
children:
|
|
33
|
-
(
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
d: p.d,
|
|
37
|
-
stroke: "currentColor",
|
|
38
|
-
strokeWidth: p.sw,
|
|
39
|
-
strokeLinecap: "round",
|
|
40
|
-
strokeLinejoin: "round"
|
|
41
|
-
},
|
|
42
|
-
p.d
|
|
43
|
-
) : /* @__PURE__ */ jsx(
|
|
44
|
-
"path",
|
|
45
|
-
{
|
|
46
|
-
d: p.d,
|
|
47
|
-
fill: "currentColor",
|
|
48
|
-
fillRule: p.eo ? "evenodd" : void 0,
|
|
49
|
-
clipRule: p.eo ? "evenodd" : void 0
|
|
50
|
-
},
|
|
51
|
-
p.d
|
|
52
|
-
)
|
|
53
|
-
)
|
|
51
|
+
children: [
|
|
52
|
+
/* @__PURE__ */ jsx("g", { className: cn(LAYER_TRANSITION, showFilled ? "opacity-0" : "opacity-100"), children: outlined.map(renderPath) }),
|
|
53
|
+
filledPaths && /* @__PURE__ */ jsx("g", { className: cn(LAYER_TRANSITION, showFilled ? "opacity-100" : "opacity-0"), children: filledPaths.map(renderPath) })
|
|
54
|
+
]
|
|
54
55
|
}
|
|
55
56
|
);
|
|
56
57
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseIcon.mjs","sources":["../../../src/components/Icons/BaseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { BaseIconProps, IconSize, IconVariants } from \"./types\";\n\nconst SIZE_CLASS: Record<IconSize, string> = {\n 16: \"size-4\",\n 24: \"size-6\",\n 32: \"size-8\",\n};\n\ninterface InternalBaseIconProps extends BaseIconProps {\n variants: IconVariants;\n}\n\n/**\n * Internal renderer for prop-based icons. Each public icon (e.g. `HeartIcon`)\n * is a thin wrapper that supplies its own `variants` table and re-exports\n * {@link BaseIconProps} as `*IconProps`. Not exported from the package.\n */\nexport const BaseIcon = React.forwardRef<SVGSVGElement, InternalBaseIconProps>(\n ({ variants, size = 24, filled, className, ...props }, ref) => {\n const v = variants[size];\n
|
|
1
|
+
{"version":3,"file":"BaseIcon.mjs","sources":["../../../src/components/Icons/BaseIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@/utils/cn\";\nimport type { BaseIconProps, IconPath, IconSize, IconVariants } from \"./types\";\n\nconst SIZE_CLASS: Record<IconSize, string> = {\n 16: \"size-4\",\n 24: \"size-6\",\n 32: \"size-8\",\n};\n\nconst LAYER_TRANSITION =\n \"motion-safe:transition-opacity motion-safe:duration-150 motion-safe:ease-in-out\";\n\ninterface InternalBaseIconProps extends BaseIconProps {\n variants: IconVariants;\n}\n\nconst renderPath = (p: IconPath) =>\n p.sw !== undefined ? (\n <path\n key={p.d}\n d={p.d}\n stroke=\"currentColor\"\n strokeWidth={p.sw}\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n ) : (\n <path\n key={p.d}\n d={p.d}\n fill=\"currentColor\"\n fillRule={p.eo ? \"evenodd\" : undefined}\n clipRule={p.eo ? \"evenodd\" : undefined}\n />\n );\n\n/**\n * Internal renderer for prop-based icons. Each public icon (e.g. `HeartIcon`)\n * is a thin wrapper that supplies its own `variants` table and re-exports\n * {@link BaseIconProps} as `*IconProps`. Not exported from the package.\n *\n * When a `filled` variant exists, both layers are rendered simultaneously and\n * the `filled` prop crossfades between them. The same `<svg>` and `<g>` nodes\n * persist across toggles so the transition is visible rather than an instant\n * remount.\n */\nexport const BaseIcon = React.forwardRef<SVGSVGElement, InternalBaseIconProps>(\n ({ variants, size = 24, filled, className, ...props }, ref) => {\n const v = variants[size];\n const outlined = v?.outlined ?? [];\n const filledPaths = v?.filled;\n const showFilled = !!(filled && filledPaths);\n\n if (filled && !filledPaths && v && process.env.NODE_ENV !== \"production\") {\n console.warn(\n `[fanvue/ui] Icon at size=${size} has no 'filled' variant; falling back to outlined.`,\n );\n }\n\n return (\n <svg\n ref={ref}\n viewBox={`0 0 ${size} ${size}`}\n fill=\"none\"\n aria-hidden=\"true\"\n className={cn(SIZE_CLASS[size], className)}\n {...props}\n >\n <g className={cn(LAYER_TRANSITION, showFilled ? \"opacity-0\" : \"opacity-100\")}>\n {outlined.map(renderPath)}\n </g>\n {filledPaths && (\n <g className={cn(LAYER_TRANSITION, showFilled ? \"opacity-100\" : \"opacity-0\")}>\n {filledPaths.map(renderPath)}\n </g>\n )}\n </svg>\n );\n },\n);\n\nBaseIcon.displayName = \"BaseIcon\";\n"],"names":[],"mappings":";;;;AAIA,MAAM,aAAuC;AAAA,EAC3C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,MAAM,mBACJ;AAMF,MAAM,aAAa,CAAC,MAClB,EAAE,OAAO,SACP;AAAA,EAAC;AAAA,EAAA;AAAA,IAEC,GAAG,EAAE;AAAA,IACL,QAAO;AAAA,IACP,aAAa,EAAE;AAAA,IACf,eAAc;AAAA,IACd,gBAAe;AAAA,EAAA;AAAA,EALV,EAAE;AAMT,IAEA;AAAA,EAAC;AAAA,EAAA;AAAA,IAEC,GAAG,EAAE;AAAA,IACL,MAAK;AAAA,IACL,UAAU,EAAE,KAAK,YAAY;AAAA,IAC7B,UAAU,EAAE,KAAK,YAAY;AAAA,EAAA;AAAA,EAJxB,EAAE;AAKT;AAaG,MAAM,WAAW,MAAM;AAAA,EAC5B,CAAC,EAAE,UAAU,OAAO,IAAI,QAAQ,WAAW,GAAG,MAAA,GAAS,QAAQ;AAC7D,UAAM,IAAI,SAAS,IAAI;AACvB,UAAM,WAAW,GAAG,YAAY,CAAA;AAChC,UAAM,cAAc,GAAG;AACvB,UAAM,aAAa,CAAC,EAAE,UAAU;AAEhC,QAAI,UAAU,CAAC,eAAe,KAAK,QAAQ,IAAI,aAAa,cAAc;AACxE,cAAQ;AAAA,QACN,4BAA4B,IAAI;AAAA,MAAA;AAAA,IAEpC;AAEA,WACE;AAAA,MAAC;AAAA,MAAA;AAAA,QACC;AAAA,QACA,SAAS,OAAO,IAAI,IAAI,IAAI;AAAA,QAC5B,MAAK;AAAA,QACL,eAAY;AAAA,QACZ,WAAW,GAAG,WAAW,IAAI,GAAG,SAAS;AAAA,QACxC,GAAG;AAAA,QAEJ,UAAA;AAAA,UAAA,oBAAC,KAAA,EAAE,WAAW,GAAG,kBAAkB,aAAa,cAAc,aAAa,GACxE,UAAA,SAAS,IAAI,UAAU,EAAA,CAC1B;AAAA,UACC,eACC,oBAAC,KAAA,EAAE,WAAW,GAAG,kBAAkB,aAAa,gBAAgB,WAAW,GACxE,UAAA,YAAY,IAAI,UAAU,EAAA,CAC7B;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEA,SAAS,cAAc;"}
|