@mui/system 5.12.0 → 5.12.1

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.
Files changed (50) hide show
  1. package/CHANGELOG.md +74 -0
  2. package/Container/Container.d.ts +13 -13
  3. package/Container/ContainerProps.d.ts +40 -40
  4. package/Container/containerClasses.d.ts +22 -22
  5. package/Container/createContainer.d.ts +18 -18
  6. package/GlobalStyles/GlobalStyles.d.ts +13 -13
  7. package/GlobalStyles/index.d.ts +2 -2
  8. package/Stack/Stack.d.ts +14 -13
  9. package/Stack/Stack.js +2 -1
  10. package/Stack/StackProps.d.ts +53 -53
  11. package/Stack/createStack.d.ts +21 -21
  12. package/Stack/index.d.ts +5 -5
  13. package/Stack/stackClasses.d.ts +8 -8
  14. package/Unstable_Grid/Grid.d.ts +12 -12
  15. package/Unstable_Grid/GridProps.d.ts +185 -173
  16. package/Unstable_Grid/createGrid.d.ts +11 -11
  17. package/Unstable_Grid/createGrid.js +18 -11
  18. package/Unstable_Grid/gridClasses.d.ts +20 -20
  19. package/Unstable_Grid/gridGenerator.d.ts +38 -38
  20. package/Unstable_Grid/gridGenerator.js +12 -12
  21. package/Unstable_Grid/index.d.ts +5 -5
  22. package/createStyled.js +3 -0
  23. package/createTheme/createSpacing.d.ts +10 -10
  24. package/cssVars/createCssVarsTheme.d.ts +15 -13
  25. package/cssVars/createGetCssVar.d.ts +5 -5
  26. package/cssVars/cssVarsParser.d.ts +64 -64
  27. package/cssVars/getInitColorSchemeScript.d.ts +42 -42
  28. package/cssVars/index.d.ts +5 -5
  29. package/cssVars/prepareCssVars.d.ts +16 -14
  30. package/cssVars/prepareCssVars.js +6 -2
  31. package/cssVars/useCurrentColorScheme.d.ts +53 -53
  32. package/esm/Stack/Stack.js +2 -1
  33. package/esm/Unstable_Grid/createGrid.js +19 -12
  34. package/esm/Unstable_Grid/gridGenerator.js +12 -12
  35. package/esm/createStyled.js +3 -0
  36. package/esm/cssVars/prepareCssVars.js +6 -2
  37. package/index.js +1 -1
  38. package/legacy/Stack/Stack.js +2 -1
  39. package/legacy/Unstable_Grid/createGrid.js +19 -11
  40. package/legacy/Unstable_Grid/gridGenerator.js +12 -12
  41. package/legacy/createStyled.js +3 -0
  42. package/legacy/cssVars/prepareCssVars.js +6 -2
  43. package/legacy/index.js +1 -1
  44. package/modern/Stack/Stack.js +2 -1
  45. package/modern/Unstable_Grid/createGrid.js +18 -12
  46. package/modern/Unstable_Grid/gridGenerator.js +12 -12
  47. package/modern/createStyled.js +3 -0
  48. package/modern/cssVars/prepareCssVars.js +6 -2
  49. package/modern/index.js +1 -1
  50. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,79 @@
1
1
  # [Versions](https://mui.com/versions/)
2
2
 
3
+ ## 5.12.1
4
+
5
+ <!-- generated comparing v5.12.0..master -->
6
+
7
+ _Apr 17, 2023_
8
+
9
+ A big thanks to the 16 contributors who made this release possible. This release was mostly about 🐛 bug fixes and 📚 documentation improvements.
10
+
11
+ ### `@mui/material@5.12.1`
12
+
13
+ - &#8203;<!-- 24 -->[Autocomplete] Fix autocomplete left padding (#36649) @mj12albert
14
+ - &#8203;<!-- 17 -->[Button] Fix contained with inherit prop not adapting on dark mode (#34508) @jesrodri
15
+ - &#8203;<!-- 07 -->[FormControlLabel] Add `required` prop (#34207) @emlai
16
+ - &#8203;<!-- 04 -->[Tabs] Fix null reference in ScrollbarSize after unmounting (#36485) @rkdrnf
17
+ - &#8203;<!-- 03 -->[TextField] Fix type error when using `inputTypeSearch` class for `outlined` and `filled` inputs (#36740) @sai6855
18
+ - &#8203;<!-- 02 -->[ThemeProvider] Fix theme proptypes (#36852) @siriwatknp
19
+
20
+ ### `@mui/system@5.12.1`
21
+
22
+ #### Breaking changes
23
+
24
+ - &#8203;<!-- 06 -->[Grid2] Replace context with `cloneElement` (#36399) @siriwatknp
25
+
26
+ `Grid2` now uses `React.cloneElement` instead of React context for passing the spacing and columns to the next container. The change is close to how CSS flexbox behaves.
27
+
28
+ #### Changes
29
+
30
+ - &#8203;<!-- 14 -->[CssVarsProvider] Always generate new `css` object (#36853) @siriwatknp
31
+
32
+ ### `@mui/base@5.0.0-alpha.126`
33
+
34
+ #### Breaking changes
35
+
36
+ - &#8203;<!-- 23 -->[base] Refactor the compound components building blocks (#36400) @michaldudak
37
+ Components affected by the changes are:
38
+ - Menu
39
+ - `MenuUnstyledContext` is replaced by `MenuProvider`. The value to pass to the provider is returned by the `useMenu` hook.
40
+ - MenuUnstyled's `onClose` prop is replaced by `onOpenChange`. It has the `open` parameter and is called when a menu is opened or closed
41
+ - Select
42
+ - `SelectUnstyledContext` is replaced by `SelectProvider`. The value to pass to the provider is returned by the `useSelect` hook.
43
+ - `SelectUnstyled`'s popup is permanently mounted.
44
+ - The `defaultOpen` prop was added to the SelectUnstyled. The open/close state can now be controlled or uncontrolled, as a `value`.
45
+ - Tabs
46
+ - `TabsContext` is replaced by `TabsProvider`. The value to pass to the provider is returned by the `useTabs` hook.
47
+ - To deselect all tabs, pass in `null` to Tabs' `value` prop, instead of `false`. This is consistent with how Select works.
48
+ - The `value` prop is still technically not mandatory on TabUnstyled and TabPanel, but when omitted, the contents of the selected tab panel will not be rendered during SSR.
49
+
50
+ ### `@mui/joy@5.0.0-alpha.76`
51
+
52
+ - &#8203;<!-- 05 -->[Table][Joy] Replace uses of css selector `*-child` to `*-of-type` (#36839) @keyvanm
53
+
54
+ ### Docs
55
+
56
+ - &#8203;<!-- 25 --> [docs][base] Move styles to the bottom of demos code for `BadgeUnstyled` (#36723) @varunmulay22
57
+ - &#8203;<!-- 22 -->[docs][base] Mention that the hook does not accept any parameters in the `Parameters` section of the API docs (#36773) @ZeeshanTamboli
58
+ - &#8203;<!-- 21 -->[docs][base] Move styles to the bottom of demos code for `ModalUnstyled` (#36580) @gitstart
59
+ - &#8203;<!-- 20 -->[docs][base] Move styles to the bottom of demos code for `Tabs` (#36577) @gitstart
60
+ - &#8203;<!-- 19 -->[docs][base] Move styles to the bottom of demos code for `Popper` (#36578) @gitstart
61
+ - &#8203;<!-- 18 -->[docs][base] Move styles to the bottom of demos code for `TablePagination` (#36593) @gitstart
62
+ - &#8203;<!-- 13 -->[docs] Remove the incorrect info about useButton's ref parameter (#36883) @michaldudak
63
+ - &#8203;<!-- 12 -->[docs] Sync <Stack> between projects (#36785) @oliviertassinari
64
+ - &#8203;<!-- 11 -->[docs] Add guides to overriding component structure in Base UI and Joy UI docs (#34990) @samuelsycamore
65
+ - &#8203;<!-- 10 -->[docs] Content changed from 'row' to 'orientation=horizontal' (#36858) @navedqb
66
+ - &#8203;<!-- 09 -->[docs][Joy] `component`, `slots`, `slotProps` must be visible in Prop table in API docs (#36666) @hbjORbj
67
+ - &#8203;<!-- 08 -->[docs][Select] Fix duplicate ID in small size Select demo (#36792) @sai6855
68
+
69
+ ### Core
70
+
71
+ - &#8203;<!-- 16 -->[core] Use glob to find the test files in parseTest (#36305) @flaviendelangle
72
+ - &#8203;<!-- 15 -->[core] Fix minor SEO issues @oliviertassinari
73
+ - &#8203;<!-- 01 -->[website] Fix visual bug appbar (#36875) @oliviertassinari
74
+
75
+ All contributors of this release in alphabetical order: @emlai, @flaviendelangle, @gitstart, @hbjORbj, @jesrodri, @keyvanm, @michaldudak, @mj12albert, @navedqb, @oliviertassinari, @rkdrnf, @sai6855, @samuelsycamore, @siriwatknp, @varunmulay22, @ZeeshanTamboli
76
+
3
77
  ## 5.12.0
4
78
 
5
79
  <!-- generated comparing v5.11.16..master -->
@@ -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 {};
@@ -1,13 +1,13 @@
1
- /// <reference types="react" />
2
- import { Interpolation } from '@mui/styled-engine';
3
- import { Theme as SystemTheme } from '../createTheme';
4
- export interface GlobalStylesProps<Theme = SystemTheme> {
5
- styles: Interpolation<Theme>;
6
- defaultTheme?: object;
7
- themeId?: string;
8
- }
9
- declare function GlobalStyles<Theme = SystemTheme>({ styles, themeId, defaultTheme, }: GlobalStylesProps<Theme>): JSX.Element;
10
- declare namespace GlobalStyles {
11
- var propTypes: any;
12
- }
13
- export default GlobalStyles;
1
+ /// <reference types="react" />
2
+ import { Interpolation } from '@mui/styled-engine';
3
+ import { Theme as SystemTheme } from '../createTheme';
4
+ export interface GlobalStylesProps<Theme = SystemTheme> {
5
+ styles: Interpolation<Theme>;
6
+ defaultTheme?: object;
7
+ themeId?: string;
8
+ }
9
+ declare function GlobalStyles<Theme = SystemTheme>({ styles, themeId, defaultTheme, }: GlobalStylesProps<Theme>): JSX.Element;
10
+ declare namespace GlobalStyles {
11
+ var propTypes: any;
12
+ }
13
+ export default GlobalStyles;
@@ -1,2 +1,2 @@
1
- export { default } from './GlobalStyles';
2
- export * from './GlobalStyles';
1
+ export { default } from './GlobalStyles';
2
+ export * from './GlobalStyles';
package/Stack/Stack.d.ts CHANGED
@@ -1,13 +1,14 @@
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 (Joy UI)](https://mui.com/joy/react-stack/)
6
+ * - [Stack (Material UI)](https://mui.com/material-ui/react-stack/)
7
+ * - [Stack (MUI System)](https://mui.com/system/react-stack/)
8
+ *
9
+ * API:
10
+ *
11
+ * - [Stack API](https://mui.com/system/api/stack/)
12
+ */
13
+ declare const Stack: import("@mui/types").OverridableComponent<import("./StackProps").StackTypeMap<{}, "div">>;
14
+ export default Stack;
package/Stack/Stack.js CHANGED
@@ -11,6 +11,7 @@ var _createStack = _interopRequireDefault(require("./createStack"));
11
11
  *
12
12
  * Demos:
13
13
  *
14
+ * - [Stack (Joy UI)](https://mui.com/joy/react-stack/)
14
15
  * - [Stack (Material UI)](https://mui.com/material-ui/react-stack/)
15
16
  * - [Stack (MUI System)](https://mui.com/system/react-stack/)
16
17
  *
@@ -55,7 +56,7 @@ process.env.NODE_ENV !== "production" ? Stack.propTypes /* remove-proptypes */ =
55
56
  /**
56
57
  * If `true`, the CSS flexbox `gap` is used instead of applying `margin` to children.
57
58
  *
58
- * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack#limitations),
59
+ * While CSS `gap` removes the [known limitations](https://mui.com/joy-ui/react-stack/#limitations),
59
60
  * it is not fully supported in some browsers. We recommend checking https://caniuse.com/?search=flex%20gap before using this flag.
60
61
  *
61
62
  * To enable this flag globally, follow the theme's default props configuration.
@@ -1,53 +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
- * 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
- }
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
+ }
@@ -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/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';
@@ -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;
@@ -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;