Repository navigation
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
meta-cla
Bot
added
the
CLA Signed
|
AI review status for this pull request.
|
![astracat-bot[bot]](https://avatars.githubusercontent.com/in/4796231?s=60&v=4){kind=small}
There was a problem hiding this comment.
Approval is on hold for maintainer spec direction: the pull-away stretch and its uncapped 0.55× rule have no governing spec yet, and the draft spec:AST-094 added here also proposes updating current records such as architecture:theme-tokens. A maintainer needs to provide or approve the governing spec for the stretch and settle those record updates, which an engineering owner can do by commenting /approve-spec 1df23fe27e1046cabaec0f6a172be9b3af133ccd (you can do this yourself if you are an engineering owner). Separately from that decision, please address:
- A stretched card flicked back toward its edge is dismissed (
packages/core/src/Toast/toastSwipe.ts:40), although the docs, the changeset and the test attoastSwipe.test.ts:78say it always springs back. - The diff still carries the 19 predecessor pull requests (#8052–#8121): land them first and rebase so this one carries only its own commit.
packages/core/src/gestures/README.md:338documents autils/touchPresentation.tsmodule that does not exist,.changeset/toast-swipe-follows-banner.md:5describes a velocity projection the code does not use, and thelintjob ran out of memory on this head.
[Automated review]
| * faster (UIKit's estimator keeps a stopped finger's last speed). | ||
| */ | ||
| export function isDismissRelease(offset: number, velocity: number): boolean { | ||
| return offset >= toast.dismissOffset || velocity >= toast.flickVelocity; |
There was a problem hiding this comment.
A card stretched away from the edge still dismisses here when the finger flicks back toward the edge at 105 px/s or more: a top toast pulled 40 px down (card 14.3 px past rest) and flicked 20 px back up in 32 ms calls onHide('manual'). The doc comment above, useToastGesture.ts:28-30, the changeset and the test name all say a release there always springs back. Either gate the speed on the card being at or past rest (offset >= toast.dismissOffset || (offset >= 0 && velocity >= toast.flickVelocity)) or, if the banner dismisses in this case, correct those texts.
| }, | ||
| ); | ||
|
|
||
| it('springs a card stretched away from the edge back, however it is released', () => { |
There was a problem hiding this comment.
This only tries velocities −400 and 0, so it passes while a flick back toward the edge (a positive velocity at a negative offset) dismisses. Adding expect(isDismissRelease(followOffset(-80), toast.flickVelocity)).toBe(false) makes the test prove what its name says.
| ## Touch presentation | ||
|
|
||
| Whether a component presents itself the touch (UIKit) way is answered once, | ||
| in `../utils/touchPresentation.ts`: |
There was a problem hiding this comment.
../utils/touchPresentation.ts, TOUCH_QUERY, COMPACT_QUERY, COMPACT_TOUCH_QUERY, useTouchPresentation(), readTouchPresentation() and useMotionPresentation() do not exist at this head, and no test enforces the query spelling. Please drop this section or point it at what ships.
| '@astryxdesign/core': patch | ||
| --- | ||
|
|
||
| [fix] A Toast's swipe now follows iOS notification banners. The card stays still for the first 14 px of finger travel and then follows at 0.55 of the finger, with no jump. On release, the finger's travel projected with its velocity decides: a quick flick dismisses even when it barely moved the card, and a release short of dismissing springs the card back. A dismissed card leaves from where the finger left it and never moves back toward rest. The swipe no longer fades or shrinks the card. While the card springs back, touches pass through to the page. |
There was a problem hiding this comment.
The release does not project the travel with the velocity: isDismissRelease compares the card's offset with 15.7 px and the finger's speed toward the edge with 105 px/s (toastSwipe.ts:39-41). The changelog should describe those two thresholds.
| follows. | ||
| - **FR7 — Exits animate as UIKit's do.** A touch presentation MUST play the | ||
| exit its UIKit counterpart plays. **Proposed; pending owner review:** this | ||
| departs from the draft `spec:AST-090` FR1 (exits off by default) and FR10 |
There was a problem hiding this comment.
spec:AST-090 is not in the repository at this head, so this proposed amendment (and the one at line 235) points at no record. Cite it once it lands, or drop the reference.
PR Analysis Report📚 Storybook Preview🧪 Sandbox PreviewModified ComponentsToast (@astryxdesign/core) · View in Storybook
Component Size
Sizes are gzip. Import counts the JavaScript the import loads eagerly; CSS counts the package stylesheet rules referenced by the modules it can load from its own package, lazily loaded ones included.
|
| Component | JavaScript | CSS |
|---|---|---|
| core/LayerProvider | +27.5KB |
+140B |
| core/Toast | +27.2KB |
+92B |
Bundle Size Summary
Gzip figures measure each package's entry file, not the code an import pulls in.
| Package | Entry (ESM) | Entry gzip before | Entry gzip after | Delta |
|---|---|---|---|---|
| @astryxdesign/core | 4.9KB | 1.2KB | 1.2KB | 0B |
| Package stylesheet | Gzip before | Gzip after | Delta |
|---|---|---|---|
| @astryxdesign/core | 34.6KB | 34.6KB | +87B |
Accessibility Audit
Status: No accessibility violations detected.
Visual Regression
55 of 502 shot(s) changed.
A change here is a question, not a failure: check whether the after is the
picture you intended. Record that review on the PR. Baseline maintenance is an
explicit dispatch of CI; this report never rewrites the baseline or adds a release gate.
| component | story | theme | mode | pixels |
|---|---|---|---|---|
| Selector | Indicator Space Bottom Sheet Narrow End RTL | neutral | light | 753,933 |
| Selector | Indicator Space Bottom Sheet Wide Start | neutral | light | 740,072 |
| RichTextEditor | Markdown parity: side by side | probe | dark | 558,840 |
| RichTextEditor | Markdown parity: side by side | probe | light | 540,756 |
| Chat | Full AI Chat | probe | light | 230,823 |
| Chat | Full AI Chat | probe | dark | 229,805 |
| AppShell | With Mobile Nav | probe | light | 217,010 |
| AppShell | With Mobile Nav | probe | dark | 216,960 |
| Collapsible | Dividers | probe | dark | 66,445 |
| Collapsible | Dividers | probe | light | 66,445 |
| AppShell | Playground | neutral | dark | 65,198 |
| AppShell | Playground | neutral | light | 63,788 |
| Chat | Default | neutral | dark | 36,304 |
| Chat | Default | neutral | light | 35,767 |
| Chat | Empty State | probe | light | 23,531 |
| Chat | Empty State | probe | dark | 22,622 |
| ChatAutoScroll | Scroll Behavior Comparison | neutral | dark | 15,378 |
| ChatAutoScroll | Scroll Behavior Comparison | neutral | light | 14,107 |
| Chat | With Attachments | probe | light | 13,406 |
| Chat | With Attachments | probe | dark | 11,232 |
and 35 more.
Generated by PR Enrichment workflow | Storybook | Sandbox | View full report
1df23fe to
92bf839
Compare
There was a problem hiding this comment.
Approval is on hold for an engineering owner's spec decision: the pull-away stretch and its linear, uncapped 0.55× rule have no governing spec, and the draft spec:AST-094 this diff adds is unapproved. Any engineering owner, including you as the author if you are one, records that decision by commenting /approve-spec 92bf839c864b3da7f6bd8020cdf37d3f58bf9ae3, or asks for the stretch to wait until AST-094 is current on main. Separately from that decision, please address:
- A stretched card moved back toward its edge at 105 px/s or more before the lift is dismissed (
packages/core/src/Toast/toastSwipe.ts:40), although the description, the doc comments and the test attoastSwipe.test.ts:80say it always springs back. - The stacked theme API adds a
platformadaptation condition thatspec:AST-012FR2 keeps closed and--motion-*theme variables outside the token vocabulary, andastryx docs motiondescribes sheet, menu and navigation motion that no component plays yet. - The diff still carries the predecessor pull requests (#8052–#8121): land them first and rebase so this one carries only its own commit; the gestures README also documents a
utils/touchPresentation.tsthat does not exist.
[Automated review]
| * is everything else. Pair `ios` with `pointer: 'coarse'` for a touch | ||
| * profile, such as touch motion tuned per platform. | ||
| */ | ||
| platform?: 'ios' | 'other'; |
There was a problem hiding this comment.
platform adds a field to the adaptation condition vocabulary that spec:AST-012 FR2 keeps closed ("Future environment fields require explicit additions to this closed vocabulary"), and nothing in this pull request amends FR2. It belongs with #8257 once an owner amends that requirement, not in this diff.
| content: [ | ||
| { | ||
| type: 'prose', | ||
| text: 'On a touch screen, sheets, alerts, menus, navigation and scrolling play the springs, durations and curves measured from iOS. Each value is a motion role named by its table path, such as `springs.sheetPresent` or `timing.curves.easeInOut`. A theme retunes a role through `motion.springs`, `motion.durations` or `motion.curves`, at its root or in an adaptation rule; a role it leaves alone keeps its measured default.', |
There was a problem hiding this comment.
At this head the only component that imports the motion layer is Toast, and the only role it plays is toast.settle. No sheet, alert, menu, navigation or scroll component plays these values yet, so a theme that retunes springs.sheetPresent or springs.navigationPush as the example below does sees no change. Describe what ships, or land this page with the components that read those roles.
| * spring, a duration (a key ending in `Ms`, in milliseconds) or a curve (four | ||
| * cubic-bézier control points). It is named by its table path, for example | ||
| * `springs.sheetDetent`, `timing.curves.easeInOut` or `sheet.present`, and | ||
| * carried by one CSS custom property, `--motion-` followed by the path in |
There was a problem hiding this comment.
The --motion-* variables a theme writes originate here and in the motion tables, while architecture:theme-tokens INV1 says "A core token name and its default originate in tokens.stylex.ts; projections do not introduce names." The draft spec:AST-094 FR4 in this same diff also says touch physics are not themable. One of them has to change, under an owner ruling, before this API lands.
92bf839 to
e17fbc1
Compare
There was a problem hiding this comment.
Approval is on hold for an engineering owner's spec decision: the pull-away stretch and its linear, uncapped 0.55× rule have no governing spec, and the draft spec:AST-094 this diff adds is unapproved. Any engineering owner, including you as the author if you are one, records that decision by commenting /approve-spec <full head SHA>, or asks for the stretch to wait until AST-094 is current on main. Separately from that decision, please address:
- A stretched card moved back toward its edge at 105 px/s or more before the lift is still dismissed (
packages/core/src/Toast/toastSwipe.ts:43), although the description, the doc comments and the test name attoastSwipe.test.ts:86say it always springs back. - Under Reduce Motion the release still springs and every iOS dismissal still slides (
useToastBannerSwipe.ts:103, asserted by the new browser test), which the current reduced-motion design record rules out: a transition a touch release starts cross-fades in 200 ms or less. - The stack's compact-touch resolver hard-codes 744 px (
utils/touchPresentation.ts:75-79) where currentspec:AST-012FR9 uses the theme'smdpoint or a height below 500, and the iOS swipe adds about 24 KB gzip of touch-only JavaScript to every Toast import without lazy loading or a stated justification. - The diff still carries the predecessor pull requests (#8052–#8121), including theme API that contradicts
spec:AST-012FR2 andarchitecture:theme-tokensINV1: land them first and rebase so this one carries only its own commit.
[Automated review]
| ) => boolean; | ||
| } | ||
|
|
||
| const RELEASE_OPTIONS = {reducedMotion: 'keep'} as const; |
There was a problem hiding this comment.
reducedMotion: 'keep' makes the stretched card's spring-back (:205-209) and every iOS retract (:246-256) travel under Reduce Motion. The current reduced-motion design record asks a transition started by a touch release to change opacity only and finish within 200 ms, with a leaving element fading out where it is (DR2), and rules out keeping springs (DR4); spec:AST-057 FR5 already does this for a swiped row. Under reduced motion, bring the released card to rest with no travel and a short cross-fade, and fade a dismissed card out in place.
| expect(await ownSwipe(card)).toEqual({y: 0, scale: 1, opacity: 1}); | ||
| }); | ||
|
|
||
| test('under Reduce Motion a turn-back still stretches the card and springs it back', async ({ |
There was a problem hiding this comment.
This test asserts the spring under Reduce Motion (50 ms after the lift the card is still more than 70% out), the behavior the current reduced-motion design record forbids for a transition a touch release starts. Once the release cross-fades, assert an opacity-only animation of 200 ms or less instead.
|
|
||
| /** Both: presentations such as a sheet in place of a popover. */ | ||
| export const COMPACT_TOUCH_QUERY = | ||
| '(width < 744px) and (pointer: coarse), (height < 500px) and (pointer: coarse)'; |
There was a problem hiding this comment.
Current spec:AST-012 FR9 makes a screen compact "while its viewport width is below the effective md point (FR1) or its viewport height is below 500", names the web touch presentation resolver, and says it keeps no size numbers of its own; md is 768 unless a theme overrides it. With 744 here, a coarse-pointer screen 744 to 767 px wide, such as an iPad mini in portrait, gets the popover where FR9 gives it the sheet. Derive the width edge from the theme's effective md point and update touchPresentation.test.ts:328 and the changeset.
| import {themeProps} from '../utils/themeProps'; | ||
| import {useTouchIdiom} from '../utils/touchPresentation'; | ||
| import {useTranslator} from '../i18n'; | ||
| import {useToastBannerSwipe} from './useToastBannerSwipe'; |
There was a problem hiding this comment.
This static import carries the iOS swipe's gesture system and animator into every Toast import: about 24 KB gzip bundled with React external, for code that runs only in the iOS touch idiom. Current architecture:component-style-authoring INV6 flags touch-only work over 2 KB gzip and asks for a lazy load when a coarse pointer needs it, or a stated justification.
e17fbc1 to
4880102
Compare
github-actions
Bot
added
the
needs:design-review
There was a problem hiding this comment.
Approval is on hold for an engineering owner's spec decision: the turn-back stretch and its linear, uncapped 0.55× rule have no governing spec, and the draft spec:AST-094 this diff adds is unapproved. Any engineering owner, including you as the author if you are one, records that decision by commenting /approve-spec <full head SHA> on this pull request, or asks for the stretch to wait until AST-094 is current on main. Separately from that decision, please address:
- Every Toast import grows by about 26 KB gzip because
Toast.tsx:55imports the touch layer statically, with no lazy load or stated justification, while the changeset says that code is not loaded with a fine pointer. - The stacked theme API (the
platformadaptation condition and the--motion-*roles) contradictsspec:AST-012FR2 andarchitecture:theme-tokensINV1, andastryx docs motionand a changeset describe roles that no component plays or that do not exist. - The diff still carries #8121 and its predecessors: land them first and rebase so this pull request carries only its own commit.
[Automated review]
| '@astryxdesign/cli': patch | ||
| --- | ||
|
|
||
| [fix] Under a finger (a coarse primary pointer, on every touch device, iOS and Android alike), a Toast's swipe now follows iOS notification banners. The card stays still for the first 14 px of finger travel and then follows at 0.55 of the finger, with no jump. On release, a quick flick toward the edge dismisses even when it barely moved the card, as does a drag that leaves the card far enough out; anything else springs the card back. However a toast is dismissed (a swipe, the close button, the timeout), the card leaves as the banner does: it slides past its edge from where it is, without fading, and then the toast is dismissed. The swipe no longer fades or shrinks the card. While the card springs back or leaves, touches pass through to the page. A theme retunes the spring-back and the exit through the `toast.settle`, `toast.exitMs` and `toast.exitCurve` motion roles, which `astryx docs motion` now lists. With a fine pointer the swipe and exit stay as they were, and the swipe's code is not loaded. Under reduced motion nothing slides, springs or drifts: on a touch screen the toast fades in place, and with a mouse or keyboard it changes at once. |
There was a problem hiding this comment.
This says the swipe's code is not loaded with a fine pointer, but Toast.tsx:55 imports useToastBannerSwipe statically, so every Toast import carries the gesture system and the animator whatever the pointer: 42,409 bytes gzip on main, 68,338 at this head (one esbuild bundle of packages/core/src/Toast/index.ts, bare imports external). architecture:component-style-authoring INV6 asks for a lazy load under a coarse pointer or a stated justification; either load it lazily, or drop this sentence and justify the cost.
| '@astryxdesign/cli': patch | ||
| --- | ||
|
|
||
| [feat] Themes can retune touch motion. `defineTheme({motion})` takes `springs`, `durations` and `curves` keyed by motion role, the table path of a value touch presentations play (`springs.sheetPresent`, `timing.reducedMotionCrossFadeMs`), at the root or in an adaptation rule. A role the theme leaves out keeps its measured default, and the duration scale (`fast`, `medium`, `ratio`) is optional when a theme sets only roles. Adaptation rules gain a `platform` condition, `ios` or `other`. `astryx docs motion` lists every motion role with its CSS variable and default, and the theme authoring guide and template describe the new fields. |
There was a problem hiding this comment.
timing.reducedMotionCrossFadeMs is not a role at this head: motion/uikit/timing.ts:158 excludes it, as design:reduced-motion DR4 requires (no theme value may lengthen the Reduce Motion fade). Name a role a theme can set and something plays, such as toast.settle.
| @@ -247,9 +255,15 @@ export interface DefineThemeInput { | |||
| * // Snappy: { fast: 100, medium: 250, ratio: 0.75 } | |||
| * // Default: { fast: 175, medium: 410, slow: 975, ratio: 0.75 } | |||
| * // Cinematic: { fast: 200, medium: 500, slow: 1200, ratio: 0.7 } | |||
| * | |||
| * // A softer sheet and a slower reduced-motion fade: | |||
There was a problem hiding this comment.
navigation.transitionMs is not the Reduce Motion fade (that length is excluded from the roles), and no component reads it at this head, so this example retunes nothing. Show a role that has a consumer, or keep the example until a navigation component plays it.
| is right. Behaviour reads | ||
| `useTouchPresentation()` (SSR-safe), a decision taken once reads | ||
| `readTouchPresentation()`, and a component with no interaction to infer | ||
| from reads `useMotionPresentation()`: UIKit timings under a finger, theme |
There was a problem hiding this comment.
useMotionPresentation() does not exist at this head; the rest of this section now matches utils/touchPresentation.ts. Drop the sentence or point it at what ships.
4880102 to
76837dd
Compare
76837dd to
20a270a
Compare
There was a problem hiding this comment.
Approval is on hold for an engineering owner's spec decision: the turn-back stretch, its linear and uncapped 0.55× rule, and the draft spec:AST-094 requirements this diff adds have no current authority. Any engineering owner, including you as the author if you are one, records that decision by commenting /approve-spec <full head SHA> on this pull request, or says the stretch should wait until AST-094 is current on main. Separately from that decision, please address:
- Every Toast import grows by about 28 KB gzip because
Toast.tsx:55imports the touch layer statically, while the changeset says that code is not loaded with a fine pointer; load it lazily or justify the cost. - The theme motion roles contradict
architecture:theme-tokensINV1 and the draft's own FR4; the theme template documents aplatformaxis that no longer exists, and the template and motion docs retune roles no component plays. - A flick that rests more than 40 ms before the lift now springs back, although
toastSwipe.tsand the Toast table describe UIKit's filter keeping the last speed; the code also citesspec:AST-100,spec:AST-090and an AST-094 OQ4 that do not exist. - The diff still carries #8121 and its predecessors (37,915 authored lines): land them first and rebase so this pull request carries only its own commit.
[Automated review]
| import {useTouchPresentation} from '../utils/touchPresentation'; | ||
| import {reducedMotionFadeConsts} from '../motion/reducedMotion.stylex'; | ||
| import {useTranslator} from '../i18n'; | ||
| import {useToastBannerSwipe} from './useToastBannerSwipe'; |
There was a problem hiding this comment.
This static import brings the gesture host, arena, recognizers and compositor animator into every Toast import: one esbuild bundle of Toast/index.ts goes from 34,861 to 63,342 bytes gzip (npm packages external). That code runs only under a coarse pointer, so architecture:component-style-authoring INV6 asks for a lazy load or a stated justification, and .changeset/toast-swipe-follows-banner.md currently says the swipe's code is not loaded with a fine pointer.
| * Whether a release dismisses: the card is at least `toast.dismissOffset` | ||
| * out, or it is at or past rest toward the edge and the finger was moving | ||
| * toward the edge at `toast.flickVelocity` or faster (UIKit's estimator keeps | ||
| * a stopped finger's last speed). A card stretched away from the edge always |
There was a problem hiding this comment.
At this head the pan's release velocity is not UIKit's 'keeps a stopped finger's last speed': VelocityTracker reads 0 when the contact was still for more than 40 ms before the lift (gestures/VelocityTracker.ts:124-128). A short flick that rests 40 to 150 ms before lifting now springs back, while the banner measurement in motion/uikit/toast.ts:92-96 dismisses it. Either keep the iOS blend for this pan or update this comment, the table's source note and draft FR17.
| * carried by one CSS custom property, `--motion-` followed by the path in | ||
| * kebab case (`--motion-springs-sheet-detent`). A theme writes that property |
There was a problem hiding this comment.
These --motion-<path> names and their defaults originate in the motion tables, while architecture:theme-tokens INV1 says "A core token name and its default originate in tokens.stylex.ts; projections do not introduce names." The draft spec:AST-094 FR4 in this diff also says touch motion is not themable. This needs an owner-amended INV1 before it ships, or it should leave this pull request.
| * `from` includes its point; `below` excludes it. The other supported axes | ||
| * are primary-pointer precision, contrast preference, and motion preference. | ||
| * are primary-pointer precision, contrast preference, motion preference, and | ||
| * platform (`ios` for the browsers of iPhone and iPad, `other` for the rest). |
There was a problem hiding this comment.
themeAdaptations.ts accepts no platform field at this head (the condition was removed in this stack), so this sentence documents an axis a theme cannot use.
| @@ -177,6 +190,13 @@ const STATIC_EXPORTS = { | |||
| types: './dist/utils/interactionOverlay.stylex.d.ts', | |||
| default: './dist/utils/interactionOverlay.stylex.js', | |||
| }, | |||
| // Proposed; pending owner review (spec:AST-094 OQ4): the Reduce Motion | |||
There was a problem hiding this comment.
The draft spec:AST-094 has only OQ1 and OQ2, so this cites an open question that does not exist; and since ./motion/reducedMotion.stylex is not under an /experimental subpath, spec:AST-017 FR21 does not exempt it from the stable promise.
| and MUST keep advancing at display rate through a main-thread block. It MUST | ||
| NOT animate layout properties, and MUST NOT step a frame from script when the | ||
| compositor can run the curve. | ||
| - **FR6 — Motion is interruptible.** A finger MUST be able to catch any |
There was a problem hiding this comment.
The Toast this pull request ships lets touches pass through a card that is settling back or leaving (useToastBannerSwipe.ts:56-57, :167-177), so FR6 as written does not describe it. One of the two needs to change before an owner approves this record.
20a270a to
2dbdfd6
Compare
…llowance under every primary pointer The useMenuPress record's FR9 puts the trigger's held finger under spec:AST-094 FR29 under every primary pointer (FR43), so a finger on a touchscreen laptop may drift 13 pt before the open, as on a phone. The trigger read (pointer: coarse) as its press started and took the long press's 10 px where the pointer was fine. Three cases fail until it does not: a 12 pt drift opens under a fine pointer too, a (12, 12) settle opens there, and nothing reads a pointer query, the trigger's press included.
…lowance under every primary pointer The useMenuPress record's FR9 governs the trigger's held finger by spec:AST-094 FR29 under every primary pointer (FR43). The trigger now hands the long press FR29's 13 px drift allowance whatever the primary pointer, so it no longer reads (pointer: coarse) as its press starts, and the menus drop their coarsePointer import. ContextMenu keeps the long press's own allowable movement. The changeset says the same.
Strict ESLint reported six unused bindings in files this pull request carries: the host's HAPTIC_SWITCH_ATTRIBUTE import, two unused imports in the pan's tests (scrollProbe, ScreenEdgePanGestureRecognizer), the swipe test's drift, the presented-hit-testing test's gestures, and a GestureHost test's before, which now asserts what it was read for: a second finger's moves leave the pan where it was.
…eal angular speed The release velocity of a rotation whose listener sets rotation = 0 on each change, at 2 degrees every 16 ms, read 4.363 rad/s against the 2.182 rad/s of the same stream without a re-base: the test asserted only more than 1.5. It now asserts the 2.18 rad/s (spec:AST-100 FR2), and fails.
The rotation's velocity tracker samples the raw unwrapped angle, which setting rotation does not move, so the setter's shift of the samples read each re-base as extra turn and doubled the release velocity of a listener that re-bases on every change. The setter no longer touches the tracker.
…mates while it runs The proof read the element's animations 230 ms in, after the dip had ended, and asserted only that every animated key is opacity, which an empty list passes: with the cross-fade removed from the plan (the move still landing), the proof still passed. It now reads the keyframe keys right after the call starts and asserts they include opacity and nothing else; the same mutant fails it. Chromium and WebKit pass. (F1's in-flight read from c648034.)
…roller, and its claimed moves are cancelled under pointer events Two comparisons stop at the shadow boundary, each failing a case: - once the host's listener on a recognizer's inner node has seen the finger, isFingerDownIn reads it as outside a light-DOM scroller around that root, so a scroll under it is not the finger's (FR20); - under inputMode 'pointer-events', a claimed pan on a shadow host cancels none of its finger's moves over the inner content, since the finger's target is the inner node and its touches reach the host retargeted (FR19).
…the flat tree isFingerDownIn and the pointer-events finger match compare with containsAlongFlatTree, as the scroll watch already does: a finger on content inside an open shadow root is down in the scroller around that root, and its touches, retargeted to the shadow host, match its pointer finger, so a claimed pan cancels its moves there (spec:AST-094 FR19, FR20).
…achments asks, and only then The host let the last attachment decide whether an element is an action group (useGestureRecognizer always passes the option), and never recomputed it at a detach: a plain attachment after the group's turned the group off, and a group's attachment released left a recognizer that never asked taking presses under a fine pointer. Fails until the host counts the attachments that ask.
…ents asks The host counts the attachments that pass actionGroup: true and keeps the element a group while one remains, recomputed at each detach. An attachment that passes false, as useGestureRecognizer does by default, no longer turns a group off, and a group's last asking attachment taking its leave ends the group.
… that content The presented hit test takes the document's elementFromPoint, which answers a shadow host for anything inside its open root, and compares with Node.contains, which stops at the boundary: a recognizer on a control inside a moving sheet's shadow root gets no finger, and the tap's click goes to the host. Fails until the hit test descends into open roots and compares along the flat tree.
Where a moving element is drawn away from its layout box, the host hit-tests what is drawn under the finger with the document's elementFromPoint, which answers a shadow host for anything inside its open root. The hit test now descends through each open root's own elementFromPoint and compares with the movers along the flat tree, so a recognizer on a control inside a moving sheet's shadow root gets its finger and the tap clicks that control.
…nt lets go The host's touch-action rules sit in an adopted sheet or a style element per document or shadow root, and were never removed, so a page whose last recognizer detached kept them, against spec:AST-094 FR24 (nothing touch-related remains after the last instance unmounts). Fails until a root's rules go with its last marked element.
…th its last marked element The touch-action writer records which elements it marked in each document or shadow root, and when the last one is unmarked (its last recognizer detached) it removes that root's adopted sheet or style element, so nothing touch-related remains after the last instance unmounts (spec:AST-094 FR24). A later mark writes the rules again; an element marked in another root first lets go of the old one.
… the inline style it reads - The motion registry, the host's engine gate and the README name the presented hit test as an engine workaround (spec:AST-013 FR6) with its review condition (re-measure on each iOS release; remove it once iOS WebKit hit-tests a compositor-moved element where it is drawn) and its regression fixture. - While a curve runs the animator holds the value it starts from inline, so presentation.ts and the README no longer say the inline style holds the end.
…core/internal/touch Core ships the internal entry @astryxdesign/core/internal/touch, which re-exports the gesture primitives for Astryx's own packages, and the Lab-import guard fails a Lab import of core outside core's exports (architecture:react-component-runtime INV13). The README and the barrel's header named internal workspace imports and said nothing here is exported; they now name that entry.
…ill needs the element, and the listeners that cancel The release note, the stream's header, the host's comment and the README said the stream is one passive listener per event type and that a document-capture stopPropagation no longer starves the recognizers. Such a stop never hid a listener on the same node, and some subscriptions cancel. They now say what changed: an app's window-capture stopPropagation, or a document-capture stopImmediatePropagation registered before core, no longer hides a touch; a recognizer that must claim still needs the touch to reach its element; the gesture host's touchend, click and contextmenu cancel while a claimer is attached and the page hold's touchmove while it holds; and the stream stays ahead of an app's window-capture listener only until a type's listener is re-added. The README's list of blocking touchmove listeners gains the claimed touch's target and the document while a claiming element moves.
…default it moves
The {stylexOptions} form of astryxStylex now passes StyleX
treeshakeCompensation: true unless the caller sets it. spec:AST-017 FR3
asks the release note to name the old and new default and the option
that restores the old one; it now does.
…er and for the two stops the input stream fixes - A still finger with sub-pixel jitter over a scroll view keeps its tap and scrolls nothing (spec:AST-094 FR18–FR22). - A tap is still recognized under an app's window-capture stopPropagation, and under a document-capture stopImmediatePropagation registered before core's: the recognizers hear touches on the window's capture phase. Chromium and WebKit pass.
…s once Where nothing that claims is attached, the host's touchend listener is passive and cannot cancel the engine's own click after a retargeted tap clicks what is drawn. The shared click guard swallows that late click whatever is attached; this case pins it, as asked on meta#8293.
…esture host's subscriptions The gesture host subscribes no click: the one cancelling click subscriber is the click guard's, added at a window's first arm and kept. The release note, the stream's header and the gestures README listed click with the host's touchend and contextmenu; they now name the guard's own.
Toast.spec.md records what this branch ships: the `presentation` concept (`adaptive` by default, `toast`, `notification`), the notification swipe in FR4 and its retract in FR5, the released default it changes under a finger, and the current-state bullets and gap text the notification presentation closes (a release moving back springs back, the settle starts at the release velocity, and reduced motion fades on a touch screen). The toast presentation keeps its listed gaps: net travel, a theme-timed settle, a second touch that cancels, and no projection.
There was a problem hiding this comment.
Approval waits on an engineering owner's decision: no current spec states the turn-back stretch or its uncapped 0.55 ratio (spec:AST-094 FR3 asks a drag past an edge to resist with a rubber band, and FR2 wants a dated owner decision to go beyond the 70 pt the banner was measured to), and this head also rewrites the current component:Toast record (FR4, FR5 and the new Presentation concept). Any engineering owner, including you as the author if you are one, can record that decision by commenting /approve-spec <full head SHA> on this pull request, or by saying which part should wait. Whatever is decided, these need fixing:
- Make FR4 in
packages/core/src/Toast/Toast.spec.mdmatch the code: it still says a fast flick toward the edge dismisses, whiletoastSwipe.ts:54keeps a stretched card, and it never mentions the stretch. - Land or drop the 17 open pull requests this branch carries (32,062 authored lines, of which this change is 215), then update the branch from
main. - Back “on every touch device” in
.changeset/toast-swipe-pull-away.mdwith real-device Mobile Safari and Chrome for Android evidence, or narrow the wording to a swipe that already holds the touch.
[Automated review]
| | FR1 | A card carries `toast` with `type` and shows `body` and, on its first line, `endContent` then a dismiss Button named by `@astryx.toast.dismiss`; long body text wraps below. `renderContent` replaces that layout, receives `body`, `endContent`, `type`, timing, and a `dismiss` function, and gets no injected dismiss control. | Current source and tests | | ||
| | FR2 | With auto-hide on (the default for `info`, off for `error`), the card dismisses with reason `auto` after `autoHideDuration` ms. The timer pauses while the pointer is over the card, focus is inside it, a touch or pen gesture is active, or the window is blurred, and resumes with the remaining time (at least 1 s). Implementation gaps: the pause is one flag, so any pause condition ending resumes the timer while another still holds, and a toast raised while the window is already blurred starts its timer (Current-state impact). | Current source and tests | | ||
| | FR3 | The dismiss button, a swipe, a `dismiss` call, or the returned dismiss function dismiss with reason `manual`; `onHide` fires at most once, when the toast is dismissed, even when dismissed twice during its exit. Implementation gap: a toast dismissed before it first renders, through its returned dismiss function in the handler that showed it, never reports `onHide` and lingers in a provider-hosted viewport; with no provider above the caller, a dismissal called before the fallback viewport mounts does nothing, so the toast shows and stays unless it auto-hides (Current-state impact). A toast replaced through `uniqueID` is not dismissed and reports no `onHide`. | Current source and tests | | ||
| | FR4 | A drag toward the position's block edge, from any pointer (`spec:AST-094` FR43), decides once, at release, per `spec:AST-094` FR36–FR37: projected travel past the commit point dismisses, and a release moving back toward the start cancels. In the notification presentation the card stays still for the first `toast.followFrom` px of travel and then follows at `toast.followRatio` of the finger, and a release dismisses when the card is `toast.dismissOffset` out or the finger lifts moving toward the edge at `toast.flickVelocity` or faster, the notification banner's measured values; in the toast presentation the card follows the finger 1:1. A short drag snaps back; horizontal intent or a gesture starting on an interactive descendant does not dismiss; a second touch before the swipe begins leaves the page its pinch, and one after it begins leaves it going (`spec:AST-094` FR10). Native page scrolling continues until touch intent matches the dismiss edge. In the default layout the visible dismiss button stays as a non-gesture alternative; custom content supplies its own. Implementation gaps: the toast presentation dismisses on net travel past a distance threshold or a flick, even after the finger moves back, and a second touch cancels its swipe; neither presentation projects travel; and only touch and pen drags are recognized, not a mouse (Current-state impact). | Current source and tests | |
There was a problem hiding this comment.
FR4 says a release dismisses when the finger lifts moving toward the edge at toast.flickVelocity or faster, but at this head isDismissRelease keeps a card stretched away from the edge on that flick (toastSwipe.ts:54), and the card follows a turn-back away from the edge (toastSwipe.ts:29-35), which FR4 never mentions. Please state the stretch and the at-or-past-rest flick condition here at the head owners approve, or drop the stretch.
| if (past <= 0) { | ||
| return 0; | ||
| } | ||
| return Math.sign(fingerTravel) * toast.followRatio * past; |
There was a problem hiding this comment.
This keeps the 0.55 follow linear with no bound, past the 70 pt the banner was measured to (motion/uikit/toast.ts:63-65): a 300 px reversal holds the card about 157 px below rest. spec:AST-094 FR3 asks a drag past an edge to resist with UIKit's rubber band, and FR2 lets an owner decision depart from a measurement only by naming its date and that measurement, so this waits on an engineering owner's decision.
| '@astryxdesign/core': patch | ||
| --- | ||
|
|
||
| [fix] Under a finger (a coarse primary pointer, on every touch device), a Toast swipe that turns back away from the toast's edge now stretches the card the same way, at about half the finger's travel past the first 14 px, and springs it back on release, as iOS notification banners do; a release there never dismisses, however fast the finger flicks back toward the edge. Before, once the swipe had the touch, such a drag moved neither the card nor the page. With a fine pointer nothing changes. |
There was a problem hiding this comment.
“On every touch device” is broader than the evidence: the description's Mobile Safari simulator run of this stroke shows the browser taking the touch at 10 pt and the card never moving, and spec:AST-094 Platform support asks for real-device evidence for iOS Safari and Android Chrome claims. Please add that evidence or narrow the wording to a swipe that already holds the touch.
Depends on #8121 (and its predecessors). Review only this PR's change: vjeux/astryx@2b59f30...260694b
Primary intent
Under a finger, a toast swipe that turns back away from the edge now stretches the card and springs it back, like iOS notification banners; that drag was dead.
User or maintainer impact
Each path: a named test, and a clip where marked. Recorded on the iOS 26.2 simulator.
A drag starting away from the edge, or turning back within 10 pt, stays the page's; fine pointers: unchanged.
Problem and solution fit
On the iOS 26.2 simulator the banner's pull-down tracks at 0.55 × (travel − 14) (60 pt: 25.3; 70 pt: 31.3) and springs back; past ~75 pt it opens an expanded view a toast lacks, so the card keeps the ratio. One function becomes symmetric (
followOffset); such a release springs back. No new values.Authority
spec:AST-094: one touch rule (FR13), measured values (FR1, from feat(Toast): the swipe follows iOS notification banners under a finger #8121); a release moving back springs back (FR37) from its velocity (FR38).design:reduced-motion: the cross-fade.Owner decisions (proposed; pending owner review):
Change and evidence
toastSwipe.ts:followOffsetfollows either way; a stretched card's release never dismisses.Scope
Size: +190 / −25 (tests 144). Toast's import (the CI's measurement): JS 93,254 → 93,267 B gzip; no CSS change.
Testing
pnpm exec vitest run packages/core/src/Toast/ packages/core/src/motion/: 830 pass (29 files), with no unhandled error (vitest exits 0); the turn-back tests (a turn-back after the swipe began at 10 pt) fail on feat(Toast): the swipe follows iOS notification banners under a finger #8121's head, and the flick-back ones (a card pulled 40 px down, flicked 20 px back up in 30 ms, springs back;isDismissRelease(followOffset(-80), flickVelocity)is false) fail on the previous head. A drag that turns back short of rest and lifts moving back springs back (feat(Toast): the swipe follows iOS notification banners under a finger #8121'sspec:AST-094FR37 test).pnpm test:interaction ToastSwipe: Chromium 26/26; WebKit (the harness container script) 21 passed, 5 skips (3 Chromium-only; 2 Chromium pen tests). Real touch with a coarse pointer, no engine emulation and no native scroll.pnpm build, the Storybook build,pnpm typecheckandCI=true pnpm lint(0 errors): clean. A merge-tree withmain(90da4a7) is clean (rc 0). The touch-module bundle test's "is absent from the root entry" red (scripts/touch-support-bundle.test.mjs, frommain's refactor(core): one shared touch module that components import directly, reached by Lab through internal/touch #8465) is the one test(core): a touch component's import carries its gesture code, and nothing else does #8671 resolves.