@weasel-js/labkit 1.0.4 → 1.1.0

package/src/lab/Lab.test.tsx

@@ -41,50 +41,50 @@ function mountLab(props: Partial<Parameters<typeof Lab>[0]> = {}) {
 }
 
 describe('<Lab>', () => {
-  it('renders one workspace by default', () => {
+  it('renders one trial by default', () => {
     mountLab();
-    expect(screen.getAllByRole('region', { name: /workspace/i })).toHaveLength(1);
+    expect(screen.getAllByRole('region', { name: /trial/i })).toHaveLength(1);
   });
 
-  it('addWorkspace adds a second workspace', () => {
+  it('addTrial adds a second trial', () => {
     mountLab();
-    act(() => labRef?.addWorkspace('Stub'));
-    expect(screen.getAllByRole('region', { name: /workspace/i })).toHaveLength(2);
+    act(() => labRef?.addTrial('Stub'));
+    expect(screen.getAllByRole('region', { name: /trial/i })).toHaveLength(2);
   });
 
-  it('closeWorkspace removes one when more than one exists', () => {
+  it('closeTrial removes one when more than one exists', () => {
     mountLab();
-    act(() => labRef?.addWorkspace('Stub'));
-    const first = labRef?.workspaces[0];
-    act(() => labRef?.closeWorkspace(first?.id ?? ''));
-    expect(screen.getAllByRole('region', { name: /workspace/i })).toHaveLength(1);
+    act(() => labRef?.addTrial('Stub'));
+    const first = labRef?.trials[0];
+    act(() => labRef?.closeTrial(first?.id ?? ''));
+    expect(screen.getAllByRole('region', { name: /trial/i })).toHaveLength(1);
   });
 
-  it('closeWorkspace is a no-op on the last workspace', () => {
+  it('closeTrial is a no-op on the last trial', () => {
     mountLab();
-    const only = labRef?.workspaces[0];
-    act(() => labRef?.closeWorkspace(only?.id ?? ''));
-    expect(screen.getAllByRole('region', { name: /workspace/i })).toHaveLength(1);
+    const only = labRef?.trials[0];
+    act(() => labRef?.closeTrial(only?.id ?? ''));
+    expect(screen.getAllByRole('region', { name: /trial/i })).toHaveLength(1);
   });
 
-  it('cloneWorkspace inserts immediately after source', () => {
+  it('cloneTrial inserts immediately after source', () => {
     mountLab();
-    act(() => labRef?.addWorkspace('StubB'));
-    const ws0 = labRef?.workspaces[0];
-    const ws1 = labRef?.workspaces[1];
-    act(() => labRef?.cloneWorkspace(ws0?.id ?? ''));
-    const ids = labRef?.workspaces.map((w) => w.id) ?? [];
+    act(() => labRef?.addTrial('StubB'));
+    const ws0 = labRef?.trials[0];
+    const ws1 = labRef?.trials[1];
+    act(() => labRef?.cloneTrial(ws0?.id ?? ''));
+    const ids = labRef?.trials.map((w) => w.id) ?? [];
     expect(ids).toHaveLength(3);
     expect(ids[0]).toBe(ws0?.id);
     expect(ids[2]).toBe(ws1?.id);
   });
 
-  it('resetWorkspace restores defaults', () => {
+  it('resetTrial restores defaults', () => {
     mountLab();
-    const ws = labRef?.workspaces[0];
-    if (!ws) throw new Error('no workspace');
-    act(() => labRef?.resetWorkspace(ws.id));
-    const reset = labRef?.workspaces[0];
+    const ws = labRef?.trials[0];
+    if (!ws) throw new Error('no trial');
+    act(() => labRef?.resetTrial(ws.id));
+    const reset = labRef?.trials[0];
     expect(reset?.config).toEqual({ count: 0 });
     expect(reset?.state).toEqual({ value: 0 });
   });

package/src/lab/Lab.tsx

@@ -1,28 +1,28 @@
 import { ThemeProvider } from '@weasel-js/theme/react';
 import { type CSSProperties, type ReactNode, useEffect, useMemo, useRef } from 'react';
 import { useStore } from 'zustand/react';
-import type { Instrument } from '../instrument/types';
+import type { InstrumentList } from '../instrument/types';
 import { noneAdapter } from '../state/adapters';
 import { LabStoreContext } from '../state/context';
 import { createLabStore, type LabStore } from '../state/store';
-import type { LabMode, StorageAdapter, WorkspaceRecord } from '../state/types';
+import type { LabMode, StorageAdapter, TrialRecord } from '../state/types';
 import { interstellarTheme } from '../theme/interstellar';
-import { Workspace } from '../workspace/Workspace';
+import { Trial } from '../trial/Trial';
 import {
-  addWorkspace as addWorkspaceOp,
-  cloneWorkspace as cloneWorkspaceOp,
-  closeWorkspace as closeWorkspaceOp,
-  reorderWorkspaces as reorderWorkspacesOp,
-  resetWorkspace as resetWorkspaceOp,
-} from '../workspace/workspaceOps';
+  addTrial as addTrialOp,
+  cloneTrial as cloneTrialOp,
+  closeTrial as closeTrialOp,
+  reorderTrials as reorderTrialsOp,
+  resetTrial as resetTrialOp,
+} from '../trial/trialOps';
 import { LabContext, type LabContextValue } from './LabContext';
 import { LabShell } from './LabShell';
 import { useResolvedMode } from './useSystemMode';
-import { WorkspaceGrid, type WorkspaceLayout } from './WorkspaceGrid';
+import { type TrialLayout, Workspace } from './Workspace';
 
 /** Props for `<Lab>`. */
 export interface LabProps {
-  instruments: Instrument[];
+  instruments: InstrumentList;
   defaultInstrument: string;
   storage?: StorageAdapter | null;
   storageKey?: string;
@@ -39,19 +39,19 @@ export interface LabProps {
 }
 
 function buildStore(
-  instruments: Instrument[],
+  instruments: InstrumentList,
   defaultInstrument: string,
   storage: StorageAdapter,
   storageKey: string,
   initialMode: LabMode,
 ): LabStore {
   const store = createLabStore({ storageKey, storage, initialMode });
-  if (store.getState().workspaces.length === 0) {
-    const seeded = addWorkspaceOp([], instruments, defaultInstrument);
+  if (store.getState().trials.length === 0) {
+    const seeded = addTrialOp([], instruments, defaultInstrument);
     const record = seeded[0];
     if (record) {
       const { undoStack: _undoStack, ...rest } = record;
-      store.getState().addWorkspace(rest);
+      store.getState().addTrial(rest);
     }
   }
   return store;
@@ -71,15 +71,15 @@ const NEBULA_SLOTS = [
 
 function buildNebula(colors: readonly string[]): string {
   const blobs = colors.map((c, i) => {
-    const p = NEBULA_SLOTS[i % NEBULA_SLOTS.length]!;
+    const p = NEBULA_SLOTS[i % NEBULA_SLOTS.length];
     return `radial-gradient(ellipse ${p.sx} ${p.sy} at ${p.cx} ${p.cy}, color-mix(in srgb, ${c} 22%, transparent), transparent ${p.stop})`;
   });
   blobs.push('radial-gradient(ellipse at center, #0a0a18 0%, #02020a 100%)');
   return blobs.join(', ');
 }
 
-/** The lab runtime: creates the store, provides it, and renders one workspace
- *  per record in a grid. Each workspace runs one of `instruments`. */
+/** The lab runtime: creates the store, provides it, and renders one trial
+ *  per record in a grid. Each trial runs one of `instruments`. */
 export function Lab({
   instruments,
   defaultInstrument,
@@ -106,7 +106,7 @@ export function Lab({
   }
   const store = storeRef.current;
 
-  const workspaces = useStore(store, (s) => s.workspaces);
+  const trials = useStore(store, (s) => s.trials);
   const savedSnapshots = useStore(store, (s) => s.savedSnapshots);
   const modeValue = useStore(store, (s) => s.mode);
   const layout = useStore(store, (s) => s.layout);
@@ -119,51 +119,51 @@ export function Lab({
   }, [mode, store]);
 
   const contextValue = useMemo<LabContextValue>(() => {
-    const replaceWorkspaces = (next: WorkspaceRecord[]): void => {
-      const currentById = new Map(store.getState().workspaces.map((w) => [w.id, w]));
+    const replaceTrials = (next: TrialRecord[]): void => {
+      const currentById = new Map(store.getState().trials.map((w) => [w.id, w]));
       const merged = next.map((w) => currentById.get(w.id) ?? w);
-      store.setState({ workspaces: merged });
+      store.setState({ trials: merged });
       // Trigger persistence flush via a tracked action.
       store.getState().setMode(store.getState().mode);
     };
 
     return {
       instruments,
-      workspaces,
-      addWorkspace: (instrumentName) => {
-        const next = addWorkspaceOp(store.getState().workspaces, instruments, instrumentName);
-        replaceWorkspaces(next);
+      trials,
+      addTrial: (instrumentName) => {
+        const next = addTrialOp(store.getState().trials, instruments, instrumentName);
+        replaceTrials(next);
       },
-      cloneWorkspace: (id) => {
-        const next = cloneWorkspaceOp(store.getState().workspaces, id);
-        replaceWorkspaces(next);
+      cloneTrial: (id) => {
+        const next = cloneTrialOp(store.getState().trials, id);
+        replaceTrials(next);
       },
-      closeWorkspace: (id) => {
-        const next = closeWorkspaceOp(store.getState().workspaces, id);
-        replaceWorkspaces(next);
+      closeTrial: (id) => {
+        const next = closeTrialOp(store.getState().trials, id);
+        replaceTrials(next);
       },
-      reorderWorkspaces: (ids) => {
-        replaceWorkspaces(reorderWorkspacesOp(store.getState().workspaces, ids));
+      reorderTrials: (ids) => {
+        replaceTrials(reorderTrialsOp(store.getState().trials, ids));
       },
-      resetWorkspace: (id) => {
-        const next = resetWorkspaceOp(store.getState().workspaces, id, instruments);
+      resetTrial: (id) => {
+        const next = resetTrialOp(store.getState().trials, id, instruments);
         const record = next.find((w) => w.id === id);
         if (!record) return;
         store.setState((s) => ({
-          workspaces: s.workspaces.map((w) =>
+          trials: s.trials.map((w) =>
             w.id === id
               ? { ...w, config: record.config, state: record.state, view: record.view }
               : w,
           ),
         }));
-        store.getState().updateWorkspaceView(id, record.view);
+        store.getState().updateTrialView(id, record.view);
       },
       savedSnapshots,
-      saveSnapshot: (workspaceId, name) => {
-        store.getState().saveSnapshot(workspaceId, name ?? `Save ${new Date().toLocaleString()}`);
+      saveSnapshot: (trialId, name) => {
+        store.getState().saveSnapshot(trialId, name ?? `Save ${new Date().toLocaleString()}`);
       },
-      loadSnapshot: (workspaceId, snapshotId) => {
-        store.getState().loadSnapshot(snapshotId, workspaceId);
+      loadSnapshot: (trialId, snapshotId) => {
+        store.getState().loadSnapshot(snapshotId, trialId);
       },
       deleteSnapshot: (snapshotId) => {
         store.getState().deleteSnapshot(snapshotId);
@@ -173,7 +173,7 @@ export function Lab({
         store.getState().setMode(m);
       },
     };
-  }, [instruments, workspaces, savedSnapshots, modeValue, store]);
+  }, [instruments, trials, savedSnapshots, modeValue, store]);
 
   // Only override the backdrop in dark, where there is one to override.
   // Setting a CSS custom property is the sanctioned use of inline style.
@@ -192,18 +192,18 @@ export function Lab({
           style={backdropStyle}
         >
           <LabShell title={title ?? 'Labkit'} mode={modeValue} header={children}>
-            <WorkspaceGrid
-              ids={workspaces.map((w) => w.id)}
+            <Workspace
+              ids={trials.map((w) => w.id)}
               resizable
               reorderable
-              onReorder={(ids) => contextValue.reorderWorkspaces(ids)}
-              layout={layout as WorkspaceLayout}
+              onReorder={(ids) => contextValue.reorderTrials(ids)}
+              layout={layout as TrialLayout}
               onLayoutChange={(next) => store.getState().setLayout(next)}
             >
-              {workspaces.map((w) => (
-                <Workspace key={w.id} id={w.id} />
+              {trials.map((w) => (
+                <Trial key={w.id} id={w.id} />
               ))}
-            </WorkspaceGrid>
+            </Workspace>
           </LabShell>
         </ThemeProvider>
       </LabContext.Provider>

package/src/lab/LabContext.ts

@@ -1,21 +1,21 @@
 import { createContext, useContext } from 'react';
-import type { Instrument } from '../instrument/types';
-import type { LabMode, SavedSnapshot, WorkspaceRecord } from '../state/types';
+import type { InstrumentList } from '../instrument/types';
+import type { LabMode, SavedSnapshot, TrialRecord } from '../state/types';
 
 /** Lab-wide state and commands: the available instruments, the open
- *  workspaces and the operations over them, saved snapshots, and the color
+ *  trials and the operations over them, saved snapshots, and the color
  *  mode. */
 export interface LabContextValue {
-  instruments: Instrument[];
-  workspaces: WorkspaceRecord[];
-  addWorkspace: (instrumentName: string) => void;
-  cloneWorkspace: (id: string) => void;
-  closeWorkspace: (id: string) => void;
-  resetWorkspace: (id: string) => void;
-  reorderWorkspaces: (ids: readonly string[]) => void;
+  instruments: InstrumentList;
+  trials: TrialRecord[];
+  addTrial: (instrumentName: string) => void;
+  cloneTrial: (id: string) => void;
+  closeTrial: (id: string) => void;
+  resetTrial: (id: string) => void;
+  reorderTrials: (ids: readonly string[]) => void;
   savedSnapshots: SavedSnapshot[];
-  saveSnapshot: (workspaceId: string, name?: string) => void;
-  loadSnapshot: (workspaceId: string, snapshotId: string) => void;
+  saveSnapshot: (trialId: string, name?: string) => void;
+  loadSnapshot: (trialId: string, snapshotId: string) => void;
   deleteSnapshot: (snapshotId: string) => void;
   mode: LabMode;
   setMode: (m: LabMode) => void;

package/src/lab/LabShell.tsx

@@ -18,7 +18,7 @@ export interface LabShellProps {
 
 /** Page frame for a lab: a titled header, a body, and an optional footer,
  *  themed for the resolved color mode. Presentational only — use `<Lab>` when
- *  the workspace runtime is wanted too. */
+ *  the trial runtime is wanted too. */
 export function LabShell({ title, children, header, footer, mode = 'auto' }: LabShellProps) {
   const resolved = useResolvedMode(mode);
   const outer = useThemeOptional();

package/src/lab/{WorkspaceGrid.less → Workspace.less}

@@ -1,13 +1,13 @@
 // Tiles are positioned by windease at strategy-computed rects; `.windease-zone`
 // (from windease/styles.css) supplies the containing block and the 100% box.
 // This class exists for consumers to target.
-.lk-workspace-grid {
+.lk-workspace {
   min-height: 0;
 }
 
 // Only rendered when `reorderable` — a tile is full of controls, so the drag
 // target has to be its own strip rather than the whole pane.
-.lk-workspace-tile {
+.lk-trial-tile {
   display: flex;
   flex-direction: column;
   height: 100%;

package/src/lab/{WorkspaceGrid.stories.tsx → Workspace.stories.tsx}

@@ -1,13 +1,13 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
-import { WorkspaceGrid } from './WorkspaceGrid';
+import { Workspace } from './Workspace';
 
-const meta: Meta<typeof WorkspaceGrid> = {
-  title: 'labkit/Lab/WorkspaceGrid',
-  component: WorkspaceGrid,
+const meta: Meta<typeof Workspace> = {
+  title: 'labkit/Lab/Workspace',
+  component: Workspace,
 };
 export default meta;
 
-type Story = StoryObj<typeof WorkspaceGrid>;
+type Story = StoryObj<typeof Workspace>;
 
 const Tile = ({ children }: { children: React.ReactNode }) => (
   <div
@@ -28,9 +28,9 @@ const Tile = ({ children }: { children: React.ReactNode }) => (
 export const OneTile: Story = {
   render: () => (
     <div style={{ height: 400 }}>
-      <WorkspaceGrid>
+      <Workspace>
         <Tile>1</Tile>
-      </WorkspaceGrid>
+      </Workspace>
     </div>
   ),
 };
@@ -38,11 +38,11 @@ export const OneTile: Story = {
 export const ThreeTiles: Story = {
   render: () => (
     <div style={{ height: 400 }}>
-      <WorkspaceGrid>
+      <Workspace>
         <Tile>1</Tile>
         <Tile>2</Tile>
         <Tile>3</Tile>
-      </WorkspaceGrid>
+      </Workspace>
     </div>
   ),
 };
@@ -50,12 +50,12 @@ export const ThreeTiles: Story = {
 export const SevenTiles: Story = {
   render: () => (
     <div style={{ height: 600 }}>
-      <WorkspaceGrid>
+      <Workspace>
         {Array.from({ length: 7 }).map((_, i) => (
           // biome-ignore lint/suspicious/noArrayIndexKey: static demo list
           <Tile key={i}>{i + 1}</Tile>
         ))}
-      </WorkspaceGrid>
+      </Workspace>
     </div>
   ),
 };
@@ -65,13 +65,13 @@ export const SevenTiles: Story = {
 export const Resizable: Story = {
   render: () => (
     <div style={{ height: 500 }}>
-      <WorkspaceGrid ids={['a', 'b', 'c', 'd', 'e']} resizable>
+      <Workspace ids={['a', 'b', 'c', 'd', 'e']} resizable>
         <Tile>1</Tile>
         <Tile>2</Tile>
         <Tile>3</Tile>
         <Tile>4</Tile>
         <Tile>5</Tile>
-      </WorkspaceGrid>
+      </Workspace>
     </div>
   ),
 };

package/src/lab/{WorkspaceGrid.test.tsx → Workspace.test.tsx}

@@ -1,17 +1,17 @@
 import { render, screen } from '@testing-library/react';
 import { describe, expect, test, vi } from 'vitest';
-import { WorkspaceGrid } from './WorkspaceGrid';
+import { Workspace } from './Workspace';
 
 const VIEWPORT = { w: 800, h: 600 };
 
-describe('WorkspaceGrid', () => {
+describe('Workspace', () => {
   test('renders all children', () => {
     render(
-      <WorkspaceGrid viewport={VIEWPORT}>
+      <Workspace viewport={VIEWPORT}>
         <div>one</div>
         <div>two</div>
         <div>three</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     expect(screen.getByText('one')).toBeInTheDocument();
     expect(screen.getByText('two')).toBeInTheDocument();
@@ -21,54 +21,54 @@ describe('WorkspaceGrid', () => {
   test('keeps a child with the tile its id names when an earlier one closes', () => {
     const ids = ['a', 'b', 'c'];
     const { rerender, container } = render(
-      <WorkspaceGrid ids={ids} viewport={VIEWPORT}>
+      <Workspace ids={ids} viewport={VIEWPORT}>
         <div>a</div>
         <div>b</div>
         <div>c</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     expect(container.querySelector('[data-node="c"]')).toHaveTextContent('c');
 
     rerender(
-      <WorkspaceGrid ids={['b', 'c']} viewport={VIEWPORT}>
+      <Workspace ids={['b', 'c']} viewport={VIEWPORT}>
         <div>b</div>
         <div>c</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     expect(container.querySelector('[data-node="c"]')).toHaveTextContent('c');
     expect(container.querySelector('[data-node="a"]')).toBeNull();
   });
 
-  test('uses lk-workspace-grid class', () => {
+  test('uses lk-workspace class', () => {
     const { container } = render(
-      <WorkspaceGrid viewport={VIEWPORT}>
+      <Workspace viewport={VIEWPORT}>
         <div />
-      </WorkspaceGrid>,
+      </Workspace>,
     );
-    expect((container.firstChild as HTMLElement).className).toContain('lk-workspace-grid');
+    expect((container.firstChild as HTMLElement).className).toContain('lk-workspace');
   });
 
   test('renders resize affordances only when resizable', () => {
     const { container, rerender } = render(
-      <WorkspaceGrid ids={['a', 'b']} viewport={VIEWPORT}>
+      <Workspace ids={['a', 'b']} viewport={VIEWPORT}>
         <div>a</div>
         <div>b</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     expect(container.querySelectorAll('[role="separator"]')).toHaveLength(0);
 
     rerender(
-      <WorkspaceGrid ids={['a', 'b']} resizable viewport={VIEWPORT}>
+      <Workspace ids={['a', 'b']} resizable viewport={VIEWPORT}>
         <div>a</div>
         <div>b</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     expect(container.querySelectorAll('[role="separator"]').length).toBeGreaterThan(0);
   });
 
   test('applies a saved extent to a tile as it registers', () => {
     const { container } = render(
-      <WorkspaceGrid
+      <Workspace
         ids={['a', 'b']}
         resizable
         viewport={VIEWPORT}
@@ -76,7 +76,7 @@ describe('WorkspaceGrid', () => {
       >
         <div>a</div>
         <div>b</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     const a = container.querySelector('[data-node="a"]') as HTMLElement;
     const b = container.querySelector('[data-node="b"]') as HTMLElement;
@@ -87,14 +87,14 @@ describe('WorkspaceGrid', () => {
   test('reports the order a drop would produce instead of applying it', () => {
     const onReorder = vi.fn();
     const { container } = render(
-      <WorkspaceGrid ids={['a', 'b']} reorderable onReorder={onReorder} viewport={VIEWPORT}>
+      <Workspace ids={['a', 'b']} reorderable onReorder={onReorder} viewport={VIEWPORT}>
         <div>a</div>
         <div>b</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
     // The grid is controlled: it renders a handle per tile and commits nothing
     // itself. Order still comes from `ids`.
-    expect(container.querySelectorAll('.lk-workspace-tile__grip')).toHaveLength(2);
+    expect(container.querySelectorAll('.lk-trial-tile__grip')).toHaveLength(2);
     expect(onReorder).not.toHaveBeenCalled();
     const nodes = [...container.querySelectorAll('[data-node]')].map((el) =>
       el.getAttribute('data-node'),
@@ -104,11 +104,11 @@ describe('WorkspaceGrid', () => {
 
   test('renders no drag handles unless reorderable', () => {
     const { container } = render(
-      <WorkspaceGrid ids={['a', 'b']} viewport={VIEWPORT}>
+      <Workspace ids={['a', 'b']} viewport={VIEWPORT}>
         <div>a</div>
         <div>b</div>
-      </WorkspaceGrid>,
+      </Workspace>,
     );
-    expect(container.querySelectorAll('.lk-workspace-tile__grip')).toHaveLength(0);
+    expect(container.querySelectorAll('.lk-trial-tile__grip')).toHaveLength(0);
   });
 });

package/src/lab/{WorkspaceGrid.tsx → Workspace.tsx}

@@ -17,18 +17,18 @@ import {
   StrategyRegistryProvider,
 } from 'windease/react';
 
-const ZONE_ID = asNodeId('lk-workspaces');
+const ZONE_ID = asNodeId('lk-workspace');
 const STRATEGIES = { grid: gridStrategy as never };
-const KIND = 'workspace';
+const KIND = 'trial';
 
 /** A tile's persisted extent, keyed by the id its caller gave it. Grid resizes
  *  write `span`; `size` is here because a strategy swap would write that. */
-export type WorkspaceLayout = Record<
+export type TrialLayout = Record<
   string,
   { size?: { w?: number; h?: number }; span?: { cols?: number; rows?: number } }
 >;
 
-export interface WorkspaceGridProps {
+export interface WorkspaceProps {
   children: ReactNode;
   /**
    * Stable id per child, positionally matched. Supply these whenever a tile
@@ -48,10 +48,10 @@ export interface WorkspaceGridProps {
   /** The full id list a drop would produce, in its new order. */
   onReorder?: (ids: string[]) => void;
   /** Extents from a previous session, applied to tiles as they register. */
-  layout?: WorkspaceLayout;
+  layout?: TrialLayout;
   /** Fires when a tile's extent changes. Persist it and hand it back as
    *  `layout` to make a resize survive a reload. */
-  onLayoutChange?: (layout: WorkspaceLayout) => void;
+  onLayoutChange?: (layout: TrialLayout) => void;
   gap?: number;
   padding?: number;
   /**
@@ -62,23 +62,23 @@ export interface WorkspaceGridProps {
   viewport?: { w: number; h: number };
 }
 
-function extentOf(store: Store, id: NodeId): WorkspaceLayout[string] | null {
-  const p = store.getNode(id)?.membership?.placement as WorkspaceLayout[string] | undefined;
+function extentOf(store: Store, id: NodeId): TrialLayout[string] | null {
+  const p = store.getNode(id)?.membership?.placement as TrialLayout[string] | undefined;
   if (!p) return null;
-  const out: WorkspaceLayout[string] = {};
+  const out: TrialLayout[string] = {};
   if (p.size) out.size = p.size;
   if (p.span) out.span = p.span;
   return Object.keys(out).length > 0 ? out : null;
 }
 
 /**
- * Auto-balanced tiling of workspaces, `ceil(sqrt(n))` columns wide.
+ * Auto-balanced tiling of trials, `ceil(sqrt(n))` columns wide.
  *
  * Tiles are absolutely positioned at the rects `gridStrategy` computes, not
  * laid out by CSS — `windease/styles.css` (folded into
  * `@weasel-js/labkit/styles.css`) carries the rules that positioning depends on.
  */
-export function WorkspaceGrid({
+export function Workspace({
   children,
   ids,
   resizable = false,
@@ -89,7 +89,7 @@ export function WorkspaceGrid({
   gap = 12,
   padding = 0,
   viewport,
-}: WorkspaceGridProps) {
+}: WorkspaceProps) {
   const items = Children.toArray(children);
   const idKey = ids ? ids.join(',') : `#${items.length}`;
   // biome-ignore lint/correctness/useExhaustiveDependencies: idKey is the stable projection of items/ids; depending on those directly rebuilds every render and re-runs the sync effect forever
@@ -142,7 +142,7 @@ export function WorkspaceGrid({
   useEffect(() => {
     if (!onLayoutChange) return;
     return store.events.on('node.placementChanged', () => {
-      const next: WorkspaceLayout = {};
+      const next: TrialLayout = {};
       for (const child of store.getChildren(ZONE_ID)) {
         const extent = extentOf(store, child.id);
         if (extent) next[child.id] = extent;
@@ -164,11 +164,11 @@ export function WorkspaceGrid({
         if (!reorderable) return content;
         // A tile is full of controls, so the whole thing can't be the handle.
         return (
-          <div className="lk-workspace-tile">
-            <DragHandle nodeId={node.id} className="lk-workspace-tile__grip">
-              <span className="lk-workspace-tile__grip-dots" aria-hidden="true" />
+          <div className="lk-trial-tile">
+            <DragHandle nodeId={node.id} className="lk-trial-tile__grip">
+              <span className="lk-trial-tile__grip-dots" aria-hidden="true" />
             </DragHandle>
-            <div className="lk-workspace-tile__body">{content}</div>
+            <div className="lk-trial-tile__body">{content}</div>
           </div>
         );
       },
@@ -179,7 +179,7 @@ export function WorkspaceGrid({
     <Container
       parentId={ZONE_ID}
       chrome={chrome}
-      className="lk-workspace-grid windease-zone"
+      className="lk-workspace windease-zone"
       affordances={resizable}
       viewport={viewport}
       onChildOrderChange={reorderable ? commitOrder : undefined}

package/src/lab/index.ts

@@ -4,5 +4,5 @@ export type { LabContextValue } from './LabContext';
 export { LabContext, useLabContext } from './LabContext';
 export type { LabShellProps } from './LabShell';
 export { LabShell } from './LabShell';
-export type { WorkspaceGridProps } from './WorkspaceGrid';
-export { WorkspaceGrid } from './WorkspaceGrid';
+export type { WorkspaceProps } from './Workspace';
+export { Workspace } from './Workspace';