@mui/system 5.11.14 → 5.11.16
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.spec.d.ts +1 -1
- package/CHANGELOG.md +118 -4
- package/Container/Container.d.ts +13 -13
- package/Container/ContainerProps.d.ts +40 -40
- package/Container/containerClasses.d.ts +22 -22
- package/Container/createContainer.d.ts +18 -18
- package/Stack/Stack.d.ts +13 -13
- package/Stack/Stack.js +11 -1
- package/Stack/StackProps.d.ts +53 -42
- package/Stack/createStack.d.ts +21 -21
- package/Stack/createStack.js +10 -3
- package/Stack/index.d.ts +5 -5
- package/Stack/stackClasses.d.ts +8 -8
- package/Unstable_Grid/Grid.d.ts +12 -12
- package/Unstable_Grid/GridProps.d.ts +173 -173
- package/Unstable_Grid/createGrid.d.ts +11 -11
- package/Unstable_Grid/gridClasses.d.ts +20 -20
- package/Unstable_Grid/gridGenerator.d.ts +38 -33
- package/Unstable_Grid/gridGenerator.js +24 -10
- package/Unstable_Grid/index.d.ts +5 -5
- package/createBox.spec.d.ts +1 -1
- package/createTheme/createSpacing.d.ts +10 -10
- package/cssVars/createCssVarsProvider.spec.d.ts +1 -1
- package/cssVars/createCssVarsTheme.d.ts +13 -13
- package/cssVars/createGetCssVar.d.ts +5 -5
- package/cssVars/cssVarsParser.d.ts +64 -64
- package/cssVars/getInitColorSchemeScript.d.ts +42 -42
- package/cssVars/index.d.ts +5 -5
- package/cssVars/prepareCssVars.d.ts +14 -14
- package/cssVars/useCurrentColorScheme.d.ts +53 -53
- package/esm/Stack/Stack.js +11 -1
- package/esm/Stack/createStack.js +10 -3
- package/esm/Unstable_Grid/gridGenerator.js +24 -10
- package/esm/styleFunctionSx/defaultSxConfig.js +3 -38
- package/esm/styleFunctionSx/styleFunctionSx.js +5 -0
- package/index.js +1 -1
- package/index.spec.d.ts +1 -1
- package/legacy/Stack/Stack.js +11 -1
- package/legacy/Stack/createStack.js +10 -2
- package/legacy/Unstable_Grid/gridGenerator.js +45 -35
- package/legacy/index.js +1 -1
- package/legacy/styleFunctionSx/defaultSxConfig.js +3 -38
- package/legacy/styleFunctionSx/styleFunctionSx.js +7 -4
- package/modern/Stack/Stack.js +11 -1
- package/modern/Stack/createStack.js +10 -3
- package/modern/Unstable_Grid/gridGenerator.js +24 -10
- package/modern/index.js +1 -1
- package/modern/styleFunctionSx/defaultSxConfig.js +3 -35
- package/modern/styleFunctionSx/styleFunctionSx.js +5 -0
- package/package.json +3 -3
- package/styleFunctionSx/defaultSxConfig.js +3 -38
- package/styleFunctionSx/styleFunctionSx.js +5 -0
- package/styleFunctionSx/styleFunctionSx.spec.d.ts +1 -1
package/Box/Box.spec.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {};
|
|
1
|
+
export {};
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,119 @@
|
|
|
1
1
|
# [Versions](https://mui.com/versions/)
|
|
2
2
|
|
|
3
|
+
## 5.11.16
|
|
4
|
+
|
|
5
|
+
<!-- generated comparing v5.11.15..master -->
|
|
6
|
+
|
|
7
|
+
_Apr 4, 2023_
|
|
8
|
+
|
|
9
|
+
A big thanks to the 17 contributors who made this release possible. Here are some highlights ✨:
|
|
10
|
+
|
|
11
|
+
- 💅 Added tabs on API pages of Base UI to switch between component and hook references (#35938) @mnajdova
|
|
12
|
+
- 🐛 bug fixes and 📚 documentation improvements.
|
|
13
|
+
|
|
14
|
+
### `@mui/material@5.11.16`
|
|
15
|
+
|
|
16
|
+
- [Autocomplete] Listen for click on the root element (#36369) @sai6855
|
|
17
|
+
- [Autocomplete] Fix navigation issue on mouse hover (#35196) @sai6855
|
|
18
|
+
- [Card] Fix Card focus effect overflowing parent card (#36329) @mj12albert
|
|
19
|
+
- [Grid] Missing slot (#36765) @siriwatknp
|
|
20
|
+
- [Select] Make error part of the `ownerState` to enable overriding styles with it in theme (#36422) @gitstart
|
|
21
|
+
- [Slider] Fix ValueLabel UI issues comes when size="small" and orientation="vertical (#36738) @yushanwebdev
|
|
22
|
+
|
|
23
|
+
### `@mui/icons-material@5.11.16`
|
|
24
|
+
|
|
25
|
+
- [icons] Do not ignore popular icons (#36608) @michaldudak
|
|
26
|
+
|
|
27
|
+
### `@mui/joy@5.0.0-alpha.74`
|
|
28
|
+
|
|
29
|
+
- [Joy] Add `ModalOverflow` component (#36262) @siriwatknp
|
|
30
|
+
- [Joy] Fix `Checkbox` custom color prop type warning (#36691) @amal-qb
|
|
31
|
+
|
|
32
|
+
### Docs
|
|
33
|
+
|
|
34
|
+
- [docs][base] Add return type for `useFormControlUnstyledContext` hook (#36302) @HeVictor
|
|
35
|
+
- [docs][base] Move styles to the bottom of demos code for `FormControl` (#36579) @gitstart
|
|
36
|
+
- [docs][base] Move styles to the bottom of demos code for `Menu` (#36582) @gitstart
|
|
37
|
+
- [docs][base] Move styles code to bottom in the `Button` demos (#36590) @sai6855
|
|
38
|
+
- [docs][base] Show components & hooks API on the components page (#35938) @mnajdova
|
|
39
|
+
- [docs] Describe slotProps in MUI Base customization doc (#36206) @michaldudak
|
|
40
|
+
- [docs] Fix double API page redirection (#36743) @oliviertassinari
|
|
41
|
+
- [docs] Remove hash property and leverage pathname (#36764) @siriwatknp
|
|
42
|
+
- [docs] Introduce markdown permalink to source (#36729) @oliviertassinari
|
|
43
|
+
- [docs] Tabs API add slots section (#36769) @mnajdova
|
|
44
|
+
- [docs] Update feedbacks management on slack (#36705) @alexfauquette
|
|
45
|
+
- [docs] Fix Joy UI URL to tokens (#36742) @oliviertassinari
|
|
46
|
+
- [docs] Add toggle-button coming soon page (#36618) @siriwatknp
|
|
47
|
+
- [docs] Fix typo on the Joy UI theme builder (#36734) @danilo-leal
|
|
48
|
+
- [docs] Fix small typo (#36727) @RBerthier
|
|
49
|
+
- [docs] Fix Joy UI template broken image loading @oliviertassinari
|
|
50
|
+
- [docs] Hide the default API column if it's empty (#36715) @mnajdova
|
|
51
|
+
- [docs] Update Material UI Related Projects page (#34203) @viclafouch
|
|
52
|
+
- [docs] Revise Joy UI "Circular Progress" page (#36126) @LadyBluenotes
|
|
53
|
+
- [docs] Revise Joy UI "Radio" page (#35893) @DevinCLane
|
|
54
|
+
- [docs] Support Google Analytics 4 (#36123) @alexfauquette
|
|
55
|
+
- [docs][material] Keep consistency in description of classes (#36631) @hbjORbj
|
|
56
|
+
- [docs] Remove redundant files and fix regression (#36775) @ZeeshanTamboli
|
|
57
|
+
|
|
58
|
+
### Core
|
|
59
|
+
|
|
60
|
+
- [blog] Compress images @oliviertassinari
|
|
61
|
+
- [core] Remove unused token (#36722) @oliviertassinari
|
|
62
|
+
|
|
63
|
+
All contributors of this release in alphabetical order: @alexfauquette, @amal-qb, @danilo-leal, @DevinCLane, @gitstart, @hbjORbj, @HeVictor, @LadyBluenotes, @michaldudak, @mj12albert, @mnajdova, @oliviertassinari, @RBerthier, @sai6855, @siriwatknp, @viclafouch, @yushanwebdev
|
|
64
|
+
|
|
65
|
+
## 5.11.15
|
|
66
|
+
|
|
67
|
+
<!-- generated comparing v5.11.14..master -->
|
|
68
|
+
|
|
69
|
+
_Mar 28, 2023_
|
|
70
|
+
|
|
71
|
+
A big thanks to the 10 contributors who made this release possible. We have one big highlight this week ✨:
|
|
72
|
+
|
|
73
|
+
- @siriwatknp made a [Theme Builder](https://mui.com/joy-ui/customization/theme-builder) for Joy UI 🎨 (#35741)
|
|
74
|
+
|
|
75
|
+
### `@mui/material@5.11.15`
|
|
76
|
+
|
|
77
|
+
- [Chip] Fix error when theme value is a CSS variable (#36654) @siriwatknp
|
|
78
|
+
- [Grid2] Support dynamic nested columns (#36401) @siriwatknp
|
|
79
|
+
|
|
80
|
+
### `@mui/system@5.11.15`
|
|
81
|
+
|
|
82
|
+
- [system] Enable regressions tests & fix regressions (#36611) @mnajdova
|
|
83
|
+
- [Stack] Add `useFlexGap` prop (#36404) @siriwatknp
|
|
84
|
+
|
|
85
|
+
### `@mui/base@5.0.0-alpha.122`
|
|
86
|
+
|
|
87
|
+
- [Autocomplete] Update `autoSelect` prop description (#36280) @sai6855
|
|
88
|
+
- [TablePagination][base] Improve `actions` type in `slotProps` (#36458) @sai6855
|
|
89
|
+
- [Base] Add JSDoc comments for classes of Base components (#36586) @hbjORbj
|
|
90
|
+
- [useSlider][base] Add API docs for the hook parameters and return type (#36576) @varunmulay22
|
|
91
|
+
|
|
92
|
+
### `@mui/joy@5.0.0-alpha.73`
|
|
93
|
+
|
|
94
|
+
- [Joy] Miscellaneous fixes (#36628) @siriwatknp
|
|
95
|
+
- [Joy] Add palette customizer (#35741) @siriwatknp
|
|
96
|
+
|
|
97
|
+
### Docs
|
|
98
|
+
|
|
99
|
+
- Revert "[docs] Use `theme.applyDarkStyles` for the rest of the docs" (#36602) @mnajdova
|
|
100
|
+
- [blog] Improvements on v6 announcement blog (#36505) @joserodolfofreitas
|
|
101
|
+
- [docs] Add `Snackbar` coming soon page (#36604) @danilo-leal
|
|
102
|
+
- [docs] Add accordion coming soon page (#36279) @siriwatknp
|
|
103
|
+
- [docs] Fix palette customizer theme augmentation (#36629) @siriwatknp
|
|
104
|
+
- [docs] Finish migration away from https://reactjs.org/ @oliviertassinari
|
|
105
|
+
- [docs] Remove duplicated slot descriptions (#36621) @hbjORbj
|
|
106
|
+
- [docs] Fix broken example link (#36607) @mnajdova
|
|
107
|
+
- [docs] Use `theme.applyDarkStyles` (#36606) @siriwatknp
|
|
108
|
+
- [docs] Improve API for theme default prop (#36490) @oliviertassinari
|
|
109
|
+
- [docs][Table] Refactor `Sorting & Selecting` table demo (#33236) @IFaniry
|
|
110
|
+
|
|
111
|
+
### Core
|
|
112
|
+
|
|
113
|
+
- [core] Use Netlify function for feedback management (#36472) @alexfauquette
|
|
114
|
+
|
|
115
|
+
All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @hbjORbj, @IFaniry, @joserodolfofreitas, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @varunmulay22
|
|
116
|
+
|
|
3
117
|
## 5.11.14
|
|
4
118
|
|
|
5
119
|
<!-- generated comparing v5.11.13..master -->
|
|
@@ -5354,7 +5468,7 @@ _Sep 1, 2021_
|
|
|
5354
5468
|
A big thanks to the 18 contributors who made this release possible. Here are some highlights ✨:
|
|
5355
5469
|
|
|
5356
5470
|
- 🎉 Renamed packages to `@mui/*` as part of rebranding the company, following the strategy of expanding the library scope beyond Material Design. For more details about it, check the [GitHub discussion](https://github.com/mui/material-ui/discussions/27803).
|
|
5357
|
-
- 🛠 Added `mui-replace` codemod for migrating `@material-ui/*` to new packages `@mui/*`. Check out this [codemod detail](https://github.com/mui/material-ui/blob/
|
|
5471
|
+
- 🛠 Added `mui-replace` codemod for migrating `@material-ui/*` to new packages `@mui/*`. Check out this [codemod detail](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) or head to [migration guide](https://mui.com/material-ui/migration/migration-v4/#preset-safe)
|
|
5358
5472
|
- 🧪 Added new `<Mansory>` component to the lab, [check it out](https://mui.com/components/masonry/). It has been crafted by our first intern, @hbjORbj 👏!
|
|
5359
5473
|
|
|
5360
5474
|
### `@mui/material@5.0.0-rc.0`
|
|
@@ -5386,7 +5500,7 @@ A big thanks to the 18 contributors who made this release possible. Here are som
|
|
|
5386
5500
|
|
|
5387
5501
|
> **Note**: `@mui/base` (previously `@material-ui/unstyled`) is not the same as `@material-ui/core`.
|
|
5388
5502
|
|
|
5389
|
-
We encourage you to use the [codemod](https://github.com/mui/material-ui/blob/
|
|
5503
|
+
We encourage you to use the [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#mui-replace) for smooth migration.
|
|
5390
5504
|
|
|
5391
5505
|
#### Changes
|
|
5392
5506
|
|
|
@@ -6521,7 +6635,7 @@ A big thanks to the 14 contributors who made this release possible. Here are som
|
|
|
6521
6635
|
|
|
6522
6636
|
- 👩🎤 We have completed the migration to emotion of all the components (`@material-ui/core` and `@material-ui/lab`) @siriwatknp, @mnajdova.
|
|
6523
6637
|
- 📦 Save [10 kB gzipped](https://bundlephobia.com/package/@material-ui/core@5.0.0-alpha.34) by removing the dependency on `@material-ui/styles` (JSS) from the core and the lab (#26377, #26382, #26376) @mnajdova.
|
|
6524
|
-
- ⚒️ Add many new [codemods](https://github.com/mui/material-ui/blob/
|
|
6638
|
+
- ⚒️ Add many new [codemods](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md) to automate the migration from v4 to v5 (#24867) @mbrookes.
|
|
6525
6639
|
- And many more 🐛 bug fixes and 📚 improvements.
|
|
6526
6640
|
|
|
6527
6641
|
### `@material-ui/core@5.0.0-alpha.35`
|
|
@@ -8789,7 +8903,7 @@ A big thanks to the 17 contributors who made this release possible. Here are som
|
|
|
8789
8903
|
|
|
8790
8904
|
- [Box] Remove deprecated props (#23716) @mnajdova
|
|
8791
8905
|
All props are now available under the `sx` prop. A deprecation will be landing in v4.
|
|
8792
|
-
Thanks to @mbrookes developers can automate the migration with a [codemod](https://github.com/mui/material-ui/blob/
|
|
8906
|
+
Thanks to @mbrookes developers can automate the migration with a [codemod](https://github.com/mui/material-ui/blob/v5.0.0/packages/mui-codemod/README.md#box-sx-prop).
|
|
8793
8907
|
|
|
8794
8908
|
```diff
|
|
8795
8909
|
-<Box p={2} bgcolor="primary.main">
|
package/Container/Container.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
/**
|
|
2
|
-
*
|
|
3
|
-
* Demos:
|
|
4
|
-
*
|
|
5
|
-
* - [Container (Material UI)](https://mui.com/material-ui/react-container/)
|
|
6
|
-
* - [Container (MUI System)](https://mui.com/system/react-container/)
|
|
7
|
-
*
|
|
8
|
-
* API:
|
|
9
|
-
*
|
|
10
|
-
* - [Container API](https://mui.com/system/api/container/)
|
|
11
|
-
*/
|
|
12
|
-
declare const Container: import("@mui/types").OverridableComponent<import("./ContainerProps").ContainerTypeMap<{}, "div">>;
|
|
13
|
-
export default Container;
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Demos:
|
|
4
|
+
*
|
|
5
|
+
* - [Container (Material UI)](https://mui.com/material-ui/react-container/)
|
|
6
|
+
* - [Container (MUI System)](https://mui.com/system/react-container/)
|
|
7
|
+
*
|
|
8
|
+
* API:
|
|
9
|
+
*
|
|
10
|
+
* - [Container API](https://mui.com/system/api/container/)
|
|
11
|
+
*/
|
|
12
|
+
declare const Container: import("@mui/types").OverridableComponent<import("./ContainerProps").ContainerTypeMap<{}, "div">>;
|
|
13
|
+
export default Container;
|
|
@@ -1,40 +1,40 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { OverrideProps } from '@mui/types';
|
|
3
|
-
import { SxProps } from '../styleFunctionSx';
|
|
4
|
-
import { Theme, Breakpoint } from '../createTheme';
|
|
5
|
-
import { ContainerClasses } from './containerClasses';
|
|
6
|
-
export interface ContainerTypeMap<P = {}, D extends React.ElementType = 'div'> {
|
|
7
|
-
props: P & {
|
|
8
|
-
children?: React.ReactNode;
|
|
9
|
-
/**
|
|
10
|
-
* Override or extend the styles applied to the component.
|
|
11
|
-
*/
|
|
12
|
-
classes?: Partial<ContainerClasses>;
|
|
13
|
-
/**
|
|
14
|
-
* If `true`, the left and right padding is removed.
|
|
15
|
-
* @default false
|
|
16
|
-
*/
|
|
17
|
-
disableGutters?: boolean;
|
|
18
|
-
/**
|
|
19
|
-
* Set the max-width to match the min-width of the current breakpoint.
|
|
20
|
-
* This is useful if you'd prefer to design for a fixed set of sizes
|
|
21
|
-
* instead of trying to accommodate a fully fluid viewport.
|
|
22
|
-
* It's fluid by default.
|
|
23
|
-
* @default false
|
|
24
|
-
*/
|
|
25
|
-
fixed?: boolean;
|
|
26
|
-
/**
|
|
27
|
-
* Determine the max-width of the container.
|
|
28
|
-
* The container width grows with the size of the screen.
|
|
29
|
-
* Set to `false` to disable `maxWidth`.
|
|
30
|
-
* @default 'lg'
|
|
31
|
-
*/
|
|
32
|
-
maxWidth?: Breakpoint | false;
|
|
33
|
-
/**
|
|
34
|
-
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
35
|
-
*/
|
|
36
|
-
sx?: SxProps<Theme>;
|
|
37
|
-
};
|
|
38
|
-
defaultComponent: D;
|
|
39
|
-
}
|
|
40
|
-
export type ContainerProps<D extends React.ElementType = ContainerTypeMap['defaultComponent'], P = {}> = OverrideProps<ContainerTypeMap<P, D>, D>;
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { OverrideProps } from '@mui/types';
|
|
3
|
+
import { SxProps } from '../styleFunctionSx';
|
|
4
|
+
import { Theme, Breakpoint } from '../createTheme';
|
|
5
|
+
import { ContainerClasses } from './containerClasses';
|
|
6
|
+
export interface ContainerTypeMap<P = {}, D extends React.ElementType = 'div'> {
|
|
7
|
+
props: P & {
|
|
8
|
+
children?: React.ReactNode;
|
|
9
|
+
/**
|
|
10
|
+
* Override or extend the styles applied to the component.
|
|
11
|
+
*/
|
|
12
|
+
classes?: Partial<ContainerClasses>;
|
|
13
|
+
/**
|
|
14
|
+
* If `true`, the left and right padding is removed.
|
|
15
|
+
* @default false
|
|
16
|
+
*/
|
|
17
|
+
disableGutters?: boolean;
|
|
18
|
+
/**
|
|
19
|
+
* Set the max-width to match the min-width of the current breakpoint.
|
|
20
|
+
* This is useful if you'd prefer to design for a fixed set of sizes
|
|
21
|
+
* instead of trying to accommodate a fully fluid viewport.
|
|
22
|
+
* It's fluid by default.
|
|
23
|
+
* @default false
|
|
24
|
+
*/
|
|
25
|
+
fixed?: boolean;
|
|
26
|
+
/**
|
|
27
|
+
* Determine the max-width of the container.
|
|
28
|
+
* The container width grows with the size of the screen.
|
|
29
|
+
* Set to `false` to disable `maxWidth`.
|
|
30
|
+
* @default 'lg'
|
|
31
|
+
*/
|
|
32
|
+
maxWidth?: Breakpoint | false;
|
|
33
|
+
/**
|
|
34
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
35
|
+
*/
|
|
36
|
+
sx?: SxProps<Theme>;
|
|
37
|
+
};
|
|
38
|
+
defaultComponent: D;
|
|
39
|
+
}
|
|
40
|
+
export type ContainerProps<D extends React.ElementType = ContainerTypeMap['defaultComponent'], P = {}> = OverrideProps<ContainerTypeMap<P, D>, D>;
|
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
export interface ContainerClasses {
|
|
2
|
-
/** Styles applied to the root element. */
|
|
3
|
-
root: string;
|
|
4
|
-
/** Styles applied to the root element if `disableGutters={true}`. */
|
|
5
|
-
disableGutters: string;
|
|
6
|
-
/** Styles applied to the root element if `fixed={true}`. */
|
|
7
|
-
fixed: string;
|
|
8
|
-
/** Styles applied to the root element if `maxWidth="xs"`. */
|
|
9
|
-
maxWidthXs: string;
|
|
10
|
-
/** Styles applied to the root element if `maxWidth="sm"`. */
|
|
11
|
-
maxWidthSm: string;
|
|
12
|
-
/** Styles applied to the root element if `maxWidth="md"`. */
|
|
13
|
-
maxWidthMd: string;
|
|
14
|
-
/** Styles applied to the root element if `maxWidth="lg"`. */
|
|
15
|
-
maxWidthLg: string;
|
|
16
|
-
/** Styles applied to the root element if `maxWidth="xl"`. */
|
|
17
|
-
maxWidthXl: string;
|
|
18
|
-
}
|
|
19
|
-
export type ContainerClassKey = keyof ContainerClasses;
|
|
20
|
-
export declare function getContainerUtilityClass(slot: string): string;
|
|
21
|
-
declare const containerClasses: ContainerClasses;
|
|
22
|
-
export default containerClasses;
|
|
1
|
+
export interface ContainerClasses {
|
|
2
|
+
/** Styles applied to the root element. */
|
|
3
|
+
root: string;
|
|
4
|
+
/** Styles applied to the root element if `disableGutters={true}`. */
|
|
5
|
+
disableGutters: string;
|
|
6
|
+
/** Styles applied to the root element if `fixed={true}`. */
|
|
7
|
+
fixed: string;
|
|
8
|
+
/** Styles applied to the root element if `maxWidth="xs"`. */
|
|
9
|
+
maxWidthXs: string;
|
|
10
|
+
/** Styles applied to the root element if `maxWidth="sm"`. */
|
|
11
|
+
maxWidthSm: string;
|
|
12
|
+
/** Styles applied to the root element if `maxWidth="md"`. */
|
|
13
|
+
maxWidthMd: string;
|
|
14
|
+
/** Styles applied to the root element if `maxWidth="lg"`. */
|
|
15
|
+
maxWidthLg: string;
|
|
16
|
+
/** Styles applied to the root element if `maxWidth="xl"`. */
|
|
17
|
+
maxWidthXl: string;
|
|
18
|
+
}
|
|
19
|
+
export type ContainerClassKey = keyof ContainerClasses;
|
|
20
|
+
export declare function getContainerUtilityClass(slot: string): string;
|
|
21
|
+
declare const containerClasses: ContainerClasses;
|
|
22
|
+
export default containerClasses;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { Interpolation, StyledComponent } from '@mui/styled-engine';
|
|
3
|
-
import { OverridableComponent } from '@mui/types';
|
|
4
|
-
import { ContainerProps, ContainerTypeMap } from './ContainerProps';
|
|
5
|
-
import { Theme as DefaultTheme } from '../createTheme';
|
|
6
|
-
interface StyleFnProps<Theme> extends ContainerProps {
|
|
7
|
-
theme: Theme;
|
|
8
|
-
ownerState: ContainerProps;
|
|
9
|
-
}
|
|
10
|
-
type RequiredThemeStructure = Pick<DefaultTheme, 'breakpoints' | 'spacing'>;
|
|
11
|
-
export default function createContainer<Theme extends RequiredThemeStructure = DefaultTheme>(options?: {
|
|
12
|
-
createStyledComponent?: (...styles: Array<Interpolation<StyleFnProps<Theme>>>) => StyledComponent<ContainerProps>;
|
|
13
|
-
useThemeProps?: (inProps: ContainerProps) => ContainerProps & {
|
|
14
|
-
component?: React.ElementType;
|
|
15
|
-
};
|
|
16
|
-
componentName?: string;
|
|
17
|
-
}): OverridableComponent<ContainerTypeMap<{}, "div">>;
|
|
18
|
-
export {};
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Interpolation, StyledComponent } from '@mui/styled-engine';
|
|
3
|
+
import { OverridableComponent } from '@mui/types';
|
|
4
|
+
import { ContainerProps, ContainerTypeMap } from './ContainerProps';
|
|
5
|
+
import { Theme as DefaultTheme } from '../createTheme';
|
|
6
|
+
interface StyleFnProps<Theme> extends ContainerProps {
|
|
7
|
+
theme: Theme;
|
|
8
|
+
ownerState: ContainerProps;
|
|
9
|
+
}
|
|
10
|
+
type RequiredThemeStructure = Pick<DefaultTheme, 'breakpoints' | 'spacing'>;
|
|
11
|
+
export default function createContainer<Theme extends RequiredThemeStructure = DefaultTheme>(options?: {
|
|
12
|
+
createStyledComponent?: (...styles: Array<Interpolation<StyleFnProps<Theme>>>) => StyledComponent<ContainerProps>;
|
|
13
|
+
useThemeProps?: (inProps: ContainerProps) => ContainerProps & {
|
|
14
|
+
component?: React.ElementType;
|
|
15
|
+
};
|
|
16
|
+
componentName?: string;
|
|
17
|
+
}): OverridableComponent<ContainerTypeMap<{}, "div">>;
|
|
18
|
+
export {};
|
package/Stack/Stack.d.ts
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
/**
|
|
2
|
-
*
|
|
3
|
-
* Demos:
|
|
4
|
-
*
|
|
5
|
-
* - [Stack (Material UI)](https://mui.com/material-ui/react-stack/)
|
|
6
|
-
* - [Stack (MUI System)](https://mui.com/system/react-stack/)
|
|
7
|
-
*
|
|
8
|
-
* API:
|
|
9
|
-
*
|
|
10
|
-
* - [Stack API](https://mui.com/system/api/stack/)
|
|
11
|
-
*/
|
|
12
|
-
declare const Stack: import("@mui/types").OverridableComponent<import("./StackProps").StackTypeMap<{}, "div">>;
|
|
13
|
-
export default Stack;
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Demos:
|
|
4
|
+
*
|
|
5
|
+
* - [Stack (Material UI)](https://mui.com/material-ui/react-stack/)
|
|
6
|
+
* - [Stack (MUI System)](https://mui.com/system/react-stack/)
|
|
7
|
+
*
|
|
8
|
+
* API:
|
|
9
|
+
*
|
|
10
|
+
* - [Stack API](https://mui.com/system/api/stack/)
|
|
11
|
+
*/
|
|
12
|
+
declare const Stack: import("@mui/types").OverridableComponent<import("./StackProps").StackTypeMap<{}, "div">>;
|
|
13
|
+
export default Stack;
|
package/Stack/Stack.js
CHANGED
|
@@ -51,7 +51,17 @@ process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ =
|
|
|
51
51
|
/**
|
|
52
52
|
* The system prop, which allows defining system overrides as well as additional CSS styles.
|
|
53
53
|
*/
|
|
54
|
-
sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])
|
|
54
|
+
sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
|
|
55
|
+
/**
|
|
56
|
+
* If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
|
|
57
|
+
*
|
|
58
|
+
* While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack#limitations),
|
|
59
|
+
* it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
|
|
60
|
+
*
|
|
61
|
+
* To enable this flag globally, follow the theme's default props configuration.
|
|
62
|
+
* @default false
|
|
63
|
+
*/
|
|
64
|
+
useFlexGap: _propTypes.default.bool
|
|
55
65
|
} : void 0;
|
|
56
66
|
var _default = Stack;
|
|
57
67
|
exports.default = _default;
|
package/Stack/StackProps.d.ts
CHANGED
|
@@ -1,42 +1,53 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { OverrideProps } from '@mui/types';
|
|
3
|
-
import { ResponsiveStyleValue, SxProps } from '../styleFunctionSx';
|
|
4
|
-
import { SystemProps } from '../Box';
|
|
5
|
-
import { Theme } from '../createTheme';
|
|
6
|
-
export interface StackBaseProps {
|
|
7
|
-
/**
|
|
8
|
-
* The content of the component.
|
|
9
|
-
*/
|
|
10
|
-
children?: React.ReactNode;
|
|
11
|
-
/**
|
|
12
|
-
* Defines the `flex-direction` style property.
|
|
13
|
-
* It is applied for all screen sizes.
|
|
14
|
-
* @default 'column'
|
|
15
|
-
*/
|
|
16
|
-
direction?: ResponsiveStyleValue<'row' | 'row-reverse' | 'column' | 'column-reverse'>;
|
|
17
|
-
/**
|
|
18
|
-
* Defines the space between immediate children.
|
|
19
|
-
* @default 0
|
|
20
|
-
*/
|
|
21
|
-
spacing?: ResponsiveStyleValue<number | string>;
|
|
22
|
-
/**
|
|
23
|
-
* Add an element between each child.
|
|
24
|
-
*/
|
|
25
|
-
divider?: React.ReactNode;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { OverrideProps } from '@mui/types';
|
|
3
|
+
import { ResponsiveStyleValue, SxProps } from '../styleFunctionSx';
|
|
4
|
+
import { SystemProps } from '../Box';
|
|
5
|
+
import { Theme } from '../createTheme';
|
|
6
|
+
export interface StackBaseProps {
|
|
7
|
+
/**
|
|
8
|
+
* The content of the component.
|
|
9
|
+
*/
|
|
10
|
+
children?: React.ReactNode;
|
|
11
|
+
/**
|
|
12
|
+
* Defines the `flex-direction` style property.
|
|
13
|
+
* It is applied for all screen sizes.
|
|
14
|
+
* @default 'column'
|
|
15
|
+
*/
|
|
16
|
+
direction?: ResponsiveStyleValue<'row' | 'row-reverse' | 'column' | 'column-reverse'>;
|
|
17
|
+
/**
|
|
18
|
+
* Defines the space between immediate children.
|
|
19
|
+
* @default 0
|
|
20
|
+
*/
|
|
21
|
+
spacing?: ResponsiveStyleValue<number | string>;
|
|
22
|
+
/**
|
|
23
|
+
* Add an element between each child.
|
|
24
|
+
*/
|
|
25
|
+
divider?: React.ReactNode;
|
|
26
|
+
/**
|
|
27
|
+
* If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
|
|
28
|
+
*
|
|
29
|
+
* While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack#limitations),
|
|
30
|
+
* it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
|
|
31
|
+
*
|
|
32
|
+
* To enable this flag globally, follow the theme's default props configuration.
|
|
33
|
+
* @default false
|
|
34
|
+
*/
|
|
35
|
+
useFlexGap?: boolean;
|
|
36
|
+
}
|
|
37
|
+
export interface StackTypeMap<P = {}, D extends React.ElementType = 'div'> {
|
|
38
|
+
props: P & StackBaseProps & {
|
|
39
|
+
/**
|
|
40
|
+
* The system prop, which allows defining system overrides as well as additional CSS styles.
|
|
41
|
+
*/
|
|
42
|
+
sx?: SxProps<Theme>;
|
|
43
|
+
} & SystemProps<Theme>;
|
|
44
|
+
defaultComponent: D;
|
|
45
|
+
}
|
|
46
|
+
export type StackProps<D extends React.ElementType = StackTypeMap['defaultComponent'], P = {
|
|
47
|
+
component?: React.ElementType;
|
|
48
|
+
}> = OverrideProps<StackTypeMap<P, D>, D>;
|
|
49
|
+
export interface StackOwnerState {
|
|
50
|
+
direction: StackProps['direction'];
|
|
51
|
+
spacing: StackProps['spacing'];
|
|
52
|
+
useFlexGap: boolean;
|
|
53
|
+
}
|
package/Stack/createStack.d.ts
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { OverridableComponent } from '@mui/types';
|
|
3
|
-
import { StackTypeMap, StackOwnerState } from './StackProps';
|
|
4
|
-
import { Breakpoints } from '../createTheme/createBreakpoints';
|
|
5
|
-
import { Spacing } from '../createTheme/createSpacing';
|
|
6
|
-
interface StyleFunctionProps {
|
|
7
|
-
theme: {
|
|
8
|
-
breakpoints: Breakpoints;
|
|
9
|
-
spacing: Spacing;
|
|
10
|
-
};
|
|
11
|
-
ownerState: StackOwnerState;
|
|
12
|
-
}
|
|
13
|
-
declare const defaultCreateStyledComponent: import("@mui/styled-engine").CreateStyledComponent<import("../createStyled").MUIStyledCommonProps<any>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}, any>;
|
|
14
|
-
declare function useThemePropsDefault<T extends {}>(props: T): T & {};
|
|
15
|
-
export declare const style: ({ ownerState, theme }: StyleFunctionProps) => any;
|
|
16
|
-
export default function createStack(options?: {
|
|
17
|
-
createStyledComponent?: typeof defaultCreateStyledComponent;
|
|
18
|
-
useThemeProps?: typeof useThemePropsDefault;
|
|
19
|
-
componentName?: string;
|
|
20
|
-
}): OverridableComponent<StackTypeMap<{}, "div">>;
|
|
21
|
-
export {};
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { OverridableComponent } from '@mui/types';
|
|
3
|
+
import { StackTypeMap, StackOwnerState } from './StackProps';
|
|
4
|
+
import { Breakpoints } from '../createTheme/createBreakpoints';
|
|
5
|
+
import { Spacing } from '../createTheme/createSpacing';
|
|
6
|
+
interface StyleFunctionProps {
|
|
7
|
+
theme: {
|
|
8
|
+
breakpoints: Breakpoints;
|
|
9
|
+
spacing: Spacing;
|
|
10
|
+
};
|
|
11
|
+
ownerState: StackOwnerState;
|
|
12
|
+
}
|
|
13
|
+
declare const defaultCreateStyledComponent: import("@mui/styled-engine").CreateStyledComponent<import("../createStyled").MUIStyledCommonProps<any>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}, any>;
|
|
14
|
+
declare function useThemePropsDefault<T extends {}>(props: T): T & {};
|
|
15
|
+
export declare const style: ({ ownerState, theme }: StyleFunctionProps) => any;
|
|
16
|
+
export default function createStack(options?: {
|
|
17
|
+
createStyledComponent?: typeof defaultCreateStyledComponent;
|
|
18
|
+
useThemeProps?: typeof useThemePropsDefault;
|
|
19
|
+
componentName?: string;
|
|
20
|
+
}): OverridableComponent<StackTypeMap<{}, "div">>;
|
|
21
|
+
export {};
|
package/Stack/createStack.js
CHANGED
|
@@ -19,7 +19,7 @@ var _createTheme = _interopRequireDefault(require("../createTheme"));
|
|
|
19
19
|
var _breakpoints = require("../breakpoints");
|
|
20
20
|
var _spacing = require("../spacing");
|
|
21
21
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
22
|
-
const _excluded = ["component", "direction", "spacing", "divider", "children", "className"];
|
|
22
|
+
const _excluded = ["component", "direction", "spacing", "divider", "children", "className", "useFlexGap"];
|
|
23
23
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
24
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
25
25
|
const defaultTheme = (0, _createTheme.default)();
|
|
@@ -105,6 +105,11 @@ const style = ({
|
|
|
105
105
|
});
|
|
106
106
|
}
|
|
107
107
|
const styleFromPropValue = (propValue, breakpoint) => {
|
|
108
|
+
if (ownerState.useFlexGap) {
|
|
109
|
+
return {
|
|
110
|
+
gap: (0, _spacing.getValue)(transformer, propValue)
|
|
111
|
+
};
|
|
112
|
+
}
|
|
108
113
|
return {
|
|
109
114
|
'& > :not(style) + :not(style)': {
|
|
110
115
|
margin: 0,
|
|
@@ -143,12 +148,14 @@ function createStack(options = {}) {
|
|
|
143
148
|
spacing = 0,
|
|
144
149
|
divider,
|
|
145
150
|
children,
|
|
146
|
-
className
|
|
151
|
+
className,
|
|
152
|
+
useFlexGap = false
|
|
147
153
|
} = props,
|
|
148
154
|
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
149
155
|
const ownerState = {
|
|
150
156
|
direction,
|
|
151
|
-
spacing
|
|
157
|
+
spacing,
|
|
158
|
+
useFlexGap
|
|
152
159
|
};
|
|
153
160
|
const classes = useUtilityClasses();
|
|
154
161
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(StackRoot, (0, _extends2.default)({
|
package/Stack/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { default } from './Stack';
|
|
2
|
-
export { default as createStack } from './createStack';
|
|
3
|
-
export * from './StackProps';
|
|
4
|
-
export { default as stackClasses } from './stackClasses';
|
|
5
|
-
export * from './stackClasses';
|
|
1
|
+
export { default } from './Stack';
|
|
2
|
+
export { default as createStack } from './createStack';
|
|
3
|
+
export * from './StackProps';
|
|
4
|
+
export { default as stackClasses } from './stackClasses';
|
|
5
|
+
export * from './stackClasses';
|
package/Stack/stackClasses.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export interface StackClasses {
|
|
2
|
-
/** Styles applied to the root element. */
|
|
3
|
-
root: string;
|
|
4
|
-
}
|
|
5
|
-
export type StackClassKey = keyof StackClasses;
|
|
6
|
-
export declare function getStackUtilityClass(slot: string): string;
|
|
7
|
-
declare const stackClasses: StackClasses;
|
|
8
|
-
export default stackClasses;
|
|
1
|
+
export interface StackClasses {
|
|
2
|
+
/** Styles applied to the root element. */
|
|
3
|
+
root: string;
|
|
4
|
+
}
|
|
5
|
+
export type StackClassKey = keyof StackClasses;
|
|
6
|
+
export declare function getStackUtilityClass(slot: string): string;
|
|
7
|
+
declare const stackClasses: StackClasses;
|
|
8
|
+
export default stackClasses;
|
package/Unstable_Grid/Grid.d.ts
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
/**
|
|
2
|
-
*
|
|
3
|
-
* Demos:
|
|
4
|
-
*
|
|
5
|
-
* - [Grid (Material UI)](https://mui.com/material-ui/react-grid/)
|
|
6
|
-
*
|
|
7
|
-
* API:
|
|
8
|
-
*
|
|
9
|
-
* - [Grid API](https://mui.com/system/api/grid/)
|
|
10
|
-
*/
|
|
11
|
-
declare const Grid: import("@mui/types").OverridableComponent<import("./GridProps").GridTypeMap<{}, "div">>;
|
|
12
|
-
export default Grid;
|
|
1
|
+
/**
|
|
2
|
+
*
|
|
3
|
+
* Demos:
|
|
4
|
+
*
|
|
5
|
+
* - [Grid (Material UI)](https://mui.com/material-ui/react-grid/)
|
|
6
|
+
*
|
|
7
|
+
* API:
|
|
8
|
+
*
|
|
9
|
+
* - [Grid API](https://mui.com/system/api/grid/)
|
|
10
|
+
*/
|
|
11
|
+
declare const Grid: import("@mui/types").OverridableComponent<import("./GridProps").GridTypeMap<{}, "div">>;
|
|
12
|
+
export default Grid;
|