domma-cms 0.8.6 → 0.8.7
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.
- package/admin/js/views/page-editor.js +36 -30
- package/package.json +1 -1
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import{api as
|
|
1
|
+
import{api as K}from"../api.js";import{attachEditorKeybindings as We,createToolbar as $e,insertAtCursor as ke}from"../lib/markdown-toolbar.js?v=9";import{populateThemeSelect as Ye}from"../lib/themes.js";import{createFoldingManager as je}from"../lib/editor-folding.js";function Ke(){const a=E.slideover({title:"Editor Reference",size:"md",position:"right"}),ce="background:var(--dm-surface-subtle,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;",Ie="margin:1rem 0 .5rem;font-size:1rem;";function O(T){const C=document.createElement("code");return C.style.cssText=ce,C.textContent=T,C}function U(T){const C=document.createElement("h3");return C.style.cssText=Ie,C.textContent=T,C}const Be=document.createElement("div");Be.style.cssText="padding:1rem;";const Te=document.createElement("div");Te.className="tabs";const Pe=document.createElement("div");Pe.className="tab-list",["Basics","Layout","Components","Data","Advanced"].forEach((T,C)=>{const o=document.createElement("button");o.className="tab-item"+(C===0?" active":""),o.textContent=T,Pe.appendChild(o)});const Se=document.createElement("div");Se.className="tab-content";const J="display:flex;flex-direction:column;gap:1rem;",xe=document.createElement("div");xe.className="tab-panel active",xe.style.cssText=J;const Ce=document.createElement("div");Ce.className="tab-panel",Ce.style.cssText=J;const oe=document.createElement("div");oe.className="tab-panel",oe.style.cssText=J;const fe=document.createElement("div");fe.className="tab-panel",fe.style.cssText=J;const Ee=document.createElement("div");Ee.className="tab-panel",Ee.style.cssText=J,Se.appendChild(xe),Se.appendChild(Ce),Se.appendChild(oe),Se.appendChild(fe),Se.appendChild(Ee),Te.appendChild(Pe),Te.appendChild(Se),Be.appendChild(Te);const Re=document.createElement("div");Re.appendChild(U("Markdown Basics"));const Le=document.createElement("table");Le.style.cssText="width:100%;border-collapse:collapse;font-size:.9em;";const Z=document.createElement("thead"),te=document.createElement("tr");["Syntax","Result"].forEach(T=>{const C=document.createElement("th");C.style.cssText="text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);",C.textContent=T,te.appendChild(C)}),Z.appendChild(te),Le.appendChild(Z);const ne=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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.35rem .5rem;vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),ne.appendChild(o)}),Le.appendChild(ne),Re.appendChild(Le),xe.appendChild(Re);const ae=document.createElement("div");ae.appendChild(U("Grid & Columns"));function W(T){const C=document.createElement("p");return C.style.cssText="margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);",C.textContent=T,C}function w(T,C,o){const d=document.createElement("p");d.style.cssText="margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;",d.textContent=T;const n=document.createElement("div");n.style.cssText="position:relative;";const re=document.createElement("pre");re.style.cssText=ce+"display:block;padding:.5rem 2rem .5rem .75rem;white-space:pre;overflow-x:auto;margin:0;",re.textContent=C;const H=document.createElement("button");H.type="button",H.title="Copy code",H.style.cssText="position:absolute;top:.3rem;right:.3rem;background:none;border:none;cursor:pointer;opacity:.45;padding:.15rem;line-height:1;color:inherit;",H.addEventListener("mouseenter",()=>{H.style.opacity="1"}),H.addEventListener("mouseleave",()=>{H.style.opacity=".45"});const ee=document.createElement("span");ee.setAttribute("data-icon","copy"),H.appendChild(ee),H.addEventListener("click",()=>{const B=document.createElement("textarea");B.value=C,B.style.cssText="position:fixed;opacity:0;",document.body.appendChild(B),B.select(),document.execCommand("copy"),B.remove(),E.toast("Copied!",{type:"success",duration:1200})}),n.appendChild(re),n.appendChild(H);const P=document.createDocumentFragment();return P.appendChild(d),P.appendChild(n),o&&P.appendChild(W(o)),P}const le=document.createElement("table");le.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(([T,C,o])=>{const d=document.createElement("tr");[T,C,o].forEach((n,re)=>{const H=document.createElement("td");H.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",re===0?H.appendChild(O(T)):(H.style.color="var(--dm-text-muted,#aaa)",H.textContent=n),d.appendChild(H)}),le.appendChild(d)}),ae.appendChild(le),ae.appendChild(w("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.")),
|
|
5
|
+
[/grid]`,"cols sets the track count; each [col] fills one track.")),ae.appendChild(w("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.")),
|
|
8
|
+
[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),ae.appendChild(w("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.")),
|
|
11
|
+
[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),ae.appendChild(w("Row with staggered reveal",`[row reveal reveal-mode="stagger" reveal-animation="slide-up" reveal-duration="400" reveal-stagger="60" reveal-delay="0" reveal-direction="ltr"]
|
|
12
12
|
[col]First[/col]
|
|
13
13
|
[col]Second[/col]
|
|
14
14
|
[col]Third[/col]
|
|
15
|
-
[/row]`,'Columns reveal one by one as the row scrolls into view. reveal-direction="rtl" reverses the order. Animations: slide-up, slide-down, slide-left, slide-right, fade, zoom, flip.')),
|
|
15
|
+
[/row]`,'Columns reveal one by one as the row scrolls into view. reveal-direction="rtl" reverses the order. Animations: slide-up, slide-down, slide-left, slide-right, fade, zoom, flip.')),ae.appendChild(w("Card in a grid",`[grid cols="3" gap="4"]
|
|
16
16
|
[col]
|
|
17
17
|
[card title="One"]Content[/card]
|
|
18
18
|
[/col]
|
|
@@ -22,21 +22,21 @@ import{api as G}from"../api.js";import{attachEditorKeybindings as We,createToolb
|
|
|
22
22
|
[col]
|
|
23
23
|
[card title="Three"]Content[/card]
|
|
24
24
|
[/col]
|
|
25
|
-
[/grid]`,null)),
|
|
25
|
+
[/grid]`,null)),Ce.appendChild(ae);const ge=document.createElement("div");ge.appendChild(U("Cards")),ge.appendChild(w("Basic card",`[card title="Optional Title"]
|
|
26
26
|
Markdown **works** here.
|
|
27
|
-
[/card]`,"Omit title for a card with no header.")),
|
|
27
|
+
[/card]`,"Omit title for a card with no header.")),ge.appendChild(w("Icon \u2014 inline (default)",`[card title="Feature" icon="star"]
|
|
28
28
|
Icon sits left of the title in a flex row.
|
|
29
|
-
[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),
|
|
29
|
+
[/card]`,"icon accepts any Domma icon name. Default layout when icon is set.")),ge.appendChild(w("Icon \u2014 stacked (centred)",`[card title="Feature" icon="star" icon-layout="stacked" hover]
|
|
30
30
|
Icon is centred above the title. Great for feature tiles.
|
|
31
|
-
[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),
|
|
31
|
+
[/card]`,'icon-layout="stacked" centres the icon above the title. Combine with hover for a lift effect.')),ge.appendChild(w("Icon with subtitle",`[card title="Feature" subtitle="Tagline here" icon="star" icon-layout="stacked"]
|
|
32
32
|
Body content.
|
|
33
|
-
[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),
|
|
33
|
+
[/card]`,"subtitle adds a secondary line beneath the title in both layouts.")),ge.appendChild(w("Collapsible card",`[card title="Click to expand" collapsible="true"]
|
|
34
34
|
Hidden by default.
|
|
35
|
-
[/card]`,null)),
|
|
35
|
+
[/card]`,null)),ge.appendChild(w("Full attribute reference",`[card title="Title" subtitle="Sub" icon="star" icon-layout="stacked"
|
|
36
36
|
variant="primary" hover footer="Footer text"
|
|
37
37
|
collapsible="true" class="extra" id="my-card"]
|
|
38
38
|
Body content.
|
|
39
|
-
[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),
|
|
39
|
+
[/card]`,'All attributes are optional. variant accepts "primary". icon-layout accepts "inline" (default) or "stacked".')),ge.appendChild(w("Rich header / footer sub-tags",`[card]
|
|
40
40
|
[header]
|
|
41
41
|
### Custom Title with **bold** and [a link](/about)
|
|
42
42
|
[/header]
|
|
@@ -46,49 +46,55 @@ Body content here.
|
|
|
46
46
|
[footer]
|
|
47
47
|
[Read more](/about) | [icon name="arrow-right" /]
|
|
48
48
|
[/footer]
|
|
49
|
-
[/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.")),
|
|
49
|
+
[/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.")),oe.appendChild(ge);const we=document.createElement("div");we.appendChild(U("Badge")),we.appendChild(W("Inline badge/label elements. Self-closing renders an empty coloured dot."));const j=document.createElement("table");j.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),j.appendChild(o)}),we.appendChild(j),we.appendChild(w("Basic badge",'[badge variant="success"]New[/badge]',null)),we.appendChild(w("Pill outline badge",'[badge variant="danger" outline pill]Deprecated[/badge]',null)),oe.appendChild(we);const V=document.createElement("div");V.appendChild(U("Button")),V.appendChild(W("Renders a styled anchor as a Domma button. Use the Insert \u2192 Button toolbar item for a guided dialog."));const he=document.createElement("table");he.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),he.appendChild(o)}),V.appendChild(he),V.appendChild(w("Primary button",'[button href="/contact" variant="primary"]Get in touch[/button]',null)),V.appendChild(w("Self-closing with icon",'[button href="/download" variant="success" icon="download" size="sm" label="Download" /]',null)),V.appendChild(w("Opens in new tab",'[button href="https://example.com" variant="outline" target="_blank"]Visit site[/button]',null)),oe.appendChild(V);const me=document.createElement("div");me.appendChild(U("Link (shortcode)")),me.appendChild(W("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 De=document.createElement("table");De.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),De.appendChild(o)}),me.appendChild(De),me.appendChild(w("External link in new tab",'[link href="https://example.com" target="_blank" icon-after="external-link"]Visit site[/link]',null)),me.appendChild(w("Self-closing with icon",'[link href="/about" icon="arrow-right" label="About us" /]',null)),oe.appendChild(me);const se=document.createElement("div");se.appendChild(U("Spacer")),se.appendChild(W("Self-closing shortcode that inserts a fixed-height blank gap."));const ze=document.createElement("table");ze.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),ze.appendChild(o)}),se.appendChild(ze),se.appendChild(w("32px gap",'[spacer size="32" /]',null)),Ce.appendChild(se);const de=document.createElement("div");de.appendChild(U("Icon")),de.appendChild(W("Self-closing shortcode that renders any Domma icon inline."));const Ne=document.createElement("table");Ne.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),Ne.appendChild(o)}),de.appendChild(Ne),de.appendChild(w("Coloured icon",'[icon name="star" size="24" color="#f5a623" /]',null)),oe.appendChild(de);const ve=document.createElement("div");ve.appendChild(U("Center")),ve.appendChild(W("Wraps content in a centred div. Works with any content including cards, grids, and text.")),ve.appendChild(w("Example","[center]Centred content here[/center]",'Accepts an optional class="..." attribute for extra styling.')),Ce.appendChild(ve);const X=document.createElement("div");X.appendChild(U("Hero")),X.appendChild(W("Full-width hero sections \u2014 no plugin required. Uses Domma's built-in Hero CSS component."));const be=document.createElement("table");be.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),be.appendChild(o)}),X.appendChild(be),X.appendChild(w("Basic hero",'[hero title="Welcome" tagline="Build something great"][/hero]',null)),X.appendChild(w("Gradient with body content",`[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]
|
|
50
50
|
Some introductory **Markdown** content here.
|
|
51
|
-
[/hero]`,null)),
|
|
51
|
+
[/hero]`,null)),X.appendChild(w("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.")),Ce.appendChild(X);const ie=document.createElement("div");ie.appendChild(U("Interactive Components")),ie.appendChild(W("Tabs, accordion, carousel, and countdown \u2014 no plugin required.")),ie.appendChild(w("Tabs",`[tabs]
|
|
52
52
|
[tab title="First"]Content **A**[/tab]
|
|
53
53
|
[tab title="Second"]Content **B**[/tab]
|
|
54
|
-
[/tabs]`,'Add style="pills" for pill-style navigation.')),
|
|
54
|
+
[/tabs]`,'Add style="pills" for pill-style navigation.')),ie.appendChild(w("Accordion",`[accordion]
|
|
55
55
|
[item title="Question 1"]Answer here.[/item]
|
|
56
56
|
[item title="Question 2"]Answer here.[/item]
|
|
57
|
-
[/accordion]`,'Add multiple="true" to allow several panels open at once.')),
|
|
57
|
+
[/accordion]`,'Add multiple="true" to allow several panels open at once.')),ie.appendChild(w("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.")),ie.appendChild(w("Carousel",`[carousel autoplay="true" interval="5000"]
|
|
58
58
|
[slide title="Slide 1"]Description[/slide]
|
|
59
59
|
[slide image="/media/photo.jpg" title="Slide 2"]Caption[/slide]
|
|
60
|
-
[/carousel]`,'Omit autoplay for a manual carousel. loop="false" disables wrapping.')),
|
|
60
|
+
[/carousel]`,'Omit autoplay for a manual carousel. loop="false" disables wrapping.')),ie.appendChild(w("Countdown (to date)",'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',null)),ie.appendChild(w("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")),oe.appendChild(ie);const ye=document.createElement("div");ye.appendChild(U("Timeline")),ye.appendChild(W("Renders a Domma Progression component with event items."));const Fe=document.createElement("table");Fe.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),Fe.appendChild(o)}),ye.appendChild(Fe),ye.appendChild(w("Vertical timeline",`[timeline layout="vertical" theme="modern"]
|
|
61
61
|
[event title="Kickoff" date="Jan 2025" status="completed" icon="flag"]
|
|
62
62
|
Project launched.
|
|
63
63
|
[/event]
|
|
64
64
|
[event title="Beta" date="Jun 2025" status="in-progress" icon="rocket"]
|
|
65
65
|
In active development.
|
|
66
66
|
[/event]
|
|
67
|
-
[/timeline]`,null)),
|
|
67
|
+
[/timeline]`,null)),oe.appendChild(ye);const e=document.createElement("div");e.appendChild(U("Embedding a Form"));const l=document.createElement("table");l.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),l.appendChild(o)}),e.appendChild(l),e.appendChild(w("Basic",'[form name="contact" /]',"Forms are managed under Forms in the sidebar.")),e.appendChild(w("With wrapper styling",'[form name="newsletter" class="mt-4" id="newsletter-form" /]',null)),fe.appendChild(e);const r=document.createElement("div");r.appendChild(U("Displaying a Collection"));const i=document.createElement("pre");i.style.cssText=ce+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;",i.textContent='[collection slug="enquiries" display="table" /]',r.appendChild(i);const L=[["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."]],f=document.createElement("table");f.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",L.forEach(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),f.appendChild(o)}),r.appendChild(f),r.appendChild(W("Table display uses Domma Table \u2014 search, sort, pagination, column selector, and CSV export are all built in. Cards and lists are static.")),fe.appendChild(r);const g=document.createElement("div");g.appendChild(U("View \u2014 Pro")),g.appendChild(W("Renders a Collection with full filtering, pagination, and display options. Requires a Pro MongoDB collection."));const k=document.createElement("table");k.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),k.appendChild(o)}),g.appendChild(k),g.appendChild(w("Table display",'[view slug="products" display="table" limit="50" /]',null)),g.appendChild(w("Cards display",'[view slug="team" display="cards" columns="3" title-field="name" /]',null)),fe.appendChild(g);const b=document.createElement("div");b.appendChild(U("CTA \u2014 Pro")),b.appendChild(W("Renders an action button that triggers a Pro Action against an entry. Requires the Pro Actions feature."));const h=document.createElement("table");h.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",[["action","Required. The action slug."],["entry","Required. The entry id to act on."],["style","Button variant (default: primary)."],["icon","Domma icon name for the button."],["size","Button size (sm, lg)."],["confirm","Confirmation prompt text before running."],["label","Self-closing only: button label text."]].forEach(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;width:35%;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),h.appendChild(o)}),b.appendChild(h),b.appendChild(w("Wrapping form",'[cta action="approve" entry="abc123" style="success" confirm="Approve this entry?"]Approve[/cta]',null)),b.appendChild(w("Self-closing",'[cta action="archive" entry="abc123" icon="archive" label="Archive" /]',null)),fe.appendChild(b);const p=document.createElement("div");p.appendChild(U("Effects")),p.appendChild(W("Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin."));const A=[['[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 (auto-detects date)"],["[christmas /]","Christmas \u2014 snowflakes, trees, snowmen, sleigh"],["[halloween /]","Halloween \u2014 pumpkins, ghosts, bats, spiders"],["[st-patricks /]","St Patrick's Day \u2014 shamrocks, coins, rainbows, leprechaun"],["[valentines /]","Valentine's Day \u2014 hearts, roses"],["[guy-fawkes /]","Guy Fawkes \u2014 fireworks, sparkles"],["[st-andrews /]","St Andrew's Day \u2014 heather, thistles"],["[st-davids /]","St David's Day \u2014 daffodils, dragons"],["[st-georges /]","St George's Day \u2014 roses, flags"]],N=document.createElement("table");N.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",A.forEach(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),N.appendChild(o)}),p.appendChild(N),p.appendChild(w("Scribe script \u2014 looping multi-phrase typewriter",`[scribe loop="true" loop-delay="2000" delete-speed="20"]
|
|
68
68
|
[render]We build things that matter.[/render]
|
|
69
69
|
[wait]1200[/wait]
|
|
70
70
|
[undo all="true" /]
|
|
71
71
|
[render]We design for humans.[/render]
|
|
72
72
|
[wait]1200[/wait]
|
|
73
73
|
[undo all="true" /]
|
|
74
|
-
[/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.')),
|
|
74
|
+
[/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.')),p.appendChild(w("Christmas",'[christmas intensity="medium" snowmen="off" trees="off" wreaths="off" northStars="off" sleigh="off" train="off" elf="off" robin="off" firework="off" /]',"intensity: light | medium | heavy. Count-based (off disables entirely): snowmen, trees, wreaths, northStars. Probability-based specials (off prevents spawning): sleigh, train, elf, robin, firework. Snowflakes always fall.")),p.appendChild(w("Halloween",'[halloween intensity="medium" gravestones="off" jackOLanterns="off" spiders="off" scarecrows="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): gravestones, jackOLanterns, spiders, scarecrows, twinklingStars. Particles: bats, ghosts, pumpkins (always on). Fixed decorations: haunted-house, cauldron (always present).")),p.appendChild(w("St Patrick's Day",'[st-patricks intensity="medium" pots="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): pots (pots of gold), twinklingStars. Particles: shamrocks, clover petals, gold coins, sparkles (always on). Fixed decorations: rainbow, harp, moon. Leprechaun appears randomly \u2014 more likely at higher intensity.")),p.appendChild(w("Valentine's Day",'[valentines intensity="medium" garlands="off" butterflies="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): garlands (heart garlands), butterflies. Particles: hearts, rose petals, sparkles, lips (always on). Fixed decorations: envelopes (always present). Cupid appears randomly \u2014 more likely at higher intensity.")),p.appendChild(w("Guy Fawkes Night",'[guy-fawkes intensity="medium" bonfires="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): bonfires. Particles: embers, fireworks, sparks, rockets, bursts, trails (always on). Fixed decorations: guy-effigy, catherine-wheel, roman-candle, sparkler-bundle, moon. Starts at 25% particle density and builds up gradually.")),p.appendChild(w("St Andrew's Day",'[st-andrews intensity="medium" thistles="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): thistles, twinklingStars. Particles: heather petals, saltire sparkles (always on). Fixed decorations: bagpiper, saltire-flag, tartan-pattern, highland-scene (always present). Bagpiper probability increases with intensity.")),p.appendChild(w("St David's Day",'[st-davids intensity="medium" daffodilFields="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): daffodilFields, twinklingStars. Particles: daffodil petals, spring sparkles (always on). Fixed decorations: welsh-dragon, harp, leek-bundle, flag (always present). Flying dragon appears randomly \u2014 more likely at higher intensity.")),p.appendChild(w("St George's Day",'[st-georges intensity="medium" roses="off" twinklingStars="off" /]',"intensity: light | medium | heavy. Decoration toggles (off disables): roses (English roses), twinklingStars. Particles: rose petals, Tudor roses, oak leaves, sparkles (always on). Fixed decorations: st-georges-cross, dragon, shield, castle (always present). Knight appears randomly \u2014 more likely at higher intensity.")),p.appendChild(W("Enable the Domma Effects plugin to activate these shortcodes on your site.")),Ee.appendChild(p);const v=document.createElement("div");v.appendChild(U("Tables")),v.appendChild(W("Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling."));const z=document.createElement("table");z.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),z.appendChild(o)}),v.appendChild(z),v.appendChild(w("Striped + bordered table",`[table striped="true" bordered="true" caption="Product Pricing"]
|
|
75
75
|
| Product | Price |
|
|
76
76
|
| ------- | ----: |
|
|
77
77
|
| Widget | $9.99 |
|
|
78
78
|
| Gadget | $14.99 |
|
|
79
|
-
[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),
|
|
79
|
+
[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),oe.appendChild(v);const F=document.createElement("div");F.appendChild(U("Slideover")),F.appendChild(W("A trigger button that opens a slide-in panel with Markdown content. No plugin required."));const u=document.createElement("table");u.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),u.appendChild(o)}),F.appendChild(u),F.appendChild(w("Example",`[slideover title="More Info" trigger="Read more" size="md"]
|
|
80
80
|
## Details
|
|
81
81
|
Markdown content here.
|
|
82
|
-
[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),
|
|
82
|
+
[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),oe.appendChild(F);const m=document.createElement("div");m.appendChild(U("DConfig \u2014 Declarative Behaviour")),m.appendChild(W("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.")),m.appendChild(w("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.')),m.appendChild(w("Inline shortcode syntax",`[dconfig]
|
|
83
83
|
{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }
|
|
84
|
-
[/dconfig]`,null)),
|
|
85
|
-
`).map(
|
|
84
|
+
[/dconfig]`,null)),Ee.appendChild(m);const s=document.createElement("div");s.appendChild(U("CSS Editor")),s.appendChild(W("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 c=document.createElement("table");c.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),c.appendChild(o)}),s.appendChild(c),Ee.appendChild(s);const t=document.createElement("div");t.appendChild(U("Colour Picker")),t.appendChild(W("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.")),Ee.appendChild(t);const y=document.createElement("div");y.appendChild(U("Keyboard Shortcuts"));const x=document.createElement("table");x.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;white-space:nowrap;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),x.appendChild(o)}),y.appendChild(x),xe.appendChild(y);const M=document.createElement("div");M.appendChild(U("Tips"));const Y=document.createElement("table");Y.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(([T,C])=>{const o=document.createElement("tr"),d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",d.appendChild(O(T));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=C,o.appendChild(d),o.appendChild(n),Y.appendChild(o)}),M.appendChild(Y),M.appendChild(W("Most shortcodes accept a class attribute for custom styling.")),xe.appendChild(M),a.setContent(Be),a.open(),E.tabs(Te),I.scan(Be)}function Je(a,ce){const Ie=a.find("#history-tab").get(0),O=a.find("#version-list").get(0),U=a.find("#version-compare").get(0),Be=a.find("#version-compare-old").get(0),Te=a.find("#version-compare-new").get(0),Pe=a.find("#version-compare-label").get(0),Se=a.find("#version-compare-back-btn").get(0),J=a.find("#version-restore-btn").get(0),xe=a.find("#history-save-named-btn").get(0),Ce=a.find("#history-delete-selected-btn").get(0);let oe=!1,fe=null;function Ee(){O.style.display="",U.style.display="none",fe=null}function Re(){O.style.display="none",U.style.display=""}async function Le(){O.textContent="";const Z=document.createElement("p");Z.style.color="var(--dm-text-muted)",Z.textContent="Loading\u2026",O.appendChild(Z);let te;try{te=(await K.versions.list(ce)).versions||[]}catch(j){O.textContent="";const V=document.createElement("p");V.style.color="var(--dm-text-danger,#e55)",V.textContent="Failed to load versions: "+j.message,O.appendChild(V);return}if(O.textContent="",Ce.style.display="none",!te.length){const j=document.createElement("p");j.style.color="var(--dm-text-muted)",j.textContent="No versions saved yet. Versions are created automatically on each save.",O.appendChild(j);return}const ne=document.createElement("table");ne.style.cssText="width:100%;border-collapse:collapse;font-size:.875rem;";const pe=document.createElement("thead"),ae=document.createElement("tr"),W=document.createElement("th");W.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"),W.appendChild(w),ae.appendChild(W),["Date","Author","Type","Label","Actions"].forEach(j=>{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=j,ae.appendChild(V)}),pe.appendChild(ae),ne.appendChild(pe);const le=[];function ge(){const j=le.some(he=>he.checked),V=le.length>0&&le.every(he=>he.checked);Ce.style.display=j?"":"none",w.checked=V,w.indeterminate=j&&!V}w.addEventListener("change",()=>{le.forEach(j=>{j.checked=w.checked}),ge()});const we=document.createElement("tbody");te.forEach(j=>{const V=document.createElement("tr");V.style.borderBottom="1px solid var(--dm-border)";const he=document.createElement("td");he.style.padding=".5rem .75rem";const me=document.createElement("input");me.type="checkbox",me.value=j.filename,me.addEventListener("change",ge),he.appendChild(me),le.push(me);const De=document.createElement("td");De.style.padding=".5rem .75rem",De.textContent=D(j.createdAt).format("D MMM YYYY, HH:mm");const se=document.createElement("td");se.style.padding=".5rem .75rem",se.textContent=j.author||"\u2014";const ze=document.createElement("td");ze.style.padding=".5rem .75rem";const de=document.createElement("span");de.className="badge badge-"+(j.type==="manual"?"primary":"secondary"),de.style.cssText="font-size:.75rem;padding:.2rem .5rem;border-radius:4px;",de.textContent=j.type,ze.appendChild(de);const Ne=document.createElement("td");Ne.style.cssText="padding:.5rem .75rem;color:var(--dm-text-muted);",Ne.textContent=j.label||"\u2014";const ve=document.createElement("td");ve.style.padding=".5rem .75rem";const X=document.createElement("button");X.className="btn btn-ghost btn-xs",X.style.marginRight=".4rem",X.textContent="Compare",X.addEventListener("click",async()=>{try{const ie=await K.versions.get(ce,j.filename);Be.textContent=ie.content,Te.textContent=a.find("#markdown-editor").get(0).value,Pe.textContent=D(j.createdAt).format("D MMM YYYY, HH:mm")+(j.label?` \u2014 ${j.label}`:""),fe=j.filename,Re()}catch(ie){E.toast("Failed to load version: "+ie.message,{type:"error"})}});const be=document.createElement("button");be.className="btn btn-ghost btn-xs",be.style.color="var(--dm-text-danger,#e55)",be.textContent="Delete",be.addEventListener("click",async()=>{if(await E.confirm("Delete this version? This cannot be undone."))try{await K.versions.delete(ce,j.filename),E.toast("Version deleted.",{type:"success"}),await Le()}catch(ye){E.toast("Failed to delete: "+ye.message,{type:"error"})}}),ve.appendChild(X),ve.appendChild(be),V.appendChild(he),V.appendChild(De),V.appendChild(se),V.appendChild(ze),V.appendChild(Ne),V.appendChild(ve),we.appendChild(V)}),ne.appendChild(we),O.appendChild(ne)}Ie.addEventListener("click",async()=>{oe||(oe=!0,await Le())}),Se.addEventListener("click",()=>{Ee()}),J.addEventListener("click",async()=>{if(!(!fe||!await E.confirm("Restore this version? The current page content will be overwritten (a pre-restore snapshot will be saved automatically).")))try{await K.versions.restore(ce,fe),E.toast("Page restored. Reloading editor\u2026",{type:"success"}),R.navigate("/pages"),setTimeout(()=>R.navigate(`/pages/edit${ce}`),300)}catch(te){E.toast("Restore failed: "+te.message,{type:"error"})}}),Ce.addEventListener("click",async()=>{const Z=[...O.querySelectorAll("tbody input[type=checkbox]:checked")].map(ne=>ne.value);if(!(!Z.length||!await E.confirm(`Delete ${Z.length} version${Z.length>1?"s":""}? This cannot be undone.`)))try{await K.versions.bulkDelete(ce,Z),E.toast(`${Z.length} version${Z.length>1?"s":""} deleted.`,{type:"success"}),await Le()}catch(ne){E.toast("Delete failed: "+ne.message,{type:"error"})}}),xe.addEventListener("click",()=>{const Z=E.modal({title:"Save Named Version"}),te=document.createElement("div");te.style.padding="1rem";const ne=document.createElement("label");ne.className="form-label",ne.textContent="Version Label";const pe=document.createElement("input");pe.type="text",pe.className="form-input",pe.placeholder="e.g. Initial design, Before restructure",pe.style.marginBottom=".75rem";const ae=document.createElement("button");ae.className="btn btn-primary",ae.textContent="Save Version",ae.addEventListener("click",async()=>{const W=pe.value.trim();try{await K.versions.create(ce,W||null),E.toast("Named version saved.",{type:"success"}),Z.close(),oe=!1,Ie.classList.contains("active")&&(oe=!0,await Le())}catch(w){E.toast("Failed to save version: "+w.message,{type:"error"})}}),te.appendChild(ne),te.appendChild(pe),te.appendChild(ae),Z.element.appendChild(te),Z.open(),setTimeout(()=>pe.focus(),100)})}let Ae=!1,Me=null,Ge=!1;function Qe(a){return a.split(`
|
|
85
|
+
`).map(ce=>ce.trimEnd()).join(`
|
|
86
86
|
`).replace(/\n{3,}/g,`
|
|
87
87
|
|
|
88
|
-
`)}const Ue="editor_prefs";function He(){return S.get(Ue)||{viewMode:"split",fullscreen:!1}}function Ge(n,ie){const Ie=He();Ie[n]=ie,S.set(Ue,Ie)}export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(n){const Ie=window.location.hash.match(/#\/pages\/edit(\/.*)/),F=Ie?Ie[1]:null,O=!!F,Ne=E.loader(n.get(0),{type:"dots"}),ke=[G.layouts.get().catch(()=>({})),G.settings.get().catch(()=>({}))];O&&(ke.push(G.pages.get(F).catch(()=>null)),ke.push(G.pages.list().catch(()=>[])));const[Pe,Te,W,ye]=await Promise.all(ke);Ne.destroy(),je(n.find("#field-theme").get(0),{includeDefault:!0});const fe=Te?.layoutOptions?.spacerSize??40;if(O&&!W){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}n.find("#editor-title").text(O?`Edit Page \u2014 ${W.title||F}`:"New Page"),O&&n.find("#page-url-path").val(F),W&&(n.find("#field-title").val(W.title||""),n.find("#field-description").val(W.description||""),n.find("#field-status").val(W.status||"draft"),n.find("#field-sort-order").val(W.sortOrder??99),n.find("#field-show-in-nav").prop("checked",!!W.showInNav),n.find("#field-sidebar").prop("checked",!!W.sidebar),n.find("#field-show-breadcrumbs").prop("checked",W.breadcrumbs!==!1),n.find("#field-category").val(W.category||""),n.find("#field-visibility").val(W.visibility||"public"),n.find("#field-theme").val(W.theme||""),n.find("#field-seo-title").val(W.seo?.title||""),n.find("#field-seo-desc").val(W.seo?.description||""),W.dconfig&&n.find("#field-dconfig").val(JSON.stringify(W.dconfig,null,2)));const ne=n.find("#quick-switch");O&&Array.isArray(ye)&&ye.length&&([...ye].sort((d,i)=>(d.title||d.urlPath).localeCompare(i.title||i.urlPath)).forEach(d=>{const i=document.createElement("option");i.value=d.urlPath,i.textContent=`${d.title||"Untitled"} (${d.urlPath})`,d.urlPath===F&&(i.selected=!0),ne.get(0).appendChild(i)}),ne.css("display",""),ne.on("change",function(){const d=this.value;d&&R.navigate("/pages/edit"+d)}));const he=await G.pages.tags().catch(()=>[]),xe=n.find("#field-tags").get(0),Re=xe?E.pillbox(xe,{data:he,value:W?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,Se=n.find("#field-layout").empty();if(Object.entries(Pe).forEach(([e,d])=>{const i=(W?.layout||"default")===e?"selected":"";Se.append(`<option value="${e}" ${i}>${d.label||e}</option>`)}),O){const e=n.find("#view-page-btn").get(0);e.href=F,e.style.display="";const d=n.find("#live-preview-tab").get(0);d.style.display="";const i=n.find("#history-tab").get(0);i.style.display=""}if(E.tabs(n.find("#editor-meta-tabs").get(0)),O){const e=n.find("#live-preview-tab").get(0),d=n.find("#live-preview-frame").get(0);let i=!1;e.addEventListener("click",function(){i||(d.src=F,i=!0)}),$e(n,F)}const K=n.find("#markdown-editor"),Z=n.find("#markdown-preview");W&&K.val(W.content||"");let ee=!1,re="";G.settings.getCustomCss().then(({css:e})=>{if(re=e||"",!re)return;const d=document.createElement("style");d.id="preview-custom-css",d.textContent=re,Z.get(0).parentNode.insertBefore(d,Z.get(0))}).catch(()=>{});let te=!1;const V=K.get(0),C=document.createElement("div");C.className="editor-line-numbers editor-line-numbers--foldable",V.parentElement.insertBefore(C,V);const ae=Ke(V,C,{onFoldChange:()=>{}});ae.setGuard(e=>{te=e});const be=()=>{ae.refresh(),C.scrollTop=V.scrollTop};V.addEventListener("input",be),V.addEventListener("scroll",()=>{C.scrollTop=V.scrollTop});let Ee=null;const _=()=>{clearTimeout(Ee),Ee=setTimeout(async()=>{const e=ae.getUnfoldedContent();try{const{html:d}=await G.pages.preview(e);Z.html(d,{safe:!1}),I.scan(Z.get(0)),Z.get(0).querySelectorAll(".tabs").forEach(i=>Domma.elements.tabs(i))}catch{window.marked&&Z.html(marked.parse(e))}},400)},M=Ye(K,n.find("#editor-toolbar"),{spacerDefault:fe});let me=!1,ce="split",De=null;const oe=document.createElement("button");oe.className="editor-view-btn",oe.type="button";const ze=document.createElement("span");ze.setAttribute("data-icon","css-code"),oe.appendChild(ze);const le=document.createElement("button");le.className="editor-view-btn",le.type="button";const Ae=document.createElement("span");Ae.setAttribute("data-icon","code"),le.appendChild(Ae);let ge=!1;const Q=document.createElement("button");Q.className="editor-view-btn",Q.type="button",Q.textContent="\u25BC\u25BC",Q.style.cssText="font-size:9px;letter-spacing:-1px;";const ue=n.find(".editor-toolbar-right").get(0);ue.prepend(Q),ue.prepend(le),ue.prepend(oe),I.scan(oe),I.scan(le),E.tooltip(oe,{content:"Edit Custom CSS",position:"top"}),E.tooltip(le,{content:"Format Markdown",position:"top"}),E.tooltip(Q,{content:"Fold / unfold all shortcodes",position:"top"}),le.addEventListener("click",()=>{const e=K.get(0),d=e.selectionStart,i=Qe(ae.getUnfoldedContent());ae.unfoldAll(),te=!0,e.value=i,te=!1,e.selectionStart=e.selectionEnd=Math.min(d,i.length),e.dispatchEvent(new Event("input")),ae.refresh(),E.toast("Markdown formatted.",{type:"success"})}),Q.addEventListener("click",()=>{ge?(ae.unfoldAll(),Q.textContent="\u25BC\u25BC",Q.classList.remove("active")):(ae.foldAll(),Q.textContent="\u25B6\u25B6",Q.classList.add("active")),ge=!ge});const de=document.createElement("span");de.className="editor-toolbar-sep",ue.insertBefore(de,ue.children[3]),oe.addEventListener("click",()=>{me=!me;const e=n.find("#markdown-editor"),d=n.find("#css-editor"),i=n.find("#editor-body");if(me){const r=n.find(".editor-view-btn[data-mode].active").get(0);ce=r?r.getAttribute("data-mode"):"split",n.find(".editor-view-btn[data-mode]").removeClass("active"),n.find('.editor-view-btn[data-mode="split"]').addClass("active"),i.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),e.hide(),d.show(),ee||(d.val(re),ee=!0,We(d.get(0))),oe.classList.add("active")}else n.find(".editor-view-btn[data-mode]").removeClass("active"),n.find(`.editor-view-btn[data-mode="${ce}"]`).addClass("active"),i.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${ce}`),d.hide(),e.show(),oe.classList.remove("active")});const Ce=He();Ce.viewMode&&Ce.viewMode!=="split"&&(n.find(".editor-view-btn[data-mode]").removeClass("active"),n.find(`.editor-view-btn[data-mode="${Ce.viewMode}"]`).addClass("active"),n.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${Ce.viewMode}`)),Ce.fullscreen&&n.find(".editor-card").addClass("editor-fullscreen"),n.find("#css-editor").on("input",()=>{clearTimeout(De),De=setTimeout(()=>{let e=document.getElementById("preview-custom-css");e||(e=document.createElement("style"),e.id="preview-custom-css",Z.get(0).parentNode.insertBefore(e,Z.get(0))),e.textContent=n.find("#css-editor").val()},400)}),M.onLink(async e=>{const i=(await G.pages.list().catch(()=>[])).map(m=>({label:m.title||m.urlPath,value:m.urlPath})),r=document.createElement("div");r.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const z=document.createElement("label");z.className="form-label",z.textContent="URL";const f=document.createElement("input");f.type="text",f.className="form-input",f.placeholder="/about or https://example.com";const b=e.value.substring(e.selectionStart,e.selectionEnd);b&&b.startsWith("/")&&(f.value=b),r.appendChild(z),r.appendChild(f);const w=document.createElement("label");w.className="form-label",w.textContent="Link text";const g=document.createElement("input");g.type="text",g.className="form-input",g.placeholder="Display text",b&&!b.startsWith("/")&&(g.value=b),r.appendChild(w),r.appendChild(g);const u=document.createElement("label");u.className="form-label",u.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const h=document.createElement("input");h.type="checkbox",h.style.cssText="width:1rem;height:1rem;cursor:pointer;",u.appendChild(h),u.appendChild(document.createTextNode("Display as button")),r.appendChild(u);const A=document.createElement("label");A.className="form-label",A.textContent="Button colour",A.style.display="none";const B=document.createElement("select");B.className="form-select",B.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(([m,c])=>{const o=document.createElement("option");o.value=m,o.textContent=c,B.appendChild(o)}),r.appendChild(A),r.appendChild(B),h.addEventListener("change",()=>{const m=h.checked;A.style.display=m?"":"none",B.style.display=m?"":"none"});const L=document.createElement("button");L.type="button",L.className="btn btn-primary",L.textContent="Insert Link",r.appendChild(L);const N=E.modal({title:"Insert Link",size:"sm"});N.element.appendChild(r),N.open(),requestAnimationFrame(()=>{E.autocomplete(f,{data:i,minChars:1,onSelect:m=>{f.value=m.value,g.value||(g.value=m.label)}}),f.focus()}),L.addEventListener("click",()=>{const m=f.value.trim(),c=g.value.trim();if(!m)return;N.close();const o=h.checked?`[button href="${m}" variant="${B.value}"]${c||m}[/button]`:`[${c||m}](${m})`,p=e.selectionStart,t=e.selectionEnd;e.value=e.value.substring(0,p)+o+e.value.substring(t),e.selectionStart=e.selectionEnd=p+o.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),M.onImage(async e=>{const i=(await G.media.list().catch(()=>[])).filter(f=>/\.(png|jpe?g|gif|webp|svg)$/i.test(f.name)),r=document.createElement("div");if(r.className="media-picker-grid",i.length)i.forEach(f=>{const b=document.createElement("div");b.className="media-picker-item",b.dataset.url=f.url;const w=document.createElement("img");w.src=f.url,w.alt=f.name;const g=document.createElement("span");g.textContent=f.name,b.appendChild(w),b.appendChild(g),r.appendChild(b)});else{const f=document.createElement("p");f.className="text-muted p-3",f.textContent="No images uploaded yet.",r.appendChild(f)}const z=E.modal({title:"Insert Image",size:"lg"});z.element.appendChild(r),$(z.element).on("click",".media-picker-item",function(){const f=$(this).data("url"),b=$(this).find("span").text();Le(e,``),z.close(),K.get(0).dispatchEvent(new Event("input",{bubbles:!0}))}),z.open()}),M.onCollection(async e=>{const[d,i]=await Promise.all([G.collections.list().catch(()=>[]),G.blocks.list().catch(()=>[])]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const z="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;",b=document.createElement("div"),w=document.createElement("label");w.style.cssText=z,w.textContent="Collection";const g=document.createElement("select");if(g.style.cssText=f,d.length)d.forEach(q=>{const j=document.createElement("option");j.value=q.slug,j.textContent=q.title||q.slug,g.appendChild(j)});else{const q=document.createElement("option");q.value="",q.textContent="No collections found",g.appendChild(q)}b.appendChild(w),b.appendChild(g),r.appendChild(b);const u=document.createElement("div"),h=document.createElement("label");h.style.cssText=z,h.textContent="Display";const A=document.createElement("select");A.style.cssText=f,["table","cards","list","block"].forEach(q=>{const j=document.createElement("option");j.value=q,j.textContent=q.charAt(0).toUpperCase()+q.slice(1),A.appendChild(j)}),u.appendChild(h),u.appendChild(A),r.appendChild(u);const B=document.createElement("div");B.style.display="none";const y=document.createElement("label");y.style.cssText=z,y.textContent="Columns (2\u20134)";const L=document.createElement("input");L.type="number",L.min="2",L.max="4",L.value="3",L.style.cssText=f,B.appendChild(y),B.appendChild(L),r.appendChild(B);const N=document.createElement("div");N.style.display="none";const m=document.createElement("label");m.style.cssText=z,m.textContent="Block template";const c=document.createElement("select");if(c.style.cssText=f,i.length)i.forEach(q=>{const j=document.createElement("option");j.value=q.name??q,j.textContent=q.name??q,c.appendChild(j)});else{const q=document.createElement("option");q.value="",q.textContent="No block templates found",c.appendChild(q)}N.appendChild(m),N.appendChild(c),r.appendChild(N);const o=document.createElement("div"),p=document.createElement("label");p.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const t=document.createElement("input");t.type="checkbox",t.checked=!0,p.appendChild(t),p.appendChild(document.createTextNode("Enable search")),o.appendChild(p),r.appendChild(o);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 P=document.createElement("input");P.type="checkbox",P.checked=!0,T.appendChild(P),T.appendChild(document.createTextNode("Sortable columns")),x.appendChild(T),r.appendChild(x);const H=document.createElement("div"),k=document.createElement("label");k.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const v=document.createElement("input");v.type="checkbox",v.checked=!1,k.appendChild(v),k.appendChild(document.createTextNode("CSV export")),H.appendChild(k),r.appendChild(H);const l=document.createElement("div"),s=document.createElement("label");s.style.cssText=z,s.textContent="Rows per page";const a=document.createElement("input");a.type="number",a.min="5",a.max="100",a.value="25",a.style.cssText=f,l.appendChild(s),l.appendChild(a),r.appendChild(l);const ve=document.createElement("div"),J=document.createElement("label");J.style.cssText=z,J.textContent="Limit (optional)";const we=document.createElement("input");we.type="number",we.placeholder="All",we.style.cssText=f,ve.appendChild(J),ve.appendChild(we),r.appendChild(ve);const U=document.createElement("button");U.type="button",U.className="btn btn-primary",U.textContent="Insert",r.appendChild(U);const Y=[o,x,H,l],se=()=>{const q=A.value,j=q==="table";Y.forEach(pe=>{pe.style.display=j?"":"none"}),B.style.display=q==="cards"||q==="block"?"":"none",N.style.display=q==="block"?"":"none"};A.addEventListener("change",se),se();const X=E.modal({title:"Insert Collection",size:"sm"});X.element.appendChild(r),X.open(),U.addEventListener("click",()=>{const q=g.value;if(!q)return;const j=A.value;let pe=`[collection slug="${q}" display="${j}"`;if(j==="cards"&&(pe+=` columns="${L.value}"`),j==="block"){const Oe=c.value;Oe&&(pe+=` block="${Oe}"`);const Ve=L.value.trim();Ve&&(pe+=` cols="${Ve}"`)}j==="table"&&!t.checked&&(pe+=' search="false"'),j==="table"&&!P.checked&&(pe+=' sortable="false"'),j==="table"&&v.checked&&(pe+=' exportable="true"'),j==="table"&&a.value!=="25"&&(pe+=` page-size="${a.value}"`);const qe=we.value.trim();qe&&(pe+=` limit="${qe}"`),pe+=" /]",X.close(),Le(e,pe),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),M.onBlock(async e=>{let d=[];try{d=await G.blocks.list()}catch{E.toast("Could not load blocks.",{type:"error"});return}if(!d.length){E.toast("No block templates found. Create one in Blocks first.",{type:"warning"});return}const i=E.modal({title:"Insert Block",size:"lg"}),r=document.createElement("div");r.style.cssText="display:flex;gap:1rem;min-height:320px;";const z=document.createElement("div");z.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 b=document.createElement("select");b.className="form-select";const w=document.createElement("option");w.value="",w.textContent="\u2014 select a template \u2014",b.appendChild(w),d.forEach(c=>{const o=document.createElement("option");o.value=c.name,o.textContent=c.name,b.appendChild(o)}),z.appendChild(f),z.appendChild(b);const g=document.createElement("div");g.style.cssText="display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;max-height:260px;",z.appendChild(g);const u=document.createElement("button");u.className="btn btn-primary",u.type="button",u.textContent="Insert",u.disabled=!0,z.appendChild(u);const h=document.createElement("div");h.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 A=document.createElement("p");A.className="text-muted",A.style.cssText="font-size:.8rem;margin:0;",A.textContent="Select a template to see a preview.",h.appendChild(A),r.appendChild(z),r.appendChild(h),i.element.appendChild(r),i.open();let B=null,y=[];function L(c){return c.replace(/_/g," ").replace(/\b\w/g,o=>o.toUpperCase())}function N(){if(!B)return;const c={};y.forEach(({key:p,input:t})=>{c[p]=t.value});const o=B.replace(/\{\{([\w_]+)\}\}/g,(p,t)=>(c[t]??"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"));h.innerHTML=DOMPurify.sanitize(o)}function m(c){g.textContent="",y=[];const o=new Set(["_id","_createdAt","_updatedAt"]),p=new Set;for(const[,t]of c.matchAll(/\{\{([\w_]+)\}\}/g))o.has(t)||p.add(t);if(!p.size){const t=document.createElement("p");t.className="text-muted",t.style.cssText="font-size:.8rem;margin:0;",t.textContent="No editable placeholders in this template.",g.appendChild(t);return}p.forEach(t=>{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=L(t);const P=document.createElement("input");P.type="text",P.className="form-input",P.placeholder=L(t),P.addEventListener("input",N),x.appendChild(T),x.appendChild(P),g.appendChild(x),y.push({key:t,input:P})})}b.addEventListener("change",async()=>{const c=b.value;if(!c){B=null,y=[],g.textContent="",h.textContent="",h.appendChild(A),u.disabled=!0;return}B=null,y=[],g.textContent="",u.disabled=!0;try{B=(await G.blocks.get(c)).content||"",m(B),N(),u.disabled=!1}catch{E.toast("Could not load template.",{type:"error"})}}),u.addEventListener("click",()=>{if(!b.value)return;const c=t=>t.replace(/"/g,""");let o=`template="${c(b.value)}"`;y.forEach(({key:t,input:x})=>{x.value!==""&&(o+=` ${t}="${c(x.value)}"`)});const p=`[block ${o} /]`;Le(e,p),e.dispatchEvent(new Event("input",{bubbles:!0})),i.close(),e.focus()})}),M.onForm(async e=>{const d=await G.forms.list().catch(()=>[]),i=document.createElement("div");i.style.cssText="padding:1rem;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;",z="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"),b=document.createElement("label");b.style.cssText=r,b.textContent="Form";const w=document.createElement("select");if(w.style.cssText=z,d.length)d.forEach(h=>{const A=document.createElement("option");A.value=h.slug,A.textContent=h.title||h.slug,w.appendChild(A)});else{const h=document.createElement("option");h.value="",h.textContent="No forms found",w.appendChild(h)}f.appendChild(b),f.appendChild(w),i.appendChild(f);const g=document.createElement("button");g.className="btn btn-primary btn-sm",g.style.cssText="align-self:flex-end;margin-top:.5rem;",g.textContent="Insert Form",i.appendChild(g);const u=E.modal({title:"Insert Form",size:"sm"});u.element.appendChild(i),u.open(),g.addEventListener("click",()=>{const h=w.value;h&&(Le(e,`[form slug="${h}" /]`),u.close(),K.get(0).dispatchEvent(new Event("input",{bubbles:!0})))})}),M.onView(async e=>{const d=await G.views.list().catch(()=>[]),i=document.createElement("div");i.style.cssText="padding:1rem;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;",z="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"),b=document.createElement("label");b.style.cssText=r,b.textContent="View";const w=document.createElement("select");if(w.style.cssText=z,d.length)d.forEach(y=>{const L=document.createElement("option");L.value=y.slug,L.textContent=y.title||y.slug,w.appendChild(L)});else{const y=document.createElement("option");y.value="",y.textContent="No Views configured yet \u2014 create one under Data \u2192 Views",w.appendChild(y)}f.appendChild(b),f.appendChild(w),i.appendChild(f);const g=document.createElement("div"),u=document.createElement("label");u.style.cssText=r,u.textContent="Display";const h=document.createElement("select");h.style.cssText=z,["table","cards","list"].forEach(y=>{const L=document.createElement("option");L.value=y,L.textContent=y.charAt(0).toUpperCase()+y.slice(1),h.appendChild(L)}),g.appendChild(u),g.appendChild(h),i.appendChild(g);const A=document.createElement("button");A.type="button",A.className="btn btn-primary",A.textContent="Insert",i.appendChild(A);const B=E.modal({title:"Insert View",size:"sm"});B.element.appendChild(i),B.open(),A.addEventListener("click",()=>{const y=w.value;if(!y)return;const L=`[view slug="${y}" display="${h.value}" /]`;B.close(),Le(e,L),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),M.onCta(async e=>{const d=await G.actions.list().catch(()=>[]),i=document.createElement("div");i.style.cssText="padding:1rem;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;",z="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(m,c){const o=document.createElement("div"),p=document.createElement("label");return p.style.cssText=r,p.textContent=m,o.appendChild(p),o.appendChild(c),o}function b(m){const c=document.createElement("select");return c.style.cssText=z,m.forEach(([o,p])=>{const t=document.createElement("option");t.value=o,t.textContent=p,c.appendChild(t)}),c}function w(m,c,o){const p=document.createElement("input");return p.type=m,p.placeholder=c||"",p.value=o||"",p.style.cssText=z,p}const g=b(d.length?d.map(m=>[m.slug,m.title||m.slug]):[["","No Actions configured yet \u2014 create one under Data \u2192 Actions"]]);i.appendChild(f("Action",g));const u=w("text","Button label","Run");if(i.appendChild(f("Label",u)),g.addEventListener("change",()=>{const m=d.find(c=>c.slug===g.value);m?.trigger?.label&&(u.value=m.trigger.label)}),d.length){const m=d[0];m?.trigger?.label&&(u.value=m.trigger.label)}const h=w("text","Paste entry UUID\u2026","");i.appendChild(f("Entry ID",h));const A=b([["primary","Primary"],["secondary","Secondary"],["ghost","Ghost"],["danger","Danger"]]);i.appendChild(f("Style",A));const B=w("text","e.g. check, zap, send (optional)","");i.appendChild(f("Icon",B));const y=w("text","Confirmation message (optional)","");i.appendChild(f("Confirm prompt",y));const L=document.createElement("button");L.type="button",L.className="btn btn-primary",L.textContent="Insert",i.appendChild(L);const N=E.modal({title:"Insert CTA Button",size:"sm"});N.element.appendChild(i),N.open(),L.addEventListener("click",()=>{const m=g.value;if(!m)return;const c=h.value.trim(),o=(u.value.trim()||"Run").replace(/\[\/cta\]/gi,""),p=A.value,t=B.value.trim().replace(/"/g,""),x=y.value.trim().replace(/"/g,""),T=c.replace(/"/g,"");let P=`action="${m}" style="${p}"`;T&&(P+=` entry="${T}"`),t&&(P+=` icon="${t}"`),x&&(P+=` confirm="${x}"`);const H=`[cta ${P}]${o}[/cta]`;N.close(),Le(e,H),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),M.onButton(async e=>{const i=(await G.pages.list().catch(()=>[])).map(t=>({label:t.title||t.urlPath,value:t.urlPath})),r=document.createElement("div");r.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const z="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 b(t,x){const T=document.createElement("div"),P=document.createElement("label");return P.style.cssText=z,P.textContent=t,T.appendChild(P),T.appendChild(x),T}function w(t,x){const T=document.createElement("input");return T.type="text",T.placeholder=t,T.value=x||"",T.style.cssText=f,T}function g(t){const x=document.createElement("select");return x.style.cssText=f,t.forEach(([T,P])=>{const H=document.createElement("option");H.value=T,H.textContent=P,x.appendChild(H)}),x}const u=e.value.substring(e.selectionStart,e.selectionEnd),h=w("/about or https://example.com",u.startsWith("/")?u:"");r.appendChild(b("URL",h));const A=w("Button label",u&&!u.startsWith("/")?u:"");r.appendChild(b("Label",A));const B=g([["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"]]);r.appendChild(b("Variant",B));const y=g([["","Default"],["sm","Small"],["lg","Large"]]);r.appendChild(b("Size",y));const L=w("e.g. arrow-right, star (optional)","");r.appendChild(b("Icon (before label)",L));const N=w("e.g. arrow-right (optional)","");r.appendChild(b("Icon (after label)",N));const m=document.createElement("label");m.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const c=document.createElement("input");c.type="checkbox",c.style.cssText="width:1rem;height:1rem;",m.appendChild(c),m.appendChild(document.createTextNode("Open in new tab")),r.appendChild(m);const o=document.createElement("button");o.type="button",o.className="btn btn-primary",o.textContent="Insert Button",r.appendChild(o);const p=E.modal({title:"Insert Button",size:"sm"});p.element.appendChild(r),p.open(),requestAnimationFrame(()=>{E.autocomplete(h,{data:i,minChars:1,onSelect:t=>{h.value=t.value,A.value||(A.value=t.label)}}),h.focus()}),o.addEventListener("click",()=>{const t=h.value.trim();if(!t)return;p.close();const x=A.value.trim()||t;let T=`href="${t}" variant="${B.value}"`;y.value&&(T+=` size="${y.value}"`);const P=L.value.trim().replace(/"/g,"");P&&(T+=` icon="${P}"`);const H=N.value.trim().replace(/"/g,"");H&&(T+=` icon-after="${H}"`),c.checked&&(T+=' target="_blank"');const k=`[button ${T}]${x}[/button]`;Le(e,k)})}),M.onLinkShortcode(async e=>{const i=(await G.pages.list().catch(()=>[])).map(o=>({label:o.title||o.urlPath,value:o.urlPath})),r=document.createElement("div");r.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const z="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 b(o,p){const t=document.createElement("div"),x=document.createElement("label");return x.style.cssText=z,x.textContent=o,t.appendChild(x),t.appendChild(p),t}function w(o,p){const t=document.createElement("input");return t.type="text",t.placeholder=o,t.value=p||"",t.style.cssText=f,t}const g=e.value.substring(e.selectionStart,e.selectionEnd),u=w("/about or https://example.com",g.startsWith("/")?g:"");r.appendChild(b("URL",u));const h=w("Link text",g&&!g.startsWith("/")?g:"");r.appendChild(b("Link text",h));const A=w("e.g. text-primary, fw-bold (optional)","");r.appendChild(b("CSS class",A));const B=w("e.g. arrow-right (optional)","");r.appendChild(b("Icon (before text)",B));const y=w("e.g. external-link (optional)","");r.appendChild(b("Icon (after text)",y));const L=document.createElement("label");L.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;",L.appendChild(N),L.appendChild(document.createTextNode("Open in new tab")),r.appendChild(L);const m=document.createElement("button");m.type="button",m.className="btn btn-primary",m.textContent="Insert Link",r.appendChild(m);const c=E.modal({title:"Insert Link Shortcode",size:"sm"});c.element.appendChild(r),c.open(),requestAnimationFrame(()=>{E.autocomplete(u,{data:i,minChars:1,onSelect:o=>{u.value=o.value,h.value||(h.value=o.label)}}),u.focus()}),m.addEventListener("click",()=>{const o=u.value.trim();if(!o)return;c.close();const p=h.value.trim()||o;let t=`href="${o}"`;const x=A.value.trim().replace(/"/g,"");x&&(t+=` class="${x}"`);const T=B.value.trim().replace(/"/g,"");T&&(t+=` icon="${T}"`);const P=y.value.trim().replace(/"/g,"");P&&(t+=` icon-after="${P}"`),N.checked&&(t+=' target="_blank"');const H=`[link ${t}]${p}[/link]`;Le(e,H)})}),M.onTabs(e=>{const d=document.createElement("div");d.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const i="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",r="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 z(m,c){const o=document.createElement("div"),p=document.createElement("label");return p.style.cssText=i,p.textContent=m,o.appendChild(p),o.appendChild(c),o}function f(m){const c=document.createElement("select");return c.style.cssText=r,m.forEach(([o,p])=>{const t=document.createElement("option");t.value=o,t.textContent=p,c.appendChild(t)}),c}const b=f([["","Default (underline)"],["pills","Pills"]]);d.appendChild(z("Style",b));const w=f([["","Left"],["center","Centre"]]);d.appendChild(z("Alignment",w));const g=document.createElement("div");g.style.cssText="display:flex;flex-direction:column;gap:.4rem;";const u=[];function h(){u.forEach(m=>{m.removeBtn.disabled=u.length<=2,m.removeBtn.style.opacity=u.length<=2?"0.3":"1"})}function A(m){const c=document.createElement("div");c.style.cssText="display:flex;gap:.4rem;align-items:center;";const o=document.createElement("input");o.type="text",o.placeholder="Tab title",o.value=m||"",o.style.cssText=r+"flex:1;";const p=document.createElement("button");p.type="button",p.textContent="\u2715",p.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 t={row:c,input:o,removeBtn:p};u.push(t),c.appendChild(o),c.appendChild(p),g.appendChild(c),p.addEventListener("click",()=>{if(u.length<=2)return;const x=u.indexOf(t);u.splice(x,1),g.removeChild(c),h()}),h()}A("Overview"),A("Details");const B=document.createElement("div");B.style.cssText=i,B.textContent="Tabs",d.appendChild(B),d.appendChild(g);const y=document.createElement("button");y.type="button",y.textContent="+ Add Tab",y.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;",y.addEventListener("click",()=>{u.length>=10||(A(""),u[u.length-1].input.focus())}),d.appendChild(y);const L=document.createElement("button");L.type="button",L.className="btn btn-primary",L.textContent="Insert Tabs",d.appendChild(L);const N=E.modal({title:"Insert Tabs",size:"sm"});N.element.appendChild(d),N.open(),requestAnimationFrame(()=>u[0].input.focus()),L.addEventListener("click",()=>{N.close();const m=b.value,c=w.value;let o=m?` style="${m}"`:"";c&&(o+=` align="${c}"`);let p=`[tabs${o}]
|
|
89
|
-
`;
|
|
90
|
-
`}),
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
`
|
|
88
|
+
`)}const _e="editor_prefs";function Ue(){return S.get(_e)||{viewMode:"split",fullscreen:!1}}function He(a,ce){const Ie=Ue();Ie[a]=ce,S.set(_e,Ie)}export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(a){const Ie=window.location.hash.match(/#\/pages\/edit(\/.*)/),O=Ie?Ie[1]:null,U=!!O,Be=E.loader(a.get(0),{type:"dots"}),Te=[K.layouts.get().catch(()=>({})),K.settings.get().catch(()=>({}))];U&&(Te.push(K.pages.get(O).catch(()=>null)),Te.push(K.pages.list().catch(()=>[])));const[Pe,Se,J,xe]=await Promise.all(Te);Be.destroy(),Ye(a.find("#field-theme").get(0),{includeDefault:!0});const Ce=Se?.layoutOptions?.spacerSize??40;if(U&&!J){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}a.find("#editor-title").text(U?`Edit Page \u2014 ${J.title||O}`:"New Page"),U&&a.find("#page-url-path").val(O),J&&(a.find("#field-title").val(J.title||""),a.find("#field-description").val(J.description||""),a.find("#field-status").val(J.status||"draft"),a.find("#field-sort-order").val(J.sortOrder??99),a.find("#field-show-in-nav").prop("checked",!!J.showInNav),a.find("#field-sidebar").prop("checked",!!J.sidebar),a.find("#field-show-breadcrumbs").prop("checked",J.breadcrumbs!==!1),a.find("#field-category").val(J.category||""),a.find("#field-visibility").val(J.visibility||"public"),a.find("#field-theme").val(J.theme||""),a.find("#field-seo-title").val(J.seo?.title||""),a.find("#field-seo-desc").val(J.seo?.description||""),J.dconfig&&a.find("#field-dconfig").val(JSON.stringify(J.dconfig,null,2)));const oe=a.find("#quick-switch");U&&Array.isArray(xe)&&xe.length&&([...xe].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===O&&(r.selected=!0),oe.get(0).appendChild(r)}),oe.css("display",""),oe.on("change",function(){const l=this.value;l&&R.navigate("/pages/edit"+l)}));const fe=await K.pages.tags().catch(()=>[]),Ee=a.find("#field-tags").get(0),Re=Ee?E.pillbox(Ee,{data:fe,value:J?.tags||[],creatable:!0,searchable:!0,placeholder:"Add tag\u2026"}):null,Le=a.find("#field-layout").empty();if(Object.entries(Pe).forEach(([e,l])=>{const r=(J?.layout||"default")===e?"selected":"";Le.append(`<option value="${e}" ${r}>${l.label||e}</option>`)}),U){const e=a.find("#view-page-btn").get(0);e.href=O,e.style.display="";const l=a.find("#live-preview-tab").get(0);l.style.display="";const r=a.find("#history-tab").get(0);r.style.display=""}if(E.tabs(a.find("#editor-meta-tabs").get(0)),U){const e=a.find("#live-preview-tab").get(0),l=a.find("#live-preview-frame").get(0);let r=!1;e.addEventListener("click",function(){r||(l.src=O,r=!0)}),Je(a,O)}const Z=a.find("#markdown-editor"),te=a.find("#markdown-preview");J&&Z.val(J.content||"");let ne=!1,pe="";K.settings.getCustomCss().then(({css:e})=>{if(pe=e||"",!pe)return;const l=document.createElement("style");l.id="preview-custom-css",l.textContent=pe,te.get(0).parentNode.insertBefore(l,te.get(0))}).catch(()=>{});let ae=!1;const W=Z.get(0),w=document.createElement("div");w.className="editor-line-numbers editor-line-numbers--foldable",W.parentElement.insertBefore(w,W);const le=je(W,w,{onFoldChange:()=>{}});le.setGuard(e=>{ae=e});const ge=()=>{le.refresh(),w.scrollTop=W.scrollTop};W.addEventListener("input",ge),W.addEventListener("scroll",()=>{w.scrollTop=W.scrollTop});let we=null;const j=()=>{clearTimeout(we),we=setTimeout(async()=>{const e=le.getUnfoldedContent();try{const{html:l}=await K.pages.preview(e);te.html(l,{safe:!1}),I.scan(te.get(0)),te.get(0).querySelectorAll(".tabs").forEach(r=>Domma.elements.tabs(r))}catch{window.marked&&te.html(marked.parse(e))}},400)},V=$e(Z,a.find("#editor-toolbar"),{spacerDefault:Ce});let he=!1,me="split",De=null;const se=document.createElement("button");se.className="editor-view-btn",se.type="button";const ze=document.createElement("span");ze.setAttribute("data-icon","css-code"),se.appendChild(ze);const de=document.createElement("button");de.className="editor-view-btn",de.type="button";const Ne=document.createElement("span");Ne.setAttribute("data-icon","code"),de.appendChild(Ne);let ve=!1;const X=document.createElement("button");X.className="editor-view-btn",X.type="button",X.textContent="\u25BC\u25BC",X.style.cssText="font-size:9px;letter-spacing:-1px;";const be=a.find(".editor-toolbar-right").get(0);be.prepend(X),be.prepend(de),be.prepend(se),I.scan(se),I.scan(de),E.tooltip(se,{content:"Edit Custom CSS",position:"top"}),E.tooltip(de,{content:"Format Markdown",position:"top"}),E.tooltip(X,{content:"Fold / unfold all shortcodes",position:"top"}),de.addEventListener("click",()=>{const e=Z.get(0),l=e.selectionStart,r=Qe(le.getUnfoldedContent());le.unfoldAll(),ae=!0,e.value=r,ae=!1,e.selectionStart=e.selectionEnd=Math.min(l,r.length),e.dispatchEvent(new Event("input")),le.refresh(),E.toast("Markdown formatted.",{type:"success"})}),X.addEventListener("click",()=>{ve?(le.unfoldAll(),X.textContent="\u25BC\u25BC",X.classList.remove("active")):(le.foldAll(),X.textContent="\u25B6\u25B6",X.classList.add("active")),ve=!ve});const ie=document.createElement("span");ie.className="editor-toolbar-sep",be.insertBefore(ie,be.children[3]),se.addEventListener("click",()=>{he=!he;const e=a.find("#markdown-editor"),l=a.find("#css-editor"),r=a.find("#editor-body");if(he){const i=a.find(".editor-view-btn[data-mode].active").get(0);me=i?i.getAttribute("data-mode"):"split",a.find(".editor-view-btn[data-mode]").removeClass("active"),a.find('.editor-view-btn[data-mode="split"]').addClass("active"),r.removeClass("editor-mode-write editor-mode-preview").addClass("editor-mode-split"),e.hide(),l.show(),ne||(l.val(pe),ne=!0,We(l.get(0))),se.classList.add("active")}else a.find(".editor-view-btn[data-mode]").removeClass("active"),a.find(`.editor-view-btn[data-mode="${me}"]`).addClass("active"),r.removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${me}`),l.hide(),e.show(),se.classList.remove("active")});const ye=Ue();ye.viewMode&&ye.viewMode!=="split"&&(a.find(".editor-view-btn[data-mode]").removeClass("active"),a.find(`.editor-view-btn[data-mode="${ye.viewMode}"]`).addClass("active"),a.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${ye.viewMode}`)),ye.fullscreen&&a.find(".editor-card").addClass("editor-fullscreen"),a.find("#css-editor").on("input",()=>{clearTimeout(De),De=setTimeout(()=>{let e=document.getElementById("preview-custom-css");e||(e=document.createElement("style"),e.id="preview-custom-css",te.get(0).parentNode.insertBefore(e,te.get(0))),e.textContent=a.find("#css-editor").val()},400)}),V.onLink(async e=>{const r=(await K.pages.list().catch(()=>[])).map(u=>({label:u.title||u.urlPath,value:u.urlPath})),i=document.createElement("div");i.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const L=document.createElement("label");L.className="form-label",L.textContent="URL";const f=document.createElement("input");f.type="text",f.className="form-input",f.placeholder="/about or https://example.com";const g=e.value.substring(e.selectionStart,e.selectionEnd);g&&g.startsWith("/")&&(f.value=g),i.appendChild(L),i.appendChild(f);const k=document.createElement("label");k.className="form-label",k.textContent="Link text";const b=document.createElement("input");b.type="text",b.className="form-input",b.placeholder="Display text",g&&!g.startsWith("/")&&(b.value=g),i.appendChild(k),i.appendChild(b);const h=document.createElement("label");h.className="form-label",h.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const p=document.createElement("input");p.type="checkbox",p.style.cssText="width:1rem;height:1rem;cursor:pointer;",h.appendChild(p),h.appendChild(document.createTextNode("Display as button")),i.appendChild(h);const A=document.createElement("label");A.className="form-label",A.textContent="Button colour",A.style.display="none";const N=document.createElement("select");N.className="form-select",N.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,N.appendChild(s)}),i.appendChild(A),i.appendChild(N),p.addEventListener("change",()=>{const u=p.checked;A.style.display=u?"":"none",N.style.display=u?"":"none"});const z=document.createElement("button");z.type="button",z.className="btn btn-primary",z.textContent="Insert Link",i.appendChild(z);const F=E.modal({title:"Insert Link",size:"sm"});F.element.appendChild(i),F.open(),requestAnimationFrame(()=>{E.autocomplete(f,{data:r,minChars:1,onSelect:u=>{f.value=u.value,b.value||(b.value=u.label)}}),f.focus()}),z.addEventListener("click",()=>{const u=f.value.trim(),m=b.value.trim();if(!u)return;F.close();const s=p.checked?`[button href="${u}" variant="${N.value}"]${m||u}[/button]`:`[${m||u}](${u})`,c=e.selectionStart,t=e.selectionEnd;e.value=e.value.substring(0,c)+s+e.value.substring(t),e.selectionStart=e.selectionEnd=c+s.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onImage(async e=>{const r=(await K.media.list().catch(()=>[])).filter(f=>/\.(png|jpe?g|gif|webp|svg)$/i.test(f.name)),i=document.createElement("div");if(i.className="media-picker-grid",r.length)r.forEach(f=>{const g=document.createElement("div");g.className="media-picker-item",g.dataset.url=f.url;const k=document.createElement("img");k.src=f.url,k.alt=f.name;const b=document.createElement("span");b.textContent=f.name,g.appendChild(k),g.appendChild(b),i.appendChild(g)});else{const f=document.createElement("p");f.className="text-muted p-3",f.textContent="No images uploaded yet.",i.appendChild(f)}const L=E.modal({title:"Insert Image",size:"lg"});L.element.appendChild(i),$(L.element).on("click",".media-picker-item",function(){const f=$(this).data("url"),g=$(this).find("span").text();ke(e,``),L.close(),Z.get(0).dispatchEvent(new Event("input",{bubbles:!0}))}),L.open()}),V.onCollection(async e=>{const[l,r]=await Promise.all([K.collections.list().catch(()=>[]),K.blocks.list().catch(()=>[])]),i=document.createElement("div");i.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const L="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;",g=document.createElement("div"),k=document.createElement("label");k.style.cssText=L,k.textContent="Collection";const b=document.createElement("select");if(b.style.cssText=f,l.length)l.forEach(q=>{const Q=document.createElement("option");Q.value=q.slug,Q.textContent=q.title||q.slug,b.appendChild(Q)});else{const q=document.createElement("option");q.value="",q.textContent="No collections found",b.appendChild(q)}g.appendChild(k),g.appendChild(b),i.appendChild(g);const h=document.createElement("div"),p=document.createElement("label");p.style.cssText=L,p.textContent="Display";const A=document.createElement("select");A.style.cssText=f,["table","cards","list","block"].forEach(q=>{const Q=document.createElement("option");Q.value=q,Q.textContent=q.charAt(0).toUpperCase()+q.slice(1),A.appendChild(Q)}),h.appendChild(p),h.appendChild(A),i.appendChild(h);const N=document.createElement("div");N.style.display="none";const v=document.createElement("label");v.style.cssText=L,v.textContent="Columns (2\u20134)";const z=document.createElement("input");z.type="number",z.min="2",z.max="4",z.value="3",z.style.cssText=f,N.appendChild(v),N.appendChild(z),i.appendChild(N);const F=document.createElement("div");F.style.display="none";const u=document.createElement("label");u.style.cssText=L,u.textContent="Block template";const m=document.createElement("select");if(m.style.cssText=f,r.length)r.forEach(q=>{const Q=document.createElement("option");Q.value=q.name??q,Q.textContent=q.name??q,m.appendChild(Q)});else{const q=document.createElement("option");q.value="",q.textContent="No block templates found",m.appendChild(q)}F.appendChild(u),F.appendChild(m),i.appendChild(F);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 t=document.createElement("input");t.type="checkbox",t.checked=!0,c.appendChild(t),c.appendChild(document.createTextNode("Enable search")),s.appendChild(c),i.appendChild(s);const y=document.createElement("div"),x=document.createElement("label");x.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const M=document.createElement("input");M.type="checkbox",M.checked=!0,x.appendChild(M),x.appendChild(document.createTextNode("Sortable columns")),y.appendChild(x),i.appendChild(y);const Y=document.createElement("div"),T=document.createElement("label");T.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const C=document.createElement("input");C.type="checkbox",C.checked=!1,T.appendChild(C),T.appendChild(document.createTextNode("CSV export")),Y.appendChild(T),i.appendChild(Y);const o=document.createElement("div"),d=document.createElement("label");d.style.cssText=L,d.textContent="Rows per page";const n=document.createElement("input");n.type="number",n.min="5",n.max="100",n.value="25",n.style.cssText=f,o.appendChild(d),o.appendChild(n),i.appendChild(o);const re=document.createElement("div"),H=document.createElement("label");H.style.cssText=L,H.textContent="Limit (optional)";const ee=document.createElement("input");ee.type="number",ee.placeholder="All",ee.style.cssText=f,re.appendChild(H),re.appendChild(ee),i.appendChild(re);const P=document.createElement("button");P.type="button",P.className="btn btn-primary",P.textContent="Insert",i.appendChild(P);const B=[s,y,Y,o],_=()=>{const q=A.value,Q=q==="table";B.forEach(ue=>{ue.style.display=Q?"":"none"}),N.style.display=q==="cards"||q==="block"?"":"none",F.style.display=q==="block"?"":"none"};A.addEventListener("change",_),_();const G=E.modal({title:"Insert Collection",size:"sm"});G.element.appendChild(i),G.open(),P.addEventListener("click",()=>{const q=b.value;if(!q)return;const Q=A.value;let ue=`[collection slug="${q}" display="${Q}"`;if(Q==="cards"&&(ue+=` columns="${z.value}"`),Q==="block"){const Oe=m.value;Oe&&(ue+=` block="${Oe}"`);const Ve=z.value.trim();Ve&&(ue+=` cols="${Ve}"`)}Q==="table"&&!t.checked&&(ue+=' search="false"'),Q==="table"&&!M.checked&&(ue+=' sortable="false"'),Q==="table"&&C.checked&&(ue+=' exportable="true"'),Q==="table"&&n.value!=="25"&&(ue+=` page-size="${n.value}"`);const qe=ee.value.trim();qe&&(ue+=` limit="${qe}"`),ue+=" /]",G.close(),ke(e,ue),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onBlock(async e=>{let l=[];try{l=await K.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"}),i=document.createElement("div");i.style.cssText="display:flex;gap:1rem;min-height:320px;";const L=document.createElement("div");L.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 g=document.createElement("select");g.className="form-select";const k=document.createElement("option");k.value="",k.textContent="\u2014 select a template \u2014",g.appendChild(k),l.forEach(m=>{const s=document.createElement("option");s.value=m.name,s.textContent=m.name,g.appendChild(s)}),L.appendChild(f),L.appendChild(g);const b=document.createElement("div");b.style.cssText="display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;max-height:260px;",L.appendChild(b);const h=document.createElement("button");h.className="btn btn-primary",h.type="button",h.textContent="Insert",h.disabled=!0,L.appendChild(h);const p=document.createElement("div");p.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 A=document.createElement("p");A.className="text-muted",A.style.cssText="font-size:.8rem;margin:0;",A.textContent="Select a template to see a preview.",p.appendChild(A),i.appendChild(L),i.appendChild(p),r.element.appendChild(i),r.open();let N=null,v=[];function z(m){return m.replace(/_/g," ").replace(/\b\w/g,s=>s.toUpperCase())}function F(){if(!N)return;const m={};v.forEach(({key:c,input:t})=>{m[c]=t.value});const s=N.replace(/\{\{([\w_]+)\}\}/g,(c,t)=>(m[t]??"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">"));p.innerHTML=DOMPurify.sanitize(s)}function u(m){b.textContent="",v=[];const s=new Set(["_id","_createdAt","_updatedAt"]),c=new Set;for(const[,t]of m.matchAll(/\{\{([\w_]+)\}\}/g))s.has(t)||c.add(t);if(!c.size){const t=document.createElement("p");t.className="text-muted",t.style.cssText="font-size:.8rem;margin:0;",t.textContent="No editable placeholders in this template.",b.appendChild(t);return}c.forEach(t=>{const y=document.createElement("div"),x=document.createElement("label");x.className="form-label",x.style.cssText="font-size:.8rem;margin-bottom:.2rem;display:block;",x.textContent=z(t);const M=document.createElement("input");M.type="text",M.className="form-input",M.placeholder=z(t),M.addEventListener("input",F),y.appendChild(x),y.appendChild(M),b.appendChild(y),v.push({key:t,input:M})})}g.addEventListener("change",async()=>{const m=g.value;if(!m){N=null,v=[],b.textContent="",p.textContent="",p.appendChild(A),h.disabled=!0;return}N=null,v=[],b.textContent="",h.disabled=!0;try{N=(await K.blocks.get(m)).content||"",u(N),F(),h.disabled=!1}catch{E.toast("Could not load template.",{type:"error"})}}),h.addEventListener("click",()=>{if(!g.value)return;const m=t=>t.replace(/"/g,""");let s=`template="${m(g.value)}"`;v.forEach(({key:t,input:y})=>{y.value!==""&&(s+=` ${t}="${m(y.value)}"`)});const c=`[block ${s} /]`;ke(e,c),e.dispatchEvent(new Event("input",{bubbles:!0})),r.close(),e.focus()})}),V.onForm(async e=>{const l=await K.forms.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const i="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",L="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"),g=document.createElement("label");g.style.cssText=i,g.textContent="Form";const k=document.createElement("select");if(k.style.cssText=L,l.length)l.forEach(p=>{const A=document.createElement("option");A.value=p.slug,A.textContent=p.title||p.slug,k.appendChild(A)});else{const p=document.createElement("option");p.value="",p.textContent="No forms found",k.appendChild(p)}f.appendChild(g),f.appendChild(k),r.appendChild(f);const b=document.createElement("button");b.className="btn btn-primary btn-sm",b.style.cssText="align-self:flex-end;margin-top:.5rem;",b.textContent="Insert Form",r.appendChild(b);const h=E.modal({title:"Insert Form",size:"sm"});h.element.appendChild(r),h.open(),b.addEventListener("click",()=>{const p=k.value;p&&(ke(e,`[form slug="${p}" /]`),h.close(),Z.get(0).dispatchEvent(new Event("input",{bubbles:!0})))})}),V.onView(async e=>{const l=await K.views.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const i="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",L="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"),g=document.createElement("label");g.style.cssText=i,g.textContent="View";const k=document.createElement("select");if(k.style.cssText=L,l.length)l.forEach(v=>{const z=document.createElement("option");z.value=v.slug,z.textContent=v.title||v.slug,k.appendChild(z)});else{const v=document.createElement("option");v.value="",v.textContent="No Views configured yet \u2014 create one under Data \u2192 Views",k.appendChild(v)}f.appendChild(g),f.appendChild(k),r.appendChild(f);const b=document.createElement("div"),h=document.createElement("label");h.style.cssText=i,h.textContent="Display";const p=document.createElement("select");p.style.cssText=L,["table","cards","list"].forEach(v=>{const z=document.createElement("option");z.value=v,z.textContent=v.charAt(0).toUpperCase()+v.slice(1),p.appendChild(z)}),b.appendChild(h),b.appendChild(p),r.appendChild(b);const A=document.createElement("button");A.type="button",A.className="btn btn-primary",A.textContent="Insert",r.appendChild(A);const N=E.modal({title:"Insert View",size:"sm"});N.element.appendChild(r),N.open(),A.addEventListener("click",()=>{const v=k.value;if(!v)return;const z=`[view slug="${v}" display="${p.value}" /]`;N.close(),ke(e,z),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onCta(async e=>{const l=await K.actions.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;";const i="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",L="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=i,c.textContent=u,s.appendChild(c),s.appendChild(m),s}function g(u){const m=document.createElement("select");return m.style.cssText=L,u.forEach(([s,c])=>{const t=document.createElement("option");t.value=s,t.textContent=c,m.appendChild(t)}),m}function k(u,m,s){const c=document.createElement("input");return c.type=u,c.placeholder=m||"",c.value=s||"",c.style.cssText=L,c}const b=g(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",b));const h=k("text","Button label","Run");if(r.appendChild(f("Label",h)),b.addEventListener("change",()=>{const u=l.find(m=>m.slug===b.value);u?.trigger?.label&&(h.value=u.trigger.label)}),l.length){const u=l[0];u?.trigger?.label&&(h.value=u.trigger.label)}const p=k("text","Paste entry UUID\u2026","");r.appendChild(f("Entry ID",p));const A=g([["primary","Primary"],["secondary","Secondary"],["ghost","Ghost"],["danger","Danger"]]);r.appendChild(f("Style",A));const N=k("text","e.g. check, zap, send (optional)","");r.appendChild(f("Icon",N));const v=k("text","Confirmation message (optional)","");r.appendChild(f("Confirm prompt",v));const z=document.createElement("button");z.type="button",z.className="btn btn-primary",z.textContent="Insert",r.appendChild(z);const F=E.modal({title:"Insert CTA Button",size:"sm"});F.element.appendChild(r),F.open(),z.addEventListener("click",()=>{const u=b.value;if(!u)return;const m=p.value.trim(),s=(h.value.trim()||"Run").replace(/\[\/cta\]/gi,""),c=A.value,t=N.value.trim().replace(/"/g,""),y=v.value.trim().replace(/"/g,""),x=m.replace(/"/g,"");let M=`action="${u}" style="${c}"`;x&&(M+=` entry="${x}"`),t&&(M+=` icon="${t}"`),y&&(M+=` confirm="${y}"`);const Y=`[cta ${M}]${s}[/cta]`;F.close(),ke(e,Y),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onButton(async e=>{const r=(await K.pages.list().catch(()=>[])).map(t=>({label:t.title||t.urlPath,value:t.urlPath})),i=document.createElement("div");i.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const L="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 g(t,y){const x=document.createElement("div"),M=document.createElement("label");return M.style.cssText=L,M.textContent=t,x.appendChild(M),x.appendChild(y),x}function k(t,y){const x=document.createElement("input");return x.type="text",x.placeholder=t,x.value=y||"",x.style.cssText=f,x}function b(t){const y=document.createElement("select");return y.style.cssText=f,t.forEach(([x,M])=>{const Y=document.createElement("option");Y.value=x,Y.textContent=M,y.appendChild(Y)}),y}const h=e.value.substring(e.selectionStart,e.selectionEnd),p=k("/about or https://example.com",h.startsWith("/")?h:"");i.appendChild(g("URL",p));const A=k("Button label",h&&!h.startsWith("/")?h:"");i.appendChild(g("Label",A));const N=b([["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"]]);i.appendChild(g("Variant",N));const v=b([["","Default"],["sm","Small"],["lg","Large"]]);i.appendChild(g("Size",v));const z=k("e.g. arrow-right, star (optional)","");i.appendChild(g("Icon (before label)",z));const F=k("e.g. arrow-right (optional)","");i.appendChild(g("Icon (after label)",F));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")),i.appendChild(u);const s=document.createElement("button");s.type="button",s.className="btn btn-primary",s.textContent="Insert Button",i.appendChild(s);const c=E.modal({title:"Insert Button",size:"sm"});c.element.appendChild(i),c.open(),requestAnimationFrame(()=>{E.autocomplete(p,{data:r,minChars:1,onSelect:t=>{p.value=t.value,A.value||(A.value=t.label)}}),p.focus()}),s.addEventListener("click",()=>{const t=p.value.trim();if(!t)return;c.close();const y=A.value.trim()||t;let x=`href="${t}" variant="${N.value}"`;v.value&&(x+=` size="${v.value}"`);const M=z.value.trim().replace(/"/g,"");M&&(x+=` icon="${M}"`);const Y=F.value.trim().replace(/"/g,"");Y&&(x+=` icon-after="${Y}"`),m.checked&&(x+=' target="_blank"');const T=`[button ${x}]${y}[/button]`;ke(e,T)})}),V.onLinkShortcode(async e=>{const r=(await K.pages.list().catch(()=>[])).map(s=>({label:s.title||s.urlPath,value:s.urlPath})),i=document.createElement("div");i.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const L="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 g(s,c){const t=document.createElement("div"),y=document.createElement("label");return y.style.cssText=L,y.textContent=s,t.appendChild(y),t.appendChild(c),t}function k(s,c){const t=document.createElement("input");return t.type="text",t.placeholder=s,t.value=c||"",t.style.cssText=f,t}const b=e.value.substring(e.selectionStart,e.selectionEnd),h=k("/about or https://example.com",b.startsWith("/")?b:"");i.appendChild(g("URL",h));const p=k("Link text",b&&!b.startsWith("/")?b:"");i.appendChild(g("Link text",p));const A=k("e.g. text-primary, fw-bold (optional)","");i.appendChild(g("CSS class",A));const N=k("e.g. arrow-right (optional)","");i.appendChild(g("Icon (before text)",N));const v=k("e.g. external-link (optional)","");i.appendChild(g("Icon (after text)",v));const z=document.createElement("label");z.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9em;";const F=document.createElement("input");F.type="checkbox",F.style.cssText="width:1rem;height:1rem;",z.appendChild(F),z.appendChild(document.createTextNode("Open in new tab")),i.appendChild(z);const u=document.createElement("button");u.type="button",u.className="btn btn-primary",u.textContent="Insert Link",i.appendChild(u);const m=E.modal({title:"Insert Link Shortcode",size:"sm"});m.element.appendChild(i),m.open(),requestAnimationFrame(()=>{E.autocomplete(h,{data:r,minChars:1,onSelect:s=>{h.value=s.value,p.value||(p.value=s.label)}}),h.focus()}),u.addEventListener("click",()=>{const s=h.value.trim();if(!s)return;m.close();const c=p.value.trim()||s;let t=`href="${s}"`;const y=A.value.trim().replace(/"/g,"");y&&(t+=` class="${y}"`);const x=N.value.trim().replace(/"/g,"");x&&(t+=` icon="${x}"`);const M=v.value.trim().replace(/"/g,"");M&&(t+=` icon-after="${M}"`),F.checked&&(t+=' target="_blank"');const Y=`[link ${t}]${c}[/link]`;ke(e,Y)})}),V.onTabs(e=>{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;",i="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 L(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=i,u.forEach(([s,c])=>{const t=document.createElement("option");t.value=s,t.textContent=c,m.appendChild(t)}),m}const g=f([["","Default (underline)"],["pills","Pills"]]);l.appendChild(L("Style",g));const k=f([["","Left"],["center","Centre"]]);l.appendChild(L("Alignment",k));const b=document.createElement("div");b.style.cssText="display:flex;flex-direction:column;gap:.4rem;";const h=[];function p(){h.forEach(u=>{u.removeBtn.disabled=h.length<=2,u.removeBtn.style.opacity=h.length<=2?"0.3":"1"})}function A(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=i+"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 t={row:m,input:s,removeBtn:c};h.push(t),m.appendChild(s),m.appendChild(c),b.appendChild(m),c.addEventListener("click",()=>{if(h.length<=2)return;const y=h.indexOf(t);h.splice(y,1),b.removeChild(m),p()}),p()}A("Overview"),A("Details");const N=document.createElement("div");N.style.cssText=r,N.textContent="Tabs",l.appendChild(N),l.appendChild(b);const v=document.createElement("button");v.type="button",v.textContent="+ Add Tab",v.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;",v.addEventListener("click",()=>{h.length>=10||(A(""),h[h.length-1].input.focus())}),l.appendChild(v);const z=document.createElement("button");z.type="button",z.className="btn btn-primary",z.textContent="Insert Tabs",l.appendChild(z);const F=E.modal({title:"Insert Tabs",size:"sm"});F.element.appendChild(l),F.open(),requestAnimationFrame(()=>h[0].input.focus()),z.addEventListener("click",()=>{F.close();const u=g.value,m=k.value;let s=u?` style="${u}"`:"";m&&(s+=` align="${m}"`);let c=`[tabs${s}]
|
|
89
|
+
`;h.forEach((t,y)=>{const x=t.input.value.trim()||`Tab ${y+1}`;c+=`[tab title="${x}"]Tab content here.[/tab]
|
|
90
|
+
`}),c+="[/tabs]",ke(e,c),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onGrid(e=>{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;",i="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 L(H,ee){const P=document.createElement("div"),B=document.createElement("label");return B.style.cssText=r,B.textContent=H,P.appendChild(B),P.appendChild(ee),P}function f(H){const ee=document.createElement("select");return ee.style.cssText=i,H.forEach(([P,B])=>{const _=document.createElement("option");_.value=P,_.textContent=B,ee.appendChild(_)}),ee}let g="grid";const k=document.createElement("div");k.style.cssText="display:flex;gap:.5rem;";const b=document.createElement("button");b.type="button",b.className="btn btn-sm btn-primary",b.textContent="Grid";const h=document.createElement("button");h.type="button",h.className="btn btn-sm btn-ghost",h.textContent="Row",k.appendChild(b),k.appendChild(h),l.appendChild(k);const p=document.createElement("input");p.type="number",p.min="1",p.max="12",p.value="2",p.style.cssText=i,l.appendChild(L("Columns",p));const A=f([["0","0"],["1","1"],["2","2"],["3","3"],["4","4 (default)"],["6","6"],["8","8"],["10","10"],["12","12"],["16","16"]]);A.value="4",l.appendChild(L("Gap",A));const N=document.createElement("div");N.style.cssText="display:flex;flex-direction:column;gap:.5rem;";const v=document.createElement("label");v.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const z=document.createElement("input");z.type="checkbox",v.appendChild(z),v.appendChild(document.createTextNode("Full width (breakout)")),N.appendChild(v);const F=document.createElement("div");F.style.cssText=r+"margin-top:.25rem;",F.textContent="Column Spans",N.appendChild(F);const u=document.createElement("div");u.style.cssText="display:flex;flex-direction:column;gap:.3rem;",N.appendChild(u),l.appendChild(N);const m=[];function s(){const H=Math.min(Math.max(parseInt(p.value)||2,1),12),ee=m.map(P=>P.value);u.textContent="",m.length=0;for(let P=0;P<H;P++){const B=document.createElement("div");B.style.cssText="display:flex;align-items:center;gap:.5rem;";const _=document.createElement("span");_.style.cssText="font-size:.85em;color:var(--dm-text-muted,#aaa);white-space:nowrap;min-width:3em;",_.textContent=`Col ${P+1}`;const G=document.createElement("input");G.type="number",G.min="1",G.max="12",G.placeholder="auto",G.value=ee[P]||"",G.style.cssText=i+"width:5em;flex:none;",B.appendChild(_),B.appendChild(G),u.appendChild(B),m.push(G)}}p.addEventListener("input",s),s();const c=document.createElement("div");c.style.cssText="display:none;flex-direction:column;gap:.5rem;";const t=document.createElement("label");t.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const y=document.createElement("input");y.type="checkbox",t.appendChild(y),t.appendChild(document.createTextNode("Enable staggered reveal")),c.appendChild(t);const x=document.createElement("div");x.style.cssText="display:none;flex-direction:column;gap:.5rem;padding-left:.5rem;border-left:2px solid var(--dm-border,#333);";const M=f([["slide-up","Slide Up"],["slide-down","Slide Down"],["slide-left","Slide Left"],["slide-right","Slide Right"],["fade","Fade"],["zoom","Zoom"],["flip","Flip"]]);x.appendChild(L("Animation",M));const Y=f([["stagger","Stagger"],["sequence","Sequence"]]);x.appendChild(L("Mode",Y));const T=document.createElement("input");T.type="number",T.value="400",T.style.cssText=i,x.appendChild(L("Duration (ms)",T));const C=document.createElement("input");C.type="number",C.value="60",C.style.cssText=i,x.appendChild(L("Stagger (ms)",C));const o=document.createElement("input");o.type="number",o.value="0",o.style.cssText=i,x.appendChild(L("Delay (ms)",o));const d=f([["ltr","Left to Right"],["rtl","Right to Left"]]);x.appendChild(L("Direction",d)),c.appendChild(x),l.appendChild(c),y.addEventListener("change",()=>{x.style.display=y.checked?"flex":"none"});const n=document.createElement("button");n.type="button",n.className="btn btn-primary",n.textContent="Insert Grid",l.appendChild(n),b.addEventListener("click",()=>{g="grid",b.className="btn btn-sm btn-primary",h.className="btn btn-sm btn-ghost",N.style.display="flex",c.style.display="none",n.textContent="Insert Grid"}),h.addEventListener("click",()=>{g="row",h.className="btn btn-sm btn-primary",b.className="btn btn-sm btn-ghost",c.style.display="flex",N.style.display="none",n.textContent="Insert Row"});const re=E.modal({title:"Insert Grid / Row",size:"sm"});re.element.appendChild(l),re.open(),requestAnimationFrame(()=>p.focus()),n.addEventListener("click",()=>{re.close();const H=Math.min(Math.max(parseInt(p.value)||2,1),12),ee=A.value;let P;if(g==="grid"){let B=`cols="${H}"`;ee!=="4"&&(B+=` gap="${ee}"`),z.checked&&(B+=' fullwidth="true"'),P=`[grid ${B}]
|
|
91
|
+
`;for(let _=0;_<H;_++){const G=m[_]?.value?.trim(),q=G?` span="${G}"`:"";P+=`[col${q}]
|
|
92
|
+
Column ${_+1}
|
|
93
|
+
[/col]
|
|
94
|
+
`}P+="[/grid]"}else{let B="";if(ee!=="4"&&(B+=` gap="${ee}"`),y.checked){B+=" reveal",B+=` reveal-mode="${Y.value}"`,B+=` reveal-animation="${M.value}"`;const _=T.value.trim();_&&_!=="400"&&(B+=` reveal-duration="${_}"`);const G=C.value.trim();G&&G!=="60"&&(B+=` reveal-stagger="${G}"`);const q=o.value.trim();q&&q!=="0"&&(B+=` reveal-delay="${q}"`),d.value!=="ltr"&&(B+=` reveal-direction="${d.value}"`)}P=`[row${B?" "+B.trim():""}]
|
|
95
|
+
`;for(let _=0;_<H;_++)P+=`[col]Column ${_+1}[/col]
|
|
96
|
+
`;P+="[/row]"}ke(e,P),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onAccordion(async e=>{const l=await K.collections.list().catch(()=>[]),r=document.createElement("div");r.style.cssText="padding:.25rem 0 .5rem;display:flex;flex-direction:column;gap:.75rem;";const i="display:block;font-size:.85em;font-weight:600;margin-bottom:.25rem;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",L="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 g=document.createElement("button");g.type="button",g.className="btn btn-sm btn-primary",g.textContent="Static";const k=document.createElement("button");k.type="button",k.className="btn btn-sm btn-ghost",k.textContent="Collection",f.appendChild(g),f.appendChild(k),r.appendChild(f);let b="static";const h=document.createElement("div");h.style.cssText="display:flex;flex-direction:column;gap:.5rem;";const p=[];function A(P){const B=document.createElement("div");B.style.cssText="display:flex;align-items:center;gap:.5rem;";const _=document.createElement("label");_.style.cssText="font-size:.85em;color:var(--dm-text-muted,#aaa);white-space:nowrap;",_.textContent=`Item ${P}`;const G=document.createElement("input");return G.type="text",G.placeholder="Item title",G.style.cssText=L,B.appendChild(_),B.appendChild(G),{row:B,input:G}}[1,2].forEach(P=>{const B=A(P);p.push(B),h.appendChild(B.row)});const N=document.createElement("button");N.type="button",N.className="btn btn-ghost btn-sm",N.textContent="+ Add Item",N.addEventListener("click",()=>{const P=A(p.length+1);p.push(P),h.insertBefore(P.row,N)}),h.appendChild(N);const v=document.createElement("label");v.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const z=document.createElement("input");z.type="checkbox",v.appendChild(z),v.appendChild(document.createTextNode("Allow multiple open")),h.appendChild(v),r.appendChild(h);const F=document.createElement("div");F.style.cssText="display:none;flex-direction:column;gap:.5rem;";const u=document.createElement("div"),m=document.createElement("label");m.style.cssText=i,m.textContent="Collection";const s=document.createElement("select");if(s.style.cssText=L,l.length)l.forEach(P=>{const B=document.createElement("option");B.value=P.slug,B.textContent=P.title||P.slug,s.appendChild(B)});else{const P=document.createElement("option");P.value="",P.textContent="No collections found",s.appendChild(P)}u.appendChild(m),u.appendChild(s),F.appendChild(u);const c=document.createElement("div"),t=document.createElement("label");t.style.cssText=i,t.textContent="Title field";const y=document.createElement("select");y.style.cssText=L,c.appendChild(t),c.appendChild(y),F.appendChild(c);const x=document.createElement("div"),M=document.createElement("label");M.style.cssText=i,M.textContent="Body field";const Y=document.createElement("select");Y.style.cssText=L,x.appendChild(M),x.appendChild(Y),F.appendChild(x);async function T(P){y.textContent="",Y.textContent="";try{const _=(await K.collections.get(P)).fields||[];if(!_.length){const G=document.createElement("option");G.value="",G.textContent="\u2014 none \u2014",y.appendChild(G.cloneNode(!0)),Y.appendChild(G);return}_.forEach((G,q)=>{const Q=()=>{const ue=document.createElement("option");return ue.value=G.name,ue.textContent=G.label||G.name,ue};y.appendChild(Q()),Y.appendChild(Q()),G.name==="title"&&(y.value="title"),G.name==="description"&&(Y.value="description")}),!y.value&&_[0]&&(y.value=_[0].name),!Y.value&&_[1]&&(Y.value=_[1].name)}catch{const B=document.createElement("option");B.value="",B.textContent="\u2014 unknown \u2014",y.appendChild(B.cloneNode(!0)),Y.appendChild(B)}}l.length&&T(l[0].slug),s.addEventListener("change",()=>T(s.value));const C=document.createElement("div"),o=document.createElement("label");o.style.cssText=i,o.textContent="Limit (optional)";const d=document.createElement("input");d.type="number",d.placeholder="All",d.style.cssText=L,C.appendChild(o),C.appendChild(d),F.appendChild(C);const n=document.createElement("label");n.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const re=document.createElement("input");re.type="checkbox",n.appendChild(re),n.appendChild(document.createTextNode("Allow multiple open")),F.appendChild(n),r.appendChild(F),g.addEventListener("click",()=>{b="static",g.className="btn btn-sm btn-primary",k.className="btn btn-sm btn-ghost",h.style.display="flex",F.style.display="none"}),k.addEventListener("click",()=>{b="collection",k.className="btn btn-sm btn-primary",g.className="btn btn-sm btn-ghost",F.style.display="flex",h.style.display="none"});const H=document.createElement("button");H.type="button",H.className="btn btn-primary",H.textContent="Insert Accordion",r.appendChild(H);const ee=E.modal({title:"Insert Accordion",size:"sm"});ee.element.appendChild(r),ee.open(),requestAnimationFrame(()=>p[0].input.focus()),H.addEventListener("click",()=>{if(b==="collection"&&!s.value)return;ee.close();let P;if(b==="static")P=`[accordion${z.checked?' multiple="true"':""}]
|
|
97
|
+
`,p.forEach((_,G)=>{const q=_.input.value.trim()||`Item ${G+1}`;P+=`[item title="${q}"]Content here.[/item]
|
|
98
|
+
`}),P+="[/accordion]";else{const B=s.value;if(!B)return;const _=y.value,G=Y.value;let q=`slug="${B}" display="accordion"`;_&&(q+=` title-field="${_}"`),G&&(q+=` body-field="${G}"`);const Q=d.value.trim();Q&&(q+=` limit="${Q}"`),re.checked&&(q+=' multiple="true"'),P=`[collection ${q} /]`}ke(e,P),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onListGroup(e=>{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;",i="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 L(c,t){const y=document.createElement("div"),x=document.createElement("label");return x.style.cssText=r,x.textContent=c,y.appendChild(x),y.appendChild(t),y}function f(c){const t=document.createElement("select");return t.style.cssText=i,c.forEach(([y,x])=>{const M=document.createElement("option");M.value=y,M.textContent=x,t.appendChild(M)}),t}const g=f([["","Default"],["flush","Flush (no outer border)"],["numbered","Numbered"],["horizontal","Horizontal"]]);l.appendChild(L("Variant",g));const k=f([["","Default"],["sm","Small"],["lg","Large"]]);l.appendChild(L("Size",k));const b=f([["","Default"],["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"]]);l.appendChild(L("Item Colour",b));const h=document.createElement("label");h.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.9em;cursor:pointer;";const p=document.createElement("input");p.type="checkbox",h.appendChild(p),h.appendChild(document.createTextNode("Actionable items (hover highlight)")),l.appendChild(h);const A=document.createElement("div");A.style.cssText=r+"margin-bottom:.35rem;",A.textContent="Items",l.appendChild(A);const N=document.createElement("div");N.style.cssText="display:flex;flex-direction:column;gap:.4rem;",l.appendChild(N);const v=[];function z(){v.forEach(c=>{c.removeBtn.disabled=v.length<=1,c.removeBtn.style.opacity=v.length<=1?"0.3":"1"})}function F(c){const t=document.createElement("div");t.style.cssText="display:flex;gap:.4rem;align-items:center;";const y=document.createElement("input");y.type="text",y.placeholder="Item text",y.value=c||"",y.style.cssText=i+"flex:1;";const x=document.createElement("button");x.type="button",x.textContent="\u2715",x.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 M={row:t,input:y,removeBtn:x};v.push(M),t.appendChild(y),t.appendChild(x),N.appendChild(t),x.addEventListener("click",()=>{if(v.length<=1)return;const Y=v.indexOf(M);v.splice(Y,1),N.removeChild(t),z()}),z()}F("Item 1"),F("Item 2"),F("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",()=>{v.length>=20||(F(""),v[v.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(()=>v[0].input.focus()),m.addEventListener("click",()=>{s.close();let c="";g.value&&(c+=` variant="${g.value}"`),k.value&&(c+=` size="${k.value}"`),b.value&&(c+=` itemvariant="${b.value}"`),p.checked&&(c+=' action="true"');let t=`[listgroup${c}]
|
|
99
|
+
`;v.forEach(y=>{const x=y.input.value.trim();x&&(t+=`[item]${x}[/item]
|
|
100
|
+
`)}),t+="[/listgroup]",ke(e,t),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}),V.onHelp(()=>{Ke()}),a.find(".editor-view-btn").on("click",function(){const e=$(this).data("mode");e&&(a.find(".editor-view-btn").removeClass("active"),$(this).addClass("active"),a.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${e}`),He("viewMode",e))}),a.find("#fullscreen-btn").on("click",function(){a.find(".editor-card").toggleClass("editor-fullscreen"),He("fullscreen",a.find(".editor-card").hasClass("editor-fullscreen"))}),Ae=!1,a.find("#quick-switch").prop("disabled",!1),Me&&window.removeEventListener("beforeunload",Me),Me=e=>{Ae&&e.preventDefault()},window.addEventListener("beforeunload",Me),Ge||(Ge=!0,R.use((e,l,r)=>{const i=window.location.hash.startsWith("#/pages/edit")||window.location.hash==="#/pages/new";if(!Ae||!i)return r();E.confirm("You have unsaved changes. Leave this page?").then(L=>{L&&(Ae=!1,r())})})),Z.on("input",()=>{ae||(Ae=!0,a.find("#quick-switch").prop("disabled",!0),j())});const Fe=a.find("#editor-meta-tabs").get(0);Fe&&(Fe.addEventListener("input",()=>{Ae=!0,a.find("#quick-switch").prop("disabled",!0)}),Fe.addEventListener("change",e=>{e.target.id!=="quick-switch"&&(Ae=!0,a.find("#quick-switch").prop("disabled",!0))})),j(),a.find("#save-btn").on("click",async()=>{const e=a.find("#page-url-path").val().trim();if(!e){E.toast("URL path is required.",{type:"warning"});return}const l=a.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 i={title:a.find("#field-title").val().trim()||"Untitled",description:a.find("#field-description").val().trim(),layout:a.find("#field-layout").val(),status:a.find("#field-status").val(),sortOrder:parseInt(a.find("#field-sort-order").val(),10)||99,showInNav:a.find("#field-show-in-nav").is(":checked"),sidebar:a.find("#field-sidebar").is(":checked"),...a.find("#field-show-breadcrumbs").is(":checked")?{}:{breadcrumbs:!1},tags:Re?Re.getValue():[],category:a.find("#field-category").val().trim()||null,visibility:a.find("#field-visibility").val()||"public",seo:{title:a.find("#field-seo-title").val().trim(),description:a.find("#field-seo-desc").val().trim()},dconfig:r,...a.find("#field-theme").val()?{theme:a.find("#field-theme").val()}:{}};try{a.find("#save-btn").prop("disabled",!0).text("Saving\u2026");const L=le.getUnfoldedContent();if(U){const f={frontmatter:i,body:L};e!==O&&(f.newUrlPath=e),await K.pages.update(O,f),ne&&await K.settings.saveCustomCss(a.find("#css-editor").val()),E.toast(ne?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),Ae=!1,a.find("#quick-switch").prop("disabled",!1),e!==O&&R.navigate(`/pages/edit${e}`)}else await K.pages.create({urlPath:e,frontmatter:i,body:L}),ne&&await K.settings.saveCustomCss(a.find("#css-editor").val()),E.toast(ne?"Page and CSS saved.":"Page saved successfully.",{type:"success"}),Ae=!1,R.navigate("/pages")}catch(L){E.toast(`Save failed: ${L.message||"Unknown error"}`,{type:"error"})}finally{a.find("#save-btn").prop("disabled",!1).text("Save")}}),a.find("#cancel-btn").on("click",()=>R.navigate("/pages")),Domma.icons.scan()}};
|