@bendyline/squisq-editor-react 2.1.0 → 2.2.0

package/src/__tests__/fileKind.test.ts

@@ -1,112 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import { detectLanguageFromFileName, resolveFileKind } from '../fileKind';
-
-describe('detectLanguageFromFileName', () => {
-  it('detects common extensions', () => {
-    expect(detectLanguageFromFileName('foo.ts')).toBe('typescript');
-    expect(detectLanguageFromFileName('app.py')).toBe('python');
-    expect(detectLanguageFromFileName('data.json')).toBe('json');
-    expect(detectLanguageFromFileName('index.html')).toBe('html');
-    expect(detectLanguageFromFileName('styles.css')).toBe('css');
-    expect(detectLanguageFromFileName('README.md')).toBe('markdown');
-  });
-
-  it('uses the final extension for multi-dot names', () => {
-    expect(detectLanguageFromFileName('archive.tar.gz')).toBe(null);
-    expect(detectLanguageFromFileName('component.test.ts')).toBe('typescript');
-  });
-
-  it('accepts bare extensions with or without a leading dot', () => {
-    expect(detectLanguageFromFileName('.ts')).toBe('typescript');
-    expect(detectLanguageFromFileName('ts')).toBe('typescript');
-  });
-
-  it('matches extensionless names like Dockerfile', () => {
-    expect(detectLanguageFromFileName('Dockerfile')).toBe('dockerfile');
-    expect(detectLanguageFromFileName('dockerfile')).toBe('dockerfile');
-  });
-
-  it('is case-insensitive for extensions', () => {
-    expect(detectLanguageFromFileName('foo.TS')).toBe('typescript');
-    expect(detectLanguageFromFileName('App.JSX')).toBe('javascript');
-  });
-
-  it('strips leading paths', () => {
-    expect(detectLanguageFromFileName('src/lib/foo.ts')).toBe('typescript');
-    expect(detectLanguageFromFileName('C:\\Users\\me\\app.py')).toBe('python');
-  });
-
-  it('returns null for unknown extensions', () => {
-    expect(detectLanguageFromFileName('foo.xyz')).toBe(null);
-    expect(detectLanguageFromFileName('mystery.blob')).toBe(null);
-  });
-
-  it('returns null for empty or trailing-dot inputs', () => {
-    expect(detectLanguageFromFileName('')).toBe(null);
-    expect(detectLanguageFromFileName('   ')).toBe(null);
-    expect(detectLanguageFromFileName('foo.')).toBe(null);
-  });
-});
-
-describe('resolveFileKind', () => {
-  it('defaults to markdown mode when nothing is supplied', () => {
-    expect(resolveFileKind()).toEqual({ mode: 'markdown', language: 'markdown' });
-  });
-
-  it('returns code mode for recognized code extensions', () => {
-    expect(resolveFileKind('foo.ts')).toEqual({ mode: 'code', language: 'typescript' });
-    expect(resolveFileKind('app.py')).toEqual({ mode: 'code', language: 'python' });
-    expect(resolveFileKind('data.json')).toEqual({ mode: 'code', language: 'json' });
-  });
-
-  it('keeps markdown extensions in markdown mode', () => {
-    expect(resolveFileKind('README.md')).toEqual({ mode: 'markdown', language: 'markdown' });
-    expect(resolveFileKind('doc.markdown')).toEqual({ mode: 'markdown', language: 'markdown' });
-  });
-
-  it('keeps .txt in markdown mode with plaintext language', () => {
-    expect(resolveFileKind('notes.txt')).toEqual({ mode: 'markdown', language: 'plaintext' });
-  });
-
-  it('falls back to markdown mode for unknown extensions', () => {
-    expect(resolveFileKind('foo.xyz')).toEqual({ mode: 'markdown', language: 'markdown' });
-  });
-
-  it('lets the explicit language override fileName detection', () => {
-    expect(resolveFileKind('foo.md', 'typescript')).toEqual({
-      mode: 'code',
-      language: 'typescript',
-    });
-  });
-
-  it('stays in markdown mode when language override is markdown or plaintext', () => {
-    expect(resolveFileKind('foo.ts', 'markdown')).toEqual({
-      mode: 'markdown',
-      language: 'markdown',
-    });
-    expect(resolveFileKind(undefined, 'plaintext')).toEqual({
-      mode: 'markdown',
-      language: 'plaintext',
-    });
-  });
-
-  it('accepts a language with no fileName', () => {
-    expect(resolveFileKind(undefined, 'rust')).toEqual({ mode: 'code', language: 'rust' });
-  });
-
-  it('returns image mode for raster image extensions', () => {
-    expect(resolveFileKind('foo.png')).toEqual({ mode: 'image', language: 'image' });
-    expect(resolveFileKind('photo.JPEG')).toEqual({ mode: 'image', language: 'image' });
-    expect(resolveFileKind('anim.gif')).toEqual({ mode: 'image', language: 'image' });
-    expect(resolveFileKind('hero.webp')).toEqual({ mode: 'image', language: 'image' });
-    expect(resolveFileKind('icon.avif')).toEqual({ mode: 'image', language: 'image' });
-  });
-
-  it('keeps SVG as code mode (xml) so the source stays editable', () => {
-    expect(resolveFileKind('logo.svg')).toEqual({ mode: 'code', language: 'xml' });
-  });
-
-  it('respects an explicit language=image override', () => {
-    expect(resolveFileKind(undefined, 'image')).toEqual({ mode: 'image', language: 'image' });
-  });
-});

package/src/__tests__/findMode.test.tsx

@@ -1,104 +0,0 @@
-/** @vitest-environment jsdom */
-
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-import { fireEvent, render, screen } from '@testing-library/react';
-
-vi.mock('../RawEditor', () => ({
-  RawEditor: () => <div data-testid="raw-editor-stub">Alpha beta alpha</div>,
-}));
-vi.mock('../WysiwygEditor', () => ({
-  WysiwygEditor: () => <div data-testid="wysiwyg-editor-stub" />,
-}));
-vi.mock('../PreviewPanel', () => ({
-  PreviewPanel: () => <div data-testid="preview-panel">Alpha beta alpha</div>,
-}));
-
-import { EditorShell } from '../EditorShell';
-
-beforeEach(() => {
-  if (typeof window.matchMedia !== 'function') {
-    Object.defineProperty(window, 'matchMedia', {
-      configurable: true,
-      value: (query: string) => ({
-        matches: false,
-        media: query,
-        onchange: null,
-        addListener: vi.fn(),
-        removeListener: vi.fn(),
-        addEventListener: vi.fn(),
-        removeEventListener: vi.fn(),
-        dispatchEvent: vi.fn(() => false),
-      }),
-    });
-  }
-  if (typeof globalThis.ResizeObserver === 'undefined') {
-    class ResizeObserverStub {
-      observe(): void {}
-      unobserve(): void {}
-      disconnect(): void {}
-    }
-    (globalThis as unknown as { ResizeObserver: typeof ResizeObserverStub }).ResizeObserver =
-      ResizeObserverStub;
-  }
-});
-
-describe('<EditorShell> Find mode', () => {
-  it('does not render a Find trigger or textbox by default', () => {
-    render(<EditorShell initialMarkdown="Alpha" initialView="raw" />);
-    expect(screen.queryByRole('search', { name: 'Find in document' })).toBeNull();
-    expect(screen.queryByRole('button', { name: 'Close find' })).toBeNull();
-  });
-
-  it('shows search beside the view tabs, clears middle/left actions, and preserves right items', () => {
-    const onFindModeChange = vi.fn();
-    const { container } = render(
-      <EditorShell
-        initialMarkdown="Alpha beta alpha"
-        initialView="raw"
-        findMode
-        onFindModeChange={onFindModeChange}
-        toolbarSlotLeft={<span data-testid="left-slot">Left</span>}
-        toolbarSlotAfterActions={<span data-testid="middle-slot">Middle</span>}
-        toolbarSlotRight={<span data-testid="right-slot">Right</span>}
-      />,
-    );
-
-    const tabs = container.querySelector('.squisq-toolbar-view-tabs');
-    const search = screen.getByRole('search', { name: 'Find in document' });
-    expect(tabs?.nextElementSibling).toBe(search);
-    expect(screen.queryByTestId('left-slot')).toBeNull();
-    expect(screen.queryByTestId('middle-slot')).toBeNull();
-    expect(screen.getByTestId('right-slot')).toBeTruthy();
-    expect(screen.queryByRole('button', { name: 'Bold' })).toBeNull();
-    expect(screen.getByRole('button', { name: 'Document settings' })).toBeTruthy();
-
-    fireEvent.click(screen.getByRole('button', { name: 'Close find' }));
-    expect(onFindModeChange).toHaveBeenCalledWith(false);
-  });
-
-  it('responds to host-controlled mode changes and supports Escape to close', () => {
-    const onFindModeChange = vi.fn();
-    const { rerender } = render(
-      <EditorShell
-        initialMarkdown="Alpha"
-        initialView="raw"
-        findMode={false}
-        onFindModeChange={onFindModeChange}
-      />,
-    );
-    expect(screen.queryByRole('search', { name: 'Find in document' })).toBeNull();
-
-    rerender(
-      <EditorShell
-        initialMarkdown="Alpha"
-        initialView="raw"
-        findMode
-        onFindModeChange={onFindModeChange}
-      />,
-    );
-    const input = screen.getByRole('searchbox', { name: 'Find in document' });
-    expect(document.activeElement).toBe(input);
-    fireEvent.keyDown(input, { key: 'Escape' });
-    expect(onFindModeChange).toHaveBeenCalledWith(false);
-  });
-});

package/src/__tests__/findModel.test.ts

@@ -1,55 +0,0 @@
-/** @vitest-environment jsdom */
-
-import { afterEach, describe, expect, it } from 'vitest';
-import { Editor } from '@tiptap/core';
-import StarterKit from '@tiptap/starter-kit';
-import { FindHighlightExtension, updateTiptapFindHighlights } from '../find/FindHighlightExtension';
-import { findProseMirrorMatches, findTextMatches, normalizeFindIndex } from '../find/findModel';
-
-const editors: Editor[] = [];
-
-afterEach(() => {
-  editors.splice(0).forEach((editor) => editor.destroy());
-});
-
-describe('Find model', () => {
-  it('finds case-insensitive literal matches and escapes punctuation', () => {
-    expect(findTextMatches('A+b a+B A-b', 'a+b')).toEqual([
-      { from: 0, to: 3 },
-      { from: 4, to: 7 },
-    ]);
-  });
-
-  it('wraps next and previous indexes', () => {
-    expect(normalizeFindIndex(3, 3)).toBe(0);
-    expect(normalizeFindIndex(-1, 3)).toBe(2);
-    expect(normalizeFindIndex(10, 0)).toBe(0);
-  });
-
-  it('matches across adjacent formatted spans but not across paragraphs', () => {
-    const editor = new Editor({
-      extensions: [StarterKit],
-      content: '<p>Hello <strong>wide</strong> world</p><p>Hello world</p>',
-    });
-    editors.push(editor);
-
-    expect(findProseMirrorMatches(editor.state.doc, 'hello wide world')).toHaveLength(1);
-    expect(findProseMirrorMatches(editor.state.doc, 'worldhello')).toHaveLength(0);
-  });
-
-  it('decorates every WYSIWYG match and marks the selected one separately', () => {
-    const element = document.createElement('div');
-    document.body.append(element);
-    const editor = new Editor({
-      element,
-      extensions: [StarterKit, FindHighlightExtension],
-      content: '<p>Alpha alpha ALPHA</p>',
-    });
-    editors.push(editor);
-
-    expect(updateTiptapFindHighlights(editor, 'alpha', 1)).toBe(3);
-    expect(element.querySelectorAll('.squisq-find-match')).toHaveLength(3);
-    expect(element.querySelectorAll('.squisq-find-match--selected')).toHaveLength(1);
-    expect(element.querySelector('.squisq-find-match--selected')?.textContent).toBe('alpha');
-  });
-});

package/src/__tests__/headingTransition.test.ts

@@ -1,176 +0,0 @@
-import { describe, it, expect } from 'vitest';
-import {
-  readHeadingLineTransition,
-  setHeadingLineTransition,
-  readBlockAttrsTransition,
-  setHeadingAttrsTransition,
-  EMPTY_TRANSITION,
-} from '../headingTransition';
-
-describe('readHeadingLineTransition', () => {
-  it('returns empty for a plain heading', () => {
-    expect(readHeadingLineTransition('## Tips')).toEqual(EMPTY_TRANSITION);
-  });
-
-  it('returns empty for a non-heading line', () => {
-    expect(readHeadingLineTransition('Just a paragraph')).toEqual(EMPTY_TRANSITION);
-  });
-
-  it('reads transition from a Pandoc block', () => {
-    expect(readHeadingLineTransition('## Tips {transition=fade}')).toEqual({
-      type: 'fade',
-      direction: '',
-      duration: '',
-    });
-  });
-
-  it('reads type, direction and duration together', () => {
-    expect(
-      readHeadingLineTransition(
-        '## Tips {transition=push transitionDirection=left transitionDuration=0.7}',
-      ),
-    ).toEqual({ type: 'push', direction: 'left', duration: '0.7' });
-  });
-
-  it('reads a hand-typed transition from the {[…]} template params', () => {
-    expect(readHeadingLineTransition('## Tips {[title transition=zoom]}')).toEqual({
-      type: 'zoom',
-      direction: '',
-      duration: '',
-    });
-  });
-
-  it('reads a transition from a param-only {[…]} annotation', () => {
-    expect(readHeadingLineTransition('## Tips {[transition=zoom]}')).toEqual({
-      type: 'zoom',
-      direction: '',
-      duration: '',
-    });
-  });
-
-  it('prefers the Pandoc block over the template params when both set it', () => {
-    expect(
-      readHeadingLineTransition('## Tips {transition=fade} {[title transition=zoom]}'),
-    ).toEqual({ type: 'fade', direction: '', duration: '' });
-  });
-});
-
-describe('setHeadingLineTransition', () => {
-  it('adds a squiggly annotation to a plain heading', () => {
-    expect(setHeadingLineTransition('## Tips', { type: 'fade', direction: '', duration: '' })).toBe(
-      '## Tips {[transition=fade]}',
-    );
-  });
-
-  it('folds into an existing {[…]} template annotation', () => {
-    expect(
-      setHeadingLineTransition('## Tips {[title]}', { type: 'fade', direction: '', duration: '' }),
-    ).toBe('## Tips {[title transition=fade]}');
-  });
-
-  it('includes direction and duration when present', () => {
-    expect(
-      setHeadingLineTransition('## Tips', { type: 'push', direction: 'up', duration: '1.2' }),
-    ).toBe('## Tips {[transition=push transitionDirection=up transitionDuration=1.2]}');
-  });
-
-  it('migrates an existing Pandoc transition, preserving other params and the id', () => {
-    expect(
-      setHeadingLineTransition('## Tips {#intro transition=fade x=10}', {
-        type: 'zoom',
-        direction: '',
-        duration: '',
-      }),
-    ).toBe('## Tips {#intro x=10} {[transition=zoom]}');
-  });
-
-  it('migrates into an existing template annotation without duplicating channels', () => {
-    expect(
-      setHeadingLineTransition('## Tips {#intro transition=fade} {[title color=blue]}', {
-        type: 'zoom',
-        direction: '',
-        duration: '',
-      }),
-    ).toBe('## Tips {#intro} {[title color=blue transition=zoom]}');
-  });
-
-  it('removes the transition (and an empty block) when set to none', () => {
-    expect(setHeadingLineTransition('## Tips {transition=fade}', EMPTY_TRANSITION)).toBe('## Tips');
-  });
-
-  it('keeps a non-empty Pandoc block when only the transition is cleared', () => {
-    expect(setHeadingLineTransition('## Tips {#intro transition=fade}', EMPTY_TRANSITION)).toBe(
-      '## Tips {#intro}',
-    );
-  });
-
-  it('drops direction/duration when the type is cleared', () => {
-    expect(
-      setHeadingLineTransition(
-        '## Tips {transition=push transitionDirection=left}',
-        EMPTY_TRANSITION,
-      ),
-    ).toBe('## Tips');
-  });
-
-  it('round-trips through read', () => {
-    const next = { type: 'wipe', direction: 'right', duration: '0.5' };
-    const line = setHeadingLineTransition('## Tips {[title]}', next);
-    expect(readHeadingLineTransition(line)).toEqual(next);
-  });
-
-  it('leaves non-heading lines untouched', () => {
-    expect(
-      setHeadingLineTransition('paragraph', { type: 'fade', direction: '', duration: '' }),
-    ).toBe('paragraph');
-  });
-});
-
-describe('block-attrs (WYSIWYG) helpers', () => {
-  it('reads from the dataBlockAttrs inner', () => {
-    expect(readBlockAttrsTransition('#intro transition=fade', null)).toEqual({
-      type: 'fade',
-      direction: '',
-      duration: '',
-    });
-  });
-
-  it('reads a hand-typed transition from dataTemplateParams', () => {
-    expect(readBlockAttrsTransition(null, 'transition=zoom x=1')).toEqual({
-      type: 'zoom',
-      direction: '',
-      duration: '',
-    });
-  });
-
-  it('writes transition edits to dataTemplateParams by default', () => {
-    expect(
-      setHeadingAttrsTransition(null, null, { type: 'fade', direction: '', duration: '' }),
-    ).toEqual({
-      blockAttrsInner: null,
-      templateParams: 'transition=fade',
-    });
-  });
-
-  it('migrates legacy dataBlockAttrs transitions to dataTemplateParams', () => {
-    expect(
-      setHeadingAttrsTransition('#intro transition=fade', 'color=blue', {
-        type: 'zoom',
-        direction: '',
-        duration: '',
-      }),
-    ).toEqual({
-      blockAttrsInner: '#intro',
-      templateParams: 'color=blue transition=zoom',
-    });
-  });
-
-  it('clears transitions from both WYSIWYG channels', () => {
-    expect(
-      setHeadingAttrsTransition('#intro transition=fade', 'transition=zoom', EMPTY_TRANSITION),
-    ).toEqual({
-      blockAttrsInner: '#intro',
-      templateParams: null,
-    });
-  });
-});