@quillmark/svelte 0.20.1 → 0.22.0

package/dist/core/codec/schema.js

@@ -3,9 +3,9 @@
 // (list_item/quote → lists/blockquote); marks mirror the content formatting set.
 // Each set is closed upstream, so the schema names its whole vocabulary and carries
 // nothing inert. `blockSchema` is the full field; `inlineSchema` is the constrained
-// single-textblock form for `richtext(inline)` (one paragraph, no block split, no
-// containers, no islands) and `plaintextSchema` is that one without marks, for
-// `plaintext(inline)`; `plainSchema` is a `plaintext` field without `inline`,
+// single-textblock form for a one-line `richtext` (one paragraph, no block split, no
+// containers, no islands) and `plaintextSchema` is that one without marks, for a
+// one-line `text`; `plainSchema` is a `text` field declaring `multiline: true`,
 // paragraphs and hard breaks and nothing else; `cellSchema` is the inline form with
 // hard breaks, for a table cell. Same decode/lower/position machinery,
 // narrower shapes. Anchors are not marks here (decorations).
@@ -14,19 +14,65 @@
 // paste inside one body run the whole document through them (CODEC §"Markdown at the
 // edges"), so every attribute written here is read back here. Foreign HTML spells none
 // of this package's `data-qm-*` names, so what a paste takes off the web is unchanged;
-// the one rule here that widens that door on purpose is the fence's, a `<table>` being
-// the block leaf's clipboard parser's (`table-paste.ts`).
+// the rules here that widen that door on purpose are the fence's and a span's styled
+// marks, a `<table>` being the block leaf's clipboard parser's (`table-paste.ts`).
 import { Schema } from 'prosemirror-model';
 import { islandBlockSpec, islandInlineSpec } from './islands.js';
+import { taskBody, taskChecked, taskDOM } from './tasks.js';
 import { rendersHref, storableUrl } from './urls.js';
+// ── Marks spelled as style ──────────────────────────────────────────────────
+// A word processor writes formatting as a span's inline style rather than as a tag:
+// Google Docs spells all four marks below that way, and wraps a whole copy in a `<b>`
+// stating a regular weight. Read off a `<span>` alone, since the same style on a cell or
+// a heading is that block's face rather than a run's. An underline inside a link is the
+// link's own: Docs underlines every one, and Chrome inlines the computed decoration on a
+// copy off any page.
+/** Whether `el`'s inline style states a bold weight. */
+const bold = (el) => /^(?:bold(?:er)?|[6-9]\d\d)$/.test(el.style.fontWeight);
+/** The text decoration `el` states, as a shorthand or a longhand. */
+const decoration = (el) => `${el.style.textDecoration} ${el.style.textDecorationLine}`;
+/** A mark a `<span>` carries where `styled` holds of it. Not consuming, so every mark a
+ *  span states matches, and so do the span's own rules after them. */
+const styledSpan = (styled) => ({
+    tag: 'span',
+    consuming: false,
+    getAttrs: (el) => styled(el) && null
+});
 // ── Marks (the block and inline schemas share them; plaintext declares none) ─
 const marks = {
     // Order matters: it fixes mark-set sort order and parse precedence. `link`
     // last so it wraps outermost.
-    strong: { parseDOM: [{ tag: 'strong' }, { tag: 'b' }], toDOM: () => ['strong', 0] },
-    em: { parseDOM: [{ tag: 'em' }, { tag: 'i' }], toDOM: () => ['em', 0] },
-    underline: { parseDOM: [{ tag: 'u' }], toDOM: () => ['u', 0] },
-    strike: { parseDOM: [{ tag: 's' }, { tag: 'del' }], toDOM: () => ['s', 0] },
+    strong: {
+        parseDOM: [
+            { tag: 'strong' },
+            { tag: 'b', getAttrs: (el) => (!el.style.fontWeight || bold(el)) && null },
+            styledSpan(bold)
+        ],
+        toDOM: () => ['strong', 0]
+    },
+    em: {
+        parseDOM: [
+            { tag: 'em' },
+            { tag: 'i' },
+            styledSpan((el) => /^(?:italic|oblique)\b/.test(el.style.fontStyle))
+        ],
+        toDOM: () => ['em', 0]
+    },
+    underline: {
+        parseDOM: [
+            { tag: 'u' },
+            styledSpan((el) => /\bunderline\b/.test(decoration(el)) && !el.closest('a'))
+        ],
+        toDOM: () => ['u', 0]
+    },
+    strike: {
+        parseDOM: [
+            { tag: 's' },
+            { tag: 'del' },
+            styledSpan((el) => /\bline-through\b/.test(decoration(el)))
+        ],
+        toDOM: () => ['s', 0]
+    },
     code: { parseDOM: [{ tag: 'code' }], toDOM: () => ['code', 0] },
     link: {
         attrs: { href: { default: '' } },
@@ -50,11 +96,10 @@ const marks = {
     }
 };
 // ── The fence's language ────────────────────────────────────────────────────
-// The one attribute no keystroke in the visual editor mints: the shorthand fires on
-// the third backtick, before a language could be typed, and a slash command is a name
-// (VISUAL_EDITOR §"Settled and open"). A paste is the gesture that does, and this is
-// what reads it — a fence copied off a highlighted page arrives carrying the language
-// that page stated, one copied inside the body keeps its own.
+// Minted by the fence shorthand, which fires on Enter with the language typed after the
+// backticks (`inputrules.ts`), and by a paste, which this reads: a fence copied off a
+// highlighted page arrives carrying the language that page stated, one copied inside
+// the body keeps its own.
 /** A `language-x` / `lang-x` token in a class list. */
 const LANG_CLASS = /(?:^|\s)lang(?:uage)?-(\S+)/;
 /** The language a `<pre>` states: `data-lang`, which is what `toDOM` writes, else the
@@ -149,11 +194,19 @@ const blockNodes = {
         parseDOM: [{ tag: 'ul' }],
         toDOM: () => ['ul', 0]
     },
+    // `checked` is a task item's, `null` on every other item (`tasks.ts`).
     list_item: {
         content: 'block+',
         defining: true,
-        parseDOM: [{ tag: 'li' }],
-        toDOM: () => ['li', 0]
+        attrs: { checked: { default: null } },
+        parseDOM: [
+            {
+                tag: 'li',
+                getAttrs: (el) => ({ checked: taskChecked(el) }),
+                contentElement: taskBody
+            }
+        ],
+        toDOM: (node) => node.attrs.checked === null ? ['li', 0] : taskDOM(node.attrs.checked)
     },
     island_block: islandBlockSpec
 };
@@ -210,7 +263,7 @@ export const cellSchema = new Schema({
     marks
 });
 /**
- * A `plaintext` field without `inline`: paragraphs and hard breaks, no marks, no
+ * A `text` field declaring `multiline: true`: paragraphs and hard breaks, no marks, no
  * islands, no containers, which is the shape `Content::is_plain` admits. Mark-free
  * for the reason {@link plaintextSchema} is.
  *
@@ -234,7 +287,7 @@ export function leafSchema(opts) {
         return opts.inline ? plaintextSchema : plainSchema;
     return opts.inline ? inlineSchema : blockSchema;
 }
-/** Whether `schema` can carry formatting at all: false for the two plaintext schemas.
+/** Whether `schema` can carry formatting at all: false for the two mark-free schemas.
  *  What a mark command asks before it offers itself. */
 export function hasMarks(schema) {
     return Object.keys(schema.marks).length > 0;

package/dist/core/codec/table-copy.d.ts

@@ -0,0 +1,17 @@
+import { Plugin } from 'prosemirror-state';
+import type { TableProps } from '@quillmark/wasm';
+/** A block of cells, both corners inclusive, in the row space `table.ts` names. */
+export interface CellRange {
+    r0: number;
+    c0: number;
+    r1: number;
+    c1: number;
+}
+/** The cells of `range` as a `<table>`, the header row in a `<thead>` where the range
+ *  holds it and the table has one. The cells carry their marks and breaks, and nothing
+ *  of the table's layout. */
+export declare function tableElement(props: TableProps, range?: CellRange): HTMLTableElement;
+/** The cells of `range` as tab-separated text, a line a row. */
+export declare function tableText(props: TableProps, range?: CellRange): string;
+/** A block leaf's copy: a table in the slice writes as a table in both spellings. */
+export declare function tableCopyPlugin(): Plugin;

package/dist/core/codec/table-copy.js

@@ -0,0 +1,84 @@
+// A table leaves the editor as the two spellings a table arrives in (`table-paste.ts`):
+// an HTML `<table>` and tab-separated text, what Word, Docs, Excel and Sheets each read.
+// Two copies write them: a held rectangle's cells (`table-view.ts`), and a selection
+// holding a whole island, whose markup keeps the island's own element around the table
+// so a paste inside the editor reads the island back whole.
+import { DOMSerializer } from 'prosemirror-model';
+import { Plugin } from 'prosemirror-state';
+import { decode } from './decode.js';
+import { tablePropsOfNode } from './islands.js';
+import { blockSchema, cellSchema } from './schema.js';
+import { cellAt, cellContent, columnCount, rowCount } from './table.js';
+const whole = (props) => ({
+    r0: 0,
+    c0: 0,
+    r1: rowCount(props) - 1,
+    c1: columnCount(props) - 1
+});
+const cellSerializer = DOMSerializer.fromSchema(cellSchema);
+function cellDOM(tag, cell) {
+    const dom = document.createElement(tag);
+    const paragraph = decode(cellContent(cell), cellSchema).firstChild;
+    if (paragraph)
+        dom.append(cellSerializer.serializeFragment(paragraph.content));
+    return dom;
+}
+/** The cells of `range` as a `<table>`, the header row in a `<thead>` where the range
+ *  holds it and the table has one. The cells carry their marks and breaks, and nothing
+ *  of the table's layout. */
+export function tableElement(props, range = whole(props)) {
+    const table = document.createElement('table');
+    let body;
+    for (let r = range.r0; r <= range.r1; r++) {
+        const head = r === 0 && !props.headless;
+        const section = head ? table.createTHead() : (body ??= table.createTBody());
+        const tr = section.insertRow();
+        for (let c = range.c0; c <= range.c1; c++)
+            tr.append(cellDOM(head ? 'th' : 'td', cellAt(props, r, c)));
+    }
+    return table;
+}
+/** A cell holding a tab, a line end or a quote goes in quotes with its quotes doubled,
+ *  as Excel and Sheets write one. */
+function tsvCell(text) {
+    return /[\t\n"]/.test(text) ? `"${text.replace(/"/g, '""')}"` : text;
+}
+/** The cells of `range` as tab-separated text, a line a row. */
+export function tableText(props, range = whole(props)) {
+    const lines = [];
+    for (let r = range.r0; r <= range.r1; r++) {
+        const cells = [];
+        for (let c = range.c0; c <= range.c1; c++)
+            cells.push(tsvCell(cellAt(props, r, c).text));
+        lines.push(cells.join('\t'));
+    }
+    return lines.join('\n');
+}
+const base = DOMSerializer.fromSchema(blockSchema);
+/** The island's own element with the table inside it: a paste in the editor matches the
+ *  element and reads `props`, and every other reader finds the table. */
+const islandSerializer = new DOMSerializer({
+    ...base.nodes,
+    island_block: (node) => {
+        const props = tablePropsOfNode(node);
+        const dom = DOMSerializer.renderSpec(document, blockSchema.nodes.island_block.spec.toDOM(node)).dom;
+        if (props)
+            dom.replaceChildren(tableElement(props));
+        return dom;
+    }
+}, base.marks);
+function leafText(node) {
+    const props = node.type === blockSchema.nodes.island_block ? tablePropsOfNode(node) : undefined;
+    if (props)
+        return tableText(props);
+    return node.type.spec.leafText?.(node) ?? '';
+}
+/** A block leaf's copy: a table in the slice writes as a table in both spellings. */
+export function tableCopyPlugin() {
+    return new Plugin({
+        props: {
+            clipboardSerializer: islandSerializer,
+            clipboardTextSerializer: (slice) => slice.content.textBetween(0, slice.content.size, '\n\n', leafText)
+        }
+    });
+}

package/dist/core/codec/table-view.d.ts

@@ -21,18 +21,12 @@ export interface TableChromeStrings {
     /** The two trailing bars, each of which grows the table along its own axis. */
     tableAddRow: string;
     tableAddColumn: string;
-    /** The held column's alignment cluster, a name per toggle, and the held cells'
-     *  cluster, which takes these three and the vertical three beside them. */
+    /** The held column's alignment cluster, a name per toggle. */
     tableAlignLeft: string;
     tableAlignCenter: string;
     tableAlignRight: string;
     /** The held first row's toggle, pressed while the row draws as the header. */
     tableHeaderToggle: string;
-    tableAlignTop: string;
-    tableAlignMiddle: string;
-    tableAlignBottom: string;
-    /** The held cells' cluster's own name. */
-    tableCellAlignment: string;
 }
 /**
  * The package's English for the island chrome. It lives here, beside the surface
@@ -57,6 +51,11 @@ export interface TableViewDeps {
      *  which is PM's 5px default. */
     clearance: number | undefined;
 }
+/** The table island mounted at `pos` in `view`, which a caret can step into; `undefined`
+ *  for any other node, or where no view is mounted. */
+export declare function tableAt(view: EditorView, pos: number): {
+    enter(side: -1 | 1): void;
+} | undefined;
 /** The `island_block` node view: a table island's editing surface, and the literal
  *  placeholder for every other island type. */
 export declare function tableNodeView(deps: TableViewDeps): NodeViewConstructor;