domma-cms 0.7.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -55,10 +55,15 @@ Describe this event.
|
|
|
55
55
|
Describe this event.
|
|
56
56
|
[/event]
|
|
57
57
|
[/timeline]
|
|
58
|
-
`;e.value=e.value.substring(0,l)+r+e.value.substring(l),e.selectionStart=e.selectionEnd=l+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="effects")o.effects?o.effects(e):se(e,h);else if(t==="spacerpick")ce(e,h,c);else if(t==="iconpick")ae(e,h);else if(t==="
|
|
58
|
+
`;e.value=e.value.substring(0,l)+r+e.value.substring(l),e.selectionStart=e.selectionEnd=l+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="effects")o.effects?o.effects(e):se(e,h);else if(t==="spacerpick")ce(e,h,c);else if(t==="iconpick")ae(e,h);else if(t==="listgroup")o.listgroup?o.listgroup(e):insertAtCursor(e,`[listgroup]
|
|
59
|
+
[item]Item 1[/item]
|
|
60
|
+
[item]Item 2[/item]
|
|
61
|
+
[item]Item 3[/item]
|
|
62
|
+
[/listgroup]
|
|
63
|
+
`);else if(t==="collection")o.collection?o.collection(e):insertAtCursor(e,'[collection slug="" display="table" /]');else if(t==="view")o.view&&o.view(e);else if(t==="cta")o.cta&&o.cta(e);else if(t==="form")o.form?o.form(e):insertAtCursor(e,'[form slug="" /]');else if(t==="tabs")o.tabs&&o.tabs(e);else if(t==="accordion")if(o.accordion)o.accordion(e);else{const l=e.selectionStart,r=`[accordion]
|
|
59
64
|
[item title="Item 1"]Content here.[/item]
|
|
60
65
|
[item title="Item 2"]Content here.[/item]
|
|
61
66
|
[/accordion]
|
|
62
67
|
`;e.value=e.value.substring(0,l)+r+e.value.substring(l),e.selectionStart=e.selectionEnd=l+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="text"){let n=function(m,u){const f=document.createElement("div"),L=document.createElement("label");return L.style.cssText=a,L.textContent=m,f.appendChild(L),f.appendChild(u),f},s=function(m){const u=document.createElement("select");return u.style.cssText=b,[["","\u2014 default \u2014"],...m].forEach(([f,L])=>{const H=document.createElement("option");H.value=f,H.textContent=L,u.appendChild(H)}),u},p=function(m,u){const f=document.createElement("input");return f.type="text",f.placeholder=m||"",f.value=u||"",f.style.cssText=b,f},v=function(m){const u=document.createElement("label");u.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const f=document.createElement("input");f.type="checkbox";const L=document.createElement("span");return L.style.cssText="font-size:.85em;color:var(--dm-text,#eee);",L.textContent=m,u.appendChild(f),u.appendChild(L),{wrap:u,cb:f}},y=function(m,u){const f=document.createElement("div");return f.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.5rem;",f.appendChild(m),f.appendChild(u),f},k=function(m){const u=document.createElement("div");return u.style.cssText="border-top:1px solid var(--dm-border,#333);padding-top:.5rem;margin-top:.1rem;font-size:.65rem;font-weight:700;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.08em;",u.textContent=m,u},q=function(){const m=[];C.value&&m.push(`font-size:${Y[C.value]||C.value}`);const u=parseFloat(S.value);!isNaN(u)&&u>0&&m.push(`font-size:${u}pt`),M.checked?m.push("font-weight:700"):x.value&&m.push(`font-weight:${ee[x.value]||x.value}`),O.checked&&m.push("font-style:italic");const f=W.value.trim();f&&m.push(`color:${X[f]||f}`),z.value&&m.push(`font-family:${ne[z.value]}`),T.value&&m.push(`text-transform:${oe[T.value]}`),N.value&&m.push(`text-decoration:${ie[N.value]}`),B.value&&m.push(`letter-spacing:${te[B.value]}`),A.value&&(m.push("display:block"),m.push(`text-align:${A.value}`)),R.value.trim()&&m.push(R.value.trim()),D.style.cssText=m.join(";"),D.textContent=w.value||"Preview text"};const l=e.selectionStart,r=e.selectionEnd,d=e.value.substring(l,r)||"",a="display:block;font-size:.7rem;font-weight:600;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",b="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",g=document.createElement("div");g.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.6rem;overflow-y:auto;max-height:75vh;";const w=p("Text to style\u2026",d);g.appendChild(n("Content",w)),g.appendChild(k("Typography"));const C=s([["xs","xs \u2014 0.75rem"],["sm","sm \u2014 0.875rem"],["base","base \u2014 1rem"],["lg","lg \u2014 1.125rem"],["xl","xl \u2014 1.25rem"],["2xl","2xl \u2014 1.5rem"],["3xl","3xl \u2014 1.875rem"],["4xl","4xl \u2014 2.25rem"]]),S=p("pt value (overrides Size)");g.appendChild(y(n("Size",C),n("Point Size (pt)",S)));const x=s([["thin","Thin (100)"],["light","Light (300)"],["normal","Normal (400)"],["medium","Medium (500)"],["semibold","Semibold (600)"],["bold","Bold (700)"],["extrabold","Extrabold (800)"],["black","Black (900)"]]),{wrap:j,cb:M}=v("Bold (overrides Weight)"),{wrap:Q,cb:O}=v("Italic"),V=document.createElement("div");V.style.cssText="display:flex;flex-direction:column;gap:.4rem;justify-content:flex-end;",V.appendChild(j),V.appendChild(Q),g.appendChild(y(n("Weight",x),V)),g.appendChild(k("Appearance"));const W=p("e.g. primary, #ff0000"),z=s([["Georgia","Georgia (serif)"],["Arial","Arial (sans-serif)"],["Verdana","Verdana (sans-serif)"],["Courier New","Courier New (mono)"],["Times New Roman","Times New Roman (serif)"],["Trebuchet MS","Trebuchet MS"]]);g.appendChild(y(n("Colour",W),n("Font",z))),g.appendChild(k("Formatting"));const T=s([["upper","Uppercase"],["lower","Lowercase"],["capitalize","Capitalise"],["none","None"]]),N=s([["underline","Underline"],["line-through","Line-through"],["none","None"]]);g.appendChild(y(n("Transform",T),n("Decoration",N)));const B=s([["tight","Tight"],["normal","Normal"],["wide","Wide"],["wider","Wider"]]),A=s([["left","Left"],["center","Centre"],["right","Right"],["justify","Justify"]]);g.appendChild(y(n("Spacing",B),n("Align",A))),g.appendChild(k("Advanced"));const R=p("e.g. margin-top:1rem;display:block");g.appendChild(n("Style",R));const _=p("CSS class(es)"),F=p("ID");g.appendChild(y(n("Class",_),n("ID",F)));const G=document.createElement("div");G.style.cssText="padding:.75rem;background:var(--dm-surface-subtle,#111);border-radius:4px;min-height:2.5rem;display:flex;align-items:center;";const D=document.createElement("span");D.textContent=d||"Preview text",G.appendChild(D),g.appendChild(n("Preview",G));const X={primary:"var(--dm-color-primary)",secondary:"var(--dm-color-secondary)",muted:"var(--dm-text-muted)",danger:"var(--dm-color-danger)",success:"var(--dm-color-success)",warning:"var(--dm-color-warning)",info:"var(--dm-color-info)"},Y={xs:".75rem",sm:".875rem",base:"1rem",lg:"1.125rem",xl:"1.25rem","2xl":"1.5rem","3xl":"1.875rem","4xl":"2.25rem"},ee={thin:"100",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},te={tight:"-0.05em",normal:"0em",wide:"0.05em",wider:"0.1em"},ne={Georgia:"Georgia,serif",Arial:"Arial,sans-serif",Verdana:"Verdana,sans-serif","Courier New":"'Courier New',monospace","Times New Roman":"'Times New Roman',serif","Trebuchet MS":"'Trebuchet MS',sans-serif"},oe={upper:"uppercase",lower:"lowercase",capitalize:"capitalize",none:"none"},ie={underline:"underline","line-through":"line-through",none:"none"};M.addEventListener("change",()=>{x.disabled=M.checked,M.checked&&(x.value=""),q()}),[C,x,z,T,N,B,A].forEach(m=>{m.addEventListener("change",q)}),[W,w,R,S].forEach(m=>{m.addEventListener("input",q)}),O.addEventListener("change",q);const P=document.createElement("button");P.type="button",P.className="btn btn-primary",P.textContent="Insert",g.appendChild(P);const K=E.modal({title:"Style Text",size:"md"});K.element.appendChild(g),K.open(),P.addEventListener("click",()=>{const m=w.value;if(!m.trim())return;const u=[];C.value&&u.push(`size="${C.value}"`);const f=parseFloat(S.value);!isNaN(f)&&f>0&&u.push(`point-size="${f}"`),M.checked?u.push("bold"):x.value&&u.push(`weight="${x.value}"`),O.checked&&u.push("italic"),W.value.trim()&&u.push(`color="${W.value.trim()}"`),z.value&&u.push(`font="${z.value}"`),T.value&&u.push(`transform="${T.value}"`),N.value&&u.push(`decoration="${N.value}"`),B.value&&u.push(`spacing="${B.value}"`),A.value&&u.push(`align="${A.value}"`),R.value.trim()&&u.push(`style="${R.value.trim().replace(/"/g,""")}"`),_.value.trim()&&u.push(`class="${_.value.trim()}"`),F.value.trim()&&u.push(`id="${F.value.trim()}"`);const H=`[text${u.length?" "+u.join(" "):""}]${m}[/text]`;K.close(),insertAtCursor(e,H),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}else t==="help"&&o.help&&o.help(e)}const J=[{icon:"bold",title:"Bold (Ctrl+B)",action:t=>wrapSelection(t,"**","**")},{icon:"italic",title:"Italic (Ctrl+I)",action:t=>wrapSelection(t,"_","_")},{icon:"strikethrough",title:"Strikethrough",action:t=>wrapSelection(t,"~~","~~")},"|",{type:"dropdown",icon:"heading-1",title:"Headings",items:[{label:"Heading 1",icon:"heading-1",action:t=>insertLine(t,"# ")},{label:"Heading 2",icon:"heading-2",action:t=>insertLine(t,"## ")},{label:"Heading 3",icon:"heading-3",action:t=>insertLine(t,"### ")}]},"|",{icon:"list-bullet",title:"Bullet list",action:t=>insertLine(t,"- ")},{icon:"list-numbered",title:"Numbered list",action:t=>insertLine(t,"1. ")},"|",{type:"dropdown",icon:"quote",title:"Paragraph",items:[{label:"Blockquote",icon:"quote",action:t=>insertLine(t,"> ")},{label:"Horizontal rule",icon:"minus-circle",action:t=>insertAtCursor(t,`
|
|
63
68
|
---
|
|
64
|
-
`)}]},"|",{type:"dropdown",icon:"code-inline",title:"Code",items:[{label:"Inline code",icon:"code-inline",action:t=>wrapSelection(t,"`","`")},{label:"Code block",icon:"code-block",action:t=>wrapSelection(t,"\n```\n","\n```\n")}]},"|",{type:"dropdown",icon:"plus-circle",title:"Insert",items:[{label:"Accordion",icon:"accordion-insert",action:"accordion"},{label:"Badge",icon:"badge",action:"badge"},{label:"Block",icon:"layout",action:"block"},{label:"Button",icon:"btn-insert",action:"button"},{label:"Card",icon:"card",action:"card"},{label:"Colour Picker",icon:"colour-picker",action:"colourpick"},{label:"Collection",icon:"database",action:"collection"},{label:"CTA Button",icon:"mouse-pointer",action:"cta"},{label:"Form",icon:"file-text",action:"form"},{label:"Grid",icon:"columns",action:"grid"},{label:"Hero",icon:"hero",action:"hero"},{label:"Icon",icon:"icon-pick",action:"iconpick"},{label:"Image",icon:"image-add",action:"image"},{label:"Link",icon:"link-shortcode",action:"linksc"},{label:"Spacer",icon:"spacer-insert",action:"spacerpick"},{label:"Tabs",icon:"layout-list",action:"tabs"},{label:"Text",icon:"text-style",action:"text"},{label:"Timeline",icon:"activity",action:"timeline"},{label:"View",icon:"eye",action:"view"}]},"|",{icon:"sparkles",title:"Effects",action:"effects"},{icon:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,h={}){re();const i={link:null,image:null,card:null,grid:null,help:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null},c=h.spacerDefault??40,o=t.get(0),l=e.get(0);l.textContent="",J.forEach((n,s)=>{if(n==="|"){const p=document.createElement("span");p.className="editor-toolbar-sep",l.appendChild(p)}else{const p=document.createElement("button");p.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",p.setAttribute("data-tooltip",n.title),p.setAttribute("data-idx",String(s)),p.type="button";const v=document.createElement("span");if(v.setAttribute("data-icon",n.icon),p.appendChild(v),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",p.appendChild(y)}l.appendChild(p)}});const r=document.createElement("div");r.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const s=document.createElement("button");s.className="editor-view-btn"+(n.active?" active":""),s.setAttribute("data-mode",n.mode),s.setAttribute("data-tooltip",n.label),s.type="button";const p=document.createElement("span");p.setAttribute("data-icon",n.icon),s.appendChild(p),r.appendChild(s)});const d=document.createElement("span");d.className="editor-toolbar-sep",r.appendChild(d);const a=document.createElement("button");a.id="fullscreen-btn",a.className="editor-toolbar-btn",a.setAttribute("data-tooltip","Toggle fullscreen"),a.type="button";const b=document.createElement("span");return b.setAttribute("data-icon","expand"),a.appendChild(b),r.appendChild(a),l.appendChild(r),Domma.icons.scan(),l.querySelectorAll("[data-tooltip]").forEach(n=>{E.tooltip(n,{content:n.getAttribute("data-tooltip"),position:"top"})}),e.on("click",".editor-toolbar-btn[data-idx]",function(){const n=parseInt($(this).data("idx"),10),s=J[n];if(!s||s==="|")return;const p=e.get(0).querySelector(`[data-idx="${n}"]`),v={spacerDefault:c,handlers:i};s.type==="dropdown"?de(o,p,s.items,v):U(s.action,o,p,v)}),attachEditorKeybindings(o),o.addEventListener("keydown",n=>{const s=n.key.toLowerCase();(n.ctrlKey||n.metaKey)&&(s==="b"?(n.preventDefault(),wrapSelection(o,"**","**")):s==="i"?(n.preventDefault(),wrapSelection(o,"_","_")):s==="k"&&(n.preventDefault(),i.link&&i.link(o)))}),{$toolbar:e,onLink(n){i.link=n},onImage(n){i.image=n},onCard(n){i.card=n},onGrid(n){i.grid=n},onHelp(n){i.help=n},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onAccordion(n){i.accordion=n}}}
|
|
69
|
+
`)}]},"|",{type:"dropdown",icon:"code-inline",title:"Code",items:[{label:"Inline code",icon:"code-inline",action:t=>wrapSelection(t,"`","`")},{label:"Code block",icon:"code-block",action:t=>wrapSelection(t,"\n```\n","\n```\n")}]},"|",{type:"dropdown",icon:"plus-circle",title:"Insert",items:[{label:"Accordion",icon:"accordion-insert",action:"accordion"},{label:"Badge",icon:"badge",action:"badge"},{label:"Block",icon:"layout",action:"block"},{label:"Button",icon:"btn-insert",action:"button"},{label:"Card",icon:"card",action:"card"},{label:"Colour Picker",icon:"colour-picker",action:"colourpick"},{label:"Collection",icon:"database",action:"collection"},{label:"CTA Button",icon:"mouse-pointer",action:"cta"},{label:"Form",icon:"file-text",action:"form"},{label:"Grid",icon:"columns",action:"grid"},{label:"Hero",icon:"hero",action:"hero"},{label:"Icon",icon:"icon-pick",action:"iconpick"},{label:"Image",icon:"image-add",action:"image"},{label:"Link",icon:"link-shortcode",action:"linksc"},{label:"List Group",icon:"list",action:"listgroup"},{label:"Spacer",icon:"spacer-insert",action:"spacerpick"},{label:"Tabs",icon:"layout-list",action:"tabs"},{label:"Text",icon:"text-style",action:"text"},{label:"Timeline",icon:"activity",action:"timeline"},{label:"View",icon:"eye",action:"view"}]},"|",{icon:"sparkles",title:"Effects",action:"effects"},{icon:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,h={}){re();const i={link:null,image:null,card:null,grid:null,help:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null},c=h.spacerDefault??40,o=t.get(0),l=e.get(0);l.textContent="",J.forEach((n,s)=>{if(n==="|"){const p=document.createElement("span");p.className="editor-toolbar-sep",l.appendChild(p)}else{const p=document.createElement("button");p.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",p.setAttribute("data-tooltip",n.title),p.setAttribute("data-idx",String(s)),p.type="button";const v=document.createElement("span");if(v.setAttribute("data-icon",n.icon),p.appendChild(v),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",p.appendChild(y)}l.appendChild(p)}});const r=document.createElement("div");r.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const s=document.createElement("button");s.className="editor-view-btn"+(n.active?" active":""),s.setAttribute("data-mode",n.mode),s.setAttribute("data-tooltip",n.label),s.type="button";const p=document.createElement("span");p.setAttribute("data-icon",n.icon),s.appendChild(p),r.appendChild(s)});const d=document.createElement("span");d.className="editor-toolbar-sep",r.appendChild(d);const a=document.createElement("button");a.id="fullscreen-btn",a.className="editor-toolbar-btn",a.setAttribute("data-tooltip","Toggle fullscreen"),a.type="button";const b=document.createElement("span");return b.setAttribute("data-icon","expand"),a.appendChild(b),r.appendChild(a),l.appendChild(r),Domma.icons.scan(),l.querySelectorAll("[data-tooltip]").forEach(n=>{E.tooltip(n,{content:n.getAttribute("data-tooltip"),position:"top"})}),e.on("click",".editor-toolbar-btn[data-idx]",function(){const n=parseInt($(this).data("idx"),10),s=J[n];if(!s||s==="|")return;const p=e.get(0).querySelector(`[data-idx="${n}"]`),v={spacerDefault:c,handlers:i};s.type==="dropdown"?de(o,p,s.items,v):U(s.action,o,p,v)}),attachEditorKeybindings(o),o.addEventListener("keydown",n=>{const s=n.key.toLowerCase();(n.ctrlKey||n.metaKey)&&(s==="b"?(n.preventDefault(),wrapSelection(o,"**","**")):s==="i"?(n.preventDefault(),wrapSelection(o,"_","_")):s==="k"&&(n.preventDefault(),i.link&&i.link(o)))}),{$toolbar:e,onLink(n){i.link=n},onImage(n){i.image=n},onCard(n){i.card=n},onGrid(n){i.grid=n},onHelp(n){i.help=n},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onAccordion(n){i.accordion=n},onListGroup(n){i.listgroup=n}}}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
import{api as
|
|
1
|
+
import{api as U}from"../api.js";import{attachEditorKeybindings as De,createToolbar as Re,insertAtCursor as xe}from"../lib/markdown-toolbar.js?v=9";import{populateThemeSelect as Pe}from"../lib/themes.js";function Fe(){const i=E.slideover({title:"Editor Reference",size:"md",position:"right"}),ue="background:var(--dm-surface-subtle,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;",Se="margin:1rem 0 .5rem;font-size:1rem;";function P(g){const b=document.createElement("code");return b.style.cssText=ue,b.textContent=g,b}function F(g){const b=document.createElement("h3");return b.style.cssText=Se,b.textContent=g,b}const ke=document.createElement("div");ke.style.cssText="padding:1rem;";const ge=document.createElement("div");ge.className="tabs";const Le=document.createElement("div");Le.className="tab-list",["Basics","Layout","Components","Data","Advanced"].forEach((g,b)=>{const t=document.createElement("button");t.className="tab-item"+(b===0?" active":""),t.textContent=g,Le.appendChild(t)});const Ce=document.createElement("div");Ce.className="tab-content";const _="display:flex;flex-direction:column;gap:1rem;",he=document.createElement("div");he.className="tab-panel active",he.style.cssText=_;const ie=document.createElement("div");ie.className="tab-panel",ie.style.cssText=_;const X=document.createElement("div");X.className="tab-panel",X.style.cssText=_;const ae=document.createElement("div");ae.className="tab-panel",ae.style.cssText=_;const be=document.createElement("div");be.className="tab-panel",be.style.cssText=_,Ce.appendChild(he),Ce.appendChild(ie),Ce.appendChild(X),Ce.appendChild(ae),Ce.appendChild(be),ge.appendChild(Le),ge.appendChild(Ce),ke.appendChild(ge);const Te=document.createElement("div");Te.appendChild(F("Markdown Basics"));const ve=document.createElement("table");ve.style.cssText="width:100%;border-collapse:collapse;font-size:.9em;";const W=document.createElement("thead"),G=document.createElement("tr");["Syntax","Result"].forEach(g=>{const b=document.createElement("th");b.style.cssText="text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);",b.textContent=g,G.appendChild(b)}),W.appendChild(G),ve.appendChild(W);const K=document.createElement("tbody");[["**bold**","bold (rendered bold)"],["_italic_","italic (rendered italic)"],["## Heading","Heading (h2)"],["[text](url)","Link"],["","Image"],["- item","Bullet list"],["`code`","Inline code"],["---","Divider"]].forEach(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.35rem .5rem;vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.35rem .5rem;vertical-align:top;color:var(--dm-text-muted,#aaa);font-size:.85em;",n.textContent=b,t.appendChild(e),t.appendChild(n),K.appendChild(t)}),ve.appendChild(K),Te.appendChild(ve),he.appendChild(Te);const Y=document.createElement("div");Y.appendChild(F("Grid & Columns"));function M(g){const b=document.createElement("p");return b.style.cssText="margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);",b.textContent=g,b}function z(g,b,t){const e=document.createElement("p");e.style.cssText="margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;",e.textContent=g;const n=document.createElement("div");n.style.cssText="position:relative;";const Q=document.createElement("pre");Q.style.cssText=ue+"display:block;padding:.5rem 2rem .5rem .75rem;white-space:pre;overflow-x:auto;margin:0;",Q.textContent=b;const Z=document.createElement("button");Z.type="button",Z.title="Copy code",Z.style.cssText="position:absolute;top:.3rem;right:.3rem;background:none;border:none;cursor:pointer;opacity:.45;padding:.15rem;line-height:1;color:inherit;",Z.addEventListener("mouseenter",()=>{Z.style.opacity="1"}),Z.addEventListener("mouseleave",()=>{Z.style.opacity=".45"});const ze=document.createElement("span");ze.setAttribute("data-icon","copy"),Z.appendChild(ze),Z.addEventListener("click",()=>{const Ae=document.createElement("textarea");Ae.value=b,Ae.style.cssText="position:fixed;opacity:0;",document.body.appendChild(Ae),Ae.select(),document.execCommand("copy"),Ae.remove(),E.toast("Copied!",{type:"success",duration:1200})}),n.appendChild(Q),n.appendChild(Z);const Ie=document.createDocumentFragment();return Ie.appendChild(e),Ie.appendChild(n),t&&Ie.appendChild(M(t)),Ie}const fe=document.createElement("table");fe.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['cols="N"',"[grid] only","Number of columns (1\u201312)"],['gap="N"',"[grid], [row]","Gap between columns/rows (1\u20136)"],['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(([g,b,t])=>{const e=document.createElement("tr");[g,b,t].forEach((n,Q)=>{const Z=document.createElement("td");Z.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",Q===0?Z.appendChild(P(g)):(Z.style.color="var(--dm-text-muted,#aaa)",Z.textContent=n),e.appendChild(Z)}),fe.appendChild(e)}),Y.appendChild(fe),Y.appendChild(z("Equal columns",`[grid cols="3" gap="4"]
|
|
2
2
|
[col]One[/col]
|
|
3
3
|
[col]Two[/col]
|
|
4
4
|
[col]Three[/col]
|
|
5
|
-
[/grid]`,"cols sets the track count; each [col] fills one track.")),Y.appendChild(
|
|
5
|
+
[/grid]`,"cols sets the track count; each [col] fills one track.")),Y.appendChild(z("Column spanning (12-col base)",`[grid cols="12" gap="3"]
|
|
6
6
|
[col span="8"]Main content[/col]
|
|
7
7
|
[col span="4"]Sidebar[/col]
|
|
8
|
-
[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),Y.appendChild(
|
|
8
|
+
[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),Y.appendChild(z("Row (flexbox, equal-width)",`[row gap="4"]
|
|
9
9
|
[col]Left[/col]
|
|
10
10
|
[col]Right[/col]
|
|
11
|
-
[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),Y.appendChild(
|
|
11
|
+
[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),Y.appendChild(z("Card in a grid",`[grid cols="3" gap="4"]
|
|
12
12
|
[col]
|
|
13
13
|
[card title="One"]Content[/card]
|
|
14
14
|
[/col]
|
|
@@ -18,21 +18,21 @@ import{api as _}from"../api.js";import{attachEditorKeybindings as De,createToolb
|
|
|
18
18
|
[col]
|
|
19
19
|
[card title="Three"]Content[/card]
|
|
20
20
|
[/col]
|
|
21
|
-
[/grid]`,null)),
|
|
21
|
+
[/grid]`,null)),ie.appendChild(Y);const ne=document.createElement("div");ne.appendChild(F("Cards")),ne.appendChild(z("Basic card",`[card title="Optional Title"]
|
|
22
22
|
Markdown **works** here.
|
|
23
|
-
[/card]`,"Omit title for a card with no header.")),ne.appendChild(
|
|
23
|
+
[/card]`,"Omit title for a card with no header.")),ne.appendChild(z("Icon \u2014 inline (default)",`[card title="Feature" icon="star"]
|
|
24
24
|
Icon sits left of the title in a flex row.
|
|
25
|
-
[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),ne.appendChild(
|
|
25
|
+
[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),ne.appendChild(z("Icon \u2014 stacked (centred)",`[card title="Feature" icon="star" icon-layout="stacked" hover]
|
|
26
26
|
Icon is centred above the title. Great for feature tiles.
|
|
27
|
-
[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),ne.appendChild(
|
|
27
|
+
[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),ne.appendChild(z("Icon with subtitle",`[card title="Feature" subtitle="Tagline here" icon="star" icon-layout="stacked"]
|
|
28
28
|
Body content.
|
|
29
|
-
[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),ne.appendChild(
|
|
29
|
+
[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),ne.appendChild(z("Collapsible card",`[card title="Click to expand" collapsible="true"]
|
|
30
30
|
Hidden by default.
|
|
31
|
-
[/card]`,null)),ne.appendChild(
|
|
31
|
+
[/card]`,null)),ne.appendChild(z("Full attribute reference",`[card title="Title" subtitle="Sub" icon="star" icon-layout="stacked"
|
|
32
32
|
variant="primary" hover footer="Footer text"
|
|
33
33
|
collapsible="true" class="extra" id="my-card"]
|
|
34
34
|
Body content.
|
|
35
|
-
[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),ne.appendChild(
|
|
35
|
+
[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),ne.appendChild(z("Rich header / footer sub-tags",`[card]
|
|
36
36
|
[header]
|
|
37
37
|
### Custom Title with **bold** and [a link](/about)
|
|
38
38
|
[/header]
|
|
@@ -42,45 +42,47 @@ Body content here.
|
|
|
42
42
|
[footer]
|
|
43
43
|
[Read more](/about) | [icon name="arrow-right" /]
|
|
44
44
|
[/footer]
|
|
45
|
-
[/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.")),X.appendChild(ne);const
|
|
45
|
+
[/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.")),X.appendChild(ne);const j=document.createElement("div");j.appendChild(F("Badge")),j.appendChild(M("Inline badge/label elements. Self-closing renders an empty coloured dot."));const q=document.createElement("table");q.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),q.appendChild(t)}),j.appendChild(q),j.appendChild(z("Basic badge",'[badge variant="success"]New[/badge]',null)),j.appendChild(z("Pill outline badge",'[badge variant="danger" outline pill]Deprecated[/badge]',null)),X.appendChild(j);const H=document.createElement("div");H.appendChild(F("Button")),H.appendChild(M("Renders a styled anchor as a Domma button. Use the Insert \u2192 Button toolbar item for a guided dialog."));const oe=document.createElement("table");oe.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),oe.appendChild(t)}),H.appendChild(oe),H.appendChild(z("Primary button",'[button href="/contact" variant="primary"]Get in touch[/button]',null)),H.appendChild(z("Self-closing with icon",'[button href="/download" variant="success" icon="download" size="sm" label="Download" /]',null)),H.appendChild(z("Opens in new tab",'[button href="https://example.com" variant="outline" target="_blank"]Visit site[/button]',null)),X.appendChild(H);const J=document.createElement("div");J.appendChild(F("Link (shortcode)")),J.appendChild(M("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 Ee=document.createElement("table");Ee.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),Ee.appendChild(t)}),J.appendChild(Ee),J.appendChild(z("External link in new tab",'[link href="https://example.com" target="_blank" icon-after="external-link"]Visit site[/link]',null)),J.appendChild(z("Self-closing with icon",'[link href="/about" icon="arrow-right" label="About us" /]',null)),X.appendChild(J);const se=document.createElement("div");se.appendChild(F("Spacer")),se.appendChild(M("Self-closing shortcode that inserts a fixed-height blank gap."));const a=document.createElement("table");a.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),a.appendChild(t)}),se.appendChild(a),se.appendChild(z("32px gap",'[spacer size="32" /]',null)),ie.appendChild(se);const l=document.createElement("div");l.appendChild(F("Icon")),l.appendChild(M("Self-closing shortcode that renders any Domma icon inline."));const r=document.createElement("table");r.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),r.appendChild(t)}),l.appendChild(r),l.appendChild(z("Coloured icon",'[icon name="star" size="24" color="#f5a623" /]',null)),X.appendChild(l);const d=document.createElement("div");d.appendChild(F("Center")),d.appendChild(M("Wraps content in a centred div. Works with any content including cards, grids, and text.")),d.appendChild(z("Example","[center]Centred content here[/center]",'Accepts an optional class="..." attribute for extra styling.')),ie.appendChild(d);const C=document.createElement("div");C.appendChild(F("Hero")),C.appendChild(M("Full-width hero sections \u2014 no plugin required. Uses Domma's built-in Hero CSS component."));const f=document.createElement("table");f.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),f.appendChild(t)}),C.appendChild(f),C.appendChild(z("Basic hero",'[hero title="Welcome" tagline="Build something great"][/hero]',null)),C.appendChild(z("Gradient with body content",`[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]
|
|
46
46
|
Some introductory **Markdown** content here.
|
|
47
|
-
[/hero]`,null)),C.appendChild(
|
|
47
|
+
[/hero]`,null)),C.appendChild(z("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.")),ie.appendChild(C);const p=document.createElement("div");p.appendChild(F("Interactive Components")),p.appendChild(M("Tabs, accordion, carousel, and countdown \u2014 no plugin required.")),p.appendChild(z("Tabs",`[tabs]
|
|
48
48
|
[tab title="First"]Content **A**[/tab]
|
|
49
49
|
[tab title="Second"]Content **B**[/tab]
|
|
50
|
-
[/tabs]`,'Add style="pills" for pill-style navigation.')),
|
|
50
|
+
[/tabs]`,'Add style="pills" for pill-style navigation.')),p.appendChild(z("Accordion",`[accordion]
|
|
51
51
|
[item title="Question 1"]Answer here.[/item]
|
|
52
52
|
[item title="Question 2"]Answer here.[/item]
|
|
53
|
-
[/accordion]`,'Add multiple="true" to allow several panels open at once.')),
|
|
53
|
+
[/accordion]`,'Add multiple="true" to allow several panels open at once.')),p.appendChild(z("Accordion \u2014 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.")),p.appendChild(z("Carousel",`[carousel autoplay="true" interval="5000"]
|
|
54
54
|
[slide title="Slide 1"]Description[/slide]
|
|
55
55
|
[slide image="/media/photo.jpg" title="Slide 2"]Caption[/slide]
|
|
56
|
-
[/carousel]`,'Omit autoplay for a manual carousel. loop="false" disables wrapping.')),
|
|
56
|
+
[/carousel]`,'Omit autoplay for a manual carousel. loop="false" disables wrapping.')),p.appendChild(z("Countdown (to date)",'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',null)),p.appendChild(z("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")),X.appendChild(p);const y=document.createElement("div");y.appendChild(F("Timeline")),y.appendChild(M("Renders a Domma Progression component with event items."));const v=document.createElement("table");v.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[['layout="vertical|centred|horizontal"',"[timeline] \u2014 layout orientation (default: vertical)"],['theme="minimal|corporate|modern"',"[timeline] \u2014 visual theme (default: minimal)"],['mode="timeline|roadmap"',"[timeline] \u2014 display mode (default: timeline)"],['class="..."',"[timeline] \u2014 extra CSS classes"],['id="..."',"[timeline] \u2014 element id"],['title="..."',"[event] \u2014 event heading"],['date="..."',"[event] \u2014 display date string"],['status="planned|in-progress|completed|blocked"',"[event] \u2014 progress status"],['icon="..."',"[event] \u2014 Domma icon name"]].forEach(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),v.appendChild(t)}),y.appendChild(v),y.appendChild(z("Vertical timeline",`[timeline layout="vertical" theme="modern"]
|
|
57
57
|
[event title="Kickoff" date="Jan 2025" status="completed" icon="flag"]
|
|
58
58
|
Project launched.
|
|
59
59
|
[/event]
|
|
60
60
|
[event title="Beta" date="Jun 2025" status="in-progress" icon="rocket"]
|
|
61
61
|
In active development.
|
|
62
62
|
[/event]
|
|
63
|
-
[/timeline]`,null)),X.appendChild(y);const
|
|
63
|
+
[/timeline]`,null)),X.appendChild(y);const h=document.createElement("div");h.appendChild(F("Embedding a Form"));const w=document.createElement("table");w.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),w.appendChild(t)}),h.appendChild(w),h.appendChild(z("Basic",'[form name="contact" /]',"Forms are managed under Forms in the sidebar.")),h.appendChild(z("With wrapper styling",'[form name="newsletter" class="mt-4" id="newsletter-form" /]',null)),ae.appendChild(h);const L=document.createElement("div");L.appendChild(F("Displaying a Collection"));const A=document.createElement("pre");A.style.cssText=ue+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;",A.textContent='[collection slug="enquiries" display="table" /]',L.appendChild(A);const k=[["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\u20134, default 3)."],["search","true/false \u2014 enable search in table mode (default true)."],["sortable","true/false \u2014 enable column sorting in table mode (default true)."],["exportable","true/false \u2014 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."]],S=document.createElement("table");S.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",k.forEach(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),S.appendChild(t)}),L.appendChild(S),L.appendChild(M("Table display uses Domma Table \u2014 search, sort, pagination, column selector, and CSV export are all built in. Cards and lists are static.")),ae.appendChild(L);const N=document.createElement("div");N.appendChild(F("View \u2014 Pro")),N.appendChild(M("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\u20134, 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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),u.appendChild(t)}),N.appendChild(u),N.appendChild(z("Table display",'[view slug="products" display="table" limit="50" /]',null)),N.appendChild(z("Cards display",'[view slug="team" display="cards" columns="3" title-field="name" /]',null)),ae.appendChild(N);const m=document.createElement("div");m.appendChild(F("CTA \u2014 Pro")),m.appendChild(M("Renders an action button that triggers a Pro Action against an entry. Requires the Pro Actions feature."));const s=document.createElement("table");s.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),s.appendChild(t)}),m.appendChild(s),m.appendChild(z("Wrapping form",'[cta action="approve" entry="abc123" style="success" confirm="Approve this entry?"]Approve[/cta]',null)),m.appendChild(z("Self-closing",'[cta action="archive" entry="abc123" icon="archive" label="Archive" /]',null)),ae.appendChild(m);const c=document.createElement("div");c.appendChild(F("Effects")),c.appendChild(M("Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin."));const o=[['[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 \u2014 simple mode (text typed letter by letter)"],['[scribe loop="true"][render]Text[/render][wait]1500[/wait][undo /][/scribe]',"Typewriter \u2014 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"]],x=document.createElement("table");x.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",o.forEach(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),x.appendChild(t)}),c.appendChild(x),c.appendChild(z("Scribe script \u2014 looping multi-phrase typewriter",`[scribe loop="true" loop-delay="2000" delete-speed="20"]
|
|
64
64
|
[render]We build things that matter.[/render]
|
|
65
65
|
[wait]1200[/wait]
|
|
66
66
|
[undo all="true" /]
|
|
67
67
|
[render]We design for humans.[/render]
|
|
68
68
|
[wait]1200[/wait]
|
|
69
69
|
[undo all="true" /]
|
|
70
|
-
[/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 \u2014 plain text between actions is ignored.')),
|
|
70
|
+
[/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 \u2014 plain text between actions is ignored.')),c.appendChild(M("Enable the Domma Effects plugin to activate these shortcodes on your site.")),be.appendChild(c);const T=document.createElement("div");T.appendChild(F("Tables")),T.appendChild(M("Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling."));const B=document.createElement("table");B.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),B.appendChild(t)}),T.appendChild(B),T.appendChild(z("Striped + bordered table",`[table striped="true" bordered="true" caption="Product Pricing"]
|
|
71
71
|
| Product | Price |
|
|
72
72
|
| ------- | ----: |
|
|
73
73
|
| Widget | $9.99 |
|
|
74
74
|
| Gadget | $14.99 |
|
|
75
|
-
[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),X.appendChild(
|
|
75
|
+
[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),X.appendChild(T);const O=document.createElement("div");O.appendChild(F("Slideover")),O.appendChild(M("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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),re.appendChild(t)}),O.appendChild(re),O.appendChild(z("Example",`[slideover title="More Info" trigger="Read more" size="md"]
|
|
76
76
|
## Details
|
|
77
77
|
Markdown content here.
|
|
78
|
-
[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),X.appendChild(
|
|
78
|
+
[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),X.appendChild(O);const le=document.createElement("div");le.appendChild(F("DConfig \u2014 Declarative Behaviour")),le.appendChild(M("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.")),le.appendChild(z("Toggle a class on click",'{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }','Selector keys use standard CSS selectors. "target" is optional \u2014 defaults to the element itself.')),le.appendChild(z("Inline shortcode syntax",`[dconfig]
|
|
79
79
|
{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }
|
|
80
|
-
[/dconfig]`,null)),be.appendChild(oe);const ce=document.createElement("div");ce.appendChild(P("CSS Editor")),ce.appendChild(q("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 \u2014 one Save, one toast."));const pe=document.createElement("table");pe.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(([u,p])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(B(u));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=p,t.appendChild(e),t.appendChild(n),pe.appendChild(t)}),ce.appendChild(pe),be.appendChild(ce);const ee=document.createElement("div");ee.appendChild(P("Colour Picker")),ee.appendChild(q("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.")),be.appendChild(ee);const ye=document.createElement("div");ye.appendChild(P("Keyboard Shortcuts"));const me=document.createElement("table");me.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(([u,p])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;white-space:nowrap;",e.appendChild(B(u));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=p,t.appendChild(e),t.appendChild(n),me.appendChild(t)}),ye.appendChild(me),he.appendChild(ye);const de=document.createElement("div");de.appendChild(P("Tips"));const O=document.createElement("table");O.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(([u,p])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(B(u));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=p,t.appendChild(e),t.appendChild(n),O.appendChild(t)}),de.appendChild(O),de.appendChild(q("Most shortcodes accept a class attribute for custom styling.")),he.appendChild(de),l.setContent(ke),l.open(),E.tabs(ge),I.scan(ke)}function Me(l,ue){const Se=l.find("#history-tab").get(0),B=l.find("#version-list").get(0),P=l.find("#version-compare").get(0),ke=l.find("#version-compare-old").get(0),ge=l.find("#version-compare-new").get(0),Le=l.find("#version-compare-label").get(0),Ce=l.find("#version-compare-back-btn").get(0),H=l.find("#version-restore-btn").get(0),he=l.find("#history-save-named-btn").get(0),se=l.find("#history-delete-selected-btn").get(0);let X=!1,ae=null;function be(){B.style.display="",P.style.display="none",ae=null}function Te(){B.style.display="none",P.style.display=""}async function ve(){B.textContent="";const W=document.createElement("p");W.style.color="var(--dm-text-muted)",W.textContent="Loading\u2026",B.appendChild(W);let G;try{G=(await _.versions.list(ue)).versions||[]}catch(M){B.textContent="";const V=document.createElement("p");V.style.color="var(--dm-text-danger,#e55)",V.textContent="Failed to load versions: "+M.message,B.appendChild(V);return}if(B.textContent="",se.style.display="none",!G.length){const M=document.createElement("p");M.style.color="var(--dm-text-muted)",M.textContent="No versions saved yet. Versions are created automatically on each save.",B.appendChild(M);return}const j=document.createElement("table");j.style.cssText="width:100%;border-collapse:collapse;font-size:.875rem;";const te=document.createElement("thead"),Y=document.createElement("tr"),q=document.createElement("th");q.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"),q.appendChild(w),Y.appendChild(q),["Date","Author","Type","Label","Actions"].forEach(M=>{const V=document.createElement("th");V.style.cssText="text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border);font-size:.8rem;color:var(--dm-text-muted);",V.textContent=M,Y.appendChild(V)}),te.appendChild(Y),j.appendChild(te);const fe=[];function ne(){const M=fe.some(le=>le.checked),V=fe.length>0&&fe.every(le=>le.checked);se.style.display=M?"":"none",w.checked=V,w.indeterminate=M&&!V}w.addEventListener("change",()=>{fe.forEach(M=>{M.checked=w.checked}),ne()});const K=document.createElement("tbody");G.forEach(M=>{const V=document.createElement("tr");V.style.borderBottom="1px solid var(--dm-border)";const le=document.createElement("td");le.style.padding=".5rem .75rem";const J=document.createElement("input");J.type="checkbox",J.value=M.filename,J.addEventListener("change",ne),le.appendChild(J),fe.push(J);const xe=document.createElement("td");xe.style.padding=".5rem .75rem",xe.textContent=D(M.createdAt).format("D MMM YYYY, HH:mm");const ie=document.createElement("td");ie.style.padding=".5rem .75rem",ie.textContent=M.author||"\u2014";const a=document.createElement("td");a.style.padding=".5rem .75rem";const i=document.createElement("span");i.className="badge badge-"+(M.type==="manual"?"primary":"secondary"),i.style.cssText="font-size:.75rem;padding:.2rem .5rem;border-radius:4px;",i.textContent=M.type,a.appendChild(i);const r=document.createElement("td");r.style.cssText="padding:.5rem .75rem;color:var(--dm-text-muted);",r.textContent=M.label||"\u2014";const o=document.createElement("td");o.style.padding=".5rem .75rem";const C=document.createElement("button");C.className="btn btn-ghost btn-xs",C.style.marginRight=".4rem",C.textContent="Compare",C.addEventListener("click",async()=>{try{const c=await _.versions.get(ue,M.filename);ke.textContent=c.content,ge.textContent=l.find("#markdown-editor").get(0).value,Le.textContent=D(M.createdAt).format("D MMM YYYY, HH:mm")+(M.label?` \u2014 ${M.label}`:""),ae=M.filename,Te()}catch(c){E.toast("Failed to load version: "+c.message,{type:"error"})}});const f=document.createElement("button");f.className="btn btn-ghost btn-xs",f.style.color="var(--dm-text-danger,#e55)",f.textContent="Delete",f.addEventListener("click",async()=>{if(await E.confirm("Delete this version? This cannot be undone."))try{await _.versions.delete(ue,M.filename),E.toast("Version deleted.",{type:"success"}),await ve()}catch(y){E.toast("Failed to delete: "+y.message,{type:"error"})}}),o.appendChild(C),o.appendChild(f),V.appendChild(le),V.appendChild(xe),V.appendChild(ie),V.appendChild(a),V.appendChild(r),V.appendChild(o),K.appendChild(V)}),j.appendChild(K),B.appendChild(j)}Se.addEventListener("click",async()=>{X||(X=!0,await ve())}),Ce.addEventListener("click",()=>{be()}),H.addEventListener("click",async()=>{if(!(!ae||!await E.confirm("Restore this version? The current page content will be overwritten (a pre-restore snapshot will be saved automatically).")))try{await _.versions.restore(ue,ae),E.toast("Page restored. Reloading editor\u2026",{type:"success"}),R.navigate("/pages"),setTimeout(()=>R.navigate(`/pages/edit${ue}`),300)}catch(G){E.toast("Restore failed: "+G.message,{type:"error"})}}),se.addEventListener("click",async()=>{const W=[...B.querySelectorAll("tbody input[type=checkbox]:checked")].map(j=>j.value);if(!(!W.length||!await E.confirm(`Delete ${W.length} version${W.length>1?"s":""}? This cannot be undone.`)))try{await _.versions.bulkDelete(ue,W),E.toast(`${W.length} version${W.length>1?"s":""} deleted.`,{type:"success"}),await ve()}catch(j){E.toast("Delete failed: "+j.message,{type:"error"})}}),he.addEventListener("click",()=>{const W=E.modal({title:"Save Named Version"}),G=document.createElement("div");G.style.padding="1rem";const j=document.createElement("label");j.className="form-label",j.textContent="Version Label";const te=document.createElement("input");te.type="text",te.className="form-input",te.placeholder="e.g. Initial design, Before restructure",te.style.marginBottom=".75rem";const Y=document.createElement("button");Y.className="btn btn-primary",Y.textContent="Save Version",Y.addEventListener("click",async()=>{const q=te.value.trim();try{await _.versions.create(ue,q||null),E.toast("Named version saved.",{type:"success"}),W.close(),X=!1,Se.classList.contains("active")&&(X=!0,await ve())}catch(w){E.toast("Failed to save version: "+w.message,{type:"error"})}}),G.appendChild(j),G.appendChild(te),G.appendChild(Y),W.element.appendChild(G),W.open(),setTimeout(()=>te.focus(),100)})}let we=!1,Ne=null,Be=!1;export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(l){const Se=window.location.hash.match(/#\/pages\/edit(\/.*)/),B=Se?Se[1]:null,P=!!B,ke=E.loader(l.get(0),{type:"dots"}),ge=[_.layouts.get().catch(()=>({})),_.settings.get().catch(()=>({}))];P&&(ge.push(_.pages.get(B).catch(()=>null)),ge.push(_.pages.list().catch(()=>[])));const[Le,Ce,H,he]=await Promise.all(ge);ke.destroy(),Pe(l.find("#field-theme").get(0),{includeDefault:!0});const se=Ce?.layoutOptions?.spacerSize??40;if(P&&!H){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}l.find("#editor-title").text(P?`Edit Page \u2014 ${H.title||B}`:"New Page"),P&&l.find("#page-url-path").val(B),H&&(l.find("#field-title").val(H.title||""),l.find("#field-description").val(H.description||""),l.find("#field-status").val(H.status||"draft"),l.find("#field-sort-order").val(H.sortOrder??99),l.find("#field-show-in-nav").prop("checked",!!H.showInNav),l.find("#field-sidebar").prop("checked",!!H.sidebar),l.find("#field-show-breadcrumbs").prop("checked",H.breadcrumbs!==!1),l.find("#field-category").val(H.category||""),l.find("#field-visibility").val(H.visibility||"public"),l.find("#field-theme").val(H.theme||""),l.find("#field-seo-title").val(H.seo?.title||""),l.find("#field-seo-desc").val(H.seo?.description||""),H.dconfig&&l.find("#field-dconfig").val(JSON.stringify(H.dconfig,null,2)));const X=l.find("#quick-switch");P&&Array.isArray(he)&&he.length&&([...he].sort((i,r)=>(i.title||i.urlPath).localeCompare(r.title||r.urlPath)).forEach(i=>{const r=document.createElement("option");r.value=i.urlPath,r.textContent=`${i.title||"Untitled"} (${i.urlPath})`,i.urlPath===B&&(r.selected=!0),X.get(0).appendChild(r)}),X.css("display",""),X.on("change",function(){const i=this.value;i&&R.navigate("/pages/edit"+i)}));const ae=await _.pages.tags().catch(()=>[]),be=l.find("#field-tags").get(0),Te=be?E.pillbox(be,{data:ae,value:H?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,ve=l.find("#field-layout").empty();if(Object.entries(Le).forEach(([a,i])=>{const r=(H?.layout||"default")===a?"selected":"";ve.append(`<option value="${a}" ${r}>${i.label||a}</option>`)}),P){const a=l.find("#view-page-btn").get(0);a.href=B,a.style.display="";const i=l.find("#live-preview-tab").get(0);i.style.display="";const r=l.find("#history-tab").get(0);r.style.display=""}if(E.tabs(l.find("#editor-meta-tabs").get(0)),P){const a=l.find("#live-preview-tab").get(0),i=l.find("#live-preview-frame").get(0);let r=!1;a.addEventListener("click",function(){r||(i.src=B,r=!0)}),Me(l,B)}const W=l.find("#markdown-editor"),G=l.find("#markdown-preview");H&&W.val(H.content||"");let j=!1,te="";_.settings.getCustomCss().then(({css:a})=>{if(te=a||"",!te)return;const i=document.createElement("style");i.id="preview-custom-css",i.textContent=te,G.get(0).parentNode.insertBefore(i,G.get(0))}).catch(()=>{});const Y=W.get(0),q=document.createElement("div");q.className="editor-line-numbers",Y.parentElement.insertBefore(q,Y);const w=()=>{const a=Y.value.split(`
|
|
81
|
-
`).length;
|
|
82
|
-
`),q.scrollTop=Y.scrollTop};w(),Y.addEventListener("input",w),Y.addEventListener("scroll",()=>{q.scrollTop=Y.scrollTop});let fe=null;const ne=()=>{clearTimeout(fe),fe=setTimeout(async()=>{try{const{html:a}=await _.pages.preview(W.val());G.html(a,{safe:!1}),I.scan(G.get(0)),G.get(0).querySelectorAll(".tabs").forEach(i=>Domma.elements.tabs(i))}catch{window.marked&&G.html(marked.parse(W.val()))}},400)},K=Re(W,l.find("#editor-toolbar"),{spacerDefault:se});let M=!1,V="split",le=null;const J=document.createElement("button");J.className="editor-view-btn",J.setAttribute("data-tooltip","Edit Custom CSS"),J.type="button";const xe=document.createElement("span");xe.setAttribute("data-icon","css-code"),J.appendChild(xe),I.scan(J),l.find(".editor-toolbar-right").get(0).prepend(J),J.addEventListener("click",()=>{M=!M;const a=l.find("#markdown-editor"),i=l.find("#css-editor"),r=l.find("#editor-body");if(M){const o=l.find(".editor-view-btn[data-mode].active").get(0);V=o?o.getAttribute("data-mode"):"split",l.find(".editor-view-btn[data-mode]").removeClass("active"),l.find('.editor-view-btn[data-mode="split"]').addClass("active"),r.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),a.hide(),i.show(),j||(i.val(te),j=!0,De(i.get(0))),J.classList.add("active")}else l.find(".editor-view-btn[data-mode]").removeClass("active"),l.find(`.editor-view-btn[data-mode="${V}"]`).addClass("active"),r.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${V}`),i.hide(),a.show(),J.classList.remove("active")}),l.find("#css-editor").on("input",()=>{clearTimeout(le),le=setTimeout(()=>{let a=document.getElementById("preview-custom-css");a||(a=document.createElement("style"),a.id="preview-custom-css",G.get(0).parentNode.insertBefore(a,G.get(0))),a.textContent=l.find("#css-editor").val()},400)}),K.onLink(async a=>{const r=(await _.pages.list().catch(()=>[])).map(h=>({label:h.title||h.urlPath,value:h.urlPath})),o=document.createElement("div");o.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C=document.createElement("label");C.className="form-label",C.textContent="URL";const f=document.createElement("input");f.type="text",f.className="form-input",f.placeholder="/about or https://example.com";const c=a.value.substring(a.selectionStart,a.selectionEnd);c&&c.startsWith("/")&&(f.value=c),o.appendChild(C),o.appendChild(f);const y=document.createElement("label");y.className="form-label",y.textContent="Link text";const v=document.createElement("input");v.type="text",v.className="form-input",v.placeholder="Display text",c&&!c.startsWith("/")&&(v.value=c),o.appendChild(y),o.appendChild(v);const b=document.createElement("label");b.className="form-label",b.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const x=document.createElement("input");x.type="checkbox",x.style.cssText="width:1rem;height:1rem;cursor:pointer;",b.appendChild(x),b.appendChild(document.createTextNode("Display as button")),o.appendChild(b);const T=document.createElement("label");T.className="form-label",T.textContent="Button colour",T.style.display="none";const z=document.createElement("select");z.className="form-select",z.style.display="none",[["primary","Primary"],["secondary","Secondary"],["success","Success (Green)"],["danger","Danger (Red)"],["warning","Warning (Orange)"],["info","Info (Blue)"],["outline","Outline"],["outline-success","Outline Success"],["outline-danger","Outline Danger"],["ghost","Ghost"]].forEach(([h,m])=>{const d=document.createElement("option");d.value=h,d.textContent=m,z.appendChild(d)}),o.appendChild(T),o.appendChild(z),x.addEventListener("change",()=>{const h=x.checked;T.style.display=h?"":"none",z.style.display=h?"":"none"});const k=document.createElement("button");k.type="button",k.className="btn btn-primary",k.textContent="Insert Link",o.appendChild(k);const A=E.modal({title:"Insert Link",size:"sm"});A.element.appendChild(o),A.open(),requestAnimationFrame(()=>{E.autocomplete(f,{data:r,minChars:1,onSelect:h=>{f.value=h.value,v.value||(v.value=h.label)}}),f.focus()}),k.addEventListener("click",()=>{const h=f.value.trim(),m=v.value.trim();if(!h)return;A.close();const d=x.checked?`[button href="${h}" variant="${z.value}"]${m||h}[/button]`:`[${m||h}](${h})`,g=a.selectionStart,s=a.selectionEnd;a.value=a.value.substring(0,g)+d+a.value.substring(s),a.selectionStart=a.selectionEnd=g+d.length,a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),K.onImage(async a=>{const r=(await _.media.list().catch(()=>[])).filter(f=>/\.(png|jpe?g|gif|webp|svg)$/i.test(f.name)),o=document.createElement("div");if(o.className="media-picker-grid",r.length)r.forEach(f=>{const c=document.createElement("div");c.className="media-picker-item",c.dataset.url=f.url;const y=document.createElement("img");y.src=f.url,y.alt=f.name;const v=document.createElement("span");v.textContent=f.name,c.appendChild(y),c.appendChild(v),o.appendChild(c)});else{const f=document.createElement("p");f.className="text-muted p-3",f.textContent="No images uploaded yet.",o.appendChild(f)}const C=E.modal({title:"Insert Image",size:"lg"});C.element.appendChild(o),$(C.element).on("click",".media-picker-item",function(){const f=$(this).data("url"),c=$(this).find("span").text();Ee(a,``),C.close(),W.get(0).dispatchEvent(new Event("input",{bubbles:!0}))}),C.open()}),K.onCollection(async a=>{const[i,r]=await Promise.all([_.collections.list().catch(()=>[]),_.blocks.list().catch(()=>[])]),o=document.createElement("div");o.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",c=document.createElement("div"),y=document.createElement("label");y.style.cssText=C,y.textContent="Collection";const v=document.createElement("select");if(v.style.cssText=f,i.length)i.forEach(e=>{const n=document.createElement("option");n.value=e.slug,n.textContent=e.title||e.slug,v.appendChild(n)});else{const e=document.createElement("option");e.value="",e.textContent="No collections found",v.appendChild(e)}c.appendChild(y),c.appendChild(v),o.appendChild(c);const b=document.createElement("div"),x=document.createElement("label");x.style.cssText=C,x.textContent="Display";const T=document.createElement("select");T.style.cssText=f,["table","cards","list","block"].forEach(e=>{const n=document.createElement("option");n.value=e,n.textContent=e.charAt(0).toUpperCase()+e.slice(1),T.appendChild(n)}),b.appendChild(x),b.appendChild(T),o.appendChild(b);const z=document.createElement("div");z.style.display="none";const L=document.createElement("label");L.style.cssText=C,L.textContent="Columns (2\u20134)";const k=document.createElement("input");k.type="number",k.min="2",k.max="4",k.value="3",k.style.cssText=f,z.appendChild(L),z.appendChild(k),o.appendChild(z);const A=document.createElement("div");A.style.display="none";const h=document.createElement("label");h.style.cssText=C,h.textContent="Block template";const m=document.createElement("select");if(m.style.cssText=f,r.length)r.forEach(e=>{const n=document.createElement("option");n.value=e.name??e,n.textContent=e.name??e,m.appendChild(n)});else{const e=document.createElement("option");e.value="",e.textContent="No block templates found",m.appendChild(e)}A.appendChild(h),A.appendChild(m),o.appendChild(A);const d=document.createElement("div"),g=document.createElement("label");g.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const s=document.createElement("input");s.type="checkbox",s.checked=!0,g.appendChild(s),g.appendChild(document.createTextNode("Enable search")),d.appendChild(g),o.appendChild(d);const S=document.createElement("div"),N=document.createElement("label");N.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const F=document.createElement("input");F.type="checkbox",F.checked=!0,N.appendChild(F),N.appendChild(document.createTextNode("Sortable columns")),S.appendChild(N),o.appendChild(S);const U=document.createElement("div"),re=document.createElement("label");re.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const oe=document.createElement("input");oe.type="checkbox",oe.checked=!1,re.appendChild(oe),re.appendChild(document.createTextNode("CSV export")),U.appendChild(re),o.appendChild(U);const ce=document.createElement("div"),pe=document.createElement("label");pe.style.cssText=C,pe.textContent="Rows per page";const ee=document.createElement("input");ee.type="number",ee.min="5",ee.max="100",ee.value="25",ee.style.cssText=f,ce.appendChild(pe),ce.appendChild(ee),o.appendChild(ce);const ye=document.createElement("div"),me=document.createElement("label");me.style.cssText=C,me.textContent="Limit (optional)";const de=document.createElement("input");de.type="number",de.placeholder="All",de.style.cssText=f,ye.appendChild(me),ye.appendChild(de),o.appendChild(ye);const O=document.createElement("button");O.type="button",O.className="btn btn-primary",O.textContent="Insert",o.appendChild(O);const u=[d,S,U,ce],p=()=>{const e=T.value,n=e==="table";u.forEach(Q=>{Q.style.display=n?"":"none"}),z.style.display=e==="cards"||e==="block"?"":"none",A.style.display=e==="block"?"":"none"};T.addEventListener("change",p),p();const t=E.modal({title:"Insert Collection",size:"sm"});t.element.appendChild(o),t.open(),O.addEventListener("click",()=>{const e=v.value;if(!e)return;const n=T.value;let Q=`[collection slug="${e}" display="${n}"`;if(n==="cards"&&(Q+=` columns="${k.value}"`),n==="block"){const ze=m.value;ze&&(Q+=` block="${ze}"`);const Ie=k.value.trim();Ie&&(Q+=` cols="${Ie}"`)}n==="table"&&!s.checked&&(Q+=' search="false"'),n==="table"&&!F.checked&&(Q+=' sortable="false"'),n==="table"&&oe.checked&&(Q+=' exportable="true"'),n==="table"&&ee.value!=="25"&&(Q+=` page-size="${ee.value}"`);const Z=de.value.trim();Z&&(Q+=` limit="${Z}"`),Q+=" /]",t.close(),Ee(a,Q),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),K.onBlock(async a=>{let i=[];try{i=await _.blocks.list()}catch{E.toast("Could not load blocks.",{type:"error"});return}if(!i.length){E.toast("No block templates found. Create one in Blocks first.",{type:"warning"});return}const r=E.modal({title:"Insert Block",size:"lg"}),o=document.createElement("div");o.style.cssText="display:flex;gap:1rem;min-height:320px;";const C=document.createElement("div");C.style.cssText="flex:1;display:flex;flex-direction:column;gap:.75rem;";const f=document.createElement("label");f.className="form-label",f.textContent="Block Template";const c=document.createElement("select");c.className="form-select";const y=document.createElement("option");y.value="",y.textContent="\u2014 select a template \u2014",c.appendChild(y),i.forEach(m=>{const d=document.createElement("option");d.value=m.name,d.textContent=m.name,c.appendChild(d)}),C.appendChild(f),C.appendChild(c);const v=document.createElement("div");v.style.cssText="display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;max-height:260px;",C.appendChild(v);const b=document.createElement("button");b.className="btn btn-primary",b.type="button",b.textContent="Insert",b.disabled=!0,C.appendChild(b);const x=document.createElement("div");x.style.cssText="flex:1;border:1px solid var(--dm-border-color);border-radius:var(--dm-radius);padding:.75rem;overflow:auto;background:var(--dm-surface-bg);";const T=document.createElement("p");T.className="text-muted",T.style.cssText="font-size:.8rem;margin:0;",T.textContent="Select a template to see a preview.",x.appendChild(T),o.appendChild(C),o.appendChild(x),r.element.appendChild(o),r.open();let z=null,L=[];function k(m){return m.replace(/_/g," ").replace(/\b\w/g,d=>d.toUpperCase())}function A(){if(!z)return;const m={};L.forEach(({key:g,input:s})=>{m[g]=s.value});const d=z.replace(/\{\{([\w_]+)\}\}/g,(g,s)=>(m[s]??"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"));x.innerHTML=DOMPurify.sanitize(d)}function h(m){v.textContent="",L=[];const d=new Set(["_id","_createdAt","_updatedAt"]),g=new Set;for(const[,s]of m.matchAll(/\{\{([\w_]+)\}\}/g))d.has(s)||g.add(s);if(!g.size){const s=document.createElement("p");s.className="text-muted",s.style.cssText="font-size:.8rem;margin:0;",s.textContent="No editable placeholders in this template.",v.appendChild(s);return}g.forEach(s=>{const S=document.createElement("div"),N=document.createElement("label");N.className="form-label",N.style.cssText="font-size:.8rem;margin-bottom:.2rem;display:block;",N.textContent=k(s);const F=document.createElement("input");F.type="text",F.className="form-input",F.placeholder=k(s),F.addEventListener("input",A),S.appendChild(N),S.appendChild(F),v.appendChild(S),L.push({key:s,input:F})})}c.addEventListener("change",async()=>{const m=c.value;if(!m){z=null,L=[],v.textContent="",x.textContent="",x.appendChild(T),b.disabled=!0;return}z=null,L=[],v.textContent="",b.disabled=!0;try{z=(await _.blocks.get(m)).content||"",h(z),A(),b.disabled=!1}catch{E.toast("Could not load template.",{type:"error"})}}),b.addEventListener("click",()=>{if(!c.value)return;const m=s=>s.replace(/"/g,""");let d=`template="${m(c.value)}"`;L.forEach(({key:s,input:S})=>{S.value!==""&&(d+=` ${s}="${m(S.value)}"`)});const g=`[block ${d} /]`;Ee(a,g),a.dispatchEvent(new Event("input",{bubbles:!0})),r.close(),a.focus()})}),K.onForm(async a=>{const i=await _.forms.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const o="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",f=document.createElement("div"),c=document.createElement("label");c.style.cssText=o,c.textContent="Form";const y=document.createElement("select");if(y.style.cssText=C,i.length)i.forEach(x=>{const T=document.createElement("option");T.value=x.slug,T.textContent=x.title||x.slug,y.appendChild(T)});else{const x=document.createElement("option");x.value="",x.textContent="No forms found",y.appendChild(x)}f.appendChild(c),f.appendChild(y),r.appendChild(f);const v=document.createElement("button");v.className="btn btn-primary btn-sm",v.style.cssText="align-self:flex-end;margin-top:.5rem;",v.textContent="Insert Form",r.appendChild(v);const b=E.modal({title:"Insert Form",size:"sm"});b.element.appendChild(r),b.open(),v.addEventListener("click",()=>{const x=y.value;x&&(Ee(a,`[form slug="${x}" /]`),b.close(),W.get(0).dispatchEvent(new Event("input",{bubbles:!0})))})}),K.onView(async a=>{const i=await _.views.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const o="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",f=document.createElement("div"),c=document.createElement("label");c.style.cssText=o,c.textContent="View";const y=document.createElement("select");if(y.style.cssText=C,i.length)i.forEach(L=>{const k=document.createElement("option");k.value=L.slug,k.textContent=L.title||L.slug,y.appendChild(k)});else{const L=document.createElement("option");L.value="",L.textContent="No Views configured yet \u2014 create one under Data \u2192 Views",y.appendChild(L)}f.appendChild(c),f.appendChild(y),r.appendChild(f);const v=document.createElement("div"),b=document.createElement("label");b.style.cssText=o,b.textContent="Display";const x=document.createElement("select");x.style.cssText=C,["table","cards","list"].forEach(L=>{const k=document.createElement("option");k.value=L,k.textContent=L.charAt(0).toUpperCase()+L.slice(1),x.appendChild(k)}),v.appendChild(b),v.appendChild(x),r.appendChild(v);const T=document.createElement("button");T.type="button",T.className="btn btn-primary",T.textContent="Insert",r.appendChild(T);const z=E.modal({title:"Insert View",size:"sm"});z.element.appendChild(r),z.open(),T.addEventListener("click",()=>{const L=y.value;if(!L)return;const k=`[view slug="${L}" display="${x.value}" /]`;z.close(),Ee(a,k),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),K.onCta(async a=>{const i=await _.actions.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const o="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function f(h,m){const d=document.createElement("div"),g=document.createElement("label");return g.style.cssText=o,g.textContent=h,d.appendChild(g),d.appendChild(m),d}function c(h){const m=document.createElement("select");return m.style.cssText=C,h.forEach(([d,g])=>{const s=document.createElement("option");s.value=d,s.textContent=g,m.appendChild(s)}),m}function y(h,m,d){const g=document.createElement("input");return g.type=h,g.placeholder=m||"",g.value=d||"",g.style.cssText=C,g}const v=c(i.length?i.map(h=>[h.slug,h.title||h.slug]):[["","No Actions configured yet \u2014 create one under Data \u2192 Actions"]]);r.appendChild(f("Action",v));const b=y("text","Button label","Run");if(r.appendChild(f("Label",b)),v.addEventListener("change",()=>{const h=i.find(m=>m.slug===v.value);h?.trigger?.label&&(b.value=h.trigger.label)}),i.length){const h=i[0];h?.trigger?.label&&(b.value=h.trigger.label)}const x=y("text","Paste entry UUID\u2026","");r.appendChild(f("Entry ID",x));const T=c([["primary","Primary"],["secondary","Secondary"],["ghost","Ghost"],["danger","Danger"]]);r.appendChild(f("Style",T));const z=y("text","e.g. check, zap, send (optional)","");r.appendChild(f("Icon",z));const L=y("text","Confirmation message (optional)","");r.appendChild(f("Confirm prompt",L));const k=document.createElement("button");k.type="button",k.className="btn btn-primary",k.textContent="Insert",r.appendChild(k);const A=E.modal({title:"Insert CTA Button",size:"sm"});A.element.appendChild(r),A.open(),k.addEventListener("click",()=>{const h=v.value;if(!h)return;const m=x.value.trim(),d=(b.value.trim()||"Run").replace(/\[\/cta\]/gi,""),g=T.value,s=z.value.trim().replace(/"/g,""),S=L.value.trim().replace(/"/g,""),N=m.replace(/"/g,"");let F=`action="${h}" style="${g}"`;N&&(F+=` entry="${N}"`),s&&(F+=` icon="${s}"`),S&&(F+=` confirm="${S}"`);const U=`[cta ${F}]${d}[/cta]`;A.close(),Ee(a,U),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),K.onButton(async a=>{const r=(await _.pages.list().catch(()=>[])).map(s=>({label:s.title||s.urlPath,value:s.urlPath})),o=document.createElement("div");o.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function c(s,S){const N=document.createElement("div"),F=document.createElement("label");return F.style.cssText=C,F.textContent=s,N.appendChild(F),N.appendChild(S),N}function y(s,S){const N=document.createElement("input");return N.type="text",N.placeholder=s,N.value=S||"",N.style.cssText=f,N}function v(s){const S=document.createElement("select");return S.style.cssText=f,s.forEach(([N,F])=>{const U=document.createElement("option");U.value=N,U.textContent=F,S.appendChild(U)}),S}const b=a.value.substring(a.selectionStart,a.selectionEnd),x=y("/about or https://example.com",b.startsWith("/")?b:"");o.appendChild(c("URL",x));const T=y("Button label",b&&!b.startsWith("/")?b:"");o.appendChild(c("Label",T));const z=v([["primary","Primary"],["secondary","Secondary"],["success","Success (Green)"],["danger","Danger (Red)"],["warning","Warning (Orange)"],["info","Info (Blue)"],["outline","Outline"],["ghost","Ghost"],["link","Link"],["outline-success","Outline Success"],["outline-danger","Outline Danger"]]);o.appendChild(c("Variant",z));const L=v([["","Default"],["sm","Small"],["lg","Large"]]);o.appendChild(c("Size",L));const k=y("e.g. arrow-right, star (optional)","");o.appendChild(c("Icon (before label)",k));const A=y("e.g. arrow-right (optional)","");o.appendChild(c("Icon (after label)",A));const h=document.createElement("label");h.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const m=document.createElement("input");m.type="checkbox",m.style.cssText="width:1rem;height:1rem;",h.appendChild(m),h.appendChild(document.createTextNode("Open in new tab")),o.appendChild(h);const d=document.createElement("button");d.type="button",d.className="btn btn-primary",d.textContent="Insert Button",o.appendChild(d);const g=E.modal({title:"Insert Button",size:"sm"});g.element.appendChild(o),g.open(),requestAnimationFrame(()=>{E.autocomplete(x,{data:r,minChars:1,onSelect:s=>{x.value=s.value,T.value||(T.value=s.label)}}),x.focus()}),d.addEventListener("click",()=>{const s=x.value.trim();if(!s)return;g.close();const S=T.value.trim()||s;let N=`href="${s}" variant="${z.value}"`;L.value&&(N+=` size="${L.value}"`);const F=k.value.trim().replace(/"/g,"");F&&(N+=` icon="${F}"`);const U=A.value.trim().replace(/"/g,"");U&&(N+=` icon-after="${U}"`),m.checked&&(N+=' target="_blank"');const re=`[button ${N}]${S}[/button]`;Ee(a,re)})}),K.onLinkShortcode(async a=>{const r=(await _.pages.list().catch(()=>[])).map(d=>({label:d.title||d.urlPath,value:d.urlPath})),o=document.createElement("div");o.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function c(d,g){const s=document.createElement("div"),S=document.createElement("label");return S.style.cssText=C,S.textContent=d,s.appendChild(S),s.appendChild(g),s}function y(d,g){const s=document.createElement("input");return s.type="text",s.placeholder=d,s.value=g||"",s.style.cssText=f,s}const v=a.value.substring(a.selectionStart,a.selectionEnd),b=y("/about or https://example.com",v.startsWith("/")?v:"");o.appendChild(c("URL",b));const x=y("Link text",v&&!v.startsWith("/")?v:"");o.appendChild(c("Link text",x));const T=y("e.g. text-primary, fw-bold (optional)","");o.appendChild(c("CSS class",T));const z=y("e.g. arrow-right (optional)","");o.appendChild(c("Icon (before text)",z));const L=y("e.g. external-link (optional)","");o.appendChild(c("Icon (after text)",L));const k=document.createElement("label");k.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const A=document.createElement("input");A.type="checkbox",A.style.cssText="width:1rem;height:1rem;",k.appendChild(A),k.appendChild(document.createTextNode("Open in new tab")),o.appendChild(k);const h=document.createElement("button");h.type="button",h.className="btn btn-primary",h.textContent="Insert Link",o.appendChild(h);const m=E.modal({title:"Insert Link Shortcode",size:"sm"});m.element.appendChild(o),m.open(),requestAnimationFrame(()=>{E.autocomplete(b,{data:r,minChars:1,onSelect:d=>{b.value=d.value,x.value||(x.value=d.label)}}),b.focus()}),h.addEventListener("click",()=>{const d=b.value.trim();if(!d)return;m.close();const g=x.value.trim()||d;let s=`href="${d}"`;const S=T.value.trim().replace(/"/g,"");S&&(s+=` class="${S}"`);const N=z.value.trim().replace(/"/g,"");N&&(s+=` icon="${N}"`);const F=L.value.trim().replace(/"/g,"");F&&(s+=` icon-after="${F}"`),A.checked&&(s+=' target="_blank"');const U=`[link ${s}]${g}[/link]`;Ee(a,U)})}),K.onTabs(a=>{const i=document.createElement("div");i.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const r="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",o="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function C(h,m){const d=document.createElement("div"),g=document.createElement("label");return g.style.cssText=r,g.textContent=h,d.appendChild(g),d.appendChild(m),d}function f(h){const m=document.createElement("select");return m.style.cssText=o,h.forEach(([d,g])=>{const s=document.createElement("option");s.value=d,s.textContent=g,m.appendChild(s)}),m}const c=f([["","Default (underline)"],["pills","Pills"]]);i.appendChild(C("Style",c));const y=f([["","Left"],["center","Centre"]]);i.appendChild(C("Alignment",y));const v=document.createElement("div");v.style.cssText="display:flex;flex-direction:column;gap:.4rem;";const b=[];function x(){b.forEach(h=>{h.removeBtn.disabled=b.length<=2,h.removeBtn.style.opacity=b.length<=2?"0.3":"1"})}function T(h){const m=document.createElement("div");m.style.cssText="display:flex;gap:.4rem;align-items:center;";const d=document.createElement("input");d.type="text",d.placeholder="Tab title",d.value=h||"",d.style.cssText=o+"flex:1;";const g=document.createElement("button");g.type="button",g.textContent="\u2715",g.style.cssText="padding:.3rem .5rem;background:transparent;border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;flex-shrink:0;";const s={row:m,input:d,removeBtn:g};b.push(s),m.appendChild(d),m.appendChild(g),v.appendChild(m),g.addEventListener("click",()=>{if(b.length<=2)return;const S=b.indexOf(s);b.splice(S,1),v.removeChild(m),x()}),x()}T("Overview"),T("Details");const z=document.createElement("div");z.style.cssText=r,z.textContent="Tabs",i.appendChild(z),i.appendChild(v);const L=document.createElement("button");L.type="button",L.textContent="+ Add Tab",L.style.cssText="padding:.35rem .75rem;background:transparent;border:1px dashed var(--dm-border,#555);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;align-self:flex-start;",L.addEventListener("click",()=>{b.length>=10||(T(""),b[b.length-1].input.focus())}),i.appendChild(L);const k=document.createElement("button");k.type="button",k.className="btn btn-primary",k.textContent="Insert Tabs",i.appendChild(k);const A=E.modal({title:"Insert Tabs",size:"sm"});A.element.appendChild(i),A.open(),requestAnimationFrame(()=>b[0].input.focus()),k.addEventListener("click",()=>{A.close();const h=c.value,m=y.value;let d=h?` style="${h}"`:"";m&&(d+=` align="${m}"`);let g=`[tabs${d}]
|
|
83
|
-
`;
|
|
84
|
-
`}),
|
|
85
|
-
`,
|
|
86
|
-
`}),
|
|
80
|
+
[/dconfig]`,null)),be.appendChild(le);const ce=document.createElement("div");ce.appendChild(F("CSS Editor")),ce.appendChild(M("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 \u2014 one Save, one toast."));const pe=document.createElement("table");pe.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),pe.appendChild(t)}),ce.appendChild(pe),be.appendChild(ce);const ee=document.createElement("div");ee.appendChild(F("Colour Picker")),ee.appendChild(M("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.")),be.appendChild(ee);const ye=document.createElement("div");ye.appendChild(F("Keyboard Shortcuts"));const me=document.createElement("table");me.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;white-space:nowrap;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),me.appendChild(t)}),ye.appendChild(me),he.appendChild(ye);const de=document.createElement("div");de.appendChild(F("Tips"));const V=document.createElement("table");V.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(([g,b])=>{const t=document.createElement("tr"),e=document.createElement("td");e.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",e.appendChild(P(g));const n=document.createElement("td");n.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",n.textContent=b,t.appendChild(e),t.appendChild(n),V.appendChild(t)}),de.appendChild(V),de.appendChild(M("Most shortcodes accept a class attribute for custom styling.")),he.appendChild(de),i.setContent(ke),i.open(),E.tabs(ge),I.scan(ke)}function qe(i,ue){const Se=i.find("#history-tab").get(0),P=i.find("#version-list").get(0),F=i.find("#version-compare").get(0),ke=i.find("#version-compare-old").get(0),ge=i.find("#version-compare-new").get(0),Le=i.find("#version-compare-label").get(0),Ce=i.find("#version-compare-back-btn").get(0),_=i.find("#version-restore-btn").get(0),he=i.find("#history-save-named-btn").get(0),ie=i.find("#history-delete-selected-btn").get(0);let X=!1,ae=null;function be(){P.style.display="",F.style.display="none",ae=null}function Te(){P.style.display="none",F.style.display=""}async function ve(){P.textContent="";const W=document.createElement("p");W.style.color="var(--dm-text-muted)",W.textContent="Loading\u2026",P.appendChild(W);let G;try{G=(await U.versions.list(ue)).versions||[]}catch(q){P.textContent="";const H=document.createElement("p");H.style.color="var(--dm-text-danger,#e55)",H.textContent="Failed to load versions: "+q.message,P.appendChild(H);return}if(P.textContent="",ie.style.display="none",!G.length){const q=document.createElement("p");q.style.color="var(--dm-text-muted)",q.textContent="No versions saved yet. Versions are created automatically on each save.",P.appendChild(q);return}const K=document.createElement("table");K.style.cssText="width:100%;border-collapse:collapse;font-size:.875rem;";const te=document.createElement("thead"),Y=document.createElement("tr"),M=document.createElement("th");M.style.cssText="padding:.5rem .75rem;width:2rem;border-bottom:1px solid var(--dm-border);";const z=document.createElement("input");z.type="checkbox",z.setAttribute("aria-label","Select all versions"),M.appendChild(z),Y.appendChild(M),["Date","Author","Type","Label","Actions"].forEach(q=>{const H=document.createElement("th");H.style.cssText="text-align:left;padding:.5rem .75rem;border-bottom:1px solid var(--dm-border);font-size:.8rem;color:var(--dm-text-muted);",H.textContent=q,Y.appendChild(H)}),te.appendChild(Y),K.appendChild(te);const fe=[];function ne(){const q=fe.some(oe=>oe.checked),H=fe.length>0&&fe.every(oe=>oe.checked);ie.style.display=q?"":"none",z.checked=H,z.indeterminate=q&&!H}z.addEventListener("change",()=>{fe.forEach(q=>{q.checked=z.checked}),ne()});const j=document.createElement("tbody");G.forEach(q=>{const H=document.createElement("tr");H.style.borderBottom="1px solid var(--dm-border)";const oe=document.createElement("td");oe.style.padding=".5rem .75rem";const J=document.createElement("input");J.type="checkbox",J.value=q.filename,J.addEventListener("change",ne),oe.appendChild(J),fe.push(J);const Ee=document.createElement("td");Ee.style.padding=".5rem .75rem",Ee.textContent=D(q.createdAt).format("D MMM YYYY, HH:mm");const se=document.createElement("td");se.style.padding=".5rem .75rem",se.textContent=q.author||"\u2014";const a=document.createElement("td");a.style.padding=".5rem .75rem";const l=document.createElement("span");l.className="badge badge-"+(q.type==="manual"?"primary":"secondary"),l.style.cssText="font-size:.75rem;padding:.2rem .5rem;border-radius:4px;",l.textContent=q.type,a.appendChild(l);const r=document.createElement("td");r.style.cssText="padding:.5rem .75rem;color:var(--dm-text-muted);",r.textContent=q.label||"\u2014";const d=document.createElement("td");d.style.padding=".5rem .75rem";const C=document.createElement("button");C.className="btn btn-ghost btn-xs",C.style.marginRight=".4rem",C.textContent="Compare",C.addEventListener("click",async()=>{try{const p=await U.versions.get(ue,q.filename);ke.textContent=p.content,ge.textContent=i.find("#markdown-editor").get(0).value,Le.textContent=D(q.createdAt).format("D MMM YYYY, HH:mm")+(q.label?` \u2014 ${q.label}`:""),ae=q.filename,Te()}catch(p){E.toast("Failed to load version: "+p.message,{type:"error"})}});const f=document.createElement("button");f.className="btn btn-ghost btn-xs",f.style.color="var(--dm-text-danger,#e55)",f.textContent="Delete",f.addEventListener("click",async()=>{if(await E.confirm("Delete this version? This cannot be undone."))try{await U.versions.delete(ue,q.filename),E.toast("Version deleted.",{type:"success"}),await ve()}catch(y){E.toast("Failed to delete: "+y.message,{type:"error"})}}),d.appendChild(C),d.appendChild(f),H.appendChild(oe),H.appendChild(Ee),H.appendChild(se),H.appendChild(a),H.appendChild(r),H.appendChild(d),j.appendChild(H)}),K.appendChild(j),P.appendChild(K)}Se.addEventListener("click",async()=>{X||(X=!0,await ve())}),Ce.addEventListener("click",()=>{be()}),_.addEventListener("click",async()=>{if(!(!ae||!await E.confirm("Restore this version? The current page content will be overwritten (a pre-restore snapshot will be saved automatically).")))try{await U.versions.restore(ue,ae),E.toast("Page restored. Reloading editor\u2026",{type:"success"}),R.navigate("/pages"),setTimeout(()=>R.navigate(`/pages/edit${ue}`),300)}catch(G){E.toast("Restore failed: "+G.message,{type:"error"})}}),ie.addEventListener("click",async()=>{const W=[...P.querySelectorAll("tbody input[type=checkbox]:checked")].map(K=>K.value);if(!(!W.length||!await E.confirm(`Delete ${W.length} version${W.length>1?"s":""}? This cannot be undone.`)))try{await U.versions.bulkDelete(ue,W),E.toast(`${W.length} version${W.length>1?"s":""} deleted.`,{type:"success"}),await ve()}catch(K){E.toast("Delete failed: "+K.message,{type:"error"})}}),he.addEventListener("click",()=>{const W=E.modal({title:"Save Named Version"}),G=document.createElement("div");G.style.padding="1rem";const K=document.createElement("label");K.className="form-label",K.textContent="Version Label";const te=document.createElement("input");te.type="text",te.className="form-input",te.placeholder="e.g. Initial design, Before restructure",te.style.marginBottom=".75rem";const Y=document.createElement("button");Y.className="btn btn-primary",Y.textContent="Save Version",Y.addEventListener("click",async()=>{const M=te.value.trim();try{await U.versions.create(ue,M||null),E.toast("Named version saved.",{type:"success"}),W.close(),X=!1,Se.classList.contains("active")&&(X=!0,await ve())}catch(z){E.toast("Failed to save version: "+z.message,{type:"error"})}}),G.appendChild(K),G.appendChild(te),G.appendChild(Y),W.element.appendChild(G),W.open(),setTimeout(()=>te.focus(),100)})}let we=!1,Ne=null,Be=!1;export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(i){const Se=window.location.hash.match(/#\/pages\/edit(\/.*)/),P=Se?Se[1]:null,F=!!P,ke=E.loader(i.get(0),{type:"dots"}),ge=[U.layouts.get().catch(()=>({})),U.settings.get().catch(()=>({}))];F&&(ge.push(U.pages.get(P).catch(()=>null)),ge.push(U.pages.list().catch(()=>[])));const[Le,Ce,_,he]=await Promise.all(ge);ke.destroy(),Pe(i.find("#field-theme").get(0),{includeDefault:!0});const ie=Ce?.layoutOptions?.spacerSize??40;if(F&&!_){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}i.find("#editor-title").text(F?`Edit Page \u2014 ${_.title||P}`:"New Page"),F&&i.find("#page-url-path").val(P),_&&(i.find("#field-title").val(_.title||""),i.find("#field-description").val(_.description||""),i.find("#field-status").val(_.status||"draft"),i.find("#field-sort-order").val(_.sortOrder??99),i.find("#field-show-in-nav").prop("checked",!!_.showInNav),i.find("#field-sidebar").prop("checked",!!_.sidebar),i.find("#field-show-breadcrumbs").prop("checked",_.breadcrumbs!==!1),i.find("#field-category").val(_.category||""),i.find("#field-visibility").val(_.visibility||"public"),i.find("#field-theme").val(_.theme||""),i.find("#field-seo-title").val(_.seo?.title||""),i.find("#field-seo-desc").val(_.seo?.description||""),_.dconfig&&i.find("#field-dconfig").val(JSON.stringify(_.dconfig,null,2)));const X=i.find("#quick-switch");F&&Array.isArray(he)&&he.length&&([...he].sort((l,r)=>(l.title||l.urlPath).localeCompare(r.title||r.urlPath)).forEach(l=>{const r=document.createElement("option");r.value=l.urlPath,r.textContent=`${l.title||"Untitled"} (${l.urlPath})`,l.urlPath===P&&(r.selected=!0),X.get(0).appendChild(r)}),X.css("display",""),X.on("change",function(){const l=this.value;l&&R.navigate("/pages/edit"+l)}));const ae=await U.pages.tags().catch(()=>[]),be=i.find("#field-tags").get(0),Te=be?E.pillbox(be,{data:ae,value:_?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,ve=i.find("#field-layout").empty();if(Object.entries(Le).forEach(([a,l])=>{const r=(_?.layout||"default")===a?"selected":"";ve.append(`<option value="${a}" ${r}>${l.label||a}</option>`)}),F){const a=i.find("#view-page-btn").get(0);a.href=P,a.style.display="";const l=i.find("#live-preview-tab").get(0);l.style.display="";const r=i.find("#history-tab").get(0);r.style.display=""}if(E.tabs(i.find("#editor-meta-tabs").get(0)),F){const a=i.find("#live-preview-tab").get(0),l=i.find("#live-preview-frame").get(0);let r=!1;a.addEventListener("click",function(){r||(l.src=P,r=!0)}),qe(i,P)}const W=i.find("#markdown-editor"),G=i.find("#markdown-preview");_&&W.val(_.content||"");let K=!1,te="";U.settings.getCustomCss().then(({css:a})=>{if(te=a||"",!te)return;const l=document.createElement("style");l.id="preview-custom-css",l.textContent=te,G.get(0).parentNode.insertBefore(l,G.get(0))}).catch(()=>{});const Y=W.get(0),M=document.createElement("div");M.className="editor-line-numbers",Y.parentElement.insertBefore(M,Y);const z=()=>{const a=Y.value.split(`
|
|
81
|
+
`).length;M.textContent=Array.from({length:a},(l,r)=>r+1).join(`
|
|
82
|
+
`),M.scrollTop=Y.scrollTop};z(),Y.addEventListener("input",z),Y.addEventListener("scroll",()=>{M.scrollTop=Y.scrollTop});let fe=null;const ne=()=>{clearTimeout(fe),fe=setTimeout(async()=>{try{const{html:a}=await U.pages.preview(W.val());G.html(a,{safe:!1}),I.scan(G.get(0)),G.get(0).querySelectorAll(".tabs").forEach(l=>Domma.elements.tabs(l))}catch{window.marked&&G.html(marked.parse(W.val()))}},400)},j=Re(W,i.find("#editor-toolbar"),{spacerDefault:ie});let q=!1,H="split",oe=null;const J=document.createElement("button");J.className="editor-view-btn",J.setAttribute("data-tooltip","Edit Custom CSS"),J.type="button";const Ee=document.createElement("span");Ee.setAttribute("data-icon","css-code"),J.appendChild(Ee),I.scan(J),i.find(".editor-toolbar-right").get(0).prepend(J),J.addEventListener("click",()=>{q=!q;const a=i.find("#markdown-editor"),l=i.find("#css-editor"),r=i.find("#editor-body");if(q){const d=i.find(".editor-view-btn[data-mode].active").get(0);H=d?d.getAttribute("data-mode"):"split",i.find(".editor-view-btn[data-mode]").removeClass("active"),i.find('.editor-view-btn[data-mode="split"]').addClass("active"),r.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),a.hide(),l.show(),K||(l.val(te),K=!0,De(l.get(0))),J.classList.add("active")}else i.find(".editor-view-btn[data-mode]").removeClass("active"),i.find(`.editor-view-btn[data-mode="${H}"]`).addClass("active"),r.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${H}`),l.hide(),a.show(),J.classList.remove("active")}),i.find("#css-editor").on("input",()=>{clearTimeout(oe),oe=setTimeout(()=>{let a=document.getElementById("preview-custom-css");a||(a=document.createElement("style"),a.id="preview-custom-css",G.get(0).parentNode.insertBefore(a,G.get(0))),a.textContent=i.find("#css-editor").val()},400)}),j.onLink(async a=>{const r=(await U.pages.list().catch(()=>[])).map(u=>({label:u.title||u.urlPath,value:u.urlPath})),d=document.createElement("div");d.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C=document.createElement("label");C.className="form-label",C.textContent="URL";const f=document.createElement("input");f.type="text",f.className="form-input",f.placeholder="/about or https://example.com";const p=a.value.substring(a.selectionStart,a.selectionEnd);p&&p.startsWith("/")&&(f.value=p),d.appendChild(C),d.appendChild(f);const y=document.createElement("label");y.className="form-label",y.textContent="Link text";const v=document.createElement("input");v.type="text",v.className="form-input",v.placeholder="Display text",p&&!p.startsWith("/")&&(v.value=p),d.appendChild(y),d.appendChild(v);const h=document.createElement("label");h.className="form-label",h.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const w=document.createElement("input");w.type="checkbox",w.style.cssText="width:1rem;height:1rem;cursor:pointer;",h.appendChild(w),h.appendChild(document.createTextNode("Display as button")),d.appendChild(h);const L=document.createElement("label");L.className="form-label",L.textContent="Button colour",L.style.display="none";const A=document.createElement("select");A.className="form-select",A.style.display="none",[["primary","Primary"],["secondary","Secondary"],["success","Success (Green)"],["danger","Danger (Red)"],["warning","Warning (Orange)"],["info","Info (Blue)"],["outline","Outline"],["outline-success","Outline Success"],["outline-danger","Outline Danger"],["ghost","Ghost"]].forEach(([u,m])=>{const s=document.createElement("option");s.value=u,s.textContent=m,A.appendChild(s)}),d.appendChild(L),d.appendChild(A),w.addEventListener("change",()=>{const u=w.checked;L.style.display=u?"":"none",A.style.display=u?"":"none"});const S=document.createElement("button");S.type="button",S.className="btn btn-primary",S.textContent="Insert Link",d.appendChild(S);const N=E.modal({title:"Insert Link",size:"sm"});N.element.appendChild(d),N.open(),requestAnimationFrame(()=>{E.autocomplete(f,{data:r,minChars:1,onSelect:u=>{f.value=u.value,v.value||(v.value=u.label)}}),f.focus()}),S.addEventListener("click",()=>{const u=f.value.trim(),m=v.value.trim();if(!u)return;N.close();const s=w.checked?`[button href="${u}" variant="${A.value}"]${m||u}[/button]`:`[${m||u}](${u})`,c=a.selectionStart,o=a.selectionEnd;a.value=a.value.substring(0,c)+s+a.value.substring(o),a.selectionStart=a.selectionEnd=c+s.length,a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onImage(async a=>{const r=(await U.media.list().catch(()=>[])).filter(f=>/\.(png|jpe?g|gif|webp|svg)$/i.test(f.name)),d=document.createElement("div");if(d.className="media-picker-grid",r.length)r.forEach(f=>{const p=document.createElement("div");p.className="media-picker-item",p.dataset.url=f.url;const y=document.createElement("img");y.src=f.url,y.alt=f.name;const v=document.createElement("span");v.textContent=f.name,p.appendChild(y),p.appendChild(v),d.appendChild(p)});else{const f=document.createElement("p");f.className="text-muted p-3",f.textContent="No images uploaded yet.",d.appendChild(f)}const C=E.modal({title:"Insert Image",size:"lg"});C.element.appendChild(d),$(C.element).on("click",".media-picker-item",function(){const f=$(this).data("url"),p=$(this).find("span").text();xe(a,``),C.close(),W.get(0).dispatchEvent(new Event("input",{bubbles:!0}))}),C.open()}),j.onCollection(async a=>{const[l,r]=await Promise.all([U.collections.list().catch(()=>[]),U.blocks.list().catch(()=>[])]),d=document.createElement("div");d.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",p=document.createElement("div"),y=document.createElement("label");y.style.cssText=C,y.textContent="Collection";const v=document.createElement("select");if(v.style.cssText=f,l.length)l.forEach(e=>{const n=document.createElement("option");n.value=e.slug,n.textContent=e.title||e.slug,v.appendChild(n)});else{const e=document.createElement("option");e.value="",e.textContent="No collections found",v.appendChild(e)}p.appendChild(y),p.appendChild(v),d.appendChild(p);const h=document.createElement("div"),w=document.createElement("label");w.style.cssText=C,w.textContent="Display";const L=document.createElement("select");L.style.cssText=f,["table","cards","list","block"].forEach(e=>{const n=document.createElement("option");n.value=e,n.textContent=e.charAt(0).toUpperCase()+e.slice(1),L.appendChild(n)}),h.appendChild(w),h.appendChild(L),d.appendChild(h);const A=document.createElement("div");A.style.display="none";const k=document.createElement("label");k.style.cssText=C,k.textContent="Columns (2\u20134)";const S=document.createElement("input");S.type="number",S.min="2",S.max="4",S.value="3",S.style.cssText=f,A.appendChild(k),A.appendChild(S),d.appendChild(A);const N=document.createElement("div");N.style.display="none";const u=document.createElement("label");u.style.cssText=C,u.textContent="Block template";const m=document.createElement("select");if(m.style.cssText=f,r.length)r.forEach(e=>{const n=document.createElement("option");n.value=e.name??e,n.textContent=e.name??e,m.appendChild(n)});else{const e=document.createElement("option");e.value="",e.textContent="No block templates found",m.appendChild(e)}N.appendChild(u),N.appendChild(m),d.appendChild(N);const s=document.createElement("div"),c=document.createElement("label");c.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const o=document.createElement("input");o.type="checkbox",o.checked=!0,c.appendChild(o),c.appendChild(document.createTextNode("Enable search")),s.appendChild(c),d.appendChild(s);const x=document.createElement("div"),T=document.createElement("label");T.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const B=document.createElement("input");B.type="checkbox",B.checked=!0,T.appendChild(B),T.appendChild(document.createTextNode("Sortable columns")),x.appendChild(T),d.appendChild(x);const O=document.createElement("div"),re=document.createElement("label");re.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const le=document.createElement("input");le.type="checkbox",le.checked=!1,re.appendChild(le),re.appendChild(document.createTextNode("CSV export")),O.appendChild(re),d.appendChild(O);const ce=document.createElement("div"),pe=document.createElement("label");pe.style.cssText=C,pe.textContent="Rows per page";const ee=document.createElement("input");ee.type="number",ee.min="5",ee.max="100",ee.value="25",ee.style.cssText=f,ce.appendChild(pe),ce.appendChild(ee),d.appendChild(ce);const ye=document.createElement("div"),me=document.createElement("label");me.style.cssText=C,me.textContent="Limit (optional)";const de=document.createElement("input");de.type="number",de.placeholder="All",de.style.cssText=f,ye.appendChild(me),ye.appendChild(de),d.appendChild(ye);const V=document.createElement("button");V.type="button",V.className="btn btn-primary",V.textContent="Insert",d.appendChild(V);const g=[s,x,O,ce],b=()=>{const e=L.value,n=e==="table";g.forEach(Q=>{Q.style.display=n?"":"none"}),A.style.display=e==="cards"||e==="block"?"":"none",N.style.display=e==="block"?"":"none"};L.addEventListener("change",b),b();const t=E.modal({title:"Insert Collection",size:"sm"});t.element.appendChild(d),t.open(),V.addEventListener("click",()=>{const e=v.value;if(!e)return;const n=L.value;let Q=`[collection slug="${e}" display="${n}"`;if(n==="cards"&&(Q+=` columns="${S.value}"`),n==="block"){const ze=m.value;ze&&(Q+=` block="${ze}"`);const Ie=S.value.trim();Ie&&(Q+=` cols="${Ie}"`)}n==="table"&&!o.checked&&(Q+=' search="false"'),n==="table"&&!B.checked&&(Q+=' sortable="false"'),n==="table"&&le.checked&&(Q+=' exportable="true"'),n==="table"&&ee.value!=="25"&&(Q+=` page-size="${ee.value}"`);const Z=de.value.trim();Z&&(Q+=` limit="${Z}"`),Q+=" /]",t.close(),xe(a,Q),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onBlock(async a=>{let l=[];try{l=await U.blocks.list()}catch{E.toast("Could not load blocks.",{type:"error"});return}if(!l.length){E.toast("No block templates found. Create one in Blocks first.",{type:"warning"});return}const r=E.modal({title:"Insert Block",size:"lg"}),d=document.createElement("div");d.style.cssText="display:flex;gap:1rem;min-height:320px;";const C=document.createElement("div");C.style.cssText="flex:1;display:flex;flex-direction:column;gap:.75rem;";const f=document.createElement("label");f.className="form-label",f.textContent="Block Template";const p=document.createElement("select");p.className="form-select";const y=document.createElement("option");y.value="",y.textContent="\u2014 select a template \u2014",p.appendChild(y),l.forEach(m=>{const s=document.createElement("option");s.value=m.name,s.textContent=m.name,p.appendChild(s)}),C.appendChild(f),C.appendChild(p);const v=document.createElement("div");v.style.cssText="display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;max-height:260px;",C.appendChild(v);const h=document.createElement("button");h.className="btn btn-primary",h.type="button",h.textContent="Insert",h.disabled=!0,C.appendChild(h);const w=document.createElement("div");w.style.cssText="flex:1;border:1px solid var(--dm-border-color);border-radius:var(--dm-radius);padding:.75rem;overflow:auto;background:var(--dm-surface-bg);";const L=document.createElement("p");L.className="text-muted",L.style.cssText="font-size:.8rem;margin:0;",L.textContent="Select a template to see a preview.",w.appendChild(L),d.appendChild(C),d.appendChild(w),r.element.appendChild(d),r.open();let A=null,k=[];function S(m){return m.replace(/_/g," ").replace(/\b\w/g,s=>s.toUpperCase())}function N(){if(!A)return;const m={};k.forEach(({key:c,input:o})=>{m[c]=o.value});const s=A.replace(/\{\{([\w_]+)\}\}/g,(c,o)=>(m[o]??"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"));w.innerHTML=DOMPurify.sanitize(s)}function u(m){v.textContent="",k=[];const s=new Set(["_id","_createdAt","_updatedAt"]),c=new Set;for(const[,o]of m.matchAll(/\{\{([\w_]+)\}\}/g))s.has(o)||c.add(o);if(!c.size){const o=document.createElement("p");o.className="text-muted",o.style.cssText="font-size:.8rem;margin:0;",o.textContent="No editable placeholders in this template.",v.appendChild(o);return}c.forEach(o=>{const x=document.createElement("div"),T=document.createElement("label");T.className="form-label",T.style.cssText="font-size:.8rem;margin-bottom:.2rem;display:block;",T.textContent=S(o);const B=document.createElement("input");B.type="text",B.className="form-input",B.placeholder=S(o),B.addEventListener("input",N),x.appendChild(T),x.appendChild(B),v.appendChild(x),k.push({key:o,input:B})})}p.addEventListener("change",async()=>{const m=p.value;if(!m){A=null,k=[],v.textContent="",w.textContent="",w.appendChild(L),h.disabled=!0;return}A=null,k=[],v.textContent="",h.disabled=!0;try{A=(await U.blocks.get(m)).content||"",u(A),N(),h.disabled=!1}catch{E.toast("Could not load template.",{type:"error"})}}),h.addEventListener("click",()=>{if(!p.value)return;const m=o=>o.replace(/"/g,""");let s=`template="${m(p.value)}"`;k.forEach(({key:o,input:x})=>{x.value!==""&&(s+=` ${o}="${m(x.value)}"`)});const c=`[block ${s} /]`;xe(a,c),a.dispatchEvent(new Event("input",{bubbles:!0})),r.close(),a.focus()})}),j.onForm(async a=>{const l=await U.forms.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const d="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",f=document.createElement("div"),p=document.createElement("label");p.style.cssText=d,p.textContent="Form";const y=document.createElement("select");if(y.style.cssText=C,l.length)l.forEach(w=>{const L=document.createElement("option");L.value=w.slug,L.textContent=w.title||w.slug,y.appendChild(L)});else{const w=document.createElement("option");w.value="",w.textContent="No forms found",y.appendChild(w)}f.appendChild(p),f.appendChild(y),r.appendChild(f);const v=document.createElement("button");v.className="btn btn-primary btn-sm",v.style.cssText="align-self:flex-end;margin-top:.5rem;",v.textContent="Insert Form",r.appendChild(v);const h=E.modal({title:"Insert Form",size:"sm"});h.element.appendChild(r),h.open(),v.addEventListener("click",()=>{const w=y.value;w&&(xe(a,`[form slug="${w}" /]`),h.close(),W.get(0).dispatchEvent(new Event("input",{bubbles:!0})))})}),j.onView(async a=>{const l=await U.views.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const d="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",f=document.createElement("div"),p=document.createElement("label");p.style.cssText=d,p.textContent="View";const y=document.createElement("select");if(y.style.cssText=C,l.length)l.forEach(k=>{const S=document.createElement("option");S.value=k.slug,S.textContent=k.title||k.slug,y.appendChild(S)});else{const k=document.createElement("option");k.value="",k.textContent="No Views configured yet \u2014 create one under Data \u2192 Views",y.appendChild(k)}f.appendChild(p),f.appendChild(y),r.appendChild(f);const v=document.createElement("div"),h=document.createElement("label");h.style.cssText=d,h.textContent="Display";const w=document.createElement("select");w.style.cssText=C,["table","cards","list"].forEach(k=>{const S=document.createElement("option");S.value=k,S.textContent=k.charAt(0).toUpperCase()+k.slice(1),w.appendChild(S)}),v.appendChild(h),v.appendChild(w),r.appendChild(v);const L=document.createElement("button");L.type="button",L.className="btn btn-primary",L.textContent="Insert",r.appendChild(L);const A=E.modal({title:"Insert View",size:"sm"});A.element.appendChild(r),A.open(),L.addEventListener("click",()=>{const k=y.value;if(!k)return;const S=`[view slug="${k}" display="${w.value}" /]`;A.close(),xe(a,S),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onCta(async a=>{const l=await U.actions.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const d="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function f(u,m){const s=document.createElement("div"),c=document.createElement("label");return c.style.cssText=d,c.textContent=u,s.appendChild(c),s.appendChild(m),s}function p(u){const m=document.createElement("select");return m.style.cssText=C,u.forEach(([s,c])=>{const o=document.createElement("option");o.value=s,o.textContent=c,m.appendChild(o)}),m}function y(u,m,s){const c=document.createElement("input");return c.type=u,c.placeholder=m||"",c.value=s||"",c.style.cssText=C,c}const v=p(l.length?l.map(u=>[u.slug,u.title||u.slug]):[["","No Actions configured yet \u2014 create one under Data \u2192 Actions"]]);r.appendChild(f("Action",v));const h=y("text","Button label","Run");if(r.appendChild(f("Label",h)),v.addEventListener("change",()=>{const u=l.find(m=>m.slug===v.value);u?.trigger?.label&&(h.value=u.trigger.label)}),l.length){const u=l[0];u?.trigger?.label&&(h.value=u.trigger.label)}const w=y("text","Paste entry UUID\u2026","");r.appendChild(f("Entry ID",w));const L=p([["primary","Primary"],["secondary","Secondary"],["ghost","Ghost"],["danger","Danger"]]);r.appendChild(f("Style",L));const A=y("text","e.g. check, zap, send (optional)","");r.appendChild(f("Icon",A));const k=y("text","Confirmation message (optional)","");r.appendChild(f("Confirm prompt",k));const S=document.createElement("button");S.type="button",S.className="btn btn-primary",S.textContent="Insert",r.appendChild(S);const N=E.modal({title:"Insert CTA Button",size:"sm"});N.element.appendChild(r),N.open(),S.addEventListener("click",()=>{const u=v.value;if(!u)return;const m=w.value.trim(),s=(h.value.trim()||"Run").replace(/\[\/cta\]/gi,""),c=L.value,o=A.value.trim().replace(/"/g,""),x=k.value.trim().replace(/"/g,""),T=m.replace(/"/g,"");let B=`action="${u}" style="${c}"`;T&&(B+=` entry="${T}"`),o&&(B+=` icon="${o}"`),x&&(B+=` confirm="${x}"`);const O=`[cta ${B}]${s}[/cta]`;N.close(),xe(a,O),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onButton(async a=>{const r=(await U.pages.list().catch(()=>[])).map(o=>({label:o.title||o.urlPath,value:o.urlPath})),d=document.createElement("div");d.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function p(o,x){const T=document.createElement("div"),B=document.createElement("label");return B.style.cssText=C,B.textContent=o,T.appendChild(B),T.appendChild(x),T}function y(o,x){const T=document.createElement("input");return T.type="text",T.placeholder=o,T.value=x||"",T.style.cssText=f,T}function v(o){const x=document.createElement("select");return x.style.cssText=f,o.forEach(([T,B])=>{const O=document.createElement("option");O.value=T,O.textContent=B,x.appendChild(O)}),x}const h=a.value.substring(a.selectionStart,a.selectionEnd),w=y("/about or https://example.com",h.startsWith("/")?h:"");d.appendChild(p("URL",w));const L=y("Button label",h&&!h.startsWith("/")?h:"");d.appendChild(p("Label",L));const A=v([["primary","Primary"],["secondary","Secondary"],["success","Success (Green)"],["danger","Danger (Red)"],["warning","Warning (Orange)"],["info","Info (Blue)"],["outline","Outline"],["ghost","Ghost"],["link","Link"],["outline-success","Outline Success"],["outline-danger","Outline Danger"]]);d.appendChild(p("Variant",A));const k=v([["","Default"],["sm","Small"],["lg","Large"]]);d.appendChild(p("Size",k));const S=y("e.g. arrow-right, star (optional)","");d.appendChild(p("Icon (before label)",S));const N=y("e.g. arrow-right (optional)","");d.appendChild(p("Icon (after label)",N));const u=document.createElement("label");u.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const m=document.createElement("input");m.type="checkbox",m.style.cssText="width:1rem;height:1rem;",u.appendChild(m),u.appendChild(document.createTextNode("Open in new tab")),d.appendChild(u);const s=document.createElement("button");s.type="button",s.className="btn btn-primary",s.textContent="Insert Button",d.appendChild(s);const c=E.modal({title:"Insert Button",size:"sm"});c.element.appendChild(d),c.open(),requestAnimationFrame(()=>{E.autocomplete(w,{data:r,minChars:1,onSelect:o=>{w.value=o.value,L.value||(L.value=o.label)}}),w.focus()}),s.addEventListener("click",()=>{const o=w.value.trim();if(!o)return;c.close();const x=L.value.trim()||o;let T=`href="${o}" variant="${A.value}"`;k.value&&(T+=` size="${k.value}"`);const B=S.value.trim().replace(/"/g,"");B&&(T+=` icon="${B}"`);const O=N.value.trim().replace(/"/g,"");O&&(T+=` icon-after="${O}"`),m.checked&&(T+=' target="_blank"');const re=`[button ${T}]${x}[/button]`;xe(a,re)})}),j.onLinkShortcode(async a=>{const r=(await U.pages.list().catch(()=>[])).map(s=>({label:s.title||s.urlPath,value:s.urlPath})),d=document.createElement("div");d.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const C="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",f="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function p(s,c){const o=document.createElement("div"),x=document.createElement("label");return x.style.cssText=C,x.textContent=s,o.appendChild(x),o.appendChild(c),o}function y(s,c){const o=document.createElement("input");return o.type="text",o.placeholder=s,o.value=c||"",o.style.cssText=f,o}const v=a.value.substring(a.selectionStart,a.selectionEnd),h=y("/about or https://example.com",v.startsWith("/")?v:"");d.appendChild(p("URL",h));const w=y("Link text",v&&!v.startsWith("/")?v:"");d.appendChild(p("Link text",w));const L=y("e.g. text-primary, fw-bold (optional)","");d.appendChild(p("CSS class",L));const A=y("e.g. arrow-right (optional)","");d.appendChild(p("Icon (before text)",A));const k=y("e.g. external-link (optional)","");d.appendChild(p("Icon (after text)",k));const S=document.createElement("label");S.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const N=document.createElement("input");N.type="checkbox",N.style.cssText="width:1rem;height:1rem;",S.appendChild(N),S.appendChild(document.createTextNode("Open in new tab")),d.appendChild(S);const u=document.createElement("button");u.type="button",u.className="btn btn-primary",u.textContent="Insert Link",d.appendChild(u);const m=E.modal({title:"Insert Link Shortcode",size:"sm"});m.element.appendChild(d),m.open(),requestAnimationFrame(()=>{E.autocomplete(h,{data:r,minChars:1,onSelect:s=>{h.value=s.value,w.value||(w.value=s.label)}}),h.focus()}),u.addEventListener("click",()=>{const s=h.value.trim();if(!s)return;m.close();const c=w.value.trim()||s;let o=`href="${s}"`;const x=L.value.trim().replace(/"/g,"");x&&(o+=` class="${x}"`);const T=A.value.trim().replace(/"/g,"");T&&(o+=` icon="${T}"`);const B=k.value.trim().replace(/"/g,"");B&&(o+=` icon-after="${B}"`),N.checked&&(o+=' target="_blank"');const O=`[link ${o}]${c}[/link]`;xe(a,O)})}),j.onTabs(a=>{const l=document.createElement("div");l.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const r="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",d="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function C(u,m){const s=document.createElement("div"),c=document.createElement("label");return c.style.cssText=r,c.textContent=u,s.appendChild(c),s.appendChild(m),s}function f(u){const m=document.createElement("select");return m.style.cssText=d,u.forEach(([s,c])=>{const o=document.createElement("option");o.value=s,o.textContent=c,m.appendChild(o)}),m}const p=f([["","Default (underline)"],["pills","Pills"]]);l.appendChild(C("Style",p));const y=f([["","Left"],["center","Centre"]]);l.appendChild(C("Alignment",y));const v=document.createElement("div");v.style.cssText="display:flex;flex-direction:column;gap:.4rem;";const h=[];function w(){h.forEach(u=>{u.removeBtn.disabled=h.length<=2,u.removeBtn.style.opacity=h.length<=2?"0.3":"1"})}function L(u){const m=document.createElement("div");m.style.cssText="display:flex;gap:.4rem;align-items:center;";const s=document.createElement("input");s.type="text",s.placeholder="Tab title",s.value=u||"",s.style.cssText=d+"flex:1;";const c=document.createElement("button");c.type="button",c.textContent="\u2715",c.style.cssText="padding:.3rem .5rem;background:transparent;border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;flex-shrink:0;";const o={row:m,input:s,removeBtn:c};h.push(o),m.appendChild(s),m.appendChild(c),v.appendChild(m),c.addEventListener("click",()=>{if(h.length<=2)return;const x=h.indexOf(o);h.splice(x,1),v.removeChild(m),w()}),w()}L("Overview"),L("Details");const A=document.createElement("div");A.style.cssText=r,A.textContent="Tabs",l.appendChild(A),l.appendChild(v);const k=document.createElement("button");k.type="button",k.textContent="+ Add Tab",k.style.cssText="padding:.35rem .75rem;background:transparent;border:1px dashed var(--dm-border,#555);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;align-self:flex-start;",k.addEventListener("click",()=>{h.length>=10||(L(""),h[h.length-1].input.focus())}),l.appendChild(k);const S=document.createElement("button");S.type="button",S.className="btn btn-primary",S.textContent="Insert Tabs",l.appendChild(S);const N=E.modal({title:"Insert Tabs",size:"sm"});N.element.appendChild(l),N.open(),requestAnimationFrame(()=>h[0].input.focus()),S.addEventListener("click",()=>{N.close();const u=p.value,m=y.value;let s=u?` style="${u}"`:"";m&&(s+=` align="${m}"`);let c=`[tabs${s}]
|
|
83
|
+
`;h.forEach((o,x)=>{const T=o.input.value.trim()||`Tab ${x+1}`;c+=`[tab title="${T}"]Tab content here.[/tab]
|
|
84
|
+
`}),c+="[/tabs]",xe(a,c),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onAccordion(async a=>{const l=await U.collections.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const d="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",C="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;",f=document.createElement("div");f.style.cssText="display:flex;gap:.5rem;";const p=document.createElement("button");p.type="button",p.className="btn btn-sm btn-primary",p.textContent="Static";const y=document.createElement("button");y.type="button",y.className="btn btn-sm btn-ghost",y.textContent="Collection",f.appendChild(p),f.appendChild(y),r.appendChild(f);let v="static";const h=document.createElement("div");h.style.cssText="display:flex;flex-direction:column;gap:.5rem;";const w=[];function L(V){const g=document.createElement("div");g.style.cssText="display:flex;align-items:center;gap:.5rem;";const b=document.createElement("label");b.style.cssText="font-size:.85em;color:var(--dm-text-muted,#aaa);white-space:nowrap;",b.textContent=`Item ${V}`;const t=document.createElement("input");return t.type="text",t.placeholder="Item title",t.style.cssText=C,g.appendChild(b),g.appendChild(t),{row:g,input:t}}[1,2].forEach(V=>{const g=L(V);w.push(g),h.appendChild(g.row)});const A=document.createElement("button");A.type="button",A.className="btn btn-ghost btn-sm",A.textContent="+ Add Item",A.addEventListener("click",()=>{const V=L(w.length+1);w.push(V),h.insertBefore(V.row,A)}),h.appendChild(A);const k=document.createElement("label");k.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const S=document.createElement("input");S.type="checkbox",k.appendChild(S),k.appendChild(document.createTextNode("Allow multiple open")),h.appendChild(k),r.appendChild(h);const N=document.createElement("div");N.style.cssText="display:none;flex-direction:column;gap:.5rem;";const u=document.createElement("div"),m=document.createElement("label");m.style.cssText=d,m.textContent="Collection";const s=document.createElement("select");if(s.style.cssText=C,l.length)l.forEach(V=>{const g=document.createElement("option");g.value=V.slug,g.textContent=V.title||V.slug,s.appendChild(g)});else{const V=document.createElement("option");V.value="",V.textContent="No collections found",s.appendChild(V)}u.appendChild(m),u.appendChild(s),N.appendChild(u);const c=document.createElement("div"),o=document.createElement("label");o.style.cssText=d,o.textContent="Title field";const x=document.createElement("select");x.style.cssText=C,c.appendChild(o),c.appendChild(x),N.appendChild(c);const T=document.createElement("div"),B=document.createElement("label");B.style.cssText=d,B.textContent="Body field";const O=document.createElement("select");O.style.cssText=C,T.appendChild(B),T.appendChild(O),N.appendChild(T);async function re(V){x.textContent="",O.textContent="";try{const b=(await U.collections.get(V)).fields||[];if(!b.length){const t=document.createElement("option");t.value="",t.textContent="\u2014 none \u2014",x.appendChild(t.cloneNode(!0)),O.appendChild(t);return}b.forEach((t,e)=>{const n=()=>{const Q=document.createElement("option");return Q.value=t.name,Q.textContent=t.label||t.name,Q};x.appendChild(n()),O.appendChild(n()),t.name==="title"&&(x.value="title"),t.name==="description"&&(O.value="description")}),!x.value&&b[0]&&(x.value=b[0].name),!O.value&&b[1]&&(O.value=b[1].name)}catch{const g=document.createElement("option");g.value="",g.textContent="\u2014 unknown \u2014",x.appendChild(g.cloneNode(!0)),O.appendChild(g)}}l.length&&re(l[0].slug),s.addEventListener("change",()=>re(s.value));const le=document.createElement("div"),ce=document.createElement("label");ce.style.cssText=d,ce.textContent="Limit (optional)";const pe=document.createElement("input");pe.type="number",pe.placeholder="All",pe.style.cssText=C,le.appendChild(ce),le.appendChild(pe),N.appendChild(le);const ee=document.createElement("label");ee.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const ye=document.createElement("input");ye.type="checkbox",ee.appendChild(ye),ee.appendChild(document.createTextNode("Allow multiple open")),N.appendChild(ee),r.appendChild(N),p.addEventListener("click",()=>{v="static",p.className="btn btn-sm btn-primary",y.className="btn btn-sm btn-ghost",h.style.display="flex",N.style.display="none"}),y.addEventListener("click",()=>{v="collection",y.className="btn btn-sm btn-primary",p.className="btn btn-sm btn-ghost",N.style.display="flex",h.style.display="none"});const me=document.createElement("button");me.type="button",me.className="btn btn-primary",me.textContent="Insert Accordion",r.appendChild(me);const de=E.modal({title:"Insert Accordion",size:"sm"});de.element.appendChild(r),de.open(),requestAnimationFrame(()=>w[0].input.focus()),me.addEventListener("click",()=>{if(v==="collection"&&!s.value)return;de.close();let V;if(v==="static")V=`[accordion${S.checked?' multiple="true"':""}]
|
|
85
|
+
`,w.forEach((b,t)=>{const e=b.input.value.trim()||`Item ${t+1}`;V+=`[item title="${e}"]Content here.[/item]
|
|
86
|
+
`}),V+="[/accordion]";else{const g=s.value;if(!g)return;const b=x.value,t=O.value;let e=`slug="${g}" display="accordion"`;b&&(e+=` title-field="${b}"`),t&&(e+=` body-field="${t}"`);const n=pe.value.trim();n&&(e+=` limit="${n}"`),ye.checked&&(e+=' multiple="true"'),V=`[collection ${e} /]`}xe(a,V),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onListGroup(a=>{const l=document.createElement("div");l.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const r="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",d="width:100%;padding:.4rem .6rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.9em;";function C(c,o){const x=document.createElement("div"),T=document.createElement("label");return T.style.cssText=r,T.textContent=c,x.appendChild(T),x.appendChild(o),x}function f(c){const o=document.createElement("select");return o.style.cssText=d,c.forEach(([x,T])=>{const B=document.createElement("option");B.value=x,B.textContent=T,o.appendChild(B)}),o}const p=f([["","Default"],["flush","Flush (no outer border)"],["numbered","Numbered"],["horizontal","Horizontal"]]);l.appendChild(C("Variant",p));const y=f([["","Default"],["sm","Small"],["lg","Large"]]);l.appendChild(C("Size",y));const v=f([["","Default"],["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"]]);l.appendChild(C("Item Colour",v));const h=document.createElement("label");h.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const w=document.createElement("input");w.type="checkbox",h.appendChild(w),h.appendChild(document.createTextNode("Actionable items (hover highlight)")),l.appendChild(h);const L=document.createElement("div");L.style.cssText=r+"margin-bottom:.35rem;",L.textContent="Items",l.appendChild(L);const A=document.createElement("div");A.style.cssText="display:flex;flex-direction:column;gap:.4rem;",l.appendChild(A);const k=[];function S(){k.forEach(c=>{c.removeBtn.disabled=k.length<=1,c.removeBtn.style.opacity=k.length<=1?"0.3":"1"})}function N(c){const o=document.createElement("div");o.style.cssText="display:flex;gap:.4rem;align-items:center;";const x=document.createElement("input");x.type="text",x.placeholder="Item text",x.value=c||"",x.style.cssText=d+"flex:1;";const T=document.createElement("button");T.type="button",T.textContent="\u2715",T.style.cssText="padding:.3rem .5rem;background:transparent;border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;flex-shrink:0;";const B={row:o,input:x,removeBtn:T};k.push(B),o.appendChild(x),o.appendChild(T),A.appendChild(o),T.addEventListener("click",()=>{if(k.length<=1)return;const O=k.indexOf(B);k.splice(O,1),A.removeChild(o),S()}),S()}N("Item 1"),N("Item 2"),N("Item 3");const u=document.createElement("button");u.type="button",u.textContent="+ Add Item",u.style.cssText="padding:.35rem .75rem;background:transparent;border:1px dashed var(--dm-border,#555);border-radius:4px;color:var(--dm-text-muted,#aaa);cursor:pointer;font-size:.85em;align-self:flex-start;",u.addEventListener("click",()=>{k.length>=20||(N(""),k[k.length-1].input.focus())}),l.appendChild(u);const m=document.createElement("button");m.type="button",m.className="btn btn-primary",m.textContent="Insert List Group",l.appendChild(m);const s=E.modal({title:"Insert List Group",size:"sm"});s.element.appendChild(l),s.open(),requestAnimationFrame(()=>k[0].input.focus()),m.addEventListener("click",()=>{s.close();let c="";p.value&&(c+=` variant="${p.value}"`),y.value&&(c+=` size="${y.value}"`),v.value&&(c+=` itemvariant="${v.value}"`),w.checked&&(c+=' action="true"');let o=`[listgroup${c}]
|
|
87
|
+
`;k.forEach(x=>{const T=x.input.value.trim();T&&(o+=`[item]${T}[/item]
|
|
88
|
+
`)}),o+="[/listgroup]",xe(a,o),a.dispatchEvent(new Event("input",{bubbles:!0})),a.focus()})}),j.onHelp(()=>{Fe()}),i.find(".editor-view-btn").on("click",function(){const a=$(this).data("mode");a&&(i.find(".editor-view-btn").removeClass("active"),$(this).addClass("active"),i.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${a}`))}),i.find("#fullscreen-btn").on("click",function(){i.find(".editor-card").toggleClass("editor-fullscreen")}),we=!1,i.find("#quick-switch").prop("disabled",!1),Ne&&window.removeEventListener("beforeunload",Ne),Ne=a=>{we&&a.preventDefault()},window.addEventListener("beforeunload",Ne),Be||(Be=!0,R.use((a,l,r)=>{const d=window.location.hash.startsWith("#/pages/edit")||window.location.hash==="#/pages/new";if(!we||!d)return r();E.confirm("You have unsaved changes. Leave this page?").then(C=>{C&&(we=!1,r())})})),W.on("input",()=>{we=!0,i.find("#quick-switch").prop("disabled",!0),ne()});const se=i.find("#editor-meta-tabs").get(0);se&&(se.addEventListener("input",()=>{we=!0,i.find("#quick-switch").prop("disabled",!0)}),se.addEventListener("change",a=>{a.target.id!=="quick-switch"&&(we=!0,i.find("#quick-switch").prop("disabled",!0))})),ne(),i.find("#save-btn").on("click",async()=>{const a=i.find("#page-url-path").val().trim();if(!a){E.toast("URL path is required.",{type:"warning"});return}const l=i.find("#field-dconfig").val().trim();let r=null;if(l)try{r=JSON.parse(l)}catch{E.toast("DConfig JSON is invalid. Please check the format before saving.",{type:"warning"});return}const d={title:i.find("#field-title").val().trim()||"Untitled",description:i.find("#field-description").val().trim(),layout:i.find("#field-layout").val(),status:i.find("#field-status").val(),sortOrder:parseInt(i.find("#field-sort-order").val(),10)||99,showInNav:i.find("#field-show-in-nav").is(":checked"),sidebar:i.find("#field-sidebar").is(":checked"),...i.find("#field-show-breadcrumbs").is(":checked")?{}:{breadcrumbs:!1},tags:Te?Te.getValue():[],category:i.find("#field-category").val().trim()||null,visibility:i.find("#field-visibility").val()||"public",seo:{title:i.find("#field-seo-title").val().trim(),description:i.find("#field-seo-desc").val().trim()},dconfig:r,...i.find("#field-theme").val()?{theme:i.find("#field-theme").val()}:{}};try{if(i.find("#save-btn").prop("disabled",!0).text("Saving\u2026"),F){const C={frontmatter:d,body:W.val()};a!==P&&(C.newUrlPath=a),await U.pages.update(P,C),K&&await U.settings.saveCustomCss(i.find("#css-editor").val()),E.toast(K?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),we=!1,i.find("#quick-switch").prop("disabled",!1),a!==P&&R.navigate(`/pages/edit${a}`)}else await U.pages.create({urlPath:a,frontmatter:d,body:W.val()}),K&&await U.settings.saveCustomCss(i.find("#css-editor").val()),E.toast(K?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),we=!1,R.navigate("/pages")}catch(C){E.toast(`Save failed: ${C.message||"Unknown error"}`,{type:"error"})}finally{i.find("#save-btn").prop("disabled",!1).text("Save")}}),i.find("#cancel-btn").on("click",()=>R.navigate("/pages")),Domma.icons.scan()}};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"/": 161,
|
|
3
|
-
"/about":
|
|
3
|
+
"/about": 88,
|
|
4
4
|
"/blog": 36,
|
|
5
5
|
"/contact": 30,
|
|
6
6
|
"/resources/typography": 4,
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"/resources/grid": 6,
|
|
12
12
|
"/forms": 14,
|
|
13
13
|
"/resources/effects": 6,
|
|
14
|
-
"/blog/hello-world":
|
|
14
|
+
"/blog/hello-world": 23,
|
|
15
15
|
"/feedback": 42,
|
|
16
16
|
"/resources/dependencies": 2,
|
|
17
17
|
"/resources/components": 6,
|
|
@@ -1361,6 +1361,63 @@ function processTableBlocks(markdown) {
|
|
|
1361
1361
|
* @param {string} markdown
|
|
1362
1362
|
* @returns {string}
|
|
1363
1363
|
*/
|
|
1364
|
+
/**
|
|
1365
|
+
* Pre-process [listgroup] / [item] shortcodes before running through marked.
|
|
1366
|
+
*
|
|
1367
|
+
* Syntax:
|
|
1368
|
+
* [listgroup variant="flush" size="sm" itemvariant="success" action="true"]
|
|
1369
|
+
* [item]Item text here[/item]
|
|
1370
|
+
* [item]Another item[/item]
|
|
1371
|
+
* [/listgroup]
|
|
1372
|
+
*
|
|
1373
|
+
* Supported attributes on [listgroup]:
|
|
1374
|
+
* variant - flush | numbered | horizontal
|
|
1375
|
+
* size - sm | lg
|
|
1376
|
+
* itemvariant - primary | secondary | success | danger | warning | info
|
|
1377
|
+
* action - "true" to add .list-group-item-action on each item
|
|
1378
|
+
*
|
|
1379
|
+
* @param {string} markdown
|
|
1380
|
+
* @returns {string}
|
|
1381
|
+
*/
|
|
1382
|
+
function processListGroupBlocks(markdown) {
|
|
1383
|
+
const {scrubbed, restore} = scrubCodeRegions(markdown);
|
|
1384
|
+
const processed = scrubbed.replace(
|
|
1385
|
+
/\[listgroup([^\]]*)\]([\s\S]*?)\[\/listgroup\]/gi,
|
|
1386
|
+
(_, attrStr, body) => {
|
|
1387
|
+
const attrs = parseShortcodeAttrs(attrStr);
|
|
1388
|
+
|
|
1389
|
+
const variantMap = {
|
|
1390
|
+
flush: 'list-group-flush',
|
|
1391
|
+
numbered: 'list-group-numbered',
|
|
1392
|
+
horizontal: 'list-group-horizontal'
|
|
1393
|
+
};
|
|
1394
|
+
const sizeMap = {sm: 'list-group-sm', lg: 'list-group-lg'};
|
|
1395
|
+
|
|
1396
|
+
const wrapperClasses = ['list-group'];
|
|
1397
|
+
if (variantMap[attrs.variant]) wrapperClasses.push(variantMap[attrs.variant]);
|
|
1398
|
+
if (sizeMap[attrs.size]) wrapperClasses.push(sizeMap[attrs.size]);
|
|
1399
|
+
|
|
1400
|
+
const itemClasses = ['list-group-item'];
|
|
1401
|
+
if (attrs.action === 'true') itemClasses.push('list-group-item-action');
|
|
1402
|
+
if (attrs.itemvariant && /^(primary|secondary|success|danger|warning|info)$/.test(attrs.itemvariant)) {
|
|
1403
|
+
itemClasses.push(`list-group-item-${attrs.itemvariant}`);
|
|
1404
|
+
}
|
|
1405
|
+
|
|
1406
|
+
const itemClassStr = itemClasses.join(' ');
|
|
1407
|
+
let items = '';
|
|
1408
|
+
body.replace(/\[item\]([\s\S]*?)\[\/item\]/gi, (__, content) => {
|
|
1409
|
+
const html = marked.parseInline(restore(content.trim()));
|
|
1410
|
+
items += `<div class="${itemClassStr}">${html}</div>\n`;
|
|
1411
|
+
});
|
|
1412
|
+
|
|
1413
|
+
if (!items) return '';
|
|
1414
|
+
|
|
1415
|
+
return `<div class="${wrapperClasses.join(' ')}">\n${items}</div>\n`;
|
|
1416
|
+
}
|
|
1417
|
+
);
|
|
1418
|
+
return restore(processed);
|
|
1419
|
+
}
|
|
1420
|
+
|
|
1364
1421
|
function processSpacerBlocks(markdown) {
|
|
1365
1422
|
const {scrubbed, restore} = scrubCodeRegions(markdown);
|
|
1366
1423
|
const opts = getConfig('site')?.layoutOptions ?? {};
|
|
@@ -1697,7 +1754,8 @@ export async function parseMarkdown(raw) {
|
|
|
1697
1754
|
const withCarousel = processCarouselBlocks(withAccordion);
|
|
1698
1755
|
const withCountdown = processCountdownBlocks(withCarousel);
|
|
1699
1756
|
const withTimeline = processTimelineBlocks(withCountdown);
|
|
1700
|
-
|
|
1757
|
+
const withListGroup = processListGroupBlocks(withTimeline);
|
|
1758
|
+
const withSpacer = processSpacerBlocks(withListGroup);
|
|
1701
1759
|
const withCenter = processCenterBlocks(withSpacer);
|
|
1702
1760
|
const withIcon = processIconBlocks(withCenter);
|
|
1703
1761
|
const withForm = await processFormBlocks(withIcon);
|