@react-aria/datepicker 3.16.0 → 3.16.1
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/useDatePickerGroup.main.js +4 -5
- package/dist/useDatePickerGroup.main.js.map +1 -1
- package/dist/useDatePickerGroup.mjs +5 -6
- package/dist/useDatePickerGroup.module.js +5 -6
- package/dist/useDatePickerGroup.module.js.map +1 -1
- package/dist/useDateSegment.main.js +1 -1
- package/dist/useDateSegment.main.js.map +1 -1
- package/dist/useDateSegment.mjs +2 -2
- package/dist/useDateSegment.module.js +2 -2
- package/dist/useDateSegment.module.js.map +1 -1
- package/package.json +17 -17
- package/src/useDatePickerGroup.ts +5 -5
- package/src/useDateSegment.ts +2 -2
|
@@ -22,7 +22,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
22
22
|
]);
|
|
23
23
|
// Open the popover on alt + arrow down
|
|
24
24
|
let onKeyDown = (e)=>{
|
|
25
|
-
if (!(0, $19S5E$reactariautils.nodeContains)(e.currentTarget,
|
|
25
|
+
if (!(0, $19S5E$reactariautils.nodeContains)(e.currentTarget, (0, $19S5E$reactariautils.getEventTarget)(e))) return;
|
|
26
26
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
27
27
|
e.preventDefault();
|
|
28
28
|
e.stopPropagation();
|
|
@@ -35,7 +35,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
35
35
|
e.stopPropagation();
|
|
36
36
|
if (direction === 'rtl') {
|
|
37
37
|
if (ref.current) {
|
|
38
|
-
let target = e
|
|
38
|
+
let target = (0, $19S5E$reactariautils.getEventTarget)(e);
|
|
39
39
|
let prev = $715562ad3b4cced4$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
40
40
|
if (prev) prev.focus();
|
|
41
41
|
}
|
|
@@ -46,7 +46,7 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
46
46
|
e.stopPropagation();
|
|
47
47
|
if (direction === 'rtl') {
|
|
48
48
|
if (ref.current) {
|
|
49
|
-
let target = e
|
|
49
|
+
let target = (0, $19S5E$reactariautils.getEventTarget)(e);
|
|
50
50
|
let next = $715562ad3b4cced4$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
51
51
|
if (next) next.focus();
|
|
52
52
|
}
|
|
@@ -56,10 +56,9 @@ function $715562ad3b4cced4$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
56
56
|
};
|
|
57
57
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
58
58
|
let focusLast = ()=>{
|
|
59
|
-
var _window_event;
|
|
60
59
|
if (!ref.current) return;
|
|
61
60
|
// Try to find the segment prior to the element that was clicked on.
|
|
62
|
-
let target =
|
|
61
|
+
let target = window.event ? (0, $19S5E$reactariautils.getEventTarget)(window.event) : null;
|
|
63
62
|
let walker = (0, $19S5E$reactariafocus.getFocusableTreeWalker)(ref.current, {
|
|
64
63
|
tabbable: true
|
|
65
64
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;;;;;;;AAQO,SAAS,0CAAmB,KAA8D,EAAE,GAA8B,EAAE,sBAAgC;IACjK,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,8BAAQ;IAC1B,IAAI,eAAe,CAAA,GAAA,oBAAM,EAAE,IAAM,CAAA,GAAA,wCAAiB,EAAE,MAAM;QAAC;KAAI;IAE/D,uCAAuC;IACvC,IAAI,YAAY,CAAC;QACf,IAAI,CAAC,CAAA,GAAA,kCAAW,EAAE,EAAE,aAAa,EAAE,EAAE,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePickerGroup.ts"],"sourcesContent":["import {createFocusManager, getFocusableTreeWalker} from '@react-aria/focus';\nimport {DateFieldState, DatePickerState, DateRangePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {getEventTarget, mergeProps, nodeContains} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useMemo} from 'react';\nimport {usePress} from '@react-aria/interactions';\n\nexport function useDatePickerGroup(state: DatePickerState | DateRangePickerState | DateFieldState, ref: RefObject<Element | null>, disableArrowNavigation?: boolean): DOMAttributes<FocusableElement> {\n let {direction} = useLocale();\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n // Open the popover on alt + arrow down\n let onKeyDown = (e: KeyboardEvent) => {\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {\n return;\n }\n\n if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true);\n }\n\n if (disableArrowNavigation) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);\n\n if (prev) {\n prev.focus();\n }\n }\n } else {\n focusManager.focusPrevious();\n }\n break;\n case 'ArrowRight':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);\n\n if (next) {\n next.focus();\n }\n }\n } else {\n focusManager.focusNext();\n }\n break;\n }\n };\n\n // Focus the first placeholder segment from the end on mouse down/touch up in the field.\n let focusLast = () => {\n if (!ref.current) {\n return;\n }\n // Try to find the segment prior to the element that was clicked on.\n let target = window.event ? getEventTarget(window.event) as FocusableElement : null;\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n if (target) {\n walker.currentNode = target;\n target = walker.previousNode() as FocusableElement;\n }\n\n // If no target found, find the last element from the end.\n if (!target) {\n let last: FocusableElement;\n do {\n last = walker.lastChild() as FocusableElement;\n if (last) {\n target = last;\n }\n } while (last);\n }\n\n // Now go backwards until we find an element that is not a placeholder.\n while (target?.hasAttribute('data-placeholder')) {\n let prev = walker.previousNode() as FocusableElement;\n if (prev && prev.hasAttribute('data-placeholder')) {\n target = prev;\n } else {\n break;\n }\n }\n\n if (target) {\n target.focus();\n }\n };\n\n let {pressProps} = usePress({\n preventFocusOnPress: true,\n allowTextSelectionOnPress: true,\n onPressStart(e) {\n if (e.pointerType === 'mouse') {\n focusLast();\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' || e.pointerType === 'pen') {\n focusLast();\n }\n }\n });\n\n return mergeProps(pressProps, {onKeyDown});\n}\n\nfunction findNextSegment(group: Element, fromX: number, direction: number) {\n let walker = getFocusableTreeWalker(group, {tabbable: true});\n let node = walker.nextNode();\n let closest: FocusableElement | null = null;\n let closestDistance = Infinity;\n while (node) {\n let x = (node as Element).getBoundingClientRect().left;\n let distance = x - fromX;\n let absoluteDistance = Math.abs(distance);\n if (Math.sign(distance) === direction && absoluteDistance < closestDistance) {\n closest = node as FocusableElement;\n closestDistance = absoluteDistance;\n }\n node = walker.nextNode();\n }\n return closest;\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.main.js.map"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {createFocusManager as $7CEvq$createFocusManager, getFocusableTreeWalker as $7CEvq$getFocusableTreeWalker} from "@react-aria/focus";
|
|
2
|
-
import {nodeContains as $7CEvq$nodeContains, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {nodeContains as $7CEvq$nodeContains, getEventTarget as $7CEvq$getEventTarget, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {useLocale as $7CEvq$useLocale} from "@react-aria/i18n";
|
|
4
4
|
import {useMemo as $7CEvq$useMemo} from "react";
|
|
5
5
|
import {usePress as $7CEvq$usePress} from "@react-aria/interactions";
|
|
@@ -16,7 +16,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
16
16
|
]);
|
|
17
17
|
// Open the popover on alt + arrow down
|
|
18
18
|
let onKeyDown = (e)=>{
|
|
19
|
-
if (!(0, $7CEvq$nodeContains)(e.currentTarget, e
|
|
19
|
+
if (!(0, $7CEvq$nodeContains)(e.currentTarget, (0, $7CEvq$getEventTarget)(e))) return;
|
|
20
20
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
21
21
|
e.preventDefault();
|
|
22
22
|
e.stopPropagation();
|
|
@@ -29,7 +29,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
29
29
|
e.stopPropagation();
|
|
30
30
|
if (direction === 'rtl') {
|
|
31
31
|
if (ref.current) {
|
|
32
|
-
let target = e
|
|
32
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
33
33
|
let prev = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
34
34
|
if (prev) prev.focus();
|
|
35
35
|
}
|
|
@@ -40,7 +40,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
40
40
|
e.stopPropagation();
|
|
41
41
|
if (direction === 'rtl') {
|
|
42
42
|
if (ref.current) {
|
|
43
|
-
let target = e
|
|
43
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
44
44
|
let next = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
45
45
|
if (next) next.focus();
|
|
46
46
|
}
|
|
@@ -50,10 +50,9 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
50
50
|
};
|
|
51
51
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
52
52
|
let focusLast = ()=>{
|
|
53
|
-
var _window_event;
|
|
54
53
|
if (!ref.current) return;
|
|
55
54
|
// Try to find the segment prior to the element that was clicked on.
|
|
56
|
-
let target =
|
|
55
|
+
let target = window.event ? (0, $7CEvq$getEventTarget)(window.event) : null;
|
|
57
56
|
let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {
|
|
58
57
|
tabbable: true
|
|
59
58
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {createFocusManager as $7CEvq$createFocusManager, getFocusableTreeWalker as $7CEvq$getFocusableTreeWalker} from "@react-aria/focus";
|
|
2
|
-
import {nodeContains as $7CEvq$nodeContains, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
2
|
+
import {nodeContains as $7CEvq$nodeContains, getEventTarget as $7CEvq$getEventTarget, mergeProps as $7CEvq$mergeProps} from "@react-aria/utils";
|
|
3
3
|
import {useLocale as $7CEvq$useLocale} from "@react-aria/i18n";
|
|
4
4
|
import {useMemo as $7CEvq$useMemo} from "react";
|
|
5
5
|
import {usePress as $7CEvq$usePress} from "@react-aria/interactions";
|
|
@@ -16,7 +16,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
16
16
|
]);
|
|
17
17
|
// Open the popover on alt + arrow down
|
|
18
18
|
let onKeyDown = (e)=>{
|
|
19
|
-
if (!(0, $7CEvq$nodeContains)(e.currentTarget, e
|
|
19
|
+
if (!(0, $7CEvq$nodeContains)(e.currentTarget, (0, $7CEvq$getEventTarget)(e))) return;
|
|
20
20
|
if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {
|
|
21
21
|
e.preventDefault();
|
|
22
22
|
e.stopPropagation();
|
|
@@ -29,7 +29,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
29
29
|
e.stopPropagation();
|
|
30
30
|
if (direction === 'rtl') {
|
|
31
31
|
if (ref.current) {
|
|
32
|
-
let target = e
|
|
32
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
33
33
|
let prev = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
34
34
|
if (prev) prev.focus();
|
|
35
35
|
}
|
|
@@ -40,7 +40,7 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
40
40
|
e.stopPropagation();
|
|
41
41
|
if (direction === 'rtl') {
|
|
42
42
|
if (ref.current) {
|
|
43
|
-
let target = e
|
|
43
|
+
let target = (0, $7CEvq$getEventTarget)(e);
|
|
44
44
|
let next = $3dfb0f96be0d6a08$var$findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
45
45
|
if (next) next.focus();
|
|
46
46
|
}
|
|
@@ -50,10 +50,9 @@ function $3dfb0f96be0d6a08$export$4a931266a3838b86(state, ref, disableArrowNavig
|
|
|
50
50
|
};
|
|
51
51
|
// Focus the first placeholder segment from the end on mouse down/touch up in the field.
|
|
52
52
|
let focusLast = ()=>{
|
|
53
|
-
var _window_event;
|
|
54
53
|
if (!ref.current) return;
|
|
55
54
|
// Try to find the segment prior to the element that was clicked on.
|
|
56
|
-
let target =
|
|
55
|
+
let target = window.event ? (0, $7CEvq$getEventTarget)(window.event) : null;
|
|
57
56
|
let walker = (0, $7CEvq$getFocusableTreeWalker)(ref.current, {
|
|
58
57
|
tabbable: true
|
|
59
58
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;AAQO,SAAS,0CAAmB,KAA8D,EAAE,GAA8B,EAAE,sBAAgC;IACjK,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,IAAI,eAAe,CAAA,GAAA,cAAM,EAAE,IAAM,CAAA,GAAA,yBAAiB,EAAE,MAAM;QAAC;KAAI;IAE/D,uCAAuC;IACvC,IAAI,YAAY,CAAC;QACf,IAAI,CAAC,CAAA,GAAA,mBAAW,EAAE,EAAE,aAAa,EAAE,EAAE,
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-aria/datepicker/src/useDatePickerGroup.ts"],"sourcesContent":["import {createFocusManager, getFocusableTreeWalker} from '@react-aria/focus';\nimport {DateFieldState, DatePickerState, DateRangePickerState} from '@react-stately/datepicker';\nimport {DOMAttributes, FocusableElement, KeyboardEvent, RefObject} from '@react-types/shared';\nimport {getEventTarget, mergeProps, nodeContains} from '@react-aria/utils';\nimport {useLocale} from '@react-aria/i18n';\nimport {useMemo} from 'react';\nimport {usePress} from '@react-aria/interactions';\n\nexport function useDatePickerGroup(state: DatePickerState | DateRangePickerState | DateFieldState, ref: RefObject<Element | null>, disableArrowNavigation?: boolean): DOMAttributes<FocusableElement> {\n let {direction} = useLocale();\n let focusManager = useMemo(() => createFocusManager(ref), [ref]);\n\n // Open the popover on alt + arrow down\n let onKeyDown = (e: KeyboardEvent) => {\n if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {\n return;\n }\n\n if (e.altKey && (e.key === 'ArrowDown' || e.key === 'ArrowUp') && 'setOpen' in state) {\n e.preventDefault();\n e.stopPropagation();\n state.setOpen(true);\n }\n\n if (disableArrowNavigation) {\n return;\n }\n\n switch (e.key) {\n case 'ArrowLeft':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);\n\n if (prev) {\n prev.focus();\n }\n }\n } else {\n focusManager.focusPrevious();\n }\n break;\n case 'ArrowRight':\n e.preventDefault();\n e.stopPropagation();\n if (direction === 'rtl') {\n if (ref.current) {\n let target = getEventTarget(e) as FocusableElement;\n let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);\n\n if (next) {\n next.focus();\n }\n }\n } else {\n focusManager.focusNext();\n }\n break;\n }\n };\n\n // Focus the first placeholder segment from the end on mouse down/touch up in the field.\n let focusLast = () => {\n if (!ref.current) {\n return;\n }\n // Try to find the segment prior to the element that was clicked on.\n let target = window.event ? getEventTarget(window.event) as FocusableElement : null;\n let walker = getFocusableTreeWalker(ref.current, {tabbable: true});\n if (target) {\n walker.currentNode = target;\n target = walker.previousNode() as FocusableElement;\n }\n\n // If no target found, find the last element from the end.\n if (!target) {\n let last: FocusableElement;\n do {\n last = walker.lastChild() as FocusableElement;\n if (last) {\n target = last;\n }\n } while (last);\n }\n\n // Now go backwards until we find an element that is not a placeholder.\n while (target?.hasAttribute('data-placeholder')) {\n let prev = walker.previousNode() as FocusableElement;\n if (prev && prev.hasAttribute('data-placeholder')) {\n target = prev;\n } else {\n break;\n }\n }\n\n if (target) {\n target.focus();\n }\n };\n\n let {pressProps} = usePress({\n preventFocusOnPress: true,\n allowTextSelectionOnPress: true,\n onPressStart(e) {\n if (e.pointerType === 'mouse') {\n focusLast();\n }\n },\n onPress(e) {\n if (e.pointerType === 'touch' || e.pointerType === 'pen') {\n focusLast();\n }\n }\n });\n\n return mergeProps(pressProps, {onKeyDown});\n}\n\nfunction findNextSegment(group: Element, fromX: number, direction: number) {\n let walker = getFocusableTreeWalker(group, {tabbable: true});\n let node = walker.nextNode();\n let closest: FocusableElement | null = null;\n let closestDistance = Infinity;\n while (node) {\n let x = (node as Element).getBoundingClientRect().left;\n let distance = x - fromX;\n let absoluteDistance = Math.abs(distance);\n if (Math.sign(distance) === direction && absoluteDistance < closestDistance) {\n closest = node as FocusableElement;\n closestDistance = absoluteDistance;\n }\n node = walker.nextNode();\n }\n return closest;\n}\n"],"names":[],"version":3,"file":"useDatePickerGroup.module.js.map"}
|
|
@@ -276,7 +276,7 @@ function $5c015c6316d1904d$export$1315d136e6f7581(segment, state, ref) {
|
|
|
276
276
|
let element = ref.current;
|
|
277
277
|
return ()=>{
|
|
278
278
|
// If the focused segment is removed, focus the previous one, or the next one if there was no previous one.
|
|
279
|
-
if (
|
|
279
|
+
if ((0, $5Tgzj$reactariautils.getActiveElement)() === element) {
|
|
280
280
|
let prev = focusManager.focusPrevious();
|
|
281
281
|
if (!prev) focusManager.focusNext();
|
|
282
282
|
}
|
|
@@ -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, 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"}
|
|
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 {getActiveElement, 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 (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 = 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, 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";
|
|
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, getActiveElement as $4d1jn$getActiveElement, 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";
|
|
@@ -266,7 +266,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
266
266
|
let element = ref.current;
|
|
267
267
|
return ()=>{
|
|
268
268
|
// If the focused segment is removed, focus the previous one, or the next one if there was no previous one.
|
|
269
|
-
if (
|
|
269
|
+
if ((0, $4d1jn$getActiveElement)() === element) {
|
|
270
270
|
let prev = focusManager.focusPrevious();
|
|
271
271
|
if (!prev) focusManager.focusNext();
|
|
272
272
|
}
|
|
@@ -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, 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";
|
|
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, getActiveElement as $4d1jn$getActiveElement, 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";
|
|
@@ -266,7 +266,7 @@ function $32489daedd52963e$export$1315d136e6f7581(segment, state, ref) {
|
|
|
266
266
|
let element = ref.current;
|
|
267
267
|
return ()=>{
|
|
268
268
|
// If the focused segment is removed, focus the previous one, or the next one if there was no previous one.
|
|
269
|
-
if (
|
|
269
|
+
if ((0, $4d1jn$getActiveElement)() === element) {
|
|
270
270
|
let prev = focusManager.focusPrevious();
|
|
271
271
|
if (!prev) focusManager.focusNext();
|
|
272
272
|
}
|
|
@@ -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, 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"}
|
|
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 {getActiveElement, 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 (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 = 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.16.
|
|
3
|
+
"version": "3.16.1",
|
|
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.12.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.27.
|
|
36
|
-
"@react-aria/label": "^3.7.
|
|
37
|
-
"@react-aria/spinbutton": "^3.7.
|
|
38
|
-
"@react-aria/utils": "^3.33.
|
|
39
|
-
"@react-stately/datepicker": "^3.16.
|
|
40
|
-
"@react-stately/form": "^3.2.
|
|
41
|
-
"@react-types/button": "^3.15.
|
|
42
|
-
"@react-types/calendar": "^3.8.
|
|
43
|
-
"@react-types/datepicker": "^3.13.
|
|
44
|
-
"@react-types/dialog": "^3.5.
|
|
45
|
-
"@react-types/shared": "^3.33.
|
|
32
|
+
"@react-aria/focus": "^3.21.5",
|
|
33
|
+
"@react-aria/form": "^3.1.5",
|
|
34
|
+
"@react-aria/i18n": "^3.12.16",
|
|
35
|
+
"@react-aria/interactions": "^3.27.1",
|
|
36
|
+
"@react-aria/label": "^3.7.25",
|
|
37
|
+
"@react-aria/spinbutton": "^3.7.2",
|
|
38
|
+
"@react-aria/utils": "^3.33.1",
|
|
39
|
+
"@react-stately/datepicker": "^3.16.1",
|
|
40
|
+
"@react-stately/form": "^3.2.4",
|
|
41
|
+
"@react-types/button": "^3.15.1",
|
|
42
|
+
"@react-types/calendar": "^3.8.3",
|
|
43
|
+
"@react-types/datepicker": "^3.13.5",
|
|
44
|
+
"@react-types/dialog": "^3.5.24",
|
|
45
|
+
"@react-types/shared": "^3.33.1",
|
|
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": "8df187370053aa35f553cb388ad670f65e1ab371"
|
|
56
56
|
}
|
|
@@ -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, nodeContains} from '@react-aria/utils';
|
|
4
|
+
import {getEventTarget, 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 (!nodeContains(e.currentTarget, e
|
|
15
|
+
if (!nodeContains(e.currentTarget, getEventTarget(e) as Element)) {
|
|
16
16
|
return;
|
|
17
17
|
}
|
|
18
18
|
|
|
@@ -32,7 +32,7 @@ export function useDatePickerGroup(state: DatePickerState | DateRangePickerState
|
|
|
32
32
|
e.stopPropagation();
|
|
33
33
|
if (direction === 'rtl') {
|
|
34
34
|
if (ref.current) {
|
|
35
|
-
let target = e
|
|
35
|
+
let target = getEventTarget(e) as FocusableElement;
|
|
36
36
|
let prev = findNextSegment(ref.current, target.getBoundingClientRect().left, -1);
|
|
37
37
|
|
|
38
38
|
if (prev) {
|
|
@@ -48,7 +48,7 @@ export function useDatePickerGroup(state: DatePickerState | DateRangePickerState
|
|
|
48
48
|
e.stopPropagation();
|
|
49
49
|
if (direction === 'rtl') {
|
|
50
50
|
if (ref.current) {
|
|
51
|
-
let target = e
|
|
51
|
+
let target = getEventTarget(e) as FocusableElement;
|
|
52
52
|
let next = findNextSegment(ref.current, target.getBoundingClientRect().left, 1);
|
|
53
53
|
|
|
54
54
|
if (next) {
|
|
@@ -68,7 +68,7 @@ export function useDatePickerGroup(state: DatePickerState | DateRangePickerState
|
|
|
68
68
|
return;
|
|
69
69
|
}
|
|
70
70
|
// Try to find the segment prior to the element that was clicked on.
|
|
71
|
-
let target = window.event
|
|
71
|
+
let target = window.event ? getEventTarget(window.event) as FocusableElement : null;
|
|
72
72
|
let walker = getFocusableTreeWalker(ref.current, {tabbable: true});
|
|
73
73
|
if (target) {
|
|
74
74
|
walker.currentNode = target;
|
package/src/useDateSegment.ts
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
|
|
13
13
|
import {CalendarDate, toCalendar} from '@internationalized/date';
|
|
14
14
|
import {DateFieldState, DateSegment} from '@react-stately/datepicker';
|
|
15
|
-
import {getScrollParent, isIOS, isMac, mergeProps, nodeContains, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';
|
|
15
|
+
import {getActiveElement, getScrollParent, isIOS, isMac, mergeProps, nodeContains, scrollIntoViewport, useEvent, useId, useLabels, useLayoutEffect} from '@react-aria/utils';
|
|
16
16
|
import {hookData} from './useDateField';
|
|
17
17
|
import {NumberParser} from '@internationalized/number';
|
|
18
18
|
import React, {CSSProperties, useMemo, useRef} from 'react';
|
|
@@ -311,7 +311,7 @@ export function useDateSegment(segment: DateSegment, state: DateFieldState, ref:
|
|
|
311
311
|
let element = ref.current;
|
|
312
312
|
return () => {
|
|
313
313
|
// If the focused segment is removed, focus the previous one, or the next one if there was no previous one.
|
|
314
|
-
if (
|
|
314
|
+
if (getActiveElement() === element) {
|
|
315
315
|
let prev = focusManager.focusPrevious();
|
|
316
316
|
if (!prev) {
|
|
317
317
|
focusManager.focusNext();
|