react-aria/dist/private/autocomplete/useSearchAutocomplete.mjs.map

Spectrum UI components in React

{"mappings":";;;;AAAA;;;;;;;;;;CAUC;;;AA0GM,SAAS,0CACd,KAAuC,EACvC,KAAuB;IAEvB,IAAI,cACF,UAAU,YACV,QAAQ,cACR,UAAU,oBACV,gBAAgB,kBAChB,cAAc,YACd,WAAW,KAAO,YAClB,OAAO,aACP,SAAS,WACT,OAAO,aACP,SAAS,mBACT,eAAe,sBACf,kBAAkB,cAClB,UAAU,EACV,GAAG,YACJ,GAAG;IAEJ,IAAI,cAAC,UAAU,oBAAE,gBAAgB,EAAC,GAAG,CAAA,GAAA,yCAAa,EAChD;QACE,GAAG,UAAU;QACb,OAAO,MAAM,UAAU;QACvB,UAAU,MAAM,aAAa;QAC7B,cAAc;QACd,SAAS;YACP,MAAM,aAAa,CAAC;YACpB,IAAI,SACF;QAEJ;QACA,UAAU,CAAA;YACR,iEAAiE;YACjE,IAAI,MAAM,gBAAgB,CAAC,UAAU,KAAK,MACxC,SAAS,OAAO;QAEpB;mBACA;iBACA;IACF,GACA;QACE,OAAO,MAAM,UAAU;QACvB,UAAU,MAAM,aAAa;IAC/B,GACA;IAGF,IAAI,gBACF,YAAY,cACZ,UAAU,EACV,YAAY,kBAAkB,EAC9B,GAAG,YACJ,GAAG,CAAA,GAAA,yCAAU,EACZ;QACE,GAAG,UAAU;0BACb;wBACA;oBACA;oBACA;kBACA;QACA,SAAS;QACT,eAAe;QACf,QAAQ;QACR,WAAW;QACX,SAAS;mBACT;yBACA;4BACA;oBACA;QACA,UAAU;IACZ,GACA;IAGF,OAAO;oBACL;QACA,YAAY,CAAA,GAAA,yCAAS,EAAE,YAAY;sBACnC;0BACA;QACA,GAAG,UAAU;IACf;AACF","sources":["packages/react-aria/src/autocomplete/useSearchAutocomplete.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {AriaButtonProps} from '../button/useButton';\nimport {\n  AriaLabelingProps,\n  CollectionBase,\n  DOMAttributes,\n  DOMProps,\n  Key,\n  KeyboardDelegate,\n  LayoutDelegate,\n  RefObject,\n  ValidationResult\n} from '@react-types/shared';\nimport {AriaListBoxOptions} from '../listbox/useListBox';\nimport {AriaSearchFieldProps, useSearchField} from '../searchfield/useSearchField';\nimport {ComboBoxState, MenuTriggerAction} from 'react-stately/useComboBoxState';\nimport {InputHTMLAttributes} from 'react';\nimport {mergeProps} from '../utils/mergeProps';\nimport {SearchFieldProps} from 'react-stately/useSearchFieldState';\nimport {useComboBox} from '../combobox/useComboBox';\n\nexport interface SearchAutocompleteProps<T>\n  extends\n    CollectionBase<T>,\n    Omit<SearchFieldProps, 'onChange' | 'onSubmit' | 'defaultValue' | 'value'> {\n  /** The list of SearchAutocomplete items (uncontrolled). */\n  defaultItems?: Iterable<T>;\n  /** The list of SearchAutocomplete items (controlled). */\n  items?: Iterable<T>;\n  /**\n   * Method that is called when the open state of the menu changes. Returns the new open state and\n   * the action that caused the opening of the menu.\n   */\n  onOpenChange?: (isOpen: boolean, menuTrigger?: MenuTriggerAction) => void;\n  /** The value of the SearchAutocomplete input (controlled). */\n  inputValue?: string;\n  /** The default value of the SearchAutocomplete input (uncontrolled). */\n  defaultInputValue?: string;\n  /** Handler that is called when the SearchAutocomplete input value changes. */\n  onInputChange?: (value: string) => void;\n  /**\n   * The interaction required to display the SearchAutocomplete menu.\n   *\n   * @default 'input'\n   */\n  menuTrigger?: MenuTriggerAction;\n  /**\n   * Handler that is called when the SearchAutocomplete is submitted.\n   *\n   * A `value` will be passed if the submission is a custom value (e.g. a user types then presses\n   * enter). If the input is a selected item, `value` will be null.\n   *\n   * A `key` will be passed if the submission is a selected item (e.g. a user clicks or presses\n   * enter on an option). If the input is a custom value, `key` will be null.\n   */\n  onSubmit?: (value: string | null, key: Key | null) => void;\n}\n\nexport interface AriaSearchAutocompleteProps<T>\n  extends\n    SearchAutocompleteProps<T>,\n    Omit<AriaSearchFieldProps, 'onChange' | 'onSubmit' | 'defaultValue' | 'value'>,\n    DOMProps,\n    AriaLabelingProps {}\n\nexport interface SearchAutocompleteAria<T> extends ValidationResult {\n  /** Props for the label element. */\n  labelProps: DOMAttributes;\n  /** Props for the search input element. */\n  inputProps: InputHTMLAttributes<HTMLInputElement>;\n  /** Props for the list box, to be passed to `useListBox`. */\n  listBoxProps: AriaListBoxOptions<T>;\n  /** Props for the search input's clear button. */\n  clearButtonProps: AriaButtonProps;\n  /** Props for the search autocomplete description element, if any. */\n  descriptionProps: DOMAttributes;\n  /** Props for the search autocomplete error message element, if any. */\n  errorMessageProps: DOMAttributes;\n}\n\nexport interface AriaSearchAutocompleteOptions<T> extends AriaSearchAutocompleteProps<T> {\n  /** The ref for the input element. */\n  inputRef: RefObject<HTMLInputElement | null>;\n  /** The ref for the list box popover. */\n  popoverRef: RefObject<HTMLDivElement | null>;\n  /** The ref for the list box. */\n  listBoxRef: RefObject<HTMLElement | null>;\n  /** An optional keyboard delegate implementation, to override the default. */\n  keyboardDelegate?: KeyboardDelegate;\n  /**\n   * A delegate object that provides layout information for items in the collection.\n   * By default this uses the DOM, but this can be overridden to implement things like\n   * virtualized scrolling.\n   */\n  layoutDelegate?: LayoutDelegate;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a search autocomplete component. A\n * search autocomplete combines a combobox with a searchfield, allowing users to filter a list of\n * options to items matching a query.\n *\n * @param props - Props for the search autocomplete.\n * @param state - State for the search autocomplete, as returned by `useSearchAutocomplete`.\n */\nexport function useSearchAutocomplete<T>(\n  props: AriaSearchAutocompleteOptions<T>,\n  state: ComboBoxState<T>\n): SearchAutocompleteAria<T> {\n  let {\n    popoverRef,\n    inputRef,\n    listBoxRef,\n    keyboardDelegate,\n    layoutDelegate,\n    onSubmit = () => {},\n    onClear,\n    onKeyDown,\n    onKeyUp,\n    isInvalid,\n    validationState,\n    validationBehavior,\n    isRequired,\n    ...otherProps\n  } = props;\n\n  let {inputProps, clearButtonProps} = useSearchField(\n    {\n      ...otherProps,\n      value: state.inputValue,\n      onChange: state.setInputValue,\n      autoComplete: 'off',\n      onClear: () => {\n        state.setInputValue('');\n        if (onClear) {\n          onClear();\n        }\n      },\n      onSubmit: value => {\n        // Prevent submission from search field if menu item was selected\n        if (state.selectionManager.focusedKey === null) {\n          onSubmit(value, null);\n        }\n      },\n      onKeyDown,\n      onKeyUp\n    },\n    {\n      value: state.inputValue,\n      setValue: state.setInputValue\n    },\n    inputRef\n  );\n\n  let {\n    listBoxProps,\n    labelProps,\n    inputProps: comboBoxInputProps,\n    ...validation\n  } = useComboBox(\n    {\n      ...otherProps,\n      keyboardDelegate,\n      layoutDelegate,\n      popoverRef,\n      listBoxRef,\n      inputRef,\n      onFocus: undefined,\n      onFocusChange: undefined,\n      onBlur: undefined,\n      onKeyDown: undefined,\n      onKeyUp: undefined,\n      isInvalid,\n      validationState,\n      validationBehavior,\n      isRequired,\n      validate: undefined\n    },\n    state\n  );\n\n  return {\n    labelProps,\n    inputProps: mergeProps(inputProps, comboBoxInputProps),\n    listBoxProps,\n    clearButtonProps,\n    ...validation\n  };\n}\n"],"names":[],"version":3,"file":"useSearchAutocomplete.mjs.map"}