@astryxdesign/core 0.1.2-canary.bd8c3d3 → 0.1.2-canary.bfcbf64
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/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +11 -5
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +20 -4
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +11 -11
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +4 -2
- package/dist/CheckboxList/CheckboxList.d.ts.map +1 -1
- package/dist/CheckboxList/CheckboxList.js +12 -4
- package/dist/ContextMenu/ContextMenu.d.ts +6 -1
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +58 -7
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +17 -2
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +9 -4
- package/dist/DateTimeInput/DateTimeInput.d.ts +7 -1
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +15 -3
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +12 -0
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +25 -4
- package/dist/Field/Field.d.ts +19 -2
- package/dist/Field/Field.d.ts.map +1 -1
- package/dist/Field/Field.js +4 -0
- package/dist/Field/FieldLabel.d.ts +21 -2
- package/dist/Field/FieldLabel.d.ts.map +1 -1
- package/dist/Field/FieldLabel.js +37 -22
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +27 -6
- package/dist/InputGroup/InputGroup.d.ts.map +1 -1
- package/dist/InputGroup/InputGroup.js +4 -1
- package/dist/Kbd/Kbd.d.ts.map +1 -1
- package/dist/Kbd/Kbd.js +33 -1
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +36 -5
- package/dist/Layout/padding.stylex.d.ts +51 -0
- package/dist/Layout/padding.stylex.d.ts.map +1 -1
- package/dist/Layout/padding.stylex.js +63 -0
- package/dist/Link/Link.d.ts +7 -1
- package/dist/Link/Link.d.ts.map +1 -1
- package/dist/Link/Link.js +12 -4
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +35 -6
- package/dist/MultiSelector/hooks.d.ts +12 -1
- package/dist/MultiSelector/hooks.d.ts.map +1 -1
- package/dist/MultiSelector/hooks.js +14 -1
- package/dist/NavMenu/NavHeadingMenu.d.ts.map +1 -1
- package/dist/NavMenu/NavHeadingMenu.js +17 -2
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +7 -1
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +8 -0
- package/dist/ProgressBar/ProgressBar.js +1 -1
- package/dist/RadioList/RadioList.d.ts +1 -1
- package/dist/RadioList/RadioList.d.ts.map +1 -1
- package/dist/RadioList/RadioList.js +76 -3
- package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControlItem.js +6 -2
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +15 -8
- package/dist/Selector/hooks.d.ts +8 -1
- package/dist/Selector/hooks.d.ts.map +1 -1
- package/dist/Selector/hooks.js +14 -1
- package/dist/Skeleton/Skeleton.d.ts.map +1 -1
- package/dist/Skeleton/Skeleton.js +8 -2
- package/dist/Stack/Stack.d.ts +28 -1
- package/dist/Stack/Stack.d.ts.map +1 -1
- package/dist/Stack/Stack.js +17 -1
- package/dist/Stack/StackItem.d.ts +12 -1
- package/dist/Stack/StackItem.d.ts.map +1 -1
- package/dist/Stack/StackItem.js +8 -1
- package/dist/TabList/Tab.d.ts.map +1 -1
- package/dist/TabList/Tab.js +6 -0
- package/dist/TabList/TabList.d.ts +15 -4
- package/dist/TabList/TabList.d.ts.map +1 -1
- package/dist/TabList/TabList.js +58 -4
- package/dist/TabList/TabListContext.d.ts +5 -0
- package/dist/TabList/TabListContext.d.ts.map +1 -1
- package/dist/TabList/TabListContext.js +5 -0
- package/dist/TabList/TabMenu.js +2 -0
- package/dist/Toast/Toast.d.ts.map +1 -1
- package/dist/Toast/Toast.js +14 -0
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +132 -3
- package/dist/Toolbar/Toolbar.d.ts.map +1 -1
- package/dist/Toolbar/Toolbar.js +7 -3
- package/dist/TreeList/TreeList.d.ts +1 -1
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +78 -2
- package/dist/TreeList/TreeListItem.d.ts +10 -1
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +44 -10
- package/dist/TreeList/treeListItem.markers.stylex.d.ts +16 -0
- package/dist/TreeList/treeListItem.markers.stylex.d.ts.map +1 -0
- package/dist/TreeList/treeListItem.markers.stylex.js +22 -0
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +41 -3
- package/dist/astryx.css +3 -0
- package/dist/astryx.umd.js +47 -47
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/index.d.ts +10 -2
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +6 -2
- package/dist/hooks/useAnnounce.d.ts +40 -0
- package/dist/hooks/useAnnounce.d.ts.map +1 -0
- package/dist/hooks/useAnnounce.js +142 -0
- package/dist/hooks/useClickableContainer.d.ts +16 -1
- package/dist/hooks/useClickableContainer.d.ts.map +1 -1
- package/dist/hooks/useClickableContainer.js +16 -4
- package/dist/hooks/useFocusTrap.d.ts +18 -0
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +65 -0
- package/dist/hooks/useListFocus.d.ts +79 -8
- package/dist/hooks/useListFocus.d.ts.map +1 -1
- package/dist/hooks/useListFocus.js +262 -48
- package/dist/hooks/useLongPress.d.ts +21 -0
- package/dist/hooks/useLongPress.d.ts.map +1 -0
- package/dist/hooks/useLongPress.js +89 -0
- package/dist/hooks/useTreeFocus.d.ts +133 -0
- package/dist/hooks/useTreeFocus.d.ts.map +1 -0
- package/dist/hooks/useTreeFocus.js +274 -0
- package/dist/hooks/useTypeahead.d.ts +63 -0
- package/dist/hooks/useTypeahead.d.ts.map +1 -0
- package/dist/hooks/useTypeahead.js +117 -0
- package/package.json +1 -1
- package/src/Avatar/Avatar.test.tsx +37 -0
- package/src/Avatar/Avatar.tsx +10 -5
- package/src/Breadcrumbs/BreadcrumbItem.tsx +20 -5
- package/src/Breadcrumbs/Breadcrumbs.test.tsx +31 -10
- package/src/Calendar/Calendar.test.tsx +25 -0
- package/src/Calendar/Calendar.tsx +10 -12
- package/src/CheckboxInput/CheckboxInput.test.tsx +14 -25
- package/src/CheckboxInput/CheckboxInput.tsx +4 -2
- package/src/CheckboxList/CheckboxList.test.tsx +30 -14
- package/src/CheckboxList/CheckboxList.tsx +18 -3
- package/src/ContextMenu/ContextMenu.doc.mjs +6 -0
- package/src/ContextMenu/ContextMenu.test.tsx +115 -1
- package/src/ContextMenu/ContextMenu.tsx +75 -4
- package/src/DateInput/DateInput.test.tsx +59 -0
- package/src/DateInput/DateInput.tsx +24 -7
- package/src/DateRangeInput/DateRangeInput.test.tsx +69 -18
- package/src/DateRangeInput/DateRangeInput.tsx +7 -3
- package/src/DateTimeInput/DateTimeInput.doc.mjs +7 -0
- package/src/DateTimeInput/DateTimeInput.test.tsx +99 -6
- package/src/DateTimeInput/DateTimeInput.tsx +32 -3
- package/src/Dialog/Dialog.tsx +12 -0
- package/src/DropdownMenu/DropdownMenu.test.tsx +26 -4
- package/src/DropdownMenu/DropdownMenu.tsx +36 -2
- package/src/Field/Field.test.tsx +32 -0
- package/src/Field/Field.tsx +23 -5
- package/src/Field/FieldLabel.tsx +53 -17
- package/src/FileInput/FileInput.test.tsx +104 -49
- package/src/FileInput/FileInput.tsx +27 -3
- package/src/InputGroup/InputGroup.test.tsx +21 -63
- package/src/InputGroup/InputGroup.tsx +4 -1
- package/src/Kbd/Kbd.test.tsx +22 -4
- package/src/Kbd/Kbd.tsx +35 -3
- package/src/Layer/useLayer.tsx +52 -5
- package/src/Layout/padding.stylex.ts +52 -0
- package/src/Link/Link.doc.mjs +14 -0
- package/src/Link/Link.test.tsx +32 -0
- package/src/Link/Link.tsx +23 -1
- package/src/MultiSelector/MultiSelector.test.tsx +124 -2
- package/src/MultiSelector/MultiSelector.tsx +50 -9
- package/src/MultiSelector/hooks.ts +27 -0
- package/src/NavMenu/NavHeadingMenu.test.tsx +32 -1
- package/src/NavMenu/NavHeadingMenu.tsx +30 -2
- package/src/NumberInput/NumberInput.test.tsx +72 -38
- package/src/NumberInput/NumberInput.tsx +12 -1
- package/src/Pagination/Pagination.test.tsx +58 -5
- package/src/Pagination/Pagination.tsx +12 -0
- package/src/ProgressBar/ProgressBar.test.tsx +34 -26
- package/src/ProgressBar/ProgressBar.tsx +1 -1
- package/src/RadioList/RadioList.test.tsx +129 -14
- package/src/RadioList/RadioList.tsx +103 -8
- package/src/SegmentedControl/SegmentedControl.test.tsx +35 -0
- package/src/SegmentedControl/SegmentedControlItem.tsx +4 -1
- package/src/Selector/Selector.test.tsx +53 -0
- package/src/Selector/Selector.tsx +15 -8
- package/src/Selector/hooks.ts +23 -0
- package/src/Skeleton/Skeleton.test.tsx +25 -0
- package/src/Skeleton/Skeleton.tsx +11 -1
- package/src/Stack/Stack.doc.mjs +57 -0
- package/src/Stack/Stack.test.tsx +55 -5
- package/src/Stack/Stack.tsx +53 -1
- package/src/Stack/StackItem.test.tsx +23 -0
- package/src/Stack/StackItem.tsx +20 -0
- package/src/TabList/Tab.tsx +6 -0
- package/src/TabList/TabList.doc.mjs +6 -0
- package/src/TabList/TabList.test.tsx +167 -0
- package/src/TabList/TabList.tsx +72 -9
- package/src/TabList/TabListContext.ts +7 -3
- package/src/TabList/TabMenu.tsx +3 -3
- package/src/Toast/Toast.tsx +14 -0
- package/src/Toast/ToastViewport.test.tsx +204 -0
- package/src/Toast/ToastViewport.tsx +167 -21
- package/src/Toolbar/Toolbar.test.tsx +45 -0
- package/src/Toolbar/Toolbar.tsx +5 -2
- package/src/TreeList/TreeList.test.tsx +273 -0
- package/src/TreeList/TreeList.tsx +84 -1
- package/src/TreeList/TreeListItem.tsx +42 -2
- package/src/TreeList/treeListItem.markers.stylex.ts +20 -0
- package/src/Typeahead/BaseTypeahead.tsx +48 -2
- package/src/Typeahead/Typeahead.test.tsx +125 -0
- package/src/hooks/index.ts +21 -2
- package/src/hooks/useAnnounce.test.tsx +101 -0
- package/src/hooks/useAnnounce.ts +168 -0
- package/src/hooks/useClickableContainer.ts +16 -4
- package/src/hooks/useFocusTrap.test.tsx +67 -3
- package/src/hooks/useFocusTrap.ts +75 -0
- package/src/hooks/useListFocus.doc.mjs +49 -10
- package/src/hooks/useListFocus.test.tsx +269 -0
- package/src/hooks/useListFocus.ts +339 -54
- package/src/hooks/useLongPress.test.tsx +134 -0
- package/src/hooks/useLongPress.ts +119 -0
- package/src/hooks/useTreeFocus.doc.mjs +126 -0
- package/src/hooks/useTreeFocus.test.tsx +214 -0
- package/src/hooks/useTreeFocus.ts +464 -0
- package/src/hooks/useTypeahead.test.tsx +109 -0
- package/src/hooks/useTypeahead.ts +183 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsC5C;;GAEG;AACH,KAAK,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAExE;;GAEG;AACH,KAAK,iBAAiB,GAClB,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,GAAG,GACH,GAAG,GACH,GAAG,CAAC;AAER;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AAqFD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAsCD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAc,EACd,GAAG,EACH,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+
|
|
1
|
+
{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsC5C;;GAEG;AACH,KAAK,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAExE;;GAEG;AACH,KAAK,iBAAiB,GAClB,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,GAAG,GACH,GAAG,GACH,GAAG,CAAC;AAER;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AAqFD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAsCD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAc,EACd,GAAG,EACH,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAmFb;yBAhGe,MAAM"}
|
package/dist/Avatar/Avatar.js
CHANGED
|
@@ -247,7 +247,12 @@ export function Avatar({
|
|
|
247
247
|
const showFallbackImage = !showImage && fallbackSrc && !fallbackError;
|
|
248
248
|
const showInitials = !showImage && !showFallbackImage && name;
|
|
249
249
|
const showIcon = !showImage && !showFallbackImage && !name;
|
|
250
|
-
|
|
250
|
+
|
|
251
|
+
// A meaningful accessible name comes from `alt` or `name`. With neither, the
|
|
252
|
+
// avatar is decorative — expose it as `presentation`/`aria-hidden` rather than
|
|
253
|
+
// announcing a meaningless generic "Avatar" (obs-9).
|
|
254
|
+
const accessibleName = alt || name;
|
|
255
|
+
const isDecorative = !accessibleName;
|
|
251
256
|
const avatarGroup = useAvatarGroup();
|
|
252
257
|
const resolvedSize = avatarGroup?.size ?? size;
|
|
253
258
|
const numericSize = useMemo(() => resolveSize(resolvedSize), [resolvedSize]);
|
|
@@ -255,8 +260,9 @@ export function Avatar({
|
|
|
255
260
|
value: numericSize,
|
|
256
261
|
children: /*#__PURE__*/_jsxs("div", {
|
|
257
262
|
ref: ref,
|
|
258
|
-
role:
|
|
259
|
-
"aria-label": accessibleName,
|
|
263
|
+
role: isDecorative ? 'presentation' : 'img',
|
|
264
|
+
"aria-label": isDecorative ? undefined : accessibleName,
|
|
265
|
+
"aria-hidden": isDecorative || undefined,
|
|
260
266
|
"data-testid": testId,
|
|
261
267
|
...mergeProps(themeProps('avatar', {
|
|
262
268
|
size: resolvedSize
|
|
@@ -266,14 +272,14 @@ export function Avatar({
|
|
|
266
272
|
...stylex.props(styles.content, dynamicStyles.size(numericSize)),
|
|
267
273
|
children: [showImage && /*#__PURE__*/_jsx("img", {
|
|
268
274
|
src: src,
|
|
269
|
-
alt:
|
|
275
|
+
alt: "",
|
|
270
276
|
onError: () => setImageError(true),
|
|
271
277
|
...{
|
|
272
278
|
className: "xh8yej3 x5yr21d xl1xv1r"
|
|
273
279
|
}
|
|
274
280
|
}), showFallbackImage && /*#__PURE__*/_jsx("img", {
|
|
275
281
|
src: fallbackSrc,
|
|
276
|
-
alt:
|
|
282
|
+
alt: "",
|
|
277
283
|
onError: () => setFallbackError(true),
|
|
278
284
|
...{
|
|
279
285
|
className: "xh8yej3 x5yr21d xl1xv1r"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAIZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAO5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,CAAC,aAAa,CAAC,EACxB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAoFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EAAE,aAAa,EACxB,SAAS,EACT,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,GACtB,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAIZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAO5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,CAAC,aAAa,CAAC,EACxB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAoFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EAAE,aAAa,EACxB,SAAS,EACT,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,GACtB,EAAE,mBAAmB,qBAqJrB;yBAjKe,cAAc"}
|
|
@@ -88,12 +88,20 @@ export function BreadcrumbItem({
|
|
|
88
88
|
const LinkComponent = useLinkComponent(as);
|
|
89
89
|
const isSupporting = ctx.variant === 'supporting';
|
|
90
90
|
const liRef = useRef(null);
|
|
91
|
+
// Points at the element we render to hold the item's content (the
|
|
92
|
+
// link/button/span in the auto-candidate path). Auto-current detection sets
|
|
93
|
+
// aria-current on this instead of guessing the <li>'s last child.
|
|
94
|
+
const contentRef = useRef(null);
|
|
91
95
|
const isCurrent = isCurrentProp === true;
|
|
92
96
|
const isAutoCandidate = isCurrentProp == null;
|
|
93
97
|
|
|
94
98
|
// Auto-detect: if no sibling has aria-current="page" and this is the last
|
|
95
99
|
// non-separator item, set aria-current on our content element.
|
|
96
100
|
// Runs as useEffect (not layout) — only sets an aria attribute, no visual change.
|
|
101
|
+
// Placed on the item's content element (the link/button/span after the
|
|
102
|
+
// separator), matching where the explicit `isCurrent` path sets it, so
|
|
103
|
+
// aria-current lands on the actual interactive element — including when the
|
|
104
|
+
// last item is a link — rather than on the outer <li> (navigation-11).
|
|
97
105
|
useEffect(() => {
|
|
98
106
|
if (!isAutoCandidate) {
|
|
99
107
|
return;
|
|
@@ -112,11 +120,16 @@ export function BreadcrumbItem({
|
|
|
112
120
|
const isLast = items.length > 0 && items[items.length - 1] === li;
|
|
113
121
|
const hasExplicit = ol.querySelector('[aria-current="page"]');
|
|
114
122
|
if (isLast && !hasExplicit) {
|
|
115
|
-
|
|
123
|
+
// We control the element that holds the content (see the auto-candidate
|
|
124
|
+
// render path below), so set aria-current on that ref rather than
|
|
125
|
+
// assuming a positional last child. Fall back to the <li> only if the
|
|
126
|
+
// ref is somehow unresolved.
|
|
127
|
+
const target = contentRef.current ?? li;
|
|
128
|
+
target.setAttribute('aria-current', 'page');
|
|
129
|
+
return () => {
|
|
130
|
+
target.removeAttribute('aria-current');
|
|
131
|
+
};
|
|
116
132
|
}
|
|
117
|
-
return () => {
|
|
118
|
-
li.removeAttribute('aria-current');
|
|
119
|
-
};
|
|
120
133
|
});
|
|
121
134
|
const content = /*#__PURE__*/_jsxs(_Fragment, {
|
|
122
135
|
children: [startIcon && /*#__PURE__*/_jsx("span", {
|
|
@@ -165,6 +178,7 @@ export function BreadcrumbItem({
|
|
|
165
178
|
},
|
|
166
179
|
children: ctx.separator
|
|
167
180
|
}), href != null ? /*#__PURE__*/_jsx(LinkComponent, {
|
|
181
|
+
ref: contentRef,
|
|
168
182
|
href: href,
|
|
169
183
|
onClick: onClick,
|
|
170
184
|
...{
|
|
@@ -177,6 +191,7 @@ export function BreadcrumbItem({
|
|
|
177
191
|
}[!!isSupporting << 0],
|
|
178
192
|
children: content
|
|
179
193
|
}) : onClick != null ? /*#__PURE__*/_jsx("button", {
|
|
194
|
+
ref: contentRef,
|
|
180
195
|
type: "button",
|
|
181
196
|
onClick: onClick,
|
|
182
197
|
...{
|
|
@@ -189,6 +204,7 @@ export function BreadcrumbItem({
|
|
|
189
204
|
}[!!isSupporting << 0],
|
|
190
205
|
children: content
|
|
191
206
|
}) : /*#__PURE__*/_jsx("span", {
|
|
207
|
+
ref: contentRef,
|
|
192
208
|
...{
|
|
193
209
|
0: {
|
|
194
210
|
className: "x78zum5 x6s0dn4 xzye2dw x1pd3egz x1tgivj0"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6C5C,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,GACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,EACV,MAAM,oBAAoB,CAAC;AAI5B,+CAA+C;AAE/C,MAAM,WAAW,cAAc;IAC7B,wEAAwE;IACxE,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;CAC3C;AAID,UAAU,iBAAkB,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,cAAc,CAC5B;IACC,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACtC,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEvB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IAEvD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;CAC1C;AAID,UAAU,mBAAoB,SAAQ,iBAAiB;IACrD,qBAAqB;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;CAC9D;AAED,UAAU,kBAAmB,SAAQ,iBAAiB;IACpD,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IAEd,0BAA0B;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAMrE;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,aAAa,+BA4RtD;yBA5Re,QAAQ"}
|
|
@@ -23,7 +23,7 @@ import { Icon } from "../Icon/index.js";
|
|
|
23
23
|
import { useGridFocus } from "../hooks/index.js";
|
|
24
24
|
import { useCalendarDays, useCalendarConstraints, useCalendarRovingTabindex } from "./hooks/index.js";
|
|
25
25
|
import { calendarStyles, monthGridStyles, dayCellStyles, dayCellTheme } from "./styles.js";
|
|
26
|
-
import { plainDateFromISO, plainDateToISO, plainDateToDate,
|
|
26
|
+
import { plainDateFromISO, plainDateToISO, plainDateToDate, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays, plainDateIsBefore, plainDateIsEqual, plainDateGetWeekNumber, plainDateFormat, DATE_FORMAT_WITH_WEEKDAY, DATE_FORMAT_MONTH_YEAR } from "../utils/plainDate.js";
|
|
27
27
|
import { mergeProps } from "../utils/index.js";
|
|
28
28
|
import { computeDayCellState, computeRangeRounding, computePreviewRounding, isEndpoint } from "./dayCellUtils.js";
|
|
29
29
|
|
|
@@ -361,21 +361,21 @@ function MonthGrid({
|
|
|
361
361
|
selectedDate: selectedDateForTabindex
|
|
362
362
|
});
|
|
363
363
|
|
|
364
|
-
// Helper to get the focused date from the currently focused element
|
|
364
|
+
// Helper to get the focused date from the currently focused element.
|
|
365
|
+
// Reads the machine-readable `data-date` (ISO) attribute rather than parsing
|
|
366
|
+
// the human-readable `aria-label` with `new Date()`, which is locale/format
|
|
367
|
+
// dependent and returns Invalid Date in non-English locales (e.g. fr-FR,
|
|
368
|
+
// ja-JP), silently swallowing month-boundary arrow navigation (complex-4).
|
|
365
369
|
const getFocusedDate = useCallback(() => {
|
|
366
370
|
const activeElement = document.activeElement;
|
|
367
371
|
if (!activeElement) {
|
|
368
372
|
return null;
|
|
369
373
|
}
|
|
370
|
-
const
|
|
371
|
-
if (!
|
|
374
|
+
const iso = activeElement.getAttribute('data-date');
|
|
375
|
+
if (!iso) {
|
|
372
376
|
return null;
|
|
373
377
|
}
|
|
374
|
-
|
|
375
|
-
if (isNaN(parsed.getTime())) {
|
|
376
|
-
return null;
|
|
377
|
-
}
|
|
378
|
-
return plainDateToISO(plainDateFromDate(parsed));
|
|
378
|
+
return iso;
|
|
379
379
|
}, []);
|
|
380
380
|
|
|
381
381
|
// Handle navigation to previous month
|
|
@@ -438,10 +438,10 @@ function MonthGrid({
|
|
|
438
438
|
}
|
|
439
439
|
const buttons = gridRef.current.querySelectorAll('button:not([disabled])');
|
|
440
440
|
const targetPd = plainDateFromISO(pendingFocus);
|
|
441
|
-
const
|
|
441
|
+
const targetIso = plainDateToISO(targetPd);
|
|
442
442
|
let targetButton = null;
|
|
443
443
|
for (const button of buttons) {
|
|
444
|
-
if (button.getAttribute('
|
|
444
|
+
if (button.getAttribute('data-date') === targetIso) {
|
|
445
445
|
targetButton = button;
|
|
446
446
|
break;
|
|
447
447
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAY3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AA4IhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAmCH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,GACJ,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAY3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AA4IhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAmCH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,GACJ,EAAE,kBAAkB,+BAsKpB;yBA5Le,aAAa"}
|
|
@@ -227,7 +227,10 @@ export function CheckboxInput({
|
|
|
227
227
|
const isChecked = optimisticValue === true;
|
|
228
228
|
const isCheckedOrIndeterminate = isChecked || isIndeterminate;
|
|
229
229
|
|
|
230
|
-
// Sync the native indeterminate DOM property (can't be set via JSX
|
|
230
|
+
// Sync the native indeterminate DOM property (can't be set via JSX
|
|
231
|
+
// attribute). On a native checkbox this is the authoritative way to expose
|
|
232
|
+
// the mixed state — a separate aria-checked="mixed" would be redundant and
|
|
233
|
+
// can desync from / override the native state (forms-16), so it is omitted.
|
|
231
234
|
const indeterminateRef = useCallback(el => {
|
|
232
235
|
if (el) {
|
|
233
236
|
el.indeterminate = isIndeterminate;
|
|
@@ -275,7 +278,6 @@ export function CheckboxInput({
|
|
|
275
278
|
},
|
|
276
279
|
onFocus: onFocus,
|
|
277
280
|
onBlur: onBlur,
|
|
278
|
-
"aria-checked": isIndeterminate ? 'mixed' : undefined,
|
|
279
281
|
"aria-readonly": isReadOnly || undefined,
|
|
280
282
|
"aria-describedby": ariaDescribedBy,
|
|
281
283
|
"aria-invalid": status?.type === 'error' ? true : undefined,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxList.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,qBAAqB,CAAC;AAUrD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,MAAM,EACN,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,OAAoB,EACpB,WAAmB,EACnB,UAAkB,EAClB,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,+
|
|
1
|
+
{"version":3,"file":"CheckboxList.d.ts","sourceRoot":"","sources":["../../src/CheckboxList/CheckboxList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,qBAAqB,CAAC;AAUrD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAC7C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1D;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,MAAM,EACN,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,OAAoB,EACpB,WAAmB,EACnB,UAAkB,EAClB,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,UAAU,GAC1B,EAAE,iBAAiB,+BAkGnB;yBArHe,YAAY"}
|
|
@@ -62,6 +62,7 @@ export function CheckboxList({
|
|
|
62
62
|
'data-testid': dataTestId
|
|
63
63
|
}) {
|
|
64
64
|
const inputID = useId();
|
|
65
|
+
const labelElementID = useId();
|
|
65
66
|
const descriptionID = useId();
|
|
66
67
|
const statusMessageID = useId();
|
|
67
68
|
const [, startTransition] = useTransition();
|
|
@@ -97,6 +98,8 @@ export function CheckboxList({
|
|
|
97
98
|
isLabelHidden: isLabelHidden,
|
|
98
99
|
description: description,
|
|
99
100
|
inputID: inputID,
|
|
101
|
+
labelElementID: labelElementID,
|
|
102
|
+
isGroupLabel: true,
|
|
100
103
|
descriptionID: description ? descriptionID : undefined,
|
|
101
104
|
isDisabled: isDisabled,
|
|
102
105
|
status: status ? {
|
|
@@ -113,10 +116,15 @@ export function CheckboxList({
|
|
|
113
116
|
}),
|
|
114
117
|
children: /*#__PURE__*/_jsx(CheckboxListContext, {
|
|
115
118
|
value: contextValue,
|
|
116
|
-
children: /*#__PURE__*/_jsx(
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
119
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
120
|
+
role: "group",
|
|
121
|
+
"aria-labelledby": labelElementID,
|
|
122
|
+
"aria-describedby": [description ? descriptionID : null, status?.message ? statusMessageID : null].filter(Boolean).join(' ') || undefined,
|
|
123
|
+
children: /*#__PURE__*/_jsx(List, {
|
|
124
|
+
density: density,
|
|
125
|
+
hasDividers: hasDividers,
|
|
126
|
+
children: children
|
|
127
|
+
})
|
|
120
128
|
})
|
|
121
129
|
})
|
|
122
130
|
});
|
|
@@ -38,6 +38,11 @@ interface ContextMenuBaseProps extends BaseProps {
|
|
|
38
38
|
menuWidth?: number | string;
|
|
39
39
|
/** Size of menu items. @default 'md' */
|
|
40
40
|
size?: 'sm' | 'md' | 'lg';
|
|
41
|
+
/**
|
|
42
|
+
* Accessible name for the menu surface, announced when it opens.
|
|
43
|
+
* @default 'Context menu'
|
|
44
|
+
*/
|
|
45
|
+
label?: string;
|
|
41
46
|
/**
|
|
42
47
|
* Whether to auto-focus the first menu item when the menu opens.
|
|
43
48
|
* Set to `false` for inline showcases or documentation previews.
|
|
@@ -84,7 +89,7 @@ export type ContextMenuProps = ContextMenuDataProps | ContextMenuCompoundProps;
|
|
|
84
89
|
* </ContextMenu>
|
|
85
90
|
* ```
|
|
86
91
|
*/
|
|
87
|
-
export declare function ContextMenu({ children, menuWidth, size, hasAutoFocus, isDisabled, onOpenChange, ref, className, style, xstyle, 'data-testid': testId, ...props }: ContextMenuProps): React.JSX.Element;
|
|
92
|
+
export declare function ContextMenu({ children, menuWidth, size, label, hasAutoFocus, isDisabled, onOpenChange, ref, className, style, xstyle, 'data-testid': testId, ...props }: ContextMenuProps): React.JSX.Element;
|
|
88
93
|
export declare namespace ContextMenu {
|
|
89
94
|
var displayName: string;
|
|
90
95
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAqBrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACpB,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,8BAA8B,CAAC;AAsCtC,MAAM,MAAM,mBAAmB,GAAG,oBAAoB,CAAC;AAEvD,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAErD,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAErD,MAAM,MAAM,iBAAiB,GAAG,kBAAkB,CAAC;AAMnD,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,+DAA+D;IAC/D,QAAQ,EAAE,SAAS,CAAC;IACpB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,wCAAwC;IACxC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;OAIG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,oBAAqB,SAAQ,oBAAoB;IACzD,gDAAgD;IAChD,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,UAAU,wBAAyB,SAAQ,oBAAoB;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+CAA+C;IAC/C,WAAW,EAAE,SAAS,CAAC;CACxB;AAED,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG,wBAAwB,CAAC;AAM/E;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,SAAS,EACT,IAAW,EACX,KAAsB,EACtB,YAAmB,EACnB,UAAkB,EAClB,YAAY,EACZ,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,aAAa,EAAE,MAAM,EACrB,GAAG,KAAK,EACT,EAAE,gBAAgB,qBAsOlB;yBApPe,WAAW"}
|
|
@@ -30,6 +30,8 @@ import { useLayer } from "../Layer/useLayer.js";
|
|
|
30
30
|
import { renderDropdownItems } from "../DropdownMenu/renderDropdownItems.js";
|
|
31
31
|
import { DropdownMenuContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
32
32
|
import { useListFocus } from "../hooks/useListFocus.js";
|
|
33
|
+
import { useTypeahead } from "../hooks/useTypeahead.js";
|
|
34
|
+
import { useLongPress } from "../hooks/useLongPress.js";
|
|
33
35
|
import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
|
|
34
36
|
import "../theme/tokens.stylex.js";
|
|
35
37
|
import { colorVars, spacingVars, radiusVars, durationVars, easeVars, shadowVars } from "../theme/tokens.stylex.js";
|
|
@@ -107,6 +109,7 @@ export function ContextMenu({
|
|
|
107
109
|
children,
|
|
108
110
|
menuWidth,
|
|
109
111
|
size = 'md',
|
|
112
|
+
label = 'Context menu',
|
|
110
113
|
hasAutoFocus = true,
|
|
111
114
|
isDisabled = false,
|
|
112
115
|
onOpenChange,
|
|
@@ -152,13 +155,22 @@ export function ContextMenu({
|
|
|
152
155
|
const {
|
|
153
156
|
listRef,
|
|
154
157
|
handleKeyDown: listNavKeyDown,
|
|
155
|
-
focusFirst
|
|
158
|
+
focusFirst,
|
|
159
|
+
focusItem
|
|
156
160
|
} = useListFocus({
|
|
157
161
|
itemSelector: '[role="menuitem"]:not([aria-disabled="true"])',
|
|
158
162
|
wrap: false,
|
|
159
163
|
onEscape: closeMenu
|
|
160
164
|
});
|
|
161
165
|
|
|
166
|
+
// First-character typeahead over the enabled menu items (menus-11).
|
|
167
|
+
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')) : [], [listRef]);
|
|
168
|
+
const typeahead = useTypeahead({
|
|
169
|
+
getItemLabels: () => getMenuItems().map(el => el.textContent),
|
|
170
|
+
onMatch: focusItem,
|
|
171
|
+
getCurrentIndex: () => getMenuItems().findIndex(el => el === document.activeElement || el.contains(document.activeElement))
|
|
172
|
+
});
|
|
173
|
+
|
|
162
174
|
// Dismiss on any click outside the menu. We use popover="manual" (not
|
|
163
175
|
// "auto") because the native light-dismiss treats the mouseup from the
|
|
164
176
|
// opening right-click as a dismiss event. Handling it ourselves via
|
|
@@ -212,17 +224,34 @@ export function ContextMenu({
|
|
|
212
224
|
}
|
|
213
225
|
return;
|
|
214
226
|
}
|
|
227
|
+
if (typeahead.onKeyDown(e)) {
|
|
228
|
+
e.preventDefault();
|
|
229
|
+
return;
|
|
230
|
+
}
|
|
215
231
|
listNavKeyDown(e);
|
|
216
|
-
}, [listNavKeyDown]);
|
|
232
|
+
}, [listNavKeyDown, typeahead]);
|
|
217
233
|
const handleContextMenu = useCallback(e => {
|
|
218
234
|
if (isDisabled) {
|
|
219
235
|
return;
|
|
220
236
|
}
|
|
221
237
|
e.preventDefault();
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
238
|
+
// A keyboard-initiated contextmenu (Shift+F10 / the Menu key) fires a
|
|
239
|
+
// `contextmenu` event whose coordinates are (0, 0) in several browsers.
|
|
240
|
+
// Detect that and anchor the menu to the trigger's box instead, so the
|
|
241
|
+
// menu is reachable without a pointer (menus-8).
|
|
242
|
+
const isKeyboardInvoked = e.clientX === 0 && e.clientY === 0 && e.detail === 0;
|
|
243
|
+
if (isKeyboardInvoked && e.currentTarget instanceof HTMLElement) {
|
|
244
|
+
const rect = e.currentTarget.getBoundingClientRect();
|
|
245
|
+
positionRef.current = {
|
|
246
|
+
x: rect.left,
|
|
247
|
+
y: rect.bottom
|
|
248
|
+
};
|
|
249
|
+
} else {
|
|
250
|
+
positionRef.current = {
|
|
251
|
+
x: e.clientX,
|
|
252
|
+
y: e.clientY
|
|
253
|
+
};
|
|
254
|
+
}
|
|
226
255
|
// Remember the element focused before opening so we can restore it on
|
|
227
256
|
// close (Escape or outside-click), instead of dropping focus to <body>.
|
|
228
257
|
triggerFocusRef.current = document.activeElement instanceof HTMLElement ? document.activeElement : e.currentTarget;
|
|
@@ -231,6 +260,24 @@ export function ContextMenu({
|
|
|
231
260
|
requestAnimationFrame(() => focusFirst());
|
|
232
261
|
}
|
|
233
262
|
}, [isDisabled, layer, hasAutoFocus, focusFirst]);
|
|
263
|
+
|
|
264
|
+
// Touch long-press invocation (menus-8). iOS Safari never synthesizes a
|
|
265
|
+
// `contextmenu` event on long-press, so a context menu is otherwise
|
|
266
|
+
// unreachable on touch. Open the menu at the touch point once the press is
|
|
267
|
+
// held long enough (see useLongPress for timer/move-cancel/cleanup logic).
|
|
268
|
+
const longPressHandlers = useLongPress({
|
|
269
|
+
disabled: isDisabled,
|
|
270
|
+
onLongPress: useCallback(point => {
|
|
271
|
+
positionRef.current = {
|
|
272
|
+
x: point.x,
|
|
273
|
+
y: point.y
|
|
274
|
+
};
|
|
275
|
+
layer.show();
|
|
276
|
+
if (hasAutoFocus) {
|
|
277
|
+
requestAnimationFrame(() => focusFirst());
|
|
278
|
+
}
|
|
279
|
+
}, [layer, hasAutoFocus, focusFirst])
|
|
280
|
+
});
|
|
234
281
|
const popoverXstyle = menuWidth ? styles.popoverCustomWidth(menuWidth) : styles.popover;
|
|
235
282
|
const contextValue = useMemo(() => ({
|
|
236
283
|
closeMenu,
|
|
@@ -241,13 +288,17 @@ export function ContextMenu({
|
|
|
241
288
|
children: [/*#__PURE__*/_jsx("div", {
|
|
242
289
|
ref: ref,
|
|
243
290
|
onContextMenu: handleContextMenu,
|
|
244
|
-
|
|
291
|
+
...longPressHandlers,
|
|
245
292
|
"data-testid": testId,
|
|
293
|
+
...{
|
|
294
|
+
className: "xpdipgo"
|
|
295
|
+
},
|
|
246
296
|
children: children
|
|
247
297
|
}), layer.render(/*#__PURE__*/_jsx("div", {
|
|
248
298
|
ref: listRef,
|
|
249
299
|
id: menuId,
|
|
250
300
|
role: "menu",
|
|
301
|
+
"aria-label": label,
|
|
251
302
|
onKeyDown: listKeyDown,
|
|
252
303
|
...mergeProps(themeProps('context-menu'), stylex.props(styles.menu, xstyle), className, style),
|
|
253
304
|
children: /*#__PURE__*/_jsx(DropdownMenuContext, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAU3C,OAAO,EAEL,KAAK,WAAW,EAMjB,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"DateInput.d.ts","sourceRoot":"","sources":["../../src/DateInput/DateInput.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAU3C,OAAO,EAEL,KAAK,WAAW,EAMjB,MAAM,UAAU,CAAC;AAIlB,OAAO,EAAW,KAAK,aAAa,EAAsB,MAAM,aAAa,CAAC;AA4D9E,QAAA,MAAM,UAAU;;;;;;;;;;;;;EAad,CAAC;AAEH,MAAM,MAAM,aAAa,GAAG,MAAM,OAAO,UAAU,CAAC;AAIpD,YAAY,EACV,WAAW,IAAI,eAAe,EAC9B,eAAe,IAAI,mBAAmB,GACvC,MAAM,UAAU,CAAC;AAElB,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,SAAS,EACT,UAAU,GAAG,cAAc,CAC5B;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,CAAC;IAEtD;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,GAAG,SAAS,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAE1E;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;OAEG;IACH,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;OAEG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,aAAa,CAAC;IAErB;;;;OAIG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACxB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,WAA6B,EAC7B,IAAW,EACX,MAAM,EACN,YAAY,EACZ,QAAgB,EAChB,cAAkB,EAClB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,+BAkUhB;yBA5Ve,SAAS"}
|
|
@@ -21,6 +21,7 @@ import "../theme/tokens.stylex.js";
|
|
|
21
21
|
import { colorVars, sizeVars, radiusVars, typographyVars, typeScaleVars, borderVars } from "../theme/tokens.stylex.js";
|
|
22
22
|
import { Field, inputWrapperStyles, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputStatusFocusWithinStyles } from "../Field/index.js";
|
|
23
23
|
import { Icon } from "../Icon/index.js";
|
|
24
|
+
import { VisuallyHidden } from "../VisuallyHidden/index.js";
|
|
24
25
|
import { Spinner } from "../Spinner/index.js";
|
|
25
26
|
import { Calendar } from "../Calendar/index.js";
|
|
26
27
|
import { useCalendarConstraints } from "../Calendar/hooks/index.js";
|
|
@@ -244,11 +245,20 @@ export function DateInput({
|
|
|
244
245
|
if (e.key === 'Escape' && popover.isOpen) {
|
|
245
246
|
e.preventDefault();
|
|
246
247
|
popover.hide();
|
|
248
|
+
} else if ((e.key === 'ArrowDown' || e.altKey && e.key === 'ArrowDown') && !popover.isOpen) {
|
|
249
|
+
// APG combobox: ArrowDown (and Alt+ArrowDown) opens the calendar
|
|
250
|
+
// popover from the keyboard, keeping focus in the input (forms-13).
|
|
251
|
+
e.preventDefault();
|
|
252
|
+
if (!isEffectivelyDisabled) {
|
|
253
|
+
popover.show({
|
|
254
|
+
skipAutoFocus: true
|
|
255
|
+
});
|
|
256
|
+
}
|
|
247
257
|
} else if (e.key === 'Enter') {
|
|
248
258
|
e.preventDefault();
|
|
249
259
|
commitPendingInput();
|
|
250
260
|
}
|
|
251
|
-
}, [popover, commitPendingInput]);
|
|
261
|
+
}, [popover, commitPendingInput, isEffectivelyDisabled]);
|
|
252
262
|
return /*#__PURE__*/_jsxs(Field, {
|
|
253
263
|
label: label,
|
|
254
264
|
isLabelHidden: isLabelHidden,
|
|
@@ -304,7 +314,7 @@ export function DateInput({
|
|
|
304
314
|
disabled: isEffectivelyDisabled,
|
|
305
315
|
"aria-describedby": ariaDescribedBy,
|
|
306
316
|
"aria-required": isRequired === true ? 'true' : undefined,
|
|
307
|
-
"aria-invalid": status?.type === 'error' ? 'true' : undefined,
|
|
317
|
+
"aria-invalid": status?.type === 'error' || !isInputValid ? 'true' : undefined,
|
|
308
318
|
"aria-busy": isBusy || undefined,
|
|
309
319
|
"aria-expanded": popover.isOpen,
|
|
310
320
|
"aria-haspopup": "dialog",
|
|
@@ -325,6 +335,11 @@ export function DateInput({
|
|
|
325
335
|
className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx xjbqb8w x1a2a7pz xeyghm5 x1h6gzvc xv1l7n4"
|
|
326
336
|
}
|
|
327
337
|
}[!!isEffectivelyDisabled << 1 | !!!isInputValid << 0]
|
|
338
|
+
}), /*#__PURE__*/_jsx(VisuallyHidden, {
|
|
339
|
+
as: "div",
|
|
340
|
+
role: "alert",
|
|
341
|
+
"aria-live": "assertive",
|
|
342
|
+
children: !isInputValid ? 'Invalid date' : ''
|
|
328
343
|
}), hasClear && value !== undefined && !isEffectivelyDisabled && /*#__PURE__*/_jsx("button", {
|
|
329
344
|
type: "button",
|
|
330
345
|
onClick: handleClear,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -263,7 +263,7 @@ export function DateRangeInput({
|
|
|
263
263
|
className: "x78zum5"
|
|
264
264
|
},
|
|
265
265
|
children: [presets && presets.length > 0 && /*#__PURE__*/_jsx("div", {
|
|
266
|
-
role: "
|
|
266
|
+
role: "group",
|
|
267
267
|
"aria-label": "Preset date ranges",
|
|
268
268
|
...{
|
|
269
269
|
className: "x78zum5 xdt5ytf xzye2dw x1b2ylru x1pcaw5z x32b0ac xdz7fjg x1d77m7x"
|
|
@@ -272,9 +272,14 @@ export function DateRangeInput({
|
|
|
272
272
|
const presetRange = preset.getRange();
|
|
273
273
|
const isActive = isRangeEqual(value, presetRange);
|
|
274
274
|
return /*#__PURE__*/_jsx("button", {
|
|
275
|
-
type: "button"
|
|
276
|
-
|
|
277
|
-
|
|
275
|
+
type: "button"
|
|
276
|
+
// These presets are independent action buttons navigated by
|
|
277
|
+
// Tab, not a single-tab-stop listbox — so they are a labeled
|
|
278
|
+
// group of buttons, and the currently-applied preset is
|
|
279
|
+
// marked with aria-current (not aria-selected, a listbox
|
|
280
|
+
// concept that contradicted the Tab interaction) (forms-5).
|
|
281
|
+
,
|
|
282
|
+
"aria-current": isActive ? 'true' : undefined,
|
|
278
283
|
onClick: () => handlePresetClick(preset),
|
|
279
284
|
...{
|
|
280
285
|
0: {
|
|
@@ -102,6 +102,12 @@ export interface DateTimeInputProps extends Omit<BaseProps, 'onChange' | 'defaul
|
|
|
102
102
|
* @default "Select a time"
|
|
103
103
|
*/
|
|
104
104
|
timePlaceholder?: string;
|
|
105
|
+
/**
|
|
106
|
+
* Accessible label for the time portion of the field. Defaults to
|
|
107
|
+
* `"{label} time"` so it is tied to the field's own label and localizable,
|
|
108
|
+
* rather than a hardcoded English "Time".
|
|
109
|
+
*/
|
|
110
|
+
timeLabel?: string;
|
|
105
111
|
/**
|
|
106
112
|
* The size of the inputs.
|
|
107
113
|
* @default 'md'
|
|
@@ -145,7 +151,7 @@ export interface DateTimeInputProps extends Omit<BaseProps, 'onChange' | 'defaul
|
|
|
145
151
|
* />
|
|
146
152
|
* ```
|
|
147
153
|
*/
|
|
148
|
-
export declare function DateTimeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, value, onChange, changeAction, isLoading, min, max, dateConstraints, hasSeconds, hourFormat, timeIncrement, hasClear, placeholder, timePlaceholder, size: sizeProp, status, labelTooltip, numberOfMonths, width, xstyle, className, style, ref, ...rest }: DateTimeInputProps): import("react").JSX.Element;
|
|
154
|
+
export declare function DateTimeInput({ label, isLabelHidden, description, isOptional, isRequired, isDisabled, value, onChange, changeAction, isLoading, min, max, dateConstraints, hasSeconds, hourFormat, timeIncrement, hasClear, placeholder, timePlaceholder, timeLabel, size: sizeProp, status, labelTooltip, numberOfMonths, width, xstyle, className, style, ref, ...rest }: DateTimeInputProps): import("react").JSX.Element;
|
|
149
155
|
export declare namespace DateTimeInput {
|
|
150
156
|
var displayName: string;
|
|
151
157
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/DateTimeInput.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAEL,KAAK,WAAW,EAMjB,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"DateTimeInput.d.ts","sourceRoot":"","sources":["../../src/DateTimeInput/DateTimeInput.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAEL,KAAK,WAAW,EAMjB,MAAM,UAAU,CAAC;AA0BlB,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAI9C,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG;IACvC,QAAQ,CAAC,OAAO,EAAE,mBAAmB,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,KAAK,GAAG,KAAK,CAAC;AAEpD,MAAM,MAAM,iBAAiB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEnD,YAAY,EACV,WAAW,IAAI,mBAAmB,EAClC,eAAe,IAAI,uBAAuB,GAC3C,MAAM,UAAU,CAAC;AAiFlB,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAC9C,SAAS,EACT,UAAU,GAAG,cAAc,CAC5B;IACC,8CAA8C;IAC9C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAElC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,KAAK,CAAC,EAAE,iBAAiB,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,KAAK,IAAI,CAAC;IAEzD;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAE9E;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,GAAG,CAAC,EAAE,iBAAiB,CAAC;IAExB;;;OAGG;IACH,GAAG,CAAC,EAAE,iBAAiB,CAAC;IAExB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,UAAU,CAAC,EAAE,uBAAuB,CAAC;IAErC;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IAEzB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IAErB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEvB;;OAEG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAqCD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,GAAG,EACH,GAAG,EACH,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,aAAiB,EACjB,QAAgB,EAChB,WAA6B,EAC7B,eAAiC,EACjC,SAAS,EACT,IAAI,EAAE,QAAQ,EACd,MAAM,EACN,YAAY,EACZ,cAAkB,EAClB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAmiBpB;yBAlkBe,aAAa"}
|
|
@@ -21,6 +21,7 @@ import "../theme/tokens.stylex.js";
|
|
|
21
21
|
import { colorVars, sizeVars, radiusVars, spacingVars, typographyVars, typeScaleVars, borderVars } from "../theme/tokens.stylex.js";
|
|
22
22
|
import { Field, inputWrapperStyles, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputStatusFocusWithinStyles } from "../Field/index.js";
|
|
23
23
|
import { Icon } from "../Icon/index.js";
|
|
24
|
+
import { VisuallyHidden } from "../VisuallyHidden/index.js";
|
|
24
25
|
import { Spinner } from "../Spinner/index.js";
|
|
25
26
|
import { Calendar } from "../Calendar/index.js";
|
|
26
27
|
import { useCalendarConstraints } from "../Calendar/hooks/index.js";
|
|
@@ -130,6 +131,7 @@ export function DateTimeInput({
|
|
|
130
131
|
hasClear = false,
|
|
131
132
|
placeholder = 'Select a date',
|
|
132
133
|
timePlaceholder = 'Select a time',
|
|
134
|
+
timeLabel,
|
|
133
135
|
size: sizeProp,
|
|
134
136
|
status,
|
|
135
137
|
labelTooltip,
|
|
@@ -475,7 +477,7 @@ export function DateTimeInput({
|
|
|
475
477
|
disabled: isEffectivelyDisabled,
|
|
476
478
|
"aria-describedby": ariaDescribedBy,
|
|
477
479
|
"aria-required": isRequired === true ? 'true' : undefined,
|
|
478
|
-
"aria-invalid": status?.type === 'error' ? 'true' : undefined,
|
|
480
|
+
"aria-invalid": status?.type === 'error' || !isDateInputValid ? 'true' : undefined,
|
|
479
481
|
"aria-busy": isBusy || undefined,
|
|
480
482
|
"aria-expanded": popover.isOpen,
|
|
481
483
|
"aria-haspopup": "dialog",
|
|
@@ -496,6 +498,11 @@ export function DateTimeInput({
|
|
|
496
498
|
className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx xjbqb8w x1a2a7pz xeyghm5 x1h6gzvc xv1l7n4"
|
|
497
499
|
}
|
|
498
500
|
}[!!isEffectivelyDisabled << 1 | !!!isDateInputValid << 0]
|
|
501
|
+
}), /*#__PURE__*/_jsx(VisuallyHidden, {
|
|
502
|
+
as: "div",
|
|
503
|
+
role: "alert",
|
|
504
|
+
"aria-live": "assertive",
|
|
505
|
+
children: !isDateInputValid ? 'Invalid date' : ''
|
|
499
506
|
}), hasClear && value !== undefined && !isEffectivelyDisabled && /*#__PURE__*/_jsx("button", {
|
|
500
507
|
type: "button",
|
|
501
508
|
onClick: handleClear,
|
|
@@ -540,9 +547,9 @@ export function DateTimeInput({
|
|
|
540
547
|
onKeyDown: handleTimeKeyDown,
|
|
541
548
|
placeholder: resolvedTimePlaceholder,
|
|
542
549
|
disabled: isEffectivelyDisabled,
|
|
543
|
-
"aria-label":
|
|
550
|
+
"aria-label": timeLabel ?? `${label} time`,
|
|
544
551
|
"aria-required": isRequired === true ? 'true' : undefined,
|
|
545
|
-
"aria-invalid": status?.type === 'error' ? 'true' : undefined,
|
|
552
|
+
"aria-invalid": status?.type === 'error' || !isTimeInputValid ? 'true' : undefined,
|
|
546
553
|
...{
|
|
547
554
|
0: {
|
|
548
555
|
className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx x1tgivj0 xjbqb8w x1a2a7pz xeyghm5"
|
|
@@ -557,6 +564,11 @@ export function DateTimeInput({
|
|
|
557
564
|
className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx xjbqb8w x1a2a7pz xeyghm5 x1h6gzvc xv1l7n4"
|
|
558
565
|
}
|
|
559
566
|
}[!!isEffectivelyDisabled << 1 | !!!isTimeInputValid << 0]
|
|
567
|
+
}), /*#__PURE__*/_jsx(VisuallyHidden, {
|
|
568
|
+
as: "div",
|
|
569
|
+
role: "alert",
|
|
570
|
+
"aria-live": "assertive",
|
|
571
|
+
children: !isTimeInputValid ? 'Invalid time' : ''
|
|
560
572
|
})]
|
|
561
573
|
})]
|
|
562
574
|
}), popover.render(/*#__PURE__*/_jsx(Calendar, {
|