feat(List): a row tapped to push stays selected until the pop deselects it

.changeset/build-stylex-cross-file-consts.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/build': patch
+---
+
+[fix] `astryxStylex` resolves `defineConsts` values read from another file. With the `{stylexOptions}` form (the one Storybook uses), a file that read only constants from a `.stylex.ts` module lost that import once StyleX compiled it, so the constants never reached the CSS: a constant used as a media-query key failed the build ("Invalid empty selector") and one used as a value shipped as a custom property nothing declares. In either form, a constant defined on the other side of the layer split, or in an Astryx package (compiled with the library class-name prefix) and read from an app file (compiled with its own), stayed unresolved.
+
+@vjeux

.changeset/gesture-arena-moving-cancel.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: a gesture that cancels itself on a finger's move (a long press dragged past its tolerance) keeps that finger claimed until it lifts, so the page never takes the drag over midway; a resting finger is still given back when its gesture is cancelled. Not exported from the package entry point.
+
+@vjeux

.changeset/gesture-browser-negotiation.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: touch-action derivation, the native scroll probe and haptics for the gesture system. Not exported from the package entry point.
+
+@vjeux

.changeset/gesture-host.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: the gesture system's DOM host (claims, click suppression, the browser's takeover, the pointer behind a contact). Not exported from the package entry point.
+
+@vjeux

.changeset/gesture-pan.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: the pan gesture recognizer, with UIKit's measured hysteresis and velocity filter. Not exported from the package entry point; no component uses it yet.
+[chore] Internal: the pan gesture recognizer, with UIKit's measured hysteresis and velocity filter. Not exported from the package entry point.
 
 @vjeux

.changeset/gesture-press-tracking.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: UIControl press tracking with control and cell profiles and the gesture hooks, with every press painter writing `data-astryx-press` through one internal writer in `utils/pressFeedback.ts`. Not exported from the package entry point.
+
+@vjeux

.changeset/gesture-readme.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: the gesture system's README for component authors, with its browser proof in Chromium and WebKit.
+
+@vjeux

.changeset/gesture-recognizer-core.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: the gesture recognizer core for touch presentations: UIKit's recognizer state machine and the arena that settles which recognizer owns a touch. Not exported from the package entry point; no component uses it yet.
+[chore] Internal: the gesture recognizer core for touch presentations: UIKit's recognizer state machine and the arena that settles which recognizer owns a touch. Not exported from the package entry point.
 
 @vjeux

.changeset/gesture-swipe-pinch-rotation-edge-hover.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: swipe, pinch, rotation, screen-edge pan and hover gesture recognizers. Not exported from the package entry point.
+
+@vjeux

.changeset/gesture-tap-long-press.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: tap and long-press gesture recognizers with UIKit's measured thresholds. Not exported from the package entry point; no component uses them yet.
+[chore] Internal: tap and long-press gesture recognizers with UIKit's measured thresholds. Not exported from the package entry point.
 
 @vjeux

.changeset/list-dividers-hide-on-press.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[feat] In a `List` with `hasDividers`, a touch press hides the dividers on either side of the pressed row, so the pressed row reads as one unbroken highlight; both come back the moment the finger lifts, while the highlight fades. This applies under any finger (a coarse primary pointer); with a mouse the dividers stay drawn.
+
+@vjeux

.changeset/list-row-press-compositor.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[fix] A list row's touch press release keeps fading while the page runs script. `ListItem`, `Item` and `TreeList` rows used to stay fully pressed after the finger lifted until the main thread was free, and every frame of the fade repainted the row; the release now runs on the compositor, with the same color, clock and curve as before. Under a finger, while a row is pressed and through its release, the press paints on the row's `::before` and the row is its own stacking context; at rest nothing of it applies, so a row's own `::before` decoration and its children's stacking are as they were. During a press the layer is the row's `::before`, so a caller's decoration there takes the layer's box and paint for that time (a page stylesheet keeps the properties it sets); decoration that should stay through a press belongs on `::after` or a child element. With a mouse or trackpad the row is unchanged: no layer and no new stacking context.
+
+@vjeux

.changeset/list-selection-hold.md

@@ -0,0 +1,8 @@
+---
+'@astryxdesign/core': patch
+'@astryxdesign/cli': patch
+---
+
+[chore] Internal: under a finger, a list row tapped to push can stay selected while the pushed screen covers it, then deselect as the screen pops, as a UIKit table row does; with a mouse the press releases at the lift as before. The hold that drives it (`List/selectionHold.ts`) is internal to core, so no public export changes. The deselect runs on the compositor, and a divided list keeps the dividers around the held row hidden.
+
+@vjeux

.changeset/reduced-motion-record.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: Reduce Motion for the touch presentations follows design:reduced-motion beyond the animator too. `reducedMotionFade()` gives code beside the animator the animator's own fade (an opacity-only 200 ms cross-fade on a coarse pointer or after a touch release, at once on any other pointer), `animator.reducedMotion()` reports which form a change takes for feedback that plays no fade of its own, and `reducedMotion.stylex.ts` holds the fade's constants for StyleX transitions. The fade's length is not a theme motion role. Not exported from the package entry point.
+
+@vjeux

.changeset/uikit-constants-table.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: the UIKit constants table for touch presentations (springs, scroll physics, timing curves and navigation values), each value with its source and a checked list of the simulator measurements still owed. Not exported from the package entry point; no component reads it yet.
+[chore] Internal: the UIKit constants table for touch presentations (springs, scroll physics, timing curves and navigation values), each value with its source and a checked list of the simulator measurements still owed. Not exported from the package entry point.
 
 @vjeux

.changeset/uikit-motion-animator-pseudo-element.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: the touch presentations' animator drives a pseudo-element such as a dialog's ::backdrop: a static filling animation holds its value after a curve ends and after `set`, a custom property on its host promotes it, and a Reduce Motion dip borrows and hands back the pseudo-element's own opacity. Not exported from the package entry point.
+
+@vjeux

.changeset/uikit-motion-animator.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: a compositor animator for touch presentations. It plays UIKit's springs, and scroll coasts (built by a separate coast module, so a surface that never coasts does not carry them; `decay` plays momentum, and sends a spring back from past an edge through the Reduce Motion policy: a cross-fade on a coarse pointer or after a touch release, at once elsewhere) as Web Animations on translate, rotate, scale and opacity, so they keep running while JavaScript is busy, and reads values and velocities back from the curves for interruption, retargeting and Reduce Motion cross-fades. Not exported from the package entry point; no component uses it yet.
+[chore] Internal: a compositor animator for touch presentations. It plays UIKit's springs, and scroll coasts (built by a separate coast module, so a surface that never coasts does not carry them; `decay` plays momentum, and sends a spring back from past an edge through the Reduce Motion policy: a cross-fade on a coarse pointer or after a touch release, at once elsewhere) as Web Animations on translate, rotate, scale and opacity, so they keep running while JavaScript is busy, and reads values and velocities back from the curves for interruption, retargeting and Reduce Motion cross-fades. Not exported from the package entry point.
 
 @vjeux

.changeset/uikit-motion-math.md

@@ -2,6 +2,6 @@
 '@astryxdesign/core': patch
 ---
 
-[chore] Internal: the spring, decay, rubber-band and projection math of UIKit for touch presentations, as pure functions checked against an independent integration and against values read from UIKit. Not exported from the package entry point; no component uses it yet.
+[chore] Internal: the spring, decay, rubber-band and projection math of UIKit for touch presentations, as pure functions checked against an independent integration and against values read from UIKit. Not exported from the package entry point.
 
 @vjeux

.changeset/uikit-motion-use-animator.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: useAnimator, a React wrapper around the touch presentations' animator that never re-renders per frame, and browser proofs on the interaction harness that the animator's motion keeps running through a blocked main thread in Chromium and WebKit. Not exported from the package entry point.
+
+@vjeux

apps/storybook/stories/List.stories.tsx

@@ -7,7 +7,7 @@
  * @position Storybook demonstrations for List consumers
  */
 
-import {useState} from 'react';
+import {useRef, useState, type MouseEvent} from 'react';
 import * as stylex from '@stylexjs/stylex';
 import type {Meta, StoryObj} from '@storybook/react';
 import {List, ListItem} from '@astryxdesign/core/List';
@@ -18,6 +18,12 @@ import {Icon} from '@astryxdesign/core/Icon';
 import {Switch} from '@astryxdesign/core/Switch';
 import {Heading, Text} from '@astryxdesign/core/Text';
 import {VStack} from '@astryxdesign/core/Layout';
+import {Button} from '@astryxdesign/core/Button';
+// The selection hold is internal to core (no public API records it yet).
+import {
+  holdSelection,
+  type SelectionHold as RowSelectionHold,
+} from '../../../packages/core/src/List/selectionHold';
 import {
   Cog6ToothIcon,
   BellIcon,
@@ -408,3 +414,118 @@ export const HeaderInFlexParent: Story = {
     },
   },
 };
+
+function SelectionHoldDemo() {
+  const hold = useRef<RowSelectionHold | null>(null);
+  const slider = useRef<HTMLInputElement | null>(null);
+  const [open, setOpen] = useState<string | null>(null);
+  const [progress, setProgress] = useState(0);
+  const push = (label: string) => (event: MouseEvent) => {
+    // In the same task as the activation that pushes.
+    hold.current = holdSelection(event.target);
+    setProgress(0);
+    setOpen(label);
+  };
+  const settle = async (
+    to: 0 | 1,
+    timing?: Parameters<RowSelectionHold['animate']>[1],
+    {followSlider = false}: {followSlider?: boolean} = {},
+  ) => {
+    const current = hold.current;
+    // A slow pop shows where it is on the slider (written to the input, no
+    // render per frame), so a finger that takes the slider over mid-flight
+    // continues from the value on screen. (Off for the regular pop, whose
+    // proof counts every paint.)
+    const following = {frame: 0};
+    const follow = () => {
+      if (current != null && slider.current != null) {
+        slider.current.value = String(current.presentation());
+      }
+      following.frame = requestAnimationFrame(follow);
+    };
+    if (followSlider) {
+      following.frame = requestAnimationFrame(follow);
+    }
+    // No hold under a mouse: the screen just pops.
+    const arrived = current == null || (await current.animate(to, timing));
+    cancelAnimationFrame(following.frame);
+    if (!arrived) {
+      // Interrupted (a finger took the progress over mid-flight): the hold
+      // stays where the finger left it.
+      return;
+    }
+    if (to === 1) {
+      setOpen(null);
+      current?.end(true);
+      current?.focus({preventScroll: true});
+      hold.current = null;
+    } else {
+      current?.end(false);
+      setProgress(0);
+    }
+  };
+  return (
+    <VStack gap={4}>
+      <List hasDividers>
+        {['Inbox', 'Sent', 'Drafts'].map(label => (
+          <ListItem
+            key={label}
+            label={label}
+            onClick={push(label)}
+            endContent={<Icon icon={ChevronRightIcon} />}
+          />
+        ))}
+      </List>
+      {open != null && (
+        <VStack gap={2} data-testid="pushed-screen">
+          <Text type="label">{open} (pushed)</Text>
+          <Button label="Back" onClick={() => void settle(1)} />
+          <Button
+            label="Back, slowly"
+            onClick={() =>
+              void settle(
+                1,
+                {durationMs: 3000, curve: [0, 0, 1, 1]},
+                {followSlider: true},
+              )
+            }
+          />
+          <label>
+            Pop progress
+            <input
+              ref={slider}
+              type="range"
+              min={0}
+              max={1}
+              step={0.01}
+              value={progress}
+              onChange={event => {
+                const value = Number(event.target.value);
+                setProgress(value);
+                hold.current?.setProgress(value);
+              }}
+            />
+          </label>
+          <Button label="Finish pop" onClick={() => void settle(1)} />
+          <Button label="Cancel pop" onClick={() => void settle(0)} />
+        </VStack>
+      )}
+    </VStack>
+  );
+}
+
+export const SelectionHold: Story = {
+  render: () => <SelectionHoldDemo />,
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'A row tapped to push stays selected while the pushed screen covers it ' +
+          'and deselects as the screen pops (UIKit’s push from a table row), ' +
+          'driven here by buttons standing in for a navigation stack: Back runs ' +
+          'the in-transition deselect, the slider scrubs it like an edge swipe, ' +
+          'and Cancel selects the row again.',
+      },
+    },
+  },
+};