react-aria
Version:
Spectrum UI components in React
1 lines • 24.3 kB
Source Map (JSON)
{"mappings":"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","sources":["packages/react-aria/src/datepicker/useDateSegment.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 {CalendarDate, toCalendar} from '@internationalized/date';\nimport {DateFieldState, DateSegment} from 'react-stately/useDateFieldState';\nimport {getActiveElement, nodeContains} from '../utils/shadowdom/DOMFunctions';\nimport {getScrollParent} from '../utils/getScrollParent';\nimport {hookData} from './useDateField';\nimport {isIOS, isMac} from '../utils/platform';\nimport {mergeProps} from '../utils/mergeProps';\nimport {NumberParser} from '@internationalized/number';\nimport React, {CSSProperties, useMemo, useRef} from 'react';\nimport {RefObject} from '@react-types/shared';\nimport {scrollIntoViewport} from '../utils/scrollIntoView';\nimport {useDateFormatter} from '../i18n/useDateFormatter';\nimport {useDisplayNames} from './useDisplayNames';\nimport {useEvent} from '../utils/useEvent';\nimport {useFilter} from '../i18n/useFilter';\nimport {useId} from '../utils/useId';\nimport {useLabels} from '../utils/useLabels';\nimport {useLayoutEffect} from '../utils/useLayoutEffect';\nimport {useLocale} from '../i18n/I18nProvider';\nimport {useSpinButton} from '../spinbutton/useSpinButton';\n\nexport interface DateSegmentAria {\n /** Props for the segment element. */\n segmentProps: React.HTMLAttributes<HTMLDivElement>;\n}\n\n/**\n * Provides the behavior and accessibility implementation for a segment in a date field.\n * A date segment displays an individual unit of a date and time, and allows users to edit\n * the value by typing or using the arrow keys to increment and decrement.\n */\nexport function useDateSegment(\n segment: DateSegment,\n state: DateFieldState,\n ref: RefObject<HTMLElement | null>\n): DateSegmentAria {\n let enteredKeys = useRef('');\n let {locale, direction} = useLocale();\n let displayNames = useDisplayNames();\n let {ariaLabel, ariaLabelledBy, ariaDescribedBy, focusManager} = hookData.get(state)!;\n\n let textValue = segment.isPlaceholder ? '' : segment.text;\n let options = useMemo(() => state.dateFormatter.resolvedOptions(), [state.dateFormatter]);\n let monthDateFormatter = useDateFormatter({month: 'long', timeZone: options.timeZone});\n let hourDateFormatter = useDateFormatter({\n hour: 'numeric',\n hour12: options.hour12,\n timeZone: options.timeZone\n });\n\n if (segment.type === 'month' && !segment.isPlaceholder) {\n let monthTextValue = monthDateFormatter.format(state.dateValue);\n textValue = monthTextValue !== textValue ? `${textValue} – ${monthTextValue}` : monthTextValue;\n } else if (segment.type === 'hour' && !segment.isPlaceholder) {\n textValue = hourDateFormatter.format(state.dateValue);\n }\n\n let {spinButtonProps} = useSpinButton({\n // The ARIA spec says aria-valuenow is optional if there's no value, but aXe seems to require it.\n // This doesn't seem to have any negative effects with real AT since we also use aria-valuetext.\n // https://github.com/dequelabs/axe-core/issues/3505\n value: segment.value ?? undefined,\n textValue,\n minValue: segment.minValue,\n maxValue: segment.maxValue,\n isDisabled: state.isDisabled,\n isReadOnly: state.isReadOnly || !segment.isEditable,\n isRequired: state.isRequired,\n onIncrement: () => {\n enteredKeys.current = '';\n state.increment(segment.type);\n },\n onDecrement: () => {\n enteredKeys.current = '';\n state.decrement(segment.type);\n },\n onIncrementPage: () => {\n enteredKeys.current = '';\n state.incrementPage(segment.type);\n },\n onDecrementPage: () => {\n enteredKeys.current = '';\n state.decrementPage(segment.type);\n },\n onIncrementToMax: () => {\n enteredKeys.current = '';\n state.incrementToMax(segment.type);\n },\n onDecrementToMin: () => {\n enteredKeys.current = '';\n state.decrementToMin(segment.type);\n }\n });\n\n let parser = useMemo(() => new NumberParser(locale, {maximumFractionDigits: 0}), [locale]);\n\n let backspace = () => {\n if (segment.text === segment.placeholder) {\n focusManager.focusPrevious();\n }\n if (parser.isValidPartialNumber(segment.text) && !state.isReadOnly && !segment.isPlaceholder) {\n let newValue = segment.text.slice(0, -1);\n let parsed = parser.parse(newValue);\n newValue = parsed === 0 ? '' : newValue;\n if (newValue.length === 0 || parsed === 0) {\n state.clearSegment(segment.type);\n } else {\n state.setSegment(segment.type, parsed);\n }\n enteredKeys.current = newValue;\n } else if (segment.type === 'dayPeriod' || segment.type === 'era') {\n state.clearSegment(segment.type);\n }\n };\n\n let onKeyDown = e => {\n // Firefox does not fire selectstart for Ctrl/Cmd + A\n // https://bugzilla.mozilla.org/show_bug.cgi?id=1742153\n if (e.key === 'a' && (isMac() ? e.metaKey : e.ctrlKey)) {\n e.preventDefault();\n }\n\n if (e.ctrlKey || e.metaKey || e.shiftKey || e.altKey) {\n return;\n }\n\n switch (e.key) {\n case 'Backspace':\n case 'Delete': {\n // Safari on iOS does not fire beforeinput for the backspace key because the cursor is at the start.\n e.preventDefault();\n e.stopPropagation();\n backspace();\n break;\n }\n }\n };\n\n // Safari dayPeriod option doesn't work...\n let {startsWith} = useFilter({sensitivity: 'base'});\n let amPmFormatter = useDateFormatter({hour: 'numeric', hour12: true});\n let am = useMemo(() => {\n let date = new Date();\n date.setHours(0);\n return amPmFormatter.formatToParts(date).find(part => part.type === 'dayPeriod')!.value;\n }, [amPmFormatter]);\n\n let pm = useMemo(() => {\n let date = new Date();\n date.setHours(12);\n return amPmFormatter.formatToParts(date).find(part => part.type === 'dayPeriod')!.value;\n }, [amPmFormatter]);\n\n // Get a list of formatted era names so users can type the first character to choose one.\n let eraFormatter = useDateFormatter({year: 'numeric', era: 'narrow', timeZone: 'UTC'});\n let eras = useMemo(() => {\n if (segment.type !== 'era') {\n return [];\n }\n\n let date = toCalendar(new CalendarDate(1, 1, 1), state.calendar);\n let eras = state.calendar.getEras().map(era => {\n let eraDate = date.set({year: 1, month: 1, day: 1, era}).toDate('UTC');\n let parts = eraFormatter.formatToParts(eraDate);\n let formatted = parts.find(p => p.type === 'era')!.value;\n return {era, formatted};\n });\n\n // Remove the common prefix from formatted values. This is so that in calendars with eras like\n // ERA0 and ERA1 (e.g. Ethiopic), users can press \"0\" and \"1\" to select an era. In other cases,\n // the first letter is used.\n let prefixLength = commonPrefixLength(eras.map(era => era.formatted));\n if (prefixLength) {\n for (let era of eras) {\n era.formatted = era.formatted.slice(prefixLength);\n }\n }\n\n return eras;\n }, [eraFormatter, state.calendar, segment.type]);\n\n let onInput = (key: string) => {\n if (state.isDisabled || state.isReadOnly) {\n return;\n }\n\n let newValue = enteredKeys.current + key;\n\n switch (segment.type) {\n case 'dayPeriod':\n if (startsWith(am, key)) {\n state.setSegment('dayPeriod', 0);\n } else if (startsWith(pm, key)) {\n state.setSegment('dayPeriod', 1);\n } else {\n break;\n }\n focusManager.focusNext();\n break;\n case 'era': {\n let matched = eras.find(e => startsWith(e.formatted, key));\n if (matched) {\n state.setSegment('era', matched.era);\n focusManager.focusNext();\n }\n break;\n }\n case 'day':\n case 'hour':\n case 'minute':\n case 'second':\n case 'month':\n case 'year': {\n if (!parser.isValidPartialNumber(newValue)) {\n return;\n }\n\n let numberValue = parser.parse(newValue);\n let segmentValue = numberValue;\n if (segment.maxValue !== undefined && numberValue > segment.maxValue) {\n segmentValue = parser.parse(key);\n }\n\n if (isNaN(numberValue)) {\n return;\n }\n\n state.setSegment(segment.type, segmentValue);\n\n if (\n segment.maxValue !== undefined &&\n (Number(numberValue + '0') > segment.maxValue ||\n newValue.length >= String(segment.maxValue).length)\n ) {\n enteredKeys.current = '';\n focusManager.focusNext();\n } else {\n enteredKeys.current = newValue;\n }\n break;\n }\n }\n };\n\n let onFocus = () => {\n enteredKeys.current = '';\n if (ref.current) {\n scrollIntoViewport(ref.current, {containingElement: getScrollParent(ref.current)});\n }\n\n // Collapse selection to start or Chrome won't fire input events.\n let selection = window.getSelection();\n selection?.collapse(ref.current);\n };\n\n let documentRef = useRef(typeof document !== 'undefined' ? document : null);\n useEvent(documentRef, 'selectionchange', () => {\n // Enforce that the selection is collapsed when inside a date segment.\n // Otherwise, when tapping on a segment in Android Chrome and then entering text,\n // composition events will be fired that break the DOM structure and crash the page.\n let selection = window.getSelection();\n if (selection?.anchorNode && nodeContains(ref.current, selection?.anchorNode)) {\n selection.collapse(ref.current);\n }\n });\n\n let compositionRef = useRef<string | null>('');\n useEvent(ref, 'beforeinput', e => {\n if (!ref.current) {\n return;\n }\n e.preventDefault();\n\n switch (e.inputType) {\n case 'deleteContentBackward':\n case 'deleteContentForward':\n if (parser.isValidPartialNumber(segment.text) && !state.isReadOnly) {\n backspace();\n }\n break;\n case 'insertCompositionText':\n // insertCompositionText cannot be canceled.\n // Record the current state of the element so we can restore it in the `input` event below.\n compositionRef.current = ref.current.textContent;\n\n // Safari gets stuck in a composition state unless we also assign to the value here.\n // eslint-disable-next-line no-self-assign\n ref.current.textContent = ref.current.textContent;\n break;\n default:\n if (e.data != null) {\n onInput(e.data);\n }\n break;\n }\n });\n\n useEvent(ref, 'input', e => {\n let {inputType, data} = e as InputEvent;\n switch (inputType) {\n case 'insertCompositionText':\n // Reset the DOM to how it was in the beforeinput event.\n if (ref.current) {\n ref.current.textContent = compositionRef.current;\n }\n\n // Android sometimes fires key presses of letters as composition events. Need to handle am/pm keys here too.\n // Can also happen e.g. with Pinyin keyboard on iOS.\n if (data != null && (startsWith(am, data) || startsWith(pm, data))) {\n onInput(data);\n }\n break;\n }\n });\n\n useLayoutEffect(() => {\n let element = ref.current;\n return () => {\n // If the focused segment is removed, focus the previous one, or the next one if there was no previous one.\n if (getActiveElement() === element) {\n let prev = focusManager.focusPrevious();\n if (!prev) {\n focusManager.focusNext();\n }\n }\n };\n }, [ref, focusManager]);\n\n // spinbuttons cannot be focused with VoiceOver on iOS.\n let touchPropOverrides =\n isIOS() || segment.type === 'timeZoneName'\n ? {\n role: 'textbox',\n 'aria-valuemax': null,\n 'aria-valuemin': null,\n 'aria-valuetext': null,\n 'aria-valuenow': null\n }\n : {};\n\n // Only apply aria-describedby to the first segment, unless the field is invalid. This avoids it being\n // read every time the user navigates to a new segment.\n let firstSegment = useMemo(() => state.segments.find(s => s.isEditable), [state.segments]);\n if (segment !== firstSegment && !state.isInvalid) {\n ariaDescribedBy = undefined;\n }\n\n let id = useId();\n let isEditable = !state.isDisabled && !state.isReadOnly && segment.isEditable;\n\n // Prepend the label passed from the field to each segment name.\n // This is needed because VoiceOver on iOS does not announce groups.\n let name = segment.type === 'literal' ? '' : displayNames.of(segment.type);\n let labelProps = useLabels({\n 'aria-label': `${name}${ariaLabel ? `, ${ariaLabel}` : ''}${ariaLabelledBy ? ', ' : ''}`,\n 'aria-labelledby': ariaLabelledBy\n });\n\n // Literal segments should not be visible to screen readers. We don't really need any of the above,\n // but the rules of hooks mean hooks cannot be conditional so we have to put this condition here.\n if (segment.type === 'literal') {\n return {\n segmentProps: {\n 'aria-hidden': true\n }\n };\n }\n\n let segmentStyle: CSSProperties = {caretColor: 'transparent'};\n if (direction === 'rtl') {\n // While the bidirectional algorithm seems to work properly on inline elements with actual values, it returns different results for placeholder strings.\n // To ensure placeholder render in correct format, we apply the CSS equivalent of LRE (left-to-right embedding). See https://www.unicode.org/reports/tr9/#Explicit_Directional_Embeddings.\n // However, we apply this to both placeholders and date segments with an actual value because the date segments will shift around when deleting otherwise.\n segmentStyle.unicodeBidi = 'embed';\n let format = options[segment.type];\n if (format === 'numeric' || format === '2-digit') {\n segmentStyle.direction = 'ltr';\n }\n }\n\n return {\n segmentProps: mergeProps(spinButtonProps, labelProps, {\n id,\n ...touchPropOverrides,\n 'aria-invalid': state.isInvalid ? 'true' : undefined,\n 'aria-describedby': ariaDescribedBy,\n 'aria-readonly': state.isReadOnly || !segment.isEditable ? 'true' : undefined,\n 'data-placeholder': segment.isPlaceholder || undefined,\n contentEditable: isEditable,\n suppressContentEditableWarning: isEditable,\n spellCheck: isEditable ? 'false' : undefined,\n autoCorrect: isEditable ? 'off' : undefined,\n // Capitalization was changed in React 17...\n [parseInt(React.version, 10) >= 17 ? 'enterKeyHint' : 'enterkeyhint']: isEditable\n ? 'next'\n : undefined,\n inputMode:\n state.isDisabled || segment.type === 'dayPeriod' || segment.type === 'era' || !isEditable\n ? undefined\n : 'numeric',\n tabIndex: state.isDisabled ? undefined : 0,\n onKeyDown,\n onFocus,\n style: segmentStyle,\n // Prevent pointer events from reaching useDatePickerGroup, and allow native browser behavior to focus the segment.\n onPointerDown(e) {\n e.stopPropagation();\n },\n onMouseDown(e) {\n e.stopPropagation();\n }\n })\n };\n}\n\nfunction commonPrefixLength(strings: string[]): number {\n // Sort the strings, and compare the characters in the first and last to find the common prefix.\n strings.sort();\n let first = strings[0];\n let last = strings[strings.length - 1];\n for (let i = 0; i < first.length; i++) {\n if (first[i] !== last[i]) {\n return i;\n }\n }\n return 0;\n}\n"],"names":[],"version":3,"file":"useDateSegment.cjs.map"}