@xanui/core 1.2.4 → 1.2.6

package/hooks/useColorTemplate.d.ts

@@ -1,37 +1,26 @@
 import { ThemeColor } from '../theme/types.js';
 
 type UseColorTemplateType = "fill" | "outline" | "text" | "alpha";
+type UseColorTemplateColor = "common" | "brand" | "accent" | "success" | "info" | "warning" | "danger";
 declare const useColorTemplate: (name: keyof ThemeColor, type: UseColorTemplateType) => {
     bgcolor: string;
     color: string;
-    border: number;
-    borderColor: string;
+    border: string;
     hover: {
         color: string;
-        borderColor: string;
+        borderColor: any;
+        bgcolor?: undefined;
     };
 } | {
     bgcolor: string;
-    color: string;
-    hover: {
-        bgcolor: string;
-        color: string;
-    };
-} | {
-    bgcolor: string;
-    color: string;
+    color: any;
+    border: string;
     hover: {
         bgcolor: string;
-        color: string;
-    };
-} | {
-    bgcolor: string;
-    color: string;
-    hover: {
-        bgcolor: string;
-        color: string;
+        color: any;
+        borderColor?: undefined;
     };
 };
 
 export { useColorTemplate as default };
-export type { UseColorTemplateType };
+export type { UseColorTemplateColor, UseColorTemplateType };

package/hooks/useColorTemplate.js

@@ -1,41 +1,54 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var core=require('../theme/core.js');require('../css/getValue.js'),require('oncss'),require('../theme/ThemeDefaultOptions.js'),require('../theme/ThemeProvider.js'),require('react-state-bucket');const useColorTemplate = (name, type) => {
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var index=require('../css/index.js'),core=require('../theme/core.js');require('../theme/ThemeDefaultOptions.js'),require('../theme/ThemeProvider.js'),require('react-state-bucket');const useColorTemplate = (name, type) => {
     const theme = core.useTheme();
     let color = theme.colors[name];
-    let template = {
-        outline: {
+    let divider = theme.colors.divider.primary;
+    if (name === "common") {
+        color = Object.assign(Object.assign({}, color), { text: theme.colors.text.primary });
+    }
+    const if_common = (a, b) => name === "common" ? a : b;
+    if (type === "outline") {
+        return {
             bgcolor: "transparent",
-            color: color.text.primary,
-            border: 1,
-            borderColor: color.divider,
+            color: if_common(color.text, color.primary),
+            border: `1px solid ${divider}`,
             hover: {
-                color: color.text.primary,
+                color: if_common(color.text, color.secondary),
                 borderColor: color.divider,
             }
-        },
-        fill: {
-            bgcolor: color.primary,
-            color: color.text.primary,
+        };
+    }
+    else if (type === "fill") {
+        return {
+            bgcolor: if_common(color.secondary, color.primary),
+            color: color.text,
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.secondary,
-                color: color.text.primary,
+                bgcolor: if_common(color.secondary, color.secondary),
+                color: color.text,
             }
-        },
-        text: {
+        };
+    }
+    else if (type === "text") {
+        return {
             bgcolor: "transparent",
-            color: color.primary,
+            color: if_common(color.text, color.primary),
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.alpha,
-                color: color.primary,
+                bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.09)),
+                color: if_common(color.text, color.primary),
             }
-        },
-        alpha: {
-            bgcolor: color.alpha,
-            color: color.primary,
+        };
+    }
+    else if (type === "alpha") {
+        return {
+            bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.09)),
+            color: if_common(color.text, color.primary),
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.alpha,
-                color: color.primary,
+                bgcolor: if_common(color.secondary, index.alpha(color.primary, 0.15)),
+                color: if_common(color.text, color.primary),
             }
-        }
-    };
-    return template[type];
+        };
+    }
+    throw new Error(`useColorTemplate: Unknown type ${type}`);
 };exports.default=useColorTemplate;//# sourceMappingURL=useColorTemplate.js.map

package/hooks/useColorTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n    const theme = useTheme()\r\n    let color = theme.colors[name]\r\n\r\n    let template = {\r\n        outline: {\r\n            bgcolor: \"transparent\",\r\n            color: color.text.primary,\r\n            border: 1,\r\n            borderColor: color.divider,\r\n            hover: {\r\n                color: color.text.primary,\r\n                borderColor: color.divider,\r\n            }\r\n        },\r\n        fill: {\r\n            bgcolor: color.primary,\r\n            color: color.text.primary,\r\n            hover: {\r\n                bgcolor: color.secondary,\r\n                color: color.text.primary,\r\n            }\r\n        },\r\n        text: {\r\n            bgcolor: \"transparent\",\r\n            color: color.primary,\r\n            hover: {\r\n                bgcolor: color.alpha,\r\n                color: color.primary,\r\n            }\r\n        },\r\n        alpha: {\r\n            bgcolor: color.alpha,\r\n            color: color.primary,\r\n            hover: {\r\n                bgcolor: color.alpha,\r\n                color: color.primary,\r\n            }\r\n        }\r\n    }\r\n    return template[type]\r\n}\r\n\r\nexport default useColorTemplate"],"names":["useTheme"],"mappings":"wQAKA,MAAM,gBAAgB,GAAG,CAAC,IAAsB,EAAE,IAA0B,KAAI;AAC5E,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;IACxB,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;AAE9B,IAAA,IAAI,QAAQ,GAAG;AACX,QAAA,OAAO,EAAE;AACL,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AACzB,YAAA,MAAM,EAAE,CAAC;YACT,WAAW,EAAE,KAAK,CAAC,OAAO;AAC1B,YAAA,KAAK,EAAE;AACH,gBAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;gBACzB,WAAW,EAAE,KAAK,CAAC,OAAO;AAC7B;AACJ,SAAA;AACD,QAAA,IAAI,EAAE;YACF,OAAO,EAAE,KAAK,CAAC,OAAO;AACtB,YAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AACzB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,SAAS;AACxB,gBAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC5B;AACJ,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,KAAK,CAAC,OAAO;AACpB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,KAAK;gBACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACvB;AACJ,SAAA;AACD,QAAA,KAAK,EAAE;YACH,OAAO,EAAE,KAAK,CAAC,KAAK;YACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACpB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,KAAK;gBACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACvB;AACJ;KACJ;AACD,IAAA,OAAO,QAAQ,CAAC,IAAI,CAAC;AACzB"}
+{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { alpha } from \"../css\"\r\nimport { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\nexport type UseColorTemplateColor = \"common\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n    const theme = useTheme()\r\n    let color: any = theme.colors[name]\r\n    let divider = theme.colors.divider.primary\r\n\r\n    if (name === \"common\") {\r\n        color = {\r\n            ...color,\r\n            text: theme.colors.text.primary,\r\n        }\r\n    }\r\n\r\n    const if_common = (a: string, b: string) => name === \"common\" ? a : b\r\n\r\n    if (type === \"outline\") {\r\n        return {\r\n            bgcolor: \"transparent\",\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid ${divider}`,\r\n            hover: {\r\n                color: if_common(color.text, color.secondary),\r\n                borderColor: color.divider,\r\n            }\r\n        }\r\n    } else if (type === \"fill\") {\r\n        return {\r\n            bgcolor: if_common(color.secondary, color.primary),\r\n            color: color.text,\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, color.secondary),\r\n                color: color.text,\r\n            }\r\n        }\r\n    } else if (type === \"text\") {\r\n        return {\r\n            bgcolor: \"transparent\",\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n                color: if_common(color.text, color.primary),\r\n            }\r\n        }\r\n    } else if (type === \"alpha\") {\r\n        return {\r\n            bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, alpha(color.primary, 0.15)),\r\n                color: if_common(color.text, color.primary),\r\n            }\r\n        }\r\n    }\r\n\r\n    throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\nexport default useColorTemplate"],"names":["useTheme","alpha"],"mappings":"0PAOA,MAAM,gBAAgB,GAAG,CAAC,IAAsB,EAAE,IAA0B,KAAI;AAC5E,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;IACxB,IAAI,KAAK,GAAQ,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;IACnC,IAAI,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AAE1C,IAAA,IAAI,IAAI,KAAK,QAAQ,EAAE;AACnB,QAAA,KAAK,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACE,KAAK,CAAA,EAAA,EACR,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,GAClC;IACL;IAEA,MAAM,SAAS,GAAG,CAAC,CAAS,EAAE,CAAS,KAAK,IAAI,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC;AAErE,IAAA,IAAI,IAAI,KAAK,SAAS,EAAE;QACpB,OAAO;AACH,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;YAC3C,MAAM,EAAE,CAAA,UAAA,EAAa,OAAO,CAAA,CAAE;AAC9B,YAAA,KAAK,EAAE;gBACH,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;gBAC7C,WAAW,EAAE,KAAK,CAAC,OAAO;AAC7B;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,EAAE;QACxB,OAAO;YACH,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC;YAClD,KAAK,EAAE,KAAK,CAAC,IAAI;AACjB,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;gBACpD,KAAK,EAAE,KAAK,CAAC,IAAI;AACpB;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,EAAE;QACxB,OAAO;AACH,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC3C,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;AACH,gBAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAEC,WAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;gBAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC9C;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,OAAO,EAAE;QACzB,OAAO;AACH,YAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAEA,WAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;YAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC3C,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;AACH,gBAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAEA,WAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;gBAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC9C;SACJ;IACL;AAEA,IAAA,MAAM,IAAI,KAAK,CAAC,kCAAkC,IAAI,CAAA,CAAE,CAAC;AAC7D"}

package/hooks/useColorTemplate.mjs

@@ -1,41 +1,54 @@
-import {useTheme}from'../theme/core.mjs';import'../css/getValue.mjs';import'oncss';import'../theme/ThemeDefaultOptions.mjs';import'../theme/ThemeProvider.mjs';import'react-state-bucket';const useColorTemplate = (name, type) => {
+import {alpha}from'../css/index.mjs';import {useTheme}from'../theme/core.mjs';import'../theme/ThemeDefaultOptions.mjs';import'../theme/ThemeProvider.mjs';import'react-state-bucket';const useColorTemplate = (name, type) => {
     const theme = useTheme();
     let color = theme.colors[name];
-    let template = {
-        outline: {
+    let divider = theme.colors.divider.primary;
+    if (name === "common") {
+        color = Object.assign(Object.assign({}, color), { text: theme.colors.text.primary });
+    }
+    const if_common = (a, b) => name === "common" ? a : b;
+    if (type === "outline") {
+        return {
             bgcolor: "transparent",
-            color: color.text.primary,
-            border: 1,
-            borderColor: color.divider,
+            color: if_common(color.text, color.primary),
+            border: `1px solid ${divider}`,
             hover: {
-                color: color.text.primary,
+                color: if_common(color.text, color.secondary),
                 borderColor: color.divider,
             }
-        },
-        fill: {
-            bgcolor: color.primary,
-            color: color.text.primary,
+        };
+    }
+    else if (type === "fill") {
+        return {
+            bgcolor: if_common(color.secondary, color.primary),
+            color: color.text,
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.secondary,
-                color: color.text.primary,
+                bgcolor: if_common(color.secondary, color.secondary),
+                color: color.text,
             }
-        },
-        text: {
+        };
+    }
+    else if (type === "text") {
+        return {
             bgcolor: "transparent",
-            color: color.primary,
+            color: if_common(color.text, color.primary),
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.alpha,
-                color: color.primary,
+                bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),
+                color: if_common(color.text, color.primary),
             }
-        },
-        alpha: {
-            bgcolor: color.alpha,
-            color: color.primary,
+        };
+    }
+    else if (type === "alpha") {
+        return {
+            bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),
+            color: if_common(color.text, color.primary),
+            border: `1px solid transparent`,
             hover: {
-                bgcolor: color.alpha,
-                color: color.primary,
+                bgcolor: if_common(color.secondary, alpha(color.primary, 0.15)),
+                color: if_common(color.text, color.primary),
             }
-        }
-    };
-    return template[type];
+        };
+    }
+    throw new Error(`useColorTemplate: Unknown type ${type}`);
 };export{useColorTemplate as default};//# sourceMappingURL=useColorTemplate.mjs.map

package/hooks/useColorTemplate.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useColorTemplate.mjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n    const theme = useTheme()\r\n    let color = theme.colors[name]\r\n\r\n    let template = {\r\n        outline: {\r\n            bgcolor: \"transparent\",\r\n            color: color.text.primary,\r\n            border: 1,\r\n            borderColor: color.divider,\r\n            hover: {\r\n                color: color.text.primary,\r\n                borderColor: color.divider,\r\n            }\r\n        },\r\n        fill: {\r\n            bgcolor: color.primary,\r\n            color: color.text.primary,\r\n            hover: {\r\n                bgcolor: color.secondary,\r\n                color: color.text.primary,\r\n            }\r\n        },\r\n        text: {\r\n            bgcolor: \"transparent\",\r\n            color: color.primary,\r\n            hover: {\r\n                bgcolor: color.alpha,\r\n                color: color.primary,\r\n            }\r\n        },\r\n        alpha: {\r\n            bgcolor: color.alpha,\r\n            color: color.primary,\r\n            hover: {\r\n                bgcolor: color.alpha,\r\n                color: color.primary,\r\n            }\r\n        }\r\n    }\r\n    return template[type]\r\n}\r\n\r\nexport default useColorTemplate"],"names":[],"mappings":"0LAKA,MAAM,gBAAgB,GAAG,CAAC,IAAsB,EAAE,IAA0B,KAAI;AAC5E,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IACxB,IAAI,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;AAE9B,IAAA,IAAI,QAAQ,GAAG;AACX,QAAA,OAAO,EAAE;AACL,YAAA,OAAO,EAAE,aAAa;AACtB,YAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AACzB,YAAA,MAAM,EAAE,CAAC;YACT,WAAW,EAAE,KAAK,CAAC,OAAO;AAC1B,YAAA,KAAK,EAAE;AACH,gBAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;gBACzB,WAAW,EAAE,KAAK,CAAC,OAAO;AAC7B;AACJ,SAAA;AACD,QAAA,IAAI,EAAE;YACF,OAAO,EAAE,KAAK,CAAC,OAAO;AACtB,YAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AACzB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,SAAS;AACxB,gBAAA,KAAK,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC5B;AACJ,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,KAAK,CAAC,OAAO;AACpB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,KAAK;gBACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACvB;AACJ,SAAA;AACD,QAAA,KAAK,EAAE;YACH,OAAO,EAAE,KAAK,CAAC,KAAK;YACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACpB,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,KAAK,CAAC,KAAK;gBACpB,KAAK,EAAE,KAAK,CAAC,OAAO;AACvB;AACJ;KACJ;AACD,IAAA,OAAO,QAAQ,CAAC,IAAI,CAAC;AACzB"}
+{"version":3,"file":"useColorTemplate.mjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["import { alpha } from \"../css\"\r\nimport { useTheme } from \"../theme\"\r\nimport { ThemeColor } from \"../theme/types\"\r\n\r\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\r\nexport type UseColorTemplateColor = \"common\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\r\n\r\nconst useColorTemplate = (name: keyof ThemeColor, type: UseColorTemplateType) => {\r\n    const theme = useTheme()\r\n    let color: any = theme.colors[name]\r\n    let divider = theme.colors.divider.primary\r\n\r\n    if (name === \"common\") {\r\n        color = {\r\n            ...color,\r\n            text: theme.colors.text.primary,\r\n        }\r\n    }\r\n\r\n    const if_common = (a: string, b: string) => name === \"common\" ? a : b\r\n\r\n    if (type === \"outline\") {\r\n        return {\r\n            bgcolor: \"transparent\",\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid ${divider}`,\r\n            hover: {\r\n                color: if_common(color.text, color.secondary),\r\n                borderColor: color.divider,\r\n            }\r\n        }\r\n    } else if (type === \"fill\") {\r\n        return {\r\n            bgcolor: if_common(color.secondary, color.primary),\r\n            color: color.text,\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, color.secondary),\r\n                color: color.text,\r\n            }\r\n        }\r\n    } else if (type === \"text\") {\r\n        return {\r\n            bgcolor: \"transparent\",\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n                color: if_common(color.text, color.primary),\r\n            }\r\n        }\r\n    } else if (type === \"alpha\") {\r\n        return {\r\n            bgcolor: if_common(color.secondary, alpha(color.primary, 0.09)),\r\n            color: if_common(color.text, color.primary),\r\n            border: `1px solid transparent`,\r\n            hover: {\r\n                bgcolor: if_common(color.secondary, alpha(color.primary, 0.15)),\r\n                color: if_common(color.text, color.primary),\r\n            }\r\n        }\r\n    }\r\n\r\n    throw new Error(`useColorTemplate: Unknown type ${type}`);\r\n}\r\n\r\nexport default useColorTemplate"],"names":[],"mappings":"qLAOA,MAAM,gBAAgB,GAAG,CAAC,IAAsB,EAAE,IAA0B,KAAI;AAC5E,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IACxB,IAAI,KAAK,GAAQ,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;IACnC,IAAI,OAAO,GAAG,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AAE1C,IAAA,IAAI,IAAI,KAAK,QAAQ,EAAE;AACnB,QAAA,KAAK,GAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACE,KAAK,CAAA,EAAA,EACR,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,GAClC;IACL;IAEA,MAAM,SAAS,GAAG,CAAC,CAAS,EAAE,CAAS,KAAK,IAAI,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC;AAErE,IAAA,IAAI,IAAI,KAAK,SAAS,EAAE;QACpB,OAAO;AACH,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;YAC3C,MAAM,EAAE,CAAA,UAAA,EAAa,OAAO,CAAA,CAAE;AAC9B,YAAA,KAAK,EAAE;gBACH,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;gBAC7C,WAAW,EAAE,KAAK,CAAC,OAAO;AAC7B;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,EAAE;QACxB,OAAO;YACH,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC;YAClD,KAAK,EAAE,KAAK,CAAC,IAAI;AACjB,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;gBACH,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC;gBACpD,KAAK,EAAE,KAAK,CAAC,IAAI;AACpB;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,MAAM,EAAE;QACxB,OAAO;AACH,YAAA,OAAO,EAAE,aAAa;YACtB,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC3C,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;AACH,gBAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;gBAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC9C;SACJ;IACL;AAAO,SAAA,IAAI,IAAI,KAAK,OAAO,EAAE;QACzB,OAAO;AACH,YAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;YAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC3C,YAAA,MAAM,EAAE,CAAA,qBAAA,CAAuB;AAC/B,YAAA,KAAK,EAAE;AACH,gBAAA,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;gBAC/D,KAAK,EAAE,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC;AAC9C;SACJ;IACL;AAEA,IAAA,MAAM,IAAI,KAAK,CAAC,kCAAkC,IAAI,CAAA,CAAE,CAAC;AAC7D"}

package/hooks/useScrollbar.js

@@ -4,9 +4,9 @@
         console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`);
         theme = core.getTheme("light");
     }
-    thumbSize = thumbSize || 10;
-    thumbColor = thumbColor || theme.colors.surface.primary;
-    trackColor = trackColor || theme.colors.surface.primary;
+    thumbSize = thumbSize || 12;
+    thumbColor = thumbColor || theme.colors.divider.secondary;
+    trackColor = trackColor || theme.colors.divider.primary;
     root_cls = root_cls || "";
     let clss = {
         "*": root_cls ? `${root_cls} *` : `*`,
@@ -27,15 +27,15 @@
             },
             [clss["scrollbarThumb"]]: {
                 backgroundColor: thumbColor,
-                borderRadius: "5px",
-                border: "2px solid #f4f4f4",
+                borderRadius: "6px",
+                border: `2px solid ${theme.colors.common.primary}`,
             },
             [clss["scrollbarThumbHover"]]: {
                 backgroundColor: thumbColor,
             },
             [clss['scrollbarTrack']]: {
                 backgroundColor: trackColor,
-                borderRadius: "5px",
+                borderRadius: "6px",
             },
         }
     }, {

package/hooks/useScrollbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"useScrollbar.js","sources":["../../src/hooks/useScrollbar.ts"],"sourcesContent":["import { getTheme } from '../theme'\r\nimport { css } from '../css'\r\nimport { ThemeOptions } from '../theme/types';\r\n\r\nexport type UseScrollbarOption = {\r\n   themeName: string\r\n   root_cls?: string;\r\n   thumbSize?: number\r\n   thumbColor?: string\r\n   trackColor?: string\r\n}\r\n\r\ntype ClassName = string\r\n\r\nconst useScrollbar = ({ themeName, root_cls, thumbSize, thumbColor, trackColor }: UseScrollbarOption): ClassName => {\r\n   let theme = getTheme(themeName)\r\n   if (!theme) {\r\n      console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`)\r\n      theme = getTheme(\"light\") as ThemeOptions\r\n   }\r\n\r\n   thumbSize = thumbSize || 10\r\n   thumbColor = thumbColor || theme.colors.surface.primary\r\n   trackColor = trackColor || theme.colors.surface.primary\r\n   root_cls = root_cls || \"\"\r\n\r\n   let clss = {\r\n      \"*\": root_cls ? `${root_cls} *` : `*`,\r\n      \"scrollbar\": root_cls ? `${root_cls}::-webkit-scrollbar, ${root_cls} ::-webkit-scrollbar` : `::-webkit-scrollbar`,\r\n      \"scrollbarThumb\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb, ${root_cls} ::-webkit-scrollbar-thumb` : `::-webkit-scrollbar-thumb`,\r\n      \"scrollbarThumbHover\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb:hover, ${root_cls} ::-webkit-scrollbar-thumb:hover` : `::-webkit-scrollbar-thumb:hover`,\r\n      \"scrollbarTrack\": root_cls ? `${root_cls}::-webkit-scrollbar-track, ${root_cls} ::-webkit-scrollbar-track` : `::-webkit-scrollbar-track`,\r\n   }\r\n\r\n   return css({\r\n      \"@global\": {\r\n         [clss['*']]: {\r\n            scrollbarWidth: \"thin\",\r\n            scrollbarColor: `${thumbColor} ${trackColor}`,\r\n         },\r\n         [clss[\"scrollbar\"]]: {\r\n            width: thumbSize,\r\n            height: thumbSize,\r\n         },\r\n         [clss[\"scrollbarThumb\"]]: {\r\n            backgroundColor: thumbColor,\r\n            borderRadius: \"5px\",\r\n            border: \"2px solid #f4f4f4\",\r\n         },\r\n         [clss[\"scrollbarThumbHover\"]]: {\r\n            backgroundColor: thumbColor,\r\n         },\r\n         [clss['scrollbarTrack']]: {\r\n            backgroundColor: trackColor,\r\n            borderRadius: \"5px\",\r\n         },\r\n      }\r\n   }, {\r\n      injectStyle: typeof window !== 'undefined'\r\n   }) as any\r\n}\r\n\r\nexport default useScrollbar\r\n"],"names":["getTheme","css"],"mappings":"0PAcA,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAsB,KAAe;AAChH,IAAA,IAAI,KAAK,GAAGA,aAAQ,CAAC,SAAS,CAAC;IAC/B,IAAI,CAAC,KAAK,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,4BAA4B,SAAS,CAAA,6DAAA,CAA+D,CAAC;AACnH,QAAA,KAAK,GAAGA,aAAQ,CAAC,OAAO,CAAiB;IAC5C;AAEA,IAAA,SAAS,GAAG,SAAS,IAAI,EAAE;IAC3B,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;IACvD,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AACvD,IAAA,QAAQ,GAAG,QAAQ,IAAI,EAAE;AAEzB,IAAA,IAAI,IAAI,GAAG;QACR,GAAG,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI,GAAG,CAAA,CAAA,CAAG;AACrC,QAAA,WAAW,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,qBAAA,EAAwB,QAAQ,CAAA,oBAAA,CAAsB,GAAG,CAAA,mBAAA,CAAqB;AACjH,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;AACxI,QAAA,qBAAqB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,iCAAA,EAAoC,QAAQ,CAAA,gCAAA,CAAkC,GAAG,CAAA,+BAAA,CAAiC;AAC/J,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;KAC1I;AAED,IAAA,OAAOC,SAAG,CAAC;AACR,QAAA,SAAS,EAAE;AACR,YAAA,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG;AACV,gBAAA,cAAc,EAAE,MAAM;AACtB,gBAAA,cAAc,EAAE,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,UAAU,CAAA,CAAE;AAC/C,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG;AAClB,gBAAA,KAAK,EAAE,SAAS;AAChB,gBAAA,MAAM,EAAE,SAAS;AACnB,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACnB,gBAAA,MAAM,EAAE,mBAAmB;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG;AAC5B,gBAAA,eAAe,EAAE,UAAU;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACrB,aAAA;AACH;KACH,EAAE;AACA,QAAA,WAAW,EAAE,OAAO,MAAM,KAAK;AACjC,KAAA,CAAQ;AACZ"}
+{"version":3,"file":"useScrollbar.js","sources":["../../src/hooks/useScrollbar.ts"],"sourcesContent":["import { getTheme } from '../theme'\r\nimport { css } from '../css'\r\nimport { ThemeOptions } from '../theme/types';\r\n\r\nexport type UseScrollbarOption = {\r\n   themeName: string\r\n   root_cls?: string;\r\n   thumbSize?: number\r\n   thumbColor?: string\r\n   trackColor?: string\r\n}\r\n\r\ntype ClassName = string\r\n\r\nconst useScrollbar = ({ themeName, root_cls, thumbSize, thumbColor, trackColor }: UseScrollbarOption): ClassName => {\r\n   let theme = getTheme(themeName)\r\n   if (!theme) {\r\n      console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`)\r\n      theme = getTheme(\"light\") as ThemeOptions\r\n   }\r\n\r\n   thumbSize = thumbSize || 12\r\n   thumbColor = thumbColor || theme.colors.divider.secondary\r\n   trackColor = trackColor || theme.colors.divider.primary\r\n   root_cls = root_cls || \"\"\r\n\r\n   let clss = {\r\n      \"*\": root_cls ? `${root_cls} *` : `*`,\r\n      \"scrollbar\": root_cls ? `${root_cls}::-webkit-scrollbar, ${root_cls} ::-webkit-scrollbar` : `::-webkit-scrollbar`,\r\n      \"scrollbarThumb\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb, ${root_cls} ::-webkit-scrollbar-thumb` : `::-webkit-scrollbar-thumb`,\r\n      \"scrollbarThumbHover\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb:hover, ${root_cls} ::-webkit-scrollbar-thumb:hover` : `::-webkit-scrollbar-thumb:hover`,\r\n      \"scrollbarTrack\": root_cls ? `${root_cls}::-webkit-scrollbar-track, ${root_cls} ::-webkit-scrollbar-track` : `::-webkit-scrollbar-track`,\r\n   }\r\n\r\n   return css({\r\n      \"@global\": {\r\n         [clss['*']]: {\r\n            scrollbarWidth: \"thin\",\r\n            scrollbarColor: `${thumbColor} ${trackColor}`,\r\n         },\r\n         [clss[\"scrollbar\"]]: {\r\n            width: thumbSize,\r\n            height: thumbSize,\r\n         },\r\n         [clss[\"scrollbarThumb\"]]: {\r\n            backgroundColor: thumbColor,\r\n            borderRadius: \"6px\",\r\n            border: `2px solid ${theme.colors.common.primary}`,\r\n         },\r\n         [clss[\"scrollbarThumbHover\"]]: {\r\n            backgroundColor: thumbColor,\r\n         },\r\n         [clss['scrollbarTrack']]: {\r\n            backgroundColor: trackColor,\r\n            borderRadius: \"6px\",\r\n         },\r\n      }\r\n   }, {\r\n      injectStyle: typeof window !== 'undefined'\r\n   }) as any\r\n}\r\n\r\nexport default useScrollbar\r\n"],"names":["getTheme","css"],"mappings":"0PAcA,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAsB,KAAe;AAChH,IAAA,IAAI,KAAK,GAAGA,aAAQ,CAAC,SAAS,CAAC;IAC/B,IAAI,CAAC,KAAK,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,4BAA4B,SAAS,CAAA,6DAAA,CAA+D,CAAC;AACnH,QAAA,KAAK,GAAGA,aAAQ,CAAC,OAAO,CAAiB;IAC5C;AAEA,IAAA,SAAS,GAAG,SAAS,IAAI,EAAE;IAC3B,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS;IACzD,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AACvD,IAAA,QAAQ,GAAG,QAAQ,IAAI,EAAE;AAEzB,IAAA,IAAI,IAAI,GAAG;QACR,GAAG,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI,GAAG,CAAA,CAAA,CAAG;AACrC,QAAA,WAAW,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,qBAAA,EAAwB,QAAQ,CAAA,oBAAA,CAAsB,GAAG,CAAA,mBAAA,CAAqB;AACjH,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;AACxI,QAAA,qBAAqB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,iCAAA,EAAoC,QAAQ,CAAA,gCAAA,CAAkC,GAAG,CAAA,+BAAA,CAAiC;AAC/J,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;KAC1I;AAED,IAAA,OAAOC,SAAG,CAAC;AACR,QAAA,SAAS,EAAE;AACR,YAAA,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG;AACV,gBAAA,cAAc,EAAE,MAAM;AACtB,gBAAA,cAAc,EAAE,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,UAAU,CAAA,CAAE;AAC/C,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG;AAClB,gBAAA,KAAK,EAAE,SAAS;AAChB,gBAAA,MAAM,EAAE,SAAS;AACnB,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;gBACnB,MAAM,EAAE,aAAa,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAA,CAAE;AACpD,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG;AAC5B,gBAAA,eAAe,EAAE,UAAU;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACrB,aAAA;AACH;KACH,EAAE;AACA,QAAA,WAAW,EAAE,OAAO,MAAM,KAAK;AACjC,KAAA,CAAQ;AACZ"}

package/hooks/useScrollbar.mjs

@@ -4,9 +4,9 @@ import {getTheme}from'../theme/core.mjs';import {css}from'../css/index.mjs';impo
         console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`);
         theme = getTheme("light");
     }
-    thumbSize = thumbSize || 10;
-    thumbColor = thumbColor || theme.colors.surface.primary;
-    trackColor = trackColor || theme.colors.surface.primary;
+    thumbSize = thumbSize || 12;
+    thumbColor = thumbColor || theme.colors.divider.secondary;
+    trackColor = trackColor || theme.colors.divider.primary;
     root_cls = root_cls || "";
     let clss = {
         "*": root_cls ? `${root_cls} *` : `*`,
@@ -27,15 +27,15 @@ import {getTheme}from'../theme/core.mjs';import {css}from'../css/index.mjs';impo
             },
             [clss["scrollbarThumb"]]: {
                 backgroundColor: thumbColor,
-                borderRadius: "5px",
-                border: "2px solid #f4f4f4",
+                borderRadius: "6px",
+                border: `2px solid ${theme.colors.common.primary}`,
             },
             [clss["scrollbarThumbHover"]]: {
                 backgroundColor: thumbColor,
             },
             [clss['scrollbarTrack']]: {
                 backgroundColor: trackColor,
-                borderRadius: "5px",
+                borderRadius: "6px",
             },
         }
     }, {

package/hooks/useScrollbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useScrollbar.mjs","sources":["../../src/hooks/useScrollbar.ts"],"sourcesContent":["import { getTheme } from '../theme'\r\nimport { css } from '../css'\r\nimport { ThemeOptions } from '../theme/types';\r\n\r\nexport type UseScrollbarOption = {\r\n   themeName: string\r\n   root_cls?: string;\r\n   thumbSize?: number\r\n   thumbColor?: string\r\n   trackColor?: string\r\n}\r\n\r\ntype ClassName = string\r\n\r\nconst useScrollbar = ({ themeName, root_cls, thumbSize, thumbColor, trackColor }: UseScrollbarOption): ClassName => {\r\n   let theme = getTheme(themeName)\r\n   if (!theme) {\r\n      console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`)\r\n      theme = getTheme(\"light\") as ThemeOptions\r\n   }\r\n\r\n   thumbSize = thumbSize || 10\r\n   thumbColor = thumbColor || theme.colors.surface.primary\r\n   trackColor = trackColor || theme.colors.surface.primary\r\n   root_cls = root_cls || \"\"\r\n\r\n   let clss = {\r\n      \"*\": root_cls ? `${root_cls} *` : `*`,\r\n      \"scrollbar\": root_cls ? `${root_cls}::-webkit-scrollbar, ${root_cls} ::-webkit-scrollbar` : `::-webkit-scrollbar`,\r\n      \"scrollbarThumb\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb, ${root_cls} ::-webkit-scrollbar-thumb` : `::-webkit-scrollbar-thumb`,\r\n      \"scrollbarThumbHover\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb:hover, ${root_cls} ::-webkit-scrollbar-thumb:hover` : `::-webkit-scrollbar-thumb:hover`,\r\n      \"scrollbarTrack\": root_cls ? `${root_cls}::-webkit-scrollbar-track, ${root_cls} ::-webkit-scrollbar-track` : `::-webkit-scrollbar-track`,\r\n   }\r\n\r\n   return css({\r\n      \"@global\": {\r\n         [clss['*']]: {\r\n            scrollbarWidth: \"thin\",\r\n            scrollbarColor: `${thumbColor} ${trackColor}`,\r\n         },\r\n         [clss[\"scrollbar\"]]: {\r\n            width: thumbSize,\r\n            height: thumbSize,\r\n         },\r\n         [clss[\"scrollbarThumb\"]]: {\r\n            backgroundColor: thumbColor,\r\n            borderRadius: \"5px\",\r\n            border: \"2px solid #f4f4f4\",\r\n         },\r\n         [clss[\"scrollbarThumbHover\"]]: {\r\n            backgroundColor: thumbColor,\r\n         },\r\n         [clss['scrollbarTrack']]: {\r\n            backgroundColor: trackColor,\r\n            borderRadius: \"5px\",\r\n         },\r\n      }\r\n   }, {\r\n      injectStyle: typeof window !== 'undefined'\r\n   }) as any\r\n}\r\n\r\nexport default useScrollbar\r\n"],"names":[],"mappings":"mLAcA,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAsB,KAAe;AAChH,IAAA,IAAI,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC;IAC/B,IAAI,CAAC,KAAK,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,4BAA4B,SAAS,CAAA,6DAAA,CAA+D,CAAC;AACnH,QAAA,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAiB;IAC5C;AAEA,IAAA,SAAS,GAAG,SAAS,IAAI,EAAE;IAC3B,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;IACvD,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AACvD,IAAA,QAAQ,GAAG,QAAQ,IAAI,EAAE;AAEzB,IAAA,IAAI,IAAI,GAAG;QACR,GAAG,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI,GAAG,CAAA,CAAA,CAAG;AACrC,QAAA,WAAW,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,qBAAA,EAAwB,QAAQ,CAAA,oBAAA,CAAsB,GAAG,CAAA,mBAAA,CAAqB;AACjH,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;AACxI,QAAA,qBAAqB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,iCAAA,EAAoC,QAAQ,CAAA,gCAAA,CAAkC,GAAG,CAAA,+BAAA,CAAiC;AAC/J,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;KAC1I;AAED,IAAA,OAAO,GAAG,CAAC;AACR,QAAA,SAAS,EAAE;AACR,YAAA,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG;AACV,gBAAA,cAAc,EAAE,MAAM;AACtB,gBAAA,cAAc,EAAE,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,UAAU,CAAA,CAAE;AAC/C,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG;AAClB,gBAAA,KAAK,EAAE,SAAS;AAChB,gBAAA,MAAM,EAAE,SAAS;AACnB,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACnB,gBAAA,MAAM,EAAE,mBAAmB;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG;AAC5B,gBAAA,eAAe,EAAE,UAAU;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACrB,aAAA;AACH;KACH,EAAE;AACA,QAAA,WAAW,EAAE,OAAO,MAAM,KAAK;AACjC,KAAA,CAAQ;AACZ"}
+{"version":3,"file":"useScrollbar.mjs","sources":["../../src/hooks/useScrollbar.ts"],"sourcesContent":["import { getTheme } from '../theme'\r\nimport { css } from '../css'\r\nimport { ThemeOptions } from '../theme/types';\r\n\r\nexport type UseScrollbarOption = {\r\n   themeName: string\r\n   root_cls?: string;\r\n   thumbSize?: number\r\n   thumbColor?: string\r\n   trackColor?: string\r\n}\r\n\r\ntype ClassName = string\r\n\r\nconst useScrollbar = ({ themeName, root_cls, thumbSize, thumbColor, trackColor }: UseScrollbarOption): ClassName => {\r\n   let theme = getTheme(themeName)\r\n   if (!theme) {\r\n      console.error(`useScrollbar: The theme '${themeName}' is not defined. Please make sure to use a valid theme name.`)\r\n      theme = getTheme(\"light\") as ThemeOptions\r\n   }\r\n\r\n   thumbSize = thumbSize || 12\r\n   thumbColor = thumbColor || theme.colors.divider.secondary\r\n   trackColor = trackColor || theme.colors.divider.primary\r\n   root_cls = root_cls || \"\"\r\n\r\n   let clss = {\r\n      \"*\": root_cls ? `${root_cls} *` : `*`,\r\n      \"scrollbar\": root_cls ? `${root_cls}::-webkit-scrollbar, ${root_cls} ::-webkit-scrollbar` : `::-webkit-scrollbar`,\r\n      \"scrollbarThumb\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb, ${root_cls} ::-webkit-scrollbar-thumb` : `::-webkit-scrollbar-thumb`,\r\n      \"scrollbarThumbHover\": root_cls ? `${root_cls}::-webkit-scrollbar-thumb:hover, ${root_cls} ::-webkit-scrollbar-thumb:hover` : `::-webkit-scrollbar-thumb:hover`,\r\n      \"scrollbarTrack\": root_cls ? `${root_cls}::-webkit-scrollbar-track, ${root_cls} ::-webkit-scrollbar-track` : `::-webkit-scrollbar-track`,\r\n   }\r\n\r\n   return css({\r\n      \"@global\": {\r\n         [clss['*']]: {\r\n            scrollbarWidth: \"thin\",\r\n            scrollbarColor: `${thumbColor} ${trackColor}`,\r\n         },\r\n         [clss[\"scrollbar\"]]: {\r\n            width: thumbSize,\r\n            height: thumbSize,\r\n         },\r\n         [clss[\"scrollbarThumb\"]]: {\r\n            backgroundColor: thumbColor,\r\n            borderRadius: \"6px\",\r\n            border: `2px solid ${theme.colors.common.primary}`,\r\n         },\r\n         [clss[\"scrollbarThumbHover\"]]: {\r\n            backgroundColor: thumbColor,\r\n         },\r\n         [clss['scrollbarTrack']]: {\r\n            backgroundColor: trackColor,\r\n            borderRadius: \"6px\",\r\n         },\r\n      }\r\n   }, {\r\n      injectStyle: typeof window !== 'undefined'\r\n   }) as any\r\n}\r\n\r\nexport default useScrollbar\r\n"],"names":[],"mappings":"mLAcA,MAAM,YAAY,GAAG,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAsB,KAAe;AAChH,IAAA,IAAI,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC;IAC/B,IAAI,CAAC,KAAK,EAAE;AACT,QAAA,OAAO,CAAC,KAAK,CAAC,4BAA4B,SAAS,CAAA,6DAAA,CAA+D,CAAC;AACnH,QAAA,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAiB;IAC5C;AAEA,IAAA,SAAS,GAAG,SAAS,IAAI,EAAE;IAC3B,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS;IACzD,UAAU,GAAG,UAAU,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO;AACvD,IAAA,QAAQ,GAAG,QAAQ,IAAI,EAAE;AAEzB,IAAA,IAAI,IAAI,GAAG;QACR,GAAG,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,EAAA,CAAI,GAAG,CAAA,CAAA,CAAG;AACrC,QAAA,WAAW,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,qBAAA,EAAwB,QAAQ,CAAA,oBAAA,CAAsB,GAAG,CAAA,mBAAA,CAAqB;AACjH,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;AACxI,QAAA,qBAAqB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,iCAAA,EAAoC,QAAQ,CAAA,gCAAA,CAAkC,GAAG,CAAA,+BAAA,CAAiC;AAC/J,QAAA,gBAAgB,EAAE,QAAQ,GAAG,CAAA,EAAG,QAAQ,CAAA,2BAAA,EAA8B,QAAQ,CAAA,0BAAA,CAA4B,GAAG,CAAA,yBAAA,CAA2B;KAC1I;AAED,IAAA,OAAO,GAAG,CAAC;AACR,QAAA,SAAS,EAAE;AACR,YAAA,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG;AACV,gBAAA,cAAc,EAAE,MAAM;AACtB,gBAAA,cAAc,EAAE,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,UAAU,CAAA,CAAE;AAC/C,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,WAAW,CAAC,GAAG;AAClB,gBAAA,KAAK,EAAE,SAAS;AAChB,gBAAA,MAAM,EAAE,SAAS;AACnB,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;gBACnB,MAAM,EAAE,aAAa,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAA,CAAE;AACpD,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,qBAAqB,CAAC,GAAG;AAC5B,gBAAA,eAAe,EAAE,UAAU;AAC7B,aAAA;AACD,YAAA,CAAC,IAAI,CAAC,gBAAgB,CAAC,GAAG;AACvB,gBAAA,eAAe,EAAE,UAAU;AAC3B,gBAAA,YAAY,EAAE,KAAK;AACrB,aAAA;AACH;KACH,EAAE;AACA,QAAA,WAAW,EAAE,OAAO,MAAM,KAAK;AACjC,KAAA,CAAQ;AACZ"}

package/index.d.ts

@@ -1,7 +1,7 @@
 export { default as Tag } from './Tag/index.js';
 export { default as useTagProps } from './Tag/useTagProps.js';
 export { UseAnimationProps, animationEases, default as useAnimation } from './hooks/useAnimation.js';
-export { UseColorTemplateType, default as useColorTemplate } from './hooks/useColorTemplate.js';
+export { UseColorTemplateColor, UseColorTemplateType, default as useColorTemplate } from './hooks/useColorTemplate.js';
 export { default as useBreakpoint } from './breakpoint/useBreakpoint.js';
 export { default as useBreakpointProps, useBreakpointPropsType } from './breakpoint/useBreakpointProps.js';
 export { default as useInterface } from './hooks/useInterface.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xanui/core",
-  "version": "1.2.4",
+  "version": "1.2.6",
   "description": "",
   "private": false,
   "main": "./index.js",

package/theme/ThemeCssVars.js

@@ -1,5 +1,5 @@
 'use strict';Object.defineProperty(exports,'__esModule',{value:true});const ThemeCssVars = (theme) => {
     const shadows = {};
     theme.shadow.forEach((s, i) => shadows[`--shadow-${i}`] = s);
-    return Object.assign({ "--bp-xs": theme.breakpoints.xs, "--bp-sm": theme.breakpoints.sm, "--bp-md": theme.breakpoints.md, "--bp-lg": theme.breakpoints.lg, "--bp-xl": theme.breakpoints.xl, "--font-h1": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`, "--font-h2": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`, "--font-h3": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`, "--font-h4": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`, "--font-h5": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`, "--font-h6": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`, "--font-big": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-text": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-button": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`, "--font-small": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`, "--fontsize-h1": `${theme.typography.h1.fontSize}px`, "--fontsize-h2": `${theme.typography.h2.fontSize}px`, "--fontsize-h3": `${theme.typography.h3.fontSize}px`, "--fontsize-h4": `${theme.typography.h4.fontSize}px`, "--fontsize-h5": `${theme.typography.h5.fontSize}px`, "--fontsize-h6": `${theme.typography.h6.fontSize}px`, "--fontsize-big": `${theme.typography.big.fontSize}px`, "--fontsize-text": `${theme.typography.text.fontSize}px`, "--fontsize-button": `${theme.typography.button.fontSize}px`, "--fontsize-small": `${theme.typography.small.fontSize}px`, "--fontweight-h1": theme.typography.h1.fontWeight, "--fontweight-h2": theme.typography.h2.fontWeight, "--fontweight-h3": theme.typography.h3.fontWeight, "--fontweight-h4": theme.typography.h4.fontWeight, "--fontweight-h5": theme.typography.h5.fontWeight, "--fontweight-h6": theme.typography.h6.fontWeight, "--fontweight-big": theme.typography.big.fontWeight, "--fontweight-text": theme.typography.text.fontWeight, "--fontweight-button": theme.typography.button.fontWeight, "--fontweight-small": theme.typography.small.fontWeight, "--lineheight-h1": theme.typography.h1.lineHeight, "--lineheight-h2": theme.typography.h2.lineHeight, "--lineheight-h3": theme.typography.h3.lineHeight, "--lineheight-h4": theme.typography.h4.lineHeight, "--lineheight-h5": theme.typography.h5.lineHeight, "--lineheight-h6": theme.typography.h6.lineHeight, "--lineheight-big": theme.typography.big.lineHeight, "--lineheight-text": theme.typography.text.lineHeight, "--lineheight-button": theme.typography.button.lineHeight, "--lineheight-small": theme.typography.small.lineHeight, "--color-common": theme.colors.common.primary, "--color-common-primary": theme.colors.common.primary, "--color-common-secondary": theme.colors.common.secondary, "--color-common-alpha": theme.colors.common.alpha, "--color-common-divider": theme.colors.common.divider, "--color-common-text-primary": theme.colors.common.text.primary, "--color-common-text-secondary": theme.colors.common.text.secondary, "--color-surface": theme.colors.surface.primary, "--color-surface-primary": theme.colors.surface.primary, "--color-surface-secondary": theme.colors.surface.secondary, "--color-surface-alpha": theme.colors.surface.alpha, "--color-surface-divider": theme.colors.surface.divider, "--color-surface-text-primary": theme.colors.surface.text.primary, "--color-surface-text-secondary": theme.colors.surface.text.secondary, "--color-brand": theme.colors.brand.primary, "--color-brand-primary": theme.colors.brand.primary, "--color-brand-secondary": theme.colors.brand.secondary, "--color-brand-alpha": theme.colors.brand.alpha, "--color-brand-divider": theme.colors.brand.divider, "--color-brand-text-primary": theme.colors.brand.text.primary, "--color-brand-text-secondary": theme.colors.brand.text.secondary, "--color-accent": theme.colors.accent.primary, "--color-accent-primary": theme.colors.accent.primary, "--color-accent-secondary": theme.colors.accent.secondary, "--color-accent-alpha": theme.colors.accent.alpha, "--color-accent-divider": theme.colors.accent.divider, "--color-accent-text-primary": theme.colors.accent.text.primary, "--color-accent-text-secondary": theme.colors.accent.text.secondary, "--color-info": theme.colors.info.primary, "--color-info-primary": theme.colors.info.primary, "--color-info-secondary": theme.colors.info.secondary, "--color-info-alpha": theme.colors.info.alpha, "--color-info-divider": theme.colors.info.divider, "--color-info-text-primary": theme.colors.info.text.primary, "--color-info-text-secondary": theme.colors.info.text.secondary, "--color-success": theme.colors.success.primary, "--color-success-primary": theme.colors.success.primary, "--color-success-secondary": theme.colors.success.secondary, "--color-success-alpha": theme.colors.success.alpha, "--color-success-divider": theme.colors.success.divider, "--color-success-text-primary": theme.colors.success.text.primary, "--color-success-text-secondary": theme.colors.success.text.secondary, "--color-warning": theme.colors.warning.primary, "--color-warning-primary": theme.colors.warning.primary, "--color-warning-secondary": theme.colors.warning.secondary, "--color-warning-alpha": theme.colors.warning.alpha, "--color-warning-divider": theme.colors.warning.divider, "--color-warning-text-primary": theme.colors.warning.text.primary, "--color-warning-text-secondary": theme.colors.warning.text.secondary, "--color-danger": theme.colors.danger.primary, "--color-danger-primary": theme.colors.danger.primary, "--color-danger-secondary": theme.colors.danger.secondary, "--color-danger-alpha": theme.colors.danger.alpha, "--color-danger-divider": theme.colors.danger.divider, "--color-danger-text-primary": theme.colors.danger.text.primary, "--color-danger-text-secondary": theme.colors.danger.text.secondary }, shadows);
+    return Object.assign({ "--bp-xs": theme.breakpoints.xs, "--bp-sm": theme.breakpoints.sm, "--bp-md": theme.breakpoints.md, "--bp-lg": theme.breakpoints.lg, "--bp-xl": theme.breakpoints.xl, "--font-h1": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`, "--font-h2": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`, "--font-h3": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`, "--font-h4": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`, "--font-h5": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`, "--font-h6": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`, "--font-big": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-text": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-button": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`, "--font-small": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`, "--fontsize-h1": `${theme.typography.h1.fontSize}px`, "--fontsize-h2": `${theme.typography.h2.fontSize}px`, "--fontsize-h3": `${theme.typography.h3.fontSize}px`, "--fontsize-h4": `${theme.typography.h4.fontSize}px`, "--fontsize-h5": `${theme.typography.h5.fontSize}px`, "--fontsize-h6": `${theme.typography.h6.fontSize}px`, "--fontsize-big": `${theme.typography.big.fontSize}px`, "--fontsize-text": `${theme.typography.text.fontSize}px`, "--fontsize-button": `${theme.typography.button.fontSize}px`, "--fontsize-small": `${theme.typography.small.fontSize}px`, "--fontweight-h1": theme.typography.h1.fontWeight + "", "--fontweight-h2": theme.typography.h2.fontWeight + "", "--fontweight-h3": theme.typography.h3.fontWeight + "", "--fontweight-h4": theme.typography.h4.fontWeight + "", "--fontweight-h5": theme.typography.h5.fontWeight + "", "--fontweight-h6": theme.typography.h6.fontWeight + "", "--fontweight-big": theme.typography.big.fontWeight + "", "--fontweight-text": theme.typography.text.fontWeight + "", "--fontweight-button": theme.typography.button.fontWeight + "", "--fontweight-small": theme.typography.small.fontWeight + "", "--lineheight-h1": theme.typography.h1.lineHeight + "", "--lineheight-h2": theme.typography.h2.lineHeight + "", "--lineheight-h3": theme.typography.h3.lineHeight + "", "--lineheight-h4": theme.typography.h4.lineHeight + "", "--lineheight-h5": theme.typography.h5.lineHeight + "", "--lineheight-h6": theme.typography.h6.lineHeight + "", "--lineheight-big": theme.typography.big.lineHeight + "", "--lineheight-text": theme.typography.text.lineHeight + "", "--lineheight-button": theme.typography.button.lineHeight + "", "--lineheight-small": theme.typography.small.lineHeight + "", "--color-common-primary": theme.colors.common.primary, "--color-common-secondary": theme.colors.common.secondary, "--color-text-primary": theme.colors.text.primary, "--color-text-secondary": theme.colors.text.secondary, "--color-divider-primary": theme.colors.divider.primary, "--color-divider-secondary": theme.colors.divider.secondary, "--color-brand-primary": theme.colors.brand.primary, "--color-brand-secondary": theme.colors.brand.secondary, "--color-brand-text": theme.colors.brand.text, "--color-accent-primary": theme.colors.accent.primary, "--color-accent-secondary": theme.colors.accent.secondary, "--color-accent-text": theme.colors.accent.text, "--color-info-primary": theme.colors.info.primary, "--color-info-secondary": theme.colors.info.secondary, "--color-info-text": theme.colors.info.text, "--color-success-primary": theme.colors.success.primary, "--color-success-secondary": theme.colors.success.secondary, "--color-success-text": theme.colors.success.text, "--color-warning-primary": theme.colors.warning.primary, "--color-warning-secondary": theme.colors.warning.secondary, "--color-warning-text": theme.colors.warning.text, "--color-danger-primary": theme.colors.danger.primary, "--color-danger-secondary": theme.colors.danger.secondary, "--color-danger-text": theme.colors.danger.text }, shadows);
 };exports.default=ThemeCssVars;//# sourceMappingURL=ThemeCssVars.js.map

package/theme/ThemeCssVars.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeCssVars.js","sources":["../../src/theme/ThemeCssVars.ts"],"sourcesContent":["import { ThemeOptions } from \"./types\";\r\n\r\nconst ThemeCssVars = (theme: ThemeOptions) => {\r\n\r\n    const shadows: any = {}\r\n    theme.shadow.forEach((s, i) => shadows[`--shadow-${i}`] = s)\r\n\r\n    return {\r\n        \"--bp-xs\": theme.breakpoints.xs,\r\n        \"--bp-sm\": theme.breakpoints.sm,\r\n        \"--bp-md\": theme.breakpoints.md,\r\n        \"--bp-lg\": theme.breakpoints.lg,\r\n        \"--bp-xl\": theme.breakpoints.xl,\r\n\r\n        \"--font-h1\": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`,\r\n        \"--font-h2\": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`,\r\n        \"--font-h3\": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`,\r\n        \"--font-h4\": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`,\r\n        \"--font-h5\": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`,\r\n        \"--font-h6\": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`,\r\n        \"--font-big\": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`,\r\n        \"--font-text\": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`,\r\n        \"--font-button\": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`,\r\n        \"--font-small\": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`,\r\n\r\n        \"--fontsize-h1\": `${theme.typography.h1.fontSize}px`,\r\n        \"--fontsize-h2\": `${theme.typography.h2.fontSize}px`,\r\n        \"--fontsize-h3\": `${theme.typography.h3.fontSize}px`,\r\n        \"--fontsize-h4\": `${theme.typography.h4.fontSize}px`,\r\n        \"--fontsize-h5\": `${theme.typography.h5.fontSize}px`,\r\n        \"--fontsize-h6\": `${theme.typography.h6.fontSize}px`,\r\n        \"--fontsize-big\": `${theme.typography.big.fontSize}px`,\r\n        \"--fontsize-text\": `${theme.typography.text.fontSize}px`,\r\n        \"--fontsize-button\": `${theme.typography.button.fontSize}px`,\r\n        \"--fontsize-small\": `${theme.typography.small.fontSize}px`,\r\n\r\n        \"--fontweight-h1\": theme.typography.h1.fontWeight,\r\n        \"--fontweight-h2\": theme.typography.h2.fontWeight,\r\n        \"--fontweight-h3\": theme.typography.h3.fontWeight,\r\n        \"--fontweight-h4\": theme.typography.h4.fontWeight,\r\n        \"--fontweight-h5\": theme.typography.h5.fontWeight,\r\n        \"--fontweight-h6\": theme.typography.h6.fontWeight,\r\n        \"--fontweight-big\": theme.typography.big.fontWeight,\r\n        \"--fontweight-text\": theme.typography.text.fontWeight,\r\n        \"--fontweight-button\": theme.typography.button.fontWeight,\r\n        \"--fontweight-small\": theme.typography.small.fontWeight,\r\n\r\n        \"--lineheight-h1\": theme.typography.h1.lineHeight,\r\n        \"--lineheight-h2\": theme.typography.h2.lineHeight,\r\n        \"--lineheight-h3\": theme.typography.h3.lineHeight,\r\n        \"--lineheight-h4\": theme.typography.h4.lineHeight,\r\n        \"--lineheight-h5\": theme.typography.h5.lineHeight,\r\n        \"--lineheight-h6\": theme.typography.h6.lineHeight,\r\n        \"--lineheight-big\": theme.typography.big.lineHeight,\r\n        \"--lineheight-text\": theme.typography.text.lineHeight,\r\n        \"--lineheight-button\": theme.typography.button.lineHeight,\r\n        \"--lineheight-small\": theme.typography.small.lineHeight,\r\n\r\n        \"--color-common\": theme.colors.common.primary,\r\n        \"--color-common-primary\": theme.colors.common.primary,\r\n        \"--color-common-secondary\": theme.colors.common.secondary,\r\n        \"--color-common-alpha\": theme.colors.common.alpha,\r\n        \"--color-common-divider\": theme.colors.common.divider,\r\n        \"--color-common-text-primary\": theme.colors.common.text.primary,\r\n        \"--color-common-text-secondary\": theme.colors.common.text.secondary,\r\n\r\n        \"--color-surface\": theme.colors.surface.primary,\r\n        \"--color-surface-primary\": theme.colors.surface.primary,\r\n        \"--color-surface-secondary\": theme.colors.surface.secondary,\r\n        \"--color-surface-alpha\": theme.colors.surface.alpha,\r\n        \"--color-surface-divider\": theme.colors.surface.divider,\r\n        \"--color-surface-text-primary\": theme.colors.surface.text.primary,\r\n        \"--color-surface-text-secondary\": theme.colors.surface.text.secondary,\r\n\r\n        \"--color-brand\": theme.colors.brand.primary,\r\n        \"--color-brand-primary\": theme.colors.brand.primary,\r\n        \"--color-brand-secondary\": theme.colors.brand.secondary,\r\n        \"--color-brand-alpha\": theme.colors.brand.alpha,\r\n        \"--color-brand-divider\": theme.colors.brand.divider,\r\n        \"--color-brand-text-primary\": theme.colors.brand.text.primary,\r\n        \"--color-brand-text-secondary\": theme.colors.brand.text.secondary,\r\n\r\n        \"--color-accent\": theme.colors.accent.primary,\r\n        \"--color-accent-primary\": theme.colors.accent.primary,\r\n        \"--color-accent-secondary\": theme.colors.accent.secondary,\r\n        \"--color-accent-alpha\": theme.colors.accent.alpha,\r\n        \"--color-accent-divider\": theme.colors.accent.divider,\r\n        \"--color-accent-text-primary\": theme.colors.accent.text.primary,\r\n        \"--color-accent-text-secondary\": theme.colors.accent.text.secondary,\r\n\r\n        \"--color-info\": theme.colors.info.primary,\r\n        \"--color-info-primary\": theme.colors.info.primary,\r\n        \"--color-info-secondary\": theme.colors.info.secondary,\r\n        \"--color-info-alpha\": theme.colors.info.alpha,\r\n        \"--color-info-divider\": theme.colors.info.divider,\r\n        \"--color-info-text-primary\": theme.colors.info.text.primary,\r\n        \"--color-info-text-secondary\": theme.colors.info.text.secondary,\r\n\r\n        \"--color-success\": theme.colors.success.primary,\r\n        \"--color-success-primary\": theme.colors.success.primary,\r\n        \"--color-success-secondary\": theme.colors.success.secondary,\r\n        \"--color-success-alpha\": theme.colors.success.alpha,\r\n        \"--color-success-divider\": theme.colors.success.divider,\r\n        \"--color-success-text-primary\": theme.colors.success.text.primary,\r\n        \"--color-success-text-secondary\": theme.colors.success.text.secondary,\r\n\r\n        \"--color-warning\": theme.colors.warning.primary,\r\n        \"--color-warning-primary\": theme.colors.warning.primary,\r\n        \"--color-warning-secondary\": theme.colors.warning.secondary,\r\n        \"--color-warning-alpha\": theme.colors.warning.alpha,\r\n        \"--color-warning-divider\": theme.colors.warning.divider,\r\n        \"--color-warning-text-primary\": theme.colors.warning.text.primary,\r\n        \"--color-warning-text-secondary\": theme.colors.warning.text.secondary,\r\n\r\n        \"--color-danger\": theme.colors.danger.primary,\r\n        \"--color-danger-primary\": theme.colors.danger.primary,\r\n        \"--color-danger-secondary\": theme.colors.danger.secondary,\r\n        \"--color-danger-alpha\": theme.colors.danger.alpha,\r\n        \"--color-danger-divider\": theme.colors.danger.divider,\r\n        \"--color-danger-text-primary\": theme.colors.danger.text.primary,\r\n        \"--color-danger-text-secondary\": theme.colors.danger.text.secondary,\r\n        ...shadows,\r\n    }\r\n}\r\n\r\n\r\nexport default ThemeCssVars"],"names":[],"mappings":"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"}
+{"version":3,"file":"ThemeCssVars.js","sources":["../../src/theme/ThemeCssVars.ts"],"sourcesContent":["import { ThemeOptions } from \"./types\";\r\n\r\nconst ThemeCssVars = (theme: ThemeOptions) => {\r\n\r\n    const shadows: any = {}\r\n    theme.shadow.forEach((s, i) => shadows[`--shadow-${i}`] = s)\r\n\r\n    return {\r\n        \"--bp-xs\": theme.breakpoints.xs,\r\n        \"--bp-sm\": theme.breakpoints.sm,\r\n        \"--bp-md\": theme.breakpoints.md,\r\n        \"--bp-lg\": theme.breakpoints.lg,\r\n        \"--bp-xl\": theme.breakpoints.xl,\r\n\r\n        \"--font-h1\": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`,\r\n        \"--font-h2\": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`,\r\n        \"--font-h3\": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`,\r\n        \"--font-h4\": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`,\r\n        \"--font-h5\": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`,\r\n        \"--font-h6\": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`,\r\n        \"--font-big\": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`,\r\n        \"--font-text\": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`,\r\n        \"--font-button\": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`,\r\n        \"--font-small\": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`,\r\n\r\n        \"--fontsize-h1\": `${theme.typography.h1.fontSize}px`,\r\n        \"--fontsize-h2\": `${theme.typography.h2.fontSize}px`,\r\n        \"--fontsize-h3\": `${theme.typography.h3.fontSize}px`,\r\n        \"--fontsize-h4\": `${theme.typography.h4.fontSize}px`,\r\n        \"--fontsize-h5\": `${theme.typography.h5.fontSize}px`,\r\n        \"--fontsize-h6\": `${theme.typography.h6.fontSize}px`,\r\n        \"--fontsize-big\": `${theme.typography.big.fontSize}px`,\r\n        \"--fontsize-text\": `${theme.typography.text.fontSize}px`,\r\n        \"--fontsize-button\": `${theme.typography.button.fontSize}px`,\r\n        \"--fontsize-small\": `${theme.typography.small.fontSize}px`,\r\n\r\n        \"--fontweight-h1\": theme.typography.h1.fontWeight + \"\",\r\n        \"--fontweight-h2\": theme.typography.h2.fontWeight + \"\",\r\n        \"--fontweight-h3\": theme.typography.h3.fontWeight + \"\",\r\n        \"--fontweight-h4\": theme.typography.h4.fontWeight + \"\",\r\n        \"--fontweight-h5\": theme.typography.h5.fontWeight + \"\",\r\n        \"--fontweight-h6\": theme.typography.h6.fontWeight + \"\",\r\n        \"--fontweight-big\": theme.typography.big.fontWeight + \"\",\r\n        \"--fontweight-text\": theme.typography.text.fontWeight + \"\",\r\n        \"--fontweight-button\": theme.typography.button.fontWeight + \"\",\r\n        \"--fontweight-small\": theme.typography.small.fontWeight + \"\",\r\n\r\n        \"--lineheight-h1\": theme.typography.h1.lineHeight + \"\",\r\n        \"--lineheight-h2\": theme.typography.h2.lineHeight + \"\",\r\n        \"--lineheight-h3\": theme.typography.h3.lineHeight + \"\",\r\n        \"--lineheight-h4\": theme.typography.h4.lineHeight + \"\",\r\n        \"--lineheight-h5\": theme.typography.h5.lineHeight + \"\",\r\n        \"--lineheight-h6\": theme.typography.h6.lineHeight + \"\",\r\n        \"--lineheight-big\": theme.typography.big.lineHeight + \"\",\r\n        \"--lineheight-text\": theme.typography.text.lineHeight + \"\",\r\n        \"--lineheight-button\": theme.typography.button.lineHeight + \"\",\r\n        \"--lineheight-small\": theme.typography.small.lineHeight + \"\",\r\n\r\n        \"--color-common-primary\": theme.colors.common.primary,\r\n        \"--color-common-secondary\": theme.colors.common.secondary,\r\n\r\n        \"--color-text-primary\": theme.colors.text.primary,\r\n        \"--color-text-secondary\": theme.colors.text.secondary,\r\n\r\n        \"--color-divider-primary\": theme.colors.divider.primary,\r\n        \"--color-divider-secondary\": theme.colors.divider.secondary,\r\n\r\n        \"--color-brand-primary\": theme.colors.brand.primary,\r\n        \"--color-brand-secondary\": theme.colors.brand.secondary,\r\n        \"--color-brand-text\": theme.colors.brand.text,\r\n\r\n        \"--color-accent-primary\": theme.colors.accent.primary,\r\n        \"--color-accent-secondary\": theme.colors.accent.secondary,\r\n        \"--color-accent-text\": theme.colors.accent.text,\r\n\r\n        \"--color-info-primary\": theme.colors.info.primary,\r\n        \"--color-info-secondary\": theme.colors.info.secondary,\r\n        \"--color-info-text\": theme.colors.info.text,\r\n\r\n        \"--color-success-primary\": theme.colors.success.primary,\r\n        \"--color-success-secondary\": theme.colors.success.secondary,\r\n        \"--color-success-text\": theme.colors.success.text,\r\n\r\n        \"--color-warning-primary\": theme.colors.warning.primary,\r\n        \"--color-warning-secondary\": theme.colors.warning.secondary,\r\n        \"--color-warning-text\": theme.colors.warning.text,\r\n\r\n        \"--color-danger-primary\": theme.colors.danger.primary,\r\n        \"--color-danger-secondary\": theme.colors.danger.secondary,\r\n        \"--color-danger-text\": theme.colors.danger.text,\r\n        ...shadows,\r\n    }\r\n}\r\n\r\n\r\nexport default ThemeCssVars"],"names":[],"mappings":"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"}

package/theme/ThemeCssVars.mjs

@@ -1,5 +1,5 @@
 const ThemeCssVars = (theme) => {
     const shadows = {};
     theme.shadow.forEach((s, i) => shadows[`--shadow-${i}`] = s);
-    return Object.assign({ "--bp-xs": theme.breakpoints.xs, "--bp-sm": theme.breakpoints.sm, "--bp-md": theme.breakpoints.md, "--bp-lg": theme.breakpoints.lg, "--bp-xl": theme.breakpoints.xl, "--font-h1": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`, "--font-h2": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`, "--font-h3": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`, "--font-h4": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`, "--font-h5": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`, "--font-h6": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`, "--font-big": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-text": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-button": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`, "--font-small": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`, "--fontsize-h1": `${theme.typography.h1.fontSize}px`, "--fontsize-h2": `${theme.typography.h2.fontSize}px`, "--fontsize-h3": `${theme.typography.h3.fontSize}px`, "--fontsize-h4": `${theme.typography.h4.fontSize}px`, "--fontsize-h5": `${theme.typography.h5.fontSize}px`, "--fontsize-h6": `${theme.typography.h6.fontSize}px`, "--fontsize-big": `${theme.typography.big.fontSize}px`, "--fontsize-text": `${theme.typography.text.fontSize}px`, "--fontsize-button": `${theme.typography.button.fontSize}px`, "--fontsize-small": `${theme.typography.small.fontSize}px`, "--fontweight-h1": theme.typography.h1.fontWeight, "--fontweight-h2": theme.typography.h2.fontWeight, "--fontweight-h3": theme.typography.h3.fontWeight, "--fontweight-h4": theme.typography.h4.fontWeight, "--fontweight-h5": theme.typography.h5.fontWeight, "--fontweight-h6": theme.typography.h6.fontWeight, "--fontweight-big": theme.typography.big.fontWeight, "--fontweight-text": theme.typography.text.fontWeight, "--fontweight-button": theme.typography.button.fontWeight, "--fontweight-small": theme.typography.small.fontWeight, "--lineheight-h1": theme.typography.h1.lineHeight, "--lineheight-h2": theme.typography.h2.lineHeight, "--lineheight-h3": theme.typography.h3.lineHeight, "--lineheight-h4": theme.typography.h4.lineHeight, "--lineheight-h5": theme.typography.h5.lineHeight, "--lineheight-h6": theme.typography.h6.lineHeight, "--lineheight-big": theme.typography.big.lineHeight, "--lineheight-text": theme.typography.text.lineHeight, "--lineheight-button": theme.typography.button.lineHeight, "--lineheight-small": theme.typography.small.lineHeight, "--color-common": theme.colors.common.primary, "--color-common-primary": theme.colors.common.primary, "--color-common-secondary": theme.colors.common.secondary, "--color-common-alpha": theme.colors.common.alpha, "--color-common-divider": theme.colors.common.divider, "--color-common-text-primary": theme.colors.common.text.primary, "--color-common-text-secondary": theme.colors.common.text.secondary, "--color-surface": theme.colors.surface.primary, "--color-surface-primary": theme.colors.surface.primary, "--color-surface-secondary": theme.colors.surface.secondary, "--color-surface-alpha": theme.colors.surface.alpha, "--color-surface-divider": theme.colors.surface.divider, "--color-surface-text-primary": theme.colors.surface.text.primary, "--color-surface-text-secondary": theme.colors.surface.text.secondary, "--color-brand": theme.colors.brand.primary, "--color-brand-primary": theme.colors.brand.primary, "--color-brand-secondary": theme.colors.brand.secondary, "--color-brand-alpha": theme.colors.brand.alpha, "--color-brand-divider": theme.colors.brand.divider, "--color-brand-text-primary": theme.colors.brand.text.primary, "--color-brand-text-secondary": theme.colors.brand.text.secondary, "--color-accent": theme.colors.accent.primary, "--color-accent-primary": theme.colors.accent.primary, "--color-accent-secondary": theme.colors.accent.secondary, "--color-accent-alpha": theme.colors.accent.alpha, "--color-accent-divider": theme.colors.accent.divider, "--color-accent-text-primary": theme.colors.accent.text.primary, "--color-accent-text-secondary": theme.colors.accent.text.secondary, "--color-info": theme.colors.info.primary, "--color-info-primary": theme.colors.info.primary, "--color-info-secondary": theme.colors.info.secondary, "--color-info-alpha": theme.colors.info.alpha, "--color-info-divider": theme.colors.info.divider, "--color-info-text-primary": theme.colors.info.text.primary, "--color-info-text-secondary": theme.colors.info.text.secondary, "--color-success": theme.colors.success.primary, "--color-success-primary": theme.colors.success.primary, "--color-success-secondary": theme.colors.success.secondary, "--color-success-alpha": theme.colors.success.alpha, "--color-success-divider": theme.colors.success.divider, "--color-success-text-primary": theme.colors.success.text.primary, "--color-success-text-secondary": theme.colors.success.text.secondary, "--color-warning": theme.colors.warning.primary, "--color-warning-primary": theme.colors.warning.primary, "--color-warning-secondary": theme.colors.warning.secondary, "--color-warning-alpha": theme.colors.warning.alpha, "--color-warning-divider": theme.colors.warning.divider, "--color-warning-text-primary": theme.colors.warning.text.primary, "--color-warning-text-secondary": theme.colors.warning.text.secondary, "--color-danger": theme.colors.danger.primary, "--color-danger-primary": theme.colors.danger.primary, "--color-danger-secondary": theme.colors.danger.secondary, "--color-danger-alpha": theme.colors.danger.alpha, "--color-danger-divider": theme.colors.danger.divider, "--color-danger-text-primary": theme.colors.danger.text.primary, "--color-danger-text-secondary": theme.colors.danger.text.secondary }, shadows);
+    return Object.assign({ "--bp-xs": theme.breakpoints.xs, "--bp-sm": theme.breakpoints.sm, "--bp-md": theme.breakpoints.md, "--bp-lg": theme.breakpoints.lg, "--bp-xl": theme.breakpoints.xl, "--font-h1": `${theme.typography.h1.fontWeight} ${theme.typography.h1.fontSize}px/${theme.typography.h1.lineHeight} inherit`, "--font-h2": `${theme.typography.h2.fontWeight} ${theme.typography.h2.fontSize}px/${theme.typography.h2.lineHeight} inherit`, "--font-h3": `${theme.typography.h3.fontWeight} ${theme.typography.h3.fontSize}px/${theme.typography.h3.lineHeight} inherit`, "--font-h4": `${theme.typography.h4.fontWeight} ${theme.typography.h4.fontSize}px/${theme.typography.h4.lineHeight} inherit`, "--font-h5": `${theme.typography.h5.fontWeight} ${theme.typography.h5.fontSize}px/${theme.typography.h5.lineHeight} inherit`, "--font-h6": `${theme.typography.h6.fontWeight} ${theme.typography.h6.fontSize}px/${theme.typography.h6.lineHeight} inherit`, "--font-big": `${theme.typography.big.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-text": `${theme.typography.text.fontWeight} ${theme.typography.text.fontSize}px/${theme.typography.text.lineHeight} inherit`, "--font-button": `${theme.typography.button.fontWeight} ${theme.typography.button.fontSize}px/${theme.typography.button.lineHeight} inherit`, "--font-small": `${theme.typography.small.fontWeight} ${theme.typography.small.fontSize}px/${theme.typography.small.lineHeight} inherit`, "--fontsize-h1": `${theme.typography.h1.fontSize}px`, "--fontsize-h2": `${theme.typography.h2.fontSize}px`, "--fontsize-h3": `${theme.typography.h3.fontSize}px`, "--fontsize-h4": `${theme.typography.h4.fontSize}px`, "--fontsize-h5": `${theme.typography.h5.fontSize}px`, "--fontsize-h6": `${theme.typography.h6.fontSize}px`, "--fontsize-big": `${theme.typography.big.fontSize}px`, "--fontsize-text": `${theme.typography.text.fontSize}px`, "--fontsize-button": `${theme.typography.button.fontSize}px`, "--fontsize-small": `${theme.typography.small.fontSize}px`, "--fontweight-h1": theme.typography.h1.fontWeight + "", "--fontweight-h2": theme.typography.h2.fontWeight + "", "--fontweight-h3": theme.typography.h3.fontWeight + "", "--fontweight-h4": theme.typography.h4.fontWeight + "", "--fontweight-h5": theme.typography.h5.fontWeight + "", "--fontweight-h6": theme.typography.h6.fontWeight + "", "--fontweight-big": theme.typography.big.fontWeight + "", "--fontweight-text": theme.typography.text.fontWeight + "", "--fontweight-button": theme.typography.button.fontWeight + "", "--fontweight-small": theme.typography.small.fontWeight + "", "--lineheight-h1": theme.typography.h1.lineHeight + "", "--lineheight-h2": theme.typography.h2.lineHeight + "", "--lineheight-h3": theme.typography.h3.lineHeight + "", "--lineheight-h4": theme.typography.h4.lineHeight + "", "--lineheight-h5": theme.typography.h5.lineHeight + "", "--lineheight-h6": theme.typography.h6.lineHeight + "", "--lineheight-big": theme.typography.big.lineHeight + "", "--lineheight-text": theme.typography.text.lineHeight + "", "--lineheight-button": theme.typography.button.lineHeight + "", "--lineheight-small": theme.typography.small.lineHeight + "", "--color-common-primary": theme.colors.common.primary, "--color-common-secondary": theme.colors.common.secondary, "--color-text-primary": theme.colors.text.primary, "--color-text-secondary": theme.colors.text.secondary, "--color-divider-primary": theme.colors.divider.primary, "--color-divider-secondary": theme.colors.divider.secondary, "--color-brand-primary": theme.colors.brand.primary, "--color-brand-secondary": theme.colors.brand.secondary, "--color-brand-text": theme.colors.brand.text, "--color-accent-primary": theme.colors.accent.primary, "--color-accent-secondary": theme.colors.accent.secondary, "--color-accent-text": theme.colors.accent.text, "--color-info-primary": theme.colors.info.primary, "--color-info-secondary": theme.colors.info.secondary, "--color-info-text": theme.colors.info.text, "--color-success-primary": theme.colors.success.primary, "--color-success-secondary": theme.colors.success.secondary, "--color-success-text": theme.colors.success.text, "--color-warning-primary": theme.colors.warning.primary, "--color-warning-secondary": theme.colors.warning.secondary, "--color-warning-text": theme.colors.warning.text, "--color-danger-primary": theme.colors.danger.primary, "--color-danger-secondary": theme.colors.danger.secondary, "--color-danger-text": theme.colors.danger.text }, shadows);
 };export{ThemeCssVars as default};//# sourceMappingURL=ThemeCssVars.mjs.map