@mui/material 7.0.0 → 7.0.2

package/modern/Autocomplete/autocompleteClasses.js

@@ -1,7 +0,0 @@
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-export function getAutocompleteUtilityClass(slot) {
-  return generateUtilityClass('MuiAutocomplete', slot);
-}
-const autocompleteClasses = generateUtilityClasses('MuiAutocomplete', ['root', 'expanded', 'fullWidth', 'focused', 'focusVisible', 'tag', 'tagSizeSmall', 'tagSizeMedium', 'hasPopupIcon', 'hasClearIcon', 'inputRoot', 'input', 'inputFocused', 'endAdornment', 'clearIndicator', 'popupIndicator', 'popupIndicatorOpen', 'popper', 'popperDisablePortal', 'paper', 'listbox', 'loading', 'noOptions', 'option', 'groupLabel', 'groupUl']);
-export default autocompleteClasses;

package/modern/Autocomplete/index.js

@@ -1,3 +0,0 @@
-export { default, createFilterOptions } from "./Autocomplete.js";
-export { default as autocompleteClasses } from "./autocompleteClasses.js";
-export * from "./autocompleteClasses.js";

package/modern/Avatar/Avatar.js

@@ -1,299 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import composeClasses from '@mui/utils/composeClasses';
-import { styled } from "../zero-styled/index.js";
-import memoTheme from "../utils/memoTheme.js";
-import { useDefaultProps } from "../DefaultPropsProvider/index.js";
-import Person from "../internal/svg-icons/Person.js";
-import { getAvatarUtilityClass } from "./avatarClasses.js";
-import useSlot from "../utils/useSlot.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-const useUtilityClasses = ownerState => {
-  const {
-    classes,
-    variant,
-    colorDefault
-  } = ownerState;
-  const slots = {
-    root: ['root', variant, colorDefault && 'colorDefault'],
-    img: ['img'],
-    fallback: ['fallback']
-  };
-  return composeClasses(slots, getAvatarUtilityClass, classes);
-};
-const AvatarRoot = styled('div', {
-  name: 'MuiAvatar',
-  slot: 'Root',
-  overridesResolver: (props, styles) => {
-    const {
-      ownerState
-    } = props;
-    return [styles.root, styles[ownerState.variant], ownerState.colorDefault && styles.colorDefault];
-  }
-})(memoTheme(({
-  theme
-}) => ({
-  position: 'relative',
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  flexShrink: 0,
-  width: 40,
-  height: 40,
-  fontFamily: theme.typography.fontFamily,
-  fontSize: theme.typography.pxToRem(20),
-  lineHeight: 1,
-  borderRadius: '50%',
-  overflow: 'hidden',
-  userSelect: 'none',
-  variants: [{
-    props: {
-      variant: 'rounded'
-    },
-    style: {
-      borderRadius: (theme.vars || theme).shape.borderRadius
-    }
-  }, {
-    props: {
-      variant: 'square'
-    },
-    style: {
-      borderRadius: 0
-    }
-  }, {
-    props: {
-      colorDefault: true
-    },
-    style: {
-      color: (theme.vars || theme).palette.background.default,
-      ...(theme.vars ? {
-        backgroundColor: theme.vars.palette.Avatar.defaultBg
-      } : {
-        backgroundColor: theme.palette.grey[400],
-        ...theme.applyStyles('dark', {
-          backgroundColor: theme.palette.grey[600]
-        })
-      })
-    }
-  }]
-})));
-const AvatarImg = styled('img', {
-  name: 'MuiAvatar',
-  slot: 'Img',
-  overridesResolver: (props, styles) => styles.img
-})({
-  width: '100%',
-  height: '100%',
-  textAlign: 'center',
-  // Handle non-square image.
-  objectFit: 'cover',
-  // Hide alt text.
-  color: 'transparent',
-  // Hide the image broken icon, only works on Chrome.
-  textIndent: 10000
-});
-const AvatarFallback = styled(Person, {
-  name: 'MuiAvatar',
-  slot: 'Fallback',
-  overridesResolver: (props, styles) => styles.fallback
-})({
-  width: '75%',
-  height: '75%'
-});
-function useLoaded({
-  crossOrigin,
-  referrerPolicy,
-  src,
-  srcSet
-}) {
-  const [loaded, setLoaded] = React.useState(false);
-  React.useEffect(() => {
-    if (!src && !srcSet) {
-      return undefined;
-    }
-    setLoaded(false);
-    let active = true;
-    const image = new Image();
-    image.onload = () => {
-      if (!active) {
-        return;
-      }
-      setLoaded('loaded');
-    };
-    image.onerror = () => {
-      if (!active) {
-        return;
-      }
-      setLoaded('error');
-    };
-    image.crossOrigin = crossOrigin;
-    image.referrerPolicy = referrerPolicy;
-    image.src = src;
-    if (srcSet) {
-      image.srcset = srcSet;
-    }
-    return () => {
-      active = false;
-    };
-  }, [crossOrigin, referrerPolicy, src, srcSet]);
-  return loaded;
-}
-const Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {
-  const props = useDefaultProps({
-    props: inProps,
-    name: 'MuiAvatar'
-  });
-  const {
-    alt,
-    children: childrenProp,
-    className,
-    component = 'div',
-    slots = {},
-    slotProps = {},
-    imgProps,
-    sizes,
-    src,
-    srcSet,
-    variant = 'circular',
-    ...other
-  } = props;
-  let children = null;
-  const ownerState = {
-    ...props,
-    component,
-    variant
-  };
-
-  // Use a hook instead of onError on the img element to support server-side rendering.
-  const loaded = useLoaded({
-    ...imgProps,
-    ...(typeof slotProps.img === 'function' ? slotProps.img(ownerState) : slotProps.img),
-    src,
-    srcSet
-  });
-  const hasImg = src || srcSet;
-  const hasImgNotFailing = hasImg && loaded !== 'error';
-  ownerState.colorDefault = !hasImgNotFailing;
-  // This issue explains why this is required: https://github.com/mui/material-ui/issues/42184
-  delete ownerState.ownerState;
-  const classes = useUtilityClasses(ownerState);
-  const [ImgSlot, imgSlotProps] = useSlot('img', {
-    className: classes.img,
-    elementType: AvatarImg,
-    externalForwardedProps: {
-      slots,
-      slotProps: {
-        img: {
-          ...imgProps,
-          ...slotProps.img
-        }
-      }
-    },
-    additionalProps: {
-      alt,
-      src,
-      srcSet,
-      sizes
-    },
-    ownerState
-  });
-  if (hasImgNotFailing) {
-    children = /*#__PURE__*/_jsx(ImgSlot, {
-      ...imgSlotProps
-    });
-    // We only render valid children, non valid children are rendered with a fallback
-    // We consider that invalid children are all falsy values, except 0, which is valid.
-  } else if (!!childrenProp || childrenProp === 0) {
-    children = childrenProp;
-  } else if (hasImg && alt) {
-    children = alt[0];
-  } else {
-    children = /*#__PURE__*/_jsx(AvatarFallback, {
-      ownerState: ownerState,
-      className: classes.fallback
-    });
-  }
-  return /*#__PURE__*/_jsx(AvatarRoot, {
-    as: component,
-    className: clsx(classes.root, className),
-    ref: ref,
-    ...other,
-    ownerState: ownerState,
-    children: children
-  });
-});
-process.env.NODE_ENV !== "production" ? Avatar.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * Used in combination with `src` or `srcSet` to
-   * provide an alt attribute for the rendered `img` element.
-   */
-  alt: PropTypes.string,
-  /**
-   * Used to render icon or text elements inside the Avatar if `src` is not set.
-   * This can be an element, or just a string.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: PropTypes.elementType,
-  /**
-   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
-   * It can be used to listen for the loading error event.
-   * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. See [Migrating from deprecated APIs](/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  imgProps: PropTypes.object,
-  /**
-   * The `sizes` attribute for the `img` element.
-   */
-  sizes: PropTypes.string,
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   */
-  slotProps: PropTypes.shape({
-    img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
-  }),
-  /**
-   * The components used for each slot inside.
-   * @default {}
-   */
-  slots: PropTypes.shape({
-    img: PropTypes.elementType
-  }),
-  /**
-   * The `src` attribute for the `img` element.
-   */
-  src: PropTypes.string,
-  /**
-   * The `srcSet` attribute for the `img` element.
-   * Use this attribute for responsive image display.
-   */
-  srcSet: PropTypes.string,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * The shape of the avatar.
-   * @default 'circular'
-   */
-  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rounded', 'square']), PropTypes.string])
-} : void 0;
-export default Avatar;

package/modern/Avatar/avatarClasses.js

@@ -1,7 +0,0 @@
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-export function getAvatarUtilityClass(slot) {
-  return generateUtilityClass('MuiAvatar', slot);
-}
-const avatarClasses = generateUtilityClasses('MuiAvatar', ['root', 'colorDefault', 'circular', 'rounded', 'square', 'img', 'fallback']);
-export default avatarClasses;

package/modern/Avatar/index.js

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

package/modern/AvatarGroup/AvatarGroup.js

@@ -1,223 +0,0 @@
-'use client';
-
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import { isFragment } from 'react-is';
-import clsx from 'clsx';
-import chainPropTypes from '@mui/utils/chainPropTypes';
-import composeClasses from '@mui/utils/composeClasses';
-import { styled } from "../zero-styled/index.js";
-import memoTheme from "../utils/memoTheme.js";
-import { useDefaultProps } from "../DefaultPropsProvider/index.js";
-import Avatar, { avatarClasses } from "../Avatar/index.js";
-import avatarGroupClasses, { getAvatarGroupUtilityClass } from "./avatarGroupClasses.js";
-import useSlot from "../utils/useSlot.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const SPACINGS = {
-  small: -16,
-  medium: -8
-};
-const useUtilityClasses = ownerState => {
-  const {
-    classes
-  } = ownerState;
-  const slots = {
-    root: ['root'],
-    avatar: ['avatar']
-  };
-  return composeClasses(slots, getAvatarGroupUtilityClass, classes);
-};
-const AvatarGroupRoot = styled('div', {
-  name: 'MuiAvatarGroup',
-  slot: 'Root',
-  overridesResolver: (props, styles) => {
-    return [{
-      [`& .${avatarGroupClasses.avatar}`]: styles.avatar
-    }, styles.root];
-  }
-})(memoTheme(({
-  theme
-}) => ({
-  display: 'flex',
-  flexDirection: 'row-reverse',
-  [`& .${avatarClasses.root}`]: {
-    border: `2px solid ${(theme.vars || theme).palette.background.default}`,
-    boxSizing: 'content-box',
-    marginLeft: 'var(--AvatarGroup-spacing, -8px)',
-    '&:last-child': {
-      marginLeft: 0
-    }
-  }
-})));
-const AvatarGroup = /*#__PURE__*/React.forwardRef(function AvatarGroup(inProps, ref) {
-  const props = useDefaultProps({
-    props: inProps,
-    name: 'MuiAvatarGroup'
-  });
-  const {
-    children: childrenProp,
-    className,
-    component = 'div',
-    componentsProps,
-    max = 5,
-    renderSurplus,
-    slotProps = {},
-    slots = {},
-    spacing = 'medium',
-    total,
-    variant = 'circular',
-    ...other
-  } = props;
-  let clampedMax = max < 2 ? 2 : max;
-  const ownerState = {
-    ...props,
-    max,
-    spacing,
-    component,
-    variant
-  };
-  const classes = useUtilityClasses(ownerState);
-  const children = React.Children.toArray(childrenProp).filter(child => {
-    if (process.env.NODE_ENV !== 'production') {
-      if (isFragment(child)) {
-        console.error(["MUI: The AvatarGroup component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
-      }
-    }
-    return /*#__PURE__*/React.isValidElement(child);
-  });
-  const totalAvatars = total || children.length;
-  if (totalAvatars === clampedMax) {
-    clampedMax += 1;
-  }
-  clampedMax = Math.min(totalAvatars + 1, clampedMax);
-  const maxAvatars = Math.min(children.length, clampedMax - 1);
-  const extraAvatars = Math.max(totalAvatars - clampedMax, totalAvatars - maxAvatars, 0);
-  const extraAvatarsElement = renderSurplus ? renderSurplus(extraAvatars) : `+${extraAvatars}`;
-  const marginValue = ownerState.spacing && SPACINGS[ownerState.spacing] !== undefined ? SPACINGS[ownerState.spacing] : -ownerState.spacing || -8;
-  const externalForwardedProps = {
-    slots,
-    slotProps: {
-      surplus: slotProps.additionalAvatar ?? componentsProps?.additionalAvatar,
-      ...componentsProps,
-      ...slotProps
-    }
-  };
-  const [SurplusSlot, surplusProps] = useSlot('surplus', {
-    elementType: Avatar,
-    externalForwardedProps,
-    className: classes.avatar,
-    ownerState,
-    additionalProps: {
-      variant
-    }
-  });
-  return /*#__PURE__*/_jsxs(AvatarGroupRoot, {
-    as: component,
-    ownerState: ownerState,
-    className: clsx(classes.root, className),
-    ref: ref,
-    ...other,
-    style: {
-      '--AvatarGroup-spacing': marginValue ? `${marginValue}px` : undefined,
-      ...other.style
-    },
-    children: [extraAvatars ? /*#__PURE__*/_jsx(SurplusSlot, {
-      ...surplusProps,
-      children: extraAvatarsElement
-    }) : null, children.slice(0, maxAvatars).reverse().map(child => {
-      return /*#__PURE__*/React.cloneElement(child, {
-        className: clsx(child.props.className, classes.avatar),
-        variant: child.props.variant || variant
-      });
-    })]
-  });
-});
-process.env.NODE_ENV !== "production" ? AvatarGroup.propTypes /* remove-proptypes */ = {
-  // ┌────────────────────────────── Warning ──────────────────────────────┐
-  // │ These PropTypes are generated from the TypeScript type definitions. │
-  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
-  // └─────────────────────────────────────────────────────────────────────┘
-  /**
-   * The avatars to stack.
-   */
-  children: PropTypes.node,
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-  /**
-   * @ignore
-   */
-  className: PropTypes.string,
-  /**
-   * The component used for the root node.
-   * Either a string to use a HTML element or a component.
-   */
-  component: PropTypes.elementType,
-  /**
-   * The extra props for the slot components.
-   * You can override the existing props or add new ones.
-   *
-   * This prop is an alias for the `slotProps` prop.
-   *
-   * @deprecated use the `slotProps` prop instead. This prop will be removed in v7. See [Migrating from deprecated APIs](https://mui.com/material-ui/migration/migrating-from-deprecated-apis/) for more details.
-   */
-  componentsProps: PropTypes.shape({
-    additionalAvatar: PropTypes.object
-  }),
-  /**
-   * Max avatars to show before +x.
-   * @default 5
-   */
-  max: chainPropTypes(PropTypes.number, props => {
-    if (props.max < 2) {
-      return new Error(['MUI: The prop `max` should be equal to 2 or above.', 'A value below is clamped to 2.'].join('\n'));
-    }
-    return null;
-  }),
-  /**
-   * custom renderer of extraAvatars
-   * @param {number} surplus number of extra avatars
-   * @returns {React.ReactNode} custom element to display
-   */
-  renderSurplus: PropTypes.func,
-  /**
-   * The props used for each slot inside.
-   * @default {}
-   */
-  slotProps: PropTypes.shape({
-    additionalAvatar: PropTypes.object,
-    surplus: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
-  }),
-  /**
-   * The components used for each slot inside.
-   * @default {}
-   */
-  slots: PropTypes.shape({
-    surplus: PropTypes.elementType
-  }),
-  /**
-   * Spacing between avatars.
-   * @default 'medium'
-   */
-  spacing: PropTypes.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.number]),
-  /**
-   * @ignore
-   */
-  style: PropTypes.object,
-  /**
-   * The system prop that allows defining system overrides as well as additional CSS styles.
-   */
-  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * The total number of avatars. Used for calculating the number of extra avatars.
-   * @default children.length
-   */
-  total: PropTypes.number,
-  /**
-   * The variant to use.
-   * @default 'circular'
-   */
-  variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rounded', 'square']), PropTypes.string])
-} : void 0;
-export default AvatarGroup;

package/modern/AvatarGroup/avatarGroupClasses.js

@@ -1,7 +0,0 @@
-import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
-import generateUtilityClass from '@mui/utils/generateUtilityClass';
-export function getAvatarGroupUtilityClass(slot) {
-  return generateUtilityClass('MuiAvatarGroup', slot);
-}
-const avatarGroupClasses = generateUtilityClasses('MuiAvatarGroup', ['root', 'avatar']);
-export default avatarGroupClasses;

package/modern/AvatarGroup/index.js

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