Buckets:
ktongue/docker_container / CAD_kevin /frontend /node_modules /@mui /material /InputBase /InputBase.js
| 'use client'; | |
| import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | |
| import _extends from "@babel/runtime/helpers/esm/extends"; | |
| import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage"; | |
| const _excluded = ["aria-describedby", "autoComplete", "autoFocus", "className", "color", "components", "componentsProps", "defaultValue", "disabled", "disableInjectingGlobalStyles", "endAdornment", "error", "fullWidth", "id", "inputComponent", "inputProps", "inputRef", "margin", "maxRows", "minRows", "multiline", "name", "onBlur", "onChange", "onClick", "onFocus", "onKeyDown", "onKeyUp", "placeholder", "readOnly", "renderSuffix", "rows", "size", "slotProps", "slots", "startAdornment", "type", "value"]; | |
| import * as React from 'react'; | |
| import PropTypes from 'prop-types'; | |
| import clsx from 'clsx'; | |
| import elementTypeAcceptingRef from '@mui/utils/elementTypeAcceptingRef'; | |
| import refType from '@mui/utils/refType'; | |
| import composeClasses from '@mui/utils/composeClasses'; | |
| import isHostComponent from '@mui/utils/isHostComponent'; | |
| import TextareaAutosize from '../TextareaAutosize'; | |
| import formControlState from '../FormControl/formControlState'; | |
| import FormControlContext from '../FormControl/FormControlContext'; | |
| import useFormControl from '../FormControl/useFormControl'; | |
| import styled from '../styles/styled'; | |
| import { useDefaultProps } from '../DefaultPropsProvider'; | |
| import capitalize from '../utils/capitalize'; | |
| import useForkRef from '../utils/useForkRef'; | |
| import useEnhancedEffect from '../utils/useEnhancedEffect'; | |
| import GlobalStyles from '../GlobalStyles'; | |
| import { isFilled } from './utils'; | |
| import inputBaseClasses, { getInputBaseUtilityClass } from './inputBaseClasses'; | |
| import { jsx as _jsx } from "react/jsx-runtime"; | |
| import { jsxs as _jsxs } from "react/jsx-runtime"; | |
| export const rootOverridesResolver = (props, styles) => { | |
| const { | |
| ownerState | |
| } = props; | |
| return [styles.root, ownerState.formControl && styles.formControl, ownerState.startAdornment && styles.adornedStart, ownerState.endAdornment && styles.adornedEnd, ownerState.error && styles.error, ownerState.size === 'small' && styles.sizeSmall, ownerState.multiline && styles.multiline, ownerState.color && styles[`color${capitalize(ownerState.color)}`], ownerState.fullWidth && styles.fullWidth, ownerState.hiddenLabel && styles.hiddenLabel]; | |
| }; | |
| export const inputOverridesResolver = (props, styles) => { | |
| const { | |
| ownerState | |
| } = props; | |
| return [styles.input, ownerState.size === 'small' && styles.inputSizeSmall, ownerState.multiline && styles.inputMultiline, ownerState.type === 'search' && styles.inputTypeSearch, ownerState.startAdornment && styles.inputAdornedStart, ownerState.endAdornment && styles.inputAdornedEnd, ownerState.hiddenLabel && styles.inputHiddenLabel]; | |
| }; | |
| const useUtilityClasses = ownerState => { | |
| const { | |
| classes, | |
| color, | |
| disabled, | |
| error, | |
| endAdornment, | |
| focused, | |
| formControl, | |
| fullWidth, | |
| hiddenLabel, | |
| multiline, | |
| readOnly, | |
| size, | |
| startAdornment, | |
| type | |
| } = ownerState; | |
| const slots = { | |
| root: ['root', `color${capitalize(color)}`, disabled && 'disabled', error && 'error', fullWidth && 'fullWidth', focused && 'focused', formControl && 'formControl', size && size !== 'medium' && `size${capitalize(size)}`, multiline && 'multiline', startAdornment && 'adornedStart', endAdornment && 'adornedEnd', hiddenLabel && 'hiddenLabel', readOnly && 'readOnly'], | |
| input: ['input', disabled && 'disabled', type === 'search' && 'inputTypeSearch', multiline && 'inputMultiline', size === 'small' && 'inputSizeSmall', hiddenLabel && 'inputHiddenLabel', startAdornment && 'inputAdornedStart', endAdornment && 'inputAdornedEnd', readOnly && 'readOnly'] | |
| }; | |
| return composeClasses(slots, getInputBaseUtilityClass, classes); | |
| }; | |
| export const InputBaseRoot = styled('div', { | |
| name: 'MuiInputBase', | |
| slot: 'Root', | |
| overridesResolver: rootOverridesResolver | |
| })(({ | |
| theme, | |
| ownerState | |
| }) => _extends({}, theme.typography.body1, { | |
| color: (theme.vars || theme).palette.text.primary, | |
| lineHeight: '1.4375em', | |
| // 23px | |
| boxSizing: 'border-box', | |
| // Prevent padding issue with fullWidth. | |
| position: 'relative', | |
| cursor: 'text', | |
| display: 'inline-flex', | |
| alignItems: 'center', | |
| [`&.${inputBaseClasses.disabled}`]: { | |
| color: (theme.vars || theme).palette.text.disabled, | |
| cursor: 'default' | |
| } | |
| }, ownerState.multiline && _extends({ | |
| padding: '4px 0 5px' | |
| }, ownerState.size === 'small' && { | |
| paddingTop: 1 | |
| }), ownerState.fullWidth && { | |
| width: '100%' | |
| })); | |
| export const InputBaseComponent = styled('input', { | |
| name: 'MuiInputBase', | |
| slot: 'Input', | |
| overridesResolver: inputOverridesResolver | |
| })(({ | |
| theme, | |
| ownerState | |
| }) => { | |
| const light = theme.palette.mode === 'light'; | |
| const placeholder = _extends({ | |
| color: 'currentColor' | |
| }, theme.vars ? { | |
| opacity: theme.vars.opacity.inputPlaceholder | |
| } : { | |
| opacity: light ? 0.42 : 0.5 | |
| }, { | |
| transition: theme.transitions.create('opacity', { | |
| duration: theme.transitions.duration.shorter | |
| }) | |
| }); | |
| const placeholderHidden = { | |
| opacity: '0 !important' | |
| }; | |
| const placeholderVisible = theme.vars ? { | |
| opacity: theme.vars.opacity.inputPlaceholder | |
| } : { | |
| opacity: light ? 0.42 : 0.5 | |
| }; | |
| return _extends({ | |
| font: 'inherit', | |
| letterSpacing: 'inherit', | |
| color: 'currentColor', | |
| padding: '4px 0 5px', | |
| border: 0, | |
| boxSizing: 'content-box', | |
| background: 'none', | |
| height: '1.4375em', | |
| // Reset 23pxthe native input line-height | |
| margin: 0, | |
| // Reset for Safari | |
| WebkitTapHighlightColor: 'transparent', | |
| display: 'block', | |
| // Make the flex item shrink with Firefox | |
| minWidth: 0, | |
| width: '100%', | |
| // Fix IE11 width issue | |
| animationName: 'mui-auto-fill-cancel', | |
| animationDuration: '10ms', | |
| '&::-webkit-input-placeholder': placeholder, | |
| '&::-moz-placeholder': placeholder, | |
| // Firefox 19+ | |
| '&:-ms-input-placeholder': placeholder, | |
| // IE11 | |
| '&::-ms-input-placeholder': placeholder, | |
| // Edge | |
| '&:focus': { | |
| outline: 0 | |
| }, | |
| // Reset Firefox invalid required input style | |
| '&:invalid': { | |
| boxShadow: 'none' | |
| }, | |
| '&::-webkit-search-decoration': { | |
| // Remove the padding when type=search. | |
| WebkitAppearance: 'none' | |
| }, | |
| // Show and hide the placeholder logic | |
| [`label[data-shrink=false] + .${inputBaseClasses.formControl} &`]: { | |
| '&::-webkit-input-placeholder': placeholderHidden, | |
| '&::-moz-placeholder': placeholderHidden, | |
| // Firefox 19+ | |
| '&:-ms-input-placeholder': placeholderHidden, | |
| // IE11 | |
| '&::-ms-input-placeholder': placeholderHidden, | |
| // Edge | |
| '&:focus::-webkit-input-placeholder': placeholderVisible, | |
| '&:focus::-moz-placeholder': placeholderVisible, | |
| // Firefox 19+ | |
| '&:focus:-ms-input-placeholder': placeholderVisible, | |
| // IE11 | |
| '&:focus::-ms-input-placeholder': placeholderVisible // Edge | |
| }, | |
| [`&.${inputBaseClasses.disabled}`]: { | |
| opacity: 1, | |
| // Reset iOS opacity | |
| WebkitTextFillColor: (theme.vars || theme).palette.text.disabled // Fix opacity Safari bug | |
| }, | |
| '&:-webkit-autofill': { | |
| animationDuration: '5000s', | |
| animationName: 'mui-auto-fill' | |
| } | |
| }, ownerState.size === 'small' && { | |
| paddingTop: 1 | |
| }, ownerState.multiline && { | |
| height: 'auto', | |
| resize: 'none', | |
| padding: 0, | |
| paddingTop: 0 | |
| }, ownerState.type === 'search' && { | |
| // Improve type search style. | |
| MozAppearance: 'textfield' | |
| }); | |
| }); | |
| const inputGlobalStyles = /*#__PURE__*/_jsx(GlobalStyles, { | |
| styles: { | |
| '@keyframes mui-auto-fill': { | |
| from: { | |
| display: 'block' | |
| } | |
| }, | |
| '@keyframes mui-auto-fill-cancel': { | |
| from: { | |
| display: 'block' | |
| } | |
| } | |
| } | |
| }); | |
| /** | |
| * `InputBase` contains as few styles as possible. | |
| * It aims to be a simple building block for creating an input. | |
| * It contains a load of style reset and some state logic. | |
| */ | |
| const InputBase = /*#__PURE__*/React.forwardRef(function InputBase(inProps, ref) { | |
| var _slotProps$input; | |
| const props = useDefaultProps({ | |
| props: inProps, | |
| name: 'MuiInputBase' | |
| }); | |
| const { | |
| 'aria-describedby': ariaDescribedby, | |
| autoComplete, | |
| autoFocus, | |
| className, | |
| components = {}, | |
| componentsProps = {}, | |
| defaultValue, | |
| disabled, | |
| disableInjectingGlobalStyles, | |
| endAdornment, | |
| fullWidth = false, | |
| id, | |
| inputComponent = 'input', | |
| inputProps: inputPropsProp = {}, | |
| inputRef: inputRefProp, | |
| maxRows, | |
| minRows, | |
| multiline = false, | |
| name, | |
| onBlur, | |
| onChange, | |
| onClick, | |
| onFocus, | |
| onKeyDown, | |
| onKeyUp, | |
| placeholder, | |
| readOnly, | |
| renderSuffix, | |
| rows, | |
| slotProps = {}, | |
| slots = {}, | |
| startAdornment, | |
| type = 'text', | |
| value: valueProp | |
| } = props, | |
| other = _objectWithoutPropertiesLoose(props, _excluded); | |
| const value = inputPropsProp.value != null ? inputPropsProp.value : valueProp; | |
| const { | |
| current: isControlled | |
| } = React.useRef(value != null); | |
| const inputRef = React.useRef(); | |
| const handleInputRefWarning = React.useCallback(instance => { | |
| if (process.env.NODE_ENV !== 'production') { | |
| if (instance && instance.nodeName !== 'INPUT' && !instance.focus) { | |
| console.error(['MUI: You have provided a `inputComponent` to the input component', 'that does not correctly handle the `ref` prop.', 'Make sure the `ref` prop is called with a HTMLInputElement.'].join('\n')); | |
| } | |
| } | |
| }, []); | |
| const handleInputRef = useForkRef(inputRef, inputRefProp, inputPropsProp.ref, handleInputRefWarning); | |
| const [focused, setFocused] = React.useState(false); | |
| const muiFormControl = useFormControl(); | |
| if (process.env.NODE_ENV !== 'production') { | |
| // eslint-disable-next-line react-hooks/rules-of-hooks | |
| React.useEffect(() => { | |
| if (muiFormControl) { | |
| return muiFormControl.registerEffect(); | |
| } | |
| return undefined; | |
| }, [muiFormControl]); | |
| } | |
| const fcs = formControlState({ | |
| props, | |
| muiFormControl, | |
| states: ['color', 'disabled', 'error', 'hiddenLabel', 'size', 'required', 'filled'] | |
| }); | |
| fcs.focused = muiFormControl ? muiFormControl.focused : focused; | |
| // The blur won't fire when the disabled state is set on a focused input. | |
| // We need to book keep the focused state manually. | |
| React.useEffect(() => { | |
| if (!muiFormControl && disabled && focused) { | |
| setFocused(false); | |
| if (onBlur) { | |
| onBlur(); | |
| } | |
| } | |
| }, [muiFormControl, disabled, focused, onBlur]); | |
| const onFilled = muiFormControl && muiFormControl.onFilled; | |
| const onEmpty = muiFormControl && muiFormControl.onEmpty; | |
| const checkDirty = React.useCallback(obj => { | |
| if (isFilled(obj)) { | |
| if (onFilled) { | |
| onFilled(); | |
| } | |
| } else if (onEmpty) { | |
| onEmpty(); | |
| } | |
| }, [onFilled, onEmpty]); | |
| useEnhancedEffect(() => { | |
| if (isControlled) { | |
| checkDirty({ | |
| value | |
| }); | |
| } | |
| }, [value, checkDirty, isControlled]); | |
| const handleFocus = event => { | |
| // Fix a bug with IE11 where the focus/blur events are triggered | |
| // while the component is disabled. | |
| if (fcs.disabled) { | |
| event.stopPropagation(); | |
| return; | |
| } | |
| if (onFocus) { | |
| onFocus(event); | |
| } | |
| if (inputPropsProp.onFocus) { | |
| inputPropsProp.onFocus(event); | |
| } | |
| if (muiFormControl && muiFormControl.onFocus) { | |
| muiFormControl.onFocus(event); | |
| } else { | |
| setFocused(true); | |
| } | |
| }; | |
| const handleBlur = event => { | |
| if (onBlur) { | |
| onBlur(event); | |
| } | |
| if (inputPropsProp.onBlur) { | |
| inputPropsProp.onBlur(event); | |
| } | |
| if (muiFormControl && muiFormControl.onBlur) { | |
| muiFormControl.onBlur(event); | |
| } else { | |
| setFocused(false); | |
| } | |
| }; | |
| const handleChange = (event, ...args) => { | |
| if (!isControlled) { | |
| const element = event.target || inputRef.current; | |
| if (element == null) { | |
| throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Expected valid input target. Did you use a custom \`inputComponent\` and forget to forward refs? See https://mui.com/r/input-component-ref-interface for more info.` : _formatMuiErrorMessage(1)); | |
| } | |
| checkDirty({ | |
| value: element.value | |
| }); | |
| } | |
| if (inputPropsProp.onChange) { | |
| inputPropsProp.onChange(event, ...args); | |
| } | |
| // Perform in the willUpdate | |
| if (onChange) { | |
| onChange(event, ...args); | |
| } | |
| }; | |
| // Check the input state on mount, in case it was filled by the user | |
| // or auto filled by the browser before the hydration (for SSR). | |
| React.useEffect(() => { | |
| checkDirty(inputRef.current); | |
| // eslint-disable-next-line react-hooks/exhaustive-deps | |
| }, []); | |
| const handleClick = event => { | |
| if (inputRef.current && event.currentTarget === event.target) { | |
| inputRef.current.focus(); | |
| } | |
| if (onClick) { | |
| onClick(event); | |
| } | |
| }; | |
| let InputComponent = inputComponent; | |
| let inputProps = inputPropsProp; | |
| if (multiline && InputComponent === 'input') { | |
| if (rows) { | |
| if (process.env.NODE_ENV !== 'production') { | |
| if (minRows || maxRows) { | |
| console.warn('MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set.'); | |
| } | |
| } | |
| inputProps = _extends({ | |
| type: undefined, | |
| minRows: rows, | |
| maxRows: rows | |
| }, inputProps); | |
| } else { | |
| inputProps = _extends({ | |
| type: undefined, | |
| maxRows, | |
| minRows | |
| }, inputProps); | |
| } | |
| InputComponent = TextareaAutosize; | |
| } | |
| const handleAutoFill = event => { | |
| // Provide a fake value as Chrome might not let you access it for security reasons. | |
| checkDirty(event.animationName === 'mui-auto-fill-cancel' ? inputRef.current : { | |
| value: 'x' | |
| }); | |
| }; | |
| React.useEffect(() => { | |
| if (muiFormControl) { | |
| muiFormControl.setAdornedStart(Boolean(startAdornment)); | |
| } | |
| }, [muiFormControl, startAdornment]); | |
| const ownerState = _extends({}, props, { | |
| color: fcs.color || 'primary', | |
| disabled: fcs.disabled, | |
| endAdornment, | |
| error: fcs.error, | |
| focused: fcs.focused, | |
| formControl: muiFormControl, | |
| fullWidth, | |
| hiddenLabel: fcs.hiddenLabel, | |
| multiline, | |
| size: fcs.size, | |
| startAdornment, | |
| type | |
| }); | |
| const classes = useUtilityClasses(ownerState); | |
| const Root = slots.root || components.Root || InputBaseRoot; | |
| const rootProps = slotProps.root || componentsProps.root || {}; | |
| const Input = slots.input || components.Input || InputBaseComponent; | |
| inputProps = _extends({}, inputProps, (_slotProps$input = slotProps.input) != null ? _slotProps$input : componentsProps.input); | |
| return /*#__PURE__*/_jsxs(React.Fragment, { | |
| children: [!disableInjectingGlobalStyles && inputGlobalStyles, /*#__PURE__*/_jsxs(Root, _extends({}, rootProps, !isHostComponent(Root) && { | |
| ownerState: _extends({}, ownerState, rootProps.ownerState) | |
| }, { | |
| ref: ref, | |
| onClick: handleClick | |
| }, other, { | |
| className: clsx(classes.root, rootProps.className, className, readOnly && 'MuiInputBase-readOnly'), | |
| children: [startAdornment, /*#__PURE__*/_jsx(FormControlContext.Provider, { | |
| value: null, | |
| children: /*#__PURE__*/_jsx(Input, _extends({ | |
| ownerState: ownerState, | |
| "aria-invalid": fcs.error, | |
| "aria-describedby": ariaDescribedby, | |
| autoComplete: autoComplete, | |
| autoFocus: autoFocus, | |
| defaultValue: defaultValue, | |
| disabled: fcs.disabled, | |
| id: id, | |
| onAnimationStart: handleAutoFill, | |
| name: name, | |
| placeholder: placeholder, | |
| readOnly: readOnly, | |
| required: fcs.required, | |
| rows: rows, | |
| value: value, | |
| onKeyDown: onKeyDown, | |
| onKeyUp: onKeyUp, | |
| type: type | |
| }, inputProps, !isHostComponent(Input) && { | |
| as: InputComponent, | |
| ownerState: _extends({}, ownerState, inputProps.ownerState) | |
| }, { | |
| ref: handleInputRef, | |
| className: clsx(classes.input, inputProps.className, readOnly && 'MuiInputBase-readOnly'), | |
| onBlur: handleBlur, | |
| onChange: handleChange, | |
| onFocus: handleFocus | |
| })) | |
| }), endAdornment, renderSuffix ? renderSuffix(_extends({}, fcs, { | |
| startAdornment | |
| })) : null] | |
| }))] | |
| }); | |
| }); | |
| process.env.NODE_ENV !== "production" ? InputBase.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`. │ | |
| // └─────────────────────────────────────────────────────────────────────┘ | |
| /** | |
| * @ignore | |
| */ | |
| 'aria-describedby': PropTypes.string, | |
| /** | |
| * This prop helps users to fill forms faster, especially on mobile devices. | |
| * The name can be confusing, as it's more like an autofill. | |
| * You can learn more about it [following the specification](https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill). | |
| */ | |
| autoComplete: PropTypes.string, | |
| /** | |
| * If `true`, the `input` element is focused during the first mount. | |
| */ | |
| autoFocus: PropTypes.bool, | |
| /** | |
| * Override or extend the styles applied to the component. | |
| */ | |
| classes: PropTypes.object, | |
| /** | |
| * @ignore | |
| */ | |
| className: PropTypes.string, | |
| /** | |
| * The color of the component. | |
| * It supports both default and custom theme colors, which can be added as shown in the | |
| * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors). | |
| * The prop defaults to the value (`'primary'`) inherited from the parent FormControl component. | |
| */ | |
| color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['primary', 'secondary', 'error', 'info', 'success', 'warning']), PropTypes.string]), | |
| /** | |
| * The components used for each slot inside. | |
| * | |
| * This prop is an alias for the `slots` prop. | |
| * It's recommended to use the `slots` prop instead. | |
| * | |
| * @default {} | |
| */ | |
| components: PropTypes.shape({ | |
| Input: PropTypes.elementType, | |
| Root: 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. | |
| * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future. | |
| * | |
| * @default {} | |
| */ | |
| componentsProps: PropTypes.shape({ | |
| input: PropTypes.object, | |
| root: PropTypes.object | |
| }), | |
| /** | |
| * The default value. Use when the component is not controlled. | |
| */ | |
| defaultValue: PropTypes.any, | |
| /** | |
| * If `true`, the component is disabled. | |
| * The prop defaults to the value (`false`) inherited from the parent FormControl component. | |
| */ | |
| disabled: PropTypes.bool, | |
| /** | |
| * If `true`, GlobalStyles for the auto-fill keyframes will not be injected/removed on mount/unmount. Make sure to inject them at the top of your application. | |
| * This option is intended to help with boosting the initial rendering performance if you are loading a big amount of Input components at once. | |
| * @default false | |
| */ | |
| disableInjectingGlobalStyles: PropTypes.bool, | |
| /** | |
| * End `InputAdornment` for this component. | |
| */ | |
| endAdornment: PropTypes.node, | |
| /** | |
| * If `true`, the `input` will indicate an error. | |
| * The prop defaults to the value (`false`) inherited from the parent FormControl component. | |
| */ | |
| error: PropTypes.bool, | |
| /** | |
| * If `true`, the `input` will take up the full width of its container. | |
| * @default false | |
| */ | |
| fullWidth: PropTypes.bool, | |
| /** | |
| * The id of the `input` element. | |
| */ | |
| id: PropTypes.string, | |
| /** | |
| * The component used for the `input` element. | |
| * Either a string to use a HTML element or a component. | |
| * @default 'input' | |
| */ | |
| inputComponent: elementTypeAcceptingRef, | |
| /** | |
| * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element. | |
| * @default {} | |
| */ | |
| inputProps: PropTypes.object, | |
| /** | |
| * Pass a ref to the `input` element. | |
| */ | |
| inputRef: refType, | |
| /** | |
| * If `dense`, will adjust vertical spacing. This is normally obtained via context from | |
| * FormControl. | |
| * The prop defaults to the value (`'none'`) inherited from the parent FormControl component. | |
| */ | |
| margin: PropTypes.oneOf(['dense', 'none']), | |
| /** | |
| * Maximum number of rows to display when multiline option is set to true. | |
| */ | |
| maxRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | |
| /** | |
| * Minimum number of rows to display when multiline option is set to true. | |
| */ | |
| minRows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | |
| /** | |
| * If `true`, a [TextareaAutosize](/material-ui/react-textarea-autosize/) element is rendered. | |
| * @default false | |
| */ | |
| multiline: PropTypes.bool, | |
| /** | |
| * Name attribute of the `input` element. | |
| */ | |
| name: PropTypes.string, | |
| /** | |
| * Callback fired when the `input` is blurred. | |
| * | |
| * Notice that the first argument (event) might be undefined. | |
| */ | |
| onBlur: PropTypes.func, | |
| /** | |
| * Callback fired when the value is changed. | |
| * | |
| * @param {React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>} event The event source of the callback. | |
| * You can pull out the new value by accessing `event.target.value` (string). | |
| */ | |
| onChange: PropTypes.func, | |
| /** | |
| * @ignore | |
| */ | |
| onClick: PropTypes.func, | |
| /** | |
| * @ignore | |
| */ | |
| onFocus: PropTypes.func, | |
| /** | |
| * Callback fired when the `input` doesn't satisfy its constraints. | |
| */ | |
| onInvalid: PropTypes.func, | |
| /** | |
| * @ignore | |
| */ | |
| onKeyDown: PropTypes.func, | |
| /** | |
| * @ignore | |
| */ | |
| onKeyUp: PropTypes.func, | |
| /** | |
| * The short hint displayed in the `input` before the user enters a value. | |
| */ | |
| placeholder: PropTypes.string, | |
| /** | |
| * It prevents the user from changing the value of the field | |
| * (not from interacting with the field). | |
| */ | |
| readOnly: PropTypes.bool, | |
| /** | |
| * @ignore | |
| */ | |
| renderSuffix: PropTypes.func, | |
| /** | |
| * If `true`, the `input` element is required. | |
| * The prop defaults to the value (`false`) inherited from the parent FormControl component. | |
| */ | |
| required: PropTypes.bool, | |
| /** | |
| * Number of rows to display when multiline option is set to true. | |
| */ | |
| rows: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | |
| /** | |
| * The size of the component. | |
| */ | |
| size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]), | |
| /** | |
| * The extra props for the slot components. | |
| * You can override the existing props or add new ones. | |
| * | |
| * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future. | |
| * | |
| * @default {} | |
| */ | |
| slotProps: PropTypes.shape({ | |
| input: PropTypes.object, | |
| root: PropTypes.object | |
| }), | |
| /** | |
| * The components used for each slot inside. | |
| * | |
| * This prop is an alias for the `components` prop, which will be deprecated in the future. | |
| * | |
| * @default {} | |
| */ | |
| slots: PropTypes.shape({ | |
| input: PropTypes.elementType, | |
| root: PropTypes.elementType | |
| }), | |
| /** | |
| * Start `InputAdornment` for this component. | |
| */ | |
| startAdornment: PropTypes.node, | |
| /** | |
| * 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]), | |
| /** | |
| * Type of the `input` element. It should be [a valid HTML5 input type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Form_%3Cinput%3E_types). | |
| * @default 'text' | |
| */ | |
| type: PropTypes.string, | |
| /** | |
| * The value of the `input` element, required for a controlled component. | |
| */ | |
| value: PropTypes.any | |
| } : void 0; | |
| export default InputBase; |
Xet Storage Details
- Size:
- 24.3 kB
- Xet hash:
- 8652516296f8aa33f33bc2f8fc053ad3509afee90271228146873873f11be4c5
·
Xet efficiently stores files, intelligently splitting them into unique chunks and accelerating uploads and downloads. More info.