feat(Wheel): UIPickerView's motion under a finger, with flat rows

.changeset/wheel-interaction-proofs.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: browser proofs for the touch picker wheel in Chromium and WebKit, which a finger gets on every engine. A flick coasts on UIKit's curve onto the row it projects and commits on arrival. A finger landing on a coasting wheel stops it, and it then eases onto the nearest row. A storyboard films a flick and its coast. In Chromium, the coast also keeps advancing every frame while the main thread is blocked, and does no Layout or Paint per frame. Under reduced motion, a flick still coasts as momentum with its rows flat, and a tap cross-fades onto its row, animating opacity alone for 200 ms or less. Opening the month and year wheels writes no element per year, and each year is drawn once. Under a mouse, a drag still scrolls today's column onto a row.
+
+@vjeux

.changeset/wheel-keys-time-order.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[fix] In the DateInput, TimeInput and DateTimeInput bottom sheets, a wheel's Arrow, Page, Home and End keys move through its enabled values in time order, skipping disabled ones, and stop at the first or last enabled value, with a mouse as with a finger. On a 12-hour hour wheel 12 PM comes before 1 PM, so ArrowDown from 12 PM moves to 1 PM, and a key past the last allowed hour commits nothing.
+
+@vjeux

.changeset/wheel-listbox-hook.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: the Wheel's two presentations, the scrolling column under a mouse and the picker wheel under a finger, share one listbox hook for their ids, ARIA attributes, Arrow, Page, Home and End keys, and row clicks. Each keeps where its moves start: the scrolling column steps from the row under its band, and the picker wheel from the row it is heading to.
+
+@vjeux

.changeset/wheel-trackpad-notch.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[feat] On a touch device with a trackpad or a mouse, such as a tablet with a keyboard, the picker wheels in the TimeInput, DateTimeInput and DateInput bottom sheets now take a trackpad's two-finger scroll as a finger: the rows follow the fingers, coast on at their lift, and rest on a row. One mouse-wheel notch turns a wheel one row, as an arrow key does, with no coast. Before, both moved the rows by each scroll's own distance, so a trackpad's momentum ran at the browser's rate and one notch moved several rows. A ctrl-scroll still zooms the page.
+
+@vjeux

.changeset/wheel-uikit-picker-values.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[chore] Internal: UIPickerView's values measured on iOS 26.2 join the touch motion tables as internal constants: the row pitch, the picker's height and its rubber band, the coast's stop speed and velocity floor, the snap at rest, the tap spin and the selection tick. The pure math a wheel moves with comes with them. It projects the row a release rests on as UIScrollView sums its deceleration, coasts with the rate re-solved to stop on that row, snaps, bounces at an end, rubber-bands, and spins to a tapped row. It is checked against UIKit's recorded frames. Nothing public changes: none of it is exported from the package entry point, and themes do not set these values.
+
+@vjeux

.changeset/wheel-uikit-picker.md

@@ -0,0 +1,7 @@
+---
+'@astryxdesign/core': patch
+---
+
+[feat] Under a coarse primary pointer, as on a phone or a tablet, the picker wheels in the TimeInput, DateTimeInput and DateInput bottom sheets now move like UIPickerView. Their rows keep the 28 px pitch and lie flat, fading toward the edges of the column in every browser; the scrolling column under a mouse tilts and fades its rows only where the browser supports scroll-driven animations, and shows a plain list elsewhere. The row under the band is in semibold accent text on its plate while the wheel rests and while a finger drags it; no row is marked while the wheel coasts, snaps or turns. A flick coasts at UIKit's deceleration onto the row UIKit's projection picks. A finger landing on a moving wheel stops it. A tap on a row turns it onto the band, and a value changed from outside while the sheet is open, as when a bound clamps the time, turns the wheel onto its row instead of jumping there. Past the first or last row, a drag rubber-bands and the wheel bounces back. As on iOS, the value commits when the wheel comes to rest, and the coast keeps running while the page's main thread is busy. Arrow keys and clicks on a row still commit at once. Under reduced motion a flick still coasts, as scrolling does; a tap, a key or a slow release cross-fades onto its row. `presentation="popover"` keeps the previous surface; no value keeps the native-scroll column under a finger. Each row that reaches the band ticks with a short vibration where the browser supports it, as on Android; iOS Safari has no vibration. Under a fine primary pointer, as with a mouse on a desktop, the wheels keep the scrolling column.
+
+@vjeux

apps/storybook/stories/DateInput.stories.tsx

@@ -861,3 +861,39 @@ export const StylingParts: Story = {
     </div>
   ),
 };
+
+/**
+ * The bottom sheet with two centuries of years: the year wheel has 200 rows.
+ * Under a finger, opening the month and year wheels costs about the same as
+ * for two years: each year is drawn once, as a flat row.
+ */
+export const BottomSheetWideRange: Story = {
+  render: args => {
+    const [value, setValue] = useState<ISODateString | undefined>(
+      '2026-03-15' as ISODateString,
+    );
+    return <DateInput {...args} value={value} onChange={setValue} />;
+  },
+  args: {
+    label: 'Date of birth',
+    presentation: 'bottom-sheet',
+    min: '1900-01-01' as ISODateString,
+    max: '2099-12-31' as ISODateString,
+  },
+};
+
+/** The same sheet with two years: the year wheel has 2 rows. */
+export const BottomSheetNarrowRange: Story = {
+  render: args => {
+    const [value, setValue] = useState<ISODateString | undefined>(
+      '2026-03-15' as ISODateString,
+    );
+    return <DateInput {...args} value={value} onChange={setValue} />;
+  },
+  args: {
+    label: 'Date of birth',
+    presentation: 'bottom-sheet',
+    min: '2026-01-01' as ISODateString,
+    max: '2027-12-31' as ISODateString,
+  },
+};

apps/storybook/stories/WheelProofs.stories.tsx

@@ -0,0 +1,84 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file WheelProofs.stories.tsx
+ * @input Uses React and the internal Wheel (packages/core/src/DateInput)
+ * @output The Wheel alone, for its browser proofs: a 60-row minute column at
+ *   00, its committed minute shown in a read-only field; and the touch column
+ *   alone, whatever the primary pointer, for the trackpad proofs
+ * @position A checked-in reproduction path for
+ *   packages/core/src/DateInput/__tests__/Wheel.interaction.browser.spec.ts.
+ *   The proofs test the Wheel itself, so they open a column that stays a plain
+ *   Wheel whatever rules the sheets that use it add (looping, bounds, a date
+ *   that moves with the month).
+ */
+
+import type {Meta, StoryObj} from '@storybook/react';
+import {useState} from 'react';
+import {PickerWheel} from '../../../packages/core/src/DateInput/PickerWheel';
+import {Wheel} from '../../../packages/core/src/DateInput/Wheel';
+
+const MINUTES = Array.from({length: 60}, (_, minute) => ({
+  value: minute,
+  label: String(minute).padStart(2, '0'),
+}));
+
+const meta = {
+  title: 'Core/Wheel',
+  tags: ['no-visual', '!autodocs'],
+  parameters: {layout: 'centered'},
+} satisfies Meta;
+
+export default meta;
+type Story = StoryObj<typeof meta>;
+
+/**
+ * A finger gets the touch column, a mouse the scrolling column; either commits
+ * into the field above it.
+ */
+export const Minutes: Story = {
+  render: () => {
+    const [minute, setMinute] = useState(0);
+    return (
+      <div style={{display: 'grid', gap: 16, inlineSize: 160}}>
+        <input
+          aria-label="Committed minute"
+          readOnly
+          value={String(minute).padStart(2, '0')}
+        />
+        <Wheel
+          label="Minute"
+          options={MINUTES}
+          value={minute}
+          onChange={setMinute}
+        />
+      </div>
+    );
+  },
+};
+
+/**
+ * The touch column alone, whatever the primary pointer: WebKit's driver sends
+ * a trackpad's precise deltas only from a desktop context, whose primary
+ * pointer is fine, and its mobile emulation sends no wheel at all.
+ */
+export const TouchMinutes: Story = {
+  render: () => {
+    const [minute, setMinute] = useState(0);
+    return (
+      <div style={{display: 'grid', gap: 16, inlineSize: 160}}>
+        <input
+          aria-label="Committed minute"
+          readOnly
+          value={String(minute).padStart(2, '0')}
+        />
+        <PickerWheel
+          label="Minute"
+          options={MINUTES}
+          value={minute}
+          onChange={setMinute}
+        />
+      </div>
+    );
+  },
+};

docs/specs/AST-094-touch-presentations/motion-roles.md

@@ -6,6 +6,7 @@ Every motion role a registered table lists (`spec:AST-094` FR4, DEC-5): its kind
 
 | Role                            | Kind     | Default                                                         | Named by                |
 | ------------------------------- | -------- | --------------------------------------------------------------- | ----------------------- |
+| `picker.tapSpin.durationMs`     | duration | 300 ms                                                          | `component:DateInput`   |
 | `progress.curves.fill`          | curve    | cubic-bezier(0, 0, 1, 1)                                        | `component:ProgressBar` |
 | `progress.fillTrackMs`          | duration | 1000 ms                                                         | `component:ProgressBar` |
 | `progress.reducedMotionPulseMs` | duration | 2000 ms                                                         | `component:ProgressBar` |

docs/specs/AST-094-touch-presentations/spec.md

@@ -184,6 +184,10 @@ a measured, sourced difference exists.
   integrator, its 300 ms animated scroll and that scroll's sinusoidal curve,
   DEC-25) plays from internal constants and is not yet a named role.
 
+  Implementation gap: the sheet picker wheel's snap rate (UIKit's measured
+  picker deceleration) plays from an internal constant and is not yet a named
+  role; a role kind for rates comes with a later change.
+
 ### Motion
 
 - **FR5 — Motion runs on the compositor.** Every release and every