@xanui/core 1.1.7 → 1.1.9

package/theme/ThemeProvider.js

@@ -1,51 +1,23 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),index$1=require('../Tag/index.js'),BreakpointProvider=require('../breakpoint/BreakpointProvider.js'),index=require('../css/index.js'),core=require('./core.js'),ThemeCssVars=require('./ThemeCssVars.js');function _interopNamespaceDefault(e){var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var React__namespace=/*#__PURE__*/_interopNamespaceDefault(React);const ThemeProvider = (_a) => {
-    var { children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot } = _a, props = tslib.__rest(_a, ["children", "theme", "resetCss", "scrollbarCss", "isRootProvider", "renderIsRoot"]);
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var tslib=require('tslib'),jsxRuntime=require('react/jsx-runtime'),React=require('react'),index$1=require('../Tag/index.js'),BreakpointProvider=require('../breakpoint/BreakpointProvider.js'),index=require('../css/index.js'),core=require('./core.js'),ThemeCssVars=require('./ThemeCssVars.js'),useScrollbar=require('../useScrollbar.js'),createTheme=require('./createTheme.js'),ThemeDefaultOptions=require('./ThemeDefaultOptions.js');function _interopNamespaceDefault(e){var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var React__namespace=/*#__PURE__*/_interopNamespaceDefault(React);createTheme.createTheme("light", { colors: ThemeDefaultOptions.lightColorPallete });
+createTheme.createTheme("dark", { colors: ThemeDefaultOptions.darkColorPallete });
+const ThemeProvider = (_a) => {
+    var { children, theme, applyScrollbarCss, isRootProvider, renderIsRoot } = _a, props = tslib.__rest(_a, ["children", "theme", "applyScrollbarCss", "isRootProvider", "renderIsRoot"]);
     const THEME = core.ThemeFactory.get(theme);
     if (!THEME)
         throw new Error(`Invalid theme name provided: ${theme}`);
-    resetCss !== null && resetCss !== void 0 ? resetCss : (resetCss = true);
-    scrollbarCss !== null && scrollbarCss !== void 0 ? scrollbarCss : (scrollbarCss = true);
+    applyScrollbarCss !== null && applyScrollbarCss !== void 0 ? applyScrollbarCss : (applyScrollbarCss = true);
     React__namespace.useMemo(() => {
-        if (!!Object.keys(THEME.globalStyle).length) {
-            index.css({
-                "@global": THEME.globalStyle
-            });
-        }
+        const root_cls = `.xui-${theme}-theme-root`;
+        let gkeys = Object.keys(THEME.globalStyle || {});
+        let gstyles = {};
+        gkeys.forEach((key) => {
+            gstyles[`${root_cls} ${key}`] = THEME.globalStyle[key];
+        });
         index.css({
-            "@global": {
-                [`.xui-${theme}-theme-root`]: ThemeCssVars.default(THEME)
-            }
+            "@global": Object.assign(Object.assign({}, gstyles), { [root_cls]: ThemeCssVars.default(THEME) })
         });
-        if (scrollbarCss && typeof document !== 'undefined') {
-            let thumbSize = 10;
-            let thumbColor = THEME.colors.divider;
-            let trackColor = THEME.colors.background.secondary;
-            index.css({
-                "@global": {
-                    "*": {
-                        scrollbarWidth: "thin",
-                        scrollbarColor: `${thumbColor} ${trackColor}`,
-                    },
-                    "::-webkit-scrollbar": {
-                        width: thumbSize,
-                        height: thumbSize,
-                    },
-                    "::-webkit-scrollbar-thumb": {
-                        backgroundColor: thumbColor,
-                        borderRadius: "5px",
-                        border: "2px solid #f4f4f4",
-                    },
-                    "::-webkit-scrollbar-thumb:hover": {
-                        backgroundColor: thumbColor,
-                    },
-                    "::-webkit-scrollbar-track": {
-                        backgroundColor: trackColor,
-                        borderRadius: "5px",
-                    },
-                }
-            });
-        }
-        resetCss && index.css({
+        applyScrollbarCss && useScrollbar.default(theme, root_cls);
+        index.css({
             "@global": {
                 "*": {
                     m: 0,
@@ -81,5 +53,5 @@
             }
         });
     }, [theme]);
-    return (jsxRuntime.jsx(core.ThemeContex.Provider, Object.assign({ value: theme }, { children: isRootProvider ? jsxRuntime.jsx(BreakpointProvider.BreakpointProvider, { children: jsxRuntime.jsxs(index$1.default, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr" }, { children: [children, renderIsRoot] })) }) : jsxRuntime.jsx(index$1.default, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr" }, { children: children })) })));
+    return (jsxRuntime.jsx(core.ThemeContex.Provider, { value: theme, children: isRootProvider ? jsxRuntime.jsx(BreakpointProvider.BreakpointProvider, { children: jsxRuntime.jsxs(index$1.default, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr", children: [children, renderIsRoot] })) }) : jsxRuntime.jsx(index$1.default, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr", children: children })) }));
 };exports.default=ThemeProvider;//# sourceMappingURL=ThemeProvider.js.map

package/theme/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { ThemeOptions } from \"./types\"\nimport Tag from \"../Tag\"\nimport { TagComponentType, TagProps } from \"../Tag/types\"\nimport { BreakpointProvider } from \"../breakpoint\"\nimport { ThemeContex, ThemeFactory } from \"./core\"\nimport ThemeCssVars from \"./ThemeCssVars\"\nimport { css } from \"../css\"\n\nexport type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {\n   theme: string;\n   resetCss?: boolean;\n   scrollbarCss?: boolean;\n   isRootProvider?: boolean;\n   renderIsRoot?: React.ReactElement;\n}\n\nconst ThemeProvider = ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => {\n   const THEME = ThemeFactory.get(theme) as ThemeOptions\n   if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`)\n   resetCss ??= true\n   scrollbarCss ??= true\n\n   React.useMemo(() => {\n      if (!!Object.keys(THEME.globalStyle).length) {\n         css({\n            \"@global\": THEME.globalStyle\n         })\n      }\n\n      css({\n         \"@global\": {\n            [`.xui-${theme}-theme-root`]: ThemeCssVars(THEME)\n         }\n      })\n\n      if (scrollbarCss && typeof document !== 'undefined') {\n         let thumbSize = 10\n         let thumbColor = THEME.colors.divider\n         let trackColor = THEME.colors.background.secondary\n         css({\n            \"@global\": {\n               \"*\": {\n                  scrollbarWidth: \"thin\",\n                  scrollbarColor: `${thumbColor} ${trackColor}`,\n               },\n               \"::-webkit-scrollbar\": {\n                  width: thumbSize,\n                  height: thumbSize,\n               },\n               \"::-webkit-scrollbar-thumb\": {\n                  backgroundColor: thumbColor,\n                  borderRadius: \"5px\",\n                  border: \"2px solid #f4f4f4\",\n               },\n               \"::-webkit-scrollbar-thumb:hover\": {\n                  backgroundColor: thumbColor,\n               },\n               \"::-webkit-scrollbar-track\": {\n                  backgroundColor: trackColor,\n                  borderRadius: \"5px\",\n               },\n            }\n         })\n      }\n\n      resetCss && css({\n         \"@global\": {\n            \"*\": {\n               m: 0,\n               p: 0,\n               outline: \"none\",\n               boxSizing: \"border-box\",\n               verticalAlign: \"baseline\",\n            },\n            \"html, body\": {\n               minHeight: \"100%\",\n               \"-webkit-font-smoothing\": \"antialiased\"\n            } as any,\n            \"img, picture, video, canvas, svg\": {\n               maxWidth: \"100%\",\n               display: \"block\"\n            },\n            \"input, button, textarea, select\": {\n               font: \"inherit\"\n            },\n            \"table\": {\n               borderCollapse: \"collapse\",\n               borderSpacing: 0\n            },\n            \"ol, ul\": {\n               listStyle: \"none\"\n            },\n            \"a\": {\n               display: \"inline-block\"\n            },\n            \"p, h1, h2, h3, h4, h5, h6\": {\n               overflowWrap: \"break-word\",\n            }\n         }\n      })\n   }, [theme])\n\n   return (\n      <ThemeContex.Provider value={theme}>\n         {\n            isRootProvider ? <BreakpointProvider>\n               <Tag\n                  minHeight=\"100%\"\n                  bgcolor={THEME.colors.background.primary}\n                  fontFamily={THEME.typography.fontFamily}\n                  fontSize={THEME.typography.text.fontSize}\n                  fontWeight={THEME.typography.text.fontWeight}\n                  lineHeight={THEME.typography.text.lineHeight}\n                  {...props}\n                  baseClass={`${theme}-theme-root`}\n                  direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n               >\n                  {children}\n                  {renderIsRoot}\n               </Tag>\n            </BreakpointProvider> : <Tag\n               minHeight=\"100%\"\n               bgcolor={THEME.colors.background.primary}\n               fontFamily={THEME.typography.fontFamily}\n               fontSize={THEME.typography.text.fontSize}\n               fontWeight={THEME.typography.text.fontWeight}\n               lineHeight={THEME.typography.text.lineHeight}\n               {...props}\n               baseClass={`${theme}-theme-root`}\n               direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n            >\n               {children}\n            </Tag>\n         }\n      </ThemeContex.Provider>\n   )\n}\n\nexport default ThemeProvider"],"names":["__rest","ThemeFactory","React","css","ThemeCssVars","_jsx","ThemeContex","BreakpointProvider","_jsxs","Tag"],"mappings":"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"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { ThemeOptions } from \"./types\"\nimport Tag from \"../Tag\"\nimport { TagComponentType, TagProps } from \"../Tag/types\"\nimport { BreakpointProvider } from \"../breakpoint\"\nimport { ThemeContex, ThemeFactory } from \"./core\"\nimport ThemeCssVars from \"./ThemeCssVars\"\nimport { css } from \"../css\"\nimport useScrollbar from \"../useScrollbar\"\nimport { createTheme } from \"./createTheme\"\nimport { darkColorPallete, lightColorPallete } from \"./ThemeDefaultOptions\"\n\nexport type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {\n   theme: string;\n   applyScrollbarCss?: boolean;\n   isRootProvider?: boolean;\n   renderIsRoot?: React.ReactElement;\n}\n\ncreateTheme(\"light\", { colors: lightColorPallete })\ncreateTheme(\"dark\", { colors: darkColorPallete })\n\nconst ThemeProvider = ({ children, theme, applyScrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => {\n\n   const THEME = ThemeFactory.get(theme) as ThemeOptions\n   if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`)\n   applyScrollbarCss ??= true\n\n   React.useMemo(() => {\n      const root_cls = `.xui-${theme}-theme-root`\n      let gkeys = Object.keys(THEME.globalStyle || {})\n      let gstyles: any = {}\n      gkeys.forEach((key) => {\n         gstyles[`${root_cls} ${key}`] = THEME.globalStyle[key as any]\n      })\n\n      css({\n         \"@global\": {\n            ...gstyles,\n            [root_cls]: ThemeCssVars(THEME)\n         }\n      })\n\n      applyScrollbarCss && useScrollbar(theme, root_cls)\n\n      css({\n         \"@global\": {\n            \"*\": {\n               m: 0,\n               p: 0,\n               outline: \"none\",\n               boxSizing: \"border-box\",\n               verticalAlign: \"baseline\",\n            },\n            \"html, body\": {\n               minHeight: \"100%\",\n               \"-webkit-font-smoothing\": \"antialiased\"\n            } as any,\n            \"img, picture, video, canvas, svg\": {\n               maxWidth: \"100%\",\n               display: \"block\"\n            },\n            \"input, button, textarea, select\": {\n               font: \"inherit\"\n            },\n            \"table\": {\n               borderCollapse: \"collapse\",\n               borderSpacing: 0\n            },\n            \"ol, ul\": {\n               listStyle: \"none\"\n            },\n            \"a\": {\n               display: \"inline-block\"\n            },\n            \"p, h1, h2, h3, h4, h5, h6\": {\n               overflowWrap: \"break-word\",\n            }\n         }\n      })\n   }, [theme])\n\n   return (\n      <ThemeContex.Provider value={theme}>\n         {\n            isRootProvider ? <BreakpointProvider>\n               <Tag\n                  minHeight=\"100%\"\n                  bgcolor={THEME.colors.background.primary}\n                  fontFamily={THEME.typography.fontFamily}\n                  fontSize={THEME.typography.text.fontSize}\n                  fontWeight={THEME.typography.text.fontWeight}\n                  lineHeight={THEME.typography.text.lineHeight}\n                  {...props}\n                  baseClass={`${theme}-theme-root`}\n                  direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n               >\n                  {children}\n                  {renderIsRoot}\n               </Tag>\n            </BreakpointProvider> : <Tag\n               minHeight=\"100%\"\n               bgcolor={THEME.colors.background.primary}\n               fontFamily={THEME.typography.fontFamily}\n               fontSize={THEME.typography.text.fontSize}\n               fontWeight={THEME.typography.text.fontWeight}\n               lineHeight={THEME.typography.text.lineHeight}\n               {...props}\n               baseClass={`${theme}-theme-root`}\n               direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n            >\n               {children}\n            </Tag>\n         }\n      </ThemeContex.Provider>\n   )\n}\n\nexport default ThemeProvider"],"names":["createTheme","lightColorPallete","darkColorPallete","__rest","ThemeFactory","React","css","ThemeCssVars","useScrollbar","_jsx","ThemeContex","BreakpointProvider","_jsxs","Tag"],"mappings":"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"}

package/theme/ThemeProvider.mjs

@@ -1,51 +1,23 @@
-import {__rest}from'tslib';import {jsx,jsxs}from'react/jsx-runtime';import*as React from'react';import Tag from'../Tag/index.mjs';import {BreakpointProvider}from'../breakpoint/BreakpointProvider.mjs';import {css}from'../css/index.mjs';import {ThemeFactory,ThemeContex}from'./core.mjs';import ThemeCssVars from'./ThemeCssVars.mjs';const ThemeProvider = (_a) => {
-    var { children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot } = _a, props = __rest(_a, ["children", "theme", "resetCss", "scrollbarCss", "isRootProvider", "renderIsRoot"]);
+import {__rest}from'tslib';import {jsx,jsxs}from'react/jsx-runtime';import*as React from'react';import Tag from'../Tag/index.mjs';import {BreakpointProvider}from'../breakpoint/BreakpointProvider.mjs';import {css}from'../css/index.mjs';import {ThemeFactory,ThemeContex}from'./core.mjs';import ThemeCssVars from'./ThemeCssVars.mjs';import useScrollbar from'../useScrollbar.mjs';import {createTheme}from'./createTheme.mjs';import {lightColorPallete,darkColorPallete}from'./ThemeDefaultOptions.mjs';createTheme("light", { colors: lightColorPallete });
+createTheme("dark", { colors: darkColorPallete });
+const ThemeProvider = (_a) => {
+    var { children, theme, applyScrollbarCss, isRootProvider, renderIsRoot } = _a, props = __rest(_a, ["children", "theme", "applyScrollbarCss", "isRootProvider", "renderIsRoot"]);
     const THEME = ThemeFactory.get(theme);
     if (!THEME)
         throw new Error(`Invalid theme name provided: ${theme}`);
-    resetCss !== null && resetCss !== void 0 ? resetCss : (resetCss = true);
-    scrollbarCss !== null && scrollbarCss !== void 0 ? scrollbarCss : (scrollbarCss = true);
+    applyScrollbarCss !== null && applyScrollbarCss !== void 0 ? applyScrollbarCss : (applyScrollbarCss = true);
     React.useMemo(() => {
-        if (!!Object.keys(THEME.globalStyle).length) {
-            css({
-                "@global": THEME.globalStyle
-            });
-        }
+        const root_cls = `.xui-${theme}-theme-root`;
+        let gkeys = Object.keys(THEME.globalStyle || {});
+        let gstyles = {};
+        gkeys.forEach((key) => {
+            gstyles[`${root_cls} ${key}`] = THEME.globalStyle[key];
+        });
         css({
-            "@global": {
-                [`.xui-${theme}-theme-root`]: ThemeCssVars(THEME)
-            }
+            "@global": Object.assign(Object.assign({}, gstyles), { [root_cls]: ThemeCssVars(THEME) })
         });
-        if (scrollbarCss && typeof document !== 'undefined') {
-            let thumbSize = 10;
-            let thumbColor = THEME.colors.divider;
-            let trackColor = THEME.colors.background.secondary;
-            css({
-                "@global": {
-                    "*": {
-                        scrollbarWidth: "thin",
-                        scrollbarColor: `${thumbColor} ${trackColor}`,
-                    },
-                    "::-webkit-scrollbar": {
-                        width: thumbSize,
-                        height: thumbSize,
-                    },
-                    "::-webkit-scrollbar-thumb": {
-                        backgroundColor: thumbColor,
-                        borderRadius: "5px",
-                        border: "2px solid #f4f4f4",
-                    },
-                    "::-webkit-scrollbar-thumb:hover": {
-                        backgroundColor: thumbColor,
-                    },
-                    "::-webkit-scrollbar-track": {
-                        backgroundColor: trackColor,
-                        borderRadius: "5px",
-                    },
-                }
-            });
-        }
-        resetCss && css({
+        applyScrollbarCss && useScrollbar(theme, root_cls);
+        css({
             "@global": {
                 "*": {
                     m: 0,
@@ -81,5 +53,5 @@ import {__rest}from'tslib';import {jsx,jsxs}from'react/jsx-runtime';import*as Re
             }
         });
     }, [theme]);
-    return (jsx(ThemeContex.Provider, Object.assign({ value: theme }, { children: isRootProvider ? jsx(BreakpointProvider, { children: jsxs(Tag, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr" }, { children: [children, renderIsRoot] })) }) : jsx(Tag, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr" }, { children: children })) })));
+    return (jsx(ThemeContex.Provider, { value: theme, children: isRootProvider ? jsx(BreakpointProvider, { children: jsxs(Tag, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr", children: [children, renderIsRoot] })) }) : jsx(Tag, Object.assign({ minHeight: "100%", bgcolor: THEME.colors.background.primary, fontFamily: THEME.typography.fontFamily, fontSize: THEME.typography.text.fontSize, fontWeight: THEME.typography.text.fontWeight, lineHeight: THEME.typography.text.lineHeight }, props, { baseClass: `${theme}-theme-root`, direction: THEME.rtl ? "rtl" : "ltr", children: children })) }));
 };export{ThemeProvider as default};//# sourceMappingURL=ThemeProvider.mjs.map

package/theme/ThemeProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.mjs","sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { ThemeOptions } from \"./types\"\nimport Tag from \"../Tag\"\nimport { TagComponentType, TagProps } from \"../Tag/types\"\nimport { BreakpointProvider } from \"../breakpoint\"\nimport { ThemeContex, ThemeFactory } from \"./core\"\nimport ThemeCssVars from \"./ThemeCssVars\"\nimport { css } from \"../css\"\n\nexport type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {\n   theme: string;\n   resetCss?: boolean;\n   scrollbarCss?: boolean;\n   isRootProvider?: boolean;\n   renderIsRoot?: React.ReactElement;\n}\n\nconst ThemeProvider = ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => {\n   const THEME = ThemeFactory.get(theme) as ThemeOptions\n   if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`)\n   resetCss ??= true\n   scrollbarCss ??= true\n\n   React.useMemo(() => {\n      if (!!Object.keys(THEME.globalStyle).length) {\n         css({\n            \"@global\": THEME.globalStyle\n         })\n      }\n\n      css({\n         \"@global\": {\n            [`.xui-${theme}-theme-root`]: ThemeCssVars(THEME)\n         }\n      })\n\n      if (scrollbarCss && typeof document !== 'undefined') {\n         let thumbSize = 10\n         let thumbColor = THEME.colors.divider\n         let trackColor = THEME.colors.background.secondary\n         css({\n            \"@global\": {\n               \"*\": {\n                  scrollbarWidth: \"thin\",\n                  scrollbarColor: `${thumbColor} ${trackColor}`,\n               },\n               \"::-webkit-scrollbar\": {\n                  width: thumbSize,\n                  height: thumbSize,\n               },\n               \"::-webkit-scrollbar-thumb\": {\n                  backgroundColor: thumbColor,\n                  borderRadius: \"5px\",\n                  border: \"2px solid #f4f4f4\",\n               },\n               \"::-webkit-scrollbar-thumb:hover\": {\n                  backgroundColor: thumbColor,\n               },\n               \"::-webkit-scrollbar-track\": {\n                  backgroundColor: trackColor,\n                  borderRadius: \"5px\",\n               },\n            }\n         })\n      }\n\n      resetCss && css({\n         \"@global\": {\n            \"*\": {\n               m: 0,\n               p: 0,\n               outline: \"none\",\n               boxSizing: \"border-box\",\n               verticalAlign: \"baseline\",\n            },\n            \"html, body\": {\n               minHeight: \"100%\",\n               \"-webkit-font-smoothing\": \"antialiased\"\n            } as any,\n            \"img, picture, video, canvas, svg\": {\n               maxWidth: \"100%\",\n               display: \"block\"\n            },\n            \"input, button, textarea, select\": {\n               font: \"inherit\"\n            },\n            \"table\": {\n               borderCollapse: \"collapse\",\n               borderSpacing: 0\n            },\n            \"ol, ul\": {\n               listStyle: \"none\"\n            },\n            \"a\": {\n               display: \"inline-block\"\n            },\n            \"p, h1, h2, h3, h4, h5, h6\": {\n               overflowWrap: \"break-word\",\n            }\n         }\n      })\n   }, [theme])\n\n   return (\n      <ThemeContex.Provider value={theme}>\n         {\n            isRootProvider ? <BreakpointProvider>\n               <Tag\n                  minHeight=\"100%\"\n                  bgcolor={THEME.colors.background.primary}\n                  fontFamily={THEME.typography.fontFamily}\n                  fontSize={THEME.typography.text.fontSize}\n                  fontWeight={THEME.typography.text.fontWeight}\n                  lineHeight={THEME.typography.text.lineHeight}\n                  {...props}\n                  baseClass={`${theme}-theme-root`}\n                  direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n               >\n                  {children}\n                  {renderIsRoot}\n               </Tag>\n            </BreakpointProvider> : <Tag\n               minHeight=\"100%\"\n               bgcolor={THEME.colors.background.primary}\n               fontFamily={THEME.typography.fontFamily}\n               fontSize={THEME.typography.text.fontSize}\n               fontWeight={THEME.typography.text.fontWeight}\n               lineHeight={THEME.typography.text.lineHeight}\n               {...props}\n               baseClass={`${theme}-theme-root`}\n               direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n            >\n               {children}\n            </Tag>\n         }\n      </ThemeContex.Provider>\n   )\n}\n\nexport default ThemeProvider"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"ThemeProvider.mjs","sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { ThemeOptions } from \"./types\"\nimport Tag from \"../Tag\"\nimport { TagComponentType, TagProps } from \"../Tag/types\"\nimport { BreakpointProvider } from \"../breakpoint\"\nimport { ThemeContex, ThemeFactory } from \"./core\"\nimport ThemeCssVars from \"./ThemeCssVars\"\nimport { css } from \"../css\"\nimport useScrollbar from \"../useScrollbar\"\nimport { createTheme } from \"./createTheme\"\nimport { darkColorPallete, lightColorPallete } from \"./ThemeDefaultOptions\"\n\nexport type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T> & {\n   theme: string;\n   applyScrollbarCss?: boolean;\n   isRootProvider?: boolean;\n   renderIsRoot?: React.ReactElement;\n}\n\ncreateTheme(\"light\", { colors: lightColorPallete })\ncreateTheme(\"dark\", { colors: darkColorPallete })\n\nconst ThemeProvider = ({ children, theme, applyScrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => {\n\n   const THEME = ThemeFactory.get(theme) as ThemeOptions\n   if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`)\n   applyScrollbarCss ??= true\n\n   React.useMemo(() => {\n      const root_cls = `.xui-${theme}-theme-root`\n      let gkeys = Object.keys(THEME.globalStyle || {})\n      let gstyles: any = {}\n      gkeys.forEach((key) => {\n         gstyles[`${root_cls} ${key}`] = THEME.globalStyle[key as any]\n      })\n\n      css({\n         \"@global\": {\n            ...gstyles,\n            [root_cls]: ThemeCssVars(THEME)\n         }\n      })\n\n      applyScrollbarCss && useScrollbar(theme, root_cls)\n\n      css({\n         \"@global\": {\n            \"*\": {\n               m: 0,\n               p: 0,\n               outline: \"none\",\n               boxSizing: \"border-box\",\n               verticalAlign: \"baseline\",\n            },\n            \"html, body\": {\n               minHeight: \"100%\",\n               \"-webkit-font-smoothing\": \"antialiased\"\n            } as any,\n            \"img, picture, video, canvas, svg\": {\n               maxWidth: \"100%\",\n               display: \"block\"\n            },\n            \"input, button, textarea, select\": {\n               font: \"inherit\"\n            },\n            \"table\": {\n               borderCollapse: \"collapse\",\n               borderSpacing: 0\n            },\n            \"ol, ul\": {\n               listStyle: \"none\"\n            },\n            \"a\": {\n               display: \"inline-block\"\n            },\n            \"p, h1, h2, h3, h4, h5, h6\": {\n               overflowWrap: \"break-word\",\n            }\n         }\n      })\n   }, [theme])\n\n   return (\n      <ThemeContex.Provider value={theme}>\n         {\n            isRootProvider ? <BreakpointProvider>\n               <Tag\n                  minHeight=\"100%\"\n                  bgcolor={THEME.colors.background.primary}\n                  fontFamily={THEME.typography.fontFamily}\n                  fontSize={THEME.typography.text.fontSize}\n                  fontWeight={THEME.typography.text.fontWeight}\n                  lineHeight={THEME.typography.text.lineHeight}\n                  {...props}\n                  baseClass={`${theme}-theme-root`}\n                  direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n               >\n                  {children}\n                  {renderIsRoot}\n               </Tag>\n            </BreakpointProvider> : <Tag\n               minHeight=\"100%\"\n               bgcolor={THEME.colors.background.primary}\n               fontFamily={THEME.typography.fontFamily}\n               fontSize={THEME.typography.text.fontSize}\n               fontWeight={THEME.typography.text.fontWeight}\n               lineHeight={THEME.typography.text.lineHeight}\n               {...props}\n               baseClass={`${theme}-theme-root`}\n               direction={THEME.rtl ? \"rtl\" : \"ltr\"}\n            >\n               {children}\n            </Tag>\n         }\n      </ThemeContex.Provider>\n   )\n}\n\nexport default ThemeProvider"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/theme/core.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.js","sources":["../../src/theme/core.ts"],"sourcesContent":["import React from \"react\"\nimport { ObjectType, ThemeOptions } from \"./types\"\n\nexport const ThemeFactory = new Map<string, ThemeOptions>()\nexport const ThemeContex = React.createContext(\"light\")\nexport const getTheme = (theme: string) => ThemeFactory.get(theme)\nexport const useTheme = (): ThemeOptions => ThemeFactory.get(React.useContext(ThemeContex)) as any\n\nexport const mergeObject = (a: ObjectType, b: ObjectType) => {\n   a = { ...a }\n   b = { ...b }\n   for (const key in b) {\n      const v = (b as any)[key]\n      if (typeof v === 'object' && !Array.isArray(v) && !React.isValidElement(v)) {\n         a[key] = mergeObject(a[key], b[key])\n      } else {\n         a[key] = v\n      }\n   }\n   return a\n}\n"],"names":[],"mappings":"iGAGa,MAAA,YAAY,GAAG,IAAI,GAAG;AACtB,MAAA,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO;AAC/C,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAK,YAAY,CAAC,GAAG,CAAC,KAAK;AACpD,MAAA,QAAQ,GAAG,MAAoB,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC;MAE7E,WAAW,GAAG,CAAC,CAAa,EAAE,CAAa,KAAI;IACzD,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;IACZ,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;AACZ,IAAA,KAAK,MAAM,GAAG,IAAI,CAAC,EAAE;AAClB,QAAA,MAAM,CAAC,GAAI,CAAS,CAAC,GAAG,CAAC;QACzB,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;AACzE,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;AACtC;AAAM,aAAA;AACJ,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;AACZ;AACH;AACD,IAAA,OAAO,CAAC;AACX"}
+{"version":3,"file":"core.js","sources":["../../src/theme/core.ts"],"sourcesContent":["import React from \"react\"\nimport { ObjectType, ThemeOptions } from \"./types\"\n\nexport const ThemeFactory = new Map<string, ThemeOptions>()\nexport const ThemeContex = React.createContext(\"light\")\nexport const getTheme = (theme: string) => ThemeFactory.get(theme)\nexport const useTheme = (): ThemeOptions => ThemeFactory.get(React.useContext(ThemeContex)) as any\n\nexport const mergeObject = (a: ObjectType, b: ObjectType) => {\n   a = { ...a }\n   b = { ...b }\n   for (const key in b) {\n      const v = (b as any)[key]\n      if (typeof v === 'object' && !Array.isArray(v) && !React.isValidElement(v)) {\n         a[key] = mergeObject(a[key], b[key])\n      } else {\n         a[key] = v\n      }\n   }\n   return a\n}\n"],"names":[],"mappings":"iGAGO,MAAM,YAAY,GAAG,IAAI,GAAG;AAC5B,MAAM,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,OAAO;AAC/C,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAK,YAAY,CAAC,GAAG,CAAC,KAAK;AAC1D,MAAM,QAAQ,GAAG,MAAoB,YAAY,CAAC,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC;MAE7E,WAAW,GAAG,CAAC,CAAa,EAAE,CAAa,KAAI;IACzD,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;IACZ,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;AACZ,IAAA,KAAK,MAAM,GAAG,IAAI,CAAC,EAAE;AAClB,QAAA,MAAM,CAAC,GAAI,CAAS,CAAC,GAAG,CAAC;QACzB,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;AACzE,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;QACvC;aAAO;AACJ,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;QACb;IACH;AACA,IAAA,OAAO,CAAC;AACX"}

package/theme/core.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"core.mjs","sources":["../../src/theme/core.ts"],"sourcesContent":["import React from \"react\"\nimport { ObjectType, ThemeOptions } from \"./types\"\n\nexport const ThemeFactory = new Map<string, ThemeOptions>()\nexport const ThemeContex = React.createContext(\"light\")\nexport const getTheme = (theme: string) => ThemeFactory.get(theme)\nexport const useTheme = (): ThemeOptions => ThemeFactory.get(React.useContext(ThemeContex)) as any\n\nexport const mergeObject = (a: ObjectType, b: ObjectType) => {\n   a = { ...a }\n   b = { ...b }\n   for (const key in b) {\n      const v = (b as any)[key]\n      if (typeof v === 'object' && !Array.isArray(v) && !React.isValidElement(v)) {\n         a[key] = mergeObject(a[key], b[key])\n      } else {\n         a[key] = v\n      }\n   }\n   return a\n}\n"],"names":["React"],"mappings":"kCAGa,MAAA,YAAY,GAAG,IAAI,GAAG;AACtB,MAAA,WAAW,GAAGA,cAAK,CAAC,aAAa,CAAC,OAAO;AAC/C,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAK,YAAY,CAAC,GAAG,CAAC,KAAK;AACpD,MAAA,QAAQ,GAAG,MAAoB,YAAY,CAAC,GAAG,CAACA,cAAK,CAAC,UAAU,CAAC,WAAW,CAAC;MAE7E,WAAW,GAAG,CAAC,CAAa,EAAE,CAAa,KAAI;IACzD,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;IACZ,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;AACZ,IAAA,KAAK,MAAM,GAAG,IAAI,CAAC,EAAE;AAClB,QAAA,MAAM,CAAC,GAAI,CAAS,CAAC,GAAG,CAAC;QACzB,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAACA,cAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;AACzE,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;AACtC;AAAM,aAAA;AACJ,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;AACZ;AACH;AACD,IAAA,OAAO,CAAC;AACX"}
+{"version":3,"file":"core.mjs","sources":["../../src/theme/core.ts"],"sourcesContent":["import React from \"react\"\nimport { ObjectType, ThemeOptions } from \"./types\"\n\nexport const ThemeFactory = new Map<string, ThemeOptions>()\nexport const ThemeContex = React.createContext(\"light\")\nexport const getTheme = (theme: string) => ThemeFactory.get(theme)\nexport const useTheme = (): ThemeOptions => ThemeFactory.get(React.useContext(ThemeContex)) as any\n\nexport const mergeObject = (a: ObjectType, b: ObjectType) => {\n   a = { ...a }\n   b = { ...b }\n   for (const key in b) {\n      const v = (b as any)[key]\n      if (typeof v === 'object' && !Array.isArray(v) && !React.isValidElement(v)) {\n         a[key] = mergeObject(a[key], b[key])\n      } else {\n         a[key] = v\n      }\n   }\n   return a\n}\n"],"names":["React"],"mappings":"kCAGO,MAAM,YAAY,GAAG,IAAI,GAAG;AAC5B,MAAM,WAAW,GAAGA,cAAK,CAAC,aAAa,CAAC,OAAO;AAC/C,MAAM,QAAQ,GAAG,CAAC,KAAa,KAAK,YAAY,CAAC,GAAG,CAAC,KAAK;AAC1D,MAAM,QAAQ,GAAG,MAAoB,YAAY,CAAC,GAAG,CAACA,cAAK,CAAC,UAAU,CAAC,WAAW,CAAC;MAE7E,WAAW,GAAG,CAAC,CAAa,EAAE,CAAa,KAAI;IACzD,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;IACZ,CAAC,GAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAQ,CAAC,CAAE;AACZ,IAAA,KAAK,MAAM,GAAG,IAAI,CAAC,EAAE;AAClB,QAAA,MAAM,CAAC,GAAI,CAAS,CAAC,GAAG,CAAC;QACzB,IAAI,OAAO,CAAC,KAAK,QAAQ,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAACA,cAAK,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;AACzE,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;QACvC;aAAO;AACJ,YAAA,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC;QACb;IACH;AACA,IAAA,OAAO,CAAC;AACX"}

package/theme/createTheme.d.ts

@@ -0,0 +1,5 @@
+import { ThemeOptionInput, ThemeOptions } from './types.js';
+
+declare const createTheme: (name: string, options: ThemeOptionInput, darkMode?: boolean) => ThemeOptions;
+
+export { createTheme };

package/theme/createTheme.js

@@ -1,21 +1,19 @@
 'use strict';Object.defineProperty(exports,'__esModule',{value:true});var ThemeDefaultOptions=require('./ThemeDefaultOptions.js'),core=require('./core.js'),createColor=require('./createColor.js'),index=require('../css/index.js');const createTheme = (name, options, darkMode) => {
-    if (!core.ThemeFactory.has(name)) {
-        let theme = core.mergeObject(ThemeDefaultOptions.default, Object.assign(Object.assign(Object.assign({}, ({})), options), { name, breakpoints: index.breakpoints }));
-        theme = core.mergeObject(theme, {
-            colors: {
-                background: createColor.default(theme, "background"),
-                brand: createColor.default(theme, "brand"),
-                accent: createColor.default(theme, "accent"),
-                info: createColor.default(theme, "info"),
-                success: createColor.default(theme, "success"),
-                warning: createColor.default(theme, "warning"),
-                danger: createColor.default(theme, "danger")
-            }
-        });
-        core.ThemeFactory.set(name, theme);
-    }
-    else {
+    if (core.ThemeFactory.has(name)) {
         throw new Error(`theme "${name}" already exists!`);
     }
-    return core.ThemeFactory.get(name);
+    let theme = core.mergeObject(ThemeDefaultOptions.default, Object.assign(Object.assign(Object.assign({}, (darkMode ? ThemeDefaultOptions.darkColorPallete : {})), options), { name, breakpoints: index.breakpoints }));
+    theme = core.mergeObject(theme, {
+        colors: {
+            background: createColor.default(theme, "background"),
+            brand: createColor.default(theme, "brand"),
+            accent: createColor.default(theme, "accent"),
+            info: createColor.default(theme, "info"),
+            success: createColor.default(theme, "success"),
+            warning: createColor.default(theme, "warning"),
+            danger: createColor.default(theme, "danger")
+        }
+    });
+    core.ThemeFactory.set(name, theme);
+    return theme;
 };exports.createTheme=createTheme;//# sourceMappingURL=createTheme.js.map

package/theme/createTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"createTheme.js","sources":["../../src/theme/createTheme.ts"],"sourcesContent":["import { ThemeOptions, ThemeOptionInput } from \"./types\"\nimport defaultThemeOption, { darkColorPallete } from './ThemeDefaultOptions'\nimport { mergeObject, ThemeFactory } from \"./core\"\nimport createColor from \"./createColor\"\nimport { breakpoints } from \"../css\"\n\nexport const createTheme = (name: string, options: ThemeOptionInput, darkMode?: boolean): ThemeOptions => {\n   if (!ThemeFactory.has(name)) {\n      let theme: any = mergeObject(defaultThemeOption, {\n         ...(darkMode ? darkColorPallete : {}),\n         ...options,\n         name,\n         breakpoints: breakpoints\n      })\n\n      theme = mergeObject(theme, {\n         colors: {\n            background: createColor(theme, \"background\"),\n            brand: createColor(theme, \"brand\"),\n            accent: createColor(theme, \"accent\"),\n            info: createColor(theme, \"info\"),\n            success: createColor(theme, \"success\"),\n            warning: createColor(theme, \"warning\"),\n            danger: createColor(theme, \"danger\")\n         }\n      })\n      ThemeFactory.set(name, theme)\n   } else {\n      throw new Error(`theme \"${name}\" already exists!`);\n   }\n\n   return ThemeFactory.get(name) as ThemeOptions\n}\n"],"names":["ThemeFactory","mergeObject","defaultThemeOption","breakpoints","createColor"],"mappings":"qOAMa,MAAA,WAAW,GAAG,CAAC,IAAY,EAAE,OAAyB,EAAE,QAAkB,KAAkB;AACtG,IAAA,IAAI,CAACA,iBAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;QAC1B,IAAI,KAAK,GAAQC,gBAAW,CAACC,2BAAkB,EACzC,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GAA+B,EAAE,EAAC,EAClC,OAAO,CAAA,EAAA,EACV,IAAI,EACJ,WAAW,EAAEC,iBAAW,EAAA,CAAA,CACzB;AAEF,QAAA,KAAK,GAAGF,gBAAW,CAAC,KAAK,EAAE;AACxB,YAAA,MAAM,EAAE;AACL,gBAAA,UAAU,EAAEG,mBAAW,CAAC,KAAK,EAAE,YAAY,CAAC;AAC5C,gBAAA,KAAK,EAAEA,mBAAW,CAAC,KAAK,EAAE,OAAO,CAAC;AAClC,gBAAA,MAAM,EAAEA,mBAAW,CAAC,KAAK,EAAE,QAAQ,CAAC;AACpC,gBAAA,IAAI,EAAEA,mBAAW,CAAC,KAAK,EAAE,MAAM,CAAC;AAChC,gBAAA,OAAO,EAAEA,mBAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,gBAAA,OAAO,EAAEA,mBAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,gBAAA,MAAM,EAAEA,mBAAW,CAAC,KAAK,EAAE,QAAQ;AACrC;AACH,SAAA,CAAC;AACF,QAAAJ,iBAAY,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC;AAC/B;AAAM,SAAA;AACJ,QAAA,MAAM,IAAI,KAAK,CAAC,UAAU,IAAI,CAAA,iBAAA,CAAmB,CAAC;AACpD;AAED,IAAA,OAAOA,iBAAY,CAAC,GAAG,CAAC,IAAI,CAAiB;AAChD"}
+{"version":3,"file":"createTheme.js","sources":["../../src/theme/createTheme.ts"],"sourcesContent":["import { ThemeOptions, ThemeOptionInput } from \"./types\"\nimport defaultThemeOption, { darkColorPallete } from './ThemeDefaultOptions'\nimport { mergeObject, ThemeFactory } from \"./core\"\nimport createColor from \"./createColor\"\nimport { breakpoints } from \"../css\"\n\nexport const createTheme = (name: string, options: ThemeOptionInput, darkMode?: boolean): ThemeOptions => {\n   if (ThemeFactory.has(name)) {\n      throw new Error(`theme \"${name}\" already exists!`);\n   }\n\n   let theme: any = mergeObject(defaultThemeOption, {\n      ...(darkMode ? darkColorPallete : {}),\n      ...options,\n      name,\n      breakpoints: breakpoints\n   })\n\n   theme = mergeObject(theme, {\n      colors: {\n         background: createColor(theme, \"background\"),\n         brand: createColor(theme, \"brand\"),\n         accent: createColor(theme, \"accent\"),\n         info: createColor(theme, \"info\"),\n         success: createColor(theme, \"success\"),\n         warning: createColor(theme, \"warning\"),\n         danger: createColor(theme, \"danger\")\n      }\n   })\n\n   ThemeFactory.set(name, theme)\n\n   return theme as ThemeOptions\n}\n"],"names":["ThemeFactory","mergeObject","defaultThemeOption","darkColorPallete","breakpoints","createColor"],"mappings":"qOAMO,MAAM,WAAW,GAAG,CAAC,IAAY,EAAE,OAAyB,EAAE,QAAkB,KAAkB;AACtG,IAAA,IAAIA,iBAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACzB,QAAA,MAAM,IAAI,KAAK,CAAC,UAAU,IAAI,CAAA,iBAAA,CAAmB,CAAC;IACrD;IAEA,IAAI,KAAK,GAAQC,gBAAW,CAACC,2BAAkB,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GACxC,QAAQ,GAAGC,oCAAgB,GAAG,EAAE,EAAC,EAClC,OAAO,CAAA,EAAA,EACV,IAAI,EACJ,WAAW,EAAEC,iBAAW,EAAA,CAAA,CACzB;AAEF,IAAA,KAAK,GAAGH,gBAAW,CAAC,KAAK,EAAE;AACxB,QAAA,MAAM,EAAE;AACL,YAAA,UAAU,EAAEI,mBAAW,CAAC,KAAK,EAAE,YAAY,CAAC;AAC5C,YAAA,KAAK,EAAEA,mBAAW,CAAC,KAAK,EAAE,OAAO,CAAC;AAClC,YAAA,MAAM,EAAEA,mBAAW,CAAC,KAAK,EAAE,QAAQ,CAAC;AACpC,YAAA,IAAI,EAAEA,mBAAW,CAAC,KAAK,EAAE,MAAM,CAAC;AAChC,YAAA,OAAO,EAAEA,mBAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,YAAA,OAAO,EAAEA,mBAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,YAAA,MAAM,EAAEA,mBAAW,CAAC,KAAK,EAAE,QAAQ;AACrC;AACH,KAAA,CAAC;AAEF,IAAAL,iBAAY,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC;AAE7B,IAAA,OAAO,KAAqB;AAC/B"}

package/theme/createTheme.mjs

@@ -1,21 +1,19 @@
-import defaultThemeOption from'./ThemeDefaultOptions.mjs';import {ThemeFactory,mergeObject}from'./core.mjs';import createColor from'./createColor.mjs';import {breakpoints}from'../css/index.mjs';const createTheme = (name, options, darkMode) => {
-    if (!ThemeFactory.has(name)) {
-        let theme = mergeObject(defaultThemeOption, Object.assign(Object.assign(Object.assign({}, ({})), options), { name, breakpoints: breakpoints }));
-        theme = mergeObject(theme, {
-            colors: {
-                background: createColor(theme, "background"),
-                brand: createColor(theme, "brand"),
-                accent: createColor(theme, "accent"),
-                info: createColor(theme, "info"),
-                success: createColor(theme, "success"),
-                warning: createColor(theme, "warning"),
-                danger: createColor(theme, "danger")
-            }
-        });
-        ThemeFactory.set(name, theme);
-    }
-    else {
+import defaultThemeOption,{darkColorPallete}from'./ThemeDefaultOptions.mjs';import {ThemeFactory,mergeObject}from'./core.mjs';import createColor from'./createColor.mjs';import {breakpoints}from'../css/index.mjs';const createTheme = (name, options, darkMode) => {
+    if (ThemeFactory.has(name)) {
         throw new Error(`theme "${name}" already exists!`);
     }
-    return ThemeFactory.get(name);
+    let theme = mergeObject(defaultThemeOption, Object.assign(Object.assign(Object.assign({}, (darkMode ? darkColorPallete : {})), options), { name, breakpoints: breakpoints }));
+    theme = mergeObject(theme, {
+        colors: {
+            background: createColor(theme, "background"),
+            brand: createColor(theme, "brand"),
+            accent: createColor(theme, "accent"),
+            info: createColor(theme, "info"),
+            success: createColor(theme, "success"),
+            warning: createColor(theme, "warning"),
+            danger: createColor(theme, "danger")
+        }
+    });
+    ThemeFactory.set(name, theme);
+    return theme;
 };export{createTheme};//# sourceMappingURL=createTheme.mjs.map

package/theme/createTheme.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"createTheme.mjs","sources":["../../src/theme/createTheme.ts"],"sourcesContent":["import { ThemeOptions, ThemeOptionInput } from \"./types\"\nimport defaultThemeOption, { darkColorPallete } from './ThemeDefaultOptions'\nimport { mergeObject, ThemeFactory } from \"./core\"\nimport createColor from \"./createColor\"\nimport { breakpoints } from \"../css\"\n\nexport const createTheme = (name: string, options: ThemeOptionInput, darkMode?: boolean): ThemeOptions => {\n   if (!ThemeFactory.has(name)) {\n      let theme: any = mergeObject(defaultThemeOption, {\n         ...(darkMode ? darkColorPallete : {}),\n         ...options,\n         name,\n         breakpoints: breakpoints\n      })\n\n      theme = mergeObject(theme, {\n         colors: {\n            background: createColor(theme, \"background\"),\n            brand: createColor(theme, \"brand\"),\n            accent: createColor(theme, \"accent\"),\n            info: createColor(theme, \"info\"),\n            success: createColor(theme, \"success\"),\n            warning: createColor(theme, \"warning\"),\n            danger: createColor(theme, \"danger\")\n         }\n      })\n      ThemeFactory.set(name, theme)\n   } else {\n      throw new Error(`theme \"${name}\" already exists!`);\n   }\n\n   return ThemeFactory.get(name) as ThemeOptions\n}\n"],"names":[],"mappings":"kMAMa,MAAA,WAAW,GAAG,CAAC,IAAY,EAAE,OAAyB,EAAE,QAAkB,KAAkB;AACtG,IAAA,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;QAC1B,IAAI,KAAK,GAAQ,WAAW,CAAC,kBAAkB,EACzC,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GAA+B,EAAE,EAAC,EAClC,OAAO,CAAA,EAAA,EACV,IAAI,EACJ,WAAW,EAAE,WAAW,EAAA,CAAA,CACzB;AAEF,QAAA,KAAK,GAAG,WAAW,CAAC,KAAK,EAAE;AACxB,YAAA,MAAM,EAAE;AACL,gBAAA,UAAU,EAAE,WAAW,CAAC,KAAK,EAAE,YAAY,CAAC;AAC5C,gBAAA,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,OAAO,CAAC;AAClC,gBAAA,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC;AACpC,gBAAA,IAAI,EAAE,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC;AAChC,gBAAA,OAAO,EAAE,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,gBAAA,OAAO,EAAE,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,gBAAA,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,QAAQ;AACrC;AACH,SAAA,CAAC;AACF,QAAA,YAAY,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC;AAC/B;AAAM,SAAA;AACJ,QAAA,MAAM,IAAI,KAAK,CAAC,UAAU,IAAI,CAAA,iBAAA,CAAmB,CAAC;AACpD;AAED,IAAA,OAAO,YAAY,CAAC,GAAG,CAAC,IAAI,CAAiB;AAChD"}
+{"version":3,"file":"createTheme.mjs","sources":["../../src/theme/createTheme.ts"],"sourcesContent":["import { ThemeOptions, ThemeOptionInput } from \"./types\"\nimport defaultThemeOption, { darkColorPallete } from './ThemeDefaultOptions'\nimport { mergeObject, ThemeFactory } from \"./core\"\nimport createColor from \"./createColor\"\nimport { breakpoints } from \"../css\"\n\nexport const createTheme = (name: string, options: ThemeOptionInput, darkMode?: boolean): ThemeOptions => {\n   if (ThemeFactory.has(name)) {\n      throw new Error(`theme \"${name}\" already exists!`);\n   }\n\n   let theme: any = mergeObject(defaultThemeOption, {\n      ...(darkMode ? darkColorPallete : {}),\n      ...options,\n      name,\n      breakpoints: breakpoints\n   })\n\n   theme = mergeObject(theme, {\n      colors: {\n         background: createColor(theme, \"background\"),\n         brand: createColor(theme, \"brand\"),\n         accent: createColor(theme, \"accent\"),\n         info: createColor(theme, \"info\"),\n         success: createColor(theme, \"success\"),\n         warning: createColor(theme, \"warning\"),\n         danger: createColor(theme, \"danger\")\n      }\n   })\n\n   ThemeFactory.set(name, theme)\n\n   return theme as ThemeOptions\n}\n"],"names":[],"mappings":"oNAMO,MAAM,WAAW,GAAG,CAAC,IAAY,EAAE,OAAyB,EAAE,QAAkB,KAAkB;AACtG,IAAA,IAAI,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACzB,QAAA,MAAM,IAAI,KAAK,CAAC,UAAU,IAAI,CAAA,iBAAA,CAAmB,CAAC;IACrD;IAEA,IAAI,KAAK,GAAQ,WAAW,CAAC,kBAAkB,EAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GACxC,QAAQ,GAAG,gBAAgB,GAAG,EAAE,EAAC,EAClC,OAAO,CAAA,EAAA,EACV,IAAI,EACJ,WAAW,EAAE,WAAW,EAAA,CAAA,CACzB;AAEF,IAAA,KAAK,GAAG,WAAW,CAAC,KAAK,EAAE;AACxB,QAAA,MAAM,EAAE;AACL,YAAA,UAAU,EAAE,WAAW,CAAC,KAAK,EAAE,YAAY,CAAC;AAC5C,YAAA,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,OAAO,CAAC;AAClC,YAAA,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC;AACpC,YAAA,IAAI,EAAE,WAAW,CAAC,KAAK,EAAE,MAAM,CAAC;AAChC,YAAA,OAAO,EAAE,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,YAAA,OAAO,EAAE,WAAW,CAAC,KAAK,EAAE,SAAS,CAAC;AACtC,YAAA,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,QAAQ;AACrC;AACH,KAAA,CAAC;AAEF,IAAA,YAAY,CAAC,GAAG,CAAC,IAAI,EAAE,KAAK,CAAC;AAE7B,IAAA,OAAO,KAAqB;AAC/B"}

package/theme/createThemeSwitcher.d.ts

@@ -1,9 +1,14 @@
 import { ThemeOptions } from './types.js';
 
-declare const createThemeSwitcher: (defaultTheme: string, store?: "session" | "local") => () => {
+type ThemeSwitcherOption = {
+    store: "memory" | "session" | "local";
+    onChange: (theme: string) => void;
+};
+declare const createThemeSwitcher: (defaultTheme: string, option?: ThemeSwitcherOption) => () => {
     name: string;
     theme: ThemeOptions | undefined;
     change: (theme: string) => void;
 };
 
 export { createThemeSwitcher as default };
+export type { ThemeSwitcherOption };

package/theme/createThemeSwitcher.js

@@ -1,5 +1,10 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var reactStateBucket=require('react-state-bucket'),core=require('./core.js');const createThemeSwitcher = (defaultTheme, store) => {
-    const useThemeState = reactStateBucket.createBucket({ name: defaultTheme }, { store });
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});var reactStateBucket=require('react-state-bucket'),core=require('./core.js');const createThemeSwitcher = (defaultTheme, option) => {
+    const useThemeState = reactStateBucket.createBucket({ name: defaultTheme }, {
+        store: (option === null || option === void 0 ? void 0 : option.store) || "memory",
+        onChange: (key, value) => {
+            option === null || option === void 0 ? void 0 : option.onChange(value);
+        }
+    });
     const useThemeSwitcher = () => {
         const state = useThemeState();
         return {

package/theme/createThemeSwitcher.js.map

@@ -1 +1 @@
-{"version":3,"file":"createThemeSwitcher.js","sources":["../../src/theme/createThemeSwitcher.ts"],"sourcesContent":["import { createBucket } from \"react-state-bucket\"\nimport { getTheme } from \"./core\"\n\nconst createThemeSwitcher = (defaultTheme: string, store?: \"session\" | \"local\") => {\n   const useThemeState = createBucket({ name: defaultTheme }, { store })\n   const useThemeSwitcher = () => {\n      const state = useThemeState()\n      return {\n         name: state.get(\"name\"),\n         theme: getTheme(state.get(\"name\")),\n         change: (theme: string) => state.set(\"name\", theme)\n      }\n   }\n   return useThemeSwitcher\n}\n\n\nexport default createThemeSwitcher"],"names":["createBucket","getTheme"],"mappings":"mJAGA,MAAM,mBAAmB,GAAG,CAAC,YAAoB,EAAE,KAA2B,KAAI;AAC/E,IAAA,MAAM,aAAa,GAAGA,6BAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;IACrE,MAAM,gBAAgB,GAAG,MAAK;AAC3B,QAAA,MAAM,KAAK,GAAG,aAAa,EAAE;QAC7B,OAAO;AACJ,YAAA,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;YACvB,KAAK,EAAEC,aAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;AAClC,YAAA,MAAM,EAAE,CAAC,KAAa,KAAK,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,KAAK;SACpD;AACJ,KAAC;AACD,IAAA,OAAO,gBAAgB;AAC1B"}
+{"version":3,"file":"createThemeSwitcher.js","sources":["../../src/theme/createThemeSwitcher.ts"],"sourcesContent":["import { createBucket } from \"react-state-bucket\"\nimport { getTheme } from \"./core\"\n\nexport type ThemeSwitcherOption = {\n   store: \"memory\" | \"session\" | \"local\",\n   onChange: (theme: string) => void\n}\n\nconst createThemeSwitcher = (defaultTheme: string, option?: ThemeSwitcherOption) => {\n\n   const useThemeState = createBucket({ name: defaultTheme }, {\n      store: option?.store || \"memory\",\n      onChange: (key, value) => {\n         option?.onChange(value)\n      }\n   })\n\n   const useThemeSwitcher = () => {\n      const state = useThemeState()\n      return {\n         name: state.get(\"name\"),\n         theme: getTheme(state.get(\"name\")),\n         change: (theme: string) => state.set(\"name\", theme)\n      }\n   }\n   return useThemeSwitcher\n}\n\n\nexport default createThemeSwitcher"],"names":["createBucket","getTheme"],"mappings":"mJAQA,MAAM,mBAAmB,GAAG,CAAC,YAAoB,EAAE,MAA4B,KAAI;IAEhF,MAAM,aAAa,GAAGA,6BAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE;QACxD,KAAK,EAAE,CAAA,MAAM,KAAA,IAAA,IAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,KAAI,QAAQ;AAChC,QAAA,QAAQ,EAAE,CAAC,GAAG,EAAE,KAAK,KAAI;YACtB,MAAM,KAAA,IAAA,IAAN,MAAM,KAAA,MAAA,GAAA,MAAA,GAAN,MAAM,CAAE,QAAQ,CAAC,KAAK,CAAC;QAC1B;AACF,KAAA,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;AAC3B,QAAA,MAAM,KAAK,GAAG,aAAa,EAAE;QAC7B,OAAO;AACJ,YAAA,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;YACvB,KAAK,EAAEC,aAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;AAClC,YAAA,MAAM,EAAE,CAAC,KAAa,KAAK,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,KAAK;SACpD;AACJ,IAAA,CAAC;AACD,IAAA,OAAO,gBAAgB;AAC1B"}

package/theme/createThemeSwitcher.mjs

@@ -1,5 +1,10 @@
-import {createBucket}from'react-state-bucket';import {getTheme}from'./core.mjs';const createThemeSwitcher = (defaultTheme, store) => {
-    const useThemeState = createBucket({ name: defaultTheme }, { store });
+import {createBucket}from'react-state-bucket';import {getTheme}from'./core.mjs';const createThemeSwitcher = (defaultTheme, option) => {
+    const useThemeState = createBucket({ name: defaultTheme }, {
+        store: (option === null || option === void 0 ? void 0 : option.store) || "memory",
+        onChange: (key, value) => {
+            option === null || option === void 0 ? void 0 : option.onChange(value);
+        }
+    });
     const useThemeSwitcher = () => {
         const state = useThemeState();
         return {

package/theme/createThemeSwitcher.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"createThemeSwitcher.mjs","sources":["../../src/theme/createThemeSwitcher.ts"],"sourcesContent":["import { createBucket } from \"react-state-bucket\"\nimport { getTheme } from \"./core\"\n\nconst createThemeSwitcher = (defaultTheme: string, store?: \"session\" | \"local\") => {\n   const useThemeState = createBucket({ name: defaultTheme }, { store })\n   const useThemeSwitcher = () => {\n      const state = useThemeState()\n      return {\n         name: state.get(\"name\"),\n         theme: getTheme(state.get(\"name\")),\n         change: (theme: string) => state.set(\"name\", theme)\n      }\n   }\n   return useThemeSwitcher\n}\n\n\nexport default createThemeSwitcher"],"names":[],"mappings":"gFAGA,MAAM,mBAAmB,GAAG,CAAC,YAAoB,EAAE,KAA2B,KAAI;AAC/E,IAAA,MAAM,aAAa,GAAG,YAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;IACrE,MAAM,gBAAgB,GAAG,MAAK;AAC3B,QAAA,MAAM,KAAK,GAAG,aAAa,EAAE;QAC7B,OAAO;AACJ,YAAA,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;YACvB,KAAK,EAAE,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;AAClC,YAAA,MAAM,EAAE,CAAC,KAAa,KAAK,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,KAAK;SACpD;AACJ,KAAC;AACD,IAAA,OAAO,gBAAgB;AAC1B"}
+{"version":3,"file":"createThemeSwitcher.mjs","sources":["../../src/theme/createThemeSwitcher.ts"],"sourcesContent":["import { createBucket } from \"react-state-bucket\"\nimport { getTheme } from \"./core\"\n\nexport type ThemeSwitcherOption = {\n   store: \"memory\" | \"session\" | \"local\",\n   onChange: (theme: string) => void\n}\n\nconst createThemeSwitcher = (defaultTheme: string, option?: ThemeSwitcherOption) => {\n\n   const useThemeState = createBucket({ name: defaultTheme }, {\n      store: option?.store || \"memory\",\n      onChange: (key, value) => {\n         option?.onChange(value)\n      }\n   })\n\n   const useThemeSwitcher = () => {\n      const state = useThemeState()\n      return {\n         name: state.get(\"name\"),\n         theme: getTheme(state.get(\"name\")),\n         change: (theme: string) => state.set(\"name\", theme)\n      }\n   }\n   return useThemeSwitcher\n}\n\n\nexport default createThemeSwitcher"],"names":[],"mappings":"gFAQA,MAAM,mBAAmB,GAAG,CAAC,YAAoB,EAAE,MAA4B,KAAI;IAEhF,MAAM,aAAa,GAAG,YAAY,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE;QACxD,KAAK,EAAE,CAAA,MAAM,KAAA,IAAA,IAAN,MAAM,uBAAN,MAAM,CAAE,KAAK,KAAI,QAAQ;AAChC,QAAA,QAAQ,EAAE,CAAC,GAAG,EAAE,KAAK,KAAI;YACtB,MAAM,KAAA,IAAA,IAAN,MAAM,KAAA,MAAA,GAAA,MAAA,GAAN,MAAM,CAAE,QAAQ,CAAC,KAAK,CAAC;QAC1B;AACF,KAAA,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;AAC3B,QAAA,MAAM,KAAK,GAAG,aAAa,EAAE;QAC7B,OAAO;AACJ,YAAA,IAAI,EAAE,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC;YACvB,KAAK,EAAE,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;AAClC,YAAA,MAAM,EAAE,CAAC,KAAa,KAAK,KAAK,CAAC,GAAG,CAAC,MAAM,EAAE,KAAK;SACpD;AACJ,IAAA,CAAC;AACD,IAAA,OAAO,gBAAgB;AAC1B"}

package/useAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimation.js","sources":["../src/useAnimation.ts"],"sourcesContent":["import { css } from './css'\nimport { useId } from 'react'\nimport { CSSProps } from './css/types'\n\nexport const animationEases = {\n    easeInOut: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    easeOut: \"cubic-bezier(0.0, 0, 0.2, 1)\",\n    easeIn: \"cubic-bezier(0.4, 0, 1, 1)\",\n    sharp: \"cubic-bezier(0.4, 0, 0.6, 1)\",\n    linear: \"cubic-bezier(0, 0, 1, 1)\",\n    easeBounceOut: \"cubic-bezier(0.68, -0.55, 0.265, 1.55)\"\n}\n\nexport interface UseAnimationProps {\n    delay?: number;\n    duration?: number;\n    from: CSSProps;\n    to: CSSProps;\n    ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n    let _delay = delay || 0;\n    let _duration = duration || 600;\n    let _ease = ease || \"easeBounceOut\"\n    const id = \"anim\" + useId().replace(/:/g, \"\")\n    const anim = css({\n        animationName: id,\n        animationDelay: _delay + \"ms\",\n        animationDuration: _duration + \"ms\",\n        animationTimingFunction: animationEases[_ease] || animationEases.easeBounceOut,\n        [`@keyframes ${id}`]: {\n            from: from as any,\n            to: to as any\n        }\n    })\n    return anim.classname\n}\n\nexport default useAnimation"],"names":["useId","css"],"mappings":"iIAIa,MAAA,cAAc,GAAG;AAC1B,IAAA,SAAS,EAAE,8BAA8B;AACzC,IAAA,OAAO,EAAE,8BAA8B;AACvC,IAAA,MAAM,EAAE,4BAA4B;AACpC,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,MAAM,EAAE,0BAA0B;AAClC,IAAA,aAAa,EAAE;;AAWnB,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAqB,KAAI;AAC5E,IAAA,IAAI,MAAM,GAAG,KAAK,IAAI,CAAC;AACvB,IAAA,IAAI,SAAS,GAAG,QAAQ,IAAI,GAAG;AAC/B,IAAA,IAAI,KAAK,GAAG,IAAI,IAAI,eAAe;AACnC,IAAA,MAAM,EAAE,GAAG,MAAM,GAAGA,WAAK,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;IAC7C,MAAM,IAAI,GAAGC,SAAG,CAAC;AACb,QAAA,aAAa,EAAE,EAAE;QACjB,cAAc,EAAE,MAAM,GAAG,IAAI;QAC7B,iBAAiB,EAAE,SAAS,GAAG,IAAI;QACnC,uBAAuB,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,cAAc,CAAC,aAAa;AAC9E,QAAA,CAAC,CAAc,WAAA,EAAA,EAAE,CAAE,CAAA,GAAG;AAClB,YAAA,IAAI,EAAE,IAAW;AACjB,YAAA,EAAE,EAAE;AACP;AACJ,KAAA,CAAC;IACF,OAAO,IAAI,CAAC,SAAS;AACzB"}
+{"version":3,"file":"useAnimation.js","sources":["../src/useAnimation.ts"],"sourcesContent":["import { css } from './css'\nimport { useId } from 'react'\nimport { CSSProps } from './css/types'\n\nexport const animationEases = {\n    easeInOut: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    easeOut: \"cubic-bezier(0.0, 0, 0.2, 1)\",\n    easeIn: \"cubic-bezier(0.4, 0, 1, 1)\",\n    sharp: \"cubic-bezier(0.4, 0, 0.6, 1)\",\n    linear: \"cubic-bezier(0, 0, 1, 1)\",\n    easeBounceOut: \"cubic-bezier(0.68, -0.55, 0.265, 1.55)\"\n}\n\nexport interface UseAnimationProps {\n    delay?: number;\n    duration?: number;\n    from: CSSProps;\n    to: CSSProps;\n    ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n    let _delay = delay || 0;\n    let _duration = duration || 600;\n    let _ease = ease || \"easeBounceOut\"\n    const id = \"anim\" + useId().replace(/:/g, \"\")\n    const anim = css({\n        animationName: id,\n        animationDelay: _delay + \"ms\",\n        animationDuration: _duration + \"ms\",\n        animationTimingFunction: animationEases[_ease] || animationEases.easeBounceOut,\n        [`@keyframes ${id}`]: {\n            from: from as any,\n            to: to as any\n        }\n    })\n    return anim.classname\n}\n\nexport default useAnimation"],"names":["useId","css"],"mappings":"iIAIO,MAAM,cAAc,GAAG;AAC1B,IAAA,SAAS,EAAE,8BAA8B;AACzC,IAAA,OAAO,EAAE,8BAA8B;AACvC,IAAA,MAAM,EAAE,4BAA4B;AACpC,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,MAAM,EAAE,0BAA0B;AAClC,IAAA,aAAa,EAAE;;AAWnB,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAqB,KAAI;AAC5E,IAAA,IAAI,MAAM,GAAG,KAAK,IAAI,CAAC;AACvB,IAAA,IAAI,SAAS,GAAG,QAAQ,IAAI,GAAG;AAC/B,IAAA,IAAI,KAAK,GAAG,IAAI,IAAI,eAAe;AACnC,IAAA,MAAM,EAAE,GAAG,MAAM,GAAGA,WAAK,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;IAC7C,MAAM,IAAI,GAAGC,SAAG,CAAC;AACb,QAAA,aAAa,EAAE,EAAE;QACjB,cAAc,EAAE,MAAM,GAAG,IAAI;QAC7B,iBAAiB,EAAE,SAAS,GAAG,IAAI;QACnC,uBAAuB,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,cAAc,CAAC,aAAa;AAC9E,QAAA,CAAC,CAAA,WAAA,EAAc,EAAE,CAAA,CAAE,GAAG;AAClB,YAAA,IAAI,EAAE,IAAW;AACjB,YAAA,EAAE,EAAE;AACP;AACJ,KAAA,CAAC;IACF,OAAO,IAAI,CAAC,SAAS;AACzB"}

package/useAnimation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useAnimation.mjs","sources":["../src/useAnimation.ts"],"sourcesContent":["import { css } from './css'\nimport { useId } from 'react'\nimport { CSSProps } from './css/types'\n\nexport const animationEases = {\n    easeInOut: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    easeOut: \"cubic-bezier(0.0, 0, 0.2, 1)\",\n    easeIn: \"cubic-bezier(0.4, 0, 1, 1)\",\n    sharp: \"cubic-bezier(0.4, 0, 0.6, 1)\",\n    linear: \"cubic-bezier(0, 0, 1, 1)\",\n    easeBounceOut: \"cubic-bezier(0.68, -0.55, 0.265, 1.55)\"\n}\n\nexport interface UseAnimationProps {\n    delay?: number;\n    duration?: number;\n    from: CSSProps;\n    to: CSSProps;\n    ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n    let _delay = delay || 0;\n    let _duration = duration || 600;\n    let _ease = ease || \"easeBounceOut\"\n    const id = \"anim\" + useId().replace(/:/g, \"\")\n    const anim = css({\n        animationName: id,\n        animationDelay: _delay + \"ms\",\n        animationDuration: _duration + \"ms\",\n        animationTimingFunction: animationEases[_ease] || animationEases.easeBounceOut,\n        [`@keyframes ${id}`]: {\n            from: from as any,\n            to: to as any\n        }\n    })\n    return anim.classname\n}\n\nexport default useAnimation"],"names":[],"mappings":"4DAIa,MAAA,cAAc,GAAG;AAC1B,IAAA,SAAS,EAAE,8BAA8B;AACzC,IAAA,OAAO,EAAE,8BAA8B;AACvC,IAAA,MAAM,EAAE,4BAA4B;AACpC,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,MAAM,EAAE,0BAA0B;AAClC,IAAA,aAAa,EAAE;;AAWnB,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAqB,KAAI;AAC5E,IAAA,IAAI,MAAM,GAAG,KAAK,IAAI,CAAC;AACvB,IAAA,IAAI,SAAS,GAAG,QAAQ,IAAI,GAAG;AAC/B,IAAA,IAAI,KAAK,GAAG,IAAI,IAAI,eAAe;AACnC,IAAA,MAAM,EAAE,GAAG,MAAM,GAAG,KAAK,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;IAC7C,MAAM,IAAI,GAAG,GAAG,CAAC;AACb,QAAA,aAAa,EAAE,EAAE;QACjB,cAAc,EAAE,MAAM,GAAG,IAAI;QAC7B,iBAAiB,EAAE,SAAS,GAAG,IAAI;QACnC,uBAAuB,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,cAAc,CAAC,aAAa;AAC9E,QAAA,CAAC,CAAc,WAAA,EAAA,EAAE,CAAE,CAAA,GAAG;AAClB,YAAA,IAAI,EAAE,IAAW;AACjB,YAAA,EAAE,EAAE;AACP;AACJ,KAAA,CAAC;IACF,OAAO,IAAI,CAAC,SAAS;AACzB"}
+{"version":3,"file":"useAnimation.mjs","sources":["../src/useAnimation.ts"],"sourcesContent":["import { css } from './css'\nimport { useId } from 'react'\nimport { CSSProps } from './css/types'\n\nexport const animationEases = {\n    easeInOut: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n    easeOut: \"cubic-bezier(0.0, 0, 0.2, 1)\",\n    easeIn: \"cubic-bezier(0.4, 0, 1, 1)\",\n    sharp: \"cubic-bezier(0.4, 0, 0.6, 1)\",\n    linear: \"cubic-bezier(0, 0, 1, 1)\",\n    easeBounceOut: \"cubic-bezier(0.68, -0.55, 0.265, 1.55)\"\n}\n\nexport interface UseAnimationProps {\n    delay?: number;\n    duration?: number;\n    from: CSSProps;\n    to: CSSProps;\n    ease?: keyof typeof animationEases;\n}\n\nconst useAnimation = ({ from, to, delay, ease, duration }: UseAnimationProps) => {\n    let _delay = delay || 0;\n    let _duration = duration || 600;\n    let _ease = ease || \"easeBounceOut\"\n    const id = \"anim\" + useId().replace(/:/g, \"\")\n    const anim = css({\n        animationName: id,\n        animationDelay: _delay + \"ms\",\n        animationDuration: _duration + \"ms\",\n        animationTimingFunction: animationEases[_ease] || animationEases.easeBounceOut,\n        [`@keyframes ${id}`]: {\n            from: from as any,\n            to: to as any\n        }\n    })\n    return anim.classname\n}\n\nexport default useAnimation"],"names":[],"mappings":"4DAIO,MAAM,cAAc,GAAG;AAC1B,IAAA,SAAS,EAAE,8BAA8B;AACzC,IAAA,OAAO,EAAE,8BAA8B;AACvC,IAAA,MAAM,EAAE,4BAA4B;AACpC,IAAA,KAAK,EAAE,8BAA8B;AACrC,IAAA,MAAM,EAAE,0BAA0B;AAClC,IAAA,aAAa,EAAE;;AAWnB,MAAM,YAAY,GAAG,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAqB,KAAI;AAC5E,IAAA,IAAI,MAAM,GAAG,KAAK,IAAI,CAAC;AACvB,IAAA,IAAI,SAAS,GAAG,QAAQ,IAAI,GAAG;AAC/B,IAAA,IAAI,KAAK,GAAG,IAAI,IAAI,eAAe;AACnC,IAAA,MAAM,EAAE,GAAG,MAAM,GAAG,KAAK,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC;IAC7C,MAAM,IAAI,GAAG,GAAG,CAAC;AACb,QAAA,aAAa,EAAE,EAAE;QACjB,cAAc,EAAE,MAAM,GAAG,IAAI;QAC7B,iBAAiB,EAAE,SAAS,GAAG,IAAI;QACnC,uBAAuB,EAAE,cAAc,CAAC,KAAK,CAAC,IAAI,cAAc,CAAC,aAAa;AAC9E,QAAA,CAAC,CAAA,WAAA,EAAc,EAAE,CAAA,CAAE,GAAG;AAClB,YAAA,IAAI,EAAE,IAAW;AACjB,YAAA,EAAE,EAAE;AACP;AACJ,KAAA,CAAC;IACF,OAAO,IAAI,CAAC,SAAS;AACzB"}

package/useColorTemplate.js

@@ -1,4 +1,4 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});require('./theme/index.js');var core=require('./theme/core.js');const useColorTemplate = (color, type) => {
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});require('./theme/ThemeDefaultOptions.js');var core=require('./theme/core.js');require('./css/getValue.js'),require('oncss'),require('./theme/ThemeProvider.js'),require('react-state-bucket');const useColorTemplate = (color, type) => {
     var _a;
     const theme = core.useTheme();
     let _color = color === 'default' ? "background" : color;

package/useColorTemplate.js.map

@@ -1 +1 @@
-{"version":3,"file":"useColorTemplate.js","sources":["../src/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\nexport type ColorTemplateColors = \"default\" | \"brand\" | \"accent\" | \"info\" | \"success\" | \"warning\" | \"danger\"\nexport type ColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\n\nconst useColorTemplate = (color: ColorTemplateColors, type: ColorTemplateType) => {\n    const theme: any = useTheme()\n    let _color = color === 'default' ? \"background\" : color as any\n    return theme.colors[_color]?.template[type]\n}\n\nexport default useColorTemplate"],"names":["useTheme"],"mappings":"sIAIA,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,IAAuB,KAAI;;AAC7E,IAAA,MAAM,KAAK,GAAQA,aAAQ,EAAE;AAC7B,IAAA,IAAI,MAAM,GAAG,KAAK,KAAK,SAAS,GAAG,YAAY,GAAG,KAAY;AAC9D,IAAA,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,IAAI,CAAC;AAC/C"}
+{"version":3,"file":"useColorTemplate.js","sources":["../src/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\nexport type ColorTemplateColors = \"default\" | \"brand\" | \"accent\" | \"info\" | \"success\" | \"warning\" | \"danger\"\nexport type ColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\n\nconst useColorTemplate = (color: ColorTemplateColors, type: ColorTemplateType) => {\n    const theme: any = useTheme()\n    let _color = color === 'default' ? \"background\" : color as any\n    return theme.colors[_color]?.template[type]\n}\n\nexport default useColorTemplate"],"names":["useTheme"],"mappings":"oQAIA,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,IAAuB,KAAI;;AAC7E,IAAA,MAAM,KAAK,GAAQA,aAAQ,EAAE;AAC7B,IAAA,IAAI,MAAM,GAAG,KAAK,KAAK,SAAS,GAAG,YAAY,GAAG,KAAY;AAC9D,IAAA,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,IAAI,CAAC;AAC/C"}

package/useColorTemplate.mjs

@@ -1,4 +1,4 @@
-import'./theme/index.mjs';import {useTheme}from'./theme/core.mjs';const useColorTemplate = (color, type) => {
+import'./theme/ThemeDefaultOptions.mjs';import {useTheme}from'./theme/core.mjs';import'./css/getValue.mjs';import'oncss';import'./theme/ThemeProvider.mjs';import'react-state-bucket';const useColorTemplate = (color, type) => {
     var _a;
     const theme = useTheme();
     let _color = color === 'default' ? "background" : color;

package/useColorTemplate.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useColorTemplate.mjs","sources":["../src/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\nexport type ColorTemplateColors = \"default\" | \"brand\" | \"accent\" | \"info\" | \"success\" | \"warning\" | \"danger\"\nexport type ColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\n\nconst useColorTemplate = (color: ColorTemplateColors, type: ColorTemplateType) => {\n    const theme: any = useTheme()\n    let _color = color === 'default' ? \"background\" : color as any\n    return theme.colors[_color]?.template[type]\n}\n\nexport default useColorTemplate"],"names":[],"mappings":"kEAIA,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,IAAuB,KAAI;;AAC7E,IAAA,MAAM,KAAK,GAAQ,QAAQ,EAAE;AAC7B,IAAA,IAAI,MAAM,GAAG,KAAK,KAAK,SAAS,GAAG,YAAY,GAAG,KAAY;AAC9D,IAAA,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,IAAI,CAAC;AAC/C"}
+{"version":3,"file":"useColorTemplate.mjs","sources":["../src/useColorTemplate.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\nexport type ColorTemplateColors = \"default\" | \"brand\" | \"accent\" | \"info\" | \"success\" | \"warning\" | \"danger\"\nexport type ColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"alpha\"\n\nconst useColorTemplate = (color: ColorTemplateColors, type: ColorTemplateType) => {\n    const theme: any = useTheme()\n    let _color = color === 'default' ? \"background\" : color as any\n    return theme.colors[_color]?.template[type]\n}\n\nexport default useColorTemplate"],"names":[],"mappings":"sLAIA,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,IAAuB,KAAI;;AAC7E,IAAA,MAAM,KAAK,GAAQ,QAAQ,EAAE;AAC7B,IAAA,IAAI,MAAM,GAAG,KAAK,KAAK,SAAS,GAAG,YAAY,GAAG,KAAY;AAC9D,IAAA,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,QAAQ,CAAC,IAAI,CAAC;AAC/C"}

package/useInterface.js

@@ -1,4 +1,4 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});require('./theme/index.js');var core=require('./theme/core.js');const useInterface = (name, userPorps, defaultProps) => {
+'use strict';Object.defineProperty(exports,'__esModule',{value:true});require('./theme/ThemeDefaultOptions.js');var core=require('./theme/core.js');require('./css/getValue.js'),require('oncss'),require('./theme/ThemeProvider.js'),require('react-state-bucket');const useInterface = (name, userPorps, defaultProps) => {
     const theme = core.useTheme();
     const _interface = theme.interfaces[name];
     if (_interface) {

package/useInterface.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInterface.js","sources":["../src/useInterface.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    const _interface = theme.interfaces[name]\n\n    if (_interface) {\n        defaultProps = _interface<P>({ ...defaultProps, ...userPorps }, theme)\n    }\n    return [{ ...defaultProps, ...userPorps }, theme]\n}\n\nexport default useInterface"],"names":["useTheme"],"mappings":"sIAEM,MAAA,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;IACxB,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;AAEzC,IAAA,IAAI,UAAU,EAAE;QACZ,YAAY,GAAG,UAAU,CAAS,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,YAAY,GAAK,SAAS,CAAA,EAAI,KAAK,CAAC;AACzE;AACD,IAAA,OAAO,iCAAM,YAAY,CAAA,EAAK,SAAS,CAAI,EAAA,KAAK,CAAC;AACrD"}
+{"version":3,"file":"useInterface.js","sources":["../src/useInterface.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    const _interface = theme.interfaces[name]\n\n    if (_interface) {\n        defaultProps = _interface<P>({ ...defaultProps, ...userPorps }, theme)\n    }\n    return [{ ...defaultProps, ...userPorps }, theme]\n}\n\nexport default useInterface"],"names":["useTheme"],"mappings":"oQAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAGA,aAAQ,EAAE;IACxB,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;IAEzC,IAAI,UAAU,EAAE;QACZ,YAAY,GAAG,UAAU,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAS,YAAY,GAAK,SAAS,CAAA,EAAI,KAAK,CAAC;IAC1E;AACA,IAAA,OAAO,iCAAM,YAAY,CAAA,EAAK,SAAS,CAAA,EAAI,KAAK,CAAC;AACrD"}

package/useInterface.mjs

@@ -1,4 +1,4 @@
-import'./theme/index.mjs';import {useTheme}from'./theme/core.mjs';const useInterface = (name, userPorps, defaultProps) => {
+import'./theme/ThemeDefaultOptions.mjs';import {useTheme}from'./theme/core.mjs';import'./css/getValue.mjs';import'oncss';import'./theme/ThemeProvider.mjs';import'react-state-bucket';const useInterface = (name, userPorps, defaultProps) => {
     const theme = useTheme();
     const _interface = theme.interfaces[name];
     if (_interface) {

package/useInterface.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useInterface.mjs","sources":["../src/useInterface.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    const _interface = theme.interfaces[name]\n\n    if (_interface) {\n        defaultProps = _interface<P>({ ...defaultProps, ...userPorps }, theme)\n    }\n    return [{ ...defaultProps, ...userPorps }, theme]\n}\n\nexport default useInterface"],"names":[],"mappings":"kEAEM,MAAA,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IACxB,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;AAEzC,IAAA,IAAI,UAAU,EAAE;QACZ,YAAY,GAAG,UAAU,CAAS,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,YAAY,GAAK,SAAS,CAAA,EAAI,KAAK,CAAC;AACzE;AACD,IAAA,OAAO,iCAAM,YAAY,CAAA,EAAK,SAAS,CAAI,EAAA,KAAK,CAAC;AACrD"}
+{"version":3,"file":"useInterface.mjs","sources":["../src/useInterface.ts"],"sourcesContent":["import { useTheme } from \"./theme\"\n\nconst useInterface = <P extends object>(name: string, userPorps: P, defaultProps: P) => {\n    const theme = useTheme()\n    const _interface = theme.interfaces[name]\n\n    if (_interface) {\n        defaultProps = _interface<P>({ ...defaultProps, ...userPorps }, theme)\n    }\n    return [{ ...defaultProps, ...userPorps }, theme]\n}\n\nexport default useInterface"],"names":[],"mappings":"sLAEA,MAAM,YAAY,GAAG,CAAmB,IAAY,EAAE,SAAY,EAAE,YAAe,KAAI;AACnF,IAAA,MAAM,KAAK,GAAG,QAAQ,EAAE;IACxB,MAAM,UAAU,GAAG,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC;IAEzC,IAAI,UAAU,EAAE;QACZ,YAAY,GAAG,UAAU,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAS,YAAY,GAAK,SAAS,CAAA,EAAI,KAAK,CAAC;IAC1E;AACA,IAAA,OAAO,iCAAM,YAAY,CAAA,EAAK,SAAS,CAAA,EAAI,KAAK,CAAC;AACrD"}

package/useScrollbar.d.ts

@@ -0,0 +1,3 @@
+declare const useScrollbar: (themeName: string, root_cls?: string) => string;
+
+export { useScrollbar as default };