@esportsplus/ui 0.56.4 → 0.57.0

package/build/components/editor/diffs/view.js

@@ -0,0 +1,363 @@
+import * as reactivity_u0 from '@esportsplus/reactivity';
+import { untrack } from '@esportsplus/reactivity';
+import * as template_u1 from '@esportsplus/template';
+import { component } from '@esportsplus/template';
+import icon from '../../icon/index.js';
+import { languageFor } from '../code/syntax.js';
+import { diffTexts, hunks } from './hunks.js';
+import { highlighter, markup } from './render.js';
+import { words } from './words.js';
+import down from '@esportsplus/ui/svg/arrow-down.svg';
+import up from '@esportsplus/ui/svg/arrow-up.svg';
+import expand from '@esportsplus/ui/svg/chevrons-up-down.svg';
+const template_1uiklwm2 = template_u1.template(`<span class='diffs-actions'><!--$-->`);
+const template_1uiklwm6 = template_u1.template(`<button class='diffs-action' type='button'>Revert`);
+const template_1uiklwm9 = template_u1.template(`<button class='diffs-action' type='button'>Accept`);
+const template_1uiklwmb = template_u1.template(`<div class='diffs-cell diffs-cell--empty'><span class='diffs-number'></span><code class='diffs-code'>`);
+const template_1uiklwmd = template_u1.template(`<div class='diffs-cell '><span class='diffs-number'></span><code class='diffs-code'>`);
+const template_1uiklwmi = template_u1.template(`<div class='diffs-row diffs-row--gap'><button class='diffs-gap' type='button'><!--$-->`);
+const template_1uiklwmm = template_u1.template(`<div class='diffs-row diffs-row--split  '><!--$--><!--$-->`);
+const template_1uiklwmr = template_u1.template(`<div class='diffs-row diffs-row--unified  '><span class='diffs-number'></span><span class='diffs-number'></span><span aria-hidden='true' class='diffs-sign'></span><code class='diffs-code'>`);
+const template_1uiklwmy = template_u1.template(`<div class='diffs'><div class='diffs-header'><!--$--><span class='diffs-stats'><span class='diffs-stat diffs-stat--additions'></span><span class='diffs-stat diffs-stat--deletions'></span></span><span aria-live='polite' class='diffs-position'></span><div class='diffs-controls'><div aria-label='View' class='diffs-modes' role='group'></div><button aria-label='Previous change (Shift+Alt+F5)' class='diffs-button' title='Previous change (Shift+Alt+F5)' type='button'></button><button aria-label='Next change (Alt+F5)' class='diffs-button' title='Next change (Alt+F5)' type='button'></button></div></div><div class='diffs-scroller --scrollbar' tabindex='0'>`);
+const template_1uiklwm19 = template_u1.template(`<span class='diffs-filename'>`);
+const template_1uiklwm1c = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'> Split `);
+const template_1uiklwm1f = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'> Unified `);
+const template_1uiklwm1i = template_u1.template(`<button class='diffs-button diffs-button--text' type='button'>`);
+class ReactiveObject_1uiklwm0 extends reactivity_u0.ReactiveObject {
+    #additions = this[reactivity_u0.SIGNAL](0);
+    #changes = this[reactivity_u0.SIGNAL](0);
+    #current = this[reactivity_u0.SIGNAL](-1);
+    #deletions = this[reactivity_u0.SIGNAL](0);
+    #digits = this[reactivity_u0.SIGNAL](1);
+    #mode;
+    constructor(_p0) {
+        super(null);
+        this.#mode = this[reactivity_u0.SIGNAL](_p0);
+    }
+    get additions() {
+        return reactivity_u0.read(this.#additions);
+    }
+    set additions(_v0) {
+        reactivity_u0.write(this.#additions, _v0);
+    }
+    get changes() {
+        return reactivity_u0.read(this.#changes);
+    }
+    set changes(_v1) {
+        reactivity_u0.write(this.#changes, _v1);
+    }
+    get current() {
+        return reactivity_u0.read(this.#current);
+    }
+    set current(_v2) {
+        reactivity_u0.write(this.#current, _v2);
+    }
+    get deletions() {
+        return reactivity_u0.read(this.#deletions);
+    }
+    set deletions(_v3) {
+        reactivity_u0.write(this.#deletions, _v3);
+    }
+    get digits() {
+        return reactivity_u0.read(this.#digits);
+    }
+    set digits(_v4) {
+        reactivity_u0.write(this.#digits, _v4);
+    }
+    get mode() {
+        return reactivity_u0.read(this.#mode);
+    }
+    set mode(_v5) {
+        reactivity_u0.write(this.#mode, _v5);
+    }
+}
+const CHUNK = 4096;
+const KIND = {
+    modified: 'diffs-word diffs-word--insert',
+    original: 'diffs-word diffs-word--delete'
+};
+function plural(count, word) {
+    return `${count} ${word}${count === 1 ? '' : 's'}`;
+}
+export default component(function (input) {
+    let { context = 3, controller: receive, filename, ignoreWhitespace = false, language, mode: initial = 'split', modified, onaccept, onrevert, original, wordDiff = true, ...attributes } = untrack(() => ({ ...this?.attributes, ...input })), diff, expanded = new Set(), items = new reactivity_u0.ReactiveArray(), lexers, mode = initial, starts = [], ui = new ReactiveObject_1uiklwm0(initial), controller = {
+        next: () => move(1),
+        previous: () => move(-1),
+        setMode: (next) => {
+            if (next === mode) {
+                return;
+            }
+            mode = next;
+            ui.mode = next;
+            build();
+        },
+        setTexts: (a, b) => {
+            original = a;
+            modified = b;
+            compute();
+        },
+        state: ui
+    }, slot;
+    language ??= languageFor(filename);
+    function actions(change) {
+        if (!onaccept && !onrevert) {
+            return '';
+        }
+        return (() => {
+            let root_1uiklwm1 = template_1uiklwm2(), element_1uiklwm3 = root_1uiklwm1.firstChild.firstChild, element_1uiklwm4 = root_1uiklwm1.firstChild;
+            template_u1.slot(element_1uiklwm3, onrevert && (() => {
+                let root_1uiklwm5 = template_1uiklwm6(), element_1uiklwm7 = root_1uiklwm5.firstChild;
+                template_u1.setProperty(element_1uiklwm7, 'aria-label', template_u1.interpolate(["Revert change ", (change + 1)]));
+                template_u1.delegate(element_1uiklwm7, 'click', () => onrevert(diff.changes[change]));
+                return root_1uiklwm5;
+            })());
+            template_u1.slot(element_1uiklwm4, onaccept && (() => {
+                let root_1uiklwm8 = template_1uiklwm9(), element_1uiklwma = root_1uiklwm8.firstChild;
+                template_u1.setProperty(element_1uiklwma, 'aria-label', template_u1.interpolate(["Accept change ", (change + 1)]));
+                template_u1.delegate(element_1uiklwma, 'click', () => onaccept(diff.changes[change]));
+                return root_1uiklwm8;
+            })(), 2);
+            return root_1uiklwm1;
+        })();
+    }
+    function build() {
+        let { gaps } = hunks(diff, context), next = [], at = 0;
+        for (let i = 0, n = gaps.length; i < n; i++) {
+            let { from, to } = gaps[i];
+            rows(at, from, next);
+            if (expanded.has(from)) {
+                rows(from, to, next);
+            }
+            else {
+                next.push({ from, kind: 'gap', to });
+            }
+            at = to;
+        }
+        rows(at, diff.rows.length, next);
+        replace(0, items.$length, next);
+    }
+    function cell(item, side) {
+        let value = side === 'original' ? item.left : item.right;
+        if (!value) {
+            return template_1uiklwmb();
+        }
+        return (() => {
+            let root_1uiklwmc = template_1uiklwmd(), element_1uiklwme = root_1uiklwmc.firstChild, element_1uiklwmf = element_1uiklwme.firstElementChild, element_1uiklwmg = element_1uiklwmf.nextElementSibling;
+            template_u1.slot(element_1uiklwmf, value.line + 1, 1);
+            template_u1.setProperty(element_1uiklwmg, 'innerHTML', code(value, side, item.change >= 0));
+            template_u1.setList(element_1uiklwme, 'class', item.change < 0 ? 'diffs-cell--equal' : side === 'original' ? 'diffs-cell--delete' : 'diffs-cell--insert');
+            return root_1uiklwmc;
+        })();
+    }
+    function code(value, side, changed) {
+        let text = diff[side][value.line], marks = null;
+        if (changed && wordDiff && value.partner !== null) {
+            marks = side === 'original'
+                ? words(text, diff.modified[value.partner], ignoreWhitespace)
+                : words(diff.original[value.partner], text, ignoreWhitespace);
+        }
+        return markup(text, lexers[side](value.line), marks ? marks[side] : [], KIND[side]);
+    }
+    function compute() {
+        diff = diffTexts(original, modified, { ignoreWhitespace });
+        expanded.clear();
+        lexers = {
+            modified: highlighter(diff.modified, language),
+            original: highlighter(diff.original, language)
+        };
+        ui.additions = diff.additions;
+        ui.changes = diff.changes.length;
+        ui.current = -1;
+        ui.deletions = diff.deletions;
+        ui.digits = String(Math.max(diff.original.length, diff.modified.length)).length;
+        build();
+    }
+    function gap(item) {
+        let count = item.to - item.from;
+        return (() => {
+            let root_1uiklwmh = template_1uiklwmi(), element_1uiklwmj = root_1uiklwmh.firstChild.firstElementChild, element_1uiklwmk = element_1uiklwmj.firstChild;
+            template_u1.slot(element_1uiklwmk, icon({ 'aria-hidden': 'true', class: 'diffs-gap-icon' }, expand));
+            template_u1.slot(element_1uiklwmj, plural(count, 'hidden line'), 2);
+            template_u1.delegate(element_1uiklwmj, 'click', () => {
+                let at = items.indexOf(item), next = [];
+                if (at < 0) {
+                    return;
+                }
+                expanded.add(item.from);
+                rows(item.from, item.to, next);
+                replace(at, 1, next);
+            });
+            return root_1uiklwmh;
+        })();
+    }
+    function line(item) {
+        let type = item.change < 0 ? 'equal' : item.left ? 'delete' : 'insert';
+        if (mode === 'split') {
+            return (() => {
+                let root_1uiklwml = template_1uiklwmm(), element_1uiklwmn = root_1uiklwml.firstChild, element_1uiklwmo = element_1uiklwmn.firstChild, element_1uiklwmp = element_1uiklwmo.nextSibling;
+                template_u1.slot(element_1uiklwmo, cell(item, 'original'));
+                template_u1.slot(element_1uiklwmp, cell(item, 'modified'));
+                template_u1.slot(element_1uiklwmn, item.lead && actions(item.change), 2);
+                template_u1.setList(element_1uiklwmn, 'class', item.change >= 0 && 'diffs-row--change');
+                template_u1.setList(element_1uiklwmn, 'class', item.lead && 'diffs-row--lead');
+                template_u1.setList(element_1uiklwmn, 'class', () => item.change >= 0 && ui.current === item.change && '--active');
+                return root_1uiklwml;
+            })();
+        }
+        let side = item.right ? 'modified' : 'original', value = (item.right ?? item.left);
+        return (() => {
+            let root_1uiklwmq = template_1uiklwmr(), element_1uiklwms = root_1uiklwmq.firstChild, element_1uiklwmt = element_1uiklwms.firstElementChild, element_1uiklwmu = element_1uiklwmt.nextElementSibling, element_1uiklwmv = element_1uiklwmu.nextElementSibling, element_1uiklwmw = element_1uiklwmv.nextElementSibling;
+            template_u1.slot(element_1uiklwmt, item.left ? item.left.line + 1 : '', 1);
+            template_u1.slot(element_1uiklwmu, item.right ? item.right.line + 1 : '', 1);
+            element_1uiklwmv.appendChild(template_u1.text(type === 'delete' ? '-' : type === 'insert' ? '+' : ''));
+            template_u1.slot(element_1uiklwms, item.lead && actions(item.change), 2);
+            template_u1.setProperty(element_1uiklwmw, 'innerHTML', code(value, side, item.change >= 0));
+            template_u1.setList(element_1uiklwms, 'class', template_u1.interpolate(["diffs-row--", (type)]));
+            template_u1.setList(element_1uiklwms, 'class', item.lead && 'diffs-row--lead');
+            template_u1.setList(element_1uiklwms, 'class', () => item.change >= 0 && ui.current === item.change && '--active');
+            return root_1uiklwmq;
+        })();
+    }
+    function move(direction) {
+        let count = diff.changes.length;
+        if (!count) {
+            return false;
+        }
+        let current = ui.current < 0
+            ? (direction > 0 ? 0 : count - 1)
+            : (ui.current + direction + count) % count;
+        ui.current = current;
+        slot.scrollTo(starts[current], 'center');
+        return true;
+    }
+    function replace(at, count, next) {
+        items.splice(at, count, ...next.slice(0, CHUNK));
+        for (let i = CHUNK, n = next.length; i < n; i += CHUNK) {
+            items.splice(at + i, 0, ...next.slice(i, i + CHUNK));
+        }
+        starts = new Array(diff.changes.length).fill(0);
+        for (let i = 0, n = items.$length; i < n; i++) {
+            let item = items[i];
+            if (item.kind === 'line' && item.lead) {
+                starts[item.change] = i;
+            }
+        }
+    }
+    function rows(from, to, out) {
+        let list = diff.rows;
+        for (let i = from; i < to;) {
+            let row = list[i];
+            if (row.type === 'equal') {
+                out.push({
+                    change: -1,
+                    kind: 'line',
+                    lead: false,
+                    left: { line: row.original, partner: null },
+                    right: { line: row.modified, partner: null }
+                });
+                i++;
+                continue;
+            }
+            let change = changeAt(i), deletes = [], inserts = [];
+            for (let r = change.rows.from; r < change.rows.to; r++) {
+                if (list[r].type === 'delete') {
+                    deletes.push(list[r].original);
+                }
+                else {
+                    inserts.push(list[r].modified);
+                }
+            }
+            if (mode === 'split') {
+                for (let p = 0, n = Math.max(deletes.length, inserts.length); p < n; p++) {
+                    out.push({
+                        change: change.index,
+                        kind: 'line',
+                        lead: p === 0,
+                        left: p < deletes.length ? { line: deletes[p], partner: inserts[p] ?? null } : null,
+                        right: p < inserts.length ? { line: inserts[p], partner: deletes[p] ?? null } : null
+                    });
+                }
+            }
+            else {
+                for (let p = 0, n = deletes.length; p < n; p++) {
+                    out.push({ change: change.index, kind: 'line', lead: p === 0, left: { line: deletes[p], partner: inserts[p] ?? null }, right: null });
+                }
+                for (let p = 0, n = inserts.length; p < n; p++) {
+                    out.push({ change: change.index, kind: 'line', lead: p === 0 && !deletes.length, left: null, right: { line: inserts[p], partner: deletes[p] ?? null } });
+                }
+            }
+            i = change.rows.to;
+        }
+    }
+    function changeAt(row) {
+        let list = diff.changes, hi = list.length - 1, lo = 0;
+        while (lo < hi) {
+            let mid = (lo + hi) >>> 1;
+            if (list[mid].rows.to <= row) {
+                lo = mid + 1;
+            }
+            else {
+                hi = mid;
+            }
+        }
+        return list[lo];
+    }
+    compute();
+    slot = new template_u1.VirtualSlot(items, (item) => item.kind === 'gap' ? gap(item) : line(item));
+    return (() => {
+        let root_1uiklwmx = template_1uiklwmy(), element_1uiklwmz = root_1uiklwmx.firstChild, element_1uiklwm10 = element_1uiklwmz.firstElementChild.firstChild, element_1uiklwm11 = element_1uiklwmz.firstElementChild.firstElementChild.firstElementChild, element_1uiklwm12 = element_1uiklwm11.nextElementSibling, element_1uiklwm13 = element_1uiklwmz.firstElementChild.firstElementChild.nextElementSibling, element_1uiklwm14 = element_1uiklwm13.nextElementSibling.firstElementChild, element_1uiklwm15 = element_1uiklwm14.nextElementSibling, element_1uiklwm16 = element_1uiklwm15.nextElementSibling, element_1uiklwm17 = element_1uiklwmz.firstElementChild.nextElementSibling;
+        template_u1.slot(element_1uiklwm10, filename && (() => {
+            let root_1uiklwm18 = template_1uiklwm19(), element_1uiklwm1a = root_1uiklwm18.firstChild;
+            template_u1.slot(element_1uiklwm1a, filename, 1);
+            template_u1.setProperty(element_1uiklwm1a, 'title', filename);
+            return root_1uiklwm18;
+        })());
+        new template_u1.EffectSlot(element_1uiklwm11, () => `+${ui.additions}`, 1);
+        new template_u1.EffectSlot(element_1uiklwm12, () => `−${ui.deletions}`, 1);
+        new template_u1.EffectSlot(element_1uiklwm13, () => {
+            if (!ui.changes) {
+                return 'No changes';
+            }
+            return ui.current < 0 ? plural(ui.changes, 'change') : `${ui.current + 1} of ${ui.changes}`;
+        }, 1);
+        template_u1.slot(element_1uiklwm14, ['split', 'unified'].map((value) => (value === "split" ? (() => {
+            let root_1uiklwm1b = template_1uiklwm1c(), element_1uiklwm1d = root_1uiklwm1b.firstChild;
+            template_u1.setProperty(element_1uiklwm1d, 'aria-pressed', () => ui.mode === value ? 'true' : 'false');
+            template_u1.setList(element_1uiklwm1d, 'class', () => ui.mode === value && '--active');
+            template_u1.delegate(element_1uiklwm1d, 'click', () => controller.setMode(value));
+            return root_1uiklwm1b;
+        })() : value === "unified" ? (() => {
+            let root_1uiklwm1e = template_1uiklwm1f(), element_1uiklwm1g = root_1uiklwm1e.firstChild;
+            template_u1.setProperty(element_1uiklwm1g, 'aria-pressed', () => ui.mode === value ? 'true' : 'false');
+            template_u1.setList(element_1uiklwm1g, 'class', () => ui.mode === value && '--active');
+            template_u1.delegate(element_1uiklwm1g, 'click', () => controller.setMode(value));
+            return root_1uiklwm1e;
+        })() : (() => {
+            let root_1uiklwm1h = template_1uiklwm1i(), element_1uiklwm1j = root_1uiklwm1h.firstChild;
+            element_1uiklwm1j.appendChild(template_u1.text(value === 'split' ? 'Split' : 'Unified'));
+            template_u1.setProperty(element_1uiklwm1j, 'aria-pressed', () => ui.mode === value ? 'true' : 'false');
+            template_u1.setList(element_1uiklwm1j, 'class', () => ui.mode === value && '--active');
+            template_u1.delegate(element_1uiklwm1j, 'click', () => controller.setMode(value));
+            return root_1uiklwm1h;
+        })())), 1);
+        template_u1.slot(element_1uiklwm15, icon({ 'aria-hidden': 'true', class: 'diffs-button-icon' }, up), 1);
+        template_u1.slot(element_1uiklwm16, icon({ 'aria-hidden': 'true', class: 'diffs-button-icon' }, down), 1);
+        template_u1.slot(element_1uiklwm17, slot.fragment, 1);
+        template_u1.setProperty(element_1uiklwm16, 'disabled', () => !ui.changes);
+        template_u1.delegate(element_1uiklwm16, 'click', () => move(1));
+        template_u1.setProperty(element_1uiklwm15, 'disabled', () => !ui.changes);
+        template_u1.delegate(element_1uiklwm15, 'click', () => move(-1));
+        template_u1.setProperties(element_1uiklwmz, attributes);
+        template_u1.setList(element_1uiklwmz, 'class', () => `diffs--${ui.mode}`);
+        template_u1.onconnect(element_1uiklwmz, () => receive?.(controller));
+        template_u1.delegate(element_1uiklwmz, 'keydown', (e) => {
+            if (e.key !== 'F5' || !e.altKey || e.ctrlKey || e.metaKey) {
+                return;
+            }
+            e.preventDefault();
+            move(e.shiftKey ? -1 : 1);
+        });
+        template_u1.setList(element_1uiklwmz, 'style', () => `--digits: ${ui.digits};`);
+        return root_1uiklwmx;
+    })();
+});

package/build/components/editor/diffs/words.d.ts

@@ -0,0 +1,8 @@
+import { type Range } from './engine.js';
+type Words = {
+    modified: Range[];
+    original: Range[];
+};
+declare const words: (original: string, modified: string, ignoreWhitespace?: boolean) => Words | null;
+export { words };
+export type { Words };

package/build/components/editor/diffs/words.js

@@ -0,0 +1,47 @@
+import { diffSequences } from './engine.js';
+const MAX = 2000;
+const SPACE = /^\s+$/;
+const TOKEN = /\w+|\s+|[^\w\s]/g;
+function blank(token) {
+    return SPACE.test(token.text);
+}
+function mark(out, text, token) {
+    let last = out[out.length - 1];
+    if (last && (last.to === token.from || SPACE.test(text.slice(last.to, token.from)))) {
+        last.to = token.to;
+        return;
+    }
+    out.push({ from: token.from, to: token.to });
+}
+function tokenize(text) {
+    let out = [];
+    for (let match of text.matchAll(TOKEN)) {
+        out.push({ from: match.index, text: match[0], to: match.index + match[0].length });
+    }
+    return out;
+}
+const words = (original, modified, ignoreWhitespace = false) => {
+    if (original.length > MAX || modified.length > MAX) {
+        return null;
+    }
+    let a = tokenize(original), b = tokenize(modified), ops = diffSequences(a, b, (x, y) => x.text === y.text || (ignoreWhitespace && blank(x) && blank(y))), out = { modified: [], original: [] }, shared = false;
+    for (let i = 0, n = ops.length; i < n; i++) {
+        let op = ops[i];
+        if (op.type === 'equal') {
+            shared ||= !blank(a[op.a]);
+            continue;
+        }
+        let token = op.type === 'delete' ? a[op.a] : b[op.b];
+        if (ignoreWhitespace && blank(token)) {
+            continue;
+        }
+        if (op.type === 'delete') {
+            mark(out.original, original, token);
+        }
+        else {
+            mark(out.modified, modified, token);
+        }
+    }
+    return shared ? out : null;
+};
+export { words };

package/build/components/editor/index.d.ts

@@ -0,0 +1,21 @@
+import code from './code/index.js';
+import diffs from './diffs/index.js';
+import markdown from './markdown/index.js';
+import tree from './tree/index.js';
+import workspace from './workspace/index.js';
+declare const editor: {
+    code: typeof code;
+    diffs: typeof diffs;
+    markdown: typeof markdown;
+    tree: typeof tree;
+    workspace: typeof workspace;
+};
+export default editor;
+export * from './code/index.js';
+export { acceptChange, conflictMarkers, diff3, diffTexts, hunks, resolveMarker, revertChange, words } from './diffs/index.js';
+export { createFileTreeIconResolver, FileTreeDecorations, FileTreeEditor, FileTreeElements, FileTreeHistory, fileTreeIcon, resolveFileTreeIcon } from './tree/index.js';
+export { EditorWorkspaceModel, isWorkspaceCodeEditor } from './workspace/index.js';
+export type { ConflictMarker, DiffChange, DiffsAttributes, DiffsController, DiffsState, Hunk, MergeAttributes, MergeChoice, MergeRegion, MergeResult } from './diffs/index.js';
+export type { MarkdownController, MarkdownEditorAttributes, MarkdownOptions } from './markdown/index.js';
+export type * from './tree/index.js';
+export type { CodeEditorWorkspaceAttributes, CodeEditorWorkspaceController, WorkspaceAction, WorkspaceConfirmation, WorkspaceDecision, WorkspaceEditor, WorkspaceEditorAttributes, WorkspaceEditorContext, WorkspaceEditorController, WorkspaceEntry, WorkspaceHost, WorkspacePreferences, WorkspaceTab, WorkspaceTarget } from './workspace/index.js';

package/build/components/editor/index.js

@@ -0,0 +1,11 @@
+import code from './code/index.js';
+import diffs from './diffs/index.js';
+import markdown from './markdown/index.js';
+import tree from './tree/index.js';
+import workspace from './workspace/index.js';
+const editor = { code, diffs, markdown, tree, workspace };
+export default editor;
+export * from './code/index.js';
+export { acceptChange, conflictMarkers, diff3, diffTexts, hunks, resolveMarker, revertChange, words } from './diffs/index.js';
+export { createFileTreeIconResolver, FileTreeDecorations, FileTreeEditor, FileTreeElements, FileTreeHistory, fileTreeIcon, resolveFileTreeIcon } from './tree/index.js';
+export { EditorWorkspaceModel, isWorkspaceCodeEditor } from './workspace/index.js';

package/build/components/editor/markdown/editing.d.ts

@@ -0,0 +1,7 @@
+import { EditorDocument } from '../code/document.js';
+import { type Kind } from './model.js';
+type Command = 'backspace' | 'bold' | 'enter' | 'italic';
+type KindAt = (offset: number) => Kind | undefined;
+declare const markdownCommand: (document: EditorDocument, command: Command, kind?: KindAt) => boolean;
+export { markdownCommand };
+export type { Command, KindAt };

package/build/components/editor/markdown/editing.js

@@ -0,0 +1,55 @@
+import { deleteCharacter } from '../code/commands.js';
+import { EditorDocument } from '../code/document.js';
+import { markdownBackspace, markdownEnter, toggleMarkdown } from './model.js';
+function run(document, command, kind) {
+    if (command === 'bold' || command === 'italic') {
+        return toggleMarkdown(document, command === 'bold' ? '**' : '*');
+    }
+    if (command === 'backspace') {
+        return markdownBackspace(document) || deleteCharacter(document, true);
+    }
+    if (markdownEnter(document, kind?.(document.selection.start))) {
+        return true;
+    }
+    let { end, start } = document.selection, eol = document.eol;
+    return document.replace(start, end, eol, { selection: { start: start + eol.length }, source: 'markdown-enter' });
+}
+const markdownCommand = (document, command, kind) => {
+    let ranges = document.selections;
+    if (ranges.length === 1) {
+        return run(document, command, kind);
+    }
+    let carets = [], edits = [];
+    for (let i = 0, n = ranges.length; i < n; i++) {
+        let batches = [], local = new EditorDocument(document.value);
+        local.select(ranges[i]);
+        let stop = local.subscribe((_, change) => {
+            if (change.editBatches) {
+                batches = change.editBatches;
+            }
+        }), accepted = run(local, command, kind);
+        stop();
+        if (!accepted && command !== 'backspace') {
+            return false;
+        }
+        let batch = batches.flat();
+        for (let j = 0, m = batch.length; j < m; j++) {
+            edits.push(batch[j]);
+        }
+        carets.push({ from: batch[0]?.from ?? ranges[i].start, selection: local.selection });
+    }
+    if (!edits.length) {
+        return false;
+    }
+    let selections = carets.map(({ from, selection }) => {
+        let shift = 0;
+        for (let i = 0, n = edits.length; i < n; i++) {
+            if (edits[i].to <= from && edits[i].from < from) {
+                shift += edits[i].insert.length - (edits[i].to - edits[i].from);
+            }
+        }
+        return { ...selection, end: selection.end + shift, start: selection.start + shift };
+    });
+    return document.transact(edits, { selections, source: `markdown-${command}` }).changed;
+};
+export { markdownCommand };

package/build/components/editor/markdown/html.d.ts

@@ -0,0 +1,24 @@
+type SafeAttributes = {
+    alt?: string;
+    href?: string;
+    src?: string;
+    title?: string;
+};
+type SafeElement = {
+    attributes: SafeAttributes;
+    children: SafeNode[];
+    tag: Tag;
+};
+type SafeNode = SafeElement | string;
+type Source = {
+    childNodes: ArrayLike<Source>;
+    getAttribute?: (name: string) => string | null;
+    localName?: string;
+    nodeType: number;
+    textContent: string | null;
+};
+type Tag = 'a' | 'blockquote' | 'br' | 'code' | 'details' | 'div' | 'em' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'hr' | 'img' | 'li' | 'ol' | 'p' | 'pre' | 's' | 'span' | 'strong' | 'sub' | 'summary' | 'sup' | 'table' | 'tbody' | 'td' | 'th' | 'thead' | 'tr' | 'ul';
+declare const sanitize: (source: Source) => SafeNode[];
+declare const sanitizeHtml: (html: string, parser: DOMParser) => SafeNode[];
+export { sanitize, sanitizeHtml };
+export type { SafeElement, SafeNode, Source, Tag };

package/build/components/editor/markdown/html.js

@@ -0,0 +1,108 @@
+import { safeUrl } from './inline.js';
+const ALLOWED = {
+    a: 'a',
+    b: 'strong',
+    blockquote: 'blockquote',
+    br: 'br',
+    code: 'code',
+    del: 's',
+    details: 'details',
+    div: 'div',
+    em: 'em',
+    h1: 'h1',
+    h2: 'h2',
+    h3: 'h3',
+    h4: 'h4',
+    h5: 'h5',
+    h6: 'h6',
+    hr: 'hr',
+    i: 'em',
+    img: 'img',
+    li: 'li',
+    ol: 'ol',
+    p: 'p',
+    pre: 'pre',
+    s: 's',
+    span: 'span',
+    strong: 'strong',
+    sub: 'sub',
+    summary: 'summary',
+    sup: 'sup',
+    table: 'table',
+    tbody: 'tbody',
+    td: 'td',
+    th: 'th',
+    thead: 'thead',
+    tr: 'tr',
+    ul: 'ul'
+};
+const DISCARD = new Set([
+    'base',
+    'button',
+    'embed',
+    'form',
+    'iframe',
+    'input',
+    'link',
+    'math',
+    'meta',
+    'noscript',
+    'object',
+    'script',
+    'select',
+    'style',
+    'svg',
+    'template',
+    'textarea'
+]);
+const MAX_DEPTH = 40;
+function children(source, depth, out) {
+    let nodes = source.childNodes;
+    for (let i = 0, n = nodes.length; i < n; i++) {
+        project(nodes[i], depth, out);
+    }
+    return out;
+}
+function project(source, depth, out) {
+    if (depth > MAX_DEPTH) {
+        return;
+    }
+    if (source.nodeType === 3) {
+        out.push(source.textContent ?? '');
+        return;
+    }
+    if (source.nodeType !== 1) {
+        return;
+    }
+    let name = (source.localName ?? '').toLowerCase(), tag = ALLOWED[name];
+    if (DISCARD.has(name)) {
+        return;
+    }
+    if (!tag) {
+        children(source, depth + 1, out);
+        return;
+    }
+    let attributes = {}, title = source.getAttribute?.('title');
+    if (title) {
+        attributes.title = title;
+    }
+    if (tag === 'a') {
+        let href = safeUrl(source.getAttribute?.('href') ?? '');
+        if (href) {
+            attributes.href = href;
+        }
+    }
+    else if (tag === 'img') {
+        let alt = source.getAttribute?.('alt') ?? '', src = safeUrl(source.getAttribute?.('src') ?? '', true);
+        if (!src) {
+            out.push(alt);
+            return;
+        }
+        attributes.alt = alt;
+        attributes.src = src;
+    }
+    out.push({ attributes, children: tag === 'br' || tag === 'hr' || tag === 'img' ? [] : children(source, depth + 1, []), tag });
+}
+const sanitize = (source) => children(source, 0, []);
+const sanitizeHtml = (html, parser) => sanitize(parser.parseFromString(html, 'text/html').body);
+export { sanitize, sanitizeHtml };