react-aria/dist/private/tag/useTag.cjs.map

Spectrum UI components in React

{"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AA0CM,SAAS,0CACd,KAAsB,EACtB,KAAmB,EACnB,GAAuC;IAEvC,IAAI,QAAC,IAAI,EAAC,GAAG;IACb,IAAI,kBAAkB,CAAA,GAAA,qDAA0B,EAAE,CAAA,GAAA,mDAAW,GAAG;IAChE,IAAI,WAAW,CAAA,GAAA,+BAAI;IAEnB,IAAI,YAAC,QAAQ,EAAC,GAAG,CAAA,GAAA,kCAAO,EAAE,GAAG,CAAC,UAAU,CAAC;IACzC,IAAI,YAAC,QAAQ,iBAAE,aAAa,EAAE,GAAG,QAAO,GAAG,CAAA,GAAA,yCAAc,EACvD;QACE,MAAM;IACR,GACA,OACA;IAGF,6DAA6D;IAC7D,IAAI,EAAC,kBAAkB,CAAC,EAAE,GAAG,yBAAwB,GAAG;IAExD,IAAI,aAAa,MAAM,YAAY,CAAC,GAAG,CAAC,KAAK,GAAG,KAAK,KAAK,KAAK,CAAC,UAAU;IAC1E,IAAI,YAAY,CAAC;QACf,IAAI,EAAE,GAAG,KAAK,YAAY,EAAE,GAAG,KAAK,aAAa;YAC/C,IAAI,YACF;YAGF,EAAE,cAAc;YAChB,IAAI,MAAM,gBAAgB,CAAC,UAAU,CAAC,KAAK,GAAG,GAC5C,WAAW,IAAI,IAAI,MAAM,gBAAgB,CAAC,YAAY;iBAEtD,WAAW,IAAI,IAAI;gBAAC,KAAK,GAAG;aAAC;QAEjC;IACF;IAEA,IAAI,WAAW,CAAA,GAAA,gDAAqB;IACpC,IAAI,aAAa,aAAa,OAAO,WAAW,eAAe,kBAAkB,QAC/E,WAAW;IAEb,IAAI,cACF,YAAa,CAAA,aAAa,cAAc,aAAa,SAAQ,IACzD,gBAAgB,MAAM,CAAC,uBACvB;IACN,IAAI,YAAY,CAAA,GAAA,wCAAa,EAAE;IAE/B,IAAI,gBAAgB,KAAK,GAAG,KAAK,MAAM,gBAAgB,CAAC,UAAU;IAClE,IAAI,YAAY,MAAM,gBAAgB,CAAC,UAAU,IAAI;IACrD,IAAI,WAAW;IACf,IAAI,CAAC,cAAe,CAAA,iBAAiB,CAAC,SAAQ,GAC5C,WAAW;IAGb,IAAI,WAAW,CAAA,GAAA,wCAAa,EAAE,KAAK,KAAK;IACxC,IAAI,YAAY,CAAA,GAAA,+CAAoB,EAAE,KAAK,KAAK;IAChD,IAAI,kBAAC,cAAc,EAAC,GAAG,CAAA,GAAA,sCAAW,EAChC;QACE,GAAG,KAAK,KAAK;oBACb;IACF,GACA;IAGF,OAAO;QACL,mBAAmB;YACjB,cAAc,gBAAgB,MAAM,CAAC;YACrC,mBAAmB,GAAG,SAAS,CAAC,EAAE,SAAS,EAAE,EAAE;wBAC/C;YACA,IAAI;YACJ,SAAS,IAAO,WAAW,SAAS,IAAI,IAAI;oBAAC,KAAK,GAAG;iBAAC,KAAK;QAC7D;QACA,UAAU,CAAA,GAAA,oCAAS,EAAE,gBAAgB,UAAU,UAAU,WAAW;sBAClE;YACA,WAAW,WAAW,YAAY;YAClC,oBAAoB,SAAS,CAAC,mBAAmB;QACnD;QACA,eAAe,CAAA,GAAA,oCAAS,EAAE,eAAe;YACvC,qBAAqB,KAAK,CAAC,oBAAoB;YAC/C,cAAc,KAAK,CAAC,aAAa;QACnC;QACA,GAAG,uBAAuB;QAC1B,gBAAgB,CAAC,CAAC;IACpB;AACF","sources":["packages/react-aria/src/tag/useTag.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 {DOMAttributes, FocusableElement, Node, RefObject} from '@react-types/shared';\nimport {filterDOMProps} from '../utils/filterDOMProps';\nimport {hookData} from './useTagGroup';\nimport intlMessages from '../../intl/tag/*.json';\nimport {KeyboardEvent} from 'react';\nimport type {ListState} from 'react-stately/useListState';\nimport {mergeProps} from '../utils/mergeProps';\nimport {SelectableItemStates} from '../selection/useSelectableItem';\nimport {useDescription} from '../utils/useDescription';\nimport {useFocusable} from '../interactions/useFocusable';\nimport {useGridListItem} from '../gridlist/useGridListItem';\nimport {useId} from '../utils/useId';\nimport {useInteractionModality} from '../interactions/useFocusVisible';\nimport {useLocalizedStringFormatter} from '../i18n/useLocalizedStringFormatter';\nimport {useSyntheticLinkProps} from '../utils/openLink';\n\nexport interface TagAria extends SelectableItemStates {\n  /** Props for the tag row element. */\n  rowProps: DOMAttributes;\n  /** Props for the tag cell element. */\n  gridCellProps: DOMAttributes;\n  /** Props for the tag remove button. */\n  removeButtonProps: AriaButtonProps;\n  /** Whether the tag can be removed. */\n  allowsRemoving: boolean;\n}\n\nexport interface AriaTagProps<T> {\n  /** An object representing the tag. Contains all the relevant information that makes up the tag. */\n  item: Node<T>;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a tag component.\n *\n * @param props - Props to be applied to the tag.\n * @param state - State for the tag group, as returned by `useListState`.\n * @param ref - A ref to a DOM element for the tag.\n */\nexport function useTag<T>(\n  props: AriaTagProps<T>,\n  state: ListState<T>,\n  ref: RefObject<FocusableElement | null>\n): TagAria {\n  let {item} = props;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/tag');\n  let buttonId = useId();\n\n  let {onRemove} = hookData.get(state) || {};\n  let {rowProps, gridCellProps, ...states} = useGridListItem(\n    {\n      node: item\n    },\n    state,\n    ref\n  );\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  let {descriptionProps: _, ...stateWithoutDescription} = states;\n\n  let isDisabled = state.disabledKeys.has(item.key) || item.props.isDisabled;\n  let onKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Delete' || e.key === 'Backspace') {\n      if (isDisabled) {\n        return;\n      }\n\n      e.preventDefault();\n      if (state.selectionManager.isSelected(item.key)) {\n        onRemove?.(new Set(state.selectionManager.selectedKeys));\n      } else {\n        onRemove?.(new Set([item.key]));\n      }\n    }\n  };\n\n  let modality = useInteractionModality();\n  if (modality === 'virtual' && typeof window !== 'undefined' && 'ontouchstart' in window) {\n    modality = 'pointer';\n  }\n  let description =\n    onRemove && (modality === 'keyboard' || modality === 'virtual')\n      ? stringFormatter.format('removeDescription')\n      : '';\n  let descProps = useDescription(description);\n\n  let isItemFocused = item.key === state.selectionManager.focusedKey;\n  let isFocused = state.selectionManager.focusedKey != null;\n  let tabIndex = -1;\n  if (!isDisabled && (isItemFocused || !isFocused)) {\n    tabIndex = 0;\n  }\n\n  let domProps = filterDOMProps(item.props);\n  let linkProps = useSyntheticLinkProps(item.props);\n  let {focusableProps} = useFocusable(\n    {\n      ...item.props,\n      isDisabled\n    },\n    ref\n  );\n\n  return {\n    removeButtonProps: {\n      'aria-label': stringFormatter.format('removeButtonLabel'),\n      'aria-labelledby': `${buttonId} ${rowProps.id}`,\n      isDisabled,\n      id: buttonId,\n      onPress: () => (onRemove ? onRemove(new Set([item.key])) : null)\n    },\n    rowProps: mergeProps(focusableProps, rowProps, domProps, linkProps, {\n      tabIndex,\n      onKeyDown: onRemove ? onKeyDown : undefined,\n      'aria-describedby': descProps['aria-describedby']\n    }),\n    gridCellProps: mergeProps(gridCellProps, {\n      'aria-errormessage': props['aria-errormessage'],\n      'aria-label': props['aria-label']\n    }),\n    ...stateWithoutDescription,\n    allowsRemoving: !!onRemove\n  };\n}\n"],"names":[],"version":3,"file":"useTag.cjs.map"}