Buckets:
| ; | |
| 'use client'; | |
| var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default; | |
| var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default; | |
| Object.defineProperty(exports, "__esModule", { | |
| value: true | |
| }); | |
| exports.default = void 0; | |
| var React = _interopRequireWildcard(require("react")); | |
| var _propTypes = _interopRequireDefault(require("prop-types")); | |
| var _clsx = _interopRequireDefault(require("clsx")); | |
| var _deepmerge = _interopRequireDefault(require("@mui/utils/deepmerge")); | |
| var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses")); | |
| var _getReactElementRef = _interopRequireDefault(require("@mui/utils/getReactElementRef")); | |
| var _SelectInput = _interopRequireDefault(require("./SelectInput")); | |
| var _formControlState = _interopRequireDefault(require("../FormControl/formControlState")); | |
| var _useFormControl = _interopRequireDefault(require("../FormControl/useFormControl")); | |
| var _ArrowDropDown = _interopRequireDefault(require("../internal/svg-icons/ArrowDropDown")); | |
| var _Input = _interopRequireDefault(require("../Input")); | |
| var _NativeSelectInput = _interopRequireDefault(require("../NativeSelect/NativeSelectInput")); | |
| var _FilledInput = _interopRequireDefault(require("../FilledInput")); | |
| var _OutlinedInput = _interopRequireDefault(require("../OutlinedInput")); | |
| var _DefaultPropsProvider = require("../DefaultPropsProvider"); | |
| var _useForkRef = _interopRequireDefault(require("../utils/useForkRef")); | |
| var _zeroStyled = require("../zero-styled"); | |
| var _rootShouldForwardProp = _interopRequireDefault(require("../styles/rootShouldForwardProp")); | |
| var _selectClasses = require("./selectClasses"); | |
| var _jsxRuntime = require("react/jsx-runtime"); | |
| const useUtilityClasses = ownerState => { | |
| const { | |
| classes | |
| } = ownerState; | |
| const slots = { | |
| root: ['root'] | |
| }; | |
| const composedClasses = (0, _composeClasses.default)(slots, _selectClasses.getSelectUtilityClasses, classes); | |
| return { | |
| ...classes, | |
| ...composedClasses | |
| }; | |
| }; | |
| const styledRootConfig = { | |
| name: 'MuiSelect', | |
| slot: 'Root', | |
| shouldForwardProp: prop => (0, _rootShouldForwardProp.default)(prop) && prop !== 'variant' | |
| }; | |
| const StyledInput = (0, _zeroStyled.styled)(_Input.default, styledRootConfig)(''); | |
| const StyledOutlinedInput = (0, _zeroStyled.styled)(_OutlinedInput.default, styledRootConfig)(''); | |
| const StyledFilledInput = (0, _zeroStyled.styled)(_FilledInput.default, styledRootConfig)(''); | |
| const Select = /*#__PURE__*/React.forwardRef(function Select(inProps, ref) { | |
| const props = (0, _DefaultPropsProvider.useDefaultProps)({ | |
| name: 'MuiSelect', | |
| props: inProps | |
| }); | |
| const { | |
| autoWidth = false, | |
| children, | |
| classes: classesProp = {}, | |
| className, | |
| defaultOpen = false, | |
| displayEmpty = false, | |
| IconComponent = _ArrowDropDown.default, | |
| id, | |
| input, | |
| inputProps, | |
| label, | |
| labelId, | |
| MenuProps, | |
| multiple = false, | |
| native = false, | |
| onClose, | |
| onOpen, | |
| open, | |
| renderValue, | |
| SelectDisplayProps, | |
| variant: variantProp = 'outlined', | |
| ...other | |
| } = props; | |
| const inputComponent = native ? _NativeSelectInput.default : _SelectInput.default; | |
| const muiFormControl = (0, _useFormControl.default)(); | |
| const fcs = (0, _formControlState.default)({ | |
| props, | |
| muiFormControl, | |
| states: ['variant', 'error'] | |
| }); | |
| const variant = fcs.variant || variantProp; | |
| const ownerState = { | |
| ...props, | |
| variant, | |
| classes: classesProp | |
| }; | |
| const classes = useUtilityClasses(ownerState); | |
| const { | |
| root, | |
| ...restOfClasses | |
| } = classes; | |
| const InputComponent = input || { | |
| standard: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledInput, { | |
| ownerState: ownerState | |
| }), | |
| outlined: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledOutlinedInput, { | |
| label: label, | |
| ownerState: ownerState | |
| }), | |
| filled: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledFilledInput, { | |
| ownerState: ownerState | |
| }) | |
| }[variant]; | |
| const inputComponentRef = (0, _useForkRef.default)(ref, (0, _getReactElementRef.default)(InputComponent)); | |
| return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, { | |
| children: /*#__PURE__*/React.cloneElement(InputComponent, { | |
| // Most of the logic is implemented in `SelectInput`. | |
| // The `Select` component is a simple API wrapper to expose something better to play with. | |
| inputComponent, | |
| inputProps: { | |
| children, | |
| error: fcs.error, | |
| IconComponent, | |
| variant, | |
| type: undefined, | |
| // We render a select. We can ignore the type provided by the `Input`. | |
| multiple, | |
| ...(native ? { | |
| id | |
| } : { | |
| autoWidth, | |
| defaultOpen, | |
| displayEmpty, | |
| labelId, | |
| MenuProps, | |
| onClose, | |
| onOpen, | |
| open, | |
| renderValue, | |
| SelectDisplayProps: { | |
| id, | |
| ...SelectDisplayProps | |
| } | |
| }), | |
| ...inputProps, | |
| classes: inputProps ? (0, _deepmerge.default)(restOfClasses, inputProps.classes) : restOfClasses, | |
| ...(input ? input.props.inputProps : {}) | |
| }, | |
| ...((multiple && native || displayEmpty) && variant === 'outlined' ? { | |
| notched: true | |
| } : {}), | |
| ref: inputComponentRef, | |
| className: (0, _clsx.default)(InputComponent.props.className, className, classes.root), | |
| // If a custom input is provided via 'input' prop, do not allow 'variant' to be propagated to it's root element. See https://github.com/mui/material-ui/issues/33894. | |
| ...(!input && { | |
| variant | |
| }), | |
| ...other | |
| }) | |
| }); | |
| }); | |
| process.env.NODE_ENV !== "production" ? Select.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`. │ | |
| // └─────────────────────────────────────────────────────────────────────┘ | |
| /** | |
| * 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. | |
| * @default false | |
| */ | |
| autoWidth: _propTypes.default.bool, | |
| /** | |
| * The option elements to populate the select with. | |
| * Can be some `MenuItem` when `native` is false and `option` when `native` is true. | |
| * | |
| * ⚠️The `MenuItem` elements **must** be direct descendants when `native` is false. | |
| */ | |
| children: _propTypes.default.node, | |
| /** | |
| * Override or extend the styles applied to the component. | |
| * @default {} | |
| */ | |
| classes: _propTypes.default.object, | |
| /** | |
| * @ignore | |
| */ | |
| className: _propTypes.default.string, | |
| /** | |
| * If `true`, the component is initially open. Use when the component open state is not controlled (i.e. the `open` prop is not defined). | |
| * You can only use it when the `native` prop is `false` (default). | |
| * @default false | |
| */ | |
| defaultOpen: _propTypes.default.bool, | |
| /** | |
| * The default value. Use when the component is not controlled. | |
| */ | |
| defaultValue: _propTypes.default.any, | |
| /** | |
| * If `true`, a value is displayed even if no items are selected. | |
| * | |
| * In order to display a meaningful value, a function can be passed to the `renderValue` prop which | |
| * returns the value to be displayed when no items are selected. | |
| * | |
| * ⚠️ When using this prop, make sure the label doesn't overlap with the empty displayed value. | |
| * The label should either be hidden or forced to a shrunk state. | |
| * @default false | |
| */ | |
| displayEmpty: _propTypes.default.bool, | |
| /** | |
| * The icon that displays the arrow. | |
| * @default ArrowDropDownIcon | |
| */ | |
| IconComponent: _propTypes.default.elementType, | |
| /** | |
| * The `id` of the wrapper element or the `select` element when `native`. | |
| */ | |
| id: _propTypes.default.string, | |
| /** | |
| * An `Input` element; does not have to be a material-ui specific `Input`. | |
| */ | |
| input: _propTypes.default.element, | |
| /** | |
| * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input#attributes) applied to the `input` element. | |
| * When `native` is `true`, the attributes are applied on the `select` element. | |
| */ | |
| inputProps: _propTypes.default.object, | |
| /** | |
| * See [OutlinedInput#label](https://mui.com/material-ui/api/outlined-input/#props) | |
| */ | |
| label: _propTypes.default.node, | |
| /** | |
| * 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, | |
| /** | |
| * Props applied to the [`Menu`](https://mui.com/material-ui/api/menu/) element. | |
| */ | |
| MenuProps: _propTypes.default.object, | |
| /** | |
| * If `true`, `value` must be an array and the menu will support multiple selections. | |
| * @default false | |
| */ | |
| multiple: _propTypes.default.bool, | |
| /** | |
| * If `true`, the component uses a native `select` element. | |
| * @default false | |
| */ | |
| native: _propTypes.default.bool, | |
| /** | |
| * Callback fired when a menu item is selected. | |
| * | |
| * @param {SelectChangeEvent<Value>} event The event source of the callback. | |
| * You can pull out the new value by accessing `event.target.value` (any). | |
| * **Warning**: This is a generic event, not a change event, unless the change event is caused by browser autofill. | |
| * @param {object} [child] The react element that was selected when `native` is `false` (default). | |
| */ | |
| onChange: _propTypes.default.func, | |
| /** | |
| * Callback fired when the component requests to be closed. | |
| * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select collapses). | |
| * | |
| * @param {object} event The event source of the callback. | |
| */ | |
| onClose: _propTypes.default.func, | |
| /** | |
| * Callback fired when the component requests to be opened. | |
| * Use it in either controlled (see the `open` prop), or uncontrolled mode (to detect when the Select expands). | |
| * | |
| * @param {object} event The event source of the callback. | |
| */ | |
| onOpen: _propTypes.default.func, | |
| /** | |
| * If `true`, the component is shown. | |
| * You can only use it when the `native` prop is `false` (default). | |
| */ | |
| open: _propTypes.default.bool, | |
| /** | |
| * Render the selected value. | |
| * You can only use it when the `native` prop is `false` (default). | |
| * | |
| * @param {any} value The `value` provided to the component. | |
| * @returns {ReactNode} | |
| */ | |
| renderValue: _propTypes.default.func, | |
| /** | |
| * Props applied to the clickable div element. | |
| */ | |
| SelectDisplayProps: _propTypes.default.object, | |
| /** | |
| * The system prop that allows defining system overrides as well as additional CSS styles. | |
| */ | |
| sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]), | |
| /** | |
| * The `input` value. Providing an empty string will select no options. | |
| * Set to an empty string `''` if you don't want any of the available options to be selected. | |
| * | |
| * If the value is an object it must have reference equality with the option in order to be selected. | |
| * If the value is not an object, the string representation must match with the string representation of the option in order to be selected. | |
| */ | |
| value: _propTypes.default.oneOfType([_propTypes.default.oneOf(['']), _propTypes.default.any]), | |
| /** | |
| * The variant to use. | |
| * @default 'outlined' | |
| */ | |
| variant: _propTypes.default.oneOf(['filled', 'outlined', 'standard']) | |
| } : void 0; | |
| Select.muiName = 'Select'; | |
| var _default = exports.default = Select; |
Xet Storage Details
- Size:
- 12 kB
- Xet hash:
- 1e1219953ab1d3d60e6dde945590464111f2f7ec0e426d8ccf38efd30f56a758
·
Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.