@astryxdesign/core 0.3.0-canary.ec85ba0 → 0.3.0-canary.ee705d8
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/Chat/ChatDictationButton.d.ts.map +1 -1
- package/dist/Chat/ChatDictationButton.js +2 -1
- package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
- package/dist/Chat/ChatLayoutScrollButton.js +2 -1
- package/dist/Chat/ChatSendButton.d.ts.map +1 -1
- package/dist/Chat/ChatSendButton.js +4 -3
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +1 -0
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +40 -47
- package/dist/CommandPalette/CommandPaletteItem.d.ts +1 -1
- package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteItem.js +6 -3
- package/dist/CommandPalette/CommandPaletteList.js +1 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts +1 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +11 -8
- package/dist/ContextMenu/ContextMenu.js +1 -1
- package/dist/EmptyState/EmptyState.js +1 -1
- package/dist/Indicator/CheckIndicator.d.ts +2 -2
- package/dist/Indicator/CheckIndicator.d.ts.map +1 -1
- package/dist/Indicator/CheckIndicator.js +51 -13
- package/dist/Indicator/CheckboxIndicator.d.ts +1 -1
- package/dist/Indicator/CheckboxIndicator.d.ts.map +1 -1
- package/dist/Indicator/CheckboxIndicator.js +4 -4
- package/dist/Indicator/RadioIndicator.d.ts +1 -1
- package/dist/Indicator/RadioIndicator.d.ts.map +1 -1
- package/dist/Indicator/RadioIndicator.js +8 -8
- package/dist/Indicator/index.d.ts +1 -1
- package/dist/Indicator/index.d.ts.map +1 -1
- package/dist/Indicator/indicatorRegistry.d.ts +38 -3
- package/dist/Indicator/indicatorRegistry.d.ts.map +1 -1
- package/dist/Indicator/indicatorRegistry.js +42 -2
- package/dist/Indicator/types.d.ts +20 -2
- package/dist/Indicator/types.d.ts.map +1 -1
- package/dist/Indicator/useIndicator.d.ts +8 -2
- package/dist/Indicator/useIndicator.d.ts.map +1 -1
- package/dist/Indicator/useIndicator.js +7 -1
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +18 -8
- package/dist/NumberInput/NumberInput.d.ts +10 -1
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +7 -5
- package/dist/Switch/Switch.d.ts.map +1 -1
- package/dist/Switch/Switch.js +1 -0
- package/dist/TextArea/TextArea.d.ts +10 -1
- package/dist/TextArea/TextArea.d.ts.map +1 -1
- package/dist/TextArea/TextArea.js +12 -4
- package/dist/TextInput/TextInput.d.ts +10 -1
- package/dist/TextInput/TextInput.d.ts.map +1 -1
- package/dist/TextInput/TextInput.js +6 -4
- package/dist/Timestamp/TimestampHoverCard.d.ts.map +1 -1
- package/dist/Timestamp/TimestampHoverCard.js +16 -34
- package/dist/TopNav/TopNavMegaMenu.d.ts +7 -0
- package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenu.js +67 -20
- package/dist/astryx.css +1 -2
- package/dist/astryx.umd.js +55 -55
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -0
- package/dist/hooks/useClipboard.d.ts +59 -0
- package/dist/hooks/useClipboard.d.ts.map +1 -0
- package/dist/hooks/useClipboard.js +106 -0
- package/dist/hooks/useTreeFocus.d.ts.map +1 -1
- package/dist/hooks/useTreeFocus.js +9 -3
- package/package.json +2 -2
- package/src/Chat/Chat.doc.mjs +2 -0
- package/src/Chat/ChatDictationButton.tsx +7 -1
- package/src/Chat/ChatLayoutScrollButton.tsx +7 -1
- package/src/Chat/ChatSendButton.tsx +2 -3
- package/src/CheckboxInput/CheckboxInput.test.tsx +32 -0
- package/src/CheckboxInput/CheckboxInput.tsx +1 -0
- package/src/CodeBlock/CodeBlock.doc.mjs +1 -0
- package/src/CodeBlock/CodeBlock.test.tsx +24 -0
- package/src/CodeBlock/CodeBlock.tsx +30 -61
- package/src/CommandPalette/CommandPaletteItem.tsx +7 -4
- package/src/CommandPalette/CommandPaletteList.tsx +2 -2
- package/src/ComplexSelector/ComplexSelector.tsx +10 -9
- package/src/ContextMenu/ContextMenu.tsx +1 -1
- package/src/DateInput/DateInput.doc.mjs +1 -1
- package/src/DateRangeInput/DateRangeInput.doc.mjs +1 -1
- package/src/DateTimeInput/DateTimeInput.doc.mjs +1 -1
- package/src/EmptyState/EmptyState.tsx +2 -2
- package/src/Indicator/CheckIndicator.tsx +68 -12
- package/src/Indicator/CheckboxIndicator.tsx +11 -5
- package/src/Indicator/Indicator.doc.mjs +16 -7
- package/src/Indicator/Indicator.test.tsx +224 -0
- package/src/Indicator/RadioIndicator.tsx +29 -19
- package/src/Indicator/index.ts +4 -1
- package/src/Indicator/indicatorRegistry.test.tsx +106 -0
- package/src/Indicator/indicatorRegistry.ts +52 -4
- package/src/Indicator/types.ts +23 -2
- package/src/Indicator/useIndicator.ts +13 -3
- package/src/MultiSelector/MultiSelector.doc.mjs +5 -0
- package/src/MultiSelector/MultiSelector.test.tsx +117 -0
- package/src/MultiSelector/MultiSelector.tsx +66 -54
- package/src/NumberInput/NumberInput.doc.mjs +18 -2
- package/src/NumberInput/NumberInput.test.tsx +112 -0
- package/src/NumberInput/NumberInput.tsx +15 -4
- package/src/ProgressBar/ProgressBar.doc.mjs +1 -1
- package/src/Switch/Switch.test.tsx +32 -0
- package/src/Switch/Switch.tsx +1 -0
- package/src/TextArea/TextArea.doc.mjs +18 -2
- package/src/TextArea/TextArea.test.tsx +145 -0
- package/src/TextArea/TextArea.tsx +20 -4
- package/src/TextInput/TextInput.doc.mjs +18 -2
- package/src/TextInput/TextInput.test.tsx +112 -0
- package/src/TextInput/TextInput.tsx +14 -3
- package/src/Timestamp/TimestampHoverCard.tsx +13 -35
- package/src/TopNav/TopNavMegaMenu.test.tsx +433 -33
- package/src/TopNav/TopNavMegaMenu.tsx +83 -24
- package/src/hooks/index.ts +3 -0
- package/src/hooks/useClipboard.doc.mjs +86 -0
- package/src/hooks/useClipboard.test.tsx +151 -0
- package/src/hooks/useClipboard.ts +135 -0
- package/src/hooks/useTreeFocus.test.tsx +50 -0
- package/src/hooks/useTreeFocus.ts +14 -3
- package/src/i18n/InternationalizationProvider.doc.mjs +7 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatDictationButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatDictationButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,wBAAwB,CAAC;AAMvE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"ChatDictationButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatDictationButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAC,0BAA0B,EAAC,MAAM,wBAAwB,CAAC;AAMvE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,MAAM,WAAW,wBAAyB,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC1E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,sEAAsE;IACtE,SAAS,EAAE,0BAA0B,CAAC;IACtC,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,6EAA6E;IAC7E,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,iCAAiC;IACjC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAiDD;;;;;;;;GAQG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,SAAS,EACT,IAAW,EACX,uBAA8B,EAC9B,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,4BAyE1B;yBAnFe,mBAAmB"}
|
|
@@ -24,6 +24,7 @@ import { colorVars, radiusVars } from "../theme/tokens.stylex.js";
|
|
|
24
24
|
import { Button } from "../Button/index.js";
|
|
25
25
|
import { Icon } from "../Icon/index.js";
|
|
26
26
|
import { mergeProps } from "../utils/index.js";
|
|
27
|
+
import { themeProps } from "../utils/themeProps.js";
|
|
27
28
|
import { useTranslator } from "../i18n/index.js";
|
|
28
29
|
|
|
29
30
|
// =============================================================================
|
|
@@ -112,7 +113,7 @@ export function ChatDictationButton({
|
|
|
112
113
|
} = SIZE_CONFIG[size];
|
|
113
114
|
return /*#__PURE__*/_jsxs("span", {
|
|
114
115
|
ref: ref,
|
|
115
|
-
...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
|
|
116
|
+
...mergeProps(themeProps('chat-dictation-button'), stylex.props(styles.wrapper, xstyle), className, style),
|
|
116
117
|
...rest,
|
|
117
118
|
children: [isListening && /*#__PURE__*/_jsx("span", {
|
|
118
119
|
"aria-hidden": true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"ChatLayoutScrollButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatLayoutScrollButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,2BAA4B,SAAQ,IAAI,CACvD,SAAS,CAAC,cAAc,CAAC,EACzB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qCAAqC;IACrC,SAAS,EAAE,OAAO,CAAC;IACnB,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB;IACrB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AA2DD;;;;;;;GAOG;AACH,wBAAgB,sBAAsB,CAAC,EACrC,GAAG,EACH,SAAS,EACT,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,2BAA2B,qBAkC7B;yBA3Ce,sBAAsB"}
|
|
@@ -22,6 +22,7 @@ import { colorVars, spacingVars, radiusVars, shadowVars, durationVars, easeVars
|
|
|
22
22
|
import { Icon } from "../Icon/index.js";
|
|
23
23
|
import { Button } from "../Button/index.js";
|
|
24
24
|
import { mergeProps } from "../utils/index.js";
|
|
25
|
+
import { themeProps } from "../utils/themeProps.js";
|
|
25
26
|
import { useTranslator } from "../i18n/index.js";
|
|
26
27
|
|
|
27
28
|
// =============================================================================
|
|
@@ -76,7 +77,7 @@ export function ChatLayoutScrollButton({
|
|
|
76
77
|
const t = useTranslator();
|
|
77
78
|
return /*#__PURE__*/_jsx("div", {
|
|
78
79
|
ref: ref,
|
|
79
|
-
...mergeProps(stylex.props(styles.wrapper, xstyle), className, style),
|
|
80
|
+
...mergeProps(themeProps('chat-layout-scroll-button'), stylex.props(styles.wrapper, xstyle), className, style),
|
|
80
81
|
...rest,
|
|
81
82
|
children: /*#__PURE__*/_jsx("div", {
|
|
82
83
|
...{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatSendButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatSendButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAM5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"ChatSendButton.d.ts","sourceRoot":"","sources":["../../src/Chat/ChatSendButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAM5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,mBAAoB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACvE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,kFAAkF;IAClF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gFAAgF;IAChF,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,iFAAiF;IACjF,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,mDAAmD;IACnD,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,uEAAuE;IACvE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,iCAAiC;IACjC,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;CACpB;AAiBD;;;;;;;;;;GAUG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,SAAS,CA8CpE;yBA9Ce,cAAc"}
|
|
@@ -21,6 +21,7 @@ import * as stylex from '@stylexjs/stylex';
|
|
|
21
21
|
import { Button } from "../Button/index.js";
|
|
22
22
|
import { useIcon } from "../Icon/index.js";
|
|
23
23
|
import { useChatComposerContext } from "./ChatContext.js";
|
|
24
|
+
import { mergeProps } from "../utils/index.js";
|
|
24
25
|
import { themeProps } from "../utils/themeProps.js";
|
|
25
26
|
import { useTranslator } from "../i18n/index.js";
|
|
26
27
|
|
|
@@ -85,9 +86,9 @@ export function ChatSendButton(props) {
|
|
|
85
86
|
isDisabled: !isStopShown && isDisabled,
|
|
86
87
|
onClick: isStopShown ? onStop : handleSend,
|
|
87
88
|
...rest,
|
|
88
|
-
...themeProps('chat-send-button'),
|
|
89
|
-
|
|
90
|
-
|
|
89
|
+
...mergeProps(themeProps('chat-send-button'), {
|
|
90
|
+
className
|
|
91
|
+
}, style),
|
|
91
92
|
xstyle: [styles.root, xstyle]
|
|
92
93
|
});
|
|
93
94
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAS3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AA0DhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,QAAQ,EACR,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"CheckboxInput.d.ts","sourceRoot":"","sources":["../../src/CheckboxInput/CheckboxInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAS3C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AACtC,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AA0DhD,QAAA,MAAM,iBAAiB;;;;;;;;;EASrB,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,iBAAiB,CAAC;AAE/D,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACrE,wDAAwD;IACxD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACxE;;OAEG;IACH,YAAY,CAAC,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAC7B,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,EAAE,OAAO,GAAG,eAAe,CAAC;IACjC;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACpD;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACnD;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB;AAOD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,SAAiB,EACjB,KAAK,EACL,UAAkB,EAClB,QAAQ,EACR,eAAe,EACf,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,IAAW,EACX,OAAO,EACP,MAAM,EACN,SAAS,EACT,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,kBAAkB,+BAmMpB;yBA5Ne,aAAa"}
|
|
@@ -233,6 +233,7 @@ export function CheckboxInput({
|
|
|
233
233
|
,
|
|
234
234
|
disabled: isDisabled && !isFocusableDisabled,
|
|
235
235
|
"aria-disabled": isFocusableDisabled ? 'true' : undefined,
|
|
236
|
+
form: isFocusableDisabled ? '' : undefined,
|
|
236
237
|
readOnly: isReadOnly,
|
|
237
238
|
required: isRequired,
|
|
238
239
|
onChange: e => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"CodeBlock.d.ts","sourceRoot":"","sources":["../../src/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6B5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAwWxE,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC/B,SAAS,CAAC,EAAE,CACV,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,MAAM,KACb;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAClD,aAAa,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C;;;;;;OAMG;IACH,WAAW,CAAC,EAAE,qBAAqB,CAAC;CACrC;AAqPD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,aAAoB,EACpB,MAAM,EACN,SAAiB,EACjB,SAAS,EACT,aAAqB,EACrB,oBAAyB,EACzB,IAAW,EACX,KAAK,EAAE,SAAyB,EAChC,SAAkB,EAClB,SAAS,EAAE,eAAe,EAC1B,aAAsB,EACtB,WAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,cAAc,qBAsNhB;yBA9Oe,SAAS"}
|
|
@@ -14,8 +14,9 @@ import * as stylex from '@stylexjs/stylex';
|
|
|
14
14
|
import "../theme/tokens.stylex.js";
|
|
15
15
|
import { colorVars, spacingVars, radiusVars, typographyVars, fontWeightVars, typeScaleVars, borderVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
|
|
16
16
|
import { mergeProps } from "../utils/index.js";
|
|
17
|
-
import {
|
|
17
|
+
import { useClipboard } from "../hooks/useClipboard.js";
|
|
18
18
|
import { Icon } from "../Icon/index.js";
|
|
19
|
+
import { IconButton } from "../IconButton/index.js";
|
|
19
20
|
import { tokenize, tokenizeAsync, flatTokensToLines, SYNC_TOKENIZE_THRESHOLD } from "./tokenizer.js";
|
|
20
21
|
import { ensureHighlightStyles } from "./highlightStyles.js";
|
|
21
22
|
import { applyHighlightRangesChunked } from "./highlightRanges.js";
|
|
@@ -148,6 +149,16 @@ const styles = {
|
|
|
148
149
|
sizeMd: {
|
|
149
150
|
kGuDYH: "xp03k98",
|
|
150
151
|
$$css: true
|
|
152
|
+
},
|
|
153
|
+
copyButton: {
|
|
154
|
+
kMwMTN: "x1mjzq1q",
|
|
155
|
+
$$css: true
|
|
156
|
+
},
|
|
157
|
+
copyButtonAbsolute: {
|
|
158
|
+
kVAEAm: "x10l6tqk",
|
|
159
|
+
k87sOh: "xctzyg",
|
|
160
|
+
kt4wiu: "x72tfeb",
|
|
161
|
+
$$css: true
|
|
151
162
|
}
|
|
152
163
|
};
|
|
153
164
|
|
|
@@ -437,18 +448,15 @@ export function CodeBlock({
|
|
|
437
448
|
...props
|
|
438
449
|
}) {
|
|
439
450
|
const t = useTranslator();
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
}
|
|
450
|
-
};
|
|
451
|
-
}, []);
|
|
451
|
+
// Owns the clipboard write, the transient copied flag, its reset timer, and
|
|
452
|
+
// the polite copy announcement (a swapped aria-label alone is not reliably
|
|
453
|
+
// announced) — shared with Timestamp via the same hook.
|
|
454
|
+
const {
|
|
455
|
+
copy,
|
|
456
|
+
isCopied: copied
|
|
457
|
+
} = useClipboard({
|
|
458
|
+
announce: t('@astryx.codeBlock.copied')
|
|
459
|
+
});
|
|
452
460
|
const useSpans = highlightMode === 'spans' || highlightMode === 'auto' && !hasHighlightAPI() || highlightMode === 'auto' && isSafari();
|
|
453
461
|
const lines = useMemo(() => {
|
|
454
462
|
const l = code.split('\n');
|
|
@@ -460,26 +468,11 @@ export function CodeBlock({
|
|
|
460
468
|
const tokenLines = useTokenLines(code, language, customTokenizer);
|
|
461
469
|
const highlightSet = useMemo(() => highlightLines ? new Set(highlightLines) : null, [highlightLines]);
|
|
462
470
|
const handleCopy = useCallback(async () => {
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
setCopied(true);
|
|
466
|
-
// Swapping the button's aria-label alone isn't reliably announced by
|
|
467
|
-
// screen readers, so confirm the copy via a polite live region.
|
|
468
|
-
announce(t('@astryx.codeBlock.copied'));
|
|
471
|
+
const didCopy = await copy(code);
|
|
472
|
+
if (didCopy) {
|
|
469
473
|
onCopy?.();
|
|
470
|
-
// Restart the reset timer on every copy — otherwise a rapid re-copy
|
|
471
|
-
// is reverted early by the previous click's timer.
|
|
472
|
-
if (copyResetTimerRef.current != null) {
|
|
473
|
-
clearTimeout(copyResetTimerRef.current);
|
|
474
|
-
}
|
|
475
|
-
copyResetTimerRef.current = setTimeout(() => {
|
|
476
|
-
copyResetTimerRef.current = null;
|
|
477
|
-
setCopied(false);
|
|
478
|
-
}, 2000);
|
|
479
|
-
} catch {
|
|
480
|
-
// Clipboard failures leave the copied state unchanged.
|
|
481
474
|
}
|
|
482
|
-
}, [code,
|
|
475
|
+
}, [code, copy, onCopy]);
|
|
483
476
|
const sizeStyle = size === 'sm' ? styles.sizeSm : styles.sizeMd;
|
|
484
477
|
// Digits in the largest line number — sizes the gutter column width.
|
|
485
478
|
const maxLineDigits = String(lines.length).length;
|
|
@@ -496,28 +489,28 @@ export function CodeBlock({
|
|
|
496
489
|
const scrollStyle = maxHeight ? {
|
|
497
490
|
maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight
|
|
498
491
|
} : undefined;
|
|
499
|
-
const
|
|
500
|
-
|
|
492
|
+
const copyButtonEl = hasCopyButton ? /*#__PURE__*/_jsx(IconButton, {
|
|
493
|
+
variant: "ghost",
|
|
501
494
|
size: "sm",
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
495
|
+
icon: /*#__PURE__*/_jsx(Icon, {
|
|
496
|
+
icon: copied ? 'check' : 'copy',
|
|
497
|
+
size: "sm",
|
|
498
|
+
color: "inherit"
|
|
499
|
+
})
|
|
500
|
+
// A visible "Copy" hover/focus hint via Button's built-in tooltip. It
|
|
501
|
+
// stays "Copy" after copying — the copy → check icon flip is the
|
|
502
|
+
// confirmation, not a tooltip change. The aria-label still swaps to the
|
|
503
|
+
// localized "Copied" for assistive tech, backed by the announcement.
|
|
504
|
+
,
|
|
505
|
+
tooltip: t('@astryx.codeBlock.copyCode'),
|
|
506
|
+
label: copied ? t('@astryx.codeBlock.copied') : t('@astryx.codeBlock.copyCode'),
|
|
506
507
|
onClick: e => {
|
|
507
508
|
// Stop propagation so copying does not toggle the collapsible header.
|
|
508
509
|
e.stopPropagation();
|
|
509
510
|
void handleCopy();
|
|
510
511
|
},
|
|
511
|
-
|
|
512
|
-
...
|
|
513
|
-
0: {
|
|
514
|
-
className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556"
|
|
515
|
-
},
|
|
516
|
-
1: {
|
|
517
|
-
className: "x3nfvp2 x6s0dn4 xl56j7k x9epnlk x3kzqx6 xx3sua9 xjbqb8w xe9uy6x x1mjzq1q x1ypdohk x14ju556 x10l6tqk xctzyg x72tfeb"
|
|
518
|
-
}
|
|
519
|
-
}[!!!showHeader << 0],
|
|
520
|
-
children: copyIcon
|
|
512
|
+
xstyle: [styles.copyButton, !showHeader && styles.copyButtonAbsolute],
|
|
513
|
+
...themeProps('codeblock-copy-button')
|
|
521
514
|
}) : null;
|
|
522
515
|
const headerEl = showHeader ? /*#__PURE__*/_jsxs("div", {
|
|
523
516
|
...{
|
|
@@ -52,7 +52,7 @@ export interface CommandPaletteItemProps extends Omit<BaseProps<HTMLDivElement>,
|
|
|
52
52
|
* </CommandPaletteItem>
|
|
53
53
|
* ```
|
|
54
54
|
*/
|
|
55
|
-
export declare function CommandPaletteItem({ value, onSelect, isHighlighted: controlledHighlighted, isSelected: controlledSelected, isDisabled, children, ref, xstyle, className, style, ...props }: CommandPaletteItemProps): import("react").JSX.Element;
|
|
55
|
+
export declare function CommandPaletteItem({ value, onSelect, isHighlighted: controlledHighlighted, isSelected: controlledSelected, isDisabled, children, ref, xstyle, className, style, onClick: onClickProp, onMouseEnter: onMouseEnterProp, ...props }: CommandPaletteItemProps): import("react").JSX.Element;
|
|
56
56
|
export declare namespace CommandPaletteItem {
|
|
57
57
|
var displayName: string;
|
|
58
58
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"CommandPaletteItem.d.ts","sourceRoot":"","sources":["../../src/CommandPalette/CommandPaletteItem.tsx"],"names":[],"mappings":"AAGA;;;;;;;;GAQG;AAEH,OAAO,EAA0C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyD5C,MAAM,WAAW,uBAAwB,SAAQ,IAAI,CACnD,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,UAAU,CACxB;IACC,yCAAyC;IACzC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+EAA+E;IAC/E,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EAAE,qBAAqB,EACpC,UAAU,EAAE,kBAAkB,EAC9B,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,gBAAgB,EAC9B,GAAG,KAAK,EACT,EAAE,uBAAuB,+BAkFzB;yBAhGe,kBAAkB"}
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
import { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
15
15
|
import * as stylex from '@stylexjs/stylex';
|
|
16
16
|
import { mergeProps, mergeRefs } from "../utils/index.js";
|
|
17
|
+
import { composeEventHandlers } from "../utils/composeEventHandlers.js";
|
|
17
18
|
import "../theme/tokens.stylex.js";
|
|
18
19
|
import { colorVars, spacingVars, radiusVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
19
20
|
import { useCommandPaletteContext } from "./CommandPaletteContext.js";
|
|
@@ -87,6 +88,8 @@ export function CommandPaletteItem({
|
|
|
87
88
|
xstyle,
|
|
88
89
|
className,
|
|
89
90
|
style,
|
|
91
|
+
onClick: onClickProp,
|
|
92
|
+
onMouseEnter: onMouseEnterProp,
|
|
90
93
|
...props
|
|
91
94
|
}) {
|
|
92
95
|
const ctx = useCommandPaletteContext();
|
|
@@ -135,15 +138,15 @@ export function CommandPaletteItem({
|
|
|
135
138
|
}, [isDisabled, itemIndex, ctx]);
|
|
136
139
|
return /*#__PURE__*/_jsx("div", {
|
|
137
140
|
ref: mergeRefs(ref, itemRef),
|
|
141
|
+
...props,
|
|
138
142
|
id: ctx && itemIndex >= 0 ? ctx.getItemId(itemIndex) : undefined,
|
|
139
143
|
role: "option",
|
|
140
144
|
"aria-selected": isSelected,
|
|
141
145
|
"aria-disabled": isDisabled || undefined,
|
|
142
146
|
"data-value": value,
|
|
143
|
-
onClick: handleClick,
|
|
144
|
-
onMouseEnter: handleMouseEnter,
|
|
147
|
+
onClick: composeEventHandlers(onClickProp, handleClick),
|
|
148
|
+
onMouseEnter: composeEventHandlers(onMouseEnterProp, handleMouseEnter),
|
|
145
149
|
...mergeProps(themeProps('command-palette-item'), stylex.props(styles.item, !isDisabled && styles.itemHover, isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, isDisabled && styles.itemDisabled, xstyle), className, style),
|
|
146
|
-
...props,
|
|
147
150
|
children: children
|
|
148
151
|
});
|
|
149
152
|
}
|
|
@@ -66,11 +66,11 @@ export function CommandPaletteList({
|
|
|
66
66
|
const ctx = useCommandPaletteContext();
|
|
67
67
|
return /*#__PURE__*/_jsx("div", {
|
|
68
68
|
ref: ref,
|
|
69
|
+
...props,
|
|
69
70
|
id: ctx?.listId,
|
|
70
71
|
role: "listbox",
|
|
71
72
|
"aria-label": label,
|
|
72
73
|
...mergeProps(themeProps('command-palette-list'), stylex.props(styles.list, xstyle), className, style),
|
|
73
|
-
...props,
|
|
74
74
|
children: children
|
|
75
75
|
});
|
|
76
76
|
}
|
|
@@ -101,7 +101,7 @@ export interface ComplexSelectorProps<Value> extends Omit<BaseProps<HTMLDivEleme
|
|
|
101
101
|
* </ComplexSelector>
|
|
102
102
|
* ```
|
|
103
103
|
*/
|
|
104
|
-
export declare function ComplexSelector<Value>({ label, value, onChange, changeAction, children, triggerLabel, placeholder: placeholderFromProps, isLabelHidden, description, isOptional, isRequired, isDisabled, isLoading, status, statusVariant, labelTooltip, size, width, placement, contentXstyle, xstyle, className, style, 'data-testid': testId, ...props }: ComplexSelectorProps<Value>): React.JSX.Element;
|
|
104
|
+
export declare function ComplexSelector<Value>({ label, value, onChange, changeAction, children, triggerLabel, placeholder: placeholderFromProps, isLabelHidden, description, isOptional, isRequired, isDisabled, isLoading, status, statusVariant, labelTooltip, size, width, placement, contentXstyle, xstyle, className, style, 'data-testid': testId, onClick: onClickProp, ...props }: ComplexSelectorProps<Value>): React.JSX.Element;
|
|
105
105
|
export declare namespace ComplexSelector {
|
|
106
106
|
var displayName: string;
|
|
107
107
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AACnD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,EAA4B,KAAK,kBAAkB,EAAC,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -25,6 +25,8 @@ import { usePopover } from "../Popover/usePopover.js";
|
|
|
25
25
|
import "../theme/tokens.stylex.js";
|
|
26
26
|
import { colorVars, durationVars, easeVars, radiusVars, sizeVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
27
27
|
import { mergeProps } from "../utils/index.js";
|
|
28
|
+
import { composeEventHandlers } from "../utils/composeEventHandlers.js";
|
|
29
|
+
import { focusOutlineStyles } from "../utils/focusOutline.stylex.js";
|
|
28
30
|
import { themeProps } from "../utils/themeProps.js";
|
|
29
31
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
30
32
|
const styles = {
|
|
@@ -123,11 +125,6 @@ const styles = {
|
|
|
123
125
|
disabled: {
|
|
124
126
|
kkrTdU: "x1h6gzvc",
|
|
125
127
|
$$css: true
|
|
126
|
-
},
|
|
127
|
-
focusRing: {
|
|
128
|
-
k8PahR: "x1oqel4m",
|
|
129
|
-
kfQpEX: "x1fanpfn",
|
|
130
|
-
$$css: true
|
|
131
128
|
}
|
|
132
129
|
};
|
|
133
130
|
/**
|
|
@@ -182,6 +179,7 @@ export function ComplexSelector({
|
|
|
182
179
|
className,
|
|
183
180
|
style,
|
|
184
181
|
'data-testid': testId,
|
|
182
|
+
onClick: onClickProp,
|
|
185
183
|
...props
|
|
186
184
|
}) {
|
|
187
185
|
const t = useTranslator();
|
|
@@ -228,15 +226,20 @@ export function ComplexSelector({
|
|
|
228
226
|
ref: popover.triggerRef,
|
|
229
227
|
"data-testid": testId,
|
|
230
228
|
...props,
|
|
231
|
-
onClick: () => {
|
|
229
|
+
onClick: composeEventHandlers(onClickProp, () => {
|
|
232
230
|
if (!isDisabled) {
|
|
233
231
|
popover.toggle();
|
|
234
232
|
}
|
|
235
|
-
},
|
|
233
|
+
}),
|
|
236
234
|
...mergeProps(themeProps('complex-selector', {
|
|
237
235
|
size,
|
|
238
236
|
status: status?.type ?? null
|
|
239
|
-
}), stylex.props(inputWrapperStyles.base, styles.triggerContainer, styles[size],
|
|
237
|
+
}), stylex.props(inputWrapperStyles.base, styles.triggerContainer, styles[size],
|
|
238
|
+
// The ring belongs to the wrapper (the focusable `<button>` sits
|
|
239
|
+
// inside it), but it must still be a KEYBOARD ring: `:focus-within`
|
|
240
|
+
// matched a mouse click on the trigger and drew the outline for
|
|
241
|
+
// pointer users too. `focusWithin` here is `:has(:focus-visible)`.
|
|
242
|
+
focusOutlineStyles.focusWithin, isDisabled && inputWrapperStyles.disabled, isDisabled && styles.disabled, triggerLabel == null && styles.placeholder, xstyle), className, style),
|
|
240
243
|
children: [/*#__PURE__*/_jsx("button", {
|
|
241
244
|
id: triggerId,
|
|
242
245
|
type: "button",
|
|
@@ -337,9 +337,9 @@ export function ContextMenu({
|
|
|
337
337
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
338
338
|
children: [/*#__PURE__*/_jsxs("div", {
|
|
339
339
|
ref: mergeRefs(ref, triggerRef),
|
|
340
|
+
...triggerProps,
|
|
340
341
|
onContextMenu: handleContextMenu,
|
|
341
342
|
...longPressHandlers,
|
|
342
|
-
...triggerProps,
|
|
343
343
|
"data-testid": testId,
|
|
344
344
|
...stylex.props(styles.trigger, ...(triggerXstyle ? Array.isArray(triggerXstyle) ? triggerXstyle : [triggerXstyle] : [])),
|
|
345
345
|
children: [children, /*#__PURE__*/_jsx("span", {
|
|
@@ -77,11 +77,11 @@ export function EmptyState({
|
|
|
77
77
|
const HeadingTag = `h${headingLevel}`;
|
|
78
78
|
return /*#__PURE__*/_jsxs("div", {
|
|
79
79
|
ref: ref,
|
|
80
|
+
...props,
|
|
80
81
|
role: "status",
|
|
81
82
|
...mergeProps(themeProps('empty-state', {
|
|
82
83
|
variant: isCompact ? 'compact' : null
|
|
83
84
|
}), stylex.props(styles.container, isCompact && styles.containerCompact, xstyle), className, style),
|
|
84
|
-
...props,
|
|
85
85
|
children: [icon != null && /*#__PURE__*/_jsx("div", {
|
|
86
86
|
"aria-hidden": "true",
|
|
87
87
|
children: icon
|
|
@@ -6,14 +6,14 @@ import type { IndicatorProps } from './types';
|
|
|
6
6
|
* state, or focus behavior; the option or row that hosts it keeps all of that.
|
|
7
7
|
*
|
|
8
8
|
* @example
|
|
9
|
-
* ```
|
|
9
|
+
* ```
|
|
10
10
|
* <CheckIndicator state={isSelected ? 'checked' : 'unchecked'} size="sm" />
|
|
11
11
|
* ```
|
|
12
12
|
*
|
|
13
13
|
* Swap every single-selection mark for a radio:
|
|
14
14
|
*
|
|
15
15
|
* @example
|
|
16
|
-
* ```
|
|
16
|
+
* ```
|
|
17
17
|
* import {RadioIndicator} from '@astryxdesign/core/Indicator';
|
|
18
18
|
*
|
|
19
19
|
* defineTheme({name: 'brand', indicators: {check: RadioIndicator}});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckIndicator.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CheckIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckIndicator.tsx"],"names":[],"mappings":"AAoCA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AA6B5C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,sCA6EnC;yBAvFe,cAAc"}
|
|
@@ -29,13 +29,36 @@
|
|
|
29
29
|
* is an icon, and `astryx-icon` plus the host's target already reach it.
|
|
30
30
|
*/
|
|
31
31
|
|
|
32
|
+
import * as stylex from '@stylexjs/stylex';
|
|
32
33
|
import { Icon } from "../Icon/Icon.js";
|
|
34
|
+
import "../theme/tokens.stylex.js";
|
|
35
|
+
import { colorVars } from "../theme/tokens.stylex.js";
|
|
36
|
+
import { isRenderable, mergeProps } from "../utils/index.js";
|
|
33
37
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
34
38
|
/** The check glyph matches the control sizes the indicator families share. */
|
|
35
39
|
const iconSizeForIndicator = {
|
|
36
40
|
sm: 'sm',
|
|
37
41
|
md: 'sm'
|
|
38
42
|
};
|
|
43
|
+
const styles = {
|
|
44
|
+
slot: {
|
|
45
|
+
k1xSpc: "x3nfvp2",
|
|
46
|
+
kGNEyG: "x6s0dn4",
|
|
47
|
+
kjj79g: "xl56j7k",
|
|
48
|
+
kmuXW: "x2lah0s",
|
|
49
|
+
kzqmXN: "xcdlrvm",
|
|
50
|
+
kZKoxP: "x1l36t39",
|
|
51
|
+
$$css: true
|
|
52
|
+
},
|
|
53
|
+
enabled: {
|
|
54
|
+
kMwMTN: "xqwr325",
|
|
55
|
+
$$css: true
|
|
56
|
+
},
|
|
57
|
+
disabled: {
|
|
58
|
+
kMwMTN: "xqa6c3m",
|
|
59
|
+
$$css: true
|
|
60
|
+
}
|
|
61
|
+
};
|
|
39
62
|
|
|
40
63
|
/**
|
|
41
64
|
* The default single-selection mark: a checkmark when chosen, nothing when not.
|
|
@@ -44,14 +67,14 @@ const iconSizeForIndicator = {
|
|
|
44
67
|
* state, or focus behavior; the option or row that hosts it keeps all of that.
|
|
45
68
|
*
|
|
46
69
|
* @example
|
|
47
|
-
* ```
|
|
70
|
+
* ```
|
|
48
71
|
* <CheckIndicator state={isSelected ? 'checked' : 'unchecked'} size="sm" />
|
|
49
72
|
* ```
|
|
50
73
|
*
|
|
51
74
|
* Swap every single-selection mark for a radio:
|
|
52
75
|
*
|
|
53
76
|
* @example
|
|
54
|
-
* ```
|
|
77
|
+
* ```
|
|
55
78
|
* import {RadioIndicator} from '@astryxdesign/core/Indicator';
|
|
56
79
|
*
|
|
57
80
|
* defineTheme({name: 'brand', indicators: {check: RadioIndicator}});
|
|
@@ -70,24 +93,34 @@ export function CheckIndicator({
|
|
|
70
93
|
}) {
|
|
71
94
|
const isChecked = state === 'checked';
|
|
72
95
|
|
|
73
|
-
// Nothing to draw, and no box to reserve: an unmarked row keeps the layout
|
|
74
|
-
// it would have without this indicator.
|
|
75
|
-
if (!isChecked) {
|
|
76
|
-
return null;
|
|
77
|
-
}
|
|
78
|
-
|
|
79
96
|
// `children` (a pending Spinner, say) replaces the mark but keeps the
|
|
80
|
-
// indicator's place, matching the other indicators' contract.
|
|
81
|
-
//
|
|
82
|
-
|
|
97
|
+
// indicator's place, matching the other indicators' contract. It is checked
|
|
98
|
+
// BEFORE `state`: a host passes a busy visual through in whatever state the
|
|
99
|
+
// row happens to be in, and an unchecked listbox row is the common one.
|
|
100
|
+
//
|
|
101
|
+
// `isRenderable`, not `children != null`: the idiom a host actually writes is
|
|
102
|
+
// `children={isBusy && <Spinner/>}`, which passes `false` when it is not
|
|
103
|
+
// busy. `false` is non-null, so a null check takes this branch, renders
|
|
104
|
+
// nothing inside it, and DELETES the mark on a chosen row (#4893).
|
|
105
|
+
//
|
|
106
|
+
// There is no glyph to hang the caller's props on in this branch, so they go
|
|
107
|
+
// on a span — every one of them, so a `data-testid`, an `id`, a handler or
|
|
108
|
+
// an `xstyle` behaves the same whether or not children are present.
|
|
109
|
+
if (isRenderable(children)) {
|
|
83
110
|
return /*#__PURE__*/_jsx("span", {
|
|
111
|
+
...rest,
|
|
84
112
|
ref: ref,
|
|
85
113
|
"aria-hidden": "true",
|
|
86
|
-
|
|
87
|
-
style: style,
|
|
114
|
+
...mergeProps(stylex.props(styles.slot, isDisabled ? styles.disabled : styles.enabled, xstyle), className, style),
|
|
88
115
|
children: children
|
|
89
116
|
});
|
|
90
117
|
}
|
|
118
|
+
|
|
119
|
+
// Nothing to draw, and no box to reserve: an unmarked row keeps the layout
|
|
120
|
+
// it would have without this indicator.
|
|
121
|
+
if (!isChecked) {
|
|
122
|
+
return null;
|
|
123
|
+
}
|
|
91
124
|
return /*#__PURE__*/_jsx(Icon
|
|
92
125
|
// Spread first so the indicator's own contract (below) wins over any
|
|
93
126
|
// same-named DOM attribute a caller passed through.
|
|
@@ -99,6 +132,11 @@ export function CheckIndicator({
|
|
|
99
132
|
// runtime; the cast only reconciles the two declarations.
|
|
100
133
|
, {
|
|
101
134
|
...rest,
|
|
135
|
+
// After the spread, deliberately. Icon puts its own a11y defaults BEFORE
|
|
136
|
+
// `{...props}` as a documented escape hatch (Icon.tsx), which is right
|
|
137
|
+
// for an icon and wrong for an indicator — this one is decorative by
|
|
138
|
+
// contract, so it re-asserts it here rather than inheriting the hatch.
|
|
139
|
+
"aria-hidden": "true",
|
|
102
140
|
icon: "check",
|
|
103
141
|
size: iconSizeForIndicator[size],
|
|
104
142
|
color: isDisabled ? 'disabled' : 'accent'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckboxIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAwI5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,gBAAgB,CAAC,+
|
|
1
|
+
{"version":3,"file":"CheckboxIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/CheckboxIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAwI5C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,gBAAgB,CAAC,+BAwElC;yBAlFe,iBAAiB"}
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
import * as stylex from '@stylexjs/stylex';
|
|
12
12
|
import "../theme/tokens.stylex.js";
|
|
13
13
|
import { borderVars, colorVars, durationVars, easeVars, radiusVars } from "../theme/tokens.stylex.js";
|
|
14
|
-
import { mergeProps, themeProps } from "../utils/index.js";
|
|
14
|
+
import { isRenderable, mergeProps, themeProps } from "../utils/index.js";
|
|
15
15
|
import "./indicator.markers.stylex.js";
|
|
16
16
|
import { indicatorScope } from "./indicator.markers.stylex.js";
|
|
17
17
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -120,7 +120,7 @@ const indeterminateSizeStyles = {
|
|
|
120
120
|
* the `checkbox` theme target like any other component.
|
|
121
121
|
*
|
|
122
122
|
* @example
|
|
123
|
-
* ```
|
|
123
|
+
* ```
|
|
124
124
|
* <CheckboxIndicator state="indeterminate" size="sm" />
|
|
125
125
|
* ```
|
|
126
126
|
*/
|
|
@@ -139,6 +139,7 @@ export function CheckboxIndicator({
|
|
|
139
139
|
const isIndeterminate = state === 'indeterminate';
|
|
140
140
|
const isCheckedOrIndeterminate = isChecked || isIndeterminate;
|
|
141
141
|
return /*#__PURE__*/_jsx("span", {
|
|
142
|
+
...rest,
|
|
142
143
|
ref: ref,
|
|
143
144
|
"aria-hidden": "true",
|
|
144
145
|
...mergeProps(themeProps('checkbox-indicator', {
|
|
@@ -151,8 +152,7 @@ export function CheckboxIndicator({
|
|
|
151
152
|
{
|
|
152
153
|
legacyNames: ['checkbox']
|
|
153
154
|
}), stylex.props(styles.box, boxSizeStyles[size], isCheckedOrIndeterminate ? styles.checked : styles.unchecked, isDisabled && styles.disabled, isDisabled && !isCheckedOrIndeterminate && styles.disabledUnchecked, xstyle), className, style),
|
|
154
|
-
|
|
155
|
-
children: children ?? /*#__PURE__*/_jsxs(_Fragment, {
|
|
155
|
+
children: isRenderable(children) ? children : /*#__PURE__*/_jsxs(_Fragment, {
|
|
156
156
|
children: [/*#__PURE__*/_jsx("svg", {
|
|
157
157
|
viewBox: "0 0 10 10",
|
|
158
158
|
...stylex.props(styles.checkmark, checkmarkSizeStyles[size], isChecked && styles.checkmarkVisible),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/RadioIndicator.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"RadioIndicator.d.ts","sourceRoot":"","sources":["../../src/Indicator/RadioIndicator.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAuG5C;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,IAAW,EACX,UAAkB,EAClB,QAAQ,EACR,GAAG,EACH,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,IAAI,EACR,EAAE,cAAc,CAAC,iBAAiB,CAAC,+BAqDnC;yBA/De,cAAc"}
|