@mui/system 7.0.1 → 7.1.0

package/modern/Container/containerClasses.js

@@ -1,7 +0,0 @@
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-export function getContainerUtilityClass(slot) {
-  return generateUtilityClass('MuiContainer', slot);
-}
-const containerClasses = generateUtilityClasses('MuiContainer', ['root', 'disableGutters', 'fixed', 'maxWidthXs', 'maxWidthSm', 'maxWidthMd', 'maxWidthLg', 'maxWidthXl']);
-export default containerClasses;

package/modern/Container/createContainer.d.ts

@@ -1,18 +0,0 @@
-import * as React from 'react';
-import { Interpolation, MUIStyledComponent as StyledComponent } from '@mui/styled-engine';
-import { OverridableComponent } from '@mui/types';
-import { ContainerProps, ContainerTypeMap } from "./ContainerProps.js";
-import { Theme as DefaultTheme } from "../createTheme/index.js";
-interface StyleFnProps<Theme> extends ContainerProps {
-  theme: Theme;
-  ownerState: ContainerProps;
-}
-type RequiredThemeStructure = Pick<DefaultTheme, 'breakpoints' | 'spacing'>;
-export default function createContainer<Theme extends RequiredThemeStructure = DefaultTheme>(options?: {
-  createStyledComponent?: (...styles: Array<Interpolation<StyleFnProps<Theme>>>) => StyledComponent<ContainerProps>;
-  useThemeProps?: (inProps: ContainerProps) => ContainerProps & {
-    component?: React.ElementType;
-  };
-  componentName?: string;
-}): OverridableComponent<ContainerTypeMap<{}, "div">>;
-export {};

package/modern/Container/createContainer.js

@@ -1,149 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-import composeClasses from '@mui/utils/composeClasses';
-import capitalize from '@mui/utils/capitalize';
-import useThemePropsSystem from "../useThemeProps/index.js";
-import systemStyled from "../styled/index.js";
-import createTheme from "../createTheme/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const defaultTheme = createTheme();
-const defaultCreateStyledComponent = systemStyled('div', {
-  name: 'MuiContainer',
-  slot: 'Root',
-  overridesResolver: (props, styles) => {
-    const {
-      ownerState
-    } = props;
-    return [styles.root, styles[`maxWidth${capitalize(String(ownerState.maxWidth))}`], ownerState.fixed && styles.fixed, ownerState.disableGutters && styles.disableGutters];
-  }
-});
-const useThemePropsDefault = inProps => useThemePropsSystem({
-  props: inProps,
-  name: 'MuiContainer',
-  defaultTheme
-});
-const useUtilityClasses = (ownerState, componentName) => {
-  const getContainerUtilityClass = slot => {
-    return generateUtilityClass(componentName, slot);
-  };
-  const {
-    classes,
-    fixed,
-    disableGutters,
-    maxWidth
-  } = ownerState;
-  const slots = {
-    root: ['root', maxWidth && `maxWidth${capitalize(String(maxWidth))}`, fixed && 'fixed', disableGutters && 'disableGutters']
-  };
-  return composeClasses(slots, getContainerUtilityClass, classes);
-};
-export default function createContainer(options = {}) {
-  const {
-    // This will allow adding custom styled fn (for example for custom sx style function)
-    createStyledComponent = defaultCreateStyledComponent,
-    useThemeProps = useThemePropsDefault,
-    componentName = 'MuiContainer'
-  } = options;
-  const ContainerRoot = createStyledComponent(({
-    theme,
-    ownerState
-  }) => ({
-    width: '100%',
-    marginLeft: 'auto',
-    boxSizing: 'border-box',
-    marginRight: 'auto',
-    ...(!ownerState.disableGutters && {
-      paddingLeft: theme.spacing(2),
-      paddingRight: theme.spacing(2),
-      // @ts-ignore module augmentation fails if custom breakpoints are used
-      [theme.breakpoints.up('sm')]: {
-        paddingLeft: theme.spacing(3),
-        paddingRight: theme.spacing(3)
-      }
-    })
-  }), ({
-    theme,
-    ownerState
-  }) => ownerState.fixed && Object.keys(theme.breakpoints.values).reduce((acc, breakpointValueKey) => {
-    const breakpoint = breakpointValueKey;
-    const value = theme.breakpoints.values[breakpoint];
-    if (value !== 0) {
-      // @ts-ignore
-      acc[theme.breakpoints.up(breakpoint)] = {
-        maxWidth: `${value}${theme.breakpoints.unit}`
-      };
-    }
-    return acc;
-  }, {}), ({
-    theme,
-    ownerState
-  }) => ({
-    // @ts-ignore module augmentation fails if custom breakpoints are used
-    ...(ownerState.maxWidth === 'xs' && {
-      // @ts-ignore module augmentation fails if custom breakpoints are used
-      [theme.breakpoints.up('xs')]: {
-        // @ts-ignore module augmentation fails if custom breakpoints are used
-        maxWidth: Math.max(theme.breakpoints.values.xs, 444)
-      }
-    }),
-    ...(ownerState.maxWidth &&
-    // @ts-ignore module augmentation fails if custom breakpoints are used
-    ownerState.maxWidth !== 'xs' && {
-      // @ts-ignore module augmentation fails if custom breakpoints are used
-      [theme.breakpoints.up(ownerState.maxWidth)]: {
-        // @ts-ignore module augmentation fails if custom breakpoints are used
-        maxWidth: `${theme.breakpoints.values[ownerState.maxWidth]}${theme.breakpoints.unit}`
-      }
-    })
-  }));
-  const Container = /*#__PURE__*/React.forwardRef(function Container(inProps, ref) {
-    const props = useThemeProps(inProps);
-    const {
-      className,
-      component = 'div',
-      disableGutters = false,
-      fixed = false,
-      maxWidth = 'lg',
-      classes: classesProp,
-      ...other
-    } = props;
-    const ownerState = {
-      ...props,
-      component,
-      disableGutters,
-      fixed,
-      maxWidth
-    };
-
-    // @ts-ignore module augmentation fails if custom breakpoints are used
-    const classes = useUtilityClasses(ownerState, componentName);
-    return (
-      /*#__PURE__*/
-      // @ts-ignore theme is injected by the styled util
-      _jsx(ContainerRoot, {
-        as: component
-        // @ts-ignore module augmentation fails if custom breakpoints are used
-        ,
-        ownerState: ownerState,
-        className: clsx(classes.root, className),
-        ref: ref,
-        ...other
-      })
-    );
-  });
-  process.env.NODE_ENV !== "production" ? Container.propTypes /* remove-proptypes */ = {
-    children: PropTypes.node,
-    classes: PropTypes.object,
-    className: PropTypes.string,
-    component: PropTypes.elementType,
-    disableGutters: PropTypes.bool,
-    fixed: PropTypes.bool,
-    maxWidth: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['xs', 'sm', 'md', 'lg', 'xl', false]), PropTypes.string]),
-    sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
-  } : void 0;
-  return Container;
-}

package/modern/Container/index.d.ts

@@ -1,4 +0,0 @@
-export { default } from "./Container.js";
-export * from "./ContainerProps.js";
-export { default as containerClasses } from "./containerClasses.js";
-export * from "./containerClasses.js";

package/modern/Container/index.js

@@ -1,3 +0,0 @@
-export { default } from "./Container.js";
-export { default as containerClasses } from "./containerClasses.js";
-export * from "./containerClasses.js";

package/modern/DefaultPropsProvider/DefaultPropsProvider.d.ts

@@ -1,18 +0,0 @@
-import * as React from 'react';
-declare function DefaultPropsProvider({
-  value,
-  children
-}: React.PropsWithChildren<{
-  value: Record<string, any> | undefined;
-}>): React.JSX.Element;
-declare namespace DefaultPropsProvider {
-  var propTypes: any;
-}
-export declare function useDefaultProps<Props>({
-  props,
-  name
-}: {
-  props: Props;
-  name: string;
-}): Props;
-export default DefaultPropsProvider;

package/modern/DefaultPropsProvider/DefaultPropsProvider.js

@@ -1,64 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import resolveProps from '@mui/utils/resolveProps';
-import { jsx as _jsx } from "react/jsx-runtime";
-const PropsContext = /*#__PURE__*/React.createContext(undefined);
-function DefaultPropsProvider({
-  value,
-  children
-}) {
-  return /*#__PURE__*/_jsx(PropsContext.Provider, {
-    value: value,
-    children: children
-  });
-}
-process.env.NODE_ENV !== "production" ? DefaultPropsProvider.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * @ignore
-   */
-  children: PropTypes.node,
-  /**
-   * @ignore
-   */
-  value: PropTypes.object
-} : void 0;
-function getThemeProps(params) {
-  const {
-    theme,
-    name,
-    props
-  } = params;
-  if (!theme || !theme.components || !theme.components[name]) {
-    return props;
-  }
-  const config = theme.components[name];
-  if (config.defaultProps) {
-    // compatible with v5 signature
-    return resolveProps(config.defaultProps, props);
-  }
-  if (!config.styleOverrides && !config.variants) {
-    // v6 signature, no property 'defaultProps'
-    return resolveProps(config, props);
-  }
-  return props;
-}
-export function useDefaultProps({
-  props,
-  name
-}) {
-  const ctx = React.useContext(PropsContext);
-  return getThemeProps({
-    props,
-    name,
-    theme: {
-      components: ctx
-    }
-  });
-}
-export default DefaultPropsProvider;

package/modern/DefaultPropsProvider/index.d.ts

@@ -1 +0,0 @@
-export { default, useDefaultProps } from "./DefaultPropsProvider.js";

package/modern/DefaultPropsProvider/index.js

@@ -1 +0,0 @@
-export { default, useDefaultProps } from "./DefaultPropsProvider.js";

package/modern/GlobalStyles/GlobalStyles.d.ts

@@ -1,17 +0,0 @@
-import * as React from 'react';
-import { Interpolation } from '@mui/styled-engine';
-import { Theme as SystemTheme } from "../createTheme/index.js";
-export interface GlobalStylesProps<Theme = SystemTheme> {
-  styles: Interpolation<Theme>;
-  defaultTheme?: object;
-  themeId?: string;
-}
-declare function GlobalStyles<Theme = SystemTheme>({
-  styles,
-  themeId,
-  defaultTheme
-}: GlobalStylesProps<Theme>): React.JSX.Element;
-declare namespace GlobalStyles {
-  var propTypes: any;
-}
-export default GlobalStyles;

package/modern/GlobalStyles/GlobalStyles.js

@@ -1,37 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { GlobalStyles as MuiGlobalStyles } from '@mui/styled-engine';
-import useTheme from "../useTheme/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function GlobalStyles({
-  styles,
-  themeId,
-  defaultTheme = {}
-}) {
-  const upperTheme = useTheme(defaultTheme);
-  const globalStyles = typeof styles === 'function' ? styles(themeId ? upperTheme[themeId] || upperTheme : upperTheme) : styles;
-  return /*#__PURE__*/_jsx(MuiGlobalStyles, {
-    styles: globalStyles
-  });
-}
-process.env.NODE_ENV !== "production" ? GlobalStyles.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * @ignore
-   */
-  defaultTheme: PropTypes.object,
-  /**
-   * @ignore
-   */
-  styles: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.array, PropTypes.func, PropTypes.number, PropTypes.object, PropTypes.string, PropTypes.bool]),
-  /**
-   * @ignore
-   */
-  themeId: PropTypes.string
-} : void 0;
-export default GlobalStyles;

package/modern/GlobalStyles/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from "./GlobalStyles.js";
-export * from "./GlobalStyles.js";

package/modern/GlobalStyles/index.js

@@ -1,2 +0,0 @@
-export { default } from "./GlobalStyles.js";
-export * from "./GlobalStyles.js";

package/modern/Grid/Grid.d.ts

@@ -1,13 +0,0 @@
-/**
- *
- * Demos:
- *
- * - [Grid (Joy UI)](https://mui.com/joy-ui/react-grid/)
- * - [Grid (Material UI)](https://mui.com/material-ui/react-grid/)
- *
- * API:
- *
- * - [Grid API](https://mui.com/system/api/grid/)
- */
-declare const Grid: import("@mui/types").OverridableComponent<import("./GridProps.js").GridTypeMap<{}, "div">>;
-export default Grid;

package/modern/Grid/Grid.js

@@ -1,106 +0,0 @@
-'use client';
-
-import PropTypes from 'prop-types';
-import createGrid from "./createGrid.js";
-/**
- *
- * Demos:
- *
- * - [Grid (Joy UI)](https://mui.com/joy-ui/react-grid/)
- * - [Grid (Material UI)](https://mui.com/material-ui/react-grid/)
- *
- * API:
- *
- * - [Grid API](https://mui.com/system/api/grid/)
- */
-const Grid = createGrid();
-process.env.NODE_ENV !== "production" ? Grid.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │ To update them, edit the TypeScript types and run `pnpm proptypes`. │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The content of the component.
-   */
-  children: PropTypes.node,
-  /**
-   * The number of columns.
-   * @default 12
-   */
-  columns: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
-  /**
-   * Defines the horizontal space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
-   */
-  columnSpacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-  /**
-   * If `true`, the component will have the flex *container* behavior.
-   * You should be wrapping *items* with a *container*.
-   * @default false
-   */
-  container: PropTypes.bool,
-  /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
-   * @default 'row'
-   */
-  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]),
-  /**
-   * Defines the offset value for the type `item` components.
-   */
-  offset: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.string, PropTypes.number, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), PropTypes.object]),
-  /**
-   * Defines the vertical space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
-   */
-  rowSpacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-  /**
-   * Defines the size of the the type `item` components.
-   */
-  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]),
-  /**
-   * Defines the space between the type `item` components.
-   * It can only be used on a type `container` component.
-   * @default 0
-   */
-  spacing: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
-  /**
-   * @ignore
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * @internal
-   * The level of the grid starts from `0` and increases when the grid nests
-   * inside another grid. Nesting is defined as a container Grid being a direct
-   * child of a container Grid.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid container> // level 1
-   *     <Grid container> // level 2
-   * ```
-   *
-   * Only consecutive grid is considered nesting. A grid container will start at
-   * `0` if there are non-Grid container element above it.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <div>
-   *     <Grid container> // level 0
-   * ```
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid>
-   *     <Grid container> // level 0
-   * ```
-   */
-  unstable_level: PropTypes.number,
-  /**
-   * Defines the `flex-wrap` style property.
-   * It's applied for all screen sizes.
-   * @default 'wrap'
-   */
-  wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap'])
-} : void 0;
-export default Grid;

package/modern/Grid/GridProps.d.ts

@@ -1,103 +0,0 @@
-import * as React from 'react';
-import { OverrideProps, PartiallyRequired } from '@mui/types';
-import { SxProps } from "../styleFunctionSx/index.js";
-import { Theme, Breakpoint } from "../createTheme/index.js";
-import { SystemProps } from "../Box/index.js";
-type ResponsiveStyleValue<T> = T | Array<T | null> | { [key in Breakpoint]?: T | null };
-export type GridDirection = 'row' | 'row-reverse' | 'column' | 'column-reverse';
-export type GridSpacing = number | string;
-export type GridWrap = 'nowrap' | 'wrap' | 'wrap-reverse';
-export type GridSize = 'auto' | 'grow' | number | false;
-export type GridOffset = 'auto' | number;
-export interface GridBaseProps {
-  /**
-   * The content of the component.
-   */
-  children?: React.ReactNode;
-  /**
-   * The number of columns.
-   * @default 12
-   */
-  columns?: ResponsiveStyleValue<number>;
-  /**
-   * Defines the horizontal space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
-   */
-  columnSpacing?: ResponsiveStyleValue<GridSpacing>;
-  /**
-   * If `true`, the component will have the flex *container* behavior.
-   * You should be wrapping *items* with a *container*.
-   * @default false
-   */
-  container?: boolean;
-  /**
-   * Defines the `flex-direction` style property.
-   * It is applied for all screen sizes.
-   * @default 'row'
-   */
-  direction?: ResponsiveStyleValue<GridDirection>;
-  /**
-   * Defines the offset value for the type `item` components.
-   */
-  offset?: ResponsiveStyleValue<GridOffset>;
-  /**
-   * @internal
-   * The level of the grid starts from `0` and increases when the grid nests
-   * inside another grid. Nesting is defined as a container Grid being a direct
-   * child of a container Grid.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid container> // level 1
-   *     <Grid container> // level 2
-   * ```
-   *
-   * Only consecutive grid is considered nesting. A grid container will start at
-   * `0` if there are non-Grid container element above it.
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <div>
-   *     <Grid container> // level 0
-   * ```
-   *
-   * ```js
-   * <Grid container> // level 0
-   *   <Grid>
-   *     <Grid container> // level 0
-   * ```
-   */
-  unstable_level?: number;
-  /**
-   * Defines the vertical space between the type `item` components.
-   * It overrides the value of the `spacing` prop.
-   */
-  rowSpacing?: ResponsiveStyleValue<GridSpacing>;
-  /**
-   * Defines the size of the the type `item` components.
-   */
-  size?: ResponsiveStyleValue<GridSize>;
-  /**
-   * Defines the space between the type `item` components.
-   * It can only be used on a type `container` component.
-   * @default 0
-   */
-  spacing?: ResponsiveStyleValue<GridSpacing> | undefined;
-  /**
-   * Defines the `flex-wrap` style property.
-   * It's applied for all screen sizes.
-   * @default 'wrap'
-   */
-  wrap?: GridWrap;
-}
-export type GridOwnerState = PartiallyRequired<GridBaseProps, 'size' | 'offset' | 'unstable_level'>;
-export interface GridTypeMap<AdditionalProps = {}, DefaultComponent extends React.ElementType = 'div'> {
-  props: AdditionalProps & GridBaseProps & {
-    sx?: SxProps<Theme>;
-  } & SystemProps<Theme>;
-  defaultComponent: DefaultComponent;
-}
-export type GridProps<RootComponent extends React.ElementType = GridTypeMap['defaultComponent'], AdditionalProps = {
-  component?: React.ElementType;
-}> = OverrideProps<GridTypeMap<AdditionalProps, RootComponent>, RootComponent>;
-export {};

package/modern/Grid/GridProps.js

@@ -1 +0,0 @@
-export {};

package/modern/Grid/createGrid.d.ts

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import { OverridableComponent } from '@mui/types';
-import useThemeSystem from "../useTheme/index.js";
-import { GridTypeMap } from "./GridProps.js";
-declare const defaultCreateStyledComponent: import("@mui/styled-engine").CreateStyledComponent<import("../createStyled/index.js").MUIStyledCommonProps<any>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>>, {}, any>;
-declare function useThemePropsDefault<T extends {}>(props: T): T;
-export default function createGrid(options?: {
-  createStyledComponent?: typeof defaultCreateStyledComponent;
-  useThemeProps?: typeof useThemePropsDefault;
-  useTheme?: typeof useThemeSystem;
-  componentName?: string;
-}): OverridableComponent<GridTypeMap<{}, "div">>;
-export {};