@astryxdesign/core 0.2.0-canary.c544487 → 0.2.0-canary.ca77e27
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/Center/Center.d.ts +20 -3
- package/dist/Center/Center.d.ts.map +1 -1
- package/dist/Center/Center.js +10 -2
- package/dist/Chat/ChatLayout.d.ts +7 -0
- package/dist/Chat/ChatLayout.d.ts.map +1 -1
- package/dist/Chat/ChatLayout.js +14 -3
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts +18 -12
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +38 -63
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +9 -1
- package/dist/DropdownMenu/menuItemHover.d.ts +1 -0
- package/dist/DropdownMenu/menuItemHover.d.ts.map +1 -1
- package/dist/DropdownMenu/menuItemHover.js +1 -0
- package/dist/FieldStatus/FieldStatus.d.ts.map +1 -1
- package/dist/FieldStatus/FieldStatus.js +12 -2
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +3 -2
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +15 -2
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +7 -3
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +6 -2
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +18 -3
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +21 -3
- package/dist/Table/plugins/tree/useTableTreeData.d.ts +11 -0
- package/dist/Table/plugins/tree/useTableTreeData.d.ts.map +1 -1
- package/dist/Table/plugins/tree/useTableTreeData.js +36 -2
- package/dist/Text/Text.d.ts +10 -1
- package/dist/Text/Text.d.ts.map +1 -1
- package/dist/Text/Text.js +25 -2
- package/dist/Text/index.d.ts +2 -2
- package/dist/Text/index.d.ts.map +1 -1
- package/dist/TextArea/TextArea.d.ts.map +1 -1
- package/dist/TextArea/TextArea.js +106 -38
- package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
- package/dist/Thumbnail/Thumbnail.js +51 -45
- package/dist/Timestamp/Timestamp.js +1 -1
- package/dist/astryx.css +43 -4
- package/dist/astryx.umd.js +47 -47
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/containerReveal.pool.stylex.d.ts +281 -0
- package/dist/hooks/containerReveal.pool.stylex.d.ts.map +1 -0
- package/dist/hooks/containerReveal.pool.stylex.js +281 -0
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +2 -1
- package/dist/hooks/useContainerReveal.d.ts +83 -0
- package/dist/hooks/useContainerReveal.d.ts.map +1 -0
- package/dist/hooks/useContainerReveal.js +123 -0
- package/dist/hooks/useInputStatusIcon.d.ts.map +1 -1
- package/dist/hooks/useInputStatusIcon.js +11 -0
- package/dist/theme/defineTheme.d.ts +6 -0
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/expandColorScale.d.ts +19 -2
- package/dist/theme/expandColorScale.d.ts.map +1 -1
- package/dist/theme/expandColorScale.js +38 -10
- package/dist/theme/index.d.ts +3 -3
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/types.d.ts +39 -2
- package/dist/theme/types.d.ts.map +1 -1
- package/locales/en.json +8 -0
- package/locales/pseudo.json +6 -0
- package/package.json +3 -3
- package/src/Center/Center.doc.mjs +38 -0
- package/src/Center/Center.test.tsx +75 -0
- package/src/Center/Center.tsx +37 -2
- package/src/Chat/ChatLayout.test.tsx +57 -0
- package/src/Chat/ChatLayout.tsx +22 -1
- package/src/DropdownMenu/DropdownMenu.doc.mjs +0 -5
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +41 -64
- package/src/DropdownMenu/DropdownMenuSelectable.test.tsx +31 -0
- package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +29 -1
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +13 -5
- package/src/DropdownMenu/menuItemHover.ts +1 -0
- package/src/Field/Field.doc.mjs +4 -0
- package/src/FieldStatus/FieldStatus.doc.mjs +1 -0
- package/src/FieldStatus/FieldStatus.test.tsx +61 -0
- package/src/FieldStatus/FieldStatus.tsx +14 -3
- package/src/Heading/Heading.tsx +2 -1
- package/src/Lightbox/Lightbox.test.tsx +33 -0
- package/src/Lightbox/Lightbox.tsx +15 -3
- package/src/MultiSelector/MultiSelector.test.tsx +34 -0
- package/src/MultiSelector/MultiSelector.tsx +13 -8
- package/src/Selector/Selector.test.tsx +30 -0
- package/src/Selector/Selector.tsx +7 -3
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +21 -3
- package/src/Table/plugins/tree/useTableTreeData.test.tsx +161 -2
- package/src/Table/plugins/tree/useTableTreeData.tsx +54 -1
- package/src/Table/useTableRowExpansion.doc.mjs +55 -2
- package/src/Table/useTableTreeData.doc.mjs +9 -0
- package/src/Text/Heading.doc.mjs +3 -3
- package/src/Text/Text.doc.mjs +1 -1
- package/src/Text/Text.test.tsx +42 -0
- package/src/Text/Text.tsx +25 -1
- package/src/Text/index.ts +2 -6
- package/src/TextArea/TextArea.doc.mjs +2 -2
- package/src/TextArea/TextArea.test.tsx +112 -7
- package/src/TextArea/TextArea.tsx +142 -49
- package/src/Thumbnail/Thumbnail.test.tsx +24 -1
- package/src/Thumbnail/Thumbnail.tsx +27 -34
- package/src/__tests__/babelPluginAddExtensions.test.ts +190 -0
- package/src/hooks/containerReveal.pool.stylex.ts +464 -0
- package/src/hooks/index.ts +7 -0
- package/src/hooks/useContainerReveal.test.tsx +116 -0
- package/src/hooks/useContainerReveal.ts +180 -0
- package/src/hooks/useInputStatusIcon.test.tsx +59 -0
- package/src/hooks/useInputStatusIcon.tsx +12 -1
- package/src/theme/defineTheme.ts +6 -0
- package/src/theme/expandColorScale.test.ts +144 -0
- package/src/theme/expandColorScale.ts +53 -15
- package/src/theme/index.ts +4 -8
- package/src/theme/types.ts +43 -13
- package/dist/Thumbnail/thumbnail.markers.stylex.d.ts +0 -9
- package/dist/Thumbnail/thumbnail.markers.stylex.d.ts.map +0 -1
- package/dist/Thumbnail/thumbnail.markers.stylex.js +0 -14
- package/src/Thumbnail/thumbnail.markers.stylex.ts +0 -12
package/dist/Center/Center.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file Center.tsx
|
|
3
|
-
* @input Uses React, StyleX for centering styles
|
|
3
|
+
* @input Uses React, StyleX for centering styles, Layout padding.stylex for spacing-scale padding
|
|
4
4
|
* @output Exports Center component and CenterProps
|
|
5
5
|
* @position Center component for centering children horizontally/vertically
|
|
6
6
|
*
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
*/
|
|
13
13
|
import type { ReactNode } from 'react';
|
|
14
14
|
import type { BaseProps } from '../BaseProps';
|
|
15
|
-
import type { SizeValue } from '../utils/types';
|
|
15
|
+
import type { SizeValue, SpacingStep } from '../utils/types';
|
|
16
16
|
export type CenterAxis = 'both' | 'horizontal' | 'vertical';
|
|
17
17
|
export interface CenterProps extends BaseProps<HTMLDivElement> {
|
|
18
18
|
/** Ref forwarded to the root element */
|
|
@@ -45,6 +45,23 @@ export interface CenterProps extends BaseProps<HTMLDivElement> {
|
|
|
45
45
|
* Numbers are treated as pixels, strings are used as-is (e.g., '100%').
|
|
46
46
|
*/
|
|
47
47
|
minHeight?: SizeValue;
|
|
48
|
+
/**
|
|
49
|
+
* Inner padding on all sides, using the spacing scale.
|
|
50
|
+
* Accepts numeric spacing steps: 0, 0.5, 1, 1.5, 2, 3, 4, 5, 6, 8, 10.
|
|
51
|
+
*
|
|
52
|
+
* Matches the `padding` prop on `Stack`, `Card`, `LayoutContent`, and `LayoutPanel`.
|
|
53
|
+
*/
|
|
54
|
+
padding?: SpacingStep;
|
|
55
|
+
/**
|
|
56
|
+
* Inline (horizontal) padding, using the spacing scale.
|
|
57
|
+
* Overrides `padding` on the inline axis when both are set.
|
|
58
|
+
*/
|
|
59
|
+
paddingInline?: SpacingStep;
|
|
60
|
+
/**
|
|
61
|
+
* Block (vertical) padding, using the spacing scale.
|
|
62
|
+
* Overrides `padding` on the block axis when both are set.
|
|
63
|
+
*/
|
|
64
|
+
paddingBlock?: SpacingStep;
|
|
48
65
|
/**
|
|
49
66
|
* Whether to make the container inline-flex (useful for text/icons).
|
|
50
67
|
* @default false
|
|
@@ -68,7 +85,7 @@ export interface CenterProps extends BaseProps<HTMLDivElement> {
|
|
|
68
85
|
* </Center>
|
|
69
86
|
* ```
|
|
70
87
|
*/
|
|
71
|
-
export declare function Center({ axis, width, height, maxWidth, minHeight, isInline, children, xstyle, className, style, ref, ...props }: CenterProps): import("react").JSX.Element;
|
|
88
|
+
export declare function Center({ axis, width, height, maxWidth, minHeight, padding, paddingInline, paddingBlock, isInline, children, xstyle, className, style, ref, ...props }: CenterProps): import("react").JSX.Element;
|
|
72
89
|
export declare namespace Center {
|
|
73
90
|
var displayName: string;
|
|
74
91
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Center.d.ts","sourceRoot":"","sources":["../../src/Center/Center.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Center.d.ts","sourceRoot":"","sources":["../../src/Center/Center.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAsC3D,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,UAAU,CAAC;AAE5D,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,aAAa,CAAC,EAAE,WAAW,CAAC;IAE5B;;;OAGG;IACH,YAAY,CAAC,EAAE,WAAW,CAAC;IAE3B;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,IAAa,EACb,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,OAAO,EACP,aAAa,EACb,YAAY,EACZ,QAAgB,EAChB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAgCb;yBAhDe,MAAM"}
|
package/dist/Center/Center.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file Center.tsx
|
|
7
|
-
* @input Uses React, StyleX for centering styles
|
|
7
|
+
* @input Uses React, StyleX for centering styles, Layout padding.stylex for spacing-scale padding
|
|
8
8
|
* @output Exports Center component and CenterProps
|
|
9
9
|
* @position Center component for centering children horizontally/vertically
|
|
10
10
|
*
|
|
@@ -15,6 +15,7 @@
|
|
|
15
15
|
* - /packages/cli/templates/blocks/components/Center/ (showcase blocks)
|
|
16
16
|
*/
|
|
17
17
|
import * as stylex from '@stylexjs/stylex';
|
|
18
|
+
import { paddingInlineStyles, paddingBlockStyles } from "../Layout/padding.stylex.js";
|
|
18
19
|
import { mergeProps } from "../utils/index.js";
|
|
19
20
|
import { themeProps } from "../utils/themeProps.js";
|
|
20
21
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -71,6 +72,9 @@ export function Center({
|
|
|
71
72
|
height,
|
|
72
73
|
maxWidth,
|
|
73
74
|
minHeight,
|
|
75
|
+
padding,
|
|
76
|
+
paddingInline,
|
|
77
|
+
paddingBlock,
|
|
74
78
|
isInline = false,
|
|
75
79
|
children,
|
|
76
80
|
xstyle,
|
|
@@ -79,9 +83,13 @@ export function Center({
|
|
|
79
83
|
ref,
|
|
80
84
|
...props
|
|
81
85
|
}) {
|
|
86
|
+
// Resolve padding to per-axis values: `padding` sets both axes; `paddingInline`
|
|
87
|
+
// / `paddingBlock` take precedence on their own axis when provided.
|
|
88
|
+
const resolvedPaddingInline = paddingInline ?? padding;
|
|
89
|
+
const resolvedPaddingBlock = paddingBlock ?? padding;
|
|
82
90
|
const stylexProps = mergeProps(themeProps('center', {
|
|
83
91
|
axis
|
|
84
|
-
}), stylex.props(isInline ? styles.inline : styles.base, (axis === 'both' || axis === 'vertical') && styles.alignItemsCenter, (axis === 'both' || axis === 'horizontal') && styles.justifyContentCenter, dynamicStyles.sizing(width ?? null, height ?? null, maxWidth ?? null, minHeight ?? null), xstyle), className, style);
|
|
92
|
+
}), stylex.props(isInline ? styles.inline : styles.base, (axis === 'both' || axis === 'vertical') && styles.alignItemsCenter, (axis === 'both' || axis === 'horizontal') && styles.justifyContentCenter, dynamicStyles.sizing(width ?? null, height ?? null, maxWidth ?? null, minHeight ?? null), resolvedPaddingInline != null && paddingInlineStyles[resolvedPaddingInline], resolvedPaddingBlock != null && paddingBlockStyles[resolvedPaddingBlock], xstyle), className, style);
|
|
85
93
|
return /*#__PURE__*/_jsx("div", {
|
|
86
94
|
ref: ref,
|
|
87
95
|
...stylexProps,
|
|
@@ -8,6 +8,13 @@
|
|
|
8
8
|
* Provides the scroll container ref and content ref, renders the
|
|
9
9
|
* scroll-to-bottom button, frosted glass dock, and message area.
|
|
10
10
|
*
|
|
11
|
+
* Layout contract: the root is a flex column. The message area flexes
|
|
12
|
+
* (grow 1, shrink 0) to fill the space the dock doesn't need; the sticky
|
|
13
|
+
* dock keeps its natural height in flow. Short content therefore fills
|
|
14
|
+
* exactly 100% with no overflow, and long content grows past the root so
|
|
15
|
+
* self-scroll mode scrolls (#2573). In external-scrollRef mode the dock
|
|
16
|
+
* is position: fixed (out of flow) and the message area fills the root.
|
|
17
|
+
*
|
|
11
18
|
* Density (compact/balanced/spacious) is controlled via a prop with
|
|
12
19
|
* 'balanced' as the default. No JS measurement or ResizeObserver needed.
|
|
13
20
|
* The container-type on root enables container queries in child components.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatLayout.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayout.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"ChatLayout.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayout.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAkB,MAAM,OAAO,CAAC;AAGtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAa5C,KAAK,OAAO,GAAG,SAAS,GAAG,UAAU,GAAG,UAAU,CAAC;AAEnD,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,IAAI,CAAC;IAEhC;;;;;;;;;;;OAWG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAEhD;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AA4KD,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,QAAQ,EACR,OAAoB,EACpB,UAAU,EACV,YAAY,EACZ,SAAS,EAAE,iBAAiB,EAC5B,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BA4GjB;yBAzHe,UAAU"}
|
package/dist/Chat/ChatLayout.js
CHANGED
|
@@ -12,6 +12,13 @@
|
|
|
12
12
|
* Provides the scroll container ref and content ref, renders the
|
|
13
13
|
* scroll-to-bottom button, frosted glass dock, and message area.
|
|
14
14
|
*
|
|
15
|
+
* Layout contract: the root is a flex column. The message area flexes
|
|
16
|
+
* (grow 1, shrink 0) to fill the space the dock doesn't need; the sticky
|
|
17
|
+
* dock keeps its natural height in flow. Short content therefore fills
|
|
18
|
+
* exactly 100% with no overflow, and long content grows past the root so
|
|
19
|
+
* self-scroll mode scrolls (#2573). In external-scrollRef mode the dock
|
|
20
|
+
* is position: fixed (out of flow) and the message area fills the root.
|
|
21
|
+
*
|
|
15
22
|
* Density (compact/balanced/spacious) is controlled via a prop with
|
|
16
23
|
* 'balanced' as the default. No JS measurement or ResizeObserver needed.
|
|
17
24
|
* The container-type on root enables container queries in child components.
|
|
@@ -47,6 +54,8 @@ const styles = {
|
|
|
47
54
|
k9g6sI: "x12h1iku",
|
|
48
55
|
kAzted: "x2lwn1j",
|
|
49
56
|
kUk6DE: "x98rzlu",
|
|
57
|
+
k1xSpc: "x78zum5",
|
|
58
|
+
kXwgrk: "xdt5ytf",
|
|
50
59
|
$$css: true
|
|
51
60
|
},
|
|
52
61
|
rootScrollable: {
|
|
@@ -59,7 +68,9 @@ const styles = {
|
|
|
59
68
|
k1xSpc: "x78zum5",
|
|
60
69
|
kXwgrk: "xdt5ytf",
|
|
61
70
|
kUOVxO: "xvueqy4",
|
|
62
|
-
|
|
71
|
+
kzQI83: "x1iyjqo2",
|
|
72
|
+
kmuXW: "x2lah0s",
|
|
73
|
+
kCS8Yb: "xdl72j9",
|
|
63
74
|
kGO01o: "xjpqqx5",
|
|
64
75
|
kzqmXN: "xh8yej3",
|
|
65
76
|
ks0D6T: "x193iq5w",
|
|
@@ -258,10 +269,10 @@ export function ChatLayout({
|
|
|
258
269
|
}), /*#__PURE__*/_jsxs("div", {
|
|
259
270
|
...{
|
|
260
271
|
0: {
|
|
261
|
-
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl xixxii4"
|
|
272
|
+
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl x2lah0s xixxii4"
|
|
262
273
|
},
|
|
263
274
|
1: {
|
|
264
|
-
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl x7wzq59"
|
|
275
|
+
className: "x1ey2m1c x1o0tod xtijo5x x1ja2u2z xc8icb0 x47corl x2lah0s x7wzq59"
|
|
265
276
|
}
|
|
266
277
|
}[!!isSelfScrolling << 0],
|
|
267
278
|
children: [scrollButton === undefined ? defaultScrollButton : scrollButton, /*#__PURE__*/_jsx("div", {
|
|
@@ -1,22 +1,28 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file DropdownMenuCheckboxItem.tsx
|
|
3
|
-
* @input React, stylex, Item +
|
|
3
|
+
* @input React, stylex, Item + CheckboxInput + DropdownMenu context + tokens from core
|
|
4
4
|
* @output DropdownMenuCheckboxItem — a standalone checkable menu item.
|
|
5
5
|
* @position Sub-component; used inside DropdownMenu.
|
|
6
6
|
*
|
|
7
7
|
* A menu item that toggles an independent boolean (role="menuitemcheckbox").
|
|
8
|
-
* Unlike CheckboxInput, there is no nested native <input
|
|
9
|
-
* the role and aria-checked, per the
|
|
10
|
-
* Keyboard navigation (arrows/typeahead) and
|
|
11
|
-
* the parent DropdownMenu's useListFocus +
|
|
12
|
-
* menuitemcheckbox alongside plain menuitem rows.
|
|
8
|
+
* Unlike CheckboxInput, there is no nested native <input> that participates in
|
|
9
|
+
* accessibility: the row itself owns the role and aria-checked, per the
|
|
10
|
+
* WAI-ARIA menuitemcheckbox pattern. Keyboard navigation (arrows/typeahead) and
|
|
11
|
+
* Enter/Space activation come from the parent DropdownMenu's useListFocus +
|
|
12
|
+
* activation path, which matches menuitemcheckbox alongside plain menuitem rows.
|
|
13
13
|
*
|
|
14
|
-
* The
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
14
|
+
* The checkbox visual composes the real CheckboxInput primitive so its checkmark
|
|
15
|
+
* matches CheckboxListItem and picks up the standard `checkbox` theming slots.
|
|
16
|
+
* It is purely decorative: the composed control is wrapped in an element that is
|
|
17
|
+
* both `aria-hidden` and `inert`, so it contributes nothing to the row's
|
|
18
|
+
* accessible name, and its native <input> and sr-only label stay out of the tab
|
|
19
|
+
* order and the accessibility tree while pointer clicks fall through to the row
|
|
20
|
+
* — the same shim MultiSelector uses. The row owns the checked state and
|
|
21
|
+
* accessible name. The control size is derived from the menu's item size (a
|
|
22
|
+
* `sm` menu gets the compact control; `md`/`lg` get the standard one) and it
|
|
23
|
+
* swaps to the inline-end of the row on coarse-pointer (touch) devices via CSS
|
|
24
|
+
* `order`, so it lands where selection toggles are conventionally placed on
|
|
25
|
+
* mobile.
|
|
20
26
|
*/
|
|
21
27
|
import { type ReactNode } from 'react';
|
|
22
28
|
import { type IconType } from '../Icon';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuCheckboxItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuCheckboxItem.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"DropdownMenuCheckboxItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuCheckboxItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsC5C,MAAM,WAAW,6BAA8B,SAAQ,IAAI,CACzD,SAAS,EACT,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,UAAU,CAClD;IACC;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,UAAkB,EAClB,gBAAwB,EACxB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,6BAA6B,+BA6D/B;yBA1Ee,wBAAwB"}
|
|
@@ -4,32 +4,39 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file DropdownMenuCheckboxItem.tsx
|
|
7
|
-
* @input React, stylex, Item +
|
|
7
|
+
* @input React, stylex, Item + CheckboxInput + DropdownMenu context + tokens from core
|
|
8
8
|
* @output DropdownMenuCheckboxItem — a standalone checkable menu item.
|
|
9
9
|
* @position Sub-component; used inside DropdownMenu.
|
|
10
10
|
*
|
|
11
11
|
* A menu item that toggles an independent boolean (role="menuitemcheckbox").
|
|
12
|
-
* Unlike CheckboxInput, there is no nested native <input
|
|
13
|
-
* the role and aria-checked, per the
|
|
14
|
-
* Keyboard navigation (arrows/typeahead) and
|
|
15
|
-
* the parent DropdownMenu's useListFocus +
|
|
16
|
-
* menuitemcheckbox alongside plain menuitem rows.
|
|
12
|
+
* Unlike CheckboxInput, there is no nested native <input> that participates in
|
|
13
|
+
* accessibility: the row itself owns the role and aria-checked, per the
|
|
14
|
+
* WAI-ARIA menuitemcheckbox pattern. Keyboard navigation (arrows/typeahead) and
|
|
15
|
+
* Enter/Space activation come from the parent DropdownMenu's useListFocus +
|
|
16
|
+
* activation path, which matches menuitemcheckbox alongside plain menuitem rows.
|
|
17
17
|
*
|
|
18
|
-
* The
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
18
|
+
* The checkbox visual composes the real CheckboxInput primitive so its checkmark
|
|
19
|
+
* matches CheckboxListItem and picks up the standard `checkbox` theming slots.
|
|
20
|
+
* It is purely decorative: the composed control is wrapped in an element that is
|
|
21
|
+
* both `aria-hidden` and `inert`, so it contributes nothing to the row's
|
|
22
|
+
* accessible name, and its native <input> and sr-only label stay out of the tab
|
|
23
|
+
* order and the accessibility tree while pointer clicks fall through to the row
|
|
24
|
+
* — the same shim MultiSelector uses. The row owns the checked state and
|
|
25
|
+
* accessible name. The control size is derived from the menu's item size (a
|
|
26
|
+
* `sm` menu gets the compact control; `md`/`lg` get the standard one) and it
|
|
27
|
+
* swaps to the inline-end of the row on coarse-pointer (touch) devices via CSS
|
|
28
|
+
* `order`, so it lands where selection toggles are conventionally placed on
|
|
29
|
+
* mobile.
|
|
24
30
|
*/
|
|
25
31
|
import { useCallback } from 'react';
|
|
26
32
|
import * as stylex from '@stylexjs/stylex';
|
|
27
|
-
import {
|
|
33
|
+
import { renderIconSlot } from "../Icon/index.js";
|
|
34
|
+
import { CheckboxInput } from "../CheckboxInput/CheckboxInput.js";
|
|
28
35
|
import { Item } from "../Item/index.js";
|
|
29
36
|
import { useDropdownMenuContext } from "./DropdownMenuContext.js";
|
|
30
37
|
import { focusMenuItemOnHover } from "./menuItemHover.js";
|
|
31
38
|
import "../theme/tokens.stylex.js";
|
|
32
|
-
import { colorVars, spacingVars
|
|
39
|
+
import { colorVars, spacingVars } from "../theme/tokens.stylex.js";
|
|
33
40
|
import { mergeProps, themeProps } from "../utils/index.js";
|
|
34
41
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
35
42
|
const styles = {
|
|
@@ -46,45 +53,6 @@ const styles = {
|
|
|
46
53
|
kSiTet: "xbyyjgo",
|
|
47
54
|
kkrTdU: "x1h6gzvc",
|
|
48
55
|
$$css: true
|
|
49
|
-
},
|
|
50
|
-
box: {
|
|
51
|
-
k1xSpc: "x78zum5",
|
|
52
|
-
kGNEyG: "x6s0dn4",
|
|
53
|
-
kjj79g: "xl56j7k",
|
|
54
|
-
kmuXW: "x2lah0s",
|
|
55
|
-
kB7OPa: "x9f619",
|
|
56
|
-
kMzoRj: "x1litavf",
|
|
57
|
-
ksu8eU: "x1y0btm7",
|
|
58
|
-
kaIpWk: "xx3sua9",
|
|
59
|
-
kMwMTN: "x17wrial",
|
|
60
|
-
k1ekBW: "xts7igz",
|
|
61
|
-
kIyJzY: "xuedmi6 x12w9bfk",
|
|
62
|
-
kAMwcw: "xlr8y92",
|
|
63
|
-
kayTVb: "x1g77sc7 xozvky",
|
|
64
|
-
keTefX: "x1lziwak x1jymrmb",
|
|
65
|
-
$$css: true
|
|
66
|
-
},
|
|
67
|
-
unchecked: {
|
|
68
|
-
kVAM5u: "xvy26l8",
|
|
69
|
-
kWkggS: "x10xzikg",
|
|
70
|
-
$$css: true
|
|
71
|
-
},
|
|
72
|
-
checked: {
|
|
73
|
-
kVAM5u: "xad5do",
|
|
74
|
-
kWkggS: "x1ewilqj",
|
|
75
|
-
$$css: true
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
const boxSizeStyles = {
|
|
79
|
-
sm: {
|
|
80
|
-
kzqmXN: "x1xp8n7a",
|
|
81
|
-
kZKoxP: "xmix8c7",
|
|
82
|
-
$$css: true
|
|
83
|
-
},
|
|
84
|
-
md: {
|
|
85
|
-
kzqmXN: "x17z2i9w",
|
|
86
|
-
kZKoxP: "x17rw0jw",
|
|
87
|
-
$$css: true
|
|
88
56
|
}
|
|
89
57
|
};
|
|
90
58
|
/**
|
|
@@ -122,6 +90,12 @@ export function DropdownMenuCheckboxItem({
|
|
|
122
90
|
const ctx = useDropdownMenuContext();
|
|
123
91
|
const menuSize = ctx?.menuSize ?? 'md';
|
|
124
92
|
const controlSize = menuSize === 'sm' ? 'sm' : 'md';
|
|
93
|
+
|
|
94
|
+
// The composed checkbox is decorative and inert, so its label never reaches
|
|
95
|
+
// the accessibility tree — the row's `label` prop provides the announced
|
|
96
|
+
// name. CheckboxInput still requires a string label, so pass one through when
|
|
97
|
+
// the row label is a plain string.
|
|
98
|
+
const checkboxLabel = typeof label === 'string' ? label : '';
|
|
125
99
|
const handleClick = useCallback(() => {
|
|
126
100
|
if (isDisabled) {
|
|
127
101
|
return;
|
|
@@ -138,17 +112,18 @@ export function DropdownMenuCheckboxItem({
|
|
|
138
112
|
"aria-checked": value,
|
|
139
113
|
tabIndex: isDisabled ? undefined : -1,
|
|
140
114
|
onPointerMove: handlePointerMove,
|
|
141
|
-
marker: /*#__PURE__*/_jsx("
|
|
115
|
+
marker: /*#__PURE__*/_jsx("div", {
|
|
142
116
|
"aria-hidden": "true",
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
117
|
+
inert: true,
|
|
118
|
+
...{
|
|
119
|
+
className: "x78zum5 x2lah0s x47corl x1g77sc7 xozvky x1lziwak x1jymrmb"
|
|
120
|
+
},
|
|
121
|
+
children: /*#__PURE__*/_jsx(CheckboxInput, {
|
|
122
|
+
label: checkboxLabel,
|
|
123
|
+
isLabelHidden: true,
|
|
124
|
+
value: value,
|
|
125
|
+
isDisabled: isDisabled,
|
|
126
|
+
size: controlSize
|
|
152
127
|
})
|
|
153
128
|
}),
|
|
154
129
|
startContent: icon ? renderIconSlot(icon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,
|
|
1
|
+
{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAoB5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA0F5C,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CA2UX;yBA7Ue,mBAAmB"}
|
|
@@ -53,6 +53,7 @@ import { mergeProps } from "../utils/index.js";
|
|
|
53
53
|
import { themeProps } from "../utils/themeProps.js";
|
|
54
54
|
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR } from "./menuItemRoles.js";
|
|
55
55
|
import { DropdownMenuContext, useDropdownMenuContext } from "./DropdownMenuContext.js";
|
|
56
|
+
import { focusMenuItemOnHover } from "./menuItemHover.js";
|
|
56
57
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
57
58
|
const triggerStyles = {
|
|
58
59
|
root: {
|
|
@@ -65,7 +66,6 @@ const triggerStyles = {
|
|
|
65
66
|
kGuDYH: "xcr08ib",
|
|
66
67
|
kMwMTN: "x1tgivj0",
|
|
67
68
|
kWkggS: "xjbqb8w x1c52tdz",
|
|
68
|
-
kHE3J0: "xe9uy6x",
|
|
69
69
|
kkrTdU: "x1ypdohk",
|
|
70
70
|
k9WMMc: "x1yc453h",
|
|
71
71
|
kI3sdo: "x1a2a7pz",
|
|
@@ -281,6 +281,13 @@ export function DropdownMenuSubMenu(props) {
|
|
|
281
281
|
}
|
|
282
282
|
}, [isDisabled, open]);
|
|
283
283
|
|
|
284
|
+
// Move the single focus-driven highlight onto the trigger as the pointer
|
|
285
|
+
// enters it, so a sibling item that still holds focus doesn't stay
|
|
286
|
+
// highlighted alongside the hovered trigger. This is separate from the
|
|
287
|
+
// hover-open intent (onMouseEnter/onMouseLeave) — the flyout still opens on
|
|
288
|
+
// the hover delay; this only keeps the highlight single.
|
|
289
|
+
const handlePointerMove = useCallback(e => focusMenuItemOnHover(e, isDisabled), [isDisabled]);
|
|
290
|
+
|
|
284
291
|
// Enter/Space activate the focused row; typeahead jumps by first character;
|
|
285
292
|
// the close key (Left, or Right in RTL) returns focus to the trigger;
|
|
286
293
|
// arrows/Home/End defer to useListFocus (RTL-aware).
|
|
@@ -378,6 +385,7 @@ export function DropdownMenuSubMenu(props) {
|
|
|
378
385
|
"data-testid": testId,
|
|
379
386
|
onMouseEnter: triggerProps.onMouseEnter,
|
|
380
387
|
onMouseLeave: triggerProps.onMouseLeave,
|
|
388
|
+
onPointerMove: handlePointerMove,
|
|
381
389
|
startContent: icon ? renderIconSlot(icon, {
|
|
382
390
|
size: 'sm',
|
|
383
391
|
color: 'secondary'
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
* - /packages/core/src/DropdownMenu/DropdownMenuItem.tsx
|
|
13
13
|
* - /packages/core/src/DropdownMenu/DropdownMenuCheckboxItem.tsx
|
|
14
14
|
* - /packages/core/src/DropdownMenu/DropdownMenuRadioItem.tsx
|
|
15
|
+
* - /packages/core/src/DropdownMenu/DropdownMenuSubMenu.tsx
|
|
15
16
|
*/
|
|
16
17
|
import type { PointerEvent } from 'react';
|
|
17
18
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menuItemHover.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/menuItemHover.ts"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"menuItemHover.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/menuItemHover.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,OAAO,CAAC;AAExC;;;;GAIG;AACH,wBAAgB,oBAAoB,CAClC,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,EAC5B,UAAU,CAAC,EAAE,OAAO,GACnB,IAAI,CAQN"}
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
* - /packages/core/src/DropdownMenu/DropdownMenuItem.tsx
|
|
17
17
|
* - /packages/core/src/DropdownMenu/DropdownMenuCheckboxItem.tsx
|
|
18
18
|
* - /packages/core/src/DropdownMenu/DropdownMenuRadioItem.tsx
|
|
19
|
+
* - /packages/core/src/DropdownMenu/DropdownMenuSubMenu.tsx
|
|
19
20
|
*/
|
|
20
21
|
/**
|
|
21
22
|
* Move focus to a menu item as the pointer moves over it, so hover and
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FieldStatus.d.ts","sourceRoot":"","sources":["../../src/FieldStatus/FieldStatus.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,gBAAgB,CAAC;AAoEpD;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,IAAI,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,OAAO,EAAE,IAAI,CAAC;CACf;AAED;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,IAAI,EACJ,OAAO,EACP,EAAE,EACF,OAAoB,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,gBAAgB,
|
|
1
|
+
{"version":3,"file":"FieldStatus.d.ts","sourceRoot":"","sources":["../../src/FieldStatus/FieldStatus.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,gBAAgB,CAAC;AAoEpD;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,qBAAqB;IACpC,QAAQ,EAAE,IAAI,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,OAAO,EAAE,IAAI,CAAC;CACf;AAED;;GAEG;AACH,MAAM,MAAM,kBAAkB,GAAG,MAAM,qBAAqB,CAAC;AAE7D,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,IAAI,EAAE,eAAe,CAAC;IACtB;;OAEG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC;CAC9B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,IAAI,EACJ,OAAO,EACP,EAAE,EACF,OAAoB,EACpB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,gBAAgB,qBAsDlB;yBAhEe,WAAW"}
|
|
@@ -48,8 +48,8 @@ const styles = {
|
|
|
48
48
|
kLKAdn: "x1ak3mig",
|
|
49
49
|
kGO01o: "x1wesfrj",
|
|
50
50
|
kg3NbH: "xf314gf",
|
|
51
|
-
|
|
52
|
-
|
|
51
|
+
kVL7Gh: "xquck67",
|
|
52
|
+
kT0f0o: "x14i3lts",
|
|
53
53
|
$$css: true
|
|
54
54
|
},
|
|
55
55
|
detached: {
|
|
@@ -172,6 +172,16 @@ export function FieldStatus({
|
|
|
172
172
|
icon: statusIconMap[type],
|
|
173
173
|
size: "sm",
|
|
174
174
|
color: "inherit"
|
|
175
|
+
// Stable theme target on the detached message box's leading glyph
|
|
176
|
+
// itself, so a theme can restyle just this icon (color, size) —
|
|
177
|
+
// and each status — via `defineTheme`. Same-element rules in
|
|
178
|
+
// @layer astryx-theme win over the icon's own base
|
|
179
|
+
// width/height/fontSize, which a field-level target could not
|
|
180
|
+
// reach.
|
|
181
|
+
,
|
|
182
|
+
...themeProps('field-status-icon', {
|
|
183
|
+
type
|
|
184
|
+
})
|
|
175
185
|
})
|
|
176
186
|
}), /*#__PURE__*/_jsx("span", {
|
|
177
187
|
children: message
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAyB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,WAAW,EACX,SAAS,EACT,QAAQ,EACT,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Heading.d.ts","sourceRoot":"","sources":["../../src/Heading/Heading.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAyB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE7D,OAAO,KAAK,EACV,SAAS,EACT,WAAW,EACX,WAAW,EACX,SAAS,EACT,QAAQ,EACT,MAAM,gBAAgB,CAAC;AAiBxB,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,UAAU,CAAC;AAE7C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAO5C;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjD;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;AAElE,MAAM,WAAW,YAAa,SAAQ,IAAI,CACxC,SAAS,CAAC,kBAAkB,CAAC,EAC7B,UAAU,CACX;IACC,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;IACpC;;;OAGG;IACH,KAAK,EAAE,YAAY,CAAC;IAEpB;;;;;;;;;;;;;OAaG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IAEnB;;;;;;;;;;;OAWG;IACH,kBAAkB,CAAC,EAAE,YAAY,CAAC;IAElC;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;;;;OAMG;IACH,kBAAkB,CAAC,EAAE,OAAO,GAAG,cAAc,CAAC;IAE9C;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;OAEG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IAEpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAWD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,OAAO,CAAC,EACtB,KAAK,EACL,IAAI,EACJ,kBAAkB,EAClB,KAAiB,EACjB,OAAiB,EACjB,QAAY,EACZ,kBAAyB,EACzB,SAAS,EACT,QAAQ,EACR,OAAiB,EACjB,UAAkB,EAClB,gBAAwB,EACxB,MAAM,EACN,SAAS,EACT,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,KAAK,EACT,EAAE,YAAY,+BAmFd;yBAtGe,OAAO"}
|
package/dist/Heading/Heading.js
CHANGED
|
@@ -20,10 +20,11 @@ import { lazy, Suspense, useRef } from 'react';
|
|
|
20
20
|
import * as stylex from '@stylexjs/stylex';
|
|
21
21
|
import { colorStyles, sizeByLevelStyles, sizeByTypeStyles, defaultWeightByTypeStyles, displayStyles, justifyStyles, truncationStyles, wordBreakStyles, textWrapStyles, capsizeStyles, decorationStyles, truncationTooltipStyles } from "../Text/text.stylex.js";
|
|
22
22
|
import { useTruncation } from "../Text/useTruncation.js";
|
|
23
|
+
import { resolveStyleColor } from "../Text/Text.js";
|
|
23
24
|
import { mergeProps, mergeRefs } from "../utils/index.js";
|
|
24
25
|
import { themeProps } from "../utils/themeProps.js";
|
|
25
26
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
26
|
-
const LazyXDSTooltip = /*#__PURE__*/lazy(async () => import(
|
|
27
|
+
const LazyXDSTooltip = /*#__PURE__*/lazy(async () => import("../Tooltip/Tooltip.js").then(mod => ({
|
|
27
28
|
default: mod.Tooltip
|
|
28
29
|
})));
|
|
29
30
|
|
|
@@ -119,7 +120,7 @@ export function Heading({
|
|
|
119
120
|
...(type && {
|
|
120
121
|
type
|
|
121
122
|
})
|
|
122
|
-
}), stylex.props(colorStyles[color], type ? sizeByTypeStyles[type] : sizeByLevelStyles[level], type && defaultWeightByTypeStyles[type],
|
|
123
|
+
}), stylex.props(colorStyles[resolveStyleColor(color)], type ? sizeByTypeStyles[type] : sizeByLevelStyles[level], type && defaultWeightByTypeStyles[type],
|
|
123
124
|
// Display: use truncation styles when maxLines > 0
|
|
124
125
|
maxLines === 1 ? truncationStyles.singleLine : maxLines > 1 ? truncationStyles.multiLine : displayStyles[resolvedDisplay],
|
|
125
126
|
// Word break when truncating
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,OAAO,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,gEAAgE;IAChE,GAAG,EAAE,MAAM,CAAC;IACZ,iDAAiD;IACjD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACjE,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,KAAK,EAAE,aAAa,GAAG,aAAa,EAAE,CAAC;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAqID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,KAAK,EAAE,eAAe,EACtB,YAAgB,EAChB,aAAa,EACb,OAAe,EACf,WAAmB,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,KAAK,EACT,EAAE,aAAa,
|
|
1
|
+
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,OAAO,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,gEAAgE;IAChE,GAAG,EAAE,MAAM,CAAC;IACZ,iDAAiD;IACjD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACjE,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,KAAK,EAAE,aAAa,GAAG,aAAa,EAAE,CAAC;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAqID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,KAAK,EAAE,eAAe,EACtB,YAAgB,EAChB,aAAa,EACb,OAAe,EACf,WAAmB,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,KAAK,EACT,EAAE,aAAa,sCAwVf;yBAxWe,QAAQ"}
|
|
@@ -136,6 +136,7 @@ export function Lightbox({
|
|
|
136
136
|
}) {
|
|
137
137
|
const t = useTranslator();
|
|
138
138
|
const dialogRef = useRef(null);
|
|
139
|
+
const containerRef = useRef(null);
|
|
139
140
|
const imageWrapperRef = useRef(null);
|
|
140
141
|
const triggerElementRef = useRef(null);
|
|
141
142
|
|
|
@@ -237,9 +238,18 @@ export function Lightbox({
|
|
|
237
238
|
handleClose();
|
|
238
239
|
}, [handleClose]);
|
|
239
240
|
|
|
240
|
-
// Backdrop click
|
|
241
|
+
// Backdrop click. The layout container fills the whole transparent dialog,
|
|
242
|
+
// so clicks on the visual backdrop (the dark area around the media) land on
|
|
243
|
+
// the container, never on the dialog element itself — treat both as the
|
|
244
|
+
// backdrop. A pan drag that ends over the backdrop still fires a click on
|
|
245
|
+
// the common ancestor; ignore it so releasing a drag doesn't dismiss.
|
|
246
|
+
const didDragRef = useRef(false);
|
|
241
247
|
const handleBackdropClick = useCallback(e => {
|
|
242
|
-
if (
|
|
248
|
+
if (didDragRef.current) {
|
|
249
|
+
didDragRef.current = false;
|
|
250
|
+
return;
|
|
251
|
+
}
|
|
252
|
+
if (e.target === e.currentTarget || e.target === containerRef.current) {
|
|
243
253
|
handleClose();
|
|
244
254
|
}
|
|
245
255
|
}, [handleClose]);
|
|
@@ -293,6 +303,7 @@ export function Lightbox({
|
|
|
293
303
|
return;
|
|
294
304
|
}
|
|
295
305
|
setIsDragging(true);
|
|
306
|
+
didDragRef.current = false;
|
|
296
307
|
dragStartRef.current = {
|
|
297
308
|
x: e.clientX,
|
|
298
309
|
y: e.clientY,
|
|
@@ -305,6 +316,7 @@ export function Lightbox({
|
|
|
305
316
|
return;
|
|
306
317
|
}
|
|
307
318
|
const handlePointerMove = e => {
|
|
319
|
+
didDragRef.current = true;
|
|
308
320
|
const dx = e.clientX - dragStartRef.current.x;
|
|
309
321
|
const dy = e.clientY - dragStartRef.current.y;
|
|
310
322
|
setPan({
|
|
@@ -342,6 +354,7 @@ export function Lightbox({
|
|
|
342
354
|
...mergeProps(themeProps('lightbox'), stylex.props(styles.dialog, xstyle), className, style),
|
|
343
355
|
...props,
|
|
344
356
|
children: /*#__PURE__*/_jsxs("div", {
|
|
357
|
+
ref: containerRef,
|
|
345
358
|
...{
|
|
346
359
|
className: "x78zum5 xdt5ytf x6s0dn4 xl56j7k xh8yej3 x5yr21d x1n2onr6"
|
|
347
360
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EASZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAE5D,OAAO,EAKL,KAAK,kBAAkB,EACxB,MAAM,UAAU,CAAC;AAiBlB,OAAO,KAAK,EACV,uBAAuB,EACvB,uBAAuB,EACvB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAWjB,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"MultiSelector.d.ts","sourceRoot":"","sources":["../../src/MultiSelector/MultiSelector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -745,6 +745,10 @@ export function MultiSelector({
|
|
|
745
745
|
flushPending();
|
|
746
746
|
return elements;
|
|
747
747
|
}, [options, renderItem, sortedItems, searchQuery, hasSelectAll]);
|
|
748
|
+
|
|
749
|
+
// The detached message box renders its own leading status icon, so the
|
|
750
|
+
// on-field icon would duplicate it — keep the chevron indicator instead.
|
|
751
|
+
const showStatusIcon = status != null && statusVariant !== 'detached';
|
|
748
752
|
const multiSelectorContent = /*#__PURE__*/_jsxs(_Fragment, {
|
|
749
753
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
750
754
|
ref: el => {
|
|
@@ -793,7 +797,7 @@ export function MultiSelector({
|
|
|
793
797
|
onKeyDown: onKeyDown,
|
|
794
798
|
tabIndex: isDisabled && !showsDisabledMessage ? -1 : 0,
|
|
795
799
|
...{
|
|
796
|
-
className: "x78zum5 x6s0dn4 x1qughib x1txdalj x1iyjqo2 xs83m0k x1r8uery xeuugli x1717udv x1ghz6dp xc342km xng3xce xjbqb8w xjb2p0i x1qlqyl8 x15bjb6t x1heor9g x1ypdohk x1a2a7pz
|
|
800
|
+
className: "x78zum5 x6s0dn4 x1qughib x1txdalj x1iyjqo2 xs83m0k x1r8uery xeuugli x1717udv x1ghz6dp xc342km xng3xce xjbqb8w xjb2p0i x1qlqyl8 x15bjb6t x1heor9g x1ypdohk x1a2a7pz xh6dtrn"
|
|
797
801
|
},
|
|
798
802
|
children: /*#__PURE__*/_jsx("span", {
|
|
799
803
|
...{
|
|
@@ -846,8 +850,8 @@ export function MultiSelector({
|
|
|
846
850
|
3: {
|
|
847
851
|
className: "x2lah0s x78zum5 x6s0dn4 xl56j7k x1kky2od xlup9mm x11xpdln xuedmi6 xlr8y92 x1g0ag68 xv9yike x19jd1h0 xq2gx43"
|
|
848
852
|
}
|
|
849
|
-
}[!!(!
|
|
850
|
-
children:
|
|
853
|
+
}[!!(!showStatusIcon && popover.isOpen) << 1 | !!showStatusIcon << 0],
|
|
854
|
+
children: showStatusIcon ? /*#__PURE__*/_jsx(Icon, {
|
|
851
855
|
icon: STATUS_ICON_MAP[status.type],
|
|
852
856
|
size: "sm",
|
|
853
857
|
color: STATUS_ICON_COLOR_MAP[status.type]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"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"}
|