domma-cms 0.70.0 → 0.71.0

package/admin/js/views/page-editor.js

@@ -1,18 +1,18 @@
-import{api as L}from"../api.js";import{CardBuilder as Re}from"../lib/card-builder.js";import{TimelineBuilder as Be}from"../lib/timeline-builder.js";import{attachEditorKeybindings as Ie,createToolbar as He,insertAtCursor as $e}from"../lib/markdown-toolbar.js";import{EffectsBuilder as Ue}from"../lib/effects-builder.js";import{attachContextMenu as qe}from"../lib/shortcode-context-menu.js";import{registerCustomInserters as Oe}from"../lib/shortcode-insert.js";import{populateThemeSelect as Ve}from"../lib/themes.js";import{createFoldingManager as We}from"../lib/editor-folding.js";import{openScribeComposer as Ye}from"../lib/scribe-composer.js";import{openCrudTutorial as Ge}from"../lib/crud-tutorial.js";function _e(){const e=E.slideover({title:"Editor Reference",size:"md",position:"right"}),z="background:var(--dm-background-alt,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;",v="margin:1rem 0 .5rem;font-size:1rem;";function s(r){const d=document.createElement("code");return d.style.cssText=z,d.textContent=r,d}function C(r){const d=document.createElement("h3");return d.style.cssText=v,d.textContent=r,d}const Z=document.createElement("div");Z.style.cssText="padding:1rem;";const ne=document.createElement("div");ne.className="tabs";const ae=document.createElement("div");ae.className="tab-list",["Basics","Layout","Components","Data","Advanced"].forEach((r,d)=>{const n=document.createElement("button");n.className="tab-item"+(d===0?" active":""),n.textContent=r,ae.appendChild(n)});const m=document.createElement("div");m.className="tab-content";const O="display:flex;flex-direction:column;gap:1rem;",M=document.createElement("div");M.className="tab-panel active",M.style.cssText=O;const B=document.createElement("div");B.className="tab-panel",B.style.cssText=O;const N=document.createElement("div");N.className="tab-panel",N.style.cssText=O;const P=document.createElement("div");P.className="tab-panel",P.style.cssText=O;const J=document.createElement("div");J.className="tab-panel",J.style.cssText=O,m.appendChild(M),m.appendChild(B),m.appendChild(N),m.appendChild(P),m.appendChild(J),ne.appendChild(ae),ne.appendChild(m),Z.appendChild(ne);const _=document.createElement("div");_.appendChild(C("Markdown Basics"));const F=document.createElement("table");F.style.cssText="width:100%;border-collapse:collapse;font-size:.9em;";const g=document.createElement("thead"),y=document.createElement("tr");["Syntax","Result"].forEach(r=>{const d=document.createElement("th");d.style.cssText="text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);",d.textContent=r,y.appendChild(d)}),g.appendChild(y),F.appendChild(g);const U=document.createElement("tbody");[["**bold**","bold (rendered bold)"],["_italic_","italic (rendered italic)"],["## Heading","Heading (h2)"],["[text](url)","Link"],["![alt](url)","Image"],["- item","Bullet list"],["`code`","Inline code"],["---","Divider"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.35rem .5rem;vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.35rem .5rem;vertical-align:top;color:var(--dm-text-muted,#aaa);font-size:.85em;",o.textContent=d,n.appendChild(a),n.appendChild(o),U.appendChild(n)}),F.appendChild(U),_.appendChild(F),M.appendChild(_);const x=document.createElement("div");x.appendChild(C("Grid & Columns"));function f(r){const d=document.createElement("p");return d.style.cssText="margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);",d.textContent=r,d}function i(r,d,n){const a=document.createElement("p");a.style.cssText="margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;",a.textContent=r;const o=document.createElement("div");o.style.cssText="position:relative;";const xe=document.createElement("pre");xe.style.cssText=z+"display:block;padding:.5rem 2rem .5rem .75rem;white-space:pre;overflow-x:auto;margin:0;",xe.textContent=d;const X=document.createElement("button");X.type="button",X.title="Copy code",X.style.cssText="position:absolute;top:.3rem;right:.3rem;background:none;border:none;cursor:pointer;opacity:.45;padding:.15rem;line-height:1;color:inherit;",X.addEventListener("mouseenter",()=>{X.style.opacity="1"}),X.addEventListener("mouseleave",()=>{X.style.opacity=".45"});const Pe=document.createElement("span");Pe.setAttribute("data-icon","copy"),X.appendChild(Pe),X.addEventListener("click",()=>{const ke=document.createElement("textarea");ke.value=d,ke.style.cssText="position:fixed;opacity:0;",document.body.appendChild(ke),ke.select(),document.execCommand("copy"),ke.remove(),E.toast("Copied!",{type:"success",duration:1200})}),o.appendChild(xe),o.appendChild(X);const Se=document.createDocumentFragment();return Se.appendChild(a),Se.appendChild(o),n&&Se.appendChild(f(n)),Se}const w=document.createElement("table");w.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['cols="N"',"[grid] only","Number of columns (1-12)"],['gap="N"',"[grid], [row]","Gap between columns/rows (1-6)"],['span="N"',"[col] only","How many columns this cell spans"],['fullwidth="true"',"[grid] only","Break out of page container to span full viewport"],['class="x"',"all","Add extra CSS classes"]].forEach(([r,d,n])=>{const a=document.createElement("tr");[r,d,n].forEach((o,xe)=>{const X=document.createElement("td");X.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",xe===0?X.appendChild(s(r)):(X.style.color="var(--dm-text-muted,#aaa)",X.textContent=o),a.appendChild(X)}),w.appendChild(a)}),x.appendChild(w),x.appendChild(i("Equal columns",`[grid cols="3" gap="4"]
+import{api as L}from"../api.js";import{CardBuilder as Re}from"../lib/card-builder.js";import{TimelineBuilder as Be}from"../lib/timeline-builder.js";import{attachEditorKeybindings as Ie,createToolbar as He,insertAtCursor as $e}from"../lib/markdown-toolbar.js";import{EffectsBuilder as Ue}from"../lib/effects-builder.js";import{attachContextMenu as qe}from"../lib/shortcode-context-menu.js";import{registerCustomInserters as Oe}from"../lib/shortcode-insert.js";import{populateThemeSelect as Ve}from"../lib/themes.js";import{createFoldingManager as We}from"../lib/editor-folding.js";import{openScribeComposer as Ye}from"../lib/scribe-composer.js";import{openCrudTutorial as Ge}from"../lib/crud-tutorial.js";function je(){const e=E.slideover({title:"Editor Reference",size:"md",position:"right"}),A="background:var(--dm-background-alt,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;",v="margin:1rem 0 .5rem;font-size:1rem;";function s(c){const r=document.createElement("code");return r.style.cssText=A,r.textContent=c,r}function b(c){const r=document.createElement("h3");return r.style.cssText=v,r.textContent=c,r}const V=document.createElement("div");V.style.cssText="padding:1rem;";const W=document.createElement("div");W.className="tabs";const Y=document.createElement("div");Y.className="tab-list",["Basics","Layout","Components","Data","Advanced"].forEach((c,r)=>{const n=document.createElement("button");n.className="tab-item"+(r===0?" active":""),n.textContent=c,Y.appendChild(n)});const i=document.createElement("div");i.className="tab-content";const P="display:flex;flex-direction:column;gap:1rem;",B=document.createElement("div");B.className="tab-panel active",B.style.cssText=P;const H=document.createElement("div");H.className="tab-panel",H.style.cssText=P;const z=document.createElement("div");z.className="tab-panel",z.style.cssText=P;const F=document.createElement("div");F.className="tab-panel",F.style.cssText=P;const Z=document.createElement("div");Z.className="tab-panel",Z.style.cssText=P,i.appendChild(B),i.appendChild(H),i.appendChild(z),i.appendChild(F),i.appendChild(Z),W.appendChild(Y),W.appendChild(i),V.appendChild(W);const K=document.createElement("div");K.appendChild(b("Markdown Basics"));const M=document.createElement("table");M.style.cssText="width:100%;border-collapse:collapse;font-size:.9em;";const g=document.createElement("thead"),C=document.createElement("tr");["Syntax","Result"].forEach(c=>{const r=document.createElement("th");r.style.cssText="text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);",r.textContent=c,C.appendChild(r)}),g.appendChild(C),M.appendChild(g);const q=document.createElement("tbody");[["**bold**","bold (rendered bold)"],["_italic_","italic (rendered italic)"],["## Heading","Heading (h2)"],["[text](url)","Link"],["![alt](url)","Image"],["- item","Bullet list"],["`code`","Inline code"],["---","Divider"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.35rem .5rem;vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.35rem .5rem;vertical-align:top;color:var(--dm-text-muted,#aaa);font-size:.85em;",o.textContent=r,n.appendChild(a),n.appendChild(o),q.appendChild(n)}),M.appendChild(q),K.appendChild(M),B.appendChild(K);const x=document.createElement("div");x.appendChild(b("Grid & Columns"));function f(c){const r=document.createElement("p");return r.style.cssText="margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);",r.textContent=c,r}function l(c,r,n){const a=document.createElement("p");a.style.cssText="margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;",a.textContent=c;const o=document.createElement("div");o.style.cssText="position:relative;";const xe=document.createElement("pre");xe.style.cssText=A+"display:block;padding:.5rem 2rem .5rem .75rem;white-space:pre;overflow-x:auto;margin:0;",xe.textContent=r;const ee=document.createElement("button");ee.type="button",ee.title="Copy code",ee.style.cssText="position:absolute;top:.3rem;right:.3rem;background:none;border:none;cursor:pointer;opacity:.45;padding:.15rem;line-height:1;color:inherit;",ee.addEventListener("mouseenter",()=>{ee.style.opacity="1"}),ee.addEventListener("mouseleave",()=>{ee.style.opacity=".45"});const Pe=document.createElement("span");Pe.setAttribute("data-icon","copy"),ee.appendChild(Pe),ee.addEventListener("click",()=>{const ke=document.createElement("textarea");ke.value=r,ke.style.cssText="position:fixed;opacity:0;",document.body.appendChild(ke),ke.select(),document.execCommand("copy"),ke.remove(),E.toast("Copied!",{type:"success",duration:1200})}),o.appendChild(xe),o.appendChild(ee);const Se=document.createDocumentFragment();return Se.appendChild(a),Se.appendChild(o),n&&Se.appendChild(f(n)),Se}const w=document.createElement("table");w.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['cols="N"',"[grid] only","Number of columns (1-12)"],['gap="N"',"[grid], [row]","Gap between columns/rows (1-6)"],['span="N"',"[col] only","How many columns this cell spans"],['fullwidth="true"',"[grid] only","Break out of page container to span full viewport"],['class="x"',"all","Add extra CSS classes"]].forEach(([c,r,n])=>{const a=document.createElement("tr");[c,r,n].forEach((o,xe)=>{const ee=document.createElement("td");ee.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",xe===0?ee.appendChild(s(c)):(ee.style.color="var(--dm-text-muted,#aaa)",ee.textContent=o),a.appendChild(ee)}),w.appendChild(a)}),x.appendChild(w),x.appendChild(l("Equal columns",`[grid cols="3" gap="4"]
 [col]One[/col]
 [col]Two[/col]
 [col]Three[/col]
-[/grid]`,"cols sets the track count; each [col] fills one track.")),x.appendChild(i("Column spanning (12-col base)",`[grid cols="12" gap="3"]
+[/grid]`,"cols sets the track count; each [col] fills one track.")),x.appendChild(l("Column spanning (12-col base)",`[grid cols="12" gap="3"]
 [col span="8"]Main content[/col]
 [col span="4"]Sidebar[/col]
-[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),x.appendChild(i("Row (flexbox, equal-width)",`[row gap="4"]
+[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),x.appendChild(l("Row (flexbox, equal-width)",`[row gap="4"]
 [col]Left[/col]
 [col]Right[/col]
-[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),x.appendChild(i("Row with staggered reveal",`[row reveal reveal-mode="stagger" reveal-animation="slide-up" reveal-duration="400" reveal-stagger="60" reveal-delay="0" reveal-direction="ltr"]
+[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),x.appendChild(l("Row with staggered reveal",`[row reveal reveal-mode="stagger" reveal-animation="slide-up" reveal-duration="400" reveal-stagger="60" reveal-delay="0" reveal-direction="ltr"]
 [col]First[/col]
 [col]Second[/col]
 [col]Third[/col]
-[/row]`,'Columns reveal one by one as the row scrolls into view. reveal-direction="rtl" reverses the order. Animations: slide-up, slide-down, slide-left, slide-right, fade, zoom, flip.')),x.appendChild(i("Card in a grid",`[grid cols="3" gap="4"]
+[/row]`,'Columns reveal one by one as the row scrolls into view. reveal-direction="rtl" reverses the order. Animations: slide-up, slide-down, slide-left, slide-right, fade, zoom, flip.')),x.appendChild(l("Card in a grid",`[grid cols="3" gap="4"]
 [col]
 [card title="One"]Content[/card]
 [/col]
@@ -22,21 +22,21 @@ import{api as L}from"../api.js";import{CardBuilder as Re}from"../lib/card-builde
 [col]
 [card title="Three"]Content[/card]
 [/col]
-[/grid]`,null)),B.appendChild(x);const q=document.createElement("div");q.appendChild(C("Cards")),q.appendChild(i("Basic card",`[card title="Optional Title"]
+[/grid]`,null)),H.appendChild(x);const O=document.createElement("div");O.appendChild(b("Cards")),O.appendChild(l("Basic card",`[card title="Optional Title"]
 Markdown **works** here.
-[/card]`,"Omit title for a card with no header.")),q.appendChild(i("Icon - inline (default)",`[card title="Feature" icon="star"]
+[/card]`,"Omit title for a card with no header.")),O.appendChild(l("Icon - inline (default)",`[card title="Feature" icon="star"]
 Icon sits left of the title in a flex row.
-[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),q.appendChild(i("Icon - stacked (centred)",`[card title="Feature" icon="star" icon-layout="stacked" hover]
+[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),O.appendChild(l("Icon - stacked (centred)",`[card title="Feature" icon="star" icon-layout="stacked" hover]
 Icon is centred above the title. Great for feature tiles.
-[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),q.appendChild(i("Icon with subtitle",`[card title="Feature" subtitle="Tagline here" icon="star" icon-layout="stacked"]
+[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),O.appendChild(l("Icon with subtitle",`[card title="Feature" subtitle="Tagline here" icon="star" icon-layout="stacked"]
 Body content.
-[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),q.appendChild(i("Collapsible card",`[card title="Click to expand" collapsible="true"]
+[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),O.appendChild(l("Collapsible card",`[card title="Click to expand" collapsible="true"]
 Hidden by default.
-[/card]`,null)),q.appendChild(i("Full attribute reference",`[card title="Title" subtitle="Sub" icon="star" icon-layout="stacked"
+[/card]`,null)),O.appendChild(l("Full attribute reference",`[card title="Title" subtitle="Sub" icon="star" icon-layout="stacked"
   variant="primary" hover footer="Footer text"
   collapsible="true" class="extra" id="my-card"]
 Body content.
-[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),q.appendChild(i("Rich header / footer sub-tags",`[card]
+[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),O.appendChild(l("Rich header / footer sub-tags",`[card]
 [header]
 ### Custom Title with **bold** and [a link](/about)
 [/header]
@@ -46,47 +46,47 @@ Body content here.
 [footer]
 [Read more](/about) | [icon name="arrow-right" /]
 [/footer]
-[/card]`,"Use [header] and [footer] sub-tags for Markdown-rendered header/footer regions. Sub-tags override the title/subtitle/icon and footer attributes when both are present.")),N.appendChild(q);const oe=document.createElement("div");oe.appendChild(C("Badge")),oe.appendChild(f("Inline badge/label elements. Self-closing renders an empty coloured dot."));const fe=document.createElement("table");fe.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['variant="..."',"primary (default), secondary, success, danger, warning, info, light, dark"],["pill","Flag: rounded pill shape (.badge-pill)"],["outline","Flag: outlined style (.badge-outline)"],['size="small|large"',"Reduced or enlarged badge"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),fe.appendChild(n)}),oe.appendChild(fe),oe.appendChild(i("Basic badge",'[badge variant="success"]New[/badge]',null)),oe.appendChild(i("Pill outline badge",'[badge variant="danger" outline pill]Deprecated[/badge]',null)),N.appendChild(oe);const b=document.createElement("div");b.appendChild(C("Button")),b.appendChild(f("Renders a styled anchor as a Domma button. Use the Insert \u2192 Button toolbar item for a guided dialog."));const A=document.createElement("table");A.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['href="..."',"Link destination (required)"],['label="..."',"Button text (self-closing form)"],['variant="..."',"primary (default), secondary, success, danger, warning, info, outline, ghost, link, outline-*"],['size="sm|lg"',"Button size modifier"],['icon="..."',"Domma icon name before the label"],['icon-after="..."',"Domma icon name after the label"],['target="..."','Link target, e.g. "_blank"'],['class="..."',"Extra CSS classes"],['id="..."',"Element id"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),A.appendChild(n)}),b.appendChild(A),b.appendChild(i("Primary button",'[button href="/contact" variant="primary"]Get in touch[/button]',null)),b.appendChild(i("Self-closing with icon",'[button href="/download" variant="success" icon="download" size="sm" label="Download" /]',null)),b.appendChild(i("Opens in new tab",'[button href="https://example.com" variant="outline" target="_blank"]Visit site[/button]',null)),N.appendChild(b);const j=document.createElement("div");j.appendChild(C("Link (shortcode)")),j.appendChild(f("Renders a plain anchor with optional icon, target, and class. Use Insert \u2192 Link for a guided dialog. For simple inline links, standard Markdown [text](url) is fine."));const ie=document.createElement("table");ie.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['href="..."',"Link destination (required)"],['label="..."',"Link text (self-closing form)"],['target="..."','Link target, e.g. "_blank"'],['class="..."',"CSS classes on the <a>"],['icon="..."',"Domma icon name before the text"],['icon-after="..."',"Domma icon name after the text"],['id="..."',"Element id"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),ie.appendChild(n)}),j.appendChild(ie),j.appendChild(i("External link in new tab",'[link href="https://example.com" target="_blank" icon-after="external-link"]Visit site[/link]',null)),j.appendChild(i("Self-closing with icon",'[link href="/about" icon="arrow-right" label="About us" /]',null)),N.appendChild(j);const le=document.createElement("div");le.appendChild(C("Spacer")),le.appendChild(f("Self-closing shortcode that inserts a fixed-height blank gap."));const ce=document.createElement("table");ce.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['size="N"',"Height in px (default: 8)"],['class="..."',"Extra CSS class on the spacer div"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),ce.appendChild(n)}),le.appendChild(ce),le.appendChild(i("32px gap",'[spacer size="32" /]',null)),B.appendChild(le);const de=document.createElement("div");de.appendChild(C("Icon")),de.appendChild(f("Self-closing shortcode that renders any Domma icon inline."));const pe=document.createElement("table");pe.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['name="..."',"Domma icon name (required). Also accepted as src=."],['size="N"',"Width and height in px"],['color="..."',"CSS colour applied via style"],['class="..."',"Extra CSS classes"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),pe.appendChild(n)}),de.appendChild(pe),de.appendChild(i("Coloured icon",'[icon name="star" size="24" color="#f5a623" /]',null)),N.appendChild(de);const V=document.createElement("div");V.appendChild(C("Center")),V.appendChild(f("Wraps content in a centred div. Works with any content including cards, grids, and text.")),V.appendChild(i("Example","[center]Centred content here[/center]",'Accepts an optional class="..." attribute for extra styling.')),B.appendChild(V);const Q=document.createElement("div");Q.appendChild(C("Hero")),Q.appendChild(f("Full-width hero sections - no plugin required. Uses Domma's built-in Hero CSS component."));const W=document.createElement("table");W.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['title="..."',"Heading text"],['tagline="..."',"Subtitle text"],['size="sm|lg|full"',"Height variant (default: normal)"],['variant="dark|primary|gradient-blue|gradient-purple|gradient-sunset|gradient-ocean"',"Colour / gradient preset"],['image="url"',"Background image URL (adds cover mode)"],['overlay="light|dark|darker|gradient|gradient-reverse"',"Image overlay style"],['align="center|left"',"Content alignment (default: center)"],['fullwidth="true"',"Break out of the page container to span full viewport width"],['bg="..."',"Background colour CSS value"],["twinkle","Flag: adds particle overlay (requires Effects plugin)"],['twinkle-count="N"',"Number of particles"],['twinkle-colour="..."',"Particle colour CSS value"],["blobs","Flag: adds ambient blob background"],['blobs-type="..."',"Blob animation type (default: float-blobs)"],['class="..."',"Extra CSS classes"],['id="..."',"Element id"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),W.appendChild(n)}),Q.appendChild(W),Q.appendChild(i("Basic hero",'[hero title="Welcome" tagline="Build something great"][/hero]',null)),Q.appendChild(i("Gradient with body content",`[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]
+[/card]`,"Use [header] and [footer] sub-tags for Markdown-rendered header/footer regions. Sub-tags override the title/subtitle/icon and footer attributes when both are present.")),z.appendChild(O);const oe=document.createElement("div");oe.appendChild(b("Badge")),oe.appendChild(f("Inline badge/label elements. Self-closing renders an empty coloured dot."));const fe=document.createElement("table");fe.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['variant="..."',"primary (default), secondary, success, danger, warning, info, light, dark"],["pill","Flag: rounded pill shape (.badge-pill)"],["outline","Flag: outlined style (.badge-outline)"],['size="small|large"',"Reduced or enlarged badge"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),fe.appendChild(n)}),oe.appendChild(fe),oe.appendChild(l("Basic badge",'[badge variant="success"]New[/badge]',null)),oe.appendChild(l("Pill outline badge",'[badge variant="danger" outline pill]Deprecated[/badge]',null)),z.appendChild(oe);const y=document.createElement("div");y.appendChild(b("Button")),y.appendChild(f("Renders a styled anchor as a Domma button. Use the Insert \u2192 Button toolbar item for a guided dialog."));const N=document.createElement("table");N.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['href="..."',"Link destination (required)"],['label="..."',"Button text (self-closing form)"],['variant="..."',"primary (default), secondary, success, danger, warning, info, outline, ghost, link, outline-*"],['size="sm|lg"',"Button size modifier"],['icon="..."',"Domma icon name before the label"],['icon-after="..."',"Domma icon name after the label"],['target="..."','Link target, e.g. "_blank"'],['class="..."',"Extra CSS classes"],['id="..."',"Element id"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),N.appendChild(n)}),y.appendChild(N),y.appendChild(l("Primary button",'[button href="/contact" variant="primary"]Get in touch[/button]',null)),y.appendChild(l("Self-closing with icon",'[button href="/download" variant="success" icon="download" size="sm" label="Download" /]',null)),y.appendChild(l("Opens in new tab",'[button href="https://example.com" variant="outline" target="_blank"]Visit site[/button]',null)),z.appendChild(y);const X=document.createElement("div");X.appendChild(b("Link (shortcode)")),X.appendChild(f("Renders a plain anchor with optional icon, target, and class. Use Insert \u2192 Link for a guided dialog. For simple inline links, standard Markdown [text](url) is fine."));const ie=document.createElement("table");ie.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['href="..."',"Link destination (required)"],['label="..."',"Link text (self-closing form)"],['target="..."','Link target, e.g. "_blank"'],['class="..."',"CSS classes on the <a>"],['icon="..."',"Domma icon name before the text"],['icon-after="..."',"Domma icon name after the text"],['id="..."',"Element id"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),ie.appendChild(n)}),X.appendChild(ie),X.appendChild(l("External link in new tab",'[link href="https://example.com" target="_blank" icon-after="external-link"]Visit site[/link]',null)),X.appendChild(l("Self-closing with icon",'[link href="/about" icon="arrow-right" label="About us" /]',null)),z.appendChild(X);const le=document.createElement("div");le.appendChild(b("Spacer")),le.appendChild(f("Self-closing shortcode that inserts a fixed-height blank gap."));const ce=document.createElement("table");ce.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['size="N"',"Height in px (default: 8)"],['class="..."',"Extra CSS class on the spacer div"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),ce.appendChild(n)}),le.appendChild(ce),le.appendChild(l("32px gap",'[spacer size="32" /]',null)),H.appendChild(le);const de=document.createElement("div");de.appendChild(b("Icon")),de.appendChild(f("Self-closing shortcode that renders any Domma icon inline."));const pe=document.createElement("table");pe.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['name="..."',"Domma icon name (required). Also accepted as src=."],['size="N"',"Width and height in px"],['color="..."',"CSS colour applied via style"],['class="..."',"Extra CSS classes"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),pe.appendChild(n)}),de.appendChild(pe),de.appendChild(l("Coloured icon",'[icon name="star" size="24" color="#f5a623" /]',null)),z.appendChild(de);const G=document.createElement("div");G.appendChild(b("Center")),G.appendChild(f("Wraps content in a centred div. Works with any content including cards, grids, and text.")),G.appendChild(l("Example","[center]Centred content here[/center]",'Accepts an optional class="..." attribute for extra styling.')),H.appendChild(G);const te=document.createElement("div");te.appendChild(b("Hero")),te.appendChild(f("Full-width hero sections - no plugin required. Uses Domma's built-in Hero CSS component."));const j=document.createElement("table");j.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['title="..."',"Heading text"],['tagline="..."',"Subtitle text"],['size="sm|lg|full"',"Height variant (default: normal)"],['variant="dark|primary|gradient-blue|gradient-purple|gradient-sunset|gradient-ocean"',"Colour / gradient preset"],['image="url"',"Background image URL (adds cover mode)"],['overlay="light|dark|darker|gradient|gradient-reverse"',"Image overlay style"],['align="center|left"',"Content alignment (default: center)"],['fullwidth="true"',"Break out of the page container to span full viewport width"],['bg="..."',"Background colour CSS value"],["twinkle","Flag: adds particle overlay (requires Effects plugin)"],['twinkle-count="N"',"Number of particles"],['twinkle-colour="..."',"Particle colour CSS value"],["blobs","Flag: adds ambient blob background"],['blobs-type="..."',"Blob animation type (default: float-blobs)"],['class="..."',"Extra CSS classes"],['id="..."',"Element id"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),j.appendChild(n)}),te.appendChild(j),te.appendChild(l("Basic hero",'[hero title="Welcome" tagline="Build something great"][/hero]',null)),te.appendChild(l("Gradient with body content",`[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]
 Some introductory **Markdown** content here.
-[/hero]`,null)),Q.appendChild(i("Background image with overlay",'[hero title="Our Story" image="/media/hero.jpg" overlay="dark" size="full"][/hero]',"Combine image + overlay for text legibility over photos.")),B.appendChild(Q);const H=document.createElement("div");H.appendChild(C("Interactive Components")),H.appendChild(f("Tabs, accordion, carousel, and countdown - no plugin required.")),H.appendChild(i("Tabs",`[tabs]
+[/hero]`,null)),te.appendChild(l("Background image with overlay",'[hero title="Our Story" image="/media/hero.jpg" overlay="dark" size="full"][/hero]',"Combine image + overlay for text legibility over photos.")),H.appendChild(te);const U=document.createElement("div");U.appendChild(b("Interactive Components")),U.appendChild(f("Tabs, accordion, carousel, and countdown - no plugin required.")),U.appendChild(l("Tabs",`[tabs]
 [tab title="First"]Content **A**[/tab]
 [tab title="Second"]Content **B**[/tab]
-[/tabs]`,'Add style="pills" for pill-style navigation.')),H.appendChild(i("Accordion",`[accordion]
+[/tabs]`,'Add style="pills" for pill-style navigation.')),U.appendChild(l("Accordion",`[accordion]
 [item title="Question 1"]Answer here.[/item]
 [item title="Question 2"]Answer here.[/item]
-[/accordion]`,'Add multiple="true" to allow several panels open at once.')),H.appendChild(i("Accordion - collection-bound",'[collection slug="faq" display="accordion" title-field="title" body-field="description" /]',"Renders collection entries as accordion items. Use Insert \u2192 Accordion for a guided dialog.")),H.appendChild(i("Carousel",`[carousel autoplay="true" interval="5000"]
+[/accordion]`,'Add multiple="true" to allow several panels open at once.')),U.appendChild(l("Accordion - collection-bound",'[collection slug="faq" display="accordion" title-field="title" body-field="description" /]',"Renders collection entries as accordion items. Use Insert \u2192 Accordion for a guided dialog.")),U.appendChild(l("Carousel",`[carousel autoplay="true" interval="5000"]
 [slide title="Slide 1"]Description[/slide]
 [slide image="/media/photo.jpg" title="Slide 2"]Caption[/slide]
-[/carousel]`,'animation="slide|fade|crossfade" (default slide). Use Insert \u2192 Carousel for a guided dialog.')),H.appendChild(i("Carousel - fade / crossfade",`[carousel animation="crossfade" animation-duration="800" animation-easing="ease-in-out" autoplay="true"]
+[/carousel]`,'animation="slide|fade|crossfade" (default slide). Use Insert \u2192 Carousel for a guided dialog.')),U.appendChild(l("Carousel - fade / crossfade",`[carousel animation="crossfade" animation-duration="800" animation-easing="ease-in-out" autoplay="true"]
 [slide image="/media/one.jpg" title="One"][/slide]
 [slide image="/media/two.jpg" title="Two"][/slide]
-[/carousel]`,"fade swaps opacity per slide; crossfade overlaps the two. animation-easing accepts any CSS timing function (ease, linear, cubic-bezier(...)).")),H.appendChild(i("Countdown (to date)",'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',null)),H.appendChild(i("Countdown (duration)",'[countdown duration="300" format="mm:ss" /]',"duration is in seconds. format options: mm:ss \xB7 HH:mm:ss \xB7 DD:HH:mm:ss")),N.appendChild(H);const ee=document.createElement("div");ee.appendChild(C("Timeline")),ee.appendChild(f("Renders a Domma Progression component with event items."));const Y=document.createElement("table");Y.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['layout="vertical|centred|horizontal"',"[timeline] - layout orientation (default: vertical)"],['theme="minimal|corporate|modern"',"[timeline] - visual theme (default: minimal)"],['mode="timeline|roadmap"',"[timeline] - display mode (default: timeline)"],['class="..."',"[timeline] - extra CSS classes"],['id="..."',"[timeline] - element id"],['title="..."',"[event] - event heading"],['date="..."',"[event] - display date string"],['status="planned|in-progress|completed|blocked"',"[event] - progress status"],['icon="..."',"[event] - Domma icon name"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),Y.appendChild(n)}),ee.appendChild(Y),ee.appendChild(i("Vertical timeline",`[timeline layout="vertical" theme="modern"]
+[/carousel]`,"fade swaps opacity per slide; crossfade overlaps the two. animation-easing accepts any CSS timing function (ease, linear, cubic-bezier(...)).")),U.appendChild(l("Countdown (to date)",'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',null)),U.appendChild(l("Countdown (duration)",'[countdown duration="300" format="mm:ss" /]',"duration is in seconds. format options: mm:ss \xB7 HH:mm:ss \xB7 DD:HH:mm:ss")),z.appendChild(U);const ne=document.createElement("div");ne.appendChild(b("Timeline")),ne.appendChild(f("Renders a Domma Progression component with event items."));const _=document.createElement("table");_.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['layout="vertical|centred|horizontal"',"[timeline] - layout orientation (default: vertical)"],['theme="minimal|corporate|modern"',"[timeline] - visual theme (default: minimal)"],['mode="timeline|roadmap"',"[timeline] - display mode (default: timeline)"],['class="..."',"[timeline] - extra CSS classes"],['id="..."',"[timeline] - element id"],['title="..."',"[event] - event heading"],['date="..."',"[event] - display date string"],['status="planned|in-progress|completed|blocked"',"[event] - progress status"],['icon="..."',"[event] - Domma icon name"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),_.appendChild(n)}),ne.appendChild(_),ne.appendChild(l("Vertical timeline",`[timeline layout="vertical" theme="modern"]
 [event title="Kickoff" date="Jan 2025" status="completed" icon="flag"]
 Project launched.
 [/event]
 [event title="Beta" date="Jun 2025" status="in-progress" icon="rocket"]
 In active development.
 [/event]
-[/timeline]`,null)),N.appendChild(ee);const me=document.createElement("div");me.appendChild(C("Embedding a Form"));const ve=document.createElement("table");ve.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['name="..."',"Form slug (required). Also accepted as slug=."],['class="..."',"Extra CSS classes on the wrapper div"],['id="..."',"id attribute on the wrapper div"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),ve.appendChild(n)}),me.appendChild(ve),me.appendChild(i("Basic",'[form name="contact" /]',"Forms are managed under Forms in the sidebar.")),me.appendChild(i("With wrapper styling",'[form name="newsletter" class="mt-4" id="newsletter-form" /]',null)),P.appendChild(me);const ue=document.createElement("div");ue.appendChild(C("Displaying a Collection"));const be=document.createElement("pre");be.style.cssText=z+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;",be.textContent='[collection slug="enquiries" display="table" /]',ue.appendChild(be);const ye=[["slug","Required. The collection slug."],["display","table (default), cards, or list."],["fields","Comma-separated field keys to show. Defaults to all."],["limit","Maximum number of entries to display."],["sort","Field key to sort by."],["order","asc or desc (default asc)."],["title-field","Field used as the card/list title (cards + list)."],["columns","Grid columns for cards display (2-4, default 3)."],["search","true/false - enable search in table mode (default true)."],["sortable","true/false - enable column sorting in table mode (default true)."],["exportable","true/false - show CSV export button in table mode (default false)."],["page-size","Rows per page in table mode (default 25)."],["empty","Text shown when there are no entries."],["cta","Action slug: enables per-entry CTA buttons."],["cta-label",'CTA button label (default: "Run").'],["cta-icon","CTA button icon name."],["cta-style","CTA button variant (default: primary)."],["cta-confirm","CTA confirmation prompt text."],["class","Extra CSS classes on the wrapper div."],["id","id attribute on the wrapper div."]],t=document.createElement("table");t.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",ye.forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),t.appendChild(n)}),ue.appendChild(t),ue.appendChild(f("Table display uses Domma Table - search, sort, pagination, column selector, and CSV export are all built in. Cards and lists are static.")),P.appendChild(ue);const l=document.createElement("div");l.appendChild(C("View - Pro")),l.appendChild(f("Renders a Collection with full filtering, pagination, and display options. Requires a Pro MongoDB collection."));const u=document.createElement("table");u.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["slug","Required. The collection slug."],["display","table (default), cards, or list."],["limit","Maximum number of entries to display."],["fields","Comma-separated field keys to show."],["title-field","Field used as the card/list title."],["columns","Grid columns for cards display (2-4, default 3)."],["empty","Text shown when there are no entries."],["class","Extra CSS classes on the wrapper div."],["id","id attribute on the wrapper div."]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),u.appendChild(n)}),l.appendChild(u),l.appendChild(i("Table display",'[view slug="products" display="table" limit="50" /]',null)),l.appendChild(i("Cards display",'[view slug="team" display="cards" columns="3" title-field="name" /]',null)),P.appendChild(l);const c=document.createElement("div");c.appendChild(C("CTA - Pro")),c.appendChild(f("Renders an action button that triggers a Pro Action against an entry. Requires the Pro Actions feature."));const h=document.createElement("table");h.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["action","Required. The action slug."],["entry","Required. The entry id to act on."],["style","Button variant (default: primary)."],["icon","Domma icon name for the button."],["size","Button size (sm, lg)."],["confirm","Confirmation prompt text before running."],["label","Self-closing only: button label text."]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),h.appendChild(n)}),c.appendChild(h),c.appendChild(i("Wrapping form",'[cta action="approve" entry="abc123" style="success" confirm="Approve this entry?"]Approve[/cta]',null)),c.appendChild(i("Self-closing",'[cta action="archive" entry="abc123" icon="archive" label="Archive" /]',null)),P.appendChild(c);const p=document.createElement("div");p.appendChild(C("Effects")),p.appendChild(f("Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin."));const k=[['[reveal animation="fade"]...[/reveal]',"Fade/slide/zoom on scroll"],["[breathe]...[/breathe]","Continuous gentle scale loop"],["[pulse]...[/pulse]","Repeating scale pulse"],["[shake]...[/shake]","One-shot shake"],['[scribe speed="50"]...[/scribe]',"Typewriter - simple mode (text typed letter by letter)"],['[scribe loop="true"][render]Text[/render][wait]1500[/wait][undo /][/scribe]',"Typewriter - script mode (sequenced render/wait/undo actions)"],["[scramble]...[/scramble]","Character-scramble reveal"],['[counter to="100" /]',"Animated number counter (self-closing)"],["[ripple]...[/ripple]","Click-triggered ripple"],['[twinkle count="50"]...[/twinkle]',"Particle/star overlay"],['[animate type="fade-in-up"]...[/animate]',"CSS-only animation (no plugin needed)"],['[ambient type="aurora"]...[/ambient]',"CSS-only animated background"],['[firework type="burst" colour="rainbow" /]',"CSS firework (self-closing)"],["[fireworks]...[/fireworks]","Fireworks display container"],['[celebrate theme="auto" /]',"Seasonal canvas celebration (auto-detects date)"],["[christmas /]","Christmas - snowflakes, trees, snowmen, sleigh"],["[halloween /]","Halloween - pumpkins, ghosts, bats, spiders"],["[st-patricks /]","St Patrick's Day - shamrocks, coins, rainbows, leprechaun"],["[valentines /]","Valentine's Day - hearts, roses"],["[guy-fawkes /]","Guy Fawkes - fireworks, sparkles"],["[st-andrews /]","St Andrew's Day - heather, thistles"],["[st-davids /]","St David's Day - daffodils, dragons"],["[st-georges /]","St George's Day - roses, flags"]],te=document.createElement("table");te.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",k.forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),te.appendChild(n)}),p.appendChild(te),p.appendChild(i("Scribe script - looping multi-phrase typewriter",`[scribe loop="true" loop-delay="2000" delete-speed="20"]
+[/timeline]`,null)),z.appendChild(ne);const me=document.createElement("div");me.appendChild(b("Embedding a Form"));const ve=document.createElement("table");ve.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['name="..."',"Form slug (required). Also accepted as slug=."],['class="..."',"Extra CSS classes on the wrapper div"],['id="..."',"id attribute on the wrapper div"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),ve.appendChild(n)}),me.appendChild(ve),me.appendChild(l("Basic",'[form name="contact" /]',"Forms are managed under Forms in the sidebar.")),me.appendChild(l("With wrapper styling",'[form name="newsletter" class="mt-4" id="newsletter-form" /]',null)),F.appendChild(me);const ue=document.createElement("div");ue.appendChild(b("Displaying a Collection"));const be=document.createElement("pre");be.style.cssText=A+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;",be.textContent='[collection slug="enquiries" display="table" /]',ue.appendChild(be);const Ce=[["slug","Required. The collection slug."],["display","table (default), cards, or list."],["fields","Comma-separated field keys to show. Defaults to all."],["limit","Maximum number of entries to display."],["sort","Field key to sort by."],["order","asc or desc (default asc)."],["title-field","Field used as the card/list title (cards + list)."],["columns","Grid columns for cards display (2-4, default 3)."],["search","true/false - enable search in table mode (default true)."],["sortable","true/false - enable column sorting in table mode (default true)."],["exportable","true/false - show CSV export button in table mode (default false)."],["page-size","Rows per page in table mode (default 25)."],["empty","Text shown when there are no entries."],["cta","Action slug: enables per-entry CTA buttons."],["cta-label",'CTA button label (default: "Run").'],["cta-icon","CTA button icon name."],["cta-style","CTA button variant (default: primary)."],["cta-confirm","CTA confirmation prompt text."],["class","Extra CSS classes on the wrapper div."],["id","id attribute on the wrapper div."]],t=document.createElement("table");t.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",Ce.forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),t.appendChild(n)}),ue.appendChild(t),ue.appendChild(f("Table display uses Domma Table - search, sort, pagination, column selector, and CSV export are all built in. Cards and lists are static.")),F.appendChild(ue);const d=document.createElement("div");d.appendChild(b("View - Pro")),d.appendChild(f("Renders a Collection with full filtering, pagination, and display options. Requires a Pro MongoDB collection."));const u=document.createElement("table");u.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["slug","Required. The collection slug."],["display","table (default), cards, or list."],["limit","Maximum number of entries to display."],["fields","Comma-separated field keys to show."],["title-field","Field used as the card/list title."],["columns","Grid columns for cards display (2-4, default 3)."],["empty","Text shown when there are no entries."],["class","Extra CSS classes on the wrapper div."],["id","id attribute on the wrapper div."]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),u.appendChild(n)}),d.appendChild(u),d.appendChild(l("Table display",'[view slug="products" display="table" limit="50" /]',null)),d.appendChild(l("Cards display",'[view slug="team" display="cards" columns="3" title-field="name" /]',null)),F.appendChild(d);const p=document.createElement("div");p.appendChild(b("CTA - Pro")),p.appendChild(f("Renders an action button that triggers a Pro Action against an entry. Requires the Pro Actions feature."));const h=document.createElement("table");h.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["action","Required. The action slug."],["entry","Required. The entry id to act on."],["style","Button variant (default: primary)."],["icon","Domma icon name for the button."],["size","Button size (sm, lg)."],["confirm","Confirmation prompt text before running."],["label","Self-closing only: button label text."]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),h.appendChild(n)}),p.appendChild(h),p.appendChild(l("Wrapping form",'[cta action="approve" entry="abc123" style="success" confirm="Approve this entry?"]Approve[/cta]',null)),p.appendChild(l("Self-closing",'[cta action="archive" entry="abc123" icon="archive" label="Archive" /]',null)),F.appendChild(p);const m=document.createElement("div");m.appendChild(b("Effects")),m.appendChild(f("Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin."));const k=[['[reveal animation="fade"]...[/reveal]',"Fade/slide/zoom on scroll"],["[breathe]...[/breathe]","Continuous gentle scale loop"],["[pulse]...[/pulse]","Repeating scale pulse"],["[shake]...[/shake]","One-shot shake"],['[scribe speed="50"]...[/scribe]',"Typewriter - simple mode (text typed letter by letter)"],['[scribe loop="true"][render]Text[/render][wait]1500[/wait][undo /][/scribe]',"Typewriter - script mode (sequenced render/wait/undo actions)"],["[scramble]...[/scramble]","Character-scramble reveal"],['[counter to="100" /]',"Animated number counter (self-closing)"],["[ripple]...[/ripple]","Click-triggered ripple"],['[twinkle count="50"]...[/twinkle]',"Particle/star overlay"],['[animate type="fade-in-up"]...[/animate]',"CSS-only animation (no plugin needed)"],['[ambient type="aurora"]...[/ambient]',"CSS-only animated background"],['[firework type="burst" colour="rainbow" /]',"CSS firework (self-closing)"],["[fireworks]...[/fireworks]","Fireworks display container"],['[celebrate theme="auto" /]',"Seasonal canvas celebration (auto-detects date)"],["[christmas /]","Christmas - snowflakes, trees, snowmen, sleigh"],["[halloween /]","Halloween - pumpkins, ghosts, bats, spiders"],["[st-patricks /]","St Patrick's Day - shamrocks, coins, rainbows, leprechaun"],["[valentines /]","Valentine's Day - hearts, roses"],["[guy-fawkes /]","Guy Fawkes - fireworks, sparkles"],["[st-andrews /]","St Andrew's Day - heather, thistles"],["[st-davids /]","St David's Day - daffodils, dragons"],["[st-georges /]","St George's Day - roses, flags"]],ae=document.createElement("table");ae.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",k.forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),ae.appendChild(n)}),m.appendChild(ae),m.appendChild(l("Scribe script - looping multi-phrase typewriter",`[scribe loop="true" loop-delay="2000" delete-speed="20"]
 [render]We build things that matter.[/render]
 [wait]1200[/wait]
 [undo all="true" /]
 [render]We design for humans.[/render]
 [wait]1200[/wait]
 [undo all="true" /]
-[/scribe]`,'Use [render]...[/render] to type text, [wait]Ms[/wait] to pause, and [undo /] to delete. loop="true" replays the sequence. Only [render], [wait], and [undo] shortcodes are parsed - plain text between actions is ignored.')),p.appendChild(i("Christmas",'[christmas intensity="medium" snowmen="off" trees="off" wreaths="off" northStars="off" sleigh="off" train="off" elf="off" robin="off" firework="off" /]',"intensity: light | medium | heavy. Count-based (off disables entirely): snowmen, trees, wreaths, northStars. Probability-based specials (off prevents spawning): sleigh, train, elf, robin, firework. Snowflakes always fall.")),p.appendChild(i("Halloween",'[halloween intensity="medium" gravestones="off" jackOLanterns="off" spiders="off" scarecrows="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): gravestones, jackOLanterns, spiders, scarecrows, twinklingStars. Particles: bats, ghosts, pumpkins (always on). Fixed decorations: haunted-house, cauldron (always present).")),p.appendChild(i("St Patrick's Day",'[st-patricks intensity="medium" pots="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): pots (pots of gold), twinklingStars. Particles: shamrocks, clover petals, gold coins, sparkles (always on). Fixed decorations: rainbow, harp, moon. Leprechaun appears randomly - more likely at higher intensity.")),p.appendChild(i("Valentine's Day",'[valentines intensity="medium" garlands="off" butterflies="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): garlands (heart garlands), butterflies. Particles: hearts, rose petals, sparkles, lips (always on). Fixed decorations: envelopes (always present). Cupid appears randomly - more likely at higher intensity.")),p.appendChild(i("Guy Fawkes Night",'[guy-fawkes intensity="medium" bonfires="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): bonfires. Particles: embers, fireworks, sparks, rockets, bursts, trails (always on). Fixed decorations: guy-effigy, catherine-wheel, roman-candle, sparkler-bundle, moon. Starts at 25% particle density and builds up gradually.")),p.appendChild(i("St Andrew's Day",'[st-andrews intensity="medium" thistles="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): thistles, twinklingStars. Particles: heather petals, saltire sparkles (always on). Fixed decorations: bagpiper, saltire-flag, tartan-pattern, highland-scene (always present). Bagpiper probability increases with intensity.")),p.appendChild(i("St David's Day",'[st-davids intensity="medium" daffodilFields="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): daffodilFields, twinklingStars. Particles: daffodil petals, spring sparkles (always on). Fixed decorations: welsh-dragon, harp, leek-bundle, flag (always present). Flying dragon appears randomly - more likely at higher intensity.")),p.appendChild(i("St George's Day",'[st-georges intensity="medium" roses="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): roses (English roses), twinklingStars. Particles: rose petals, Tudor roses, oak leaves, sparkles (always on). Fixed decorations: st-georges-cross, dragon, shield, castle (always present). Knight appears randomly - more likely at higher intensity.")),p.appendChild(f("Enable the Domma Effects plugin to activate these shortcodes on your site.")),J.appendChild(p);const se=document.createElement("div");se.appendChild(C("Tables")),se.appendChild(f("Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling."));const he=document.createElement("table");he.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['striped="true"',"Alternate row background (.table-striped)"],['bordered="true"',"Borders on all cells (.table-bordered)"],['compact="true"',"Reduced cell padding (.table-compact)"],['caption="..."',"Caption text above the table"],['class="..."',"Extra CSS classes appended to .table"],['id="..."',"id attribute on the <table> element"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),he.appendChild(n)}),se.appendChild(he),se.appendChild(i("Striped + bordered table",`[table striped="true" bordered="true" caption="Product Pricing"]
+[/scribe]`,'Use [render]...[/render] to type text, [wait]Ms[/wait] to pause, and [undo /] to delete. loop="true" replays the sequence. Only [render], [wait], and [undo] shortcodes are parsed - plain text between actions is ignored.')),m.appendChild(l("Christmas",'[christmas intensity="medium" snowmen="off" trees="off" wreaths="off" northStars="off" sleigh="off" train="off" elf="off" robin="off" firework="off" /]',"intensity: light | medium | heavy. Count-based (off disables entirely): snowmen, trees, wreaths, northStars. Probability-based specials (off prevents spawning): sleigh, train, elf, robin, firework. Snowflakes always fall.")),m.appendChild(l("Halloween",'[halloween intensity="medium" gravestones="off" jackOLanterns="off" spiders="off" scarecrows="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): gravestones, jackOLanterns, spiders, scarecrows, twinklingStars. Particles: bats, ghosts, pumpkins (always on). Fixed decorations: haunted-house, cauldron (always present).")),m.appendChild(l("St Patrick's Day",'[st-patricks intensity="medium" pots="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): pots (pots of gold), twinklingStars. Particles: shamrocks, clover petals, gold coins, sparkles (always on). Fixed decorations: rainbow, harp, moon. Leprechaun appears randomly - more likely at higher intensity.")),m.appendChild(l("Valentine's Day",'[valentines intensity="medium" garlands="off" butterflies="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): garlands (heart garlands), butterflies. Particles: hearts, rose petals, sparkles, lips (always on). Fixed decorations: envelopes (always present). Cupid appears randomly - more likely at higher intensity.")),m.appendChild(l("Guy Fawkes Night",'[guy-fawkes intensity="medium" bonfires="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): bonfires. Particles: embers, fireworks, sparks, rockets, bursts, trails (always on). Fixed decorations: guy-effigy, catherine-wheel, roman-candle, sparkler-bundle, moon. Starts at 25% particle density and builds up gradually.")),m.appendChild(l("St Andrew's Day",'[st-andrews intensity="medium" thistles="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): thistles, twinklingStars. Particles: heather petals, saltire sparkles (always on). Fixed decorations: bagpiper, saltire-flag, tartan-pattern, highland-scene (always present). Bagpiper probability increases with intensity.")),m.appendChild(l("St David's Day",'[st-davids intensity="medium" daffodilFields="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): daffodilFields, twinklingStars. Particles: daffodil petals, spring sparkles (always on). Fixed decorations: welsh-dragon, harp, leek-bundle, flag (always present). Flying dragon appears randomly - more likely at higher intensity.")),m.appendChild(l("St George's Day",'[st-georges intensity="medium" roses="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): roses (English roses), twinklingStars. Particles: rose petals, Tudor roses, oak leaves, sparkles (always on). Fixed decorations: st-georges-cross, dragon, shield, castle (always present). Knight appears randomly - more likely at higher intensity.")),m.appendChild(f("Enable the Domma Effects plugin to activate these shortcodes on your site.")),Z.appendChild(m);const se=document.createElement("div");se.appendChild(b("Tables")),se.appendChild(f("Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling."));const he=document.createElement("table");he.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['striped="true"',"Alternate row background (.table-striped)"],['bordered="true"',"Borders on all cells (.table-bordered)"],['compact="true"',"Reduced cell padding (.table-compact)"],['caption="..."',"Caption text above the table"],['class="..."',"Extra CSS classes appended to .table"],['id="..."',"id attribute on the <table> element"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),he.appendChild(n)}),se.appendChild(he),se.appendChild(l("Striped + bordered table",`[table striped="true" bordered="true" caption="Product Pricing"]
 | Product | Price |
 | ------- | ----: |
 | Widget  | $9.99 |
 | Gadget  | $14.99 |
-[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),N.appendChild(se);const T=document.createElement("div");T.appendChild(C("Slideover")),T.appendChild(f("A trigger button that opens a slide-in panel with Markdown content. No plugin required."));const re=document.createElement("table");re.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['title="..."',"Panel header text"],['trigger="..."','Button label (default: "Open")'],['size="sm|md|lg"',"Panel width (default: md)"],['position="right|left"',"Slide direction (default: right)"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),re.appendChild(n)}),T.appendChild(re),T.appendChild(i("Example",`[slideover title="More Info" trigger="Read more" size="md"]
+[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),z.appendChild(se);const T=document.createElement("div");T.appendChild(b("Slideover")),T.appendChild(f("A trigger button that opens a slide-in panel with Markdown content. No plugin required."));const re=document.createElement("table");re.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['title="..."',"Panel header text"],['trigger="..."','Button label (default: "Open")'],['size="sm|md|lg"',"Panel width (default: md)"],['position="right|left"',"Slide direction (default: right)"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),re.appendChild(n)}),T.appendChild(re),T.appendChild(l("Example",`[slideover title="More Info" trigger="Read more" size="md"]
 ## Details
 Markdown content here.
-[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),N.appendChild(T);const K=document.createElement("div");K.appendChild(C("DConfig - Declarative Behaviour")),K.appendChild(f("Define click handlers and class toggles without writing JavaScript. Use the DConfig section above or embed inline with [dconfig]...[/dconfig] in the content body. Inline shortcodes win on selector conflict.")),K.appendChild(i("Toggle a class on click",'{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }','Selector keys use standard CSS selectors. "target" is optional - defaults to the element itself.')),K.appendChild(i("Inline shortcode syntax",`[dconfig]
+[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),z.appendChild(T);const Q=document.createElement("div");Q.appendChild(b("DConfig - Declarative Behaviour")),Q.appendChild(f("Define click handlers and class toggles without writing JavaScript. Use the DConfig section above or embed inline with [dconfig]...[/dconfig] in the content body. Inline shortcodes win on selector conflict.")),Q.appendChild(l("Toggle a class on click",'{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }','Selector keys use standard CSS selectors. "target" is optional - defaults to the element itself.')),Q.appendChild(l("Inline shortcode syntax",`[dconfig]
 { "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }
-[/dconfig]`,null)),J.appendChild(K);const G=document.createElement("div");G.appendChild(C("CSS Editor")),G.appendChild(f("The toolbar's </> button (left of the Split View icon) swaps the left pane between Markdown and Custom CSS. Edits are saved together with the page - one Save, one toast."));const we=document.createElement("table");we.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["</> button","Toggle between Markdown editor and Custom CSS editor"],["Split / Write / Preview","Standard view mode buttons to the right of </>"],["Save","Saves both page content and CSS in a single operation"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),we.appendChild(n)}),G.appendChild(we),J.appendChild(G);const Ce=document.createElement("div");Ce.appendChild(C("Colour Picker")),Ce.appendChild(f("Insert \u2192 Colour Picker opens a centred colour picker. Pick a colour, then use Copy to copy the hex code to the clipboard or Insert to drop it at the cursor. Click outside the panel to dismiss.")),J.appendChild(Ce);const Ee=document.createElement("div");Ee.appendChild(C("Keyboard Shortcuts"));const De=document.createElement("table");De.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["Ctrl + B","Bold selected text"],["Ctrl + I","Italic selected text"],["Ctrl + K","Insert link dialog"],["Tab","Indent 2 spaces at cursor"],["Shift + Tab","Dedent 2 spaces on current line"],["Ctrl + X","Cut current line (no selection) or cut selection"],["Ctrl + C","Copy current line (no selection) or copy selection"],["Ctrl + V","Paste from clipboard"],["Ctrl + Z","Undo"],["Ctrl + Y","Redo"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;white-space:nowrap;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),De.appendChild(n)}),Ee.appendChild(De),M.appendChild(Ee);const Te=document.createElement("div");Te.appendChild(C("Tips"));const Ae=document.createElement("table");Ae.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['class="text-center"',"Centre text and inline elements on any shortcode"],['class="mx-auto"',"Centre a block element horizontally"],["[center]...[/center]","Shorthand wrapper for centred content"]].forEach(([r,d])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(r));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=d,n.appendChild(a),n.appendChild(o),Ae.appendChild(n)}),Te.appendChild(Ae),Te.appendChild(f("Most shortcodes accept a class attribute for custom styling.")),M.appendChild(Te),e.setContent(Z),e.open(),E.tabs(ne),I.scan(Z)}function je(e,z){const v=e.find("#history-tab").get(0),s=e.find("#version-list").get(0),C=e.find("#version-compare").get(0),Z=e.find("#version-compare-old").get(0),ne=e.find("#version-compare-new").get(0),ae=e.find("#version-compare-label").get(0),m=e.find("#version-compare-back-btn").get(0),O=e.find("#version-restore-btn").get(0),M=e.find("#history-save-named-btn").get(0),B=e.find("#history-delete-selected-btn").get(0);let N=!1,P=null;function J(){s.style.display="",C.style.display="none",P=null}function _(){s.style.display="none",C.style.display=""}async function F(){s.textContent="";const g=document.createElement("p");g.style.color="var(--dm-text-muted)",g.textContent="Loading\u2026",s.appendChild(g);let y;try{y=(await L.versions.list(z)).versions||[]}catch(b){s.textContent="";const A=document.createElement("p");A.style.color="var(--dm-danger,#e55)",A.textContent="Failed to load versions: "+b.message,s.appendChild(A);return}if(s.textContent="",B.style.display="none",!y.length){const b=document.createElement("p");b.style.color="var(--dm-text-muted)",b.textContent="No versions saved yet. Versions are created automatically on each save.",s.appendChild(b);return}const U=document.createElement("table");U.style.cssText="width:100%;border-collapse:collapse;font-size:.875rem;";const x=document.createElement("thead"),f=document.createElement("tr"),i=document.createElement("th");i.style.cssText="padding:.5rem .75rem;width:2rem;border-bottom:1px solid var(--dm-border);";const w=document.createElement("input");w.type="checkbox",w.setAttribute("aria-label","Select all versions"),i.appendChild(w),f.appendChild(i),["Date","Author","Type","Label","Actions"].forEach(b=>{const A=document.createElement("th");A.style.cssText="text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border);font-size:.8rem;color:var(--dm-text-muted);",A.textContent=b,f.appendChild(A)}),x.appendChild(f),U.appendChild(x);const q=[];function oe(){const b=q.some(j=>j.checked),A=q.length>0&&q.every(j=>j.checked);B.style.display=b?"":"none",w.checked=A,w.indeterminate=b&&!A}w.addEventListener("change",()=>{q.forEach(b=>{b.checked=w.checked}),oe()});const fe=document.createElement("tbody");y.forEach(b=>{const A=document.createElement("tr");A.style.borderBottom="1px solid var(--dm-border)";const j=document.createElement("td");j.style.padding=".5rem .75rem";const ie=document.createElement("input");ie.type="checkbox",ie.value=b.filename,ie.addEventListener("change",oe),j.appendChild(ie),q.push(ie);const le=document.createElement("td");le.style.padding=".5rem .75rem",le.textContent=D(b.createdAt).format("D MMM YYYY, HH:mm");const ce=document.createElement("td");ce.style.padding=".5rem .75rem",ce.textContent=b.author||"-";const de=document.createElement("td");de.style.padding=".5rem .75rem";const pe=document.createElement("span");pe.className="badge badge-"+(b.type==="manual"?"primary":"secondary"),pe.style.cssText="font-size:.75rem;padding:.2rem .5rem;border-radius:4px;",pe.textContent=b.type,de.appendChild(pe);const V=document.createElement("td");V.style.cssText="padding:.5rem .75rem;color:var(--dm-text-muted);",V.textContent=b.label||"-";const Q=document.createElement("td");Q.style.padding=".5rem .75rem";const W=document.createElement("button");W.className="btn btn-ghost btn-xs",W.style.marginRight=".4rem",W.title="Compare",W.innerHTML='<span data-icon="columns"></span>',W.addEventListener("click",async()=>{try{const ee=await L.versions.get(z,b.filename);Z.textContent=ee.content,ne.textContent=e.find("#markdown-editor").get(0).value,ae.textContent=D(b.createdAt).format("D MMM YYYY, HH:mm")+(b.label?` - ${b.label}`:""),P=b.filename,_()}catch(ee){E.toast("Failed to load version: "+ee.message,{type:"error"})}});const H=document.createElement("button");H.className="btn btn-ghost btn-xs",H.style.color="var(--dm-danger,#e55)",H.title="Delete",H.innerHTML='<span data-icon="trash"></span>',H.addEventListener("click",async()=>{if(await E.confirm("Delete this version? This cannot be undone."))try{await L.versions.delete(z,b.filename),E.toast("Version deleted.",{type:"success"}),await F()}catch(ee){E.toast("Failed to delete: "+ee.message,{type:"error"})}}),Q.appendChild(W),Q.appendChild(H),A.appendChild(j),A.appendChild(le),A.appendChild(ce),A.appendChild(de),A.appendChild(V),A.appendChild(Q),fe.appendChild(A)}),U.appendChild(fe),s.appendChild(U),I.scan(s)}v.addEventListener("click",async()=>{N||(N=!0,await F())}),m.addEventListener("click",()=>{J()}),O.addEventListener("click",async()=>{if(!(!P||!await E.confirm("Restore this version? The current page content will be overwritten (a pre-restore snapshot will be saved automatically).")))try{await L.versions.restore(z,P),E.toast("Page restored. Reloading editor\u2026",{type:"success"}),R.navigate("/pages"),setTimeout(()=>R.navigate(`/pages/edit${z}`),300)}catch(g){E.toast("Restore failed: "+g.message,{type:"error"})}}),B.addEventListener("click",async()=>{const g=[...s.querySelectorAll("tbody input[type=checkbox]:checked")].map(y=>y.value);if(!(!g.length||!await E.confirm(`Delete ${g.length} version${g.length>1?"s":""}? This cannot be undone.`)))try{await L.versions.bulkDelete(z,g),E.toast(`${g.length} version${g.length>1?"s":""} deleted.`,{type:"success"}),await F()}catch(y){E.toast("Delete failed: "+y.message,{type:"error"})}}),M.addEventListener("click",()=>{const g=E.slideover({title:"Save Named Version",size:"sm",position:"right"}),y=document.createElement("div");y.style.padding="1rem";const U=document.createElement("label");U.className="form-label",U.textContent="Version Label";const x=document.createElement("input");x.type="text",x.className="form-input",x.placeholder="e.g. Initial design, Before restructure",x.style.marginBottom=".75rem";const f=document.createElement("button");f.className="btn btn-primary",f.textContent="Save Version",f.addEventListener("click",async()=>{const i=x.value.trim();try{await L.versions.create(z,i||null),E.toast("Named version saved.",{type:"success"}),g.close(),N=!1,v.classList.contains("active")&&(N=!0,await F())}catch(w){E.toast("Failed to save version: "+w.message,{type:"error"})}}),y.appendChild(U),y.appendChild(x),y.appendChild(f),g.element.appendChild(y),g.open(),setTimeout(()=>x.focus(),100)})}function Je(e){try{return D(e).format("D MMM YYYY, HH:mm")}catch{return new Date(e).toLocaleString()}}async function Ke(e){const z=E.slideover({title:"Share preview link",size:"md",position:"right"}),v=document.createElement("div");v.style.padding="1rem";const s=document.createElement("p");s.className="form-hint",s.style.marginTop="0",s.textContent="Anyone with the link can view this page even while it is unpublished, without signing in. The link works for this page only, expires on its own, and can be revoked at any time.",v.appendChild(s);const C=document.createElement("label");C.className="form-label",C.textContent="Expires after";const Z=document.createElement("select");Z.className="form-select",[["1h","1 hour"],["24h","24 hours"],["7d","7 days"],["30d","30 days"]].forEach(([_,F])=>{const g=document.createElement("option");g.value=_,g.textContent=F,_==="7d"&&(g.selected=!0),Z.appendChild(g)});const ne=document.createElement("label");ne.className="form-label",ne.style.marginTop=".75rem",ne.textContent="Note (optional)";const ae=document.createElement("input");ae.type="text",ae.className="form-input",ae.placeholder="e.g. For the client sign-off";const m=document.createElement("button");m.className="btn btn-primary",m.style.marginTop=".75rem",m.textContent="Create link";const O=document.createElement("div");O.style.marginTop=".75rem",O.style.display="none";const M=document.createElement("input");M.type="text",M.className="form-input",M.readOnly=!0,M.style.marginBottom=".4rem";const B=document.createElement("button");B.className="btn btn-secondary btn-sm",B.textContent="Copy link",B.addEventListener("click",async()=>{try{await navigator.clipboard.writeText(M.value),E.toast("Link copied to clipboard.",{type:"success"})}catch{M.select(),E.toast("Press Ctrl+C to copy the selected link.",{type:"info"})}}),O.appendChild(M),O.appendChild(B),v.appendChild(C),v.appendChild(Z),v.appendChild(ne),v.appendChild(ae),v.appendChild(m),v.appendChild(O);const N=document.createElement("h4");N.style.cssText="margin:1.5rem 0 .5rem;font-size:.9rem;",N.textContent="Active links",v.appendChild(N);const P=document.createElement("div");v.appendChild(P);const J=async()=>{P.textContent="";let _=[];try{_=await L.pages.previewLinks.list(e)}catch(g){const y=document.createElement("p");y.className="form-hint",y.textContent="Could not load existing links: "+(g.message||"unknown error"),P.appendChild(y);return}const F=_.filter(g=>!g.revokedAt&&!g.expired);if(!F.length){const g=document.createElement("p");g.className="form-hint",g.textContent="No active links for this page.",P.appendChild(g);return}F.forEach(g=>{const y=document.createElement("div");y.style.cssText="display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--dm-border-light);";const U=document.createElement("div");U.style.cssText="flex:1 1 auto;min-width:0;font-size:.82rem;";const x=document.createElement("div");x.style.fontWeight="600",x.textContent=g.label||"Untitled link";const f=document.createElement("div");f.style.opacity=".7";const i=g.useCount===1?"1 view":`${g.useCount||0} views`;f.textContent=`Expires ${Je(g.expiresAt)} - ${i}`,U.appendChild(x),U.appendChild(f);const w=document.createElement("button");w.className="btn btn-ghost btn-sm",w.textContent="Revoke",w.addEventListener("click",async()=>{if(await E.confirm("Revoke this link? Anyone holding it loses access immediately."))try{await L.pages.previewLinks.revoke(g.id),E.toast("Link revoked.",{type:"success"}),await J()}catch(oe){E.toast("Could not revoke: "+(oe.message||"unknown error"),{type:"error"})}}),y.appendChild(U),y.appendChild(w),P.appendChild(y)})};m.addEventListener("click",async()=>{m.disabled=!0,m.textContent="Creating\u2026";try{const _=await L.pages.previewLinks.create(e,Z.value,ae.value.trim());M.value=_.url,O.style.display="",ae.value="",E.toast("Share link created.",{type:"success"}),await J(),M.select()}catch(_){E.toast("Could not create link: "+(_.message||"unknown error"),{type:"error"})}finally{m.disabled=!1,m.textContent="Create link"}}),z.element.appendChild(v),z.open(),await J()}let ge=!1,Le=null,Fe=!1;function Xe(e){return e.split(`
-`).map(z=>z.trimEnd()).join(`
+[/dconfig]`,null)),Z.appendChild(Q);const J=document.createElement("div");J.appendChild(b("CSS Editor")),J.appendChild(f("The toolbar's </> button (left of the Split View icon) swaps the left pane between Markdown and Custom CSS. Edits are saved together with the page - one Save, one toast."));const we=document.createElement("table");we.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["</> button","Toggle between Markdown editor and Custom CSS editor"],["Split / Write / Preview","Standard view mode buttons to the right of </>"],["Save","Saves both page content and CSS in a single operation"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),we.appendChild(n)}),J.appendChild(we),Z.appendChild(J);const ye=document.createElement("div");ye.appendChild(b("Colour Picker")),ye.appendChild(f("Insert \u2192 Colour Picker opens a centred colour picker. Pick a colour, then use Copy to copy the hex code to the clipboard or Insert to drop it at the cursor. Click outside the panel to dismiss.")),Z.appendChild(ye);const Ee=document.createElement("div");Ee.appendChild(b("Keyboard Shortcuts"));const Ae=document.createElement("table");Ae.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["Ctrl + B","Bold selected text"],["Ctrl + I","Italic selected text"],["Ctrl + K","Insert link dialog"],["Tab","Indent 2 spaces at cursor"],["Shift + Tab","Dedent 2 spaces on current line"],["Ctrl + X","Cut current line (no selection) or cut selection"],["Ctrl + C","Copy current line (no selection) or copy selection"],["Ctrl + V","Paste from clipboard"],["Ctrl + Z","Undo"],["Ctrl + Y","Redo"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;white-space:nowrap;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),Ae.appendChild(n)}),Ee.appendChild(Ae),B.appendChild(Ee);const Te=document.createElement("div");Te.appendChild(b("Tips"));const De=document.createElement("table");De.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['class="text-center"',"Centre text and inline elements on any shortcode"],['class="mx-auto"',"Centre a block element horizontally"],["[center]...[/center]","Shorthand wrapper for centred content"]].forEach(([c,r])=>{const n=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(s(c));const o=document.createElement("td");o.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",o.textContent=r,n.appendChild(a),n.appendChild(o),De.appendChild(n)}),Te.appendChild(De),Te.appendChild(f("Most shortcodes accept a class attribute for custom styling.")),B.appendChild(Te),e.setContent(V),e.open(),E.tabs(W),I.scan(V)}function _e(e,A){const v=e.find("#history-tab").get(0),s=e.find("#version-list").get(0),b=e.find("#version-compare").get(0),V=e.find("#version-compare-old").get(0),W=e.find("#version-compare-new").get(0),Y=e.find("#version-compare-label").get(0),i=e.find("#version-compare-back-btn").get(0),P=e.find("#version-restore-btn").get(0),B=e.find("#history-save-named-btn").get(0),H=e.find("#history-delete-selected-btn").get(0);let z=!1,F=null;function Z(){s.style.display="",b.style.display="none",F=null}function K(){s.style.display="none",b.style.display=""}async function M(){s.textContent="";const g=document.createElement("p");g.style.color="var(--dm-text-muted)",g.textContent="Loading\u2026",s.appendChild(g);let C;try{C=(await L.versions.list(A)).versions||[]}catch(y){s.textContent="";const N=document.createElement("p");N.style.color="var(--dm-danger,#e55)",N.textContent="Failed to load versions: "+y.message,s.appendChild(N);return}if(s.textContent="",H.style.display="none",!C.length){const y=document.createElement("p");y.style.color="var(--dm-text-muted)",y.textContent="No versions saved yet. Versions are created automatically on each save.",s.appendChild(y);return}const q=document.createElement("table");q.style.cssText="width:100%;border-collapse:collapse;font-size:.875rem;";const x=document.createElement("thead"),f=document.createElement("tr"),l=document.createElement("th");l.style.cssText="padding:.5rem .75rem;width:2rem;border-bottom:1px solid var(--dm-border);";const w=document.createElement("input");w.type="checkbox",w.setAttribute("aria-label","Select all versions"),l.appendChild(w),f.appendChild(l),["Date","Author","Type","Label","Actions"].forEach(y=>{const N=document.createElement("th");N.style.cssText="text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border);font-size:.8rem;color:var(--dm-text-muted);",N.textContent=y,f.appendChild(N)}),x.appendChild(f),q.appendChild(x);const O=[];function oe(){const y=O.some(X=>X.checked),N=O.length>0&&O.every(X=>X.checked);H.style.display=y?"":"none",w.checked=N,w.indeterminate=y&&!N}w.addEventListener("change",()=>{O.forEach(y=>{y.checked=w.checked}),oe()});const fe=document.createElement("tbody");C.forEach(y=>{const N=document.createElement("tr");N.style.borderBottom="1px solid var(--dm-border)";const X=document.createElement("td");X.style.padding=".5rem .75rem";const ie=document.createElement("input");ie.type="checkbox",ie.value=y.filename,ie.addEventListener("change",oe),X.appendChild(ie),O.push(ie);const le=document.createElement("td");le.style.padding=".5rem .75rem",le.textContent=D(y.createdAt).format("D MMM YYYY, HH:mm");const ce=document.createElement("td");ce.style.padding=".5rem .75rem",ce.textContent=y.author||"-";const de=document.createElement("td");de.style.padding=".5rem .75rem";const pe=document.createElement("span");pe.className="badge badge-"+(y.type==="manual"?"primary":"secondary"),pe.style.cssText="font-size:.75rem;padding:.2rem .5rem;border-radius:4px;",pe.textContent=y.type,de.appendChild(pe);const G=document.createElement("td");G.style.cssText="padding:.5rem .75rem;color:var(--dm-text-muted);",G.textContent=y.label||"-";const te=document.createElement("td");te.style.padding=".5rem .75rem";const j=document.createElement("button");j.className="btn btn-ghost btn-xs",j.style.marginRight=".4rem",j.title="Compare",j.innerHTML='<span data-icon="columns"></span>',j.addEventListener("click",async()=>{try{const ne=await L.versions.get(A,y.filename);V.textContent=ne.content,W.textContent=e.find("#markdown-editor").get(0).value,Y.textContent=D(y.createdAt).format("D MMM YYYY, HH:mm")+(y.label?` - ${y.label}`:""),F=y.filename,K()}catch(ne){E.toast("Failed to load version: "+ne.message,{type:"error"})}});const U=document.createElement("button");U.className="btn btn-ghost btn-xs",U.style.color="var(--dm-danger,#e55)",U.title="Delete",U.innerHTML='<span data-icon="trash"></span>',U.addEventListener("click",async()=>{if(await E.confirm("Delete this version? This cannot be undone."))try{await L.versions.delete(A,y.filename),E.toast("Version deleted.",{type:"success"}),await M()}catch(ne){E.toast("Failed to delete: "+ne.message,{type:"error"})}}),te.appendChild(j),te.appendChild(U),N.appendChild(X),N.appendChild(le),N.appendChild(ce),N.appendChild(de),N.appendChild(G),N.appendChild(te),fe.appendChild(N)}),q.appendChild(fe),s.appendChild(q),I.scan(s)}v.addEventListener("click",async()=>{z||(z=!0,await M())}),i.addEventListener("click",()=>{Z()}),P.addEventListener("click",async()=>{if(!(!F||!await E.confirm("Restore this version? The current page content will be overwritten (a pre-restore snapshot will be saved automatically).")))try{await L.versions.restore(A,F),E.toast("Page restored. Reloading editor\u2026",{type:"success"}),R.navigate("/pages"),setTimeout(()=>R.navigate(`/pages/edit${A}`),300)}catch(g){E.toast("Restore failed: "+g.message,{type:"error"})}}),H.addEventListener("click",async()=>{const g=[...s.querySelectorAll("tbody input[type=checkbox]:checked")].map(C=>C.value);if(!(!g.length||!await E.confirm(`Delete ${g.length} version${g.length>1?"s":""}? This cannot be undone.`)))try{await L.versions.bulkDelete(A,g),E.toast(`${g.length} version${g.length>1?"s":""} deleted.`,{type:"success"}),await M()}catch(C){E.toast("Delete failed: "+C.message,{type:"error"})}}),B.addEventListener("click",()=>{const g=E.slideover({title:"Save Named Version",size:"sm",position:"right"}),C=document.createElement("div");C.style.padding="1rem";const q=document.createElement("label");q.className="form-label",q.textContent="Version Label";const x=document.createElement("input");x.type="text",x.className="form-input",x.placeholder="e.g. Initial design, Before restructure",x.style.marginBottom=".75rem";const f=document.createElement("button");f.className="btn btn-primary",f.textContent="Save Version",f.addEventListener("click",async()=>{const l=x.value.trim();try{await L.versions.create(A,l||null),E.toast("Named version saved.",{type:"success"}),g.close(),z=!1,v.classList.contains("active")&&(z=!0,await M())}catch(w){E.toast("Failed to save version: "+w.message,{type:"error"})}}),C.appendChild(q),C.appendChild(x),C.appendChild(f),g.element.appendChild(C),g.open(),setTimeout(()=>x.focus(),100)})}function Je(e){try{return D(e).format("D MMM YYYY, HH:mm")}catch{return new Date(e).toLocaleString()}}async function Ke(e){const A=E.slideover({title:"Share preview link",size:"md",position:"right"}),v=document.createElement("div");v.style.padding="1rem";const s=document.createElement("p");s.className="form-hint",s.style.marginTop="0",s.textContent="Anyone with the link can view this page even while it is unpublished, without signing in. The link works for this page only, expires on its own, and can be revoked at any time.",v.appendChild(s);const b=document.createElement("label");b.className="form-label",b.textContent="Expires after";const V=document.createElement("select");V.className="form-select",[["1h","1 hour"],["24h","24 hours"],["7d","7 days"],["30d","30 days"]].forEach(([K,M])=>{const g=document.createElement("option");g.value=K,g.textContent=M,K==="7d"&&(g.selected=!0),V.appendChild(g)});const W=document.createElement("label");W.className="form-label",W.style.marginTop=".75rem",W.textContent="Note (optional)";const Y=document.createElement("input");Y.type="text",Y.className="form-input",Y.placeholder="e.g. For the client sign-off";const i=document.createElement("button");i.className="btn btn-primary",i.style.marginTop=".75rem",i.textContent="Create link";const P=document.createElement("div");P.style.marginTop=".75rem",P.style.display="none";const B=document.createElement("input");B.type="text",B.className="form-input",B.readOnly=!0,B.style.marginBottom=".4rem";const H=document.createElement("button");H.className="btn btn-secondary btn-sm",H.textContent="Copy link",H.addEventListener("click",async()=>{try{await navigator.clipboard.writeText(B.value),E.toast("Link copied to clipboard.",{type:"success"})}catch{B.select(),E.toast("Press Ctrl+C to copy the selected link.",{type:"info"})}}),P.appendChild(B),P.appendChild(H),v.appendChild(b),v.appendChild(V),v.appendChild(W),v.appendChild(Y),v.appendChild(i),v.appendChild(P);const z=document.createElement("h4");z.style.cssText="margin:1.5rem 0 .5rem;font-size:.9rem;",z.textContent="Active links",v.appendChild(z);const F=document.createElement("div");v.appendChild(F);const Z=async()=>{F.textContent="";let K=[];try{K=await L.pages.previewLinks.list(e)}catch(g){const C=document.createElement("p");C.className="form-hint",C.textContent="Could not load existing links: "+(g.message||"unknown error"),F.appendChild(C);return}const M=K.filter(g=>!g.revokedAt&&!g.expired);if(!M.length){const g=document.createElement("p");g.className="form-hint",g.textContent="No active links for this page.",F.appendChild(g);return}M.forEach(g=>{const C=document.createElement("div");C.style.cssText="display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--dm-border-light);";const q=document.createElement("div");q.style.cssText="flex:1 1 auto;min-width:0;font-size:.82rem;";const x=document.createElement("div");x.style.fontWeight="600",x.textContent=g.label||"Untitled link";const f=document.createElement("div");f.style.opacity=".7";const l=g.useCount===1?"1 view":`${g.useCount||0} views`;f.textContent=`Expires ${Je(g.expiresAt)} - ${l}`,q.appendChild(x),q.appendChild(f);const w=document.createElement("button");w.className="btn btn-ghost btn-sm",w.textContent="Revoke",w.addEventListener("click",async()=>{if(await E.confirm("Revoke this link? Anyone holding it loses access immediately."))try{await L.pages.previewLinks.revoke(g.id),E.toast("Link revoked.",{type:"success"}),await Z()}catch(oe){E.toast("Could not revoke: "+(oe.message||"unknown error"),{type:"error"})}}),C.appendChild(q),C.appendChild(w),F.appendChild(C)})};i.addEventListener("click",async()=>{i.disabled=!0,i.textContent="Creating\u2026";try{const K=await L.pages.previewLinks.create(e,V.value,Y.value.trim());B.value=K.url,P.style.display="",Y.value="",E.toast("Share link created.",{type:"success"}),await Z(),B.select()}catch(K){E.toast("Could not create link: "+(K.message||"unknown error"),{type:"error"})}finally{i.disabled=!1,i.textContent="Create link"}}),A.element.appendChild(v),A.open(),await Z()}let ge=!1,Le=null,Fe=!1;function Xe(e){return e.split(`
+`).map(A=>A.trimEnd()).join(`
 `).replace(/\n{3,}/g,`
 
-`)}const Me="editor_prefs";function Ne(){return S.get(Me)||{viewMode:"split",fullscreen:!1}}function ze(e,z){const v=Ne();v[e]=z,S.set(Me,v)}export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(e){const z=window.location.hash.match(/#\/pages\/edit(\/.*)/),v=z?z[1]:null,s=!!v,C=E.loader(e.get(0),{type:"dots"}),Z=[L.layouts.get().catch(()=>({})),L.settings.get().catch(()=>({}))];s&&(Z.push(L.pages.get(v).catch(()=>null)),Z.push(L.pages.list().catch(()=>[])));const[ne,ae,m,O]=await Promise.all(Z);C.destroy(),Ve(e.find("#field-theme").get(0),{includeDefault:!0});const M=ae?.layoutOptions?.spacerSize??40;if(s&&!m){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}e.find("#editor-title").text(s?`Edit Page - ${m.title||v}`:"New Page"),s&&e.find("#page-url-path").val(v),m&&(e.find("#field-title").val(m.title||""),e.find("#field-description").val(m.description||""),e.find("#field-status").val(m.status||"draft"),e.find("#field-sort-order").val(m.sortOrder??99),e.find("#field-show-in-nav").prop("checked",!!m.showInNav),e.find("#field-sidebar").prop("checked",!!m.sidebar),e.find("#field-show-breadcrumbs").prop("checked",m.breadcrumbs!==!1),e.find("#field-bundled").prop("checked",!!m.bundled),e.find("#field-category").val(m.category||""),e.find("#field-visibility").val(m.visibility||"public"),e.find("#field-theme").val(m.theme||""),e.find("#field-seo-title").val(m.seo?.title||""),e.find("#field-seo-desc").val(m.seo?.description||""),m.dconfig&&e.find("#field-dconfig").val(JSON.stringify(m.dconfig,null,2)));{const t=e.find("#field-project").get(0);if(t){const l=await L.projects.list().catch(()=>[]);l.forEach(c=>{const h=document.createElement("option");h.value=c.slug,h.textContent=c.name||c.slug,t.appendChild(h)});let u="";if(!s){const{getProjectFromHash:c}=await import("../lib/project-context.js");u=c()||""}if(!u&&m)if(m.project===null)u="";else if(typeof m.project=="string"&&m.project)u=m.project;else{const c=s?v:"";if(c){let h="",p=-1;for(const k of l)k.rootUrl&&(c===k.rootUrl||c.startsWith(k.rootUrl+"/"))&&k.rootUrl.length>p&&(h=k.slug,p=k.rootUrl.length);u=h}}t.value=u}}const B=e.find("#quick-switch");s&&Array.isArray(O)&&O.length&&([...O].sort((t,l)=>(t.title||t.urlPath).localeCompare(l.title||l.urlPath)).forEach(t=>{const l=document.createElement("option");l.value=t.urlPath,l.textContent=`${t.title||"Untitled"} (${t.urlPath})`,t.urlPath===v&&(l.selected=!0),B.get(0).appendChild(l)}),B.css("display",""),B.on("change",function(){const t=this.value;t&&R.navigate("/pages/edit"+t)}));const N=await L.pages.tags().catch(()=>[]),P=e.find("#field-tags").get(0),J=P?E.pillbox(P,{data:N,value:m?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,_=e.find("#field-layout").empty();if(Object.entries(ne).forEach(([t,l])=>{const u=(m?.layout||"default")===t?"selected":"";_.append(`<option value="${t}" ${u}>${l.label||t}</option>`)}),s){const t=e.find("#view-page-btn").get(0);t.href=v,t.style.display="";const l=e.find("#history-tab").get(0);l.style.display=""}e.find("#live-preview-tab").get(0).style.display="",E.tabs(e.find("#editor-meta-tabs").get(0)),s&&je(e,v);const F=e.find("#markdown-editor"),g=e.find("#markdown-preview");m&&F.val(m.content||"");let y=!1,U="";L.settings.getCustomCss().then(({css:t})=>{U=t||""}).catch(()=>{});let x=!1;const f=F.get(0),i=document.createElement("div");i.className="editor-line-numbers editor-line-numbers--foldable",f.parentElement.insertBefore(i,f);const w=We(f,i,{onFoldChange:()=>{}});w.setGuard(t=>{x=t});function q(){const t=e.find("#css-editor").get(0);if(!t)return;const l=t.value.split(`
-`);for(;i.firstChild;)i.removeChild(i.firstChild);l.forEach((u,c)=>{const h=document.createElement("span");h.className="editor-line-number-row";const p=document.createElement("span");p.className="fold-toggle fold-toggle--empty";const k=document.createElement("span");k.className="editor-line-num",k.textContent=String(c+1),h.appendChild(p),h.appendChild(k),i.appendChild(h)}),i.scrollTop=t.scrollTop}{const t=e.find("#css-editor").get(0);t&&t.addEventListener("scroll",()=>{i.scrollTop=t.scrollTop})}const oe=()=>{w.refresh(),i.scrollTop=f.scrollTop};f.addEventListener("input",oe),f.addEventListener("scroll",()=>{i.scrollTop=f.scrollTop});let fe=null;const b=()=>g.get(0),A=t=>t.replace(/<\/head>/i,"<style>body.dm-cloaked{opacity:1 !important;transition:none !important}</style></head>"),j=()=>{const t=b(),l=t&&t.contentDocument;if(!l||!l.head)return;const u=y&&e.find("#css-editor").val()||"";if(!u)return;let c=l.getElementById("preview-custom-css");c||(c=l.createElement("style"),c.id="preview-custom-css",l.head.appendChild(c)),c.textContent=u},ie=()=>{clearTimeout(fe),fe=setTimeout(async()=>{const t=b();if(!t||e.find("#editor-body").hasClass("editor-mode-write"))return;const l=w.getUnfoldedContent();try{const u=(e.find("#field-dconfig").val()||"").trim();let c=null;if(u)try{c=JSON.parse(u)}catch{c=null}const h=(e.find("#page-url-path").val()||"").trim()||v||"/",{html:p}=await L.pages.previewFull(h,ye(c),l),k=A(p);let te=0;try{te=t.contentWindow.scrollY||0}catch{}t.addEventListener("load",function se(){t.removeEventListener("load",se);try{t.contentWindow.scrollTo(0,te)}catch{}j()},{once:!0}),t.srcdoc=k}catch(u){t.srcdoc='<!doctype html><meta charset="utf-8"><body style="font:14px system-ui;padding:1rem;color:#b91c1c;">Preview failed: '+String(u&&u.message||"unknown error").replace(/[<&]/g,c=>c==="<"?"&lt;":"&amp;")+"</body>"}},500)},le=He(F,e.find("#editor-toolbar"),{spacerDefault:M});qe(F.get(0));let ce=!1,de="split",pe=null;const V=document.createElement("button");V.className="editor-view-btn",V.type="button";const Q=document.createElement("span");Q.setAttribute("data-icon","css-code"),V.appendChild(Q);const W=document.createElement("button");W.className="editor-view-btn",W.type="button";const H=document.createElement("span");H.setAttribute("data-icon","code"),W.appendChild(H);let ee=!1;const Y=document.createElement("button");Y.className="editor-view-btn",Y.type="button",Y.innerHTML='<span data-icon="chevrons-down" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',Y.style.cssText="font-size:9px;letter-spacing:-1px;";const me=e.find(".editor-toolbar-right").get(0);me.prepend(Y),me.prepend(W),me.prepend(V),I.scan(V),I.scan(W),I.scan(Y),E.tooltip(V,{content:"Edit Custom CSS",position:"top"}),E.tooltip(W,{content:"Format Markdown",position:"top"}),E.tooltip(Y,{content:"Fold / unfold all shortcodes",position:"top"}),W.addEventListener("click",()=>{const t=F.get(0),l=t.selectionStart,u=Xe(w.getUnfoldedContent());w.unfoldAll(),x=!0,t.value=u,x=!1,t.selectionStart=t.selectionEnd=Math.min(l,u.length),t.dispatchEvent(new Event("input")),w.refresh(),E.toast("Markdown formatted.",{type:"success"})}),Y.addEventListener("click",()=>{ee?(w.unfoldAll(),Y.innerHTML='<span data-icon="chevrons-down" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',I.scan(Y),Y.classList.remove("active")):(w.foldAll(),Y.innerHTML='<span data-icon="chevrons-right" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',I.scan(Y),Y.classList.add("active")),ee=!ee});const ve=document.createElement("span");ve.className="editor-toolbar-sep",me.insertBefore(ve,me.children[3]),V.addEventListener("click",()=>{ce=!ce;const t=e.find("#markdown-editor"),l=e.find("#css-editor"),u=e.find("#editor-body");if(ce){const c=e.find(".editor-view-btn[data-mode].active").get(0);de=c?c.getAttribute("data-mode"):"split",e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find('.editor-view-btn[data-mode="split"]').addClass("active"),u.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),t.hide(),l.show(),y||(l.val(U),y=!0,Ie(l.get(0))),q(),V.classList.add("active")}else e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find(`.editor-view-btn[data-mode="${de}"]`).addClass("active"),u.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${de}`),l.hide(),t.show(),w.refresh(),V.classList.remove("active")});const ue=Ne();ue.viewMode&&ue.viewMode!=="split"&&(e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find(`.editor-view-btn[data-mode="${ue.viewMode}"]`).addClass("active"),e.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${ue.viewMode}`)),ue.fullscreen&&e.find(".editor-card").addClass("editor-fullscreen"),e.find("#css-editor").on("input",()=>{q(),clearTimeout(pe),pe=setTimeout(()=>{j()},400)}),Oe({image:async t=>{const l=(await L.media.list().catch(()=>[])).filter(h=>/\.(png|jpe?g|gif|webp|svg)$/i.test(h.name)),u=document.createElement("div");if(u.className="media-picker-grid",l.length)l.forEach(h=>{const p=document.createElement("div");p.className="media-picker-item",p.dataset.url=h.url;const k=document.createElement("img");k.src=h.url,k.alt=h.name;const te=document.createElement("span");te.textContent=h.name,p.appendChild(k),p.appendChild(te),u.appendChild(p)});else{const h=document.createElement("p");h.className="text-muted p-3",h.textContent="No images uploaded yet.",u.appendChild(h)}const c=E.slideover({title:"Insert Image",size:"lg",position:"right",content:u});$(c.element).on("click",".media-picker-item",function(){const h=$(this).data("url"),p=$(this).find("span").text();$e(t,`![${p}](${h})`),c.close(),t.dispatchEvent(new Event("input",{bubbles:!0}))}),c.open()},scribe:t=>Ye(t),card:t=>Re.open(t,{onMediaBrowse:()=>L.media.list().catch(()=>[])}),timeline:t=>Be.open(t,{onPreview:async l=>{try{return await L.pages.preview(l)}catch{return null}},onListCollections:()=>L.collections.list().catch(()=>[]),onGetCollection:l=>L.collections.get(l).catch(()=>null)})}),le.onEffects(t=>Ue.open(t)),le.onHelp(()=>{_e()}),le.onTutorial(t=>{Ge(t)}),e.find(".editor-view-btn").on("click",function(){const t=$(this).data("mode");t&&(e.find(".editor-view-btn").removeClass("active"),$(this).addClass("active"),e.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${t}`),ze("viewMode",t),t!=="write"&&ie())}),e.find("#fullscreen-btn").on("click",function(){e.find(".editor-card").toggleClass("editor-fullscreen"),ze("fullscreen",e.find(".editor-card").hasClass("editor-fullscreen"))}),ge=!1,e.find("#quick-switch").prop("disabled",!1),Le&&window.removeEventListener("beforeunload",Le),Le=t=>{ge&&t.preventDefault()},window.addEventListener("beforeunload",Le),Fe||(Fe=!0,R.use((t,l,u)=>{const c=window.location.hash.startsWith("#/pages/edit")||window.location.hash==="#/pages/new";return!ge||!c?u():E.confirm("You have unsaved changes. Leave this page?").then(h=>{h&&(ge=!1,u())})})),F.on("input",()=>{x||(ge=!0,e.find("#quick-switch").prop("disabled",!0),ie())});const be=e.find("#editor-meta-tabs").get(0);be&&(be.addEventListener("input",()=>{ge=!0,e.find("#quick-switch").prop("disabled",!0)}),be.addEventListener("change",t=>{t.target.id!=="quick-switch"&&(ge=!0,e.find("#quick-switch").prop("disabled",!0))})),ie();const ye=t=>({title:e.find("#field-title").val().trim()||"Untitled",description:e.find("#field-description").val().trim(),layout:e.find("#field-layout").val(),status:e.find("#field-status").val(),sortOrder:parseInt(e.find("#field-sort-order").val(),10)||99,showInNav:e.find("#field-show-in-nav").is(":checked"),sidebar:e.find("#field-sidebar").is(":checked"),...e.find("#field-show-breadcrumbs").is(":checked")?{}:{breadcrumbs:!1},...e.find("#field-bundled").is(":checked")?{bundled:!0}:{},tags:J?J.getValue():[],category:e.find("#field-category").val().trim()||null,visibility:e.find("#field-visibility").val()||"public",project:e.find("#field-project").val()||"",seo:{title:e.find("#field-seo-title").val().trim(),description:e.find("#field-seo-desc").val().trim()},dconfig:t,...e.find("#field-theme").val()?{theme:e.find("#field-theme").val()}:{}});(()=>{const t=e.find("#editor-body").get(0),l=e.find("#editor-divider").get(0);if(!t||!l)return;const u=15,c=85,h=T=>Math.min(c,Math.max(u,T));let p=h(parseFloat(Ne().splitRatio)||50);const k=T=>{t.style.setProperty("--dm-editor-split",p+"%"),l.setAttribute("aria-valuenow",String(Math.round(p))),T&&ze("splitRatio",p)};k(!1);const te=T=>{const re=t.getBoundingClientRect();return re.width?h((T-re.left)/re.width*100):p},se=T=>{p=te(T.clientX),k(!1)},he=()=>{document.removeEventListener("pointermove",se),document.removeEventListener("pointerup",he),t.classList.remove("is-resizing"),l.classList.remove("is-dragging"),k(!0)};l.addEventListener("pointerdown",T=>{window.matchMedia("(max-width: 768px)").matches||(T.preventDefault(),t.classList.add("is-resizing"),l.classList.add("is-dragging"),document.addEventListener("pointermove",se),document.addEventListener("pointerup",he))}),l.addEventListener("dblclick",()=>{p=50,k(!0)}),l.addEventListener("keydown",T=>{const re=T.shiftKey?10:2;let K=p;if(T.key==="ArrowLeft")K=p-re;else if(T.key==="ArrowRight")K=p+re;else if(T.key==="Home")K=u;else if(T.key==="End")K=c;else if(T.key==="Enter"||T.key===" ")K=50;else return;T.preventDefault(),p=h(K),k(!0)})})(),(()=>{const t=e.find("#live-preview-frame").get(0),l=e.find("#live-preview-status").get(0),u=e.find("#live-preview-stage").get(0);if(!t)return;let c=null,h=!0,p=!1,k=!1;const te=G=>{l&&(l.textContent=G)},se=()=>{const G=(e.find("#field-dconfig").val()||"").trim();if(!G)return null;try{return JSON.parse(G)}catch{return null}},he=async()=>{if(!k){k=!0,te("Rendering\u2026");try{const G=(e.find("#page-url-path").val()||"").trim()||v||"/",{html:we}=await L.pages.previewFull(G,ye(se()),w.getUnfoldedContent());let Ce=0;try{Ce=t.contentWindow.scrollY||0}catch{}t.addEventListener("load",function Ee(){t.removeEventListener("load",Ee);try{t.contentWindow.scrollTo(0,Ce)}catch{}},{once:!0}),t.srcdoc=we,h=!1,te("Showing unsaved changes")}catch(G){te("Preview failed - "+(G&&G.message?G.message:"unknown error"))}finally{k=!1}}},T=()=>{h=!0,p&&(clearTimeout(c),c=setTimeout(he,600))},re=e.find("#live-preview-tab").get(0);re&&re.addEventListener("click",()=>{p=!0,h&&he()}),e.find("#editor-meta-tabs .tab-item").each(function(){this.id!=="live-preview-tab"&&this.addEventListener("click",()=>{p=!1})}),f.addEventListener("input",T);const K=e.find("#editor-meta-tabs").get(0);K&&(K.addEventListener("input",T),K.addEventListener("change",T)),e.find("#live-preview-refresh").on("click",()=>he()),e.find(".live-preview-width").on("click",function(){const G=this.getAttribute("data-width");e.find(".live-preview-width").removeClass("active"),$(this).addClass("active"),G==="full"?t.removeAttribute("data-width"):t.setAttribute("data-width",G),u&&(u.scrollTop=0)})})(),e.find("#share-preview-btn").on("click",async()=>{if(!s){E.toast("Save the page first - a share link needs a page to point at.",{type:"warning"});return}await Ke(v)}),e.find("#save-btn").on("click",async()=>{const t=e.find("#page-url-path").val().trim();if(!t){E.toast("URL path is required.",{type:"warning"});return}const l=e.find("#field-dconfig").val().trim();let u=null;if(l)try{u=JSON.parse(l)}catch{E.toast("DConfig JSON is invalid. Please check the format before saving.",{type:"warning"});return}const c=ye(u);try{e.find("#save-btn").prop("disabled",!0).text("Saving\u2026");const h=w.getUnfoldedContent();if(s){const p={frontmatter:c,body:h};t!==v&&(p.newUrlPath=t),await L.pages.update(v,p),y&&await L.settings.saveCustomCss(e.find("#css-editor").val()),E.toast(y?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),ge=!1,e.find("#quick-switch").prop("disabled",!1),t!==v&&R.navigate(`/pages/edit${t}`)}else await L.pages.create({urlPath:t,frontmatter:c,body:h}),y&&await L.settings.saveCustomCss(e.find("#css-editor").val()),E.toast(y?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),ge=!1,R.navigate("/pages")}catch(h){E.toast(`Save failed: ${h.message||"Unknown error"}`,{type:"error"})}finally{e.find("#save-btn").prop("disabled",!1).text("Save")}}),e.find("#cancel-btn").on("click",()=>R.navigate("/pages")),Domma.icons.scan()}};
+`)}const Me="editor_prefs";function Ne(){return S.get(Me)||{viewMode:"split",fullscreen:!1}}function ze(e,A){const v=Ne();v[e]=A,S.set(Me,v)}export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(e){const A=window.location.hash.match(/#\/pages\/edit(\/.*)/),v=A?A[1]:null,s=!!v,b=E.loader(e.get(0),{type:"dots"}),V=[L.layouts.get().catch(()=>({})),L.settings.get().catch(()=>({}))];s&&(V.push(L.pages.get(v).catch(()=>null)),V.push(L.pages.list().catch(()=>[])));const[W,Y,i,P]=await Promise.all(V);b.destroy(),Ve(e.find("#field-theme").get(0),{includeDefault:!0}),await Ze(e.find("#field-visibility").get(0),i?.visibility);const B=Y?.layoutOptions?.spacerSize??40;if(s&&!i){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}e.find("#editor-title").text(s?`Edit Page - ${i.title||v}`:"New Page"),s&&e.find("#page-url-path").val(v),i&&(e.find("#field-title").val(i.title||""),e.find("#field-description").val(i.description||""),e.find("#field-status").val(i.status||"draft"),e.find("#field-sort-order").val(i.sortOrder??99),e.find("#field-show-in-nav").prop("checked",!!i.showInNav),e.find("#field-sidebar").prop("checked",!!i.sidebar),e.find("#field-show-breadcrumbs").prop("checked",i.breadcrumbs!==!1),e.find("#field-bundled").prop("checked",!!i.bundled),e.find("#field-category").val(i.category||""),e.find("#field-visibility").val(i.visibility||"public"),e.find("#field-theme").val(i.theme||""),e.find("#field-seo-title").val(i.seo?.title||""),e.find("#field-seo-desc").val(i.seo?.description||""),i.dconfig&&e.find("#field-dconfig").val(JSON.stringify(i.dconfig,null,2)));{const t=e.find("#field-project").get(0);if(t){const d=await L.projects.list().catch(()=>[]);d.forEach(p=>{const h=document.createElement("option");h.value=p.slug,h.textContent=p.name||p.slug,t.appendChild(h)});let u="";if(!s){const{getProjectFromHash:p}=await import("../lib/project-context.js");u=p()||""}if(!u&&i)if(i.project===null)u="";else if(typeof i.project=="string"&&i.project)u=i.project;else{const p=s?v:"";if(p){let h="",m=-1;for(const k of d)k.rootUrl&&(p===k.rootUrl||p.startsWith(k.rootUrl+"/"))&&k.rootUrl.length>m&&(h=k.slug,m=k.rootUrl.length);u=h}}t.value=u}}const H=e.find("#quick-switch");s&&Array.isArray(P)&&P.length&&([...P].sort((t,d)=>(t.title||t.urlPath).localeCompare(d.title||d.urlPath)).forEach(t=>{const d=document.createElement("option");d.value=t.urlPath,d.textContent=`${t.title||"Untitled"} (${t.urlPath})`,t.urlPath===v&&(d.selected=!0),H.get(0).appendChild(d)}),H.css("display",""),H.on("change",function(){const t=this.value;t&&R.navigate("/pages/edit"+t)}));const z=await L.pages.tags().catch(()=>[]),F=e.find("#field-tags").get(0),Z=F?E.pillbox(F,{data:z,value:i?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,K=e.find("#field-layout").empty();if(Object.entries(W).forEach(([t,d])=>{const u=(i?.layout||"default")===t?"selected":"";K.append(`<option value="${t}" ${u}>${d.label||t}</option>`)}),s){const t=e.find("#view-page-btn").get(0);t.href=v,t.style.display="";const d=e.find("#history-tab").get(0);d.style.display=""}e.find("#live-preview-tab").get(0).style.display="",E.tabs(e.find("#editor-meta-tabs").get(0)),s&&_e(e,v);const M=e.find("#markdown-editor"),g=e.find("#markdown-preview");i&&M.val(i.content||"");let C=!1,q="";L.settings.getCustomCss().then(({css:t})=>{q=t||""}).catch(()=>{});let x=!1;const f=M.get(0),l=document.createElement("div");l.className="editor-line-numbers editor-line-numbers--foldable",f.parentElement.insertBefore(l,f);const w=We(f,l,{onFoldChange:()=>{}});w.setGuard(t=>{x=t});function O(){const t=e.find("#css-editor").get(0);if(!t)return;const d=t.value.split(`
+`);for(;l.firstChild;)l.removeChild(l.firstChild);d.forEach((u,p)=>{const h=document.createElement("span");h.className="editor-line-number-row";const m=document.createElement("span");m.className="fold-toggle fold-toggle--empty";const k=document.createElement("span");k.className="editor-line-num",k.textContent=String(p+1),h.appendChild(m),h.appendChild(k),l.appendChild(h)}),l.scrollTop=t.scrollTop}{const t=e.find("#css-editor").get(0);t&&t.addEventListener("scroll",()=>{l.scrollTop=t.scrollTop})}const oe=()=>{w.refresh(),l.scrollTop=f.scrollTop};f.addEventListener("input",oe),f.addEventListener("scroll",()=>{l.scrollTop=f.scrollTop});let fe=null;const y=()=>g.get(0),N=t=>t.replace(/<\/head>/i,"<style>body.dm-cloaked{opacity:1 !important;transition:none !important}</style></head>"),X=()=>{const t=y(),d=t&&t.contentDocument;if(!d||!d.head)return;const u=C&&e.find("#css-editor").val()||"";if(!u)return;let p=d.getElementById("preview-custom-css");p||(p=d.createElement("style"),p.id="preview-custom-css",d.head.appendChild(p)),p.textContent=u},ie=()=>{clearTimeout(fe),fe=setTimeout(async()=>{const t=y();if(!t||e.find("#editor-body").hasClass("editor-mode-write"))return;const d=w.getUnfoldedContent();try{const u=(e.find("#field-dconfig").val()||"").trim();let p=null;if(u)try{p=JSON.parse(u)}catch{p=null}const h=(e.find("#page-url-path").val()||"").trim()||v||"/",{html:m}=await L.pages.previewFull(h,Ce(p),d),k=N(m);let ae=0;try{ae=t.contentWindow.scrollY||0}catch{}t.addEventListener("load",function se(){t.removeEventListener("load",se);try{t.contentWindow.scrollTo(0,ae)}catch{}X()},{once:!0}),t.srcdoc=k}catch(u){t.srcdoc='<!doctype html><meta charset="utf-8"><body style="font:14px system-ui;padding:1rem;color:#b91c1c;">Preview failed: '+String(u&&u.message||"unknown error").replace(/[<&]/g,p=>p==="<"?"&lt;":"&amp;")+"</body>"}},500)},le=He(M,e.find("#editor-toolbar"),{spacerDefault:B});qe(M.get(0));let ce=!1,de="split",pe=null;const G=document.createElement("button");G.className="editor-view-btn",G.type="button";const te=document.createElement("span");te.setAttribute("data-icon","css-code"),G.appendChild(te);const j=document.createElement("button");j.className="editor-view-btn",j.type="button";const U=document.createElement("span");U.setAttribute("data-icon","code"),j.appendChild(U);let ne=!1;const _=document.createElement("button");_.className="editor-view-btn",_.type="button",_.innerHTML='<span data-icon="chevrons-down" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',_.style.cssText="font-size:9px;letter-spacing:-1px;";const me=e.find(".editor-toolbar-right").get(0);me.prepend(_),me.prepend(j),me.prepend(G),I.scan(G),I.scan(j),I.scan(_),E.tooltip(G,{content:"Edit Custom CSS",position:"top"}),E.tooltip(j,{content:"Format Markdown",position:"top"}),E.tooltip(_,{content:"Fold / unfold all shortcodes",position:"top"}),j.addEventListener("click",()=>{const t=M.get(0),d=t.selectionStart,u=Xe(w.getUnfoldedContent());w.unfoldAll(),x=!0,t.value=u,x=!1,t.selectionStart=t.selectionEnd=Math.min(d,u.length),t.dispatchEvent(new Event("input")),w.refresh(),E.toast("Markdown formatted.",{type:"success"})}),_.addEventListener("click",()=>{ne?(w.unfoldAll(),_.innerHTML='<span data-icon="chevrons-down" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',I.scan(_),_.classList.remove("active")):(w.foldAll(),_.innerHTML='<span data-icon="chevrons-right" data-icon-size="10" style="display:inline-flex;align-items:center;vertical-align:middle;"></span>',I.scan(_),_.classList.add("active")),ne=!ne});const ve=document.createElement("span");ve.className="editor-toolbar-sep",me.insertBefore(ve,me.children[3]),G.addEventListener("click",()=>{ce=!ce;const t=e.find("#markdown-editor"),d=e.find("#css-editor"),u=e.find("#editor-body");if(ce){const p=e.find(".editor-view-btn[data-mode].active").get(0);de=p?p.getAttribute("data-mode"):"split",e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find('.editor-view-btn[data-mode="split"]').addClass("active"),u.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),t.hide(),d.show(),C||(d.val(q),C=!0,Ie(d.get(0))),O(),G.classList.add("active")}else e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find(`.editor-view-btn[data-mode="${de}"]`).addClass("active"),u.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${de}`),d.hide(),t.show(),w.refresh(),G.classList.remove("active")});const ue=Ne();ue.viewMode&&ue.viewMode!=="split"&&(e.find(".editor-view-btn[data-mode]").removeClass("active"),e.find(`.editor-view-btn[data-mode="${ue.viewMode}"]`).addClass("active"),e.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${ue.viewMode}`)),ue.fullscreen&&e.find(".editor-card").addClass("editor-fullscreen"),e.find("#css-editor").on("input",()=>{O(),clearTimeout(pe),pe=setTimeout(()=>{X()},400)}),Oe({image:async t=>{const d=(await L.media.list().catch(()=>[])).filter(h=>/\.(png|jpe?g|gif|webp|svg)$/i.test(h.name)),u=document.createElement("div");if(u.className="media-picker-grid",d.length)d.forEach(h=>{const m=document.createElement("div");m.className="media-picker-item",m.dataset.url=h.url;const k=document.createElement("img");k.src=h.url,k.alt=h.name;const ae=document.createElement("span");ae.textContent=h.name,m.appendChild(k),m.appendChild(ae),u.appendChild(m)});else{const h=document.createElement("p");h.className="text-muted p-3",h.textContent="No images uploaded yet.",u.appendChild(h)}const p=E.slideover({title:"Insert Image",size:"lg",position:"right",content:u});$(p.element).on("click",".media-picker-item",function(){const h=$(this).data("url"),m=$(this).find("span").text();$e(t,`![${m}](${h})`),p.close(),t.dispatchEvent(new Event("input",{bubbles:!0}))}),p.open()},scribe:t=>Ye(t),card:t=>Re.open(t,{onMediaBrowse:()=>L.media.list().catch(()=>[])}),timeline:t=>Be.open(t,{onPreview:async d=>{try{return await L.pages.preview(d)}catch{return null}},onListCollections:()=>L.collections.list().catch(()=>[]),onGetCollection:d=>L.collections.get(d).catch(()=>null)})}),le.onEffects(t=>Ue.open(t)),le.onHelp(()=>{je()}),le.onTutorial(t=>{Ge(t)}),e.find(".editor-view-btn").on("click",function(){const t=$(this).data("mode");t&&(e.find(".editor-view-btn").removeClass("active"),$(this).addClass("active"),e.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${t}`),ze("viewMode",t),t!=="write"&&ie())}),e.find("#fullscreen-btn").on("click",function(){e.find(".editor-card").toggleClass("editor-fullscreen"),ze("fullscreen",e.find(".editor-card").hasClass("editor-fullscreen"))}),ge=!1,e.find("#quick-switch").prop("disabled",!1),Le&&window.removeEventListener("beforeunload",Le),Le=t=>{ge&&t.preventDefault()},window.addEventListener("beforeunload",Le),Fe||(Fe=!0,R.use((t,d,u)=>{const p=window.location.hash.startsWith("#/pages/edit")||window.location.hash==="#/pages/new";return!ge||!p?u():E.confirm("You have unsaved changes. Leave this page?").then(h=>{h&&(ge=!1,u())})})),M.on("input",()=>{x||(ge=!0,e.find("#quick-switch").prop("disabled",!0),ie())});const be=e.find("#editor-meta-tabs").get(0);be&&(be.addEventListener("input",()=>{ge=!0,e.find("#quick-switch").prop("disabled",!0)}),be.addEventListener("change",t=>{t.target.id!=="quick-switch"&&(ge=!0,e.find("#quick-switch").prop("disabled",!0))})),ie();const Ce=t=>({title:e.find("#field-title").val().trim()||"Untitled",description:e.find("#field-description").val().trim(),layout:e.find("#field-layout").val(),status:e.find("#field-status").val(),sortOrder:parseInt(e.find("#field-sort-order").val(),10)||99,showInNav:e.find("#field-show-in-nav").is(":checked"),sidebar:e.find("#field-sidebar").is(":checked"),...e.find("#field-show-breadcrumbs").is(":checked")?{}:{breadcrumbs:!1},...e.find("#field-bundled").is(":checked")?{bundled:!0}:{},tags:Z?Z.getValue():[],category:e.find("#field-category").val().trim()||null,visibility:e.find("#field-visibility").val()||"public",project:e.find("#field-project").val()||"",seo:{title:e.find("#field-seo-title").val().trim(),description:e.find("#field-seo-desc").val().trim()},dconfig:t,...e.find("#field-theme").val()?{theme:e.find("#field-theme").val()}:{}});(()=>{const t=e.find("#editor-body").get(0),d=e.find("#editor-divider").get(0);if(!t||!d)return;const u=15,p=85,h=T=>Math.min(p,Math.max(u,T));let m=h(parseFloat(Ne().splitRatio)||50);const k=T=>{t.style.setProperty("--dm-editor-split",m+"%"),d.setAttribute("aria-valuenow",String(Math.round(m))),T&&ze("splitRatio",m)};k(!1);const ae=T=>{const re=t.getBoundingClientRect();return re.width?h((T-re.left)/re.width*100):m},se=T=>{m=ae(T.clientX),k(!1)},he=()=>{document.removeEventListener("pointermove",se),document.removeEventListener("pointerup",he),t.classList.remove("is-resizing"),d.classList.remove("is-dragging"),k(!0)};d.addEventListener("pointerdown",T=>{window.matchMedia("(max-width: 768px)").matches||(T.preventDefault(),t.classList.add("is-resizing"),d.classList.add("is-dragging"),document.addEventListener("pointermove",se),document.addEventListener("pointerup",he))}),d.addEventListener("dblclick",()=>{m=50,k(!0)}),d.addEventListener("keydown",T=>{const re=T.shiftKey?10:2;let Q=m;if(T.key==="ArrowLeft")Q=m-re;else if(T.key==="ArrowRight")Q=m+re;else if(T.key==="Home")Q=u;else if(T.key==="End")Q=p;else if(T.key==="Enter"||T.key===" ")Q=50;else return;T.preventDefault(),m=h(Q),k(!0)})})(),(()=>{const t=e.find("#live-preview-frame").get(0),d=e.find("#live-preview-status").get(0),u=e.find("#live-preview-stage").get(0);if(!t)return;let p=null,h=!0,m=!1,k=!1;const ae=J=>{d&&(d.textContent=J)},se=()=>{const J=(e.find("#field-dconfig").val()||"").trim();if(!J)return null;try{return JSON.parse(J)}catch{return null}},he=async()=>{if(!k){k=!0,ae("Rendering\u2026");try{const J=(e.find("#page-url-path").val()||"").trim()||v||"/",{html:we}=await L.pages.previewFull(J,Ce(se()),w.getUnfoldedContent());let ye=0;try{ye=t.contentWindow.scrollY||0}catch{}t.addEventListener("load",function Ee(){t.removeEventListener("load",Ee);try{t.contentWindow.scrollTo(0,ye)}catch{}},{once:!0}),t.srcdoc=we,h=!1,ae("Showing unsaved changes")}catch(J){ae("Preview failed - "+(J&&J.message?J.message:"unknown error"))}finally{k=!1}}},T=()=>{h=!0,m&&(clearTimeout(p),p=setTimeout(he,600))},re=e.find("#live-preview-tab").get(0);re&&re.addEventListener("click",()=>{m=!0,h&&he()}),e.find("#editor-meta-tabs .tab-item").each(function(){this.id!=="live-preview-tab"&&this.addEventListener("click",()=>{m=!1})}),f.addEventListener("input",T);const Q=e.find("#editor-meta-tabs").get(0);Q&&(Q.addEventListener("input",T),Q.addEventListener("change",T)),e.find("#live-preview-refresh").on("click",()=>he()),e.find(".live-preview-width").on("click",function(){const J=this.getAttribute("data-width");e.find(".live-preview-width").removeClass("active"),$(this).addClass("active"),J==="full"?t.removeAttribute("data-width"):t.setAttribute("data-width",J),u&&(u.scrollTop=0)})})(),e.find("#share-preview-btn").on("click",async()=>{if(!s){E.toast("Save the page first - a share link needs a page to point at.",{type:"warning"});return}await Ke(v)}),e.find("#save-btn").on("click",async()=>{const t=e.find("#page-url-path").val().trim();if(!t){E.toast("URL path is required.",{type:"warning"});return}const d=e.find("#field-dconfig").val().trim();let u=null;if(d)try{u=JSON.parse(d)}catch{E.toast("DConfig JSON is invalid. Please check the format before saving.",{type:"warning"});return}const p=Ce(u);try{e.find("#save-btn").prop("disabled",!0).text("Saving\u2026");const h=w.getUnfoldedContent();if(s){const m={frontmatter:p,body:h};t!==v&&(m.newUrlPath=t),await L.pages.update(v,m),C&&await L.settings.saveCustomCss(e.find("#css-editor").val()),E.toast(C?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),ge=!1,e.find("#quick-switch").prop("disabled",!1),t!==v&&R.navigate(`/pages/edit${t}`)}else await L.pages.create({urlPath:t,frontmatter:p,body:h}),C&&await L.settings.saveCustomCss(e.find("#css-editor").val()),E.toast(C?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),ge=!1,R.navigate("/pages")}catch(h){E.toast(`Save failed: ${h.message||"Unknown error"}`,{type:"error"})}finally{e.find("#save-btn").prop("disabled",!1).text("Save")}}),e.find("#cancel-btn").on("click",()=>R.navigate("/pages")),Domma.icons.scan()}};async function Ze(e,A){if(!e)return;let v=[];try{const i=await L.get("/collections/roles/entries?limit=100");v=Array.isArray(i)?i:i?.entries||[]}catch{}const s=v.map(i=>({name:i.data?.name,label:i.data?.label||i.data?.name,level:i.data?.level??99})).filter(i=>i.name&&i.level!==0).sort((i,P)=>P.level-i.level),b=(i,P)=>Object.assign(document.createElement("option"),{value:i,textContent:P}),V=()=>{typeof A=="string"&&A&&![...e.options].some(i=>i.value===A)&&e.append(b(A,`${A} (custom)`))};if(!s.length)return V();const W=document.createElement("optgroup");W.label="Role and above",s.forEach(i=>W.append(b(i.name,`${i.label} and above`)));const Y=document.createElement("optgroup");Y.label="Role only",s.forEach(i=>Y.append(b(`=${i.name}`,`${i.label} only`))),e.replaceChildren(b("public","Public - everyone"),W,Y,b("private","Private - super-admin only")),V()}

package/admin/js/views/role-editor.js

@@ -1 +1,3 @@
-import{api as j,getUser as X}from"../api.js";const Y=[{value:"badge-danger",label:"Red (Admin)"},{value:"badge-warning",label:"Orange (Manager)"},{value:"badge-info",label:"Blue (Editor)"},{value:"badge-secondary",label:"Grey (Subscriber)"},{value:"badge-success",label:"Green"},{value:"badge-primary",label:"Primary"}];export const roleEditorView={templateUrl:"/admin/js/templates/role-editor.html",async onMount(o){if(!X()){R.navigate("/");return}const N=window.location.hash.match(/\/roles\/edit\/([^/?#]+)/)?.[1];if(!N){R.navigate("/roles");return}E.tabs(o.find("#role-tabs").get(0));const O=E.loader(o.get(0),{type:"dots"});let U,y,M;try{[U,y,M]=await Promise.all([j.get(`/collections/roles/entries/${N}`),j.get("/auth/permissions-registry"),j.projects.list().catch(()=>[])])}catch(e){O.destroy(),E.toast(`Failed to load role: ${e.message}`,{type:"error"}),R.navigate("/roles");return}O.destroy();const a=U.data||{},L=a.level===0,S=Object.fromEntries(y.resources.map(e=>[e.key,e])),C={};y.groups.forEach(e=>{C[e]=[]}),y.resources.forEach(e=>{C[e.group]&&C[e.group].push(e.key)}),o.find("#role-title").text(`Edit Role: ${a.label||a.name}`);const I=o.find("#role-name"),B=o.find("#role-label"),A=o.find("#role-level"),F=o.find("#role-badge");Y.forEach(e=>{const t=document.createElement("option");t.value=e.value,t.textContent=e.label,a.badgeClass===e.value&&(t.selected=!0),F.get(0).appendChild(t)});const V=o.find("#role-project");(M||[]).forEach(e=>{const t=document.createElement("option");t.value=e.slug,t.textContent=e.name||e.slug,a.meta?.project===e.slug&&(t.selected=!0),V.get(0).appendChild(t)}),I.val(a.name||""),B.val(a.label||""),A.val(a.level??""),L&&(I.prop("disabled",!0),A.prop("disabled",!0));const K=o.find("#permissions-container").get(0),q=a.permissions||[],x={},H={},W={},_=(e,t)=>q.includes(e)||q.includes(`${e}.${t}`);y.groups.forEach(e=>{const t=C[e];if(!t.length)return;const l=document.createElement("div");l.className="card mb-3";const r=document.createElement("div");r.className="card-header",r.style.cssText="display:flex;align-items:center;justify-content:space-between;cursor:default;";const g=document.createElement("strong");g.textContent=e;const d=document.createElement("label");d.style.cssText="display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:normal;cursor:pointer;";const p=document.createElement("input");p.type="checkbox",p.style.cursor="pointer",d.appendChild(p),d.appendChild(document.createTextNode("Select All")),W[e]=p,r.appendChild(g),r.appendChild(d),l.appendChild(r);const m=document.createElement("div");m.className="card-body",m.style.cssText="padding:.75rem 1rem;",t.forEach((n,v)=>{const i=S[n],s=i.actions.map(c=>c.key),b=v===t.length-1,T=document.createElement("div");T.style.cssText=`margin-bottom:${b?"0":".75rem"};padding-bottom:${b?"0":".75rem"};${b?"":"border-bottom:1px solid var(--dm-border);"}`;const k=document.createElement("div");k.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;";const J=document.createElement("span");J.dataset.icon=i.icon;const G=document.createElement("strong");G.textContent=i.label,G.style.fontSize=".9rem";const w=document.createElement("label");w.style.cssText="margin-left:auto;font-size:.8rem;display:flex;align-items:center;gap:.35rem;cursor:pointer;";const u=document.createElement("input");u.type="checkbox",u.style.cursor="pointer";const Q=s.every(c=>_(n,c));u.checked=Q,H[n]=u,w.appendChild(u),w.appendChild(document.createTextNode("Full Access")),k.appendChild(J),k.appendChild(G),k.appendChild(w),T.appendChild(k);const P=document.createElement("div");P.style.cssText="display:flex;gap:1.5rem;padding-left:1.5rem;flex-wrap:wrap;";const $={};i.actions.forEach(c=>{const f=document.createElement("label");f.style.cssText="display:flex;align-items:center;gap:.3rem;font-size:.875rem;cursor:pointer;";const h=document.createElement("input");h.type="checkbox",h.style.cursor="pointer",h.checked=_(n,c.key),h.dataset.res=n,h.dataset.action=c.key,x[`${n}.${c.key}`]=h,$[c.key]=h,f.appendChild(h),f.appendChild(document.createTextNode(c.label)),P.appendChild(f)}),u.addEventListener("change",()=>{s.forEach(c=>{$[c].checked=u.checked}),z(e,t)}),s.forEach(c=>{$[c].addEventListener("change",()=>{u.checked=s.every(f=>$[f].checked),z(e,t)})}),T.appendChild(P),m.appendChild(T)}),p.addEventListener("change",()=>{t.forEach(n=>{S[n].actions.map(s=>s.key).forEach(s=>{const b=x[`${n}.${s}`];b&&(b.checked=p.checked)});const i=H[n];i&&(i.checked=p.checked)})}),z(e,t),l.appendChild(m),K.appendChild(l)}),Domma.icons.scan("#permissions-container"),o.find("#btn-save-role").on("click",async()=>{const e=I.val().trim().toLowerCase().replace(/[^a-z0-9-]/g,"-"),t=B.val().trim(),l=parseInt(A.val(),10),r=F.val();if(!t){E.toast("Display label is required.",{type:"error"});return}const g=[];y.resources.forEach(m=>{const n=m.key,v=m.actions.map(s=>s.key),i=v.filter(s=>x[`${n}.${s}`]?.checked);i.length===v.length?g.push(n):i.forEach(s=>g.push(`${n}.${s}`))});const d=V.val()||"",p={data:{name:L?a.name:e||a.name,label:t,level:L||isNaN(l)?a.level:l,permissions:g,badgeClass:r,meta:{...a.meta||{},project:d||null}}};try{await j.put(`/collections/roles/entries/${N}`,p),E.toast("Role saved.",{type:"success"}),R.navigate("/roles")}catch(m){E.toast(`Save failed: ${m.message}`,{type:"error"})}});function z(e,t){const l=W[e];l&&(l.checked=t.every(r=>S[r].actions.map(d=>d.key).every(d=>x[`${r}.${d}`]?.checked)))}}};
+import{api as I,getUser as Y}from"../api.js";const D=[{value:"badge-danger",label:"Red (Admin)"},{value:"badge-warning",label:"Orange (Manager)"},{value:"badge-info",label:"Blue (Editor)"},{value:"badge-secondary",label:"Grey (Subscriber)"},{value:"badge-success",label:"Green"},{value:"badge-primary",label:"Primary"}];export const roleEditorView={templateUrl:"/admin/js/templates/role-editor.html",async onMount(o){if(!Y()){R.navigate("/");return}const N=window.location.hash.match(/\/roles\/edit\/([^/?#]+)/)?.[1];if(!N){R.navigate("/roles");return}E.tabs(o.find("#role-tabs").get(0));const U=E.loader(o.get(0),{type:"dots"});let B,k,H;try{[B,k,H]=await Promise.all([I.get(`/collections/roles/entries/${N}`),I.get("/auth/permissions-registry"),I.projects.list().catch(()=>[])])}catch(e){U.destroy(),E.toast(`Failed to load role: ${e.message}`,{type:"error"}),R.navigate("/roles");return}U.destroy();const n=B.data||{},C=n.level===0,L=Object.fromEntries(k.resources.map(e=>[e.key,e])),A={};k.groups.forEach(e=>{A[e]=[]}),k.resources.forEach(e=>{A[e.group]&&A[e.group].push(e.key)}),o.find("#role-title").text(`Edit Role: ${n.label||n.name}`);const z=o.find("#role-name"),M=o.find("#role-label"),G=o.find("#role-level"),_=o.find("#role-badge");D.forEach(e=>{const t=document.createElement("option");t.value=e.value,t.textContent=e.label,n.badgeClass===e.value&&(t.selected=!0),_.get(0).appendChild(t)});const F=o.find("#role-project");(H||[]).forEach(e=>{const t=document.createElement("option");t.value=e.slug,t.textContent=e.name||e.slug,n.meta?.project===e.slug&&(t.selected=!0),F.get(0).appendChild(t)}),z.val(n.name||""),M.val(n.label||""),G.val(n.level??""),C&&(z.prop("disabled",!0),G.prop("disabled",!0));const V=o.find("#role-admin-allow"),q=o.find("#role-admin-home");C?o.find("#role-admin-scope-card").hide():(V.val((n.admin?.allow||[]).join(`
+`)),q.val(n.admin?.home||""));const Q=o.find("#permissions-container").get(0),W=n.permissions||[],S={},Z={},J={},K=(e,t)=>W.includes(e)||W.includes(`${e}.${t}`);k.groups.forEach(e=>{const t=A[e];if(!t.length)return;const r=document.createElement("div");r.className="card mb-3";const d=document.createElement("div");d.className="card-header",d.style.cssText="display:flex;align-items:center;justify-content:space-between;cursor:default;";const v=document.createElement("strong");v.textContent=e;const i=document.createElement("label");i.style.cssText="display:flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:normal;cursor:pointer;";const c=document.createElement("input");c.type="checkbox",c.style.cursor="pointer",i.appendChild(c),i.appendChild(document.createTextNode("Select All")),J[e]=c,d.appendChild(v),d.appendChild(i),r.appendChild(d);const u=document.createElement("div");u.className="card-body",u.style.cssText="padding:.75rem 1rem;",t.forEach((l,T)=>{const g=L[l],m=g.actions.map(s=>s.key),f=T===t.length-1,a=document.createElement("div");a.style.cssText=`margin-bottom:${f?"0":".75rem"};padding-bottom:${f?"0":".75rem"};${f?"":"border-bottom:1px solid var(--dm-border);"}`;const h=document.createElement("div");h.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;";const j=document.createElement("span");j.dataset.icon=g.icon;const x=document.createElement("strong");x.textContent=g.label,x.style.fontSize=".9rem";const p=document.createElement("label");p.style.cssText="margin-left:auto;font-size:.8rem;display:flex;align-items:center;gap:.35rem;cursor:pointer;";const y=document.createElement("input");y.type="checkbox",y.style.cursor="pointer";const X=m.every(s=>K(l,s));y.checked=X,Z[l]=y,p.appendChild(y),p.appendChild(document.createTextNode("Full Access")),h.appendChild(j),h.appendChild(x),h.appendChild(p),a.appendChild(h);const O=document.createElement("div");O.style.cssText="display:flex;gap:1.5rem;padding-left:1.5rem;flex-wrap:wrap;";const $={};g.actions.forEach(s=>{const w=document.createElement("label");w.style.cssText="display:flex;align-items:center;gap:.3rem;font-size:.875rem;cursor:pointer;";const b=document.createElement("input");b.type="checkbox",b.style.cursor="pointer",b.checked=K(l,s.key),b.dataset.res=l,b.dataset.action=s.key,S[`${l}.${s.key}`]=b,$[s.key]=b,w.appendChild(b),w.appendChild(document.createTextNode(s.label)),O.appendChild(w)}),y.addEventListener("change",()=>{m.forEach(s=>{$[s].checked=y.checked}),P(e,t)}),m.forEach(s=>{$[s].addEventListener("change",()=>{y.checked=m.every(w=>$[w].checked),P(e,t)})}),a.appendChild(O),u.appendChild(a)}),c.addEventListener("change",()=>{t.forEach(l=>{L[l].actions.map(m=>m.key).forEach(m=>{const f=S[`${l}.${m}`];f&&(f.checked=c.checked)});const g=Z[l];g&&(g.checked=c.checked)})}),P(e,t),r.appendChild(u),Q.appendChild(r)}),Domma.icons.scan("#permissions-container"),o.find("#btn-save-role").on("click",async()=>{const e=z.val().trim().toLowerCase().replace(/[^a-z0-9-]/g,"-"),t=M.val().trim(),r=parseInt(G.val(),10),d=_.val();if(!t){E.toast("Display label is required.",{type:"error"});return}const v=[];k.resources.forEach(a=>{const h=a.key,j=a.actions.map(p=>p.key),x=j.filter(p=>S[`${h}.${p}`]?.checked);x.length===j.length?v.push(h):x.forEach(p=>v.push(`${h}.${p}`))});const i=F.val()||"",c=String(V.val()||"").split(`
+`).map(a=>a.trim()).filter(Boolean),u=String(q.val()||"").trim(),l=[...c,u].find(a=>a&&!/^\/[A-Za-z0-9\-_/]*$/.test(a));if(!C&&l){E.toast(`"${l}" is not an admin route - use a path like /portal.`,{type:"error"});return}const T=!C&&(c.length||u)?{allow:c,...u&&{home:u}}:null,{admin:g,...m}=n,f={data:{...m,...T&&{admin:T},name:C?n.name:e||n.name,label:t,level:C||isNaN(r)?n.level:r,permissions:v,badgeClass:d,meta:{...n.meta||{},project:i||null}}};try{await I.put(`/collections/roles/entries/${N}`,f),E.toast("Role saved.",{type:"success"}),R.navigate("/roles")}catch(a){E.toast(`Save failed: ${a.message}`,{type:"error"})}});function P(e,t){const r=J[e];r&&(r.checked=t.every(d=>L[d].actions.map(i=>i.key).every(i=>S[`${d}.${i}`]?.checked)))}}};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "domma-cms",
-  "version": "0.70.0",
+  "version": "0.71.0",
   "description": "File-based CMS powered by Domma and Fastify. Run npx domma-cms my-site to create a new project.",
   "type": "module",
   "main": "server/server.js",

package/plugins/_lib/admin/mail/reader-view.js

@@ -2382,6 +2382,7 @@ return {
             if (typeof elements?.contextMenu !== 'function') return;
 
             messageMenu = elements.contextMenu(listEl, {
+                cursor: 'glyph',
                 match: '.mail-item',
                 inherit: false,
                 items: [],
@@ -3487,6 +3488,7 @@ return {
             if (typeof elements?.contextMenu !== 'function' || !foldersEl) return;
 
             folderMenu = elements.contextMenu(foldersEl, {
+                cursor: 'glyph',
                 match: '.mail-folder',
                 inherit: false,
                 items: [],

package/plugins/_template/plugin.js

@@ -18,6 +18,9 @@ export async function onEnable({ fastify, services }) {
     // Create collections, pages, or forms here if needed.
 }
 
-export async function onDisable({ fastify, services }) {
-    // Called when the plugin is disabled via admin.
+export async function onDisable({ fastify, services, hooks, uninstall }) {
+    // Called when the plugin is disabled via admin, and before it is
+    // uninstalled (`uninstall: true`). Roles this plugin registered are kept
+    // on a disable and removed on uninstall automatically; to remove one
+    // yourself: if (uninstall) await hooks.unregisterRole('my-role');
 }