@astryxdesign/core 0.7.6-canary.5ef8ecf → 0.7.6-canary.6224efd
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/Badge/Badge.d.ts.map +1 -1
- package/dist/Badge/Badge.js +2 -1
- package/dist/DateInput/MonthScroller.d.ts.map +1 -1
- package/dist/DateInput/MonthScroller.js +17 -18
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +8 -4
- package/dist/DropdownMenu/DropdownMenuGroup.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuGroup.js +2 -1
- package/dist/Field/FieldLabel.d.ts.map +1 -1
- package/dist/Field/FieldLabel.js +27 -2
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +33 -22
- package/dist/Layer/useTouchTrigger.d.ts +9 -0
- package/dist/Layer/useTouchTrigger.d.ts.map +1 -1
- package/dist/Layer/useTouchTrigger.js +1 -1
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +11 -15
- package/dist/Resizable/useResizable.d.ts.map +1 -1
- package/dist/Resizable/useResizable.js +53 -10
- package/dist/Slider/Slider.d.ts.map +1 -1
- package/dist/Slider/Slider.js +90 -10
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +51 -47
- package/dist/Tokenizer/TokenizerBottomSheet.d.ts.map +1 -1
- package/dist/Tokenizer/TokenizerBottomSheet.js +8 -14
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +10 -3
- package/package.json +4 -4
- package/src/Badge/Badge.tsx +2 -1
- package/src/DateInput/MonthScroller.tsx +15 -17
- package/src/DateRangeInput/DateRangeInput.tsx +18 -3
- package/src/DropdownMenu/DropdownMenuGroup.tsx +2 -1
- package/src/Field/Field.doc.mjs +2 -1
- package/src/Field/FieldLabel.doc.mjs +4 -2
- package/src/Field/FieldLabel.spec.md +72 -55
- package/src/Field/FieldLabel.tsx +37 -3
- package/src/FileInput/FileInput.tsx +39 -23
- package/src/HoverCard/HoverCard.spec.md +96 -39
- package/src/InfoTip/InfoTip.spec.md +193 -0
- package/src/Layer/useTouchTrigger.ts +1 -1
- package/src/Layout/LayoutPanel.spec.md +60 -38
- package/src/Lightbox/Lightbox.spec.md +249 -61
- package/src/NumberInput/NumberInput.tsx +11 -18
- package/src/Resizable/Resizable.spec.md +41 -33
- package/src/Resizable/useResizable.ts +50 -7
- package/src/SideNav/SideNav.spec.md +8 -8
- package/src/Slider/Slider.spec.md +18 -16
- package/src/Slider/Slider.tsx +109 -9
- package/src/StatusDot/StatusDot.spec.md +77 -54
- package/src/Tokenizer/Tokenizer.tsx +54 -48
- package/src/Tokenizer/TokenizerBottomSheet.tsx +8 -14
- package/src/Tooltip/Tooltip.spec.md +139 -41
- package/src/Typeahead/BaseTypeahead.tsx +18 -2
|
@@ -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;
|
|
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"}
|
package/dist/Badge/Badge.js
CHANGED
|
@@ -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
|
|
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;
|
|
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
|
-
/**
|
|
58
|
-
const
|
|
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
|
-
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
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
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
scroller.removeEventListener('
|
|
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 (
|
|
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
|
-
}, [
|
|
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;
|
|
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
|
|
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,
|
|
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"}
|
package/dist/Field/FieldLabel.js
CHANGED
|
@@ -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 &&
|
|
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
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../src/FileInput/FileInput.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,kBAAkB,EACxB,MAAM,UAAU,CAAC;AAUlB,YAAY,EACV,WAAW,IAAI,eAAe,EAC9B,eAAe,IAAI,mBAAmB,GACvC,MAAM,UAAU,CAAC;AAGlB,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"FileInput.d.ts","sourceRoot":"","sources":["../../src/FileInput/FileInput.tsx"],"names":[],"mappings":"AAuCA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,kBAAkB,EACxB,MAAM,UAAU,CAAC;AAUlB,YAAY,EACV,WAAW,IAAI,eAAe,EAC9B,eAAe,IAAI,mBAAmB,GACvC,MAAM,UAAU,CAAC;AAGlB,OAAO,EACL,KAAK,mBAAmB,EAEzB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AA2P9C,MAAM,WAAW,cAAe,SAAQ,IAAI,CAC1C,mBAAmB,EACnB,UAAU,GAAG,cAAc,GAAG,OAAO,CACtC;IACC;;OAEG;IACH,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,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;IAC5B;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,KAAK,IAAI,CAAC;IAChD;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9D;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,aAAqB,EACrB,KAAK,EACL,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,UAAkB,EAClB,OAAO,EACP,QAAQ,EACR,UAAkB,EAClB,eAAe,EACf,UAAkB,EAClB,SAAiB,EACjB,MAAM,EAAE,UAAU,EAClB,aAA0B,EAC1B,WAAW,EACX,WAAW,EACX,IAAc,EACd,UAAkB,EAClB,YAAY,EACZ,KAAK,EACL,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,GAAG,EACH,EAAE,EAAE,MAAM,EACV,GAAG,SAAS,EACb,EAAE,cAAc,+BA0fhB;yBAzhBe,SAAS"}
|
|
@@ -164,6 +164,11 @@ const styles = {
|
|
|
164
164
|
kSiTet: "xbyyjgo",
|
|
165
165
|
kVAM5u: "xvy26l8 x6q1khz",
|
|
166
166
|
$$css: true
|
|
167
|
+
},
|
|
168
|
+
busy: {
|
|
169
|
+
kkrTdU: "xt0e3qv",
|
|
170
|
+
kGVxlE: "x1gnnqk1",
|
|
171
|
+
$$css: true
|
|
167
172
|
}
|
|
168
173
|
};
|
|
169
174
|
const statusBorderStyles = {
|
|
@@ -243,6 +248,10 @@ export function FileInput({
|
|
|
243
248
|
const [, startTransition] = useTransition();
|
|
244
249
|
const [optimisticValue, setOptimisticValue] = useOptimistic(value);
|
|
245
250
|
const isBusy = isLoading || optimisticValue !== value;
|
|
251
|
+
const isSelectionDisabled = isDisabled || isBusy;
|
|
252
|
+
if (isDragOver && isSelectionDisabled) {
|
|
253
|
+
setIsDragOver(false);
|
|
254
|
+
}
|
|
246
255
|
// A pick is one user action, already announced as "file selected"; a busy
|
|
247
256
|
// period it starts (changeAction, or a caller setting isLoading from
|
|
248
257
|
// onChange) adds no second message (spec:AST-086 FR6). The mark lasts until
|
|
@@ -301,7 +310,7 @@ export function FileInput({
|
|
|
301
310
|
const defaultPlaceholder = isMultiple ? t('@astryx.fileInput.placeholderMultiple') : t('@astryx.fileInput.placeholder');
|
|
302
311
|
const displayPlaceholder = placeholder ?? defaultPlaceholder;
|
|
303
312
|
const handleFiles = useCallback(fileList => {
|
|
304
|
-
if (
|
|
313
|
+
if (isSelectionDisabled) {
|
|
305
314
|
return;
|
|
306
315
|
}
|
|
307
316
|
const {
|
|
@@ -340,7 +349,7 @@ export function FileInput({
|
|
|
340
349
|
await changeAction(result);
|
|
341
350
|
});
|
|
342
351
|
}
|
|
343
|
-
}, [accept,
|
|
352
|
+
}, [accept, isSelectionDisabled, isMultiple, maxFiles, maxSize, onChange, changeAction, startTransition, setOptimisticValue, announce, t, formatList]);
|
|
344
353
|
const handleInputChange = useCallback(e => {
|
|
345
354
|
const fileList = Array.from(e.target.files ?? []);
|
|
346
355
|
handleFiles(fileList);
|
|
@@ -377,20 +386,22 @@ export function FileInput({
|
|
|
377
386
|
}
|
|
378
387
|
}, [onChange, changeAction, startTransition, setOptimisticValue]);
|
|
379
388
|
const handleClick = useCallback(() => {
|
|
380
|
-
if (!
|
|
389
|
+
if (!isSelectionDisabled) {
|
|
381
390
|
inputRef.current?.click();
|
|
382
391
|
}
|
|
383
|
-
}, [
|
|
392
|
+
}, [isSelectionDisabled]);
|
|
384
393
|
|
|
385
394
|
// Explicit keyboard activation so Enter/Space open the picker even where a
|
|
386
|
-
// synthetic keydown does not raise a native click.
|
|
387
|
-
//
|
|
395
|
+
// synthetic keydown does not raise a native click. Disabled and busy triggers
|
|
396
|
+
// also cancel the default activation while remaining focusable.
|
|
388
397
|
const handleKeyDown = useCallback(e => {
|
|
389
|
-
if (
|
|
398
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
390
399
|
e.preventDefault();
|
|
391
|
-
|
|
400
|
+
if (!isSelectionDisabled) {
|
|
401
|
+
inputRef.current?.click();
|
|
402
|
+
}
|
|
392
403
|
}
|
|
393
|
-
}, [
|
|
404
|
+
}, [isSelectionDisabled]);
|
|
394
405
|
|
|
395
406
|
// Make the surface clickable without giving it an interactive role. Clicks on
|
|
396
407
|
// the nested clear/status controls are ignored by the hook, so those buttons
|
|
@@ -401,22 +412,22 @@ export function FileInput({
|
|
|
401
412
|
} = useClickableContainer({
|
|
402
413
|
containerRef,
|
|
403
414
|
onClick: handleClick,
|
|
404
|
-
disabled:
|
|
415
|
+
disabled: isSelectionDisabled
|
|
405
416
|
});
|
|
406
417
|
const handleDragEnter = useCallback(e => {
|
|
407
418
|
e.preventDefault();
|
|
408
419
|
e.stopPropagation();
|
|
409
|
-
if (!
|
|
420
|
+
if (!isSelectionDisabled && mode === 'dropzone') {
|
|
410
421
|
setIsDragOver(true);
|
|
411
422
|
}
|
|
412
|
-
}, [
|
|
423
|
+
}, [isSelectionDisabled, mode]);
|
|
413
424
|
const handleDragOver = useCallback(e => {
|
|
414
425
|
e.preventDefault();
|
|
415
426
|
e.stopPropagation();
|
|
416
|
-
if (!
|
|
427
|
+
if (!isSelectionDisabled && mode === 'dropzone') {
|
|
417
428
|
setIsDragOver(true);
|
|
418
429
|
}
|
|
419
|
-
}, [
|
|
430
|
+
}, [isSelectionDisabled, mode]);
|
|
420
431
|
const handleDragLeave = useCallback(e => {
|
|
421
432
|
e.preventDefault();
|
|
422
433
|
e.stopPropagation();
|
|
@@ -432,14 +443,14 @@ export function FileInput({
|
|
|
432
443
|
e.preventDefault();
|
|
433
444
|
e.stopPropagation();
|
|
434
445
|
setIsDragOver(false);
|
|
435
|
-
if (
|
|
446
|
+
if (isSelectionDisabled || mode !== 'dropzone') {
|
|
436
447
|
return;
|
|
437
448
|
}
|
|
438
449
|
const fileList = Array.from(e.dataTransfer.files);
|
|
439
450
|
if (fileList.length > 0) {
|
|
440
451
|
handleFiles(fileList);
|
|
441
452
|
}
|
|
442
|
-
}, [
|
|
453
|
+
}, [isSelectionDisabled, mode, handleFiles]);
|
|
443
454
|
const hasFiles = optimisticValue != null && (Array.isArray(optimisticValue) ? optimisticValue.length > 0 : true);
|
|
444
455
|
const fileNames = hasFiles ? Array.isArray(optimisticValue) ? optimisticValue.map(f => f.name).join(', ') : optimisticValue?.name ?? '' : null;
|
|
445
456
|
|
|
@@ -560,13 +571,13 @@ export function FileInput({
|
|
|
560
571
|
// keyboard focus. Handlers are gated internally by isEnabled.
|
|
561
572
|
disabledMessageTooltip.ref(el);
|
|
562
573
|
},
|
|
563
|
-
onClick: !
|
|
564
|
-
onMouseUp: !
|
|
574
|
+
onClick: !isSelectionDisabled ? onContainerClick : undefined,
|
|
575
|
+
onMouseUp: !isSelectionDisabled ? onContainerMouseUp : undefined,
|
|
565
576
|
...dragDropProps,
|
|
566
577
|
...mergeProps(themeProps('file-input', {
|
|
567
578
|
mode,
|
|
568
579
|
status: status?.type ?? null
|
|
569
|
-
}), stylex.props(isDropzone ? styles.dropzone : styles.compact, isDropzone && !
|
|
580
|
+
}), stylex.props(isDropzone ? styles.dropzone : styles.compact, isDropzone && !isSelectionDisabled && styles.dropzoneHover, isDropzone && !isSelectionDisabled && isDragOver && styles.dropzoneActive, isDropzone && isDisabled && styles.dropzoneDisabled, !isDropzone && isDisabled && styles.compactDisabled, isBusy && styles.busy, status && statusBorderStyles[status.type], controlXstyle), controlClassName, controlStyle),
|
|
570
581
|
children: [/*#__PURE__*/_jsx(VisuallyHidden, {
|
|
571
582
|
children: /*#__PURE__*/_jsx("button", {
|
|
572
583
|
ref: triggerRef,
|
|
@@ -574,7 +585,7 @@ export function FileInput({
|
|
|
574
585
|
// A disabled trigger keeps its Tab stop (spec:AST-085 FR1).
|
|
575
586
|
,
|
|
576
587
|
tabIndex: 0,
|
|
577
|
-
"aria-disabled":
|
|
588
|
+
"aria-disabled": isSelectionDisabled ? 'true' : undefined,
|
|
578
589
|
onClick: handleClick,
|
|
579
590
|
onKeyDown: handleKeyDown
|
|
580
591
|
// aria-label suppresses child content from the accessible name, so
|
|
@@ -602,9 +613,9 @@ export function FileInput({
|
|
|
602
613
|
,
|
|
603
614
|
form: isDisabled ? '' : undefined
|
|
604
615
|
// A label or description click activates this input directly; cancel
|
|
605
|
-
// it so a disabled input never opens the picker (FR2).
|
|
616
|
+
// it so a disabled or busy input never opens the picker (FR2).
|
|
606
617
|
,
|
|
607
|
-
onClick:
|
|
618
|
+
onClick: isSelectionDisabled ? event => event.preventDefault() : rest.onClick,
|
|
608
619
|
onChange: handleInputChange
|
|
609
620
|
// The visually-hidden native input is never focused (tabIndex={-1});
|
|
610
621
|
// its describedby/required/invalid live on the trigger button.
|
|
@@ -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;
|
|
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":"NumberInput.d.ts","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"NumberInput.d.ts","sourceRoot":"","sources":["../../src/NumberInput/NumberInput.tsx"],"names":[],"mappings":"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"}
|
|
@@ -17,7 +17,8 @@
|
|
|
17
17
|
* - /apps/storybook/stories/NumberInput.stories.tsx (storybook stories)
|
|
18
18
|
* - /packages/cli/assets/templates/blocks/components/NumberInput/ (showcase blocks)
|
|
19
19
|
*/
|
|
20
|
-
import { use, useId, useState, useMemo, useCallback,
|
|
20
|
+
import { use, useId, useState, useMemo, useCallback, useRef } from 'react';
|
|
21
|
+
import { flushSync } from 'react-dom';
|
|
21
22
|
import * as stylex from '@stylexjs/stylex';
|
|
22
23
|
import "../theme/tokens.stylex.js";
|
|
23
24
|
import { colorVars, sizeVars, spacingVars, typographyVars, typeScaleVars, borderVars } from "../theme/tokens.stylex.js";
|
|
@@ -367,27 +368,22 @@ export function NumberInput({
|
|
|
367
368
|
// `formatValue` the text at rest differs from the editable text, and putting
|
|
368
369
|
// the editable text in the input after focus collapses that selection to the
|
|
369
370
|
// end, so typing would append. When focus arrives with the text selected,
|
|
370
|
-
//
|
|
371
|
-
|
|
371
|
+
// the focus handler commits the swap and selects the swapped-in text itself:
|
|
372
|
+
// the work one event causes stays in its handler
|
|
373
|
+
// (architecture:react-component-runtime/INV2).
|
|
372
374
|
const handleFocus = useCallback(e => {
|
|
373
375
|
const input = e.currentTarget;
|
|
374
|
-
// Only when focusing swaps the text: otherwise no render follows to
|
|
375
|
-
// consume the flag, and the first keystroke would.
|
|
376
376
|
const editableText = pendingInput ?? (value == null ? '' : formatEditableNumber(value, locale));
|
|
377
|
-
|
|
377
|
+
const shouldReselect = input.value.length > 0 && input.value !== editableText && input.selectionStart === 0 && input.selectionEnd === input.value.length;
|
|
378
378
|
setIsFocused(true);
|
|
379
379
|
onFocus?.(e);
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
}
|
|
385
|
-
reselectOnFocusRef.current = false;
|
|
386
|
-
const input = inputRef.current;
|
|
387
|
-
if (input != null && input === document.activeElement) {
|
|
380
|
+
if (shouldReselect) {
|
|
381
|
+
// Commit the swap now, so the editable text is in the input to select.
|
|
382
|
+
// eslint-disable-next-line @eslint-react/dom-no-flush-sync -- the editable text must be in the input before the focus event selects it
|
|
383
|
+
flushSync(() => {});
|
|
388
384
|
input.setSelectionRange(0, input.value.length);
|
|
389
385
|
}
|
|
390
|
-
}, [
|
|
386
|
+
}, [onFocus, pendingInput, value, locale]);
|
|
391
387
|
const commitPendingInput = useCallback(trigger => {
|
|
392
388
|
if (pendingInput === null) {
|
|
393
389
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResizable.d.ts","sourceRoot":"","sources":["../../src/Resizable/useResizable.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"useResizable.d.ts","sourceRoot":"","sources":["../../src/Resizable/useResizable.ts"],"names":[],"mappings":"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"}
|
|
@@ -487,10 +487,14 @@ function useSingleResizable(config) {
|
|
|
487
487
|
// otherwise move the bound under the pointer; the new basis applies once the
|
|
488
488
|
// gesture ends.
|
|
489
489
|
const gestureBasisRef = useRef(null);
|
|
490
|
-
// Only forces the render that releases the frozen basis
|
|
490
|
+
// Only forces the render that ends a gesture: it releases the frozen basis,
|
|
491
|
+
// and its commit writes the size the gesture settled on.
|
|
491
492
|
const [gestureTick, setGestureTick] = useState(0);
|
|
492
493
|
void gestureTick;
|
|
493
494
|
const basis = gestureBasisRef.current ?? liveBasis;
|
|
495
|
+
// The frozen basis also marks a gesture in flight, from `_onResizeStart`
|
|
496
|
+
// until `_onResizeEnd` or `_onResizeCancel`.
|
|
497
|
+
const isGestureActive = gestureBasisRef.current != null;
|
|
494
498
|
const didWarnMinRef = useRef(false);
|
|
495
499
|
const didWarnMaxRef = useRef(false);
|
|
496
500
|
const didWarnDefaultRef = useRef(false);
|
|
@@ -608,18 +612,55 @@ function useSingleResizable(config) {
|
|
|
608
612
|
devWarn('useResizable', `the resolved minimum (${resolvedMin}px) is above the resolved ` + `maximum (${resolvedMax}px). The maximum wins, as it always has.`);
|
|
609
613
|
}
|
|
610
614
|
}, [resolvedMin, resolvedMax]);
|
|
615
|
+
|
|
616
|
+
// The size a gesture in flight has reached, for a region that unmounts
|
|
617
|
+
// before the gesture ends.
|
|
618
|
+
const pendingWriteRef = useRef(null);
|
|
611
619
|
useEffect(() => {
|
|
620
|
+
// Synchronizes the `autoSaveId` entry in localStorage with the size.
|
|
612
621
|
// Nothing is written while the basis is still the temporary stand-in. The
|
|
613
622
|
// size on such a render is a placeholder, and persisting it overwrites the
|
|
614
623
|
// real saved size with a value derived from a basis that was never real
|
|
615
624
|
// (AST-010 Platform support, FR9).
|
|
616
|
-
if (autoSaveId
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
625
|
+
if (!autoSaveId || !isBasisMeasured) {
|
|
626
|
+
pendingWriteRef.current = null;
|
|
627
|
+
return;
|
|
628
|
+
}
|
|
629
|
+
// Nor while a gesture is in flight. A drag commits a new size on every
|
|
630
|
+
// pointer move, and each write reaches every other open document of the
|
|
631
|
+
// origin as a `storage` event.
|
|
632
|
+
if (isGestureActive) {
|
|
633
|
+
pendingWriteRef.current = {
|
|
634
|
+
key: autoSaveId,
|
|
635
|
+
state: {
|
|
636
|
+
size,
|
|
637
|
+
isCollapsed
|
|
638
|
+
}
|
|
639
|
+
};
|
|
640
|
+
return;
|
|
621
641
|
}
|
|
622
|
-
|
|
642
|
+
// A gesture's one write happens here, in the commit that applies its
|
|
643
|
+
// release, not in the handler that ended it: this render is the first to
|
|
644
|
+
// know the final size. A basis that changed mid-gesture applies only at
|
|
645
|
+
// the release and can re-clamp the size (AST-010 FR7), and a move the
|
|
646
|
+
// release arrived before renders together with it. The handler sees
|
|
647
|
+
// neither.
|
|
648
|
+
pendingWriteRef.current = null;
|
|
649
|
+
persistState(autoSaveId, {
|
|
650
|
+
size,
|
|
651
|
+
isCollapsed
|
|
652
|
+
});
|
|
653
|
+
}, [size, isCollapsed, autoSaveId, isBasisMeasured, isGestureActive]);
|
|
654
|
+
|
|
655
|
+
// A region that unmounts mid-gesture never commits a release, so the size
|
|
656
|
+
// the gesture reached is written on the way out.
|
|
657
|
+
useEffect(() => () => {
|
|
658
|
+
const pending = pendingWriteRef.current;
|
|
659
|
+
pendingWriteRef.current = null;
|
|
660
|
+
if (pending != null) {
|
|
661
|
+
persistState(pending.key, pending.state);
|
|
662
|
+
}
|
|
663
|
+
}, []);
|
|
623
664
|
const collapse = useCallback(() => {
|
|
624
665
|
// The already-collapsed guard keeps a repeated call from re-notifying a
|
|
625
666
|
// transition that already happened.
|
|
@@ -683,7 +724,7 @@ function useSingleResizable(config) {
|
|
|
683
724
|
}, [collapsible, collapsedSize, setCollapsed, resolvedMin, resolvedMax, snaps, onSizeChange, onCollapseChange]);
|
|
684
725
|
|
|
685
726
|
// Releasing the frozen basis needs a render to apply whatever the basis
|
|
686
|
-
// became during the gesture.
|
|
727
|
+
// became during the gesture; that render's commit writes the final size.
|
|
687
728
|
const releaseGestureBasis = useCallback(() => {
|
|
688
729
|
if (gestureBasisRef.current != null) {
|
|
689
730
|
gestureBasisRef.current = null;
|
|
@@ -691,7 +732,8 @@ function useSingleResizable(config) {
|
|
|
691
732
|
}
|
|
692
733
|
}, []);
|
|
693
734
|
const onResizeEnd = useCallback(() => {
|
|
694
|
-
// Sizes are already committed during move;
|
|
735
|
+
// Sizes are already committed during move; the basis is held, and the
|
|
736
|
+
// commit that releases it writes the final size to storage.
|
|
695
737
|
releaseGestureBasis();
|
|
696
738
|
}, [releaseGestureBasis]);
|
|
697
739
|
|
|
@@ -699,7 +741,8 @@ function useSingleResizable(config) {
|
|
|
699
741
|
// capture, a handle unmounted mid-drag — is still over. It does not signal a
|
|
700
742
|
// resize end (that is #5297's contract, and the sizes were committed during
|
|
701
743
|
// move anyway), but the basis it froze has to come back, or every later
|
|
702
|
-
// percentage bound stays pinned to the container size at grab time
|
|
744
|
+
// percentage bound stays pinned to the container size at grab time, and the
|
|
745
|
+
// size it reached has to reach storage.
|
|
703
746
|
const onResizeCancel = releaseGestureBasis;
|
|
704
747
|
|
|
705
748
|
// The maximum a handle REPORTS (End uses only a configured maximum). A
|