@bendyline/squisq-editor-react 2.1.0 → 2.2.0

package/src/__tests__/canvasSurfaceTextEditing.test.tsx

@@ -1,60 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-import { afterEach, describe, expect, it, vi } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import type { ImageEditDoc } from '@bendyline/squisq/schemas';
-import { CanvasSurface } from '../imageEditor/CanvasSurface.js';
-import type { ImageEditorAction } from '../imageEditor/state.js';
-
-afterEach(() => {
-  vi.restoreAllMocks();
-});
-
-describe('CanvasSurface text editing', () => {
-  it('uses one tightly measured edit box and applies SVG zoom only once', async () => {
-    const context = {
-      font: '',
-      measureText: (text: string) => ({ width: text.length * 10 }),
-    } as unknown as CanvasRenderingContext2D;
-    vi.spyOn(HTMLCanvasElement.prototype, 'getContext').mockImplementation(() => context);
-
-    const doc: ImageEditDoc = {
-      version: 1,
-      canvas: { width: 640, height: 480 },
-      layers: [
-        {
-          id: 'text-1',
-          type: 'text',
-          name: 'Text',
-          position: { x: 100, y: 80, width: 240, height: 48 },
-          content: {
-            text: 'hello',
-            style: { fontSize: 20, lineHeight: 1.4, color: '#111111' },
-          },
-        },
-      ],
-    };
-
-    const { container } = render(
-      <CanvasSurface
-        doc={doc}
-        selectedLayerId="text-1"
-        tool="select"
-        resolveAssetUrl={async (path) => path}
-        dispatch={vi.fn<(action: ImageEditorAction) => void>()}
-        requestEditLayerId="text-1"
-        zoom={2}
-      />,
-    );
-
-    const textarea = (await screen.findByRole('textbox')) as HTMLTextAreaElement;
-    const editBox = container.querySelector('foreignObject');
-
-    expect(editBox?.getAttribute('width')).toBe('50');
-    expect(textarea.style.fontSize).toBe('20px');
-    await waitFor(() => {
-      expect(container.querySelector('.squisq-image-editor-selection-handles')).toBeNull();
-    });
-  });
-});

package/src/__tests__/codeContextSectionView.test.tsx

@@ -1,97 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-import { describe, expect, it, vi } from 'vitest';
-import { fireEvent, render } from '@testing-library/react';
-import { CodeContextSectionView } from '../codeContext/CodeContextSectionView';
-
-const noop = () => {};
-
-const baseSection = {
-  id: 'foo@10',
-  summaryMarkdown: '**foo** — does things · ↓2 imported-by',
-  markdown: 'Body text with [`a.ts`](workspace-nav:src%2Fa.ts) and [line 4](#L4).',
-};
-
-function renderView(over: Partial<Parameters<typeof CodeContextSectionView>[0]> = {}) {
-  const props = {
-    section: baseSection,
-    expanded: false,
-    onToggle: vi.fn(),
-    linkSchemes: ['workspace-nav'] as const,
-    onLinkClick: vi.fn(),
-    onRevealLine: vi.fn(),
-    onMeasure: noop,
-    ...over,
-  };
-  const utils = render(<CodeContextSectionView {...props} />);
-  return { ...utils, props };
-}
-
-describe('<CodeContextSectionView>', () => {
-  it('renders the strip collapsed, body absent (lazy)', () => {
-    const { container } = renderView();
-    expect(container.querySelector('.squisq-ccx-strip')).toBeTruthy();
-    expect(container.textContent).toContain('foo');
-    expect(container.querySelector('.squisq-ccx-body')).toBeNull();
-  });
-
-  it('strip click calls onToggle with the section id', () => {
-    const { container, props } = renderView();
-    fireEvent.click(container.querySelector('.squisq-ccx-strip')!);
-    expect(props.onToggle).toHaveBeenCalledWith('foo@10');
-  });
-
-  it('expanded body renders markdown with host-scheme links as real anchors', () => {
-    const { container } = renderView({ expanded: true });
-    const body = container.querySelector('.squisq-ccx-body')!;
-    expect(body.textContent).toContain('Body text');
-    const anchors = [...body.querySelectorAll('a')].map((a) => a.getAttribute('href'));
-    expect(anchors).toContain('workspace-nav:src%2Fa.ts');
-    expect(anchors).toContain('#L4');
-  });
-
-  it('expanded without markdown shows the loading row', () => {
-    const { container } = renderView({
-      expanded: true,
-      section: { ...baseSection, markdown: undefined },
-    });
-    expect(container.querySelector('.squisq-ccx-body--loading')?.textContent).toBe('Loading…');
-  });
-
-  it('link clicks are intercepted: handled by default, defaulted on false', () => {
-    const onLinkClick = vi.fn(() => undefined);
-    const { container } = renderView({ expanded: true, onLinkClick });
-    const nav = [...container.querySelectorAll('a')].find(
-      (a) => a.getAttribute('href') === 'workspace-nav:src%2Fa.ts',
-    )!;
-    const first = fireEvent.click(nav);
-    expect(onLinkClick).toHaveBeenCalledWith('workspace-nav:src%2Fa.ts', {
-      sectionId: 'foo@10',
-    });
-    expect(first).toBe(false); // preventDefault was called
-
-    onLinkClick.mockReturnValue(false as unknown as undefined);
-    const second = fireEvent.click(nav);
-    expect(second).toBe(true); // host declined — default navigation allowed
-  });
-
-  it('#L links reveal natively and never reach onLinkClick', () => {
-    const onLinkClick = vi.fn();
-    const onRevealLine = vi.fn();
-    const { container } = renderView({ expanded: true, onLinkClick, onRevealLine });
-    const line = [...container.querySelectorAll('a')].find(
-      (a) => a.getAttribute('href') === '#L4',
-    )!;
-    fireEvent.click(line);
-    expect(onRevealLine).toHaveBeenCalledWith(4);
-    expect(onLinkClick).not.toHaveBeenCalled();
-  });
-
-  it('without linkSchemes, custom-scheme links render blocked (no anchor)', () => {
-    const { container } = renderView({ expanded: true, linkSchemes: undefined });
-    const anchors = [...container.querySelectorAll('a')].map((a) => a.getAttribute('href'));
-    expect(anchors).not.toContain('workspace-nav:src%2Fa.ts');
-    expect(container.querySelector('.squisq-md-link--blocked')).toBeTruthy();
-  });
-});

package/src/__tests__/codeContextZoneManager.test.ts

@@ -1,127 +0,0 @@
-/**
- * @vitest-environment jsdom
- *
- * Exercises the zone manager against a fake Monaco editor with a recording
- * changeViewZones accessor — batch semantics, delegate mutation on move and
- * height changes, model-change rebuild, and dispose cleanup.
- */
-import { describe, expect, it, vi } from 'vitest';
-import type { editor as MonacoEditorNs } from 'monaco-editor';
-import { CodeContextZoneManager } from '../codeContext/CodeContextZoneManager';
-
-type Zone = MonacoEditorNs.IViewZone & { ordinal?: number };
-
-function fakeEditor() {
-  const zones = new Map<string, Zone>();
-  const layoutCalls: string[] = [];
-  let counter = 0;
-  let batches = 0;
-  let modelCb: (() => void) | null = null;
-  const accessor = {
-    addZone: (zone: Zone) => {
-      const id = `z${++counter}`;
-      zones.set(id, zone);
-      return id;
-    },
-    removeZone: (id: string) => {
-      zones.delete(id);
-    },
-    layoutZone: (id: string) => {
-      layoutCalls.push(id);
-    },
-  };
-  const editor = {
-    changeViewZones: (cb: (a: typeof accessor) => void) => {
-      batches++;
-      cb(accessor);
-    },
-    onDidChangeModel: (cb: () => void) => {
-      modelCb = cb;
-      return { dispose: vi.fn() };
-    },
-  } as unknown as MonacoEditorNs.IStandaloneCodeEditor;
-  return {
-    editor,
-    zones,
-    layoutCalls,
-    get batches() {
-      return batches;
-    },
-    fireModelChange: () => modelCb?.(),
-  };
-}
-
-describe('CodeContextZoneManager', () => {
-  it('creates zones above the anchor line in one batch, with dom nodes', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    mgr.sync([
-      { id: 'file', line: 0, ordinal: 0 },
-      { id: 'foo@10', line: 10, ordinal: 1 },
-    ]);
-    expect(fake.batches).toBe(1);
-    expect(fake.zones.size).toBe(2);
-    const list = [...fake.zones.values()];
-    expect(list.map((z) => z.afterLineNumber)).toEqual([0, 9]);
-    expect(list.map((z) => z.ordinal)).toEqual([0, 1]);
-    expect(list.every((z) => z.suppressMouseDown)).toBe(true);
-    expect(mgr.getDomNode('foo@10')?.className).toBe('squisq-ccx-zone');
-  });
-
-  it('sync with no changes performs no batch', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    expect(fake.batches).toBe(1);
-  });
-
-  it('moves mutate the delegate and layoutZone — dom node survives', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    const nodeBefore = mgr.getDomNode('a');
-    mgr.sync([{ id: 'a', line: 8, ordinal: 1 }]);
-    expect(fake.zones.size).toBe(1);
-    expect([...fake.zones.values()][0]!.afterLineNumber).toBe(7);
-    expect(fake.layoutCalls.length).toBe(1);
-    expect(mgr.getDomNode('a')).toBe(nodeBefore);
-  });
-
-  it('setHeight mutates heightInPx and lays out; sub-pixel deltas are ignored', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    mgr.setHeight('a', 120);
-    expect([...fake.zones.values()][0]!.heightInPx).toBe(120);
-    expect(fake.layoutCalls.length).toBe(1);
-    mgr.setHeight('a', 119.5); // ceils back to 120 — no relayout
-    expect(fake.layoutCalls.length).toBe(1);
-  });
-
-  it('a model change drops bookkeeping; the next sync recreates zones', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    const onChange = vi.fn();
-    mgr.onDidChangeZones(onChange);
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    fake.fireModelChange();
-    expect(onChange).toHaveBeenCalledTimes(2); // sync + model change
-    expect(mgr.getDomNode('a')).toBeUndefined();
-    mgr.sync([{ id: 'a', line: 3, ordinal: 1 }]);
-    expect(mgr.getDomNode('a')).toBeDefined();
-  });
-
-  it('dispose removes every zone and goes inert', () => {
-    const fake = fakeEditor();
-    const mgr = new CodeContextZoneManager(fake.editor);
-    mgr.sync([
-      { id: 'a', line: 1, ordinal: 1 },
-      { id: 'b', line: 2, ordinal: 2 },
-    ]);
-    mgr.dispose();
-    expect(fake.zones.size).toBe(0);
-    mgr.sync([{ id: 'c', line: 3, ordinal: 1 }]);
-    expect(fake.zones.size).toBe(0);
-  });
-});

package/src/__tests__/createShapeLayer.test.ts

@@ -1,46 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { createShapeLayer } from '../imageEditor/createShapeLayer';
-
-describe('createShapeLayer', () => {
-  it('maps native primitives to ShapeLayer, centered on the drop point', () => {
-    const rect = createShapeLayer('rectangle', 100, 100);
-    expect(rect.type).toBe('shape');
-    if (rect.type === 'shape') expect(rect.content.shape).toBe('rect');
-    // 120×80 box centered at (100,100) → top-left (40, 60).
-    expect(rect.position).toMatchObject({ x: 40, y: 60, width: 120, height: 80 });
-
-    expect(createShapeLayer('circle', 0, 0).type).toBe('shape');
-    const line = createShapeLayer('line', 0, 0);
-    if (line.type === 'shape') expect(line.content.shape).toBe('line');
-  });
-
-  it('maps named shapes to a PathLayer carrying shapeKind + derived d', () => {
-    const diamond = createShapeLayer('diamond', 100, 100);
-    expect(diamond.type).toBe('path');
-    if (diamond.type === 'path') {
-      expect(diamond.content.shapeKind).toBe('diamond');
-      expect(diamond.content.d.length).toBeGreaterThan(0);
-      expect(diamond.content.fill).toBeTruthy();
-    }
-  });
-
-  it('maps the line arrow to a PathLayer with an end marker (no shapeKind)', () => {
-    const arrow = createShapeLayer('arrow', 50, 50);
-    expect(arrow.type).toBe('path');
-    if (arrow.type === 'path') {
-      expect(arrow.content.endMarker).toBe('arrow');
-      expect(arrow.content.shapeKind).toBeUndefined();
-      expect(arrow.content.fill).toBe('none');
-    }
-  });
-
-  it('maps the text shape to a TextLayer', () => {
-    const text = createShapeLayer('text', 10, 10);
-    expect(text.type).toBe('text');
-  });
-
-  it('prettifies multi-word kinds for the layer name', () => {
-    expect(createShapeLayer('arrow-right', 0, 0).name).toBe('Arrow Right');
-    expect(createShapeLayer('right-triangle', 0, 0).name).toBe('Right Triangle');
-  });
-});

package/src/__tests__/customLayoutManagerTheme.test.tsx

@@ -1,34 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-import { render, screen } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
-
-vi.mock('../EditorContext', () => ({
-  useEditorContext: () => ({
-    colorScheme: 'dark',
-    mediaProvider: null,
-    doc: null,
-    markdownSource: '',
-    setMarkdownSource: vi.fn(),
-  }),
-}));
-
-// The regression is at the manager's portaled theme boundary; the designer's
-// interaction surface is unrelated and expensive to mount for this assertion.
-vi.mock('../customTemplates/TemplateDesigner', () => ({
-  TemplateDesigner: () => <div data-testid="template-designer" />,
-}));
-
-import { CustomLayoutManager } from '../customTemplates/CustomLayoutManager';
-
-describe('CustomLayoutManager theme propagation', () => {
-  it('copies the editor dark scheme onto its portaled theme scope', () => {
-    render(<CustomLayoutManager onClose={vi.fn()} />);
-
-    const dialog = screen.getByRole('dialog', { name: 'Custom layouts' });
-    expect(dialog.getAttribute('data-theme')).toBe('dark');
-    expect(dialog.classList.contains('squisq-editor-shell')).toBe(true);
-    expect(screen.getByTestId('template-designer')).toBeTruthy();
-  });
-});

package/src/__tests__/detectMarkdown.test.ts

@@ -1,73 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { looksLikeMarkdown } from '../detectMarkdown';
-
-describe('looksLikeMarkdown', () => {
-  it('returns false for empty / trivial text', () => {
-    expect(looksLikeMarkdown('')).toBe(false);
-    expect(looksLikeMarkdown(' ')).toBe(false);
-    expect(looksLikeMarkdown('Hello')).toBe(false);
-  });
-
-  it('returns false for plain prose', () => {
-    expect(looksLikeMarkdown('Hello world. This is just a sentence.')).toBe(false);
-    expect(looksLikeMarkdown('Multiple\nlines of\nplain text without any markdown syntax.')).toBe(
-      false,
-    );
-  });
-
-  it('detects ATX headings', () => {
-    expect(looksLikeMarkdown('# Heading')).toBe(true);
-    expect(looksLikeMarkdown('## Subheading')).toBe(true);
-    expect(looksLikeMarkdown('###### Tiny heading')).toBe(true);
-    expect(looksLikeMarkdown('Some intro\n\n## A heading\n\nBody text')).toBe(true);
-  });
-
-  it('does not treat hash in middle of line as a heading', () => {
-    expect(looksLikeMarkdown('See issue #123 for details.')).toBe(false);
-  });
-
-  it('detects bullet lists', () => {
-    expect(looksLikeMarkdown('- first\n- second\n- third')).toBe(true);
-    expect(looksLikeMarkdown('* item one\n* item two')).toBe(true);
-    expect(looksLikeMarkdown('+ plus item')).toBe(true);
-  });
-
-  it('detects ordered lists', () => {
-    expect(looksLikeMarkdown('1. step one\n2. step two')).toBe(true);
-  });
-
-  it('detects blockquotes', () => {
-    expect(looksLikeMarkdown('> A quoted line')).toBe(true);
-  });
-
-  it('detects code fences', () => {
-    expect(looksLikeMarkdown('```\nconst x = 1;\n```')).toBe(true);
-    expect(looksLikeMarkdown('```ts\nlet y = 2;\n```')).toBe(true);
-  });
-
-  it('detects GFM tables', () => {
-    expect(looksLikeMarkdown('| Col1 | Col2 |\n| --- | --- |\n| a | b |')).toBe(true);
-  });
-
-  it('detects task lists', () => {
-    expect(looksLikeMarkdown('- [ ] todo\n- [x] done')).toBe(true);
-  });
-
-  it('detects mixed inline patterns (2+ hits)', () => {
-    expect(looksLikeMarkdown('**Important:** see [the docs](http://example.com) for more')).toBe(
-      true,
-    );
-    expect(looksLikeMarkdown('Use `foo()` and read [the page](http://x.com)')).toBe(true);
-  });
-
-  it('does not trigger on a single inline pattern in plain prose', () => {
-    expect(looksLikeMarkdown('Visit https://example.com or [the docs](http://docs.com)')).toBe(
-      false,
-    );
-    expect(looksLikeMarkdown('She said `hello` to him')).toBe(false);
-  });
-
-  it('detects markdown with windows line endings', () => {
-    expect(looksLikeMarkdown('# Heading\r\n\r\nBody text')).toBe(true);
-  });
-});

package/src/__tests__/diffContextSections.test.ts

@@ -1,39 +0,0 @@
-import { describe, expect, it } from 'vitest';
-import { diffContextSections, type ZoneSpec } from '../codeContext/diffContextSections';
-
-const spec = (id: string, line: number, ordinal = 0): ZoneSpec => ({ id, line, ordinal });
-
-describe('diffContextSections', () => {
-  it('adds everything on first sync', () => {
-    const d = diffContextSections([], [spec('a', 1), spec('b', 5)]);
-    expect(d.add.map((z) => z.id)).toEqual(['a', 'b']);
-    expect(d.remove).toEqual([]);
-    expect(d.move).toEqual([]);
-  });
-
-  it('is a no-op for identical specs', () => {
-    const specs = [spec('a', 1, 1), spec('b', 5, 2)];
-    const d = diffContextSections(
-      specs,
-      specs.map((s) => ({ ...s })),
-    );
-    expect(d.add).toEqual([]);
-    expect(d.remove).toEqual([]);
-    expect(d.move).toEqual([]);
-  });
-
-  it('moves when a line or ordinal changes, removes vanished ids', () => {
-    const d = diffContextSections(
-      [spec('a', 1, 1), spec('b', 5, 2), spec('c', 9, 3)],
-      [spec('a', 2, 1), spec('b', 5, 4)],
-    );
-    expect(d.move.map((z) => z.id)).toEqual(['a', 'b']);
-    expect(d.remove).toEqual(['c']);
-    expect(d.add).toEqual([]);
-  });
-
-  it('duplicate ids in next: first occurrence wins, no double-add', () => {
-    const d = diffContextSections([], [spec('a', 1), spec('a', 7)]);
-    expect(d.add).toEqual([spec('a', 1)]);
-  });
-});

package/src/__tests__/documentSettingsDialog.test.tsx

@@ -1,197 +0,0 @@
-import { describe, it, expect, vi, afterEach } from 'vitest';
-import { cleanup, fireEvent, render, screen, within } from '@testing-library/react';
-import { DocumentSettingsDialog } from '../DocumentSettingsDialog';
-
-afterEach(() => cleanup());
-
-function open(source: string, onSave: (next: string) => void) {
-  return render(
-    <DocumentSettingsDialog markdownSource={source} onSave={onSave} onClose={() => {}} />,
-  );
-}
-
-function clickSave() {
-  fireEvent.click(screen.getByRole('button', { name: 'Save' }));
-}
-
-/**
- * Open the Theme picker popover and click the theme whose row title
- * matches `name`. The picker is portaled to `document.body`, so the
- * listbox lives outside the dialog form — testing-library's `screen`
- * still finds it because it queries the whole document.
- */
-function pickTheme(name: string) {
-  // Trigger button has aria-label "Theme"
-  fireEvent.click(screen.getByLabelText('Theme'));
-  // Scope the option lookup to the popover — the Transform <select> in
-  // the same dialog also exposes role="option" entries (one of which is
-  // literally "Documentary"), so a global query would collide.
-  const popover = document.querySelector<HTMLElement>('.squisq-theme-picker-popover')!;
-  fireEvent.click(within(popover).getByRole('option', { name }));
-}
-
-describe('DocumentSettingsDialog', () => {
-  it('shows the inferred title as the placeholder when no title in frontmatter', () => {
-    const onSave = vi.fn();
-    open('# My Document\n\nBody.', onSave);
-    const input = screen.getByLabelText('Title') as HTMLInputElement;
-    expect(input.value).toBe('');
-    expect(input.placeholder).toBe('My Document');
-  });
-
-  it('does not write title when input is left empty', () => {
-    const onSave = vi.fn();
-    open('# My Document\n\nBody.', onSave);
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).not.toMatch(/^---[\s\S]*title:/);
-  });
-
-  it('does not write title when value matches the inferred title', () => {
-    const onSave = vi.fn();
-    open('# My Document\n\nBody.', onSave);
-    fireEvent.change(screen.getByLabelText('Title'), { target: { value: 'My Document' } });
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).not.toMatch(/^---[\s\S]*title:/);
-  });
-
-  it('strips an existing title key when the user clears the input', () => {
-    const onSave = vi.fn();
-    const src = '---\ntitle: Old\n---\n\n# My Document\n';
-    open(src, onSave);
-    const input = screen.getByLabelText('Title') as HTMLInputElement;
-    expect(input.value).toBe('Old');
-    fireEvent.change(input, { target: { value: '' } });
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).not.toMatch(/title:/);
-  });
-
-  it('writes a title that differs from the inferred value', () => {
-    const onSave = vi.fn();
-    open('# My Document\n\nBody.', onSave);
-    fireEvent.change(screen.getByLabelText('Title'), {
-      target: { value: 'Custom Title' },
-    });
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toMatch(/^---\ntitle: Custom Title\n---/);
-  });
-
-  it('writes squisq-theme when the user picks a theme', () => {
-    const onSave = vi.fn();
-    open('# Doc\n', onSave);
-    pickTheme('Documentary');
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain('squisq-theme: documentary');
-  });
-
-  it('clears the legacy theme key when switching themes', () => {
-    const onSave = vi.fn();
-    const src = '---\ntheme: bold\n---\n\n# Doc\n';
-    open(src, onSave);
-    pickTheme('Documentary');
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain('squisq-theme: documentary');
-    expect(next).not.toMatch(/^theme:/m);
-  });
-
-  it('reads themeId and canonicalizes both legacy theme keys on save', () => {
-    const onSave = vi.fn();
-    const src = '---\nthemeId: bold\ntheme: cinematic\n---\n\n# Doc\n';
-    open(src, onSave);
-
-    expect(screen.getByLabelText('Theme').textContent).toContain('Bold');
-    clickSave();
-
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain('squisq-theme: bold');
-    expect(next).not.toMatch(/^themeId:/m);
-    expect(next).not.toMatch(/^theme:/m);
-  });
-
-  it('removes squisq-theme when reverting to default', () => {
-    const onSave = vi.fn();
-    const src = '---\nsquisq-theme: documentary\n---\n\n# Doc\n';
-    open(src, onSave);
-    pickTheme('Default');
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).not.toContain('squisq-theme');
-  });
-
-  it('removes explicit managed defaults and their legacy aliases on save', () => {
-    const onSave = vi.fn();
-    const src = `---
-squisq-theme: standard
-themeId: standard
-theme: standard
-squisq-captions: standard
-caption-style: standard
-author: Keep
----
-
-# Doc
-`;
-    open(src, onSave);
-    clickSave();
-
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).not.toMatch(/^(?:squisq-theme|themeId|theme):/m);
-    expect(next).not.toMatch(/^(?:squisq-captions|caption-style):/m);
-    expect(next).toContain('author: Keep');
-  });
-
-  it('writes squisq-transform when a transform is picked', () => {
-    const onSave = vi.fn();
-    open('# Doc\n', onSave);
-    const select = screen.getByLabelText('Transform') as HTMLSelectElement;
-    // Pick any non-empty option from the dropdown
-    const first = Array.from(select.options).find((o) => o.value !== '');
-    if (!first) throw new Error('no transform options available');
-    fireEvent.change(select, { target: { value: first.value } });
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain(`squisq-transform: ${first.value}`);
-  });
-
-  it('canonicalizes a stored dataDriven transform id', () => {
-    const onSave = vi.fn();
-    open('---\ntransform-style: dataDriven\n---\n\n# Doc\n', onSave);
-
-    const select = screen.getByLabelText('Transform') as HTMLSelectElement;
-    expect(select.value).toBe('data-driven');
-    clickSave();
-
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain('squisq-transform: data-driven');
-    expect(next).not.toContain('dataDriven');
-    expect(next).not.toContain('transform-style');
-  });
-
-  it('writes squisq-captions when picked', () => {
-    const onSave = vi.fn();
-    open('# Doc\n', onSave);
-    fireEvent.change(screen.getByLabelText('Captions'), { target: { value: 'social' } });
-    clickSave();
-    const next = onSave.mock.calls[0][0] as string;
-    expect(next).toContain('squisq-captions: social');
-  });
-
-  it('closes when the Cancel button is clicked', () => {
-    const onClose = vi.fn();
-    render(<DocumentSettingsDialog markdownSource="# Doc" onSave={() => {}} onClose={onClose} />);
-    fireEvent.click(screen.getByRole('button', { name: 'Cancel' }));
-    expect(onClose).toHaveBeenCalled();
-  });
-
-  it('falls back to the H2 when no H1 exists', () => {
-    const onSave = vi.fn();
-    open('## Subtitle\n\nBody.', onSave);
-    const input = screen.getByLabelText('Title') as HTMLInputElement;
-    expect(input.placeholder).toBe('Subtitle');
-  });
-});