Spaces:
Sleeping
Sleeping
| import * as React from 'react'; | |
| import { SxProps } from '@mui/system'; | |
| import { OverridableStringUnion } from '@mui/types'; | |
| import { IconButtonProps, InternalStandardProps as StandardProps, Theme } from '@mui/material'; | |
| import { ChipProps, ChipTypeMap } from '@mui/material/Chip'; | |
| import { PaperProps } from '@mui/material/Paper'; | |
| import { PopperProps } from '@mui/material/Popper'; | |
| import useAutocomplete, { | |
| AutocompleteChangeDetails, | |
| AutocompleteChangeReason, | |
| AutocompleteCloseReason, | |
| AutocompleteInputChangeReason, | |
| AutocompleteValue, | |
| createFilterOptions, | |
| UseAutocompleteProps, | |
| AutocompleteFreeSoloValueMapping, | |
| } from '../useAutocomplete'; | |
| import { AutocompleteClasses } from './autocompleteClasses'; | |
| export { | |
| AutocompleteChangeDetails, | |
| AutocompleteChangeReason, | |
| AutocompleteCloseReason, | |
| AutocompleteInputChangeReason, | |
| AutocompleteValue, | |
| createFilterOptions, | |
| }; | |
| export type AutocompleteOwnerState< | |
| Value, | |
| Multiple extends boolean | undefined, | |
| DisableClearable extends boolean | undefined, | |
| FreeSolo extends boolean | undefined, | |
| ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], | |
| > = AutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & { | |
| disablePortal: boolean; | |
| expanded: boolean; | |
| focused: boolean; | |
| fullWidth: boolean; | |
| getOptionLabel: (option: Value | AutocompleteFreeSoloValueMapping<FreeSolo>) => string; | |
| hasClearIcon: boolean; | |
| hasPopupIcon: boolean; | |
| inputFocused: boolean; | |
| popupOpen: boolean; | |
| size: OverridableStringUnion<'small' | 'medium', AutocompletePropsSizeOverrides>; | |
| }; | |
| export type AutocompleteRenderGetTagProps = ({ index }: { index: number }) => { | |
| key: number; | |
| className: string; | |
| disabled: boolean; | |
| 'data-tag-index': number; | |
| tabIndex: -1; | |
| onDelete: (event: any) => void; | |
| }; | |
| export interface AutocompleteRenderOptionState { | |
| inputValue: string; | |
| index: number; | |
| selected: boolean; | |
| } | |
| export interface AutocompleteRenderGroupParams { | |
| key: string; | |
| group: string; | |
| children?: React.ReactNode; | |
| } | |
| export interface AutocompleteRenderInputParams { | |
| id: string; | |
| disabled: boolean; | |
| fullWidth: boolean; | |
| size: 'small' | undefined; | |
| InputLabelProps: ReturnType<ReturnType<typeof useAutocomplete>['getInputLabelProps']>; | |
| InputProps: { | |
| ref: React.Ref<any>; | |
| className: string; | |
| startAdornment: React.ReactNode; | |
| endAdornment: React.ReactNode; | |
| }; | |
| inputProps: ReturnType<ReturnType<typeof useAutocomplete>['getInputProps']>; | |
| } | |
| export interface AutocompletePropsSizeOverrides {} | |
| export interface AutocompleteProps< | |
| Value, | |
| Multiple extends boolean | undefined, | |
| DisableClearable extends boolean | undefined, | |
| FreeSolo extends boolean | undefined, | |
| ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], | |
| > extends UseAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo>, | |
| StandardProps<React.HTMLAttributes<HTMLDivElement>, 'defaultValue' | 'onChange' | 'children'> { | |
| /** | |
| * Props applied to the [`Chip`](/material-ui/api/chip/) element. | |
| */ | |
| ChipProps?: ChipProps<ChipComponent>; | |
| /** | |
| * Override or extend the styles applied to the component. | |
| */ | |
| classes?: Partial<AutocompleteClasses>; | |
| /** | |
| * The icon to display in place of the default clear icon. | |
| * @default <ClearIcon fontSize="small" /> | |
| */ | |
| clearIcon?: React.ReactNode; | |
| /** | |
| * Override the default text for the *clear* icon button. | |
| * | |
| * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). | |
| * @default 'Clear' | |
| */ | |
| clearText?: string; | |
| /** | |
| * Override the default text for the *close popup* icon button. | |
| * | |
| * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). | |
| * @default 'Close' | |
| */ | |
| closeText?: string; | |
| /** | |
| * The props used for each slot inside. | |
| * @default {} | |
| */ | |
| componentsProps?: { | |
| clearIndicator?: Partial<IconButtonProps>; | |
| paper?: PaperProps; | |
| popper?: Partial<PopperProps>; | |
| popupIndicator?: Partial<IconButtonProps>; | |
| }; | |
| /** | |
| * If `true`, the component is disabled. | |
| * @default false | |
| */ | |
| disabled?: boolean; | |
| /** | |
| * If `true`, the `Popper` content will be under the DOM hierarchy of the parent component. | |
| * @default false | |
| */ | |
| disablePortal?: boolean; | |
| /** | |
| * Force the visibility display of the popup icon. | |
| * @default 'auto' | |
| */ | |
| forcePopupIcon?: true | false | 'auto'; | |
| /** | |
| * If `true`, the input will take up the full width of its container. | |
| * @default false | |
| */ | |
| fullWidth?: boolean; | |
| /** | |
| * The label to display when the tags are truncated (`limitTags`). | |
| * | |
| * @param {number} more The number of truncated tags. | |
| * @returns {ReactNode} | |
| * @default (more) => `+${more}` | |
| */ | |
| getLimitTagsText?: (more: number) => React.ReactNode; | |
| /** | |
| * The component used to render the listbox. | |
| * @default 'ul' | |
| */ | |
| ListboxComponent?: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>; | |
| /** | |
| * Props applied to the Listbox element. | |
| */ | |
| ListboxProps?: ReturnType<ReturnType<typeof useAutocomplete>['getListboxProps']> & { | |
| sx?: SxProps<Theme>; | |
| ref?: React.Ref<Element>; | |
| }; | |
| /** | |
| * If `true`, the component is in a loading state. | |
| * This shows the `loadingText` in place of suggestions (only if there are no suggestions to show, for example `options` are empty). | |
| * @default false | |
| */ | |
| loading?: boolean; | |
| /** | |
| * Text to display when in a loading state. | |
| * | |
| * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). | |
| * @default 'Loading…' | |
| */ | |
| loadingText?: React.ReactNode; | |
| /** | |
| * The maximum number of tags that will be visible when not focused. | |
| * Set `-1` to disable the limit. | |
| * @default -1 | |
| */ | |
| limitTags?: number; | |
| /** | |
| * Text to display when there are no options. | |
| * | |
| * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). | |
| * @default 'No options' | |
| */ | |
| noOptionsText?: React.ReactNode; | |
| onKeyDown?: ( | |
| event: React.KeyboardEvent<HTMLDivElement> & { defaultMuiPrevented?: boolean }, | |
| ) => void; | |
| /** | |
| * Override the default text for the *open popup* icon button. | |
| * | |
| * For localization purposes, you can use the provided [translations](/material-ui/guides/localization/). | |
| * @default 'Open' | |
| */ | |
| openText?: string; | |
| /** | |
| * The component used to render the body of the popup. | |
| * @default Paper | |
| */ | |
| PaperComponent?: React.JSXElementConstructor<React.HTMLAttributes<HTMLElement>>; | |
| /** | |
| * The component used to position the popup. | |
| * @default Popper | |
| */ | |
| PopperComponent?: React.JSXElementConstructor<PopperProps>; | |
| /** | |
| * The icon to display in place of the default popup icon. | |
| * @default <ArrowDropDownIcon /> | |
| */ | |
| popupIcon?: React.ReactNode; | |
| /** | |
| * If `true`, the component becomes readonly. It is also supported for multiple tags where the tag cannot be deleted. | |
| * @default false | |
| */ | |
| readOnly?: boolean; | |
| /** | |
| * Render the group. | |
| * | |
| * @param {AutocompleteRenderGroupParams} params The group to render. | |
| * @returns {ReactNode} | |
| */ | |
| renderGroup?: (params: AutocompleteRenderGroupParams) => React.ReactNode; | |
| /** | |
| * Render the input. | |
| * | |
| * @param {object} params | |
| * @returns {ReactNode} | |
| */ | |
| renderInput: (params: AutocompleteRenderInputParams) => React.ReactNode; | |
| /** | |
| * Render the option, use `getOptionLabel` by default. | |
| * | |
| * @param {object} props The props to apply on the li element. | |
| * @param {Value} option The option to render. | |
| * @param {object} state The state of each option. | |
| * @param {object} ownerState The state of the Autocomplete component. | |
| * @returns {ReactNode} | |
| */ | |
| renderOption?: ( | |
| props: React.HTMLAttributes<HTMLLIElement> & { key: any }, | |
| option: Value, | |
| state: AutocompleteRenderOptionState, | |
| ownerState: AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, | |
| ) => React.ReactNode; | |
| /** | |
| * Render the selected value. | |
| * | |
| * @param {Value[]} value The `value` provided to the component. | |
| * @param {function} getTagProps A tag props getter. | |
| * @param {object} ownerState The state of the Autocomplete component. | |
| * @returns {ReactNode} | |
| */ | |
| renderTags?: ( | |
| value: Value[], | |
| getTagProps: AutocompleteRenderGetTagProps, | |
| ownerState: AutocompleteOwnerState<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, | |
| ) => React.ReactNode; | |
| /** | |
| * The size of the component. | |
| * @default 'medium' | |
| */ | |
| size?: OverridableStringUnion<'small' | 'medium', AutocompletePropsSizeOverrides>; | |
| /** | |
| * The props used for each slot inside. | |
| * @default {} | |
| */ | |
| slotProps?: { | |
| clearIndicator?: Partial<IconButtonProps>; | |
| paper?: PaperProps; | |
| popper?: Partial<PopperProps>; | |
| popupIndicator?: Partial<IconButtonProps>; | |
| }; | |
| /** | |
| * The system prop that allows defining system overrides as well as additional CSS styles. | |
| */ | |
| sx?: SxProps<Theme>; | |
| } | |
| /** | |
| * | |
| * Demos: | |
| * | |
| * - [Autocomplete](https://mui.com/material-ui/react-autocomplete/) | |
| * | |
| * API: | |
| * | |
| * - [Autocomplete API](https://mui.com/material-ui/api/autocomplete/) | |
| */ | |
| export default function Autocomplete< | |
| Value, | |
| Multiple extends boolean | undefined = false, | |
| DisableClearable extends boolean | undefined = false, | |
| FreeSolo extends boolean | undefined = false, | |
| ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent'], | |
| >( | |
| props: AutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, | |
| ): React.JSX.Element; | |