@astryxdesign/core 0.1.7-canary.8475c0e → 0.1.7-canary.8effb32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Collapsible/Collapsible.d.ts +1 -11
- package/dist/Collapsible/Collapsible.d.ts.map +1 -1
- package/dist/Collapsible/Collapsible.js +4 -36
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +3 -4
- package/dist/ContextMenu/index.d.ts +0 -3
- package/dist/ContextMenu/index.d.ts.map +1 -1
- package/dist/ContextMenu/index.js +1 -7
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +4 -8
- package/dist/DropdownMenu/DropdownMenuContext.d.ts +1 -17
- package/dist/DropdownMenu/DropdownMenuContext.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuContext.js +0 -18
- package/dist/DropdownMenu/index.d.ts +1 -5
- package/dist/DropdownMenu/index.d.ts.map +1 -1
- package/dist/DropdownMenu/index.js +1 -10
- package/dist/Icon/Icon.d.ts +12 -17
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Icon/Icon.js +20 -28
- package/dist/TabList/Tab.d.ts.map +1 -1
- package/dist/TabList/Tab.js +2 -2
- package/dist/TabList/TabList.d.ts.map +1 -1
- package/dist/TabList/TabList.js +0 -2
- package/dist/TabList/TabMenu.d.ts.map +1 -1
- package/dist/TabList/TabMenu.js +1 -1
- package/dist/Toolbar/Toolbar.d.ts.map +1 -1
- package/dist/Toolbar/Toolbar.js +1 -8
- package/dist/astryx.css +2 -17
- package/dist/astryx.umd.js +46 -46
- package/dist/astryx.umd.js.map +4 -4
- package/dist/theme/hct.d.ts +1 -0
- package/dist/theme/hct.d.ts.map +1 -1
- package/dist/theme/hct.js +3 -0
- package/package.json +1 -1
- package/src/Collapsible/Collapsible.doc.mjs +0 -7
- package/src/Collapsible/Collapsible.test.tsx +0 -80
- package/src/Collapsible/Collapsible.tsx +5 -58
- package/src/ContextMenu/ContextMenu.test.tsx +1 -75
- package/src/ContextMenu/ContextMenu.tsx +5 -10
- package/src/ContextMenu/index.ts +0 -15
- package/src/DropdownMenu/DropdownMenu.doc.mjs +0 -23
- package/src/DropdownMenu/DropdownMenu.tsx +6 -11
- package/src/DropdownMenu/DropdownMenuContext.tsx +1 -29
- package/src/DropdownMenu/DropdownMenuItem.doc.mjs +0 -6
- package/src/DropdownMenu/index.ts +3 -23
- package/src/Icon/Icon.test.tsx +0 -46
- package/src/Icon/Icon.tsx +24 -37
- package/src/TabList/Tab.tsx +1 -5
- package/src/TabList/TabList.doc.mjs +3 -3
- package/src/TabList/TabList.test.tsx +0 -66
- package/src/TabList/TabList.tsx +0 -8
- package/src/TabList/TabMenu.tsx +1 -4
- package/src/Toolbar/Toolbar.tsx +3 -10
- package/src/theme/hct.ts +4 -0
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts +0 -89
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +0 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +0 -170
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts +0 -69
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts.map +0 -1
- package/dist/DropdownMenu/DropdownMenuRadioGroup.js +0 -70
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts +0 -69
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +0 -1
- package/dist/DropdownMenu/DropdownMenuRadioItem.js +0 -178
- package/dist/DropdownMenu/menuItemRoles.d.ts +0 -13
- package/dist/DropdownMenu/menuItemRoles.d.ts.map +0 -1
- package/dist/DropdownMenu/menuItemRoles.js +0 -15
- package/src/DropdownMenu/DropdownMenuCheckboxItem.doc.mjs +0 -95
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +0 -237
- package/src/DropdownMenu/DropdownMenuRadioGroup.doc.mjs +0 -80
- package/src/DropdownMenu/DropdownMenuRadioGroup.tsx +0 -119
- package/src/DropdownMenu/DropdownMenuRadioItem.doc.mjs +0 -80
- package/src/DropdownMenu/DropdownMenuRadioItem.tsx +0 -232
- package/src/DropdownMenu/DropdownMenuSelectable.test.tsx +0 -163
- package/src/DropdownMenu/menuItemRoles.ts +0 -22
|
@@ -45,16 +45,6 @@ export interface CollapsibleProps extends BaseProps {
|
|
|
45
45
|
* Controlled open state. When provided, the component is fully controlled.
|
|
46
46
|
*/
|
|
47
47
|
isOpen?: boolean;
|
|
48
|
-
/**
|
|
49
|
-
* Whether the collapsible is disabled. A disabled item can't be toggled —
|
|
50
|
-
* its trigger is non-interactive and dimmed. Following the system-wide
|
|
51
|
-
* disabled convention, the trigger uses `aria-disabled` (not the native
|
|
52
|
-
* `disabled` attribute) and drops out of the tab order, staying perceivable
|
|
53
|
-
* to assistive tech. The content stays in whatever open state it was;
|
|
54
|
-
* disabling doesn't collapse an already-open item.
|
|
55
|
-
* @default false
|
|
56
|
-
*/
|
|
57
|
-
isDisabled?: boolean;
|
|
58
48
|
/**
|
|
59
49
|
* Callback when the open state changes.
|
|
60
50
|
*/
|
|
@@ -106,7 +96,7 @@ export interface CollapsibleProps extends BaseProps {
|
|
|
106
96
|
* </CollapsibleGroup>
|
|
107
97
|
* ```
|
|
108
98
|
*/
|
|
109
|
-
export declare function Collapsible({ trigger, children, defaultIsOpen, isOpen: controlledIsOpen,
|
|
99
|
+
export declare function Collapsible({ trigger, children, defaultIsOpen, isOpen: controlledIsOpen, onOpenChange, value, ref, xstyle, className, style, ...props }: CollapsibleProps): import("react").JSX.Element;
|
|
110
100
|
export declare namespace Collapsible {
|
|
111
101
|
var displayName: string;
|
|
112
102
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../src/Collapsible/Collapsible.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,EAAa,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Collapsible.d.ts","sourceRoot":"","sources":["../../src/Collapsible/Collapsible.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,EAAa,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAgBjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkG5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS;IACjD,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,OAAO,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAO,EACP,QAAQ,EACR,aAAa,EACb,MAAM,EAAE,gBAAgB,EACxB,YAAY,EACZ,KAAK,EACL,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,gBAAgB,+BAqElB;yBAjFe,WAAW"}
|
|
@@ -58,22 +58,12 @@ const styles = {
|
|
|
58
58
|
kInvED: "x1wfwxd8 x7s97pk",
|
|
59
59
|
$$css: true
|
|
60
60
|
},
|
|
61
|
-
triggerDisabled: {
|
|
62
|
-
kkrTdU: "x1h6gzvc",
|
|
63
|
-
kSiTet: "xbyyjgo",
|
|
64
|
-
$$css: true
|
|
65
|
-
},
|
|
66
61
|
contentHidden: {
|
|
67
62
|
k1xSpc: "x1s85apg",
|
|
68
63
|
$$css: true
|
|
69
64
|
},
|
|
70
65
|
content: {
|
|
71
66
|
kLKAdn: "xfsso4q",
|
|
72
|
-
kMv6JI: "x9ynric",
|
|
73
|
-
kGuDYH: "xjm74w1",
|
|
74
|
-
k63SB2: "xxovm9e",
|
|
75
|
-
kLWn49: "xw6l6zx",
|
|
76
|
-
kMwMTN: "x1tgivj0",
|
|
77
67
|
$$css: true
|
|
78
68
|
},
|
|
79
69
|
divided: {
|
|
@@ -165,7 +155,6 @@ export function Collapsible({
|
|
|
165
155
|
children,
|
|
166
156
|
defaultIsOpen,
|
|
167
157
|
isOpen: controlledIsOpen,
|
|
168
|
-
isDisabled = false,
|
|
169
158
|
onOpenChange,
|
|
170
159
|
value,
|
|
171
160
|
ref,
|
|
@@ -189,17 +178,6 @@ export function Collapsible({
|
|
|
189
178
|
isCollapsible: collapsibleConfig,
|
|
190
179
|
value
|
|
191
180
|
});
|
|
192
|
-
|
|
193
|
-
// Activation is blocked by this guard rather than the native `disabled`
|
|
194
|
-
// attribute, so the trigger keeps `aria-disabled` semantics and stays
|
|
195
|
-
// discoverable. A native `disabled` button would silently swallow events
|
|
196
|
-
// (e.g. a wrapping tooltip's hover) — the system-wide disabled convention.
|
|
197
|
-
const handleToggle = () => {
|
|
198
|
-
if (isDisabled) {
|
|
199
|
-
return;
|
|
200
|
-
}
|
|
201
|
-
toggle();
|
|
202
|
-
};
|
|
203
181
|
const presentation = use(CollapsibleGroupPresentationContext);
|
|
204
182
|
const isDivided = presentation?.hasDividers ?? false;
|
|
205
183
|
const density = presentation?.density ?? null;
|
|
@@ -216,18 +194,10 @@ export function Collapsible({
|
|
|
216
194
|
...props,
|
|
217
195
|
children: [/*#__PURE__*/_jsxs("button", {
|
|
218
196
|
type: "button",
|
|
219
|
-
onClick:
|
|
220
|
-
"aria-disabled": isDisabled || undefined,
|
|
197
|
+
onClick: toggle,
|
|
221
198
|
"aria-expanded": isOpen,
|
|
222
|
-
"aria-controls": contentId
|
|
223
|
-
|
|
224
|
-
// dead tab stop; activation stays blocked by the handleToggle guard,
|
|
225
|
-
// and aria-disabled keeps the state perceivable to assistive tech —
|
|
226
|
-
// the system-wide disabled convention (never native `disabled`, which
|
|
227
|
-
// would swallow events like a wrapping tooltip's hover).
|
|
228
|
-
,
|
|
229
|
-
tabIndex: isDisabled ? -1 : undefined,
|
|
230
|
-
...stylex.props(styles.trigger, density != null && triggerDensity[density], isDisabled && styles.triggerDisabled),
|
|
199
|
+
"aria-controls": contentId,
|
|
200
|
+
...stylex.props(styles.trigger, density != null && triggerDensity[density]),
|
|
231
201
|
children: [/*#__PURE__*/_jsx("span", {
|
|
232
202
|
...{
|
|
233
203
|
className: "x1b2iylo xwgcxoh"
|
|
@@ -246,9 +216,7 @@ export function Collapsible({
|
|
|
246
216
|
})]
|
|
247
217
|
}), /*#__PURE__*/_jsx("div", {
|
|
248
218
|
id: contentId,
|
|
249
|
-
...
|
|
250
|
-
density: density ?? undefined
|
|
251
|
-
}), stylex.props(styles.content, density != null && contentDensity[density], !isOpen && styles.contentHidden)),
|
|
219
|
+
...stylex.props(styles.content, density != null && contentDensity[density], !isOpen && styles.contentHidden),
|
|
252
220
|
children: presentation != null ? /*#__PURE__*/_jsx(CollapsibleGroupPresentationContext, {
|
|
253
221
|
value: null,
|
|
254
222
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"ContextMenu.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/ContextMenu.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AAEH,OAAO,KAON,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAqBrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAGjD,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACpB,mBAAmB,EACnB,mBAAmB,EACpB,MAAM,8BAA8B,CAAC;AAqDtC,MAAM,MAAM,mBAAmB,GAAG,oBAAoB,CAAC;AAEvD,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAErD,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,CAAC;AAErD,MAAM,MAAM,iBAAiB,GAAG,kBAAkB,CAAC;AAMnD,UAAU,oBAAqB,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;OAKG;IACH,aAAa,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IAC9C,+DAA+D;IAC/D,QAAQ,EAAE,SAAS,CAAC;IACpB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,wCAAwC;IACxC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,4CAA4C;IAC5C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,oBAAqB,SAAQ,oBAAoB;IACzD,gDAAgD;IAChD,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,WAAW,CAAC,EAAE,SAAS,CAAC;CACzB;AAED,UAAU,wBAAyB,SAAQ,oBAAoB;IAC7D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,+CAA+C;IAC/C,WAAW,EAAE,SAAS,CAAC;CACxB;AAED,MAAM,MAAM,gBAAgB,GAAG,oBAAoB,GAAG,wBAAwB,CAAC;AAM/E;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,SAAS,EACT,IAAW,EACX,KAAK,EAAE,cAAc,EACrB,UAAkB,EAClB,YAAY,EACZ,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,aAAa,EACb,aAAa,EAAE,MAAM,EACrB,GAAG,KAAK,EACT,EAAE,gBAAgB,qBAiRlB;yBA/Re,WAAW"}
|
|
@@ -34,7 +34,6 @@ import * as stylex from '@stylexjs/stylex';
|
|
|
34
34
|
import { useLayer } from "../Layer/useLayer.js";
|
|
35
35
|
import { renderDropdownItems } from "../DropdownMenu/renderDropdownItems.js";
|
|
36
36
|
import { DropdownMenuContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
37
|
-
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR } from "../DropdownMenu/menuItemRoles.js";
|
|
38
37
|
import { useListFocus } from "../hooks/useListFocus.js";
|
|
39
38
|
import { useTypeahead } from "../hooks/useTypeahead.js";
|
|
40
39
|
import { useLongPress } from "../hooks/useLongPress.js";
|
|
@@ -179,13 +178,13 @@ export function ContextMenu({
|
|
|
179
178
|
focusFirst,
|
|
180
179
|
focusItem
|
|
181
180
|
} = useListFocus({
|
|
182
|
-
itemSelector:
|
|
181
|
+
itemSelector: '[role="menuitem"]:not([aria-disabled="true"])',
|
|
183
182
|
wrap: false,
|
|
184
183
|
onEscape: closeMenu
|
|
185
184
|
});
|
|
186
185
|
|
|
187
186
|
// First-character typeahead over the enabled menu items (menus-11).
|
|
188
|
-
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll(
|
|
187
|
+
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')) : [], [listRef]);
|
|
189
188
|
const typeahead = useTypeahead({
|
|
190
189
|
getItemLabels: () => getMenuItems().map(el => el.textContent),
|
|
191
190
|
onMatch: focusItem,
|
|
@@ -239,7 +238,7 @@ export function ContextMenu({
|
|
|
239
238
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
240
239
|
e.preventDefault();
|
|
241
240
|
const focused = document.activeElement;
|
|
242
|
-
if (focused
|
|
241
|
+
if (focused?.getAttribute('role') === 'menuitem') {
|
|
243
242
|
focused.click();
|
|
244
243
|
}
|
|
245
244
|
return;
|
|
@@ -5,7 +5,4 @@
|
|
|
5
5
|
*/
|
|
6
6
|
export { ContextMenu, type ContextMenuProps, type ContextMenuItemData, type ContextMenuDivider, type ContextMenuSection, type ContextMenuOption, } from './ContextMenu';
|
|
7
7
|
export { DropdownMenuItem as ContextMenuItem, type DropdownMenuItemProps as ContextMenuItemProps, } from '../DropdownMenu/DropdownMenuItem';
|
|
8
|
-
export { DropdownMenuCheckboxItem as ContextMenuCheckboxItem, type DropdownMenuCheckboxItemProps as ContextMenuCheckboxItemProps, } from '../DropdownMenu/DropdownMenuCheckboxItem';
|
|
9
|
-
export { DropdownMenuRadioGroup as ContextMenuRadioGroup, type DropdownMenuRadioGroupProps as ContextMenuRadioGroupProps, } from '../DropdownMenu/DropdownMenuRadioGroup';
|
|
10
|
-
export { DropdownMenuRadioItem as ContextMenuRadioItem, type DropdownMenuRadioItemProps as ContextMenuRadioItemProps, } from '../DropdownMenu/DropdownMenuRadioItem';
|
|
11
8
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/index.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AAEH,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACvB,KAAK,iBAAiB,GACvB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,gBAAgB,IAAI,eAAe,EACnC,KAAK,qBAAqB,IAAI,oBAAoB,GACnD,MAAM,kCAAkC,CAAC
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/ContextMenu/index.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AAEH,OAAO,EACL,WAAW,EACX,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,EACvB,KAAK,kBAAkB,EACvB,KAAK,iBAAiB,GACvB,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,gBAAgB,IAAI,eAAe,EACnC,KAAK,qBAAqB,IAAI,oBAAoB,GACnD,MAAM,kCAAkC,CAAC"}
|
|
@@ -7,10 +7,4 @@
|
|
|
7
7
|
* @position Public API entry point
|
|
8
8
|
*/
|
|
9
9
|
export { ContextMenu } from "./ContextMenu.js";
|
|
10
|
-
export { DropdownMenuItem as ContextMenuItem } from "../DropdownMenu/DropdownMenuItem.js";
|
|
11
|
-
|
|
12
|
-
// Selectable items work inside a ContextMenu too — re-exported under the
|
|
13
|
-
// ContextMenu name for a coherent API.
|
|
14
|
-
export { DropdownMenuCheckboxItem as ContextMenuCheckboxItem } from "../DropdownMenu/DropdownMenuCheckboxItem.js";
|
|
15
|
-
export { DropdownMenuRadioGroup as ContextMenuRadioGroup } from "../DropdownMenu/DropdownMenuRadioGroup.js";
|
|
16
|
-
export { DropdownMenuRadioItem as ContextMenuRadioItem } from "../DropdownMenu/DropdownMenuRadioItem.js";
|
|
10
|
+
export { DropdownMenuItem as ContextMenuItem } from "../DropdownMenu/DropdownMenuItem.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAS,KAAK,WAAW,EAAC,MAAM,WAAW,CAAC;AAEnD,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAGf,OAAO,EAAS,KAAK,WAAW,EAAC,MAAM,WAAW,CAAC;AAEnD,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAUtC,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,mBAAmB,CAAC;AAQtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyC5C,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CAC7B;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,oBAAoB,EAAE,CAAC;CAC/B;AAED,MAAM,MAAM,kBAAkB,GAC5B,oBAAoB,GAAG,mBAAmB,GAAG,mBAAmB,CAAC;AAMnE,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;AAEnE,UAAU,qBAAsB,SAAQ,SAAS;IAC/C,MAAM,CAAC,EAAE,uBAAuB,CAAC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,UAAU,qBAAsB,SAAQ,qBAAqB;IAC3D,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,UAAU,yBAA0B,SAAQ,qBAAqB;IAC/D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,MAAM,MAAM,iBAAiB,GAC3B,qBAAqB,GAAG,yBAAyB,CAAC;AA+BpD,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EAAE,eAAe,EACvB,UAAU,EAAE,gBAAgB,EAC5B,YAAY,EACZ,SAAS,EACT,OAAO,EACP,UAAiB,EACjB,SAAmB,EACnB,SAAS,EACT,KAAK,EACL,MAAM,EACN,aAAa,EAAE,MAAM,EACrB,GAAG,KAAK,EACT,EAAE,iBAAiB,qBAwQnB;yBArRe,YAAY"}
|
|
@@ -27,7 +27,6 @@ import { usePopover } from "../Popover/usePopover.js";
|
|
|
27
27
|
import { Button } from "../Button/index.js";
|
|
28
28
|
import { Icon } from "../Icon/index.js";
|
|
29
29
|
import { renderDropdownItems } from "./renderDropdownItems.js";
|
|
30
|
-
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR } from "./menuItemRoles.js";
|
|
31
30
|
import { DropdownMenuContext } from "./DropdownMenuContext.js";
|
|
32
31
|
import { useListFocus } from "../hooks/useListFocus.js";
|
|
33
32
|
import { useTypeahead } from "../hooks/useTypeahead.js";
|
|
@@ -187,24 +186,21 @@ export function DropdownMenu({
|
|
|
187
186
|
popover.hide();
|
|
188
187
|
}, [popover]);
|
|
189
188
|
|
|
190
|
-
// Single keyboard navigation path for both modes
|
|
191
|
-
// The selector matches plain items plus selectable items
|
|
192
|
-
// (menuitemradio/menuitemcheckbox) so lab checkbox/radio rows are reachable
|
|
193
|
-
// and roved to alongside plain items — not just role="menuitem".
|
|
189
|
+
// Single keyboard navigation path for both modes
|
|
194
190
|
const {
|
|
195
191
|
listRef,
|
|
196
192
|
handleKeyDown: listNavKeyDown,
|
|
197
193
|
focusFirst,
|
|
198
194
|
focusItem
|
|
199
195
|
} = useListFocus({
|
|
200
|
-
itemSelector:
|
|
196
|
+
itemSelector: '[role="menuitem"]:not([aria-disabled="true"])',
|
|
201
197
|
wrap: false,
|
|
202
198
|
onEscape: closeMenu
|
|
203
199
|
});
|
|
204
200
|
|
|
205
201
|
// First-character typeahead over the (enabled) menu items — jump to the next
|
|
206
202
|
// item whose label starts with the typed text (menus-11).
|
|
207
|
-
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll(
|
|
203
|
+
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll('[role="menuitem"]:not([aria-disabled="true"])')) : [], [listRef]);
|
|
208
204
|
const typeahead = useTypeahead({
|
|
209
205
|
getItemLabels: () => getMenuItems().map(el => el.textContent),
|
|
210
206
|
onMatch: focusItem,
|
|
@@ -228,7 +224,7 @@ export function DropdownMenu({
|
|
|
228
224
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
229
225
|
e.preventDefault();
|
|
230
226
|
const focused = document.activeElement;
|
|
231
|
-
if (focused
|
|
227
|
+
if (focused?.getAttribute('role') === 'menuitem') {
|
|
232
228
|
focused.click();
|
|
233
229
|
}
|
|
234
230
|
return;
|
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
/** Menu size, derived from the trigger button size. */
|
|
2
|
-
export type DropdownMenuSize = 'sm' | 'md' | 'lg';
|
|
3
1
|
export interface DropdownMenuContextValue {
|
|
4
2
|
/** Close the menu and return focus to trigger */
|
|
5
3
|
closeMenu: () => void;
|
|
6
4
|
/** Menu size derived from button size */
|
|
7
|
-
menuSize:
|
|
5
|
+
menuSize: 'sm' | 'md' | 'lg';
|
|
8
6
|
}
|
|
9
7
|
export declare const DropdownMenuContext: import("react").Context<DropdownMenuContextValue | null>;
|
|
10
8
|
/**
|
|
@@ -12,18 +10,4 @@ export declare const DropdownMenuContext: import("react").Context<DropdownMenuCo
|
|
|
12
10
|
* Returns null outside of a DropdownMenu.
|
|
13
11
|
*/
|
|
14
12
|
export declare function useDropdownMenuContext(): DropdownMenuContextValue | null;
|
|
15
|
-
export interface DropdownMenuRadioGroupContextValue {
|
|
16
|
-
/** The currently selected value in the group. */
|
|
17
|
-
value: string | undefined;
|
|
18
|
-
/** Select a value. Called by a DropdownMenuRadioItem on activation. */
|
|
19
|
-
onChange: (value: string) => void;
|
|
20
|
-
/** Whether selecting an item should close the menu. @default true */
|
|
21
|
-
hasCloseOnSelect: boolean;
|
|
22
|
-
}
|
|
23
|
-
export declare const DropdownMenuRadioGroupContext: import("react").Context<DropdownMenuRadioGroupContextValue | null>;
|
|
24
|
-
/**
|
|
25
|
-
* Read the enclosing radio group's selection state.
|
|
26
|
-
* Returns null when used outside a DropdownMenuRadioGroup.
|
|
27
|
-
*/
|
|
28
|
-
export declare function useDropdownMenuRadioGroupContext(): DropdownMenuRadioGroupContextValue | null;
|
|
29
13
|
//# sourceMappingURL=DropdownMenuContext.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuContext.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuContext.tsx"],"names":[],"mappings":"AAgBA,
|
|
1
|
+
{"version":3,"file":"DropdownMenuContext.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuContext.tsx"],"names":[],"mappings":"AAgBA,MAAM,WAAW,wBAAwB;IACvC,iDAAiD;IACjD,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,yCAAyC;IACzC,QAAQ,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC9B;AAED,eAAO,MAAM,mBAAmB,0DACsB,CAAC;AAGvD;;;GAGG;AACH,wBAAgB,sBAAsB,IAAI,wBAAwB,GAAG,IAAI,CAExE"}
|
|
@@ -12,9 +12,6 @@
|
|
|
12
12
|
* items don't need to register themselves.
|
|
13
13
|
*/
|
|
14
14
|
import { createContext, use } from 'react';
|
|
15
|
-
|
|
16
|
-
/** Menu size, derived from the trigger button size. */
|
|
17
|
-
|
|
18
15
|
export const DropdownMenuContext = /*#__PURE__*/createContext(null);
|
|
19
16
|
DropdownMenuContext.displayName = 'DropdownMenuContext';
|
|
20
17
|
|
|
@@ -24,19 +21,4 @@ DropdownMenuContext.displayName = 'DropdownMenuContext';
|
|
|
24
21
|
*/
|
|
25
22
|
export function useDropdownMenuContext() {
|
|
26
23
|
return use(DropdownMenuContext);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// =============================================================================
|
|
30
|
-
// Radio group coordination
|
|
31
|
-
// =============================================================================
|
|
32
|
-
|
|
33
|
-
export const DropdownMenuRadioGroupContext = /*#__PURE__*/createContext(null);
|
|
34
|
-
DropdownMenuRadioGroupContext.displayName = 'DropdownMenuRadioGroupContext';
|
|
35
|
-
|
|
36
|
-
/**
|
|
37
|
-
* Read the enclosing radio group's selection state.
|
|
38
|
-
* Returns null when used outside a DropdownMenuRadioGroup.
|
|
39
|
-
*/
|
|
40
|
-
export function useDropdownMenuRadioGroupContext() {
|
|
41
|
-
return use(DropdownMenuRadioGroupContext);
|
|
42
24
|
}
|
|
@@ -4,9 +4,5 @@
|
|
|
4
4
|
* @position Public API entry point
|
|
5
5
|
*/
|
|
6
6
|
export { DropdownMenu, type DropdownMenuProps, type DropdownMenuButtonProps, type DropdownMenuItemData, type DropdownMenuDivider, type DropdownMenuSection, type DropdownMenuOption, } from './DropdownMenu';
|
|
7
|
-
export { DropdownMenuItem, type DropdownMenuItemProps } from './DropdownMenuItem';
|
|
8
|
-
export { DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, } from './DropdownMenuCheckboxItem';
|
|
9
|
-
export { DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, } from './DropdownMenuRadioGroup';
|
|
10
|
-
export { DropdownMenuRadioItem, type DropdownMenuRadioItemProps, } from './DropdownMenuRadioItem';
|
|
11
|
-
export { DropdownMenuContext, useDropdownMenuContext, type DropdownMenuContextValue, type DropdownMenuSize, } from './DropdownMenuContext';
|
|
7
|
+
export { DropdownMenuItem, type DropdownMenuItemProps, } from './DropdownMenuItem';
|
|
12
8
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AAEH,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,GACxB,MAAM,gBAAgB,CAAC;AAExB,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AAEH,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,oBAAoB,EACzB,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,GACxB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC"}
|
|
@@ -8,13 +8,4 @@
|
|
|
8
8
|
* @position Public API entry point
|
|
9
9
|
*/
|
|
10
10
|
export { DropdownMenu } from "./DropdownMenu.js";
|
|
11
|
-
export { DropdownMenuItem } from "./DropdownMenuItem.js";
|
|
12
|
-
|
|
13
|
-
// Selectable items — checkbox (independent) and radio (single-select group).
|
|
14
|
-
export { DropdownMenuCheckboxItem } from "./DropdownMenuCheckboxItem.js";
|
|
15
|
-
export { DropdownMenuRadioGroup } from "./DropdownMenuRadioGroup.js";
|
|
16
|
-
export { DropdownMenuRadioItem } from "./DropdownMenuRadioItem.js";
|
|
17
|
-
|
|
18
|
-
// Menu-coordination context — public so consumers can build custom menu items
|
|
19
|
-
// that read the menu size / close the menu.
|
|
20
|
-
export { DropdownMenuContext, useDropdownMenuContext } from "./DropdownMenuContext.js";
|
|
11
|
+
export { DropdownMenuItem } from "./DropdownMenuItem.js";
|
package/dist/Icon/Icon.d.ts
CHANGED
|
@@ -82,28 +82,23 @@ declare const colorStyles: Readonly<{
|
|
|
82
82
|
/**
|
|
83
83
|
* Size styles for direct SVG icon components.
|
|
84
84
|
* Uses width/height only — SVG components handle their own viewBox scaling.
|
|
85
|
-
*
|
|
86
|
-
* Sizes are expressed in `rem` (relative to the root font-size) so icons scale
|
|
87
|
-
* in step with text when the document font-size changes, matching the rest of
|
|
88
|
-
* the design system's rem-based type scale. Values are the px-equivalents at a
|
|
89
|
-
* 16px root: 12px → 0.75rem, 16px → 1rem, 20px → 1.25rem, 24px → 1.5rem.
|
|
90
85
|
*/
|
|
91
86
|
declare const sizeStyles: Readonly<{
|
|
92
87
|
readonly xsm: Readonly<{
|
|
93
|
-
readonly width: stylex.StyleXClassNameFor<"width",
|
|
94
|
-
readonly height: stylex.StyleXClassNameFor<"height",
|
|
88
|
+
readonly width: stylex.StyleXClassNameFor<"width", 12>;
|
|
89
|
+
readonly height: stylex.StyleXClassNameFor<"height", 12>;
|
|
95
90
|
}>;
|
|
96
91
|
readonly sm: Readonly<{
|
|
97
|
-
readonly width: stylex.StyleXClassNameFor<"width",
|
|
98
|
-
readonly height: stylex.StyleXClassNameFor<"height",
|
|
92
|
+
readonly width: stylex.StyleXClassNameFor<"width", 16>;
|
|
93
|
+
readonly height: stylex.StyleXClassNameFor<"height", 16>;
|
|
99
94
|
}>;
|
|
100
95
|
readonly md: Readonly<{
|
|
101
|
-
readonly width: stylex.StyleXClassNameFor<"width",
|
|
102
|
-
readonly height: stylex.StyleXClassNameFor<"height",
|
|
96
|
+
readonly width: stylex.StyleXClassNameFor<"width", 20>;
|
|
97
|
+
readonly height: stylex.StyleXClassNameFor<"height", 20>;
|
|
103
98
|
}>;
|
|
104
99
|
readonly lg: Readonly<{
|
|
105
|
-
readonly width: stylex.StyleXClassNameFor<"width",
|
|
106
|
-
readonly height: stylex.StyleXClassNameFor<"height",
|
|
100
|
+
readonly width: stylex.StyleXClassNameFor<"width", 24>;
|
|
101
|
+
readonly height: stylex.StyleXClassNameFor<"height", 24>;
|
|
107
102
|
}>;
|
|
108
103
|
}>;
|
|
109
104
|
export type IconColor = keyof typeof colorStyles;
|
|
@@ -133,10 +128,10 @@ export interface IconProps extends Omit<SVGProps<SVGSVGElement>, 'ref' | 'color'
|
|
|
133
128
|
color?: IconColor;
|
|
134
129
|
/**
|
|
135
130
|
* The size of the icon.
|
|
136
|
-
* - 'xsm':
|
|
137
|
-
* - 'sm':
|
|
138
|
-
* - 'md':
|
|
139
|
-
* - 'lg':
|
|
131
|
+
* - 'xsm': 12px
|
|
132
|
+
* - 'sm': 16px
|
|
133
|
+
* - 'md': 20px
|
|
134
|
+
* - 'lg': 24px
|
|
140
135
|
* @default 'md'
|
|
141
136
|
*/
|
|
142
137
|
size?: IconSize;
|
package/dist/Icon/Icon.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AAqBnD,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAEH
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAC,MAAM,OAAO,CAAC;AAC/D,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,sBAAsB,CAAC;AAqBnD,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2Df,CAAC;AAEH;;;GAGG;AACH,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;EAiBd,CAAC;AAiCH,MAAM,MAAM,SAAS,GAAG,MAAM,OAAO,WAAW,CAAC;AACjD,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,UAAU,CAAC;AAE/C;;;GAGG;AACH,MAAM,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;AAE9D;;;GAGG;AACH,MAAM,WAAW,SAAU,SAAQ,IAAI,CACrC,QAAQ,CAAC,aAAa,CAAC,EACvB,KAAK,GAAG,OAAO,CAChB;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC1B;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;OAOG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;CACjB;AAMD;;;;;;;GAOG;AACH,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,KAAiB,EACjB,IAAW,EACX,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,qBA0BX;yBAhCe,IAAI;;;AAiFpB;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,KAAK,CAAC,SAAS,GAAG,QAAQ,EAChC,KAAK,CAAC,EAAE;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAA;CAAC,GAC3C,KAAK,CAAC,SAAS,CAYjB"}
|
package/dist/Icon/Icon.js
CHANGED
|
@@ -128,31 +128,26 @@ const colorStyles = {
|
|
|
128
128
|
/**
|
|
129
129
|
* Size styles for direct SVG icon components.
|
|
130
130
|
* Uses width/height only — SVG components handle their own viewBox scaling.
|
|
131
|
-
*
|
|
132
|
-
* Sizes are expressed in `rem` (relative to the root font-size) so icons scale
|
|
133
|
-
* in step with text when the document font-size changes, matching the rest of
|
|
134
|
-
* the design system's rem-based type scale. Values are the px-equivalents at a
|
|
135
|
-
* 16px root: 12px → 0.75rem, 16px → 1rem, 20px → 1.25rem, 24px → 1.5rem.
|
|
136
131
|
*/
|
|
137
132
|
const sizeStyles = {
|
|
138
133
|
xsm: {
|
|
139
|
-
kzqmXN: "
|
|
140
|
-
kZKoxP: "
|
|
134
|
+
kzqmXN: "xsmyaan",
|
|
135
|
+
kZKoxP: "x1kpxq89",
|
|
141
136
|
$$css: true
|
|
142
137
|
},
|
|
143
138
|
sm: {
|
|
144
|
-
kzqmXN: "
|
|
145
|
-
kZKoxP: "
|
|
139
|
+
kzqmXN: "x1kky2od",
|
|
140
|
+
kZKoxP: "xlup9mm",
|
|
146
141
|
$$css: true
|
|
147
142
|
},
|
|
148
143
|
md: {
|
|
149
|
-
kzqmXN: "
|
|
150
|
-
kZKoxP: "
|
|
144
|
+
kzqmXN: "xw4jnvo",
|
|
145
|
+
kZKoxP: "x1qx5ct2",
|
|
151
146
|
$$css: true
|
|
152
147
|
},
|
|
153
148
|
lg: {
|
|
154
|
-
kzqmXN: "
|
|
155
|
-
kZKoxP: "
|
|
149
|
+
kzqmXN: "xvy4d1p",
|
|
150
|
+
kZKoxP: "xxk0z11",
|
|
156
151
|
$$css: true
|
|
157
152
|
}
|
|
158
153
|
};
|
|
@@ -160,33 +155,30 @@ const sizeStyles = {
|
|
|
160
155
|
/**
|
|
161
156
|
* Size styles for string-based (registry) icons.
|
|
162
157
|
* Includes fontSize so that 1em-based icons from the registry scale correctly.
|
|
163
|
-
*
|
|
164
|
-
* Expressed in `rem` for the same reason as {@link sizeStyles} — icons track the
|
|
165
|
-
* root font-size instead of being locked to absolute pixels.
|
|
166
158
|
*/
|
|
167
159
|
const spanSizeStyles = {
|
|
168
160
|
xsm: {
|
|
169
|
-
kzqmXN: "
|
|
170
|
-
kZKoxP: "
|
|
171
|
-
kGuDYH: "
|
|
161
|
+
kzqmXN: "xsmyaan",
|
|
162
|
+
kZKoxP: "x1kpxq89",
|
|
163
|
+
kGuDYH: "xfifm61",
|
|
172
164
|
$$css: true
|
|
173
165
|
},
|
|
174
166
|
sm: {
|
|
175
|
-
kzqmXN: "
|
|
176
|
-
kZKoxP: "
|
|
177
|
-
kGuDYH: "
|
|
167
|
+
kzqmXN: "x1kky2od",
|
|
168
|
+
kZKoxP: "xlup9mm",
|
|
169
|
+
kGuDYH: "x1j61zf2",
|
|
178
170
|
$$css: true
|
|
179
171
|
},
|
|
180
172
|
md: {
|
|
181
|
-
kzqmXN: "
|
|
182
|
-
kZKoxP: "
|
|
183
|
-
kGuDYH: "
|
|
173
|
+
kzqmXN: "xw4jnvo",
|
|
174
|
+
kZKoxP: "x1qx5ct2",
|
|
175
|
+
kGuDYH: "xwsyq91",
|
|
184
176
|
$$css: true
|
|
185
177
|
},
|
|
186
178
|
lg: {
|
|
187
|
-
kzqmXN: "
|
|
188
|
-
kZKoxP: "
|
|
189
|
-
kGuDYH: "
|
|
179
|
+
kzqmXN: "xvy4d1p",
|
|
180
|
+
kZKoxP: "xxk0z11",
|
|
181
|
+
kGuDYH: "x1pvqxga",
|
|
190
182
|
$$css: true
|
|
191
183
|
}
|
|
192
184
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../src/TabList/Tab.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAAc,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAYzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,QAAS,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5D;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;
|
|
1
|
+
{"version":3,"file":"Tab.d.ts","sourceRoot":"","sources":["../../src/TabList/Tab.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAAc,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAYzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,QAAS,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC5D;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAoID;;;;;;;;;;;GAWG;AACH,wBAAgB,GAAG,CAAC,EAClB,EAAE,EACF,GAAG,EACH,KAAK,EACL,KAAK,EACL,aAAqB,EACrB,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,SAAS,EACb,EAAE,QAAQ,qBA2GV;yBAzHe,GAAG"}
|
package/dist/TabList/Tab.js
CHANGED
|
@@ -206,10 +206,10 @@ export function Tab({
|
|
|
206
206
|
selected: isSelected ? 'selected' : null
|
|
207
207
|
}), {
|
|
208
208
|
0: {
|
|
209
|
-
className: "x10l6tqk
|
|
209
|
+
className: "x10l6tqk xqmqy1e xnp31yv xmz3bnw x36qwtl xjspbzw x47corl xnpjden xuedmi6 xlr8y92 xjbqb8w xg01cxk"
|
|
210
210
|
},
|
|
211
211
|
1: {
|
|
212
|
-
className: "x10l6tqk
|
|
212
|
+
className: "x10l6tqk xqmqy1e xnp31yv xmz3bnw x36qwtl xjspbzw x47corl xnpjden xuedmi6 xlr8y92 x1ewilqj x1hc1fzr"
|
|
213
213
|
}
|
|
214
214
|
}[!!isSelected << 0])
|
|
215
215
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabList.d.ts","sourceRoot":"","sources":["../../src/TabList/TabList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAuB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGlE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,kBAAkB,CAAC;AAKtE,OAAO,EAAC,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAWjE,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC5E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;
|
|
1
|
+
{"version":3,"file":"TabList.d.ts","sourceRoot":"","sources":["../../src/TabList/TabList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAuB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGlE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,kBAAkB,EAAE,WAAW,EAAC,MAAM,kBAAkB,CAAC;AAKtE,OAAO,EAAC,cAAc,EAAC,MAAM,mCAAmC,CAAC;AAWjE,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,UAAU,CAAC;IAC5E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;OAIG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,KAAK,GAAG,MAAM,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAoBD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,EACtB,GAAG,EACH,KAAK,EACL,QAAQ,EACR,IAAI,EAAE,QAAQ,EACd,MAAc,EACd,UAAkB,EAClB,WAA0B,EAC1B,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,kBAAkB,EAChC,kBAAkB,EAAE,gBAAgB,EACpC,CAAC,cAAc,CAAC,EAAE,aAAa,EAC/B,GAAG,SAAS,EACb,EAAE,YAAY,qBAmGd;yBAtHe,OAAO"}
|
package/dist/TabList/TabList.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabMenu.d.ts","sourceRoot":"","sources":["../../src/TabList/TabMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAA6B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGxE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAiBtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CAC7B;AAED,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,SAAS,CAAC,iBAAiB,CAAC,EAC5B,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,aAAa,EAAE,CAAC;CAC1B;
|
|
1
|
+
{"version":3,"file":"TabMenu.d.ts","sourceRoot":"","sources":["../../src/TabList/TabMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAA6B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGxE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAiBtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAG5C,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;CAC7B;AAED,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,SAAS,CAAC,iBAAiB,CAAC,EAC5B,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,aAAa,EAAE,CAAC;CAC1B;AA8KD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,EACtB,GAAG,EACH,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,YAAY,qBAqLd;yBA5Le,OAAO"}
|
package/dist/TabList/TabMenu.js
CHANGED
|
@@ -240,7 +240,7 @@ export function TabMenu({
|
|
|
240
240
|
...mergeProps(themeProps('tab-indicator', {
|
|
241
241
|
selected: 'selected'
|
|
242
242
|
}), {
|
|
243
|
-
className: "x10l6tqk
|
|
243
|
+
className: "x10l6tqk xqmqy1e xnp31yv xmz3bnw x36qwtl xjspbzw x47corl xnpjden xuedmi6 xlr8y92 xowkcby x1hc1fzr"
|
|
244
244
|
})
|
|
245
245
|
})]
|
|
246
246
|
}), popover.render(/*#__PURE__*/_jsxs("div", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAc,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAClD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,4BAA4B,CAAC;AAqH5D,MAAM,MAAM,WAAW,GAAG,WAAW,CAAC;AAEtC,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC7D,gDAAgD;IAChD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,GAAG,CAAC,EAAE,WAAW,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;CACnD;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,EACtB,YAAY,EACZ,aAAa,EACb,UAAU,EACV,KAAK,EACL,IAAW,EACX,GAAO,EACP,WAA0B,EAC1B,OAAuB,EACvB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,IAAI,EAAE,KAAK,EACX,YAAY,EAAE,UAAU,EACxB,kBAAkB,EAAE,gBAAgB,EACpC,GAAG,KAAK,EACT,EAAE,YAAY,+
|
|
1
|
+
{"version":3,"file":"Toolbar.d.ts","sourceRoot":"","sources":["../../src/Toolbar/Toolbar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAc,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAClD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,4BAA4B,CAAC;AAqH5D,MAAM,MAAM,WAAW,GAAG,WAAW,CAAC;AAEtC,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC7D,gDAAgD;IAChD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;OAGG;IACH,GAAG,CAAC,EAAE,WAAW,CAAC;IAClB;;;;OAIG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC;;;OAGG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB;;;;;;;OAOG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC,EAAE,CAAC;CACnD;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,EACtB,YAAY,EACZ,aAAa,EACb,UAAU,EACV,KAAK,EACL,IAAW,EACX,GAAO,EACP,WAA0B,EAC1B,OAAuB,EACvB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,SAAS,EAAE,aAAa,EACxB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,IAAI,EAAE,KAAK,EACX,YAAY,EAAE,UAAU,EACxB,kBAAkB,EAAE,gBAAgB,EACpC,GAAG,KAAK,EACT,EAAE,YAAY,+BA+Id;yBApKe,OAAO"}
|
package/dist/Toolbar/Toolbar.js
CHANGED
|
@@ -180,7 +180,6 @@ export function Toolbar({
|
|
|
180
180
|
const hasCenterContent = centerContent != null;
|
|
181
181
|
const hasStartContent = startContent != null;
|
|
182
182
|
const hasEndContent = endContent != null;
|
|
183
|
-
const hasBottomDivider = dividers?.includes('bottom') ?? false;
|
|
184
183
|
const gapVar = spacingVars[spacingStepToVar[gap]];
|
|
185
184
|
const {
|
|
186
185
|
listRef,
|
|
@@ -243,13 +242,7 @@ export function Toolbar({
|
|
|
243
242
|
onBlur: handleToolbarBlur,
|
|
244
243
|
...mergeProps(themeProps('toolbar', {
|
|
245
244
|
size
|
|
246
|
-
}), stylex.props(hasCenterContent ? styles.baseGrid : styles.baseFlex, orientation === 'vertical' && styles.vertical, sizeStyles.base, dynamicStyles.gap(gapVar),
|
|
247
|
-
// Only drop the tab indicator through the toolbar's block padding
|
|
248
|
-
// onto the rail when a bottom divider is actually present.
|
|
249
|
-
// Without a divider, leave `--_tab-indicator-bottom` unset so a
|
|
250
|
-
// nested TabList's indicator keeps its own default (hugging the
|
|
251
|
-
// tab) instead of floating down into the toolbar's padding.
|
|
252
|
-
hasBottomDivider && dynamicStyles.tabIndicatorBottom(`calc(-1 * (${blockPaddingVarForSize[size]} + 1px))`))),
|
|
245
|
+
}), stylex.props(hasCenterContent ? styles.baseGrid : styles.baseFlex, orientation === 'vertical' && styles.vertical, sizeStyles.base, dynamicStyles.gap(gapVar), dynamicStyles.tabIndicatorBottom(`calc(-1 * (${blockPaddingVarForSize[size]}${dividers?.includes('bottom') ? ' + 1px' : ''}))`))),
|
|
253
246
|
...props,
|
|
254
247
|
children: [hasCenterContent ?
|
|
255
248
|
/*#__PURE__*/
|