@esportsplus/ui 0.56.4 → 0.57.0

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

@@ -0,0 +1,561 @@
+import * as reactivity_u0 from '@esportsplus/reactivity';
+import * as template_u1 from '@esportsplus/template';
+import { text } from '@esportsplus/template';
+import checkbox from '../../checkbox/index.js';
+import icon from '../../icon/index.js';
+import { sanitizeHtml } from './html.js';
+import { clipInline } from './inline.js';
+import chevron from '@esportsplus/ui/svg/chevron-down.svg';
+const template_1szz54a2 = template_u1.template(`<button aria-label='Unfold block' class='markdown-editor-chip' type='button'> … <!--$--> lines `);
+const template_1szz54a5 = template_u1.template(`<br>`);
+const template_1szz54a7 = template_u1.template(`<pre class='markdown-editor-pre'><code class='markdown-editor-code markdown-editor-code--block'>`);
+const template_1szz54aa = template_u1.template(`<span class='markdown-editor-frontmatter'> frontmatter · <!--$--> lines `);
+const template_1szz54ad = template_u1.template(`<span class='markdown-editor-marker'>`);
+const template_1szz54af = template_u1.template(`<hr class='markdown-editor-rule'>`);
+const template_1szz54ah = template_u1.template(`<code class='markdown-editor-code'>`);
+const template_1szz54ak = template_u1.template(`<em class='markdown-editor-em'>`);
+const template_1szz54an = template_u1.template(`<a class='markdown-editor-link' rel='noopener noreferrer'>`);
+const template_1szz54aq = template_u1.template(`<span class='markdown-editor-link'>`);
+const template_1szz54at = template_u1.template(`<s class='markdown-editor-strike'>`);
+const template_1szz54aw = template_u1.template(`<strong class='markdown-editor-strong'>`);
+const template_1szz54az = template_u1.template(`<div class='markdown-editor-block '><button class='markdown-editor-fold' tabindex='-1' type='button'>`);
+const template_1szz54a15 = template_u1.template(`<blockquote class='markdown-editor-quote'>`);
+const template_1szz54a1a = template_u1.template(`<details>`);
+const template_1szz54a1d = template_u1.template(`<div>`);
+const template_1szz54a1i = template_u1.template(`<h1 class='markdown-editor-heading markdown-editor-heading--h1'>`);
+const template_1szz54a1l = template_u1.template(`<h2 class='markdown-editor-heading markdown-editor-heading--h2'>`);
+const template_1szz54a1o = template_u1.template(`<h3 class='markdown-editor-heading markdown-editor-heading--h3'>`);
+const template_1szz54a1r = template_u1.template(`<h4 class='markdown-editor-heading markdown-editor-heading--h4'>`);
+const template_1szz54a1u = template_u1.template(`<h5 class='markdown-editor-heading markdown-editor-heading--h5'>`);
+const template_1szz54a1x = template_u1.template(`<h6 class='markdown-editor-heading markdown-editor-heading--h6'>`);
+const template_1szz54a20 = template_u1.template(`<img class='markdown-editor-image' loading='lazy'>`);
+const template_1szz54a23 = template_u1.template(`<li>`);
+const template_1szz54a26 = template_u1.template(`<ol class='markdown-editor-list'>`);
+const template_1szz54a29 = template_u1.template(`<p class='markdown-editor-paragraph'>`);
+const template_1szz54a2c = template_u1.template(`<pre class='markdown-editor-pre'>`);
+const template_1szz54a2h = template_u1.template(`<span>`);
+const template_1szz54a2m = template_u1.template(`<sub>`);
+const template_1szz54a2p = template_u1.template(`<summary class='markdown-editor-summary'><!--$-->`);
+const template_1szz54a2t = template_u1.template(`<sup>`);
+const template_1szz54a2w = template_u1.template(`<table class='markdown-editor-table'>`);
+const template_1szz54a2z = template_u1.template(`<tbody>`);
+const template_1szz54a32 = template_u1.template(`<td class='markdown-editor-cell'>`);
+const template_1szz54a35 = template_u1.template(`<th class='markdown-editor-cell markdown-editor-cell--head'>`);
+const template_1szz54a38 = template_u1.template(`<thead>`);
+const template_1szz54a3b = template_u1.template(`<tr>`);
+const template_1szz54a3e = template_u1.template(`<ul class='markdown-editor-list'>`);
+class ReactiveObject_1szz54a0 extends reactivity_u0.ReactiveObject {
+    #foldable;
+    constructor(_p0) {
+        super(null);
+        this.#foldable = this[reactivity_u0.SIGNAL](_p0);
+    }
+    get foldable() {
+        return reactivity_u0.read(this.#foldable);
+    }
+    set foldable(_v0) {
+        reactivity_u0.write(this.#foldable, _v0);
+    }
+}
+const EOL = /\r\n|\r|\n/;
+const ORDERED = /^\d/;
+let parser;
+function lines(text, from, to, base) {
+    let out = [];
+    for (let cursor = from; cursor <= to;) {
+        let end = cursor;
+        while (end < to && text.charCodeAt(end) !== 10 && text.charCodeAt(end) !== 13) {
+            end++;
+        }
+        out.push({ contentFrom: cursor - base, contentTo: end - base, from: cursor - base, to: end - base });
+        if (end >= to) {
+            break;
+        }
+        cursor = end + (text.charCodeAt(end) === 13 && text.charCodeAt(end + 1) === 10 ? 2 : 1);
+    }
+    return out;
+}
+function prevent(e) {
+    e.preventDefault();
+}
+function safe(nodes) {
+    let out = [];
+    for (let i = 0, n = nodes.length; i < n; i++) {
+        let node = nodes[i];
+        if (typeof node === 'string') {
+            out.push(node);
+            continue;
+        }
+        let { attributes, children } = node, content = safe(children);
+        switch (node.tag) {
+            case 'a':
+                out.push((() => {
+                    let root_1szz54a12 = template_1szz54an(), element_1szz54a13 = root_1szz54a12.firstChild;
+                    template_u1.slot(element_1szz54a13, content, 1);
+                    template_u1.setProperties(element_1szz54a13, attributes);
+                    return root_1szz54a12;
+                })());
+                break;
+            case 'blockquote':
+                out.push((() => {
+                    let root_1szz54a14 = template_1szz54a15(), element_1szz54a16 = root_1szz54a14.firstChild;
+                    template_u1.slot(element_1szz54a16, content, 1);
+                    template_u1.setProperties(element_1szz54a16, attributes);
+                    return root_1szz54a14;
+                })());
+                break;
+            case 'br':
+                out.push(template_1szz54a5());
+                break;
+            case 'code':
+                out.push((() => {
+                    let root_1szz54a17 = template_1szz54ah(), element_1szz54a18 = root_1szz54a17.firstChild;
+                    template_u1.slot(element_1szz54a18, content, 1);
+                    template_u1.setProperties(element_1szz54a18, attributes);
+                    return root_1szz54a17;
+                })());
+                break;
+            case 'details':
+                out.push((() => {
+                    let root_1szz54a19 = template_1szz54a1a(), element_1szz54a1b = root_1szz54a19.firstChild;
+                    template_u1.slot(element_1szz54a1b, content, 1);
+                    template_u1.setProperties(element_1szz54a1b, attributes);
+                    return root_1szz54a19;
+                })());
+                break;
+            case 'div':
+                out.push((() => {
+                    let root_1szz54a1c = template_1szz54a1d(), element_1szz54a1e = root_1szz54a1c.firstChild;
+                    template_u1.slot(element_1szz54a1e, content, 1);
+                    template_u1.setProperties(element_1szz54a1e, attributes);
+                    return root_1szz54a1c;
+                })());
+                break;
+            case 'em':
+                out.push((() => {
+                    let root_1szz54a1f = template_1szz54ak(), element_1szz54a1g = root_1szz54a1f.firstChild;
+                    template_u1.slot(element_1szz54a1g, content, 1);
+                    template_u1.setProperties(element_1szz54a1g, attributes);
+                    return root_1szz54a1f;
+                })());
+                break;
+            case 'h1':
+                out.push((() => {
+                    let root_1szz54a1h = template_1szz54a1i(), element_1szz54a1j = root_1szz54a1h.firstChild;
+                    template_u1.slot(element_1szz54a1j, content, 1);
+                    template_u1.setProperties(element_1szz54a1j, attributes);
+                    return root_1szz54a1h;
+                })());
+                break;
+            case 'h2':
+                out.push((() => {
+                    let root_1szz54a1k = template_1szz54a1l(), element_1szz54a1m = root_1szz54a1k.firstChild;
+                    template_u1.slot(element_1szz54a1m, content, 1);
+                    template_u1.setProperties(element_1szz54a1m, attributes);
+                    return root_1szz54a1k;
+                })());
+                break;
+            case 'h3':
+                out.push((() => {
+                    let root_1szz54a1n = template_1szz54a1o(), element_1szz54a1p = root_1szz54a1n.firstChild;
+                    template_u1.slot(element_1szz54a1p, content, 1);
+                    template_u1.setProperties(element_1szz54a1p, attributes);
+                    return root_1szz54a1n;
+                })());
+                break;
+            case 'h4':
+                out.push((() => {
+                    let root_1szz54a1q = template_1szz54a1r(), element_1szz54a1s = root_1szz54a1q.firstChild;
+                    template_u1.slot(element_1szz54a1s, content, 1);
+                    template_u1.setProperties(element_1szz54a1s, attributes);
+                    return root_1szz54a1q;
+                })());
+                break;
+            case 'h5':
+                out.push((() => {
+                    let root_1szz54a1t = template_1szz54a1u(), element_1szz54a1v = root_1szz54a1t.firstChild;
+                    template_u1.slot(element_1szz54a1v, content, 1);
+                    template_u1.setProperties(element_1szz54a1v, attributes);
+                    return root_1szz54a1t;
+                })());
+                break;
+            case 'h6':
+                out.push((() => {
+                    let root_1szz54a1w = template_1szz54a1x(), element_1szz54a1y = root_1szz54a1w.firstChild;
+                    template_u1.slot(element_1szz54a1y, content, 1);
+                    template_u1.setProperties(element_1szz54a1y, attributes);
+                    return root_1szz54a1w;
+                })());
+                break;
+            case 'hr':
+                out.push(template_1szz54af());
+                break;
+            case 'img':
+                out.push((() => {
+                    let root_1szz54a1z = template_1szz54a20(), element_1szz54a21 = root_1szz54a1z.firstChild;
+                    template_u1.setProperties(element_1szz54a21, attributes);
+                    return root_1szz54a1z;
+                })());
+                break;
+            case 'li':
+                out.push((() => {
+                    let root_1szz54a22 = template_1szz54a23(), element_1szz54a24 = root_1szz54a22.firstChild;
+                    template_u1.slot(element_1szz54a24, content, 1);
+                    template_u1.setProperties(element_1szz54a24, attributes);
+                    return root_1szz54a22;
+                })());
+                break;
+            case 'ol':
+                out.push((() => {
+                    let root_1szz54a25 = template_1szz54a26(), element_1szz54a27 = root_1szz54a25.firstChild;
+                    template_u1.slot(element_1szz54a27, content, 1);
+                    template_u1.setProperties(element_1szz54a27, attributes);
+                    return root_1szz54a25;
+                })());
+                break;
+            case 'p':
+                out.push((() => {
+                    let root_1szz54a28 = template_1szz54a29(), element_1szz54a2a = root_1szz54a28.firstChild;
+                    template_u1.slot(element_1szz54a2a, content, 1);
+                    template_u1.setProperties(element_1szz54a2a, attributes);
+                    return root_1szz54a28;
+                })());
+                break;
+            case 'pre':
+                out.push((() => {
+                    let root_1szz54a2b = template_1szz54a2c(), element_1szz54a2d = root_1szz54a2b.firstChild;
+                    template_u1.slot(element_1szz54a2d, content, 1);
+                    template_u1.setProperties(element_1szz54a2d, attributes);
+                    return root_1szz54a2b;
+                })());
+                break;
+            case 's':
+                out.push((() => {
+                    let root_1szz54a2e = template_1szz54at(), element_1szz54a2f = root_1szz54a2e.firstChild;
+                    template_u1.slot(element_1szz54a2f, content, 1);
+                    template_u1.setProperties(element_1szz54a2f, attributes);
+                    return root_1szz54a2e;
+                })());
+                break;
+            case 'span':
+                out.push((() => {
+                    let root_1szz54a2g = template_1szz54a2h(), element_1szz54a2i = root_1szz54a2g.firstChild;
+                    template_u1.slot(element_1szz54a2i, content, 1);
+                    template_u1.setProperties(element_1szz54a2i, attributes);
+                    return root_1szz54a2g;
+                })());
+                break;
+            case 'strong':
+                out.push((() => {
+                    let root_1szz54a2j = template_1szz54aw(), element_1szz54a2k = root_1szz54a2j.firstChild;
+                    template_u1.slot(element_1szz54a2k, content, 1);
+                    template_u1.setProperties(element_1szz54a2k, attributes);
+                    return root_1szz54a2j;
+                })());
+                break;
+            case 'sub':
+                out.push((() => {
+                    let root_1szz54a2l = template_1szz54a2m(), element_1szz54a2n = root_1szz54a2l.firstChild;
+                    template_u1.slot(element_1szz54a2n, content, 1);
+                    template_u1.setProperties(element_1szz54a2n, attributes);
+                    return root_1szz54a2l;
+                })());
+                break;
+            case 'summary':
+                out.push((() => {
+                    let root_1szz54a2o = template_1szz54a2p(), element_1szz54a2q = root_1szz54a2o.firstChild, element_1szz54a2r = element_1szz54a2q.firstChild;
+                    template_u1.slot(element_1szz54a2r, icon({ 'aria-hidden': 'true', class: 'markdown-editor-summary-icon' }, chevron));
+                    template_u1.slot(element_1szz54a2q, content, 2);
+                    template_u1.setProperties(element_1szz54a2q, attributes);
+                    template_u1.delegate(element_1szz54a2q, 'mousedown', prevent);
+                    return root_1szz54a2o;
+                })());
+                break;
+            case 'sup':
+                out.push((() => {
+                    let root_1szz54a2s = template_1szz54a2t(), element_1szz54a2u = root_1szz54a2s.firstChild;
+                    template_u1.slot(element_1szz54a2u, content, 1);
+                    template_u1.setProperties(element_1szz54a2u, attributes);
+                    return root_1szz54a2s;
+                })());
+                break;
+            case 'table':
+                out.push((() => {
+                    let root_1szz54a2v = template_1szz54a2w(), element_1szz54a2x = root_1szz54a2v.firstChild;
+                    template_u1.slot(element_1szz54a2x, content, 1);
+                    template_u1.setProperties(element_1szz54a2x, attributes);
+                    return root_1szz54a2v;
+                })());
+                break;
+            case 'tbody':
+                out.push((() => {
+                    let root_1szz54a2y = template_1szz54a2z(), element_1szz54a30 = root_1szz54a2y.firstChild;
+                    template_u1.slot(element_1szz54a30, content, 1);
+                    template_u1.setProperties(element_1szz54a30, attributes);
+                    return root_1szz54a2y;
+                })());
+                break;
+            case 'td':
+                out.push((() => {
+                    let root_1szz54a31 = template_1szz54a32(), element_1szz54a33 = root_1szz54a31.firstChild;
+                    template_u1.slot(element_1szz54a33, content, 1);
+                    template_u1.setProperties(element_1szz54a33, attributes);
+                    return root_1szz54a31;
+                })());
+                break;
+            case 'th':
+                out.push((() => {
+                    let root_1szz54a34 = template_1szz54a35(), element_1szz54a36 = root_1szz54a34.firstChild;
+                    template_u1.slot(element_1szz54a36, content, 1);
+                    template_u1.setProperties(element_1szz54a36, attributes);
+                    return root_1szz54a34;
+                })());
+                break;
+            case 'thead':
+                out.push((() => {
+                    let root_1szz54a37 = template_1szz54a38(), element_1szz54a39 = root_1szz54a37.firstChild;
+                    template_u1.slot(element_1szz54a39, content, 1);
+                    template_u1.setProperties(element_1szz54a39, attributes);
+                    return root_1szz54a37;
+                })());
+                break;
+            case 'tr':
+                out.push((() => {
+                    let root_1szz54a3a = template_1szz54a3b(), element_1szz54a3c = root_1szz54a3a.firstChild;
+                    template_u1.slot(element_1szz54a3c, content, 1);
+                    template_u1.setProperties(element_1szz54a3c, attributes);
+                    return root_1szz54a3a;
+                })());
+                break;
+            case 'ul':
+                out.push((() => {
+                    let root_1szz54a3d = template_1szz54a3e(), element_1szz54a3f = root_1szz54a3d.firstChild;
+                    template_u1.slot(element_1szz54a3f, content, 1);
+                    template_u1.setProperties(element_1szz54a3f, attributes);
+                    return root_1szz54a3d;
+                })());
+                break;
+        }
+    }
+    return out;
+}
+const renderer = (host) => {
+    let flips = new Map(), segments = new WeakMap(), views = new Map();
+    function body(unit, view) {
+        let block = unit.block, source = host.text();
+        if (unit.raw) {
+            return plain(block, unit.rows ?? lines(source, block.from, block.contentTo, block.from), view);
+        }
+        if (unit.fold) {
+            let first = lines(source, block.from, block.contentTo, block.from).slice(0, 1), chip = (() => {
+                let root_1szz54a1 = template_1szz54a2(), element_1szz54a3 = root_1szz54a1.firstChild, element_1szz54a4 = element_1szz54a3.firstChild.nextSibling;
+                template_u1.slot(element_1szz54a4, unit.fold.endLine - unit.fold.line);
+                template_u1.delegate(element_1szz54a3, 'click', () => host.unfold(unit));
+                template_u1.delegate(element_1szz54a3, 'mousedown', prevent);
+                return root_1szz54a1;
+            })();
+            return [block.kind === 'heading' ? marked(block, undefined, view) : plain(block, first, view), chip];
+        }
+        switch (block.kind) {
+            case 'blank':
+                return template_1szz54a5();
+            case 'code':
+            case 'fence':
+                return (() => {
+                    let root_1szz54a6 = template_1szz54a7(), element_1szz54a8 = root_1szz54a6.firstChild.firstElementChild;
+                    template_u1.slot(element_1szz54a8, plain(block, unit.rows ?? relative(block), view, true), 1);
+                    return root_1szz54a6;
+                })();
+            case 'frontmatter':
+                return (() => {
+                    let root_1szz54a9 = template_1szz54aa(), element_1szz54ab = root_1szz54a9.firstChild.firstChild.nextSibling;
+                    template_u1.slot(element_1szz54ab, source.slice(block.contentFrom, block.contentTo).split(EOL).length);
+                    return root_1szz54a9;
+                })();
+            case 'html':
+                parser ??= new DOMParser();
+                return safe(sanitizeHtml(source.slice(block.contentFrom, block.contentTo), parser));
+            case 'list': {
+                let content = marked(block, unit.rows ?? block.lines?.map((row) => relativeRow(block, row)), view);
+                if (unit.continuation) {
+                    return content;
+                }
+                return [
+                    (() => {
+                        let root_1szz54ac = template_1szz54ad(), element_1szz54ae = root_1szz54ac.firstChild;
+                        template_u1.slot(element_1szz54ae, ORDERED.test(block.marker ?? '') ? block.marker : '•', 1);
+                        return root_1szz54ac;
+                    })(),
+                    block.task ? task(block, block.task.checked) : '',
+                    content
+                ];
+            }
+            case 'rule':
+                return template_1szz54af();
+            default:
+                return marked(block, unit.rows ?? block.lines?.map((row) => relativeRow(block, row)), view);
+        }
+    }
+    function inline(tokens, block, view) {
+        let out = [];
+        for (let i = 0, n = tokens.length; i < n; i++) {
+            let token = tokens[i], content = token.children ? inline(token.children, block, view) : piece(token.text, block, token.from, view);
+            switch (token.kind) {
+                case 'code':
+                    out.push((() => {
+                        let root_1szz54ag = template_1szz54ah(), element_1szz54ai = root_1szz54ag.firstChild;
+                        template_u1.slot(element_1szz54ai, content, 1);
+                        return root_1szz54ag;
+                    })());
+                    break;
+                case 'em':
+                    out.push((() => {
+                        let root_1szz54aj = template_1szz54ak(), element_1szz54al = root_1szz54aj.firstChild;
+                        template_u1.slot(element_1szz54al, content, 1);
+                        return root_1szz54aj;
+                    })());
+                    break;
+                case 'link':
+                    out.push(token.href
+                        ? (() => {
+                            let root_1szz54am = template_1szz54an(), element_1szz54ao = root_1szz54am.firstChild;
+                            template_u1.slot(element_1szz54ao, content, 1);
+                            template_u1.setProperty(element_1szz54ao, 'href', token.href);
+                            return root_1szz54am;
+                        })()
+                        : (() => {
+                            let root_1szz54ap = template_1szz54aq(), element_1szz54ar = root_1szz54ap.firstChild;
+                            template_u1.slot(element_1szz54ar, content, 1);
+                            return root_1szz54ap;
+                        })());
+                    break;
+                case 'strike':
+                    out.push((() => {
+                        let root_1szz54as = template_1szz54at(), element_1szz54au = root_1szz54as.firstChild;
+                        template_u1.slot(element_1szz54au, content, 1);
+                        return root_1szz54as;
+                    })());
+                    break;
+                case 'strong':
+                    out.push((() => {
+                        let root_1szz54av = template_1szz54aw(), element_1szz54ax = root_1szz54av.firstChild;
+                        template_u1.slot(element_1szz54ax, content, 1);
+                        return root_1szz54av;
+                    })());
+                    break;
+                default:
+                    out.push(content);
+            }
+        }
+        return out;
+    }
+    function marked(block, rows, view) {
+        let tokens = host.inline(block);
+        if (!rows) {
+            return inline(tokens, block, view);
+        }
+        let out = [];
+        for (let i = 0, n = rows.length; i < n; i++) {
+            if (i) {
+                out.push('\n');
+            }
+            out.push(inline(clipInline(tokens, rows[i].contentFrom, rows[i].contentTo), block, view));
+        }
+        return out;
+    }
+    function piece(value, block, from, view) {
+        let node = text(value), segment = { block, from, node };
+        segments.set(node, segment);
+        view.segments.push(segment);
+        return node;
+    }
+    function plain(block, rows, view, content = false) {
+        let out = [], source = host.text();
+        for (let i = 0, n = rows.length; i < n; i++) {
+            let from = content ? rows[i].contentFrom : rows[i].from, to = rows[i].contentTo;
+            if (i) {
+                out.push('\n');
+            }
+            out.push(piece(source.slice(block.from + from, block.from + to), block, from, view));
+        }
+        return out;
+    }
+    function relative(block) {
+        let out = [], rows = block.lines ?? [];
+        for (let i = 0, n = rows.length; i < n; i++) {
+            out.push(relativeRow(block, rows[i]));
+        }
+        return out;
+    }
+    function relativeRow(block, row) {
+        let base = block.from;
+        return { contentFrom: row.contentFrom - base, contentTo: row.contentTo - base, from: row.from - base, to: row.to - base };
+    }
+    function task(block, checked) {
+        let previous = flips.get(block.from), animate = previous !== undefined && previous !== checked;
+        flips.delete(block.from);
+        return checkbox({
+            class: 'markdown-editor-task',
+            onfirstpaint: (element) => {
+                let input = element.querySelector('input');
+                if (animate && input) {
+                    input.checked = checked;
+                }
+            },
+            [checkbox.input]: {
+                'aria-label': 'Toggle task',
+                checked: animate ? previous : checked,
+                disabled: () => host.readonly(),
+                onclick: (e) => {
+                    e.preventDefault();
+                    flips.set(block.from, checked);
+                    host.task(block);
+                },
+                onmousedown: prevent
+            }
+        });
+    }
+    return {
+        offset: (node, offset) => {
+            let segment = node && segments.get(node);
+            if (!segment) {
+                return null;
+            }
+            return segment.block.from + segment.from + Math.min(offset, segment.node.length);
+        },
+        segments: (unit) => views.get(unit)?.segments ?? null,
+        state: (unit) => views.get(unit)?.state ?? null,
+        template: (unit) => {
+            let block = unit.block, view = { segments: [], state: new ReactiveObject_1szz54a0(host.foldable(unit)) }, content = body(unit, view);
+            views.set(unit, view);
+            return (() => {
+                let root_1szz54ay = template_1szz54az(), element_1szz54a10 = root_1szz54ay.firstChild, element_1szz54a11 = element_1szz54a10.firstElementChild;
+                template_u1.slot(element_1szz54a11, icon({ 'aria-hidden': 'true', class: 'markdown-editor-fold-icon' }, chevron), 1);
+                template_u1.slot(element_1szz54a10, content, 2);
+                template_u1.setProperty(element_1szz54a11, 'aria-label', unit.fold ? 'Unfold block' : 'Fold block');
+                template_u1.setList(element_1szz54a11, 'class', [() => !view.state.foldable && !unit.fold && 'markdown-editor-fold--none', unit.fold ? '--active' : '']);
+                template_u1.delegate(element_1szz54a11, 'click', () => unit.fold ? host.unfold(unit) : host.fold(unit));
+                template_u1.delegate(element_1szz54a11, 'mousedown', prevent);
+                template_u1.setList(element_1szz54a10, 'class', template_u1.interpolate(["markdown-editor-block--", (block.kind)]));
+                template_u1.setList(element_1szz54a10, 'class', [
+                    block.level ? `markdown-editor-block--h${block.level}` : '',
+                    block.quoteDepth ? 'markdown-editor-block--quoted' : '',
+                    unit.continuation ? 'markdown-editor-block--continuation' : '',
+                    unit.continues ? 'markdown-editor-block--continues' : '',
+                    unit.raw || unit.fold ? 'markdown-editor-block--raw' : ''
+                ]);
+                template_u1.onconnect(element_1szz54a10, (element) => host.shown(element, unit));
+                template_u1.ondisconnect(element_1szz54a10, (element) => {
+                    if (views.get(unit) === view) {
+                        views.delete(unit);
+                    }
+                    host.shown(element, null);
+                });
+                template_u1.delegate(element_1szz54a10, 'mousedown', (e) => host.press(e, unit));
+                template_u1.setList(element_1szz54a10, 'style', `--depth: ${block.quoteDepth}; --indent: ${unit.raw ? 0 : block.indent};`);
+                return root_1szz54ay;
+            })();
+        }
+    };
+};
+export { renderer };

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

@@ -0,0 +1,7 @@
+import type { EditorDocument } from '../code/document.js';
+import type { FoldRange } from '../code/folding.js';
+import type { MarkdownBlock } from './model.js';
+declare const foldAt: (document: EditorDocument, blocks: readonly MarkdownBlock[], index: number) => FoldRange | null;
+declare const foldable: (blocks: readonly MarkdownBlock[], index: number, text: string) => boolean;
+declare const markdownFolds: (document: EditorDocument, blocks: readonly MarkdownBlock[]) => FoldRange[];
+export { foldable, foldAt, markdownFolds };

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

@@ -0,0 +1,87 @@
+const CONTAINERS = new Set(['code', 'fence', 'frontmatter', 'html', 'list', 'quote']);
+function deeper(block, next) {
+    if (block.kind === 'list') {
+        return next.indent > block.indent && next.quoteDepth >= block.quoteDepth;
+    }
+    return next.quoteDepth > block.quoteDepth;
+}
+function following(blocks, index) {
+    for (let i = index + 1, n = blocks.length; i < n; i++) {
+        if (blocks[i].kind !== 'blank') {
+            return blocks[i];
+        }
+    }
+    return null;
+}
+const foldAt = (document, blocks, index) => {
+    let block = blocks[index];
+    if (block.kind === 'heading') {
+        let to = document.value.length;
+        for (let i = index + 1, n = blocks.length; i < n; i++) {
+            if (blocks[i].kind === 'heading' && blocks[i].level <= block.level) {
+                to = blocks[i].from;
+                break;
+            }
+        }
+        if (to <= block.to) {
+            return null;
+        }
+        return { endLine: document.lineAt(to) + 1, from: block.to, line: document.lineAt(block.from) + 1, open: block.from, to };
+    }
+    if (!CONTAINERS.has(block.kind)) {
+        return null;
+    }
+    let first = document.lineAt(block.from), to = block.to;
+    if (first + 1 >= document.lineCount) {
+        return null;
+    }
+    if (block.kind === 'list' || block.kind === 'quote') {
+        for (let i = index + 1, n = blocks.length; i < n; i++) {
+            if (blocks[i].kind === 'blank') {
+                continue;
+            }
+            if (!deeper(block, blocks[i])) {
+                break;
+            }
+            to = blocks[i].to;
+        }
+    }
+    let from = document.lineStart(first + 1);
+    if (from >= to) {
+        return null;
+    }
+    return { endLine: document.lineAt(to) + 1, from, line: first + 1, open: block.from, to };
+};
+const foldable = (blocks, index, text) => {
+    let block = blocks[index];
+    if (block.kind === 'heading') {
+        let next = blocks[index + 1];
+        return !!next && !(next.kind === 'heading' && next.level <= block.level);
+    }
+    if (!CONTAINERS.has(block.kind)) {
+        return false;
+    }
+    let line = block.from;
+    while (line < block.to && text.charCodeAt(line) !== 10 && text.charCodeAt(line) !== 13) {
+        line++;
+    }
+    if (line + (text.charCodeAt(line) === 13 && text.charCodeAt(line + 1) === 10 ? 2 : 1) < block.to) {
+        return true;
+    }
+    if (block.kind !== 'list' && block.kind !== 'quote') {
+        return false;
+    }
+    let next = following(blocks, index);
+    return !!next && deeper(block, next);
+};
+const markdownFolds = (document, blocks) => {
+    let ranges = [];
+    for (let i = 0, n = blocks.length; i < n; i++) {
+        let range = foldAt(document, blocks, i);
+        if (range) {
+            ranges.push(range);
+        }
+    }
+    return ranges.sort((a, b) => a.line - b.line || b.to - a.to);
+};
+export { foldable, foldAt, markdownFolds };

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

@@ -0,0 +1,18 @@
+import { type Attributes } from '@esportsplus/template';
+import type { EditorDocument } from '../code/document.js';
+import type { Callbacks, Controller, Options } from '../code/view.js';
+type MarkdownController = Omit<Controller, 'setDocument' | 'setOptions'> & {
+    bold(): boolean;
+    italic(): boolean;
+    setDocument(document: EditorDocument, options?: MarkdownOptions): void;
+    setOptions(options: MarkdownOptions, replace?: boolean): void;
+};
+type MarkdownOptions = Options & {
+    spellcheck?: boolean;
+};
+declare const view: (model: EditorDocument, callbacks: Callbacks, receive?: (controller: MarkdownController) => void) => {
+    controller: MarkdownController;
+    template: (attributes?: Attributes) => DocumentFragment | Text;
+};
+export { view };
+export type { MarkdownController, MarkdownOptions };