@react-aria/datepicker 3.15.3 → 3.16.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/types.d.ts.map +1 -1
- package/dist/useDatePicker.main.js +1 -1
- package/dist/useDatePicker.main.js.map +1 -1
- package/dist/useDatePicker.mjs +2 -2
- package/dist/useDatePicker.module.js +2 -2
- package/dist/useDatePicker.module.js.map +1 -1
- package/dist/useDatePickerGroup.main.js +1 -1
- package/dist/useDatePickerGroup.main.js.map +1 -1
- package/dist/useDatePickerGroup.mjs +2 -2
- package/dist/useDatePickerGroup.module.js +2 -2
- package/dist/useDatePickerGroup.module.js.map +1 -1
- package/dist/useDateRangePicker.main.js +1 -1
- package/dist/useDateRangePicker.main.js.map +1 -1
- package/dist/useDateRangePicker.mjs +2 -2
- package/dist/useDateRangePicker.module.js +2 -2
- package/dist/useDateRangePicker.module.js.map +1 -1
- package/dist/useDateSegment.main.js +10 -23
- package/dist/useDateSegment.main.js.map +1 -1
- package/dist/useDateSegment.mjs +11 -24
- package/dist/useDateSegment.module.js +11 -24
- package/dist/useDateSegment.module.js.map +1 -1
- package/package.json +17 -17
- package/src/useDatePicker.ts +2 -2
- package/src/useDatePickerGroup.ts +2 -2
- package/src/useDateRangePicker.ts +2 -2
- package/src/useDateSegment.ts +10 -38
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/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/datepicker';\nimport {getScrollParent, isIOS, isMac, mergeProps, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {hookData} from './useDateField';\nimport {NumberParser} from '@internationalized/number';\nimport React, {CSSProperties, useMemo, useRef} from 'react';\nimport {RefObject} from '@react-types/shared';\nimport {useDateFormatter, useFilter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from './useDisplayNames';\nimport {useSpinButton} from '@react-aria/spinbutton';\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(segment: DateSegment, state: DateFieldState, ref: RefObject<HTMLElement | null>): 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,\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 if (segment.maxValue !== undefined) {\n state.setSegment(segment.type, segment.maxValue);\n }\n },\n onDecrementToMin: () => {\n enteredKeys.current = '';\n if (segment.minValue !== undefined) {\n state.setSegment(segment.type, segment.minValue);\n }\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') {\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', 12);\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 let allowsZero = segment.minValue === 0;\n if (segment.type === 'hour' && state.dateFormatter.resolvedOptions().hour12) {\n switch (state.dateFormatter.resolvedOptions().hourCycle) {\n case 'h11':\n if (numberValue > 11) {\n segmentValue = parser.parse(key);\n }\n break;\n case 'h12':\n allowsZero = false;\n if (numberValue > 12) {\n segmentValue = parser.parse(key);\n }\n break;\n }\n\n if (segment.value !== undefined && segment.value >= 12 && numberValue > 1) {\n numberValue += 12;\n }\n } else if (segment.maxValue !== undefined && numberValue > segment.maxValue) {\n segmentValue = parser.parse(key);\n }\n\n if (isNaN(numberValue)) {\n return;\n }\n\n let shouldSetValue = segmentValue !== 0 || allowsZero;\n if (shouldSetValue) {\n state.setSegment(segment.type, segmentValue);\n }\n\n if (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {\n enteredKeys.current = '';\n if (shouldSetValue) {\n focusManager.focusNext();\n }\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 && ref.current?.contains(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 (document.activeElement === 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 = isIOS() || segment.type === 'timeZoneName' ? {\n role: 'textbox',\n 'aria-valuemax': null,\n 'aria-valuemin': null,\n 'aria-valuetext': null,\n 'aria-valuenow': null\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 ? 'next' : undefined,\n inputMode: state.isDisabled || segment.type === 'dayPeriod' || segment.type === 'era' || !isEditable ? undefined : '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.main.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/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/datepicker';\nimport {getScrollParent, isIOS, isMac, mergeProps, nodeContains, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {hookData} from './useDateField';\nimport {NumberParser} from '@internationalized/number';\nimport React, {CSSProperties, useMemo, useRef} from 'react';\nimport {RefObject} from '@react-types/shared';\nimport {useDateFormatter, useFilter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from './useDisplayNames';\nimport {useSpinButton} from '@react-aria/spinbutton';\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(segment: DateSegment, state: DateFieldState, ref: RefObject<HTMLElement | null>): 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 (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {\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 (document.activeElement === 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 = isIOS() || segment.type === 'timeZoneName' ? {\n role: 'textbox',\n 'aria-valuemax': null,\n 'aria-valuemin': null,\n 'aria-valuetext': null,\n 'aria-valuenow': null\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 ? 'next' : undefined,\n inputMode: state.isDisabled || segment.type === 'dayPeriod' || segment.type === 'era' || !isEditable ? undefined : '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.main.js.map"}
|
package/dist/useDateSegment.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {hookData as $16f0b7bb276bc17e$export$653eddfc964b0f8a} from "./useDateField.mjs";
|
|
2
2
|
import {useDisplayNames as $3aeceb3a64eb8358$export$d42c60378c8168f8} from "./useDisplayNames.mjs";
|
|
3
3
|
import {toCalendar as $4d1jn$toCalendar, CalendarDate as $4d1jn$CalendarDate} from "@internationalized/date";
|
|
4
|
-
import {isMac as $4d1jn$isMac, scrollIntoViewport as $4d1jn$scrollIntoViewport, getScrollParent as $4d1jn$getScrollParent, useEvent as $4d1jn$useEvent, useLayoutEffect as $4d1jn$useLayoutEffect, isIOS as $4d1jn$isIOS, useId as $4d1jn$useId, useLabels as $4d1jn$useLabels, mergeProps as $4d1jn$mergeProps} from "@react-aria/utils";
|
|
4
|
+
import {isMac as $4d1jn$isMac, scrollIntoViewport as $4d1jn$scrollIntoViewport, getScrollParent as $4d1jn$getScrollParent, useEvent as $4d1jn$useEvent, nodeContains as $4d1jn$nodeContains, useLayoutEffect as $4d1jn$useLayoutEffect, isIOS as $4d1jn$isIOS, useId as $4d1jn$useId, useLabels as $4d1jn$useLabels, mergeProps as $4d1jn$mergeProps} from "@react-aria/utils";
|
|
5
5
|
import {NumberParser as $4d1jn$NumberParser} from "@internationalized/number";
|
|
6
6
|
import $4d1jn$react, {useRef as $4d1jn$useRef, useMemo as $4d1jn$useMemo} from "react";
|
|
7
7
|
import {useLocale as $4d1jn$useLocale, useDateFormatter as $4d1jn$useDateFormatter, useFilter as $4d1jn$useFilter} from "@react-aria/i18n";
|
|
@@ -47,11 +47,12 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
47
47
|
let monthTextValue = monthDateFormatter.format(state.dateValue);
|
|
48
48
|
textValue = monthTextValue !== textValue ? `${textValue} \u{2013} ${monthTextValue}` : monthTextValue;
|
|
49
49
|
} else if (segment.type === 'hour' && !segment.isPlaceholder) textValue = hourDateFormatter.format(state.dateValue);
|
|
50
|
+
var _segment_value;
|
|
50
51
|
let { spinButtonProps: spinButtonProps } = (0, $4d1jn$useSpinButton)({
|
|
51
52
|
// The ARIA spec says aria-valuenow is optional if there's no value, but aXe seems to require it.
|
|
52
53
|
// This doesn't seem to have any negative effects with real AT since we also use aria-valuetext.
|
|
53
54
|
// https://github.com/dequelabs/axe-core/issues/3505
|
|
54
|
-
value: segment.value,
|
|
55
|
+
value: (_segment_value = segment.value) !== null && _segment_value !== void 0 ? _segment_value : undefined,
|
|
55
56
|
textValue: textValue,
|
|
56
57
|
minValue: segment.minValue,
|
|
57
58
|
maxValue: segment.maxValue,
|
|
@@ -76,11 +77,11 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
76
77
|
},
|
|
77
78
|
onIncrementToMax: ()=>{
|
|
78
79
|
enteredKeys.current = '';
|
|
79
|
-
|
|
80
|
+
state.incrementToMax(segment.type);
|
|
80
81
|
},
|
|
81
82
|
onDecrementToMin: ()=>{
|
|
82
83
|
enteredKeys.current = '';
|
|
83
|
-
|
|
84
|
+
state.decrementToMin(segment.type);
|
|
84
85
|
}
|
|
85
86
|
});
|
|
86
87
|
let parser = (0, $4d1jn$useMemo)(()=>new (0, $4d1jn$NumberParser)(locale, {
|
|
@@ -97,7 +98,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
97
98
|
if (newValue.length === 0 || parsed === 0) state.clearSegment(segment.type);
|
|
98
99
|
else state.setSegment(segment.type, parsed);
|
|
99
100
|
enteredKeys.current = newValue;
|
|
100
|
-
} else if (segment.type === 'dayPeriod') state.clearSegment(segment.type);
|
|
101
|
+
} else if (segment.type === 'dayPeriod' || segment.type === 'era') state.clearSegment(segment.type);
|
|
101
102
|
};
|
|
102
103
|
let onKeyDown = (e)=>{
|
|
103
104
|
// Firefox does not fire selectstart for Ctrl/Cmd + A
|
|
@@ -176,7 +177,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
176
177
|
switch(segment.type){
|
|
177
178
|
case 'dayPeriod':
|
|
178
179
|
if (startsWith(am, key)) state.setSegment('dayPeriod', 0);
|
|
179
|
-
else if (startsWith(pm, key)) state.setSegment('dayPeriod',
|
|
180
|
+
else if (startsWith(pm, key)) state.setSegment('dayPeriod', 1);
|
|
180
181
|
else break;
|
|
181
182
|
focusManager.focusNext();
|
|
182
183
|
break;
|
|
@@ -199,25 +200,12 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
199
200
|
if (!parser.isValidPartialNumber(newValue)) return;
|
|
200
201
|
let numberValue = parser.parse(newValue);
|
|
201
202
|
let segmentValue = numberValue;
|
|
202
|
-
|
|
203
|
-
if (segment.type === 'hour' && state.dateFormatter.resolvedOptions().hour12) {
|
|
204
|
-
switch(state.dateFormatter.resolvedOptions().hourCycle){
|
|
205
|
-
case 'h11':
|
|
206
|
-
if (numberValue > 11) segmentValue = parser.parse(key);
|
|
207
|
-
break;
|
|
208
|
-
case 'h12':
|
|
209
|
-
allowsZero = false;
|
|
210
|
-
if (numberValue > 12) segmentValue = parser.parse(key);
|
|
211
|
-
break;
|
|
212
|
-
}
|
|
213
|
-
if (segment.value !== undefined && segment.value >= 12 && numberValue > 1) numberValue += 12;
|
|
214
|
-
} else if (segment.maxValue !== undefined && numberValue > segment.maxValue) segmentValue = parser.parse(key);
|
|
203
|
+
if (segment.maxValue !== undefined && numberValue > segment.maxValue) segmentValue = parser.parse(key);
|
|
215
204
|
if (isNaN(numberValue)) return;
|
|
216
|
-
|
|
217
|
-
if (shouldSetValue) state.setSegment(segment.type, segmentValue);
|
|
205
|
+
state.setSegment(segment.type, segmentValue);
|
|
218
206
|
if (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {
|
|
219
207
|
enteredKeys.current = '';
|
|
220
|
-
|
|
208
|
+
focusManager.focusNext();
|
|
221
209
|
} else enteredKeys.current = newValue;
|
|
222
210
|
break;
|
|
223
211
|
}
|
|
@@ -234,12 +222,11 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
234
222
|
};
|
|
235
223
|
let documentRef = (0, $4d1jn$useRef)(typeof document !== 'undefined' ? document : null);
|
|
236
224
|
(0, $4d1jn$useEvent)(documentRef, 'selectionchange', ()=>{
|
|
237
|
-
var _ref_current;
|
|
238
225
|
// Enforce that the selection is collapsed when inside a date segment.
|
|
239
226
|
// Otherwise, when tapping on a segment in Android Chrome and then entering text,
|
|
240
227
|
// composition events will be fired that break the DOM structure and crash the page.
|
|
241
228
|
let selection = window.getSelection();
|
|
242
|
-
if ((selection === null || selection === void 0 ? void 0 : selection.anchorNode) && ((
|
|
229
|
+
if ((selection === null || selection === void 0 ? void 0 : selection.anchorNode) && (0, $4d1jn$nodeContains)(ref.current, selection === null || selection === void 0 ? void 0 : selection.anchorNode)) selection.collapse(ref.current);
|
|
243
230
|
});
|
|
244
231
|
let compositionRef = (0, $4d1jn$useRef)('');
|
|
245
232
|
(0, $4d1jn$useEvent)(ref, 'beforeinput', (e)=>{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {hookData as $16f0b7bb276bc17e$export$653eddfc964b0f8a} from "./useDateField.module.js";
|
|
2
2
|
import {useDisplayNames as $3aeceb3a64eb8358$export$d42c60378c8168f8} from "./useDisplayNames.module.js";
|
|
3
3
|
import {toCalendar as $4d1jn$toCalendar, CalendarDate as $4d1jn$CalendarDate} from "@internationalized/date";
|
|
4
|
-
import {isMac as $4d1jn$isMac, scrollIntoViewport as $4d1jn$scrollIntoViewport, getScrollParent as $4d1jn$getScrollParent, useEvent as $4d1jn$useEvent, useLayoutEffect as $4d1jn$useLayoutEffect, isIOS as $4d1jn$isIOS, useId as $4d1jn$useId, useLabels as $4d1jn$useLabels, mergeProps as $4d1jn$mergeProps} from "@react-aria/utils";
|
|
4
|
+
import {isMac as $4d1jn$isMac, scrollIntoViewport as $4d1jn$scrollIntoViewport, getScrollParent as $4d1jn$getScrollParent, useEvent as $4d1jn$useEvent, nodeContains as $4d1jn$nodeContains, useLayoutEffect as $4d1jn$useLayoutEffect, isIOS as $4d1jn$isIOS, useId as $4d1jn$useId, useLabels as $4d1jn$useLabels, mergeProps as $4d1jn$mergeProps} from "@react-aria/utils";
|
|
5
5
|
import {NumberParser as $4d1jn$NumberParser} from "@internationalized/number";
|
|
6
6
|
import $4d1jn$react, {useRef as $4d1jn$useRef, useMemo as $4d1jn$useMemo} from "react";
|
|
7
7
|
import {useLocale as $4d1jn$useLocale, useDateFormatter as $4d1jn$useDateFormatter, useFilter as $4d1jn$useFilter} from "@react-aria/i18n";
|
|
@@ -47,11 +47,12 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
47
47
|
let monthTextValue = monthDateFormatter.format(state.dateValue);
|
|
48
48
|
textValue = monthTextValue !== textValue ? `${textValue} \u{2013} ${monthTextValue}` : monthTextValue;
|
|
49
49
|
} else if (segment.type === 'hour' && !segment.isPlaceholder) textValue = hourDateFormatter.format(state.dateValue);
|
|
50
|
+
var _segment_value;
|
|
50
51
|
let { spinButtonProps: spinButtonProps } = (0, $4d1jn$useSpinButton)({
|
|
51
52
|
// The ARIA spec says aria-valuenow is optional if there's no value, but aXe seems to require it.
|
|
52
53
|
// This doesn't seem to have any negative effects with real AT since we also use aria-valuetext.
|
|
53
54
|
// https://github.com/dequelabs/axe-core/issues/3505
|
|
54
|
-
value: segment.value,
|
|
55
|
+
value: (_segment_value = segment.value) !== null && _segment_value !== void 0 ? _segment_value : undefined,
|
|
55
56
|
textValue: textValue,
|
|
56
57
|
minValue: segment.minValue,
|
|
57
58
|
maxValue: segment.maxValue,
|
|
@@ -76,11 +77,11 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
76
77
|
},
|
|
77
78
|
onIncrementToMax: ()=>{
|
|
78
79
|
enteredKeys.current = '';
|
|
79
|
-
|
|
80
|
+
state.incrementToMax(segment.type);
|
|
80
81
|
},
|
|
81
82
|
onDecrementToMin: ()=>{
|
|
82
83
|
enteredKeys.current = '';
|
|
83
|
-
|
|
84
|
+
state.decrementToMin(segment.type);
|
|
84
85
|
}
|
|
85
86
|
});
|
|
86
87
|
let parser = (0, $4d1jn$useMemo)(()=>new (0, $4d1jn$NumberParser)(locale, {
|
|
@@ -97,7 +98,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
97
98
|
if (newValue.length === 0 || parsed === 0) state.clearSegment(segment.type);
|
|
98
99
|
else state.setSegment(segment.type, parsed);
|
|
99
100
|
enteredKeys.current = newValue;
|
|
100
|
-
} else if (segment.type === 'dayPeriod') state.clearSegment(segment.type);
|
|
101
|
+
} else if (segment.type === 'dayPeriod' || segment.type === 'era') state.clearSegment(segment.type);
|
|
101
102
|
};
|
|
102
103
|
let onKeyDown = (e)=>{
|
|
103
104
|
// Firefox does not fire selectstart for Ctrl/Cmd + A
|
|
@@ -176,7 +177,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
176
177
|
switch(segment.type){
|
|
177
178
|
case 'dayPeriod':
|
|
178
179
|
if (startsWith(am, key)) state.setSegment('dayPeriod', 0);
|
|
179
|
-
else if (startsWith(pm, key)) state.setSegment('dayPeriod',
|
|
180
|
+
else if (startsWith(pm, key)) state.setSegment('dayPeriod', 1);
|
|
180
181
|
else break;
|
|
181
182
|
focusManager.focusNext();
|
|
182
183
|
break;
|
|
@@ -199,25 +200,12 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
199
200
|
if (!parser.isValidPartialNumber(newValue)) return;
|
|
200
201
|
let numberValue = parser.parse(newValue);
|
|
201
202
|
let segmentValue = numberValue;
|
|
202
|
-
|
|
203
|
-
if (segment.type === 'hour' && state.dateFormatter.resolvedOptions().hour12) {
|
|
204
|
-
switch(state.dateFormatter.resolvedOptions().hourCycle){
|
|
205
|
-
case 'h11':
|
|
206
|
-
if (numberValue > 11) segmentValue = parser.parse(key);
|
|
207
|
-
break;
|
|
208
|
-
case 'h12':
|
|
209
|
-
allowsZero = false;
|
|
210
|
-
if (numberValue > 12) segmentValue = parser.parse(key);
|
|
211
|
-
break;
|
|
212
|
-
}
|
|
213
|
-
if (segment.value !== undefined && segment.value >= 12 && numberValue > 1) numberValue += 12;
|
|
214
|
-
} else if (segment.maxValue !== undefined && numberValue > segment.maxValue) segmentValue = parser.parse(key);
|
|
203
|
+
if (segment.maxValue !== undefined && numberValue > segment.maxValue) segmentValue = parser.parse(key);
|
|
215
204
|
if (isNaN(numberValue)) return;
|
|
216
|
-
|
|
217
|
-
if (shouldSetValue) state.setSegment(segment.type, segmentValue);
|
|
205
|
+
state.setSegment(segment.type, segmentValue);
|
|
218
206
|
if (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {
|
|
219
207
|
enteredKeys.current = '';
|
|
220
|
-
|
|
208
|
+
focusManager.focusNext();
|
|
221
209
|
} else enteredKeys.current = newValue;
|
|
222
210
|
break;
|
|
223
211
|
}
|
|
@@ -234,12 +222,11 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
234
222
|
};
|
|
235
223
|
let documentRef = (0, $4d1jn$useRef)(typeof document !== 'undefined' ? document : null);
|
|
236
224
|
(0, $4d1jn$useEvent)(documentRef, 'selectionchange', ()=>{
|
|
237
|
-
var _ref_current;
|
|
238
225
|
// Enforce that the selection is collapsed when inside a date segment.
|
|
239
226
|
// Otherwise, when tapping on a segment in Android Chrome and then entering text,
|
|
240
227
|
// composition events will be fired that break the DOM structure and crash the page.
|
|
241
228
|
let selection = window.getSelection();
|
|
242
|
-
if ((selection === null || selection === void 0 ? void 0 : selection.anchorNode) && ((
|
|
229
|
+
if ((selection === null || selection === void 0 ? void 0 : selection.anchorNode) && (0, $4d1jn$nodeContains)(ref.current, selection === null || selection === void 0 ? void 0 : selection.anchorNode)) selection.collapse(ref.current);
|
|
243
230
|
});
|
|
244
231
|
let compositionRef = (0, $4d1jn$useRef)('');
|
|
245
232
|
(0, $4d1jn$useEvent)(ref, 'beforeinput', (e)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/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/datepicker';\nimport {getScrollParent, isIOS, isMac, mergeProps, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {hookData} from './useDateField';\nimport {NumberParser} from '@internationalized/number';\nimport React, {CSSProperties, useMemo, useRef} from 'react';\nimport {RefObject} from '@react-types/shared';\nimport {useDateFormatter, useFilter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from './useDisplayNames';\nimport {useSpinButton} from '@react-aria/spinbutton';\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(segment: DateSegment, state: DateFieldState, ref: RefObject<HTMLElement | null>): 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,\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 if (segment.maxValue !== undefined) {\n state.setSegment(segment.type, segment.maxValue);\n }\n },\n onDecrementToMin: () => {\n enteredKeys.current = '';\n if (segment.minValue !== undefined) {\n state.setSegment(segment.type, segment.minValue);\n }\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') {\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', 12);\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 let allowsZero = segment.minValue === 0;\n if (segment.type === 'hour' && state.dateFormatter.resolvedOptions().hour12) {\n switch (state.dateFormatter.resolvedOptions().hourCycle) {\n case 'h11':\n if (numberValue > 11) {\n segmentValue = parser.parse(key);\n }\n break;\n case 'h12':\n allowsZero = false;\n if (numberValue > 12) {\n segmentValue = parser.parse(key);\n }\n break;\n }\n\n if (segment.value !== undefined && segment.value >= 12 && numberValue > 1) {\n numberValue += 12;\n }\n } else if (segment.maxValue !== undefined && numberValue > segment.maxValue) {\n segmentValue = parser.parse(key);\n }\n\n if (isNaN(numberValue)) {\n return;\n }\n\n let shouldSetValue = segmentValue !== 0 || allowsZero;\n if (shouldSetValue) {\n state.setSegment(segment.type, segmentValue);\n }\n\n if (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {\n enteredKeys.current = '';\n if (shouldSetValue) {\n focusManager.focusNext();\n }\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 && ref.current?.contains(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 (document.activeElement === 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 = isIOS() || segment.type === 'timeZoneName' ? {\n role: 'textbox',\n 'aria-valuemax': null,\n 'aria-valuemin': null,\n 'aria-valuetext': null,\n 'aria-valuenow': null\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 ? 'next' : undefined,\n inputMode: state.isDisabled || segment.type === 'dayPeriod' || segment.type === 'era' || !isEditable ? undefined : '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.module.js.map"}
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/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/datepicker';\nimport {getScrollParent, isIOS, isMac, mergeProps, nodeContains, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';\nimport {hookData} from './useDateField';\nimport {NumberParser} from '@internationalized/number';\nimport React, {CSSProperties, useMemo, useRef} from 'react';\nimport {RefObject} from '@react-types/shared';\nimport {useDateFormatter, useFilter, useLocale} from '@react-aria/i18n';\nimport {useDisplayNames} from './useDisplayNames';\nimport {useSpinButton} from '@react-aria/spinbutton';\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(segment: DateSegment, state: DateFieldState, ref: RefObject<HTMLElement | null>): 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 (segment.maxValue !== undefined && (Number(numberValue + '0') > segment.maxValue || newValue.length >= String(segment.maxValue).length)) {\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 (document.activeElement === 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 = isIOS() || segment.type === 'timeZoneName' ? {\n role: 'textbox',\n 'aria-valuemax': null,\n 'aria-valuemin': null,\n 'aria-valuetext': null,\n 'aria-valuenow': null\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 ? 'next' : undefined,\n inputMode: state.isDisabled || segment.type === 'dayPeriod' || segment.type === 'era' || !isEditable ? undefined : '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.module.js.map"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@react-aria/datepicker",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.16.0",
|
|
4
4
|
"description": "Spectrum UI components in React",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"main": "dist/main.js",
|
|
@@ -26,23 +26,23 @@
|
|
|
26
26
|
"url": "https://github.com/adobe/react-spectrum"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@internationalized/date": "^3.
|
|
29
|
+
"@internationalized/date": "^3.11.0",
|
|
30
30
|
"@internationalized/number": "^3.6.5",
|
|
31
31
|
"@internationalized/string": "^3.2.7",
|
|
32
|
-
"@react-aria/focus": "^3.21.
|
|
33
|
-
"@react-aria/form": "^3.1.
|
|
34
|
-
"@react-aria/i18n": "^3.12.
|
|
35
|
-
"@react-aria/interactions": "^3.
|
|
36
|
-
"@react-aria/label": "^3.7.
|
|
37
|
-
"@react-aria/spinbutton": "^3.7.
|
|
38
|
-
"@react-aria/utils": "^3.
|
|
39
|
-
"@react-stately/datepicker": "^3.
|
|
40
|
-
"@react-stately/form": "^3.2.
|
|
41
|
-
"@react-types/button": "^3.
|
|
42
|
-
"@react-types/calendar": "^3.8.
|
|
43
|
-
"@react-types/datepicker": "^3.13.
|
|
44
|
-
"@react-types/dialog": "^3.5.
|
|
45
|
-
"@react-types/shared": "^3.
|
|
32
|
+
"@react-aria/focus": "^3.21.4",
|
|
33
|
+
"@react-aria/form": "^3.1.4",
|
|
34
|
+
"@react-aria/i18n": "^3.12.15",
|
|
35
|
+
"@react-aria/interactions": "^3.27.0",
|
|
36
|
+
"@react-aria/label": "^3.7.24",
|
|
37
|
+
"@react-aria/spinbutton": "^3.7.1",
|
|
38
|
+
"@react-aria/utils": "^3.33.0",
|
|
39
|
+
"@react-stately/datepicker": "^3.16.0",
|
|
40
|
+
"@react-stately/form": "^3.2.3",
|
|
41
|
+
"@react-types/button": "^3.15.0",
|
|
42
|
+
"@react-types/calendar": "^3.8.2",
|
|
43
|
+
"@react-types/datepicker": "^3.13.4",
|
|
44
|
+
"@react-types/dialog": "^3.5.23",
|
|
45
|
+
"@react-types/shared": "^3.33.0",
|
|
46
46
|
"@swc/helpers": "^0.5.0"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
@@ -52,5 +52,5 @@
|
|
|
52
52
|
"publishConfig": {
|
|
53
53
|
"access": "public"
|
|
54
54
|
},
|
|
55
|
-
"gitHead": "
|
|
55
|
+
"gitHead": "66e51757606b43a89ed02c574ca24517323a2ab9"
|
|
56
56
|
}
|
package/src/useDatePicker.ts
CHANGED
|
@@ -17,7 +17,7 @@ import {CalendarProps} from '@react-types/calendar';
|
|
|
17
17
|
import {createFocusManager} from '@react-aria/focus';
|
|
18
18
|
import {DatePickerState} from '@react-stately/datepicker';
|
|
19
19
|
import {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';
|
|
20
|
-
import {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';
|
|
20
|
+
import {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';
|
|
21
21
|
// @ts-ignore
|
|
22
22
|
import intlMessages from '../intl/*.json';
|
|
23
23
|
import {privateValidationStateProp} from '@react-stately/form';
|
|
@@ -84,7 +84,7 @@ export function useDatePicker<T extends DateValue>(props: AriaDatePickerProps<T>
|
|
|
84
84
|
onBlurWithin: e => {
|
|
85
85
|
// Ignore when focus moves into the popover.
|
|
86
86
|
let dialog = document.getElementById(dialogId);
|
|
87
|
-
if (!dialog
|
|
87
|
+
if (!nodeContains(dialog, e.relatedTarget)) {
|
|
88
88
|
isFocused.current = false;
|
|
89
89
|
props.onBlur?.(e);
|
|
90
90
|
props.onFocusChange?.(false);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import {createFocusManager, getFocusableTreeWalker} from '@react-aria/focus';
|
|
2
2
|
import {DateFieldState, DatePickerState, DateRangePickerState} from '@react-stately/datepicker';
|
|
3
3
|
import {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';
|
|
4
|
-
import {mergeProps} from '@react-aria/utils';
|
|
4
|
+
import {mergeProps, nodeContains} from '@react-aria/utils';
|
|
5
5
|
import {useLocale} from '@react-aria/i18n';
|
|
6
6
|
import {useMemo} from 'react';
|
|
7
7
|
import {usePress} from '@react-aria/interactions';
|
|
@@ -12,7 +12,7 @@ export function useDatePickerGroup(state: DatePickerState | DateRangePickerState
|
|
|
12
12
|
|
|
13
13
|
// Open the popover on alt + arrow down
|
|
14
14
|
let onKeyDown = (e: KeyboardEvent) => {
|
|
15
|
-
if (!e.currentTarget
|
|
15
|
+
if (!nodeContains(e.currentTarget, e.target as Element)) {
|
|
16
16
|
return;
|
|
17
17
|
}
|
|
18
18
|
|
|
@@ -18,7 +18,7 @@ import {DateRange, RangeCalendarProps} from '@react-types/calendar';
|
|
|
18
18
|
import {DateRangePickerState} from '@react-stately/datepicker';
|
|
19
19
|
import {DEFAULT_VALIDATION_RESULT, mergeValidation, privateValidationStateProp} from '@react-stately/form';
|
|
20
20
|
import {DOMAttributes, GroupDOMAttributes, KeyboardEvent, RefObject, ValidationResult} from '@react-types/shared';
|
|
21
|
-
import {filterDOMProps, mergeProps, useDescription, useId} from '@react-aria/utils';
|
|
21
|
+
import {filterDOMProps, mergeProps, nodeContains, useDescription, useId} from '@react-aria/utils';
|
|
22
22
|
import {focusManagerSymbol, roleSymbol} from './useDateField';
|
|
23
23
|
// @ts-ignore
|
|
24
24
|
import intlMessages from '../intl/*.json';
|
|
@@ -116,7 +116,7 @@ export function useDateRangePicker<T extends DateValue>(props: AriaDateRangePick
|
|
|
116
116
|
onBlurWithin: e => {
|
|
117
117
|
// Ignore when focus moves into the popover.
|
|
118
118
|
let dialog = document.getElementById(dialogId);
|
|
119
|
-
if (!dialog
|
|
119
|
+
if (!nodeContains(dialog, e.relatedTarget)) {
|
|
120
120
|
isFocused.current = false;
|
|
121
121
|
props.onBlur?.(e);
|
|
122
122
|
props.onFocusChange?.(false);
|