quoin-editor 1.5.0 → 1.6.0

package/dist/math.js

@@ -1,7 +1,7 @@
 'use client';
-export { englishMathLabels, mathExtension } from './chunk-HVT5HAAZ.js';
-import './chunk-AD3NY7NA.js';
+export { englishMathLabels, mathExtension } from './chunk-KFYJW7W5.js';
 import './chunk-QOIVLYMW.js';
+import './chunk-AD3NY7NA.js';
 import './chunk-32OZ2WM2.js';
 import './chunk-XFEDJEJF.js';
 import './chunk-HDJ653LM.js';

package/dist/mention.cjs

@@ -21,5 +21,3 @@ Object.defineProperty(exports, "mentionExtension", {
   enumerable: true,
   get: function () { return chunk46JH34SR_cjs.mentionExtension; }
 });
-//# sourceMappingURL=mention.cjs.map
-//# sourceMappingURL=mention.cjs.map

package/dist/presence.cjs

@@ -522,5 +522,3 @@ function presenceExtension(collaboration, options = {}) {
 
 exports.englishPresenceLabels = englishPresenceLabels;
 exports.presenceExtension = presenceExtension;
-//# sourceMappingURL=presence.cjs.map
-//# sourceMappingURL=presence.cjs.map

package/dist/prism-grammars.cjs

@@ -54,5 +54,3 @@ var tokenize = (code, grammar) => {
 };
 
 exports.tokenize = tokenize;
-//# sourceMappingURL=prism-grammars.cjs.map
-//# sourceMappingURL=prism-grammars.cjs.map

package/dist/source.cjs

@@ -0,0 +1,97 @@
+'use client';
+'use strict';
+
+require('./chunk-UUSZGUXJ.cjs');
+require('./chunk-QJ34MOFV.cjs');
+require('./chunk-A6PGQVTR.cjs');
+var chunkVZZPCYA3_cjs = require('./chunk-VZZPCYA3.cjs');
+require('./chunk-BM2GRZNM.cjs');
+require('./chunk-WZA5S5EJ.cjs');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/extensions/source/source-labels.ts
+var englishSourceLabels = { region: "Markdown source" };
+function resolveSourceLabels(overrides) {
+  if (overrides === void 0) return englishSourceLabels;
+  const given = Object.entries(overrides).filter(([, value]) => value !== void 0);
+  return given.length === 0 ? englishSourceLabels : { ...englishSourceLabels, ...Object.fromEntries(given) };
+}
+
+// src/extensions/source/source-lines.ts
+var lineCount = (text) => text.split("\n").length - 1;
+var withoutTrailingNewlines = (text) => text.replace(/\n+$/, "");
+function blockLines(blocks, index, options) {
+  if (!Number.isInteger(index) || index < 0 || index >= blocks.length) return null;
+  const before = withoutTrailingNewlines(chunkVZZPCYA3_cjs.toMarkdown(blocks.slice(0, index), options));
+  const through = chunkVZZPCYA3_cjs.toMarkdown(blocks.slice(0, index + 1), options);
+  const separator = /^\n*/.exec(through.slice(before.length))?.[0].length ?? 0;
+  return { from: lineCount(before) + separator, to: lineCount(withoutTrailingNewlines(through)) };
+}
+
+// src/extensions/source/use-editor-source.ts
+function sourceOf(editor, given) {
+  const blocks = editor.getBlocks();
+  const options = { ...given, schema: editor.state.schema };
+  const [id] = chunkVZZPCYA3_cjs.selectedBlockIds(editor.state.doc, editor.state.selection);
+  const index = id === void 0 ? -1 : blocks.findIndex((block) => block.id === id);
+  return { markdown: chunkVZZPCYA3_cjs.toMarkdown(blocks, options), active: blockLines(blocks, index, options) };
+}
+var sameSource = (a, b) => a.markdown === b.markdown && a.active?.from === b.active?.from && a.active?.to === b.active?.to;
+function useEditorSource(controller, options = {}) {
+  const { comments, lossless, resolveAssetUrl } = options;
+  const settings = react.useMemo(
+    () => ({ comments, lossless, resolveAssetUrl }),
+    [comments, lossless, resolveAssetUrl]
+  );
+  const [source, setSource] = react.useState(() => sourceOf(controller.editor, settings));
+  react.useEffect(() => {
+    const { editor } = controller;
+    let frame = 0;
+    const reread = () => {
+      frame = 0;
+      const next = sourceOf(editor, settings);
+      setSource((current) => sameSource(current, next) ? current : next);
+    };
+    reread();
+    const stop = editor.subscribe(() => {
+      if (frame === 0) frame = requestAnimationFrame(reread);
+    });
+    return () => {
+      stop();
+      cancelAnimationFrame(frame);
+    };
+  }, [controller, settings]);
+  return source;
+}
+function QuoinSource({ controller, options, labels: given, className, ...props }) {
+  const labels = react.useMemo(() => resolveSourceLabels(given), [given]);
+  const { markdown, active } = useEditorSource(controller, options);
+  const lines = react.useMemo(() => markdown === "" ? [] : markdown.replace(/\n$/, "").split("\n"), [markdown]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ...props,
+      role: "region",
+      "aria-label": labels.region,
+      tabIndex: 0,
+      className: className === void 0 ? "quoin-source" : `quoin-source ${className}`,
+      children: /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "quoin-source-text", children: lines.map((line, index) => /* @__PURE__ */ jsxRuntime.jsxs(react.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "data-quoin-source-line": index,
+            className: active && index >= active.from && index <= active.to ? "quoin-source-active" : void 0,
+            children: line
+          }
+        ),
+        "\n"
+      ] }, index)) })
+    }
+  );
+}
+
+exports.QuoinSource = QuoinSource;
+exports.blockLines = blockLines;
+exports.englishSourceLabels = englishSourceLabels;
+exports.useEditorSource = useEditorSource;

package/dist/source.d.cts

@@ -0,0 +1,56 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { ViewController } from './headless.cjs';
+import { ToMarkdownOptions } from './engine.cjs';
+import { QuoinBlock } from './engine.cjs';
+import './types-DXF9p4qV.cjs';
+
+/** Every string the markdown source pane shows or speaks. */
+type SourceLabels = {
+    /** The accessible name of the pane. */
+    region: string;
+};
+declare const englishSourceLabels: SourceLabels;
+
+/** The lines of the document's markdown a block is drawn on, both ends counted from zero and both inside the block. */
+type LineSpan = {
+    readonly from: number;
+    readonly to: number;
+};
+/**
+ * Where a block lands in the markdown of the whole document, read from the length of the document's prefixes: the
+ * markdown of the blocks before it is a prefix of the whole, so the lines it adds are the block's own, less the blank
+ * lines that separate it from the block above. Blocks are not serialised one by one, because a list item reads the
+ * items above it and so spells itself differently alone.
+ */
+declare function blockLines(blocks: readonly QuoinBlock[], index: number, options?: ToMarkdownOptions): LineSpan | null;
+
+/** The document as markdown, and the lines of it the caret's block is drawn on. */
+type EditorSource = {
+    readonly markdown: string;
+    readonly active: LineSpan | null;
+};
+/** How the pane writes the markdown. Pass what the canvas was given, so the pane reads as the document is stored. */
+type SourceOptions = Pick<ToMarkdownOptions, 'comments' | 'lossless' | 'resolveAssetUrl'>;
+/**
+ * The markdown of the document of `controller`, the one a canvas handle or `useViewController()` gives, as `onChange`
+ * would hand it back, with the lines the caret's block is drawn on. Read again at most once per animation frame
+ * however many edits or caret moves it holds.
+ */
+declare function useEditorSource(controller: ViewController, options?: SourceOptions): EditorSource;
+
+type QuoinSourceProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {
+    controller: ViewController;
+    /** How the markdown is written. Pass what the canvas was given, so the pane reads as the document is stored. */
+    options?: SourceOptions;
+    /** Every string the pane shows or speaks, English by default. A key left out stays English. */
+    labels?: Partial<SourceLabels>;
+};
+/**
+ * The document of `controller` as the markdown it is stored as, read only, with the block holding the caret marked.
+ * Place it beside or below the canvas; the controller is the one a `BlockCanvas` handle gives.
+ */
+declare function QuoinSource({ controller, options, labels: given, className, ...props }: QuoinSourceProps): react.JSX.Element;
+
+export { QuoinSource, blockLines, englishSourceLabels, useEditorSource };
+export type { EditorSource, LineSpan, QuoinSourceProps, SourceLabels };

package/dist/source.d.ts

@@ -0,0 +1,56 @@
+import * as react from 'react';
+import { ComponentPropsWithoutRef } from 'react';
+import { ViewController } from './headless.js';
+import { ToMarkdownOptions } from './engine.js';
+import { QuoinBlock } from './engine.js';
+import './types-BjLcmV00.js';
+
+/** Every string the markdown source pane shows or speaks. */
+type SourceLabels = {
+    /** The accessible name of the pane. */
+    region: string;
+};
+declare const englishSourceLabels: SourceLabels;
+
+/** The lines of the document's markdown a block is drawn on, both ends counted from zero and both inside the block. */
+type LineSpan = {
+    readonly from: number;
+    readonly to: number;
+};
+/**
+ * Where a block lands in the markdown of the whole document, read from the length of the document's prefixes: the
+ * markdown of the blocks before it is a prefix of the whole, so the lines it adds are the block's own, less the blank
+ * lines that separate it from the block above. Blocks are not serialised one by one, because a list item reads the
+ * items above it and so spells itself differently alone.
+ */
+declare function blockLines(blocks: readonly QuoinBlock[], index: number, options?: ToMarkdownOptions): LineSpan | null;
+
+/** The document as markdown, and the lines of it the caret's block is drawn on. */
+type EditorSource = {
+    readonly markdown: string;
+    readonly active: LineSpan | null;
+};
+/** How the pane writes the markdown. Pass what the canvas was given, so the pane reads as the document is stored. */
+type SourceOptions = Pick<ToMarkdownOptions, 'comments' | 'lossless' | 'resolveAssetUrl'>;
+/**
+ * The markdown of the document of `controller`, the one a canvas handle or `useViewController()` gives, as `onChange`
+ * would hand it back, with the lines the caret's block is drawn on. Read again at most once per animation frame
+ * however many edits or caret moves it holds.
+ */
+declare function useEditorSource(controller: ViewController, options?: SourceOptions): EditorSource;
+
+type QuoinSourceProps = Omit<ComponentPropsWithoutRef<'div'>, 'children'> & {
+    controller: ViewController;
+    /** How the markdown is written. Pass what the canvas was given, so the pane reads as the document is stored. */
+    options?: SourceOptions;
+    /** Every string the pane shows or speaks, English by default. A key left out stays English. */
+    labels?: Partial<SourceLabels>;
+};
+/**
+ * The document of `controller` as the markdown it is stored as, read only, with the block holding the caret marked.
+ * Place it beside or below the canvas; the controller is the one a `BlockCanvas` handle gives.
+ */
+declare function QuoinSource({ controller, options, labels: given, className, ...props }: QuoinSourceProps): react.JSX.Element;
+
+export { QuoinSource, blockLines, englishSourceLabels, useEditorSource };
+export type { EditorSource, LineSpan, QuoinSourceProps, SourceLabels };

package/dist/source.js

@@ -0,0 +1,94 @@
+'use client';
+import './chunk-32OZ2WM2.js';
+import './chunk-XFEDJEJF.js';
+import './chunk-HDJ653LM.js';
+import { toMarkdown, selectedBlockIds } from './chunk-OS2O6IKX.js';
+import './chunk-CSKKSXCE.js';
+import './chunk-BJTOLCRR.js';
+import { useMemo, useState, useEffect, Fragment } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+// src/extensions/source/source-labels.ts
+var englishSourceLabels = { region: "Markdown source" };
+function resolveSourceLabels(overrides) {
+  if (overrides === void 0) return englishSourceLabels;
+  const given = Object.entries(overrides).filter(([, value]) => value !== void 0);
+  return given.length === 0 ? englishSourceLabels : { ...englishSourceLabels, ...Object.fromEntries(given) };
+}
+
+// src/extensions/source/source-lines.ts
+var lineCount = (text) => text.split("\n").length - 1;
+var withoutTrailingNewlines = (text) => text.replace(/\n+$/, "");
+function blockLines(blocks, index, options) {
+  if (!Number.isInteger(index) || index < 0 || index >= blocks.length) return null;
+  const before = withoutTrailingNewlines(toMarkdown(blocks.slice(0, index), options));
+  const through = toMarkdown(blocks.slice(0, index + 1), options);
+  const separator = /^\n*/.exec(through.slice(before.length))?.[0].length ?? 0;
+  return { from: lineCount(before) + separator, to: lineCount(withoutTrailingNewlines(through)) };
+}
+
+// src/extensions/source/use-editor-source.ts
+function sourceOf(editor, given) {
+  const blocks = editor.getBlocks();
+  const options = { ...given, schema: editor.state.schema };
+  const [id] = selectedBlockIds(editor.state.doc, editor.state.selection);
+  const index = id === void 0 ? -1 : blocks.findIndex((block) => block.id === id);
+  return { markdown: toMarkdown(blocks, options), active: blockLines(blocks, index, options) };
+}
+var sameSource = (a, b) => a.markdown === b.markdown && a.active?.from === b.active?.from && a.active?.to === b.active?.to;
+function useEditorSource(controller, options = {}) {
+  const { comments, lossless, resolveAssetUrl } = options;
+  const settings = useMemo(
+    () => ({ comments, lossless, resolveAssetUrl }),
+    [comments, lossless, resolveAssetUrl]
+  );
+  const [source, setSource] = useState(() => sourceOf(controller.editor, settings));
+  useEffect(() => {
+    const { editor } = controller;
+    let frame = 0;
+    const reread = () => {
+      frame = 0;
+      const next = sourceOf(editor, settings);
+      setSource((current) => sameSource(current, next) ? current : next);
+    };
+    reread();
+    const stop = editor.subscribe(() => {
+      if (frame === 0) frame = requestAnimationFrame(reread);
+    });
+    return () => {
+      stop();
+      cancelAnimationFrame(frame);
+    };
+  }, [controller, settings]);
+  return source;
+}
+function QuoinSource({ controller, options, labels: given, className, ...props }) {
+  const labels = useMemo(() => resolveSourceLabels(given), [given]);
+  const { markdown, active } = useEditorSource(controller, options);
+  const lines = useMemo(() => markdown === "" ? [] : markdown.replace(/\n$/, "").split("\n"), [markdown]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ...props,
+      role: "region",
+      "aria-label": labels.region,
+      tabIndex: 0,
+      className: className === void 0 ? "quoin-source" : `quoin-source ${className}`,
+      children: /* @__PURE__ */ jsx("pre", { className: "quoin-source-text", children: lines.map((line, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            "data-quoin-source-line": index,
+            className: active && index >= active.from && index <= active.to ? "quoin-source-active" : void 0,
+            children: line
+          }
+        ),
+        "\n"
+      ] }, index)) })
+    }
+  );
+}
+
+export { QuoinSource, blockLines, englishSourceLabels, useEditorSource };
+//# sourceMappingURL=source.js.map
+//# sourceMappingURL=source.js.map

package/dist/source.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/extensions/source/source-labels.ts","../src/extensions/source/source-lines.ts","../src/extensions/source/use-editor-source.ts","../src/extensions/source/QuoinSource.tsx"],"names":["useMemo"],"mappings":"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","file":"source.js"}

package/dist/stats.cjs

@@ -24,5 +24,3 @@ Object.defineProperty(exports, "useEditorStats", {
   enumerable: true,
   get: function () { return chunkSTKGRXSA_cjs.useEditorStats; }
 });
-//# sourceMappingURL=stats.cjs.map
-//# sourceMappingURL=stats.cjs.map