@mui/system 5.11.13 → 5.11.15
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 +123 -3
- 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 -30
- 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 -29
- 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 -28
- package/modern/styleFunctionSx/styleFunctionSx.js +5 -0
- package/package.json +1 -1
- package/styleFunctionSx/defaultSxConfig.js +3 -30
- 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,125 @@
|
|
|
1
1
|
# [Versions](https://mui.com/versions/)
|
|
2
2
|
|
|
3
|
+
## 5.11.15
|
|
4
|
+
|
|
5
|
+
<!-- generated comparing v5.11.14..master -->
|
|
6
|
+
|
|
7
|
+
_Mar 28, 2023_
|
|
8
|
+
|
|
9
|
+
A big thanks to the 10 contributors who made this release possible. We have one big highlight this week ✨:
|
|
10
|
+
|
|
11
|
+
- @siriwatknp made a [Theme Builder](https://mui.com/joy-ui/customization/theme-builder) for Joy UI 🎨 (#35741)
|
|
12
|
+
|
|
13
|
+
### `@mui/material@5.11.15`
|
|
14
|
+
|
|
15
|
+
- [Chip] Fix error when theme value is a CSS variable (#36654) @siriwatknp
|
|
16
|
+
- [Grid2] Support dynamic nested columns (#36401) @siriwatknp
|
|
17
|
+
|
|
18
|
+
### `@mui/system@5.11.15`
|
|
19
|
+
|
|
20
|
+
- [system] Enable regressions tests & fix regressions (#36611) @mnajdova
|
|
21
|
+
- [Stack] Add `useFlexGap` prop (#36404) @siriwatknp
|
|
22
|
+
|
|
23
|
+
### `@mui/base@5.0.0-alpha.122`
|
|
24
|
+
|
|
25
|
+
- [Autocomplete] Update `autoSelect` prop description (#36280) @sai6855
|
|
26
|
+
- [TablePagination][base] Improve `actions` type in `slotProps` (#36458) @sai6855
|
|
27
|
+
- [Base] Add JSDoc comments for classes of Base components (#36586) @hbjORbj
|
|
28
|
+
- [useSlider][base] Add API docs for the hook parameters and return type (#36576) @varunmulay22
|
|
29
|
+
|
|
30
|
+
### `@mui/joy@5.0.0-alpha.73`
|
|
31
|
+
|
|
32
|
+
- [Joy] Miscellaneous fixes (#36628) @siriwatknp
|
|
33
|
+
- [Joy] Add palette customizer (#35741) @siriwatknp
|
|
34
|
+
|
|
35
|
+
### Docs
|
|
36
|
+
|
|
37
|
+
- Revert "[docs] Use `theme.applyDarkStyles` for the rest of the docs" (#36602) @mnajdova
|
|
38
|
+
- [blog] Improvements on v6 announcement blog (#36505) @joserodolfofreitas
|
|
39
|
+
- [docs] Add `Snackbar` coming soon page (#36604) @danilo-leal
|
|
40
|
+
- [docs] Add accordion coming soon page (#36279) @siriwatknp
|
|
41
|
+
- [docs] Fix palette customizer theme augmentation (#36629) @siriwatknp
|
|
42
|
+
- [docs] Finish migration away from https://reactjs.org/ @oliviertassinari
|
|
43
|
+
- [docs] Remove duplicated slot descriptions (#36621) @hbjORbj
|
|
44
|
+
- [docs] Fix broken example link (#36607) @mnajdova
|
|
45
|
+
- [docs] Use `theme.applyDarkStyles` (#36606) @siriwatknp
|
|
46
|
+
- [docs] Improve API for theme default prop (#36490) @oliviertassinari
|
|
47
|
+
- [docs][Table] Refactor `Sorting & Selecting` table demo (#33236) @IFaniry
|
|
48
|
+
|
|
49
|
+
### Core
|
|
50
|
+
|
|
51
|
+
- [core] Use Netlify function for feedback management (#36472) @alexfauquette
|
|
52
|
+
|
|
53
|
+
All contributors of this release in alphabetical order: @alexfauquette, @danilo-leal, @hbjORbj, @IFaniry, @joserodolfofreitas, @mnajdova, @oliviertassinari, @sai6855, @siriwatknp, @varunmulay22
|
|
54
|
+
|
|
55
|
+
## 5.11.14
|
|
56
|
+
|
|
57
|
+
<!-- generated comparing v5.11.13..master -->
|
|
58
|
+
|
|
59
|
+
_Mar 21, 2023_
|
|
60
|
+
|
|
61
|
+
A big thanks to the 15 contributors who made this release possible.
|
|
62
|
+
This release was mostly about 🐛 bug fixes and 📚 documentation improvements.
|
|
63
|
+
|
|
64
|
+
### `@mui/material@5.11.14`
|
|
65
|
+
|
|
66
|
+
- [Breadcrumbs] Add ability to change icon used in `BreadcrumbCollapsed` through slots (#33812) @pratikkarad
|
|
67
|
+
- [Stepper] Add aria-current to active StepButton (#36526) @michalak111
|
|
68
|
+
- [TabScrollButton] Add ability to change left and right icons (#33863) @pratikkarad
|
|
69
|
+
- [ListItemButton] Respect LinkComponent (#34159) @zaverden
|
|
70
|
+
- [l10n] Add Central Kurdish (ku-CKB) locale (#36592) @HediMuhamad
|
|
71
|
+
|
|
72
|
+
### `@mui/system@5.11.14`
|
|
73
|
+
|
|
74
|
+
- [system] Fix sx prop regression for fontWeight values (#36543) @mnajdova
|
|
75
|
+
|
|
76
|
+
### `@mui/base@5.0.0-alpha.121`
|
|
77
|
+
|
|
78
|
+
- [docs][base] Improve the Slots Table in API docs (#36330) @hbjORbj
|
|
79
|
+
|
|
80
|
+
### `@mui/joy@5.0.0-alpha.72`
|
|
81
|
+
|
|
82
|
+
- [Joy] Ensure new CSS variable naming is everywhere (#36460) @hbjORbj
|
|
83
|
+
- [Menu][joy] Classname listbox is missing (#36520) @hbjORbj
|
|
84
|
+
- [Joy] Fix `--List-decorator*` vars (#36595) @siriwatknp
|
|
85
|
+
|
|
86
|
+
### `@mui/lab@5.0.0-alpha.124`
|
|
87
|
+
|
|
88
|
+
- [Masonry] Include Masonry in theme augmentation interface (#36533) @hbjORbj
|
|
89
|
+
|
|
90
|
+
### Docs
|
|
91
|
+
|
|
92
|
+
- [blog] Post blog about Chamonix retreat to the website (#36517) @mikailaread
|
|
93
|
+
- [blog] Fix image layout shift (#36522) @oliviertassinari
|
|
94
|
+
- [docs] Use `theme.applyDarkStyles` for the rest of the docs (#36161) @siriwatknp
|
|
95
|
+
- [docs] Fix 301 and 404 links (#36555) @oliviertassinari
|
|
96
|
+
- [docs] Keep slot code order in API docs (#36499) @oliviertassinari
|
|
97
|
+
- [docs] Missing className on Migrating from JSS example (#36536) @gabrielnafuzi
|
|
98
|
+
- [docs] Fix function name for Joy templates (#36512) @hbjORbj
|
|
99
|
+
- [docs] Add multiline Chip example (#36437) @dav1app
|
|
100
|
+
- [docs] Add a new gold sponsor (#36518) @hbjORbj
|
|
101
|
+
- [docs][joy] Improve the Slots Table in API docs (#36328) @hbjORbj
|
|
102
|
+
- [docs] Fix virtualElement demo for Popper (#36320) @sai6855
|
|
103
|
+
- [docs] Fix typo in API docs (#36388) @RomanHotsiy
|
|
104
|
+
- [docs] Ensure classname displayed under Slots section in API docs exists (#36539) @hbjORbj
|
|
105
|
+
- [docs][joy] Build TS versions for Modal component demos (#36385) @varunmulay22
|
|
106
|
+
- [docs][joy] Build TS versions for Menu component demos (#36383) @varunmulay22
|
|
107
|
+
- [docs][joy] Build TS versions for Switch component demos (#36379) @varunmulay22
|
|
108
|
+
- [docs] Remove `shouldSkipGeneratingVar` usage (#36581) @siriwatknp
|
|
109
|
+
- [docs][material] Update Table's demo to show pointer cursor on clickable rows (#36546) @varunmulay22
|
|
110
|
+
- [website] Designer role changes (#36528) @danilo-leal
|
|
111
|
+
- [website] No association between showcase and MUI @oliviertassinari
|
|
112
|
+
- [website] Open Head of Operations role (#36501) @oliviertassinari
|
|
113
|
+
- [website] Limit sponsors description to two rows @oliviertassinari
|
|
114
|
+
|
|
115
|
+
### Core
|
|
116
|
+
|
|
117
|
+
- [core] Fix CI @oliviertassinari
|
|
118
|
+
- [core] Fix blank line @oliviertassinari
|
|
119
|
+
- [website] Simplify internal ops @oliviertassinari
|
|
120
|
+
|
|
121
|
+
All contributors of this release in alphabetical order: @danilo-leal, @dav1app, @gabrielnafuzi, @hbjORbj, @HediMuhamad, @michalak111, @mikailaread, @mnajdova, @oliviertassinari, @pratikkarad, @RomanHotsiy, @sai6855, @siriwatknp, @varunmulay22, @zaverden
|
|
122
|
+
|
|
3
123
|
## 5.11.13
|
|
4
124
|
|
|
5
125
|
<!-- generated comparing v5.11.12..master -->
|
|
@@ -9076,7 +9196,7 @@ _Nov 4, 2020_
|
|
|
9076
9196
|
A big thanks to the 20 contributors who made this release possible. Here are some highlights ✨:
|
|
9077
9197
|
|
|
9078
9198
|
- ⚛️ Add support for React 17 (#23311) @eps1lon.
|
|
9079
|
-
React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`.
|
|
9199
|
+
React 17 release is unusual because it doesn't add any new developer-facing features. It was released a couple of days ago. You can learn more about it in the [introduction post](https://legacy.reactjs.org/blog/2020/10/20/react-v17.html). Material UI now supports `^16.8.0 || ^17.0.0`.
|
|
9080
9200
|
- 🛠 Introduce a new `@material-ui/unstyled` package (#23270) @mnajdova.
|
|
9081
9201
|
This package will host the unstyled version of the components. In this first iteration, only the Slider is available. You can find it documented under the [same page](https://mui.com/components/slider-styled/#unstyled-slider) as the styled version.
|
|
9082
9202
|
|
|
@@ -10085,7 +10205,7 @@ Here are some highlights ✨:
|
|
|
10085
10205
|
#### Breaking changes
|
|
10086
10206
|
|
|
10087
10207
|
- [Modal] Remove `onRendered` prop from Modal and Portal (#22464) @eps1lon
|
|
10088
|
-
Depending on your use case either use a [callback ref](https://reactjs.org/docs/refs-and-the-dom.html#callback-refs) on the child element or an effect hook in the child component.
|
|
10208
|
+
Depending on your use case either use a [callback ref](https://legacy.reactjs.org/docs/refs-and-the-dom.html#callback-refs) on the child element or an effect hook in the child component.
|
|
10089
10209
|
|
|
10090
10210
|
#### Changes
|
|
10091
10211
|
|
|
@@ -10548,7 +10668,7 @@ Here are some highlights ✨:
|
|
|
10548
10668
|
|
|
10549
10669
|
- [RootRef] Remove component (#21974) @eps1lon
|
|
10550
10670
|
This component was removed. You can get a reference to the underlying DOM node of our components via `ref` prop.
|
|
10551
|
-
The component relied on [`ReactDOM.findDOMNode`](https://reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage).
|
|
10671
|
+
The component relied on [`ReactDOM.findDOMNode`](https://legacy.reactjs.org/docs/react-dom.html#finddomnode) which is [deprecated in `React.StrictMode`](https://legacy.reactjs.org/docs/strict-mode.html#warning-about-deprecated-finddomnode-usage).
|
|
10552
10672
|
|
|
10553
10673
|
```diff
|
|
10554
10674
|
-<RootRef rootRef={ref}>
|
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;
|