@astryxdesign/core 0.4.0 → 0.4.1-canary.0ad35c3
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 +11 -9
- 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/Chat/ChatMessage.d.ts +7 -0
- package/dist/Chat/ChatMessage.d.ts.map +1 -1
- package/dist/Chat/ChatMessageBubble.d.ts +13 -1
- package/dist/Chat/ChatMessageBubble.d.ts.map +1 -1
- package/dist/Chat/ChatMessageBubble.js +19 -1
- 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/HoverCard/HoverCard.d.ts +1 -1
- package/dist/HoverCard/HoverCard.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.js +5 -13
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +6 -5
- 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/InputGroup/groupStyles.d.ts.map +1 -1
- package/dist/InputGroup/groupStyles.js +7 -2
- package/dist/Layer/layerHost.d.ts +24 -0
- package/dist/Layer/layerHost.d.ts.map +1 -0
- package/dist/Layer/layerHost.js +79 -0
- package/dist/Layer/useLayer.d.ts +14 -6
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +155 -29
- 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 +23 -24
- package/dist/astryx.umd.js +47 -47
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/index.d.ts +1 -1
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -1
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +16 -2
- 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 +10 -7
- package/src/ButtonGroup/ButtonGroup.test.tsx +7 -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/Chat/Chat.doc.mjs +4 -1
- package/src/Chat/ChatMessage.doc.mjs +3 -3
- package/src/Chat/ChatMessage.tsx +7 -0
- package/src/Chat/ChatMessageBubble.doc.mjs +7 -0
- package/src/Chat/ChatMessageBubble.test.tsx +95 -6
- package/src/Chat/ChatMessageBubble.tsx +25 -0
- 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/HoverCard/HoverCard.doc.mjs +3 -3
- package/src/HoverCard/HoverCard.test.tsx +283 -55
- package/src/HoverCard/HoverCard.tsx +5 -13
- package/src/HoverCard/useHoverCard.tsx +8 -11
- 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/InputGroup/groupStyles.ts +7 -8
- package/src/Layer/layerHost.test.ts +99 -0
- package/src/Layer/layerHost.ts +141 -0
- package/src/Layer/useLayer.doc.mjs +14 -4
- package/src/Layer/useLayer.test.tsx +318 -7
- package/src/Layer/useLayer.tsx +229 -35
- 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/Text/Text.doc.mjs +1 -1
- package/src/TimeInput/TimeInput.test.tsx +54 -0
- package/src/TimeInput/TimeInput.tsx +17 -2
- package/src/Timestamp/Timestamp.test.tsx +125 -30
- package/src/Timestamp/Timestamp.tsx +14 -2
- package/src/Timestamp/formatInstant.ts +16 -1
- package/src/Toolbar/Toolbar.test.tsx +14 -14
- 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/index.ts +5 -1
- package/src/hooks/useFocusTrap.test.tsx +16 -0
- package/src/hooks/useFocusTrap.ts +20 -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/themingTargets.test.ts +152 -26
- 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"}
|