@mathzetta/inlinemath 0.1.0 → 0.2.0

package/dist/inlinemath.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
-import{t}from"./chunks/html-DWtfytjA.js";export{a as toHTML}from"./chunks/html-DWtfytjA.js";import{l as e,a as s,s as i,t as h,p as r,b as o}from"./chunks/lite-Bj_L6w2g.js";export{D as DEFAULTS,P as PATHS,n as nodeAt,c as numberTree}from"./chunks/lite-Bj_L6w2g.js";import"./chunks/calculate-BX9lJ7Ff.js";class l{constructor(t,e,s={}){this.element=t,this.options=s,this.p=s.prefix||"mv",this.handlers=[],this.set(e)}set(i,{animate:n=!1,duration:h=600,easing:r="ease-in-out"}={}){const o=n&&this.tree?this.snapshot():null;return this.tree=t(i,this.options),this.element.innerHTML=e(this.tree,s(this.tree,this.options)).html,this.root=this.element.firstElementChild,this.handlers.length&&this.root.classList.add(`${this.p}-clickable`),o&&this.morph(o,{duration:h,easing:r}),this}nodes(t){return i(this.tree,t)}elements(t){return this.nodes(t).map(t=>this.elementOf(t)).filter(Boolean)}elementOf(t){return void 0===t.id?null:this.root.querySelector(`[data-node="${t.id}"]`)}highlight(t,e=`${this.p}-hl`){return this.elements(t).forEach(t=>t.classList.add(e)),this}unhighlight(t=null,e=`${this.p}-hl`){return(null===t?this.root.querySelectorAll(`.${e}`):this.elements(t)).forEach(t=>t.classList.remove(e)),this}color(t,e){return this.elements(t).forEach(t=>{t.style.color=e||""}),this}on(t,e){const s=t=>{const s=t.target.closest?.("[data-node]");if(!s||!this.root.contains(s))return;const n=Number(s.dataset.node),h=i(this.tree,n)[0];e({node:h,id:n,path:r(this.tree,n),element:s,event:t})};return this.element.addEventListener(t,s),this.handlers.push([t,s]),this.root.classList.add(`${this.p}-clickable`),()=>this.element.removeEventListener(t,s)}segments(t={}){return h(this.tree,t)}showSegment(t,e=`${this.p}-hl`){return this.unhighlight(null,e),t&&void 0!==t.id&&this.highlight(t.id,e),this}snapshot(){const t=new Map,e=s=>{const i=this.elementOf(s);if(i){const e=o(s);t.has(e)||t.set(e,[]),t.get(e).push(i.getBoundingClientRect())}"op"===s.type&&s.args.forEach(e)};return e(this.tree),t}morph(t,{duration:e,easing:s}){if("undefined"==typeof Element||!Element.prototype.animate)return;const i=n=>{const h=this.elementOf(n),r=h&&t.get(o(n));if(r&&r.length){const t=r.shift(),i=h.getBoundingClientRect(),n=t.left-i.left,o=t.top-i.top,a=i.width?t.width/i.width:1,l=i.height?t.height/i.height:1;return void((Math.abs(n)+Math.abs(o)>.5||Math.abs(a-1)+Math.abs(l-1)>.01)&&h.animate([{transformOrigin:"0 0",transform:`translate(${n}px, ${o}px) scale(${a}, ${l})`},{transformOrigin:"0 0",transform:"none"}],{duration:e,easing:s}))}"op"===n.type?n.args.forEach(i):h&&h.animate([{opacity:0},{opacity:0},{opacity:1}],{duration:e,easing:s})};i(this.tree)}}function m(t,e,s={}){return new l(t,e,s)}export{l as View,e as layout,r as pathOf,m as render,i as select,o as signature,t as treeOf};
+/* Inline Math 0.2.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
+import{t}from"./chunks/html-CupluJSh.js";export{a as toHTML}from"./chunks/html-CupluJSh.js";import{l as e,a as s,t as i,s as r,p as n,n as o,b as h,c as l}from"./chunks/lite-3Fb-OHbt.js";export{D as DEFAULTS,P as PATHS,d as numberTree}from"./chunks/lite-3Fb-OHbt.js";import{o as c,r as u}from"./chunks/edit-M68aRA5o.js";import"./chunks/calculate-Cz87Lt0N.js";class f{constructor(t,e,s={}){this.element=t,this.options=s,this.p=s.prefix||"mv",this.handlers=[],this.clicks=[],this.active=null,this.live=p(t,s.announce,this.p),this.set(e)}set(i,{animate:r=!1,duration:n=600,easing:o="ease-in-out"}={}){const h=m(r)&&this.tree?this.snapshot():null,a=void 0!==this.tree;return this.tree=t(i,this.options),this.element.innerHTML=e(this.tree,s(this.tree,this.options)).html,this.root=this.element.firstElementChild,this.handlers.length&&this.root.classList.add(`${this.p}-clickable`),this.editing&&this.root.classList.add(`${this.p}-editable`),this.active=null,(this.clicks.length||this.editing)&&this.focusable(),h&&this.morph(h,{duration:n,easing:o}),a&&this.live&&this.announce(this.spoken()),this}spoken(){const t=this.root&&this.root.getAttribute&&this.root.getAttribute("aria-label");if(t)return t;try{return i(this.tree)}catch{return""}}announce(t){return this.say(this.live,t)}say(t,e){if(!t)return this;t.textContent="";const s=()=>{t.textContent=e};return"function"==typeof requestAnimationFrame?requestAnimationFrame(()=>requestAnimationFrame(s)):setTimeout(s,50),this}nodes(t){return r(this.tree,t)}elements(t){return this.nodes(t).map(t=>this.elementOf(t)).filter(Boolean)}elementOf(t){return void 0===t.id?null:this.root.querySelector(`[data-node="${t.id}"]`)}highlight(t,e=`${this.p}-hl`){return this.elements(t).forEach(t=>t.classList.add(e)),this}unhighlight(t=null,e=`${this.p}-hl`){return(null===t?this.root.querySelectorAll(`.${e}`):this.elements(t)).forEach(t=>t.classList.remove(e)),this}color(t,e){return this.elements(t).forEach(t=>{t.style.color=e||""}),this}on(t,e){const s=t=>{const s=t.target.closest?.("[data-node]");if(!s||!this.root.contains(s))return;const i=Number(s.dataset.node),o=r(this.tree,i)[0];e({node:o,id:i,path:n(this.tree,i),element:s,event:t})};return this.element.addEventListener(t,s),this.handlers.push([t,s]),this.root.classList.add(`${this.p}-clickable`),"click"===t&&(this.clicks.push(e),this.keyboard()),()=>{this.element.removeEventListener(t,s),this.clicks=this.clicks.filter(t=>t!==e)}}editable({toText:t,onEdit:e}={}){if("function"!=typeof t)throw new Error("editable needs { toText } (import { toText } from 'mathzetta/text')");return this.editing={toText:t,onEdit:e},this.root&&this.root.classList&&this.root.classList.add(`${this.p}-editable`),this.keyboard(),!this.editOn&&this.element.addEventListener&&(this.editOn=!0,this.element.addEventListener("dblclick",t=>{const e=t.target.closest?.("[data-node]");e&&this.root.contains(e)&&(t.preventDefault(),this.edit(r(this.tree,Number(e.dataset.node))[0]))})),this}edit(e=this.tree,{returnFocus:s=!1}={}){if(!this.editing)throw new Error("call editable({ toText }) first");const r="object"==typeof e&&e&&e.type?e:this.nodes(e)[0];if(!r)return null;const h=n(this.tree,r.id)||[],a=this.elementOf(r)||this.root;let l="Edit";try{l=`Edit ${i(r)}`}catch{}const d=()=>{s&&this.root.focus&&this.root.focus()};return c(a,this.editing.toText(r),{label:l,parse:e=>t(e,this.options),commit:(t,e)=>{this.set(u(this.tree,h,t),{animate:!0});const i=o(this.tree,h);s&&i&&this.focusPart(i===this.tree?null:i),d(),this.editing.onEdit&&this.editing.onEdit({tree:this.tree,text:this.editing.toText(this.tree),path:h,part:e})},cancel:d})}focusable(){this.root&&this.root.setAttribute&&(this.root.setAttribute("tabindex","0"),this.root.getAttribute("aria-label")||(this.root.setAttribute("role","math"),this.root.setAttribute("aria-label",this.spoken())),this.root.setAttribute("aria-description",this.editing?"Arrow keys move between parts, F2 edits one.":"Arrow keys move between parts, Enter selects one."))}keyboard(){this.focusable(),!this.keysOn&&this.element.addEventListener&&(this.keysOn=!0,this.partsLive=this.live||p(this.element,!0,this.p),this.element.addEventListener("keydown",t=>this.key(t)))}key(t){if(!this.root||!this.root.contains(t.target))return;const e=this.active;let s;switch(t.key){case"ArrowDown":s=e?this.partsOf(e)[0]:this.partsOf(this.tree)[0];break;case"ArrowUp":s=e?this.outerOf(e):void 0;break;case"ArrowRight":s=e?this.neighbour(e,1):this.partsOf(this.tree)[0];break;case"ArrowLeft":s=e?this.neighbour(e,-1):void 0;break;case"Home":case"Escape":s=null;break;case"F2":if(!this.editing)return;return t.preventDefault(),void this.edit(e||this.tree,{returnFocus:!0});case"Enter":case" ":{t.preventDefault();const s=e||this.tree,i=this.elementOf(s)||this.root,r={node:s,id:s.id,path:n(this.tree,s.id),element:i,event:t};for(const t of this.clicks)t(r);return}default:return}t.preventDefault(),void 0!==s&&this.focusPart(s)}focusPart(t){const e=`${this.p}-focus`;this.root.querySelectorAll(`.${e}`).forEach(t=>t.classList.remove(e)),this.active=t;const s=t&&this.elementOf(t);s&&s.classList.add(e);let r="";try{r=t?i(t):this.spoken()}catch{r=""}return this.say(this.partsLive,r),this}partsOf(t){const e=[],s=t=>{this.elementOf(t)?e.push(t):"op"===t.type&&t.args.forEach(s)};return t&&"op"===t.type&&t.args.forEach(s),e}outerOf(t){const e=n(this.tree,t.id);for(let t=e?e.length-1:-1;t>0;t--){const s=o(this.tree,e.slice(0,t));if(s&&this.elementOf(s))return s}return null}neighbour(t,e){const s=this.partsOf(this.outerOf(t)||this.tree),i=s.indexOf(t);return i<0?void 0:s[i+e]}segments(t={}){return h(this.tree,t)}showSegment(t,e=`${this.p}-hl`){return this.unhighlight(null,e),t&&void 0!==t.id&&this.highlight(t.id,e),this}snapshot(){const t=new Map,e=s=>{const i=this.elementOf(s);if(i){const e=l(s);t.has(e)||t.set(e,[]),t.get(e).push(i.getBoundingClientRect())}"op"===s.type&&s.args.forEach(e)};return e(this.tree),t}morph(t,{duration:e,easing:s}){if("undefined"==typeof Element||!Element.prototype.animate)return;const i=r=>{const n=this.elementOf(r),o=n&&t.get(l(r));if(o&&o.length){const t=o.shift(),i=n.getBoundingClientRect(),r=t.left-i.left,h=t.top-i.top,a=i.width?t.width/i.width:1,l=i.height?t.height/i.height:1;return void((Math.abs(r)+Math.abs(h)>.5||Math.abs(a-1)+Math.abs(l-1)>.01)&&n.animate([{transformOrigin:"0 0",transform:`translate(${r}px, ${h}px) scale(${a}, ${l})`},{transformOrigin:"0 0",transform:"none"}],{duration:e,easing:s}))}"op"===r.type?r.args.forEach(i):n&&n.animate([{opacity:0},{opacity:0},{opacity:1}],{duration:e,easing:s})};i(this.tree)}}function p(t,e,s){if(!e)return null;if("object"==typeof e&&1===e.nodeType)return e;if("undefined"==typeof document||!t.insertAdjacentElement)return null;const i=document.createElement("span");return i.className=`${s}-sr-only`,i.setAttribute("aria-live","polite"),i.setAttribute("aria-atomic","true"),t.insertAdjacentElement("afterend",i),i}function m(t){return!!t&&("always"===t||!("function"==typeof matchMedia&&matchMedia("(prefers-reduced-motion: reduce)").matches))}function g(t,e,s={}){return new f(t,e,s)}export{f as View,e as layout,o as nodeAt,n as pathOf,g as render,r as select,m as shouldAnimate,l as signature,t as treeOf};

package/dist/lite-calc.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
-import{c as o}from"./chunks/calculate-BX9lJ7Ff.js";export{a as calculate}from"./chunks/calculate-BX9lJ7Ff.js";import{d as e,e as t}from"./chunks/lite-Bj_L6w2g.js";export{D as DEFAULTS,l as layout,c as numberTree,s as select}from"./chunks/lite-Bj_L6w2g.js";const r=(s,c={})=>e(s,{...c,blocks:c.blocks??o}),u=(s,c={})=>t(s,{...c,blocks:c.blocks??o});export{o as calculateBlock,r as toHTML,u as treeOf};
+/* Inline Math 0.2.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
+import{c}from"./chunks/calculate-Cz87Lt0N.js";export{a as calculate}from"./chunks/calculate-Cz87Lt0N.js";import{e as o,f as e}from"./chunks/lite-3Fb-OHbt.js";export{D as DEFAULTS,l as layout,d as numberTree,s as select}from"./chunks/lite-3Fb-OHbt.js";const t=(s,a={})=>o(s,{...a,blocks:a.blocks??c}),r=(s,a={})=>e(s,{...a,blocks:a.blocks??c});export{c as calculateBlock,t as toHTML,r as treeOf};

package/dist/lite.external.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; MathZetta not included: map mathzetta, mathzetta/speech and mathzetta/calculate with an import map */
-export{D as DEFAULTS,l as layout,n as numberTree,s as select,t as toHTML,a as treeOf}from"./chunks/draw-Cm4exbg7.js";import"mathzetta";import"mathzetta/speech";
+/* Inline Math 0.2.0 — MIT licence; MathZetta not included: map mathzetta, mathzetta/speech and mathzetta/calculate with an import map */
+export{D as DEFAULTS,l as layout,n as numberTree,s as select,t as toHTML,a as treeOf}from"./chunks/draw-Bev17BJJ.js";import"mathzetta";import"mathzetta/speech";

package/dist/lite.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
-export{D as DEFAULTS,l as layout,c as numberTree,s as select,d as toHTML,e as treeOf}from"./chunks/lite-Bj_L6w2g.js";
+/* Inline Math 0.2.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
+export{D as DEFAULTS,l as layout,d as numberTree,s as select,e as toHTML,f as treeOf}from"./chunks/lite-3Fb-OHbt.js";

package/dist/markdown.external.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; MathZetta not included: map mathzetta, mathzetta/speech and mathzetta/calculate with an import map */
-import{a as t}from"./chunks/html-CvuSyhzk.js";import{calculate as e}from"mathzetta/calculate";import"./chunks/draw-Cm4exbg7.js";import"mathzetta";import"mathzetta/speech";const n=new RegExp("(\\d+)","g");function s(t,{delimiters:e=["$$","$","\\[","\\("]}={}){const n=[];let s="",i=0;const r=String(t),l=t=>0===t||"\n"===r[t-1],o=(t,e,s)=>(n.push({source:t,display:e,raw:s}),`${n.length-1}`);for(;i<r.length;){if(l(i)){const t=/^( {0,3})(`{3,}|~{3,})([^\n]*)\n?/.exec(r.slice(i));if(t){const e=t[2],n=new RegExp(`\\n {0,3}${"`"===e[0]?"`":"~"}{${e.length},}[ \\t]*(?=\\n|$)`),c=r.slice(i+t[0].length),l=n.exec(`\n${c}`),a=l?c.slice(0,Math.max(0,l.index-1)):c,p=t[0].length+(l?l.index-1+l[0].length:c.length),h=r.slice(i,i+p);"math"===t[3].trim()?s+=o(a,!0,h):s+=h,i+=p;continue}}const t=r[i];if("`"===t){const t=/^`+/.exec(r.slice(i))[0],e=r.indexOf(t,i+t.length);if(e>-1){s+=r.slice(i,e+t.length),i=e+t.length;continue}s+=t,i+=t.length;continue}if("\\"===t){const t=r.slice(i,i+2),n="\\["===t?"\\]":"\\("===t?"\\)":null;if(n&&e.includes(t)){const e=r.indexOf(n,i+2);if(e>-1){s+=o(r.slice(i+2,e),"\\["===t,r.slice(i,e+2)),i=e+2;continue}}s+=t,i+=2;continue}if("$"===t)if("$"===r[i+1]&&e.includes("$$")){const t=r.indexOf("$$",i+2);if(t>-1){s+=o(r.slice(i+2,t),!0,r.slice(i,t+2)),i=t+2;continue}}else if(e.includes("$")&&r[i+1]&&!/\s/.test(r[i+1])){const t=c(r,i+1);if(t>-1){s+=o(r.slice(i+1,t),!1,r.slice(i,t+1)),i=t+1;continue}}s+=t,i++}return{text:s,math:n}}function c(t,e){for(let n=e;n<t.length;n++){const e=t[n];if("\\"!==e){if("`"===e)return-1;if("\n"===e&&/^\n[ \t]*\n/.test(t.slice(n)))return-1;if("$"===e&&!/\s/.test(t[n-1])&&!/\d/.test(t[n+1]??"")&&"$"!==t[n+1])return n}else n++}return-1}const i=t=>String(t).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;"),r=/^\s*([A-Za-zͰ-Ͽ](?:_\{?\w+\}?)?)\s*(?::=|=)\s*([^=<>≤≥]+)$/;function l(n,s,c){const{source:l,display:o}=n;try{const n=t(l,{...s.math,display:o,blocks:s.blocks,scope:c});return!1!==s.define&&function(t,n){const s=r.exec(t);if(!s||/\{\{/.test(s[2]))return;try{const t=e(s[2],n);"number"!=typeof t.value&&"bigint"!=typeof t.value||(n[s[1].replace(/[{}]/g,"")]=t.exact?t.text:t.value)}catch{}}(l,c),o?`<span class="mv-md-display">${n}</span>`:`<span class="mv-md-math">${n}</span>`}catch(t){return`<span class="mv-md-error" title="${i(t.message)}"><code>${i(n.raw)}</code></span>`}}const o=/^(https?:|mailto:|#|\/|\.{0,2}\/|[^:]*$)/i,a=t=>o.test(t.trim())?i(t.trim()):"#";function p(t,e,n){const s=[],c=t=>(s.push(t),`${s.length-1}`);let r=t;return r=r.replace(/(`+)([\s\S]*?[^`])\1(?!`)/g,(t,e,s)=>c(`<code>${i(n(s.trim()))}</code>`)),r=r.replace(/\\([\\`*_{}[\]()#+\-.!|~$<>"'])/g,(t,e)=>c(i(e))),r=r.replace(/<((?:https?:\/\/|mailto:)[^\s>]+)>/g,(t,e)=>c(`<a href="${a(e)}">${i(e)}</a>`)),e.html&&(r=r.replace(/<\/?[A-Za-z][^>]*>/g,t=>c(t))),r=r.replace(/!\[([^\]]*)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(t,e,n,s)=>c(`<img src="${a(n)}" alt="${i(e)}"${s?` title="${i(s)}"`:""}>`)),r=r.replace(/\[([^\]]+)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(t,s,r,l)=>c(`<a href="${a(r)}"${l?` title="${i(l)}"`:""}>${p(s,e,n)}</a>`)),r=i(r),r=r.replace(/(\*\*|__)(?=\S)([\s\S]*?\S)\1/g,"<strong>$2</strong>"),r=r.replace(/(^|[^*\w])\*(?=\S)([\s\S]*?\S)\*(?!\*)/g,"$1<em>$2</em>"),r=r.replace(/(^|[^_\w])_(?=\S)([\s\S]*?\S)_(?![_\w])/g,"$1<em>$2</em>"),r=r.replace(/~~(?=\S)([\s\S]*?\S)~~/g,"<del>$1</del>"),r=r.replace(/( {2,}|\\)\n/g,"<br>\n"),r.replace(/(\d+)/g,(t,e)=>s[Number(e)])}const h=/^( {0,3})(#{1,6}\s|>|```|~~~|([-*+]|\d{1,9}[.)])\s|(\*[ \t]*){3,}$|(-[ \t]*){3,}$|(_[ \t]*){3,}$)/,u=/^( {0,3})([-*+]|\d{1,9}[.)])(\s+|$)/,$=/^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;function g(t,e,n){const s=[];let c=0;const r=t=>p(t,e,n);for(;c<t.length;){const l=t[c];if(!l.trim()){c++;continue}const o=/^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)/.exec(l);if(o){const e=[];for(c++;c<t.length&&!new RegExp(`^ {0,3}${"`"===o[1][0]?"`":"~"}{${o[1].length},}\\s*$`).test(t[c]);)e.push(t[c++]);c++;const r=o[2]?` class="language-${i(o[2])}"`:"";s.push(`<pre><code${r}>${i(n(e.join("\n")))}</code></pre>`);continue}const a=/^ {0,3}(#{1,6})\s+(.*?)\s*#*\s*$/.exec(l);if(a){s.push(`<h${a[1].length}>${r(a[2])}</h${a[1].length}>`),c++;continue}if(/^ {0,3}((\*[ \t]*){3,}|(-[ \t]*){3,}|(_[ \t]*){3,})$/.test(l)){s.push("<hr>"),c++;continue}if(/^ {0,3}>/.test(l)){const i=[];for(;c<t.length&&t[c].trim()&&(/^ {0,3}>/.test(t[c])||i.length);)i.push(t[c].replace(/^ {0,3}> ?/,"")),c++;s.push(`<blockquote>\n${g(i,e,n)}\n</blockquote>`);continue}const p=u.exec(l);if(p){const i=/\d/.test(p[2]),r=i?parseInt(p[2],10):1,l=[];let o=!1;for(;c<t.length;){const e=u.exec(t[c]);if(!e||/\d/.test(e[2])!==i)break;const n=e[0].length,s=[t[c].slice(n)];for(c++;c<t.length;){const e=t[c];if(!e.trim()){const e=t[c+1];if(void 0!==e&&e.startsWith(" ".repeat(Math.min(n,4)))&&e.trim()){s.push(""),o=!0,c++;continue}void 0!==e&&u.test(e)&&(o=!0);break}if(e.startsWith(" ".repeat(Math.min(n,4))))s.push(e.slice(Math.min(n,4)));else{if(u.test(e)||h.test(e))break;s.push(e)}c++}for(l.push(s);c<t.length&&!t[c].trim()&&void 0!==t[c+1]&&u.test(t[c+1]);)c++}const a=i?"ol":"ul",$=l.map(t=>{let s=g(t,e,n);return o||(s=s.replace(/^<p>([\s\S]*?)<\/p>/,"$1").replace(/\n<p>([\s\S]*?)<\/p>/g,"\n$1")),`<li>${s}</li>`});s.push(`<${a}${i&&1!==r?` start="${r}"`:""}>\n${$.join("\n")}\n</${a}>`);continue}if(l.includes("|")&&void 0!==t[c+1]&&$.test(t[c+1])&&t[c+1].includes("-")){const e=t=>t.trim().replace(/^\|/,"").replace(/\|$/,"").split(/(?<!\\)\|/).map(t=>t.trim()),n=e(t[c+1]).map(t=>t.startsWith(":")&&t.endsWith(":")?"center":t.endsWith(":")?"right":t.startsWith(":")?"left":""),i=(t,e,s)=>`<${t}${n[s]?` style="text-align:${n[s]}"`:""}>${r(e)}</${t}>`,o=e(l);c+=2;const a=[];for(;c<t.length&&t[c].trim()&&t[c].includes("|");)a.push(e(t[c++]));s.push(`<table>\n<thead><tr>${o.map((t,e)=>i("th",t,e)).join("")}</tr></thead>\n<tbody>\n${a.map(t=>`<tr>${o.map((e,n)=>i("td",t[n]??"",n)).join("")}</tr>`).join("\n")}\n</tbody>\n</table>`);continue}if(/^( {4}|\t)/.test(l)){const e=[];for(;c<t.length&&(/^( {4}|\t)/.test(t[c])||!t[c].trim());)e.push(t[c++].replace(/^( {4}|\t)/,""));for(;e.length&&!e[e.length-1].trim();)e.pop();s.push(`<pre><code>${i(n(e.join("\n")))}</code></pre>`);continue}const m=[];for(;c<t.length&&t[c].trim()&&(!m.length||!h.test(t[c])||/^ {0,3}[-=]+\s*$/.test(t[c]));){if(m.length&&/^ {0,3}(=+|-+)\s*$/.test(t[c])){const e="="===t[c].trim()[0]?1:2;s.push(`<h${e}>${r(m.join("\n"))}</h${e}>`),m.length=0,c++;break}m.push(t[c].replace(/^ {0,3}/,"")),c++}m.length&&s.push(`<p>${r(m.join("\n"))}</p>`)}return s.join("\n")}function m(t,e={},n=t=>t){return g(String(t).replace(/\r\n?/g,"\n").split("\n"),e,n)}function f(t,e={}){const{text:c,math:i}=s(t,e),r={...e.scope??{}},o=i.map(t=>l(t,e,r));return(e.render?e.render(c):m(c,e,t=>t.replace(n,(t,e)=>i[Number(e)].raw))).replace(new RegExp("<p>\\s*(\\d+)\\s*</p>","g"),(t,e)=>i[Number(e)].display?`<div class="mv-md-block">${o[Number(e)]}</div>`:t).replace(n,(t,e)=>o[Number(e)])}function d(t,e,n={}){return t.innerHTML=f(e,n),t}export{s as extractMath,f as markdownToHTML,m as renderMarkdown,d as renderMarkdownInto};
+/* Inline Math 0.2.0 — MIT licence; MathZetta not included: map mathzetta, mathzetta/speech and mathzetta/calculate with an import map */
+import{t as e,a as t}from"./chunks/html-BimAqn7x.js";import{calculate as n}from"mathzetta/calculate";import{v as s,o as r,r as a,u as i,s as o,E as l,b as u,n as d,i as p}from"./chunks/edit-C65xXzo8.js";export{V as Variables,c as createVariables}from"./chunks/edit-C65xXzo8.js";import{toPostfix as m}from"mathzetta";import"mathzetta/speech";import{p as h,c as f,n as $}from"./chunks/draw-Bev17BJJ.js";const g=new RegExp("(\\d+)","g");function v(e,{delimiters:t=["$$","$","\\[","\\("]}={}){const n=[];let s="",r=0;const a=String(e),i=e=>0===e||"\n"===a[e-1],o=(e,t,s)=>(n.push({source:e,display:t,raw:s,start:r,end:r+s.length}),`${n.length-1}`);for(;r<a.length;){if(i(r)){const e=/^( {0,3})(`{3,}|~{3,})([^\n]*)\n?/.exec(a.slice(r));if(e){const t=e[2],n=new RegExp(`\\n {0,3}${"`"===t[0]?"`":"~"}{${t.length},}[ \\t]*(?=\\n|$)`),i=a.slice(r+e[0].length),c=n.exec(`\n${i}`),l=c?i.slice(0,Math.max(0,c.index-1)):i,u=e[0].length+(c?c.index-1+c[0].length:i.length),d=a.slice(r,r+u);"math"===e[3].trim()?s+=o(l,!0,d):s+=d,r+=u;continue}}const e=a[r];if("`"===e){const e=/^`+/.exec(a.slice(r))[0],t=a.indexOf(e,r+e.length);if(t>-1){s+=a.slice(r,t+e.length),r=t+e.length;continue}s+=e,r+=e.length;continue}if("\\"===e){const e=a.slice(r,r+2),n="\\["===e?"\\]":"\\("===e?"\\)":null;if(n&&t.includes(e)){const t=a.indexOf(n,r+2);if(t>-1){s+=o(a.slice(r+2,t),"\\["===e,a.slice(r,t+2)),r=t+2;continue}}s+=e,r+=2;continue}if("$"===e)if("$"===a[r+1]&&t.includes("$$")){const e=a.indexOf("$$",r+2);if(e>-1){s+=o(a.slice(r+2,e),!0,a.slice(r,e+2)),r=e+2;continue}}else if(t.includes("$")&&a[r+1]&&!/\s/.test(a[r+1])){const e=b(a,r+1);if(e>-1){s+=o(a.slice(r+1,e),!1,a.slice(r,e+1)),r=e+1;continue}}s+=e,r++}return{text:s,math:n}}function b(e,t){for(let n=t;n<e.length;n++){const t=e[n];if("\\"!==t){if("`"===t)return-1;if("\n"===t&&/^\n[ \t]*\n/.test(e.slice(n)))return-1;if("$"===t&&!/\s/.test(e[n-1])&&!/\d/.test(e[n+1]??"")&&"$"!==e[n+1])return n}else n++}return-1}const x=e=>String(e).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;"),y=/^\s*([A-Za-z\u0370-\u03ff](?:_\{?\w+\}?)?)\s*=\s*([^=<>≤≥]+)$/;function k(s,r,a,i){const{text:c,math:h}=v(s,r),f=a?a.definitions(i):new Map,g=e=>a?a.textOf(e):e.text,b={...r.scope??{}},k={},w=new Map,S=new Set,E=[],j=()=>{for(const e of Object.keys(k))delete k[e];Object.assign(k,b);for(const e of f.keys())delete k[e];let e=[...f.values()];for(;e.length;){const t=e.filter(e=>{try{const t=n(g(e),k);if("number"==typeof t.value||"bigint"==typeof t.value||Array.isArray(t.value))return k[e.name]=t.exact?t.text:t.value,!1}catch{}return!0});if(t.length===e.length)break;e=t}const t={},s=_({});for(const e of f.keys()){const n=s(e);if(n)try{t[e]=m(o(n,t=>t===e?null:s(t)).tree)}catch{}}k[l]=t},_=t=>{const n=new Map;return s=>{const r=f.get(s);if(!r)return null;if(!n.has(s)){let a=null;try{a=e(g(r),t)}catch{}n.set(s,a)}return n.get(s)}};j();const M=h.map((s,a)=>{const{source:i,display:c}=s,l=c?"mv-md-display":"mv-md-math",m=(e,t="")=>`<span class="${l}${t}" data-mv-md="${a}">${e}</span>`;try{const l={...r.math,display:c,blocks:r.blocks,scope:k},h=function(t){let n=t.trim();const s=n.startsWith("_");s&&(n=n.slice(1).trimStart());let r=n.indexOf(":="),a=2;r<0&&s&&(r=n.search(/(?<![<>!≤≥=])=(?!=)/),a=1);const i=s?{error:"a hidden $_…$ saves a variable: $_A := 2+2$"}:null;if(r<=0)return i;const o=n.slice(0,r).trim(),c=n.slice(r+a).trim();let l=null;try{l=/\{\{/.test(o)?null:d(e(o))}catch{}return null!==l&&c?{hidden:s,lhs:o,name:l,rhs:c,input:p(c)}:i}(i);if(h&&h.error)throw new Error(h.error);if(h){const{name:n,input:r,hidden:i}=h,c=r?{name:n,text:r.default,input:r,key:`input:${JSON.stringify(r)}`}:{name:n,text:h.rhs,input:null,key:`expr:${h.rhs}`,start:s.start,end:s.end};let d="";if(r){const e=function(e,t){const{input:n,name:s}=e,r=`class="mv-md-input mv-md-${n.kind}" data-mv-var="${x(s)}" aria-label="${x(s)}"`;if("dropdown"===n.kind)return`<select ${r}>${n.options.map(e=>`<option value="${x(e)}"${e===t?" selected":""}>${x(e)}</option>`).join("")}</select>`;return"slider"===n.kind?`<input type="range" ${r} min="${n.min}" max="${n.max}" step="${n.step}" value="${x(t)}"><output class="mv-md-output" data-mv-out="${x(s)}">${x(t)}</output>`:`<input type="text" ${r} value="${x(t)}" size="${Math.max(4,t.length+1)}" spellcheck="false" autocomplete="off">`}(c,g(c));d=i?e:`${t(h.lhs,l)}<span class="mv-md-assign" aria-hidden="true">≔</span>${e}`,S.add(a)}else{const n=o(e(h.rhs,l),_(l)).tree;if(!i){const s=$({type:"op",op:"=",args:[u(e(h.lhs)),void 0===n.id?n:u(n)]});E[a]=s,d=function(e){return e.replace('<span class="mv-rel">=</span>','<span class="mv-rel mv-rel-def">≔</span>').replace(/(aria-label="[^"]*?) equals /,"$1 is defined as ").replace("<mo>=</mo>","<mo>≔</mo>")}(t(s,l))}}return f.delete(n),f.set(n,c),w.set(n,c),j(),i&&!r?"":m(d,r?" mv-md-input-def":"")}const{tree:v,changed:M}=o(e(i,l),_(l));M&&$(v),E[a]=v;const O=t(v,l);return!M&&!1!==r.define&&function(e,t,s){const r=y.exec(e);if(!r||/\{\{/.test(r[2]))return!1;const a=r[1].replace(/[{}]/g,"");if(s.has(a))return!1;try{const e=n(r[2],t);if("number"==typeof e.value||"bigint"==typeof e.value||Array.isArray(e.value))return t[a]=e.exact?e.text:e.value,!0}catch{}return!1}(i,b,f)&&j(),m(O)}catch(e){return`<span class="mv-md-error" data-mv-md="${a}" title="${x(e.message)}"><code>${x(s.raw)}</code></span>`}});return{text:c,math:h,drawn:M,defs:w,inputs:S,trees:E}}const w=/^(https?:|mailto:|#|\/|\.{0,2}\/|[^:]*$)/i,S=e=>w.test(e.trim())?x(e.trim()):"#";function E(e,t,n){const s=[],r=e=>(s.push(e),`${s.length-1}`);let a=e;return a=a.replace(/(`+)([\s\S]*?[^`])\1(?!`)/g,(e,t,s)=>r(`<code>${x(n(s.trim()))}</code>`)),a=a.replace(/\\([\\`*_{}[\]()#+\-.!|~$<>"'])/g,(e,t)=>r(x(t))),a=a.replace(/<((?:https?:\/\/|mailto:)[^\s>]+)>/g,(e,t)=>r(`<a href="${S(t)}">${x(t)}</a>`)),t.html&&(a=a.replace(/<\/?[A-Za-z][^>]*>/g,e=>r(e))),a=a.replace(/!\[([^\]]*)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,t,n,s)=>r(`<img src="${S(n)}" alt="${x(t)}"${s?` title="${x(s)}"`:""}>`)),a=a.replace(/\[([^\]]+)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,s,a,i)=>r(`<a href="${S(a)}"${i?` title="${x(i)}"`:""}>${E(s,t,n)}</a>`)),a=x(a),a=a.replace(/(\*\*|__)(?=\S)([\s\S]*?\S)\1/g,"<strong>$2</strong>"),a=a.replace(/(^|[^*\w])\*(?=\S)([\s\S]*?\S)\*(?!\*)/g,"$1<em>$2</em>"),a=a.replace(/(^|[^_\w])_(?=\S)([\s\S]*?\S)_(?![_\w])/g,"$1<em>$2</em>"),a=a.replace(/~~(?=\S)([\s\S]*?\S)~~/g,"<del>$1</del>"),a=a.replace(/( {2,}|\\)\n/g,"<br>\n"),a.replace(/(\d+)/g,(e,t)=>s[Number(t)])}const j=/^( {0,3})(#{1,6}\s|>|```|~~~|([-*+]|\d{1,9}[.)])\s|(\*[ \t]*){3,}$|(-[ \t]*){3,}$|(_[ \t]*){3,}$)/,_=/^( {0,3})([-*+]|\d{1,9}[.)])(\s+|$)/,M=/^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;function O(e,t,n){const s=[];let r=0;const a=e=>E(e,t,n);for(;r<e.length;){const i=e[r];if(!i.trim()){r++;continue}const o=/^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)/.exec(i);if(o){const t=[];for(r++;r<e.length&&!new RegExp(`^ {0,3}${"`"===o[1][0]?"`":"~"}{${o[1].length},}\\s*$`).test(e[r]);)t.push(e[r++]);r++;const a=o[2]?` class="language-${x(o[2])}"`:"";s.push(`<pre><code${a}>${x(n(t.join("\n")))}</code></pre>`);continue}const c=/^ {0,3}(#{1,6})\s+(.*?)\s*#*\s*$/.exec(i);if(c){s.push(`<h${c[1].length}>${a(c[2])}</h${c[1].length}>`),r++;continue}if(/^ {0,3}((\*[ \t]*){3,}|(-[ \t]*){3,}|(_[ \t]*){3,})$/.test(i)){s.push("<hr>"),r++;continue}if(/^ {0,3}>/.test(i)){const a=[];for(;r<e.length&&e[r].trim()&&(/^ {0,3}>/.test(e[r])||a.length);)a.push(e[r].replace(/^ {0,3}> ?/,"")),r++;s.push(`<blockquote>\n${O(a,t,n)}\n</blockquote>`);continue}const l=_.exec(i);if(l){const a=/\d/.test(l[2]),i=a?parseInt(l[2],10):1,o=[];let c=!1;for(;r<e.length;){const t=_.exec(e[r]);if(!t||/\d/.test(t[2])!==a)break;const n=t[0].length,s=[e[r].slice(n)];for(r++;r<e.length;){const t=e[r];if(!t.trim()){const t=e[r+1];if(void 0!==t&&t.startsWith(" ".repeat(Math.min(n,4)))&&t.trim()){s.push(""),c=!0,r++;continue}void 0!==t&&_.test(t)&&(c=!0);break}if(t.startsWith(" ".repeat(Math.min(n,4))))s.push(t.slice(Math.min(n,4)));else{if(_.test(t)||j.test(t))break;s.push(t)}r++}for(o.push(s);r<e.length&&!e[r].trim()&&void 0!==e[r+1]&&_.test(e[r+1]);)r++}const u=a?"ol":"ul",d=o.map(e=>{let s=O(e,t,n);return c||(s=s.replace(/^<p>([\s\S]*?)<\/p>/,"$1").replace(/\n<p>([\s\S]*?)<\/p>/g,"\n$1")),`<li>${s}</li>`});s.push(`<${u}${a&&1!==i?` start="${i}"`:""}>\n${d.join("\n")}\n</${u}>`);continue}if(i.includes("|")&&void 0!==e[r+1]&&M.test(e[r+1])&&e[r+1].includes("-")){const t=e=>e.trim().replace(/^\|/,"").replace(/\|$/,"").split(/(?<!\\)\|/).map(e=>e.trim()),n=t(e[r+1]).map(e=>e.startsWith(":")&&e.endsWith(":")?"center":e.endsWith(":")?"right":e.startsWith(":")?"left":""),o=(e,t,s)=>`<${e}${n[s]?` style="text-align:${n[s]}"`:""}>${a(t)}</${e}>`,c=t(i);r+=2;const l=[];for(;r<e.length&&e[r].trim()&&e[r].includes("|");)l.push(t(e[r++]));s.push(`<table>\n<thead><tr>${c.map((e,t)=>o("th",e,t)).join("")}</tr></thead>\n<tbody>\n${l.map(e=>`<tr>${c.map((t,n)=>o("td",e[n]??"",n)).join("")}</tr>`).join("\n")}\n</tbody>\n</table>`);continue}if(/^( {4}|\t)/.test(i)){const t=[];for(;r<e.length&&(/^( {4}|\t)/.test(e[r])||!e[r].trim());)t.push(e[r++].replace(/^( {4}|\t)/,""));for(;t.length&&!t[t.length-1].trim();)t.pop();s.push(`<pre><code>${x(n(t.join("\n")))}</code></pre>`);continue}const u=[];for(;r<e.length&&e[r].trim()&&(!u.length||!j.test(e[r])||/^ {0,3}[-=]+\s*$/.test(e[r]));){if(u.length&&/^ {0,3}(=+|-+)\s*$/.test(e[r])){const t="="===e[r].trim()[0]?1:2;s.push(`<h${t}>${a(u.join("\n"))}</h${t}>`),u.length=0,r++;break}u.push(e[r].replace(/^ {0,3}/,"")),r++}u.length&&s.push(`<p>${a(u.join("\n"))}</p>`)}return s.join("\n")}function A(e,t={},n=e=>e){return O(String(e).replace(/\r\n?/g,"\n").split("\n"),t,n)}function N({text:e,math:t,drawn:n},s){return(s.render?s.render(e):A(e,s,e=>e.replace(g,(e,n)=>t[Number(n)].raw))).replace(new RegExp("<p>\\s*(\\d+)\\s*</p>","g"),(e,s)=>t[Number(s)].display&&n[Number(s)]?`<div class="mv-md-block">${n[Number(s)]}</div>`:e).replace(g,(e,t)=>n[Number(t)]).replace(/<p>\s*<\/p>\n?/g,"")}function L(e,t={}){return N(k(e,t,t.variables||null),t)}const W=new WeakMap,q=new Set;function z(){for(const e of q)e.connected()&&!e.element.isConnected&&e.stop(!0)}function C(t,n,o={}){const c=void 0===o.variables?s:o.variables||null;z();const l=W.get(t);l&&l.stop(l.store!==c);let u=k(n,o,c,t);if(t.innerHTML=N(u,o),!c)return W.delete(t),t;c.own(t,u.defs);let d=t.isConnected;const p=n=>{const s=n.target,r=s&&s.dataset&&s.dataset.mvVar;if(void 0!==r&&t.contains(s)){if("text"===s.type)try{e(s.value,{blocks:o.blocks,scope:{}}),s.removeAttribute("aria-invalid")}catch{return void s.setAttribute("aria-invalid","true")}c.set(r,s.value)}},m=s=>{const l=s.target.closest?.("[data-node]"),d=l&&l.closest("[data-mv-md]");if(!d||!t.contains(d))return;const p=Number(d.dataset.mvMd),m=u.trees[p];if(!m)return;const $=Number(l.dataset.node),g=h(m,$)||[];let v=null;for(let e=g.length;e>=0&&!v;e--){const t=f(m,g.slice(0,e));t&&void 0!==t.from&&(v={node:t,depth:e})}const b=v&&c.definitions().get(v.node.from);if(b&&b.input&&"textbox"===b.input.kind){s.preventDefault();const n=b.name,u=t.ownerDocument.querySelector(`[data-mv-var="${CSS.escape(n)}"]`),d=o.editable&&o.editable.toText;if(!d)return void(u&&(u.focus(),u.select()));const p=t=>e(t),h=f(m,g);return void r(l,d(i(h,p)),{label:`Edit ${n}`,parse:t=>e(t,{blocks:o.blocks}),commit:e=>{const t=a(i(v.node,p),g.slice(v.depth),e);c.set(n,d(t))}})}const x=b&&u.defs.get(b.name),y=x&&x.key===b.key&&void 0!==x.start?{...u.math[p],start:x.start,end:x.end,raw:n.slice(x.start,x.end)}:u.math[p];t.dispatchEvent(new CustomEvent("inlinemath:select",{bubbles:!0,detail:{index:p,start:y.start,end:y.end,raw:y.raw,source:y.source,id:$,path:g}}))};t.addEventListener("input",p),t.addEventListener("change",p),t.addEventListener("dblclick",m);const $=c.subscribe(e=>{e!==t&&(t.isConnected?(d=!0,z(),(()=>{const e=k(n,o,c,t);e.drawn.forEach((n,s)=>{if(n===u.drawn[s]||e.inputs.has(s))return;const r=t.querySelector(`[data-mv-md="${s}"]`);r&&(r.outerHTML=n)});for(const n of t.querySelectorAll("[data-mv-var], [data-mv-out]")){const t=e.defs.get(n.dataset.mvVar??n.dataset.mvOut);if(!t)continue;const s=c.textOf(t);void 0!==n.dataset.mvOut?n.textContent=s:n.value!==s&&n!==n.ownerDocument?.activeElement&&(n.value=s)}u=e})()):d&&g(!0))});function g(e){$(),t.removeEventListener("input",p),t.removeEventListener("change",p),t.removeEventListener("dblclick",m),q.delete(v),W.delete(t),e&&c.own(t,null)}const v={element:t,store:c,stop:g,connected:()=>d};return q.add(v),W.set(t,v),t}export{v as extractMath,L as markdownToHTML,A as renderMarkdown,C as renderMarkdownInto,s as variables};

package/dist/markdown.js

@@ -1,2 +1,2 @@
-/* Inline Math 0.1.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
-import{a as e}from"./chunks/html-DWtfytjA.js";import{a as t}from"./chunks/calculate-BX9lJ7Ff.js";import"./chunks/lite-Bj_L6w2g.js";const n=new RegExp("(\\d+)","g");function s(e,{delimiters:t=["$$","$","\\[","\\("]}={}){const n=[];let s="",i=0;const r=String(e),l=e=>0===e||"\n"===r[e-1],o=(e,t,s)=>(n.push({source:e,display:t,raw:s}),`${n.length-1}`);for(;i<r.length;){if(l(i)){const e=/^( {0,3})(`{3,}|~{3,})([^\n]*)\n?/.exec(r.slice(i));if(e){const t=e[2],n=new RegExp(`\\n {0,3}${"`"===t[0]?"`":"~"}{${t.length},}[ \\t]*(?=\\n|$)`),c=r.slice(i+e[0].length),l=n.exec(`\n${c}`),a=l?c.slice(0,Math.max(0,l.index-1)):c,p=e[0].length+(l?l.index-1+l[0].length:c.length),h=r.slice(i,i+p);"math"===e[3].trim()?s+=o(a,!0,h):s+=h,i+=p;continue}}const e=r[i];if("`"===e){const e=/^`+/.exec(r.slice(i))[0],t=r.indexOf(e,i+e.length);if(t>-1){s+=r.slice(i,t+e.length),i=t+e.length;continue}s+=e,i+=e.length;continue}if("\\"===e){const e=r.slice(i,i+2),n="\\["===e?"\\]":"\\("===e?"\\)":null;if(n&&t.includes(e)){const t=r.indexOf(n,i+2);if(t>-1){s+=o(r.slice(i+2,t),"\\["===e,r.slice(i,t+2)),i=t+2;continue}}s+=e,i+=2;continue}if("$"===e)if("$"===r[i+1]&&t.includes("$$")){const e=r.indexOf("$$",i+2);if(e>-1){s+=o(r.slice(i+2,e),!0,r.slice(i,e+2)),i=e+2;continue}}else if(t.includes("$")&&r[i+1]&&!/\s/.test(r[i+1])){const e=c(r,i+1);if(e>-1){s+=o(r.slice(i+1,e),!1,r.slice(i,e+1)),i=e+1;continue}}s+=e,i++}return{text:s,math:n}}function c(e,t){for(let n=t;n<e.length;n++){const t=e[n];if("\\"!==t){if("`"===t)return-1;if("\n"===t&&/^\n[ \t]*\n/.test(e.slice(n)))return-1;if("$"===t&&!/\s/.test(e[n-1])&&!/\d/.test(e[n+1]??"")&&"$"!==e[n+1])return n}else n++}return-1}const i=e=>String(e).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;"),r=/^\s*([A-Za-zͰ-Ͽ](?:_\{?\w+\}?)?)\s*(?::=|=)\s*([^=<>≤≥]+)$/;function l(n,s,c){const{source:l,display:o}=n;try{const n=e(l,{...s.math,display:o,blocks:s.blocks,scope:c});return!1!==s.define&&function(e,n){const s=r.exec(e);if(!s||/\{\{/.test(s[2]))return;try{const e=t(s[2],n);"number"!=typeof e.value&&"bigint"!=typeof e.value||(n[s[1].replace(/[{}]/g,"")]=e.exact?e.text:e.value)}catch{}}(l,c),o?`<span class="mv-md-display">${n}</span>`:`<span class="mv-md-math">${n}</span>`}catch(e){return`<span class="mv-md-error" title="${i(e.message)}"><code>${i(n.raw)}</code></span>`}}const o=/^(https?:|mailto:|#|\/|\.{0,2}\/|[^:]*$)/i,a=e=>o.test(e.trim())?i(e.trim()):"#";function p(e,t,n){const s=[],c=e=>(s.push(e),`${s.length-1}`);let r=e;return r=r.replace(/(`+)([\s\S]*?[^`])\1(?!`)/g,(e,t,s)=>c(`<code>${i(n(s.trim()))}</code>`)),r=r.replace(/\\([\\`*_{}[\]()#+\-.!|~$<>"'])/g,(e,t)=>c(i(t))),r=r.replace(/<((?:https?:\/\/|mailto:)[^\s>]+)>/g,(e,t)=>c(`<a href="${a(t)}">${i(t)}</a>`)),t.html&&(r=r.replace(/<\/?[A-Za-z][^>]*>/g,e=>c(e))),r=r.replace(/!\[([^\]]*)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,t,n,s)=>c(`<img src="${a(n)}" alt="${i(t)}"${s?` title="${i(s)}"`:""}>`)),r=r.replace(/\[([^\]]+)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,s,r,l)=>c(`<a href="${a(r)}"${l?` title="${i(l)}"`:""}>${p(s,t,n)}</a>`)),r=i(r),r=r.replace(/(\*\*|__)(?=\S)([\s\S]*?\S)\1/g,"<strong>$2</strong>"),r=r.replace(/(^|[^*\w])\*(?=\S)([\s\S]*?\S)\*(?!\*)/g,"$1<em>$2</em>"),r=r.replace(/(^|[^_\w])_(?=\S)([\s\S]*?\S)_(?![_\w])/g,"$1<em>$2</em>"),r=r.replace(/~~(?=\S)([\s\S]*?\S)~~/g,"<del>$1</del>"),r=r.replace(/( {2,}|\\)\n/g,"<br>\n"),r.replace(/(\d+)/g,(e,t)=>s[Number(t)])}const h=/^( {0,3})(#{1,6}\s|>|```|~~~|([-*+]|\d{1,9}[.)])\s|(\*[ \t]*){3,}$|(-[ \t]*){3,}$|(_[ \t]*){3,}$)/,u=/^( {0,3})([-*+]|\d{1,9}[.)])(\s+|$)/,$=/^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;function g(e,t,n){const s=[];let c=0;const r=e=>p(e,t,n);for(;c<e.length;){const l=e[c];if(!l.trim()){c++;continue}const o=/^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)/.exec(l);if(o){const t=[];for(c++;c<e.length&&!new RegExp(`^ {0,3}${"`"===o[1][0]?"`":"~"}{${o[1].length},}\\s*$`).test(e[c]);)t.push(e[c++]);c++;const r=o[2]?` class="language-${i(o[2])}"`:"";s.push(`<pre><code${r}>${i(n(t.join("\n")))}</code></pre>`);continue}const a=/^ {0,3}(#{1,6})\s+(.*?)\s*#*\s*$/.exec(l);if(a){s.push(`<h${a[1].length}>${r(a[2])}</h${a[1].length}>`),c++;continue}if(/^ {0,3}((\*[ \t]*){3,}|(-[ \t]*){3,}|(_[ \t]*){3,})$/.test(l)){s.push("<hr>"),c++;continue}if(/^ {0,3}>/.test(l)){const i=[];for(;c<e.length&&e[c].trim()&&(/^ {0,3}>/.test(e[c])||i.length);)i.push(e[c].replace(/^ {0,3}> ?/,"")),c++;s.push(`<blockquote>\n${g(i,t,n)}\n</blockquote>`);continue}const p=u.exec(l);if(p){const i=/\d/.test(p[2]),r=i?parseInt(p[2],10):1,l=[];let o=!1;for(;c<e.length;){const t=u.exec(e[c]);if(!t||/\d/.test(t[2])!==i)break;const n=t[0].length,s=[e[c].slice(n)];for(c++;c<e.length;){const t=e[c];if(!t.trim()){const t=e[c+1];if(void 0!==t&&t.startsWith(" ".repeat(Math.min(n,4)))&&t.trim()){s.push(""),o=!0,c++;continue}void 0!==t&&u.test(t)&&(o=!0);break}if(t.startsWith(" ".repeat(Math.min(n,4))))s.push(t.slice(Math.min(n,4)));else{if(u.test(t)||h.test(t))break;s.push(t)}c++}for(l.push(s);c<e.length&&!e[c].trim()&&void 0!==e[c+1]&&u.test(e[c+1]);)c++}const a=i?"ol":"ul",$=l.map(e=>{let s=g(e,t,n);return o||(s=s.replace(/^<p>([\s\S]*?)<\/p>/,"$1").replace(/\n<p>([\s\S]*?)<\/p>/g,"\n$1")),`<li>${s}</li>`});s.push(`<${a}${i&&1!==r?` start="${r}"`:""}>\n${$.join("\n")}\n</${a}>`);continue}if(l.includes("|")&&void 0!==e[c+1]&&$.test(e[c+1])&&e[c+1].includes("-")){const t=e=>e.trim().replace(/^\|/,"").replace(/\|$/,"").split(/(?<!\\)\|/).map(e=>e.trim()),n=t(e[c+1]).map(e=>e.startsWith(":")&&e.endsWith(":")?"center":e.endsWith(":")?"right":e.startsWith(":")?"left":""),i=(e,t,s)=>`<${e}${n[s]?` style="text-align:${n[s]}"`:""}>${r(t)}</${e}>`,o=t(l);c+=2;const a=[];for(;c<e.length&&e[c].trim()&&e[c].includes("|");)a.push(t(e[c++]));s.push(`<table>\n<thead><tr>${o.map((e,t)=>i("th",e,t)).join("")}</tr></thead>\n<tbody>\n${a.map(e=>`<tr>${o.map((t,n)=>i("td",e[n]??"",n)).join("")}</tr>`).join("\n")}\n</tbody>\n</table>`);continue}if(/^( {4}|\t)/.test(l)){const t=[];for(;c<e.length&&(/^( {4}|\t)/.test(e[c])||!e[c].trim());)t.push(e[c++].replace(/^( {4}|\t)/,""));for(;t.length&&!t[t.length-1].trim();)t.pop();s.push(`<pre><code>${i(n(t.join("\n")))}</code></pre>`);continue}const f=[];for(;c<e.length&&e[c].trim()&&(!f.length||!h.test(e[c])||/^ {0,3}[-=]+\s*$/.test(e[c]));){if(f.length&&/^ {0,3}(=+|-+)\s*$/.test(e[c])){const t="="===e[c].trim()[0]?1:2;s.push(`<h${t}>${r(f.join("\n"))}</h${t}>`),f.length=0,c++;break}f.push(e[c].replace(/^ {0,3}/,"")),c++}f.length&&s.push(`<p>${r(f.join("\n"))}</p>`)}return s.join("\n")}function f(e,t={},n=e=>e){return g(String(e).replace(/\r\n?/g,"\n").split("\n"),t,n)}function m(e,t={}){const{text:c,math:i}=s(e,t),r={...t.scope??{}},o=i.map(e=>l(e,t,r));return(t.render?t.render(c):f(c,t,e=>e.replace(n,(e,t)=>i[Number(t)].raw))).replace(new RegExp("<p>\\s*(\\d+)\\s*</p>","g"),(e,t)=>i[Number(t)].display?`<div class="mv-md-block">${o[Number(t)]}</div>`:e).replace(n,(e,t)=>o[Number(t)])}function d(e,t,n={}){return e.innerHTML=m(t,n),e}export{s as extractMath,m as markdownToHTML,f as renderMarkdown,d as renderMarkdownInto};
+/* Inline Math 0.2.0 — MIT licence; includes mathzetta (and @mathzetta/cas, for the CAS) */
+import{t as e,a as t}from"./chunks/html-CupluJSh.js";import{a as n}from"./chunks/calculate-Cz87Lt0N.js";import{v as s,o as r,r as a,u as i,s as o,E as l,b as u,n as d,i as p}from"./chunks/edit-M68aRA5o.js";export{V as Variables,c as createVariables}from"./chunks/edit-M68aRA5o.js";import{p as m,n as f,g as h,d as $}from"./chunks/lite-3Fb-OHbt.js";const g=new RegExp("(\\d+)","g");function v(e,{delimiters:t=["$$","$","\\[","\\("]}={}){const n=[];let s="",r=0;const a=String(e),i=e=>0===e||"\n"===a[e-1],o=(e,t,s)=>(n.push({source:e,display:t,raw:s,start:r,end:r+s.length}),`${n.length-1}`);for(;r<a.length;){if(i(r)){const e=/^( {0,3})(`{3,}|~{3,})([^\n]*)\n?/.exec(a.slice(r));if(e){const t=e[2],n=new RegExp(`\\n {0,3}${"`"===t[0]?"`":"~"}{${t.length},}[ \\t]*(?=\\n|$)`),i=a.slice(r+e[0].length),c=n.exec(`\n${i}`),l=c?i.slice(0,Math.max(0,c.index-1)):i,u=e[0].length+(c?c.index-1+c[0].length:i.length),d=a.slice(r,r+u);"math"===e[3].trim()?s+=o(l,!0,d):s+=d,r+=u;continue}}const e=a[r];if("`"===e){const e=/^`+/.exec(a.slice(r))[0],t=a.indexOf(e,r+e.length);if(t>-1){s+=a.slice(r,t+e.length),r=t+e.length;continue}s+=e,r+=e.length;continue}if("\\"===e){const e=a.slice(r,r+2),n="\\["===e?"\\]":"\\("===e?"\\)":null;if(n&&t.includes(e)){const t=a.indexOf(n,r+2);if(t>-1){s+=o(a.slice(r+2,t),"\\["===e,a.slice(r,t+2)),r=t+2;continue}}s+=e,r+=2;continue}if("$"===e)if("$"===a[r+1]&&t.includes("$$")){const e=a.indexOf("$$",r+2);if(e>-1){s+=o(a.slice(r+2,e),!0,a.slice(r,e+2)),r=e+2;continue}}else if(t.includes("$")&&a[r+1]&&!/\s/.test(a[r+1])){const e=b(a,r+1);if(e>-1){s+=o(a.slice(r+1,e),!1,a.slice(r,e+1)),r=e+1;continue}}s+=e,r++}return{text:s,math:n}}function b(e,t){for(let n=t;n<e.length;n++){const t=e[n];if("\\"!==t){if("`"===t)return-1;if("\n"===t&&/^\n[ \t]*\n/.test(e.slice(n)))return-1;if("$"===t&&!/\s/.test(e[n-1])&&!/\d/.test(e[n+1]??"")&&"$"!==e[n+1])return n}else n++}return-1}const x=e=>String(e).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;"),y=/^\s*([A-Za-z\u0370-\u03ff](?:_\{?\w+\}?)?)\s*=\s*([^=<>≤≥]+)$/;function k(s,r,a,i){const{text:c,math:m}=v(s,r),f=a?a.definitions(i):new Map,g=e=>a?a.textOf(e):e.text,b={...r.scope??{}},k={},w=new Map,S=new Set,j=[],E=()=>{for(const e of Object.keys(k))delete k[e];Object.assign(k,b);for(const e of f.keys())delete k[e];let e=[...f.values()];for(;e.length;){const t=e.filter(e=>{try{const t=n(g(e),k);if("number"==typeof t.value||"bigint"==typeof t.value||Array.isArray(t.value))return k[e.name]=t.exact?t.text:t.value,!1}catch{}return!0});if(t.length===e.length)break;e=t}const t={},s=_({});for(const e of f.keys()){const n=s(e);if(n)try{t[e]=h(o(n,t=>t===e?null:s(t)).tree)}catch{}}k[l]=t},_=t=>{const n=new Map;return s=>{const r=f.get(s);if(!r)return null;if(!n.has(s)){let a=null;try{a=e(g(r),t)}catch{}n.set(s,a)}return n.get(s)}};E();const M=m.map((s,a)=>{const{source:i,display:c}=s,l=c?"mv-md-display":"mv-md-math",m=(e,t="")=>`<span class="${l}${t}" data-mv-md="${a}">${e}</span>`;try{const l={...r.math,display:c,blocks:r.blocks,scope:k},h=function(t){let n=t.trim();const s=n.startsWith("_");s&&(n=n.slice(1).trimStart());let r=n.indexOf(":="),a=2;r<0&&s&&(r=n.search(/(?<![<>!≤≥=])=(?!=)/),a=1);const i=s?{error:"a hidden $_…$ saves a variable: $_A := 2+2$"}:null;if(r<=0)return i;const o=n.slice(0,r).trim(),c=n.slice(r+a).trim();let l=null;try{l=/\{\{/.test(o)?null:d(e(o))}catch{}return null!==l&&c?{hidden:s,lhs:o,name:l,rhs:c,input:p(c)}:i}(i);if(h&&h.error)throw new Error(h.error);if(h){const{name:n,input:r,hidden:i}=h,c=r?{name:n,text:r.default,input:r,key:`input:${JSON.stringify(r)}`}:{name:n,text:h.rhs,input:null,key:`expr:${h.rhs}`,start:s.start,end:s.end};let d="";if(r){const e=function(e,t){const{input:n,name:s}=e,r=`class="mv-md-input mv-md-${n.kind}" data-mv-var="${x(s)}" aria-label="${x(s)}"`;if("dropdown"===n.kind)return`<select ${r}>${n.options.map(e=>`<option value="${x(e)}"${e===t?" selected":""}>${x(e)}</option>`).join("")}</select>`;return"slider"===n.kind?`<input type="range" ${r} min="${n.min}" max="${n.max}" step="${n.step}" value="${x(t)}"><output class="mv-md-output" data-mv-out="${x(s)}">${x(t)}</output>`:`<input type="text" ${r} value="${x(t)}" size="${Math.max(4,t.length+1)}" spellcheck="false" autocomplete="off">`}(c,g(c));d=i?e:`${t(h.lhs,l)}<span class="mv-md-assign" aria-hidden="true">≔</span>${e}`,S.add(a)}else{const n=o(e(h.rhs,l),_(l)).tree;if(!i){const s=$({type:"op",op:"=",args:[u(e(h.lhs)),void 0===n.id?n:u(n)]});j[a]=s,d=function(e){return e.replace('<span class="mv-rel">=</span>','<span class="mv-rel mv-rel-def">≔</span>').replace(/(aria-label="[^"]*?) equals /,"$1 is defined as ").replace("<mo>=</mo>","<mo>≔</mo>")}(t(s,l))}}return f.delete(n),f.set(n,c),w.set(n,c),E(),i&&!r?"":m(d,r?" mv-md-input-def":"")}const{tree:v,changed:M}=o(e(i,l),_(l));M&&$(v),j[a]=v;const O=t(v,l);return!M&&!1!==r.define&&function(e,t,s){const r=y.exec(e);if(!r||/\{\{/.test(r[2]))return!1;const a=r[1].replace(/[{}]/g,"");if(s.has(a))return!1;try{const e=n(r[2],t);if("number"==typeof e.value||"bigint"==typeof e.value||Array.isArray(e.value))return t[a]=e.exact?e.text:e.value,!0}catch{}return!1}(i,b,f)&&E(),m(O)}catch(e){return`<span class="mv-md-error" data-mv-md="${a}" title="${x(e.message)}"><code>${x(s.raw)}</code></span>`}});return{text:c,math:m,drawn:M,defs:w,inputs:S,trees:j}}const w=/^(https?:|mailto:|#|\/|\.{0,2}\/|[^:]*$)/i,S=e=>w.test(e.trim())?x(e.trim()):"#";function j(e,t,n){const s=[],r=e=>(s.push(e),`${s.length-1}`);let a=e;return a=a.replace(/(`+)([\s\S]*?[^`])\1(?!`)/g,(e,t,s)=>r(`<code>${x(n(s.trim()))}</code>`)),a=a.replace(/\\([\\`*_{}[\]()#+\-.!|~$<>"'])/g,(e,t)=>r(x(t))),a=a.replace(/<((?:https?:\/\/|mailto:)[^\s>]+)>/g,(e,t)=>r(`<a href="${S(t)}">${x(t)}</a>`)),t.html&&(a=a.replace(/<\/?[A-Za-z][^>]*>/g,e=>r(e))),a=a.replace(/!\[([^\]]*)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,t,n,s)=>r(`<img src="${S(n)}" alt="${x(t)}"${s?` title="${x(s)}"`:""}>`)),a=a.replace(/\[([^\]]+)\]\(\s*((?:[^\s()]|\([^\s()]*\))+)(?:\s+"([^"]*)")?\s*\)/g,(e,s,a,i)=>r(`<a href="${S(a)}"${i?` title="${x(i)}"`:""}>${j(s,t,n)}</a>`)),a=x(a),a=a.replace(/(\*\*|__)(?=\S)([\s\S]*?\S)\1/g,"<strong>$2</strong>"),a=a.replace(/(^|[^*\w])\*(?=\S)([\s\S]*?\S)\*(?!\*)/g,"$1<em>$2</em>"),a=a.replace(/(^|[^_\w])_(?=\S)([\s\S]*?\S)_(?![_\w])/g,"$1<em>$2</em>"),a=a.replace(/~~(?=\S)([\s\S]*?\S)~~/g,"<del>$1</del>"),a=a.replace(/( {2,}|\\)\n/g,"<br>\n"),a.replace(/(\d+)/g,(e,t)=>s[Number(t)])}const E=/^( {0,3})(#{1,6}\s|>|```|~~~|([-*+]|\d{1,9}[.)])\s|(\*[ \t]*){3,}$|(-[ \t]*){3,}$|(_[ \t]*){3,}$)/,_=/^( {0,3})([-*+]|\d{1,9}[.)])(\s+|$)/,M=/^\s*\|?\s*:?-+:?\s*(\|\s*:?-+:?\s*)*\|?\s*$/;function O(e,t,n){const s=[];let r=0;const a=e=>j(e,t,n);for(;r<e.length;){const i=e[r];if(!i.trim()){r++;continue}const o=/^ {0,3}(`{3,}|~{3,})\s*([^\s`]*)/.exec(i);if(o){const t=[];for(r++;r<e.length&&!new RegExp(`^ {0,3}${"`"===o[1][0]?"`":"~"}{${o[1].length},}\\s*$`).test(e[r]);)t.push(e[r++]);r++;const a=o[2]?` class="language-${x(o[2])}"`:"";s.push(`<pre><code${a}>${x(n(t.join("\n")))}</code></pre>`);continue}const c=/^ {0,3}(#{1,6})\s+(.*?)\s*#*\s*$/.exec(i);if(c){s.push(`<h${c[1].length}>${a(c[2])}</h${c[1].length}>`),r++;continue}if(/^ {0,3}((\*[ \t]*){3,}|(-[ \t]*){3,}|(_[ \t]*){3,})$/.test(i)){s.push("<hr>"),r++;continue}if(/^ {0,3}>/.test(i)){const a=[];for(;r<e.length&&e[r].trim()&&(/^ {0,3}>/.test(e[r])||a.length);)a.push(e[r].replace(/^ {0,3}> ?/,"")),r++;s.push(`<blockquote>\n${O(a,t,n)}\n</blockquote>`);continue}const l=_.exec(i);if(l){const a=/\d/.test(l[2]),i=a?parseInt(l[2],10):1,o=[];let c=!1;for(;r<e.length;){const t=_.exec(e[r]);if(!t||/\d/.test(t[2])!==a)break;const n=t[0].length,s=[e[r].slice(n)];for(r++;r<e.length;){const t=e[r];if(!t.trim()){const t=e[r+1];if(void 0!==t&&t.startsWith(" ".repeat(Math.min(n,4)))&&t.trim()){s.push(""),c=!0,r++;continue}void 0!==t&&_.test(t)&&(c=!0);break}if(t.startsWith(" ".repeat(Math.min(n,4))))s.push(t.slice(Math.min(n,4)));else{if(_.test(t)||E.test(t))break;s.push(t)}r++}for(o.push(s);r<e.length&&!e[r].trim()&&void 0!==e[r+1]&&_.test(e[r+1]);)r++}const u=a?"ol":"ul",d=o.map(e=>{let s=O(e,t,n);return c||(s=s.replace(/^<p>([\s\S]*?)<\/p>/,"$1").replace(/\n<p>([\s\S]*?)<\/p>/g,"\n$1")),`<li>${s}</li>`});s.push(`<${u}${a&&1!==i?` start="${i}"`:""}>\n${d.join("\n")}\n</${u}>`);continue}if(i.includes("|")&&void 0!==e[r+1]&&M.test(e[r+1])&&e[r+1].includes("-")){const t=e=>e.trim().replace(/^\|/,"").replace(/\|$/,"").split(/(?<!\\)\|/).map(e=>e.trim()),n=t(e[r+1]).map(e=>e.startsWith(":")&&e.endsWith(":")?"center":e.endsWith(":")?"right":e.startsWith(":")?"left":""),o=(e,t,s)=>`<${e}${n[s]?` style="text-align:${n[s]}"`:""}>${a(t)}</${e}>`,c=t(i);r+=2;const l=[];for(;r<e.length&&e[r].trim()&&e[r].includes("|");)l.push(t(e[r++]));s.push(`<table>\n<thead><tr>${c.map((e,t)=>o("th",e,t)).join("")}</tr></thead>\n<tbody>\n${l.map(e=>`<tr>${c.map((t,n)=>o("td",e[n]??"",n)).join("")}</tr>`).join("\n")}\n</tbody>\n</table>`);continue}if(/^( {4}|\t)/.test(i)){const t=[];for(;r<e.length&&(/^( {4}|\t)/.test(e[r])||!e[r].trim());)t.push(e[r++].replace(/^( {4}|\t)/,""));for(;t.length&&!t[t.length-1].trim();)t.pop();s.push(`<pre><code>${x(n(t.join("\n")))}</code></pre>`);continue}const u=[];for(;r<e.length&&e[r].trim()&&(!u.length||!E.test(e[r])||/^ {0,3}[-=]+\s*$/.test(e[r]));){if(u.length&&/^ {0,3}(=+|-+)\s*$/.test(e[r])){const t="="===e[r].trim()[0]?1:2;s.push(`<h${t}>${a(u.join("\n"))}</h${t}>`),u.length=0,r++;break}u.push(e[r].replace(/^ {0,3}/,"")),r++}u.length&&s.push(`<p>${a(u.join("\n"))}</p>`)}return s.join("\n")}function A(e,t={},n=e=>e){return O(String(e).replace(/\r\n?/g,"\n").split("\n"),t,n)}function N({text:e,math:t,drawn:n},s){return(s.render?s.render(e):A(e,s,e=>e.replace(g,(e,n)=>t[Number(n)].raw))).replace(new RegExp("<p>\\s*(\\d+)\\s*</p>","g"),(e,s)=>t[Number(s)].display&&n[Number(s)]?`<div class="mv-md-block">${n[Number(s)]}</div>`:e).replace(g,(e,t)=>n[Number(t)]).replace(/<p>\s*<\/p>\n?/g,"")}function L(e,t={}){return N(k(e,t,t.variables||null),t)}const W=new WeakMap,q=new Set;function C(){for(const e of q)e.connected()&&!e.element.isConnected&&e.stop(!0)}function R(t,n,o={}){const c=void 0===o.variables?s:o.variables||null;C();const l=W.get(t);l&&l.stop(l.store!==c);let u=k(n,o,c,t);if(t.innerHTML=N(u,o),!c)return W.delete(t),t;c.own(t,u.defs);let d=t.isConnected;const p=n=>{const s=n.target,r=s&&s.dataset&&s.dataset.mvVar;if(void 0!==r&&t.contains(s)){if("text"===s.type)try{e(s.value,{blocks:o.blocks,scope:{}}),s.removeAttribute("aria-invalid")}catch{return void s.setAttribute("aria-invalid","true")}c.set(r,s.value)}},h=s=>{const l=s.target.closest?.("[data-node]"),d=l&&l.closest("[data-mv-md]");if(!d||!t.contains(d))return;const p=Number(d.dataset.mvMd),h=u.trees[p];if(!h)return;const $=Number(l.dataset.node),g=m(h,$)||[];let v=null;for(let e=g.length;e>=0&&!v;e--){const t=f(h,g.slice(0,e));t&&void 0!==t.from&&(v={node:t,depth:e})}const b=v&&c.definitions().get(v.node.from);if(b&&b.input&&"textbox"===b.input.kind){s.preventDefault();const n=b.name,u=t.ownerDocument.querySelector(`[data-mv-var="${CSS.escape(n)}"]`),d=o.editable&&o.editable.toText;if(!d)return void(u&&(u.focus(),u.select()));const p=t=>e(t),m=f(h,g);return void r(l,d(i(m,p)),{label:`Edit ${n}`,parse:t=>e(t,{blocks:o.blocks}),commit:e=>{const t=a(i(v.node,p),g.slice(v.depth),e);c.set(n,d(t))}})}const x=b&&u.defs.get(b.name),y=x&&x.key===b.key&&void 0!==x.start?{...u.math[p],start:x.start,end:x.end,raw:n.slice(x.start,x.end)}:u.math[p];t.dispatchEvent(new CustomEvent("inlinemath:select",{bubbles:!0,detail:{index:p,start:y.start,end:y.end,raw:y.raw,source:y.source,id:$,path:g}}))};t.addEventListener("input",p),t.addEventListener("change",p),t.addEventListener("dblclick",h);const $=c.subscribe(e=>{e!==t&&(t.isConnected?(d=!0,C(),(()=>{const e=k(n,o,c,t);e.drawn.forEach((n,s)=>{if(n===u.drawn[s]||e.inputs.has(s))return;const r=t.querySelector(`[data-mv-md="${s}"]`);r&&(r.outerHTML=n)});for(const n of t.querySelectorAll("[data-mv-var], [data-mv-out]")){const t=e.defs.get(n.dataset.mvVar??n.dataset.mvOut);if(!t)continue;const s=c.textOf(t);void 0!==n.dataset.mvOut?n.textContent=s:n.value!==s&&n!==n.ownerDocument?.activeElement&&(n.value=s)}u=e})()):d&&g(!0))});function g(e){$(),t.removeEventListener("input",p),t.removeEventListener("change",p),t.removeEventListener("dblclick",h),q.delete(v),W.delete(t),e&&c.own(t,null)}const v={element:t,store:c,stop:g,connected:()=>d};return q.add(v),W.set(t,v),t}export{v as extractMath,L as markdownToHTML,A as renderMarkdown,R as renderMarkdownInto,s as variables};

package/inlinemath.css

@@ -98,19 +98,42 @@ span.mv-delim { width: 0.16em; border: 0 solid currentColor; box-sizing: border-
 /* ---- piecewise ------------------------------------------------------------- */
 .mv-cases { display: inline-grid; grid-template-columns: auto auto; column-gap: 1em; row-gap: 0.25em; align-items: baseline; text-align: left; margin: 0 0.1em; }
 .mv-case-value, .mv-case-cond { display: block; }
+.mv-matrix { display: inline-grid; column-gap: 0.8em; row-gap: 0.3em; align-items: baseline; justify-items: center; margin: 0 0.15em; }
+.mv-matrix-row { display: contents; }
+.mv-matrix-cell { display: block; }
 
 /* ---- decorations: \boxed \cancel \overline \vec … --------------------------- */
 .mv-boxed { display: inline-block; border: 0.06em solid currentColor; padding: 0.16em 0.2em; }
 .mv-over { display: inline-block; border-top: 0.06em solid currentColor; padding-top: 0.08em; }
 .mv-underline { display: inline-block; border-bottom: 0.06em solid currentColor; padding-bottom: 0.06em; }
-.mv-cancel { display: inline-block; background: linear-gradient(to top right, transparent calc(50% - 0.04em), currentColor calc(50% - 0.03em), currentColor calc(50% + 0.03em), transparent calc(50% + 0.04em)); }
+.mv-cancel { display: inline-block; position: relative; }
+.mv-cancel-line { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
 .mv-accent { display: inline-block; position: relative; padding-top: 0.3em; }
 .mv-accent-mark { position: absolute; top: 0; left: 0; right: 0; text-align: center; font-size: 0.7em; line-height: 0.6; }
 
 /* ---- interaction -------------------------------------------------------------- */
 .mv-hl { background: var(--mv-hl, rgba(255, 200, 0, 0.35)); box-shadow: 0 0 0 0.08em var(--mv-hl, rgba(255, 200, 0, 0.35)); }
+/* Windows high contrast (and other forced colours) drops backgrounds and shadows: outline a highlight instead */
+@media (forced-colors: active) {
+  .mv-hl { outline: 0.08em solid Highlight; outline-offset: 0.04em; }
+}
 .mv-clickable .mv-n { cursor: pointer; }
+.mv-editable .mv-n:hover { outline: 1px dashed rgba(0, 0, 0, 0.25); }
+/* the box editing a part in place (view.editable, or a Markdown textbox variable) */
+.mv-edit { transform: translateY(-50%); z-index: 1000; box-sizing: content-box; padding: 0.1em 0.35em; font-family: inherit;
+  border: 1px solid #1a5fb4; border-radius: 0.25em; background: #fff; color: #111; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18); }
+.mv-edit[aria-invalid="true"] { border-color: #c33; outline: 2px solid #c33; }
+/* the live region a view announces steps through ({ announce: true }): read, never seen */
+.mv-sr-only, .mv-sr-math { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
 .mv-clickable .mv-n:hover { outline: 1px dashed rgba(0, 0, 0, 0.25); }
+/* the keyboard: the expression is one tab stop, and the part the arrow keys are on is ringed */
+.mv[tabindex]:focus-visible { outline: 0.1em solid #1a5fb4; outline-offset: 0.12em; }
+.mv[tabindex]:focus .mv-focus { outline: 0.1em solid #1a5fb4; outline-offset: 0.06em; border-radius: 0.1em; }
+/* while a part is ringed, the whole expression's ring steps back so the part is the one that stands out */
+.mv[tabindex]:focus-visible:has(.mv-focus) { outline: 1px dashed #1a5fb4; }
+@media (forced-colors: active) {
+  .mv[tabindex]:focus-visible, .mv[tabindex]:focus .mv-focus { outline-color: Highlight; }
+}
 
 /* ---- steps (stepsHTML from '@mathzetta/inlinemath/cas') ---------------------------------------- */
 .mv-steps { margin: 0; padding-left: 1.6em; }
@@ -125,3 +148,11 @@ span.mv-delim { width: 0.16em; border: 0 solid currentColor; box-sizing: border-
 .mv-md-display { display: block; text-align: center; margin: 0.6em 0; overflow-x: auto; }
 .mv-md-block { margin: 0.8em 0; }
 .mv-md-error code { background: rgba(200, 60, 0, 0.08); color: #a33; border-bottom: 1px dotted #a33; }
+/* saved variables: $A := 2+2$ draws A ≔ 2 + 2; $A := [[…]]$ an input that sets A */
+.mv-md-input-def { display: inline-flex; align-items: center; gap: 0.3em; }
+.mv-md-assign { margin: 0 0.1em; }
+.mv-md-input { font: inherit; font-size: 0.9em; }
+input.mv-md-textbox { font-family: inherit; padding: 0.05em 0.3em; field-sizing: content; min-width: 3ch; }
+input.mv-md-textbox[aria-invalid="true"] { outline: 2px solid #c33; outline-offset: 1px; }
+input.mv-md-slider { vertical-align: middle; }
+.mv-md-output { font-variant-numeric: tabular-nums; min-width: 2ch; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mathzetta/inlinemath",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Draw calculus-level maths as HTML and CSS from anything MathZetta reads, with every part addressable.",
   "type": "module",
   "main": "src/index.js",
@@ -47,12 +47,12 @@
   },
   "peerDependencies": {
     "@mathzetta/cas": "^0.1.0",
-    "mathzetta": "^1.0.0"
+    "mathzetta": "^1.1.0"
   },
   "devDependencies": {
     "@rollup/plugin-terser": "^0.4.4",
     "@mathzetta/cas": "^0.1.0",
-    "mathzetta": "^1.0.0",
+    "mathzetta": "^1.1.0",
     "rollup": "^4.65.0"
   },
   "license": "MIT",

package/src/cas.js

@@ -9,9 +9,10 @@
  *   toHTML('{{solve(x^2 - 5x + 6 = 0, x)}}', { blocks: casBlocks() })   // x = 2 or x = 3
  *   stepsHTML(mathCAS().diff('x^2 sin x', 'x', { steps: 'brief' }).steps)
  *
- * Block functions: simplify, expand, factor, cancel, diff(f, x[, n]), integrate(f, x[, a, b]),
- * solve(equation, x), approx(expr[, digits]); d/dx … and ∫ … without limits go to the CAS
- * too. Everything else is MathZetta's calculator (calculateBlock), as without this.
+ * Block functions: simplify, expand, factor, cancel, diff(f, x[, n]) (or der, derivative,
+ * differentiate), integrate(f, x[, a, b]) (or integral), solve(equation, x), approx(expr[, digits]);
+ * d/dx … and ∫ … without limits go to the CAS too. In Markdown, saved variables ($_f := x^3$)
+ * stand for their expressions: {{diff(f, x)}}. Everything else is MathZetta's calculator (calculateBlock), as without this.
  *
  * Needs @mathzetta/cas (a peer dependency, like mathzetta).
  */
@@ -24,6 +25,8 @@ import { calculateBlock } from './calculator.js';
 import { toText } from 'mathzetta/text';
 import { toHTML } from './html.js';
 
+const EXPRESSIONS = Symbol.for('inlinemath.expressions');   // as variables.js
+
 const shared = new Map();
 
 /** How the complex functions are written for MathZetta: Re z, Im z, z̄ (an overline), arg z. */
@@ -69,13 +72,17 @@ export function mathCAS(options = {}) {
 }
 
 const CALLS = new Set(['simplify', 'expand', 'factor', 'cancel', 'diff', 'integrate', 'solve', 'approx']);
+// other names people write for them
+const ALIASES = { integral: 'integrate', differentiate: 'diff', approximate: 'approx', simp: 'simplify' };
 
 /**
  * A `{{…}}` handler: pass it as toHTML(input, { blocks: casBlocks() }).
- * @param {object} [options] { cas } a CAS of your own (mathCAS({ rules })), { steps } kept on the handler's `last`
+ * @param {object} [options] { cas } a CAS of your own (mathCAS({ rules })); { steps } how much working each call
+ *   keeps (the CAS's steps option: true, 'brief', false), read from the handler's `last` after a block
  */
 export function casBlocks(options = {}) {
   const cas = options.cas ?? mathCAS();
+  const how = options.steps === undefined ? {} : { steps: options.steps };
   const handler = (text, scope) => {
     let tokens;
     try {
@@ -83,8 +90,11 @@ export function casBlocks(options = {}) {
     } catch {
       return calculateBlock(text, scope);
     }
+    // saved variables ($_f := x^3$ in Markdown) stand for their expressions: {{diff(f, x)}}
+    const saved = scope && scope[EXPRESSIONS];
+    if (saved) tokens = tokens.flatMap((t) => (Object.hasOwn(saved, t) ? saved[t] : [t]));
     const head = tokens[tokens.length - 1];
-    const name = head?.startsWith('\\:') ? head.slice(2) : null;
+    const name = head?.startsWith('\\:') ? (ALIASES[head.slice(2)] ?? head.slice(2)) : null;
     const symbolic = name && CALLS.has(name);
     // d/dx …, ∫ … dx and ∫ from a to b … dx (MathZetta writes the limits as int's 3rd and 4th operands)
     const calculus = head === 'der' || head === 'int';
@@ -95,16 +105,16 @@ export function casBlocks(options = {}) {
     let r;
     try {
       switch (symbolic ? name : head === 'der' ? 'derivative' : 'antiderivative') {
-        case 'simplify': r = cas.simplify(args[0]); break;
-        case 'expand': r = cas.expand(args[0]); break;
-        case 'factor': r = cas.factor(args[0]); break;
-        case 'cancel': r = cas.cancel(args[0]); break;
-        case 'diff': r = cas.diff(args[0], word(args[1]), { order: args[2] ? Number(args[2].s) : 1 }); break;
-        case 'integrate': r = cas.integrate(args[0], word(args[1]), args[3] ? { from: args[2].s, to: args[3].s } : {}); break;
-        case 'solve': r = cas.solve(args[0], word(args[1])); break;
-        case 'approx': r = cas.approximate(args[0], { digits: args[1] ? Number(args[1].s) : 15 }); break;
-        case 'derivative': r = cas.diff(node.args[0], node.args[1].s); break;
-        default: r = cas.integrate(node); break;
+        case 'simplify': r = cas.simplify(args[0], how); break;
+        case 'expand': r = cas.expand(args[0], how); break;
+        case 'factor': r = cas.factor(args[0], how); break;
+        case 'cancel': r = cas.cancel(args[0], how); break;
+        case 'diff': r = cas.diff(args[0], word(args[1]), { ...how, order: args[2] ? Number(args[2].s) : 1 }); break;
+        case 'integrate': r = cas.integrate(args[0], word(args[1]), { ...how, ...(args[3] ? { from: args[2].s, to: args[3].s } : {}) }); break;
+        case 'solve': r = cas.solve(args[0], word(args[1]), how); break;
+        case 'approx': r = cas.approximate(args[0], { ...how, digits: args[1] ? Number(args[1].s) : 15 }); break;
+        case 'derivative': r = cas.diff(node.args[0], node.args[1].s, how); break;
+        default: r = cas.integrate(node, undefined, how); break;
       }
     } catch (error) {
       // no answer: leave it as written, as calculateBlock does

package/src/edit.js

@@ -0,0 +1,96 @@
+/**
+ * Editing a part of a drawn expression in place: a text box opens over the part, holding the
+ * part as text; Enter puts what was typed back into the expression, Escape (or leaving it with
+ * something that doesn't read) changes nothing. Used by View.editable() and by the Markdown
+ * pages' textbox variables.
+ *
+ * The part is written as text by MathZetta's toText, which the caller passes in (import it
+ * from 'mathzetta/text'): Inline Math's core imports only 'mathzetta', 'mathzetta/speech' and
+ * 'mathzetta/calculate', so a buildless page's import map stays the same.
+ */
+
+import { bare } from './variables.js';
+
+/** A copy of `tree` (ids dropped) with the node at `path` replaced by `part`. */
+export function replaceAt(tree, path, part) {
+    const visit = (n, k) => (k === path.length
+        ? part
+        : { ...n, args: n.args.map((a, j) => (j === path[k] ? visit(a, k + 1) : a)) });
+    return bare(visit(tree, 0));
+}
+
+/**
+ * Open a text box over `element` holding `text`.
+ * @param {Element} element the drawn part
+ * @param {string} text what the box starts with
+ * @param {object} how
+ * @param {(text: string) => object} how.parse the typed text → a tree (throws if it doesn't read)
+ * @param {(tree: object, text: string) => void} how.commit called with the new part
+ * @param {() => void} [how.cancel] called when nothing changed
+ * @param {string} [how.label] the box's accessible name
+ * @returns {HTMLInputElement|null}
+ */
+export function openEditor(element, text, { parse, commit, cancel, label = 'Edit' }) {
+    const doc = element.ownerDocument;
+    if (!doc || !doc.body) return null;
+    const view = doc.defaultView;
+    const r = element.getBoundingClientRect();
+    const input = doc.createElement('input');
+    input.type = 'text';
+    input.className = 'mv-edit';
+    input.value = text;
+    input.spellcheck = false;
+    input.autocomplete = 'off';
+    input.setAttribute('aria-label', label);
+    const fit = () => { input.style.width = `${Math.max(4, input.value.length + 2)}ch`; };
+    const font = view.getComputedStyle(element);
+    Object.assign(input.style, {
+        position: 'absolute',
+        left: `${r.left + view.scrollX}px`,
+        top: `${r.top + view.scrollY + r.height / 2}px`,
+        minWidth: `${Math.max(r.width, 32)}px`,
+        fontSize: font.fontSize,
+    });
+    fit();
+    doc.body.appendChild(input);
+    view.getSelection?.()?.removeAllRanges();   // the double-click selected a word of the page
+    input.focus();
+    input.select();
+
+    let done = false;
+    const close = () => {
+        done = true;
+        input.remove();
+    };
+    const finish = (keep) => {
+        if (done) return true;
+        if (!keep || input.value === text) {
+            close();
+            if (cancel) cancel();
+            return true;
+        }
+        let tree;
+        try {
+            tree = parse(input.value);
+        } catch (error) {
+            input.setAttribute('aria-invalid', 'true');
+            input.title = error.message;
+            return false;
+        }
+        close();
+        commit(tree, input.value);
+        return true;
+    };
+    input.addEventListener('keydown', (event) => {
+        event.stopPropagation();   // the view's arrow keys are not for the box
+        if (event.key === 'Enter') { event.preventDefault(); finish(true); }
+        if (event.key === 'Escape') { event.preventDefault(); finish(false); }
+    });
+    input.addEventListener('input', () => {
+        fit();
+        input.removeAttribute('aria-invalid');
+        input.removeAttribute('title');
+    });
+    input.addEventListener('blur', () => { if (!finish(true)) finish(false); });
+    return input;
+}

package/src/glyphs.js

@@ -18,6 +18,8 @@ export const PATHS = {
     '}': { fill: 'M0,0 C0.55,0 0.5,0.05 0.5,0.2 L0.5,0.38 C0.5,0.46 0.65,0.49 0.95,0.5 C0.65,0.51 0.5,0.54 0.5,0.62 L0.5,0.8 C0.5,0.95 0.55,1 0,1 L0,0.985 C0.32,0.985 0.36,0.95 0.36,0.8 L0.36,0.62 C0.36,0.53 0.45,0.505 0.7,0.5 C0.45,0.495 0.36,0.47 0.36,0.38 L0.36,0.2 C0.36,0.05 0.32,0.015 0,0.015 Z' },
     // Radical: short tick, long down-stroke, long up-stroke to the top right.
     'sqrt': { stroke: 'M0,0.62 L0.18,0.55 L0.45,0.97 L0.98,0.015' },
+    // \cancel: one stroke, bottom left to top right, stretched over what it crosses out.
+    'cancel': { stroke: 'M0,1 L1,0' },
     // Integral: an S slanted to the right with small hooks at each end.
     'int': { stroke: 'M0.95,0.09 C0.9,0.01 0.72,0 0.66,0.12 C0.6,0.25 0.42,0.75 0.34,0.88 C0.28,0.99 0.1,0.99 0.05,0.91' },
     'sum': { fill: 'M0.04,0 L0.94,0 L0.98,0.24 L0.94,0.24 C0.9,0.1 0.8,0.07 0.62,0.07 L0.24,0.07 L0.58,0.5 L0.2,0.93 L0.64,0.93 C0.82,0.93 0.92,0.9 0.95,0.76 L0.99,0.76 L0.94,1 L0.02,1 L0.47,0.47 Z' },

package/src/index.d.ts

@@ -1,3 +1,3 @@
 // '@mathzetta/inlinemath' — drawing, the live view, selection. See types.d.ts.
-export type { Input, Node, Target, LayoutOptions, DrawOptions, ClickInfo } from './types.js';
-export { toHTML, treeOf, layout, DEFAULTS, View, render, select, signature, nodeAt, pathOf, numberTree, PATHS } from './types.js';
+export type { Input, Node, Target, LayoutOptions, DrawOptions, ViewOptions, ClickInfo } from './types.js';
+export { toHTML, treeOf, layout, DEFAULTS, View, render, shouldAnimate, select, signature, nodeAt, pathOf, numberTree, PATHS } from './types.js';

package/src/index.js

@@ -12,6 +12,6 @@
 
 export { toHTML, treeOf } from './html.js';
 export { layout, DEFAULTS } from './layout.js';
-export { View, render } from './view.js';
+export { View, render, shouldAnimate } from './view.js';
 export { select, signature, nodeAt, pathOf, numberTree } from './select.js';
 export { PATHS } from './glyphs.js';

package/src/layout.js

@@ -21,7 +21,7 @@
 import {
     GREEK, needsBrackets, unaryNeedsBrackets, isMinusOneTimes, isImplicitProduct, isVariable,
     firstLeaf, customName, derivativeOrder, bracketedSides, bracketOp, firstVariable,
-    isCustomFunction, precedenceOf, toSpeech,
+    isCustomFunction, precedenceOf, toAudioSpeech, MATRICES, matrixRows,
 } from './mathzetta.js';
 import { svg } from './glyphs.js';
 
@@ -42,6 +42,7 @@ const OP_CLASS = {
     '&': 'and', '|': 'or', '\\not': 'not', '\\xor': 'xor', '\\nand': 'nand', '\\nor': 'nor', '?:': 'cases',
     '()': 'tuple', '[]': 'list', '{}': 'set', '(]': 'interval', '[)': 'interval',
     '\\sumidx': 'sum', '\\prodidx': 'prod', 'mod': 'mod', 'pmod': 'pmod',
+    pmatrix: 'matrix', bmatrix: 'matrix', vmatrix: 'matrix',
 };
 
 const RELATIONS = {
@@ -54,7 +55,7 @@ const BINARY = { '±': '±', '∪': '∪', '∩': '∩', 'mod': 'mod' };
 const TRIG = ['sin', 'cos', 'tan', 'csc', 'sec', 'cot', 'sinh', 'cosh', 'tanh'];
 const INVERSE = { arcsin: 'sin', arccos: 'cos', arctan: 'tan', arcsinh: 'sinh', arccosh: 'cosh', arctanh: 'tanh' };
 /** Functions written with a name and, when the argument is simple, no brackets: sin x, ln x. */
-const NAMED = [...TRIG, ...Object.keys(INVERSE), 'ln'];
+const NAMED = [...TRIG, ...Object.keys(INVERSE), 'ln', 'det'];
 /** Functions always written with brackets: max(a, b). */
 const CALLS = { atan2: 'atan2', max: 'max', min: 'min', gcd: 'gcd', mean: 'mean', round: 'round', fixed: 'fixed', expm1: 'expm1', random: 'random' };
 
@@ -74,7 +75,8 @@ export const DEFAULTS = {
     derivativeBrackets: '[', // d/dx [x² + 1], or '(' for d/dx (x² + 1)
     scriptFractions: 'slash',// x^{1/2} written x^{1/2} with a slash; 'stack' stacks it
     cases: true,             // c ? a : b drawn as a piecewise brace
-    label: true,             // accessible name of the whole expression: true = the spoken form, a string, (tree) => string, or false
+    label: true,             // accessible name of the whole expression: true = MathZetta's toAudioSpeech (the grouping in the words), a string, (tree) => string, or false
+    mathml: null,            // MathZetta's toMathML (import it from 'mathzetta/mathml'): also write the expression as visually hidden MathML, which screen readers can step through and show in math braille; it replaces the label
     attributes: null,        // (node) => ({ ... }) extra attributes for a node's element
     style: null,             // (node) => 'css' inline style for a node's element
 };
@@ -102,18 +104,34 @@ export function layout(tree, options = {}) {
     const r = new Layout({ ...DEFAULTS, ...options });
     const b = r.render(tree, { level: 0 });
     const cls = `${r.p}${r.o.display ? ` ${r.p}-display` : ''}`;
-    // Screen readers get the expression read as a teacher would; the spans and glyphs inside are not read piecemeal.
-    const label = accessibleName(tree, r.o.label);
-    const body = label === null ? b.html : b.html.replace(/^<span /, '<span aria-hidden="true" ');
+    // Screen readers get the expression as MathML they can walk (mathml: true), or read as a teacher would (the
+    // label); the spans and glyphs of the drawing are never read piecemeal.
+    const mathml = typeof r.o.mathml === 'function' ? assistiveMathML(r.o.mathml, tree, r.p, r.o.display) : '';
+    const label = mathml ? null : accessibleName(tree, r.o.label);
+    const body = label === null && !mathml ? b.html : b.html.replace(/^<span /, '<span aria-hidden="true" ');
     const attrs = label === null ? '' : ` role="math" aria-label="${escape(label)}"`;
-    return { html: `<span class="${cls}"${attrs}>${body}</span>`, h: b.h, d: b.d };
+    return { html: `<span class="${cls}"${attrs}>${body}${mathml}</span>`, h: b.h, d: b.d };
+}
+
+/**
+ * The expression as MathML for assistive technology: no ids (two drawings on a page must not share them), hidden
+ * from sight. The page passes MathZetta's toMathML, so Inline Math itself imports only what every page maps.
+ */
+function assistiveMathML(toMathML, tree, prefix, display) {
+    try {
+        return String(toMathML(tree)).replace(/ id="mz-\d+"/g, '')
+            .replace(/^<math>/, `<math class="${prefix}-sr-math"${display ? ' display="block"' : ''}>`);
+    } catch {
+        return '';   // nothing MathZetta can write as MathML: the label stands in
+    }
 }
 
 function accessibleName(tree, label) {
     if (label === false || label === null) return null;
     if (typeof label === 'string') return label;
     try {
-        return typeof label === 'function' ? label(tree) : toSpeech(tree);
+        // a screen reader is speech with no drawing in view: the grouping has to be in the words
+        return typeof label === 'function' ? label(tree) : toAudioSpeech(tree);
     } catch {
         return null;
     }
@@ -199,6 +217,8 @@ class Layout {
         if (NAMED.includes(op) || op === 'log') return wrap(this.named(node, ctx));
         if (CALLS[op]) return wrap(row(this.word(CALLS[op]), this.fence(this.list(args, ctx))));
         if (isCustomFunction(op)) return wrap(this.custom(node, ctx));
+        const rows = matrixRows(node);   // pmatrix, bmatrix, vmatrix, and [[1, 2], [3, 4]]
+        if (rows) return wrap(this.matrix(node, rows, ctx));
         if (GROUPS[op]) return wrap(this.fence(this.list(args, ctx), ...GROUPS[op]));
         if (RELATIONS[op] && args.length === 2) return wrap(row(side(a, 'left'), this.rel(RELATIONS[op]), side(b, 'right')));
         if (BINARY[op] && args.length === 2) return wrap(row(side(a, 'left'), this.bin(BINARY[op]), side(b, 'right')));
@@ -325,7 +345,8 @@ class Layout {
     decorate(name, b) {
         switch (name) {
             case 'boxed': return box(this.el('boxed', b.html), b.h + 0.22, b.d + 0.22);
-            case 'cancel': return box(this.el('cancel', b.html), b.h, b.d);
+            // a drawn stroke, not a background: Windows high contrast drops backgrounds, and a cancelled term would look kept
+            case 'cancel': return box(this.el('cancel', b.html + svg('cancel', `${this.p}-cancel-line`)), b.h, b.d);
             case 'underline': return box(this.el('underline', b.html), b.h, b.d + 0.12);
             case 'overline': case 'bar': return box(this.el('over', b.html), b.h + 0.14, b.d);
             default: return box(this.el('accent', this.el('accent-mark', ACCENTS[name]) + b.html), b.h + 0.3, b.d);
@@ -557,6 +578,28 @@ class Layout {
         return row(op, body);
     }
 
+    /**
+     * A matrix: a grid of entries, centred on the maths axis, in brackets as tall as it is. Each
+     * row that is a list in the tree is an element of its own (display: contents), so a row can
+     * be pointed at like any part.
+     */
+    matrix(node, rows, ctx) {
+        const ROWGAP = 0.3;
+        const cells = rows.map((r) => r.map((c) => this.render(c, ctx)));
+        const heights = cells.map((r) => ({ h: Math.max(LH, ...r.map((b) => b.h)), d: Math.max(LD, ...r.map((b) => b.d)) }));
+        const total = heights.reduce((s, x) => s + x.h + x.d, 0) + ROWGAP * (rows.length - 1);
+        const lift = AXIS + total / 2 - heights[0].h;   // the first row's baseline
+        const html = cells.map((r, i) => {
+            const inner = r.map((b) => this.el('matrix-cell', b.html)).join('');
+            const tree = node.args[i];
+            return tree && tree.type === 'op' && tree.op === '[]' ? this.wrap(tree, ['op', 'op-list', 'matrix-row'], box(inner)).html : inner;
+        }).join('');
+        const columns = rows[0].length;
+        const grid = box(this.el('matrix', html, `grid-template-columns:repeat(${columns},auto);vertical-align:${em(lift)}`), AXIS + total / 2, total / 2 - AXIS);
+        const [open, close] = MATRICES[node.op] ?? ['[', ']'];
+        return this.fence(grid, open, close);
+    }
+
     /** c ? a : b  →  a brace with "a  if c", "b  otherwise". Nested ternaries add rows. */
     cases(node, ctx) {
         const rows = [];
@@ -565,7 +608,8 @@ class Layout {
             rows.push([this.render(n.args[1], ctx), row(this.word('if'), this.text('space', ''), this.render(n.args[0], ctx))]);
             n = n.args[2];
         }
-        rows.push([this.render(n, ctx), this.word('otherwise')]);
+        // a case nobody wrote (`unchanged`: no else, no otherwise row) is not drawn
+        if (!(n.type === 'symbol' && n.value === 'unchanged')) rows.push([this.render(n, ctx), this.word('otherwise')]);
         const ROWGAP = 0.25;
         const heights = rows.map(([v, c]) => ({ h: Math.max(v.h, c.h), d: Math.max(v.d, c.d) }));
         const total = heights.reduce((s, x) => s + x.h + x.d, 0) + ROWGAP * (rows.length - 1);
@@ -583,7 +627,7 @@ function isSimpleArgument(node, inScript = false) {
     if (node.type === 'number') return !node.value.startsWith('-') || inScript;
     if (node.type === 'symbol') return true;
     if (node.type !== 'op') return false;
-    if (node.op === 'abs') return !inScript;
+    if (node.op === 'abs' || matrixRows(node)) return !inScript;   // |x| and a matrix bring their own brackets
     if (inScript && (node.op === 'neg' || node.op === '^')) return isSimpleArgument(node.args[0], true) && (node.op === 'neg' || isSimpleArgument(node.args[1], true));
     if (node.op === '*' && !isMinusOneTimes(node)) {
         return node.args.every((c) => (c.type === 'number' && !c.value.startsWith('-')) || isShortSymbol(c) || (c.op === '*' && isSimpleArgument(c, inScript)));