@astryxdesign/core 0.7.8 → 0.7.9-canary.7400c1f

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.
Files changed (203) hide show
  1. package/dist/Calendar/styles.d.ts +1 -1
  2. package/dist/ClickableCard/ClickableCard.d.ts +1 -1
  3. package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
  4. package/dist/ClickableCard/ClickableCard.js +5 -1
  5. package/dist/DateInput/PickerWheel.d.ts.map +1 -1
  6. package/dist/DateInput/PickerWheel.js +7 -1
  7. package/dist/DateRangeInput/DateRangeInput.js +1 -1
  8. package/dist/Dialog/Dialog.d.ts +2 -1
  9. package/dist/Dialog/Dialog.d.ts.map +1 -1
  10. package/dist/Dialog/Dialog.js +8 -1
  11. package/dist/Drawer/useDrawerDialogPresence.d.ts +2 -1
  12. package/dist/Drawer/useDrawerDialogPresence.d.ts.map +1 -1
  13. package/dist/Drawer/useDrawerDialogPresence.js +11 -2
  14. package/dist/DropdownMenu/DropdownMenu.d.ts +9 -1
  15. package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  16. package/dist/DropdownMenu/DropdownMenu.js +9 -4
  17. package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
  18. package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +3 -2
  19. package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
  20. package/dist/DropdownMenu/DropdownMenuItem.js +3 -2
  21. package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
  22. package/dist/DropdownMenu/DropdownMenuRadioItem.js +3 -2
  23. package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
  24. package/dist/DropdownMenu/DropdownMenuSubMenu.js +3 -2
  25. package/dist/Field/inputDisabledFocus.d.ts +4 -4
  26. package/dist/Field/inputStyles.stylex.d.ts +1 -1
  27. package/dist/FileInput/FileInput.d.ts.map +1 -1
  28. package/dist/FileInput/FileInput.js +16 -2
  29. package/dist/Icon/Icon.d.ts +1 -1
  30. package/dist/InfoTip/InfoTip.d.ts +1 -0
  31. package/dist/InfoTip/InfoTip.d.ts.map +1 -1
  32. package/dist/InfoTip/InfoTip.js +1 -0
  33. package/dist/Item/Item.d.ts +2 -1
  34. package/dist/Item/Item.d.ts.map +1 -1
  35. package/dist/Item/Item.js +29 -6
  36. package/dist/Layer/holdEntranceInput.d.ts +24 -0
  37. package/dist/Layer/holdEntranceInput.d.ts.map +1 -0
  38. package/dist/Layer/holdEntranceInput.js +65 -0
  39. package/dist/Layer/inputHold.d.ts +49 -0
  40. package/dist/Layer/inputHold.d.ts.map +1 -0
  41. package/dist/Layer/inputHold.js +636 -0
  42. package/dist/Layer/preserveAnimations.d.ts +1 -5
  43. package/dist/Layer/preserveAnimations.d.ts.map +1 -1
  44. package/dist/Layer/preserveAnimations.js +12 -214
  45. package/dist/MetadataList/MetadataList.js +1 -1
  46. package/dist/MobileNav/MobileNav.d.ts +11 -1
  47. package/dist/MobileNav/MobileNav.d.ts.map +1 -1
  48. package/dist/MobileNav/MobileNav.js +34 -1
  49. package/dist/MoreMenu/MoreMenu.d.ts +5 -3
  50. package/dist/MoreMenu/MoreMenu.d.ts.map +1 -1
  51. package/dist/RadioList/RadioListItem.d.ts.map +1 -1
  52. package/dist/RadioList/RadioListItem.js +4 -1
  53. package/dist/SelectableCard/SelectableCard.d.ts +1 -1
  54. package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
  55. package/dist/SelectableCard/SelectableCard.js +5 -1
  56. package/dist/Spinner/Spinner.d.ts.map +1 -1
  57. package/dist/Spinner/Spinner.js +12 -2
  58. package/dist/Table/plugins/sortable/useTableSortable.js +1 -1
  59. package/dist/Token/Token.d.ts.map +1 -1
  60. package/dist/Token/Token.js +9 -0
  61. package/dist/Token/TokenLink.d.ts +1 -1
  62. package/dist/Token/TokenLink.d.ts.map +1 -1
  63. package/dist/Token/TokenLink.js +4 -1
  64. package/dist/Tooltip/useTooltip.d.ts.map +1 -1
  65. package/dist/Tooltip/useTooltip.js +162 -59
  66. package/dist/TreeList/TreeListItem.d.ts +2 -1
  67. package/dist/TreeList/TreeListItem.d.ts.map +1 -1
  68. package/dist/TreeList/TreeListItem.js +27 -3
  69. package/dist/astryx.css +30 -7
  70. package/dist/gestures/GestureHost.d.ts +2 -2
  71. package/dist/gestures/GestureHost.d.ts.map +1 -1
  72. package/dist/gestures/GestureHost.js +21 -6
  73. package/dist/gestures/nativeScroll.d.ts +3 -6
  74. package/dist/gestures/nativeScroll.d.ts.map +1 -1
  75. package/dist/gestures/nativeScroll.js +7 -52
  76. package/dist/gestures/wheelSegmenter.d.ts +68 -1
  77. package/dist/gestures/wheelSegmenter.d.ts.map +1 -1
  78. package/dist/gestures/wheelSegmenter.js +199 -10
  79. package/dist/hooks/menuPressGesture.d.ts +133 -21
  80. package/dist/hooks/menuPressGesture.d.ts.map +1 -1
  81. package/dist/hooks/menuPressGesture.js +155 -30
  82. package/dist/hooks/menuPressValues.d.ts +16 -0
  83. package/dist/hooks/menuPressValues.d.ts.map +1 -0
  84. package/dist/hooks/menuPressValues.js +18 -0
  85. package/dist/hooks/useClickableContainer.d.ts +27 -5
  86. package/dist/hooks/useClickableContainer.d.ts.map +1 -1
  87. package/dist/hooks/useClickableContainer.js +41 -5
  88. package/dist/hooks/useMenuPress.d.ts +34 -1
  89. package/dist/hooks/useMenuPress.d.ts.map +1 -1
  90. package/dist/hooks/useMenuPress.js +93 -5
  91. package/dist/hooks/usePressFeedback.d.ts +6 -6
  92. package/dist/hooks/usePressFeedback.js +6 -6
  93. package/dist/motion/carryAnimations.d.ts +58 -0
  94. package/dist/motion/carryAnimations.d.ts.map +1 -0
  95. package/dist/motion/carryAnimations.js +305 -0
  96. package/dist/motion/transientCopy.d.ts +4 -2
  97. package/dist/motion/transientCopy.d.ts.map +1 -1
  98. package/dist/motion/transientCopy.js +34 -5
  99. package/dist/motion/uikit/gestures.d.ts +41 -0
  100. package/dist/motion/uikit/gestures.d.ts.map +1 -1
  101. package/dist/motion/uikit/gestures.js +25 -0
  102. package/dist/motion/uikit/index.d.ts +1 -1
  103. package/dist/motion/uikit/index.d.ts.map +1 -1
  104. package/dist/motion/uikit/index.js +1 -1
  105. package/dist/privateAttributes/menuPressLit.stylex.d.ts +52 -0
  106. package/dist/privateAttributes/menuPressLit.stylex.d.ts.map +1 -0
  107. package/dist/privateAttributes/menuPressLit.stylex.js +99 -0
  108. package/dist/privateAttributes/press.stylex.d.ts +139 -0
  109. package/dist/privateAttributes/press.stylex.d.ts.map +1 -0
  110. package/dist/privateAttributes/press.stylex.js +98 -0
  111. package/dist/theme/tokens.stylex.d.ts +2 -2
  112. package/dist/theme/tokens.stylex.js +1 -1
  113. package/dist/utils/flatTree.d.ts +6 -3
  114. package/dist/utils/flatTree.d.ts.map +1 -1
  115. package/dist/utils/flatTree.js +13 -3
  116. package/dist/utils/hitArea.d.ts.map +1 -1
  117. package/dist/utils/hitArea.js +82 -5
  118. package/dist/utils/inputStream.d.ts +14 -1
  119. package/dist/utils/inputStream.d.ts.map +1 -1
  120. package/dist/utils/inputStream.js +40 -9
  121. package/dist/utils/interactionOverlay.stylex.d.ts +2 -1
  122. package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
  123. package/dist/utils/interactionOverlay.stylex.js +7 -2
  124. package/dist/utils/pressFeedback.d.ts +7 -0
  125. package/dist/utils/pressFeedback.d.ts.map +1 -1
  126. package/dist/utils/pressFeedback.js +32 -7
  127. package/dist/utils/pressGesture.d.ts +6 -0
  128. package/dist/utils/pressGesture.d.ts.map +1 -1
  129. package/dist/utils/pressGesture.js +17 -0
  130. package/dist/utils/rowPressLayer.stylex.d.ts +14 -0
  131. package/dist/utils/rowPressLayer.stylex.d.ts.map +1 -0
  132. package/dist/utils/rowPressLayer.stylex.js +25 -0
  133. package/dist/utils/scrollView.d.ts +25 -0
  134. package/dist/utils/scrollView.d.ts.map +1 -0
  135. package/dist/utils/scrollView.js +108 -0
  136. package/dist/utils/selectionLock.d.ts.map +1 -1
  137. package/dist/utils/selectionLock.js +1 -10
  138. package/dist/utils/triggerFocus.d.ts +5 -0
  139. package/dist/utils/triggerFocus.d.ts.map +1 -1
  140. package/dist/utils/triggerFocus.js +9 -2
  141. package/package.json +5 -5
  142. package/src/ClickableCard/ClickableCard.tsx +8 -1
  143. package/src/DateInput/PickerWheel.tsx +7 -2
  144. package/src/DateRangeInput/DateRangeInput.tsx +1 -1
  145. package/src/Dialog/Dialog.doc.mjs +1 -1
  146. package/src/Dialog/Dialog.tsx +8 -1
  147. package/src/Drawer/Drawer.doc.mjs +1 -1
  148. package/src/Drawer/useDrawerDialogPresence.ts +9 -2
  149. package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -2
  150. package/src/DropdownMenu/DropdownMenu.tsx +29 -5
  151. package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +5 -1
  152. package/src/DropdownMenu/DropdownMenuItem.tsx +8 -4
  153. package/src/DropdownMenu/DropdownMenuRadioItem.tsx +5 -1
  154. package/src/DropdownMenu/DropdownMenuSubMenu.tsx +5 -1
  155. package/src/FileInput/FileInput.tsx +16 -2
  156. package/src/InfoTip/InfoTip.doc.mjs +26 -2
  157. package/src/InfoTip/InfoTip.tsx +1 -0
  158. package/src/Item/Item.tsx +51 -9
  159. package/src/Layer/holdEntranceInput.ts +84 -0
  160. package/src/Layer/inputHold.ts +734 -0
  161. package/src/Layer/preserveAnimations.ts +12 -275
  162. package/src/MetadataList/MetadataList.tsx +1 -1
  163. package/src/MobileNav/MobileNav.doc.mjs +3 -3
  164. package/src/MobileNav/MobileNav.tsx +34 -1
  165. package/src/MoreMenu/MoreMenu.doc.mjs +2 -4
  166. package/src/MoreMenu/MoreMenu.tsx +5 -3
  167. package/src/RadioList/RadioListItem.tsx +4 -5
  168. package/src/SelectableCard/SelectableCard.tsx +8 -1
  169. package/src/Spinner/Spinner.tsx +13 -3
  170. package/src/Table/plugins/sortable/useTableSortable.tsx +1 -1
  171. package/src/Token/Token.tsx +18 -1
  172. package/src/Token/TokenLink.tsx +7 -1
  173. package/src/Tooltip/useTooltip.tsx +175 -79
  174. package/src/TreeList/TreeListItem.tsx +36 -2
  175. package/src/gestures/GestureHost.ts +21 -5
  176. package/src/gestures/README.md +12 -4
  177. package/src/gestures/nativeScroll.ts +12 -68
  178. package/src/gestures/wheelSegmenter.ts +243 -10
  179. package/src/hooks/menuPressGesture.ts +244 -38
  180. package/src/hooks/menuPressValues.ts +18 -0
  181. package/src/hooks/useClickableContainer.doc.mjs +8 -2
  182. package/src/hooks/useClickableContainer.ts +72 -6
  183. package/src/hooks/useMenuPress.ts +118 -11
  184. package/src/hooks/usePressFeedback.doc.mjs +3 -3
  185. package/src/hooks/usePressFeedback.ts +6 -6
  186. package/src/motion/MEASUREMENTS.md +11 -0
  187. package/src/motion/carryAnimations.ts +389 -0
  188. package/src/motion/transientCopy.ts +45 -5
  189. package/src/motion/uikit/gestures.ts +22 -0
  190. package/src/motion/uikit/index.ts +1 -0
  191. package/src/privateAttributes/menuPressLit.stylex.ts +104 -0
  192. package/src/privateAttributes/press.stylex.ts +244 -0
  193. package/src/theme/tokens.stylex.ts +1 -1
  194. package/src/utils/flatTree.ts +15 -3
  195. package/src/utils/hitArea.ts +107 -5
  196. package/src/utils/inputStream.ts +47 -10
  197. package/src/utils/interactionOverlay.stylex.ts +7 -2
  198. package/src/utils/pressFeedback.ts +31 -6
  199. package/src/utils/pressGesture.ts +24 -1
  200. package/src/utils/rowPressLayer.stylex.ts +27 -0
  201. package/src/utils/scrollView.ts +135 -0
  202. package/src/utils/selectionLock.ts +5 -10
  203. package/src/utils/triggerFocus.ts +17 -4
@@ -11,189 +11,23 @@
11
11
  *
12
12
  * Taking an element out of rendering cancels every CSS animation and
13
13
  * transition of it and its subtree. When it returns, the browser creates the
14
- * animations again from the stylesheet, at their start, and the transitions
15
- * not at all; script-created animations are untouched. `preserveAnimations`
16
- * reads every animation's state first and, afterwards, gives each recreated
17
- * CSS animation that state and resumes each cancelled transition with a
18
- * script animation at the same point.
19
- *
20
- * The state is read generically, from what the platform exposes: every
21
- * accessor with a setter on the animation's and its effect's prototype
22
- * chains, every field of the effect's timing, and its keyframes. Only values
23
- * that differ from the recreated animation's are written, so a value the
24
- * stylesheet controls stays under its control. A few members are not plain
25
- * state and are handled in their own step (`ORDERED`); the rest need no
26
- * handling (`DERIVED`). What cannot be carried over is the Animation and
27
- * effect objects themselves: the old ones are idle, their `addEventListener`
28
- * listeners and `finished`/`ready` promises stay with them, and the browser
29
- * fires `animationcancel`/`transitioncancel` for them and `animationstart`
14
+ * animations again from the stylesheet, at their start. It starts no
15
+ * transition but one from `@starting-style`, and script-created animations
16
+ * are untouched. `preserveAnimations` reads every animation's state first.
17
+ * Afterwards it gives each recreated CSS animation that state, and resumes
18
+ * each cancelled transition with a script animation at the same point. Any
19
+ * other animation the return started is finished, unless it never ends
20
+ * (motion/carryAnimations.ts). The browser fires
21
+ * `animationcancel`/`transitioncancel` for the old ones and `animationstart`
30
22
  * for the new ones.
31
23
  */
32
24
 
33
- /**
34
- * Animation members written in a fixed order rather than generically: the
35
- * timeline before the range that is measured on it, the rate before the
36
- * time, and the start time (or, for a paused animation, the current time)
37
- * last, once the play state is set. `effect` is not
38
- * replaced, because a CSS animation whose effect script replaces leaves the
39
- * stylesheet's control; its state is copied onto the new effect instead.
40
- */
41
- const ORDERED = new Set(['effect', 'timeline', 'rangeStart', 'rangeEnd', 'playbackRate', 'startTime', 'currentTime']);
42
- /** Every accessor with a setter on `object`'s prototype chain. */
43
- function writableAccessors(object) {
44
- const names = new Set();
45
- for (let proto = Object.getPrototypeOf(object); proto != null && proto !== Object.prototype; proto = Object.getPrototypeOf(proto)) {
46
- for (const [name, descriptor] of Object.entries(Object.getOwnPropertyDescriptors(proto))) {
47
- if (descriptor.set != null) {
48
- names.add(name);
49
- }
50
- }
51
- }
52
- return [...names];
53
- }
54
-
55
- /**
56
- * A textual form of a value that is compared by content rather than by
57
- * identity: a CSS numeric value (as in a timeline range offset) through its
58
- * serialization, a plain object (a range) through its members. Anything else
59
- * is compared by identity (`null`).
60
- */
61
- function contentOf(value) {
62
- if (typeof CSSNumericValue !== 'undefined' && value instanceof CSSNumericValue) {
63
- return value.toString();
64
- }
65
- if (value != null && typeof value === 'object' && Object.getPrototypeOf(value) === Object.prototype) {
66
- return Object.entries(value).map(([key, inner]) => `${key}:${contentOf(inner) ?? String(inner)}`).join(';');
67
- }
68
- return null;
69
- }
70
- function differs(a, b) {
71
- if (a === b) {
72
- return false;
73
- }
74
- const textA = contentOf(a);
75
- return textA == null || textA !== contentOf(b);
76
- }
77
- function save(animation) {
78
- const effect = animation.effect;
79
- const values = {};
80
- for (const name of writableAccessors(animation)) {
81
- values[name] = animation[name];
82
- }
83
- const effectValues = {};
84
- if (effect != null) {
85
- for (const name of writableAccessors(effect)) {
86
- effectValues[name] = effect[name];
87
- }
88
- }
89
- return {
90
- animation,
91
- name: animation.animationName ?? '',
92
- target: effect?.target ?? null,
93
- pseudoElement: effect?.pseudoElement ?? null,
94
- values,
95
- effectValues,
96
- timing: effect?.getTiming() ?? null,
97
- keyframes: effect?.getKeyframes() ?? null,
98
- playState: animation.playState,
99
- replaceState: animation.replaceState
100
- };
101
- }
102
- function write(object, name, value) {
103
- object[name] = value;
104
- }
105
-
106
- /** Give `next` the effect state `saved` had: every writable member. */
107
- function restoreEffect(next, saved) {
108
- for (const name of writableAccessors(next)) {
109
- if (name in saved.effectValues && differs(saved.effectValues[name], next[name])) {
110
- write(next, name, saved.effectValues[name]);
111
- }
112
- }
113
- if (saved.timing != null) {
114
- const timing = next.getTiming();
115
- const changed = {};
116
- for (const [field, value] of Object.entries(saved.timing)) {
117
- if (differs(value, timing[field])) {
118
- changed[field] = value;
119
- }
120
- }
121
- if (Object.keys(changed).length > 0) {
122
- next.updateTiming(changed);
123
- }
124
- }
125
- if (saved.keyframes != null && JSON.stringify(saved.keyframes) !== JSON.stringify(next.getKeyframes())) {
126
- next.setKeyframes(saved.keyframes);
127
- }
128
- }
129
-
130
- /** Give `next` the state `saved` had, member by member. */
131
- function restore(next, saved) {
132
- const effect = next.effect;
133
- if (effect != null) {
134
- restoreEffect(effect, saved);
135
- }
136
- const current = next;
137
- for (const name of ['timeline', 'rangeStart', 'rangeEnd']) {
138
- if (name in saved.values && differs(saved.values[name], current[name])) {
139
- write(next, name, saved.values[name]);
140
- }
141
- }
142
- for (const name of writableAccessors(next)) {
143
- if (!ORDERED.has(name) && name in saved.values && differs(saved.values[name], current[name])) {
144
- write(next, name, saved.values[name]);
145
- }
146
- }
147
- if (saved.replaceState === 'persisted' && next.replaceState !== 'persisted') {
148
- next.persist();
149
- }
150
- const rate = saved.values.playbackRate;
151
- if (typeof rate === 'number' && rate !== next.playbackRate) {
152
- next.playbackRate = rate;
153
- }
154
- if (saved.playState === 'paused' && next.playState !== 'paused') {
155
- next.pause();
156
- } else if (saved.playState !== 'paused' && next.playState === 'paused') {
157
- next.play();
158
- }
159
- // A running animation is anchored to its timeline by its start time, which
160
- // carries its current time on exactly. A paused one has none and keeps its
161
- // current time. A finished one holds its end: finishing it again holds the
162
- // same time, though its start time is then counted from now, since script
163
- // cannot set a start time and a held time together.
164
- const start = saved.values.startTime;
165
- const time = saved.values.currentTime;
166
- if (saved.playState === 'finished') {
167
- next.finish();
168
- } else if (start != null) {
169
- next.startTime = start;
170
- } else if (time != null) {
171
- next.currentTime = time;
172
- }
173
- }
174
-
175
- /** Resume a cancelled CSS transition with a script animation in its state. */
176
- function resumeTransition(saved) {
177
- if (saved.target == null || saved.keyframes == null) {
178
- return;
179
- }
180
- const replacement = saved.target.animate(saved.keyframes, {
181
- pseudoElement: saved.pseudoElement ?? undefined
182
- });
183
- restore(replacement, saved);
184
- }
185
- function isTransition(animation) {
186
- return typeof CSSTransition !== 'undefined' && animation instanceof CSSTransition;
187
- }
25
+ import { restoreAnimations, saveAnimation } from "../motion/carryAnimations.js";
188
26
 
189
27
  /**
190
28
  * Run `reset`, which takes `root` out of rendering and back, and put every
191
29
  * CSS animation and transition of `root` and its subtree back in the state it
192
- * was in before. Recreated animations are matched to the ones they replace by
193
- * element, pseudo-element and name, in order, and then by name alone (an
194
- * effect script moved to another element or pseudo-element); a recreated
195
- * animation with no predecessor (an entry animation that had already played
196
- * and been dropped) is finished.
30
+ * was in before.
197
31
  */
198
32
  export function preserveAnimations(root, reset) {
199
33
  if (typeof root.getAnimations !== 'function') {
@@ -203,43 +37,7 @@ export function preserveAnimations(root, reset) {
203
37
  const before = root.getAnimations({
204
38
  subtree: true
205
39
  });
206
- const saved = before.map(save);
40
+ const saved = before.map(saveAnimation);
207
41
  reset();
208
- const after = root.getAnimations({
209
- subtree: true
210
- });
211
- const current = new Set(after);
212
- const survivors = new Set(before);
213
- const cancelled = [];
214
- for (const state of saved) {
215
- if (current.has(state.animation)) {
216
- continue;
217
- }
218
- if (isTransition(state.animation)) {
219
- resumeTransition(state);
220
- } else {
221
- cancelled.push(state);
222
- }
223
- }
224
- const recreated = after.filter(animation => !survivors.has(animation));
225
- const unmatched = [];
226
- for (const animation of recreated) {
227
- const effect = animation.effect;
228
- const name = animation.animationName ?? '';
229
- const index = cancelled.findIndex(state => state.name === name && state.target === (effect?.target ?? null) && state.pseudoElement === (effect?.pseudoElement ?? null));
230
- if (index === -1) {
231
- unmatched.push(animation);
232
- } else {
233
- restore(animation, cancelled.splice(index, 1)[0]);
234
- }
235
- }
236
- for (const animation of unmatched) {
237
- const name = animation.animationName ?? '';
238
- const index = cancelled.findIndex(state => state.name === name);
239
- if (index === -1) {
240
- animation.finish();
241
- } else {
242
- restore(animation, cancelled.splice(index, 1)[0]);
243
- }
244
- }
42
+ restoreAnimations(root, saved, new Set(before));
245
43
  }
@@ -216,7 +216,7 @@ export function MetadataList({
216
216
  "aria-expanded": isShowAll,
217
217
  onClick: () => setIsShowAll(prev => !prev),
218
218
  ...{
219
- className: "xjyslct xjbqb8w xc342km xng3xce x15nmkw0 x1ypdohk x16khyan xqwr325 xjm74w1 xw6l6zx x1e4wzip xjb2p0i x1yc453h xqcrz7y"
219
+ className: "xjyslct xjbqb8w xc342km xng3xce x15nmkw0 x1ypdohk x16khyan xjse4m1 xjm74w1 xw6l6zx x1e4wzip xjb2p0i x1yc453h xqcrz7y"
220
220
  },
221
221
  children: isShowAll ? t('@astryx.metadataList.showLess') : t('@astryx.metadataList.showMore')
222
222
  })]
@@ -1,6 +1,7 @@
1
1
  /**
2
2
  * @file MobileNav.tsx
3
- * @input Uses React, useEffect, useRef, useCallback, ReactNode, StyleX
3
+ * @input Uses React, useEffect, useRef, useCallback, ReactNode, StyleX and
4
+ * the Layer module's entrance hold
4
5
  * @output Exports MobileNav component and MobileNavProps
5
6
  * @position Core implementation; consumed by index.ts
6
7
  *
@@ -34,6 +35,7 @@
34
35
  * - /packages/core/src/MobileNav/index.ts (exports if types change)
35
36
  * - /packages/core/src/Layer/useLayerDismissal.ts (dismissal stack)
36
37
  * - /packages/core/src/hooks/useScrollLock.ts (the page's scroll lock)
38
+ * - /packages/core/src/MobileNav/MobileNavTouchPresentation.test.tsx (touch)
37
39
  * - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
38
40
  */
39
41
  import { type ReactNode } from 'react';
@@ -47,6 +49,14 @@ import type { BaseProps } from '../BaseProps.js';
47
49
  * own scheduled `dialog.close()` has a chance to run (#5701).
48
50
  */
49
51
  export declare const MAX_CLOSE_DELAY_MS = 250;
52
+ /**
53
+ * Longest the drawer slides in or out for, in ms. Both run for the theme's
54
+ * `--duration-medium`: 410 ms by default, and at most 545 ms on the default
55
+ * scale (`--duration-medium-max`). The slide-out keeps playing after the
56
+ * dialog closes, while the dialog's `display` transition keeps it rendered.
57
+ * The touch hold on the slide-in ends by this time.
58
+ */
59
+ export declare const MAX_EXIT_MS = 550;
50
60
  /**
51
61
  * Shortest duration in a `transition-duration` list, in ms; null if unreadable.
52
62
  *
@@ -1 +1 @@
1
- {"version":3,"file":"MobileNav.d.ts","sourceRoot":"","sources":["../../src/MobileNav/MobileNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAOL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAsBf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyM5C;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAItC;;;;;;;;;;GAUG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAkBpE;AA+DD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,MAAM,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,SAAS,CAAC,EACxB,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,gBAAgB,EAC9B,QAAQ,EACR,MAAM,EACN,KAAW,EACX,IAAa,EACb,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,+BAsQhB;yBArRe,SAAS"}
1
+ {"version":3,"file":"MobileNav.d.ts","sourceRoot":"","sources":["../../src/MobileNav/MobileNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AAEH,OAAO,EAOL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAuBf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyM5C;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC;;;;;;GAMG;AACH,eAAO,MAAM,WAAW,MAAM,CAAC;AAI/B;;;;;;;;;;GAUG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAkBpE;AA+DD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,MAAM,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,SAAS,CAAC,EACxB,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,gBAAgB,EAC9B,QAAQ,EACR,MAAM,EACN,KAAW,EACX,IAAa,EACb,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,+BA4RhB;yBA3Se,SAAS"}
@@ -4,7 +4,8 @@
4
4
 
5
5
  /**
6
6
  * @file MobileNav.tsx
7
- * @input Uses React, useEffect, useRef, useCallback, ReactNode, StyleX
7
+ * @input Uses React, useEffect, useRef, useCallback, ReactNode, StyleX and
8
+ * the Layer module's entrance hold
8
9
  * @output Exports MobileNav component and MobileNavProps
9
10
  * @position Core implementation; consumed by index.ts
10
11
  *
@@ -38,6 +39,7 @@
38
39
  * - /packages/core/src/MobileNav/index.ts (exports if types change)
39
40
  * - /packages/core/src/Layer/useLayerDismissal.ts (dismissal stack)
40
41
  * - /packages/core/src/hooks/useScrollLock.ts (the page's scroll lock)
42
+ * - /packages/core/src/MobileNav/MobileNavTouchPresentation.test.tsx (touch)
41
43
  * - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
42
44
  */
43
45
  import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
@@ -48,6 +50,7 @@ import { Button } from "../Button/index.js";
48
50
  import { Icon } from "../Icon/index.js";
49
51
  import { Heading } from "../Heading/Heading.js";
50
52
  import { useAppShellMobile } from "../AppShell/AppShellMobileContext.js";
53
+ import { holdEntranceInput } from "../Layer/holdEntranceInput.js";
51
54
  import { mergeProps, composeEventHandlers } from "../utils/index.js";
52
55
  import { layerTextReset } from "../Layer/layerTextReset.stylex.js";
53
56
  import { layerStructureReset } from "../Layer/layerStructureReset.stylex.js";
@@ -177,6 +180,14 @@ const dynamicStyles = {
177
180
  * own scheduled `dialog.close()` has a chance to run (#5701).
178
181
  */
179
182
  export const MAX_CLOSE_DELAY_MS = 250;
183
+ /**
184
+ * Longest the drawer slides in or out for, in ms. Both run for the theme's
185
+ * `--duration-medium`: 410 ms by default, and at most 545 ms on the default
186
+ * scale (`--duration-medium-max`). The slide-out keeps playing after the
187
+ * dialog closes, while the dialog's `display` transition keeps it rendered.
188
+ * The touch hold on the slide-in ends by this time.
189
+ */
190
+ export const MAX_EXIT_MS = 550;
180
191
  /** Fraction of the hold to close at, so the close never lands on its boundary. */
181
192
  const CLOSE_WITHIN_HOLD = 0.6;
182
193
 
@@ -317,7 +328,11 @@ export function MobileNav({
317
328
  }
318
329
  }), [onOpenChangeProp, appShellMobile]);
319
330
  const dialogRef = useRef(null);
331
+ const drawerRef = useRef(null);
320
332
  const closeTimeoutRef = useRef(null);
333
+ // The input hold on the drawer's layer while it slides in under a coarse
334
+ // primary pointer. It is null under a fine one and once the slide-in ends.
335
+ const releaseHoldRef = useRef(null);
321
336
  // Element that was focused when the drawer opened; focus goes back to it
322
337
  // once the native dialog has closed (see closeAndRestoreFocus).
323
338
  const triggerElementRef = useRef(null);
@@ -376,6 +391,8 @@ export function MobileNav({
376
391
  return;
377
392
  }
378
393
  if (isOpen) {
394
+ releaseHoldRef.current?.();
395
+ releaseHoldRef.current = null;
379
396
  if (!dialog.open) {
380
397
  // Capture the opener before showModal() pulls focus into the top
381
398
  // layer. Only on the transition into open: a reopen while the delayed
@@ -384,7 +401,16 @@ export function MobileNav({
384
401
  triggerElementRef.current = document.activeElement;
385
402
  dialog.showModal();
386
403
  }
404
+ // Under a coarse primary pointer, nothing takes a touch until the
405
+ // slide-in ends, at most MAX_EXIT_MS in. A close holds nothing, because
406
+ // only an entrance is held. Under a fine one, nothing is held.
407
+ releaseHoldRef.current = holdEntranceInput(dialog, {
408
+ entrance: drawerRef.current,
409
+ capMs: MAX_EXIT_MS
410
+ });
387
411
  } else if (dialog.open) {
412
+ releaseHoldRef.current?.();
413
+ releaseHoldRef.current = null;
388
414
  closeTimeoutRef.current = setTimeout(() => {
389
415
  closeAndRestoreFocus(dialog, triggerElementRef);
390
416
  setIsCloseHeld(false);
@@ -399,6 +425,10 @@ export function MobileNav({
399
425
  clearTimeout(closeTimeoutRef.current);
400
426
  closeTimeoutRef.current = null;
401
427
  }
428
+ // The hold this run took ends with it: a reopen, a close or an
429
+ // unmount mid-slide never leaves input blocked.
430
+ releaseHoldRef.current?.();
431
+ releaseHoldRef.current = null;
402
432
  };
403
433
  }, [isOpen]);
404
434
 
@@ -418,6 +448,8 @@ export function MobileNav({
418
448
  useEffect(() => {
419
449
  const dialog = dialogRef.current;
420
450
  return () => {
451
+ releaseHoldRef.current?.();
452
+ releaseHoldRef.current = null;
421
453
  if (dialog?.open) {
422
454
  closeAndRestoreFocus(dialog, triggerElementRef);
423
455
  }
@@ -486,6 +518,7 @@ export function MobileNav({
486
518
  children: /*#__PURE__*/_jsx(LayerDepthProvider, {
487
519
  children: /*#__PURE__*/_jsx(LayerContentBoundary, {
488
520
  children: /*#__PURE__*/_jsxs("div", {
521
+ ref: drawerRef,
489
522
  tabIndex: -1,
490
523
  ...stylex.props(styles.drawer, dynamicStyles.width(width), isStart && styles.drawerStart, isStart && isOpen && styles.drawerStartOpen, !isStart && styles.drawerEnd, !isStart && isOpen && styles.drawerEndOpen),
491
524
  children: [/*#__PURE__*/_jsxs("div", {
@@ -65,9 +65,11 @@ export interface MoreMenuProps extends Pick<BaseProps, 'xstyle' | 'className' |
65
65
  */
66
66
  alignment?: LayerAlignment;
67
67
  /**
68
- * Menu presentation policy. `adaptive` uses a BottomSheet on compact
69
- * coarse-pointer viewports and an anchored popover elsewhere.
70
- * @default 'popover'
68
+ * Menu presentation policy, forwarded to DropdownMenu. `adaptive` uses a
69
+ * BottomSheet on compact coarse-pointer viewports and an anchored popover
70
+ * elsewhere. Omitted, the menu is the anchored popover, and the finger that
71
+ * opened it follows UIMenu's handoff on every device. `'popover'` pins the
72
+ * pointer behavior on every device.
71
73
  */
72
74
  presentation?: DropdownMenuPresentation;
73
75
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"MoreMenu.d.ts","sourceRoot":"","sources":["../../src/MoreMenu/MoreMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIrC,OAAO,KAAK,EACV,kBAAkB,EAClB,wBAAwB,EACzB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,UAAU,CAAC;AAC7D,OAAO,KAAK,EAAC,aAAa,EAAE,UAAU,EAAC,MAAM,WAAW,CAAC;AACzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,0CAA0C;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC;;;OAGG;IACH,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAE5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;;OAIG;IACH,YAAY,CAAC,EAAE,wBAAwB,CAAC;IAExC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,KAAK,EAAE,cAAc,EACrB,OAAiB,EACjB,IAAI,EAAE,QAAQ,EACd,IAAI,EACJ,UAAkB,EAClB,SAAS,EACT,SAAS,EACT,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,MAAM,EACN,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,GACJ,EAAE,aAAa,+BAmCf;yBApDe,QAAQ"}
1
+ {"version":3,"file":"MoreMenu.d.ts","sourceRoot":"","sources":["../../src/MoreMenu/MoreMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIrC,OAAO,KAAK,EACV,kBAAkB,EAClB,wBAAwB,EACzB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAC,cAAc,EAAE,cAAc,EAAC,MAAM,UAAU,CAAC;AAC7D,OAAO,KAAK,EAAC,aAAa,EAAE,UAAU,EAAC,MAAM,WAAW,CAAC;AACzD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAU5C,MAAM,WAAW,aAAc,SAAQ,IAAI,CACzC,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,0CAA0C;IAC1C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IAEnC;;;OAGG;IACH,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAE5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IAExB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;OAIG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;;OAIG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,wBAAwB,CAAC;IAExC;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,KAAK,EAAE,cAAc,EACrB,OAAiB,EACjB,IAAI,EAAE,QAAQ,EACd,IAAI,EACJ,UAAkB,EAClB,SAAS,EACT,SAAS,EACT,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,MAAM,EACN,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,GACJ,EAAE,aAAa,+BAmCf;yBApDe,QAAQ"}
@@ -1 +1 @@
1
- {"version":3,"file":"RadioListItem.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAY5C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,cAAc,CAAC;AA0IlD,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;OAUG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EACH,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EAAE,cAAsB,EAClC,YAAY,EACZ,UAAU,EACV,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,IAAI,EACR,EAAE,kBAAkB,qBAoLpB;yBAnMe,aAAa"}
1
+ {"version":3,"file":"RadioListItem.d.ts","sourceRoot":"","sources":["../../src/RadioList/RadioListItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAqB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAGhE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAY5C,OAAO,EAAO,KAAK,SAAS,EAAC,MAAM,cAAc,CAAC;AAsIlD,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;OAKG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;;;;;;OAUG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;;;;;;;;;;;;;OAcG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,aAAa,CAAC,EAC5B,GAAG,EACH,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,KAAK,EACL,WAAW,EACX,UAAU,EAAE,cAAsB,EAClC,YAAY,EACZ,UAAU,EACV,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EACP,GAAG,IAAI,EACR,EAAE,kBAAkB,qBAuLpB;yBAtMe,aAAa"}
@@ -34,6 +34,7 @@ import { usePressFeedback } from "../hooks/usePressFeedback.js";
34
34
  import { useIndicator } from "../Indicator/useIndicator.js";
35
35
  import { Item } from "../Item/Item.js";
36
36
  import { themeProps } from "../utils/themeProps.js";
37
+ import { rowPressLayerStyles } from "../privateAttributes/press.stylex.js";
37
38
 
38
39
  // The touch press's paint, declared by the shared overlay styles on the
39
40
  // element the controller writes to (`pressedAlpha`) at the press's strength,
@@ -104,7 +105,6 @@ const rowStyles = {
104
105
  kaIpWk: "x2u8bby",
105
106
  k7Eaqz: "xeuugli",
106
107
  kWkggS: "xjbqb8w",
107
- kKwaWg: "x18o3ruo",
108
108
  $$css: true
109
109
  },
110
110
  press: {
@@ -276,6 +276,9 @@ export function RadioListItem({
276
276
  // the painting row element (Item), the same element that carries the
277
277
  // theme target, so a theme's hover styling stays in step with the tint.
278
278
  !isDisabled && indicatorScope,
279
+ // The row keeps no press paint of its own: the circle paints, and
280
+ // reads the strength whose release the row keeps.
281
+ rowPressLayerStyles.cellWithoutLayer,
279
282
  // Restore the bare default look: zero Item's padding/radius and its
280
283
  // interactive hover/press background. Applied after Item's own base
281
284
  // styles so it wins within the base layer; a `radio-list-item` theme
@@ -104,7 +104,7 @@ export interface SelectableCardProps extends Omit<BaseProps, 'onChange'> {
104
104
  * </SelectableCard>
105
105
  * ```
106
106
  */
107
- export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
107
+ export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, onPointerDown: onPointerDownProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
108
108
  export declare namespace SelectableCard {
109
109
  var displayName: string;
110
110
  }
@@ -1 +1 @@
1
- {"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAGtE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuN5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BA6JrB;yBAhLe,cAAc"}
1
+ {"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAItE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuN5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,EAChC,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BAkKrB;yBAtLe,cAAc"}
@@ -34,6 +34,7 @@ import * as stylex from '@stylexjs/stylex';
34
34
  import "../theme/tokens.stylex.js";
35
35
  import { colorVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
36
36
  import { isImeKeyEvent, mergeProps } from "../utils/index.js";
37
+ import { chainEventHandlers } from "../utils/chainEventHandlers.js";
37
38
  import { Card } from "../Card/Card.js";
38
39
  import { useClickableContainer } from "../hooks/useClickableContainer.js";
39
40
  import { closestLayerRoot } from "../privateAttributes/layerRoot.stylex.js";
@@ -257,6 +258,7 @@ export function SelectableCard({
257
258
  onChange,
258
259
  onClick: onClickProp,
259
260
  onMouseUp: onMouseUpProp,
261
+ onPointerDown: onPointerDownProp,
260
262
  isDisabled = false,
261
263
  children,
262
264
  padding,
@@ -311,7 +313,8 @@ export function SelectableCard({
311
313
  }, [isDisabled, requestChange]);
312
314
  const {
313
315
  onClick,
314
- onMouseUp
316
+ onMouseUp,
317
+ onPointerDown
315
318
  } = useClickableContainer({
316
319
  containerRef,
317
320
  interactiveRef,
@@ -361,6 +364,7 @@ export function SelectableCard({
361
364
  !isDisabled && interactionOverlayStyles.pressedAlpha, isDisabled && styles.disabled, xstyleProp],
362
365
  onClick: !isDisabled ? composedOnClick : undefined,
363
366
  onMouseUp: !isDisabled ? composedOnMouseUp : undefined,
367
+ onPointerDown: !isDisabled ? chainEventHandlers(onPointerDown, onPointerDownProp) : onPointerDownProp,
364
368
  ...props,
365
369
  onClickCapture: !isDisabled && handleLayerClickCapture ? e => {
366
370
  handleLayerClickCapture(e);
@@ -1 +1 @@
1
- {"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6B5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AA8XF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAqId;yBAhJe,OAAO"}
1
+ {"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6B5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AAwYF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAqId;yBAhJe,OAAO"}
@@ -211,12 +211,22 @@ function syncRotationPhase(rotor) {
211
211
  // Animation
212
212
  // =============================================================================
213
213
 
214
+ /**
215
+ * Full turns in one iteration of the rotation.
216
+ *
217
+ * Chromium wakes the main thread at each iteration boundary while the
218
+ * document listens for `animationiteration`. React listens for it on every
219
+ * root. One iteration holds 100 turns, so the wake comes once in 100 turns.
220
+ * Each turn is 360 degrees, so the ring looks the same.
221
+ */
222
+ const TURNS_PER_ITERATION = 100;
223
+
214
224
  /**
215
225
  * A `transform` animation runs on the compositor, so the ring keeps turning
216
226
  * while a script runs. A `stroke-dashoffset` animation would repaint the arc
217
227
  * on the main thread every frame, so it would stop while a script runs.
218
228
  */
219
- const rotation = "xqng64z-B";
229
+ const rotation = "x11cqc53-B";
220
230
 
221
231
  // =============================================================================
222
232
  // Styles
@@ -448,7 +458,7 @@ export function Spinner({
448
458
  ref: syncRotationPhase,
449
459
  "aria-hidden": "true",
450
460
  ...{
451
- className: "x1lliihq x15r89dc x6v0vjy x7yyq19 x1so62im x1qcljrn xnh0sag xa4qsjk x1ka1v4i x1esw782"
461
+ className: "x1lliihq x15r89dc x6v0vjy x7yyq19 x1so62im xidn0ey x14hxw50 xa4qsjk x129v4ae x1esw782"
452
462
  },
453
463
  children: /*#__PURE__*/_jsx("svg", {
454
464
  width: frameSize,
@@ -223,7 +223,7 @@ function SortHeaderButton({
223
223
  })
224
224
  }), rank != null && /*#__PURE__*/_jsx("span", {
225
225
  ...{
226
- className: "x1k6wstc xo5v014 xqwr325"
226
+ className: "x1k6wstc xo5v014 xjse4m1"
227
227
  },
228
228
  "aria-hidden": "true",
229
229
  children: rank
@@ -1 +1 @@
1
- {"version":3,"file":"Token.d.ts","sourceRoot":"","sources":["../../src/Token/Token.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAiB1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAK5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAe3C;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,aAAa,CAAC;AAE7C,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,WAAW,CAAC;IACxD,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA6JD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAW,EACX,KAAiB,EACjB,IAAI,EACJ,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,UAAU,EACV,aAAqB,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BA8QZ;yBApSe,KAAK"}
1
+ {"version":3,"file":"Token.d.ts","sourceRoot":"","sources":["../../src/Token/Token.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAM,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAiB1C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAM5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAe3C;;;GAGG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,aAAa,CAAC;AAE7C,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,WAAW,CAAC;IACxD,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA6JD;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,IAAW,EACX,KAAiB,EACjB,IAAI,EACJ,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,WAAW,EACX,UAAU,EACV,aAAqB,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,iBAAiB,EAAE,cAAc,EACjC,kBAAkB,EAAE,eAAe,EACnC,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,GAAG,EACH,GAAG,IAAI,EACR,EAAE,UAAU,+BA8RZ;yBApTe,KAAK"}
@@ -29,6 +29,7 @@ import { themeProps } from "../utils/themeProps.js";
29
29
  import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
30
30
  import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
31
31
  import { usePressFeedback } from "../hooks/usePressFeedback.js";
32
+ import { cancelNestedTouchPress } from "../hooks/useClickableContainer.js";
32
33
  import { disabledInteractionProps } from "../utils/disabledInteraction.js";
33
34
  import { TokenNamingContext } from "./TokenNamingContext.js";
34
35
  import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
@@ -391,6 +392,13 @@ export function Token({
391
392
  }
392
393
  effectiveOnClick(e);
393
394
  };
395
+ // A finger press on Remove or a control in end content does not run the
396
+ // token's action, so the token shows no press for it. The inner button,
397
+ // the first button child, is the token's own action.
398
+ const handleContainerPointerDown = e => {
399
+ rest.onPointerDown?.(e);
400
+ cancelNestedTouchPress(e, e.currentTarget, e.currentTarget.querySelector(':scope > button'));
401
+ };
394
402
  return /*#__PURE__*/_jsxs("span", {
395
403
  ref: ref,
396
404
  onClick: isDisabled ? undefined : handleContainerClick,
@@ -402,6 +410,7 @@ export function Token({
402
410
  }), focusOutlineProps.focusWithin(styles.base, sizeStyles[size], colorStyles[color], styles.interactive, interactionOverlayStyles.backgroundImage, isDisabled && styles.disabled, xstyle), className, style),
403
411
  ...rest,
404
412
  ...sharedProps,
413
+ onPointerDown: isDisabled ? rest.onPointerDown : handleContainerPointerDown,
405
414
  children: [icon, /*#__PURE__*/_jsx("button", {
406
415
  type: "button",
407
416
  onClick: effectiveOnClick,
@@ -62,7 +62,7 @@ export interface TokenLinkProps extends HTMLAttributes<HTMLElement> {
62
62
  * (including middle-click / cmd+click to open in a new tab) while the remove
63
63
  * button keeps handling its own clicks.
64
64
  */
65
- export declare function TokenLink({ ref, href, isDisabled, onLinkClick, LinkComponent, linkStyleProps, labelContent, icon, endContent, removeButton, onClick: onClickProp, onMouseUp: onMouseUpProp, ...containerProps }: TokenLinkProps): import("react").JSX.Element;
65
+ export declare function TokenLink({ ref, href, isDisabled, onLinkClick, LinkComponent, linkStyleProps, labelContent, icon, endContent, removeButton, onClick: onClickProp, onMouseUp: onMouseUpProp, onPointerDown: onPointerDownProp, ...containerProps }: TokenLinkProps): import("react").JSX.Element;
66
66
  export declare namespace TokenLink {
67
67
  var displayName: string;
68
68
  }
@@ -1 +1 @@
1
- {"version":3,"file":"TokenLink.d.ts","sourceRoot":"","sources":["../../src/Token/TokenLink.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,GAAG,EACH,cAAc,EACd,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,WAAW,CAAC;IACjE,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gBAAgB;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC7C,+DAA+D;IAC/D,aAAa,EAAE,iBAAiB,CAAC;IACjC,mEAAmE;IACnE,cAAc,EAAE;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAC,CAAC;IAC5D,wEAAwE;IACxE,YAAY,EAAE,SAAS,CAAC;IACxB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kEAAkE;IAClE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,YAAY,EAAE,SAAS,CAAC;IACxB,kFAAkF;IAClF,CAAC,QAAQ,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,IAAI,EACJ,UAAU,EACV,WAAW,EACX,aAAa,EACb,cAAc,EACd,YAAY,EACZ,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,cAAc,EAClB,EAAE,cAAc,+BAiDhB;yBA/De,SAAS"}
1
+ {"version":3,"file":"TokenLink.d.ts","sourceRoot":"","sources":["../../src/Token/TokenLink.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;GAqBG;AAEH,OAAO,KAAK,EACV,SAAS,EACT,aAAa,EACb,GAAG,EACH,cAAc,EACd,iBAAiB,EAClB,MAAM,OAAO,CAAC;AAGf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,MAAM,WAAW,cAAe,SAAQ,cAAc,CAAC,WAAW,CAAC;IACjE,8CAA8C;IAC9C,GAAG,CAAC,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;IACvB,gBAAgB;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,qCAAqC;IACrC,UAAU,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,WAAW,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;IAC7C,+DAA+D;IAC/D,aAAa,EAAE,iBAAiB,CAAC;IACjC,mEAAmE;IACnE,cAAc,EAAE;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAC,CAAC;IAC5D,wEAAwE;IACxE,YAAY,EAAE,SAAS,CAAC;IACxB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,kEAAkE;IAClE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,iEAAiE;IACjE,YAAY,EAAE,SAAS,CAAC;IACxB,kFAAkF;IAClF,CAAC,QAAQ,EAAE,QAAQ,MAAM,EAAE,GAAG,OAAO,CAAC;CACvC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACxB,GAAG,EACH,IAAI,EACJ,UAAU,EACV,WAAW,EACX,aAAa,EACb,cAAc,EACd,YAAY,EACZ,IAAI,EACJ,UAAU,EACV,YAAY,EACZ,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,EAChC,GAAG,cAAc,EAClB,EAAE,cAAc,+BAsDhB;yBArEe,SAAS"}
@@ -51,13 +51,15 @@ export function TokenLink({
51
51
  removeButton,
52
52
  onClick: onClickProp,
53
53
  onMouseUp: onMouseUpProp,
54
+ onPointerDown: onPointerDownProp,
54
55
  ...containerProps
55
56
  }) {
56
57
  const containerRef = useRef(null);
57
58
  const linkRef = useRef(null);
58
59
  const {
59
60
  onClick,
60
- onMouseUp
61
+ onMouseUp,
62
+ onPointerDown
61
63
  } = useClickableContainer({
62
64
  containerRef,
63
65
  interactiveRef: linkRef,
@@ -69,6 +71,7 @@ export function TokenLink({
69
71
  ...containerProps,
70
72
  onClick: isDisabled ? onClickProp : composeEventHandlers(onClickProp, onClick),
71
73
  onMouseUp: isDisabled ? onMouseUpProp : composeEventHandlers(onMouseUpProp, onMouseUp),
74
+ onPointerDown: isDisabled ? onPointerDownProp : composeEventHandlers(onPointerDownProp, onPointerDown),
72
75
  children: [icon, isDisabled ?
73
76
  /*#__PURE__*/
74
77
  // A disabled link stays a focusable link with no destination, as a