react-aria/dist/private/datepicker/useDatePickerGroup.cjs.map

Spectrum UI components in React

{"mappings":"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","sources":["packages/react-aria/src/datepicker/useDatePickerGroup.ts"],"sourcesContent":["import {createFocusManager, getFocusableTreeWalker} from '../focus/FocusScope';\nimport {DateFieldState} from 'react-stately/useDateFieldState';\nimport {DatePickerState} from 'react-stately/useDatePickerState';\nimport {DateRangePickerState} from 'react-stately/useDateRangePickerState';\nimport {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {getEventTarget, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {mergeProps} from '../utils/mergeProps';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useMemo} from 'react';\nimport {usePress} from '../interactions/usePress';\n\nexport function useDatePickerGroup(\n  state: DatePickerState | DateRangePickerState | DateFieldState,\n  ref: RefObject<Element | null>,\n  disableArrowNavigation?: boolean\n): DOMAttributes<FocusableElement> {\n  let {direction} = useLocale();\n  let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n  // Open the popover on alt + arrow down\n  let onKeyDown = (e: KeyboardEvent) => {\n    if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {\n      return;\n    }\n\n    if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {\n      e.preventDefault();\n      e.stopPropagation();\n      state.setOpen(true);\n    }\n\n    if (disableArrowNavigation) {\n      return;\n    }\n\n    switch (e.key) {\n      case 'ArrowLeft':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          if (ref.current) {\n            let target = getEventTarget(e) as FocusableElement;\n            let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);\n\n            if (prev) {\n              prev.focus();\n            }\n          }\n        } else {\n          focusManager.focusPrevious();\n        }\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          if (ref.current) {\n            let target = getEventTarget(e) as FocusableElement;\n            let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);\n\n            if (next) {\n              next.focus();\n            }\n          }\n        } else {\n          focusManager.focusNext();\n        }\n        break;\n    }\n  };\n\n  // Focus the first placeholder segment from the end on mouse down/touch up in the field.\n  let focusLast = () => {\n    if (!ref.current) {\n      return;\n    }\n    // Try to find the segment prior to the element that was clicked on.\n    let target = window.event ? (getEventTarget(window.event) as FocusableElement) : null;\n    let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n    if (target) {\n      walker.currentNode = target;\n      target = walker.previousNode() as FocusableElement;\n    }\n\n    // If no target found, find the last element from the end.\n    if (!target) {\n      let last: FocusableElement;\n      do {\n        last = walker.lastChild() as FocusableElement;\n        if (last) {\n          target = last;\n        }\n      } while (last);\n    }\n\n    // Now go backwards until we find an element that is not a placeholder.\n    while (target?.hasAttribute('data-placeholder')) {\n      let prev = walker.previousNode() as FocusableElement;\n      if (prev && prev.hasAttribute('data-placeholder')) {\n        target = prev;\n      } else {\n        break;\n      }\n    }\n\n    if (target) {\n      target.focus();\n    }\n  };\n\n  let {pressProps} = usePress({\n    preventFocusOnPress: true,\n    allowTextSelectionOnPress: true,\n    onPressStart(e) {\n      if (e.pointerType === 'mouse') {\n        focusLast();\n      }\n    },\n    onPress(e) {\n      if (e.pointerType === 'touch' || e.pointerType === 'pen') {\n        focusLast();\n      }\n    }\n  });\n\n  return mergeProps(pressProps, {onKeyDown});\n}\n\nfunction findNextSegment(group: Element, fromX: number, direction: number) {\n  let walker = getFocusableTreeWalker(group, {tabbable: true});\n  let node = walker.nextNode();\n  let closest: FocusableElement | null = null;\n  let closestDistance = Infinity;\n  while (node) {\n    let x = (node as Element).getBoundingClientRect().left;\n    let distance = x - fromX;\n    let absoluteDistance = Math.abs(distance);\n    if (Math.sign(distance) === direction && absoluteDistance < closestDistance) {\n      closest = node as FocusableElement;\n      closestDistance = absoluteDistance;\n    }\n    node = walker.nextNode();\n  }\n  return closest;\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.cjs.map"}