@openpresentation/opf-editor 0.24.0 → 0.24.2

package/dist/source-lines.js

@@ -0,0 +1,206 @@
+import { parseTree } from "jsonc-parser";
+
+// Line lookup for a JSON Pointer in the three source formats of the source pane (RR-98). All functions return a
+// one-based line number, or null when the path cannot be placed. JSON is exact; YAML and Markdown are best effort:
+// they follow the shape `toYaml` and `toMarkdown` write (block style, one heading per slide) and fall back to the
+// deepest place they could find.
+
+/** Split a JSON Pointer ("/slides/0/title") or a dotted OPF path ("slides.0.title") into segments. */
+export function pathSegments(path) {
+  if (Array.isArray(path)) return path.map(String);
+  if (path === undefined || path === null || path === "" || path === "/") return [];
+  const text = String(path);
+  const parts = text.startsWith("/") ? text.slice(1).split("/") : text.split(".");
+  return parts.map((part) => part.replaceAll("~1", "/").replaceAll("~0", "~"));
+}
+
+/** The one-based line that holds a zero-based character offset. */
+export function lineOfOffset(text, offset) {
+  let line = 1;
+  const end = Math.min(offset, text.length);
+  for (let i = 0; i < end; i++) {
+    const code = text.charCodeAt(i);
+    if (code === 10 || (code === 13 && text.charCodeAt(i + 1) !== 10)) line++;
+  }
+  return line;
+}
+
+/** The zero-based character offset where a one-based line starts (a CRLF pair counts as one line break). */
+export function offsetOfLine(text, line) {
+  let current = 1;
+  if (line <= 1) return 0;
+  for (let i = 0; i < text.length; i++) {
+    const code = text.charCodeAt(i);
+    if (code === 13 && text.charCodeAt(i + 1) === 10) continue;
+    if (code === 10 || code === 13) {
+      current++;
+      if (current === line) return i + 1;
+    }
+  }
+  return text.length;
+}
+
+const splitLines = (text) => text.split(/\r\n|\r|\n/);
+
+function jsonLine(text, segments) {
+  const root = parseTree(text);
+  if (!root) return null;
+  let node = root, target = root;
+  for (const segment of segments) {
+    let next;
+    if (node.type === "array") {
+      const index = /^\d+$/.test(segment) ? Number(segment) : -1;
+      next = node.children?.[index];
+    } else if (node.type === "object") {
+      next = node.children?.find((property) => property.children?.[0]?.value === segment);
+    }
+    if (!next) break;
+    target = next.type === "property" ? next.children[0] : next;
+    node = next.type === "property" ? next.children[1] ?? next : next;
+  }
+  return lineOfOffset(text, target.offset);
+}
+
+// One YAML line as its structural entries: block sequence markers and a leading mapping key, each with its column.
+const KEY = /^("(?:[^"\\]|\\.)*"|'(?:[^']|'')*'|[^\s#'"[\]{},&*!|>%@`-][^:#]*?|-[^\s:][^:#]*?)\s*:(?=\s|$)/;
+function unquote(key) {
+  if (key.startsWith('"')) { try { return JSON.parse(key); } catch { return key.slice(1, -1); } }
+  if (key.startsWith("'")) return key.slice(1, -1).replaceAll("''", "'");
+  return key;
+}
+function yamlEntries(lines) {
+  const parsed = [];
+  let skipBelow = -1;
+  lines.forEach((line) => {
+    const indent = line.length - line.trimStart().length;
+    const body = line.trim();
+    if (!body || body.startsWith("#") || body === "---" || body === "...") { parsed.push([]); return; }
+    if (skipBelow >= 0) {
+      if (indent > skipBelow) { parsed.push([]); return; }
+      skipBelow = -1;
+    }
+    const entries = [];
+    let position = indent;
+    while (line[position] === "-" && (position + 1 === line.length || line[position + 1] === " ")) {
+      entries.push({ kind: "seq", col: position });
+      position++;
+      while (line[position] === " ") position++;
+    }
+    const rest = line.slice(position);
+    const match = KEY.exec(rest);
+    if (match) {
+      entries.push({ kind: "key", col: position, key: unquote(match[1]) });
+      if (/^[|>][-+0-9]*\s*(#.*)?$/.test(rest.slice(match[0].length).trim())) skipBelow = position;
+    }
+    parsed.push(entries);
+  });
+  return parsed;
+}
+
+function yamlLine(text, segments) {
+  const lines = splitLines(text);
+  const entries = yamlEntries(lines);
+  let from = 0, to = lines.length, minCol = -1, found = null, sameColSeq = false;
+  for (const segment of segments) {
+    const isIndex = /^\d+$/.test(segment);
+    let childCol = Infinity;
+    for (let i = from; i < to; i++) for (const entry of entries[i]) if (entry.col > minCol) childCol = Math.min(childCol, entry.col);
+    if (sameColSeq) childCol = minCol + 1;
+    let hit = null, seen = 0;
+    scan: for (let i = from; i < to; i++) {
+      for (const entry of entries[i]) {
+        if (entry.col !== childCol) continue;
+        if (isIndex && entry.kind === "seq") { if (seen++ === Number(segment)) { hit = { line: i, entry }; break scan; } }
+        else if (!isIndex && entry.kind === "key" && entry.key === segment) { hit = { line: i, entry }; break scan; }
+      }
+    }
+    if (!hit) return found === null ? null : found + 1;
+    found = hit.line;
+    const { entry } = hit;
+    // A mapping key with no inline value whose sequence sits at the key's own column ("items:" then "- a").
+    const next = entries.findIndex((list, i) => i > hit.line && list.length > 0);
+    sameColSeq = entry.kind === "key" && next !== -1 && entries[next][0].kind === "seq" && entries[next][0].col === entry.col
+      && !lines[hit.line].slice(lines[hit.line].indexOf(":", entry.col) + 1).trim();
+    let end = to;
+    for (let i = hit.line + 1; i < to; i++) {
+      const first = entries[i][0];
+      if (!first) continue;
+      if (first.col < entry.col || (first.col === entry.col && !(sameColSeq && first.kind === "seq"))) { end = i; break; }
+    }
+    from = hit.line;
+    to = end;
+    minCol = sameColSeq ? entry.col - 1 : entry.col;
+  }
+  return found === null ? 1 : found + 1;
+}
+
+function markdownLine(text, segments) {
+  const lines = splitLines(text);
+  let bodyStart = 0, frontEnd = -1;
+  if (lines[0]?.trim() === "---") {
+    frontEnd = lines.findIndex((line, index) => index > 0 && line.trim() === "---");
+    if (frontEnd > 0) bodyStart = frontEnd + 1; else frontEnd = -1;
+  }
+  const slides = [];
+  let start = bodyStart, fence = false;
+  const close = (end) => {
+    let first = start;
+    while (first < end && !lines[first].trim()) first++;
+    slides.push({ start: first < end ? first : start, end });
+  };
+  for (let i = bodyStart; i < lines.length; i++) {
+    const line = lines[i];
+    if (/^(```|~~~)/.test(line)) fence = !fence;
+    if (!fence && line.trim() === "---") { close(i); start = i + 1; }
+  }
+  close(lines.length);
+  if (!segments.length) return 1;
+  if (segments[0] !== "slides") {
+    if (frontEnd < 0) return 1;
+    const inside = yamlLine(lines.slice(1, frontEnd).join("\n"), segments);
+    return inside === null ? 2 : inside + 1;
+  }
+  if (segments.length === 1) return slides[0].start + 1;
+  const slide = slides[/^\d+$/.test(segments[1]) ? Number(segments[1]) : -1];
+  if (!slide) return null;
+  if (segments.length === 2) return slide.start + 1;
+  const within = (pattern) => {
+    let inFence = false;
+    for (let i = slide.start; i < slide.end; i++) {
+      if (/^(```|~~~)/.test(lines[i])) { if (!inFence && pattern.test(lines[i])) return i + 1; inFence = !inFence; continue; }
+      if (!inFence && pattern.test(lines[i])) return i + 1;
+    }
+    return null;
+  };
+  const key = segments[2];
+  const nthItem = (n) => {
+    let count = 0, inFence = false;
+    for (let i = slide.start; i < slide.end; i++) {
+      if (/^(```|~~~)/.test(lines[i])) { inFence = !inFence; continue; }
+      if (!inFence && /^([-*+]|\d+\.)\s/.test(lines[i]) && count++ === n) return i + 1;
+    }
+    return within(/^\s*([-*+]|\d+\.)\s/);
+  };
+  const native = key === "title" ? within(/^# /)
+    : key === "subtitle" ? within(/^## /)
+    : key === "notes" ? within(/^Notes?:/)
+    : key === "items" ? (/^\d+$/.test(segments[3] ?? "") ? nthItem(Number(segments[3])) : within(/^\s*([-*+]|\d+\.)\s/))
+    : key === "text" ? within(/^(?!#|>|\s*([-*+]|\d+\.)\s|<!--|```|~~~|Notes?:)\S/)
+    : null;
+  if (native !== null) return native;
+  const embedded = within(key === "blocks" ? /^(```|~~~)opf-block/ : /^(```|~~~)opf-slide/);
+  return embedded ?? slide.start + 1;
+}
+
+/** The one-based line of a path in a source text of the given format ("json", "yaml" or "md"), or null. */
+export function lineForPath(format, text, path) {
+  const segments = pathSegments(path);
+  if (!segments.length) return 1;
+  try {
+    return format === "json" ? jsonLine(text, segments)
+      : format === "yaml" ? yamlLine(text, segments)
+      : markdownLine(text, segments);
+  } catch {
+    return null;
+  }
+}

package/dist/source-pane.d.ts

@@ -0,0 +1,90 @@
+import type { EditorSession } from "./index.js";
+import type { JsonCatalogContext } from "./json-options.js";
+import type { JsonCodeEditor } from "./json-editor.js";
+
+/** The source formats of the pane: `json` is canonical; `yaml` and `md` are core's `@openpresentation/opf/yaml` and `/markdown`. */
+export type SourceFormat = "json" | "yaml" | "md";
+export type SourcePaneDensity = "comfortable" | "touch";
+export type SourceFindingSeverity = "error" | "warning" | "info";
+
+/** One finding under the code. Core validator `Finding` objects fit: they carry `path`, `message` and `severity`. */
+export interface SourceFinding {
+  /** A JSON Pointer into the document (`/slides/0/title`); "" is the document or a position-only finding. */
+  path: string;
+  message: string;
+  severity: SourceFindingSeverity;
+  /** A one-based line in the pane's current text. Used when the pane cannot place `path` itself and for syntax errors. */
+  line?: number;
+  /** `schema` (the default count label), `syntax`, `format` (a note about what the format cannot hold) or `rejected` (the session refused the edit). */
+  kind?: string;
+  ruleId?: string;
+}
+
+/** What a host receives when the pane copies or downloads. */
+export interface SourceFile {
+  /** The name without the extension, spaces and slashes already replaced by `-`. */
+  name: string;
+  /** `<name>.opf.<json|yaml|md>` */
+  filename: string;
+  text: string;
+  format: SourceFormat;
+  mime: string;
+}
+
+export interface SourcePaneOptions {
+  /** The editor session. Every edit in any format reaches it as a patch (`applyPatch`), so it is validated and undoable. */
+  editor: EditorSession;
+  /** File name without extension (default `deck`). Spaces and slashes become `-`. */
+  name?: string;
+  onRename?(name: string): void;
+  /** The starting format (default `json`). */
+  format?: SourceFormat;
+  onFormatChange?(format: SourceFormat, previous: SourceFormat): void;
+  /** The JSON text as the author wrote it. Used when it parses to the session's document, so its spelling is kept. */
+  source?: string;
+  /** Findings to list. Without `findings` and `getFindings` the pane lists the session's own validation. */
+  findings?: readonly (SourceFinding | Record<string, unknown>)[];
+  /** Called whenever the list is rebuilt, so a host can pass core validator output without pushing it. */
+  getFindings?(context: { editor: EditorSession; format: SourceFormat; text: string }): readonly (SourceFinding | Record<string, unknown>)[];
+  /** A row was clicked (after the cursor moved). `line` is the line it moved to. */
+  onFindingSelect?(finding: SourceFinding, line: number): void;
+  /** Replace the default (`navigator.clipboard.writeText`). */
+  onCopy?(file: SourceFile): void | Promise<void>;
+  /** Replace the default (a Blob link named `<name>.opf.<ext>`). */
+  onDownload?(file: SourceFile): void | Promise<void>;
+  density?: SourcePaneDensity;
+  readOnly?: boolean;
+  /** Milliseconds a typed edit waits before it is applied to the session (default 250; 0 applies each change). */
+  applyDelay?: number;
+  /** Accessible name of the code editor (default `OPF source`). */
+  label?: string;
+  catalogs?: JsonCatalogContext;
+  /** Live completions while typing JSON: property names and values (enums, booleans, catalog references) at the cursor's JSON path, from the same data as the field menu. YAML and Markdown keep the menu only. Default true. */
+  completions?: boolean;
+  onError?(error: unknown): void;
+}
+
+export interface SourcePane {
+  element: HTMLElement;
+  /** Re-read the document from the session. */
+  refresh(): void;
+  /** Replace the host findings; `null` returns to the session's own validation. */
+  setFindings(findings: readonly (SourceFinding | Record<string, unknown>)[] | null): void;
+  /** Switch format. Returns false, and says why in the findings, when the document cannot be written in it. Does not call `onFormatChange`. */
+  setFormat(format: SourceFormat): boolean;
+  getFormat(): SourceFormat;
+  /** Move the cursor to the line of a JSON Pointer (or dotted OPF path) in the current format; best effort for YAML and Markdown. Returns the line. */
+  focusPath(path: string): number;
+  /** The text as shown, with any pending edit applied first. */
+  getText(): string;
+  getName(): string;
+  setName(name: string): void;
+  setDensity(density: SourcePaneDensity): void;
+  setReadOnly(readOnly: boolean): void;
+  /** The underlying code editor (`mountJsonCodeEditor`). */
+  readonly editor: JsonCodeEditor;
+  destroy(): void;
+}
+
+/** Mount the source pane in `container`: file name, format menu, Format, Copy and Download, the code, and the findings list. */
+export declare function createSourcePane(container: HTMLElement, options: SourcePaneOptions): SourcePane;