@astryxdesign/core 0.7.6-canary.5ef8ecf → 0.7.6-canary.67e293e

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.
@@ -1 +1 @@
1
- {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/Badge/Badge.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AAwJ7C;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,EACpB,OAAmB,EACnB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BA6CZ;yBAtDe,KAAK"}
1
+ {"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/Badge/Badge.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAY5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AAwJ7C;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,EACpB,OAAmB,EACnB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BA6CZ;yBAtDe,KAAK"}
@@ -19,6 +19,7 @@ import "../theme/tokens.stylex.js";
19
19
  import { colorVars, spacingVars, radiusVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
20
20
  import { mergeProps } from "../utils/index.js";
21
21
  import { themeProps } from "../utils/themeProps.js";
22
+ import { isRenderable } from "../utils/isRenderable.js";
22
23
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
23
24
  /**
24
25
  * Base badge styles
@@ -187,7 +188,7 @@ export function Badge({
187
188
  // a client component, so it is tracked in #5585.
188
189
  const labelTitle = typeof label === 'number' ? String(label) : typeof label === 'string' && label.length > 0 ? label : undefined;
189
190
  // Whether the label renders anything, which is when the badge grows with it.
190
- const hasLabel = label !== '' && label != null && typeof label !== 'boolean';
191
+ const hasLabel = isRenderable(label);
191
192
  return /*#__PURE__*/_jsxs("span", {
192
193
  ref: ref,
193
194
  ...mergeProps(themeProps('badge', {
@@ -1 +1 @@
1
- {"version":3,"file":"MonthScroller.d.ts","sourceRoot":"","sources":["../../src/DateInput/MonthScroller.tsx"],"names":[],"mappings":"AAoDA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,SAAS,EAQf,MAAM,UAAU,CAAC;AAqNlB,MAAM,WAAW,mBAAmB;IAClC,0DAA0D;IAC1D,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,WAAW,kBAAkB;IACjC,yEAAyE;IACzE,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACxD,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAC;IACtB,8CAA8C;IAC9C,aAAa,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+DAA+D;IAC/D,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,+BAA+B;IAC/B,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,4CAA4C;IAC5C,KAAK,EAAE,SAAS,CAAC;IACjB,2DAA2D;IAC3D,cAAc,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAC7C,gCAAgC;IAChC,YAAY,EAAE,SAAS,CAAC;IACxB,kCAAkC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,oBAAoB,EACpB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,YAAY,EACZ,QAAQ,GACT,EAAE,kBAAkB,+BAufpB;yBAlgBe,aAAa"}
1
+ {"version":3,"file":"MonthScroller.d.ts","sourceRoot":"","sources":["../../src/DateInput/MonthScroller.tsx"],"names":[],"mappings":"AAoDA,OAAO,EACL,KAAK,SAAS,EACd,KAAK,aAAa,EAClB,KAAK,SAAS,EAQf,MAAM,UAAU,CAAC;AAgNlB,MAAM,WAAW,mBAAmB;IAClC,0DAA0D;IAC1D,aAAa,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;CACxE;AAED,MAAM,WAAW,kBAAkB;IACjC,yEAAyE;IACzE,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACxD,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAC;IACtB,8CAA8C;IAC9C,aAAa,EAAE,MAAM,CAAC;IACtB,iCAAiC;IACjC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,+DAA+D;IAC/D,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACnD,+BAA+B;IAC/B,YAAY,EAAE,SAAS,GAAG,IAAI,CAAC;IAC/B,4CAA4C;IAC5C,KAAK,EAAE,SAAS,CAAC;IACjB,2DAA2D;IAC3D,cAAc,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,OAAO,CAAC;IAC7C,gCAAgC;IAChC,YAAY,EAAE,SAAS,CAAC;IACxB,kCAAkC;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAC;CAC1C;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC5B,SAAS,EACT,aAAa,EACb,aAAa,EACb,iBAAiB,EACjB,oBAAoB,EACpB,YAAY,EACZ,KAAK,EACL,cAAc,EACd,YAAY,EACZ,QAAQ,GACT,EAAE,kBAAkB,+BA0fpB;yBArgBe,aAAa"}
@@ -54,8 +54,10 @@ const DAY_SIZE = dateInputTouchSizes.daySize;
54
54
  */
55
55
  const OVERSCAN = 3;
56
56
 
57
- /** Input on the scroller that ends a steer: the user's from here. */
58
- const USER_INPUT_EVENTS = ['touchstart', 'wheel', 'pointerdown', 'keydown'];
57
+ /** Every listener on the scroller is passive; one options object serves all. */
58
+ const PASSIVE = {
59
+ passive: true
60
+ };
59
61
  const styles = {
60
62
  spacer: {
61
63
  kVAEAm: "x1n2onr6",
@@ -483,23 +485,20 @@ export function MonthScroller({
483
485
  onVisibleMonthChangeRef.current(minMonthIndex + row);
484
486
  });
485
487
  };
486
- scroller.addEventListener('scroll', onScroll, {
487
- passive: true
488
- });
489
- for (const type of USER_INPUT_EVENTS) {
490
- scroller.addEventListener(type, endSteer, {
491
- passive: true
492
- });
493
- }
494
- scroller.addEventListener('touchstart', onTouchStart, {
495
- passive: true
496
- });
488
+ scroller.addEventListener('scroll', onScroll, PASSIVE);
489
+ // The user's input on the scroller ends a steer: from here, it's theirs.
490
+ scroller.addEventListener('touchstart', endSteer, PASSIVE);
491
+ scroller.addEventListener('wheel', endSteer, PASSIVE);
492
+ scroller.addEventListener('pointerdown', endSteer, PASSIVE);
493
+ scroller.addEventListener('keydown', endSteer, PASSIVE);
494
+ scroller.addEventListener('touchstart', onTouchStart, PASSIVE);
497
495
  return () => {
498
- scroller.removeEventListener('scroll', onScroll);
499
- for (const type of USER_INPUT_EVENTS) {
500
- scroller.removeEventListener(type, endSteer);
501
- }
502
- scroller.removeEventListener('touchstart', onTouchStart);
496
+ scroller.removeEventListener('scroll', onScroll, PASSIVE);
497
+ scroller.removeEventListener('touchstart', endSteer, PASSIVE);
498
+ scroller.removeEventListener('wheel', endSteer, PASSIVE);
499
+ scroller.removeEventListener('pointerdown', endSteer, PASSIVE);
500
+ scroller.removeEventListener('keydown', endSteer, PASSIVE);
501
+ scroller.removeEventListener('touchstart', onTouchStart, PASSIVE);
503
502
  if (frameRef.current != null) {
504
503
  cancelAnimationFrame(frameRef.current);
505
504
  frameRef.current = undefined;
@@ -1 +1 @@
1
- {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../src/DateRangeInput/DateRangeInput.tsx"],"names":[],"mappings":"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"}
@@ -281,7 +281,7 @@ export function DateRangeInput({
281
281
  dateConstraints
282
282
  });
283
283
  const fireChange = useCallback(newValue => {
284
- if (isBusy) {
284
+ if (isEffectivelyDisabled) {
285
285
  return;
286
286
  }
287
287
  onChange(newValue);
@@ -291,7 +291,7 @@ export function DateRangeInput({
291
291
  await changeAction(newValue);
292
292
  });
293
293
  }
294
- }, [isBusy, onChange, changeAction, startTransition, setOptimisticValue]);
294
+ }, [isEffectivelyDisabled, onChange, changeAction, startTransition, setOptimisticValue]);
295
295
  const handleToggle = useCallback(() => {
296
296
  if (!isEffectivelyDisabled) {
297
297
  if (popover.isOpen) {
@@ -302,9 +302,12 @@ export function DateRangeInput({
302
302
  }
303
303
  }, [isEffectivelyDisabled, popover]);
304
304
  const handleRangeSelect = useCallback(range => {
305
+ if (isDisabled) {
306
+ return;
307
+ }
305
308
  fireChange(range);
306
309
  popover.hide();
307
- }, [fireChange, popover]);
310
+ }, [isDisabled, fireChange, popover]);
308
311
  const triggerRef = useRef(null);
309
312
  // The busy Spinner is decorative; this control announces its busy start
310
313
  // (spec:AST-086 FR8).
@@ -432,7 +435,7 @@ export function DateRangeInput({
432
435
  children: presets.map(preset => {
433
436
  const presetRange = preset.getRange();
434
437
  const isActive = isRangeEqual(value, presetRange);
435
- const isPresetDisabled = !isRangeWithinSpan(presetRange, maxRangeSpan, minRangeSpan) || isDateDisabled(plainDateFromISO(presetRange.start)) || isDateDisabled(plainDateFromISO(presetRange.end));
438
+ const isPresetDisabled = isDisabled || !isRangeWithinSpan(presetRange, maxRangeSpan, minRangeSpan) || isDateDisabled(plainDateFromISO(presetRange.start)) || isDateDisabled(plainDateFromISO(presetRange.end));
436
439
  return /*#__PURE__*/_jsx("button", {
437
440
  type: "button"
438
441
  // These presets are independent action buttons navigated by
@@ -445,6 +448,7 @@ export function DateRangeInput({
445
448
  // Focusable while disabled (AR3, spec:AST-085 FR1).
446
449
  ,
447
450
  "aria-disabled": isPresetDisabled || undefined,
451
+ "aria-describedby": showsDisabledMessage ? disabledMessageTooltip.describedBy : undefined,
448
452
  onClick: () => {
449
453
  if (!isPresetDisabled) {
450
454
  handleRangeSelect(presetRange);
@@ -1 +1 @@
1
- {"version":3,"file":"DropdownMenuGroup.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQ5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,SAAS,CAAC,cAAc,CAAC,EACzB,MAAM,CACP;IACC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,iBAAiB,EAAE,cAAc,EACjC,GAAG,IAAI,EACR,EAAE,sBAAsB,+BAwBxB;yBAjCe,iBAAiB"}
1
+ {"version":3,"file":"DropdownMenuGroup.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAQ5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiB5C,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,SAAS,CAAC,cAAc,CAAC,EACzB,MAAM,CACP;IACC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;CACjC;AAED;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,iBAAiB,EAAE,cAAc,EACjC,GAAG,IAAI,EACR,EAAE,sBAAsB,+BAwBxB;yBAjCe,iBAAiB"}
@@ -29,6 +29,7 @@ import "../theme/tokens.stylex.js";
29
29
  import { colorVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
30
30
  import { mergeProps } from "../utils/index.js";
31
31
  import { themeProps } from "../utils/themeProps.js";
32
+ import { isRenderable } from "../utils/isRenderable.js";
32
33
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
33
34
  /**
34
35
  * A titled group of menu rows.
@@ -64,7 +65,7 @@ export function DropdownMenuGroup({
64
65
  ...rest
65
66
  }) {
66
67
  const headingId = useId();
67
- const hasTitle = title != null && title !== '' && title !== false;
68
+ const hasTitle = isRenderable(title);
68
69
  return /*#__PURE__*/_jsxs("div", {
69
70
  ...rest,
70
71
  ref: ref,
@@ -1 +1 @@
1
- {"version":3,"file":"FieldLabel.d.ts","sourceRoot":"","sources":["../../src/Field/FieldLabel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAuB,KAAK,SAAS,EAAiB,MAAM,OAAO,CAAC;AAE3E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAgFtC,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAClE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BAyIjB;yBA3Je,UAAU"}
1
+ {"version":3,"file":"FieldLabel.d.ts","sourceRoot":"","sources":["../../src/Field/FieldLabel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAML,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAiFtC,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IAClE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,OAAO,EACP,OAAO,EACP,YAAoB,EACpB,aAAqB,EACrB,UAAkB,EAClB,UAAkB,EAClB,UAAkB,EAClB,SAAS,EACT,YAAY,EACZ,WAAW,EACX,aAAa,EACb,SAAS,EACT,KAAK,EACL,MAAM,EACN,GAAG,EACH,GAAG,IAAI,EACR,EAAE,eAAe,+BAkKjB;yBApLe,UAAU"}
@@ -22,6 +22,7 @@ import "../theme/tokens.stylex.js";
22
22
  import { colorVars, fontWeightVars, spacingVars, typographyVars, typeScaleVars } from "../theme/tokens.stylex.js";
23
23
  import { Icon, renderIconSlot } from "../Icon/Icon.js";
24
24
  import { Tooltip } from "../Tooltip/Tooltip.js";
25
+ import { TOUCH_POINTER_TYPES } from "../Layer/useTouchTrigger.js";
25
26
  import { useTranslator } from "../i18n/useTranslator.js";
26
27
  import { themeProps } from "../utils/themeProps.js";
27
28
  import { useInputContainer } from "../hooks/useInputContainer.js";
@@ -136,6 +137,22 @@ export function FieldLabel({
136
137
  // a ref-shaped object, since FieldLabel points at the control by id rather
137
138
  // than holding a ref to it.
138
139
  const descriptionRef = useRef(null);
140
+ // A tap on the info icon asks for the help, so it stops there: it does not
141
+ // go on to activate the label's control, as a press anywhere else on the
142
+ // label would (focus the field, toggle a switch). A mouse click on the icon
143
+ // keeps that native activation, and hover shows the help.
144
+ const iconPressIsTapRef = useRef(false);
145
+ const handleIconPointerDown = event => {
146
+ // A finger or a pen: the pointers whose tap the shared touch trigger
147
+ // answers, so the ones whose tap opens or closes the help.
148
+ iconPressIsTapRef.current = TOUCH_POINTER_TYPES.has(event.pointerType);
149
+ };
150
+ const handleIconClick = event => {
151
+ if (iconPressIsTapRef.current) {
152
+ event.preventDefault();
153
+ }
154
+ iconPressIsTapRef.current = false;
155
+ };
139
156
  const controlRef = useMemo(() => ({
140
157
  get current() {
141
158
  return inputID == null ? null : descriptionRef.current?.ownerDocument.getElementById(inputID) ?? null;
@@ -159,13 +176,21 @@ export function FieldLabel({
159
176
  "aria-hidden": "true",
160
177
  children: " \u2219 "
161
178
  }), statusText]
162
- }), labelTooltip && /*#__PURE__*/_jsx(Tooltip, {
179
+ }), labelTooltip &&
180
+ /*#__PURE__*/
181
+ // The icon's one job is to reveal the help, so a tap on it opens or
182
+ // closes the help (`touchTrigger="tap"`), although it sits inside a
183
+ // `<label>`.
184
+ _jsx(Tooltip, {
163
185
  content: labelTooltip,
164
186
  placement: "above",
187
+ touchTrigger: "tap",
165
188
  children: /*#__PURE__*/_jsx(Icon, {
166
189
  icon: "info",
167
190
  size: "sm",
168
- color: "inherit"
191
+ color: "inherit",
192
+ onPointerDown: handleIconPointerDown,
193
+ onClick: handleIconClick
169
194
  })
170
195
  })]
171
196
  });
@@ -41,6 +41,15 @@ import { type RefObject } from 'react';
41
41
  * - `none`: never open on touch
42
42
  */
43
43
  export type LayerTouchTrigger = 'auto' | 'tap' | 'none';
44
+ /**
45
+ * Pointer types whose *press* is a tap rather than a click.
46
+ *
47
+ * A pen belongs here but not in the arrival path: in detection range it hovers
48
+ * — firing `pointerenter`/`pointermove` with no contact, exactly as a mouse
49
+ * does, on a device where `(hover: hover)` matches — and only becomes a tap
50
+ * once it lands. See `handlePointerEnter`.
51
+ */
52
+ export declare const TOUCH_POINTER_TYPES: Set<string>;
44
53
  /**
45
54
  * Whether activating this element does something other than reveal the layer.
46
55
  *
@@ -1 +1 @@
1
- {"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAOrE;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAmCxD;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAoB7D;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAuMvB"}
1
+ {"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAOrE;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,aAA4B,CAAC;AAyB7D;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CAoB7D;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CAuMvB"}
@@ -56,7 +56,7 @@ import { getInteractionModality, useInteractionModalityTracking } from "../utils
56
56
  * does, on a device where `(hover: hover)` matches — and only becomes a tap
57
57
  * once it lands. See `handlePointerEnter`.
58
58
  */
59
- const TOUCH_POINTER_TYPES = new Set(['touch', 'pen']);
59
+ export const TOUCH_POINTER_TYPES = new Set(['touch', 'pen']);
60
60
 
61
61
  /**
62
62
  * ARIA roles that make an element do something when activated. An explicit
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AA2CA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAShD,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAU9C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,cAAc,CAAC,EACnC,UAAU,CACX;IACC,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uEAAuE;IACvE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gCAAgC;IAChC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,6DAA6D;IAC7D,YAAY,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IAC3C,8DAA8D;IAC9D,KAAK,CAAC,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,8CAA8C;IAC9C,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC7C,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAChD,8CAA8C;IAC9C,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,gBAAgB,CAAC;AAmT/D;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,WAAW,+BA6zBlD;yBA7zBe,MAAM"}
1
+ {"version":3,"file":"Slider.d.ts","sourceRoot":"","sources":["../../src/Slider/Slider.tsx"],"names":[],"mappings":"AA2CA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAShD,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAU9C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,mBAAmB,CAAC,cAAc,CAAC,EACnC,UAAU,CACX;IACC,mDAAmD;IACnD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qEAAqE;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,8FAA8F;IAC9F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qDAAqD;IACrD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,uCAAuC;IACvC,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,uEAAuE;IACvE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,gCAAgC;IAChC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,kCAAkC;IAClC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACxC,uEAAuE;IACvE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACxC,6DAA6D;IAC7D,YAAY,CAAC,EAAE,SAAS,GAAG,MAAM,GAAG,MAAM,CAAC;IAC3C,8DAA8D;IAC9D,KAAK,CAAC,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oCAAoC;IACpC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,WAAW,gBAAiB,SAAQ,eAAe;IACvD,8CAA8C;IAC9C,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACxB,kDAAkD;IAClD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAC7C,iEAAiE;IACjE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAChD,8CAA8C;IAC9C,qBAAqB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,gBAAgB,CAAC;AAmT/D;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,WAAW,+BAy5BlD;yBAz5Be,MAAM"}
@@ -5,7 +5,7 @@
5
5
  /**
6
6
  * @file Slider.tsx
7
7
  * @input Uses React, useId, useRef, useCallback, useEffect, Field, Tooltip, useTooltip, VisuallyHidden
8
- * @output Exports Slider and its props; unfilled marks share the track token; modifier-only key presses do not restore the thumb focus ring; a drag belongs to the pointer that started it
8
+ * @output Exports Slider and its props; unfilled marks share the track token; modifier-only key presses do not restore the thumb focus ring; a drag belongs to the pointer that started it; two coincident range thumbs separate toward the press or the first movement
9
9
  * @position Core implementation; consumed by index.ts, tested by Slider.test.tsx
10
10
  *
11
11
  * SYNC: When modified, update these files to stay in sync:
@@ -422,7 +422,19 @@ export function Slider({
422
422
  // Prefer the lower thumb if equidistant
423
423
  return d0 <= d1 ? 0 : 1;
424
424
  }, [isRange, values]);
425
- const updateValue = useCallback((thumbIndex, newVal, snap = true) => {
425
+
426
+ // The pointer's value at a press on two coincident thumbs, while no
427
+ // movement has said which way the drag goes; the first value off it picks
428
+ // the thumb that can travel that way (see handlePointerMove).
429
+ const coincidentDragRef = useRef(null);
430
+ // Whether the drag in progress began on two coincident thumbs: such a drag
431
+ // can always follow the pointer, so when the dragged thumb is held against
432
+ // the other one and the pointer passes it, the other thumb takes the drag.
433
+ const coincidentOriginRef = useRef(false);
434
+ const updateValue = useCallback((thumbIndex, newVal, snap = true,
435
+ // The other thumb's values to start from, when one event moves both
436
+ // (a drag handed from one coincident thumb to the other).
437
+ from = values) => {
426
438
  if (isDisabled) {
427
439
  return;
428
440
  }
@@ -431,7 +443,7 @@ export function Slider({
431
443
  // grid (max 100 with step 3 snapped End to 99, not 100).
432
444
  const clamped = clamp(snap ? snapToStep(newVal, min, step) : newVal, min, max);
433
445
  if (isRange) {
434
- const currentValues = [...values];
446
+ const currentValues = [...from];
435
447
  currentValues[thumbIndex] = clamped;
436
448
 
437
449
  // Enforce minStepsBetweenThumbs
@@ -479,6 +491,8 @@ export function Slider({
479
491
  detachLostCaptureRef.current = null;
480
492
  draggingThumbRef.current = null;
481
493
  dragPointerRef.current = null;
494
+ coincidentDragRef.current = null;
495
+ coincidentOriginRef.current = false;
482
496
  setDraggingThumb(null);
483
497
  fireChangeEnd();
484
498
  }
@@ -505,12 +519,29 @@ export function Slider({
505
519
  const thumbs = track?.querySelectorAll('[role="slider"]');
506
520
  const pressedThumb = e.target.closest('[role="slider"]');
507
521
  const pressedThumbIndex = pressedThumb == null || thumbs == null ? -1 : Array.from(thumbs).indexOf(pressedThumb);
508
- // A direct thumb press owns that thumb even when range values coincide.
509
- // Track and mark presses still choose the nearest value.
510
- const thumbIndex = pressedThumbIndex >= 0 ? pressedThumbIndex : getClosestThumb(newVal);
522
+ // A direct thumb press owns that thumb; track and mark presses choose
523
+ // the nearest value. Two thumbs on one value are the exception: only
524
+ // one of them can travel toward where the pointer goes. A track press
525
+ // beside them picks the thumb on its side. A press on the thumbs
526
+ // themselves (or on their shared value) moves nothing: the pressed
527
+ // thumb holds the press until the pointer moves, and the direction of
528
+ // that first movement from the press picks the thumb.
529
+ const isCoincident = isRange && values[0] === values[1];
530
+ let thumbIndex = pressedThumbIndex >= 0 ? pressedThumbIndex : getClosestThumb(newVal);
531
+ const parks = isCoincident && (pressedThumbIndex >= 0 || newVal === values[0]);
532
+ // The first movement is measured from the pointer itself, not from a
533
+ // mark it pressed (a wide label sits away from its mark's value).
534
+ coincidentDragRef.current = parks ? getValueFromPosition(e.clientX, e.clientY) : null;
535
+ // Only a drag that began on the shared thumbs, the press that waited for
536
+ // the first movement, hands itself to the other thumb (FR6); a track
537
+ // press beside them already picked its thumb.
538
+ coincidentOriginRef.current = parks;
539
+ if (isCoincident && !parks) {
540
+ thumbIndex = newVal > values[0] ? 1 : 0;
541
+ }
511
542
  draggingThumbRef.current = thumbIndex;
512
543
  setDraggingThumb(thumbIndex);
513
- updateValue(thumbIndex, newVal);
544
+ updateValue(thumbIndex, parks ? values[thumbIndex] : newVal);
514
545
 
515
546
  // Focus the thumb that owns this drag.
516
547
  thumbs?.[thumbIndex]?.focus();
@@ -533,12 +564,50 @@ export function Slider({
533
564
  if (typeof e.currentTarget.setPointerCapture === 'function') {
534
565
  e.currentTarget.setPointerCapture(e.pointerId);
535
566
  }
536
- }, [isDisabled, getValueFromPosition, getClosestThumb, updateValue, endDrag]);
567
+ }, [isDisabled, isRange, values, getValueFromPosition, getClosestThumb, updateValue, endDrag]);
537
568
  const handlePointerMove = useCallback(e => {
538
569
  if (draggingThumbRef.current === null || e.pointerId !== dragPointerRef.current || isDisabled) {
539
570
  return;
540
571
  }
541
572
  const newVal = getValueFromPosition(e.clientX, e.clientY);
573
+ // Hands the drag to a thumb, with its focus and pressed paint.
574
+ const handTo = thumbIndex => {
575
+ if (thumbIndex === draggingThumbRef.current) {
576
+ return;
577
+ }
578
+ draggingThumbRef.current = thumbIndex;
579
+ setDraggingThumb(thumbIndex);
580
+ const thumbs = trackRef.current?.querySelectorAll('[role="slider"]');
581
+ thumbs?.[thumbIndex]?.focus();
582
+ setKeyboardFocusThumb(null);
583
+ };
584
+ const pressValue = coincidentDragRef.current;
585
+ if (pressValue !== null) {
586
+ if (newVal === pressValue) {
587
+ return;
588
+ }
589
+ // The first movement from a press on coincident thumbs hands the
590
+ // drag to the thumb that can travel that way.
591
+ coincidentDragRef.current = null;
592
+ handTo(newVal > pressValue ? 1 : 0);
593
+ } else if (coincidentOriginRef.current) {
594
+ // A drag that began on coincident thumbs follows the pointer either
595
+ // way: once the pointer passes the other thumb, the dragged one stops
596
+ // against it and the other takes the drag (a first step that drifted
597
+ // the wrong way never sticks the drag).
598
+ const current = valuesRef.current;
599
+ const dragging = draggingThumbRef.current;
600
+ const other = dragging === 0 ? 1 : 0;
601
+ if (dragging === 0 && newVal > current[1] || dragging === 1 && newVal < current[0]) {
602
+ // The dragged thumb ends against the other one, as if it had
603
+ // followed the pointer there, and the other follows the pointer on.
604
+ const from = [...current];
605
+ from[dragging] = current[other];
606
+ handTo(other);
607
+ updateValue(other, newVal, true, from);
608
+ return;
609
+ }
610
+ }
542
611
  updateValue(draggingThumbRef.current, newVal);
543
612
  }, [isDisabled, getValueFromPosition, updateValue]);
544
613
  const handlePointerUp = useCallback(e => endDrag(e.pointerId), [endDrag]);
@@ -685,8 +754,11 @@ export function Slider({
685
754
  content: displayValue(val),
686
755
  placement: tooltipPlacement,
687
756
  delay: 0,
688
- focusTrigger: "always",
689
- isOpen: draggingThumb === thumbIndex ? true : undefined,
757
+ focusTrigger: "always"
758
+ // A drag keeps its own thumb's value showing and closes the other
759
+ // thumb's, which a drag handed over from it may have forced open.
760
+ ,
761
+ isOpen: draggingThumb === null ? undefined : draggingThumb === thumbIndex,
690
762
  children: thumbElement
691
763
  }, thumbIndex);
692
764
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@astryxdesign/core",
3
- "version": "0.7.6-canary.5ef8ecf",
3
+ "version": "0.7.6-canary.67e293e",
4
4
  "displayName": "Astryx Core",
5
5
  "description": "The component library. Accessible, themeable React components with built-in spacing, dark mode, and StyleX styling.",
6
6
  "author": "Meta Open Source",
@@ -860,9 +860,9 @@
860
860
  "react-dom": ">=19.0.0"
861
861
  },
862
862
  "devDependencies": {
863
- "@astryxdesign/a11y-spec": "0.7.6-canary.5ef8ecf",
864
- "@astryxdesign/cli": "0.7.6-canary.5ef8ecf",
865
- "@astryxdesign/interaction-harness": "0.7.6-canary.5ef8ecf",
863
+ "@astryxdesign/a11y-spec": "0.7.6-canary.67e293e",
864
+ "@astryxdesign/cli": "0.7.6-canary.67e293e",
865
+ "@astryxdesign/interaction-harness": "0.7.6-canary.67e293e",
866
866
  "@babel/cli": "^7.29.7",
867
867
  "@babel/core": "^7.29.7",
868
868
  "@babel/preset-react": "^7.29.7",
@@ -26,6 +26,7 @@ import {
26
26
  } from '../theme/tokens.stylex';
27
27
  import {mergeProps} from '../utils';
28
28
  import {themeProps} from '../utils/themeProps';
29
+ import {isRenderable} from '../utils/isRenderable';
29
30
  import type {BadgeVariantMap} from './index';
30
31
 
31
32
  /**
@@ -249,7 +250,7 @@ export function Badge({
249
250
  ? label
250
251
  : undefined;
251
252
  // Whether the label renders anything, which is when the badge grows with it.
252
- const hasLabel = label !== '' && label != null && typeof label !== 'boolean';
253
+ const hasLabel = isRenderable(label);
253
254
 
254
255
  return (
255
256
  <span
@@ -85,13 +85,8 @@ const DAY_SIZE = dateInputTouchSizes.daySize;
85
85
  */
86
86
  const OVERSCAN = 3;
87
87
 
88
- /** Input on the scroller that ends a steer: the user's from here. */
89
- const USER_INPUT_EVENTS = [
90
- 'touchstart',
91
- 'wheel',
92
- 'pointerdown',
93
- 'keydown',
94
- ] as const;
88
+ /** Every listener on the scroller is passive; one options object serves all. */
89
+ const PASSIVE: AddEventListenerOptions = {passive: true};
95
90
 
96
91
  const styles = stylex.create({
97
92
  scroller: {
@@ -682,17 +677,20 @@ export function MonthScroller({
682
677
  onVisibleMonthChangeRef.current(minMonthIndex + row);
683
678
  });
684
679
  };
685
- scroller.addEventListener('scroll', onScroll, {passive: true});
686
- for (const type of USER_INPUT_EVENTS) {
687
- scroller.addEventListener(type, endSteer, {passive: true});
688
- }
689
- scroller.addEventListener('touchstart', onTouchStart, {passive: true});
680
+ scroller.addEventListener('scroll', onScroll, PASSIVE);
681
+ // The user's input on the scroller ends a steer: from here, it's theirs.
682
+ scroller.addEventListener('touchstart', endSteer, PASSIVE);
683
+ scroller.addEventListener('wheel', endSteer, PASSIVE);
684
+ scroller.addEventListener('pointerdown', endSteer, PASSIVE);
685
+ scroller.addEventListener('keydown', endSteer, PASSIVE);
686
+ scroller.addEventListener('touchstart', onTouchStart, PASSIVE);
690
687
  return () => {
691
- scroller.removeEventListener('scroll', onScroll);
692
- for (const type of USER_INPUT_EVENTS) {
693
- scroller.removeEventListener(type, endSteer);
694
- }
695
- scroller.removeEventListener('touchstart', onTouchStart);
688
+ scroller.removeEventListener('scroll', onScroll, PASSIVE);
689
+ scroller.removeEventListener('touchstart', endSteer, PASSIVE);
690
+ scroller.removeEventListener('wheel', endSteer, PASSIVE);
691
+ scroller.removeEventListener('pointerdown', endSteer, PASSIVE);
692
+ scroller.removeEventListener('keydown', endSteer, PASSIVE);
693
+ scroller.removeEventListener('touchstart', onTouchStart, PASSIVE);
696
694
  if (frameRef.current != null) {
697
695
  cancelAnimationFrame(frameRef.current);
698
696
  frameRef.current = undefined;
@@ -613,7 +613,7 @@ export function DateRangeInput({
613
613
 
614
614
  const fireChange = useCallback(
615
615
  (newValue: DateRange | null) => {
616
- if (isBusy) {
616
+ if (isEffectivelyDisabled) {
617
617
  return;
618
618
  }
619
619
  onChange(newValue);
@@ -624,7 +624,13 @@ export function DateRangeInput({
624
624
  });
625
625
  }
626
626
  },
627
- [isBusy, onChange, changeAction, startTransition, setOptimisticValue],
627
+ [
628
+ isEffectivelyDisabled,
629
+ onChange,
630
+ changeAction,
631
+ startTransition,
632
+ setOptimisticValue,
633
+ ],
628
634
  );
629
635
 
630
636
  const handleToggle = useCallback(() => {
@@ -639,10 +645,13 @@ export function DateRangeInput({
639
645
 
640
646
  const handleRangeSelect = useCallback(
641
647
  (range: DateRange) => {
648
+ if (isDisabled) {
649
+ return;
650
+ }
642
651
  fireChange(range);
643
652
  popover.hide();
644
653
  },
645
- [fireChange, popover],
654
+ [isDisabled, fireChange, popover],
646
655
  );
647
656
 
648
657
  const triggerRef = useRef<HTMLButtonElement>(null);
@@ -813,6 +822,7 @@ export function DateRangeInput({
813
822
  const presetRange = preset.getRange();
814
823
  const isActive = isRangeEqual(value, presetRange);
815
824
  const isPresetDisabled =
825
+ isDisabled ||
816
826
  !isRangeWithinSpan(presetRange, maxRangeSpan, minRangeSpan) ||
817
827
  isDateDisabled(plainDateFromISO(presetRange.start)) ||
818
828
  isDateDisabled(plainDateFromISO(presetRange.end));
@@ -828,6 +838,11 @@ export function DateRangeInput({
828
838
  aria-current={isActive ? 'true' : undefined}
829
839
  // Focusable while disabled (AR3, spec:AST-085 FR1).
830
840
  aria-disabled={isPresetDisabled || undefined}
841
+ aria-describedby={
842
+ showsDisabledMessage
843
+ ? disabledMessageTooltip.describedBy
844
+ : undefined
845
+ }
831
846
  onClick={() => {
832
847
  if (!isPresetDisabled) {
833
848
  handleRangeSelect(presetRange);
@@ -35,6 +35,7 @@ import {
35
35
  import type {BaseProps} from '../BaseProps';
36
36
  import {mergeProps} from '../utils';
37
37
  import {themeProps} from '../utils/themeProps';
38
+ import {isRenderable} from '../utils/isRenderable';
38
39
 
39
40
  const styles = stylex.create({
40
41
  heading: {
@@ -98,7 +99,7 @@ export function DropdownMenuGroup({
98
99
  ...rest
99
100
  }: DropdownMenuGroupProps) {
100
101
  const headingId = useId();
101
- const hasTitle = title != null && title !== '' && title !== false;
102
+ const hasTitle = isRenderable(title);
102
103
 
103
104
  return (
104
105
  <div
@@ -120,7 +120,8 @@ export const docs = {
120
120
  {
121
121
  name: 'labelTooltip',
122
122
  type: 'string',
123
- description: 'Tooltip text to display in an info icon at the end of the label.',
123
+ description:
124
+ 'Tooltip text to display in an info icon at the end of the label. Hover shows it; on a touch screen a tap on the icon opens it without focusing the field, while a mouse click on the icon focuses the field like the rest of the label.',
124
125
  },
125
126
  {
126
127
  name: 'status',
@@ -72,7 +72,8 @@ export const docs = {
72
72
  {
73
73
  name: 'labelTooltip',
74
74
  type: 'string',
75
- description: 'Tooltip text for the info icon after the label.',
75
+ description:
76
+ 'Tooltip text for the info icon after the label. Hover shows it; on a touch screen a tap on the icon opens it without focusing the field or toggling the control, while a mouse click on the icon activates the control like the rest of the label.',
76
77
  },
77
78
  {
78
79
  name: 'description',
@@ -176,7 +177,8 @@ export const docsZh = {
176
177
  {
177
178
  name: 'labelTooltip',
178
179
  type: 'string',
179
- description: '标签后信息图标的工具提示文本。',
180
+ description:
181
+ '标签后信息图标的工具提示文本。悬停即可显示;在触摸屏上点按图标即可打开,不会聚焦字段或切换控件;用鼠标点击图标则与点击标签其他部分一样激活控件。',
180
182
  },
181
183
  {
182
184
  name: 'description',