@xanui/core 1.0.7 → 1.0.8
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/package.json +1 -1
- package/theme/ThemeProvider.d.ts +2 -1
- package/theme/ThemeProvider.js +20 -16
- package/theme/ThemeProvider.js.map +2 -2
package/package.json
CHANGED
package/theme/ThemeProvider.d.ts
CHANGED
|
@@ -4,7 +4,8 @@ export type ThemeProviderProps<T extends TagComponentType = 'div'> = TagProps<T>
|
|
|
4
4
|
theme: string;
|
|
5
5
|
resetCss?: boolean;
|
|
6
6
|
scrollbarCss?: boolean;
|
|
7
|
+
isRootProvider?: boolean;
|
|
7
8
|
renderIsRoot?: React.ReactElement;
|
|
8
9
|
};
|
|
9
|
-
declare const ThemeProvider: ({ children, theme, resetCss, scrollbarCss, renderIsRoot, ...props }: ThemeProviderProps) => React.JSX.Element;
|
|
10
|
+
declare const ThemeProvider: ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }: ThemeProviderProps) => React.JSX.Element;
|
|
10
11
|
export default ThemeProvider;
|
package/theme/ThemeProvider.js
CHANGED
|
@@ -4,9 +4,7 @@ import { BreakpointProvider } from "../breakpoint";
|
|
|
4
4
|
import { ThemeContex, ThemeFactory } from "./core";
|
|
5
5
|
import ThemeCssVars from "./ThemeCssVars";
|
|
6
6
|
import { css } from "../css";
|
|
7
|
-
const
|
|
8
|
-
const ThemeProvider = ({ children, theme, resetCss, scrollbarCss, renderIsRoot, ...props }) => {
|
|
9
|
-
const id = React.useId();
|
|
7
|
+
const ThemeProvider = ({ children, theme, resetCss, scrollbarCss, isRootProvider, renderIsRoot, ...props }) => {
|
|
10
8
|
const THEME = ThemeFactory.get(theme);
|
|
11
9
|
if (!THEME) throw new Error(`Invalid theme name provided: ${theme}`);
|
|
12
10
|
resetCss ??= true;
|
|
@@ -87,16 +85,22 @@ const ThemeProvider = ({ children, theme, resetCss, scrollbarCss, renderIsRoot,
|
|
|
87
85
|
}
|
|
88
86
|
});
|
|
89
87
|
}, [theme]);
|
|
90
|
-
React.
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
88
|
+
return /* @__PURE__ */ React.createElement(ThemeContex.Provider, { value: theme }, isRootProvider ? /* @__PURE__ */ React.createElement(BreakpointProvider, null, /* @__PURE__ */ React.createElement(
|
|
89
|
+
Tag,
|
|
90
|
+
{
|
|
91
|
+
minHeight: "100%",
|
|
92
|
+
bgcolor: THEME.colors.background.primary,
|
|
93
|
+
fontFamily: THEME.typography.fontFamily,
|
|
94
|
+
fontSize: THEME.typography.text.fontSize,
|
|
95
|
+
fontWeight: THEME.typography.text.fontWeight,
|
|
96
|
+
lineHeight: THEME.typography.text.lineHeight,
|
|
97
|
+
...props,
|
|
98
|
+
baseClass: `${theme}-theme-root`,
|
|
99
|
+
direction: THEME.rtl ? "rtl" : "ltr"
|
|
100
|
+
},
|
|
101
|
+
children,
|
|
102
|
+
renderIsRoot
|
|
103
|
+
)) : /* @__PURE__ */ React.createElement(
|
|
100
104
|
Tag,
|
|
101
105
|
{
|
|
102
106
|
minHeight: "100%",
|
|
@@ -109,9 +113,9 @@ const ThemeProvider = ({ children, theme, resetCss, scrollbarCss, renderIsRoot,
|
|
|
109
113
|
baseClass: `${theme}-theme-root`,
|
|
110
114
|
direction: THEME.rtl ? "rtl" : "ltr"
|
|
111
115
|
},
|
|
112
|
-
children
|
|
113
|
-
|
|
114
|
-
|
|
116
|
+
children,
|
|
117
|
+
renderIsRoot
|
|
118
|
+
));
|
|
115
119
|
};
|
|
116
120
|
var ThemeProvider_default = ThemeProvider;
|
|
117
121
|
export {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/theme/ThemeProvider.tsx"],
|
|
4
|
-
"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 renderIsRoot?: React.ReactElement;\n}\n\nconst
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AAEvB,OAAO,SAAS;AAEhB,SAAS,0BAA0B;AACnC,SAAS,aAAa,oBAAoB;AAC1C,OAAO,kBAAkB;AACzB,SAAS,WAAW;
|
|
4
|
+
"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 {renderIsRoot}\n </Tag>\n }\n </ThemeContex.Provider>\n )\n}\n\nexport default ThemeProvider"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|