@bendyline/squisq-editor-react 1.5.1 → 1.5.3

package/dist/EditorShell.d.ts

@@ -1,328 +0,0 @@
-/**
- * EditorShell
- *
- * Top-level shell component that composes the Toolbar, ViewSwitcher, editor
- * views, and StatusBar into a complete editing experience. Wraps everything
- * in an EditorProvider for shared state.
- */
-import { type EditorView, type ImageDisplayMode, type MentionProvider, type DocumentLinkProvider, type ViewPreferences, type ThemeInheritance } from './EditorContext';
-import type { MediaProvider, Theme } from '@bendyline/squisq/schemas';
-import type { ContentContainer } from '@bendyline/squisq/storage';
-import type { PrunePolicy, SaveVersionResult } from '@bendyline/squisq/versions';
-import type { ReactNode } from 'react';
-export type { EditorTheme } from './EditorContext';
-export interface EditorShellProps {
-    /** Initial markdown content */
-    initialMarkdown?: string;
-    /** Initial active view */
-    /** Initial active view (default: 'wysiwyg') */
-    initialView?: EditorView;
-    /** Article ID for Doc generation */
-    articleId?: string;
-    /** Base path for media URLs in preview */
-    basePath?: string;
-    /** Called when markdown source changes */
-    onChange?: (source: string) => void;
-    /** Color theme: 'light' or 'dark' (default: 'light') */
-    theme?: 'light' | 'dark';
-    /** Additional class name */
-    className?: string;
-    /** CSS height for the shell container (default: '100vh') */
-    height?: string;
-    /**
-     * Minimum CSS height for the shell. When either `minHeight` or
-     * `maxHeight` is set, the shell switches to **auto-grow mode**:
-     * `height` is ignored, the root becomes `height: auto` between the
-     * bounds, and the content area scrolls internally when content
-     * exceeds `maxHeight`. Useful for chat composers that should grow
-     * with content up to some cap.
-     */
-    minHeight?: string;
-    /** See `minHeight`. Upper bound of the auto-grow range. */
-    maxHeight?: string;
-    /** Optional MediaProvider for the Files panel. When set (even to null), a Files toggle appears in the toolbar. */
-    mediaProvider?: MediaProvider | null;
-    /**
-     * The workspace-scoped `ContentContainer` for this document — the
-     * folder that contains the doc, its `_files/` sidecar, sibling
-     * documents, and any version snapshots. Used for:
-     *  - audio mapping (MP3 discovery + timing.json reading);
-     *  - version history snapshots (when `allowVersioning` is true);
-     *  - reading sibling `.md` files for the recursive HTML export;
-     *  - resolving per-document scoped views (e.g. the image-edit
-     *    sidecar derived via `scopeContainer`).
-     * Doc-scoped concerns (per-doc media URLs, per-doc asset writes)
-     * flow through `mediaProvider` instead — typically derived from
-     * this container via `createMediaProviderFromContainer`.
-     */
-    workspaceContainer?: ContentContainer | null;
-    /**
-     * @deprecated Renamed to `workspaceContainer` to make the workspace-
-     * vs. doc-scoped distinction explicit. Still accepted as a fallback
-     * for now; remove in the next breaking release.
-     */
-    container?: ContentContainer | null;
-    /**
-     * Enable version history. Snapshots are stored at
-     * `.versions/<basename>.<timestamp>.md` inside the same
-     * `workspaceContainer`, so they ride along with the document when
-     * the host serializes.
-     *
-     * Snapshots fire on idle (controlled by `versioningAutoSaveIdleMs`)
-     * and can also be triggered host-side via the manager exposed in the
-     * context (`useEditorContext().versioning`). Has no effect without a
-     * `workspaceContainer` — a `console.warn` flags the misconfiguration
-     * in dev.
-     */
-    allowVersioning?: boolean;
-    /**
-     * Override the document basename used in version filenames. Defaults
-     * to the basename of the container's primary document path.
-     */
-    versionBasename?: string;
-    /**
-     * Prune policy applied after each successful save. Defaults to
-     * `{ type: 'keep-last-n', n: 50 }` so the snapshot count stays bounded.
-     */
-    versioningPrunePolicy?: PrunePolicy;
-    /**
-     * Idle delay (ms) before the editor auto-saves a version. `0` disables
-     * auto-save entirely (snapshots are then only saved when the host
-     * calls `versioning.saveVersion()` from the context). Default: 5000.
-     */
-    versioningAutoSaveIdleMs?: number;
-    /**
-     * Notified after each `saveVersion` attempt. Fires for both successful
-     * saves (`reason: 'saved'`) and skips (`'unchanged'`, `'no-document'`,
-     * `'empty'`). Useful for hosts that want a "Last saved" indicator.
-     */
-    onSaveVersion?: (result: SaveVersionResult) => void;
-    /** Show the Files toggle in the toolbar. Defaults to true when mediaProvider is passed. */
-    showFilesToggle?: boolean;
-    /** Content rendered at the left edge of the toolbar, before the view tabs. */
-    toolbarSlotLeft?: ReactNode;
-    /** Content rendered after the formatting controls (in the middle area of the toolbar). */
-    toolbarSlotAfterActions?: ReactNode;
-    /** Content rendered at the rightmost end of the toolbar, after all other elements. */
-    toolbarSlotRight?: ReactNode;
-    /**
-     * Whether to show the "Play" (preview) tab in the toolbar. When false, the
-     * tab and its preview panel are hidden, and ⌘3 becomes a no-op. Use this
-     * when embedding the editor somewhere the slideshow preview doesn't make
-     * sense (e.g. editing free-form prompt documents). Defaults to true.
-     */
-    showPlayTab?: boolean;
-    /**
-     * Optional "submit on Enter" callback. When provided, a plain Enter
-     * keypress fires this callback instead of inserting a newline, and
-     * Cmd/Ctrl+Enter inserts a newline instead. Matches chat-composer UX
-     * (Slack, Discord). When omitted, the editor behaves normally.
-     */
-    submitOnEnter?: () => void;
-    /**
-     * Let the WYSIWYG editing surface fill its container instead of rendering
-     * as a centered 800px "page" column. Useful when embedding in chat
-     * composers, side panels, or any layout where the page metaphor doesn't
-     * fit. Defaults to false (page mode).
-     */
-    fullWidth?: boolean;
-    /**
-     * Font-family stack applied to the editor **chrome** — toolbar buttons,
-     * tabs, status bar, and control surfaces. The actual editing areas
-     * (Tiptap / Monaco) keep their own fonts so document editing isn't
-     * affected. Use this when the editor is embedded in a larger product
-     * that has its own UX type system and you want the controls to blend in.
-     *
-     * @example
-     * ```tsx
-     * <EditorShell uxFont="'Hanken Grotesk', system-ui, sans-serif" ... />
-     * ```
-     */
-    uxFont?: string;
-    /**
-     * Drop the editor's generous page-style padding in favor of a tight
-     * layout that hugs its container. The default WYSIWYG surface uses
-     * 16×24px padding suitable for editing long-form documents; chat
-     * composers want much less. Applies to the editing area only — the
-     * toolbar, tabs, and status bar keep their normal sizing.
-     */
-    thinMargins?: boolean;
-    /**
-     * Render the bottom status bar (word / character / line / block counts
-     * and parse-state indicator). Defaults to `true`. Set to `false` in
-     * embedded surfaces — chat composers and other short-form inputs —
-     * where the stats are noise.
-     */
-    showStatusBar?: boolean;
-    /**
-     * How images should be displayed in the WYSIWYG view. `'inline'`
-     * (default) flows them at natural size up to the container width;
-     * `'thumbnail'` constrains each image to a 100×100 box with
-     * aspect-preserving containment — useful for chat composers and other
-     * dense surfaces where a full-resolution paste would dominate the
-     * layout. Storage bytes are unchanged either way.
-     */
-    imageDisplayMode?: ImageDisplayMode;
-    /**
-     * File name (e.g. `foo.ts`) or bare extension that the content
-     * represents. When set to a non-markdown/text extension, the shell
-     * enters **code mode**: Monaco picks the right language based on the
-     * extension, the WYSIWYG and Preview tabs disappear, and the toolbar
-     * drops its markdown-specific formatting buttons. Markdown-ish
-     * extensions (`.md`, `.markdown`, `.mdown`, `.txt`) keep the full
-     * experience. Omit to get today's markdown behavior unchanged.
-     */
-    fileName?: string;
-    /**
-     * Explicit Monaco language ID override (e.g. `'typescript'`,
-     * `'python'`, `'json'`). Wins over the language derived from
-     * `fileName`. Anything other than `'markdown'` or `'plaintext'`
-     * switches the shell into code mode.
-     */
-    language?: string;
-    /**
-     * Optional async provider for `@`-mention suggestions. When supplied,
-     * typing `@` inside the editor opens a popover of candidates; selecting
-     * one inserts a `@[Label](scheme:id)` mention token. Used by chat
-     * composers and any other surface that wants to address named entities
-     * inline. Omit to disable mentions entirely.
-     */
-    mentionProvider?: MentionProvider | null;
-    /**
-     * Optional async provider for sibling-document suggestions in the
-     * link insert dialog. When supplied, the dialog gains a "Browse
-     * documents" picker so authors can pick a neighbor `.md` by name and
-     * insert a relative-path link without typing the URL by hand. Hosts
-     * that organize docs in a workspace (file-system, IndexedDB slot,
-     * remote API, …) implement this; the editor stays agnostic.
-     */
-    documentLinkProvider?: DocumentLinkProvider | null;
-    /**
-     * Whether the in-editor media recorder is surfaced in the toolbar.
-     * Defaults to true — when a `mediaProvider` is wired, a record
-     * button appears next to the version history. Pass `false` to
-     * suppress it (read-only embeds, surfaces where camera/screen
-     * permission prompts would be jarring). Without a `mediaProvider`,
-     * the button is hidden regardless of this prop.
-     */
-    allowRecording?: boolean;
-    /**
-     * Placeholder text shown in the WYSIWYG editor while the document is
-     * empty. When omitted, the editor rotates through its own generic
-     * "start typing…" prompts; pass a value here to override with copy
-     * that fits the embedding surface (e.g. a chat composer knows who
-     * the message is going to and can say so).
-     */
-    placeholder?: string;
-    /**
-     * When true, both editing surfaces become non-editable: Monaco runs in
-     * `readOnly` mode and Tiptap is set to `editable: false`. The toolbar
-     * still renders — hide it from the host side if you want a pure preview.
-     * Useful for reference panels that show file content without inviting
-     * accidental edits.
-     */
-    readOnly?: boolean;
-    /**
-     * Image source URL used when the resolved file mode is `image` (PNG,
-     * JPEG, GIF, WebP, BMP, ICO, AVIF). When this prop is set, the shell
-     * replaces its text-editing surfaces with a dedicated `ImageViewer`.
-     *
-     * Lifecycle of the URL is the caller's responsibility — when fed a
-     * `blob:` URL, the host should `URL.revokeObjectURL` on unmount or
-     * src change.
-     */
-    imageSrc?: string;
-    /** Alt text passed through to the underlying ImageViewer. */
-    imageAlt?: string;
-    /**
-     * Whether the image surface should render as a read-only viewer
-     * (`'view'`, default) or as the editable {@link ImageEditor}
-     * (`'edit'`). Editing requires {@link EditorShellProps.imageEditorContainer}
-     * — without it the shell falls back to view mode and logs a warning.
-     */
-    imageMode?: 'view' | 'edit';
-    /**
-     * Sidecar `ContentContainer` for the image being edited. Conventionally
-     * scoped to `<basename>_files/` via
-     * `scopeContainer(parentContainer, basename + '_files')`. The image
-     * editor persists `state.json`, layer assets in `assets/`, and (when
-     * `allowVersioning` is true) snapshots in `.versions/` inside it.
-     */
-    imageEditorContainer?: ContentContainer;
-    /**
-     * Called after the user clicks Export in the image editor and the
-     * raster blob is produced. When omitted, the editor triggers a
-     * default browser download.
-     */
-    onImageExport?: (blob: Blob, format: 'png' | 'jpeg' | 'webp') => void;
-    /**
-     * Show an inline preview gutter to the right of the WYSIWYG editor.
-     * The gutter renders one small SVG card per template-annotated block in
-     * the document, letting authors see their rendered output without
-     * leaving Edit mode. Auto-hidden via container query when the editor
-     * body is narrower than ~720px. Defaults to `false`.
-     */
-    inlinePreview?: boolean;
-    /**
-     * Width in pixels for the inline preview gutter. Defaults to 320.
-     * Only takes effect when {@link EditorShellProps.inlinePreview} is true.
-     */
-    inlinePreviewWidth?: number;
-    /**
-     * Show an outline pane on the left of the WYSIWYG editor — a
-     * hierarchical tree of the document's headings (h1 → h2 → h3) with
-     * click-to-scroll. Auto-hidden via container query on narrow editors.
-     * Defaults to `false`. The toolbar's View menu can toggle this at
-     * runtime regardless of the initial value.
-     */
-    outline?: boolean;
-    /**
-     * Width in pixels for the outline pane. Defaults to 240. Only takes
-     * effect when {@link EditorShellProps.outline} is true (or the View
-     * menu has toggled it on).
-     */
-    outlineWidth?: number;
-    /**
-     * Initial visibility of inline block-template tags on headings — the
-     * chip rendered next to each heading in the WYSIWYG view that opens
-     * the block-template picker. Defaults to true; the View menu can
-     * toggle it at runtime regardless of the initial value.
-     */
-    blockTags?: boolean;
-    /**
-     * How much of the active Squisq theme the WYSIWYG editing surface
-     * mirrors. Defaults to `'fonts'` — the historical behavior of
-     * inheriting body / heading fonts only. The View menu can change it
-     * at runtime.
-     */
-    themeInheritance?: ThemeInheritance;
-    /**
-     * Bundled view preferences — a serializable JSON blob covering the
-     * runtime-toggleable view options surfaced in the View menu. When
-     * provided, fields here override the corresponding individual props
-     * (`outline`, `inlinePreview`, `showStatusBar`). Pair with
-     * {@link onViewPreferencesChange} to externalize storage of these
-     * preferences in the host.
-     */
-    viewPreferences?: ViewPreferences;
-    /**
-     * Notified after each user-driven toggle in the View menu. The
-     * argument is a full snapshot of all view preferences — hosts can
-     * persist it as-is. Not called when {@link viewPreferences} is
-     * changed externally.
-     */
-    onViewPreferencesChange?: (prefs: ViewPreferences) => void;
-    /**
-     * Override the preview theme with an explicit `Theme` object. When set,
-     * `Doc.themeId` and the user's theme dropdown selection are ignored for
-     * the preview surface. Used by the theme customizer to live-preview an
-     * in-progress theme without mutating the document.
-     */
-    themeOverride?: Theme | null;
-}
-/**
- * Complete markdown editor shell with toolbar, view switcher, and three
- * editing modes: Raw (Monaco), WYSIWYG (Tiptap), and Preview.
- */
-export declare function EditorShell({ initialMarkdown, initialView, articleId, basePath, onChange, theme, className, height, minHeight, maxHeight, mediaProvider, workspaceContainer, container, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, showFilesToggle, toolbarSlotLeft, toolbarSlotAfterActions, toolbarSlotRight, showPlayTab, submitOnEnter, fullWidth, uxFont, thinMargins, showStatusBar, imageDisplayMode, fileName, language, mentionProvider, documentLinkProvider, allowRecording, placeholder, readOnly, imageSrc, imageAlt, imageMode, imageEditorContainer, onImageExport, inlinePreview, inlinePreviewWidth, outline, outlineWidth, blockTags, themeInheritance, viewPreferences, onViewPreferencesChange, themeOverride, }: EditorShellProps): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=EditorShell.d.ts.map

package/dist/EditorShell.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EditorShell.d.ts","sourceRoot":"","sources":["../src/EditorShell.tsx"],"names":[],"mappings":"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"}

package/dist/EditorShell.js

@@ -1,290 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/**
- * EditorShell
- *
- * Top-level shell component that composes the Toolbar, ViewSwitcher, editor
- * views, and StatusBar into a complete editing experience. Wraps everything
- * in an EditorProvider for shared state.
- */
-import { useEffect, useRef, useState, useCallback, useMemo } from 'react';
-import { EditorProvider, useEditorContext, } from './EditorContext';
-import { Toolbar } from './Toolbar';
-import { StatusBar } from './StatusBar';
-import { RawEditor } from './RawEditor';
-import { WysiwygEditor } from './WysiwygEditor';
-import { InlinePreviewGutter } from './InlinePreviewGutter';
-import { OutlinePanel } from './OutlinePanel';
-import { PreviewPanel } from './PreviewPanel';
-import { ImageViewer } from './ImageViewer';
-import { ImageEditor } from './ImageEditor';
-import { PreviewSettingsProvider, PreviewToolbarControls } from './PreviewControls';
-import { MediaBin } from './MediaBin';
-import { DropZoneOverlay } from './DropZoneOverlay';
-import { TooltipLayer } from './Tooltip';
-import { useFileDrop } from './hooks/useFileDrop';
-import { partitionFiles, processMediaFiles, processTextFile, processTextFiles, } from './utils/dropUtils';
-import { DARK_SURFACE, LIGHT_SURFACE } from '@bendyline/squisq/schemas';
-import { MemoryContentContainer, scopeContainer, createMediaProviderFromContainer, } from '@bendyline/squisq/storage';
-/**
- * Complete markdown editor shell with toolbar, view switcher, and three
- * editing modes: Raw (Monaco), WYSIWYG (Tiptap), and Preview.
- */
-export function EditorShell({ initialMarkdown = '', initialView = 'wysiwyg', articleId = 'untitled', basePath = '/', onChange, theme = 'light', className, height = '100vh', minHeight, maxHeight, mediaProvider, workspaceContainer, container, allowVersioning = false, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, showFilesToggle, toolbarSlotLeft, toolbarSlotAfterActions, toolbarSlotRight, showPlayTab = true, submitOnEnter, fullWidth = false, uxFont, thinMargins = false, showStatusBar = true, imageDisplayMode = 'inline', fileName, language, mentionProvider, documentLinkProvider, allowRecording = true, placeholder, readOnly = false, imageSrc, imageAlt, imageMode = 'view', imageEditorContainer, onImageExport, inlinePreview = false, inlinePreviewWidth = 320, outline = false, outlineWidth = 240, blockTags = true, themeInheritance = 'fonts', viewPreferences, onViewPreferencesChange, themeOverride = null, }) {
-    const effectiveContainer = workspaceContainer ?? container ?? null;
-    // If the host gave us a `workspaceContainer` but no explicit `mediaProvider`,
-    // derive one automatically. Without this, drag-and-drop of an image
-    // into the editor silently failed (no provider \u2192 nothing to upload to)
-    // even though we had a perfectly good ContentContainer to write into.
-    const effectiveMediaProvider = useMemo(() => {
-        if (mediaProvider !== undefined)
-            return mediaProvider;
-        if (effectiveContainer)
-            return createMediaProviderFromContainer(effectiveContainer);
-        return undefined;
-    }, [mediaProvider, effectiveContainer]);
-    // Show the toggle when explicitly opted in, or when mediaProvider prop was passed at all
-    const filesToggleEnabled = showFilesToggle ?? effectiveMediaProvider !== undefined;
-    // If the host hides the Play tab but asked for it as the initial view,
-    // fall back to wysiwyg so we don't boot into a tab the user can't leave.
-    const effectiveInitialView = !showPlayTab && initialView === 'preview' ? 'wysiwyg' : initialView;
-    return (_jsx(EditorProvider, { initialMarkdown: initialMarkdown, initialView: effectiveInitialView, articleId: articleId, theme: theme, workspaceContainer: effectiveContainer, allowVersioning: allowVersioning, versionBasename: versionBasename, versioningPrunePolicy: versioningPrunePolicy, versioningAutoSaveIdleMs: versioningAutoSaveIdleMs, onSaveVersion: onSaveVersion, mediaProvider: effectiveMediaProvider, imageDisplayMode: imageDisplayMode, mentionProvider: mentionProvider, documentLinkProvider: documentLinkProvider, allowRecording: allowRecording, fileName: fileName, language: language, inlinePreview: inlinePreview, showStatusBar: showStatusBar, outline: outline, blockTags: blockTags, themeInheritance: themeInheritance, viewPreferences: viewPreferences, onViewPreferencesChange: onViewPreferencesChange, children: _jsx(EditorShellInner, { basePath: basePath, onChange: onChange, className: className, height: height, minHeight: minHeight, maxHeight: maxHeight, placeholder: placeholder, mediaProvider: effectiveMediaProvider ?? null, workspaceContainer: effectiveContainer, filesToggleEnabled: filesToggleEnabled, toolbarSlotLeft: toolbarSlotLeft, toolbarSlotAfterActions: toolbarSlotAfterActions, toolbarSlotRight: toolbarSlotRight, showPlayTab: showPlayTab, submitOnEnter: submitOnEnter, fullWidth: fullWidth, uxFont: uxFont, thinMargins: thinMargins, readOnly: readOnly, imageSrc: imageSrc, imageAlt: imageAlt, imageMode: imageMode, imageEditorContainer: imageEditorContainer, onImageExport: onImageExport, allowVersioning: allowVersioning, versioningAutoSaveIdleMs: versioningAutoSaveIdleMs, inlinePreviewWidth: inlinePreviewWidth, outlineWidth: outlineWidth, themeOverride: themeOverride }) }));
-}
-function EditorShellInner({ basePath, onChange, className, height, minHeight, maxHeight, placeholder, mediaProvider, workspaceContainer, filesToggleEnabled, toolbarSlotLeft, toolbarSlotAfterActions, toolbarSlotRight, showPlayTab, submitOnEnter, fullWidth, uxFont, thinMargins, readOnly, imageSrc, imageAlt, imageMode, imageEditorContainer, onImageExport, allowVersioning, versioningAutoSaveIdleMs, inlinePreviewWidth, outlineWidth, themeOverride, }) {
-    const { activeView, markdownSource, doc, theme, editorMode, insertAtCursor, replaceAll, tiptapEditor, monacoEditor, setMarkdownSource, inlinePreviewVisible, statusBarVisible, outlineVisible, imageEditTarget, closeImageEdit, bumpMediaRevision, } = useEditorContext();
-    const isPreview = activeView === 'preview';
-    const isCodeMode = editorMode === 'code';
-    const isImageMode = editorMode === 'image';
-    const isMarkdownMode = editorMode === 'markdown';
-    const [showFiles, setShowFiles] = useState(false);
-    const [mediaRefreshKey, setMediaRefreshKey] = useState(0);
-    // Persistent fallback container for image-edit sidecars when the host
-    // didn't supply one. Lifted to shell scope so opening the same image
-    // multiple times sees the same `.imageEdits/<sanitized>/.versions/...`
-    // snapshots — otherwise each modal mount would start from an empty
-    // in-memory container and history would vanish on close.
-    const imageEditFallbackContainerRef = useRef(null);
-    if (imageEditFallbackContainerRef.current === null) {
-        imageEditFallbackContainerRef.current = new MemoryContentContainer();
-    }
-    const imageEditFallbackContainer = imageEditFallbackContainerRef.current;
-    const isDark = theme === 'dark';
-    const handleToggleFiles = useCallback(() => {
-        setShowFiles((prev) => !prev);
-    }, []);
-    // ── Drag-and-drop file handling ──
-    /**
-     * Insert an uploaded media file at the editor's current cursor.
-     *
-     * - In **WYSIWYG** mode, insert an actual tiptap image node via
-     *   `setImage({src, alt})` (images) or a link mark (non-images).
-     *   Going through `setImage` directly mirrors the Toolbar's image
-     *   button and avoids the round-trip through `markdownToTiptap`
-     *   that historically lost `<img>` tags to tag-strip passes.
-     * - In **raw (Monaco)** or **preview** mode, fall back to
-     *   `insertAtCursor` which emits the markdown snippet.
-     *
-     * Without this, upload-via-MediaBin and upload-via-drop both
-     * added the file to the bin and nowhere else — the composer sent
-     * an empty body and the downstream gezel reported "nothing came
-     * through."
-     */
-    const insertMediaRef = useCallback((relativePath, name, mimeType) => {
-        const alt = name.replace(/\.[^.]+$/, '').replace(/[-_]/g, ' ');
-        const isImage = mimeType.startsWith('image/');
-        const snippet = isImage ? `![${alt}](${relativePath})` : `[${alt}](${relativePath})`;
-        if (activeView === 'wysiwyg' && tiptapEditor) {
-            if (isImage) {
-                tiptapEditor.chain().focus().setImage({ src: relativePath, alt }).run();
-            }
-            else {
-                tiptapEditor
-                    .chain()
-                    .focus()
-                    .insertContent([
-                    {
-                        type: 'text',
-                        marks: [{ type: 'link', attrs: { href: relativePath } }],
-                        text: alt,
-                    },
-                ])
-                    .run();
-            }
-            return;
-        }
-        if (activeView === 'raw' && monacoEditor) {
-            insertAtCursor(snippet);
-            return;
-        }
-        // Preview mode — no interactive editor to insert into. Append
-        // to markdown source so the ref is still in the buffer.
-        setMarkdownSource(markdownSource ? `${markdownSource}\n\n${snippet}` : snippet);
-    }, [activeView, tiptapEditor, monacoEditor, insertAtCursor, markdownSource, setMarkdownSource]);
-    const handleFileDrop = useCallback(async (files, target) => {
-        try {
-            const { media, text } = partitionFiles(files);
-            // Process media files
-            if (media.length > 0 && mediaProvider) {
-                const paths = await processMediaFiles(media, mediaProvider);
-                setMediaRefreshKey((k) => k + 1);
-                // Auto-open the media bin so the user sees the new files
-                if (!showFiles)
-                    setShowFiles(true);
-                // Insert each uploaded file as a markdown ref at the cursor so
-                // the body actually contains the attachment. Without this the
-                // bin holds the file but the serialized markdown stays empty,
-                // and anything downstream (chat send, document save) sees no
-                // reference to the upload.
-                for (let i = 0; i < media.length; i++) {
-                    const file = media[i];
-                    const path = paths[i];
-                    if (!file || !path)
-                        continue;
-                    insertMediaRef(path, file.name, file.type || 'application/octet-stream');
-                }
-            }
-            // Process text files
-            if (text.length > 0) {
-                if (target === 'replace') {
-                    // Replace with first text file
-                    const content = await processTextFile(text[0]);
-                    replaceAll(content);
-                }
-                else {
-                    // Insert all text files concatenated
-                    const content = await processTextFiles(text);
-                    insertAtCursor(content);
-                }
-            }
-        }
-        catch (err) {
-            console.error('Failed to process dropped files:', err instanceof Error ? err.message : err);
-        }
-    }, [mediaProvider, showFiles, replaceAll, insertAtCursor, insertMediaRef]);
-    const { isDragging, dragContentType, containerProps, zoneProps } = useFileDrop({
-        onDrop: handleFileDrop,
-    });
-    // Notify parent of changes
-    useEffect(() => {
-        onChange?.(markdownSource);
-    }, [markdownSource, onChange]);
-    // Keyboard shortcuts for view switching
-    useEffect(() => {
-        const handler = (e) => {
-            if (e.ctrlKey || e.metaKey) {
-                switch (e.key) {
-                    case '1':
-                        e.preventDefault();
-                        document.querySelector('[data-view="wysiwyg"]')?.click();
-                        break;
-                    case '2':
-                        e.preventDefault();
-                        document.querySelector('[data-view="raw"]')?.click();
-                        break;
-                    case '3':
-                        if (!showPlayTab)
-                            return;
-                        e.preventDefault();
-                        document.querySelector('[data-view="preview"]')?.click();
-                        break;
-                }
-            }
-        };
-        window.addEventListener('keydown', handler);
-        return () => window.removeEventListener('keydown', handler);
-    }, [showPlayTab]);
-    const autoGrow = minHeight !== undefined || maxHeight !== undefined;
-    return (_jsxs("div", { className: `squisq-editor-shell ${className || ''}`, "data-theme": theme, "data-full-width": fullWidth ? 'true' : undefined, "data-thin-margins": thinMargins ? 'true' : undefined, "data-outline-visible": isMarkdownMode && outlineVisible ? 'true' : undefined, style: {
-            display: 'flex',
-            flexDirection: 'column',
-            overflow: 'hidden',
-            ...(autoGrow ? { minHeight, maxHeight } : { height }),
-            // When a consumer supplies a UX font stack, expose it to the
-            // editor CSS via this custom property. Chrome elements (toolbar,
-            // tabs, status bar) consume `--squisq-ux-font` as their
-            // `font-family`, falling back to the system stack when unset.
-            ...(uxFont ? { '--squisq-ux-font': uxFont } : {}),
-            // Exposed so the toolbar's view-tabs section can match the outline
-            // pane's width, lining up its right-edge separator with the
-            // outline's right edge. The variable is set unconditionally so the
-            // outline pane itself can also read it if needed; the
-            // `data-outline-visible` gate above keeps the toolbar override
-            // scoped to the case where alignment matters.
-            ...{ '--squisq-outline-width': `${outlineWidth}px` },
-        }, ...containerProps, children: [_jsxs(PreviewSettingsProvider, { doc: doc, themeOverride: themeOverride, children: [isImageMode ? ((toolbarSlotLeft || toolbarSlotRight) && (_jsxs("div", { className: "squisq-editor-header squisq-editor-header--image", children: [toolbarSlotLeft, _jsx("div", { style: { flex: 1 } }), toolbarSlotRight] }))) : (_jsx("div", { className: "squisq-editor-header", children: _jsx(Toolbar, { showFiles: showFiles, onToggleFiles: !isCodeMode && filesToggleEnabled ? handleToggleFiles : undefined, slotLeft: toolbarSlotLeft, slotAfterActions: _jsxs(_Fragment, { children: [toolbarSlotAfterActions, !isCodeMode && isPreview && _jsx(PreviewToolbarControls, {})] }), slotRight: toolbarSlotRight, showPlayTab: showPlayTab }) })), _jsxs("div", { className: "squisq-editor-content", style: {
-                            flex: autoGrow ? '1 1 auto' : 1,
-                            overflowY: autoGrow ? 'auto' : 'hidden',
-                            overflowX: 'hidden',
-                            minHeight: 0,
-                            position: 'relative',
-                            display: 'flex',
-                        }, children: [_jsxs("div", { style: {
-                                    flex: autoGrow ? '1 1 auto' : 1,
-                                    overflow: autoGrow ? 'visible' : 'hidden',
-                                    minHeight: 0,
-                                    position: 'relative',
-                                }, children: [isImageMode &&
-                                        imageSrc &&
-                                        (imageMode === 'edit' && imageEditorContainer ? (_jsx(ImageEditor, { filesContainer: imageEditorContainer, initialSrc: imageSrc, allowVersioning: allowVersioning, versioningAutoSaveIdleMs: versioningAutoSaveIdleMs, onExport: onImageExport })) : (_jsx(ImageViewer, { src: imageSrc, alt: imageAlt, theme: theme }))), !isImageMode && activeView === 'raw' && (_jsxs("div", { className: "squisq-editor-with-gutter", children: [isMarkdownMode && outlineVisible && (_jsx(OutlinePanel, { width: outlineWidth }, "outline")), _jsx("div", { className: "squisq-raw-editor-container", children: _jsx(RawEditor, { theme: theme === 'dark' ? 'vs-dark' : 'vs', submitOnEnter: submitOnEnter, readOnly: readOnly }) }, "raw-editor"), isMarkdownMode && inlinePreviewVisible && (_jsx(InlinePreviewGutter, { width: inlinePreviewWidth, basePath: basePath, mediaProvider: mediaProvider }, "inline"))] }, "raw-shell")), isMarkdownMode && activeView === 'wysiwyg' && (_jsxs("div", { className: "squisq-editor-with-gutter", children: [outlineVisible && _jsx(OutlinePanel, { width: outlineWidth }, "outline"), _jsx(WysiwygEditor, { submitOnEnter: submitOnEnter, placeholder: placeholder, readOnly: readOnly }, "wysiwyg-editor"), inlinePreviewVisible && (_jsx(InlinePreviewGutter, { width: inlinePreviewWidth, basePath: basePath, mediaProvider: mediaProvider }, "inline"))] }, "wysiwyg-shell")), isMarkdownMode && isPreview && (_jsx(PreviewPanel, { basePath: basePath, workspaceContainer: workspaceContainer }))] }), isMarkdownMode && showFiles && (_jsx(MediaBin, { mediaProvider: mediaProvider, isDark: isDark, refreshKey: mediaRefreshKey, onMediaUploaded: insertMediaRef })), isMarkdownMode &&
-                                isDragging &&
-                                !(activeView === 'wysiwyg' && dragContentType === 'media') && (_jsx(DropZoneOverlay, { dragContentType: dragContentType, zoneProps: zoneProps, hasMediaProvider: mediaProvider !== null }))] }), statusBarVisible && !isImageMode && _jsx(StatusBar, {})] }), _jsx(TooltipLayer, {}), imageEditTarget !== null && mediaProvider && (_jsx(ImageEditModal, { relativePath: imageEditTarget, container: workspaceContainer ?? imageEditFallbackContainer, mediaProvider: mediaProvider, onClose: closeImageEdit, onSaved: () => {
-                    bumpMediaRevision();
-                    closeImageEdit();
-                }, allowVersioning: allowVersioning, versioningAutoSaveIdleMs: versioningAutoSaveIdleMs, shellTheme: theme }))] }));
-}
-/**
- * Modal overlay that mounts a full `<ImageEditor>` against a sidecar
- * container scoped under `.imageEdits/<sanitized-path>/` of the document's
- * `ContentContainer`. Opens when a user clicks the "Edit" affordance on an
- * image in the WYSIWYG view; on Export, rewrites the original image bytes
- * via `mediaProvider.addMedia(relativePath, blob, mime)` and bumps
- * `mediaRevision` so live `<img>` nodes pick up the new content.
- */
-function ImageEditModal({ relativePath, container, mediaProvider, onClose, onSaved, allowVersioning, versioningAutoSaveIdleMs, shellTheme, }) {
-    // Each unique image path gets its own sidecar so multiple images in the
-    // same doc can be edited independently without colliding state. When the
-    // host didn't supply a `container`, fall back to a fresh in-memory one
-    // — the edit session is transient anyway and the final raster is what
-    // gets written back through `mediaProvider`.
-    const sidecar = useMemo(() => {
-        const sanitized = relativePath.replace(/[^a-zA-Z0-9._-]+/g, '_');
-        const parent = container ?? new MemoryContentContainer();
-        return scopeContainer(parent, `.imageEdits/${sanitized}`);
-    }, [container, relativePath]);
-    const [initialSrc, setInitialSrc] = useState(null);
-    const [resolveError, setResolveError] = useState(null);
-    useEffect(() => {
-        let cancelled = false;
-        mediaProvider.resolveUrl(relativePath).then((url) => {
-            if (!cancelled)
-                setInitialSrc(url);
-        }, (err) => {
-            if (!cancelled) {
-                setResolveError(err instanceof Error ? err.message : String(err));
-            }
-        });
-        return () => {
-            cancelled = true;
-        };
-    }, [mediaProvider, relativePath]);
-    const handleExport = useCallback((blob, format) => {
-        const mime = `image/${format}`;
-        mediaProvider.addMedia(relativePath, blob, mime).then(() => onSaved(), (err) => {
-            console.error('Failed to write image back:', err instanceof Error ? err.message : err);
-        });
-    }, [mediaProvider, relativePath, onSaved]);
-    // Close on Escape — global listener so it works regardless of focus.
-    useEffect(() => {
-        const handler = (e) => {
-            if (e.key === 'Escape')
-                onClose();
-        };
-        window.addEventListener('keydown', handler);
-        return () => window.removeEventListener('keydown', handler);
-    }, [onClose]);
-    return (_jsx("div", { className: "squisq-image-edit-modal", "data-testid": "image-edit-modal", role: "dialog", "aria-modal": "true", "aria-label": `Edit ${relativePath}`, onClick: (e) => {
-            // Click on the dim backdrop (but not on the surface) → close.
-            if (e.target === e.currentTarget)
-                onClose();
-        }, children: _jsxs("div", { className: "squisq-image-edit-modal__surface", children: [_jsxs("header", { className: "squisq-image-edit-modal__header", children: [_jsx("span", { className: "squisq-image-edit-modal__title", children: "Edit image" }), _jsx("span", { className: "squisq-image-edit-modal__path", children: relativePath }), _jsx("button", { type: "button", className: "squisq-image-edit-modal__close", "data-testid": "image-edit-modal-close", onClick: onClose, "aria-label": "Close image editor", children: "\u00D7" })] }), _jsx("div", { className: "squisq-image-edit-modal__body", children: resolveError ? (_jsxs("div", { className: "squisq-image-edit-modal__error", children: ["Failed to load image: ", resolveError] })) : !initialSrc ? (_jsx("div", { className: "squisq-image-edit-modal__loading", children: "Loading image\u2026" })) : (_jsx(ImageEditor, { filesContainer: sidecar, initialSrc: initialSrc, allowVersioning: allowVersioning, versioningAutoSaveIdleMs: versioningAutoSaveIdleMs, onExport: handleExport, saveBehavior: "export", saveFormat: "png", saveLabel: "Save and close", saveTitle: "Save changes back to the image and close", surface: shellTheme === 'dark' ? DARK_SURFACE : LIGHT_SURFACE })) })] }) }));
-}
-//# sourceMappingURL=EditorShell.js.map