@weasel-js/labkit 1.5.0 → 1.5.1

package/dist/surface/index.js

@@ -1,4 +1,4 @@
-export { composeRects, rectsEqual, toDeviceRect, useTiledSurface } from '../chunk-QLSV2N3G.js';
+export { composeRects, rectsEqual, toDeviceRect, useTiledSurface } from '../chunk-IJJUK4FU.js';
 export { SurfaceCanvasContext, SurfaceContext, useSurface, useSurfaceCanvas, useSurfaceOptional, useSurfaceTile, useTileId } from '../chunk-WIG6XHJ7.js';
 import '../chunk-2YILQ7Y5.js';
 //# sourceMappingURL=index.js.map

package/dist/ui/layers/index.js

@@ -1,3 +1,3 @@
-export { c3 as LayerStack } from '../../chunk-S2SHZRD7.js';
+export { c4 as LayerStack } from '../../chunk-T3EC2DXD.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/undo/index.d.ts

@@ -1,8 +1,8 @@
-export { as as UndoCapability } from '../_dts/frac-8R6UmlvN.js';
+export { at as UndoCapability } from '../_dts/frac-B4okC2lX.js';
 import 'react';
-import '../_dts/types-Ca2LCnPq.js';
+import '../_dts/types-DzoNY1pO.js';
 import '@weasel-js/core';
-import '../_dts/PrefsForm.d-DDHFANkc.js';
+import '../_dts/PrefsForm.d-DPy9I8It.js';
 import '../_dts/types-DJ79Tg5J.js';
 
 /** A subscriber to a named event. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weasel-js/labkit",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "React widgets for building self-contained interactive lab pages",
   "license": "MIT",
   "author": "orochi235",
@@ -115,17 +115,17 @@
     "dev:3d": "LABKIT_EXAMPLE=3d-lab vite"
   },
   "peerDependencies": {
-    "@weasel-js/core": "1.5.0",
+    "@weasel-js/core": "1.5.1",
+    "@weasel-js/theme": "1.5.1",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "dependencies": {
-    "@weasel-js/geom": "1.5.0",
-    "@weasel-js/kernel3d": "1.5.0",
-    "@weasel-js/loupe": "1.5.0",
-    "@weasel-js/svg": "1.5.0",
-    "@weasel-js/theme": "1.5.0",
-    "@weasel-js/ui": "1.5.0",
+    "@weasel-js/geom": "1.5.1",
+    "@weasel-js/kernel3d": "1.5.1",
+    "@weasel-js/loupe": "1.5.1",
+    "@weasel-js/svg": "1.5.1",
+    "@weasel-js/ui": "1.5.1",
     "earcut": "2.2.4",
     "polygon-clipping": "^0.15.7",
     "react-aria-components": "^1.5.0",
@@ -136,7 +136,7 @@
     "@biomejs/biome": "^2.4.12",
     "@rollup/plugin-alias": "^6.0.0",
     "@testing-library/jest-dom": "^6.6.0",
-    "@weasel-js/modes": "1.5.0",
+    "@weasel-js/modes": "1.5.1",
     "less": "^4.2.0",
     "rollup-plugin-dts": "^6.4.1",
     "tsx": "^4.19.0",

package/src/annotations/AnnotationOverlay.tsx

@@ -226,6 +226,9 @@ export function AnnotationOverlay({
         ref={setInput}
         className="lk-annotate__input"
         data-annotation-target={id}
+        // Pass-through while the rail holds a tool that makes no marks, so the
+        // instrument under the overlay stays clickable.
+        data-idle={annotationToolInfo(activeToolId) ? undefined : ''}
         role="application"
         aria-label={`Annotations on ${id}`}
         // biome-ignore lint/a11y/noNoninteractiveTabindex: role="application" IS the interactive case — a region with its own keymap. The rule's allowed-role list stops at the native widget roles and does not include it, and the gesture dispatcher listens on this element, so without focus no tool's keyboard binding ever fires.

package/src/annotations/Annotations.less

@@ -8,6 +8,10 @@
   width: var(--lk-anno-w);
   height: var(--lk-anno-h);
   z-index: 2;
+
+  &[data-idle] {
+    pointer-events: none;
+  }
 }
 
 // The sidebar list of marks. One row per mark: what it is, where it is, what

package/src/annotations/Annotations.overlay.test.tsx

@@ -146,6 +146,26 @@ describe('<AnnotationTargets>', () => {
     expect(boxes[1]?.style.getPropertyValue('--lk-anno-h')).toBe('100px');
   });
 
+  it('takes input while a mark tool is held, and passes it through otherwise', () => {
+    const drawing = render(<Harness toolId="rect" />, { wrapper: StrictMode });
+    act(() => {
+      vi.advanceTimersByTime(64);
+    });
+    expect(drawing.container.querySelector('.lk-annotate__input')?.hasAttribute('data-idle')).toBe(
+      false,
+    );
+    drawing.unmount();
+
+    // `pointer` is in the rail but not in the tool map: the instrument under the overlay stays clickable.
+    const idle = render(<Harness toolId="pointer" />, { wrapper: StrictMode });
+    act(() => {
+      vi.advanceTimersByTime(64);
+    });
+    expect(idle.container.querySelector('.lk-annotate__input')?.hasAttribute('data-idle')).toBe(
+      true,
+    );
+  });
+
   it('lands the boxes in the surface container, not among the instrument DOM', () => {
     const { container } = render(<Harness />, { wrapper: StrictMode });
     act(() => {

package/src/annotations/svgNodes.ts

@@ -27,6 +27,7 @@ function toSvgStroke(stroke: Stroke): SvgStroke {
     ...(stroke.join ? { join: stroke.join } : {}),
     ...(stroke.dash ? { dash: [...stroke.dash] } : {}),
     ...(stroke.miterLimit != null ? { miterLimit: stroke.miterLimit } : {}),
+    ...(stroke.align ? { align: stroke.align } : {}),
   };
 }
 

package/src/annotations/toolMap.test.ts

@@ -6,8 +6,12 @@ import type { AnnotationKind } from './types';
 const KINDS: AnnotationKind[] = ['stroke', 'line', 'arrow', 'rect', 'ellipse', 'text'];
 
 describe('the annotation tool table', () => {
-  it('offers one tool per mark kind, plus select', () => {
-    expect(ANNOTATION_TOOLS.map((t) => t.id)).toEqual(['select', ...KINDS]);
+  it('offers one tool per mark kind, plus pointer and select', () => {
+    expect(ANNOTATION_TOOLS.map((t) => t.id)).toEqual(['pointer', 'select', ...KINDS]);
+  });
+
+  it('gives pointer no entry at all, which is what leaves the overlay idle', () => {
+    expect(annotationToolInfo('pointer')).toBeUndefined();
   });
 
   it('only names weasel tools SceneCanvas will mount', () => {
@@ -15,9 +19,9 @@ describe('the annotation tool table', () => {
     // being built in should fail here rather than in a silent no-op palette.
     const mountable = new Set<string>([...KIT_SHAPE_KINDS, 'select']);
     for (const t of ANNOTATION_TOOLS) {
-      expect(mountable, `${t.id} maps to a tool the kit does not mount`).toContain(
-        annotationToolInfo(t.id)?.weaselTool,
-      );
+      const info = annotationToolInfo(t.id);
+      if (!info) continue;
+      expect(mountable, `${t.id} maps to a tool the kit does not mount`).toContain(info.weaselTool);
     }
   });
 

package/src/annotations/toolMap.ts

@@ -2,6 +2,7 @@ import type { BuiltinToolId } from '@weasel-js/core';
 import {
   ArrowIcon,
   EllipseIcon,
+  HandIcon,
   LineIcon,
   PencilIcon,
   RectIcon,
@@ -34,6 +35,8 @@ const TOOLS: Record<string, AnnotationToolInfo> = {
  *  Ids share the lab's contribution namespace with its own `tools`, and the
  *  lab's tool slot holds whichever is active. */
 export const ANNOTATION_TOOLS: readonly TrialTool[] = [
+  // Not in `TOOLS`: an id the map does not carry is what leaves the overlay idle.
+  { id: 'pointer', label: 'Interact', icon: HandIcon, group: 'annotate' },
   { id: 'select', label: 'Select', icon: SelectIcon, group: 'annotate' },
   { id: 'stroke', label: 'Freehand', icon: PencilIcon, group: 'annotate' },
   { id: 'line', label: 'Line', icon: LineIcon, group: 'annotate' },

package/src/canvas/CanvasStack.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
+import type { Meta, StoryObj } from '@weasel-js/forge';
 import { useState } from 'react';
 import { ScaleIndicator } from '../primitives/ScaleIndicator';
 import { CanvasStack } from './CanvasStack';

package/src/canvas/usePanZoom.test.ts

@@ -37,6 +37,34 @@ function setup(initialView: ViewTransform, options?: Partial<UsePanZoomOptions>)
 }
 
 describe('usePanZoom', () => {
+  it('stacks two wheel events that land before a re-render', () => {
+    const { wheel } = setup({ zoom: 1, pan: { x: 0, y: 0 } });
+    const once = wheel(-100).zoom;
+
+    const views: ViewTransform[] = [];
+    const { result } = renderHook(() =>
+      usePanZoom({ view: { zoom: 1, pan: { x: 0, y: 0 } }, onViewChange: (v) => views.push(v) }),
+    );
+    act(() => {
+      result.current.onWheel(wheelEvent(-100));
+      result.current.onWheel(wheelEvent(-100));
+    });
+    expect(views[1].zoom).toBeCloseTo(once * once, 10);
+  });
+
+  it('lets the view prop win at the next render', () => {
+    const views: ViewTransform[] = [];
+    const { result, rerender } = renderHook(
+      (props: { view: ViewTransform }) =>
+        usePanZoom({ view: props.view, onViewChange: (v) => views.push(v) }),
+      { initialProps: { view: { zoom: 1, pan: { x: 0, y: 0 } } } },
+    );
+    act(() => result.current.onWheel(wheelEvent(-100)));
+    rerender({ view: { zoom: 2, pan: { x: 0, y: 0 } } });
+    act(() => result.current.onWheel(wheelEvent(0)));
+    expect(views[1].zoom).toBeCloseTo(2, 10);
+  });
+
   it('does not collapse a canvas opening far outside the default range on the first wheel event', () => {
     const { wheel } = setup({ zoom: 1600, pan: { x: 0, y: 0 } });
     const next = wheel(-1); // zoom in slightly

package/src/canvas/usePanZoom.ts

@@ -70,6 +70,13 @@ export function usePanZoom({
   // view unreachable behind it.
   const initialZoomRef = useRef(isPositiveFinite(view.zoom) ? view.zoom : null);
 
+  // Written ahead of the render so a second event inside one commit steps
+  // from this one; the render-time assignment above still lets the prop win.
+  const commit = useCallback((next: ViewTransform) => {
+    viewRef.current = normalize2DView(next);
+    onViewChangeRef.current(next);
+  }, []);
+
   const onWheel = useCallback(
     (e: WheelEvent<HTMLElement> | globalThis.WheelEvent, anchor?: Element) => {
       const el = anchor ?? (e.currentTarget as Element | null);
@@ -77,7 +84,7 @@ export function usePanZoom({
       e.preventDefault();
       const rect = el.getBoundingClientRect();
       const initialZoom = initialZoomRef.current;
-      onViewChange(
+      commit(
         zoomAt(
           viewRef.current,
           Math.exp(-e.deltaY * 0.001),
@@ -90,7 +97,7 @@ export function usePanZoom({
         ),
       );
     },
-    [onViewChange, minZoom, maxZoom, frame],
+    [commit, minZoom, maxZoom, frame],
   );
 
   const clearDrag = useCallback(() => {
@@ -114,7 +121,7 @@ export function usePanZoom({
           const dy = ev.clientY - drag.startScreenY;
           if (!drag.moved && Math.hypot(dx, dy) < DRAG_THRESHOLD) return;
           drag.moved = true;
-          onViewChangeRef.current({
+          commit({
             zoom: viewRef.current.zoom,
             pan: { x: drag.startPan.x + dx, y: drag.startPan.y + dy },
           });
@@ -129,7 +136,7 @@ export function usePanZoom({
         onCancel: clearDrag,
       });
     },
-    [clearDrag],
+    [clearDrag, commit],
   );
 
   useEffect(() => () => sessionRef.current?.cancel(), []);

package/src/chrome/ChromeRegions.stories.tsx

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
+import type { Meta, StoryObj } from '@weasel-js/forge';
 import { CrosshairIcon, HandIcon, PencilIcon, SnapshotIcon } from '@weasel-js/ui';
 import type { ConfigField } from '../controls/types';
 import type { Instrument } from '../instrument/types';

package/src/chrome/LabChrome.tsx

@@ -80,12 +80,10 @@ export function LabHeaderRegion({ contributions }: LabRegionProps) {
   );
 }
 
-/** The lab's sidebar sections. Fold state is a lab-scoped persisted value, so it
- *  survives a reload in a stored lab and lasts the session in an unstored one. */
-export function LabSidebarRegion({ contributions }: LabRegionProps) {
+function LabSections({ contributions, region }: LabRegionProps & { region: 'sidebar' | 'aside' }) {
   const lab = useLabChromeContext();
   const [collapsedSections, setFolds] = usePersistedState<Record<string, boolean>>(
-    'lk-lab-sidebar-folds',
+    `lk-lab-${region}-folds`,
     {},
     { scope: 'lab' },
   );
@@ -98,7 +96,25 @@ export function LabSidebarRegion({ contributions }: LabRegionProps) {
     }),
     [lab, collapsedSections, setFolds],
   );
-  return <SidebarRegion contributions={contributionsIn(contributions, 'sidebar')} ctx={ctx} />;
+  return (
+    <SidebarRegion
+      contributions={contributionsIn(contributions, region)}
+      ctx={ctx}
+      region={region}
+    />
+  );
+}
+
+/** The lab's sidebar sections. Fold state is a lab-scoped persisted value, so it
+ *  survives a reload in a stored lab and lasts the session in an unstored one. */
+export function LabSidebarRegion({ contributions }: LabRegionProps) {
+  return <LabSections contributions={contributions} region="sidebar" />;
+}
+
+/** The lab's aside sections, on the far side of the workspace from the sidebar.
+ *  Fold state persists the way the sidebar's does. */
+export function LabAsideRegion({ contributions }: LabRegionProps) {
+  return <LabSections contributions={contributions} region="aside" />;
 }
 
 /** The lab's readouts, in the shell footer below the workspace. */

package/src/chrome/builtins.test.ts

@@ -28,6 +28,7 @@ const ctx: TrialChromeContext = {
   configFields: [],
   configSchema: fromConfigFields([]),
   config: {},
+  auto: new Set<string>(),
   setConfig: () => {},
   savedSnapshots: [],
   saveSnapshot: () => {},

package/src/chrome/builtins.tsx

@@ -189,6 +189,7 @@ export function builtinContributions(
           <ControlPanel
             schema={ctx.configSchema}
             config={ctx.config as Record<string, unknown>}
+            auto={ctx.auto}
             setConfig={(key, value) => ctx.setConfig(String(key), value)}
             renderers={controls}
             collapsed={groupFolds(ctx.collapsedSections, 'settings')}

package/src/chrome/index.ts

@@ -2,6 +2,7 @@ export { builtinContributions } from './builtins';
 export type { LabRegionProps } from './LabChrome';
 export {
   contributionsIn,
+  LabAsideRegion,
   LabFooterRegion,
   LabHeaderRegion,
   LabSidebarRegion,

package/src/chrome/labTypes.ts

@@ -15,7 +15,7 @@ import type {
  * `<LabShell>` names them; `palette` is the tool rail down the side of the
  * workspace; `sidebar` is a column of sections left of the tool rail.
  */
-export type LabRegion = 'header' | 'palette' | 'sidebar' | 'footer';
+export type LabRegion = 'header' | 'palette' | 'sidebar' | 'aside' | 'footer';
 
 /**
  * Everything a lab-level contribution can read and command: the lab's own
@@ -41,7 +41,7 @@ export type LabContribution<TCtx = LabChromeContext> =
       render?: never;
     })
   | (ContributionBase & { region: 'palette'; item: ToolItem; render?: never })
-  | (ContributionBase & { region: 'sidebar'; item: SidebarSection; render?: never })
+  | (ContributionBase & { region: 'sidebar' | 'aside'; item: SidebarSection; render?: never })
   | (ContributionBase & { region: 'footer'; item: StatusReadout; render?: never })
   | (ContributionBase & {
       region: LabRegion;

package/src/chrome/regions/PaletteRegion.tsx

@@ -1,11 +1,6 @@
 import { ToolButton, ToolGroup } from '../../passthrough/weasel-ui';
 import { useRovingTabIndex } from '../../primitives/useRovingTabIndex';
-import type {
-  RegionContribution,
-  ToolItem,
-  ToolSlotContext,
-  TrialChromeContext,
-} from '../types';
+import type { RegionContribution, ToolItem, ToolSlotContext, TrialChromeContext } from '../types';
 
 /** Props for `<PaletteRegion>`. */
 export interface PaletteRegionProps<TCtx extends ToolSlotContext = TrialChromeContext> {

package/src/chrome/regions/SidebarRegion.stories.tsx

@@ -0,0 +1,44 @@
+import type { Meta, StoryObj } from '@weasel-js/forge';
+import { expect } from '@weasel-js/forge/play';
+import { LabRoot } from '../../lab/LabRoot';
+import type { SidebarSlotContext } from '../types';
+import { SidebarRegion } from './SidebarRegion';
+
+const meta: Meta<typeof SidebarRegion> = {
+  title: 'labkit/Chrome/SidebarRegion',
+  component: SidebarRegion,
+  parameters: { layout: 'fullscreen' },
+};
+export default meta;
+
+type Story = StoryObj<typeof SidebarRegion>;
+
+const ctx: SidebarSlotContext = { collapsedSections: {}, setSectionCollapsed: () => {} };
+
+// jsdom has no layout, so this runs in the browser story projects.
+export const LastSectionFillsItsPane: Story = {
+  render: () => (
+    <LabRoot>
+      <div className="lk-lab__aside" data-testid="pane" style={{ height: 400 }}>
+        <SidebarRegion
+          ctx={ctx}
+          contributions={[
+            { id: 'first', region: 'sidebar', item: { title: 'First', body: <p>one</p> } },
+            { id: 'last', region: 'sidebar', item: { title: 'Last', body: <p>two</p> } },
+          ]}
+        />
+      </div>
+    </LabRoot>
+  ),
+  play: async ({ canvasElement }) => {
+    const pane = canvasElement.querySelector('[data-testid="pane"]') as HTMLElement;
+    const sections = [...pane.querySelectorAll<HTMLElement>('.lk-sidebar-section')];
+    const first = sections[0] as HTMLElement;
+    const last = sections[sections.length - 1] as HTMLElement;
+    await expect(Math.round(last.getBoundingClientRect().bottom)).toBe(
+      Math.round(pane.getBoundingClientRect().bottom),
+    );
+    await expect(getComputedStyle(last).borderBottomWidth).toBe('0px');
+    await expect(getComputedStyle(first).borderBottomWidth).not.toBe('0px');
+  },
+};

package/src/chrome/regions/ToolbarRegion.tsx

@@ -39,15 +39,19 @@ function groupsOf<TCtx>(contributions: readonly RegionContribution<TCtx>[]): Gro
   return groups;
 }
 
-function renderEntry<TCtx>(
-  c: RegionContribution<TCtx>,
-  ctx: TCtx,
-  region: string,
-): ReactNode {
+function renderEntry<TCtx>(c: RegionContribution<TCtx>, ctx: TCtx, region: string): ReactNode {
   if (c.render) return <span key={c.id}>{c.render(ctx)}</span>;
   if (c.region !== region || !c.item) return null;
-  const { icon: Icon, label, shortcut, disabled, danger, showLabel, pressed, onActivate } =
-    c.item as ToolbarItem<TCtx>;
+  const {
+    icon: Icon,
+    label,
+    shortcut,
+    disabled,
+    danger,
+    showLabel,
+    pressed,
+    onActivate,
+  } = c.item as ToolbarItem<TCtx>;
   return (
     <Toolbar.Button
       key={c.id}

package/src/chrome/types.ts

@@ -165,6 +165,9 @@ export interface TrialChromeContext extends ToolSlotContext, SidebarSlotContext
    *  `config`, since a builder schema has no `ConfigField[]` form. */
   configFields: ConfigField[];
   config: unknown;
+  /** The trial's unpinned paths. `config` stays raw, so a control drawn from
+   *  it sits at the value un-pinning writes back. */
+  auto: ReadonlySet<string>;
   setConfig: (key: string, value: unknown) => void;
 
   /** Which of this trial's collapsible sections are folded. A sidebar

package/src/config/auto.test.ts

@@ -0,0 +1,12 @@
+import { describe, expect, it } from 'vitest';
+import { auto, isAuto } from './auto';
+
+describe('auto', () => {
+  it('is a symbol distinct from every ordinary config value', () => {
+    expect(typeof auto).toBe('symbol');
+    expect(isAuto(auto)).toBe(true);
+    for (const v of [undefined, null, 0, '', 'auto', false, Symbol('auto'), {}]) {
+      expect(isAuto(v)).toBe(false);
+    }
+  });
+});

package/src/config/auto.ts

@@ -0,0 +1,15 @@
+/**
+ * Written at a config path to mean "do not pin this — let the instrument
+ * decide". Accepted by `setConfig`, by a trial's `configSeed`, and by
+ * `.initial()` in a schema. It is normalized into the trial's set of unpinned
+ * paths on the way into the store and is never itself stored, so a serialized
+ * trial contains no sentinel and the last pinned value survives.
+ */
+export const auto: unique symbol = Symbol('weasel.auto');
+
+/** The type of the `auto` sentinel, for widening a value parameter. */
+export type Auto = typeof auto;
+
+export function isAuto(value: unknown): value is Auto {
+  return value === auto;
+}

package/src/config/autoConfig.test.ts

@@ -0,0 +1,107 @@
+import { describe, expect, it } from 'vitest';
+import { auto } from './auto';
+import { autoPathsOf, resolveAutoConfig } from './autoConfig';
+import { f } from './builder';
+import { resolveConfigSchema } from './resolve';
+
+const schema = f.schema({
+  width: f.number(432),
+  gap: f.number(12).auto((c) => (c.width as number) / 24),
+  cols: f.number(3).initial(auto),
+  grid: f.group({ size: f.number(8).auto(() => 99) }),
+});
+const resolved = resolveConfigSchema(schema);
+const raw = { width: 432, gap: 12, cols: 3, grid: { size: 8 } };
+
+describe('autoPathsOf', () => {
+  it('lists the dotted paths a schema starts auto', () => {
+    expect(autoPathsOf(resolved)).toEqual(['cols']);
+  });
+
+  it('reaches leaves nested under a group', () => {
+    const nested = resolveConfigSchema(
+      f.schema({ grid: f.group({ size: f.number(8).initial(auto) }) }),
+    );
+    expect(autoPathsOf(nested)).toEqual(['grid.size']);
+  });
+});
+
+describe('resolveAutoConfig', () => {
+  it('leaves a config with nothing auto exactly as it was', () => {
+    expect(resolveAutoConfig(resolved, raw, new Set())).toEqual(raw);
+  });
+
+  it('replaces an auto path that has a resolver with the computed value', () => {
+    const out = resolveAutoConfig(resolved, raw, new Set(['gap']));
+    expect(out.gap).toBe(18);
+    expect(out.width).toBe(432);
+  });
+
+  it('deletes an auto path that has no resolver', () => {
+    const out = resolveAutoConfig(resolved, raw, new Set(['cols'])) as Record<string, unknown>;
+    expect('cols' in out).toBe(false);
+  });
+
+  it('resolves a leaf nested under a group', () => {
+    const out = resolveAutoConfig(resolved, raw, new Set(['grid.size'])) as {
+      grid: { size: number };
+    };
+    expect(out.grid.size).toBe(99);
+  });
+
+  it('lets one resolver read another auto path, already resolved', () => {
+    const chained = resolveConfigSchema(
+      f.schema({
+        a: f.number(1).auto(() => 10),
+        b: f.number(2).auto((c) => (c.a as number) * 3),
+      }),
+    );
+    const out = resolveAutoConfig(chained, { a: 1, b: 2 }, new Set(['a', 'b'])) as {
+      a: number;
+      b: number;
+    };
+    expect(out).toEqual({ a: 10, b: 30 });
+  });
+
+  it('resolves a dependency declared after its dependent', () => {
+    const backward = resolveConfigSchema(
+      f.schema({
+        b: f.number(2).auto((c) => (c.a as number) * 3),
+        a: f.number(1).auto(() => 10),
+      }),
+    );
+    const out = resolveAutoConfig(backward, { a: 1, b: 2 }, new Set(['a', 'b'])) as {
+      a: number;
+      b: number;
+    };
+    expect(out).toEqual({ a: 10, b: 30 });
+  });
+
+  it('throws naming the path when resolvers cycle', () => {
+    const cyclic = resolveConfigSchema(
+      f.schema({
+        a: f.number(1).auto((c) => (c.b as number) + 1),
+        b: f.number(2).auto((c) => (c.a as number) + 1),
+      }),
+    );
+    expect(() => resolveAutoConfig(cyclic, { a: 1, b: 2 }, new Set(['a', 'b']))).toThrow(/cycle/i);
+    expect(() => resolveAutoConfig(cyclic, { a: 1, b: 2 }, new Set(['a', 'b']))).toThrow(/"a"/);
+  });
+
+  it('throws on a resolver that reads its own path', () => {
+    const selfish = resolveConfigSchema(
+      f.schema({ a: f.number(1).auto((c) => (c.a as number) + 1) }),
+    );
+    expect(() => resolveAutoConfig(selfish, { a: 1 }, new Set(['a']))).toThrow(/cycle/i);
+  });
+
+  it('ignores an auto path the schema does not have', () => {
+    expect(resolveAutoConfig(resolved, raw, new Set(['gone']))).toEqual(raw);
+  });
+
+  it('does not mutate the config it was given', () => {
+    const before = structuredClone(raw);
+    resolveAutoConfig(resolved, raw, new Set(['gap', 'grid.size']));
+    expect(raw).toEqual(before);
+  });
+});