@mui/material 5.10.16 → 5.11.0

package/Select/SelectInput.js

@@ -1,33 +1,26 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-var _utils = require("@mui/utils");
-var React = _interopRequireWildcard(require("react"));
-var _reactIs = require("react-is");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _clsx = _interopRequireDefault(require("clsx"));
-var _base = require("@mui/base");
-var _ownerDocument = _interopRequireDefault(require("../utils/ownerDocument"));
-var _capitalize = _interopRequireDefault(require("../utils/capitalize"));
-var _Menu = _interopRequireDefault(require("../Menu/Menu"));
-var _NativeSelectInput = require("../NativeSelect/NativeSelectInput");
-var _utils2 = require("../InputBase/utils");
-var _styled = _interopRequireWildcard(require("../styles/styled"));
-var _useForkRef = _interopRequireDefault(require("../utils/useForkRef"));
-var _useControlled = _interopRequireDefault(require("../utils/useControlled"));
-var _selectClasses = _interopRequireWildcard(require("./selectClasses"));
-var _jsxRuntime = require("react/jsx-runtime");
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
 var _span;
 const _excluded = ["aria-describedby", "aria-label", "autoFocus", "autoWidth", "children", "className", "defaultOpen", "defaultValue", "disabled", "displayEmpty", "IconComponent", "inputRef", "labelId", "MenuProps", "multiple", "name", "onBlur", "onChange", "onClose", "onFocus", "onOpen", "open", "readOnly", "renderValue", "SelectDisplayProps", "tabIndex", "type", "value", "variant"];
-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); }
-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; }
-const SelectSelect = (0, _styled.default)('div', {
+import * as React from 'react';
+import { isFragment } from 'react-is';
+import PropTypes from 'prop-types';
+import clsx from 'clsx';
+import { unstable_composeClasses as composeClasses } from '@mui/base';
+import { refType } from '@mui/utils';
+import ownerDocument from '../utils/ownerDocument';
+import capitalize from '../utils/capitalize';
+import Menu from '../Menu/Menu';
+import { nativeSelectSelectStyles, nativeSelectIconStyles } from '../NativeSelect/NativeSelectInput';
+import { isFilled } from '../InputBase/utils';
+import styled, { slotShouldForwardProp } from '../styles/styled';
+import useForkRef from '../utils/useForkRef';
+import useControlled from '../utils/useControlled';
+import selectClasses, { getSelectUtilityClasses } from './selectClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const SelectSelect = styled('div', {
   name: 'MuiSelect',
   slot: 'Select',
   overridesResolver: (props, styles) => {
@@ -37,16 +30,16 @@ const SelectSelect = (0, _styled.default)('div', {
     return [
     // Win specificity over the input base
     {
-      [`&.${_selectClasses.default.select}`]: styles.select
+      [`&.${selectClasses.select}`]: styles.select
     }, {
-      [`&.${_selectClasses.default.select}`]: styles[ownerState.variant]
+      [`&.${selectClasses.select}`]: styles[ownerState.variant]
     }, {
-      [`&.${_selectClasses.default.multiple}`]: styles.multiple
+      [`&.${selectClasses.multiple}`]: styles.multiple
     }];
   }
-})(_NativeSelectInput.nativeSelectSelectStyles, {
+})(nativeSelectSelectStyles, {
   // Win specificity over the input base
-  [`&.${_selectClasses.default.select}`]: {
+  [`&.${selectClasses.select}`]: {
     height: 'auto',
     // Resets for multiple select with chips
     minHeight: '1.4375em',
@@ -56,18 +49,18 @@ const SelectSelect = (0, _styled.default)('div', {
     overflow: 'hidden'
   }
 });
-const SelectIcon = (0, _styled.default)('svg', {
+const SelectIcon = styled('svg', {
   name: 'MuiSelect',
   slot: 'Icon',
   overridesResolver: (props, styles) => {
     const {
       ownerState
     } = props;
-    return [styles.icon, ownerState.variant && styles[`icon${(0, _capitalize.default)(ownerState.variant)}`], ownerState.open && styles.iconOpen];
+    return [styles.icon, ownerState.variant && styles[`icon${capitalize(ownerState.variant)}`], ownerState.open && styles.iconOpen];
   }
-})(_NativeSelectInput.nativeSelectIconStyles);
-const SelectNativeInput = (0, _styled.default)('input', {
-  shouldForwardProp: prop => (0, _styled.slotShouldForwardProp)(prop) && prop !== 'classes',
+})(nativeSelectIconStyles);
+const SelectNativeInput = styled('input', {
+  shouldForwardProp: prop => slotShouldForwardProp(prop) && prop !== 'classes',
   name: 'MuiSelect',
   slot: 'NativeInput',
   overridesResolver: (props, styles) => styles.nativeInput
@@ -101,10 +94,10 @@ const useUtilityClasses = ownerState => {
   } = ownerState;
   const slots = {
     select: ['select', variant, disabled && 'disabled', multiple && 'multiple'],
-    icon: ['icon', `icon${(0, _capitalize.default)(variant)}`, open && 'iconOpen', disabled && 'disabled'],
+    icon: ['icon', `icon${capitalize(variant)}`, open && 'iconOpen', disabled && 'disabled'],
     nativeInput: ['nativeInput']
   };
-  return (0, _base.unstable_composeClasses)(slots, _selectClasses.getSelectUtilityClasses, classes);
+  return composeClasses(slots, getSelectUtilityClasses, classes);
 };
 
 /**
@@ -141,13 +134,13 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       value: valueProp,
       variant = 'standard'
     } = props,
-    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
-  const [value, setValueState] = (0, _useControlled.default)({
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const [value, setValueState] = useControlled({
     controlled: valueProp,
     default: defaultValue,
     name: 'Select'
   });
-  const [openState, setOpenState] = (0, _useControlled.default)({
+  const [openState, setOpenState] = useControlled({
     controlled: openProp,
     default: defaultOpen,
     name: 'Select'
@@ -159,7 +152,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     current: isOpenControlled
   } = React.useRef(openProp != null);
   const [menuMinWidthState, setMenuMinWidthState] = React.useState();
-  const handleRef = (0, _useForkRef.default)(ref, inputRefProp);
+  const handleRef = useForkRef(ref, inputRefProp);
   const handleDisplayRef = React.useCallback(node => {
     displayRef.current = node;
     if (node) {
@@ -193,7 +186,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     if (!labelId) {
       return undefined;
     }
-    const label = (0, _ownerDocument.default)(displayRef.current).getElementById(labelId);
+    const label = ownerDocument(displayRef.current).getElementById(labelId);
     if (label) {
       const handler = () => {
         if (getSelection().isCollapsed) {
@@ -326,7 +319,7 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
   let foundMatch = false;
 
   // No need to display any value if the field is empty.
-  if ((0, _utils2.isFilled)({
+  if (isFilled({
     value
   }) || displayEmpty) {
     if (renderValue) {
@@ -340,14 +333,14 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       return null;
     }
     if (process.env.NODE_ENV !== 'production') {
-      if ((0, _reactIs.isFragment)(child)) {
+      if (isFragment(child)) {
         console.error(["MUI: The Select component doesn't accept a Fragment as a child.", 'Consider providing an array instead.'].join('\n'));
       }
     }
     let selected;
     if (multiple) {
       if (!Array.isArray(value)) {
-        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`value\` prop must be an array when using the \`Select\` component with \`multiple\`.` : (0, _utils.formatMuiErrorMessage)(2));
+        throw new Error(process.env.NODE_ENV !== "production" ? `MUI: The \`value\` prop must be an array when using the \`Select\` component with \`multiple\`.` : _formatMuiErrorMessage(2));
       }
       selected = value.some(v => areEqualValues(v, child.props.value));
       if (selected && computeDisplay) {
@@ -439,14 +432,14 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
     tabIndex = disabled ? null : 0;
   }
   const buttonId = SelectDisplayProps.id || (name ? `mui-component-select-${name}` : undefined);
-  const ownerState = (0, _extends2.default)({}, props, {
+  const ownerState = _extends({}, props, {
     variant,
     value,
     open
   });
   const classes = useUtilityClasses(ownerState);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(SelectSelect, (0, _extends2.default)({
+  return /*#__PURE__*/_jsxs(React.Fragment, {
+    children: [/*#__PURE__*/_jsx(SelectSelect, _extends({
       ref: handleDisplayRef,
       tabIndex: tabIndex,
       role: "button",
@@ -462,16 +455,16 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       onFocus: onFocus
     }, SelectDisplayProps, {
       ownerState: ownerState,
-      className: (0, _clsx.default)(SelectDisplayProps.className, classes.select, className)
+      className: clsx(SelectDisplayProps.className, classes.select, className)
       // The id is required for proper a11y
       ,
       id: buttonId,
       children: isEmpty(display) ? // notranslate needed while Google Translate will not fix zero-width space issue
-      _span || (_span = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      _span || (_span = /*#__PURE__*/_jsx("span", {
         className: "notranslate",
         children: "\u200B"
       })) : display
-    })), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectNativeInput, (0, _extends2.default)({
+    })), /*#__PURE__*/_jsx(SelectNativeInput, _extends({
       value: Array.isArray(value) ? value.join(',') : value,
       name: name,
       ref: inputRef,
@@ -482,11 +475,11 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
       className: classes.nativeInput,
       autoFocus: autoFocus,
       ownerState: ownerState
-    }, other)), /*#__PURE__*/(0, _jsxRuntime.jsx)(SelectIcon, {
+    }, other)), /*#__PURE__*/_jsx(SelectIcon, {
       as: IconComponent,
       className: classes.icon,
       ownerState: ownerState
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Menu.default, (0, _extends2.default)({
+    }), /*#__PURE__*/_jsx(Menu, _extends({
       id: `menu-${name || ''}`,
       anchorEl: displayNode,
       open: open,
@@ -500,13 +493,13 @@ const SelectInput = /*#__PURE__*/React.forwardRef(function SelectInput(props, re
         horizontal: 'center'
       }
     }, MenuProps, {
-      MenuListProps: (0, _extends2.default)({
+      MenuListProps: _extends({
         'aria-labelledby': labelId,
         role: 'listbox',
         disableListWrap: true
       }, MenuProps.MenuListProps),
-      PaperProps: (0, _extends2.default)({}, MenuProps.PaperProps, {
-        style: (0, _extends2.default)({
+      PaperProps: _extends({}, MenuProps.PaperProps, {
+        style: _extends({
           minWidth: menuMinWidth
         }, MenuProps.PaperProps != null ? MenuProps.PaperProps.style : null)
       }),
@@ -518,81 +511,81 @@ process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {
   /**
    * @ignore
    */
-  'aria-describedby': _propTypes.default.string,
+  'aria-describedby': PropTypes.string,
   /**
    * @ignore
    */
-  'aria-label': _propTypes.default.string,
+  'aria-label': PropTypes.string,
   /**
    * @ignore
    */
-  autoFocus: _propTypes.default.bool,
+  autoFocus: PropTypes.bool,
   /**
    * If `true`, the width of the popover will automatically be set according to the items inside the
    * menu, otherwise it will be at least the width of the select input.
    */
-  autoWidth: _propTypes.default.bool,
+  autoWidth: PropTypes.bool,
   /**
    * The option elements to populate the select with.
    * Can be some `<MenuItem>` elements.
    */
-  children: _propTypes.default.node,
+  children: PropTypes.node,
   /**
    * Override or extend the styles applied to the component.
    * See [CSS API](#css) below for more details.
    */
-  classes: _propTypes.default.object,
+  classes: PropTypes.object,
   /**
    * The CSS class name of the select element.
    */
-  className: _propTypes.default.string,
+  className: PropTypes.string,
   /**
    * If `true`, the component is toggled on mount. Use when the component open state is not controlled.
    * You can only use it when the `native` prop is `false` (default).
    */
-  defaultOpen: _propTypes.default.bool,
+  defaultOpen: PropTypes.bool,
   /**
    * The default value. Use when the component is not controlled.
    */
-  defaultValue: _propTypes.default.any,
+  defaultValue: PropTypes.any,
   /**
    * If `true`, the select is disabled.
    */
-  disabled: _propTypes.default.bool,
+  disabled: PropTypes.bool,
   /**
    * If `true`, the selected item is displayed even if its value is empty.
    */
-  displayEmpty: _propTypes.default.bool,
+  displayEmpty: PropTypes.bool,
   /**
    * The icon that displays the arrow.
    */
-  IconComponent: _propTypes.default.elementType.isRequired,
+  IconComponent: PropTypes.elementType.isRequired,
   /**
    * Imperative handle implementing `{ value: T, node: HTMLElement, focus(): void }`
    * Equivalent to `ref`
    */
-  inputRef: _utils.refType,
+  inputRef: refType,
   /**
    * The ID of an element that acts as an additional label. The Select will
    * be labelled by the additional label and the selected value.
    */
-  labelId: _propTypes.default.string,
+  labelId: PropTypes.string,
   /**
    * Props applied to the [`Menu`](/material-ui/api/menu/) element.
    */
-  MenuProps: _propTypes.default.object,
+  MenuProps: PropTypes.object,
   /**
    * If `true`, `value` must be an array and the menu will support multiple selections.
    */
-  multiple: _propTypes.default.bool,
+  multiple: PropTypes.bool,
   /**
    * Name attribute of the `select` or hidden `input` element.
    */
-  name: _propTypes.default.string,
+  name: PropTypes.string,
   /**
    * @ignore
    */
-  onBlur: _propTypes.default.func,
+  onBlur: PropTypes.func,
   /**
    * Callback fired when a menu item is selected.
    *
@@ -600,60 +593,59 @@ process.env.NODE_ENV !== "production" ? SelectInput.propTypes = {
    * You can pull out the new value by accessing `event.target.value` (any).
    * @param {object} [child] The react element that was selected.
    */
-  onChange: _propTypes.default.func,
+  onChange: PropTypes.func,
   /**
    * Callback fired when the component requests to be closed.
    * Use in controlled mode (see open).
    *
    * @param {object} event The event source of the callback.
    */
-  onClose: _propTypes.default.func,
+  onClose: PropTypes.func,
   /**
    * @ignore
    */
-  onFocus: _propTypes.default.func,
+  onFocus: PropTypes.func,
   /**
    * Callback fired when the component requests to be opened.
    * Use in controlled mode (see open).
    *
    * @param {object} event The event source of the callback.
    */
-  onOpen: _propTypes.default.func,
+  onOpen: PropTypes.func,
   /**
    * If `true`, the component is shown.
    */
-  open: _propTypes.default.bool,
+  open: PropTypes.bool,
   /**
    * @ignore
    */
-  readOnly: _propTypes.default.bool,
+  readOnly: PropTypes.bool,
   /**
    * Render the selected value.
    *
    * @param {any} value The `value` provided to the component.
    * @returns {ReactNode}
    */
-  renderValue: _propTypes.default.func,
+  renderValue: PropTypes.func,
   /**
    * Props applied to the clickable div element.
    */
-  SelectDisplayProps: _propTypes.default.object,
+  SelectDisplayProps: PropTypes.object,
   /**
    * @ignore
    */
-  tabIndex: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
+  tabIndex: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
   /**
    * @ignore
    */
-  type: _propTypes.default.any,
+  type: PropTypes.any,
   /**
    * The input value.
    */
-  value: _propTypes.default.any,
+  value: PropTypes.any,
   /**
    * The variant to use.
    */
-  variant: _propTypes.default.oneOf(['standard', 'outlined', 'filled'])
+  variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])
 } : void 0;
-var _default = SelectInput;
-exports.default = _default;
+export default SelectInput;

package/Select/index.js

@@ -1,36 +1,3 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {
-  selectClasses: true
-};
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _Select.default;
-  }
-});
-Object.defineProperty(exports, "selectClasses", {
-  enumerable: true,
-  get: function () {
-    return _selectClasses.default;
-  }
-});
-var _Select = _interopRequireDefault(require("./Select"));
-var _selectClasses = _interopRequireWildcard(require("./selectClasses"));
-Object.keys(_selectClasses).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _selectClasses[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _selectClasses[key];
-    }
-  });
-});
-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); }
-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; }
+export { default } from './Select';
+export { default as selectClasses } from './selectClasses';
+export * from './selectClasses';

package/Select/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "../esm/Select/index.js",
-  "main": "./index.js",
+  "module": "./index.js",
+  "main": "../node/Select/index.js",
   "types": "./index.d.ts"
 }

package/Select/selectClasses.js

@@ -1,16 +1,7 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-exports.getSelectUtilityClasses = getSelectUtilityClasses;
-var _utils = require("@mui/utils");
-var _generateUtilityClass = _interopRequireDefault(require("../generateUtilityClass"));
-function getSelectUtilityClasses(slot) {
-  return (0, _generateUtilityClass.default)('MuiSelect', slot);
+import { unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';
+import generateUtilityClass from '../generateUtilityClass';
+export function getSelectUtilityClasses(slot) {
+  return generateUtilityClass('MuiSelect', slot);
 }
-const selectClasses = (0, _utils.unstable_generateUtilityClasses)('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
-var _default = selectClasses;
-exports.default = _default;
+const selectClasses = generateUtilityClasses('MuiSelect', ['select', 'multiple', 'filled', 'outlined', 'standard', 'disabled', 'focused', 'icon', 'iconOpen', 'iconFilled', 'iconOutlined', 'iconStandard', 'nativeInput']);
+export default selectClasses;