UNPKG

5.59 kBJavaScriptView Raw
1'use client';
2
3import PropTypes from 'prop-types';
4import { createGrid as createGrid2 } from '@mui/system/Grid';
5import requirePropFactory from "../utils/requirePropFactory.js";
6import { styled } from "../styles/index.js";
7import { useDefaultProps } from "../DefaultPropsProvider/index.js";
8import useTheme from "../styles/useTheme.js";
9/**
10 *
11 * Demos:
12 *
13 * - [Grid version 2](https://mui.com/material-ui/react-grid2/)
14 *
15 * API:
16 *
17 * - [Grid2 API](https://mui.com/material-ui/api/grid-2/)
18 */
19const Grid2 = createGrid2({
20 createStyledComponent: styled('div', {
21 name: 'MuiGrid2',
22 slot: 'Root',
23 overridesResolver: (props, styles) => {
24 const {
25 ownerState
26 } = props;
27 return [styles.root, ownerState.container && styles.container];
28 }
29 }),
30 componentName: 'MuiGrid2',
31 useThemeProps: inProps => useDefaultProps({
32 props: inProps,
33 name: 'MuiGrid2'
34 }),
35 useTheme
36});
37process.env.NODE_ENV !== "production" ? Grid2.propTypes /* remove-proptypes */ = {
38 // ┌────────────────────────────── Warning ──────────────────────────────┐
39 // │ These PropTypes are generated from the TypeScript type definitions. │
40 // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
41 // └─────────────────────────────────────────────────────────────────────┘
42 /**
43 * The content of the component.
44 */
45 children: PropTypes.node,
46 /**
47 * The number of columns.
48 * @default 12
49 */
50 columns: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
51 /**
52 * Defines the horizontal space between the type `item` components.
53 * It overrides the value of the `spacing` prop.
54 */
55 columnSpacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
56 /**
57 * If `true`, the component will have the flex *container* behavior.
58 * You should be wrapping *items* with a *container*.
59 * @default false
60 */
61 container: PropTypes.bool,
62 /**
63 * Defines the `flex-direction` style property.
64 * It is applied for all screen sizes.
65 * @default 'row'
66 */
67 direction: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
68 /**
69 * Defines the offset value for the type `item` components.
70 */
71 offset: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.string, PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.object]),
72 /**
73 * Defines the vertical space between the type `item` components.
74 * It overrides the value of the `spacing` prop.
75 */
76 rowSpacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
77 /**
78 * Defines the size of the the type `item` components.
79 */
80 size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.string, PropTypes.bool, PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.bool, PropTypes.number])), PropTypes.object]),
81 /**
82 * Defines the space between the type `item` components.
83 * It can only be used on a type `container` component.
84 * @default 0
85 */
86 spacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
87 /**
88 * @ignore
89 */
90 sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
91 /**
92 * @internal
93 * The level of the grid starts from `0` and increases when the grid nests
94 * inside another grid. Nesting is defined as a container Grid being a direct
95 * child of a container Grid.
96 *
97 * ```js
98 * <Grid container> // level 0
99 * <Grid container> // level 1
100 * <Grid container> // level 2
101 * ```
102 *
103 * Only consecutive grid is considered nesting. A grid container will start at
104 * `0` if there are non-Grid container element above it.
105 *
106 * ```js
107 * <Grid container> // level 0
108 * <div>
109 * <Grid container> // level 0
110 * ```
111 *
112 * ```js
113 * <Grid container> // level 0
114 * <Grid>
115 * <Grid container> // level 0
116 * ```
117 */
118 unstable_level: PropTypes.number,
119 /**
120 * Defines the `flex-wrap` style property.
121 * It's applied for all screen sizes.
122 * @default 'wrap'
123 */
124 wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap'])
125} : void 0;
126if (process.env.NODE_ENV !== 'production') {
127 const Component = Grid2;
128 const requireProp = requirePropFactory('Grid2', Component);
129 // eslint-disable-next-line no-useless-concat
130 Component['propTypes' + ''] = {
131 // eslint-disable-next-line react/forbid-foreign-prop-types
132 ...Component.propTypes,
133 direction: requireProp('container'),
134 spacing: requireProp('container'),
135 wrap: requireProp('container')
136 };
137}
138export default Grid2;
\No newline at end of file