@bendyline/squisq-editor-react 1.6.0 → 1.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. package/README.md +57 -10
  2. package/dist/index.d.ts +476 -105
  3. package/dist/index.js +8703 -6741
  4. package/dist/index.js.map +1 -1
  5. package/dist/styles/fa-brands-400-AHOAZHCU.woff2 +0 -0
  6. package/dist/styles/fa-regular-400-VRZYIBIZ.woff2 +0 -0
  7. package/dist/styles/fa-solid-900-MDEYK55F.woff2 +0 -0
  8. package/dist/styles/fa-v4compatibility-ETEVP6IB.woff2 +0 -0
  9. package/dist/styles/index.css +14617 -0
  10. package/package.json +15 -7
  11. package/src/BlockPropertiesPopover.tsx +23 -7
  12. package/src/EditorContext.tsx +22 -16
  13. package/src/EditorShell.tsx +121 -35
  14. package/src/MediaBin.tsx +171 -28
  15. package/src/OutlinePanel.tsx +26 -4
  16. package/src/PreviewControls.tsx +475 -145
  17. package/src/PreviewPanel.tsx +17 -9
  18. package/src/RawEditor.tsx +10 -4
  19. package/src/TemplateAnnotation.ts +22 -7
  20. package/src/TemplateContentPreview.tsx +56 -0
  21. package/src/TemplatePicker.tsx +295 -128
  22. package/src/ThemeCustomizerPanel.tsx +22 -15
  23. package/src/Toolbar.tsx +547 -217
  24. package/src/TransitionPicker.tsx +8 -1
  25. package/src/VersionHistoryPanel.tsx +2 -2
  26. package/src/ViewSwitcher.tsx +4 -4
  27. package/src/WysiwygEditor.tsx +45 -3
  28. package/src/__tests__/buildPreviewDocTransition.test.ts +1 -2
  29. package/src/__tests__/codeContextSectionView.test.tsx +95 -0
  30. package/src/__tests__/codeContextZoneManager.test.ts +127 -0
  31. package/src/__tests__/diffContextSections.test.ts +39 -0
  32. package/src/__tests__/editorShellCodeContext.test.tsx +86 -0
  33. package/src/__tests__/editorShellProps.test.tsx +363 -0
  34. package/src/__tests__/headingTransition.test.ts +59 -9
  35. package/src/__tests__/imageEditorShell.test.tsx +23 -0
  36. package/src/__tests__/mediaReferences.test.ts +82 -0
  37. package/src/__tests__/previewControls.test.tsx +163 -0
  38. package/src/__tests__/templateAnnotationRoundTrip.test.ts +23 -2
  39. package/src/__tests__/templateContentPreview.test.ts +101 -0
  40. package/src/__tests__/tiptapBridge.test.ts +47 -0
  41. package/src/__tests__/useJsonEditorTokens.test.ts +59 -0
  42. package/src/__tests__/useMediaRecorder.test.ts +17 -0
  43. package/src/codeContext/CodeContextSectionView.tsx +124 -0
  44. package/src/codeContext/CodeContextZoneManager.ts +149 -0
  45. package/src/codeContext/CodeContextZones.tsx +121 -0
  46. package/src/codeContext/diffContextSections.ts +38 -0
  47. package/src/codeContext/types.ts +75 -0
  48. package/src/diagram/DiagramWidget.tsx +6 -4
  49. package/src/headingTransition.ts +96 -21
  50. package/src/index.ts +34 -2
  51. package/src/jsonEditor/useJsonEditorTokens.ts +13 -43
  52. package/src/mediaReferences.ts +299 -0
  53. package/src/recorder/hooks/useMediaRecorder.ts +9 -10
  54. package/src/scene/Scene.tsx +53 -7
  55. package/src/scene/SceneBlockWidget.tsx +6 -3
  56. package/src/scene/SceneSelection.tsx +19 -15
  57. package/src/scene/SceneSideToolbar.tsx +89 -0
  58. package/src/scene/layers/DiagramEdges.tsx +4 -3
  59. package/src/scene/layers/edgeGeometry.ts +23 -4
  60. package/src/scene/scene.css +142 -2
  61. package/src/scene/tools/ConnectTool.ts +113 -24
  62. package/src/scene/tools/DrawingConnectTool.ts +86 -16
  63. package/src/scene/tools/SceneTool.ts +2 -0
  64. package/src/styles/code-context.css +155 -0
  65. package/src/styles/editor.css +991 -84
  66. package/src/styles/index.css +1 -0
  67. package/src/templateContentPreviewResolver.ts +353 -0
  68. package/src/tiptapBridge.ts +60 -33
package/dist/index.d.ts CHANGED
@@ -1,17 +1,18 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import * as react from 'react';
3
3
  import { ReactNode, CSSProperties, RefObject } from 'react';
4
- import { Doc, MediaProvider, Theme, ViewportPreset, ViewportConfig, CustomTemplateDefinition, SurfaceScheme, ImageEditDoc, ImageEditLayer } from '@bendyline/squisq/schemas';
4
+ import { Doc, MediaProvider, Theme, ViewportPreset, ViewportConfig, Block, CustomTemplateDefinition, MediaEntry, SurfaceScheme, ImageEditDoc, ImageEditLayer } from '@bendyline/squisq/schemas';
5
5
  import { MarkdownDocument, HeadingAttributes } from '@bendyline/squisq/markdown';
6
6
  import { ContentContainer } from '@bendyline/squisq/storage';
7
7
  import { DocumentVersionManager, SaveVersionOptions, SaveVersionResult, PrunePolicy } from '@bendyline/squisq/versions';
8
8
  import * as _tiptap_core from '@tiptap/core';
9
9
  import { Editor, Extension } from '@tiptap/core';
10
+ import * as monaco_editor from 'monaco-editor';
10
11
  import { editor } from 'monaco-editor';
11
12
  import { IconFamily } from '@bendyline/squisq/icons';
12
13
  import { DisplayMode, CaptionStyle } from '@bendyline/squisq-react';
13
- import * as _tiptap_extension_heading from '@tiptap/extension-heading';
14
14
  import { Editor as Editor$1 } from '@tiptap/react';
15
+ import * as _tiptap_extension_heading from '@tiptap/extension-heading';
15
16
  import { Node } from '@tiptap/pm/model';
16
17
  import { SquisqAnnotatedSchema, JsonFormValidator, JsonFormValidationError } from '@bendyline/squisq/jsonForm';
17
18
  import { ImageEditExportFormat, ImageEditVersionManager } from '@bendyline/squisq/imageEdit';
@@ -90,7 +91,13 @@ interface DocumentLinkCandidate {
90
91
  */
91
92
  type DocumentLinkProvider = (query: string) => Promise<DocumentLinkCandidate[]>;
92
93
  type EditorView = 'raw' | 'wysiwyg' | 'preview';
93
- type EditorTheme = 'light' | 'dark';
94
+ /**
95
+ * Light/dark chrome mode for the editor shell (toolbar, tabs, status bar,
96
+ * side panes). This is the editor's *UI color scheme* — distinct from a
97
+ * Squisq `Theme` object, which styles the rendered document. Renamed from
98
+ * the former `EditorTheme` to remove that ambiguity.
99
+ */
100
+ type EditorColorScheme = 'light' | 'dark';
94
101
  /**
95
102
  * Document layout mode. `'document'` shows the whole markdown document in
96
103
  * the active view (the historical behavior). `'block'` is the
@@ -126,8 +133,8 @@ interface EditorState {
126
133
  parseError: string | null;
127
134
  /** Whether a parse is pending */
128
135
  isParsing: boolean;
129
- /** Current color theme */
130
- theme: EditorTheme;
136
+ /** Current light/dark chrome color scheme for the editor shell. */
137
+ colorScheme: EditorColorScheme;
131
138
  /** Operating mode — 'markdown' for the full shell, 'code' for Monaco-only. */
132
139
  editorMode: EditorMode;
133
140
  /** Monaco language ID for the Raw editor. */
@@ -237,8 +244,8 @@ interface EditorActions {
237
244
  setTiptapEditor: (editor: Editor | null) => void;
238
245
  /** Register / unregister the Monaco editor instance (called by RawEditor) */
239
246
  setMonacoEditor: (editor: MonacoEditor | null) => void;
240
- /** Set the color theme */
241
- setTheme: (theme: EditorTheme) => void;
247
+ /** Set the light/dark chrome color scheme for the editor shell. */
248
+ setColorScheme: (colorScheme: EditorColorScheme) => void;
242
249
  /** Show or hide the inline preview gutter at runtime (driven by the View menu). */
243
250
  setInlinePreviewVisible: (visible: boolean) => void;
244
251
  /** Show or hide the bottom status bar at runtime (driven by the View menu). */
@@ -340,8 +347,8 @@ interface EditorProviderProps {
340
347
  initialView?: EditorView;
341
348
  /** Article ID used when generating the Doc */
342
349
  articleId?: string;
343
- /** Color theme */
344
- theme?: EditorTheme;
350
+ /** Light/dark chrome color scheme for the editor shell. */
351
+ colorScheme?: EditorColorScheme;
345
352
  /**
346
353
  * Workspace-scoped `ContentContainer` for this document — the folder
347
354
  * holding the doc, its `_files/` sidecar, sibling documents, and any
@@ -476,7 +483,83 @@ interface ViewPreferences {
476
483
  /** Document vs. block-at-a-time layout. */
477
484
  layoutMode?: LayoutMode;
478
485
  }
479
- declare function EditorProvider({ initialMarkdown, initialView, articleId, theme: initialTheme, workspaceContainer, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, mediaProvider, imageDisplayMode, mentionProvider, documentLinkProvider, allowRecording, fileName, language, inlinePreview, showStatusBar, outline, blockTags, themeInheritance, layoutMode, viewPreferences, onViewPreferencesChange, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
486
+ declare function EditorProvider({ initialMarkdown, initialView, articleId, colorScheme: initialColorScheme, workspaceContainer, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, mediaProvider, imageDisplayMode, mentionProvider, documentLinkProvider, allowRecording, fileName, language, inlinePreview, showStatusBar, outline, blockTags, themeInheritance, layoutMode, viewPreferences, onViewPreferencesChange, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
487
+
488
+ /**
489
+ * Host-supplied context sections rendered INSIDE the Monaco (raw/code)
490
+ * surface: collapsible markdown blurbs injected above anchor lines, plus an
491
+ * optional file-top summary. Squisq stays host-agnostic — anchors are plain
492
+ * line numbers, ids are opaque strings, links are intercepted via callback.
493
+ *
494
+ * Accessibility note: Monaco marks its view-zone layer `aria-hidden`, so
495
+ * sections are invisible to screen readers in v1.
496
+ */
497
+ /**
498
+ * One host-supplied markdown blurb anchored above a line of the code buffer.
499
+ * Rendered as a compact one-line strip that expands in place to the full
500
+ * markdown body.
501
+ */
502
+ interface CodeContextSection {
503
+ /**
504
+ * Stable identity used to reconcile zones across prop updates — e.g. a
505
+ * symbol id like 'resolveImportEdges@60'. Zones are diffed by id: same id +
506
+ * new line moves the zone; same id + new markdown re-renders in place; a
507
+ * new id creates a new zone.
508
+ */
509
+ id: string;
510
+ /**
511
+ * 1-based line the section renders ABOVE. Out-of-range values are clamped
512
+ * by Monaco. In editable buffers the zone rides Monaco's whitespace
513
+ * semantics — it shifts as lines are inserted/deleted above it and
514
+ * collapses onto the previous line if its anchor lines are deleted. Squisq
515
+ * never re-derives anchors from edits; the host re-supplies lines when it
516
+ * re-analyzes the file.
517
+ */
518
+ line: number;
519
+ /**
520
+ * Compact markdown for the collapsed strip. Rendered on one line (block
521
+ * structure flattened, overflow ellipsized). Links work here too and go
522
+ * through `onLinkClick`.
523
+ */
524
+ summaryMarkdown: string;
525
+ /**
526
+ * Full markdown body shown when expanded. Omit while still loading — the
527
+ * expanded view shows a muted loading row and fills in when a later prop
528
+ * update supplies it.
529
+ */
530
+ markdown?: string;
531
+ /** Start expanded. The user's toggle wins after first interaction. Default false. */
532
+ defaultExpanded?: boolean;
533
+ }
534
+ /** The full context dictionary passed to `EditorShell.codeContext`. */
535
+ interface CodeContext {
536
+ /**
537
+ * Section pinned above line 1 (file summary). Rendered before any line-1
538
+ * `sections` entry. `line` is implicit.
539
+ */
540
+ fileTop?: Omit<CodeContextSection, 'line'>;
541
+ /** Line-anchored sections. Array order is preserved for equal lines. */
542
+ sections?: CodeContextSection[];
543
+ /**
544
+ * Extra URI schemes section links may use (e.g. `['gezel-nav']`).
545
+ * http/https/mailto/tel are always allowed; executable schemes
546
+ * (javascript:, data:) are never allowed regardless.
547
+ */
548
+ linkSchemes?: readonly string[];
549
+ /**
550
+ * Intercepts link clicks inside sections, receiving the href exactly as
551
+ * authored in the markdown. Return `false` to let the browser's default
552
+ * navigation proceed; any other return (or void) suppresses it. Fragment
553
+ * links of the form `#L<digits>` are handled natively by squisq (reveal
554
+ * that line in the editor) and never reach this callback. When omitted:
555
+ * http(s)/mailto links open normally, custom-scheme links do nothing.
556
+ */
557
+ onLinkClick?: (href: string, meta: {
558
+ sectionId: string;
559
+ }) => boolean | undefined;
560
+ /** Notified on expand/collapse — lets hosts lazy-load bodies on first expand. */
561
+ onToggleSection?: (sectionId: string, expanded: boolean) => void;
562
+ }
480
563
 
481
564
  interface EditorShellProps {
482
565
  /** Initial markdown content */
@@ -490,8 +573,13 @@ interface EditorShellProps {
490
573
  basePath?: string;
491
574
  /** Called when markdown source changes */
492
575
  onChange?: (source: string) => void;
493
- /** Color theme: 'light' or 'dark' (default: 'light') */
494
- theme?: 'light' | 'dark';
576
+ /**
577
+ * Light/dark chrome color scheme for the editor shell — toolbar, tabs,
578
+ * status bar, and side panes (default: `'light'`). This is the editor's
579
+ * UI mode, **not** a Squisq `Theme` object; the rendered document's
580
+ * styling is controlled separately via `themeOverride` / `Doc.themeId`.
581
+ */
582
+ colorScheme?: 'light' | 'dark';
495
583
  /** Additional class name */
496
584
  className?: string;
497
585
  /** CSS height for the shell container (default: '100vh') */
@@ -586,6 +674,13 @@ interface EditorShellProps {
586
674
  * (Slack, Discord). When omitted, the editor behaves normally.
587
675
  */
588
676
  submitOnEnter?: () => void;
677
+ /**
678
+ * Host-supplied context dictionary rendered inside the Monaco (raw / code)
679
+ * surface: collapsible markdown sections injected above anchor lines, plus
680
+ * an optional file-top summary. See {@link CodeContext}. Ignored in
681
+ * WYSIWYG / preview / image surfaces.
682
+ */
683
+ codeContext?: CodeContext;
589
684
  /**
590
685
  * Let the WYSIWYG editing surface fill its container instead of rendering
591
686
  * as a centered 800px "page" column. Useful when embedding in chat
@@ -744,9 +839,11 @@ interface EditorShellProps {
744
839
  */
745
840
  outline?: boolean;
746
841
  /**
747
- * Width in pixels for the outline pane. Defaults to 240. Only takes
748
- * effect when {@link EditorShellProps.outline} is true (or the View
749
- * menu has toggled it on).
842
+ * Fixed width in pixels for the outline pane. When omitted, the pane sizes
843
+ * responsively never narrower than 260px, growing with the window and
844
+ * capped at 460px — so it stretches out when there's horizontal space to
845
+ * spare. Only takes effect when {@link EditorShellProps.outline} is true (or
846
+ * the View menu has toggled it on).
750
847
  */
751
848
  outlineWidth?: number;
752
849
  /**
@@ -791,7 +888,18 @@ interface EditorShellProps {
791
888
  * Complete markdown editor shell with toolbar, view switcher, and three
792
889
  * editing modes: Raw (Monaco), WYSIWYG (Tiptap), and Preview.
793
890
  */
794
- 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): react_jsx_runtime.JSX.Element;
891
+ declare function EditorShell({ initialMarkdown, initialView, articleId, basePath, onChange, colorScheme, className, height, minHeight, maxHeight, mediaProvider, workspaceContainer, container, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, showFilesToggle, toolbarSlotLeft, toolbarSlotAfterActions, toolbarSlotRight, showPlayTab, submitOnEnter, codeContext, 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): react_jsx_runtime.JSX.Element;
892
+
893
+ /**
894
+ * Bridges a host-supplied {@link CodeContext} onto the live Monaco editor:
895
+ * owns a {@link CodeContextZoneManager} per editor instance, reconciles zones
896
+ * when the context prop changes, and portals a `CodeContextSectionView` into
897
+ * each zone's dom node. Mounted by EditorShell in code mode; also exported
898
+ * for hosts composing a custom shell around `RawEditor`.
899
+ */
900
+ declare function CodeContextZones({ options }: {
901
+ options: CodeContext;
902
+ }): react_jsx_runtime.JSX.Element | null;
795
903
 
796
904
  /**
797
905
  * One entry in a {@link FolderView} — a file or subfolder. Host-defined
@@ -1080,8 +1188,14 @@ declare function ImageViewer({ src, alt, className, theme }: ImageViewerProps):
1080
1188
  * Syncs changes back to EditorContext on every keystroke (debounced).
1081
1189
  */
1082
1190
  interface RawEditorProps {
1083
- /** Monaco editor theme (default: 'vs-dark') */
1084
- theme?: string;
1191
+ /**
1192
+ * Monaco editor theme name (default: `'vs'`). Accepts Monaco's built-in
1193
+ * theme ids (`'vs'`, `'vs-dark'`, `'hc-black'`) — which are transparently
1194
+ * mapped to the Squisq-tinted variants — or any custom theme registered
1195
+ * via `monaco.editor.defineTheme`. This is the *code editor* color
1196
+ * theme, distinct from the shell's light/dark `colorScheme`.
1197
+ */
1198
+ monacoTheme?: string;
1085
1199
  /** Show minimap (default: false) */
1086
1200
  minimap?: boolean;
1087
1201
  /** Font size in pixels (default: 14) */
@@ -1102,7 +1216,7 @@ interface RawEditorProps {
1102
1216
  * Raw markdown editor using Monaco Editor.
1103
1217
  * Binds to the shared EditorContext for source synchronization.
1104
1218
  */
1105
- declare function RawEditor({ theme, minimap, fontSize, wordWrap, className, submitOnEnter, readOnly, }: RawEditorProps): react_jsx_runtime.JSX.Element;
1219
+ declare function RawEditor({ monacoTheme, minimap, fontSize, wordWrap, className, submitOnEnter, readOnly, }: RawEditorProps): react_jsx_runtime.JSX.Element;
1106
1220
 
1107
1221
  /**
1108
1222
  * WysiwygEditor
@@ -1337,9 +1451,85 @@ interface ThemePickerProps {
1337
1451
  }
1338
1452
  declare function ThemePicker({ value, onChange, includeDefault, variant, ariaLabel, customThemes, onCreateCustom, onEditCustom, onDeleteCustom, }: ThemePickerProps): react_jsx_runtime.JSX.Element;
1339
1453
 
1454
+ interface CustomThemeContextValue {
1455
+ /** Themes inlined into the current doc's frontmatter. */
1456
+ docThemes: Theme[];
1457
+ /** Themes the user has saved to their browser-local library. */
1458
+ libraryThemes: Theme[];
1459
+ /**
1460
+ * Convenience: the union of doc + library, with library entries skipped
1461
+ * when a doc theme of the same id already exists. Used by the picker so a
1462
+ * single "Custom" section covers both sources without duplicates.
1463
+ */
1464
+ allThemes: Theme[];
1465
+ /**
1466
+ * Persist a theme into the current doc. Replaces any existing entry with
1467
+ * the same `id`. Triggers the host's `onDocThemesChange` so the doc's
1468
+ * frontmatter ends up updated.
1469
+ */
1470
+ upsertDocTheme: (theme: Theme) => void;
1471
+ /** Persist a theme into the user's library (replaces by id). */
1472
+ upsertLibraryTheme: (theme: Theme) => void;
1473
+ /** Remove a doc-level theme by id. */
1474
+ removeDocTheme: (id: string) => void;
1475
+ /** Remove a library theme by id. */
1476
+ removeLibraryTheme: (id: string) => void;
1477
+ /**
1478
+ * Apply a theme to the current doc. If the theme is already in the doc,
1479
+ * this is a no-op. If it's only in the library, it's copied into the doc
1480
+ * so SSR / export work. Returns the resolved definition so callers can
1481
+ * also write the `squisq-theme` selection.
1482
+ */
1483
+ applyTheme: (theme: Theme) => Theme;
1484
+ }
1485
+ interface CustomThemeProviderProps {
1486
+ /** The current doc's custom themes (from `Doc.customThemes`). */
1487
+ docThemes: Theme[];
1488
+ /**
1489
+ * Callback the host uses to persist a new doc-theme list back into the doc
1490
+ * (e.g. by writing the encoded payload into the markdown's
1491
+ * `squisq-custom-themes` frontmatter key).
1492
+ */
1493
+ onDocThemesChange: (next: Theme[]) => void;
1494
+ children: ReactNode;
1495
+ }
1496
+ declare function CustomThemeProvider({ docThemes, onDocThemesChange, children, }: CustomThemeProviderProps): react_jsx_runtime.JSX.Element;
1497
+ /**
1498
+ * Hook returning the current context. Returns null when no provider is
1499
+ * mounted — callers can degrade to "no custom themes" rather than throwing,
1500
+ * since the feature is optional.
1501
+ */
1502
+ declare function useCustomThemes(): CustomThemeContextValue | null;
1503
+
1504
+ /**
1505
+ * useDocCustomThemes — read + persist the active doc's custom themes (the
1506
+ * list inlined into the doc's frontmatter under `squisq-custom-themes`).
1507
+ *
1508
+ * The theme analog of `useDocCustomTemplates`. Both the CustomThemeProvider
1509
+ * and any manager surface need the same two things: the current
1510
+ * `Doc.customThemes` array and a way to write a new list back into the
1511
+ * markdown source. Centralizing the frontmatter encoding here keeps call
1512
+ * sites from drifting.
1513
+ */
1514
+
1515
+ interface DocCustomThemes {
1516
+ /** Custom themes inlined in the active doc's frontmatter. */
1517
+ docThemes: Theme[];
1518
+ /**
1519
+ * Persist a new custom-themes list back into the markdown source's
1520
+ * frontmatter so the doc round-trips through save/load. The whole list is
1521
+ * encoded as a single compact JSON string per the flat YAML frontmatter
1522
+ * parser's constraint.
1523
+ */
1524
+ onDocThemesChange: (next: Theme[]) => void;
1525
+ }
1526
+ declare function useDocCustomThemes(): DocCustomThemes;
1527
+
1340
1528
  /** Where a saved theme lands — mirrors `DesignerSaveTarget` for templates. */
1341
1529
  type ThemeSaveTarget = 'doc' | 'library';
1342
1530
 
1531
+ /** Caption selection: off, or one of the two enabled styles. */
1532
+ type CaptionMode = 'off' | CaptionStyle;
1343
1533
  interface PreviewSettings {
1344
1534
  activePreset: ViewportPreset;
1345
1535
  setSelectedPreset: (preset: ViewportPreset | null) => void;
@@ -1351,8 +1541,18 @@ interface PreviewSettings {
1351
1541
  activeTheme: Theme;
1352
1542
  activeTransformStyle: string;
1353
1543
  setSelectedTransformStyle: (id: string | null) => void;
1544
+ /** The caption style used when captions are enabled. */
1354
1545
  activeCaptionStyle: CaptionStyle;
1355
- setSelectedCaptionStyle: (style: CaptionStyle | null) => void;
1546
+ /** Whether captions are shown at all (the 'off' arm of the tri-state). */
1547
+ activeCaptionsEnabled: boolean;
1548
+ /** Set the caption mode: 'off' hides captions, 'standard'/'social' enable
1549
+ * that style. The single entry point so the toggle buttons persist in one
1550
+ * frontmatter write. */
1551
+ setCaptionMode: (mode: CaptionMode) => void;
1552
+ /** Whether Squisq should synthesize and show its managed cover slide. */
1553
+ activeCoverSlide: boolean;
1554
+ /** Enable/disable the managed cover slide. */
1555
+ setCoverSlideEnabled: (enabled: boolean) => void;
1356
1556
  /** User-authored themes (doc + browser library) for the picker's "Custom" group. */
1357
1557
  customThemes: Theme[];
1358
1558
  /** Open the custom-theme designer for a theme (or null to create a new one). */
@@ -1385,14 +1585,34 @@ interface PreviewSettingsProviderProps {
1385
1585
  declare function PreviewSettingsProvider({ doc, children, themeOverride, }: PreviewSettingsProviderProps): react_jsx_runtime.JSX.Element;
1386
1586
  /**
1387
1587
  * Inline preview controls rendered in the main toolbar row.
1388
- * On narrow viewports, collapses into a single settings button with a dropdown.
1588
+ *
1589
+ * Collapse is *progressive* (a priority-plus pattern): rather than switch the
1590
+ * whole row in and out at a fixed window-width breakpoint, the controls
1591
+ * measure how many of them actually fit in the width the toolbar gives them
1592
+ * and keep that many inline, folding the rest — from the low-priority end of
1593
+ * {@link CONTROL_KEYS} — into a single ellipsis button's popover. As
1594
+ * the toolbar widens or narrows, controls migrate one at a time between the
1595
+ * inline row and the menu, so the available space is always well used and the
1596
+ * row never wraps onto a second line.
1389
1597
  */
1390
1598
  declare function PreviewToolbarControls(): react_jsx_runtime.JSX.Element;
1599
+ /**
1600
+ * Segmented display-mode switch (Video / Slideshow / Document / Page), used
1601
+ * inline in the Use toolbar and inside its overflow popover. Reads and writes
1602
+ * the same `activeDisplayMode` in preview settings.
1603
+ */
1604
+ declare function PreviewModeSwitch(): react_jsx_runtime.JSX.Element;
1605
+ /**
1606
+ * Segmented aspect-ratio switch (16:9 / 1:1 / 9:16 / 4:3), used inline in the
1607
+ * Use toolbar and inside its overflow popover. Reads and writes the same
1608
+ * `activePreset` in preview settings.
1609
+ */
1610
+ declare function PreviewFormatSwitch(): react_jsx_runtime.JSX.Element;
1391
1611
 
1392
1612
  /**
1393
1613
  * ViewSwitcher
1394
1614
  *
1395
- * Tab bar for switching between Raw, WYSIWYG, and Preview editor views.
1615
+ * Tab bar for switching between Write, Source, and Use editor views.
1396
1616
  */
1397
1617
  interface ViewSwitcherProps {
1398
1618
  /** Additional class name */
@@ -1408,10 +1628,16 @@ interface ToolbarProps {
1408
1628
  className?: string;
1409
1629
  /** Whether the Files panel is currently shown */
1410
1630
  showFiles?: boolean;
1631
+ /** Number of files currently available through the MediaProvider. */
1632
+ fileCount?: number;
1411
1633
  /** Toggle the Files panel. When provided, a "Files" button appears in the toolbar. */
1412
1634
  onToggleFiles?: () => void;
1413
1635
  /** Content rendered at the left edge of the toolbar, before the view tabs. */
1414
1636
  slotLeft?: ReactNode;
1637
+ /** Content rendered immediately after the view tabs, on the left side of the
1638
+ * toolbar (before the formatting controls). Used for the preview mode
1639
+ * switch in Use view. */
1640
+ slotAfterTabs?: ReactNode;
1415
1641
  /** Content rendered after the formatting controls (in the middle area). */
1416
1642
  slotAfterActions?: ReactNode;
1417
1643
  /** Content rendered at the rightmost end of the toolbar, after all other elements. */
@@ -1428,7 +1654,7 @@ interface ToolbarProps {
1428
1654
  * - WYSIWYG: calls Tiptap chain commands (toggleBold, etc.)
1429
1655
  * - Raw: appends markdown syntax to the source
1430
1656
  */
1431
- declare function Toolbar({ className, showFiles, onToggleFiles, slotLeft, slotAfterActions, slotRight, showPlayTab, }: ToolbarProps): react_jsx_runtime.JSX.Element;
1657
+ declare function Toolbar({ className, showFiles, fileCount, onToggleFiles, slotLeft, slotAfterTabs, slotAfterActions, slotRight, showPlayTab, }: ToolbarProps): react_jsx_runtime.JSX.Element;
1432
1658
 
1433
1659
  /**
1434
1660
  * VersionHistoryPanel
@@ -1457,17 +1683,12 @@ declare function VersionHistoryPanel(): react_jsx_runtime.JSX.Element | null;
1457
1683
  */
1458
1684
  declare function ViewMenuPanel(): react_jsx_runtime.JSX.Element;
1459
1685
 
1460
- /**
1461
- * OutlinePanel
1462
- *
1463
- * Left-side companion to the InlinePreviewGutter. Renders a hierarchical
1464
- * tree of the document's headings (h1 → h2 → h3 …) so the structure is
1465
- * graspable at a glance and the user can jump to any section. Works in
1466
- * BOTH the WYSIWYG and Markdown editor views — view-specific positioning
1467
- * lives in `useHeadingLayout`.
1468
- */
1469
1686
  interface OutlinePanelProps {
1470
- /** Width of the pane in pixels (default: 240). */
1687
+ /**
1688
+ * Fixed width of the pane in pixels. When omitted, the pane sizes
1689
+ * responsively from `--squisq-outline-width` (falling back to
1690
+ * {@link OUTLINE_RESPONSIVE_WIDTH}) so it stretches on wider screens.
1691
+ */
1471
1692
  width?: number;
1472
1693
  /** Optional CSS class for the outer container. */
1473
1694
  className?: string;
@@ -1483,8 +1704,18 @@ interface ThemeCustomizerPanelProps {
1483
1704
  onSave?: (theme: Theme, json: string) => void;
1484
1705
  /** Fired when the user clicks Reset. Host typically clears its persistent storage. */
1485
1706
  onReset?: () => void;
1707
+ /** Optional text trigger. Omit to use the compact icon trigger. */
1708
+ triggerLabel?: string;
1709
+ }
1710
+ declare function ThemeCustomizerPanel({ value, onChange, onSave, onReset, triggerLabel, }: ThemeCustomizerPanelProps): react_jsx_runtime.JSX.Element;
1711
+
1712
+ interface TemplatePreviewSource {
1713
+ block: Block;
1714
+ theme: Theme;
1715
+ viewport: ViewportConfig;
1716
+ basePath?: string;
1717
+ mediaProvider?: MediaProvider | null;
1486
1718
  }
1487
- declare function ThemeCustomizerPanel({ value, onChange, onSave, onReset, }: ThemeCustomizerPanelProps): react_jsx_runtime.JSX.Element;
1488
1719
 
1489
1720
  /**
1490
1721
  * Convert a camelCase template id to a human-readable label. Accepts both
@@ -1497,6 +1728,8 @@ declare function templateLabel(name: string, customTemplates?: readonly CustomTe
1497
1728
  interface TemplatePickerProps {
1498
1729
  value: string;
1499
1730
  onChange: (name: string) => void;
1731
+ /** Active editor chrome theme, used by the portaled dialog. */
1732
+ colorScheme?: 'light' | 'dark';
1500
1733
  /** When true, shows only the trigger button (no popover) — used in the overflow menu. */
1501
1734
  compact?: boolean;
1502
1735
  /**
@@ -1512,8 +1745,14 @@ interface TemplatePickerProps {
1512
1745
  * hidden.
1513
1746
  */
1514
1747
  onOpenDesigner?: () => void;
1748
+ /**
1749
+ * Active block content used to render live template thumbnails. When omitted,
1750
+ * or when a template cannot be meaningfully derived from the block, cards use
1751
+ * their static wireframe icons.
1752
+ */
1753
+ previewSource?: TemplatePreviewSource;
1515
1754
  }
1516
- declare function TemplatePicker({ value, onChange, compact, recommended, onOpenDesigner, }: TemplatePickerProps): react_jsx_runtime.JSX.Element;
1755
+ declare function TemplatePicker({ value, onChange, colorScheme, compact, recommended, onOpenDesigner, previewSource, }: TemplatePickerProps): react_jsx_runtime.JSX.Element;
1517
1756
 
1518
1757
  /**
1519
1758
  * headingTransition
@@ -1523,16 +1762,13 @@ declare function TemplatePicker({ value, onChange, compact, recommended, onOpenD
1523
1762
  *
1524
1763
  * - Markdown (Monaco): operate on the raw heading line string.
1525
1764
  * - WYSIWYG (Tiptap): operate on the heading node's `dataBlockAttrs` string
1526
- * (the inner of the Pandoc `{…}` block, no braces matching how
1527
- * `tiptapBridge` stores and re-emits it).
1765
+ * (Pandoc `{…}` inner) and `dataTemplateParams` string (the params inside
1766
+ * the squisq-native `{[…]}` annotation).
1528
1767
  *
1529
- * Transitions are stored in the Pandoc `{#id .class key=value}` attribute
1530
- * block, NOT the `{[template …]}` annotation. That mirrors the canonical
1531
- * serializer (`core/doc/docToMarkdown.ts` `ensureTransitionAttributes`,
1532
- * which always emits the `{…}` form) and `diagram/diagramCommands.ts`, so a
1533
- * value set here round-trips through a Doc render without being duplicated
1534
- * or moved. Reads still look at the `{[…]}` params too, so a hand-typed
1535
- * `{[title transition=fade]}` shows up in the picker.
1768
+ * The editor writes transitions to the squisq-native `{[…]}` annotation by
1769
+ * default. It still reads legacy Pandoc `{transition=…}` attributes and
1770
+ * removes/migrates those keys when rewriting, so the two channels cannot drift
1771
+ * after a toolbar edit.
1536
1772
  *
1537
1773
  * All the brace-matching / tokenizing / serializing is delegated to the
1538
1774
  * shared core helpers so this stays in lockstep with the parser by import
@@ -1550,27 +1786,41 @@ interface TransitionFields {
1550
1786
  declare const EMPTY_TRANSITION: TransitionFields;
1551
1787
  /**
1552
1788
  * Read the transition fields off a heading line. Looks in both the Pandoc
1553
- * `{…}` block (canonical) and the `{[…]}` template params (hand-typed),
1789
+ * `{…}` block (legacy) and the `{[…]}` template params (canonical),
1554
1790
  * with the Pandoc block taking precedence. Returns the empty transition for
1555
1791
  * non-heading lines.
1556
1792
  */
1557
1793
  declare function readHeadingLineTransition(line: string): TransitionFields;
1558
1794
  /**
1559
1795
  * Return `line` with its transition rewritten from `next`, writing into the
1560
- * Pandoc `{…}` block and leaving the `{[…]}` template annotation untouched.
1561
- * Non-heading lines are returned unchanged.
1796
+ * squisq-native `{[]}` annotation. Legacy Pandoc transition keys are removed
1797
+ * while preserving ids, classes, and other Pandoc params. Non-heading lines are
1798
+ * returned unchanged.
1562
1799
  */
1563
1800
  declare function setHeadingLineTransition(line: string, next: TransitionFields): string;
1564
1801
  /**
1565
- * Read the transition fields from a heading node's `dataBlockAttrs` (Pandoc
1566
- * inner) plus `dataTemplateParams` (the `{[…]}` params). Pandoc wins.
1802
+ * Read the transition fields from a heading node's `dataBlockAttrs` (legacy
1803
+ * Pandoc inner) plus `dataTemplateParams` (canonical `{[…]}` params). Pandoc
1804
+ * wins so the picker mirrors the value that `markdownToDoc` will render when
1805
+ * both channels are present.
1567
1806
  */
1568
1807
  declare function readBlockAttrsTransition(blockAttrsInner: string | null | undefined, templateParams: string | null | undefined): TransitionFields;
1808
+ interface HeadingTransitionAttrs {
1809
+ /** Inner of the Pandoc `{…}` block, without braces. */
1810
+ blockAttrsInner: string | null;
1811
+ /** Param string inside the `{[…]}` annotation, without the template token. */
1812
+ templateParams: string | null;
1813
+ }
1569
1814
  /**
1570
- * Rewrite the transition in a heading node's `dataBlockAttrs` inner string.
1571
- * Returns the new inner (no braces), or null when the block carries no
1572
- * attributes at all — matching how `tiptapBridge` stores `dataBlockAttrs`
1573
- * (absent attribute → null, not `{}`).
1815
+ * Rewrite a heading node's transition for Tiptap, writing the transition
1816
+ * family into `dataTemplateParams` and removing any legacy transition keys
1817
+ * from `dataBlockAttrs`.
1818
+ */
1819
+ declare function setHeadingAttrsTransition(blockAttrsInner: string | null | undefined, templateParams: string | null | undefined, next: TransitionFields): HeadingTransitionAttrs;
1820
+ /**
1821
+ * Legacy single-channel writer for callers that only own `dataBlockAttrs`.
1822
+ * Internal editor surfaces should use {@link setHeadingAttrsTransition} so new
1823
+ * transition edits land in the squisq-native `{[…]}` params.
1574
1824
  */
1575
1825
  declare function setBlockAttrsTransition(blockAttrsInner: string | null | undefined, next: TransitionFields): string | null;
1576
1826
 
@@ -1666,12 +1916,11 @@ declare function summarizeBlockProps(blockAttrs: string | null | undefined, temp
1666
1916
  *
1667
1917
  * The on-canvas "block properties" palette — the sibling of the block-template
1668
1918
  * badge. Anchored at the `.squisq-props-badge` chip on a heading, it edits the
1669
- * block's playback/animation metadata, all stored in the heading's Pandoc `{…}`
1670
- * attribute block (`dataBlockAttrs`):
1919
+ * block's playback/animation metadata:
1671
1920
  *
1672
- * - Transition (type / direction / duration) — reuses `TransitionPicker`
1673
- * - Duration (`duration`) — how long the block is shown
1674
- * - Start time (`startTime`) — timeline position
1921
+ * - Transition (type / direction / duration) — stored in `{[…]}` params
1922
+ * - Duration (`duration`) — stored in Pandoc `dataBlockAttrs`
1923
+ * - Start time (`startTime`) — stored in Pandoc `dataBlockAttrs`
1675
1924
  *
1676
1925
  * The popover holds the `dataBlockAttrs` inner string as working state and
1677
1926
  * re-derives each control from it, so successive edits compose. Every change
@@ -1688,9 +1937,14 @@ interface BlockPropertiesPopoverProps {
1688
1937
  templateParams: string | null;
1689
1938
  /** Apply a new `dataBlockAttrs` inner to the heading (null clears it). */
1690
1939
  onChange: (nextInner: string | null) => void;
1940
+ /** Apply a paired `dataBlockAttrs` / `dataTemplateParams` transition rewrite. */
1941
+ onAnnotationChange?: (next: {
1942
+ blockAttrsInner: string | null;
1943
+ templateParams: string | null;
1944
+ }) => void;
1691
1945
  onClose: () => void;
1692
1946
  }
1693
- declare function BlockPropertiesPopover({ anchorRect, blockAttrs, templateParams, onChange, onClose, }: BlockPropertiesPopoverProps): react.ReactPortal;
1947
+ declare function BlockPropertiesPopover({ anchorRect, blockAttrs, templateParams, onChange, onAnnotationChange, onClose, }: BlockPropertiesPopoverProps): react.ReactPortal;
1694
1948
 
1695
1949
  interface InlinePreviewGutterProps {
1696
1950
  /** Width of the gutter in pixels (default: 320). */
@@ -1722,6 +1976,8 @@ interface MediaBinProps {
1722
1976
  isDark: boolean;
1723
1977
  /** Incremented externally to signal a re-scan of the media list */
1724
1978
  refreshKey?: number;
1979
+ /** Relative media paths currently referenced by the document. */
1980
+ usedMediaPaths?: ReadonlySet<string>;
1725
1981
  /**
1726
1982
  * Fired after a successful upload via the MediaBin's own "+ Upload"
1727
1983
  * button. `relativePath` is what the provider returned (the same
@@ -1733,8 +1989,15 @@ interface MediaBinProps {
1733
1989
  * else, leaving the message body empty when the user hit Send.
1734
1990
  */
1735
1991
  onMediaUploaded?: (relativePath: string, name: string, mimeType: string) => void | Promise<void>;
1992
+ /**
1993
+ * Fired after a file is removed through the MediaBin context menu.
1994
+ * Hosts use this to remove matching markdown refs from the document.
1995
+ */
1996
+ onMediaRemoved?: (relativePath: string, entry: MediaEntry) => void | Promise<void>;
1997
+ /** Fired whenever the panel scans media and knows the current entry count. */
1998
+ onCountChange?: (count: number) => void;
1736
1999
  }
1737
- declare function MediaBin({ mediaProvider, isDark, refreshKey, onMediaUploaded }: MediaBinProps): react_jsx_runtime.JSX.Element;
2000
+ declare function MediaBin({ mediaProvider, isDark, refreshKey, usedMediaPaths, onMediaUploaded, onMediaRemoved, onCountChange, }: MediaBinProps): react_jsx_runtime.JSX.Element;
1738
2001
 
1739
2002
  /**
1740
2003
  * StatusBar
@@ -1868,6 +2131,155 @@ declare function processTextFile(file: File): Promise<string>;
1868
2131
  */
1869
2132
  declare function processTextFiles(files: File[]): Promise<string>;
1870
2133
 
2134
+ /**
2135
+ * useMonacoLoader
2136
+ *
2137
+ * Idempotently dynamic-imports `monaco-editor` and points the
2138
+ * `@monaco-editor/react` singleton loader at the bundled copy. Replaces
2139
+ * the historical top-of-module `import * as monaco from 'monaco-editor';
2140
+ * loader.config({ monaco })` pattern, which forced every consumer of
2141
+ * `@bendyline/squisq-editor-react` — including ones that only import
2142
+ * `JsonEditor` or a type — to drag in monaco's ~9MB worth of language
2143
+ * services and workers at module evaluation time.
2144
+ *
2145
+ * Hosts that want the smallest possible bundle can keep aliasing
2146
+ * `monaco-editor` to a slim entry as before; the behavior is identical
2147
+ * once the dynamic import settles.
2148
+ *
2149
+ * The promise is cached at module scope so the first subscriber
2150
+ * anywhere in the app pays the import cost and every later subscriber
2151
+ * reuses the same settled value.
2152
+ */
2153
+ interface UseMonacoLoaderResult {
2154
+ /** The monaco namespace once loaded, or `null` while the import is in flight. */
2155
+ monaco: typeof monaco_editor | null;
2156
+ /** Flips to `true` after the import settles. Gate `<Editor>` / `<DiffEditor>` renders on this. */
2157
+ ready: boolean;
2158
+ }
2159
+ /**
2160
+ * Subscribe to the lazy-loaded monaco namespace. The first caller
2161
+ * triggers `import('monaco-editor')` and configures the
2162
+ * `@monaco-editor/react` loader; subsequent callers receive the same
2163
+ * cached value.
2164
+ */
2165
+ declare function useMonacoLoader(): UseMonacoLoaderResult;
2166
+
2167
+ interface CustomTemplateContextValue {
2168
+ /** Templates inlined into the current doc's frontmatter. */
2169
+ docTemplates: CustomTemplateDefinition[];
2170
+ /** Templates the user has saved to their browser-local library. */
2171
+ libraryTemplates: CustomTemplateDefinition[];
2172
+ /**
2173
+ * Convenience: the union of doc + library, with library entries
2174
+ * skipped when a doc template of the same name already exists.
2175
+ * Used by the picker so a single "Custom" section covers both
2176
+ * sources without duplicates.
2177
+ */
2178
+ allTemplates: CustomTemplateDefinition[];
2179
+ /**
2180
+ * Persist a template into the current doc. Replaces any existing
2181
+ * entry with the same `name`. Triggers the host's
2182
+ * `onDocTemplatesChange` so the doc's frontmatter ends up updated.
2183
+ */
2184
+ upsertDocTemplate: (def: CustomTemplateDefinition) => void;
2185
+ /** Persist a template into the user's library (replaces by name). */
2186
+ upsertLibraryTemplate: (def: CustomTemplateDefinition) => void;
2187
+ /** Remove a doc-level template by name. */
2188
+ removeDocTemplate: (name: string) => void;
2189
+ /** Remove a library template by name. */
2190
+ removeLibraryTemplate: (name: string) => void;
2191
+ /**
2192
+ * Apply a template to the current doc. If the template is already in
2193
+ * the doc, this is a no-op. If it's only in the library, it's
2194
+ * copied into the doc so SSR / export work. Returns the resolved
2195
+ * definition so callers can also write the heading annotation.
2196
+ */
2197
+ applyTemplate: (def: CustomTemplateDefinition) => CustomTemplateDefinition;
2198
+ }
2199
+ interface CustomTemplateProviderProps {
2200
+ /** The current doc's custom templates (from `Doc.customTemplates`). */
2201
+ docTemplates: CustomTemplateDefinition[];
2202
+ /**
2203
+ * Callback the host uses to persist a new doc-template list back
2204
+ * into the doc (e.g. by writing the encoded payload into the
2205
+ * markdown's `squisq-custom-templates` frontmatter key).
2206
+ */
2207
+ onDocTemplatesChange: (next: CustomTemplateDefinition[]) => void;
2208
+ children: ReactNode;
2209
+ }
2210
+ declare function CustomTemplateProvider({ docTemplates, onDocTemplatesChange, children, }: CustomTemplateProviderProps): react_jsx_runtime.JSX.Element;
2211
+ /**
2212
+ * Hook returning the current context. Returns null when no provider is
2213
+ * mounted — callers can degrade to "no custom templates" rather than
2214
+ * throwing, since the feature is optional.
2215
+ */
2216
+ declare function useCustomTemplates(): CustomTemplateContextValue | null;
2217
+
2218
+ /**
2219
+ * useDocCustomTemplates — read + persist the active doc's custom
2220
+ * templates (the list inlined into the doc's frontmatter under
2221
+ * `squisq-custom-templates`).
2222
+ *
2223
+ * Both the WYSIWYG editor and the standalone Custom Layout Manager need
2224
+ * the same two things: the current `Doc.customTemplates` array and a way
2225
+ * to write a new list back into the markdown source. Centralizing the
2226
+ * frontmatter encoding here keeps the two call sites from drifting.
2227
+ */
2228
+
2229
+ interface DocCustomTemplates {
2230
+ /** Custom templates inlined in the active doc's frontmatter. */
2231
+ docTemplates: CustomTemplateDefinition[];
2232
+ /**
2233
+ * Persist a new custom-templates list back into the markdown source's
2234
+ * frontmatter so the doc round-trips through save/load. The whole list
2235
+ * is encoded as a single base64-JSON string per the flat YAML
2236
+ * frontmatter parser's constraint.
2237
+ */
2238
+ onDocTemplatesChange: (next: CustomTemplateDefinition[]) => void;
2239
+ }
2240
+ declare function useDocCustomTemplates(): DocCustomTemplates;
2241
+
2242
+ /**
2243
+ * Read diagram nodes + edges from the live Tiptap state.
2244
+ *
2245
+ * For a given parent heading position, walks the diagram section's child
2246
+ * headings, builds synthetic `Block` objects from their text + Pandoc
2247
+ * attributes, runs `computeDiagramLayout` from core to fill in missing
2248
+ * positions, and returns the result in the shape React Flow consumes.
2249
+ *
2250
+ * The hook re-derives on every editor transaction — no caching layer
2251
+ * means there's nothing to invalidate when the user types or the markdown
2252
+ * is reloaded from disk.
2253
+ */
2254
+
2255
+ interface DiagramRFNode {
2256
+ id: string;
2257
+ position: {
2258
+ x: number;
2259
+ y: number;
2260
+ };
2261
+ data: {
2262
+ label: string;
2263
+ };
2264
+ type?: string;
2265
+ /** Per-node width override (from the heading's `w=` Pandoc param). */
2266
+ width?: number;
2267
+ /** Per-node height override (from the heading's `h=` Pandoc param). */
2268
+ height?: number;
2269
+ }
2270
+ interface DiagramRFEdge {
2271
+ id: string;
2272
+ source: string;
2273
+ target: string;
2274
+ label?: string;
2275
+ }
2276
+ interface DiagramData {
2277
+ nodes: DiagramRFNode[];
2278
+ edges: DiagramRFEdge[];
2279
+ warnings: string[];
2280
+ }
2281
+ declare function useDiagramData(editor: Editor$1, parentPos: number): DiagramData;
2282
+
1871
2283
  /**
1872
2284
  * Tiptap Bridge
1873
2285
  *
@@ -1955,47 +2367,6 @@ interface DiagramExtensionOptions {
1955
2367
  }
1956
2368
  declare const DiagramExtension: Extension<DiagramExtensionOptions, any>;
1957
2369
 
1958
- /**
1959
- * Read diagram nodes + edges from the live Tiptap state.
1960
- *
1961
- * For a given parent heading position, walks the diagram section's child
1962
- * headings, builds synthetic `Block` objects from their text + Pandoc
1963
- * attributes, runs `computeDiagramLayout` from core to fill in missing
1964
- * positions, and returns the result in the shape React Flow consumes.
1965
- *
1966
- * The hook re-derives on every editor transaction — no caching layer
1967
- * means there's nothing to invalidate when the user types or the markdown
1968
- * is reloaded from disk.
1969
- */
1970
-
1971
- interface DiagramRFNode {
1972
- id: string;
1973
- position: {
1974
- x: number;
1975
- y: number;
1976
- };
1977
- data: {
1978
- label: string;
1979
- };
1980
- type?: string;
1981
- /** Per-node width override (from the heading's `w=` Pandoc param). */
1982
- width?: number;
1983
- /** Per-node height override (from the heading's `h=` Pandoc param). */
1984
- height?: number;
1985
- }
1986
- interface DiagramRFEdge {
1987
- id: string;
1988
- source: string;
1989
- target: string;
1990
- label?: string;
1991
- }
1992
- interface DiagramData {
1993
- nodes: DiagramRFNode[];
1994
- edges: DiagramRFEdge[];
1995
- warnings: string[];
1996
- }
1997
- declare function useDiagramData(editor: Editor$1, parentPos: number): DiagramData;
1998
-
1999
2370
  type DiagramCommand = {
2000
2371
  kind: 'moveNode';
2001
2372
  nodeId: string;
@@ -2231,8 +2602,8 @@ type RecorderSource = 'mic' | 'camera' | 'screen' | 'screen+mic';
2231
2602
  /** Discriminated state describing what the recorder is currently doing. */
2232
2603
  type RecorderState = 'idle' | 'requesting' | 'ready' | 'recording' | 'stopping' | 'stopped' | 'error';
2233
2604
  interface UseMediaRecorderOptions {
2234
- /** Which capture pipeline to use. */
2235
- source: RecorderSource;
2605
+ /** Which capture pipeline to use (default: `'mic'`). */
2606
+ source?: RecorderSource;
2236
2607
  /**
2237
2608
  * Preferred MIME type override. When the browser supports it, this
2238
2609
  * wins over the default candidate list. When unset (or unsupported),
@@ -2309,7 +2680,7 @@ interface UseMediaRecorderResult {
2309
2680
  * (e.g. headless tests) can resolve a format up front.
2310
2681
  */
2311
2682
  declare function getCaptureKind(source: RecorderSource): CaptureKind;
2312
- declare function useMediaRecorder(options: UseMediaRecorderOptions): UseMediaRecorderResult;
2683
+ declare function useMediaRecorder(options?: UseMediaRecorderOptions): UseMediaRecorderResult;
2313
2684
 
2314
2685
  interface RecorderModalProps {
2315
2686
  /** Required — recordings are written here. */
@@ -2732,4 +3103,4 @@ interface UseImageEditorReturn {
2732
3103
  }
2733
3104
  declare function useImageEditor(options: UseImageEditorOptions): UseImageEditorReturn;
2734
3105
 
2735
- export { ALL_EMOJIS, BlockCardView, type BlockCardViewProps, type BlockNavigator, BlockPropertiesPopover, type BlockPropertiesPopoverProps, type BlockRange, type BlockSlice, type CameraStreamOptions, type CanvasRect, type CaptureKind, DiagramCanvas, type DiagramCommand, type DiagramData, DiagramExtension, type DiagramRFEdge, type DiagramRFNode, DiagramWidget, type DirectionModel, type DocumentLinkCandidate, type DocumentLinkProvider, DocumentSettingsDialog, type DocumentSettingsDialogProps, type DragContentType, type DropTarget, DropZoneOverlay, type DropZoneOverlayProps, EMOJI_CATEGORIES, EMPTY_TRANSITION, type EditorActions, type EditorContextValue, type EditorMode, EditorProvider, type EditorProviderProps, EditorShell, type EditorShellProps, type EditorState, type EditorTheme, type EditorView, type EmojiCategory, type EmojiEntry, EmojiPicker, type EmojiPickerProps, type FileCategory, type FileKind, type FolderEntry, FolderView, type FolderViewProps, HeadingWithTemplate, type ImageDisplayMode, ImageEditor, type ImageEditorAction, type ImageEditorProps, type ImageEditorState, type ImageEditorTool, ImageViewer, type ImageViewerProps, InlinePreviewGutter, type InlinePreviewGutterProps, JsonEditor, type JsonEditorProps, type LayoutMode, MediaBin, type MediaBinProps, type MediaClipPatch, type MentionCandidate, type MentionProvider, OutlinePanel, type OutlinePanelProps, PlainHtmlPreview, type PlainHtmlPreviewProps, PreviewPanel, type PreviewPanelProps, type PreviewSettings, PreviewSettingsProvider, PreviewToolbarControls, RawEditor, type RawEditorProps, type RecordedBookmark, RecorderButton, type RecorderButtonProps, RecorderModal, type RecorderModalProps, RecorderPanel, type RecorderPanelProps, type RecorderSaveResult, type RecorderSource, type RecorderState, type ResolvedFormat, type ScreenStreamHandle, type ScreenStreamOptions, StatusBar, type StatusBarProps, TRANSITION_ENTRIES, TRANSITION_GROUPS, TemplatePicker, ThemeCustomizerPanel, type ThemeCustomizerPanelProps, type ThemeInheritance, ThemePicker, type ThemePickerProps, TimelineTrack, type TimelineTrackProps, type TimingJson, Toolbar, type ToolbarProps, TooltipLayer, type TransitionCatalogEntry, type TransitionFields, type TransitionGroup, TransitionPicker, type TransitionPickerProps, type UseBlockNavigatorOptions, type UseFileDropOptions, type UseFileDropResult, type UseImageEditorOptions, type UseImageEditorReturn, type UseMediaRecorderOptions, type UseMediaRecorderResult, VersionHistoryPanel, ViewMenuPanel, type ViewPreferences, ViewSwitcher, type ViewSwitcherProps, WysiwygEditor, type WysiwygEditorProps, addConnection, addNode, buildFilename, buildPreviewDoc, buildTimingJson, classifyFile, detectLanguageFromFileName, encodeTimingJson, findTransitionEntry, formatSeconds, getBlockSlices, getCaptureKind, imageEditorReducer, initialImageEditorState, lineToOffset, listDiagramChildren, markdownToTiptap, moveNode, offsetToLine, partitionFiles, processMediaFiles, processTextFile, processTextFiles, readBlockAttrsParams, readBlockAttrsTransition, readBlockAttrsValue, readHeadingLineTransition, removeConnection, removeNode, renameNode, requestCameraStream, requestMicStream, requestScreenStream, resolveFileKind, resolveFormat, searchEmojis, setBlockAttrsTransition, setBlockAttrsValue, setBlockDurationInSource, setHeadingLineTransition, setMediaClipInSource, sliceIndexAtOffset, spliceBlock, summarizeBlockProps, supportsDisplayMedia, supportsMediaRecorder, supportsUserMedia, templateLabel, timingPathFor, tiptapToMarkdown, transitionLabel, useBlockNavigator, useDiagramData, useEditorContext, useFileDrop, useImageEditor, useMediaRecorder, usePreviewSettings, useStreamPreview };
3106
+ export { ALL_EMOJIS, BlockCardView, type BlockCardViewProps, type BlockNavigator, BlockPropertiesPopover, type BlockPropertiesPopoverProps, type BlockRange, type BlockSlice, type CameraStreamOptions, type CanvasRect, type CaptureKind, type CodeContext, type CodeContextSection, CodeContextZones, type CustomTemplateContextValue, CustomTemplateProvider, type CustomTemplateProviderProps, type CustomThemeContextValue, CustomThemeProvider, type CustomThemeProviderProps, DiagramCanvas, type DiagramCommand, type DiagramData, DiagramExtension, type DiagramRFEdge, type DiagramRFNode, DiagramWidget, type DirectionModel, type DocCustomTemplates, type DocCustomThemes, type DocumentLinkCandidate, type DocumentLinkProvider, DocumentSettingsDialog, type DocumentSettingsDialogProps, type DragContentType, type DropTarget, DropZoneOverlay, type DropZoneOverlayProps, EMOJI_CATEGORIES, EMPTY_TRANSITION, type EditorActions, type EditorColorScheme, type EditorContextValue, type EditorMode, EditorProvider, type EditorProviderProps, EditorShell, type EditorShellProps, type EditorState, type EditorView, type EmojiCategory, type EmojiEntry, EmojiPicker, type EmojiPickerProps, type FileCategory, type FileKind, type FolderEntry, FolderView, type FolderViewProps, type HeadingTransitionAttrs, HeadingWithTemplate, type ImageDisplayMode, ImageEditor, type ImageEditorAction, type ImageEditorProps, type ImageEditorState, type ImageEditorTool, ImageViewer, type ImageViewerProps, InlinePreviewGutter, type InlinePreviewGutterProps, JsonEditor, type JsonEditorProps, type LayoutMode, MediaBin, type MediaBinProps, type MediaClipPatch, type MentionCandidate, type MentionProvider, OutlinePanel, type OutlinePanelProps, PlainHtmlPreview, type PlainHtmlPreviewProps, PreviewFormatSwitch, PreviewModeSwitch, PreviewPanel, type PreviewPanelProps, type PreviewSettings, PreviewSettingsProvider, PreviewToolbarControls, RawEditor, type RawEditorProps, type RecordedBookmark, RecorderButton, type RecorderButtonProps, RecorderModal, type RecorderModalProps, RecorderPanel, type RecorderPanelProps, type RecorderSaveResult, type RecorderSource, type RecorderState, type ResolvedFormat, type ScreenStreamHandle, type ScreenStreamOptions, StatusBar, type StatusBarProps, TRANSITION_ENTRIES, TRANSITION_GROUPS, TemplatePicker, ThemeCustomizerPanel, type ThemeCustomizerPanelProps, type ThemeInheritance, ThemePicker, type ThemePickerProps, TimelineTrack, type TimelineTrackProps, type TimingJson, Toolbar, type ToolbarProps, TooltipLayer, type TransitionCatalogEntry, type TransitionFields, type TransitionGroup, TransitionPicker, type TransitionPickerProps, type UseBlockNavigatorOptions, type UseFileDropOptions, type UseFileDropResult, type UseImageEditorOptions, type UseImageEditorReturn, type UseMediaRecorderOptions, type UseMediaRecorderResult, type UseMonacoLoaderResult, VersionHistoryPanel, ViewMenuPanel, type ViewPreferences, ViewSwitcher, type ViewSwitcherProps, WysiwygEditor, type WysiwygEditorProps, addConnection, addNode, buildFilename, buildPreviewDoc, buildTimingJson, classifyFile, detectLanguageFromFileName, encodeTimingJson, findTransitionEntry, formatSeconds, getBlockSlices, getCaptureKind, imageEditorReducer, initialImageEditorState, lineToOffset, listDiagramChildren, markdownToTiptap, moveNode, offsetToLine, partitionFiles, processMediaFiles, processTextFile, processTextFiles, readBlockAttrsParams, readBlockAttrsTransition, readBlockAttrsValue, readHeadingLineTransition, removeConnection, removeNode, renameNode, requestCameraStream, requestMicStream, requestScreenStream, resolveFileKind, resolveFormat, searchEmojis, setBlockAttrsTransition, setBlockAttrsValue, setBlockDurationInSource, setHeadingAttrsTransition, setHeadingLineTransition, setMediaClipInSource, sliceIndexAtOffset, spliceBlock, summarizeBlockProps, supportsDisplayMedia, supportsMediaRecorder, supportsUserMedia, templateLabel, timingPathFor, tiptapToMarkdown, transitionLabel, useBlockNavigator, useCustomTemplates, useCustomThemes, useDiagramData, useDocCustomTemplates, useDocCustomThemes, useEditorContext, useFileDrop, useImageEditor, useMediaRecorder, useMonacoLoader, usePreviewSettings, useStreamPreview };