@aicayzer/inkkit 0.0.5 → 0.0.6

package/README.md

@@ -35,6 +35,8 @@ const snapshot = editor.snapshot(1)
 
 Markdown includes CommonMark, task lists, strikethrough, autolinks, GFM tables, editable footnotes and reference-style links, bounded callouts, highlights, author comments and offline Mermaid diagrams. Unsupported constructs remain literal Markdown. TXT mode treats all text literally. Images require a host adapter. RTF files remain outside the package scope.
 
+Table controls include complete row/column movement and explicit stable text or numeric sorting. Ordinary spreadsheet paste preserves cell boundaries, replaces selected cells and grows supported tables. Hosts call these operations through the public facade; each is undoable.
+
 `await editor.printableSnapshot(1)` returns a complete printable HTML document, print styles and portable image bytes. It excludes author comments, includes folded content and reports unavailable assets or a changed document. Client apps own Print/PDF commands, dialogs and file generation.
 
 See [supported syntax](docs/supported-syntax.md), [the host API](docs/api.md), [preservation and clipboard behavior](docs/preservation.md), [development](docs/development.md), and [releases](docs/releasing.md).

package/dist/dialect.js

@@ -3,6 +3,7 @@ import { commonmark, hardbreakSchema, imageSchema, paragraphSchema, remarkInline
 import { extendListItemSchemaForTask, strikethroughAttr, strikethroughInputRule, strikethroughKeymap, strikethroughSchema, toggleStrikethroughCommand, wrapInTaskListInputRule, tableSchema, tableHeaderRowSchema, tableHeaderSchema, tableRowSchema, tableCellSchema, tableEditingPlugin, tableKeymap, goToNextTableCellCommand, goToPrevTableCellCommand, insertTableCommand, addRowBeforeCommand, addRowAfterCommand, addColBeforeCommand, addColAfterCommand, selectRowCommand, selectColCommand, deleteSelectedCellsCommand, setAlignCommand, exitTable, } from '@milkdown/kit/preset/gfm';
 import { $remark } from '@milkdown/kit/utils';
 import { autolinkInputRule } from './autolink.js';
+import { normalizeTableAlignment, normalizeTableColumnAlignment, } from './table-alignment.js';
 import { preservingCodeBlocks, remarkCodeFences, fencedCodeHandler, } from './code-fences.js';
 import { literalBlock, createLiteralPreservation } from './literals.js';
 import { references, remarkReferencesPlugin } from './references.js';
@@ -86,6 +87,17 @@ function remarkDialect() {
     add('toMarkdownExtensions', gfmTaskListItemToMarkdown());
     add('toMarkdownExtensions', gfmAutolinkLiteralToMarkdown());
     add('toMarkdownExtensions', gfmTableToMarkdown());
+    add('toMarkdownExtensions', {
+        handlers: {
+            text(node, parent, state, info) {
+                const value = defaultHandlers.text(node, parent, state, info);
+                // GFM trims literal whitespace at cell edges on reopening.
+                return state.stack.includes('tableCell')
+                    ? value.replace(/^[ \t]+|[ \t]+$/g, (spaces) => spaces.replaceAll(' ', ' ').replaceAll('\t', '	'))
+                    : value;
+            },
+        },
+    });
     add('toMarkdownExtensions', { handlers: { link, code: fencedCodeHandler } });
 }
 export const remarkDialectPlugin = $remark('remarkDialect', () => remarkDialect);
@@ -209,7 +221,7 @@ export const tables = [
                             return false;
                         return {
                             ...attrs,
-                            alignment: dom.style.textAlign || dom.getAttribute('align') || null,
+                            alignment: normalizeTableAlignment(dom),
                         };
                     },
                 }
@@ -231,7 +243,7 @@ export const tables = [
                             return false;
                         return {
                             ...attrs,
-                            alignment: dom.style.textAlign || dom.getAttribute('align') || null,
+                            alignment: normalizeTableColumnAlignment(dom),
                         };
                     },
                 }

package/dist/editor.d.ts

@@ -1,4 +1,4 @@
-import { type TableCommand } from './tables.js';
+import { type TableCommand, type TableOptions } from './tables.js';
 import { type DocumentInput, type DocumentSnapshot, type ImageAdapter, type ClipboardInput, type ClipboardOutput, type PrintableDocument } from './types.js';
 export type Mark = 'bold' | 'italic' | 'strikethrough' | 'highlight' | 'code' | 'link';
 export type Block = {
@@ -70,10 +70,7 @@ export declare class InkKitEditor {
     paste(input: ClipboardInput): Promise<void>;
     setCommentsVisible(visible: boolean): void;
     pasteAsPlainText(text: string): void;
-    table(command: TableCommand, options?: {
-        rows?: number;
-        columns?: number;
-    }): boolean;
+    table(command: TableCommand, options?: TableOptions): boolean;
     destroy(): Promise<void>;
     private keymapPlugin;
     static mount(root: HTMLElement, events: EditorEvents, options?: {

package/dist/editor.js

@@ -17,7 +17,7 @@ import { Preservation } from './preserve.js';
 import { normaliseLabel, referenceDefinitions, footnoteDefinitions, } from './references.js';
 import { selectionMarkdown, selectionContent, referenceMetadata, withReferenceMetadata, } from './reference-clipboard.js';
 import { imageView } from './images.js';
-import { tablePlugins, tableCommand } from './tables.js';
+import { tablePlugins, tableCommand, configureTableMovement, } from './tables.js';
 import { InkKitError, } from './types.js';
 import { highlightPlugin } from './highlight.js';
 import { highlightKeymap, toggleHighlightCommand } from './inline-highlight.js';
@@ -589,6 +589,15 @@ export class InkKitEditor {
             .use($prose(() => search()))
             .use(options.images ? imageView(options.images) : [])
             .create();
+        configureTableMovement(instance.editor.ctx, () => {
+            try {
+                instance.assertCurrent();
+                return instance.formatType === 'md';
+            }
+            catch {
+                return false;
+            }
+        });
         instance.plain = document.createElement('textarea');
         instance.plain.className = 'inkkit-plain';
         instance.plain.setAttribute('aria-label', 'Plain text editor');

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { InkKitEditor } from './editor.js';
 export type { EditorEvents, CaretState, Mark, Block, FormatCommand, Keymap, } from './editor.js';
-export type { TableCommand } from './tables.js';
+export type { TableCommand, TableOptions } from './tables.js';
 export { InkKitError } from './types.js';
 export type { DocumentFormat, DocumentContext, DocumentInput, DocumentSnapshot, EditorErrorCode, ImageAdapter, CapturedImage, PortableImage, ClipboardInput, ClipboardOutput, ClipboardImage, ClipboardDiagram, PrintableDocument, PrintableWarning, } from './types.js';

package/dist/paste.js

@@ -1,7 +1,8 @@
 import { editorViewCtx, parserCtx } from '@milkdown/kit/core';
-import { DOMParser as ProseParser, Fragment, Slice, } from '@milkdown/kit/prose/model';
+import { DOMParser as ProseParser, DOMSerializer, Fragment, Slice, } from '@milkdown/kit/prose/model';
 import { Plugin, PluginKey } from '@milkdown/kit/prose/state';
 import { $prose } from '@milkdown/kit/utils';
+import { pasteSpreadsheet } from './spreadsheet.js';
 import { avoidReferenceCollisions, markdownFromHTML, } from './reference-clipboard.js';
 import { InkKitError, } from './types.js';
 export class PasteController {
@@ -114,6 +115,10 @@ export class PasteController {
             const plainText = input.plainText ||
                 this.options.literalText?.() ||
                 view.state.selection.$from.parent.type.spec.code;
+            if (!plainText &&
+                input.markdown == null &&
+                pasteSpreadsheet(ctx, { ...input, images }))
+                return;
             const markdown = plainText
                 ? undefined
                 : (input.markdown ??
@@ -136,6 +141,16 @@ export class PasteController {
                 const template = document.createElement('template');
                 template.innerHTML = input.html;
                 const container = template.content;
+                // Preserve whole unsupported tables before rewriting their descendants,
+                // so comments retain their source and ordinary-copy privacy.
+                for (const table of [...container.querySelectorAll('table')]) {
+                    if (table.parentElement?.closest('table'))
+                        continue;
+                    if (schema.nodes.table && !unsupportedClipboardTable(table))
+                        continue;
+                    const preserved = ctx.get(parserCtx)(table.outerHTML);
+                    table.replaceWith(DOMSerializer.fromSchema(schema).serializeFragment(preserved.content));
+                }
                 for (const warning of container.querySelectorAll('[data-inkkit-diagram-error]'))
                     warning.remove();
                 for (const diagram of container.querySelectorAll('figure[data-inkkit-mermaid]')) {
@@ -252,11 +267,7 @@ export class PasteController {
                     if (table.parentElement?.closest('table'))
                         continue;
                     const rows = [...table.querySelectorAll('tr')];
-                    const widths = rows.map((row) => row.querySelectorAll(':scope > th,:scope > td').length);
-                    const unsupported = !schema.nodes.table ||
-                        widths.length === 0 ||
-                        widths.some((width) => !width || width !== widths[0]) ||
-                        table.querySelector('table,[rowspan]:not([rowspan="1"]),[colspan]:not([colspan="1"]),td > p ~ p,th > p ~ p,td > div,th > div,td > ul,td > ol,td > pre,td > blockquote,th > ul,th > ol,th > pre,th > blockquote');
+                    const unsupported = !schema.nodes.table || unsupportedClipboardTable(table);
                     if (!unsupported && !table.querySelector('th')) {
                         for (const cell of rows[0]?.querySelectorAll(':scope > td') ?? []) {
                             const heading = document.createElement('th');
@@ -422,6 +433,45 @@ export class PasteController {
         }
     }
 }
+function unsupportedClipboardTable(table) {
+    const rows = [...table.querySelectorAll('tr')];
+    const widths = rows.map((row) => row.querySelectorAll(':scope > th,:scope > td').length);
+    const supported = new Set([
+        'THEAD',
+        'TBODY',
+        'TFOOT',
+        'TR',
+        'TH',
+        'TD',
+        'P',
+        'STRONG',
+        'B',
+        'EM',
+        'I',
+        'S',
+        'DEL',
+        'STRIKE',
+        'CODE',
+        'A',
+        'MARK',
+        'SPAN',
+        'SUP',
+        'FONT',
+        'IMG',
+    ]);
+    return (widths.length === 0 ||
+        widths.some((width) => !width || width !== widths[0]) ||
+        !!document.createTreeWalker(table, NodeFilter.SHOW_COMMENT).nextNode() ||
+        [...table.querySelectorAll('*')].some((element) => !supported.has(element.tagName)) ||
+        [...table.querySelectorAll('p')].some((paragraph) => {
+            const cell = paragraph.parentElement;
+            return (!cell ||
+                !['TH', 'TD'].includes(cell.tagName) ||
+                cell.children.length !== 1 ||
+                [...cell.childNodes].some((node) => node !== paragraph && !!node.textContent?.trim()));
+        }) ||
+        !!table.querySelector('[rowspan]:not([rowspan="1"]),[colspan]:not([colspan="1"])'));
+}
 function dataImage(source) {
     const match = /^data:(image\/(?:png|jpeg|gif|webp|avif|bmp|tiff));base64,([A-Za-z0-9+/=\s]+)$/.exec(source);
     if (!match)

package/dist/preserve.js

@@ -2,16 +2,14 @@ import { parserCtx, remarkCtx } from '@milkdown/kit/core';
 import { serialize } from './dialect.js';
 import { restoreCodeEndings, finalCodeEnding } from './code-fences.js';
 function signature(node) {
-    return JSON.stringify(node, (key, value) => ['position', 'data', 'url', 'title', 'marker'].includes(key)
-        ? undefined
-        : value);
+    return JSON.stringify(node, (key, value) => ['position', 'data', 'marker'].includes(key) ? undefined : value);
 }
 function ownShape(node) {
     return JSON.stringify(node, (key, value) => ['position', 'data', 'children', 'value', 'marker'].includes(key)
         ? undefined
         : value);
 }
-function retainText(raw, before, after, quoteIndent = false) {
+function retainText(raw, before, after, quoteIndent = false, inTable = false) {
     before = before.replace(/\r\n?/g, '\n');
     after = after.replace(/\r\n?/g, '\n');
     let prefix = 0;
@@ -64,7 +62,7 @@ function retainText(raw, before, after, quoteIndent = false) {
     }
     if (decoded !== before) {
         // Continuation indentation is excluded from a quoted paragraph's text.
-        return quoteIndent ? after : retainText(raw, before, after, true);
+        return quoteIndent ? after : retainText(raw, before, after, true, inTable);
     }
     const inserted = after
         .slice(prefix, after.length - suffix)
@@ -73,7 +71,9 @@ function retainText(raw, before, after, quoteIndent = false) {
         const at = prefix + index;
         const delimiter = (character === '%' || character === '=') &&
             (after[at - 1] === character || after[at + 1] === character);
-        return delimiter || /[\\`*_[\]<>]/.test(character)
+        return delimiter ||
+            /[\\`*_[\]<>]/.test(character) ||
+            (inTable && character === '|')
             ? `\\${character}`
             : character;
     })
@@ -108,7 +108,7 @@ function retainBoundaryWhitespace(raw, canonical) {
     return raw;
 }
 // Patch changed leaves so an adjacent edit retains authored delimiters and labels.
-function retainSource(before, after, source, canonical, lineEnding) {
+function retainSource(before, after, source, canonical, lineEnding, inTable = false) {
     const start = before.position?.start.offset;
     const end = before.position?.end.offset;
     const newStart = after.position?.start.offset;
@@ -163,7 +163,7 @@ function retainSource(before, after, source, canonical, lineEnding) {
                 destination[3]);
     }
     if (before.type === 'text' && after.type === 'text')
-        return retainBoundaryWhitespace(retainText(raw, before.value, after.value), canonical.slice(newStart, newEnd));
+        return retainBoundaryWhitespace(retainText(raw, before.value, after.value, false, inTable), canonical.slice(newStart, newEnd));
     if (signature(before) === signature(after) &&
         ownShape(before) === ownShape(after))
         return raw;
@@ -173,13 +173,40 @@ function retainSource(before, after, source, canonical, lineEnding) {
         after.children &&
         before.children.length === after.children.length) {
         let output = '', previous = start;
+        const retained = new Set();
         before.children.forEach((child, index) => {
+            const incoming = after.children[index];
+            const movedIndex = before.type === 'table' || before.type === 'tableRow'
+                ? before.children.findIndex((candidate, candidateIndex) => !retained.has(candidateIndex) &&
+                    signature(candidate) === signature(incoming) &&
+                    ownShape(candidate) === ownShape(incoming))
+                : -1;
+            const original = movedIndex < 0 ? child : before.children[movedIndex];
+            if (movedIndex >= 0)
+                retained.add(movedIndex);
             const childStart = child.position?.start.offset, childEnd = child.position?.end.offset;
             if (childStart == null || childEnd == null)
                 throw new PreservationError('A source token has no location');
-            output +=
-                source.slice(previous, childStart) +
-                    retainSource(child, after.children[index], source, canonical, lineEnding);
+            let retainedSource = retainSource(original, incoming, source, canonical, lineEnding, inTable || before.type === 'tableCell');
+            if (before.type === 'tableRow' && movedIndex >= 0) {
+                // Cell positions own different pipe boundaries at the row edges.
+                const originalFrom = original.children?.[0]?.position?.start.offset;
+                const originalTo = original.children?.at(-1)?.position?.end.offset;
+                const from = child.children?.[0]?.position?.start.offset;
+                const to = child.children?.at(-1)?.position?.end.offset;
+                retainedSource =
+                    originalFrom != null &&
+                        originalTo != null &&
+                        from != null &&
+                        to != null
+                        ? source.slice(childStart, from) +
+                            source.slice(originalFrom, originalTo) +
+                            source.slice(to, childEnd)
+                        : canonical
+                            .slice(incoming.position.start.offset, incoming.position.end.offset)
+                            .replaceAll('\n', lineEnding);
+            }
+            output += source.slice(previous, childStart) + retainedSource;
             previous = childEnd;
         });
         return output + source.slice(previous, end);

package/dist/spreadsheet.d.ts

@@ -0,0 +1,3 @@
+import type { Ctx } from '@milkdown/kit/ctx';
+import { type ClipboardInput } from './types.js';
+export declare function pasteSpreadsheet(ctx: Ctx, input: ClipboardInput): boolean;

package/dist/spreadsheet.js

@@ -0,0 +1,275 @@
+import { editorViewCtx } from '@milkdown/kit/core';
+import { DOMParser as ProseParser, Fragment, } from '@milkdown/kit/prose/model';
+import { isInTable, selectedRect } from '@milkdown/kit/prose/tables';
+import { InkKitError } from './types.js';
+import { literalCommentSpans } from './comments.js';
+import { normalizeTableAlignment } from './table-alignment.js';
+import { dispatchTableOperation, editableTable, selectTableRectangle, } from './tables.js';
+export function pasteSpreadsheet(ctx, input) {
+    const view = ctx.get(editorViewCtx);
+    if (input.plainText || input.markdown != null)
+        return false;
+    const inTable = isInTable(view.state);
+    if (input.html &&
+        /data-inkkit-(?:markdown|reference|footnote|comment)/i.test(input.html)) {
+        if (inTable && /<table[\s>]/i.test(input.html))
+            reject();
+        return false;
+    }
+    if (input.images?.length || (input.html && /<img[\s>]/i.test(input.html))) {
+        if (!input.html || !/<table[\s>]/i.test(input.html))
+            return false;
+        const template = document.createElement('template');
+        template.innerHTML = input.html;
+        for (const image of template.content.querySelectorAll('img'))
+            image.replaceWith(document.createTextNode(image.getAttribute('alt') ?? 'Image'));
+        try {
+            htmlGrid(view.state.schema, template.innerHTML);
+            return false;
+        }
+        catch {
+            if (!inTable && !standaloneTable(input.html))
+                return false;
+        }
+    }
+    let grid;
+    try {
+        grid = input.html?.match(/<table[\s>]/i)
+            ? htmlGrid(view.state.schema, input.html)
+            : input.text.includes('\t')
+                ? textGrid(view.state.schema, input.text)
+                : undefined;
+    }
+    catch (error) {
+        if (inTable || !input.html)
+            throw error;
+        if (!standaloneTable(input.html))
+            return false;
+        const schema = view.state.schema;
+        const children = [];
+        let cursor = 0;
+        for (const span of literalCommentSpans(input.html)) {
+            if (span.start > cursor)
+                children.push(schema.text(input.html.slice(cursor, span.start)));
+            children.push(schema.nodes.comment_inline.create({ syntax: span.syntax, block: Boolean(span.block) }, span.value ? schema.text(span.value) : null));
+            cursor = span.end;
+        }
+        if (cursor < input.html.length)
+            children.push(schema.text(input.html.slice(cursor)));
+        const literal = schema.nodes.literal_markdown.create(null, children);
+        const selection = view.state.selection;
+        const tr = selection.$from.parent.type.name === 'paragraph' &&
+            selection.empty &&
+            selection.$from.parent.content.size === 0
+            ? view.state.tr.replaceWith(selection.$from.before(), selection.$from.after(), literal)
+            : view.state.tr.replaceSelectionWith(literal);
+        dispatchTableOperation(view, tr);
+        return true;
+    }
+    if (!grid)
+        return false;
+    if (!inTable) {
+        const schema = view.state.schema;
+        const rows = grid.cells.map((row, index) => schema.nodes[index ? 'table_row' : 'table_header_row'].create(null, row.map((content, column) => schema.nodes[index ? 'table_cell' : 'table_header'].create({ alignment: grid.alignment?.[column] ?? 'left' }, schema.nodes.paragraph.create(null, content)))));
+        const table = schema.nodes.table.create(null, rows);
+        const selection = view.state.selection;
+        const tr = selection.$from.parent.type.name === 'paragraph' &&
+            selection.empty &&
+            selection.$from.parent.content.size === 0
+            ? view.state.tr.replaceWith(selection.$from.before(), selection.$from.after(), table)
+            : view.state.tr.replaceSelectionWith(table);
+        let tableStart = -1;
+        tr.doc.descendants((node, pos) => {
+            if (node === table)
+                tableStart = pos + 1;
+        });
+        if (tableStart < 0)
+            reject();
+        selectTableRectangle(tr, tableStart, table, 0, 0, grid.cells.length, grid.width);
+        dispatchTableOperation(view, tr);
+        return true;
+    }
+    const rect = selectedRect(view.state);
+    if (!editableTable(rect.table))
+        reject();
+    const width = Math.max(rect.map.width, rect.left + grid.width);
+    const height = Math.max(rect.map.height, rect.top + grid.cells.length);
+    if (width > 100 || height > 100)
+        reject();
+    const schema = view.state.schema;
+    const alignment = Array.from({ length: width }, (_, column) => column < rect.map.width
+        ? rect.table.firstChild.child(column).attrs.alignment
+        : 'left');
+    const rows = [];
+    for (let row = 0; row < height; row++) {
+        const cells = [];
+        for (let column = 0; column < width; column++) {
+            const existing = row < rect.map.height && column < rect.map.width
+                ? rect.table.child(row).child(column)
+                : undefined;
+            const incoming = grid.cells[row - rect.top]?.[column - rect.left];
+            const cleared = row >= rect.top &&
+                row < rect.bottom &&
+                column >= rect.left &&
+                column < rect.right;
+            if (existing && !incoming && !cleared)
+                cells.push(existing);
+            else {
+                const type = schema.nodes[row ? 'table_cell' : 'table_header'];
+                cells.push(type.create({ ...(existing?.attrs ?? {}), alignment: alignment[column] }, schema.nodes.paragraph.create(null, incoming)));
+            }
+        }
+        rows.push(schema.nodes[row ? 'table_row' : 'table_header_row'].create(rect.table.maybeChild(row)?.attrs, cells));
+    }
+    const table = rect.table.copy(Fragment.fromArray(rows));
+    const tr = view.state.tr.replaceWith(rect.tableStart - 1, rect.tableStart - 1 + rect.table.nodeSize, table);
+    selectTableRectangle(tr, rect.tableStart, table, rect.top, rect.left, rect.top + grid.cells.length, rect.left + grid.width);
+    dispatchTableOperation(view, tr);
+    return true;
+}
+function standaloneTable(html) {
+    const template = document.createElement('template');
+    template.innerHTML = html;
+    for (const metadata of template.content.querySelectorAll('meta[charset]'))
+        metadata.remove();
+    const elements = [...template.content.childNodes].filter((node) => node.nodeType !== 3 || node.textContent?.trim());
+    return elements.length === 1 && elements[0] instanceof HTMLTableElement;
+}
+function reject() {
+    throw new InkKitError('preservation', 'This spreadsheet cannot be represented safely in a Markdown table. Paste as plain text outside the table to retain its source.');
+}
+function textGrid(schema, input) {
+    const text = input.replace(/\r\n?/g, '\n').replace(/\n$/, '');
+    const rows = [[]];
+    let value = '', quoted = false, closed = false, start = true;
+    for (let index = 0; index <= text.length; index++) {
+        const character = text[index];
+        if (quoted) {
+            if (character == null)
+                reject();
+            if (character === '"') {
+                if (text[index + 1] === '"') {
+                    value += '"';
+                    index++;
+                }
+                else {
+                    quoted = false;
+                    closed = true;
+                }
+            }
+            else
+                value += character;
+            continue;
+        }
+        if (character === '"' && start) {
+            quoted = true;
+            start = false;
+        }
+        else if (character === '\t' || character === '\n' || character == null) {
+            rows.at(-1).push(value);
+            value = '';
+            start = true;
+            closed = false;
+            if (character === '\n')
+                rows.push([]);
+        }
+        else {
+            if (closed)
+                reject();
+            value += character;
+            start = false;
+        }
+    }
+    const width = Math.max(...rows.map((row) => row.length));
+    if (width > 100 || rows.length > 100)
+        reject();
+    if (rows.some((row) => row.some((value) => /[\n\t]/.test(value))))
+        reject();
+    return {
+        width,
+        cells: rows.map((row) => Array.from({ length: width }, (_, column) => {
+            const value = row[column] ?? '';
+            return value ? Fragment.from(schema.text(value)) : Fragment.empty;
+        })),
+    };
+}
+function htmlGrid(schema, html) {
+    const template = document.createElement('template');
+    template.innerHTML = html;
+    const fragment = template.content;
+    for (const metadata of fragment.querySelectorAll('meta[charset]'))
+        metadata.remove();
+    const table = fragment.querySelector('table');
+    if (!table || fragment.querySelectorAll('table').length !== 1)
+        reject();
+    const wrapper = table.parentElement;
+    if (wrapper && wrapper.tagName !== 'BODY')
+        reject();
+    for (const sibling of fragment.childNodes)
+        if (sibling !== table &&
+            (sibling.textContent?.trim() || sibling.nodeType !== 3))
+            reject();
+    const rows = [...table.querySelectorAll('tr')];
+    if (document.createTreeWalker(table, NodeFilter.SHOW_COMMENT).nextNode())
+        reject();
+    for (const element of table.children) {
+        if (!['TR', 'THEAD', 'TBODY', 'TFOOT'].includes(element.tagName))
+            reject();
+        if (element.tagName !== 'TR')
+            for (const row of element.children)
+                if (row.tagName !== 'TR')
+                    reject();
+    }
+    const width = rows[0]?.children.length ?? 0;
+    if (!width || width > 100 || !rows.length || rows.length > 100)
+        reject();
+    const parser = ProseParser.fromSchema(schema);
+    const inline = new Set([
+        'STRONG',
+        'B',
+        'EM',
+        'I',
+        'S',
+        'DEL',
+        'STRIKE',
+        'CODE',
+        'A',
+        'MARK',
+        'SPAN',
+    ]);
+    const cells = rows.map((row) => {
+        if (row.children.length !== width)
+            reject();
+        return [...row.children].map((cell) => {
+            if (!['TH', 'TD'].includes(cell.tagName))
+                reject();
+            if ((cell.hasAttribute('rowspan') &&
+                cell.getAttribute('rowspan') !== '1') ||
+                (cell.hasAttribute('colspan') && cell.getAttribute('colspan') !== '1'))
+                reject();
+            for (const element of cell.querySelectorAll('*'))
+                if (!inline.has(element.tagName) &&
+                    !(element.tagName === 'P' &&
+                        element.parentElement === cell &&
+                        cell.children.length === 1))
+                    reject();
+            const walker = document.createTreeWalker(cell, NodeFilter.SHOW_COMMENT);
+            if (walker.nextNode())
+                reject();
+            if (/[\n\r\t]/.test(cell.textContent ?? ''))
+                reject();
+            for (const link of cell.querySelectorAll('a'))
+                if (!link.hasAttribute('href'))
+                    reject();
+            const parsed = parser.parse(cell, { preserveWhitespace: true });
+            if (parsed.childCount === 0)
+                return Fragment.empty;
+            if (parsed.childCount !== 1 ||
+                parsed.firstChild.type.name !== 'paragraph')
+                reject();
+            return parsed.firstChild.content;
+        });
+    });
+    const alignment = [...rows[0].children].map((cell) => normalizeTableAlignment(cell) ?? 'left');
+    return { width, cells, alignment };
+}

package/dist/table-alignment.d.ts

@@ -0,0 +1,2 @@
+export declare function normalizeTableAlignment(element: HTMLElement): 'left' | 'center' | 'right' | null;
+export declare function normalizeTableColumnAlignment(element: HTMLElement): 'left' | 'center' | 'right' | null;

package/dist/table-alignment.js

@@ -0,0 +1,46 @@
+export function normalizeTableAlignment(element) {
+    const alignment = (element.style.textAlign ||
+        element.getAttribute('align') ||
+        '')
+        .trim()
+        .toLowerCase();
+    if (alignment === 'left' || alignment === 'center' || alignment === 'right')
+        return alignment;
+    if (alignment !== 'start' && alignment !== 'end')
+        return null;
+    let direction = 'ltr';
+    for (let current = element; current; current = current.parentElement) {
+        const value = (current.style.direction || current.getAttribute('dir') || '')
+            .trim()
+            .toLowerCase();
+        if (value === 'ltr' || value === 'rtl') {
+            direction = value;
+            break;
+        }
+        if (value === 'auto') {
+            const first = [...(current.textContent ?? '')].find((character) => /[\u061c\u200e\u200f]|\p{Letter}/u.test(character));
+            if (first) {
+                direction =
+                    /[\u0590-\u08ff\u200f\ufb1d-\ufdff\ufe70-\ufeff\u{10800}-\u{10fff}\u{1e800}-\u{1edff}\u{1e900}-\u{1e95f}]/u.test(first)
+                        ? 'rtl'
+                        : 'ltr';
+                break;
+            }
+        }
+    }
+    return alignment === 'start'
+        ? direction === 'rtl'
+            ? 'right'
+            : 'left'
+        : direction === 'rtl'
+            ? 'left'
+            : 'right';
+}
+export function normalizeTableColumnAlignment(element) {
+    if (!(element instanceof HTMLTableCellElement))
+        return normalizeTableAlignment(element);
+    const table = element.closest('table');
+    const header = table?.rows[0]?.cells[element.cellIndex];
+    // GFM represents alignment once per column, independently of cell direction.
+    return normalizeTableAlignment(header ?? element);
+}

package/dist/tables.d.ts

@@ -1,7 +1,18 @@
 import type { Ctx } from '@milkdown/kit/ctx';
-export type TableCommand = 'insert' | 'addRowBefore' | 'addRowAfter' | 'addColumnBefore' | 'addColumnAfter' | 'deleteRow' | 'deleteColumn' | 'deleteTable' | 'alignLeft' | 'alignCenter' | 'alignRight' | 'exit';
-export declare const tablePlugins: (((ctx: Ctx) => () => void) | import("@milkdown/kit/ctx").MilkdownPlugin)[];
-export declare function tableCommand(ctx: Ctx, command: TableCommand, options?: {
+import { type Node as ProseNode } from '@milkdown/kit/prose/model';
+import type { EditorView } from '@milkdown/kit/prose/view';
+import type { Transaction } from '@milkdown/kit/prose/state';
+export type TableCommand = 'insert' | 'addRowBefore' | 'addRowAfter' | 'addColumnBefore' | 'addColumnAfter' | 'deleteRow' | 'deleteColumn' | 'deleteTable' | 'alignLeft' | 'alignCenter' | 'alignRight' | 'moveRowUp' | 'moveRowDown' | 'moveColumnLeft' | 'moveColumnRight' | 'sortRows' | 'exit';
+export interface TableOptions {
     rows?: number;
     columns?: number;
-}): boolean;
+    column?: number;
+    order?: 'ascending' | 'descending';
+    comparison?: 'text' | 'number';
+}
+export declare const tablePlugins: (((ctx: Ctx) => () => void) | import("@milkdown/kit/ctx").MilkdownPlugin)[];
+export declare function tableCommand(ctx: Ctx, command: TableCommand, options?: TableOptions): boolean;
+export declare function dispatchTableOperation(view: EditorView, tr: Transaction): void;
+export declare function configureTableMovement(ctx: Ctx, canEdit: () => boolean): void;
+export declare function editableTable(table: ProseNode): boolean;
+export declare function selectTableRectangle(tr: Transaction, tableStart: number, table: ProseNode, top: number, left: number, bottom: number, right: number): void;

package/dist/tables.js

@@ -1,9 +1,12 @@
 import { commandsCtx, editorViewCtx } from '@milkdown/kit/core';
 import { tableBlock, tableBlockConfig, } from '@milkdown/kit/component/table-block';
-import { insertTableCommand, exitTable } from '@milkdown/kit/preset/gfm';
-import { addRowAfter, addRowBefore, addColumnAfter, addColumnBefore, deleteRow, deleteColumn, deleteTable, goToNextCell, selectedRect, TableMap, isInTable, } from '@milkdown/kit/prose/tables';
+import { insertTableCommand, exitTable, moveRowCommand, moveColCommand, } from '@milkdown/kit/preset/gfm';
+import { addRowAfter, addRowBefore, addColumnAfter, addColumnBefore, deleteRow, deleteColumn, deleteTable, goToNextCell, selectedRect, TableMap, isInTable, CellSelection, } from '@milkdown/kit/prose/tables';
+import { Fragment } from '@milkdown/kit/prose/model';
+import { closeHistory } from '@milkdown/kit/prose/history';
 import { keymap } from '@milkdown/kit/prose/keymap';
 import { $prose } from '@milkdown/kit/utils';
+import { clipboardText } from './clipboard.js';
 const labels = {
     add_row: 'Add row',
     add_col: 'Add column',
@@ -16,6 +19,8 @@ const labels = {
     row_drag_handle: 'Move row',
 };
 export const tablePlugins = [
+    moveRowCommand,
+    moveColCommand,
     tableBlockConfig,
     (ctx) => () => {
         ctx.update(tableBlockConfig.key, (config) => ({
@@ -42,6 +47,8 @@ export function tableCommand(ctx, command, options) {
     }
     if (command === 'exit')
         return commands.call(exitTable.key);
+    if (command.startsWith('move') || command === 'sortRows')
+        return refineTable(view, command, options);
     if (command === 'alignLeft' ||
         command === 'alignCenter' ||
         command === 'alignRight') {
@@ -78,3 +85,162 @@ export function tableCommand(ctx, command, options) {
     };
     return actions[command](view.state, view.dispatch);
 }
+export function dispatchTableOperation(view, tr) {
+    view.dispatch(closeHistory(tr).scrollIntoView());
+    view.dispatch(closeHistory(view.state.tr).setMeta('addToHistory', false));
+}
+export function configureTableMovement(ctx, canEdit) {
+    const commands = ctx.get(commandsCtx);
+    for (const [key, rowMovement] of [
+        [moveRowCommand.key, true],
+        [moveColCommand.key, false],
+    ]) {
+        commands.remove(key);
+        commands.create(key, (options = {}) => () => {
+            const view = ctx.get(editorViewCtx);
+            if (!canEdit() ||
+                !view.editable ||
+                view.composing ||
+                !isInTable(view.state))
+                return false;
+            const rect = selectedRect(view.state);
+            const from = options.from ?? 0, to = options.to ?? 0;
+            const length = rowMovement ? rect.map.height : rect.map.width;
+            if (!editableTable(rect.table) ||
+                (options.pos != null && options.pos !== rect.tableStart) ||
+                !Number.isInteger(from) ||
+                !Number.isInteger(to) ||
+                from < 0 ||
+                to < 0 ||
+                from >= length ||
+                to >= length ||
+                from === to ||
+                (rowMovement && (from === 0 || to === 0)))
+                return false;
+            const rows = [];
+            rect.table.forEach((row) => rows.push(row));
+            if (rowMovement) {
+                const moved = rows.splice(from, 1)[0];
+                rows.splice(to, 0, moved);
+            }
+            else {
+                for (let index = 0; index < rows.length; index++) {
+                    const row = rows[index], cells = [];
+                    row.forEach((cell) => cells.push(cell));
+                    cells.splice(to, 0, cells.splice(from, 1)[0]);
+                    rows[index] = row.copy(Fragment.fromArray(cells));
+                }
+            }
+            const table = rect.table.copy(Fragment.fromArray(rows));
+            const tr = view.state.tr.replaceWith(rect.tableStart - 1, rect.tableStart - 1 + rect.table.nodeSize, table);
+            selectTableRectangle(tr, rect.tableStart, table, rowMovement ? to : 0, rowMovement ? 0 : to, rowMovement ? to + 1 : rect.map.height, rowMovement ? rect.map.width : to + 1);
+            dispatchTableOperation(view, tr);
+            return true;
+        });
+    }
+}
+export function editableTable(table) {
+    const map = TableMap.get(table);
+    if (map.problems?.length || map.width > 100 || map.height > 100)
+        return false;
+    let valid = table.firstChild?.type.name === 'table_header_row';
+    table.forEach((row, _offset, index) => {
+        valid &&= row.type.name === (index ? 'table_row' : 'table_header_row');
+        valid &&= row.childCount === map.width;
+        row.forEach((cell) => {
+            valid &&= cell.attrs.colspan === 1 && cell.attrs.rowspan === 1;
+        });
+    });
+    return Boolean(valid);
+}
+function refineTable(view, command, options) {
+    if (!isInTable(view.state))
+        return false;
+    const rect = selectedRect(view.state);
+    if (!editableTable(rect.table))
+        return false;
+    const rows = [];
+    rect.table.forEach((row) => rows.push(row));
+    let top = rect.top, bottom = rect.bottom, left = rect.left, right = rect.right;
+    if (command === 'sortRows') {
+        const column = options?.column ?? rect.left;
+        if (!Number.isInteger(column) || column < 0 || column >= rect.map.width)
+            throw new RangeError('Sort column must identify an existing table column');
+        const order = options?.order ?? 'ascending';
+        const comparison = options?.comparison ?? 'text';
+        if (!['ascending', 'descending'].includes(order))
+            throw new RangeError('Sort order must be ascending or descending');
+        if (!['text', 'number'].includes(comparison))
+            throw new RangeError('Sort comparison must be text or number');
+        const body = rows.slice(1).map((row, index) => ({
+            row,
+            index,
+            key: clipboardText(row.child(column).content),
+        }));
+        if (comparison === 'number' &&
+            body.some(({ key }) => {
+                const value = key.trim();
+                return value !== '' && decimalNumber(value) === undefined;
+            }))
+            throw new RangeError('Numeric sorting requires finite decimal values or blank cells');
+        body.sort((a, b) => compareCells(a.key, b.key, comparison, order) || a.index - b.index);
+        if (body.every(({ row }, index) => row === rows[index + 1]))
+            return false;
+        const activeIndex = top - 1;
+        rows.splice(1, rows.length - 1, ...body.map(({ row }) => row));
+        top =
+            top === 0 ? 0 : body.findIndex(({ index }) => index === activeIndex) + 1;
+        bottom = top + 1;
+    }
+    else if (command === 'moveRowUp' || command === 'moveRowDown') {
+        const up = command === 'moveRowUp';
+        if (top === 0 || (up ? top === 1 : bottom === rows.length))
+            return false;
+        const moved = rows.splice(top, bottom - top);
+        const destination = top + (up ? -1 : 1);
+        rows.splice(destination, 0, ...moved);
+        top = destination;
+        bottom += up ? -1 : 1;
+    }
+    else {
+        const backward = command === 'moveColumnLeft';
+        if (backward ? left === 0 : right === rect.map.width)
+            return false;
+        for (let index = 0; index < rows.length; index++) {
+            const row = rows[index];
+            const cells = [];
+            row.forEach((cell) => cells.push(cell));
+            const moved = cells.splice(left, right - left);
+            cells.splice(left + (backward ? -1 : 1), 0, ...moved);
+            rows[index] = row.copy(Fragment.fromArray(cells));
+        }
+        left += backward ? -1 : 1;
+        right += backward ? -1 : 1;
+    }
+    const table = rect.table.copy(Fragment.fromArray(rows));
+    const tr = view.state.tr.replaceWith(rect.tableStart - 1, rect.tableStart - 1 + rect.table.nodeSize, table);
+    selectTableRectangle(tr, rect.tableStart, table, top, left, bottom, right);
+    dispatchTableOperation(view, tr);
+    return true;
+}
+export function selectTableRectangle(tr, tableStart, table, top, left, bottom, right) {
+    const map = TableMap.get(table);
+    tr.setSelection(CellSelection.create(tr.doc, tableStart + map.map[top * map.width + left], tableStart + map.map[(bottom - 1) * map.width + right - 1]));
+}
+function compareCells(a, b, comparison, order) {
+    const x = a.trim(), y = b.trim();
+    if (!x || !y)
+        return x === y ? 0 : x ? -1 : 1;
+    const direction = order === 'ascending' ? 1 : -1;
+    const text = (a, b) => (a < b ? -1 : a > b ? 1 : 0);
+    if (comparison === 'text')
+        return direction * text(a, b);
+    const nx = decimalNumber(x), ny = decimalNumber(y);
+    return direction * (nx < ny ? -1 : nx > ny ? 1 : 0);
+}
+function decimalNumber(value) {
+    return /^[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:[eE][+-]?\d+)?$/.test(value) &&
+        Number.isFinite(Number(value))
+        ? Number(value)
+        : undefined;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aicayzer/inkkit",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "description": "A preserving Markdown editor for offline web views and the web",
   "license": "MIT",
   "type": "module",