Skip to content

feat(lift): one opt-in lift-from-trigger presentation - #8485

Draft
vjeux wants to merge 1823 commits into
meta:mainfrom
vjeux:uikit/c20-lift
Draft

vjeux wants to merge 1823 commits into
meta:mainfrom
vjeux:uikit/c20-lift

Conversation

@vjeux

@vjeux vjeux commented Oct 26, 2026 •

Copy link
Copy Markdown
Contributor

Depends on #8342 (input hold), #8329 (rect morph) and #8186 (exit copy), on #8076. This PR's own commits (the rest are merges): vjeux/astryx@710abf2...2c5b18c, vjeux@ca08c2287b, vjeux@c0515fa59e, vjeux@6004a1ec5f, vjeux@64307402b7, vjeux@5eafd96729, vjeux@e238de662f, vjeux@4b0701b302, vjeux@b78832fea4, vjeux@a42b7403dc

Maintainer impact

The UIKit-parity program brings iOS 26's touch presentations to Astryx, and two of them lift their trigger: ContextMenu's long-press preview (#8201) and Lightbox's zoom (#8231). Each was building its own copy: ContextMenu's clone mounted the trigger's content twice, as a second React tree, and Lightbox kept its own zoom copy, so the two motions would drift apart while the page paid for both.

Intended invariant

architecture:layer-runtime INV15 (one opt-in lift module, apart from the runtime's hold and exit copy), architecture:component-style-authoring INV7 and spec:AST-017 FR60 (nothing at rest, at most five elements lifted), and spec:AST-107 FR7 (a listed public-API gap, so it stays internal).

Change

Three options: keep each surface's own copy (two implementations, ContextMenu's tree doubled); clone the trigger's DOM (a clone of a React-owned trigger loses its state and listeners); or lift the trigger itself into the top layer, an empty placeholder holding its spot. This takes the third: packages/core/src/liftFromTrigger/ exposes createLiftFromTrigger() and useLiftFromTrigger(). Lightbox's copy must sit between the viewer's backdrop and its photo, so liftCopy(thumbnail, {host}) makes one picture element in the viewer and hides the thumbnail in place. Everything moves on the shared rect morph. Nothing imports the module yet.

Evidence

  • Before, ContextMenu's preview mounted the trigger twice; on this module, one trigger lifts.
  • Opening ContextMenu's touch story in Chromium at 4× CPU slowdown: 51–71 ms of main thread before, 38–54 ms after; closing, 38–57 ms before, 22–41 ms after. Twenty opens and closes leave nodes and listeners at baseline.

Scope

  • No intended public API, product behavior, visual direction, or policy change.
  • Product changes discovered during the work were removed or split.
  • Public text and artifacts contain no internal Meta context.

Testing

In the lift fixture (pnpm test:interaction packages/core/src/liftFromTrigger, Chromium and WebKit):

  1. Lift a list item: it rises into the top layer at its size, its list keeps only li children, and its shadow stays under it on every frame.
  2. Drop it while it grows: it turns around without a jump and lands; ten lifts leave no node or listener behind.
  3. Zoom a thumbnail with liftCopy: one picture appears in the viewer at the thumbnail's box, and the drop brings the thumbnail back.
  4. Tap while it grows: nothing receives the tap.

The unit tests (pnpm vitest run packages/core/src/liftFromTrigger) cover the same and the geometry. The touch-support bundle's "is absent from the root entry" failure is unrelated (#8671).

Writing rubric results

R1–R6: no narration, research, evidence-cell changes, rejected alternatives, change references or open questions; the layer-runtime gaps paragraph only states which gaps remain.

@vercel

vercel Bot commented Oct 26, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
astryx Ready Ready Preview Oct 29, 2026 10:39pm UTC

Request Review

@astracat-bot

astracat-bot Bot commented Oct 26, 2026 •

Copy link
Copy Markdown

AI review status for this pull request.

Review status Updated
❓ Needs maintainer input (for maintainers only) Oct 29, 2026, 10:59 PM UTC

@astracat-bot astracat-bot Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approval is on hold for an engineering owner's spec decision: the branch adds architecture:layer-runtime INV13 and its Exit copy section, rewrites the gesture-tuning ruling in spec:AST-057, and ships a press-feedback exception to spec:AST-094 FR19 that its own README calls pending. An engineering owner can record approval of the head's records by commenting /approve-spec <full head SHA> on this pull request (the author may do this as an engineering owner), while the FR19 exception needs its amendment on main or should come out. Separately, please land the stacked dependencies and rebase so this pull request carries only the lift commit, since the branch now has 39,463 authored changed lines.

  • .changeset/touch-selection-lock.md announces a [fix] for sliders, switches and segmented controls that no component is wired to here.
  • liftScale in packages/core/src/lift/liftGeometry.ts bounds only the width, so a trigger taller than the viewport lifts past the bottom gutter and surfacePlacement puts its menu above the top.

[Automated review]

width > 0
? (viewport.width - 2 * viewport.gutter.inline) / width
: Infinity;
return Math.min(rule.maxScale, (side + rule.scaleUpPoints) / side, fitsWidth);

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

A source taller than the viewport less its gutters is never scaled to fit: only the width is bounded here, so liftedRect pins it to the top gutter and it overflows the bottom (a 358×900 card on a 390×844 viewport with 16 px gutters ends at 916 px, past the 828 px gutter line), and surfacePlacement then answers above. Bounding the factor by (viewport.height - gutter.top - gutter.bottom) / height as well would keep it inside.

Comment thread .changeset/touch-selection-lock.md Outdated
'@astryxdesign/core': patch
---

[fix] Under a finger or pen, holding a control whose hold does something (a slider's thumb, a switch's or a segmented control's drag) no longer starts text selection or the iOS callout; they come back when the finger lifts. A control or row whose hold does nothing keeps the browser's long-press selection. Text fields keep their selection, a link keeps its native menu and preview, and where the primary pointer is fine (a mouse, a trackpad, a touchscreen laptop, a desktop pen tablet) every contact keeps desktop selection. There, the press controller also registers no touch listener.

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This [fix] note says sliders, switches and segmented controls stop starting text selection under a held finger, but no component takes the selection lock in this pull request, so the changelog would announce a fix users do not get. Consider limiting it to what ships here (the press controller's touchcancel listener only on a coarse primary pointer).

correct, and the runtime polls nothing: an anchor that a scrolled
container hides is followed again when an intersection observer reports it
back in view.
- **INV13 — One exit copy per closing layer.** A layer's close plays on at most

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

INV13 is a new invariant that main does not state yet; it needs an engineering owner's approval (/approve-spec <full head SHA>) before this record change can be relied on.

under a fine pointer: attach touch work under a touch presentation. The
one carve-out is a recognizer or press tracker that reads each event's
pointer itself, as `spec:AST-057`'s row swipe does, or a press tracker that
paints press feedback (an FR19 exception for press feedback only, pending

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This press-feedback exception contradicts spec:AST-094 FR19 as it stands on main (no recognizer attaches where the primary pointer is fine, apart from AST-057's row swipe); FR19 needs its amendment on main, or the exception should come out of this branch.

vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
# Conflicts:
#	packages/core/src/motion/README.md
vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
# Conflicts:
#	packages/cli/assets/docs/motion.doc.mjs
#	packages/cli/test/__golden__/no-icon-set/docs-topics.json
#	packages/core/src/motion/roleKinds.generated.ts
vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026

@astracat-bot astracat-bot Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Approval is on hold for an engineering owner's spec decision: the branch adds architecture:layer-runtime INV13 and its Exit copy section, rewrites the gesture-tuning ruling in spec:AST-057, and ships a press-feedback exception to spec:AST-094 FR19 that its own README calls pending. An engineering owner can approve the head's records by commenting /approve-spec <full head SHA> on this pull request (the author may do so as an engineering owner), while the FR19 exception needs its amendment on main or should come out. Separately, please land the stacked dependencies and rebase so this pull request carries only the lift (31,587 authored changed lines today), and fix these:

  • createLayer in packages/core/src/lift/lift.ts gives the viewport-covering lift layer touch-action: none, so a pinch cannot zoom the page while a trigger is lifted (spec:AST-094 FR10, FR35); touch-action: pinch-zoom still keeps one-finger pans off.
  • liftScale in packages/core/src/lift/liftGeometry.ts bounds only the width, so a trigger taller than the viewport less its gutters lifts past the bottom gutter, and surfacePlacement then answers above with no room there.
  • The spec:AST-057 edit calls the row's motion roles theme motion roles and drops durations from its Not public list, which spec:AST-094 FR4 and DEC-11 do not allow yet.

[Automated review]

color: 'inherit',
overflow: 'visible',
pointerEvents: 'auto',
touchAction: 'none',

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This layer covers the viewport and takes the page's touches, so touch-action: none here blocks page pinch-zoom for as long as the trigger is lifted, including through the presentation hold's shield, which is appended inside this layer. spec:AST-094 FR10 keeps pinch-zoom the browser's whenever no pinch recognizer claims the fingers, and FR35 says a pinch still zooms while the presentation grows. touchAction: 'pinch-zoom' keeps one-finger pans off and pinch-zoom on, as the shield in presentationHold.ts already does.

- **Gesture tuning.** Axis-lock distance, commit ratio, fling velocity,
resistance past the panel: behavior constants in source, not public API and
not design tokens (the same ruling the touch press model received for its
clocks). The row's slide and spring motion plays on theme motion roles

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

spec:AST-094 FR4 keeps motion roles internal until the public motion-token set is decided (DEC-11), so "theme motion roles" here, with durations gone from the Not public list below, promises a theming surface no record allows yet. Saying the row's slide and spring motion plays on its internal motion roles (FR4, DEC-11) would keep the two records consistent.

@cixzhang

Copy link
Copy Markdown
Contributor

Posted by Cindy's agent on her behalf.

A naming change to match the records: please rename the module and its exports from lift to liftFromTrigger, for example liftFromTrigger/ and createLiftFromTrigger (architecture:layer-runtime INV15 calls it the lift-from-trigger module). In spec:AST-094, "lift" means the finger leaving the screen, so a bare lift name would read as that. If this stays idle, we'll make the rename after about 30 minutes, keeping your authorship.

@vjeux

vjeux commented Oct 26, 2026

Copy link
Copy Markdown
Contributor Author

On it. This pull request's next push renames the module and its exports to match architecture:layer-runtime INV15:

  • packages/core/src/liftFromTrigger/
  • createLiftFromTrigger, useLiftFromTrigger and the exported types

ContextMenu's imports follow in #8201. That push also folds the new foundation heads.

vjeux added a commit to vjeux/astryx that referenced this pull request Oct 26, 2026
@vjeux

vjeux commented Oct 26, 2026

Copy link
Copy Markdown
Contributor Author

Renamed in 6004a1e: liftFromTrigger/, createLiftFromTrigger and the related types.

vjeux added 27 commits October 29, 2026 10:04
…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.
meta#8360 carries this pull request's predecessors and the review fixes of
the foundation it holds; this pull request's own diff is now its six
commits (a second finger fails a one-finger pan wherever fingers come
from, and the check reruns once that finger is delivered; a press's
selection lock gets what it landed on; a pinch's second finger on another
pan claims neither; the wider-band edge pan's real-touch proof; text).
Two conflicts:
- GestureHost.ts: the selection lock's target takes meta#8360's presented
  target, which is what the press landed on unless an element under it
  is moving, so it keeps this pull request's fix and meta#8293's correction.
- .changeset/gesture-press-tracking.md: meta#8360's text, which names both
  writers of the press attribute.
Takes meta#8360's head, which removes a document's or shadow root's
touch-action rules with its last marked element and names the build
changeset's treeshakeCompensation default, in place of 1e1431f.
…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.
Folds this pull request onto the canonical gesture foundation, meta#8360's
head, which carries meta#8076, and onto main, in place of the old meta#8076 and
harness copies it carried. The one conflict is the motion README's Files
table: meta#8360's table, with this pull request's progress.ts row added
after presentation.ts.
Folds this pull request onto the canonical gesture foundation, meta#8360's
head, which carries meta#8076, and onto main, in place of the old meta#8076 and
harness copies it carried. No conflicts.
Folds this pull request onto meta#8340's head (the animator's presentation
start, on meta#8360 and main) and meta#8497's new head (the progress module, on
meta#8360 and main), in place of the old copies of meta#8340, meta#8497, meta#8076 and the
harness it carried. No conflicts.

@astracat-bot astracat-bot Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This pull request is on hold until an engineering owner decides two spec edits on this branch that no record on main states: the new architecture:layer-runtime INV13 with its Exit copy section and rows, and the spec:AST-057 edit that moves the swipe row's slide and spring timing onto "theme motion roles". An engineering owner records that decision by commenting /approve-spec <full head SHA> on this pull request, and the author may do so as an engineering owner. Whatever the decision, please land the four stacked pull requests and rebase so this one carries only the lift (35,505 authored lines today), and address these:

  • The lift layer that covers the viewport is touch-action: none (createLayer in liftFromTrigger.ts), so a pinch cannot zoom the page while a trigger is lifted, which spec:AST-094 FR10, FR32 and FR35 require; touch-action: pinch-zoom still keeps one-finger pans off.
  • liftFromTriggerScale bounds only the width and surfacePlacement answers above without checking the room there, so a tall trigger lifts past the bottom gutter and its menu can open above the screen.
  • The merged gesture host attaches only where the primary pointer is coarse, while spec:AST-094 FR19 and FR43 and architecture:react-component-runtime INV13 have gestures attach for every pointer.
  • The spec:AST-057 text says the row's motion plays on theme motion roles, but the row still settles on its 200 ms SWIPE_SETTLE_MS constant.

[Automated review]

This branch was successfully deployed

1 active deployment
Preview — 25c99bf0 Deployed Oct 29, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot. needs:design-review Affects visuals — Design should review needs:spec-owner-review Current knowledge records await owner approval

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants