@astryxdesign/core 0.4.0 → 0.4.1-canary.8138bfc
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/CHANGELOG.md +39 -0
- package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
- package/dist/AspectRatio/AspectRatio.js +1 -2
- package/dist/AspectRatio/index.d.ts.map +1 -1
- package/dist/AspectRatio/index.js +1 -2
- package/dist/Badge/Badge.d.ts.map +1 -1
- package/dist/Badge/Badge.js +1 -2
- package/dist/Badge/index.d.ts.map +1 -1
- package/dist/Badge/index.js +1 -2
- package/dist/Banner/Banner.d.ts +3 -0
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +17 -3
- package/dist/Blockquote/Blockquote.d.ts.map +1 -1
- package/dist/Blockquote/Blockquote.js +1 -2
- package/dist/Blockquote/index.d.ts.map +1 -1
- package/dist/Blockquote/index.js +1 -2
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +2 -2
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +1 -2
- package/dist/Card/index.d.ts.map +1 -1
- package/dist/Card/index.js +1 -2
- package/dist/Center/Center.d.ts.map +1 -1
- package/dist/Center/Center.js +1 -2
- package/dist/Center/index.d.ts.map +1 -1
- package/dist/Center/index.js +1 -2
- package/dist/Code/Code.d.ts.map +1 -1
- package/dist/Code/Code.js +1 -2
- package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPalette.js +5 -0
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +7 -8
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +23 -10
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +44 -16
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +32 -13
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioGroup.js +10 -3
- package/dist/Field/PanelSearchInput.d.ts +81 -0
- package/dist/Field/PanelSearchInput.d.ts.map +1 -0
- package/dist/Field/PanelSearchInput.js +151 -0
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +21 -10
- package/dist/Grid/Grid.d.ts.map +1 -1
- package/dist/Grid/Grid.js +1 -2
- package/dist/Grid/index.d.ts.map +1 -1
- package/dist/Grid/index.js +1 -2
- package/dist/Icon/globalIconRegistry.d.ts +5 -4
- package/dist/Icon/globalIconRegistry.d.ts.map +1 -1
- package/dist/Icon/globalIconRegistry.js +5 -4
- package/dist/Indicator/index.d.ts +1 -1
- package/dist/Indicator/index.d.ts.map +1 -1
- package/dist/Indicator/types.d.ts +10 -0
- package/dist/Indicator/types.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +24 -50
- package/dist/MultiSelector/MultiSelector.d.ts +8 -1
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +134 -102
- package/dist/NavItem/navItemStyles.stylex.d.ts +17 -5
- package/dist/NavItem/navItemStyles.stylex.d.ts.map +1 -1
- package/dist/NavItem/navItemStyles.stylex.js +11 -5
- package/dist/Popover/usePopover.d.ts +15 -0
- package/dist/Popover/usePopover.d.ts.map +1 -1
- package/dist/Popover/usePopover.js +14 -2
- package/dist/ProgressBar/ProgressBar.d.ts.map +1 -1
- package/dist/ProgressBar/ProgressBar.js +2 -3
- package/dist/Section/Section.d.ts.map +1 -1
- package/dist/Section/Section.js +1 -2
- package/dist/Section/index.d.ts.map +1 -1
- package/dist/Section/index.js +1 -2
- package/dist/Selector/Selector.d.ts +10 -0
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +135 -95
- package/dist/SideNav/SideNav.d.ts +7 -9
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +32 -5
- package/dist/SideNav/SideNavCollapseButton.d.ts +25 -9
- package/dist/SideNav/SideNavCollapseButton.d.ts.map +1 -1
- package/dist/SideNav/SideNavCollapseButton.js +39 -15
- package/dist/SideNav/SideNavCollapseContext.d.ts +21 -0
- package/dist/SideNav/SideNavCollapseContext.d.ts.map +1 -1
- package/dist/SideNav/SideNavCollapseContext.js +16 -2
- package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.js +70 -24
- package/dist/SideNav/SideNavItem.d.ts +7 -2
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/SideNav/SideNavItem.js +114 -75
- package/dist/SideNav/SideNavSection.d.ts.map +1 -1
- package/dist/SideNav/SideNavSection.js +7 -16
- package/dist/SideNav/index.d.ts +1 -1
- package/dist/SideNav/index.d.ts.map +1 -1
- package/dist/Skeleton/Skeleton.d.ts.map +1 -1
- package/dist/Skeleton/Skeleton.js +1 -2
- package/dist/Skeleton/index.d.ts.map +1 -1
- package/dist/Skeleton/index.js +1 -2
- package/dist/Slider/Slider.d.ts.map +1 -1
- package/dist/Slider/Slider.js +2 -6
- package/dist/Switch/Switch.d.ts.map +1 -1
- package/dist/Switch/Switch.js +3 -3
- package/dist/Table/TableRow.d.ts +1 -1
- package/dist/Table/TableRow.d.ts.map +1 -1
- package/dist/Table/TableRow.js +4 -2
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +7 -2
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +14 -3
- package/dist/Timestamp/formatInstant.d.ts +11 -1
- package/dist/Timestamp/formatInstant.d.ts.map +1 -1
- package/dist/Timestamp/formatInstant.js +3 -1
- package/dist/TopNav/TopNavMegaMenu.js +1 -1
- package/dist/TopNav/TopNavMegaMenuItem.js +1 -1
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +2 -2
- package/dist/VisuallyHidden/VisuallyHidden.d.ts.map +1 -1
- package/dist/VisuallyHidden/VisuallyHidden.js +1 -2
- package/dist/VisuallyHidden/index.d.ts.map +1 -1
- package/dist/VisuallyHidden/index.js +1 -2
- package/dist/astryx.css +20 -17
- package/dist/astryx.umd.js +48 -48
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/useInputStatusIcon.d.ts.map +1 -1
- package/dist/hooks/useInputStatusIcon.js +17 -4
- package/dist/theme/defineTheme.d.ts +2 -2
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +2 -1
- package/dist/theme/index.d.ts +1 -1
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/index.js +1 -1
- package/dist/theme/tokens.stylex.d.ts +12 -0
- package/dist/theme/tokens.stylex.d.ts.map +1 -1
- package/dist/theme/tokens.stylex.js +23 -0
- package/dist/utils/focusOutline.stylex.d.ts +34 -19
- package/dist/utils/focusOutline.stylex.d.ts.map +1 -1
- package/dist/utils/focusOutline.stylex.js +46 -33
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +5 -1
- package/dist/utils/interactionModality.d.ts +34 -0
- package/dist/utils/interactionModality.d.ts.map +1 -0
- package/dist/utils/interactionModality.js +70 -0
- package/locales/en.json +44 -0
- package/locales/pseudo.json +33 -0
- package/package.json +3 -3
- package/src/AppShell/AppShell.doc.mjs +3 -0
- package/src/AspectRatio/AspectRatio.tsx +0 -2
- package/src/AspectRatio/index.ts +0 -2
- package/src/Badge/Badge.tsx +0 -2
- package/src/Badge/index.ts +0 -2
- package/src/Banner/Banner.test.tsx +58 -1
- package/src/Banner/Banner.tsx +24 -5
- package/src/Blockquote/Blockquote.tsx +0 -2
- package/src/Blockquote/index.ts +0 -2
- package/src/Button/Button.doc.mjs +2 -2
- package/src/Button/Button.tsx +5 -4
- package/src/Card/Card.tsx +0 -2
- package/src/Card/index.ts +0 -2
- package/src/Center/Center.tsx +0 -2
- package/src/Center/index.ts +0 -2
- package/src/CheckboxInput/CheckboxInput.test.tsx +8 -3
- package/src/Code/Code.tsx +0 -2
- package/src/CommandPalette/CommandPalette.test.tsx +54 -0
- package/src/CommandPalette/CommandPalette.tsx +5 -0
- package/src/ComplexSelector/ComplexSelector.test.tsx +15 -6
- package/src/ComplexSelector/ComplexSelector.tsx +6 -10
- package/src/DateInput/DateInput.test.tsx +19 -0
- package/src/DateInput/DateInput.tsx +3 -6
- package/src/DateRangeInput/DateRangeInput.tsx +3 -9
- package/src/DateTimeInput/DateTimeInput.test.tsx +79 -1
- package/src/DateTimeInput/DateTimeInput.tsx +23 -9
- package/src/DropdownMenu/DropdownMenuRadioGroup.tsx +2 -1
- package/src/Field/PanelSearchInput.tsx +271 -0
- package/src/FileInput/FileInput.tsx +21 -8
- package/src/Grid/Grid.tsx +0 -2
- package/src/Grid/index.ts +0 -2
- package/src/Icon/globalIconRegistry.tsx +5 -4
- package/src/Indicator/Indicator.doc.mjs +1 -1
- package/src/Indicator/index.ts +1 -0
- package/src/Indicator/types.ts +11 -0
- package/src/Lightbox/Lightbox.tsx +2 -11
- package/src/MultiSelector/MultiSelector.doc.mjs +9 -0
- package/src/MultiSelector/MultiSelector.test.tsx +135 -5
- package/src/MultiSelector/MultiSelector.tsx +170 -127
- package/src/NavItem/navItemStyles.stylex.ts +31 -5
- package/src/Popover/Popover.doc.mjs +2 -0
- package/src/Popover/usePopover.tsx +37 -4
- package/src/ProgressBar/ProgressBar.tsx +2 -8
- package/src/Section/Section.tsx +0 -2
- package/src/Section/index.ts +0 -2
- package/src/Selector/Selector.doc.mjs +10 -0
- package/src/Selector/Selector.test.tsx +386 -2
- package/src/Selector/Selector.tsx +182 -122
- package/src/SideNav/SideNav.doc.mjs +13 -4
- package/src/SideNav/SideNav.test.tsx +771 -2
- package/src/SideNav/SideNav.tsx +37 -16
- package/src/SideNav/SideNavCollapseButton.doc.mjs +28 -6
- package/src/SideNav/SideNavCollapseButton.tsx +67 -15
- package/src/SideNav/SideNavCollapseContext.ts +29 -9
- package/src/SideNav/SideNavHeading.tsx +28 -10
- package/src/SideNav/SideNavItem.doc.mjs +13 -0
- package/src/SideNav/SideNavItem.tsx +92 -84
- package/src/SideNav/SideNavSection.tsx +6 -20
- package/src/SideNav/index.ts +2 -0
- package/src/Skeleton/Skeleton.tsx +0 -2
- package/src/Skeleton/index.ts +0 -2
- package/src/Slider/Slider.tsx +2 -11
- package/src/Switch/Switch.tsx +10 -2
- package/src/Table/Table.test.tsx +31 -0
- package/src/Table/TableRow.tsx +6 -0
- package/src/TimeInput/TimeInput.test.tsx +54 -0
- package/src/TimeInput/TimeInput.tsx +17 -2
- package/src/Timestamp/Timestamp.test.tsx +91 -14
- package/src/Timestamp/Timestamp.tsx +14 -2
- package/src/Timestamp/formatInstant.ts +16 -1
- package/src/TopNav/TopNavMegaMenu.doc.mjs +5 -0
- package/src/TopNav/TopNavMegaMenu.test.tsx +43 -0
- package/src/TopNav/TopNavMegaMenu.tsx +4 -1
- package/src/TopNav/TopNavMegaMenuItem.tsx +1 -1
- package/src/TopNav/TopNavMenu.test.tsx +41 -0
- package/src/TopNav/TopNavMenu.tsx +8 -2
- package/src/TreeList/TreeList.test.tsx +3 -2
- package/src/VisuallyHidden/VisuallyHidden.tsx +0 -2
- package/src/VisuallyHidden/index.ts +0 -2
- package/src/hooks/useInputStatusIcon.tsx +8 -8
- package/src/serverSafeComponents.test.ts +665 -0
- package/src/theme/defineTheme.ts +3 -0
- package/src/theme/generateThemeRules.test.ts +17 -0
- package/src/theme/index.ts +2 -0
- package/src/theme/tokens.stylex.ts +18 -0
- package/src/theme/tokens.test.ts +37 -0
- package/src/utils/focusOutline.stylex.ts +37 -23
- package/src/utils/index.ts +4 -0
- package/src/utils/interactionModality.ts +74 -0
|
@@ -4,12 +4,17 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file SideNavItem.tsx
|
|
7
|
-
* @input Uses React, ReactNode, StyleX, Icon, IconType
|
|
7
|
+
* @input Uses React, ReactNode, StyleX, Icon, IconType, useMenuHover
|
|
8
8
|
* @output Exports SideNavItem component and SideNavItemProps
|
|
9
9
|
* @position Core implementation; used inside SideNav children
|
|
10
10
|
*
|
|
11
11
|
* Navigation item with icon, selected state, and nesting.
|
|
12
12
|
*
|
|
13
|
+
* Collapsed items with children open their submenu flyout through
|
|
14
|
+
* `useMenuHover`, the shared hover-intent hook (same one `SideNavHeading` and
|
|
15
|
+
* `TopNavMenu` use). Hover is a progressive enhancement over the popover's
|
|
16
|
+
* click behavior and is inert on coarse pointers.
|
|
17
|
+
*
|
|
13
18
|
* SYNC: When modified, update these files to stay in sync:
|
|
14
19
|
* - /packages/core/src/SideNav/SideNav.doc.mjs
|
|
15
20
|
* - /packages/core/src/SideNav/SideNav.test.tsx
|
|
@@ -20,13 +25,15 @@
|
|
|
20
25
|
import { useCallback, useId, useMemo, useRef, useState } from 'react';
|
|
21
26
|
import * as stylex from '@stylexjs/stylex';
|
|
22
27
|
import "../theme/tokens.stylex.js";
|
|
23
|
-
import { colorVars, spacingVars, sizeVars, fontWeightVars, typeScaleVars, durationVars, easeVars,
|
|
28
|
+
import { colorVars, spacingVars, sizeVars, fontWeightVars, typeScaleVars, durationVars, easeVars, radiusVars } from "../theme/tokens.stylex.js";
|
|
24
29
|
import { Icon, renderIconSlot } from "../Icon/index.js";
|
|
25
30
|
import { useLinkComponent } from "../Link/useLinkComponent.js";
|
|
26
31
|
import { usePopover } from "../Popover/usePopover.js";
|
|
32
|
+
import { useMenuHover } from "../hooks/useMenuHover.js";
|
|
27
33
|
import { mergeProps, mergeRefs } from "../utils/index.js";
|
|
28
34
|
import { Tooltip } from "../Tooltip/index.js";
|
|
29
35
|
import { navItemStyles } from "../NavItem/navItemStyles.stylex.js";
|
|
36
|
+
import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
|
|
30
37
|
import { useSideNavCollapse, SideNavCollapseContext } from "./SideNavCollapseContext.js";
|
|
31
38
|
import { useSideNavRenderMode } from "./SideNavRenderContext.js";
|
|
32
39
|
import { useAppShellMobile } from "../AppShell/AppShellMobileContext.js";
|
|
@@ -66,7 +73,7 @@ const styles = {
|
|
|
66
73
|
kZKoxP: "xvpftlf",
|
|
67
74
|
kGuDYH: "x1qlqyl8",
|
|
68
75
|
k1ekBW: "x11xpdln",
|
|
69
|
-
kIyJzY: "xuedmi6",
|
|
76
|
+
kIyJzY: "xuedmi6 x12w9bfk",
|
|
70
77
|
kAMwcw: "xlr8y92",
|
|
71
78
|
kmuXW: "x2lah0s",
|
|
72
79
|
$$css: true
|
|
@@ -74,6 +81,50 @@ const styles = {
|
|
|
74
81
|
expandChevronExpanded: {
|
|
75
82
|
k3aq6I: "x19jd1h0",
|
|
76
83
|
$$css: true
|
|
84
|
+
},
|
|
85
|
+
expandToggle: {
|
|
86
|
+
k1xSpc: "x3nfvp2",
|
|
87
|
+
kGNEyG: "x6s0dn4",
|
|
88
|
+
kjj79g: "xl56j7k",
|
|
89
|
+
kmuXW: "x2lah0s",
|
|
90
|
+
kmVPX3: "x1717udv",
|
|
91
|
+
kogj98: "x1ghz6dp",
|
|
92
|
+
kMzoRj: "xc342km",
|
|
93
|
+
ksu8eU: "xng3xce",
|
|
94
|
+
kWkggS: "xjbqb8w",
|
|
95
|
+
kMwMTN: "x1heor9g",
|
|
96
|
+
kkrTdU: "x1ypdohk",
|
|
97
|
+
kaIpWk: "xh6dtrn",
|
|
98
|
+
kHE3J0: "xe9uy6x",
|
|
99
|
+
kSReZ0: "xyxi2l3",
|
|
100
|
+
$$css: true
|
|
101
|
+
},
|
|
102
|
+
splitAction: {
|
|
103
|
+
k1xSpc: "x78zum5",
|
|
104
|
+
kGNEyG: "x6s0dn4",
|
|
105
|
+
kSGwAc: "xkh2ocl",
|
|
106
|
+
kOIVth: "x1txdalj",
|
|
107
|
+
kUk6DE: "x98rzlu",
|
|
108
|
+
k7Eaqz: "xeuugli",
|
|
109
|
+
kMwMTN: "x1heor9g",
|
|
110
|
+
kybGjl: "x1hl2dhg",
|
|
111
|
+
kmVPX3: "x1717udv",
|
|
112
|
+
kogj98: "x1ghz6dp",
|
|
113
|
+
kMzoRj: "xc342km",
|
|
114
|
+
ksu8eU: "xng3xce",
|
|
115
|
+
kWkggS: "xjbqb8w",
|
|
116
|
+
kMv6JI: "xjb2p0i",
|
|
117
|
+
kGuDYH: "x1qlqyl8",
|
|
118
|
+
k63SB2: "x1pd3egz",
|
|
119
|
+
kLWn49: "x15bjb6t",
|
|
120
|
+
k9WMMc: "x1yc453h",
|
|
121
|
+
kkrTdU: "x1ypdohk",
|
|
122
|
+
$$css: true
|
|
123
|
+
},
|
|
124
|
+
popoverGap: {
|
|
125
|
+
keTefX: "x11g1kdw",
|
|
126
|
+
k71WvV: "xnur1sd",
|
|
127
|
+
$$css: true
|
|
77
128
|
}
|
|
78
129
|
};
|
|
79
130
|
|
|
@@ -164,7 +215,8 @@ export function SideNavItem({
|
|
|
164
215
|
size = 'md',
|
|
165
216
|
'data-testid': testId,
|
|
166
217
|
ref,
|
|
167
|
-
xstyle
|
|
218
|
+
xstyle,
|
|
219
|
+
...rest
|
|
168
220
|
}) {
|
|
169
221
|
const t = useTranslator();
|
|
170
222
|
const {
|
|
@@ -184,7 +236,9 @@ export function SideNavItem({
|
|
|
184
236
|
hasLightDismiss: true,
|
|
185
237
|
hasAutoFocus: true,
|
|
186
238
|
hasCloseButton: false,
|
|
187
|
-
dialogLabel:
|
|
239
|
+
dialogLabel: t('@astryx.sideNavItem.submenuLabel', {
|
|
240
|
+
label
|
|
241
|
+
})
|
|
188
242
|
});
|
|
189
243
|
|
|
190
244
|
// Collapse state for items with children
|
|
@@ -230,39 +284,19 @@ export function SideNavItem({
|
|
|
230
284
|
toggleItemCollapse();
|
|
231
285
|
};
|
|
232
286
|
|
|
233
|
-
//
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
}
|
|
246
|
-
const schedulePopoverShow = useCallback(() => {
|
|
247
|
-
clearPopoverTimeouts();
|
|
248
|
-
showTimeoutRef.current = setTimeout(() => {
|
|
249
|
-
popover.show({
|
|
250
|
-
skipAutoFocus: true
|
|
251
|
-
});
|
|
252
|
-
}, 150);
|
|
253
|
-
}, [clearPopoverTimeouts, popover]);
|
|
254
|
-
const schedulePopoverHide = useCallback(() => {
|
|
255
|
-
clearPopoverTimeouts();
|
|
256
|
-
hideTimeoutRef.current = setTimeout(() => {
|
|
257
|
-
popover.hide();
|
|
258
|
-
}, 200);
|
|
259
|
-
}, [clearPopoverTimeouts, popover]);
|
|
260
|
-
const handlePopoverMouseEnter = useCallback(() => {
|
|
261
|
-
schedulePopoverShow();
|
|
262
|
-
}, [schedulePopoverShow]);
|
|
263
|
-
const handlePopoverMouseLeave = useCallback(() => {
|
|
264
|
-
schedulePopoverHide();
|
|
265
|
-
}, [schedulePopoverHide]);
|
|
287
|
+
// Pointer half only. The hook's `onKeyDown`/`menuRef` drive a `useListFocus`
|
|
288
|
+
// over `[role="menuitem"]`, and this flyout is a focus-trapped dialog of
|
|
289
|
+
// links — wiring them would swallow arrow keys rather than navigate with
|
|
290
|
+
// them. Keyboard stays with `usePopover`'s trap, as in DropdownMenuSubMenu.
|
|
291
|
+
const {
|
|
292
|
+
triggerProps: hoverTriggerProps,
|
|
293
|
+
contentProps: hoverContentProps
|
|
294
|
+
} = useMenuHover({
|
|
295
|
+
show: popover.show,
|
|
296
|
+
hide: popover.hide,
|
|
297
|
+
isOpen: popover.isOpen,
|
|
298
|
+
isEnabled: isCollapsed && hasChildren
|
|
299
|
+
});
|
|
266
300
|
|
|
267
301
|
// In collapsed mode: hide items without icons
|
|
268
302
|
if (isCollapsed && !icon) {
|
|
@@ -275,14 +309,19 @@ export function SideNavItem({
|
|
|
275
309
|
if (isCollapsed) {
|
|
276
310
|
const collapsedIcon = displayIcon && renderIconSlot(displayIcon, {
|
|
277
311
|
size: 'sm',
|
|
278
|
-
|
|
312
|
+
// `inherit` so a selected row's icon follows the row to HighlightText
|
|
313
|
+
// under forced colors. Identical to `primary` otherwise: both token
|
|
314
|
+
// families are emitted from one expression.
|
|
315
|
+
color: isSelected ? 'inherit' : isDisabled ? 'disabled' : 'secondary'
|
|
279
316
|
});
|
|
280
317
|
|
|
281
|
-
// Shared collapsed item styles — used by trigger, link, and button
|
|
318
|
+
// Shared collapsed item styles — used by trigger, link, and button.
|
|
319
|
+
// All three render a focusable element, so each draws the shared ring.
|
|
282
320
|
const collapsedItemStyles = mergeProps(themeProps('side-nav-item', {
|
|
283
321
|
size,
|
|
284
|
-
selected: isSelected ? 'selected' : null
|
|
285
|
-
|
|
322
|
+
selected: isSelected ? 'selected' : null,
|
|
323
|
+
disabled: isDisabled ? 'disabled' : null
|
|
324
|
+
}), focusOutlineProps.focusVisible(navItemStyles.item, navItemStyles[size], styles.itemCollapsed, size === 'sm' && styles.itemCollapsedSm, size === 'lg' && styles.itemCollapsedLg, isSelected && navItemStyles.selected, isDisabled && navItemStyles.disabled));
|
|
286
325
|
|
|
287
326
|
// Items with children: popover trigger + popover
|
|
288
327
|
if (hasChildren) {
|
|
@@ -291,9 +330,8 @@ export function SideNavItem({
|
|
|
291
330
|
children: [/*#__PURE__*/_jsx("button", {
|
|
292
331
|
ref: mergeRefs(ref, popover.triggerRef),
|
|
293
332
|
type: "button",
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
onMouseLeave: handlePopoverMouseLeave,
|
|
333
|
+
...rest,
|
|
334
|
+
...hoverTriggerProps,
|
|
297
335
|
"aria-label": label,
|
|
298
336
|
"data-testid": testId,
|
|
299
337
|
...popover.triggerProps,
|
|
@@ -301,10 +339,10 @@ export function SideNavItem({
|
|
|
301
339
|
children: collapsedIcon
|
|
302
340
|
}), popover.render(/*#__PURE__*/_jsxs("div", {
|
|
303
341
|
...{
|
|
304
|
-
className: "
|
|
342
|
+
className: "x1hviunn xu0wf1k x7a5moj xfb3i0g"
|
|
305
343
|
},
|
|
306
|
-
onMouseEnter:
|
|
307
|
-
onMouseLeave:
|
|
344
|
+
onMouseEnter: hoverContentProps.onMouseEnter,
|
|
345
|
+
onMouseLeave: hoverContentProps.onMouseLeave,
|
|
308
346
|
onClick: () => popover.hide(),
|
|
309
347
|
children: [/*#__PURE__*/_jsx("div", {
|
|
310
348
|
...{
|
|
@@ -317,7 +355,8 @@ export function SideNavItem({
|
|
|
317
355
|
})]
|
|
318
356
|
}), {
|
|
319
357
|
placement: 'end',
|
|
320
|
-
alignment: 'start'
|
|
358
|
+
alignment: 'start',
|
|
359
|
+
xstyle: styles.popoverGap
|
|
321
360
|
})]
|
|
322
361
|
});
|
|
323
362
|
}
|
|
@@ -335,6 +374,7 @@ export function SideNavItem({
|
|
|
335
374
|
as: as,
|
|
336
375
|
isDisabled: isDisabled,
|
|
337
376
|
onClick: handleClick,
|
|
377
|
+
...rest,
|
|
338
378
|
...collapsedAriaProps,
|
|
339
379
|
...collapsedItemStyles,
|
|
340
380
|
children: collapsedIcon
|
|
@@ -352,7 +392,8 @@ export function SideNavItem({
|
|
|
352
392
|
const itemContent = /*#__PURE__*/_jsxs(_Fragment, {
|
|
353
393
|
children: [displayIcon && renderIconSlot(displayIcon, {
|
|
354
394
|
size: 'sm',
|
|
355
|
-
|
|
395
|
+
// `inherit` — see the collapsed path above.
|
|
396
|
+
color: isSelected ? 'inherit' : isDisabled ? 'disabled' : 'secondary'
|
|
356
397
|
}), !isCollapsed && /*#__PURE__*/_jsx("span", {
|
|
357
398
|
...{
|
|
358
399
|
className: "x98rzlu xeuugli xb3r6kr xlyipyv xuxw1ft"
|
|
@@ -370,39 +411,38 @@ export function SideNavItem({
|
|
|
370
411
|
xstyle: [styles.expandChevron, !isItemCollapsed && styles.expandChevronExpanded]
|
|
371
412
|
})]
|
|
372
413
|
});
|
|
373
|
-
const
|
|
414
|
+
const itemThemeProps = themeProps('side-nav-item', {
|
|
374
415
|
size,
|
|
375
|
-
selected: isSelected ? 'selected' : null
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
//
|
|
380
|
-
// When both collapsible and href are set, we can't nest a <button>
|
|
381
|
-
// inside an <a>. Instead we use a <div> as the flex row container,
|
|
382
|
-
// an <a display:contents> for the link (with ::before covering the row),
|
|
383
|
-
// and a <button> sibling lifted above the overlay via z-index.
|
|
416
|
+
selected: isSelected ? 'selected' : null,
|
|
417
|
+
disabled: isDisabled ? 'disabled' : null
|
|
418
|
+
});
|
|
419
|
+
const itemStyleArgs = [navItemStyles.item, navItemStyles[size], isSelected && navItemStyles.selected, isDisabled && navItemStyles.disabled];
|
|
384
420
|
|
|
385
|
-
//
|
|
386
|
-
//
|
|
387
|
-
//
|
|
388
|
-
//
|
|
389
|
-
//
|
|
421
|
+
// Two shapes of the same row appearance:
|
|
422
|
+
// - `rowProps` for the split-action path, where the row is a plain <div>
|
|
423
|
+
// container and its children take focus (so the ring belongs on them);
|
|
424
|
+
// - `focusableRowProps` for every other path, where the row element is
|
|
425
|
+
// itself the focusable control.
|
|
426
|
+
const rowProps = mergeProps(itemThemeProps, stylex.props(...itemStyleArgs));
|
|
427
|
+
const focusableRowProps = mergeProps(itemThemeProps, focusOutlineProps.focusVisible(...itemStyleArgs));
|
|
390
428
|
|
|
429
|
+
// Split-action path: collapsible plus a primary action renders the primary
|
|
430
|
+
// element and the chevron toggle as siblings in a <div> row, since a
|
|
431
|
+
// <button> cannot nest inside an <a>.
|
|
391
432
|
let itemElement;
|
|
392
433
|
if (hasIndependentToggle) {
|
|
393
434
|
itemElement = /*#__PURE__*/_jsxs("div", {
|
|
394
435
|
"data-testid": testId,
|
|
395
|
-
...
|
|
436
|
+
...rowProps,
|
|
396
437
|
children: [/*#__PURE__*/_jsx(NavItemElement, {
|
|
397
438
|
ref: ref,
|
|
398
439
|
href: href,
|
|
399
440
|
as: as,
|
|
400
441
|
isDisabled: isDisabled,
|
|
401
442
|
onClick: handleClick,
|
|
443
|
+
...rest,
|
|
402
444
|
"aria-current": isSelected ? 'page' : undefined,
|
|
403
|
-
...
|
|
404
|
-
className: "x78zum5 x6s0dn4 x1txdalj x98rzlu xeuugli x1heor9g x1hl2dhg x1717udv x1ghz6dp xc342km xng3xce xjbqb8w xjb2p0i x1qlqyl8 x1pd3egz x15bjb6t x1yc453h x1ypdohk"
|
|
405
|
-
},
|
|
445
|
+
...focusOutlineProps.focusVisible(styles.splitAction),
|
|
406
446
|
children: itemContent
|
|
407
447
|
}), /*#__PURE__*/_jsx("button", {
|
|
408
448
|
type: "button",
|
|
@@ -414,9 +454,7 @@ export function SideNavItem({
|
|
|
414
454
|
}),
|
|
415
455
|
"aria-expanded": !isItemCollapsed,
|
|
416
456
|
"aria-controls": `${id}-children`,
|
|
417
|
-
...
|
|
418
|
-
className: "x3nfvp2 x6s0dn4 xl56j7k x2lah0s x1717udv x1ghz6dp xc342km xng3xce xjbqb8w x1heor9g x1ypdohk xh6dtrn xe9uy6x xyxi2l3"
|
|
419
|
-
},
|
|
457
|
+
...focusOutlineProps.focusVisible(styles.expandToggle),
|
|
420
458
|
children: /*#__PURE__*/_jsx(Icon, {
|
|
421
459
|
icon: "chevronDown",
|
|
422
460
|
size: "lg",
|
|
@@ -439,8 +477,9 @@ export function SideNavItem({
|
|
|
439
477
|
as: as,
|
|
440
478
|
isDisabled: isDisabled,
|
|
441
479
|
onClick: handleClick,
|
|
480
|
+
...rest,
|
|
442
481
|
...ariaProps,
|
|
443
|
-
...
|
|
482
|
+
...focusableRowProps,
|
|
444
483
|
children: itemContent
|
|
445
484
|
});
|
|
446
485
|
}
|
|
@@ -455,10 +494,10 @@ export function SideNavItem({
|
|
|
455
494
|
inert: isItemCollapsed ? true : undefined,
|
|
456
495
|
...{
|
|
457
496
|
0: {
|
|
458
|
-
className: "xrvj5dj x1tu4anv x1qn9uv2 x80gvsz xlr8y92"
|
|
497
|
+
className: "xrvj5dj x1tu4anv x1qn9uv2 x80gvsz x12w9bfk xlr8y92"
|
|
459
498
|
},
|
|
460
499
|
1: {
|
|
461
|
-
className: "xrvj5dj x1qn9uv2 x80gvsz xlr8y92 xihq33y"
|
|
500
|
+
className: "xrvj5dj x1qn9uv2 x80gvsz x12w9bfk xlr8y92 xihq33y"
|
|
462
501
|
}
|
|
463
502
|
}[!!isItemCollapsed << 0],
|
|
464
503
|
children: /*#__PURE__*/_jsxs("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SideNavSection.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNavSection.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AASnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"SideNavSection.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNavSection.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AASnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgE5C,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;OAIG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAMD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,cAAsB,EACtB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,mBAAmB,qBA0CrB;yBAtDe,cAAc"}
|
|
@@ -23,6 +23,7 @@ import "../theme/tokens.stylex.js";
|
|
|
23
23
|
import { colorVars, spacingVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
24
24
|
import { mergeProps } from "../utils/index.js";
|
|
25
25
|
import { useSideNavCollapse } from "./SideNavCollapseContext.js";
|
|
26
|
+
import { VisuallyHidden } from "../VisuallyHidden/index.js";
|
|
26
27
|
import { themeProps } from "../utils/themeProps.js";
|
|
27
28
|
// =============================================================================
|
|
28
29
|
// Styles
|
|
@@ -102,17 +103,6 @@ export function SideNavSection({
|
|
|
102
103
|
})]
|
|
103
104
|
});
|
|
104
105
|
const shouldHideHeader = isHeaderHidden || isCollapsed;
|
|
105
|
-
const visuallyHiddenStyle = shouldHideHeader ? {
|
|
106
|
-
position: 'absolute',
|
|
107
|
-
width: 1,
|
|
108
|
-
height: 1,
|
|
109
|
-
padding: 0,
|
|
110
|
-
margin: -1,
|
|
111
|
-
overflow: 'hidden',
|
|
112
|
-
clip: 'rect(0, 0, 0, 0)',
|
|
113
|
-
whiteSpace: 'nowrap',
|
|
114
|
-
borderWidth: 0
|
|
115
|
-
} : {};
|
|
116
106
|
return /*#__PURE__*/_jsxs("div", {
|
|
117
107
|
ref: ref,
|
|
118
108
|
...mergeProps(themeProps('side-nav-section'), stylex.props(styles.root, xstyle), className, style),
|
|
@@ -120,12 +110,13 @@ export function SideNavSection({
|
|
|
120
110
|
role: "group",
|
|
121
111
|
"aria-labelledby": titleId,
|
|
122
112
|
"data-testid": testId,
|
|
123
|
-
children: [/*#__PURE__*/_jsx(
|
|
124
|
-
|
|
113
|
+
children: [shouldHideHeader ? /*#__PURE__*/_jsx(VisuallyHidden, {
|
|
114
|
+
as: "div",
|
|
115
|
+
children: headerContent
|
|
116
|
+
}) : /*#__PURE__*/_jsx("div", {
|
|
117
|
+
...{
|
|
125
118
|
className: "x78zum5 x6s0dn4 x1txdalj xf314gf xu0wf1k xt0e3qv x87ps6o"
|
|
126
|
-
},
|
|
127
|
-
style: shouldHideHeader ? visuallyHiddenStyle : undefined
|
|
128
|
-
}),
|
|
119
|
+
},
|
|
129
120
|
children: headerContent
|
|
130
121
|
}), /*#__PURE__*/_jsx("div", {
|
|
131
122
|
...{
|
package/dist/SideNav/index.d.ts
CHANGED
|
@@ -17,7 +17,7 @@ export type { SideNavSectionProps } from './SideNavSection';
|
|
|
17
17
|
export { SideNavCollapseButton } from './SideNavCollapseButton';
|
|
18
18
|
export type { SideNavCollapseButtonProps } from './SideNavCollapseButton';
|
|
19
19
|
export { useSideNavCollapse } from './SideNavCollapseContext';
|
|
20
|
-
export type { SideNavCollapseState, SideNavImperativeCollapseHandle, } from './SideNavCollapseContext';
|
|
20
|
+
export type { SideNavCollapseState, SideNavCollapsibleConfig, SideNavControlledCollapsible, SideNavImperativeCollapseHandle, } from './SideNavCollapseContext';
|
|
21
21
|
export { SideNavRenderContext, useSideNavRenderMode, } from './SideNavRenderContext';
|
|
22
22
|
export type { SideNavRenderMode } from './SideNavRenderContext';
|
|
23
23
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/SideNav/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,YAAY,EAAC,YAAY,EAAC,MAAM,WAAW,CAAC;AAE5C,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAE1D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAE1D,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAC,0BAA0B,EAAC,MAAM,yBAAyB,CAAC;AAExE,OAAO,EAAC,kBAAkB,EAAC,MAAM,0BAA0B,CAAC;AAC5D,YAAY,EACV,oBAAoB,EACpB,+BAA+B,GAChC,MAAM,0BAA0B,CAAC;AAElC,OAAO,EACL,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/SideNav/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,OAAO,EAAC,MAAM,WAAW,CAAC;AAClC,YAAY,EAAC,YAAY,EAAC,MAAM,WAAW,CAAC;AAE5C,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAE1D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAChD,YAAY,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAE1D,OAAO,EAAC,qBAAqB,EAAC,MAAM,yBAAyB,CAAC;AAC9D,YAAY,EAAC,0BAA0B,EAAC,MAAM,yBAAyB,CAAC;AAExE,OAAO,EAAC,kBAAkB,EAAC,MAAM,0BAA0B,CAAC;AAC5D,YAAY,EACV,oBAAoB,EACpB,wBAAwB,EACxB,4BAA4B,EAC5B,+BAA+B,GAChC,MAAM,0BAA0B,CAAC;AAElC,OAAO,EACL,oBAAoB,EACpB,oBAAoB,GACrB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EAAC,iBAAiB,EAAC,MAAM,wBAAwB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/Skeleton/Skeleton.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../src/Skeleton/Skeleton.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAoE3C,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;EAuBhB,CAAC;AAgBH,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,YAAY,CAAC;AAMvD,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACxB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB;;;;;;;;;;OAUG;IACH,MAAM,CAAC,EAAE,cAAc,CAAC;IACxB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAc,EACd,MAAe,EACf,MAAM,EAAE,UAAc,EACtB,KAAS,EACT,aAAa,EAAE,MAAM,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,aAAa,+BA0Bf;yBArCe,QAAQ"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
// Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
2
2
|
|
|
3
|
-
'use client';
|
|
4
|
-
|
|
5
3
|
/**
|
|
6
4
|
* @file Skeleton.tsx
|
|
7
5
|
* @input Uses React, StyleX keyframes and tokens
|
|
@@ -14,6 +12,7 @@
|
|
|
14
12
|
* - /apps/storybook/stories/Skeleton.stories.tsx
|
|
15
13
|
* - /packages/cli/assets/templates/blocks/components/Skeleton/ (showcase blocks)
|
|
16
14
|
*/
|
|
15
|
+
|
|
17
16
|
import * as stylex from '@stylexjs/stylex';
|
|
18
17
|
import "../theme/tokens.stylex.js";
|
|
19
18
|
import { colorVars, radiusVars, durationVars } from "../theme/tokens.stylex.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Skeleton/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Skeleton/index.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,EAAC,QAAQ,EAAC,MAAM,YAAY,CAAC;AACpC,YAAY,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,YAAY,CAAC"}
|
package/dist/Skeleton/index.js
CHANGED
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
// Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
2
2
|
|
|
3
|
-
'use client';
|
|
4
|
-
|
|
5
3
|
/**
|
|
6
4
|
* @file index.ts
|
|
7
5
|
* @input Imports from Skeleton component files
|
|
@@ -10,4 +8,5 @@
|
|
|
10
8
|
*
|
|
11
9
|
* SYNC: When modified, update this header and /packages/core/src/Skeleton/Skeleton.doc.mjs
|
|
12
10
|
*/
|
|
11
|
+
|
|
13
12
|
export { Skeleton } from "./Skeleton.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AAyCA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAIhD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAO9C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uEAAuE;IACvE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gCAAgC;IAChC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,6DAA6D;IAC7D,YAAY,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IAC3C,8DAA8D;IAC9D,KAAK,CAAC,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,8CAA8C;IAC9C,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC7C,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAChD,8CAA8C;IAC9C,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,gBAAgB,CAAC;AAkO/D;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,WAAW,+BA8mBlD;yBA9mBe,MAAM"}
|
package/dist/Slider/Slider.js
CHANGED
|
@@ -24,6 +24,7 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
|
|
|
24
24
|
import { useTooltip } from "../Tooltip/index.js";
|
|
25
25
|
import { VisuallyHidden } from "../VisuallyHidden/index.js";
|
|
26
26
|
import { mergeProps, mergeRefs, rtlStyles } from "../utils/index.js";
|
|
27
|
+
import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
|
|
27
28
|
import { isRtlElement } from "../hooks/isRtlElement.js";
|
|
28
29
|
import { themeProps } from "../utils/themeProps.js";
|
|
29
30
|
|
|
@@ -103,11 +104,6 @@ const styles = {
|
|
|
103
104
|
kWkggS: "x1ewilqj xyxu9wt",
|
|
104
105
|
$$css: true
|
|
105
106
|
},
|
|
106
|
-
thumbFocusVisible: {
|
|
107
|
-
kI3sdo: "x1a2a7pz x17nn4n9",
|
|
108
|
-
kInvED: "x1wfwxd8 x7s97pk",
|
|
109
|
-
$$css: true
|
|
110
|
-
},
|
|
111
107
|
thumbDisabled: {
|
|
112
108
|
kWkggS: "xwmxj5m",
|
|
113
109
|
kkrTdU: "x1h6gzvc",
|
|
@@ -484,7 +480,7 @@ export function Slider({
|
|
|
484
480
|
...mergeProps(themeProps('slider-thumb', {
|
|
485
481
|
orientation,
|
|
486
482
|
disabled: isDisabled ? 'disabled' : null
|
|
487
|
-
}), stylex.props(styles.thumb, isHorizontal ? styles.thumbHorizontal : rtlStyles.centerInline('50%'), !isDisabled && styles.thumbHover, !isDisabled &&
|
|
483
|
+
}), stylex.props(styles.thumb, isHorizontal ? styles.thumbHorizontal : rtlStyles.centerInline('50%'), !isDisabled && styles.thumbHover, !isDisabled && focusOutlineStyles.focusVisible, isDisabled && styles.thumbDisabled), undefined, positionStyle)
|
|
488
484
|
}, thumbIndex);
|
|
489
485
|
if (useValueTooltip) {
|
|
490
486
|
return /*#__PURE__*/_jsx(Tooltip, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/Switch/Switch.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAIL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../src/Switch/Switch.tsx"],"names":[],"mappings":"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"}
|
package/dist/Switch/Switch.js
CHANGED
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
import { useId, useOptimistic, useTransition } from 'react';
|
|
19
19
|
import * as stylex from '@stylexjs/stylex';
|
|
20
20
|
import "../theme/tokens.stylex.js";
|
|
21
|
-
import { colorVars, spacingVars, radiusVars, durationVars, easeVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
21
|
+
import { colorVars, spacingVars, radiusVars, durationVars, easeVars, typographyVars, typeScaleVars, focusVars } from "../theme/tokens.stylex.js";
|
|
22
22
|
import { FieldLabel } from "../Field/FieldLabel.js";
|
|
23
23
|
import { FieldStatus } from "../FieldStatus/FieldStatus.js";
|
|
24
24
|
import { Spinner } from "../Spinner/index.js";
|
|
@@ -160,8 +160,8 @@ const styles = {
|
|
|
160
160
|
$$css: true
|
|
161
161
|
},
|
|
162
162
|
trackFocus: {
|
|
163
|
-
kI3sdo: "x1a2a7pz
|
|
164
|
-
kInvED: "
|
|
163
|
+
kI3sdo: "x1a2a7pz xafswnp",
|
|
164
|
+
kInvED: "xwz5zln",
|
|
165
165
|
$$css: true
|
|
166
166
|
},
|
|
167
167
|
trackOff: {
|
package/dist/Table/TableRow.d.ts
CHANGED
|
@@ -44,7 +44,7 @@ export interface TableRowProps extends BaseProps<HTMLTableRowElement> {
|
|
|
44
44
|
* </Table>
|
|
45
45
|
* ```
|
|
46
46
|
*/
|
|
47
|
-
export declare function TableRow({ children, xstyle, ref, isHeaderRow, ...props }: TableRowProps): import("react").JSX.Element;
|
|
47
|
+
export declare function TableRow({ children, xstyle, ref, isHeaderRow, className: incomingClassName, style: incomingStyle, ...props }: TableRowProps): import("react").JSX.Element;
|
|
48
48
|
export declare namespace TableRow {
|
|
49
49
|
var displayName: string;
|
|
50
50
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../src/Table/TableRow.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAMjD,+CAA+C;AAC/C,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACnE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AA4DD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,GAAG,EACH,WAAmB,EACnB,GAAG,KAAK,EACT,EAAE,aAAa,+
|
|
1
|
+
{"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../src/Table/TableRow.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAMjD,+CAA+C;AAC/C,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,mBAAmB,CAAC;IACnE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,mBAAmB,CAAC,CAAC;IACrC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AA4DD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,EACN,GAAG,EACH,WAAmB,EACnB,SAAS,EAAE,iBAAiB,EAC5B,KAAK,EAAE,aAAa,EACpB,GAAG,KAAK,EACT,EAAE,aAAa,+BAwDf;yBAhEe,QAAQ"}
|
package/dist/Table/TableRow.js
CHANGED
|
@@ -73,6 +73,8 @@ export function TableRow({
|
|
|
73
73
|
xstyle,
|
|
74
74
|
ref,
|
|
75
75
|
isHeaderRow = false,
|
|
76
|
+
className: incomingClassName,
|
|
77
|
+
style: incomingStyle,
|
|
76
78
|
...props
|
|
77
79
|
}) {
|
|
78
80
|
const ctx = use(TableContext);
|
|
@@ -80,7 +82,7 @@ export function TableRow({
|
|
|
80
82
|
return /*#__PURE__*/_jsx("tr", {
|
|
81
83
|
ref: ref,
|
|
82
84
|
...props,
|
|
83
|
-
...mergeProps(themeProps('table-row'), stylex.props(tableRowMarker, xstyle)),
|
|
85
|
+
...mergeProps(themeProps('table-row'), stylex.props(tableRowMarker, xstyle), incomingClassName, incomingStyle),
|
|
84
86
|
children: children
|
|
85
87
|
});
|
|
86
88
|
}
|
|
@@ -108,7 +110,7 @@ export function TableRow({
|
|
|
108
110
|
return /*#__PURE__*/_jsx("tr", {
|
|
109
111
|
ref: ref,
|
|
110
112
|
...props,
|
|
111
|
-
...mergeProps(themeProps('table-row'), stylex.props(tableRowMarker, ...rowStyles)),
|
|
113
|
+
...mergeProps(themeProps('table-row'), stylex.props(tableRowMarker, ...rowStyles), incomingClassName, incomingStyle),
|
|
112
114
|
children: children
|
|
113
115
|
});
|
|
114
116
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeInput.d.ts","sourceRoot":"","sources":["../../src/TimeInput/TimeInput.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"TimeInput.d.ts","sourceRoot":"","sources":["../../src/TimeInput/TimeInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -281,9 +281,14 @@ export function TimeInput({
|
|
|
281
281
|
// Check if within range
|
|
282
282
|
if (isTimeInRange(newTime, min, max)) {
|
|
283
283
|
fireChange(newTime);
|
|
284
|
+
// Stepping programmatically rewrites a plain textbox's value, and
|
|
285
|
+
// screen readers do not announce programmatic textbox changes — the
|
|
286
|
+
// new value must be spoken explicitly or stepping is silent
|
|
287
|
+
// (WCAG 4.1.2).
|
|
288
|
+
announce(formatDisplayTime(newTime, hasSeconds));
|
|
284
289
|
}
|
|
285
290
|
}
|
|
286
|
-
}, [value, hasSeconds, increment, min, max, fireChange, isDisabled]);
|
|
291
|
+
}, [value, hasSeconds, increment, min, max, fireChange, isDisabled, announce, formatDisplayTime]);
|
|
287
292
|
|
|
288
293
|
// Handle clear button click
|
|
289
294
|
const handleClear = useCallback(() => {
|
|
@@ -377,7 +382,7 @@ export function TimeInput({
|
|
|
377
382
|
as: "div",
|
|
378
383
|
role: "alert",
|
|
379
384
|
"aria-live": "assertive",
|
|
380
|
-
children: !isInputValid ? '
|
|
385
|
+
children: !isInputValid ? t('@astryx.timeInput.invalidTime') : ''
|
|
381
386
|
}), isBusy && /*#__PURE__*/_jsx(Spinner, {
|
|
382
387
|
size: "sm"
|
|
383
388
|
}), hasClear && value && !isDisabled && /*#__PURE__*/_jsx(InputClearButton, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAI9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,OAAO,KAAK,EACV,qBAAqB,EAEtB,MAAM,kBAAkB,CAAC;AAW1B,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,cAAc,CAAC;AAEnB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,cAAc,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACtD;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAmOD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,cAAc,EACd,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,GACtB,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAI9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,OAAO,KAAK,EACV,qBAAqB,EAEtB,MAAM,kBAAkB,CAAC;AAW1B,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,gBAAgB,GAChB,MAAM,GACN,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,GACb,cAAc,CAAC;AAEnB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;;;;;;;;OAkBG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA4BG;IACH,cAAc,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC,CAAC;IACtD;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAmOD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,cAAc,EACd,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,GACtB,EAAE,cAAc,sCA4JhB;yBA7Ke,SAAS"}
|