domma-cms 1.7.0 → 1.7.1

package/plugins/blog/admin/lib/email.js

@@ -0,0 +1,191 @@
+/**
+ * Email someone from this Tool: Email Pro's compose window when the user can
+ * send from it, otherwise the device's mail program through `mailto:`.
+ *
+ * Core makes the choice (`/admin/js/lib/mail-compose.js`, CMS 1.6.61+). It is
+ * imported at RUN time, never statically, so this Tool still loads on an older
+ * core - where every action keeps the plain `mailto:` it always had.
+ *
+ * `emailTo()` is for menu actions; `routeMailLinks()` is for a visible
+ * `<a href="mailto:…">` - the link stays a link (copy, hover, middle-click all
+ * still work) and a plain click goes the same way as the menu action.
+ *
+ * @module blog/admin/lib/email
+ */
+
+const CORE = '/admin/js/lib/mail-compose.js';
+let core = null;
+
+/** The core module, or null on a core without it. Asked once. */
+const loadCore = () => (core ??= import(CORE).catch(() => null));
+
+/** Longest subject or body carried (as core's). */
+const MAX_TEXT = 2000;
+/** Longest mailto: handed to the device - mail programs cut or refuse longer ones. */
+const MAX_MAILTO = 1800;
+
+/**
+ * Something that can only be an email address: one @, no spaces or line
+ * breaks, nothing that would start another recipient or a query.
+ *
+ * @param   {*} value
+ * @returns {boolean}
+ */
+export function looksLikeAddress(value) {
+    return typeof value === 'string' && /^[^\s@<>,;"?&]+@[^\s@<>,;"?&]+$/.test(value);
+}
+
+/** Valid addresses only, once each (ignoring case), from a string, `{address}`/`{email}`, or a list. */
+function addressesOf(list) {
+    const seen = new Set();
+    return (Array.isArray(list) ? list : list == null ? [] : [list])
+        .map(x => String(typeof x === 'string' ? x : (x?.address ?? x?.email ?? '')).trim())
+        .filter(a => looksLikeAddress(a) && !seen.has(a.toLowerCase()) && seen.add(a.toLowerCase()));
+}
+
+/** Trim and cap; a subject loses its line breaks (they would be a header). */
+function cleanText(value, {oneLine = false} = {}) {
+    let text = String(value ?? '');
+    if (oneLine) text = text.replace(/[\r\n]+/g, ' ');
+    return text.slice(0, MAX_TEXT).trim();
+}
+
+/**
+ * The request as a `mailto:` link (the fallback on an older core).
+ *
+ * @param   {{to?: *, cc?: *, bcc?: *, subject?: string, body?: string}} request
+ * @returns {string}
+ */
+export function mailtoHref({to, cc, bcc, subject, body} = {}) {
+    const enc = (list) => addressesOf(list).map(a => encodeURIComponent(a).replace(/%40/g, '@')).join(',');
+    const s = cleanText(subject, {oneLine: true});
+    const b = cleanText(body);
+    const query = [];
+    if (enc(cc)) query.push(`cc=${enc(cc)}`);
+    if (enc(bcc)) query.push(`bcc=${enc(bcc)}`);
+    if (s) query.push(`subject=${encodeURIComponent(s)}`);
+    if (b) query.push(`body=${encodeURIComponent(b)}`);
+    return `mailto:${enc(to)}${query.length ? `?${query.join('&')}` : ''}`;
+}
+
+/** Copy text: the clipboard, else the old copy command, else a box to copy it from by hand. */
+async function copyText(text) {
+    try {
+        await navigator.clipboard.writeText(text);
+        return true;
+    } catch { /* next */ }
+    const box = document.createElement('textarea');
+    box.className = 'form-input';
+    box.readOnly = true;
+    box.rows = 6;
+    box.value = text;
+    try {
+        box.style.position = 'fixed';
+        box.style.opacity = '0';
+        document.body.appendChild(box);
+        box.select();
+        if (document.execCommand('copy')) return true;
+    } catch { /* next */ } finally {
+        box.remove();
+        box.style.position = '';
+        box.style.opacity = '';
+    }
+    const modal = E.modal({title: 'Copy the addresses', size: 'medium', buttons: [{id: 'close', text: 'Close', variant: 'secondary'}]});
+    modal.element.appendChild(box);   // light DOM: setContent would strip the textarea
+    modal.open();
+    box.select();
+    return false;
+}
+
+/**
+ * Hand the request to the device's mail program - unless the link would be
+ * too long for it, when the addresses are copied instead and the toast says
+ * what did not go.
+ */
+async function openMailto(request) {
+    const href = mailtoHref(request);
+    if (href.length <= MAX_MAILTO) {
+        location.href = href;
+        return 'mailto';
+    }
+    const all = addressesOf([...addressesOf(request.to), ...addressesOf(request.cc), ...addressesOf(request.bcc)]);
+    const copied = all.length ? await copyText(all.join(', ')) : false;
+    const lost = [cleanText(request.subject) && 'the subject', cleanText(request.body) && 'the message'].filter(Boolean);
+    E.toast(`Too long for your mail program to open. ${all.length
+        ? `${copied ? 'The' : 'Copy the'} ${all.length} address${all.length === 1 ? '' : 'es'}${copied ? ' are copied' : ''} - paste them into Bcc of a new email.` : ''}${lost.length ? ` Not carried over: ${lost.join(' and ')}.` : ''}`,
+    {type: 'warning', duration: 9000});
+    return 'copied';
+}
+
+const decode = (s) => { try { return decodeURIComponent(s); } catch { return s; } };
+
+/**
+ * A `mailto:` link read back into a request (what a visible link carries).
+ * When the address part holds anything that is not an address, the query
+ * is ignored: an address stored as `me@x.com?body=…` must not prefill a message.
+ *
+ * @param   {string} href
+ * @returns {null|{to: string[], cc: string[], bcc: string[], subject: string, body: string}}
+ */
+export function parseMailto(href) {
+    const m = String(href ?? '').match(/^mailto:([^?]*)(?:\?(.*))?$/i);
+    if (!m) return null;
+    const split = (s) => decode(s || '').split(/[,;]/).map(x => x.trim()).filter(Boolean);
+    const named = split(m[1]);
+    const out = {to: addressesOf(named), cc: [], bcc: [], subject: '', body: ''};
+    if (named.some(a => !looksLikeAddress(a))) return out;
+    for (const pair of (m[2] || '').split('&')) {
+        const i = pair.indexOf('=');
+        if (i < 1) continue;
+        const key = pair.slice(0, i).toLowerCase();
+        const value = pair.slice(i + 1);
+        if (key === 'to') out.to = addressesOf([...out.to, ...split(value)]);
+        else if (key === 'cc' || key === 'bcc') out[key] = addressesOf([...out[key], ...split(value)]);
+        else if (key === 'subject') out.subject = cleanText(decode(value), {oneLine: true});
+        else if (key === 'body') out.body = cleanText(decode(value));
+    }
+    return out;
+}
+
+/**
+ * Email someone. Recipients are `{name, address}`, `{name, email}` or bare
+ * addresses; several people belong in `bcc`, so nobody sees the others.
+ * With nobody to address (a link to pass on) compose still opens, To empty.
+ *
+ * @param   {{to?: *, cc?: *, bcc?: *, subject?: string, body?: string}} request
+ * @returns {Promise<'compose'|'mailto'|'copied'|'none'>}
+ */
+export async function emailTo(request = {}) {
+    const mail = await loadCore();
+    if (!mail) return openMailto(request);
+    const r = mail.composeRequest(request);
+    if (r.to.length || r.cc.length || r.bcc.length) return mail.openEmail(r);
+    if (await mail.emailReady()) {
+        location.hash = mail.composeHash(r);
+        return 'compose';
+    }
+    location.href = mail.mailtoHref(r);
+    return 'mailto';
+}
+
+/**
+ * Send plain clicks on the `mailto:` links inside `root` through `emailTo()`.
+ * A modified click (new tab/window) or one already handled is left alone.
+ *
+ * @param   {Element} root
+ * @returns {() => void} removes the listener
+ */
+export function routeMailLinks(root) {
+    if (!root) return () => {};
+    const onClick = (e) => {
+        if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
+        const a = e.target?.closest?.('a[href^="mailto:" i]');
+        if (!a || !root.contains(a)) return;
+        const request = parseMailto(a.getAttribute('href'));
+        if (!request) return;
+        e.preventDefault();
+        emailTo(request);
+    };
+    root.addEventListener('click', onClick);
+    return () => root.removeEventListener('click', onClick);
+}

package/plugins/blog/admin/views/comments.js

@@ -216,7 +216,9 @@ export const commentsView = {
                     {label: 'Open the post', icon: 'edit', visible: Boolean(c.postId) && posts.peek().some(p => p.id === c.postId),
                         action: () => R.navigate(`#/plugins/blog/posts/${c.postId}`)},
                     {label: 'Reply by email', icon: 'mail', visible: Boolean(c.authorEmail),
-                        action: () => { location.href = `mailto:${encodeURIComponent(c.authorEmail)}`; }},
+                        // Email Pro's compose when this user can send from it, else the device's mail program.
+                        action: () => import(`../lib/email.js?v=${ASSET_VERSION}`).then(m => m.emailTo({to: [{name: c.authorName, address: c.authorEmail}]}))
+                            .catch(() => { location.href = `mailto:${encodeURIComponent(c.authorEmail)}`; })},
                     {type: 'divider'},
                     {label: 'Delete', icon: 'trash', danger: true, action: () => remove(c.id)}
                 ]);

package/plugins/blog/plugin.json

@@ -1,7 +1,7 @@
 {
   "name": "blog",
   "displayName": "Blog",
-  "version": "1.10.0",
+  "version": "1.10.1",
   "tier": "free",
   "description": "Public-facing blog with posts, categories and comments - layouts and listings built from editable blocks.",
   "author": "Domma CMS",
@@ -91,7 +91,7 @@
         "exportName": "categoriesView"
       },
       "plugin-blog-comments": {
-        "entry": "blog/admin/views/comments.js?v=11",
+        "entry": "blog/admin/views/comments.js?v=12",
         "exportName": "commentsView"
       },
       "plugin-blog-settings": {

package/plugins/blog/plugin.public.js

@@ -24,7 +24,7 @@ const __dirname = fileURLToPath(new URL('.', import.meta.url));
 const TEMPLATES_DIR = path.join(__dirname, 'templates');
 
 /** Bumped with the plugin, so a release is never served a stale script. */
-const ASSET_V = '1.10.0';
+const ASSET_V = '1.10.1';
 
 /**
  * Above this many posts a listing pages on the server instead: the browser

package/plugins/blog/tests/email.test.js

@@ -0,0 +1,69 @@
+/**
+ * admin/lib/email.js - the mailto: fallback and link reading (node has no
+ * /admin/js/lib/mail-compose.js, so emailTo() here is the older-core path).
+ */
+import {test} from 'node:test';
+import assert from 'node:assert/strict';
+import {emailTo, looksLikeAddress, mailtoHref, parseMailto} from '../admin/lib/email.js';
+
+test('mailtoHref: one person in To, subject and body encoded, @ readable', () => {
+    assert.equal(mailtoHref({to: [{name: 'Ann', address: 'ann+x@example.test'}], subject: 'Hi & bye', body: 'Line 1\nLine 2'}),
+        'mailto:ann%2Bx@example.test?subject=Hi%20%26%20bye&body=Line%201%0ALine%202');
+});
+
+test('mailtoHref: several people in Bcc, strings and contacts alike', () => {
+    assert.equal(mailtoHref({bcc: ['a@x.test', {email: 'b@x.test'}], subject: 'S'}), 'mailto:?bcc=a@x.test,b@x.test&subject=S');
+});
+
+test('parseMailto reads back what mailtoHref writes, and plain links', () => {
+    const r = parseMailto(mailtoHref({to: 'a@x.test', cc: ['c@x.test'], bcc: ['b@x.test', 'd@x.test'], subject: 'Hi + there', body: 'Join: https://x.test/?a=1&b=2'}));
+    assert.deepEqual(r, {to: ['a@x.test'], cc: ['c@x.test'], bcc: ['b@x.test', 'd@x.test'], subject: 'Hi + there', body: 'Join: https://x.test/?a=1&b=2'});
+    assert.deepEqual(parseMailto('mailto:ann@example.test'), {to: ['ann@example.test'], cc: [], bcc: [], subject: '', body: ''});
+    assert.equal(parseMailto('https://example.test'), null);
+});
+
+test('emailTo on a core without mail-compose.js keeps the old mailto:', async () => {
+    const saved = globalThis.location;
+    globalThis.location = {href: '', hash: ''};
+    try {
+        assert.equal(await emailTo({to: [{name: 'Ann', address: 'ann@example.test'}], subject: 'Hello'}), 'mailto');
+        assert.equal(globalThis.location.href, 'mailto:ann@example.test?subject=Hello');
+        assert.equal(globalThis.location.hash, '');
+    } finally {
+        globalThis.location = saved;
+    }
+});
+
+test('fallback hardening: bad addresses dropped, repeats once, subject one line, text capped', () => {
+    for (const bad of ['a b@x.test', 'a@x.test\r\nBcc: c@x.test', '<a@x.test>', 'a@x.test,b@x.test', 'a@x.test?body=hi', 'nobody']) assert.equal(looksLikeAddress(bad), false, bad);
+    const href = mailtoHref({to: ['A@x.test', 'a@x.test', 'a b@x.test', 'me@x.test?body=evil'], subject: 'Hi\r\nBcc: c@x.test', body: 'x'.repeat(3000)});
+    assert.ok(href.startsWith('mailto:A@x.test?subject=Hi%20Bcc%3A%20c%40x.test&body='), href);
+    assert.equal(decodeURIComponent(href.split('body=')[1]).length, 2000);
+});
+
+test('parseMailto ignores the query when the address part is not an address', () => {
+    // An address stored as "me@x.com?body=..." and encoded into a link.
+    assert.deepEqual(parseMailto(`mailto:${encodeURIComponent('me@x.test?body=Pay now')}`), {to: [], cc: [], bcc: [], subject: '', body: ''});
+    assert.deepEqual(parseMailto('mailto:me@x.test%0D%0Abcc:z@x.test?subject=Hi&bcc=y@x.test'), {to: [], cc: [], bcc: [], subject: '', body: ''});
+    assert.deepEqual(parseMailto('mailto:?subject=Join&body=link').subject, 'Join');
+});
+
+test('emailTo on an old core: a mailto over 1800 characters is not opened - the addresses are copied', async () => {
+    const saved = {location: globalThis.location, E: globalThis.E, nav: Object.getOwnPropertyDescriptor(globalThis, 'navigator')};
+    let copied = '';
+    const toasts = [];
+    globalThis.location = {href: '', hash: ''};
+    globalThis.E = {toast: (m) => toasts.push(m)};
+    Object.defineProperty(globalThis, 'navigator', {value: {clipboard: {writeText: async (t) => { copied = t; }}}, configurable: true});
+    try {
+        const bcc = Array.from({length: 120}, (_, i) => `person${i}@example.test`);
+        assert.equal(await emailTo({bcc, subject: 'News'}), 'copied');
+        assert.equal(globalThis.location.href, '');
+        assert.equal(copied, bcc.join(', '));
+        assert.match(toasts[0], /120 addresses are copied.*Not carried over: the subject/);
+    } finally {
+        globalThis.location = saved.location;
+        globalThis.E = saved.E;
+        if (saved.nav) Object.defineProperty(globalThis, 'navigator', saved.nav); else delete globalThis.navigator;
+    }
+});

package/plugins/booking/CLAUDE.md

@@ -193,3 +193,7 @@ only to roles that hold it.
   cannot tell Escape from Cancel). Booking Pro's sections are not drafted - the section contract cannot put values back.
 - First loads use core skeletons through `kit.whileLoading` (`.bk-loading-slot`) on the host, Bookings and the Diary.
 - No ContextMenu-key handler in wireRows: Windows Chrome opens its own menu on that key too. Shift+F10 only.
+
+## 1.7.1
+
+- **Email (openEmail).** Email actions go through `admin/lib/email.js`: `emailTo()` for menu actions (several people always in Bcc), `routeMailLinks(root)` for visible `mailto:` links. Core's `/admin/js/lib/mail-compose.js` (CMS 1.6.61+) opens Email Pro's compose window when the user has a mailbox there; older cores keep a cleaned, capped `mailto:` (over 1800 chars the addresses are copied instead). Stored addresses are encoded into links, or shown as text when invalid. Never set `location.href = 'mailto:…'` directly.

package/plugins/booking/admin/lib/email.js

@@ -0,0 +1,191 @@
+/**
+ * Email someone from this Tool: Email Pro's compose window when the user can
+ * send from it, otherwise the device's mail program through `mailto:`.
+ *
+ * Core makes the choice (`/admin/js/lib/mail-compose.js`, CMS 1.6.61+). It is
+ * imported at RUN time, never statically, so this Tool still loads on an older
+ * core - where every action keeps the plain `mailto:` it always had.
+ *
+ * `emailTo()` is for menu actions; `routeMailLinks()` is for a visible
+ * `<a href="mailto:…">` - the link stays a link (copy, hover, middle-click all
+ * still work) and a plain click goes the same way as the menu action.
+ *
+ * @module booking/admin/lib/email
+ */
+
+const CORE = '/admin/js/lib/mail-compose.js';
+let core = null;
+
+/** The core module, or null on a core without it. Asked once. */
+const loadCore = () => (core ??= import(CORE).catch(() => null));
+
+/** Longest subject or body carried (as core's). */
+const MAX_TEXT = 2000;
+/** Longest mailto: handed to the device - mail programs cut or refuse longer ones. */
+const MAX_MAILTO = 1800;
+
+/**
+ * Something that can only be an email address: one @, no spaces or line
+ * breaks, nothing that would start another recipient or a query.
+ *
+ * @param   {*} value
+ * @returns {boolean}
+ */
+export function looksLikeAddress(value) {
+    return typeof value === 'string' && /^[^\s@<>,;"?&]+@[^\s@<>,;"?&]+$/.test(value);
+}
+
+/** Valid addresses only, once each (ignoring case), from a string, `{address}`/`{email}`, or a list. */
+function addressesOf(list) {
+    const seen = new Set();
+    return (Array.isArray(list) ? list : list == null ? [] : [list])
+        .map(x => String(typeof x === 'string' ? x : (x?.address ?? x?.email ?? '')).trim())
+        .filter(a => looksLikeAddress(a) && !seen.has(a.toLowerCase()) && seen.add(a.toLowerCase()));
+}
+
+/** Trim and cap; a subject loses its line breaks (they would be a header). */
+function cleanText(value, {oneLine = false} = {}) {
+    let text = String(value ?? '');
+    if (oneLine) text = text.replace(/[\r\n]+/g, ' ');
+    return text.slice(0, MAX_TEXT).trim();
+}
+
+/**
+ * The request as a `mailto:` link (the fallback on an older core).
+ *
+ * @param   {{to?: *, cc?: *, bcc?: *, subject?: string, body?: string}} request
+ * @returns {string}
+ */
+export function mailtoHref({to, cc, bcc, subject, body} = {}) {
+    const enc = (list) => addressesOf(list).map(a => encodeURIComponent(a).replace(/%40/g, '@')).join(',');
+    const s = cleanText(subject, {oneLine: true});
+    const b = cleanText(body);
+    const query = [];
+    if (enc(cc)) query.push(`cc=${enc(cc)}`);
+    if (enc(bcc)) query.push(`bcc=${enc(bcc)}`);
+    if (s) query.push(`subject=${encodeURIComponent(s)}`);
+    if (b) query.push(`body=${encodeURIComponent(b)}`);
+    return `mailto:${enc(to)}${query.length ? `?${query.join('&')}` : ''}`;
+}
+
+/** Copy text: the clipboard, else the old copy command, else a box to copy it from by hand. */
+async function copyText(text) {
+    try {
+        await navigator.clipboard.writeText(text);
+        return true;
+    } catch { /* next */ }
+    const box = document.createElement('textarea');
+    box.className = 'form-input';
+    box.readOnly = true;
+    box.rows = 6;
+    box.value = text;
+    try {
+        box.style.position = 'fixed';
+        box.style.opacity = '0';
+        document.body.appendChild(box);
+        box.select();
+        if (document.execCommand('copy')) return true;
+    } catch { /* next */ } finally {
+        box.remove();
+        box.style.position = '';
+        box.style.opacity = '';
+    }
+    const modal = E.modal({title: 'Copy the addresses', size: 'medium', buttons: [{id: 'close', text: 'Close', variant: 'secondary'}]});
+    modal.element.appendChild(box);   // light DOM: setContent would strip the textarea
+    modal.open();
+    box.select();
+    return false;
+}
+
+/**
+ * Hand the request to the device's mail program - unless the link would be
+ * too long for it, when the addresses are copied instead and the toast says
+ * what did not go.
+ */
+async function openMailto(request) {
+    const href = mailtoHref(request);
+    if (href.length <= MAX_MAILTO) {
+        location.href = href;
+        return 'mailto';
+    }
+    const all = addressesOf([...addressesOf(request.to), ...addressesOf(request.cc), ...addressesOf(request.bcc)]);
+    const copied = all.length ? await copyText(all.join(', ')) : false;
+    const lost = [cleanText(request.subject) && 'the subject', cleanText(request.body) && 'the message'].filter(Boolean);
+    E.toast(`Too long for your mail program to open. ${all.length
+        ? `${copied ? 'The' : 'Copy the'} ${all.length} address${all.length === 1 ? '' : 'es'}${copied ? ' are copied' : ''} - paste them into Bcc of a new email.` : ''}${lost.length ? ` Not carried over: ${lost.join(' and ')}.` : ''}`,
+    {type: 'warning', duration: 9000});
+    return 'copied';
+}
+
+const decode = (s) => { try { return decodeURIComponent(s); } catch { return s; } };
+
+/**
+ * A `mailto:` link read back into a request (what a visible link carries).
+ * When the address part holds anything that is not an address, the query
+ * is ignored: an address stored as `me@x.com?body=…` must not prefill a message.
+ *
+ * @param   {string} href
+ * @returns {null|{to: string[], cc: string[], bcc: string[], subject: string, body: string}}
+ */
+export function parseMailto(href) {
+    const m = String(href ?? '').match(/^mailto:([^?]*)(?:\?(.*))?$/i);
+    if (!m) return null;
+    const split = (s) => decode(s || '').split(/[,;]/).map(x => x.trim()).filter(Boolean);
+    const named = split(m[1]);
+    const out = {to: addressesOf(named), cc: [], bcc: [], subject: '', body: ''};
+    if (named.some(a => !looksLikeAddress(a))) return out;
+    for (const pair of (m[2] || '').split('&')) {
+        const i = pair.indexOf('=');
+        if (i < 1) continue;
+        const key = pair.slice(0, i).toLowerCase();
+        const value = pair.slice(i + 1);
+        if (key === 'to') out.to = addressesOf([...out.to, ...split(value)]);
+        else if (key === 'cc' || key === 'bcc') out[key] = addressesOf([...out[key], ...split(value)]);
+        else if (key === 'subject') out.subject = cleanText(decode(value), {oneLine: true});
+        else if (key === 'body') out.body = cleanText(decode(value));
+    }
+    return out;
+}
+
+/**
+ * Email someone. Recipients are `{name, address}`, `{name, email}` or bare
+ * addresses; several people belong in `bcc`, so nobody sees the others.
+ * With nobody to address (a link to pass on) compose still opens, To empty.
+ *
+ * @param   {{to?: *, cc?: *, bcc?: *, subject?: string, body?: string}} request
+ * @returns {Promise<'compose'|'mailto'|'copied'|'none'>}
+ */
+export async function emailTo(request = {}) {
+    const mail = await loadCore();
+    if (!mail) return openMailto(request);
+    const r = mail.composeRequest(request);
+    if (r.to.length || r.cc.length || r.bcc.length) return mail.openEmail(r);
+    if (await mail.emailReady()) {
+        location.hash = mail.composeHash(r);
+        return 'compose';
+    }
+    location.href = mail.mailtoHref(r);
+    return 'mailto';
+}
+
+/**
+ * Send plain clicks on the `mailto:` links inside `root` through `emailTo()`.
+ * A modified click (new tab/window) or one already handled is left alone.
+ *
+ * @param   {Element} root
+ * @returns {() => void} removes the listener
+ */
+export function routeMailLinks(root) {
+    if (!root) return () => {};
+    const onClick = (e) => {
+        if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
+        const a = e.target?.closest?.('a[href^="mailto:" i]');
+        if (!a || !root.contains(a)) return;
+        const request = parseMailto(a.getAttribute('href'));
+        if (!request) return;
+        e.preventDefault();
+        emailTo(request);
+    };
+    root.addEventListener('click', onClick);
+    return () => root.removeEventListener('click', onClick);
+}

package/plugins/booking/admin/views/panels.js

@@ -14,6 +14,7 @@ import {
 import {atWallClock, isDate, toMinutes, wallClock} from '/plugins/booking/public/lib/time.js';
 import {answerRows, placesLabel, sourceLabel, withNames} from '../lib/details.js';
 import {mountSections} from '../lib/extension-sections.js';
+import {emailTo, looksLikeAddress, routeMailLinks} from '../lib/email.js';
 
 /** Places per session a service takes (Booking Pro's classes); 1 for an appointment. */
 const capacityOf = (svc) => Math.max(1, Number(svc?.ext?.['booking-pro']?.capacity) || 1);
@@ -45,7 +46,7 @@ export function bookingMenu(ctx, b) {
         {label: 'Mark as no-show', icon: 'user-remove', disabled: () => !live || b.status === 'no-show', action: () => setStatus(ctx, b, 'no-show')},
         {label: 'Back to booked', icon: 'rotate-ccw', disabled: () => !live || b.status === 'confirmed', action: () => setStatus(ctx, b, 'confirmed')},
         {type: 'divider'},
-        {label: 'Email the customer', icon: 'mail', disabled: () => !b.email, action: () => { location.href = `mailto:${encodeURIComponent(b.email)}?subject=${encodeURIComponent(`Your booking: ${b.serviceName}`)}`; }},
+        {label: 'Email the customer', icon: 'mail', disabled: () => !b.email, action: () => emailTo({to: [{name: b.name, address: b.email}], subject: `Your booking: ${b.serviceName}`})},
         ...(b.contactId && ctx.boot.contacts ? [{label: 'Open Contacts', icon: 'users', action: () => { location.hash = '#/contacts'; }}] : []),
         {type: 'divider'},
         live
@@ -510,6 +511,7 @@ export async function openBooking(ctx, id) {
     const answers = answerRows(b.ext?.answers, ctx.boot.services.find(x => x.id === b.serviceId));
     let panel = null;
     let sections = null;
+    let unrouteMail = () => {};
     const act = (fn) => async () => { const r = await fn(); if (r) panel?.close(); };
     panel = await openPanel({
         title: `${b.serviceName}: ${b.name}`,
@@ -522,8 +524,10 @@ export async function openBooking(ctx, id) {
             values: () => ({staffNote: staffNote.peek()}),
             apply: (v) => { if (typeof v.staffNote === 'string') staffNote.value = v.staffNote; }
         },
-        cleanup: () => sections?.destroy(),
+        cleanup: () => { sections?.destroy(); unrouteMail(); },
         before: (el) => {
+            // The customer's address stays a link; a click goes to Email Pro's compose when it can.
+            unrouteMail = routeMailLinks(el);
             sections = mountSections(el.querySelector('[data-part="ext"]'), 'bookingPanel', {boot: ctx.boot, booking: b,
                 refresh: () => { panel?.close(true); ctx.openBooking ? ctx.openBooking(b.id) : openBooking(ctx, b.id); }});
         },
@@ -537,7 +541,7 @@ export async function openBooking(ctx, id) {
     ${detail('With', withNames(b))}
     ${b.online ? detail('Where', 'Online - a video call') : ''}
     ${detail('Customer', b.name)}
-    ${detail('Email', b.email, b.email ? `mailto:${b.email}` : '')}
+    ${detail('Email', b.email, looksLikeAddress(b.email) ? `mailto:${encodeURIComponent(b.email)}` : '')}
     ${detail('Phone', b.phone, b.phone ? `tel:${b.phone.replace(/[^+\d]/g, '')}` : '')}
     ${detail('Their notes', b.notes)}
     ${detail('Booked', `${sourceLabel(b.source)} · ${fmtDateTime(b.createdAt || b.history?.[0]?.at)}`)}

package/plugins/booking/plugin.json

@@ -1,7 +1,7 @@
 {
   "name": "booking",
   "displayName": "Booking",
-  "version": "1.7.0",
+  "version": "1.7.1",
   "tier": "free",
   "description": "Let people book appointments with you or your team, and rooms or equipment, from a booking page on your site. Opening hours, days off and buffers; confirmation and reminder emails with a link to change or cancel; a diary in the admin. Book straight from a contact or an email.",
   "author": "Domma CMS",

package/plugins/booking/tests/email.test.js

@@ -0,0 +1,69 @@
+/**
+ * admin/lib/email.js - the mailto: fallback and link reading (node has no
+ * /admin/js/lib/mail-compose.js, so emailTo() here is the older-core path).
+ */
+import {test} from 'node:test';
+import assert from 'node:assert/strict';
+import {emailTo, looksLikeAddress, mailtoHref, parseMailto} from '../admin/lib/email.js';
+
+test('mailtoHref: one person in To, subject and body encoded, @ readable', () => {
+    assert.equal(mailtoHref({to: [{name: 'Ann', address: 'ann+x@example.test'}], subject: 'Hi & bye', body: 'Line 1\nLine 2'}),
+        'mailto:ann%2Bx@example.test?subject=Hi%20%26%20bye&body=Line%201%0ALine%202');
+});
+
+test('mailtoHref: several people in Bcc, strings and contacts alike', () => {
+    assert.equal(mailtoHref({bcc: ['a@x.test', {email: 'b@x.test'}], subject: 'S'}), 'mailto:?bcc=a@x.test,b@x.test&subject=S');
+});
+
+test('parseMailto reads back what mailtoHref writes, and plain links', () => {
+    const r = parseMailto(mailtoHref({to: 'a@x.test', cc: ['c@x.test'], bcc: ['b@x.test', 'd@x.test'], subject: 'Hi + there', body: 'Join: https://x.test/?a=1&b=2'}));
+    assert.deepEqual(r, {to: ['a@x.test'], cc: ['c@x.test'], bcc: ['b@x.test', 'd@x.test'], subject: 'Hi + there', body: 'Join: https://x.test/?a=1&b=2'});
+    assert.deepEqual(parseMailto('mailto:ann@example.test'), {to: ['ann@example.test'], cc: [], bcc: [], subject: '', body: ''});
+    assert.equal(parseMailto('https://example.test'), null);
+});
+
+test('emailTo on a core without mail-compose.js keeps the old mailto:', async () => {
+    const saved = globalThis.location;
+    globalThis.location = {href: '', hash: ''};
+    try {
+        assert.equal(await emailTo({to: [{name: 'Ann', address: 'ann@example.test'}], subject: 'Hello'}), 'mailto');
+        assert.equal(globalThis.location.href, 'mailto:ann@example.test?subject=Hello');
+        assert.equal(globalThis.location.hash, '');
+    } finally {
+        globalThis.location = saved;
+    }
+});
+
+test('fallback hardening: bad addresses dropped, repeats once, subject one line, text capped', () => {
+    for (const bad of ['a b@x.test', 'a@x.test\r\nBcc: c@x.test', '<a@x.test>', 'a@x.test,b@x.test', 'a@x.test?body=hi', 'nobody']) assert.equal(looksLikeAddress(bad), false, bad);
+    const href = mailtoHref({to: ['A@x.test', 'a@x.test', 'a b@x.test', 'me@x.test?body=evil'], subject: 'Hi\r\nBcc: c@x.test', body: 'x'.repeat(3000)});
+    assert.ok(href.startsWith('mailto:A@x.test?subject=Hi%20Bcc%3A%20c%40x.test&body='), href);
+    assert.equal(decodeURIComponent(href.split('body=')[1]).length, 2000);
+});
+
+test('parseMailto ignores the query when the address part is not an address', () => {
+    // An address stored as "me@x.com?body=..." and encoded into a link.
+    assert.deepEqual(parseMailto(`mailto:${encodeURIComponent('me@x.test?body=Pay now')}`), {to: [], cc: [], bcc: [], subject: '', body: ''});
+    assert.deepEqual(parseMailto('mailto:me@x.test%0D%0Abcc:z@x.test?subject=Hi&bcc=y@x.test'), {to: [], cc: [], bcc: [], subject: '', body: ''});
+    assert.deepEqual(parseMailto('mailto:?subject=Join&body=link').subject, 'Join');
+});
+
+test('emailTo on an old core: a mailto over 1800 characters is not opened - the addresses are copied', async () => {
+    const saved = {location: globalThis.location, E: globalThis.E, nav: Object.getOwnPropertyDescriptor(globalThis, 'navigator')};
+    let copied = '';
+    const toasts = [];
+    globalThis.location = {href: '', hash: ''};
+    globalThis.E = {toast: (m) => toasts.push(m)};
+    Object.defineProperty(globalThis, 'navigator', {value: {clipboard: {writeText: async (t) => { copied = t; }}}, configurable: true});
+    try {
+        const bcc = Array.from({length: 120}, (_, i) => `person${i}@example.test`);
+        assert.equal(await emailTo({bcc, subject: 'News'}), 'copied');
+        assert.equal(globalThis.location.href, '');
+        assert.equal(copied, bcc.join(', '));
+        assert.match(toasts[0], /120 addresses are copied.*Not carried over: the subject/);
+    } finally {
+        globalThis.location = saved.location;
+        globalThis.E = saved.E;
+        if (saved.nav) Object.defineProperty(globalThis, 'navigator', saved.nav); else delete globalThis.navigator;
+    }
+});