@bendyline/squisq-editor-react 2.11.0 → 2.11.1

package/dist/{chunk-TCLNRATG.js → chunk-A2W4GYPG.js}

@@ -15,6 +15,8 @@ var RE_LEGACY_ITALIC_STAR = /(?<!\*)\*(?![\s*])(.+?)(?<![\s*])([ \t]+)\*(?=$|[^\
 var ESCAPABLE_MD_CHARS = ["*", "_", "~", "\\"];
 var RE_MD_ESCAPE = /\\([*_~\\])/g;
 var RE_INLINE_CODE = /`(.+?)`/g;
+var BACKTICK = "`";
+var FENCE = "```";
 var RE_IMAGE = /!\[(.*?)\]\((.+?)\)/g;
 var RE_MENTION = /@\[([^\]]+?)\]\(([a-z][a-z0-9+.-]*)\\?:([^)\s]+)\)/gi;
 var RE_MENTION_TAG = /<span\b[^>]*?\bdata-mention\b[^>]*?>(?:<[^>]+>)*([^<]*)<\/span>/gi;
@@ -26,10 +28,50 @@ var RE_VERT_ALIGN_TAG = /<(sup|sub)>((?:(?!<\/?(?:sup|sub)>)[\s\S])*)<\/\1>/gi;
 var RE_A_TAG = /<a\b([^>]*)>(.*?)<\/a>/g;
 var RE_IMG_TAG = /<img\b([^>]*)>/g;
 var RE_STRIP_TAGS = /<[^>]+>/g;
+function joinWrappedCodeSpans(lines) {
+  if (!lines.some((line) => line.includes(BACKTICK))) return lines;
+  const joined = [];
+  let inFence = false;
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    if (line.startsWith(FENCE)) {
+      inFence = !inFence;
+      joined.push(line);
+      continue;
+    }
+    if (inFence || !leavesCodeSpanOpen(line)) {
+      joined.push(line);
+      continue;
+    }
+    let merged = line;
+    let next = i + 1;
+    let closed = false;
+    while (next < lines.length) {
+      const candidate = lines[next];
+      if (candidate.trim() === "" || candidate.startsWith(FENCE)) break;
+      merged = `${merged} ${candidate.replace(/^[ \t]+/, "")}`;
+      next++;
+      if (!leavesCodeSpanOpen(merged)) {
+        closed = true;
+        break;
+      }
+    }
+    if (!closed) {
+      joined.push(line);
+      continue;
+    }
+    joined.push(merged);
+    i = next - 1;
+  }
+  return joined;
+}
+function leavesCodeSpanOpen(text) {
+  return text.replace(RE_INLINE_CODE, "").includes(BACKTICK);
+}
 function markdownToTiptap(markdown) {
   if (!markdown.trim()) return "<p></p>";
   const html = markdown.replace(/\r\n/g, "\n").replace(/\r/g, "\n");
-  const lines = html.split("\n");
+  const lines = joinWrappedCodeSpans(html.split("\n"));
   const frontmatterEnd = findFrontmatterEnd(lines);
   const outputBlocks = [];
   let inCodeBlock = false;
@@ -403,7 +445,7 @@ function tiptapToMarkdown(html) {
         while ((cellExec = cellRegex.exec(rowHtml)) !== null) {
           const tag = cellExec[1];
           const attrs = cellExec[2];
-          const content = htmlToInline(cellExec[3].replace(/<\/?p>/g, ""));
+          const content = htmlToTableCell(cellExec[3].replace(/<\/?p>/g, ""));
           const alignExec = attrs.match(/text-align:\s*(left|center|right)/);
           cells.push({
             content,
@@ -789,6 +831,7 @@ function inlineToHtml(text) {
     const name = tag.toLowerCase();
     return stash(`<${name}>${inlineToHtml(inner)}</${name}>`);
   });
+  staged = staged.replace(/<br\s*\/?>/gi, () => stash("<br>"));
   staged = staged.replace(
     RE_IMAGE,
     (_m, alt, src) => stash(`<img alt="${escapeHtml(alt)}" src="${escapeHtml(src)}">`)
@@ -1031,6 +1074,9 @@ function htmlToInline(html) {
   result = vault.restore(result);
   return restoreLeadingSpaces(unescapeHtml(result));
 }
+function htmlToTableCell(html) {
+  return htmlToInline(html).replace(/ {2}\n/g, "<br>");
+}
 function preserveLeadingSpaces(html) {
   return html.replace(/^ +/, (spaces) => "&nbsp;".repeat(spaces.length));
 }

package/dist/{chunk-JYPLPGYJ.js → chunk-SK3MQSHQ.js}

@@ -1,7 +1,7 @@
 import {
   markdownToTiptap,
   tiptapToMarkdown
-} from "./chunk-TCLNRATG.js";
+} from "./chunk-A2W4GYPG.js";
 
 // src/jsonEditor/JsonEditorContext.tsx
 import { createContext, useContext, useEffect, useMemo } from "react";

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { C as CodeContext, E as EditorHostMode, S as SceneTextChannel, a as CalcEngineFactory, b as CsvSourceMeta, X as XlsxSourceMeta, F as FormulaEditRecord } from './shell-DInMVUpf.js';
-export { B as BlockTagVisibility, c as CodeContextSection, d as CoverImageSaveOutput, D as DashboardImageSaveOutput, e as DocumentLinkCandidate, f as DocumentLinkProvider, g as EditorActions, h as EditorColorScheme, i as EditorContextMenuContext, j as EditorContextMenuItem, k as EditorContextMenuItemVisibility, l as EditorContextMenuProvider, m as EditorContextMenuProviderProps, n as EditorContextValue, o as EditorMode, p as EditorProvider, q as EditorProviderProps, r as EditorShell, s as EditorShellProps, t as EditorState, u as EditorView, v as FormulaSessionOptions, I as ImageDisplayMode, w as IngestedSidecar, L as LayoutMode, M as MentionCandidate, x as MentionProvider, P as PreviewPanel, y as PreviewPanelProps, R as RawEditor, z as RawEditorProps, T as ThemeInheritance, V as ViewPreferences, W as WriteCanvasSettings, A as WysiwygEditor, G as WysiwygEditorProps, H as XLSX_LOCKED_REASON, J as XlsxFormulaSession, K as createXlsxFormulaSession, N as ingestSidecarBytes, O as useEditorContext, Q as useEditorContextMenuItems } from './shell-DInMVUpf.js';
+import { C as CodeContext, E as EditorHostMode, S as SceneTextChannel, a as CalcEngineFactory, b as CsvSourceMeta, X as XlsxSourceMeta, F as FormulaEditRecord } from './shell-CJkHDwpz.js';
+export { B as BlockTagVisibility, c as CodeContextSection, d as CoverImageSaveOutput, D as DashboardImageSaveOutput, e as DocumentLinkCandidate, f as DocumentLinkProvider, g as EditorActions, h as EditorColorScheme, i as EditorContextMenuContext, j as EditorContextMenuItem, k as EditorContextMenuItemVisibility, l as EditorContextMenuProvider, m as EditorContextMenuProviderProps, n as EditorContextValue, o as EditorMode, p as EditorProvider, q as EditorProviderProps, r as EditorShell, s as EditorShellProps, t as EditorState, u as EditorView, v as FormulaSessionOptions, I as ImageDisplayMode, w as IngestedSidecar, L as LayoutMode, M as MentionCandidate, x as MentionProvider, P as PreviewPanel, y as PreviewPanelProps, R as RawEditor, z as RawEditorProps, T as ThemeInheritance, V as ViewPreferences, W as WriteCanvasSettings, A as WysiwygEditor, G as WysiwygEditorProps, H as XLSX_LOCKED_REASON, J as XlsxFormulaSession, K as createXlsxFormulaSession, N as ingestSidecarBytes, O as useEditorContext, Q as useEditorContextMenuItems } from './shell-CJkHDwpz.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, CSSProperties, ReactElement } from 'react';
@@ -2587,6 +2587,13 @@ interface CodeSnippetExtensionOptions {
      * change freely behind the host extension's getter.
      */
     reservedLanguages?: readonly string[];
+    /**
+     * Getter for the host clipboard adapter used by each snippet's Copy
+     * button. A getter (not the handler itself) so a host can swap its
+     * clipboard implementation without re-configuring the editor — the
+     * same live-behind-a-getter contract `renderers` uses.
+     */
+    onCopyCode?: () => CodeBlockCopyHandler | undefined;
 }
 declare const CODE_SNIPPET_KEY: PluginKey<CodeSnippetPluginState>;
 declare function isCodeSnippetNode(node: Node, reserved?: ReadonlySet<string>): boolean;
@@ -2599,8 +2606,14 @@ interface CodeSnippetWidgetProps {
     host?: HTMLElement | null;
     /** Focus this newly inserted snippet after Monaco has mounted. */
     focusOnMount?: boolean;
+    /**
+     * Getter for the host clipboard adapter. Read at click time so a host can
+     * swap its implementation without remounting the widget. When it yields
+     * nothing, the button falls back to `navigator.clipboard`.
+     */
+    onCopyCode?: () => CodeBlockCopyHandler | undefined;
 }
-declare function CodeSnippetWidget({ editor, blockId, host, focusOnMount, }: CodeSnippetWidgetProps): react_jsx_runtime.JSX.Element | null;
+declare function CodeSnippetWidget({ editor, blockId, host, focusOnMount, onCopyCode, }: CodeSnippetWidgetProps): react_jsx_runtime.JSX.Element | null;
 
 /** Lossless edits for language-tagged code fences. */
 

package/dist/index.js

@@ -229,15 +229,15 @@ import {
   useTreeViewData,
   viewStateFromBinding,
   writeHeadingViewState
-} from "./chunk-FT5F2EGI.js";
+} from "./chunk-4KE4HP3W.js";
 import "./chunk-V4NBQF5C.js";
 import {
   JsonEditor
-} from "./chunk-JYPLPGYJ.js";
+} from "./chunk-SK3MQSHQ.js";
 import {
   markdownToTiptap,
   tiptapToMarkdown
-} from "./chunk-TCLNRATG.js";
+} from "./chunk-A2W4GYPG.js";
 import {
   ImageEditor,
   ImageViewer,

package/dist/json-editor/index.js

@@ -1,7 +1,7 @@
 import {
   JsonEditor
-} from "../chunk-JYPLPGYJ.js";
-import "../chunk-TCLNRATG.js";
+} from "../chunk-SK3MQSHQ.js";
+import "../chunk-A2W4GYPG.js";
 export {
   JsonEditor
 };

package/dist/shell/index.d.ts

@@ -1,4 +1,4 @@
-export { B as BlockTagVisibility, e as DocumentLinkCandidate, f as DocumentLinkProvider, g as EditorActions, h as EditorColorScheme, i as EditorContextMenuContext, j as EditorContextMenuItem, k as EditorContextMenuItemVisibility, l as EditorContextMenuProvider, m as EditorContextMenuProviderProps, n as EditorContextValue, E as EditorHostMode, o as EditorMode, p as EditorProvider, q as EditorProviderProps, r as EditorShell, s as EditorShellProps, t as EditorState, u as EditorView, I as ImageDisplayMode, L as LayoutMode, M as MentionCandidate, x as MentionProvider, P as PreviewPanel, y as PreviewPanelProps, R as RawEditor, z as RawEditorProps, T as ThemeInheritance, V as ViewPreferences, A as WysiwygEditor, G as WysiwygEditorProps, O as useEditorContext, Q as useEditorContextMenuItems } from '../shell-DInMVUpf.js';
+export { B as BlockTagVisibility, e as DocumentLinkCandidate, f as DocumentLinkProvider, g as EditorActions, h as EditorColorScheme, i as EditorContextMenuContext, j as EditorContextMenuItem, k as EditorContextMenuItemVisibility, l as EditorContextMenuProvider, m as EditorContextMenuProviderProps, n as EditorContextValue, E as EditorHostMode, o as EditorMode, p as EditorProvider, q as EditorProviderProps, r as EditorShell, s as EditorShellProps, t as EditorState, u as EditorView, I as ImageDisplayMode, L as LayoutMode, M as MentionCandidate, x as MentionProvider, P as PreviewPanel, y as PreviewPanelProps, R as RawEditor, z as RawEditorProps, T as ThemeInheritance, V as ViewPreferences, A as WysiwygEditor, G as WysiwygEditorProps, O as useEditorContext, Q as useEditorContextMenuItems } from '../shell-CJkHDwpz.js';
 import 'react/jsx-runtime';
 import '@bendyline/squisq/table';
 import '@bendyline/squisq-calc';
@@ -7,6 +7,7 @@ import '@bendyline/squisq-formats/xlsx';
 import 'react';
 import '@bendyline/squisq/schemas';
 import '@bendyline/squisq/fence';
+import '@bendyline/squisq-react';
 import '@bendyline/squisq/markdown';
 import '@bendyline/squisq/storage';
 import '../types-B_aHRuSc.js';
@@ -14,4 +15,3 @@ import '@bendyline/squisq/proof';
 import '@bendyline/squisq/versions';
 import '@tiptap/core';
 import 'monaco-editor';
-import '@bendyline/squisq-react';

package/dist/shell/index.js

@@ -7,9 +7,9 @@ import {
   WysiwygEditor,
   useEditorContext,
   useEditorContextMenuItems
-} from "../chunk-FT5F2EGI.js";
+} from "../chunk-4KE4HP3W.js";
 import "../chunk-V4NBQF5C.js";
-import "../chunk-TCLNRATG.js";
+import "../chunk-A2W4GYPG.js";
 import "../chunk-V44VP242.js";
 import "../chunk-7RRYZULY.js";
 import "../chunk-GS7QWYFT.js";

package/dist/{shell-DInMVUpf.d.ts → shell-CJkHDwpz.d.ts}

@@ -6,13 +6,13 @@ import { XlsxWorkbookGrids } from '@bendyline/squisq-formats/xlsx';
 import { ReactNode, RefObject, ReactElement } from 'react';
 import { Doc, MediaProvider, ViewportPreset, Theme } from '@bendyline/squisq/schemas';
 import { FenceRendererMap } from '@bendyline/squisq/fence';
+import { CodeBlockCopyHandler } from '@bendyline/squisq-react';
 import { MarkdownDocument } from '@bendyline/squisq/markdown';
 import { ContentContainer } from '@bendyline/squisq/storage';
 import { P as ProofingCapability, b as ProofingIgnoreStore } from './types-B_aHRuSc.js';
 import { DocumentVersionManager, SaveVersionOptions, SaveVersionResult, PrunePolicy } from '@bendyline/squisq/versions';
 import { Editor } from '@tiptap/core';
 import { editor } from 'monaco-editor';
-import { CodeBlockCopyHandler } from '@bendyline/squisq-react';
 
 /**
  * Sidecar bytes → the grid's neutral `IngestTable`, via lazy formats
@@ -550,6 +550,13 @@ interface EditorContextValue extends EditorState, EditorActions {
      * flow into the preview panel's read path. Null disables.
      */
     fenceRenderers: FenceRendererMap | null;
+    /**
+     * Host clipboard adapter for code copy affordances. When omitted, the
+     * copy button on a Write-view code snippet falls back to
+     * `navigator.clipboard.writeText`. Supply this for Electron, native
+     * shells, or hosts with their own clipboard permission handling.
+     */
+    onCopyCode: CodeBlockCopyHandler | undefined;
     /**
      * File name the host opened this document as (e.g. `Longview Plan.md`), if
      * any. Used as a display-title fallback — for example, the header of a
@@ -643,6 +650,11 @@ interface EditorProviderProps {
      * leave every explicit-language fence to the built-in families.
      */
     fenceRenderers?: FenceRendererMap | null;
+    /**
+     * Host clipboard adapter shared by every code copy affordance. Omit to
+     * use `navigator.clipboard`.
+     */
+    onCopyCode?: CodeBlockCopyHandler;
     /**
      * Extra link schemes this host resolves itself. Threaded into the link
      * dialog's `sanitizeUrl` check so a host-custom protocol is accepted;
@@ -765,7 +777,7 @@ interface ViewPreferences {
     /** Document vs. block-at-a-time layout. */
     layoutMode?: LayoutMode;
 }
-declare function EditorProvider({ initialMarkdown, initialView, articleId, colorScheme: initialColorScheme, workspaceContainer, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, mediaProvider, imageDisplayMode, mentionProvider, proofing, proofingDefaultEnabled, proofingSpellingEnabled, proofingGrammarEnabled, proofingIgnoreStore, documentLinkProvider, fenceRenderers, linkSchemes, allowRecording, allowNarrate, preserveSourceWrapping, fileName, saveCoverImageOutput, saveDashboardImageOutput, language, findMode: controlledFindMode, onFindModeChange, inlinePreview, showStatusBar, outline, blockTags, blockTagVisibility: initialBlockTagVisibility, themeInheritance, layoutMode, viewPreferences, onViewPreferencesChange, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
+declare function EditorProvider({ initialMarkdown, initialView, articleId, colorScheme: initialColorScheme, workspaceContainer, allowVersioning, versionBasename, versioningPrunePolicy, versioningAutoSaveIdleMs, onSaveVersion, mediaProvider, imageDisplayMode, mentionProvider, proofing, proofingDefaultEnabled, proofingSpellingEnabled, proofingGrammarEnabled, proofingIgnoreStore, documentLinkProvider, fenceRenderers, onCopyCode, linkSchemes, allowRecording, allowNarrate, preserveSourceWrapping, fileName, saveCoverImageOutput, saveDashboardImageOutput, language, findMode: controlledFindMode, onFindModeChange, inlinePreview, showStatusBar, outline, blockTags, blockTagVisibility: initialBlockTagVisibility, themeInheritance, layoutMode, viewPreferences, onViewPreferencesChange, children, }: EditorProviderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Host-supplied context sections rendered INSIDE the Monaco (raw/code)

package/dist/styles/index.css

@@ -9278,28 +9278,28 @@
 }
 .squisq-wysiwyg-editor h1 {
   font-size: 2em;
-  margin: 0.45em 0 0.4em;
+  margin: calc(0.45em + 4px) 0 calc(0.4em - 2px);
 }
 .squisq-wysiwyg-editor h2 {
   font-size: 1.5em;
-  margin: 0.8em 0 0.25em;
+  margin: calc(0.8em + 4px) 0 0.25em;
 }
 .squisq-wysiwyg-editor h3 {
   font-size: 1.17em;
   min-height: 26px;
-  margin: 1.3em 0 0.3em;
+  margin: calc(1.3em + 4px) 0 0.3em;
 }
 .squisq-wysiwyg-editor h4 {
   font-size: 1em;
-  margin: 1.4em 0 0.3em;
+  margin: calc(1.4em + 4px) 0 0.3em;
 }
 .squisq-wysiwyg-editor h5 {
   font-size: 0.83em;
-  margin: 1.5em 0 0.3em;
+  margin: calc(1.5em + 4px) 0 0.3em;
 }
 .squisq-wysiwyg-editor h6 {
   font-size: 0.67em;
-  margin: 1.6em 0 0.3em;
+  margin: calc(1.6em + 4px) 0 0.3em;
 }
 .squisq-heading-content:has(> br.ProseMirror-trailingBreak:only-child) {
   display: inline-block;
@@ -9311,6 +9311,9 @@
   margin: 0.625em 0;
   line-height: var(--squisq-write-line-spacing, 1.7);
 }
+.squisq-wysiwyg-editor :is(h1, h2, h3, h4, h5, h6) + p {
+  margin-top: calc(0.625em - 2px);
+}
 .squisq-wysiwyg-editor blockquote {
   border-left: 3px solid var(--squisq-theme-text-muted, var(--squisq-border));
   padding-left: 16px;
@@ -9402,12 +9405,14 @@
   border-collapse: collapse;
   margin: 1em 0;
   width: 100%;
+  table-layout: fixed;
 }
 .squisq-wysiwyg-editor th,
 .squisq-wysiwyg-editor td {
   border: 1px solid var(--squisq-border);
   padding: 6px 12px;
   text-align: left;
+  overflow-wrap: break-word;
 }
 .squisq-wysiwyg-editor th {
   background: var(--squisq-surface-subtle);
@@ -16280,6 +16285,53 @@
   color: var(--squisq-text);
   font-weight: 600;
 }
+.squisq-code-snippet-copy {
+  display: inline-flex;
+  flex: none;
+  align-items: center;
+  gap: 5px;
+  margin-left: auto;
+  padding: 2px 8px;
+  border: 1px solid transparent;
+  border-radius: 5px;
+  background: transparent;
+  color: var(--squisq-text-muted);
+  font: inherit;
+  line-height: 1.6;
+  cursor: pointer;
+  transition:
+    background 120ms ease,
+    color 120ms ease,
+    opacity 120ms ease;
+}
+.squisq-code-snippet-copy[data-copy-state=idle] {
+  opacity: 0;
+}
+.squisq-code-snippet-shell:hover .squisq-code-snippet-copy[data-copy-state=idle],
+.squisq-code-snippet-shell:focus-within .squisq-code-snippet-copy[data-copy-state=idle] {
+  opacity: 1;
+}
+@media (hover: none) {
+  .squisq-code-snippet-copy[data-copy-state=idle] {
+    opacity: 1;
+  }
+}
+.squisq-code-snippet-copy:hover {
+  border-color: var(--squisq-border);
+  background: var(--squisq-surface-hover);
+  color: var(--squisq-text);
+}
+.squisq-code-snippet-copy:focus-visible {
+  opacity: 1;
+  outline: 2px solid var(--squisq-accent);
+  outline-offset: 1px;
+}
+.squisq-code-snippet-copy[data-copy-state=copied] {
+  color: var(--squisq-success);
+}
+.squisq-code-snippet-copy[data-copy-state=failed] {
+  color: var(--squisq-danger-strong);
+}
 .squisq-code-snippet-editor {
   position: relative;
   min-height: 0;
@@ -17950,7 +18002,7 @@ button.squisq-ascii-timeline-track-name:focus-visible {
 }
 .squisq-scene-dot {
   fill: var(--squisq-text-muted);
-  fill-opacity: 0.35;
+  fill-opacity: 0.22;
 }
 .squisq-scene-selection-outline {
   fill: none;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bendyline/squisq-editor-react",
-  "version": "2.11.0",
+  "version": "2.11.1",
   "description": "React editor shell with raw/WYSIWYG/preview modes for Squisq documents",
   "license": "MIT",
   "author": "Bendyline",
@@ -94,12 +94,12 @@
     }
   },
   "dependencies": {
-    "@bendyline/squisq": "2.11.0",
+    "@bendyline/squisq": "2.11.1",
     "@bendyline/squisq-calc": "2.11.0",
-    "@bendyline/squisq-formats": "2.6.0",
-    "@bendyline/squisq-grid-react": "2.11.1",
-    "@bendyline/squisq-react": "2.11.0",
-    "@bendyline/squisq-video-react": "2.4.4",
+    "@bendyline/squisq-formats": "2.6.1",
+    "@bendyline/squisq-grid-react": "2.11.2",
+    "@bendyline/squisq-react": "2.11.1",
+    "@bendyline/squisq-video-react": "2.4.5",
     "@fortawesome/fontawesome-free": "7.2.0",
     "@tiptap/core": "2.27.2",
     "@tiptap/extension-heading": "2.27.2",