1 | import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
2 | import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
3 | import _extends from "@babel/runtime/helpers/esm/extends";
|
4 | import * as React from 'react';
|
5 | import PropTypes from 'prop-types';
|
6 | import clsx from 'clsx';
|
7 | import { refType } from '@mui/utils';
|
8 | import { unstable_composeClasses as composeClasses } from '@mui/base';
|
9 | import capitalize from '../utils/capitalize';
|
10 | import nativeSelectClasses, { getNativeSelectUtilityClasses } from './nativeSelectClasses';
|
11 | import styled, { rootShouldForwardProp } from '../styles/styled';
|
12 | import { jsx as _jsx } from "react/jsx-runtime";
|
13 | import { jsxs as _jsxs } from "react/jsx-runtime";
|
14 |
|
15 | var useUtilityClasses = function useUtilityClasses(ownerState) {
|
16 | var classes = ownerState.classes,
|
17 | variant = ownerState.variant,
|
18 | disabled = ownerState.disabled,
|
19 | multiple = ownerState.multiple,
|
20 | open = ownerState.open;
|
21 | var slots = {
|
22 | select: ['select', variant, disabled && 'disabled', multiple && 'multiple'],
|
23 | icon: ['icon', "icon".concat(capitalize(variant)), open && 'iconOpen', disabled && 'disabled']
|
24 | };
|
25 | return composeClasses(slots, getNativeSelectUtilityClasses, classes);
|
26 | };
|
27 |
|
28 | export var nativeSelectSelectStyles = function nativeSelectSelectStyles(_ref) {
|
29 | var _extends2;
|
30 |
|
31 | var ownerState = _ref.ownerState,
|
32 | theme = _ref.theme;
|
33 | return _extends((_extends2 = {
|
34 | MozAppearance: 'none',
|
35 |
|
36 | WebkitAppearance: 'none',
|
37 |
|
38 |
|
39 |
|
40 | userSelect: 'none',
|
41 | borderRadius: 0,
|
42 |
|
43 | cursor: 'pointer',
|
44 | '&:focus': {
|
45 |
|
46 | backgroundColor: theme.palette.mode === 'light' ? 'rgba(0, 0, 0, 0.05)' : 'rgba(255, 255, 255, 0.05)',
|
47 | borderRadius: 0
|
48 |
|
49 | },
|
50 |
|
51 | '&::-ms-expand': {
|
52 | display: 'none'
|
53 | }
|
54 | }, _defineProperty(_extends2, "&.".concat(nativeSelectClasses.disabled), {
|
55 | cursor: 'default'
|
56 | }), _defineProperty(_extends2, '&[multiple]', {
|
57 | height: 'auto'
|
58 | }), _defineProperty(_extends2, '&:not([multiple]) option, &:not([multiple]) optgroup', {
|
59 | backgroundColor: theme.palette.background.paper
|
60 | }), _defineProperty(_extends2, '&&&', {
|
61 | paddingRight: 24,
|
62 | minWidth: 16
|
63 |
|
64 | }), _extends2), ownerState.variant === 'filled' && {
|
65 | '&&&': {
|
66 | paddingRight: 32
|
67 | }
|
68 | }, ownerState.variant === 'outlined' && {
|
69 | borderRadius: theme.shape.borderRadius,
|
70 | '&:focus': {
|
71 | borderRadius: theme.shape.borderRadius
|
72 |
|
73 | },
|
74 | '&&&': {
|
75 | paddingRight: 32
|
76 | }
|
77 | });
|
78 | };
|
79 | var NativeSelectSelect = styled('select', {
|
80 | name: 'MuiNativeSelect',
|
81 | slot: 'Select',
|
82 | shouldForwardProp: rootShouldForwardProp,
|
83 | overridesResolver: function overridesResolver(props, styles) {
|
84 | var ownerState = props.ownerState;
|
85 | return [styles.select, styles[ownerState.variant], _defineProperty({}, "&.".concat(nativeSelectClasses.multiple), styles.multiple)];
|
86 | }
|
87 | })(nativeSelectSelectStyles);
|
88 | export var nativeSelectIconStyles = function nativeSelectIconStyles(_ref3) {
|
89 | var ownerState = _ref3.ownerState,
|
90 | theme = _ref3.theme;
|
91 | return _extends(_defineProperty({
|
92 |
|
93 |
|
94 | position: 'absolute',
|
95 | right: 0,
|
96 | top: 'calc(50% - .5em)',
|
97 |
|
98 | pointerEvents: 'none',
|
99 |
|
100 | color: theme.palette.action.active
|
101 | }, "&.".concat(nativeSelectClasses.disabled), {
|
102 | color: theme.palette.action.disabled
|
103 | }), ownerState.open && {
|
104 | transform: 'rotate(180deg)'
|
105 | }, ownerState.variant === 'filled' && {
|
106 | right: 7
|
107 | }, ownerState.variant === 'outlined' && {
|
108 | right: 7
|
109 | });
|
110 | };
|
111 | var NativeSelectIcon = styled('svg', {
|
112 | name: 'MuiNativeSelect',
|
113 | slot: 'Icon',
|
114 | overridesResolver: function overridesResolver(props, styles) {
|
115 | var ownerState = props.ownerState;
|
116 | return [styles.icon, ownerState.variant && styles["icon".concat(capitalize(ownerState.variant))], ownerState.open && styles.iconOpen];
|
117 | }
|
118 | })(nativeSelectIconStyles);
|
119 |
|
120 |
|
121 |
|
122 |
|
123 | var NativeSelectInput = React.forwardRef(function NativeSelectInput(props, ref) {
|
124 | var className = props.className,
|
125 | disabled = props.disabled,
|
126 | IconComponent = props.IconComponent,
|
127 | inputRef = props.inputRef,
|
128 | _props$variant = props.variant,
|
129 | variant = _props$variant === void 0 ? 'standard' : _props$variant,
|
130 | other = _objectWithoutProperties(props, ["className", "disabled", "IconComponent", "inputRef", "variant"]);
|
131 |
|
132 | var ownerState = _extends({}, props, {
|
133 | disabled: disabled,
|
134 | variant: variant
|
135 | });
|
136 |
|
137 | var classes = useUtilityClasses(ownerState);
|
138 | return _jsxs(React.Fragment, {
|
139 | children: [_jsx(NativeSelectSelect, _extends({
|
140 | ownerState: ownerState,
|
141 | className: clsx(classes.select, className),
|
142 | disabled: disabled,
|
143 | ref: inputRef || ref
|
144 | }, other)), props.multiple ? null : _jsx(NativeSelectIcon, {
|
145 | as: IconComponent,
|
146 | ownerState: ownerState,
|
147 | className: classes.icon
|
148 | })]
|
149 | });
|
150 | });
|
151 | process.env.NODE_ENV !== "production" ? NativeSelectInput.propTypes = {
|
152 | |
153 |
|
154 |
|
155 |
|
156 | children: PropTypes.node,
|
157 |
|
158 | |
159 |
|
160 |
|
161 |
|
162 | classes: PropTypes.object,
|
163 |
|
164 | |
165 |
|
166 |
|
167 | className: PropTypes.string,
|
168 |
|
169 | |
170 |
|
171 |
|
172 | disabled: PropTypes.bool,
|
173 |
|
174 | |
175 |
|
176 |
|
177 | IconComponent: PropTypes.elementType.isRequired,
|
178 |
|
179 | |
180 |
|
181 |
|
182 |
|
183 | inputRef: refType,
|
184 |
|
185 | |
186 |
|
187 |
|
188 | multiple: PropTypes.bool,
|
189 |
|
190 | |
191 |
|
192 |
|
193 | name: PropTypes.string,
|
194 |
|
195 | |
196 |
|
197 |
|
198 |
|
199 |
|
200 |
|
201 | onChange: PropTypes.func,
|
202 |
|
203 | |
204 |
|
205 |
|
206 | value: PropTypes.any,
|
207 |
|
208 | |
209 |
|
210 |
|
211 | variant: PropTypes.oneOf(['standard', 'outlined', 'filled'])
|
212 | } : void 0;
|
213 | export default NativeSelectInput; |
\ | No newline at end of file |