domma-cms 1.8.32 → 1.8.34

package/plugins/docs/admin/lib/convert.js

@@ -0,0 +1,482 @@
+/**
+ * Documents in and out: HTML to Markdown, HTML to plain text, excerpts and
+ * word counts.
+ *
+ * Pure and DOM-free on purpose. The admin screen uses it for exports, the
+ * server uses it for list excerpts, word counts and the public page's
+ * downloads, and the tests run it under plain Node - so it carries its own
+ * small HTML parser rather than leaning on DOMParser.
+ *
+ * The parser only has to be good for what a document can hold: HTML that
+ * came out of the editor (a contenteditable) and then through a sanitiser.
+ * It is forgiving - unknown close tags are ignored, a new block closes an
+ * open paragraph, a new list item closes the last one - but it is not a
+ * browser, and it does not try to be.
+ *
+ * @module docs/admin/lib/convert
+ */
+
+const VOID = new Set(['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link', 'meta', 'source', 'track', 'wbr']);
+const SKIP = new Set(['script', 'style', 'template', 'noscript', 'head', 'title']);
+const BLOCK = new Set(['address', 'article', 'aside', 'blockquote', 'div', 'dl', 'fieldset', 'figure', 'footer',
+    'form', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'header', 'hr', 'main', 'nav', 'ol', 'p', 'pre', 'section',
+    'table', 'ul', 'li', 'tr', 'td', 'th', 'thead', 'tbody', 'tfoot', 'caption', 'figcaption', 'dd', 'dt']);
+
+const NAMED = {amp: '&', lt: '<', gt: '>', quot: '"', apos: "'", nbsp: ' ', copy: '©', reg: '®',
+    trade: '™', hellip: '…', mdash: '-', ndash: '-', lsquo: '‘', rsquo: '’', ldquo: '“',
+    rdquo: '”', bull: '•', middot: '·', pound: '£', euro: '€', times: '×', deg: '°'};
+
+/**
+ * @param   {string} s
+ * @returns {string}
+ */
+export function decodeEntities(s) {
+    return String(s).replace(/&(#x[0-9a-f]+|#\d+|[a-z]+);/gi, (m, e) => {
+        if (e[0] === '#') {
+            const code = e[1] === 'x' || e[1] === 'X' ? parseInt(e.slice(2), 16) : parseInt(e.slice(1), 10);
+            try { return String.fromCodePoint(code); } catch { return m; }
+        }
+        const v = NAMED[e.toLowerCase()];
+        return v === undefined ? m : v;
+    });
+}
+
+/**
+ * @param   {string} s
+ * @returns {string}
+ */
+export function escapeHtml(s) {
+    return String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+}
+
+/**
+ * Parse HTML into a plain tree: `{type:'element', name, attrs, children}`
+ * and `{type:'text', text}` (entities decoded).
+ *
+ * @param   {string} html
+ * @returns {{type:'root', children:Array}}
+ */
+export function parseHtml(html) {
+    const root = {type: 'root', name: '#root', attrs: {}, children: []};
+    const stack = [root];
+    const top = () => stack[stack.length - 1];
+    const src = String(html ?? '');
+    const tagRe = /<!--[\s\S]*?(?:-->|$)|<!\[CDATA\[[\s\S]*?\]\]>|<![^>]*>|<\?[^>]*>|<\/?([a-zA-Z][\w:-]*)((?:\s+[^\s"'>/=]+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^\s"'>]+))?)*)\s*(\/?)>/g;
+    let last = 0;
+    let m;
+
+    const closeTo = (name) => {
+        for (let i = stack.length - 1; i > 0; i--) {
+            if (stack[i].name === name) { stack.length = i; return true; }
+        }
+        return false;
+    };
+    const text = (t) => { if (t) top().children.push({type: 'text', text: decodeEntities(t)}); };
+
+    while ((m = tagRe.exec(src))) {
+        text(src.slice(last, m.index));
+        last = tagRe.lastIndex;
+        const raw = m[0];
+        if (!m[1]) continue;                           // comment, doctype, CDATA, PI
+        const name = m[1].toLowerCase();
+        if (raw[1] === '/') { closeTo(name); continue; }
+
+        if (SKIP.has(name)) {
+            // Swallow everything up to the matching close tag.
+            const end = src.toLowerCase().indexOf(`</${name}`, last);
+            if (end === -1) { last = src.length; break; }
+            const gt = src.indexOf('>', end);
+            last = gt === -1 ? src.length : gt + 1;
+            tagRe.lastIndex = last;
+            continue;
+        }
+
+        // Implied closes that editors and pasted HTML rely on.
+        if (BLOCK.has(name) && name !== 'li' && top().name === 'p') stack.pop();
+        if (name === 'li') {
+            for (let i = stack.length - 1; i > 0; i--) {
+                const n = stack[i].name;
+                if (n === 'ul' || n === 'ol') break;
+                if (n === 'li') { stack.length = i; break; }
+            }
+        }
+        if ((name === 'td' || name === 'th')) {
+            for (let i = stack.length - 1; i > 0; i--) {
+                const n = stack[i].name;
+                if (n === 'tr' || n === 'table') break;
+                if (n === 'td' || n === 'th') { stack.length = i; break; }
+            }
+        }
+        if (name === 'tr') {
+            for (let i = stack.length - 1; i > 0; i--) {
+                const n = stack[i].name;
+                if (n === 'table' || n === 'tbody' || n === 'thead' || n === 'tfoot') break;
+                if (n === 'tr') { stack.length = i; break; }
+            }
+        }
+
+        const attrs = {};
+        const attrRe = /([^\s"'>/=]+)(?:\s*=\s*(?:"([^"]*)"|'([^']*)'|([^\s"'>]+)))?/g;
+        let a;
+        while ((a = attrRe.exec(m[2] || ''))) {
+            attrs[a[1].toLowerCase()] = decodeEntities(a[2] ?? a[3] ?? a[4] ?? '');
+        }
+        const node = {type: 'element', name, attrs, children: []};
+        top().children.push(node);
+        if (!VOID.has(name) && !m[3]) stack.push(node);
+    }
+    text(src.slice(last));
+    return root;
+}
+
+/**
+ * All the text under a node, as it would read (no layout).
+ *
+ * @param   {object} node
+ * @returns {string}
+ */
+function textOf(node) {
+    if (node.type === 'text') return node.text;
+    if (node.name === 'br') return '\n';
+    return (node.children || []).map(textOf).join('');
+}
+
+// --------------------------------------------------------------- plain text
+
+/**
+ * The document as plain text: paragraphs separated by blank lines, list
+ * items on their own lines, table cells separated by tabs.
+ *
+ * @param   {string} html
+ * @returns {string}
+ */
+export function htmlToText(html) {
+    const out = [];
+    const walk = (node) => {
+        if (node.type === 'text') { out.push(node.text.replace(/\s+/g, ' ')); return; }
+        const n = node.name;
+        if (n === 'br') { out.push('\n'); return; }
+        if (n === 'hr') { out.push('\n\n'); return; }
+        if (n === 'pre') { out.push('\n\n' + textOf(node) + '\n\n'); return; }
+        if (n === 'img') { if (node.attrs.alt) out.push(node.attrs.alt); return; }
+        const block = BLOCK.has(n);
+        if (n === 'li') out.push('\n');
+        else if (n === 'tr') out.push('\n');
+        else if (n === 'td' || n === 'th') out.push('\t');
+        else if (block) out.push('\n\n');
+        (node.children || []).forEach(walk);
+        if (block && n !== 'li' && n !== 'td' && n !== 'th' && n !== 'tr') out.push('\n\n');
+    };
+    walk(parseHtml(html));
+    return out.join('')
+        .replace(/[  ]+\n/g, '\n')
+        .replace(/\n[  ]+/g, '\n')
+        .replace(/\n\t/g, '\n')
+        .replace(/\n{3,}/g, '\n\n')
+        .trim();
+}
+
+/**
+ * @param   {string} html
+ * @returns {number}
+ */
+export function countWords(html) {
+    const text = htmlToText(html).replace(/\s+/g, ' ').trim();
+    return text ? text.split(' ').length : 0;
+}
+
+/**
+ * The start of a document as one line of text, for list rows and cards.
+ *
+ * @param   {string} html
+ * @param   {number} [max=240]
+ * @returns {string}
+ */
+export function excerpt(html, max = 240) {
+    const text = htmlToText(html).replace(/\s+/g, ' ').trim();
+    return text.length > max ? text.slice(0, max - 1).trimEnd() + '…' : text;
+}
+
+/**
+ * The start of a document with its line breaks, for the page-shaped preview
+ * on a card (shown with white-space: pre-line).
+ *
+ * @param   {string} html
+ * @param   {number} [max=400]
+ * @returns {string}
+ */
+export function preview(html, max = 400) {
+    const text = htmlToText(html).replace(/\t/g, '  ').replace(/\n{2,}/g, '\n').trim();
+    return text.length > max ? text.slice(0, max - 1).trimEnd() + '\u2026' : text;
+}
+
+/**
+ * The headings of a document, in order - the Outline.
+ *
+ * @param   {string} html
+ * @returns {Array<{level:number, text:string}>}
+ */
+export function outline(html) {
+    const out = [];
+    const walk = (node) => {
+        if (node.type !== 'element' && node.type !== 'root') return;
+        const h = /^h([1-6])$/.exec(node.name || '');
+        if (h) {
+            const text = textOf(node).replace(/\s+/g, ' ').trim();
+            if (text) out.push({level: Number(h[1]), text});
+            return;
+        }
+        (node.children || []).forEach(walk);
+    };
+    walk(parseHtml(html));
+    return out;
+}
+
+// ----------------------------------------------------------------- markdown
+
+/** Characters that would start Markdown syntax if left bare in text. */
+function escapeMd(text) {
+    return text.replace(/([\\`*_[\]])/g, '\\$1');
+}
+
+/** Escape what would read as a block marker at the start of a line. */
+function escapeLineStart(line) {
+    return line
+        .replace(/^(\s*)([#>+])/, '$1\\$2')
+        .replace(/^(\s*)-(\s|$)/, '$1\\-$2')
+        .replace(/^(\s*)(\d+)\.(\s|$)/, '$1$2\\.$3');
+}
+
+/**
+ * Inline content of a node as Markdown, on one logical line (hard breaks
+ * become a backslash line end).
+ *
+ * @param   {object} node
+ * @returns {string}
+ */
+function inline(node) {
+    if (node.type === 'text') return escapeMd(node.text.replace(/\s+/g, ' '));
+    const kids = () => (node.children || []).map(inline).join('');
+    const wrap = (mark) => {
+        const inner = kids();
+        const trimmed = inner.trim();
+        if (!trimmed) return inner;
+        const lead = inner.match(/^\s*/)[0];
+        const tail = inner.match(/\s*$/)[0];
+        return `${lead}${mark}${trimmed}${mark}${tail}`;
+    };
+    switch (node.name) {
+        case 'br': return '\\\n';
+        case 'strong': case 'b': return wrap('**');
+        case 'em': case 'i': return wrap('*');
+        case 's': case 'del': case 'strike': return wrap('~~');
+        case 'code': {
+            const t = textOf(node);
+            const ticks = t.includes('`') ? '``' : '`';
+            return t ? `${ticks}${ticks.length > 1 ? ' ' : ''}${t}${ticks.length > 1 ? ' ' : ''}${ticks}` : '';
+        }
+        case 'a': {
+            const label = kids().trim() || escapeMd(node.attrs.href || '');
+            const href = (node.attrs.href || '').replace(/\s/g, '%20').replace(/\)/g, '%29');
+            return href ? `[${label}](${href})` : label;
+        }
+        case 'img': {
+            const alt = escapeMd(node.attrs.alt || '');
+            const src = (node.attrs.src || '').replace(/\s/g, '%20').replace(/\)/g, '%29');
+            const title = node.attrs.title ? ` "${node.attrs.title.replace(/"/g, '\\"')}"` : '';
+            return src ? `![${alt}](${src}${title})` : '';
+        }
+        case 'u': case 'mark': case 'sub': case 'sup': case 'kbd': {
+            const inner = kids();
+            return inner.trim() ? `<${node.name}>${inner}</${node.name}>` : inner;
+        }
+        default: return kids();
+    }
+}
+
+/**
+ * Split children into runs: consecutive inline nodes are one paragraph,
+ * each block element stands alone. Loose text inside a div or list item is
+ * not lost this way.
+ */
+function runs(children) {
+    const out = [];
+    let current = null;
+    for (const c of children || []) {
+        if (c.type === 'element' && BLOCK.has(c.name)) {
+            current = null;
+            out.push(c);
+        } else {
+            if (!current) { current = {type: 'element', name: '#inline', attrs: {}, children: []}; out.push(current); }
+            current.children.push(c);
+        }
+    }
+    return out;
+}
+
+/** A paragraph's inline Markdown, each line escaped at its start. */
+function para(node) {
+    const text = inline(node).replace(/[ \t]+/g, ' ').trim();
+    return text.split('\n').map((l) => escapeLineStart(l.trim())).join('\n');
+}
+
+function isChecklist(list) {
+    return list.attrs['data-type'] === 'checklist' || list.attrs.class?.split(/\s+/).includes('docs-checklist');
+}
+
+/**
+ * Blocks as Markdown, joined by blank lines.
+ *
+ * @param   {Array} children
+ * @returns {string}
+ */
+function blocks(children) {
+    const parts = [];
+    for (const node of runs(children)) {
+        const md = block(node);
+        if (md && md.trim()) parts.push(md.replace(/\s+$/, ''));
+    }
+    return parts.join('\n\n');
+}
+
+function indent(text, pad) {
+    return text.split('\n').map((l, i) => (i === 0 || !l ? l : pad + l)).join('\n');
+}
+
+function list(node) {
+    const ordered = node.name === 'ol';
+    const check = isChecklist(node);
+    let n = Number(node.attrs.start) || 1;
+    const items = [];
+    for (const li of (node.children || []).filter(c => c.type === 'element' && c.name === 'li')) {
+        let marker = ordered ? `${n++}.` : '-';
+        if (check || li.attrs['data-checked'] !== undefined) {
+            const on = li.attrs['data-checked'] === 'true';
+            marker = `- [${on ? 'x' : ' '}]`;
+        }
+        const body = blocks(li.children) || '';
+        items.push(`${marker} ${indent(body, ' '.repeat(marker.length + 1))}`);
+    }
+    return items.join('\n');
+}
+
+function table(node) {
+    const rows = [];
+    const collect = (n) => (n.children || []).forEach((c) => {
+        if (c.type !== 'element') return;
+        if (c.name === 'tr') rows.push(c);
+        else if (['thead', 'tbody', 'tfoot'].includes(c.name)) collect(c);
+    });
+    collect(node);
+    if (!rows.length) return '';
+    const cells = rows.map(r => (r.children || [])
+        .filter(c => c.type === 'element' && (c.name === 'td' || c.name === 'th'))
+        .map(c => inline(c).replace(/\\\n/g, ' ').replace(/\s+/g, ' ').trim().replace(/\|/g, '\\|')));
+    const width = Math.max(1, ...cells.map(r => r.length));
+    const line = (r) => `| ${Array.from({length: width}, (_, i) => r[i] ?? '').join(' | ')} |`;
+    const out = [line(cells[0]), `| ${Array(width).fill('---').join(' | ')} |`];
+    cells.slice(1).forEach(r => out.push(line(r)));
+    return out.join('\n');
+}
+
+function block(node) {
+    if (node.name === '#inline') return para(node);
+    const n = node.name;
+    const h = /^h([1-6])$/.exec(n);
+    if (h) return `${'#'.repeat(Number(h[1]))} ${inline(node).replace(/\\\n/g, ' ').replace(/\s+/g, ' ').trim()}`;
+    switch (n) {
+        case 'p': return para(node);
+        case 'hr': return '---';
+        case 'ul': case 'ol': return list(node);
+        case 'table': return table(node);
+        case 'pre': {
+            const code = (node.children || []).find(c => c.type === 'element' && c.name === 'code');
+            const lang = /language-([\w-]+)/.exec(code?.attrs?.class || '')?.[1] || '';
+            const text = textOf(node).replace(/\n$/, '');
+            const fence = text.includes('```') ? '~~~' : '```';
+            return `${fence}${lang}\n${text}\n${fence}`;
+        }
+        case 'blockquote': return blocks(node.children).split('\n').map(l => (l ? `> ${l}` : '>')).join('\n');
+        default: return blocks(node.children);
+    }
+}
+
+/**
+ * A document as GitHub-flavoured Markdown. Underline, highlight and
+ * sub/superscript have no Markdown form, so they stay as inline HTML - which
+ * Markdown allows and every renderer shows.
+ *
+ * @param   {string} html
+ * @returns {string}
+ */
+export function htmlToMarkdown(html) {
+    const md = blocks(parseHtml(html).children);
+    return md.replace(/\n{3,}/g, '\n\n').trim() + '\n';
+}
+
+// ---------------------------------------------------------- standalone file
+
+/** Styles for an exported or printed document - readable anywhere, no theme. */
+export const DOCUMENT_CSS = `
+body{font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:#1f2328;max-width:760px;margin:2rem auto;padding:0 1.25rem}
+h1,h2,h3{line-height:1.25;margin:1.6em 0 .6em}h1{font-size:2em}h2{font-size:1.5em}h3{font-size:1.25em}
+p{margin:0 0 1em}a{color:#0b61c4}img{max-width:100%;height:auto}
+blockquote{margin:0 0 1em;padding:.25em 1em;border-left:4px solid #d0d7de;color:#57606a}
+pre{background:#f6f8fa;padding:1em;border-radius:6px;overflow:auto;font-size:.9em}
+code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em}
+table{border-collapse:collapse;margin:0 0 1em;width:100%}td,th{border:1px solid #d0d7de;padding:.4em .6em;text-align:left;vertical-align:top}th{background:#f6f8fa}
+ul[data-type=checklist]{list-style:none;padding-left:.25em}ul[data-type=checklist] li::before{content:"\\2610";margin-right:.5em}ul[data-type=checklist] li[data-checked=true]::before{content:"\\2611"}
+hr{border:0;border-top:1px solid #d0d7de;margin:2em 0}mark{background:#fff3a3}
+@media print{body{margin:0;max-width:none}a{color:inherit}}
+`.trim();
+
+/**
+ * True when a document's body already opens with its title as a heading -
+ * then a page built from it must not print the title twice.
+ *
+ * @param   {string} title
+ * @param   {string} html
+ * @returns {boolean}
+ */
+export function startsWithTitle(title, html) {
+    const m = /^\s*<h[12][^>]*>([\s\S]*?)<\/h[12]>/i.exec(String(html || ''));
+    if (!m) return false;
+    const norm = (t) => decodeEntities(String(t).replace(/<[^>]+>/g, '')).replace(/\s+/g, ' ').trim().toLowerCase();
+    return norm(m[1]) === norm(title || '');
+}
+
+/**
+ * A complete HTML file for one document.
+ *
+ * @param   {string} title
+ * @param   {string} html  the (already sanitised) body
+ * @returns {string}
+ */
+export function standaloneHtml(title, html) {
+    return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>${escapeHtml(title || 'Untitled')}</title>
+<style>${DOCUMENT_CSS}</style>
+</head>
+<body>
+${startsWithTitle(title, html) ? '' : `<h1>${escapeHtml(title || 'Untitled')}</h1>\n`}${html || ''}
+</body>
+</html>
+`;
+}
+
+/**
+ * A safe file name for a download, keeping the title readable.
+ *
+ * @param   {string} title
+ * @param   {string} ext  without the dot
+ * @returns {string}
+ */
+export function fileName(title, ext) {
+    const base = String(title || 'Untitled').replace(/[\\/:*?"<>|\u0000-\u001f]+/g, ' ').replace(/\s+/g, ' ').trim().slice(0, 120) || 'Untitled';
+    return `${base}.${ext}`;
+}

package/plugins/docs/admin/lib/drafts.js

@@ -0,0 +1,115 @@
+/**
+ * Docs - the draft an editor keeps in this browser for work left unsaved
+ * (pure, tested in tests/drafts.test.js).
+ *
+ * A draft is `{owner, title, content, at, was}`, kept per signed-in person
+ * (`docs.draft.<userId>.<docId>`): documents are shared, and a browser can be
+ * shared too, so one person's unsaved work is never offered to another - the
+ * key keeps them apart and `owner` is checked on the way back in. 2.9 kept
+ * `docs.draft.<docId>` with no owner: whose it was cannot be known, so it is
+ * removed, never offered (legacyDraftKey).
+ *
+ * `was` is the document's updatedAt when the edits it holds began (moved on by
+ * each save of the editor's own; a draft picked back up keeps the `was` it came
+ * with until it is saved). `base`, an earlier name for it, is read as `was`.
+ *
+ * The restore question follows the admin's convention: E.confirm answers
+ * `false` for Cancel, Escape AND a backdrop click alike, so the DESTRUCTIVE
+ * answer is OK ("Throw away") and every other way out keeps the changes - put
+ * back in the document, or (`copy`: the document is gone) made into a new one.
+ *
+ * @module docs/admin/lib/drafts
+ */
+
+/** The storage key of one person's draft of one document ('' with nobody signed in: no draft is kept). */
+export const draftKey = (id, owner) => (owner ? `docs.draft.${owner}.${id}` : '');
+/** 2.9's key, with no owner - removed when met, never read. */
+export const legacyDraftKey = (id) => `docs.draft.${id}`;
+
+const escHtml = (s) => String(s ?? '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+
+/**
+ * A stored value as a draft, or null. Whatever an older build (or a person
+ * with devtools) left there is whitelisted, never trusted.
+ *
+ * @param   {*} raw - S.get's answer (an object, or a JSON string)
+ * @param   {string} owner - the signed-in person's id: a draft that is not theirs is no draft
+ * @returns {{owner: string, title: string, content: string, at: string, was: string}|null}
+ */
+export function normaliseDraft(raw, owner) {
+    let v = raw;
+    if (typeof v === 'string') { try { v = JSON.parse(v); } catch { return null; } }
+    if (!v || typeof v !== 'object' || typeof v.content !== 'string') return null;
+    if (!owner || v.owner !== owner) return null;
+    const str = (x) => (typeof x === 'string' ? x : '');
+    return {owner, title: str(v.title), content: v.content, at: str(v.at), was: str(v.was) || str(v.base)};
+}
+
+/** A draft to keep: `was` is when its edits began, never "now". */
+export function makeDraft({owner, title, content, was, at = new Date().toISOString()}) {
+    return {owner: String(owner || ''), title: String(title ?? ''), content: String(content ?? ''), at, was: String(was || '')};
+}
+
+/** Does the draft hold anything the stored document does not? */
+export function draftDiffers(draft, doc) {
+    if (!draft) return false;
+    if (!doc) return true;
+    return draft.content !== String(doc.content || '') || Boolean(draft.title && draft.title !== doc.title);
+}
+
+/**
+ * What became of the document since the draft's edits began.
+ *
+ * @param {{was?: string, at?: string}} draft
+ * @param {object|null} doc - null: deleted, or no longer shared with this person
+ * @returns {'deleted'|'trashed'|'changed'|''}
+ */
+export function draftFate(draft, doc) {
+    if (!doc) return 'deleted';
+    if (doc.trashedAt) return 'trashed';
+    if (!doc.updatedAt) return '';
+    if (draft?.was) return doc.updatedAt !== draft.was ? 'changed' : '';
+    // A draft with no `was` (an old one, or a failed write's): only a save after it was kept counts.
+    const at = Date.parse(draft?.at || '');
+    return Number.isFinite(at) && Date.parse(doc.updatedAt) > at ? 'changed' : '';
+}
+
+const MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+/** "14 Oct, 09:05" in the browser's time zone; '' for no date. */
+export function when(iso) {
+    const t = Date.parse(iso || '');
+    if (!Number.isFinite(t)) return '';
+    const d = new Date(t);
+    const p = (n) => String(n).padStart(2, '0');
+    return `${d.getDate()} ${MONTHS[d.getMonth()]}, ${p(d.getHours())}:${p(d.getMinutes())}`;
+}
+
+/**
+ * The question a kept draft is offered back with - HTML for E.confirm (the
+ * title is escaped). OK throws away; Cancel / Escape / the backdrop keep.
+ *
+ * @param {object} draft
+ * @param {object|null} doc - the document as loaded now; null when it is gone
+ * @returns {{text: string, copy: boolean, options: {title: string, confirmText: string, cancelText: string}}}
+ */
+export function draftQuestion(draft, doc) {
+    const name = draft?.title || doc?.title;
+    const at = when(draft?.at);
+    const ask = `Throw away the changes you left unsaved on <strong>${escHtml(name || 'this document')}</strong>${at ? ` (${at})` : ''}?`;
+    const keep = {title: 'Unsaved changes', confirmText: 'Throw away', cancelText: 'Put them back'};
+    const copy = {...keep, cancelText: 'Keep them as a new document'};
+    switch (draftFate(draft, doc)) {
+        case 'deleted':
+            return {copy: true, options: copy, text: `${ask}<br><br>The document has been deleted since, or is no longer shared with you - keeping them makes a new document of your own.`};
+        case 'changed': {
+            const saved = when(doc.updatedAt);
+            return {copy: false, options: keep, text: `${ask}<br><br>The document has been saved since${saved ? ` (${saved})` : ''}. Putting yours back replaces that version - it stays in Version history.`};
+        }
+        default:
+            return {copy: false, options: keep, text: `${ask} Putting them back returns them to the document.`};
+    }
+}
+
+/** The title of a document made from a draft whose document has gone. */
+export const copyTitle = (draft) => `${(draft?.title || '').trim() || 'Untitled'} (your unsaved changes)`.slice(0, 200);