@xanui/core 1.2.38 → 1.2.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AppRoot/index.js +1 -1
- package/AppRoot/index.js.map +1 -1
- package/AppRoot/index.mjs +1 -1
- package/AppRoot/index.mjs.map +1 -1
- package/hooks/useColorTemplate.d.ts +13 -0
- package/hooks/useColorTemplate.js +4 -4
- package/hooks/useColorTemplate.js.map +1 -1
- package/hooks/useColorTemplate.mjs +4 -4
- package/hooks/useColorTemplate.mjs.map +1 -1
- package/package.json +1 -1
package/AppRoot/index.js
CHANGED
|
@@ -23,7 +23,7 @@ const AppRoot = React.forwardRef((_a, ref) => {
|
|
|
23
23
|
if (noScrollbarCss)
|
|
24
24
|
return;
|
|
25
25
|
const cls = (cls) => `${index$1.themeRootClass(theme)} ${cls}`;
|
|
26
|
-
let thumbSize =
|
|
26
|
+
let thumbSize = 6;
|
|
27
27
|
let thumbColor = "var(--color-text-secondary)";
|
|
28
28
|
let trackColor = "transparent";
|
|
29
29
|
return index.css({
|
package/AppRoot/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/AppRoot/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react';\nimport { TagComponentType } from '../Tag/types';\nimport { ThemeProvider, ThemeProviderProps, themeRootClass } from '../theme';\nimport { BreakpointProvider } from '../breakpoint';\nimport { css } from '../css';\nimport { RenderRenderar } from './Renderar';\nimport ServerStyleTag from '../Tag/ServerStyleTag';\n\nexport type AppRootProps<T extends TagComponentType = \"div\"> = ThemeProviderProps<T> & {\n noScrollbarCss?: boolean;\n}\n\nconst appRootClassName = \"xui-app-root\"\nexport const appRootElement = () => document.querySelector(`.${appRootClassName}`) as HTMLDivElement;\n\nconst AppRoot = React.forwardRef(<T extends TagComponentType = \"div\">({ children, noScrollbarCss, theme, ...props }: AppRootProps<T>, ref: React.Ref<any>) => {\n noScrollbarCss ??= false\n const [visibility, setVisibility] = React.useState<string>(\"hidden\");\n\n const scrollbarCss: any = useMemo(() => {\n if (noScrollbarCss) return;\n const cls = (cls: string) => `${themeRootClass(theme)} ${cls}`\n let thumbSize =
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/AppRoot/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react';\nimport { TagComponentType } from '../Tag/types';\nimport { ThemeProvider, ThemeProviderProps, themeRootClass } from '../theme';\nimport { BreakpointProvider } from '../breakpoint';\nimport { css } from '../css';\nimport { RenderRenderar } from './Renderar';\nimport ServerStyleTag from '../Tag/ServerStyleTag';\n\nexport type AppRootProps<T extends TagComponentType = \"div\"> = ThemeProviderProps<T> & {\n noScrollbarCss?: boolean;\n}\n\nconst appRootClassName = \"xui-app-root\"\nexport const appRootElement = () => document.querySelector(`.${appRootClassName}`) as HTMLDivElement;\n\nconst AppRoot = React.forwardRef(<T extends TagComponentType = \"div\">({ children, noScrollbarCss, theme, ...props }: AppRootProps<T>, ref: React.Ref<any>) => {\n noScrollbarCss ??= false\n const [visibility, setVisibility] = React.useState<string>(\"hidden\");\n\n const scrollbarCss: any = useMemo(() => {\n if (noScrollbarCss) return;\n const cls = (cls: string) => `${themeRootClass(theme)} ${cls}`\n let thumbSize = 6\n let thumbColor = \"var(--color-text-secondary)\"\n let trackColor = \"transparent\"\n\n return css({\n \"@global\": {\n [cls('*::-webkit-scrollbar')]: {\n width: thumbSize,\n height: thumbSize,\n },\n [cls(\"*::-webkit-scrollbar-thumb\")]: {\n backgroundColor: thumbColor,\n borderRadius: \"6px\",\n opacity: 0.6,\n },\n [cls(\"*::-webkit-scrollbar-thumb:hover\")]: {\n backgroundColor: thumbColor,\n opacity: 0.0,\n },\n [cls(\"*::-webkit-scrollbar-track\")]: {\n backgroundColor: trackColor,\n borderRadius: \"6px\",\n },\n }\n }, {\n injectStyle: typeof window !== 'undefined'\n }) as any\n }, [noScrollbarCss, theme])\n\n const globalStyle = useMemo(() => {\n return 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 \"-moz-osx-font-smoothing\": \"grayscale\",\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 padding: 0,\n margin: 0,\n },\n \"a\": {\n display: \"inline-block\",\n color: \"inherit\",\n textDecoration: \"none\",\n cursor: \"pointer\",\n \"&:hover\": {\n textDecoration: \"underline\"\n }\n },\n \"p, h1, h2, h3, h4, h5, h6\": {\n overflowWrap: \"break-word\",\n },\n }\n }, {\n injectStyle: typeof window !== 'undefined'\n })\n }, [])\n\n useEffect(() => {\n\n const root = document.querySelectorAll(`.${appRootClassName}`)\n if (!root || root.length > 1) {\n throw new Error(\"Multiple AppRoot detected in the application tree. Please ensure that there is only one AppRoot component wrapping your application.\");\n }\n\n setVisibility(\"visible\");\n\n // move oncss style tags to head\n if (typeof window === 'undefined') return;\n const head = document.getElementsByTagName('head')[0];\n const styles = Array.from(document.querySelectorAll('body style[data-oncss]'));\n styles.forEach((style) => {\n head.appendChild(style);\n });\n\n }, [])\n\n return (\n <ThemeProvider\n ref={ref}\n theme={theme}\n {...props}\n sx={{\n ...props.sx,\n ...(visibility === \"hidden\" ? { visibility: \"hidden\" } : {})\n }}\n classNames={[appRootClassName]}\n >\n <ServerStyleTag factory={globalStyle} />\n {\n scrollbarCss && <ServerStyleTag factory={scrollbarCss} />\n }\n <BreakpointProvider>\n {children}\n <RenderRenderar />\n </BreakpointProvider>\n </ThemeProvider>\n )\n})\n\nexport default AppRoot\n\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAaA;AACO;AAEP;;;AAEG;AAEA;AACG;;AACA;;;;AAKA;AACG;AACG;AACG;AACA;AACF;AACD;AACG;AACA;AACA;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACA;AACF;AACH;;AAED;AACF;AACJ;AAEA;AACG;AACG;AACG;AACG;AACA;AACA;AACA;AACA;AACF;AACD;AACG;AACA;AACA;AACK;AACR;AACG;AACA;AACF;AACD;AACG;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACA;AACA;AACF;AACD;AACG;AACA;AACA;AACA;AACA;AACG;AACF;AACH;AACD;AACG;AACF;AACH;;AAED;AACF;;;;;AAOE;;;;;;;AAQH;AACA;AACG;AACH;;AAIH;AAqBH;;;"}
|
package/AppRoot/index.mjs
CHANGED
|
@@ -19,7 +19,7 @@ const AppRoot = React__default.forwardRef((_a, ref) => {
|
|
|
19
19
|
if (noScrollbarCss)
|
|
20
20
|
return;
|
|
21
21
|
const cls = (cls) => `${themeRootClass(theme)} ${cls}`;
|
|
22
|
-
let thumbSize =
|
|
22
|
+
let thumbSize = 6;
|
|
23
23
|
let thumbColor = "var(--color-text-secondary)";
|
|
24
24
|
let trackColor = "transparent";
|
|
25
25
|
return css({
|
package/AppRoot/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.mjs","sources":["../../src/AppRoot/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react';\nimport { TagComponentType } from '../Tag/types';\nimport { ThemeProvider, ThemeProviderProps, themeRootClass } from '../theme';\nimport { BreakpointProvider } from '../breakpoint';\nimport { css } from '../css';\nimport { RenderRenderar } from './Renderar';\nimport ServerStyleTag from '../Tag/ServerStyleTag';\n\nexport type AppRootProps<T extends TagComponentType = \"div\"> = ThemeProviderProps<T> & {\n noScrollbarCss?: boolean;\n}\n\nconst appRootClassName = \"xui-app-root\"\nexport const appRootElement = () => document.querySelector(`.${appRootClassName}`) as HTMLDivElement;\n\nconst AppRoot = React.forwardRef(<T extends TagComponentType = \"div\">({ children, noScrollbarCss, theme, ...props }: AppRootProps<T>, ref: React.Ref<any>) => {\n noScrollbarCss ??= false\n const [visibility, setVisibility] = React.useState<string>(\"hidden\");\n\n const scrollbarCss: any = useMemo(() => {\n if (noScrollbarCss) return;\n const cls = (cls: string) => `${themeRootClass(theme)} ${cls}`\n let thumbSize =
|
|
1
|
+
{"version":3,"file":"index.mjs","sources":["../../src/AppRoot/index.tsx"],"sourcesContent":["\"use client\";\nimport React, { useEffect, useMemo } from 'react';\nimport { TagComponentType } from '../Tag/types';\nimport { ThemeProvider, ThemeProviderProps, themeRootClass } from '../theme';\nimport { BreakpointProvider } from '../breakpoint';\nimport { css } from '../css';\nimport { RenderRenderar } from './Renderar';\nimport ServerStyleTag from '../Tag/ServerStyleTag';\n\nexport type AppRootProps<T extends TagComponentType = \"div\"> = ThemeProviderProps<T> & {\n noScrollbarCss?: boolean;\n}\n\nconst appRootClassName = \"xui-app-root\"\nexport const appRootElement = () => document.querySelector(`.${appRootClassName}`) as HTMLDivElement;\n\nconst AppRoot = React.forwardRef(<T extends TagComponentType = \"div\">({ children, noScrollbarCss, theme, ...props }: AppRootProps<T>, ref: React.Ref<any>) => {\n noScrollbarCss ??= false\n const [visibility, setVisibility] = React.useState<string>(\"hidden\");\n\n const scrollbarCss: any = useMemo(() => {\n if (noScrollbarCss) return;\n const cls = (cls: string) => `${themeRootClass(theme)} ${cls}`\n let thumbSize = 6\n let thumbColor = \"var(--color-text-secondary)\"\n let trackColor = \"transparent\"\n\n return css({\n \"@global\": {\n [cls('*::-webkit-scrollbar')]: {\n width: thumbSize,\n height: thumbSize,\n },\n [cls(\"*::-webkit-scrollbar-thumb\")]: {\n backgroundColor: thumbColor,\n borderRadius: \"6px\",\n opacity: 0.6,\n },\n [cls(\"*::-webkit-scrollbar-thumb:hover\")]: {\n backgroundColor: thumbColor,\n opacity: 0.0,\n },\n [cls(\"*::-webkit-scrollbar-track\")]: {\n backgroundColor: trackColor,\n borderRadius: \"6px\",\n },\n }\n }, {\n injectStyle: typeof window !== 'undefined'\n }) as any\n }, [noScrollbarCss, theme])\n\n const globalStyle = useMemo(() => {\n return 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 \"-moz-osx-font-smoothing\": \"grayscale\",\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 padding: 0,\n margin: 0,\n },\n \"a\": {\n display: \"inline-block\",\n color: \"inherit\",\n textDecoration: \"none\",\n cursor: \"pointer\",\n \"&:hover\": {\n textDecoration: \"underline\"\n }\n },\n \"p, h1, h2, h3, h4, h5, h6\": {\n overflowWrap: \"break-word\",\n },\n }\n }, {\n injectStyle: typeof window !== 'undefined'\n })\n }, [])\n\n useEffect(() => {\n\n const root = document.querySelectorAll(`.${appRootClassName}`)\n if (!root || root.length > 1) {\n throw new Error(\"Multiple AppRoot detected in the application tree. Please ensure that there is only one AppRoot component wrapping your application.\");\n }\n\n setVisibility(\"visible\");\n\n // move oncss style tags to head\n if (typeof window === 'undefined') return;\n const head = document.getElementsByTagName('head')[0];\n const styles = Array.from(document.querySelectorAll('body style[data-oncss]'));\n styles.forEach((style) => {\n head.appendChild(style);\n });\n\n }, [])\n\n return (\n <ThemeProvider\n ref={ref}\n theme={theme}\n {...props}\n sx={{\n ...props.sx,\n ...(visibility === \"hidden\" ? { visibility: \"hidden\" } : {})\n }}\n classNames={[appRootClassName]}\n >\n <ServerStyleTag factory={globalStyle} />\n {\n scrollbarCss && <ServerStyleTag factory={scrollbarCss} />\n }\n <BreakpointProvider>\n {children}\n <RenderRenderar />\n </BreakpointProvider>\n </ThemeProvider>\n )\n})\n\nexport default AppRoot\n\n"],"names":[],"mappings":";;;;;;;;;;;AAaA;AACO;AAEP;;;AAEG;AAEA;AACG;;AACA;;;;AAKA;AACG;AACG;AACG;AACA;AACF;AACD;AACG;AACA;AACA;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACA;AACF;AACH;;AAED;AACF;AACJ;AAEA;AACG;AACG;AACG;AACG;AACA;AACA;AACA;AACA;AACF;AACD;AACG;AACA;AACA;AACK;AACR;AACG;AACA;AACF;AACD;AACG;AACF;AACD;AACG;AACA;AACF;AACD;AACG;AACA;AACA;AACF;AACD;AACG;AACA;AACA;AACA;AACA;AACG;AACF;AACH;AACD;AACG;AACF;AACH;;AAED;AACF;;;;;AAOE;;;;;;;AAQH;AACA;AACG;AACH;;AAIH;AAqBH;;"}
|
|
@@ -1,6 +1,19 @@
|
|
|
1
1
|
type UseColorTemplateType = "fill" | "outline" | "text" | "soft";
|
|
2
2
|
type UseColorTemplateColor = "default" | "brand" | "accent" | "success" | "info" | "warning" | "danger";
|
|
3
3
|
declare const useColorTemplate: (color: UseColorTemplateColor, type: UseColorTemplateType) => {
|
|
4
|
+
primary: {
|
|
5
|
+
bgcolor: string;
|
|
6
|
+
color: string;
|
|
7
|
+
border: string;
|
|
8
|
+
borderColor: string;
|
|
9
|
+
};
|
|
10
|
+
secondary: {
|
|
11
|
+
bgcolor: string;
|
|
12
|
+
color: string;
|
|
13
|
+
border: string;
|
|
14
|
+
borderColor: string;
|
|
15
|
+
};
|
|
16
|
+
} | {
|
|
4
17
|
primary: {
|
|
5
18
|
bgcolor: string;
|
|
6
19
|
color: string;
|
|
@@ -11,13 +11,13 @@ const useColorTemplate = (color, type) => {
|
|
|
11
11
|
primary: {
|
|
12
12
|
bgcolor: `transparent`,
|
|
13
13
|
color: is_def ? `text.primary` : `${color}.primary`,
|
|
14
|
-
border:
|
|
14
|
+
border: "1px solid",
|
|
15
15
|
borderColor: is_def ? `divider` : `${color}.primary`,
|
|
16
16
|
},
|
|
17
17
|
secondary: {
|
|
18
18
|
bgcolor: `transparent`,
|
|
19
19
|
color: is_def ? `text.primary` : `${color}.secondary`,
|
|
20
|
-
border:
|
|
20
|
+
border: "1px solid",
|
|
21
21
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
22
22
|
}
|
|
23
23
|
};
|
|
@@ -27,13 +27,13 @@ const useColorTemplate = (color, type) => {
|
|
|
27
27
|
primary: {
|
|
28
28
|
bgcolor: color,
|
|
29
29
|
color: is_def ? `text.primary` : `${color}.text`,
|
|
30
|
-
border:
|
|
30
|
+
border: "1px solid",
|
|
31
31
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
32
32
|
},
|
|
33
33
|
secondary: {
|
|
34
34
|
bgcolor: `${color}.secondary`,
|
|
35
35
|
color: is_def ? `text.primary` : `${color}.text`,
|
|
36
|
-
border:
|
|
36
|
+
border: "1px solid",
|
|
37
37
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
38
38
|
}
|
|
39
39
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border:
|
|
1
|
+
{"version":3,"file":"useColorTemplate.js","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider` : `${color}.primary`,\n },\n secondary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"fill\") {\n return {\n primary: {\n bgcolor: color,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n },\n secondary: {\n bgcolor: `${color}.secondary`,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"text\") {\n return {\n primary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.primary`,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n } else if (type === \"soft\") {\n return {\n primary: {\n bgcolor: `${color}.soft.primary`,\n color: is_def ? `text.primary` : color,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: `${color}.soft.secondary`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n }\n\n throw new Error(`useColorTemplate: Unknown type ${type}`);\n}\n\nexport default useColorTemplate"],"names":[],"mappings":";;;AAIA;AACI;;;;AAKA;;AAEQ;AACI;;AAEA;;AAEH;AACD;AACI;;AAEA;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;;AAEH;AACD;;;AAGI;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;AACA;AACH;AACD;AACI;;AAEA;AACA;AACH;;;AAEF;;AAEC;;;AAGI;AACA;AACH;AACD;;;AAGI;AACA;AACH;;;AAIT;AACJ;;"}
|
|
@@ -9,13 +9,13 @@ const useColorTemplate = (color, type) => {
|
|
|
9
9
|
primary: {
|
|
10
10
|
bgcolor: `transparent`,
|
|
11
11
|
color: is_def ? `text.primary` : `${color}.primary`,
|
|
12
|
-
border:
|
|
12
|
+
border: "1px solid",
|
|
13
13
|
borderColor: is_def ? `divider` : `${color}.primary`,
|
|
14
14
|
},
|
|
15
15
|
secondary: {
|
|
16
16
|
bgcolor: `transparent`,
|
|
17
17
|
color: is_def ? `text.primary` : `${color}.secondary`,
|
|
18
|
-
border:
|
|
18
|
+
border: "1px solid",
|
|
19
19
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
20
20
|
}
|
|
21
21
|
};
|
|
@@ -25,13 +25,13 @@ const useColorTemplate = (color, type) => {
|
|
|
25
25
|
primary: {
|
|
26
26
|
bgcolor: color,
|
|
27
27
|
color: is_def ? `text.primary` : `${color}.text`,
|
|
28
|
-
border:
|
|
28
|
+
border: "1px solid",
|
|
29
29
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
30
30
|
},
|
|
31
31
|
secondary: {
|
|
32
32
|
bgcolor: `${color}.secondary`,
|
|
33
33
|
color: is_def ? `text.primary` : `${color}.text`,
|
|
34
|
-
border:
|
|
34
|
+
border: "1px solid",
|
|
35
35
|
borderColor: is_def ? `divider.secondary` : `${color}.secondary`,
|
|
36
36
|
}
|
|
37
37
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useColorTemplate.mjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border:
|
|
1
|
+
{"version":3,"file":"useColorTemplate.mjs","sources":["../../src/hooks/useColorTemplate.ts"],"sourcesContent":["\"use client\";\nexport type UseColorTemplateType = \"fill\" | \"outline\" | \"text\" | \"soft\"\nexport type UseColorTemplateColor = \"default\" | \"brand\" | \"accent\" | \"success\" | \"info\" | \"warning\" | \"danger\"\n\nconst useColorTemplate = (color: UseColorTemplateColor, type: UseColorTemplateType) => {\n const is_def = color === \"default\";\n if (is_def) {\n color = \"divider\" as any\n }\n\n if (type === \"outline\") {\n return {\n primary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.primary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider` : `${color}.primary`,\n },\n secondary: {\n bgcolor: `transparent`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"fill\") {\n return {\n primary: {\n bgcolor: color,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n },\n secondary: {\n bgcolor: `${color}.secondary`,\n color: is_def ? `text.primary` : `${color}.text`,\n border: \"1px solid\",\n borderColor: is_def ? `divider.secondary` : `${color}.secondary`,\n }\n }\n } else if (type === \"text\") {\n return {\n primary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.primary`,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: \"transparent\",\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n } else if (type === \"soft\") {\n return {\n primary: {\n bgcolor: `${color}.soft.primary`,\n color: is_def ? `text.primary` : color,\n border: 0,\n borderColor: `transparent`,\n },\n secondary: {\n bgcolor: `${color}.soft.secondary`,\n color: is_def ? `text.primary` : `${color}.secondary`,\n border: 0,\n borderColor: `transparent`,\n }\n }\n }\n\n throw new Error(`useColorTemplate: Unknown type ${type}`);\n}\n\nexport default useColorTemplate"],"names":[],"mappings":";AAIA;AACI;;;;AAKA;;AAEQ;AACI;;AAEA;;AAEH;AACD;AACI;;AAEA;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;;AAEH;AACD;;;AAGI;;AAEH;;;AAEF;;AAEC;AACI;;AAEA;AACA;AACH;AACD;AACI;;AAEA;AACA;AACH;;;AAEF;;AAEC;;;AAGI;AACA;AACH;AACD;;;AAGI;AACA;AACH;;;AAIT;AACJ;;"}
|