@astryxdesign/core 0.7.5-canary.577735c → 0.7.5-canary.577e8ca
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/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +5 -0
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +8 -4
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +10 -6
- package/dist/CodeBlock/CodeBlock.d.ts +9 -1
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +32 -11
- package/dist/ComplexSelector/ComplexSelector.d.ts +19 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +19 -4
- package/dist/DropdownMenu/menuItemHover.d.ts +3 -0
- package/dist/DropdownMenu/menuItemHover.d.ts.map +1 -1
- package/dist/DropdownMenu/menuItemHover.js +14 -1
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +1 -1
- package/dist/Item/useSwipeAction.d.ts.map +1 -1
- package/dist/Item/useSwipeAction.js +60 -5
- package/dist/Lightbox/Lightbox.d.ts +5 -2
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +19 -7
- package/dist/Lightbox/LightboxKeyboard.a11y.browser.spec.d.ts +2 -0
- package/dist/Lightbox/LightboxKeyboard.a11y.browser.spec.d.ts.map +1 -0
- package/dist/Lightbox/LightboxKeyboard.a11y.browser.spec.js +77 -0
- package/dist/Popover/usePopover.d.ts.map +1 -1
- package/dist/Popover/usePopover.js +8 -4
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +10 -6
- package/dist/Slider/Slider.d.ts.map +1 -1
- package/dist/Slider/Slider.js +31 -25
- package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
- package/dist/Thumbnail/Thumbnail.js +10 -6
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +8 -2
- package/dist/astryx.css +12 -6
- package/dist/hooks/useMenuPress.d.ts +2 -1
- package/dist/hooks/useMenuPress.d.ts.map +1 -1
- package/dist/hooks/useMenuPress.js +12 -3
- package/dist/theme/index.d.ts +2 -2
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/theme/index.js +1 -1
- package/dist/theme/themeAdaptations.d.ts +25 -1
- package/dist/theme/themeAdaptations.d.ts.map +1 -1
- package/dist/theme/themeAdaptations.js +30 -1
- package/package.json +3 -3
- package/src/AppShell/AppShell.spec.md +329 -0
- package/src/Badge/Badge.spec.md +207 -0
- package/src/Banner/Banner.spec.md +41 -30
- package/src/BottomSheet/BottomSheetSwitcher.spec.md +24 -20
- package/src/Breadcrumbs/BreadcrumbItem.tsx +5 -0
- package/src/Breadcrumbs/Breadcrumbs.test.tsx +22 -0
- package/src/Button/Button.test.tsx +7 -0
- package/src/Button/Button.tsx +8 -4
- package/src/ClickableCard/ClickableCard.doc.mjs +1 -2
- package/src/ClickableCard/ClickableCard.test.tsx +14 -3
- package/src/ClickableCard/ClickableCard.tsx +44 -28
- package/src/CodeBlock/CodeBlock.doc.mjs +17 -1
- package/src/CodeBlock/CodeBlock.spec.md +81 -49
- package/src/CodeBlock/CodeBlock.test.tsx +97 -1
- package/src/CodeBlock/CodeBlock.tsx +67 -8
- package/src/CodeBlock/__tests__/CodeBlockCopyClearance.a11y.chromium.spec.ts +289 -0
- package/src/ComplexSelector/ComplexSelector.doc.mjs +1 -1
- package/src/ComplexSelector/ComplexSelector.focusableDisabled.test.tsx +1 -1
- package/src/ComplexSelector/ComplexSelector.fr10.test.tsx +9 -9
- package/src/ComplexSelector/ComplexSelector.spec.md +161 -107
- package/src/ComplexSelector/ComplexSelector.test.tsx +77 -16
- package/src/ComplexSelector/ComplexSelector.tsx +44 -2
- package/src/ComplexSelector/__tests__/ComplexSelector.a11y.chromium.spec.ts +964 -0
- package/src/DropdownMenu/DropdownMenu.test.tsx +27 -1
- package/src/DropdownMenu/__tests__/MenuHoverFocus.a11y.chromium.spec.ts +237 -0
- package/src/DropdownMenu/menuItemHover.ts +13 -1
- package/src/Item/Item.test.tsx +118 -0
- package/src/Item/Item.tsx +5 -3
- package/src/Item/__tests__/ItemSwipePinchZoom.a11y.chromium.spec.ts +185 -0
- package/src/Item/useSwipeAction.ts +71 -5
- package/src/Lightbox/Lightbox.test.tsx +68 -0
- package/src/Lightbox/Lightbox.tsx +20 -7
- package/src/Lightbox/LightboxKeyboard.a11y.browser.spec.ts +77 -0
- package/src/List/ListItem.doc.mjs +3 -3
- package/src/Markdown/Markdown.spec.md +15 -8
- package/src/Popover/Popover.test.tsx +48 -0
- package/src/Popover/usePopover.tsx +8 -4
- package/src/PowerSearch/PowerSearch.test.tsx +45 -0
- package/src/SelectableCard/SelectableCard.doc.mjs +1 -2
- package/src/SelectableCard/SelectableCard.test.tsx +11 -1
- package/src/SelectableCard/SelectableCard.tsx +44 -28
- package/src/Selector/Selector.spec.md +9 -2
- package/src/SideNav/SideNav.test.tsx +56 -2
- package/src/Slider/Slider.test.tsx +31 -2
- package/src/Slider/Slider.tsx +40 -33
- package/src/TabList/TabList.doc.mjs +3 -3
- package/src/Table/Table.spec.md +17 -13
- package/src/Table/__tests__/Table.a11y.chromium.spec.ts +128 -0
- package/src/Table/__tests__/Table.a11y.contracts.ts +35 -0
- package/src/Table/__tests__/Table.a11y.renders.tsx +112 -0
- package/src/Table/__tests__/Table.a11y.states.ts +140 -0
- package/src/Table/__tests__/Table.a11y.test.tsx +198 -0
- package/src/Table/plugins/sortable/__tests__/useTableSortable.a11y.test.tsx +174 -0
- package/src/Table/plugins/sortable/__tests__/useTableSortable.a11y.ts +86 -0
- package/src/Table/plugins/sortable/useTableSortable.test.tsx +0 -12
- package/src/Thumbnail/Thumbnail.doc.mjs +1 -2
- package/src/Thumbnail/Thumbnail.test.tsx +11 -1
- package/src/Thumbnail/Thumbnail.tsx +43 -27
- package/src/Token/Token.spec.md +271 -0
- package/src/Typeahead/BaseTypeahead.tsx +6 -1
- package/src/Typeahead/Typeahead.test.tsx +34 -1
- package/src/__tests__/CardPress.a11y.chromium.spec.ts +352 -0
- package/src/__tests__/DisabledTriggerFocus.a11y.chromium.spec.ts +1 -1
- package/src/__tests__/pressState.ts +43 -1
- package/src/hooks/useMenuPress.doc.mjs +2 -2
- package/src/hooks/useMenuPress.test.tsx +5 -2
- package/src/hooks/useMenuPress.ts +12 -3
- package/src/theme/derivedVarRegistry.test.ts +4 -5
- package/src/theme/index.ts +3 -0
- package/src/theme/themeAdaptations.test.ts +37 -0
- package/src/theme/themeAdaptations.ts +43 -1
- package/src/utils/customPropertyArmLayering.test.ts +131 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,qCAAqC,CAAC;AAM7C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,8BAA8B,CAAC;
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,qCAAqC,CAAC;AAM7C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,8BAA8B,CAAC;AAQrE,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,CAAC,aAAa,CAAC,EACxB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;OAaG;IACH,IAAI,CAAC,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B;AAsID;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EAAE,aAAa,EACxB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,mBAAmB,qBAgMrB;yBA/Me,cAAc"}
|
|
@@ -40,6 +40,7 @@ import { renderDropdownItems } from "../DropdownMenu/renderDropdownItems.js";
|
|
|
40
40
|
import { DropdownMenuContext, DropdownMenuRootOpenContext } from "../DropdownMenu/DropdownMenuContext.js";
|
|
41
41
|
import { MENU_ITEM_ROLES, MENU_ITEM_SELECTOR, MENU_BOUNDARY_SELECTOR } from "../DropdownMenu/menuItemRoles.js";
|
|
42
42
|
import { useMergedRefs } from "../hooks/useMergedRefs.js";
|
|
43
|
+
import { useInteractionModalityTracking } from "../utils/interactionModality.js";
|
|
43
44
|
// =============================================================================
|
|
44
45
|
// Props
|
|
45
46
|
// =============================================================================
|
|
@@ -334,6 +335,10 @@ function BreadcrumbMenuTrigger({
|
|
|
334
335
|
const triggerId = useId();
|
|
335
336
|
const buttonRef = useRef(null);
|
|
336
337
|
const isSupporting = variant === 'supporting';
|
|
338
|
+
// The menu's rows move focus with the last input
|
|
339
|
+
// (`architecture:interaction-modality` INV1); this menu has no press model
|
|
340
|
+
// to activate the tracking they read, so it activates it itself.
|
|
341
|
+
useInteractionModalityTracking();
|
|
337
342
|
const popover = usePopover({
|
|
338
343
|
hasLightDismiss: true,
|
|
339
344
|
hasCloseButton: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"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"}
|
package/dist/Button/Button.js
CHANGED
|
@@ -555,8 +555,10 @@ export function Button({
|
|
|
555
555
|
...ariaLabelProp,
|
|
556
556
|
...describedByProp,
|
|
557
557
|
...edgeCompAttr,
|
|
558
|
-
|
|
559
|
-
|
|
558
|
+
// A caller's own busy or disabled state is kept, so a component that
|
|
559
|
+
// hands these props to a Button (a caller-rendered trigger) is heard.
|
|
560
|
+
"aria-busy": isLoadingState || props['aria-busy'] || undefined,
|
|
561
|
+
"aria-disabled": useAriaDisabled || props['aria-disabled'] || undefined,
|
|
560
562
|
onClick: handleClick,
|
|
561
563
|
...(handleKeyDown ? {
|
|
562
564
|
onKeyDown: handleKeyDown
|
|
@@ -574,8 +576,10 @@ export function Button({
|
|
|
574
576
|
...ariaLabelProp,
|
|
575
577
|
...describedByProp,
|
|
576
578
|
...edgeCompAttr,
|
|
577
|
-
|
|
578
|
-
|
|
579
|
+
// A caller's own busy or disabled state is kept, so a component that
|
|
580
|
+
// hands these props to a Button (a caller-rendered trigger) is heard.
|
|
581
|
+
"aria-busy": isLoadingState || props['aria-busy'] || undefined,
|
|
582
|
+
"aria-disabled": useAriaDisabled || props['aria-disabled'] || undefined,
|
|
579
583
|
onClick: handleClick,
|
|
580
584
|
...(handleKeyDown ? {
|
|
581
585
|
onKeyDown: handleKeyDown
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClickableCard.d.ts","sourceRoot":"","sources":["../../src/ClickableCard/ClickableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAE,KAAK,UAAU,EAAU,KAAK,GAAG,EAAC,MAAM,OAAO,CAAC;AASxE,OAAO,KAAK,EAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"ClickableCard.d.ts","sourceRoot":"","sources":["../../src/ClickableCard/ClickableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAE,KAAK,UAAU,EAAU,KAAK,GAAG,EAAC,MAAM,OAAO,CAAC;AASxE,OAAO,KAAK,EAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAE9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAwJ5C,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;;;OAKG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAEnD;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,IAAI,EACJ,MAAM,EACN,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,kBAAkB,+BAyFpB;yBA5Ge,aAAa"}
|
|
@@ -51,7 +51,11 @@ import { disabledInteractionProps } from "../utils/disabledInteraction.js";
|
|
|
51
51
|
// 1 while on and 1 → 0 over the release, and inherited resolved by the
|
|
52
52
|
// `::after` that paints it. See interactionOverlay.stylex.ts.
|
|
53
53
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
54
|
-
const
|
|
54
|
+
const pressedOverlayImage = 'var(--_press-paint-image)';
|
|
55
|
+
/** Written by the press controller while it paints a press. */
|
|
56
|
+
const PRESSED_ON = '[data-astryx-press="on"]';
|
|
57
|
+
/** Written by the press controller for the press's release. */
|
|
58
|
+
const PRESSED_FADING = '[data-astryx-press="fading"]';
|
|
55
59
|
const styles = {
|
|
56
60
|
interactive: {
|
|
57
61
|
kVAEAm: "x1n2onr6",
|
|
@@ -61,16 +65,16 @@ const styles = {
|
|
|
61
65
|
$$css: true
|
|
62
66
|
},
|
|
63
67
|
overlay: {
|
|
64
|
-
"--_press-overlay": "x1s9pv7w xb8awce x1a5qima
|
|
65
|
-
"--_press-overlay-transition": "x1wkyqe6 xbb2ue6 x1wphrdb",
|
|
68
|
+
"--_press-overlay": "x1s9pv7w xb8awce x1a5qima xmfmiv1 x1hn5ov8",
|
|
66
69
|
k5JduY: "x1s928wv",
|
|
67
70
|
kwXMNM: "x1j6awrg",
|
|
68
71
|
kv0HGH: "xarstr8",
|
|
69
72
|
kloYau: "x2q1x1w",
|
|
70
|
-
kRicXK: "x1ywzrc5",
|
|
71
|
-
kPNhGg: "
|
|
73
|
+
kRicXK: "x1ywzrc5 x1xg7wox x15tr235",
|
|
74
|
+
kPNhGg: "x97pup0",
|
|
72
75
|
kA8PQs: "x1dlmc9c",
|
|
73
|
-
ks3ayO: "x1l0fnur",
|
|
76
|
+
ks3ayO: "x1l0fnur x1l0866b x7bosnz",
|
|
77
|
+
kNctxI: "x1rd1oi2 xlif165",
|
|
74
78
|
$$css: true
|
|
75
79
|
},
|
|
76
80
|
borderless: {
|
|
@@ -20,6 +20,14 @@ export interface CodeBlockProps extends BaseProps<HTMLPreElement> {
|
|
|
20
20
|
isDiff?: boolean;
|
|
21
21
|
hasCopyButton?: boolean;
|
|
22
22
|
onCopy?: () => void;
|
|
23
|
+
/**
|
|
24
|
+
* Your own controls, shown just before Copy: in the header when the block
|
|
25
|
+
* has one, otherwise beside the code in the top inline-end corner, never
|
|
26
|
+
* over it. It never creates a header, and activating it never collapses the
|
|
27
|
+
* block. You own each control's label, state, and action; ghost `sm`
|
|
28
|
+
* IconButtons match Copy.
|
|
29
|
+
*/
|
|
30
|
+
endContent?: React.ReactNode;
|
|
23
31
|
isWrapped?: boolean;
|
|
24
32
|
maxHeight?: number | string;
|
|
25
33
|
isCollapsible?: boolean;
|
|
@@ -67,7 +75,7 @@ export interface CodeBlockProps extends BaseProps<HTMLPreElement> {
|
|
|
67
75
|
* <CodeBlock code="const x = 42;" language="javascript" />
|
|
68
76
|
* ```
|
|
69
77
|
*/
|
|
70
|
-
export declare function CodeBlock({ code, language, title, hasLanguageLabel, hasLineNumbers, highlightLines, isDiff, hasCopyButton, onCopy, isWrapped, maxHeight, isCollapsible, collapsibleThreshold, size, width: widthProp, container, tokenizer: customTokenizer, highlightMode, syntaxTheme, xstyle, className, style, ref, ...props }: CodeBlockProps): React.JSX.Element;
|
|
78
|
+
export declare function CodeBlock({ code, language, title, hasLanguageLabel, hasLineNumbers, highlightLines, isDiff, hasCopyButton, onCopy, endContent, isWrapped, maxHeight, isCollapsible, collapsibleThreshold, size, width: widthProp, container, tokenizer: customTokenizer, highlightMode, syntaxTheme, xstyle, className, style, ref, ...props }: CodeBlockProps): React.JSX.Element;
|
|
71
79
|
export declare namespace CodeBlock {
|
|
72
80
|
var displayName: string;
|
|
73
81
|
}
|
|
@@ -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;AAgC5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,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;AAgC5C,OAAO,EAAc,KAAK,qBAAqB,EAAC,MAAM,iBAAiB,CAAC;AAuexE,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;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,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;AA0SD;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,EACxB,IAAI,EACJ,QAAsB,EACtB,KAAK,EACL,gBAAuB,EACvB,cAAsB,EACtB,cAAc,EACd,MAAc,EACd,aAAoB,EACpB,MAAM,EACN,UAAU,EACV,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,qBAsShB;yBAhUe,SAAS"}
|
|
@@ -13,7 +13,7 @@ import * as React from 'react';
|
|
|
13
13
|
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
|
-
import { mergeProps } from "../utils/index.js";
|
|
16
|
+
import { isRenderable, mergeProps } from "../utils/index.js";
|
|
17
17
|
import { useClipboard } from "../hooks/useClipboard.js";
|
|
18
18
|
import { useScrollableArea } from "../hooks/useScrollableArea.js";
|
|
19
19
|
import { Icon } from "../Icon/index.js";
|
|
@@ -83,6 +83,12 @@ const styles = {
|
|
|
83
83
|
kVQacm: "xb3r6kr",
|
|
84
84
|
$$css: true
|
|
85
85
|
},
|
|
86
|
+
rootCorner: {
|
|
87
|
+
k1xSpc: "xrvj5dj",
|
|
88
|
+
kumcoG: "xju1xpo",
|
|
89
|
+
k9llMU: "x5o4joa",
|
|
90
|
+
$$css: true
|
|
91
|
+
},
|
|
86
92
|
header: {
|
|
87
93
|
k1xSpc: "x78zum5",
|
|
88
94
|
kGNEyG: "x6s0dn4",
|
|
@@ -213,12 +219,6 @@ const styles = {
|
|
|
213
219
|
copyButton: {
|
|
214
220
|
kMwMTN: "x1mjzq1q",
|
|
215
221
|
$$css: true
|
|
216
|
-
},
|
|
217
|
-
copyButtonAbsolute: {
|
|
218
|
-
kVAEAm: "x10l6tqk",
|
|
219
|
-
k87sOh: "xctzyg",
|
|
220
|
-
kt4wiu: "x72tfeb",
|
|
221
|
-
$$css: true
|
|
222
222
|
}
|
|
223
223
|
};
|
|
224
224
|
|
|
@@ -543,6 +543,7 @@ export function CodeBlock({
|
|
|
543
543
|
isDiff = false,
|
|
544
544
|
hasCopyButton = true,
|
|
545
545
|
onCopy,
|
|
546
|
+
endContent,
|
|
546
547
|
isWrapped = false,
|
|
547
548
|
maxHeight,
|
|
548
549
|
isCollapsible = false,
|
|
@@ -633,6 +634,11 @@ export function CodeBlock({
|
|
|
633
634
|
const scrollStyle = maxHeight != null ? {
|
|
634
635
|
maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight
|
|
635
636
|
} : undefined;
|
|
637
|
+
|
|
638
|
+
// Caller controls render before Copy; together they are the block's controls,
|
|
639
|
+
// in the header when there is one and in the corner cluster otherwise.
|
|
640
|
+
const hasEndContent = isRenderable(endContent);
|
|
641
|
+
const hasControls = hasCopyButton || hasEndContent;
|
|
636
642
|
const copyButtonEl = hasCopyButton ? /*#__PURE__*/_jsx(IconButton, {
|
|
637
643
|
variant: "ghost",
|
|
638
644
|
size: "sm",
|
|
@@ -653,7 +659,7 @@ export function CodeBlock({
|
|
|
653
659
|
e.stopPropagation();
|
|
654
660
|
void handleCopy();
|
|
655
661
|
},
|
|
656
|
-
xstyle:
|
|
662
|
+
xstyle: styles.copyButton,
|
|
657
663
|
...themeProps('code-block-copy-button')
|
|
658
664
|
}) : null;
|
|
659
665
|
const headerEl = showHeader ? /*#__PURE__*/_jsxs("div", {
|
|
@@ -702,7 +708,12 @@ export function CodeBlock({
|
|
|
702
708
|
})
|
|
703
709
|
}), title, title && languageLabel ? ' — ' : '', languageLabel]
|
|
704
710
|
})
|
|
705
|
-
}),
|
|
711
|
+
}), hasControls ? /*#__PURE__*/_jsxs("div", {
|
|
712
|
+
...{
|
|
713
|
+
className: "x78zum5 x6s0dn4 xzye2dw x2lah0s"
|
|
714
|
+
},
|
|
715
|
+
children: [hasEndContent ? endContent : null, copyButtonEl]
|
|
716
|
+
}) : null]
|
|
706
717
|
}) : null;
|
|
707
718
|
const codeBody = /*#__PURE__*/_jsx("div", {
|
|
708
719
|
...getViewportProps({
|
|
@@ -748,7 +759,7 @@ export function CodeBlock({
|
|
|
748
759
|
size,
|
|
749
760
|
language,
|
|
750
761
|
container
|
|
751
|
-
}), stylex.props(styles.root, dynamicStyles.width(widthProp), containerStyles[container], xstyle), className, style),
|
|
762
|
+
}), stylex.props(styles.root, hasControls && !showHeader && styles.rootCorner, dynamicStyles.width(widthProp), containerStyles[container], xstyle), className, style),
|
|
752
763
|
...props,
|
|
753
764
|
children: [headerEl, canCollapse ? /*#__PURE__*/_jsx("div", {
|
|
754
765
|
id: regionId
|
|
@@ -773,7 +784,17 @@ export function CodeBlock({
|
|
|
773
784
|
},
|
|
774
785
|
children: codeBody
|
|
775
786
|
})
|
|
776
|
-
}) : codeBody, !showHeader
|
|
787
|
+
}) : codeBody, hasControls && !showHeader ? /*#__PURE__*/_jsxs("div", {
|
|
788
|
+
...{
|
|
789
|
+
0: {
|
|
790
|
+
className: "x78zum5 x6s0dn4 xzye2dw x1y8v6su x16j26i2 xlgwz2i"
|
|
791
|
+
},
|
|
792
|
+
1: {
|
|
793
|
+
className: "x78zum5 x6s0dn4 xzye2dw x1y8v6su x16j26i2 x166xdbf"
|
|
794
|
+
}
|
|
795
|
+
}[!!(size === 'sm') << 0],
|
|
796
|
+
children: [hasEndContent ? endContent : null, copyButtonEl]
|
|
797
|
+
}) : null]
|
|
777
798
|
});
|
|
778
799
|
return syntaxTheme ? /*#__PURE__*/_jsx(SyntaxTheme, {
|
|
779
800
|
theme: syntaxTheme,
|
|
@@ -26,7 +26,7 @@ export type ComplexSelectorSize = 'sm' | 'md' | 'lg';
|
|
|
26
26
|
* Spread them onto that control: it becomes the popup's anchor, the element
|
|
27
27
|
* focus returns to, and the control that announces the popup's state.
|
|
28
28
|
*/
|
|
29
|
-
export interface ComplexSelectorRenderTriggerProps extends Omit<FieldInputBaseProps, keyof FieldPartStyleProps | 'id' | 'onClick' | 'onKeyDown' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls' | 'aria-busy'> {
|
|
29
|
+
export interface ComplexSelectorRenderTriggerProps extends Omit<FieldInputBaseProps, keyof FieldPartStyleProps | 'id' | 'onClick' | 'onKeyDown' | 'role' | 'aria-label' | 'aria-haspopup' | 'aria-expanded' | 'aria-controls' | 'aria-busy' | 'aria-required' | 'aria-disabled'> {
|
|
30
30
|
/**
|
|
31
31
|
* Attaches the control as the popup's anchor and focus-return target, and
|
|
32
32
|
* forwards it to the selector's own `ref`.
|
|
@@ -41,6 +41,24 @@ export interface ComplexSelectorRenderTriggerProps extends Omit<FieldInputBasePr
|
|
|
41
41
|
'aria-expanded': boolean;
|
|
42
42
|
'aria-controls': string;
|
|
43
43
|
'aria-busy': boolean | undefined;
|
|
44
|
+
/**
|
|
45
|
+
* The control is the selector's field: a combobox whose popup is a dialog,
|
|
46
|
+
* as on the built-in trigger.
|
|
47
|
+
*/
|
|
48
|
+
role: 'combobox';
|
|
49
|
+
/**
|
|
50
|
+
* The field's `label`, unless the selector was given `aria-label` or
|
|
51
|
+
* `aria-labelledby`: a combobox takes no name from its content, so the
|
|
52
|
+
* label names the control as it names the built-in trigger.
|
|
53
|
+
*/
|
|
54
|
+
'aria-label': string | undefined;
|
|
55
|
+
/** `'true'` when the field is required. */
|
|
56
|
+
'aria-required': 'true' | undefined;
|
|
57
|
+
/**
|
|
58
|
+
* `'true'` when the selector is disabled. The control keeps its tab stop
|
|
59
|
+
* and the popup does not open (`spec:AST-085`).
|
|
60
|
+
*/
|
|
61
|
+
'aria-disabled': 'true' | undefined;
|
|
44
62
|
}
|
|
45
63
|
export interface ComplexSelectorRenderState {
|
|
46
64
|
/** Whether the selector surface is open. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAEL,KAAK,mBAAmB,EACxB,KAAK,mBAAmB,EACzB,MAAM,qBAAqB,CAAC;AAK7B,OAAO,EAA4B,KAAK,kBAAkB,EAAC,MAAM,UAAU,CAAC;AAC5E,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAI5D,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,mBAAmB,CAAC;AAmBtE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAwK9C,MAAM,MAAM,sBAAsB,GAAG,OAAO,GAAG,WAAW,GAAG,OAAO,CAAC;AAErE,MAAM,MAAM,mBAAmB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAMrD;;;;;GAKG;AACH,MAAM,WAAW,iCAAkC,SAAQ,IAAI,CAC7D,mBAAmB,EACjB,MAAM,mBAAmB,GACzB,IAAI,GACJ,SAAS,GACT,WAAW,GACX,eAAe,GACf,eAAe,GACf,eAAe,GACf,WAAW,
|
|
1
|
+
{"version":3,"file":"ComplexSelector.d.ts","sourceRoot":"","sources":["../../src/ComplexSelector/ComplexSelector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -413,12 +413,23 @@ export function ComplexSelector({
|
|
|
413
413
|
id: triggerId,
|
|
414
414
|
// This path never forwarded caller handlers before, so the newly
|
|
415
415
|
// forwarded ones compose component first and cannot cancel opening.
|
|
416
|
-
|
|
417
|
-
|
|
416
|
+
// A disabled control keeps its tab stop but invokes no callback
|
|
417
|
+
// (`spec:AST-085` FR2), as on the built-in trigger.
|
|
418
|
+
onClick: isDisabled ? swallowDisabledPress : composeEventHandlers(handleTriggerClick, onClickProp),
|
|
419
|
+
onKeyDown: isDisabled ? handleTriggerKeyDown : composeEventHandlers(handleTriggerKeyDown, onKeyDownProp),
|
|
420
|
+
// The caller's control is the field, so it carries the field's role
|
|
421
|
+
// and state as the built-in trigger does.
|
|
422
|
+
role: 'combobox',
|
|
423
|
+
// A combobox takes no name from its content, so the field's label
|
|
424
|
+
// names the control, as it names the built-in trigger and the popup.
|
|
425
|
+
// A name passed to the selector wins.
|
|
426
|
+
'aria-label': rest['aria-label'] ?? (rest['aria-labelledby'] != null ? undefined : label),
|
|
418
427
|
'aria-haspopup': 'dialog',
|
|
419
428
|
'aria-expanded': isOpen,
|
|
420
429
|
'aria-controls': contentId,
|
|
421
|
-
'aria-busy': isBusy || undefined
|
|
430
|
+
'aria-busy': isBusy || undefined,
|
|
431
|
+
'aria-required': isEffectivelyRequired ? 'true' : undefined,
|
|
432
|
+
'aria-disabled': isDisabled ? 'true' : undefined
|
|
422
433
|
};
|
|
423
434
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
|
424
435
|
children: [renderTrigger(triggerProps), popup]
|
|
@@ -443,7 +454,11 @@ export function ComplexSelector({
|
|
|
443
454
|
...rest,
|
|
444
455
|
ref: triggerButtonRef,
|
|
445
456
|
id: triggerId,
|
|
446
|
-
type: "button"
|
|
457
|
+
type: "button"
|
|
458
|
+
// The trigger is the field's control: a combobox whose popup is a
|
|
459
|
+
// dialog, so required and disabled state are valid on it.
|
|
460
|
+
,
|
|
461
|
+
role: "combobox",
|
|
447
462
|
"aria-haspopup": "dialog",
|
|
448
463
|
"aria-expanded": isOpen,
|
|
449
464
|
"aria-controls": contentId
|
|
@@ -7,6 +7,9 @@
|
|
|
7
7
|
* highlight source. Mouse hover moves focus onto the pointed-at item so the
|
|
8
8
|
* one focus highlight follows the pointer — instead of a separate `:hover`
|
|
9
9
|
* background leaving the keyboard-focused item highlighted at the same time.
|
|
10
|
+
* That focus follows the last input (`architecture:interaction-modality` INV1):
|
|
11
|
+
* after a pointer press it does not match `:focus-visible`, so a keyboard-only
|
|
12
|
+
* focus style does not paint on the row under the mouse.
|
|
10
13
|
*
|
|
11
14
|
* SYNC: When modified, update the item components that use it:
|
|
12
15
|
* - /packages/core/src/DropdownMenu/DropdownMenuItem.tsx
|
|
@@ -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;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,OAAO,CAAC;AAGxC;;;;GAIG;AACH,wBAAgB,oBAAoB,CAClC,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,EAC5B,UAAU,CAAC,EAAE,OAAO,GACnB,IAAI,CAoBN"}
|
|
@@ -11,6 +11,9 @@
|
|
|
11
11
|
* highlight source. Mouse hover moves focus onto the pointed-at item so the
|
|
12
12
|
* one focus highlight follows the pointer — instead of a separate `:hover`
|
|
13
13
|
* background leaving the keyboard-focused item highlighted at the same time.
|
|
14
|
+
* That focus follows the last input (`architecture:interaction-modality` INV1):
|
|
15
|
+
* after a pointer press it does not match `:focus-visible`, so a keyboard-only
|
|
16
|
+
* focus style does not paint on the row under the mouse.
|
|
14
17
|
*
|
|
15
18
|
* SYNC: When modified, update the item components that use it:
|
|
16
19
|
* - /packages/core/src/DropdownMenu/DropdownMenuItem.tsx
|
|
@@ -18,6 +21,8 @@
|
|
|
18
21
|
* - /packages/core/src/DropdownMenu/DropdownMenuRadioItem.tsx
|
|
19
22
|
* - /packages/core/src/DropdownMenu/DropdownMenuSubMenu.tsx
|
|
20
23
|
*/
|
|
24
|
+
import { focusForLastInput } from "../utils/focusReturn.js";
|
|
25
|
+
|
|
21
26
|
/**
|
|
22
27
|
* Move focus to a menu item as the pointer moves over it, so hover and
|
|
23
28
|
* keyboard navigation share a single focus-driven highlight. Only reacts to a
|
|
@@ -33,7 +38,15 @@ export function focusMenuItemOnHover(e, isDisabled) {
|
|
|
33
38
|
// stationary pointer, whose next pointerenter focuses it again — a
|
|
34
39
|
// runaway auto-scroll loop. Keyboard navigation scrolls via its own
|
|
35
40
|
// highlight handling; hover must never scroll.
|
|
36
|
-
|
|
41
|
+
// A plain focus() inherits :focus-visible from the element focused before
|
|
42
|
+
// it (the menu after a pointer open), so after a pointer press it is moved
|
|
43
|
+
// with the browser's focusVisible option instead. After a key press the
|
|
44
|
+
// keyboard is the last input and the indicator stays. A browser without
|
|
45
|
+
// the option (Chrome and Edge before 145, Safari before 18.4) ignores it,
|
|
46
|
+
// and the row may then match :focus-visible as it did before.
|
|
47
|
+
// The menu activates the modality tracking this reads (its press model,
|
|
48
|
+
// or the Breadcrumbs menu trigger).
|
|
49
|
+
focusForLastInput(el, {
|
|
37
50
|
preventScroll: true
|
|
38
51
|
});
|
|
39
52
|
}
|
package/dist/Item/Item.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../src/Item/Item.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Item.d.ts","sourceRoot":"","sources":["../../src/Item/Item.tsx"],"names":[],"mappings":"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"}
|
package/dist/Item/Item.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSwipeAction.d.ts","sourceRoot":"","sources":["../../src/Item/useSwipeAction.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useSwipeAction.d.ts","sourceRoot":"","sources":["../../src/Item/useSwipeAction.ts"],"names":[],"mappings":"AAwDA,OAAO,KAAK,EACV,YAAY,IAAI,iBAAiB,EACjC,aAAa,IAAI,kBAAkB,EACnC,UAAU,IAAI,eAAe,EAC9B,MAAM,OAAO,CAAC;AAGf,yEAAyE;AACzE,eAAO,MAAM,qBAAqB,yBAAyB,CAAC;AAC5D,kEAAkE;AAClE,eAAO,MAAM,wBAAwB,sBAAsB,CAAC;AAC5D,wEAAwE;AACxE,eAAO,MAAM,uBAAuB,2BAA2B,CAAC;AAgBhE,yEAAyE;AACzE,eAAO,MAAM,eAAe,MAAM,CAAC;AAInC,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,UAAU,CAAC;AAC/C,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAChD,MAAM,MAAM,UAAU;AACpB,uBAAuB;AACrB,MAAM;AACR,iCAAiC;GAC/B,UAAU;AACZ,0DAA0D;GACxD,UAAU;AACZ,mEAAmE;GACjE,SAAS;AACX,uDAAuD;GACrD,MAAM,CAAC;AAEX,MAAM,WAAW,UAAU;IACzB,KAAK,EAAE,UAAU,CAAC;IAClB,qDAAqD;IACrD,IAAI,EAAE,SAAS,CAAC;IAChB,uEAAuE;IACvE,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC,qDAAqD;IACrD,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,aAAa,CAAC;IACxB,iFAAiF;IACjF,KAAK,EAAE;QAAC,OAAO,EAAE,OAAO,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAC,CAAC;IAC7C,oEAAoE;IACpE,YAAY,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,MAAM,CAAC;IAC1C;;;OAGG;IACH,aAAa,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAC5C,4CAA4C;IAC5C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,0EAA0E;IAC1E,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC9C;AAED,MAAM,WAAW,aAAa;IAC5B,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAClD,WAAW,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,eAAe,EAAE,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACpD,cAAc,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAC;IACjD,SAAS,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;CAChD;AAED,MAAM,WAAW,oBAAoB;IACnC,KAAK,EAAE,UAAU,CAAC;IAClB,QAAQ,EAAE,aAAa,CAAC;IACxB;;;OAGG;IACH,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,OAAO,KAAK,IAAI,CAAC;IAC7C,2BAA2B;IAC3B,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,oFAAoF;IACpF,mBAAmB,EAAE,MAAM,OAAO,CAAC;CACpC;AAoDD,wBAAgB,cAAc,CAAC,EAC7B,SAAS,EACT,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,aAAa,EACb,eAAuB,EACvB,OAAO,GACR,EAAE,qBAAqB,GAAG,oBAAoB,CA+f9C"}
|
|
@@ -32,6 +32,12 @@
|
|
|
32
32
|
* signal WebKit honours. Before the axis is decided, and for a drag the
|
|
33
33
|
* scroller got, nothing is cancelled.
|
|
34
34
|
*
|
|
35
|
+
* A pinch is the browser's: the root's `touch-action` keeps `pinch-zoom`, and
|
|
36
|
+
* a second finger that lands anywhere before the axis is decided turns the
|
|
37
|
+
* touch into a pinch, so the row lets it go and cancels nothing. A finger
|
|
38
|
+
* that is not the first one down never starts a drag. Once the row owns a
|
|
39
|
+
* drag, a second finger does not break it.
|
|
40
|
+
*
|
|
35
41
|
* The drag's travel is one custom property written on the root, coalesced to
|
|
36
42
|
* one write per frame; the root's transform reads it and the panels'
|
|
37
43
|
* transforms read its negation, so the row moves and the panel appears fixed
|
|
@@ -120,6 +126,8 @@ export function useSwipeAction({
|
|
|
120
126
|
const settleTimerRef = useRef(null);
|
|
121
127
|
const frameRef = useRef(null);
|
|
122
128
|
const pendingRef = useRef(null);
|
|
129
|
+
/** Removes the document listener that watches for a pinch's second finger. */
|
|
130
|
+
const stopPinchWatchRef = useRef(null);
|
|
123
131
|
const [state, setState] = useState(IDLE_STATE);
|
|
124
132
|
const stateRef = useRef(state);
|
|
125
133
|
stateRef.current = state;
|
|
@@ -144,8 +152,38 @@ export function useSwipeAction({
|
|
|
144
152
|
if (frameRef.current != null) {
|
|
145
153
|
cancelAnimationFrame(frameRef.current);
|
|
146
154
|
}
|
|
155
|
+
stopPinchWatchRef.current?.();
|
|
156
|
+
stopPinchWatchRef.current = null;
|
|
157
|
+
}, []);
|
|
158
|
+
const stopWatchingForPinch = useCallback(() => {
|
|
159
|
+
stopPinchWatchRef.current?.();
|
|
160
|
+
stopPinchWatchRef.current = null;
|
|
147
161
|
}, []);
|
|
148
162
|
|
|
163
|
+
/**
|
|
164
|
+
* Until the axis is decided, a second finger anywhere on the page makes
|
|
165
|
+
* the touch a pinch: the row gives it up and cancels nothing, so the
|
|
166
|
+
* browser zooms. The finger can land off the row, so the document listens.
|
|
167
|
+
*/
|
|
168
|
+
const watchForPinch = useCallback(drag => {
|
|
169
|
+
stopWatchingForPinch();
|
|
170
|
+
const onAnyPointerDown = event => {
|
|
171
|
+
if (event.pointerType === 'touch' && event.pointerId !== drag.pointerId && drag.claimed === null) {
|
|
172
|
+
drag.claimed = false;
|
|
173
|
+
stopWatchingForPinch();
|
|
174
|
+
}
|
|
175
|
+
};
|
|
176
|
+
document.addEventListener('pointerdown', onAnyPointerDown, {
|
|
177
|
+
capture: true,
|
|
178
|
+
passive: true
|
|
179
|
+
});
|
|
180
|
+
stopPinchWatchRef.current = () => {
|
|
181
|
+
document.removeEventListener('pointerdown', onAnyPointerDown, {
|
|
182
|
+
capture: true
|
|
183
|
+
});
|
|
184
|
+
};
|
|
185
|
+
}, [stopWatchingForPinch]);
|
|
186
|
+
|
|
149
187
|
/** Write the travel (physical px) the transforms read. */
|
|
150
188
|
const writeTravel = useCallback(travel => {
|
|
151
189
|
const root = rootRef.current;
|
|
@@ -324,14 +362,25 @@ export function useSwipeAction({
|
|
|
324
362
|
}, [rootRef, settle]);
|
|
325
363
|
const onPointerDown = useCallback(event => {
|
|
326
364
|
const current = stateRef.current;
|
|
327
|
-
|
|
365
|
+
const inFlight = dragRef.current;
|
|
366
|
+
if (inFlight != null) {
|
|
367
|
+
// A second finger before the axis is decided: a pinch, not a swipe.
|
|
368
|
+
if (event.pointerType === 'touch' && event.pointerId !== inFlight.pointerId && inFlight.claimed === null) {
|
|
369
|
+
inFlight.claimed = false;
|
|
370
|
+
stopWatchingForPinch();
|
|
371
|
+
}
|
|
372
|
+
return;
|
|
373
|
+
}
|
|
374
|
+
if (!isEnabled || event.pointerType !== 'touch' ||
|
|
375
|
+
// Another finger is already down: this one is part of a pinch.
|
|
376
|
+
event.isPrimary === false || current.phase === 'settling' || current.phase === 'held') {
|
|
328
377
|
return;
|
|
329
378
|
}
|
|
330
379
|
const root = rootRef.current;
|
|
331
380
|
const inlineSign = isRtlElement(root) ? -1 : 1;
|
|
332
381
|
inlineSignRef.current = inlineSign;
|
|
333
382
|
const startTime = now();
|
|
334
|
-
|
|
383
|
+
const drag = {
|
|
335
384
|
// Logical: the physical travel through the inline sign.
|
|
336
385
|
baseTravel: travelRef.current * inlineSign,
|
|
337
386
|
claimed: null,
|
|
@@ -348,7 +397,9 @@ export function useSwipeAction({
|
|
|
348
397
|
startY: event.clientY,
|
|
349
398
|
travel: 0
|
|
350
399
|
};
|
|
351
|
-
|
|
400
|
+
dragRef.current = drag;
|
|
401
|
+
watchForPinch(drag);
|
|
402
|
+
}, [isEnabled, rootRef, stopWatchingForPinch, watchForPinch]);
|
|
352
403
|
const onPointerMove = useCallback(event => {
|
|
353
404
|
const drag = dragRef.current;
|
|
354
405
|
if (drag == null || drag.pointerId !== event.pointerId || drag.claimed === false) {
|
|
@@ -361,6 +412,9 @@ export function useSwipeAction({
|
|
|
361
412
|
if (Math.max(Math.abs(deltaX), Math.abs(deltaY)) < AXIS_LOCK_PX) {
|
|
362
413
|
return;
|
|
363
414
|
}
|
|
415
|
+
// The axis is decided now, whichever way: a later finger is the
|
|
416
|
+
// swipe's to ignore or the scroller's to use.
|
|
417
|
+
stopWatchingForPinch();
|
|
364
418
|
// More horizontal than vertical is the row's, the rest the scroller's.
|
|
365
419
|
if (Math.abs(deltaX) <= Math.abs(deltaY)) {
|
|
366
420
|
drag.claimed = false;
|
|
@@ -413,13 +467,14 @@ export function useSwipeAction({
|
|
|
413
467
|
drag.lastX = event.clientX;
|
|
414
468
|
drag.lastTime = now();
|
|
415
469
|
paintOnNextFrame(sign * drag.inlineSign * offset);
|
|
416
|
-
}, [paintOnNextFrame, rootRef, writeDuration]);
|
|
470
|
+
}, [paintOnNextFrame, rootRef, stopWatchingForPinch, writeDuration]);
|
|
417
471
|
const endGesture = useCallback((event, cancelled) => {
|
|
418
472
|
const drag = dragRef.current;
|
|
419
473
|
if (drag == null || drag.pointerId !== event.pointerId) {
|
|
420
474
|
return;
|
|
421
475
|
}
|
|
422
476
|
dragRef.current = null;
|
|
477
|
+
stopWatchingForPinch();
|
|
423
478
|
if (drag.claimed !== true) {
|
|
424
479
|
return;
|
|
425
480
|
}
|
|
@@ -450,7 +505,7 @@ export function useSwipeAction({
|
|
|
450
505
|
return;
|
|
451
506
|
}
|
|
452
507
|
settle(side, 0, 'idle');
|
|
453
|
-
}, [rootRef, settle, slideOutAndFire]);
|
|
508
|
+
}, [rootRef, settle, slideOutAndFire, stopWatchingForPinch]);
|
|
454
509
|
const onPointerUp = useCallback(event => endGesture(event, false), [endGesture]);
|
|
455
510
|
const onPointerCancel = useCallback(event => endGesture(event, true), [endGesture]);
|
|
456
511
|
const shouldSuppressClick = useCallback(() => now() < suppressClickUntilRef.current, []);
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file Lightbox.tsx
|
|
3
|
-
* @input Uses React, native dialog, StyleX, IconButton, theme tokens, layerTextReset, layerStructureReset
|
|
3
|
+
* @input Uses React, native dialog, StyleX, IconButton, theme tokens, layerTextReset, layerStructureReset,
|
|
4
|
+
* isRtlElement (gallery arrow keys follow the rendered direction)
|
|
4
5
|
* @output Exports Lightbox component, LightboxProps, LightboxMedia
|
|
5
6
|
* @position Core implementation; consumed by index.ts
|
|
6
7
|
*
|
|
@@ -81,7 +82,9 @@ export interface LightboxProps extends BaseProps<HTMLDialogElement> {
|
|
|
81
82
|
* A fullscreen overlay for viewing images at full resolution.
|
|
82
83
|
*
|
|
83
84
|
* Supports single image and gallery modes. In gallery mode, provides
|
|
84
|
-
* prev/next navigation via buttons and arrow keys
|
|
85
|
+
* prev/next navigation via buttons and arrow keys; the arrow keys follow
|
|
86
|
+
* the writing direction (in RTL, ArrowLeft goes to the next item, like the
|
|
87
|
+
* Next button on the left). Optionally supports
|
|
85
88
|
* zoom (double-click, Enter/Space on the image, or `+`/`-` to toggle 2x)
|
|
86
89
|
* and pan (drag or arrow keys when zoomed; arrows navigate the gallery
|
|
87
90
|
* when not zoomed).
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAa5C;;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;AAgKD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;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,sCAqcf;yBArde,QAAQ"}
|