@satinhq/kit 0.1.0-beta.1 → 0.1.0-beta.3

package/dist/glass/webgpu/raster.js

@@ -96,6 +96,48 @@ export class WebGPURaster {
     overlayPipeline;
     presentPipeline;
     format = 'rgba8unorm';
+    presentationRoot;
+    presentationOrigin;
+    presentationMembers = new Set();
+    presentationSequence;
+    collectingPresentation = false;
+    /** Member samples encode their materials first. The root then presents the whole frame once. */
+    withSharedPresentation(draw) {
+        this.collectingPresentation = true;
+        try {
+            draw();
+        }
+        finally {
+            this.collectingPresentation = false;
+        }
+    }
+    /** Retain independent material sampling, but store overlapping fixed chrome once. */
+    joinPresentation(root, origin) {
+        if (this.presentationRoot === root) {
+            this.presentationOrigin = origin;
+            if (root.setup)
+                root.resizeCanvas();
+            return;
+        }
+        if (this.setup)
+            this.clear();
+        this.presentationRoot?.presentationMembers.delete(this);
+        this.presentationRoot = root;
+        this.presentationOrigin = origin;
+        root.presentationMembers.add(this);
+        if (root.setup)
+            root.resizeCanvas();
+        root.forgetPresent();
+    }
+    leavePresentation() {
+        const root = this.presentationRoot;
+        root?.presentationMembers.delete(this);
+        if (root?.setup)
+            root.resizeCanvas();
+        root?.forgetPresent();
+        this.presentationRoot = undefined;
+        this.presentationOrigin = undefined;
+    }
     lost = false;
     suspended = false;
     covered = false;
@@ -152,6 +194,8 @@ export class WebGPURaster {
         this.setup = { ...this.setup, appearance, spec: retainedAppearanceSpec(spec, appearance) };
     }
     dispose() {
+        this.presentationRoot?.presentationMembers.delete(this);
+        this.presentationRoot?.forgetPresent();
         this.unsubscribe?.();
         this.release();
         this.passes.destroy();
@@ -571,7 +615,13 @@ export class WebGPURaster {
         const encoder = this.device?.createCommandEncoder();
         if (!encoder || !this.encodeResult(encoder, x))
             return;
-        this.custom(encoder, this.presentPipeline, drawable(this.context, 'single', encoder).createView(), this.presentUniform(), [this.targets.result], !clear, this.presentScissor(), [this.canvas.width, this.canvas.height]);
+        if (this.presentationRoot) {
+            const root = this.presentationRoot;
+            if (!root.collectingPresentation && root.targets.result)
+                WebGPURaster.presentLayer(encoder, root.presentationSequence ?? [root]);
+        }
+        else
+            this.custom(encoder, this.presentPipeline, drawable(this.context, 'single', encoder).createView(), this.presentUniform(), [this.targets.result], !clear, this.presentScissor(), [this.canvas.width, this.canvas.height]);
         if (this.timing) {
             encoder.resolveQuerySet(this.timing.queries, 0, 2, this.timing.resolve, 0);
             encoder.copyBufferToBuffer(this.timing.resolve, 0, this.timing.read, 0, 16);
@@ -601,18 +651,34 @@ export class WebGPURaster {
      * region presenter's layer already is its sample rectangle and keeps layer space. */
     localResult = false;
     /** Device-pixel offset of this layer's canvas within its layer. */
-    canvasOffset() {
+    presentationViewport() {
         const viewport = canvasViewports.get(this.canvas);
+        if (!viewport || !this.setup || !this.presentationMembers.size)
+            return viewport;
+        // The placeholder keeps its original band. object-fit:contain, aligned to the
+        // bottom, lets the worker omit transparent rows above all retained morph bounds.
+        const top = Math.max(viewport[1], Math.floor(Math.min(this.setup.spec.frameY - 64, ...[...this.presentationMembers].map(member => member.presentationOrigin.y))));
+        return [viewport[0], top, viewport[2], viewport[1] + viewport[3] - top];
+    }
+    canvasOffset() {
+        const viewport = this.presentationViewport();
         const resolution = this.setup.resolution;
         return viewport ? [viewport[0] * resolution, viewport[1] * resolution] : [0, 0];
     }
     canvasSize() {
-        const viewport = canvasViewports.get(this.canvas);
+        const viewport = this.presentationViewport();
         const { resolution, width, height } = this.setup;
         return viewport
             ? [Math.round(viewport[2] * resolution), Math.round(viewport[3] * resolution)]
             : [Math.round(width * resolution), Math.round(height * resolution)];
     }
+    resizeCanvas() {
+        const [width, height] = this.canvasSize();
+        if (this.canvas.width !== width)
+            this.canvas.width = width;
+        if (this.canvas.height !== height)
+            this.canvas.height = height;
+    }
     /** Size the shared layer canvas to a band of its layer (the element is placed there by
      * the page): a lift overlay presents a strip, not a second full-screen canvas. */
     setCanvasViewport(viewport) {
@@ -694,20 +760,21 @@ export class WebGPURaster {
      * `presentedLayers`): the same results at the same places, or nothing at all. */
     static presentLayer(encoder, rasters) {
         const root = rasters[0];
-        const visible = rasters.filter(raster => !raster.resultEmpty);
+        root.presentationSequence = rasters;
+        const visible = [...new Set([...rasters, ...root.presentationMembers])].filter(raster => !raster.resultEmpty && !!raster.targets.result && !raster.covered && !raster.suspended);
         const signature = JSON.stringify([
             root.canvas.width,
             root.canvas.height,
             visible.map(raster => [
                 raster.resultOwner,
                 raster.resultRevision,
-                raster.presentUniform(),
-                raster.presentScissor(),
+                raster.groupPresentUniform(root),
+                raster.groupPresentScissor(root),
             ]),
         ]);
         if (presentedLayers.get(root.canvas) === signature)
             return false;
-        const draws = visible.map(raster => raster.presentDraw());
+        const draws = visible.map(raster => raster.presentDraw(root));
         const size = [root.canvas.width, root.canvas.height];
         encodePass(encoder, {
             colorAttachments: [
@@ -734,8 +801,35 @@ export class WebGPURaster {
         presentedLayers.set(root.canvas, signature);
         return true;
     }
-    presentDraw() {
-        const buffer = this.passes.uniform(new Float32Array(this.presentUniform()));
+    presentationOffset(root) {
+        if (this.presentationRoot !== root || !this.presentationOrigin)
+            return [0, 0];
+        const resolution = this.setup.resolution;
+        const [x, y] = this.canvasOffset();
+        const [rootX, rootY] = root.canvasOffset();
+        return [
+            this.presentationOrigin.x * resolution + x - rootX,
+            this.presentationOrigin.y * resolution + y - rootY,
+        ];
+    }
+    groupPresentUniform(root) {
+        const values = this.presentUniform();
+        const [x, y] = this.presentationOffset(root);
+        values[0] += x;
+        values[1] += y;
+        values[8] += x;
+        values[9] += y;
+        return values;
+    }
+    groupPresentScissor(root) {
+        const rect = this.presentScissor();
+        if (!rect)
+            return rect;
+        const [x, y] = this.presentationOffset(root);
+        return [rect[0] + x, rect[1] + y, rect[2], rect[3]];
+    }
+    presentDraw(root) {
+        const buffer = this.passes.uniform(new Float32Array(this.groupPresentUniform(root)));
         const group = this.device.createBindGroup({
             layout: this.presentPipeline.getBindGroupLayout(0),
             entries: [
@@ -744,7 +838,7 @@ export class WebGPURaster {
                 { binding: 2, resource: viewOf(this.targets.result.texture) },
             ],
         });
-        return { raster: this, group, rect: this.presentScissor() };
+        return { raster: this, group, rect: this.groupPresentScissor(root) };
     }
     /** Scroll-attached glass is part of the scrolling content, and the navigation bar's scroll-edge
      * effect is painted over that content (CSS, a layer above the scroll container). Its own
@@ -946,11 +1040,7 @@ export class WebGPURaster {
         const setup = this.setup;
         const { spec, appearance, resolution } = setup;
         const targets = this.targets;
-        const [canvasWidth, canvasHeight] = this.canvasSize();
-        if (this.canvas.width !== canvasWidth)
-            this.canvas.width = canvasWidth;
-        if (this.canvas.height !== canvasHeight)
-            this.canvas.height = canvasHeight;
+        this.resizeCanvas();
         const sampleRect = this.sampleRectangle();
         this.presentRect = sampleRect;
         // Result space = layer space shifted by an integer pixel origin, so every kernel

package/dist/glass/webgpu/rasterMaterial.d.ts

@@ -13,6 +13,10 @@ export declare function usesBarKernel(spec: ResultLayout['spec']): boolean;
  * its accessory, toolbar and glass buttons. Menus and presentation treatments keep the chained
  * pyramid their materials were fitted on. */
 export declare function usesAreaMips(spec: ResultLayout['spec']): boolean;
+/** The tab material does not paint its 128 pt backdrop overscan. Keep a generous
+ * 64 pt output margin around every capsule; the fitted bar shadow has radius 4 pt
+ * and offset 8 pt. The source and blur pyramid still retain their full sample area. */
+export declare function tabMaterialBounds(spec: ResultLayout['spec']): number[] | undefined;
 export declare function encodeMaterial(encoder: GPUCommandEncoder, passes: Passes, targets: Record<string, Target>, layout: ResultLayout, material: Values): void;
 /** The tab bar's selection pill (native selection recipe) and, while the pill lifts, its lens,
  * over a composed scratch of the backdrop and the bar material. */

package/dist/glass/webgpu/rasterMaterial.js

@@ -25,9 +25,25 @@ export function usesBarKernel(spec) {
 export function usesAreaMips(spec) {
     return usesBarKernel(spec);
 }
+/** The tab material does not paint its 128 pt backdrop overscan. Keep a generous
+ * 64 pt output margin around every capsule; the fitted bar shadow has radius 4 pt
+ * and offset 8 pt. The source and blur pyramid still retain their full sample area. */
+export function tabMaterialBounds(spec) {
+    if (!spec.tabSelection || spec.materialProfile !== 'chrome' || spec.treatment)
+        return undefined;
+    const members = spec.shape.members?.length
+        ? spec.shape.members
+        : [spec.shape.first, ...(spec.shape.second ? [spec.shape.second] : [])];
+    const margin = 64 + (Math.max(0, spec.shape.blendRadius) * (members.length - 1)) / 4;
+    const left = Math.min(...members.map(s => s.centerX - s.halfWidth)) + spec.sampleInsetX - margin;
+    const right = Math.max(...members.map(s => s.centerX + s.halfWidth)) + spec.sampleInsetX + margin;
+    const top = Math.min(...members.map(s => s.centerY - s.halfHeight)) + spec.sampleInsetY - margin;
+    const bottom = Math.max(...members.map(s => s.centerY + s.halfHeight)) + spec.sampleInsetY + margin;
+    return [left, top, right - left, bottom - top];
+}
 export function encodeMaterial(encoder, passes, targets, layout, material) {
     const { spec, appearance, resolution, sampleWidth, sampleHeight } = layout;
-    const fieldBounds = morphFieldSampleBounds(spec);
+    const fieldBounds = tabMaterialBounds(spec) ?? morphFieldSampleBounds(spec);
     const fieldScissor = fieldBounds?.map(value => value * resolution);
     const first = spec.shape.first;
     if (spec.treatment === 'contextBackdrop' || spec.treatment === 'contextPreview') {

package/dist/glass/webgpu/regionScene.d.ts

@@ -186,7 +186,8 @@ export declare class RegionScene {
     private owner;
     /** Worker-to-page events (a close morph that ended, so its panel can be torn down). */
     private notify;
-    constructor(owner: LayerDevice, notify?: (event: GlassRegionEvent) => void, submissionAllowed?: () => boolean);
+    private readonly chrome?;
+    constructor(owner: LayerDevice, notify?: (event: GlassRegionEvent) => void, submissionAllowed?: () => boolean, chrome?: WebGPURaster);
     request(request: GlassRendererRequest): Promise<unknown>;
     /** New source images (uploads) since the last install: only those need a completion fence. */
     private presentationReceipt;
@@ -200,6 +201,8 @@ export declare class RegionScene {
         height: number;
         pixels: Uint8Array<ArrayBuffer>;
     }>;
+    /** Geometry sampled for the frame trace, in viewport points. No DOM measurements. */
+    accessoryGeometry(): string;
     diagnostics(): {
         navigation: {
             key: string;

package/dist/glass/webgpu/regionScene.js

@@ -1132,7 +1132,9 @@ export class RegionScene {
     owner;
     /** Worker-to-page events (a close morph that ended, so its panel can be torn down). */
     notify;
-    constructor(owner, notify = () => { }, submissionAllowed = () => true) {
+    chrome;
+    constructor(owner, notify = () => { }, submissionAllowed = () => true, chrome) {
+        this.chrome = chrome;
         this.submissionAllowed = () => !this.sourcePending && submissionAllowed();
         this.owner = owner;
         this.notify = notify;
@@ -1683,6 +1685,12 @@ export class RegionScene {
                     width: bounds.width,
                     height: bounds.height,
                 };
+            if (this.chrome) {
+                if (region.accessoryTrack?.held && p.descriptor.role === 'material')
+                    p.raster?.joinPresentation(this.chrome, p.descriptor.origin);
+                else
+                    p.raster?.leavePresentation();
+            }
             const viewportTrack = region.presentationViewportTrack ?? region.accessoryViewportTrack ?? region.accessoryTrack;
             const accessoryTranslation = viewportTrack && !held ? accessoryOffset(viewportTrack, this.trackClock()) : undefined;
             const viewport = held
@@ -1902,6 +1910,8 @@ export class RegionScene {
                     p.raster.setViewport(viewport);
                 p.raster.setSubmissionGate(this.submissionAllowed);
                 await p.raster.init(p.canvas, this.owner, region.layer, p.descriptor);
+                if (this.chrome && region.accessoryTrack?.held && p.descriptor.role === 'material')
+                    p.raster.joinPresentation(this.chrome, p.descriptor.origin);
                 p.raster.setVisible(this.visible);
                 fence = true;
             }
@@ -2070,6 +2080,25 @@ export class RegionScene {
             throw Error('Unknown glass presenter snapshot ' + id);
         return raster.snapshot();
     }
+    /** Geometry sampled for the frame trace, in viewport points. No DOM measurements. */
+    accessoryGeometry() {
+        return JSON.stringify([...this.presenters.values()].flatMap(p => {
+            const region = this.scene.regions.find(r => r.id === p.descriptor.regionIds[0]);
+            const spec = p.raster?.spec;
+            if (!region?.accessoryTrack || !spec || p.descriptor.role !== 'material')
+                return [];
+            const shape = spec.shape.first;
+            return [
+                {
+                    region: region.id,
+                    left: p.descriptor.origin.x + spec.frameX + shape.centerX - shape.halfWidth,
+                    right: p.descriptor.origin.x + spec.frameX + shape.centerX + shape.halfWidth,
+                    top: p.descriptor.origin.y + spec.frameY + shape.centerY - shape.halfHeight,
+                    inkLayers: spec.ink?.layers.length ?? 0,
+                },
+            ];
+        }));
+    }
     diagnostics() {
         return {
             navigation: this.navigation

package/dist/glass/webgpu/renderer.js

@@ -65,7 +65,7 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
     const raster = new WebGPURaster();
     raster.setSubmissionGate(submissionAllowed);
     const layers = new Map([['chrome', raster]]);
-    const appRegions = new RegionScene(owner, event => emit({ glassEvent: event }), submissionAllowed);
+    const appRegions = new RegionScene(owner, event => emit({ glassEvent: event }), submissionAllowed, clock.kind === 'worker-raf' ? raster : undefined);
     let tab = new TabMotion(), sharedTabLift = false, reducedMotion = false;
     const menuLift = new TabMotion(TAB_INTERACTIVE_MOTION);
     let tabTiming;
@@ -435,8 +435,15 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
                 restart: restarted,
             };
             loopSample = undefined;
-            appRegions.sample(at, sampleAt);
-            render(x, [], sampleAt);
+            if (clock.kind === 'worker-raf')
+                raster.withSharedPresentation(() => {
+                    appRegions.sample(at, sampleAt);
+                    render(x, [], sampleAt);
+                });
+            else {
+                appRegions.sample(at, sampleAt);
+                render(x, [], sampleAt);
+            }
         }
         catch (error) {
             frameContext = undefined;
@@ -481,7 +488,16 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
                     late: 0,
                     interval: previous === undefined ? null : at - previous,
                     restart: restarted,
-                    clock: 'page-raf',
+                    clock: clock.kind ?? 'page-raf',
+                    homeLeft: raster.spec &&
+                        raster.spec.frameX +
+                            raster.spec.shape.first.centerX -
+                            raster.spec.shape.first.halfWidth,
+                    homeRight: raster.spec &&
+                        raster.spec.frameX +
+                            raster.spec.shape.first.centerX +
+                            raster.spec.shape.first.halfWidth,
+                    accessoryGeometry: clock.kind === 'worker-raf' ? appRegions.accessoryGeometry() : undefined,
                     callbackDelayMs,
                     presented: takePresentedCanvases(),
                     tabCentre: tab.frame.centre,
@@ -509,7 +525,7 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
         }
     };
     owner.subscribe(device => {
-        frameProbe.useDevice(device);
+        frameProbe.useDevice(device, clock.kind !== 'worker-raf');
         lost = !device;
         if (!device) {
             cancel();
@@ -934,7 +950,7 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
                     }
                     break;
                 case 'capability':
-                    frameProbe.useDevice(await owner.ready());
+                    frameProbe.useDevice(await owner.ready(), clock.kind !== 'worker-raf');
                     value = { backend: 'webgpu', timestampQuery: frameProbe.timestampQuery };
                     break;
                 case 'init':
@@ -1291,7 +1307,7 @@ export function createWebGPURenderer(emit, clock = documentFrameClock) {
                         callbacks,
                         framePending: !!handle,
                         rate: 60,
-                        clock: 'page-raf',
+                        clock: clock.kind ?? 'page-raf',
                         visible,
                         presentationGate: {
                             allowed: submissionAllowed(),

package/dist/glass/webgpu/sourcePixels.d.ts

@@ -19,13 +19,12 @@ export declare class SourcePixels {
     private worker?;
     private next;
     private failure?;
+    private retrying?;
     private pending;
     private create;
     constructor(create?: () => Transport);
-    /** The upload worker failed (its device was lost, or a reply never came). The instance stays
-     * failed for images that need the worker: the bounded recovery of a source preparation replaces
-     * it (`ProductionGlassRuntime.replaceFailedSourcePixels`), so a failure is reported once per
-     * attempt and never retried in a loop. Canvas readbacks do not use the worker and still work. */
+    /** Exhausted upload failures let the production owner replace this source stager.
+     * Canvas readbacks remain available because they do not use the worker. */
     get failed(): boolean;
     private fail;
     /** Stage `image`'s premultiplied bytes for its upload (`takeSourcePixels`). When `capture` is a
@@ -39,4 +38,5 @@ export declare class SourcePixels {
      * in WebKit (157 ms for a 1320 x 5091 capture in the Catalyst host), more than half of the
      * stage. Measured for captures up to 1320 x 6495; the cause inside WebKit was not sampled. */
     prepare(image: ImageBitmap, capture?: ImageBitmapSource): Promise<void>;
+    private prepareOnce;
 }

package/dist/glass/webgpu/sourcePixels.js

@@ -32,6 +32,7 @@ export class SourcePixels {
     worker;
     next = 0;
     failure;
+    retrying;
     pending = new Map();
     create;
     constructor(create = () => new Worker(new URL('./sourcePixels.worker.js', import.meta.url), {
@@ -40,10 +41,8 @@ export class SourcePixels {
     })) {
         this.create = create;
     }
-    /** The upload worker failed (its device was lost, or a reply never came). The instance stays
-     * failed for images that need the worker: the bounded recovery of a source preparation replaces
-     * it (`ProductionGlassRuntime.replaceFailedSourcePixels`), so a failure is reported once per
-     * attempt and never retried in a loop. Canvas readbacks do not use the worker and still work. */
+    /** Exhausted upload failures let the production owner replace this source stager.
+     * Canvas readbacks remain available because they do not use the worker. */
     get failed() {
         return !!this.failure;
     }
@@ -51,7 +50,9 @@ export class SourcePixels {
         this.failure = error;
         this.worker?.terminate();
         this.worker = undefined;
-        reportGlassError('worker-startup', error, 'source upload worker');
+        reportGlassError('worker-startup', error, 'source upload worker', undefined, {
+            recovering: true,
+        });
         for (const job of this.pending.values()) {
             clearTimeout(job.timer);
             job.reject(error);
@@ -69,6 +70,30 @@ export class SourcePixels {
      * in WebKit (157 ms for a 1320 x 5091 capture in the Catalyst host), more than half of the
      * stage. Measured for captures up to 1320 x 6495; the cause inside WebKit was not sampled. */
     async prepare(image, capture = image) {
+        for (let attempt = 0;; attempt++) {
+            try {
+                if (this.retrying)
+                    await this.retrying;
+                return await this.prepareOnce(image, capture);
+            }
+            catch (error) {
+                if (!this.failure)
+                    throw error;
+                if (attempt === 2) {
+                    reportGlassError('worker-startup', error, 'source upload worker');
+                    throw new Error(`Source upload worker startup failed: ${String(error)}`, { cause: error });
+                }
+                // Concurrent uploads share one restart. Each retry clones from the retained
+                // source, never from the bitmap already transferred to the failed worker.
+                this.retrying ??= new Promise(resolve => setTimeout(resolve, 250 * 2 ** attempt)).then(() => {
+                    this.failure = undefined;
+                    this.retrying = undefined;
+                });
+                await this.retrying;
+            }
+        }
+    }
+    async prepareOnce(image, capture) {
         const readbackStarted = glassNow();
         const pixels = canvasPixels(capture);
         if (pixels) {
@@ -83,8 +108,17 @@ export class SourcePixels {
         if (this.failure)
             throw this.failure;
         if (!this.worker) {
-            this.worker = this.create();
+            try {
+                this.worker = this.create();
+            }
+            catch (error) {
+                this.fail(error instanceof Error ? error : Error(String(error)));
+                throw error;
+            }
+            const worker = this.worker;
             this.worker.onmessage = event => {
+                if (this.worker !== worker)
+                    return;
                 const data = event.data;
                 if (data.id === 0 && data.error) {
                     this.fail(Error(data.error));
@@ -109,8 +143,14 @@ export class SourcePixels {
                 prepared.set(job.image, new Uint8Array(data.buffer));
                 job.resolve();
             };
-            this.worker.onerror = event => this.fail(Error(event.message || 'Source upload worker failed'));
-            this.worker.onmessageerror = () => this.fail(Error('Source upload worker reply could not be decoded'));
+            this.worker.onerror = event => {
+                if (this.worker === worker)
+                    this.fail(Error(event.message || 'Source upload worker failed'));
+            };
+            this.worker.onmessageerror = () => {
+                if (this.worker === worker)
+                    this.fail(Error('Source upload worker reply could not be decoded'));
+            };
         }
         const started = glassNow(), clone = await createImageBitmap(capture);
         if (this.failure) {

package/dist/keyboard/adapter.js

@@ -150,7 +150,7 @@ export function dismissKeyboard() {
 }
 /** One adapter per SatinRoot. Owns viewport listeners, never cancels editing gestures. */
 /**
- * Tapping a control keeps the editor's keyboard, as a UIKit or SwiftUI button tap keeps the first
+ * Tapping a control keeps the editor's keyboard, so button presses preserve the first
  * responder: a hand-rolled composer's Send must not close the keyboard (iPad, October 12, 0/5 kept).
  * Controls that leave the editor end editing themselves: navigation and tab switches dismiss
  * explicitly, and a presented modal takes focus through showModal().
@@ -517,7 +517,7 @@ export function installKeyboardAdapter(root) {
         releaseSurface();
         revealedFor = '';
         revealedEditor = null;
-        // Navigation ends editing, as a pushed or popped SwiftUI screen dismisses its keyboard.
+        // Navigation ends editing, when a screen is pushed or popped.
         if (editable(document.activeElement) && root.contains(document.activeElement))
             document.activeElement.blur();
     };

package/dist/keyboard/avoidance.d.ts

@@ -7,7 +7,7 @@ export type KeyboardClearance = Readonly<{
     bottom: number;
 }>;
 /**
- * Keyboard avoidance for the focused editor, as SwiftUI's keyboard safe area does it: every
+ * Keyboard avoidance for the focused editor, through the keyboard safe area: every
  * scroll surface around the editor gets room below its content for the keyboard and scrolls the
  * editor (a tall editor: its caret line) above the keyboard, innermost first. An editor on a page
  * whose surfaces cannot bring it up (a screen without a scroll surface, or a nested scroller pinned

package/dist/keyboard/avoidance.js

@@ -29,7 +29,7 @@ function keepEditorInBox(delta, editor, box, offsetTop, room) {
     return Math.min(high, Math.max(low, delta));
 }
 /**
- * Keyboard avoidance for the focused editor, as SwiftUI's keyboard safe area does it: every
+ * Keyboard avoidance for the focused editor, through the keyboard safe area: every
  * scroll surface around the editor gets room below its content for the keyboard and scrolls the
  * editor (a tall editor: its caret line) above the keyboard, innermost first. An editor on a page
  * whose surfaces cannot bring it up (a screen without a scroll surface, or a nested scroller pinned

package/dist/keyboard/motion.d.ts

@@ -1,6 +1,6 @@
 /**
  * The software keyboard's show and hide motion. Measured per frame from the native composer's
- * presentation layer (SwiftUI `ScrollView` + `.safeAreaInset(edge: .bottom)` chat, iOS 27.0
+ * presentation layer (`ScrollView` + `.safeAreaInset(edge: .bottom)` chat, iOS 27.0
  * Simulator, 4 shows and 4 hides; UIKit reports duration 0.3833 s, curve 7): a spring with mass 1,
  * stiffness 535 and damping 45.5, released at rest, fits every frame of both directions within
  * 0.84 pt of a 313 pt travel. UIKit ends the animation at 383 ms (0.4 pt short of rest).

package/dist/keyboard/motion.js

@@ -1,7 +1,7 @@
 import { menuSpring } from '../glass/lens/menuSpring.js';
 /**
  * The software keyboard's show and hide motion. Measured per frame from the native composer's
- * presentation layer (SwiftUI `ScrollView` + `.safeAreaInset(edge: .bottom)` chat, iOS 27.0
+ * presentation layer (`ScrollView` + `.safeAreaInset(edge: .bottom)` chat, iOS 27.0
  * Simulator, 4 shows and 4 hides; UIKit reports duration 0.3833 s, curve 7): a spring with mass 1,
  * stiffness 535 and damping 45.5, released at rest, fits every frame of both directions within
  * 0.84 pt of a 313 pt travel. UIKit ends the animation at 383 ms (0.4 pt short of rest).

package/dist/list-form/ListForm.d.ts

@@ -11,13 +11,13 @@ export type ListEngineProps = Omit<ScrollSurfaceProps, 'axis'> & {
     variant?: 'insetGrouped' | 'plain' | 'grouped' | 'sidebar';
     navigationTitle?: string;
     navigationTitleDisplay?: 'large' | 'inline';
-    /** SwiftUI `searchable`: a search field in the navigation bar drawer above this List. */
+    /** A search field in the navigation bar drawer above this List. */
     searchable?: Searchable;
     /** Default keeps measured header/footer gaps. Numbers are section gaps in points. */
     listSectionSpacing?: 'default' | 'compact' | number;
     /** Controls the scroll surface background, leaving row backgrounds intact. */
     scrollContentBackground?: 'hidden' | 'visible';
-    /** SwiftUI `List(selection:)`, resolved by the public List. */
+    /** Selection state resolved by the public List. */
     selectionBinding?: ListSelectionBinding;
 };
 /** A controlled List selection: one optional row, or a set of rows. */

package/dist/list-form/ListForm.js

@@ -410,7 +410,7 @@ export function StepperControl({ value, onChange, min = -Infinity, max = Infinit
     return (_jsxs("span", { "data-satin-row-intrinsic": "true", "data-satin-stepper": "true", "data-satin-stepper-disabled": disabled ? 'true' : undefined, role: "group", "aria-label": `${label}, ${value}`, children: [_jsx(StepperButton, { onEditingChange: onEditingChange, label: `Decrease ${label}, ${value}`, disabled: disabled || value <= min, onStep: () => onChange(clampStepper(value, min, max, -step)), children: _jsx(SymbolImage, { name: "minus", weight: "medium" }) }), _jsx(StepperButton, { onEditingChange: onEditingChange, label: `Increase ${label}, ${value}`, disabled: disabled || value >= max, onStep: () => onChange(clampStepper(value, min, max, step)), children: _jsx(SymbolImage, { name: "plus", weight: "semibold" }) })] }));
 }
 export function StepperRow(props) {
-    return _jsx(Row, { label: props.label, trailing: _jsx(StepperControl, { ...props }) });
+    return (_jsx(Row, { className: "satin-stepper-row", label: props.label, trailing: _jsx(StepperControl, { ...props }) }));
 }
 export function SegmentedControl({ value, onChange, options, disabled = false, label = 'Options', style: cssStyle, }) {
     const choose = useChooseOption({ options, disabled, onChange });

package/dist/list-form/ListItem.js

@@ -208,7 +208,7 @@ function playEditShift(item, before, after) {
 }
 /**
  * The reorder handle's pointer-down: lifts this row and hands it to the drag. The move is
- * reported through `onMove` with SwiftUI's offsets once the row settles; the new order must then
+ * reported through `onMove` with source-sequence offsets once the row settles; the new order must then
  * come back through `data`, and until it does the rows stay where they were dropped.
  */
 function useReorder(element, item, editing) {

package/dist/list-form/RowLabel.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 /**
- * A row title with a secondary line under it: SwiftUI's two-Text label (a title, then a
+ * A row title with a secondary line under it: a two-line label (a title, then a
  * `.subheadline` `.secondary` line). `RowLabel`, a Toggle subtitle and any other two-line row
  * label share this one body, so their type and spacing cannot drift apart.
  *

package/dist/list-form/RowLabel.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
- * A row title with a secondary line under it: SwiftUI's two-Text label (a title, then a
+ * A row title with a secondary line under it: a two-line label (a title, then a
  * `.subheadline` `.secondary` line). `RowLabel`, a Toggle subtitle and any other two-line row
  * label share this one body, so their type and spacing cannot drift apart.
  *

package/dist/list-form/Slider.js

@@ -5,7 +5,7 @@ import { requestGlassSourceDamage } from '../glass/sourceDamage.js';
 import { CONTROL_LIFT, controlLensSize } from '../glass/lens/controlLift.js';
 import { SliderContact } from './sliderContact.js';
 /**
- * Native geometry (stock SwiftUI Slider in a Form, iPhone 17 Pro Max Simulator, iOS 27.0, 3×
+ * Native geometry (a slider in a form, iPhone 17 Pro Max Simulator, iOS 27.0, 3×
  * stills, native control measurements `continuous.mov`): a 6 pt capsule track spans the row's content
  * width, the 37 × 24 pt white thumb stays inside it (its centre travels from 18.5 pt to width −
  * 18.5 pt), and the accent fill runs from the track start to the thumb centre with a round end.

package/dist/list-form/editMotion.js

@@ -1,5 +1,5 @@
 /*
- * Edit mode's row motion, measured from a stock SwiftUI `List` with `onDelete` and `onMove`
+ * Edit mode's row motion, measured from a native list with `onDelete` and `onMove`
  * (iOS 27.0 Simulator, native reference `native list editing fixture native editing fixture`, five Edit/Done toggles, frame counter
  * retimed: 0 skipped refreshes of 922; fits in native measurements).
  *