react-aria/dist/private/listbox/useOption.cjs.map

Spectrum UI components in React

{"mappings":";;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;AA0FM,SAAS,0CACd,KAAsB,EACtB,KAAmB,EACnB,GAAuC;IAEvC,IAAI,OAAC,GAAG,EAAC,GAAG;IAEZ,IAAI,OAAO,CAAA,GAAA,kCAAO,EAAE,GAAG,CAAC;IAExB,IAAI,aAAa,MAAM,UAAU,IAAI,MAAM,gBAAgB,CAAC,UAAU,CAAC;IACvE,IAAI,aAAa,MAAM,UAAU,IAAI,MAAM,gBAAgB,CAAC,UAAU,CAAC;IACvE,IAAI,wBAAwB,MAAM,qBAAqB,IAAI,MAAM;IACjE,IAAI,qBAAqB,MAAM,kBAAkB,IAAI,MAAM;IAC3D,IAAI,wBAAwB,MAAM,qBAAqB,IAAI,MAAM;IACjE,IAAI,gBAAgB,MAAM,aAAa,IAAI,MAAM;IAEjD,IAAI,UAAU,CAAA,GAAA,mCAAQ;IACtB,IAAI,gBAAgB,CAAA,GAAA,mCAAQ;IAE5B,IAAI,cAAc;QAChB,MAAM;QACN,iBAAiB,cAAc;QAC/B,iBAAiB,MAAM,gBAAgB,CAAC,aAAa,KAAK,SAAS,aAAa;QAChF,cAAc,KAAK,CAAC,aAAa;QACjC,mBAAmB;QACnB,oBAAoB;IACtB;IAEA,IAAI,OAAO,MAAM,UAAU,CAAC,OAAO,CAAC;IACpC,IAAI,eAAe;QACjB,IAAI,QAAQ,OAAO,MAAM;QACzB,WAAW,CAAC,gBAAgB,GAAG,OAAO,KAAK,CAAC,SAAS,YAAY,QAAQ;QACzE,WAAW,CAAC,eAAe,GAAG,CAAA,GAAA,8DAAW,EAAE,MAAM,UAAU;IAC7D;IAEA,IAAI,WAAW,MAAM,WAAW,IAAM,MAAM,WAAW,OAAO;IAC9D,IAAI,KAAK,CAAA,GAAA,mCAAQ,EAAE,OAAO;IAC1B,IAAI,aAAC,SAAS,aAAE,SAAS,aAAE,SAAS,aAAE,SAAS,mBAAE,eAAe,EAAC,GAAG,CAAA,GAAA,2CAAgB,EAAE;QACpF,kBAAkB,MAAM,gBAAgB;aACxC;aACA;+BACA;QACA,4BAA4B,yBAAyB;uBACrD;+BACA;oBACA;QACA,UACE,YAAY,MAAM,OAAO,WAAW,CAAA,GAAA,+BAAI,EAAE,MAAM,OAAO,UAAU,YAAY;QAC/E,cAAc,MAAM;QACpB,aAAa;QACb,uBAAuB,MAAM,CAAC,wBAAwB;YACtD;IACF;IAEA,IAAI,cAAC,UAAU,EAAC,GAAG,CAAA,GAAA,kCAAO,EAAE;QAC1B,YAAY,cAAc,CAAC;QAC3B;YACE,IAAI,CAAC,CAAA,GAAA,wCAAa,KAAK;gBACrB,MAAM,gBAAgB,CAAC,UAAU,CAAC;gBAClC,MAAM,gBAAgB,CAAC,aAAa,CAAC;YACvC;QACF;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,wCAAa,EAAE,MAAM;IACpC,OAAO,SAAS,EAAE;IAClB,IAAI,YAAY,CAAA,GAAA,sCAAW,EAAE,MAAM;IAEnC,OAAO;QACL,aAAa;YACX,GAAG,WAAW;YACd,GAAG,CAAA,GAAA,oCAAS,EAAE,UAAU,WAAW,YAAY,UAAU;gBACzD;QACF;QACA,YAAY;YACV,IAAI;QACN;QACA,kBAAkB;YAChB,IAAI;QACN;mBACA;QACA,gBAAgB,aAAa,MAAM,gBAAgB,CAAC,SAAS,IAAI,CAAA,GAAA,wCAAa;oBAC9E;oBACA;mBACA;yBACA;mBACA;IACF;AACF","sources":["packages/react-aria/src/listbox/useOption.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 {chain} from '../utils/chain';\n\nimport {DOMAttributes, FocusableElement, Key, RefObject} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\nimport {getItemCount} from 'react-stately/private/collections/getItemCount';\nimport {getItemId, listData} from './utils';\nimport {isFocusVisible} from '../interactions/useFocusVisible';\nimport {ListState} from 'react-stately/useListState';\nimport {mergeProps} from '../utils/mergeProps';\nimport {SelectableItemStates, useSelectableItem} from '../selection/useSelectableItem';\nimport {useHover} from '../interactions/useHover';\nimport {useLinkProps} from '../utils/openLink';\nimport {useSlotId} from '../utils/useId';\n\nexport interface OptionAria extends SelectableItemStates {\n  /** Props for the option element. */\n  optionProps: DOMAttributes;\n\n  /** Props for the main text element inside the option. */\n  labelProps: DOMAttributes;\n\n  /** Props for the description text element inside the option, if any. */\n  descriptionProps: DOMAttributes;\n\n  /** Whether the option is currently focused. */\n  isFocused: boolean;\n\n  /** Whether the option is keyboard focused. */\n  isFocusVisible: boolean;\n}\n\nexport interface AriaOptionProps {\n  /**\n   * Whether the option is disabled.\n   *\n   * @deprecated\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Whether the option is selected.\n   *\n   * @deprecated\n   */\n  isSelected?: boolean;\n\n  /** A screen reader only label for the option. */\n  'aria-label'?: string;\n\n  /** The unique key for the option. */\n  key: Key;\n\n  /**\n   * Whether selection should occur on press up instead of press down.\n   *\n   * @deprecated\n   */\n  shouldSelectOnPressUp?: boolean;\n\n  /**\n   * Whether the option should be focused when the user hovers over it.\n   *\n   * @deprecated\n   */\n  shouldFocusOnHover?: boolean;\n\n  /**\n   * Whether the option is contained in a virtual scrolling listbox.\n   *\n   * @deprecated\n   */\n  isVirtualized?: boolean;\n\n  /**\n   * Whether the option should use virtual focus instead of being focused directly.\n   *\n   * @deprecated\n   */\n  shouldUseVirtualFocus?: boolean;\n}\n\n/**\n * Provides the behavior and accessibility implementation for an option in a listbox.\n * See `useListBox` for more details about listboxes.\n *\n * @param props - Props for the option.\n * @param state - State for the listbox, as returned by `useListState`.\n */\nexport function useOption<T>(\n  props: AriaOptionProps,\n  state: ListState<T>,\n  ref: RefObject<FocusableElement | null>\n): OptionAria {\n  let {key} = props;\n\n  let data = listData.get(state);\n\n  let isDisabled = props.isDisabled ?? state.selectionManager.isDisabled(key);\n  let isSelected = props.isSelected ?? state.selectionManager.isSelected(key);\n  let shouldSelectOnPressUp = props.shouldSelectOnPressUp ?? data?.shouldSelectOnPressUp;\n  let shouldFocusOnHover = props.shouldFocusOnHover ?? data?.shouldFocusOnHover;\n  let shouldUseVirtualFocus = props.shouldUseVirtualFocus ?? data?.shouldUseVirtualFocus;\n  let isVirtualized = props.isVirtualized ?? data?.isVirtualized;\n\n  let labelId = useSlotId();\n  let descriptionId = useSlotId();\n\n  let optionProps = {\n    role: 'option',\n    'aria-disabled': isDisabled || undefined,\n    'aria-selected': state.selectionManager.selectionMode !== 'none' ? isSelected : undefined,\n    'aria-label': props['aria-label'],\n    'aria-labelledby': labelId,\n    'aria-describedby': descriptionId\n  };\n\n  let item = state.collection.getItem(key);\n  if (isVirtualized) {\n    let index = Number(item?.index);\n    optionProps['aria-posinset'] = Number.isNaN(index) ? undefined : index + 1;\n    optionProps['aria-setsize'] = getItemCount(state.collection);\n  }\n\n  let onAction = data?.onAction ? () => data?.onAction?.(key) : undefined;\n  let id = getItemId(state, key);\n  let {itemProps, isPressed, isFocused, hasAction, allowsSelection} = useSelectableItem({\n    selectionManager: state.selectionManager,\n    key,\n    ref,\n    shouldSelectOnPressUp,\n    allowsDifferentPressOrigin: shouldSelectOnPressUp && shouldFocusOnHover,\n    isVirtualized,\n    shouldUseVirtualFocus,\n    isDisabled,\n    onAction:\n      onAction || item?.props?.onAction ? chain(item?.props?.onAction, onAction) : undefined,\n    linkBehavior: data?.linkBehavior,\n    // @ts-ignore\n    UNSTABLE_itemBehavior: data?.['UNSTABLE_itemBehavior'],\n    id\n  });\n\n  let {hoverProps} = useHover({\n    isDisabled: isDisabled || !shouldFocusOnHover,\n    onHoverStart() {\n      if (!isFocusVisible()) {\n        state.selectionManager.setFocused(true);\n        state.selectionManager.setFocusedKey(key);\n      }\n    }\n  });\n\n  let domProps = filterDOMProps(item?.props);\n  delete domProps.id;\n  let linkProps = useLinkProps(item?.props);\n\n  return {\n    optionProps: {\n      ...optionProps,\n      ...mergeProps(domProps, itemProps, hoverProps, linkProps),\n      id\n    },\n    labelProps: {\n      id: labelId\n    },\n    descriptionProps: {\n      id: descriptionId\n    },\n    isFocused,\n    isFocusVisible: isFocused && state.selectionManager.isFocused && isFocusVisible(),\n    isSelected,\n    isDisabled,\n    isPressed,\n    allowsSelection,\n    hasAction\n  };\n}\n"],"names":[],"version":3,"file":"useOption.cjs.map"}