@astryxdesign/core 0.7.8 → 0.7.9-canary.0a64fdb
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/AppShell/observeMainOverflow.d.ts.map +1 -1
- package/dist/AppShell/observeMainOverflow.js +9 -6
- package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheet.js +5 -0
- package/dist/Calendar/styles.d.ts +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +54 -11
- package/dist/ClickableCard/ClickableCard.d.ts +1 -1
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +5 -1
- package/dist/DateInput/PickerWheel.d.ts.map +1 -1
- package/dist/DateInput/PickerWheel.js +7 -1
- package/dist/DateRangeInput/DateRangeInput.js +1 -1
- package/dist/Dialog/Dialog.d.ts +2 -1
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +12 -1
- package/dist/Drawer/useDrawerDialogPresence.d.ts +2 -1
- package/dist/Drawer/useDrawerDialogPresence.d.ts.map +1 -1
- package/dist/Drawer/useDrawerDialogPresence.js +11 -2
- package/dist/DropdownMenu/DropdownMenu.d.ts +9 -1
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +9 -4
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +3 -2
- package/dist/Field/inputDisabledFocus.d.ts +4 -4
- package/dist/Field/inputStyles.stylex.d.ts +1 -1
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +16 -2
- package/dist/Icon/Icon.d.ts +1 -1
- package/dist/InfoTip/InfoTip.d.ts +1 -0
- package/dist/InfoTip/InfoTip.d.ts.map +1 -1
- package/dist/InfoTip/InfoTip.js +1 -0
- package/dist/InputGroup/InputGroup.d.ts +4 -3
- package/dist/InputGroup/InputGroup.d.ts.map +1 -1
- package/dist/InputGroup/InputGroup.js +2 -2
- package/dist/InputGroup/groupStyles.d.ts +1 -1
- package/dist/InputGroup/groupStyles.d.ts.map +1 -1
- package/dist/InputGroup/groupStyles.js +1 -1
- package/dist/Item/Item.d.ts +2 -1
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +29 -6
- package/dist/Layer/holdEntranceInput.d.ts +24 -0
- package/dist/Layer/holdEntranceInput.d.ts.map +1 -0
- package/dist/Layer/holdEntranceInput.js +65 -0
- package/dist/Layer/inputHold.d.ts +49 -0
- package/dist/Layer/inputHold.d.ts.map +1 -0
- package/dist/Layer/inputHold.js +636 -0
- package/dist/Layer/preserveAnimations.d.ts +1 -5
- package/dist/Layer/preserveAnimations.d.ts.map +1 -1
- package/dist/Layer/preserveAnimations.js +12 -214
- package/dist/Layout/LayoutContent.d.ts +3 -1
- package/dist/Layout/LayoutContent.d.ts.map +1 -1
- package/dist/Layout/LayoutContent.js +12 -4
- package/dist/Layout/LayoutPanel.d.ts +4 -1
- package/dist/Layout/LayoutPanel.d.ts.map +1 -1
- package/dist/Layout/LayoutPanel.js +13 -4
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +4 -0
- package/dist/MetadataList/MetadataList.js +1 -1
- package/dist/MobileNav/MobileNav.d.ts +11 -1
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +39 -1
- package/dist/MoreMenu/MoreMenu.d.ts +5 -3
- package/dist/MoreMenu/MoreMenu.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +22 -4
- package/dist/SelectableCard/SelectableCard.d.ts +1 -1
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +5 -1
- package/dist/Spinner/Spinner.d.ts.map +1 -1
- package/dist/Spinner/Spinner.js +12 -2
- package/dist/Stack/StackItem.d.ts +8 -4
- package/dist/Stack/StackItem.d.ts.map +1 -1
- package/dist/Stack/StackItem.js +17 -4
- package/dist/Table/plugins/sortable/useTableSortable.js +1 -1
- package/dist/Token/Token.d.ts.map +1 -1
- package/dist/Token/Token.js +9 -0
- package/dist/Token/TokenLink.d.ts +1 -1
- package/dist/Token/TokenLink.d.ts.map +1 -1
- package/dist/Token/TokenLink.js +4 -1
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +162 -59
- package/dist/TreeList/TreeListItem.d.ts +2 -1
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +27 -3
- package/dist/astryx.css +35 -8
- package/dist/gestures/GestureHost.d.ts +2 -2
- package/dist/gestures/GestureHost.d.ts.map +1 -1
- package/dist/gestures/GestureHost.js +21 -6
- package/dist/gestures/PanGestureRecognizer.d.ts +11 -1
- package/dist/gestures/PanGestureRecognizer.d.ts.map +1 -1
- package/dist/gestures/PanGestureRecognizer.js +15 -1
- package/dist/gestures/ScreenEdgePanGestureRecognizer.d.ts +6 -1
- package/dist/gestures/ScreenEdgePanGestureRecognizer.d.ts.map +1 -1
- package/dist/gestures/nativeScroll.d.ts +3 -6
- package/dist/gestures/nativeScroll.d.ts.map +1 -1
- package/dist/gestures/nativeScroll.js +7 -52
- package/dist/gestures/wheelSegmenter.d.ts +68 -1
- package/dist/gestures/wheelSegmenter.d.ts.map +1 -1
- package/dist/gestures/wheelSegmenter.js +199 -10
- package/dist/hooks/StackItemScrollRegion.d.ts +31 -0
- package/dist/hooks/StackItemScrollRegion.d.ts.map +1 -0
- package/dist/hooks/StackItemScrollRegion.js +40 -0
- package/dist/hooks/menuPressGesture.d.ts +133 -21
- package/dist/hooks/menuPressGesture.d.ts.map +1 -1
- package/dist/hooks/menuPressGesture.js +155 -30
- package/dist/hooks/menuPressValues.d.ts +16 -0
- package/dist/hooks/menuPressValues.d.ts.map +1 -0
- package/dist/hooks/menuPressValues.js +18 -0
- package/dist/hooks/useClickableContainer.d.ts +27 -5
- package/dist/hooks/useClickableContainer.d.ts.map +1 -1
- package/dist/hooks/useClickableContainer.js +41 -5
- package/dist/hooks/useFocusTrap.d.ts +10 -0
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +225 -132
- package/dist/hooks/useMenuPress.d.ts +34 -1
- package/dist/hooks/useMenuPress.d.ts.map +1 -1
- package/dist/hooks/useMenuPress.js +93 -5
- package/dist/hooks/usePressFeedback.d.ts +6 -6
- package/dist/hooks/usePressFeedback.js +6 -6
- package/dist/hooks/useScrollRegionProps.d.ts +35 -0
- package/dist/hooks/useScrollRegionProps.d.ts.map +1 -0
- package/dist/hooks/useScrollRegionProps.js +51 -0
- package/dist/i18n/generated-english/hooks/useScrollRegionProps.generated.d.ts +8 -0
- package/dist/i18n/generated-english/hooks/useScrollRegionProps.generated.d.ts.map +1 -0
- package/dist/i18n/generated-english/hooks/useScrollRegionProps.generated.js +12 -0
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +1 -0
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +1 -0
- package/dist/motion/carryAnimations.d.ts +58 -0
- package/dist/motion/carryAnimations.d.ts.map +1 -0
- package/dist/motion/carryAnimations.js +305 -0
- package/dist/motion/transientCopy.d.ts +4 -2
- package/dist/motion/transientCopy.d.ts.map +1 -1
- package/dist/motion/transientCopy.js +34 -5
- package/dist/motion/uikit/gestures.d.ts +41 -0
- package/dist/motion/uikit/gestures.d.ts.map +1 -1
- package/dist/motion/uikit/gestures.js +25 -0
- package/dist/motion/uikit/index.d.ts +1 -1
- package/dist/motion/uikit/index.d.ts.map +1 -1
- package/dist/motion/uikit/index.js +1 -1
- package/dist/privateAttributes/menuPressLit.stylex.d.ts +52 -0
- package/dist/privateAttributes/menuPressLit.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/menuPressLit.stylex.js +99 -0
- package/dist/privateAttributes/press.stylex.d.ts +139 -0
- package/dist/privateAttributes/press.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/press.stylex.js +98 -0
- package/dist/theme/tokens.stylex.d.ts +2 -2
- package/dist/theme/tokens.stylex.js +1 -1
- package/dist/utils/flatTree.d.ts +6 -3
- package/dist/utils/flatTree.d.ts.map +1 -1
- package/dist/utils/flatTree.js +13 -3
- package/dist/utils/hitArea.d.ts.map +1 -1
- package/dist/utils/hitArea.js +82 -5
- package/dist/utils/inputStream.d.ts +14 -1
- package/dist/utils/inputStream.d.ts.map +1 -1
- package/dist/utils/inputStream.js +40 -9
- package/dist/utils/interactionOverlay.stylex.d.ts +2 -1
- package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
- package/dist/utils/interactionOverlay.stylex.js +7 -2
- package/dist/utils/pressFeedback.d.ts +7 -0
- package/dist/utils/pressFeedback.d.ts.map +1 -1
- package/dist/utils/pressFeedback.js +32 -7
- package/dist/utils/pressGesture.d.ts +6 -0
- package/dist/utils/pressGesture.d.ts.map +1 -1
- package/dist/utils/pressGesture.js +17 -0
- package/dist/utils/rowPressLayer.stylex.d.ts +14 -0
- package/dist/utils/rowPressLayer.stylex.d.ts.map +1 -0
- package/dist/utils/rowPressLayer.stylex.js +25 -0
- package/dist/utils/scrollView.d.ts +25 -0
- package/dist/utils/scrollView.d.ts.map +1 -0
- package/dist/utils/scrollView.js +108 -0
- package/dist/utils/selectionLock.d.ts.map +1 -1
- package/dist/utils/selectionLock.js +1 -10
- package/dist/utils/touchHitArea.stylex.d.ts +35 -0
- package/dist/utils/touchHitArea.stylex.d.ts.map +1 -0
- package/dist/utils/touchHitArea.stylex.js +32 -0
- package/dist/utils/triggerFocus.d.ts +5 -0
- package/dist/utils/triggerFocus.d.ts.map +1 -1
- package/dist/utils/triggerFocus.js +9 -2
- package/locales/en.json +4 -0
- package/locales/pseudo.json +3 -0
- package/package.json +5 -5
- package/src/AppShell/observeMainOverflow.ts +9 -6
- package/src/BottomSheet/BottomSheet.tsx +5 -0
- package/src/CheckboxInput/CheckboxInput.doc.mjs +3 -2
- package/src/CheckboxInput/CheckboxInput.tsx +71 -9
- package/src/ClickableCard/ClickableCard.tsx +8 -1
- package/src/DateInput/PickerWheel.tsx +7 -2
- package/src/DateRangeInput/DateRangeInput.tsx +1 -1
- package/src/Dialog/Dialog.doc.mjs +1 -1
- package/src/Dialog/Dialog.tsx +12 -1
- package/src/Drawer/Drawer.doc.mjs +1 -1
- package/src/Drawer/useDrawerDialogPresence.ts +9 -2
- package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -2
- package/src/DropdownMenu/DropdownMenu.tsx +29 -5
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +5 -1
- package/src/DropdownMenu/DropdownMenuItem.tsx +8 -4
- package/src/DropdownMenu/DropdownMenuRadioItem.tsx +5 -1
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +5 -1
- package/src/FileInput/FileInput.tsx +16 -2
- package/src/InfoTip/InfoTip.doc.mjs +26 -2
- package/src/InfoTip/InfoTip.tsx +1 -0
- package/src/InputGroup/InputGroup.doc.mjs +4 -3
- package/src/InputGroup/InputGroup.tsx +4 -3
- package/src/InputGroup/groupStyles.ts +3 -1
- package/src/Item/Item.tsx +51 -9
- package/src/Layer/holdEntranceInput.ts +84 -0
- package/src/Layer/inputHold.ts +734 -0
- package/src/Layer/preserveAnimations.ts +12 -275
- package/src/Layout/LayoutContent.doc.mjs +6 -3
- package/src/Layout/LayoutContent.tsx +10 -4
- package/src/Layout/LayoutPanel.doc.mjs +6 -3
- package/src/Layout/LayoutPanel.tsx +11 -4
- package/src/Lightbox/Lightbox.tsx +4 -0
- package/src/MetadataList/MetadataList.tsx +1 -1
- package/src/MobileNav/MobileNav.doc.mjs +3 -3
- package/src/MobileNav/MobileNav.tsx +39 -1
- package/src/MoreMenu/MoreMenu.doc.mjs +2 -4
- package/src/MoreMenu/MoreMenu.tsx +5 -3
- package/src/RadioList/RadioListItem.doc.mjs +3 -2
- package/src/RadioList/RadioListItem.tsx +25 -7
- package/src/SelectableCard/SelectableCard.tsx +8 -1
- package/src/Spinner/Spinner.tsx +13 -3
- package/src/Stack/Stack.doc.mjs +1 -1
- package/src/Stack/StackItem.tsx +27 -13
- package/src/Table/plugins/sortable/useTableSortable.tsx +1 -1
- package/src/Token/Token.tsx +18 -1
- package/src/Token/TokenLink.tsx +7 -1
- package/src/Tooltip/useTooltip.tsx +175 -79
- package/src/TreeList/TreeListItem.tsx +36 -2
- package/src/gestures/GestureHost.ts +21 -5
- package/src/gestures/PanGestureRecognizer.ts +19 -2
- package/src/gestures/README.md +14 -5
- package/src/gestures/ScreenEdgePanGestureRecognizer.ts +6 -1
- package/src/gestures/nativeScroll.ts +12 -68
- package/src/gestures/wheelSegmenter.ts +243 -10
- package/src/hooks/StackItemScrollRegion.tsx +57 -0
- package/src/hooks/menuPressGesture.ts +244 -38
- package/src/hooks/menuPressValues.ts +18 -0
- package/src/hooks/useClickableContainer.doc.mjs +8 -2
- package/src/hooks/useClickableContainer.ts +72 -6
- package/src/hooks/useFocusTrap.ts +268 -151
- package/src/hooks/useMenuPress.ts +118 -11
- package/src/hooks/usePressFeedback.doc.mjs +3 -3
- package/src/hooks/usePressFeedback.ts +6 -6
- package/src/hooks/useScrollRegionProps.ts +76 -0
- package/src/i18n/generated-english/hooks/useScrollRegionProps.generated.ts +13 -0
- package/src/i18n/generated-locales/en.generated.ts +1 -0
- package/src/i18n/generated-locales/pseudo.generated.ts +1 -0
- package/src/motion/MEASUREMENTS.md +11 -0
- package/src/motion/carryAnimations.ts +389 -0
- package/src/motion/transientCopy.ts +45 -5
- package/src/motion/uikit/gestures.ts +22 -0
- package/src/motion/uikit/index.ts +1 -0
- package/src/privateAttributes/menuPressLit.stylex.ts +104 -0
- package/src/privateAttributes/press.stylex.ts +244 -0
- package/src/theme/tokens.stylex.ts +1 -1
- package/src/utils/flatTree.ts +15 -3
- package/src/utils/hitArea.ts +107 -5
- package/src/utils/inputStream.ts +47 -10
- package/src/utils/interactionOverlay.stylex.ts +7 -2
- package/src/utils/pressFeedback.ts +31 -6
- package/src/utils/pressGesture.ts +24 -1
- package/src/utils/rowPressLayer.stylex.ts +27 -0
- package/src/utils/scrollView.ts +135 -0
- package/src/utils/selectionLock.ts +5 -10
- package/src/utils/touchHitArea.stylex.ts +41 -0
- package/src/utils/triggerFocus.ts +17 -4
|
@@ -30,28 +30,9 @@
|
|
|
30
30
|
|
|
31
31
|
import { isRtlElement } from "../hooks/isRtlElement.js";
|
|
32
32
|
import { parentAcrossShadow } from "../utils/flatTree.js";
|
|
33
|
+
import { isInsideScrollView, parseTouchAction, rootOverflow, SCROLLABLE_OVERFLOW as SCROLLABLE } from "../utils/scrollView.js";
|
|
33
34
|
export { parentAcrossShadow };
|
|
34
|
-
|
|
35
|
-
export function parseTouchAction(value) {
|
|
36
|
-
const tokens = value.trim().split(/\s+/);
|
|
37
|
-
if (tokens.includes('auto') || tokens.includes('manipulation')) {
|
|
38
|
-
return {
|
|
39
|
-
x: true,
|
|
40
|
-
y: true
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
if (tokens.includes('none')) {
|
|
44
|
-
return {
|
|
45
|
-
x: false,
|
|
46
|
-
y: false
|
|
47
|
-
};
|
|
48
|
-
}
|
|
49
|
-
return {
|
|
50
|
-
x: tokens.some(token => token === 'pan-x' || token === 'pan-left' || token === 'pan-right'),
|
|
51
|
-
y: tokens.some(token => token === 'pan-y' || token === 'pan-up' || token === 'pan-down')
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
const SCROLLABLE = new Set(['auto', 'scroll', 'overlay']);
|
|
35
|
+
export { parseTouchAction };
|
|
55
36
|
const EDGE_TOLERANCE = 1;
|
|
56
37
|
function buildChain(target, readsTouchAction) {
|
|
57
38
|
const doc = target.ownerDocument;
|
|
@@ -67,7 +48,6 @@ function buildChain(target, readsTouchAction) {
|
|
|
67
48
|
let allowX = true;
|
|
68
49
|
let allowY = true;
|
|
69
50
|
let reachedRoot = false;
|
|
70
|
-
let isBeyondFixed = false;
|
|
71
51
|
for (let node = target; node != null; node = parentAcrossShadow(node)) {
|
|
72
52
|
if (!(node instanceof Element)) {
|
|
73
53
|
continue;
|
|
@@ -96,16 +76,12 @@ function buildChain(target, readsTouchAction) {
|
|
|
96
76
|
// The writing direction through core's one helper.
|
|
97
77
|
isRtl: isRtlElement(element),
|
|
98
78
|
stopsX: behaviorX !== 'auto',
|
|
99
|
-
stopsY: behaviorY !== 'auto'
|
|
100
|
-
isBeyondFixed
|
|
79
|
+
stopsY: behaviorY !== 'auto'
|
|
101
80
|
});
|
|
102
81
|
}
|
|
103
82
|
if (isRoot) {
|
|
104
83
|
break;
|
|
105
84
|
}
|
|
106
|
-
if (style.position === 'fixed') {
|
|
107
|
-
isBeyondFixed = true;
|
|
108
|
-
}
|
|
109
85
|
}
|
|
110
86
|
if (!reachedRoot && root instanceof Element) {
|
|
111
87
|
chain.push({
|
|
@@ -114,8 +90,7 @@ function buildChain(target, readsTouchAction) {
|
|
|
114
90
|
y: allowY && SCROLLABLE.has(rootOverflow(doc, 'y')),
|
|
115
91
|
isRtl: false,
|
|
116
92
|
stopsX: false,
|
|
117
|
-
stopsY: false
|
|
118
|
-
isBeyondFixed
|
|
93
|
+
stopsY: false
|
|
119
94
|
});
|
|
120
95
|
}
|
|
121
96
|
return {
|
|
@@ -134,28 +109,6 @@ function overscrollBehavior(style) {
|
|
|
134
109
|
const [first = 'auto', second = first] = (style.getPropertyValue('overscroll-behavior') || 'auto').trim().split(/\s+/);
|
|
135
110
|
return [x || first, y || second];
|
|
136
111
|
}
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* The viewport scrolls unless the root or the body clips it (a scroll lock
|
|
140
|
-
* sets `overflow: hidden` on one of them).
|
|
141
|
-
*/
|
|
142
|
-
function rootOverflow(doc, axis) {
|
|
143
|
-
const view = doc.defaultView;
|
|
144
|
-
if (view == null) {
|
|
145
|
-
return 'hidden';
|
|
146
|
-
}
|
|
147
|
-
for (const element of [doc.documentElement, doc.body]) {
|
|
148
|
-
if (element == null) {
|
|
149
|
-
continue;
|
|
150
|
-
}
|
|
151
|
-
const style = view.getComputedStyle(element);
|
|
152
|
-
const value = axis === 'x' ? style.overflowX : style.overflowY;
|
|
153
|
-
if (value === 'hidden' || value === 'clip') {
|
|
154
|
-
return 'hidden';
|
|
155
|
-
}
|
|
156
|
-
}
|
|
157
|
-
return 'auto';
|
|
158
|
-
}
|
|
159
112
|
function canMoveY(element, dy) {
|
|
160
113
|
if (element.scrollHeight - element.clientHeight <= EDGE_TOLERANCE) {
|
|
161
114
|
return false;
|
|
@@ -241,7 +194,9 @@ export function createNativeScrollProbe(target, {
|
|
|
241
194
|
return chain?.allowsPan === true;
|
|
242
195
|
},
|
|
243
196
|
get isInsideScroller() {
|
|
244
|
-
return
|
|
197
|
+
return target instanceof Element && isInsideScrollView(target, {
|
|
198
|
+
readsTouchAction
|
|
199
|
+
});
|
|
245
200
|
}
|
|
246
201
|
};
|
|
247
202
|
}
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
* @input A wheel stream's deltas along one axis, with their event times
|
|
4
4
|
* @output Exports WheelSegmenter and isBunched. WheelSegmenter splits the
|
|
5
5
|
* stream into gestures and reads a trackpad's lift (the onset of momentum).
|
|
6
|
+
* It keeps a trackpad's late or merged glide wheels in their flick.
|
|
6
7
|
* isBunched tells one stall's merge from a frame.
|
|
7
8
|
* @position Read by GestureHost.ts's wheel input: the web reports no
|
|
8
9
|
* trackpad contact or phase, so both are inferred.
|
|
@@ -21,6 +22,12 @@ export interface WheelSegment {
|
|
|
21
22
|
readonly decaying: boolean;
|
|
22
23
|
/** This event came so soon after the one before that it is a merge. */
|
|
23
24
|
readonly bunched: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* The signed travel of the late wheel before this one, with any wheel
|
|
27
|
+
* merged with it. It is handed over when that wheel joined the glide and
|
|
28
|
+
* this one grows into a new gesture; else 0.
|
|
29
|
+
*/
|
|
30
|
+
readonly carried: number;
|
|
24
31
|
}
|
|
25
32
|
/**
|
|
26
33
|
* Whether a wheel `intervalMs` after the one before is one stall's merge, not
|
|
@@ -39,6 +46,16 @@ export declare function isBunched(intervalMs: number): boolean;
|
|
|
39
46
|
* decay, or a pause of 50 ms starts a new gesture. A bunched wheel is never
|
|
40
47
|
* a jump. The decay reads it by its last step. Momentum never pauses,
|
|
41
48
|
* reverses or grows.
|
|
49
|
+
*
|
|
50
|
+
* A stalled page receives a trackpad's glide late, and the engine merges the
|
|
51
|
+
* wheels it held. In momentum, a trackpad wheel that the glide's decay
|
|
52
|
+
* explains stays in the flick. It may come after a pause, or rise after more
|
|
53
|
+
* than a frame. It is at or below the next step, or near the sum of the next
|
|
54
|
+
* steps its stall spans. After such a wheel, a trackpad wheel that grows
|
|
55
|
+
* starts a new gesture and takes the late wheel's travel. The decay also
|
|
56
|
+
* reads a trackpad merge in momentum, by its last step. It reads one in a
|
|
57
|
+
* shrinking run too, where it explains the merge better than steady steps
|
|
58
|
+
* do. Other wheels keep the rules above.
|
|
42
59
|
*/
|
|
43
60
|
export declare class WheelSegmenter {
|
|
44
61
|
gesture: number;
|
|
@@ -49,7 +66,57 @@ export declare class WheelSegmenter {
|
|
|
49
66
|
private count;
|
|
50
67
|
private run;
|
|
51
68
|
private runStart;
|
|
52
|
-
|
|
69
|
+
/** The decay's step-to-step ratio, from the last two one-step wheels. */
|
|
70
|
+
private ratio;
|
|
71
|
+
/** The gesture's last on-pace intervals, ms: their median is its frame. */
|
|
72
|
+
private paces;
|
|
73
|
+
/** The intervals in a row that came slower than the frame allows, ms. */
|
|
74
|
+
private slower;
|
|
75
|
+
/** When the gesture's last wheel within two frames of the one before came. */
|
|
76
|
+
private onPace;
|
|
77
|
+
/** The gesture's last wheel that was not bunched, px. */
|
|
78
|
+
private paced;
|
|
79
|
+
/** A wheel joined the glide late: a later one that grows is the fingers'. */
|
|
80
|
+
private resumed;
|
|
81
|
+
/**
|
|
82
|
+
* The signed travel of the last wheel that joined the glide late, with any
|
|
83
|
+
* wheel merged with it.
|
|
84
|
+
*/
|
|
85
|
+
private joined;
|
|
86
|
+
/**
|
|
87
|
+
* Reads one wheel. `continuous` is whether it carries a trackpad's
|
|
88
|
+
* signature (`scrollTypeOf`). Only those wheels can join a glide late.
|
|
89
|
+
*/
|
|
90
|
+
push(time: number, delta: number, idleMs: number, continuous?: boolean): WheelSegment;
|
|
91
|
+
/**
|
|
92
|
+
* Keep an interval for the frame. The gesture's first FIRST_PACES set it.
|
|
93
|
+
* After them, only an interval within half a frame and one and a half
|
|
94
|
+
* frames counts: a stall's squeezed wheels come faster. FIRST_PACES slower
|
|
95
|
+
* intervals in a row set the frame again, so a squeezed start cannot hold
|
|
96
|
+
* it down.
|
|
97
|
+
*/
|
|
98
|
+
private notePace;
|
|
99
|
+
/**
|
|
100
|
+
* The gesture's frame interval: the median of its last on-pace intervals,
|
|
101
|
+
* or FRAME_MS before it shows one. A trackpad reports at 60 Hz or faster,
|
|
102
|
+
* so a longer median is a stall's.
|
|
103
|
+
*/
|
|
104
|
+
private frameMs;
|
|
105
|
+
/** The sum of the decay's next `count` steps from `previous`. */
|
|
106
|
+
private glideSum;
|
|
107
|
+
/**
|
|
108
|
+
* How far a merge of `size` lies from whole steps of the run's steady
|
|
109
|
+
* size, or of its last step, whichever lies nearer.
|
|
110
|
+
*/
|
|
111
|
+
private steadyOff;
|
|
112
|
+
/**
|
|
113
|
+
* How many of the decay's next steps a trackpad wheel of `size` carries,
|
|
114
|
+
* at most `most`. A wheel at or below the next step carries one. A larger
|
|
115
|
+
* one carries the fewest steps whose sum lies within FIT_PX or `share` of
|
|
116
|
+
* it. The decay goes on from `previous` at `ratio` a step. Null when
|
|
117
|
+
* no sum lies that near.
|
|
118
|
+
*/
|
|
119
|
+
private glideSteps;
|
|
53
120
|
/** The gesture ended on its own (its timer): the next event starts one. */
|
|
54
121
|
end(): void;
|
|
55
122
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"wheelSegmenter.d.ts","sourceRoot":"","sources":["../../src/gestures/wheelSegmenter.ts"],"names":[],"mappings":"AAEA
|
|
1
|
+
{"version":3,"file":"wheelSegmenter.d.ts","sourceRoot":"","sources":["../../src/gestures/wheelSegmenter.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,KAAK,CAAC;AAC3E,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE/C,MAAM,WAAW,YAAY;IAC3B,0EAA0E;IAC1E,QAAQ,CAAC,QAAQ,EAAE,aAAa,GAAG,IAAI,CAAC;IACxC,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAC;IAC3B,6CAA6C;IAC7C,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,wEAAwE;IACxE,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,qEAAqE;IACrE,QAAQ,CAAC,QAAQ,EAAE,OAAO,CAAC;IAC3B,uEAAuE;IACvE,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;CAC1B;AAiCD;;;;;GAKG;AACH,wBAAgB,SAAS,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAErD;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,qBAAa,cAAc;IACzB,OAAO,SAAK;IACZ,KAAK,EAAE,UAAU,CAAY;IAC7B,OAAO,CAAC,IAAI,CAAa;IACzB,OAAO,CAAC,QAAQ,CAAK;IACrB,OAAO,CAAC,IAAI,CAAK;IACjB,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,GAAG,CAAK;IAChB,OAAO,CAAC,QAAQ,CAAK;IACrB,yEAAyE;IACzE,OAAO,CAAC,KAAK,CAAK;IAClB,2EAA2E;IAC3E,OAAO,CAAC,KAAK,CAAgB;IAC7B,yEAAyE;IACzE,OAAO,CAAC,MAAM,CAAgB;IAC9B,8EAA8E;IAC9E,OAAO,CAAC,MAAM,CAAa;IAC3B,yDAAyD;IACzD,OAAO,CAAC,KAAK,CAAK;IAClB,6EAA6E;IAC7E,OAAO,CAAC,OAAO,CAAS;IACxB;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAK;IAEnB;;;OAGG;IACH,IAAI,CACF,IAAI,EAAE,MAAM,EACZ,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,UAAU,UAAQ,GACjB,YAAY;IA+If;;;;;;OAMG;IACH,OAAO,CAAC,QAAQ;IAchB;;;;OAIG;IACH,OAAO,CAAC,OAAO;IAaf,iEAAiE;IACjE,OAAO,CAAC,QAAQ;IAUhB;;;OAGG;IACH,OAAO,CAAC,SAAS;IAUjB;;;;;;OAMG;IACH,OAAO,CAAC,UAAU;IAuBlB,2EAA2E;IAC3E,GAAG,IAAI,IAAI;CAGZ"}
|
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
* @input A wheel stream's deltas along one axis, with their event times
|
|
6
6
|
* @output Exports WheelSegmenter and isBunched. WheelSegmenter splits the
|
|
7
7
|
* stream into gestures and reads a trackpad's lift (the onset of momentum).
|
|
8
|
+
* It keeps a trackpad's late or merged glide wheels in their flick.
|
|
8
9
|
* isBunched tells one stall's merge from a frame.
|
|
9
10
|
* @position Read by GestureHost.ts's wheel input: the web reports no
|
|
10
11
|
* trackpad contact or phase, so both are inferred.
|
|
@@ -21,6 +22,25 @@ const BUNCHED_MS = 1.5;
|
|
|
21
22
|
const LIFT_RUN = 4;
|
|
22
23
|
/** And how much of its size the run has lost by then. */
|
|
23
24
|
const LIFT_DECAY = 0.8;
|
|
25
|
+
/** How near a wheel must lie to a sum of the glide's next steps, px. */
|
|
26
|
+
const FIT_PX = 1;
|
|
27
|
+
/** Or as a share of that sum, when the share is larger. */
|
|
28
|
+
const FIT_SHARE = 0.25;
|
|
29
|
+
/** The most glide steps one wheel is read as carrying. */
|
|
30
|
+
const MAX_STEPS = 64;
|
|
31
|
+
/** How near a late or rising wheel must lie to the glide's sum, as a share. */
|
|
32
|
+
const LATE_FIT_SHARE = 0.15;
|
|
33
|
+
/**
|
|
34
|
+
* How far a wheel may grow past the last unbunched one and still be the
|
|
35
|
+
* glide, px.
|
|
36
|
+
*/
|
|
37
|
+
const RISE_PX = 0.5;
|
|
38
|
+
/** A stream's frame interval until it shows its own, ms. */
|
|
39
|
+
const FRAME_MS = 16;
|
|
40
|
+
/** The longest frame interval a trackpad reports at: 60 Hz, ms. */
|
|
41
|
+
const SLOWEST_FRAME_MS = 1000 / 60;
|
|
42
|
+
/** The intervals that set a gesture's frame before its window applies. */
|
|
43
|
+
const FIRST_PACES = 3;
|
|
24
44
|
|
|
25
45
|
/**
|
|
26
46
|
* Whether a wheel `intervalMs` after the one before is one stall's merge, not
|
|
@@ -42,6 +62,16 @@ export function isBunched(intervalMs) {
|
|
|
42
62
|
* decay, or a pause of 50 ms starts a new gesture. A bunched wheel is never
|
|
43
63
|
* a jump. The decay reads it by its last step. Momentum never pauses,
|
|
44
64
|
* reverses or grows.
|
|
65
|
+
*
|
|
66
|
+
* A stalled page receives a trackpad's glide late, and the engine merges the
|
|
67
|
+
* wheels it held. In momentum, a trackpad wheel that the glide's decay
|
|
68
|
+
* explains stays in the flick. It may come after a pause, or rise after more
|
|
69
|
+
* than a frame. It is at or below the next step, or near the sum of the next
|
|
70
|
+
* steps its stall spans. After such a wheel, a trackpad wheel that grows
|
|
71
|
+
* starts a new gesture and takes the late wheel's travel. The decay also
|
|
72
|
+
* reads a trackpad merge in momentum, by its last step. It reads one in a
|
|
73
|
+
* shrinking run too, where it explains the merge better than steady steps
|
|
74
|
+
* do. Other wheels keep the rules above.
|
|
45
75
|
*/
|
|
46
76
|
export class WheelSegmenter {
|
|
47
77
|
gesture = 0;
|
|
@@ -52,40 +82,108 @@ export class WheelSegmenter {
|
|
|
52
82
|
count = 0;
|
|
53
83
|
run = 0;
|
|
54
84
|
runStart = 0;
|
|
55
|
-
|
|
85
|
+
/** The decay's step-to-step ratio, from the last two one-step wheels. */
|
|
86
|
+
ratio = 1;
|
|
87
|
+
/** The gesture's last on-pace intervals, ms: their median is its frame. */
|
|
88
|
+
paces = [];
|
|
89
|
+
/** The intervals in a row that came slower than the frame allows, ms. */
|
|
90
|
+
slower = [];
|
|
91
|
+
/** When the gesture's last wheel within two frames of the one before came. */
|
|
92
|
+
onPace = -Infinity;
|
|
93
|
+
/** The gesture's last wheel that was not bunched, px. */
|
|
94
|
+
paced = 0;
|
|
95
|
+
/** A wheel joined the glide late: a later one that grows is the fingers'. */
|
|
96
|
+
resumed = false;
|
|
97
|
+
/**
|
|
98
|
+
* The signed travel of the last wheel that joined the glide late, with any
|
|
99
|
+
* wheel merged with it.
|
|
100
|
+
*/
|
|
101
|
+
joined = 0;
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* Reads one wheel. `continuous` is whether it carries a trackpad's
|
|
105
|
+
* signature (`scrollTypeOf`). Only those wheels can join a glide late.
|
|
106
|
+
*/
|
|
107
|
+
push(time, delta, idleMs, continuous = false) {
|
|
56
108
|
const size = Math.abs(delta);
|
|
57
109
|
const sign = Math.sign(delta);
|
|
58
110
|
const gap = time - this.last;
|
|
59
111
|
const bunched = this.count > 0 && isBunched(gap);
|
|
112
|
+
const frame = this.frameMs();
|
|
60
113
|
let boundary = null;
|
|
114
|
+
let carriedSteps = null;
|
|
61
115
|
if (this.count === 0) {
|
|
62
116
|
boundary = this.gesture === 0 ? 'first' : 'idle';
|
|
63
117
|
} else if (this.phase === 'finger' && gap >= idleMs) {
|
|
64
118
|
boundary = 'idle';
|
|
65
119
|
} else if (this.phase === 'momentum') {
|
|
120
|
+
// A late wheel carries the steps of its whole stall, which began at the
|
|
121
|
+
// last wheel that came on pace.
|
|
122
|
+
const frames = Math.round((time - this.onPace) / frame);
|
|
123
|
+
const late = gap >= MOMENTUM_GAP_MS;
|
|
124
|
+
const rises = !bunched && size >= 2 && size > this.previous * 1.3 + 0.5;
|
|
66
125
|
if (sign !== 0 && this.sign !== 0 && sign !== this.sign) {
|
|
67
126
|
boundary = 'reversal';
|
|
68
|
-
} else if (
|
|
69
|
-
|
|
70
|
-
|
|
127
|
+
} else if (late || rises) {
|
|
128
|
+
// A wheel that rises on pace is the fingers'. One that rises after a
|
|
129
|
+
// skipped frame may carry the frames its stall held.
|
|
130
|
+
if (continuous && sign === this.sign && (late || gap >= 1.5 * frame)) {
|
|
131
|
+
carriedSteps = this.glideSteps(size, Math.max(1, frames), LATE_FIT_SHARE);
|
|
132
|
+
}
|
|
133
|
+
if (carriedSteps == null) {
|
|
134
|
+
boundary = late ? 'gap' : 'jump';
|
|
135
|
+
}
|
|
136
|
+
} else if (continuous && this.resumed && !bunched && size > FIT_PX && size > this.paced + RISE_PX) {
|
|
137
|
+
// A glide only falls, so after a late wheel one that grows is the
|
|
138
|
+
// fingers'. A whole-pixel glide repeats a step as it slows.
|
|
71
139
|
boundary = 'jump';
|
|
72
140
|
}
|
|
73
141
|
}
|
|
142
|
+
if (carriedSteps == null && boundary == null && bunched && continuous) {
|
|
143
|
+
if (this.phase === 'momentum') {
|
|
144
|
+
carriedSteps = this.glideSteps(size, MAX_STEPS);
|
|
145
|
+
} else if (this.run > 0) {
|
|
146
|
+
// In a shrinking run, the decay reads a merge only where it explains
|
|
147
|
+
// the merge better than steady steps do.
|
|
148
|
+
const decay = this.glideSteps(size, MAX_STEPS);
|
|
149
|
+
if (decay != null && decay > 1 && Math.abs(size - this.glideSum(decay)) < this.steadyOff(size)) {
|
|
150
|
+
carriedSteps = decay;
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
}
|
|
74
154
|
// A bunched wheel carries the steps of the frames it merged. The decay
|
|
75
155
|
// goes on from its last step, so the steps after it read as they are.
|
|
76
|
-
const steps = boundary == null && bunched && this.previous > 0 ? Math.max(1, Math.round(size / this.previous)) : 1;
|
|
156
|
+
const steps = carriedSteps ?? (boundary == null && bunched && this.previous > 0 ? Math.max(1, Math.round(size / this.previous)) : 1);
|
|
157
|
+
// On the decay, a wheel of several steps ends at the decay's own step.
|
|
158
|
+
const onDecay = carriedSteps != null && carriedSteps > 1;
|
|
159
|
+
// A bunched wheel is read by its last step, as the decay goes on from it.
|
|
160
|
+
const step = onDecay ? this.previous * this.ratio ** steps : size / steps;
|
|
77
161
|
if (boundary != null) {
|
|
78
162
|
this.gesture += 1;
|
|
79
163
|
this.phase = 'finger';
|
|
80
164
|
this.count = 0;
|
|
81
165
|
this.run = 0;
|
|
166
|
+
this.ratio = 1;
|
|
167
|
+
this.resumed = false;
|
|
168
|
+
this.paces = [];
|
|
169
|
+
this.slower = [];
|
|
170
|
+
}
|
|
171
|
+
// The late wheel was the fingers' when the next one grows: the new
|
|
172
|
+
// gesture takes its travel.
|
|
173
|
+
const carried = boundary === 'jump' ? this.joined : 0;
|
|
174
|
+
const joinedLate = boundary == null && carriedSteps != null && !bunched;
|
|
175
|
+
if (joinedLate) {
|
|
176
|
+
this.resumed = true;
|
|
177
|
+
}
|
|
178
|
+
// A wheel merged with the late one is the same dispatch: it adds to it.
|
|
179
|
+
this.joined = joinedLate ? delta : bunched && boundary == null && this.joined !== 0 ? this.joined + delta : 0;
|
|
180
|
+
if (!bunched) {
|
|
181
|
+
this.paced = size;
|
|
82
182
|
}
|
|
83
183
|
let liftNow = false;
|
|
84
184
|
let decaying = false;
|
|
85
185
|
if (this.phase === 'finger' && this.count >= 3 && size > 0) {
|
|
86
|
-
|
|
87
|
-
const step = size / steps;
|
|
88
|
-
decaying = step <= this.previous * 0.995 && step >= this.previous * 0.5;
|
|
186
|
+
decaying = onDecay ? this.ratio <= 0.995 : step <= this.previous * 0.995 && step >= this.previous * 0.5;
|
|
89
187
|
if (decaying) {
|
|
90
188
|
if (this.run === 0) {
|
|
91
189
|
this.runStart = this.previous;
|
|
@@ -99,8 +197,17 @@ export class WheelSegmenter {
|
|
|
99
197
|
liftNow = true;
|
|
100
198
|
}
|
|
101
199
|
}
|
|
200
|
+
if (steps === 1 && this.count > 0 && this.previous > 0 && step > 0) {
|
|
201
|
+
this.ratio = Math.min(1, Math.max(0.5, step / this.previous));
|
|
202
|
+
}
|
|
203
|
+
if (!bunched && boundary == null && gap < MOMENTUM_GAP_MS) {
|
|
204
|
+
this.notePace(gap, frame);
|
|
205
|
+
}
|
|
206
|
+
if (boundary != null || !bunched && gap < 2 * frame) {
|
|
207
|
+
this.onPace = time;
|
|
208
|
+
}
|
|
102
209
|
this.count += 1;
|
|
103
|
-
this.previous =
|
|
210
|
+
this.previous = step;
|
|
104
211
|
if (sign !== 0) {
|
|
105
212
|
this.sign = sign;
|
|
106
213
|
}
|
|
@@ -111,10 +218,92 @@ export class WheelSegmenter {
|
|
|
111
218
|
gesture: this.gesture,
|
|
112
219
|
liftNow,
|
|
113
220
|
decaying: decaying && !liftNow,
|
|
114
|
-
bunched: boundary == null && bunched
|
|
221
|
+
bunched: boundary == null && bunched,
|
|
222
|
+
carried
|
|
115
223
|
};
|
|
116
224
|
}
|
|
117
225
|
|
|
226
|
+
/**
|
|
227
|
+
* Keep an interval for the frame. The gesture's first FIRST_PACES set it.
|
|
228
|
+
* After them, only an interval within half a frame and one and a half
|
|
229
|
+
* frames counts: a stall's squeezed wheels come faster. FIRST_PACES slower
|
|
230
|
+
* intervals in a row set the frame again, so a squeezed start cannot hold
|
|
231
|
+
* it down.
|
|
232
|
+
*/
|
|
233
|
+
notePace(gap, frame) {
|
|
234
|
+
const inWindow = gap >= 0.5 * frame && gap <= 1.5 * frame;
|
|
235
|
+
if (this.paces.length < FIRST_PACES || inWindow) {
|
|
236
|
+
this.paces = [...this.paces.slice(-7), gap];
|
|
237
|
+
this.slower = [];
|
|
238
|
+
return;
|
|
239
|
+
}
|
|
240
|
+
this.slower = gap > 1.5 * frame ? [...this.slower, gap] : [];
|
|
241
|
+
if (this.slower.length >= FIRST_PACES) {
|
|
242
|
+
this.paces = this.slower;
|
|
243
|
+
this.slower = [];
|
|
244
|
+
}
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
/**
|
|
248
|
+
* The gesture's frame interval: the median of its last on-pace intervals,
|
|
249
|
+
* or FRAME_MS before it shows one. A trackpad reports at 60 Hz or faster,
|
|
250
|
+
* so a longer median is a stall's.
|
|
251
|
+
*/
|
|
252
|
+
frameMs() {
|
|
253
|
+
if (this.paces.length === 0) {
|
|
254
|
+
return FRAME_MS;
|
|
255
|
+
}
|
|
256
|
+
const sorted = [...this.paces].sort((a, b) => a - b);
|
|
257
|
+
const middle = sorted.length >> 1;
|
|
258
|
+
const median = sorted.length % 2 === 1 ? sorted[middle] : (sorted[middle - 1] + sorted[middle]) / 2;
|
|
259
|
+
return Math.min(median, SLOWEST_FRAME_MS);
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
/** The sum of the decay's next `count` steps from `previous`. */
|
|
263
|
+
glideSum(count) {
|
|
264
|
+
let next = this.previous * this.ratio;
|
|
265
|
+
let sum = 0;
|
|
266
|
+
for (let i = 0; i < count; i++) {
|
|
267
|
+
sum += next;
|
|
268
|
+
next *= this.ratio;
|
|
269
|
+
}
|
|
270
|
+
return sum;
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
/**
|
|
274
|
+
* How far a merge of `size` lies from whole steps of the run's steady
|
|
275
|
+
* size, or of its last step, whichever lies nearer.
|
|
276
|
+
*/
|
|
277
|
+
steadyOff(size) {
|
|
278
|
+
return Math.min(...[this.runStart, this.previous].filter(step => step > 0).map(step => Math.abs(size - Math.max(1, Math.round(size / step)) * step)));
|
|
279
|
+
}
|
|
280
|
+
|
|
281
|
+
/**
|
|
282
|
+
* How many of the decay's next steps a trackpad wheel of `size` carries,
|
|
283
|
+
* at most `most`. A wheel at or below the next step carries one. A larger
|
|
284
|
+
* one carries the fewest steps whose sum lies within FIT_PX or `share` of
|
|
285
|
+
* it. The decay goes on from `previous` at `ratio` a step. Null when
|
|
286
|
+
* no sum lies that near.
|
|
287
|
+
*/
|
|
288
|
+
glideSteps(size, most, share = FIT_SHARE) {
|
|
289
|
+
if (this.previous <= 0 || size <= 0) {
|
|
290
|
+
return null;
|
|
291
|
+
}
|
|
292
|
+
let next = this.previous * this.ratio;
|
|
293
|
+
if (size <= next + FIT_PX) {
|
|
294
|
+
return 1;
|
|
295
|
+
}
|
|
296
|
+
let sum = next;
|
|
297
|
+
for (let count = 2; count <= Math.min(most, MAX_STEPS); count++) {
|
|
298
|
+
next *= this.ratio;
|
|
299
|
+
sum += next;
|
|
300
|
+
if (Math.abs(size - sum) <= Math.max(FIT_PX, sum * share)) {
|
|
301
|
+
return count;
|
|
302
|
+
}
|
|
303
|
+
}
|
|
304
|
+
return null;
|
|
305
|
+
}
|
|
306
|
+
|
|
118
307
|
/** The gesture ended on its own (its timer): the next event starts one. */
|
|
119
308
|
end() {
|
|
120
309
|
this.count = 0;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @file StackItemScrollRegion.tsx
|
|
3
|
+
* @input A scrollable `div` or `span` StackItem's props, ref and children
|
|
4
|
+
* @output StackItemScrollRegion (internal; not re-exported from
|
|
5
|
+
* hooks/index.ts), which renders that element and names it as a group
|
|
6
|
+
* while its content overflows
|
|
7
|
+
* @position Internal client island for StackItem, which itself stays a
|
|
8
|
+
* static render. Only a scrollable `div` or `span` item measures its
|
|
9
|
+
* overflow, on the client; another element keeps its own role.
|
|
10
|
+
*
|
|
11
|
+
* SYNC: When modified, update:
|
|
12
|
+
* - /packages/core/src/Stack/StackItem.tsx
|
|
13
|
+
* - /packages/core/src/serverSafeComponents.test.ts
|
|
14
|
+
*/
|
|
15
|
+
import { type AriaRole, type ReactNode, type Ref } from 'react';
|
|
16
|
+
export interface StackItemScrollRegionProps {
|
|
17
|
+
as: 'div' | 'span';
|
|
18
|
+
ref?: Ref<HTMLElement>;
|
|
19
|
+
elementProps: {
|
|
20
|
+
role?: AriaRole;
|
|
21
|
+
'aria-label'?: string;
|
|
22
|
+
[prop: string]: unknown;
|
|
23
|
+
};
|
|
24
|
+
children?: ReactNode;
|
|
25
|
+
}
|
|
26
|
+
export declare function StackItemScrollRegion({ as: element, ref, elementProps, children, }: StackItemScrollRegionProps): import("react").DetailedReactHTMLElement<{
|
|
27
|
+
ref: import("react").RefCallback<HTMLElement>;
|
|
28
|
+
role: AriaRole | undefined;
|
|
29
|
+
'aria-label': string | undefined;
|
|
30
|
+
}, HTMLElement>;
|
|
31
|
+
//# sourceMappingURL=StackItemScrollRegion.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"StackItemScrollRegion.d.ts","sourceRoot":"","sources":["../../src/hooks/StackItemScrollRegion.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAgB,KAAK,QAAQ,EAAE,KAAK,SAAS,EAAE,KAAK,GAAG,EAAC,MAAM,OAAO,CAAC;AAI7E,MAAM,WAAW,0BAA0B;IACzC,EAAE,EAAE,KAAK,GAAG,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,YAAY,EAAE;QACZ,IAAI,CAAC,EAAE,QAAQ,CAAC;QAChB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC;KACzB,CAAC;IACF,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,EAAE,EAAE,OAAO,EACX,GAAG,EACH,YAAY,EACZ,QAAQ,GACT,EAAE,0BAA0B;;;;gBAiB5B"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
// Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
2
|
+
|
|
3
|
+
'use client';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* @file StackItemScrollRegion.tsx
|
|
7
|
+
* @input A scrollable `div` or `span` StackItem's props, ref and children
|
|
8
|
+
* @output StackItemScrollRegion (internal; not re-exported from
|
|
9
|
+
* hooks/index.ts), which renders that element and names it as a group
|
|
10
|
+
* while its content overflows
|
|
11
|
+
* @position Internal client island for StackItem, which itself stays a
|
|
12
|
+
* static render. Only a scrollable `div` or `span` item measures its
|
|
13
|
+
* overflow, on the client; another element keeps its own role.
|
|
14
|
+
*
|
|
15
|
+
* SYNC: When modified, update:
|
|
16
|
+
* - /packages/core/src/Stack/StackItem.tsx
|
|
17
|
+
* - /packages/core/src/serverSafeComponents.test.ts
|
|
18
|
+
*/
|
|
19
|
+
import { createElement } from 'react';
|
|
20
|
+
import { useMergedRefs } from "./useMergedRefs.js";
|
|
21
|
+
import { useScrollRegionProps } from "./useScrollRegionProps.js";
|
|
22
|
+
export function StackItemScrollRegion({
|
|
23
|
+
as: element,
|
|
24
|
+
ref,
|
|
25
|
+
elementProps,
|
|
26
|
+
children
|
|
27
|
+
}) {
|
|
28
|
+
const region = useScrollRegionProps({
|
|
29
|
+
isScrollable: true,
|
|
30
|
+
role: elementProps.role,
|
|
31
|
+
label: elementProps['aria-label']
|
|
32
|
+
});
|
|
33
|
+
const mergedRef = useMergedRefs(ref, region.ref);
|
|
34
|
+
return /*#__PURE__*/createElement(element, {
|
|
35
|
+
...elementProps,
|
|
36
|
+
ref: mergedRef,
|
|
37
|
+
role: region.role,
|
|
38
|
+
'aria-label': region['aria-label']
|
|
39
|
+
}, children);
|
|
40
|
+
}
|