@mui/system 6.1.1 → 6.1.3
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/Box/Box.js +17 -11
- package/Box/boxClasses.js +10 -3
- package/Box/index.js +35 -3
- package/Box/package.json +2 -2
- package/CHANGELOG.md +136 -0
- package/Container/Container.js +17 -12
- package/Container/ContainerProps.js +5 -1
- package/Container/containerClasses.js +14 -6
- package/Container/createContainer.js +36 -28
- package/Container/index.js +35 -3
- package/Container/package.json +2 -2
- package/DefaultPropsProvider/DefaultPropsProvider.js +19 -11
- package/DefaultPropsProvider/index.js +19 -1
- package/DefaultPropsProvider/package.json +2 -2
- package/GlobalStyles/GlobalStyles.js +18 -11
- package/GlobalStyles/index.js +25 -2
- package/GlobalStyles/package.json +2 -2
- package/Grid/Grid.js +38 -27
- package/Grid/GridProps.d.ts +16 -11
- package/Grid/GridProps.js +5 -1
- package/Grid/createGrid.js +46 -38
- package/Grid/gridClasses.js +14 -6
- package/Grid/gridGenerator.d.ts +3 -7
- package/Grid/gridGenerator.js +62 -69
- package/Grid/index.js +63 -6
- package/Grid/package.json +2 -2
- package/Grid/traverseBreakpoints.js +11 -3
- package/InitColorSchemeScript/InitColorSchemeScript.js +16 -7
- package/InitColorSchemeScript/index.js +13 -1
- package/InitColorSchemeScript/package.json +2 -2
- package/RtlProvider/index.js +17 -8
- package/RtlProvider/package.json +2 -2
- package/Stack/Stack.js +17 -11
- package/Stack/StackProps.js +5 -1
- package/Stack/createStack.js +46 -36
- package/Stack/index.js +55 -5
- package/Stack/package.json +2 -2
- package/Stack/stackClasses.js +14 -6
- package/ThemeProvider/ThemeProvider.js +27 -20
- package/ThemeProvider/index.js +13 -1
- package/ThemeProvider/package.json +2 -2
- package/borders/borders.js +36 -26
- package/borders/index.js +25 -2
- package/borders/package.json +2 -2
- package/breakpoints/breakpoints.js +34 -21
- package/breakpoints/index.js +25 -2
- package/breakpoints/package.json +2 -2
- package/colorManipulator/colorManipulator.js +50 -25
- package/colorManipulator/index.js +16 -1
- package/colorManipulator/package.json +2 -2
- package/compose/compose.js +10 -3
- package/compose/index.js +13 -1
- package/compose/package.json +2 -2
- package/createBox/createBox.js +20 -13
- package/createBox/index.js +13 -1
- package/createBox/package.json +2 -2
- package/createBreakpoints/createBreakpoints.js +9 -2
- package/createBreakpoints/index.js +13 -3
- package/createBreakpoints/package.json +2 -2
- package/createStyled/createStyled.js +161 -117
- package/createStyled/index.js +25 -2
- package/createStyled/package.json +2 -2
- package/createTheme/applyStyles.js +7 -1
- package/createTheme/createSpacing.js +8 -3
- package/createTheme/createTheme.d.ts +16 -10
- package/createTheme/createTheme.js +25 -18
- package/createTheme/index.js +27 -3
- package/createTheme/package.json +2 -2
- package/createTheme/shape.js +7 -1
- package/cssContainerQueries/cssContainerQueries.js +16 -7
- package/cssContainerQueries/index.js +31 -2
- package/cssContainerQueries/package.json +2 -2
- package/cssGrid/cssGrid.js +40 -31
- package/cssGrid/index.js +25 -2
- package/cssGrid/package.json +2 -2
- package/cssVars/createCssVarsProvider.d.ts +7 -1
- package/cssVars/createCssVarsProvider.js +46 -31
- package/cssVars/createCssVarsTheme.js +14 -7
- package/cssVars/createGetCssVar.js +7 -1
- package/cssVars/cssVarsParser.js +13 -3
- package/cssVars/getColorSchemeSelector.js +7 -1
- package/cssVars/index.js +41 -5
- package/cssVars/package.json +2 -2
- package/cssVars/prepareCssVars.js +16 -9
- package/cssVars/prepareTypographyVars.js +7 -1
- package/cssVars/useCurrentColorScheme.js +19 -11
- package/display/display.js +16 -9
- package/display/index.js +25 -2
- package/display/package.json +2 -2
- package/esm/Box/Box.js +30 -0
- package/esm/Box/boxClasses.js +3 -0
- package/esm/Box/index.js +3 -0
- package/{node → esm}/Container/Container.js +12 -17
- package/esm/Container/ContainerProps.js +1 -0
- package/esm/Container/containerClasses.js +7 -0
- package/{node → esm}/Container/createContainer.js +28 -36
- package/esm/Container/index.js +3 -0
- package/{node → esm}/DefaultPropsProvider/DefaultPropsProvider.js +11 -19
- package/esm/DefaultPropsProvider/index.js +1 -0
- package/esm/GlobalStyles/GlobalStyles.js +37 -0
- package/esm/GlobalStyles/index.js +2 -0
- package/esm/Grid/Grid.js +106 -0
- package/esm/Grid/GridProps.js +1 -0
- package/esm/Grid/createGrid.js +148 -0
- package/{node → esm}/Grid/gridClasses.js +6 -14
- package/esm/Grid/gridGenerator.js +193 -0
- package/esm/Grid/index.js +6 -0
- package/{node → esm}/Grid/traverseBreakpoints.js +3 -11
- package/{node → esm}/InitColorSchemeScript/InitColorSchemeScript.js +7 -16
- package/esm/InitColorSchemeScript/index.js +1 -0
- package/esm/RtlProvider/index.js +22 -0
- package/{node → esm}/Stack/Stack.js +11 -17
- package/esm/Stack/StackProps.js +1 -0
- package/{node → esm}/Stack/createStack.js +36 -46
- package/esm/Stack/index.js +5 -0
- package/esm/Stack/stackClasses.js +7 -0
- package/{node → esm}/ThemeProvider/ThemeProvider.js +20 -27
- package/esm/ThemeProvider/index.js +1 -0
- package/esm/borders/borders.js +49 -0
- package/esm/borders/index.js +2 -0
- package/{node → esm}/breakpoints/breakpoints.js +21 -34
- package/esm/breakpoints/index.js +2 -0
- package/{node → esm}/colorManipulator/colorManipulator.js +23 -51
- package/esm/colorManipulator/index.js +1 -0
- package/{node → esm}/compose/compose.js +3 -10
- package/esm/compose/index.js +1 -0
- package/esm/createBox/createBox.js +35 -0
- package/esm/createBox/index.js +1 -0
- package/{node → esm}/createBreakpoints/createBreakpoints.js +2 -9
- package/esm/createBreakpoints/index.js +3 -0
- package/esm/createStyled/createStyled.js +276 -0
- package/esm/createStyled/index.js +2 -0
- package/{node → esm}/createTheme/applyStyles.js +1 -7
- package/{node → esm}/createTheme/createSpacing.js +3 -8
- package/esm/createTheme/createTheme.js +49 -0
- package/esm/createTheme/index.js +3 -0
- package/esm/createTheme/shape.js +4 -0
- package/{node → esm}/cssContainerQueries/cssContainerQueries.js +6 -17
- package/esm/cssContainerQueries/index.js +2 -0
- package/esm/cssGrid/cssGrid.js +85 -0
- package/esm/cssGrid/index.js +2 -0
- package/{node → esm}/cssVars/createCssVarsProvider.js +37 -40
- package/esm/cssVars/createCssVarsTheme.js +21 -0
- package/{node → esm}/cssVars/createGetCssVar.js +1 -7
- package/{node → esm}/cssVars/cssVarsParser.js +3 -13
- package/{node → esm}/cssVars/getColorSchemeSelector.js +1 -7
- package/esm/cssVars/index.js +5 -0
- package/{node → esm}/cssVars/prepareCssVars.js +9 -16
- package/{node → esm}/cssVars/prepareTypographyVars.js +1 -7
- package/{node → esm}/cssVars/useCurrentColorScheme.js +11 -19
- package/esm/display/display.js +27 -0
- package/esm/display/index.js +2 -0
- package/esm/flexbox/flexbox.js +43 -0
- package/esm/flexbox/index.js +2 -0
- package/esm/getThemeValue/getThemeValue.js +51 -0
- package/esm/getThemeValue/index.js +2 -0
- package/esm/index.js +68 -0
- package/esm/memoTheme.js +28 -0
- package/esm/memoize/index.js +1 -0
- package/{node → esm}/memoize/memoize.js +1 -7
- package/esm/merge/index.js +1 -0
- package/esm/merge/merge.js +10 -0
- package/esm/palette/index.js +2 -0
- package/esm/palette/palette.js +26 -0
- package/esm/positions/index.js +2 -0
- package/esm/positions/positions.js +22 -0
- package/esm/preprocessStyles.js +25 -0
- package/esm/propsToClassKey/index.js +1 -0
- package/esm/propsToClassKey/propsToClassKey.js +25 -0
- package/esm/responsivePropType/index.js +1 -0
- package/esm/responsivePropType/responsivePropType.js +3 -0
- package/esm/shadows/index.js +1 -0
- package/esm/shadows/shadows.js +6 -0
- package/esm/sizing/index.js +2 -0
- package/esm/sizing/sizing.js +64 -0
- package/esm/spacing/index.js +2 -0
- package/{node → esm}/spacing/spacing.js +21 -36
- package/esm/style/index.js +2 -0
- package/{node → esm}/style/style.js +9 -18
- package/{node → esm}/styleFunctionSx/defaultSxConfig.js +65 -71
- package/{node → esm}/styleFunctionSx/extendSxProp.js +5 -12
- package/esm/styleFunctionSx/index.js +4 -0
- package/{node → esm}/styleFunctionSx/styleFunctionSx.js +19 -27
- package/esm/styled/index.js +1 -0
- package/esm/styled/styled.js +3 -0
- package/esm/typography/index.js +2 -0
- package/esm/typography/typography.js +37 -0
- package/esm/useMediaQuery/index.js +2 -0
- package/{node → esm}/useMediaQuery/useMediaQuery.js +8 -15
- package/esm/useTheme/index.js +2 -0
- package/esm/useTheme/useTheme.js +9 -0
- package/esm/useThemeProps/getThemeProps.js +12 -0
- package/esm/useThemeProps/index.js +2 -0
- package/esm/useThemeProps/useThemeProps.js +20 -0
- package/esm/useThemeWithoutDefault/index.js +1 -0
- package/esm/useThemeWithoutDefault/useThemeWithoutDefault.js +12 -0
- package/esm/version/index.js +6 -0
- package/flexbox/flexbox.js +24 -17
- package/flexbox/index.js +25 -2
- package/flexbox/package.json +2 -2
- package/getThemeValue/getThemeValue.js +40 -33
- package/getThemeValue/index.js +25 -2
- package/getThemeValue/package.json +2 -2
- package/index.d.ts +2 -0
- package/index.js +606 -63
- package/memoTheme.d.ts +12 -0
- package/memoTheme.js +34 -0
- package/memoize/index.js +13 -1
- package/memoize/memoize.js +7 -1
- package/memoize/package.json +2 -2
- package/merge/index.js +13 -1
- package/merge/merge.js +10 -3
- package/merge/package.json +2 -2
- package/modern/Grid/Grid.js +16 -11
- package/modern/Grid/createGrid.js +1 -1
- package/modern/Grid/gridGenerator.js +28 -51
- package/modern/colorManipulator/colorManipulator.js +3 -4
- package/modern/createStyled/createStyled.js +144 -109
- package/modern/cssContainerQueries/cssContainerQueries.js +1 -2
- package/modern/cssVars/createCssVarsProvider.js +8 -2
- package/modern/cssVars/useCurrentColorScheme.js +4 -4
- package/modern/index.js +3 -2
- package/modern/memoTheme.js +28 -0
- package/modern/preprocessStyles.js +25 -0
- package/modern/version/index.js +2 -2
- package/package.json +7 -7
- package/palette/index.js +25 -2
- package/palette/package.json +2 -2
- package/palette/palette.js +16 -8
- package/positions/index.js +25 -2
- package/positions/package.json +2 -2
- package/positions/positions.js +16 -9
- package/preprocessStyles.d.ts +5 -0
- package/preprocessStyles.js +31 -0
- package/propsToClassKey/index.js +13 -1
- package/propsToClassKey/package.json +2 -2
- package/propsToClassKey/propsToClassKey.js +11 -4
- package/responsivePropType/index.js +13 -1
- package/responsivePropType/package.json +2 -2
- package/responsivePropType/responsivePropType.js +10 -3
- package/shadows/index.js +13 -1
- package/shadows/package.json +2 -2
- package/shadows/shadows.js +10 -3
- package/sizing/index.js +25 -2
- package/sizing/package.json +2 -2
- package/sizing/sizing.js +27 -17
- package/spacing/index.js +25 -2
- package/spacing/package.json +2 -2
- package/spacing/spacing.js +36 -21
- package/style/index.js +25 -2
- package/style/package.json +2 -2
- package/style/style.js +18 -9
- package/styleFunctionSx/defaultSxConfig.js +71 -65
- package/styleFunctionSx/extendSxProp.js +12 -5
- package/styleFunctionSx/index.js +34 -4
- package/styleFunctionSx/package.json +2 -2
- package/styleFunctionSx/styleFunctionSx.d.ts +1 -1
- package/styleFunctionSx/styleFunctionSx.js +27 -19
- package/styled/index.js +13 -1
- package/styled/package.json +2 -2
- package/styled/styled.js +10 -3
- package/typography/index.js +25 -2
- package/typography/package.json +2 -2
- package/typography/typography.js +20 -13
- package/useMediaQuery/index.js +25 -2
- package/useMediaQuery/package.json +2 -2
- package/useMediaQuery/useMediaQuery.js +15 -8
- package/useTheme/index.js +25 -2
- package/useTheme/package.json +2 -2
- package/useTheme/useTheme.js +11 -5
- package/useThemeProps/getThemeProps.js +10 -3
- package/useThemeProps/index.js +20 -2
- package/useThemeProps/package.json +2 -2
- package/useThemeProps/useThemeProps.js +11 -5
- package/useThemeWithoutDefault/index.js +13 -1
- package/useThemeWithoutDefault/package.json +2 -2
- package/useThemeWithoutDefault/useThemeWithoutDefault.js +10 -4
- package/version/index.js +12 -6
- package/version/package.json +2 -2
- package/node/Box/Box.js +0 -36
- package/node/Box/boxClasses.js +0 -10
- package/node/Box/index.js +0 -35
- package/node/Container/ContainerProps.js +0 -5
- package/node/Container/containerClasses.js +0 -15
- package/node/Container/index.js +0 -35
- package/node/DefaultPropsProvider/index.js +0 -19
- package/node/GlobalStyles/GlobalStyles.js +0 -44
- package/node/GlobalStyles/index.js +0 -25
- package/node/Grid/Grid.js +0 -107
- package/node/Grid/GridProps.js +0 -5
- package/node/Grid/createGrid.js +0 -156
- package/node/Grid/gridGenerator.js +0 -232
- package/node/Grid/index.js +0 -63
- package/node/InitColorSchemeScript/index.js +0 -13
- package/node/RtlProvider/index.js +0 -31
- package/node/Stack/StackProps.js +0 -5
- package/node/Stack/index.js +0 -55
- package/node/Stack/stackClasses.js +0 -15
- package/node/ThemeProvider/index.js +0 -13
- package/node/borders/borders.js +0 -59
- package/node/borders/index.js +0 -25
- package/node/breakpoints/index.js +0 -25
- package/node/colorManipulator/index.js +0 -16
- package/node/compose/index.js +0 -13
- package/node/createBox/createBox.js +0 -42
- package/node/createBox/index.js +0 -13
- package/node/createBreakpoints/index.js +0 -13
- package/node/createStyled/createStyled.js +0 -252
- package/node/createStyled/index.js +0 -25
- package/node/createTheme/createTheme.js +0 -56
- package/node/createTheme/index.js +0 -27
- package/node/createTheme/shape.js +0 -10
- package/node/cssContainerQueries/index.js +0 -31
- package/node/cssGrid/cssGrid.js +0 -94
- package/node/cssGrid/index.js +0 -25
- package/node/cssVars/createCssVarsTheme.js +0 -28
- package/node/cssVars/index.js +0 -41
- package/node/display/display.js +0 -34
- package/node/display/index.js +0 -25
- package/node/flexbox/flexbox.js +0 -50
- package/node/flexbox/index.js +0 -25
- package/node/getThemeValue/getThemeValue.js +0 -58
- package/node/getThemeValue/index.js +0 -25
- package/node/index.js +0 -609
- package/node/memoize/index.js +0 -13
- package/node/merge/index.js +0 -13
- package/node/merge/merge.js +0 -17
- package/node/palette/index.js +0 -25
- package/node/palette/palette.js +0 -34
- package/node/positions/index.js +0 -25
- package/node/positions/positions.js +0 -29
- package/node/propsToClassKey/index.js +0 -13
- package/node/propsToClassKey/propsToClassKey.js +0 -32
- package/node/responsivePropType/index.js +0 -13
- package/node/responsivePropType/responsivePropType.js +0 -10
- package/node/shadows/index.js +0 -13
- package/node/shadows/shadows.js +0 -13
- package/node/sizing/index.js +0 -25
- package/node/sizing/sizing.js +0 -74
- package/node/spacing/index.js +0 -25
- package/node/style/index.js +0 -25
- package/node/styleFunctionSx/index.js +0 -34
- package/node/styled/index.js +0 -13
- package/node/styled/styled.js +0 -10
- package/node/typography/index.js +0 -25
- package/node/typography/typography.js +0 -44
- package/node/useMediaQuery/index.js +0 -25
- package/node/useTheme/index.js +0 -25
- package/node/useTheme/useTheme.js +0 -15
- package/node/useThemeProps/getThemeProps.js +0 -19
- package/node/useThemeProps/index.js +0 -20
- package/node/useThemeProps/useThemeProps.js +0 -26
- package/node/useThemeWithoutDefault/index.js +0 -13
- package/node/useThemeWithoutDefault/useThemeWithoutDefault.js +0 -18
- package/node/version/index.js +0 -12
|
@@ -1,5 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = void 0;
|
|
8
|
+
var _deepmerge = _interopRequireDefault(require("@mui/utils/deepmerge"));
|
|
9
|
+
var _cssVarsParser = _interopRequireDefault(require("./cssVarsParser"));
|
|
3
10
|
function prepareCssVars(theme, parserConfig = {}) {
|
|
4
11
|
const {
|
|
5
12
|
getSelector = defaultGetSelector,
|
|
@@ -17,7 +24,7 @@ function prepareCssVars(theme, parserConfig = {}) {
|
|
|
17
24
|
vars: rootVars,
|
|
18
25
|
css: rootCss,
|
|
19
26
|
varsWithDefaults: rootVarsWithDefaults
|
|
20
|
-
} =
|
|
27
|
+
} = (0, _cssVarsParser.default)(otherTheme, parserConfig);
|
|
21
28
|
let themeVars = rootVarsWithDefaults;
|
|
22
29
|
const colorSchemesMap = {};
|
|
23
30
|
const {
|
|
@@ -29,8 +36,8 @@ function prepareCssVars(theme, parserConfig = {}) {
|
|
|
29
36
|
vars,
|
|
30
37
|
css,
|
|
31
38
|
varsWithDefaults
|
|
32
|
-
} =
|
|
33
|
-
themeVars =
|
|
39
|
+
} = (0, _cssVarsParser.default)(scheme, parserConfig);
|
|
40
|
+
themeVars = (0, _deepmerge.default)(themeVars, varsWithDefaults);
|
|
34
41
|
colorSchemesMap[key] = {
|
|
35
42
|
css,
|
|
36
43
|
vars
|
|
@@ -42,8 +49,8 @@ function prepareCssVars(theme, parserConfig = {}) {
|
|
|
42
49
|
css,
|
|
43
50
|
vars,
|
|
44
51
|
varsWithDefaults
|
|
45
|
-
} =
|
|
46
|
-
themeVars =
|
|
52
|
+
} = (0, _cssVarsParser.default)(defaultScheme, parserConfig);
|
|
53
|
+
themeVars = (0, _deepmerge.default)(themeVars, varsWithDefaults);
|
|
47
54
|
colorSchemesMap[defaultColorScheme] = {
|
|
48
55
|
css,
|
|
49
56
|
vars
|
|
@@ -89,7 +96,7 @@ function prepareCssVars(theme, parserConfig = {}) {
|
|
|
89
96
|
Object.entries(colorSchemesMap).forEach(([, {
|
|
90
97
|
vars: schemeVars
|
|
91
98
|
}]) => {
|
|
92
|
-
vars =
|
|
99
|
+
vars = (0, _deepmerge.default)(vars, schemeVars);
|
|
93
100
|
});
|
|
94
101
|
return vars;
|
|
95
102
|
};
|
|
@@ -150,4 +157,4 @@ function prepareCssVars(theme, parserConfig = {}) {
|
|
|
150
157
|
generateStyleSheets
|
|
151
158
|
};
|
|
152
159
|
}
|
|
153
|
-
|
|
160
|
+
var _default = exports.default = prepareCssVars;
|
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = prepareTypographyVars;
|
|
7
|
+
function prepareTypographyVars(typography) {
|
|
2
8
|
const vars = {};
|
|
3
9
|
const entries = Object.entries(typography);
|
|
4
10
|
entries.forEach(entry => {
|
|
@@ -1,8 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
1
2
|
'use client';
|
|
2
3
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = useCurrentColorScheme;
|
|
9
|
+
exports.getColorScheme = getColorScheme;
|
|
10
|
+
exports.getSystemMode = getSystemMode;
|
|
11
|
+
var React = _interopRequireWildcard(require("react"));
|
|
12
|
+
var _InitColorSchemeScript = require("../InitColorSchemeScript/InitColorSchemeScript");
|
|
13
|
+
function getSystemMode(mode) {
|
|
6
14
|
if (typeof window !== 'undefined' && typeof window.matchMedia === 'function' && mode === 'system') {
|
|
7
15
|
const mql = window.matchMedia('(prefers-color-scheme: dark)');
|
|
8
16
|
if (mql.matches) {
|
|
@@ -21,7 +29,7 @@ function processState(state, callback) {
|
|
|
21
29
|
}
|
|
22
30
|
return undefined;
|
|
23
31
|
}
|
|
24
|
-
|
|
32
|
+
function getColorScheme(state) {
|
|
25
33
|
return processState(state, mode => {
|
|
26
34
|
if (mode === 'light') {
|
|
27
35
|
return state.lightColorScheme;
|
|
@@ -43,19 +51,19 @@ function initializeValue(key, defaultValue) {
|
|
|
43
51
|
// the first time that user enters the site.
|
|
44
52
|
localStorage.setItem(key, defaultValue);
|
|
45
53
|
}
|
|
46
|
-
} catch
|
|
54
|
+
} catch {
|
|
47
55
|
// Unsupported
|
|
48
56
|
}
|
|
49
57
|
return value || defaultValue;
|
|
50
58
|
}
|
|
51
|
-
|
|
59
|
+
function useCurrentColorScheme(options) {
|
|
52
60
|
const {
|
|
53
61
|
defaultMode = 'light',
|
|
54
62
|
defaultLightColorScheme,
|
|
55
63
|
defaultDarkColorScheme,
|
|
56
64
|
supportedColorSchemes = [],
|
|
57
|
-
modeStorageKey = DEFAULT_MODE_STORAGE_KEY,
|
|
58
|
-
colorSchemeStorageKey = DEFAULT_COLOR_SCHEME_STORAGE_KEY,
|
|
65
|
+
modeStorageKey = _InitColorSchemeScript.DEFAULT_MODE_STORAGE_KEY,
|
|
66
|
+
colorSchemeStorageKey = _InitColorSchemeScript.DEFAULT_COLOR_SCHEME_STORAGE_KEY,
|
|
59
67
|
storageWindow = typeof window === 'undefined' ? undefined : window
|
|
60
68
|
} = options;
|
|
61
69
|
const joinedColorSchemes = supportedColorSchemes.join(',');
|
|
@@ -90,7 +98,7 @@ export default function useCurrentColorScheme(options) {
|
|
|
90
98
|
const newMode = mode ?? defaultMode;
|
|
91
99
|
try {
|
|
92
100
|
localStorage.setItem(modeStorageKey, newMode);
|
|
93
|
-
} catch
|
|
101
|
+
} catch {
|
|
94
102
|
// Unsupported
|
|
95
103
|
}
|
|
96
104
|
return {
|
|
@@ -106,7 +114,7 @@ export default function useCurrentColorScheme(options) {
|
|
|
106
114
|
try {
|
|
107
115
|
localStorage.setItem(`${colorSchemeStorageKey}-light`, defaultLightColorScheme);
|
|
108
116
|
localStorage.setItem(`${colorSchemeStorageKey}-dark`, defaultDarkColorScheme);
|
|
109
|
-
} catch
|
|
117
|
+
} catch {
|
|
110
118
|
// Unsupported
|
|
111
119
|
}
|
|
112
120
|
return {
|
|
@@ -126,7 +134,7 @@ export default function useCurrentColorScheme(options) {
|
|
|
126
134
|
processState(currentState, mode => {
|
|
127
135
|
try {
|
|
128
136
|
localStorage.setItem(`${colorSchemeStorageKey}-${mode}`, value);
|
|
129
|
-
} catch
|
|
137
|
+
} catch {
|
|
130
138
|
// Unsupported
|
|
131
139
|
}
|
|
132
140
|
if (mode === 'light') {
|
package/display/display.js
CHANGED
|
@@ -1,6 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.whiteSpace = exports.visibility = exports.textOverflow = exports.overflow = exports.displayRaw = exports.displayPrint = exports.default = void 0;
|
|
8
|
+
var _style = _interopRequireDefault(require("../style"));
|
|
9
|
+
var _compose = _interopRequireDefault(require("../compose"));
|
|
10
|
+
const displayPrint = exports.displayPrint = (0, _style.default)({
|
|
4
11
|
prop: 'displayPrint',
|
|
5
12
|
cssProperty: false,
|
|
6
13
|
transform: value => ({
|
|
@@ -9,19 +16,19 @@ export const displayPrint = style({
|
|
|
9
16
|
}
|
|
10
17
|
})
|
|
11
18
|
});
|
|
12
|
-
|
|
19
|
+
const displayRaw = exports.displayRaw = (0, _style.default)({
|
|
13
20
|
prop: 'display'
|
|
14
21
|
});
|
|
15
|
-
|
|
22
|
+
const overflow = exports.overflow = (0, _style.default)({
|
|
16
23
|
prop: 'overflow'
|
|
17
24
|
});
|
|
18
|
-
|
|
25
|
+
const textOverflow = exports.textOverflow = (0, _style.default)({
|
|
19
26
|
prop: 'textOverflow'
|
|
20
27
|
});
|
|
21
|
-
|
|
28
|
+
const visibility = exports.visibility = (0, _style.default)({
|
|
22
29
|
prop: 'visibility'
|
|
23
30
|
});
|
|
24
|
-
|
|
31
|
+
const whiteSpace = exports.whiteSpace = (0, _style.default)({
|
|
25
32
|
prop: 'whiteSpace'
|
|
26
33
|
});
|
|
27
|
-
|
|
34
|
+
var _default = exports.default = (0, _compose.default)(displayPrint, displayRaw, overflow, textOverflow, visibility, whiteSpace);
|
package/display/index.js
CHANGED
|
@@ -1,2 +1,25 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
var _exportNames = {};
|
|
8
|
+
Object.defineProperty(exports, "default", {
|
|
9
|
+
enumerable: true,
|
|
10
|
+
get: function () {
|
|
11
|
+
return _display.default;
|
|
12
|
+
}
|
|
13
|
+
});
|
|
14
|
+
var _display = _interopRequireWildcard(require("./display"));
|
|
15
|
+
Object.keys(_display).forEach(function (key) {
|
|
16
|
+
if (key === "default" || key === "__esModule") return;
|
|
17
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
18
|
+
if (key in exports && exports[key] === _display[key]) return;
|
|
19
|
+
Object.defineProperty(exports, key, {
|
|
20
|
+
enumerable: true,
|
|
21
|
+
get: function () {
|
|
22
|
+
return _display[key];
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
});
|
package/display/package.json
CHANGED
package/esm/Box/Box.js
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import ClassNameGenerator from '@mui/utils/ClassNameGenerator';
|
|
5
|
+
import createBox from "../createBox/index.js";
|
|
6
|
+
import boxClasses from "./boxClasses.js";
|
|
7
|
+
const Box = createBox({
|
|
8
|
+
defaultClassName: boxClasses.root,
|
|
9
|
+
generateClassName: ClassNameGenerator.generate
|
|
10
|
+
});
|
|
11
|
+
process.env.NODE_ENV !== "production" ? Box.propTypes /* remove-proptypes */ = {
|
|
12
|
+
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
13
|
+
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
14
|
+
// │ To update them, edit the d.ts file and run `pnpm proptypes`. │
|
|
15
|
+
// └─────────────────────────────────────────────────────────────────────┘
|
|
16
|
+
/**
|
|
17
|
+
* @ignore
|
|
18
|
+
*/
|
|
19
|
+
children: PropTypes.node,
|
|
20
|
+
/**
|
|
21
|
+
* The component used for the root node.
|
|
22
|
+
* Either a string to use a HTML element or a component.
|
|
23
|
+
*/
|
|
24
|
+
component: PropTypes.elementType,
|
|
25
|
+
/**
|
|
26
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
27
|
+
*/
|
|
28
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
29
|
+
} : void 0;
|
|
30
|
+
export default Box;
|
package/esm/Box/index.js
ADDED
|
@@ -1,13 +1,8 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
'use client';
|
|
3
2
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
});
|
|
8
|
-
exports.default = void 0;
|
|
9
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
10
|
-
var _createContainer = _interopRequireDefault(require("./createContainer"));
|
|
3
|
+
import PropTypes from 'prop-types';
|
|
4
|
+
import createContainer from "./createContainer.js";
|
|
5
|
+
|
|
11
6
|
/**
|
|
12
7
|
*
|
|
13
8
|
* Demos:
|
|
@@ -19,7 +14,7 @@ var _createContainer = _interopRequireDefault(require("./createContainer"));
|
|
|
19
14
|
*
|
|
20
15
|
* - [Container API](https://mui.com/system/api/container/)
|
|
21
16
|
*/
|
|
22
|
-
const Container = (
|
|
17
|
+
const Container = createContainer();
|
|
23
18
|
process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
|
|
24
19
|
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
25
20
|
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
@@ -28,21 +23,21 @@ process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes
|
|
|
28
23
|
/**
|
|
29
24
|
* @ignore
|
|
30
25
|
*/
|
|
31
|
-
children:
|
|
26
|
+
children: PropTypes.node,
|
|
32
27
|
/**
|
|
33
28
|
* Override or extend the styles applied to the component.
|
|
34
29
|
*/
|
|
35
|
-
classes:
|
|
30
|
+
classes: PropTypes.object,
|
|
36
31
|
/**
|
|
37
32
|
* The component used for the root node.
|
|
38
33
|
* Either a string to use a HTML element or a component.
|
|
39
34
|
*/
|
|
40
|
-
component:
|
|
35
|
+
component: PropTypes.elementType,
|
|
41
36
|
/**
|
|
42
37
|
* If `true`, the left and right padding is removed.
|
|
43
38
|
* @default false
|
|
44
39
|
*/
|
|
45
|
-
disableGutters:
|
|
40
|
+
disableGutters: PropTypes.bool,
|
|
46
41
|
/**
|
|
47
42
|
* Set the max-width to match the min-width of the current breakpoint.
|
|
48
43
|
* This is useful if you'd prefer to design for a fixed set of sizes
|
|
@@ -50,17 +45,17 @@ process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes
|
|
|
50
45
|
* It's fluid by default.
|
|
51
46
|
* @default false
|
|
52
47
|
*/
|
|
53
|
-
fixed:
|
|
48
|
+
fixed: PropTypes.bool,
|
|
54
49
|
/**
|
|
55
50
|
* Determine the max-width of the container.
|
|
56
51
|
* The container width grows with the size of the screen.
|
|
57
52
|
* Set to `false` to disable `maxWidth`.
|
|
58
53
|
* @default 'lg'
|
|
59
54
|
*/
|
|
60
|
-
maxWidth:
|
|
55
|
+
maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
61
56
|
/**
|
|
62
57
|
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
63
58
|
*/
|
|
64
|
-
sx:
|
|
59
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
65
60
|
} : void 0;
|
|
66
|
-
|
|
61
|
+
export default Container;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
|
|
2
|
+
import generateUtilityClass from '@mui/utils/generateUtilityClass';
|
|
3
|
+
export function getContainerUtilityClass(slot) {
|
|
4
|
+
return generateUtilityClass('MuiContainer', slot);
|
|
5
|
+
}
|
|
6
|
+
const containerClasses = generateUtilityClasses('MuiContainer', ['root', 'disableGutters', 'fixed', 'maxWidthXs', 'maxWidthSm', 'maxWidthMd', 'maxWidthLg', 'maxWidthXl']);
|
|
7
|
+
export default containerClasses;
|
|
@@ -1,40 +1,32 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
|
|
14
|
-
var _capitalize = _interopRequireDefault(require("@mui/utils/capitalize"));
|
|
15
|
-
var _useThemeProps = _interopRequireDefault(require("../useThemeProps"));
|
|
16
|
-
var _styled = _interopRequireDefault(require("../styled"));
|
|
17
|
-
var _createTheme = _interopRequireDefault(require("../createTheme"));
|
|
18
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
|
-
const defaultTheme = (0, _createTheme.default)();
|
|
20
|
-
const defaultCreateStyledComponent = (0, _styled.default)('div', {
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import PropTypes from 'prop-types';
|
|
3
|
+
import clsx from 'clsx';
|
|
4
|
+
import generateUtilityClass from '@mui/utils/generateUtilityClass';
|
|
5
|
+
import composeClasses from '@mui/utils/composeClasses';
|
|
6
|
+
import capitalize from '@mui/utils/capitalize';
|
|
7
|
+
import useThemePropsSystem from "../useThemeProps/index.js";
|
|
8
|
+
import systemStyled from "../styled/index.js";
|
|
9
|
+
import createTheme from "../createTheme/index.js";
|
|
10
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
|
+
const defaultTheme = createTheme();
|
|
12
|
+
const defaultCreateStyledComponent = systemStyled('div', {
|
|
21
13
|
name: 'MuiContainer',
|
|
22
14
|
slot: 'Root',
|
|
23
15
|
overridesResolver: (props, styles) => {
|
|
24
16
|
const {
|
|
25
17
|
ownerState
|
|
26
18
|
} = props;
|
|
27
|
-
return [styles.root, styles[`maxWidth${(
|
|
19
|
+
return [styles.root, styles[`maxWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
|
|
28
20
|
}
|
|
29
21
|
});
|
|
30
|
-
const useThemePropsDefault = inProps => (
|
|
22
|
+
const useThemePropsDefault = inProps => useThemePropsSystem({
|
|
31
23
|
props: inProps,
|
|
32
24
|
name: 'MuiContainer',
|
|
33
25
|
defaultTheme
|
|
34
26
|
});
|
|
35
27
|
const useUtilityClasses = (ownerState, componentName) => {
|
|
36
28
|
const getContainerUtilityClass = slot => {
|
|
37
|
-
return (
|
|
29
|
+
return generateUtilityClass(componentName, slot);
|
|
38
30
|
};
|
|
39
31
|
const {
|
|
40
32
|
classes,
|
|
@@ -43,11 +35,11 @@ const useUtilityClasses = (ownerState, componentName) => {
|
|
|
43
35
|
maxWidth
|
|
44
36
|
} = ownerState;
|
|
45
37
|
const slots = {
|
|
46
|
-
root: ['root', maxWidth && `maxWidth${(
|
|
38
|
+
root: ['root', maxWidth && `maxWidth${capitalize(String(maxWidth))}`, fixed && 'fixed', disableGutters && 'disableGutters']
|
|
47
39
|
};
|
|
48
|
-
return (
|
|
40
|
+
return composeClasses(slots, getContainerUtilityClass, classes);
|
|
49
41
|
};
|
|
50
|
-
function createContainer(options = {}) {
|
|
42
|
+
export default function createContainer(options = {}) {
|
|
51
43
|
const {
|
|
52
44
|
// This will allow adding custom styled fn (for example for custom sx style function)
|
|
53
45
|
createStyledComponent = defaultCreateStyledComponent,
|
|
@@ -130,26 +122,26 @@ function createContainer(options = {}) {
|
|
|
130
122
|
return (
|
|
131
123
|
/*#__PURE__*/
|
|
132
124
|
// @ts-ignore theme is injected by the styled util
|
|
133
|
-
(
|
|
125
|
+
_jsx(ContainerRoot, {
|
|
134
126
|
as: component
|
|
135
127
|
// @ts-ignore module augmentation fails if custom breakpoints are used
|
|
136
128
|
,
|
|
137
129
|
ownerState: ownerState,
|
|
138
|
-
className: (
|
|
130
|
+
className: clsx(classes.root, className),
|
|
139
131
|
ref: ref,
|
|
140
132
|
...other
|
|
141
133
|
})
|
|
142
134
|
);
|
|
143
135
|
});
|
|
144
136
|
process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
|
|
145
|
-
children:
|
|
146
|
-
classes:
|
|
147
|
-
className:
|
|
148
|
-
component:
|
|
149
|
-
disableGutters:
|
|
150
|
-
fixed:
|
|
151
|
-
maxWidth:
|
|
152
|
-
sx:
|
|
137
|
+
children: PropTypes.node,
|
|
138
|
+
classes: PropTypes.object,
|
|
139
|
+
className: PropTypes.string,
|
|
140
|
+
component: PropTypes.elementType,
|
|
141
|
+
disableGutters: PropTypes.bool,
|
|
142
|
+
fixed: PropTypes.bool,
|
|
143
|
+
maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
|
|
144
|
+
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
|
|
153
145
|
} : void 0;
|
|
154
146
|
return Container;
|
|
155
147
|
}
|
|
@@ -1,23 +1,15 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
'use client';
|
|
3
2
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
});
|
|
9
|
-
exports.default = void 0;
|
|
10
|
-
exports.useDefaultProps = useDefaultProps;
|
|
11
|
-
var React = _interopRequireWildcard(require("react"));
|
|
12
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
-
var _resolveProps = _interopRequireDefault(require("@mui/utils/resolveProps"));
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
5
|
+
import resolveProps from '@mui/utils/resolveProps';
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
7
|
const PropsContext = /*#__PURE__*/React.createContext(undefined);
|
|
16
8
|
function DefaultPropsProvider({
|
|
17
9
|
value,
|
|
18
10
|
children
|
|
19
11
|
}) {
|
|
20
|
-
return /*#__PURE__*/(
|
|
12
|
+
return /*#__PURE__*/_jsx(PropsContext.Provider, {
|
|
21
13
|
value: value,
|
|
22
14
|
children: children
|
|
23
15
|
});
|
|
@@ -30,11 +22,11 @@ process.env.NODE_ENV !== "production" ? DefaultPropsProvider.propTypes /* remove
|
|
|
30
22
|
/**
|
|
31
23
|
* @ignore
|
|
32
24
|
*/
|
|
33
|
-
children:
|
|
25
|
+
children: PropTypes.node,
|
|
34
26
|
/**
|
|
35
27
|
* @ignore
|
|
36
28
|
*/
|
|
37
|
-
value:
|
|
29
|
+
value: PropTypes.object
|
|
38
30
|
} : void 0;
|
|
39
31
|
function getThemeProps(params) {
|
|
40
32
|
const {
|
|
@@ -48,15 +40,15 @@ function getThemeProps(params) {
|
|
|
48
40
|
const config = theme.components[name];
|
|
49
41
|
if (config.defaultProps) {
|
|
50
42
|
// compatible with v5 signature
|
|
51
|
-
return (
|
|
43
|
+
return resolveProps(config.defaultProps, props);
|
|
52
44
|
}
|
|
53
45
|
if (!config.styleOverrides && !config.variants) {
|
|
54
46
|
// v6 signature, no property 'defaultProps'
|
|
55
|
-
return (
|
|
47
|
+
return resolveProps(config, props);
|
|
56
48
|
}
|
|
57
49
|
return props;
|
|
58
50
|
}
|
|
59
|
-
function useDefaultProps({
|
|
51
|
+
export function useDefaultProps({
|
|
60
52
|
props,
|
|
61
53
|
name
|
|
62
54
|
}) {
|
|
@@ -69,4 +61,4 @@ function useDefaultProps({
|
|
|
69
61
|
}
|
|
70
62
|
});
|
|
71
63
|
}
|
|
72
|
-
|
|
64
|
+
export default DefaultPropsProvider;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default, useDefaultProps } from "./DefaultPropsProvider.js";
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import PropTypes from 'prop-types';
|
|
5
|
+
import { GlobalStyles as MuiGlobalStyles } from '@mui/styled-engine';
|
|
6
|
+
import useTheme from "../useTheme/index.js";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
function GlobalStyles({
|
|
9
|
+
styles,
|
|
10
|
+
themeId,
|
|
11
|
+
defaultTheme = {}
|
|
12
|
+
}) {
|
|
13
|
+
const upperTheme = useTheme(defaultTheme);
|
|
14
|
+
const globalStyles = typeof styles === 'function' ? styles(themeId ? upperTheme[themeId] || upperTheme : upperTheme) : styles;
|
|
15
|
+
return /*#__PURE__*/_jsx(MuiGlobalStyles, {
|
|
16
|
+
styles: globalStyles
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
process.env.NODE_ENV !== "production" ? GlobalStyles.propTypes /* remove-proptypes */ = {
|
|
20
|
+
// ┌────────────────────────────── Warning ──────────────────────────────┐
|
|
21
|
+
// │ These PropTypes are generated from the TypeScript type definitions. │
|
|
22
|
+
// │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
|
|
23
|
+
// └─────────────────────────────────────────────────────────────────────┘
|
|
24
|
+
/**
|
|
25
|
+
* @ignore
|
|
26
|
+
*/
|
|
27
|
+
defaultTheme: PropTypes.object,
|
|
28
|
+
/**
|
|
29
|
+
* @ignore
|
|
30
|
+
*/
|
|
31
|
+
styles: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.array, PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool]),
|
|
32
|
+
/**
|
|
33
|
+
* @ignore
|
|
34
|
+
*/
|
|
35
|
+
themeId: PropTypes.string
|
|
36
|
+
} : void 0;
|
|
37
|
+
export default GlobalStyles;
|