domma-cms 0.2.1 → 0.3.0

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

@@ -1,661 +1,53 @@
-/**
- * Page Editor View
- * Handles both create (new) and edit (existing) modes.
- * Provides a split-pane Markdown editor with live preview, toolbar, and media picker.
- */
-import {api} from '../api.js';
-import {createToolbar, insertAtCursor, wrapSelection} from '../lib/markdown-toolbar.js';
-
-/**
- * Builds and opens the editor help slideover with a cheat-sheet reference.
- */
-function openEditorHelp() {
-  const so = E.slideover({ title: 'Editor Reference', size: 'md', position: 'right' });
-
-  const codeStyle = 'background:var(--dm-surface-subtle,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;';
-  const h3Style = 'margin:1rem 0 .5rem;font-size:1rem;';
-
-  function makeCode(text) {
-    const el = document.createElement('code');
-    el.style.cssText = codeStyle;
-    el.textContent = text;
-    return el;
-  }
-
-  function makeH3(text) {
-    const el = document.createElement('h3');
-    el.style.cssText = h3Style;
-    el.textContent = text;
-    return el;
-  }
-
-  const wrap = document.createElement('div');
-  wrap.style.cssText = 'padding:1rem;display:flex;flex-direction:column;gap:1rem;';
-
-  // --- Section 1: Markdown Basics ---
-  const section1 = document.createElement('div');
-  section1.appendChild(makeH3('Markdown Basics'));
-
-  const table = document.createElement('table');
-  table.style.cssText = 'width:100%;border-collapse:collapse;font-size:.9em;';
-
-  const thead = document.createElement('thead');
-  const headerRow = document.createElement('tr');
-  ['Syntax', 'Result'].forEach(text => {
-    const th = document.createElement('th');
-    th.style.cssText = 'text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);';
-    th.textContent = text;
-    headerRow.appendChild(th);
-  });
-  thead.appendChild(headerRow);
-  table.appendChild(thead);
-
-  const tbody = document.createElement('tbody');
-  const rows = [
-    ['**bold**', 'bold (rendered bold)'],
-    ['_italic_', 'italic (rendered italic)'],
-    ['## Heading', 'Heading (h2)'],
-    ['[text](url)', 'Link'],
-    ['![alt](url)', 'Image'],
-    ['- item', 'Bullet list'],
-    ['`code`', 'Inline code'],
-    ['---', 'Divider'],
-  ];
-  rows.forEach(([syntax, result]) => {
-    const tr = document.createElement('tr');
-    const tdSyntax = document.createElement('td');
-    tdSyntax.style.cssText = 'padding:.35rem .5rem;vertical-align:top;';
-    tdSyntax.appendChild(makeCode(syntax));
-    const tdResult = document.createElement('td');
-    tdResult.style.cssText = 'padding:.35rem .5rem;vertical-align:top;color:var(--dm-text-muted,#aaa);font-size:.85em;';
-    tdResult.textContent = result;
-    tr.appendChild(tdSyntax);
-    tr.appendChild(tdResult);
-    tbody.appendChild(tr);
-  });
-  table.appendChild(tbody);
-  section1.appendChild(table);
-  wrap.appendChild(section1);
-
-  // --- Section 2: Grid shortcodes ---
-  const section2 = document.createElement('div');
-  section2.appendChild(makeH3('Grid & Columns'));
-
-  function makeNote(text) {
-    const el = document.createElement('p');
-    el.style.cssText = 'margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);';
-    el.textContent = text;
-    return el;
-  }
-
-  function makeSnippet(label, code, note) {
-    const lbl = document.createElement('p');
-    lbl.style.cssText = 'margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;';
-    lbl.textContent = label;
-    const pre = document.createElement('pre');
-    pre.style.cssText = codeStyle + 'display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;margin:0;';
-    pre.textContent = code;
-    const frag = document.createDocumentFragment();
-    frag.appendChild(lbl);
-    frag.appendChild(pre);
-    if (note) frag.appendChild(makeNote(note));
-    return frag;
-  }
-
-  const gridAttrTable = document.createElement('table');
-  gridAttrTable.style.cssText = 'width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;';
-  [
-    ['cols="N"', '[grid] only', 'Number of columns (1–12)'],
-    ['gap="N"', '[grid], [row]', 'Gap between columns/rows (1–6)'],
-    ['span="N"', '[col] only', 'How many columns this cell spans'],
-    ['class="x"', 'all', 'Add extra CSS classes'],
-  ].forEach(([attr, where, desc]) => {
-    const tr = document.createElement('tr');
-    [attr, where, desc].forEach((txt, i) => {
-      const td = document.createElement('td');
-      td.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;';
-      if (i === 0) {
-        td.appendChild(makeCode(attr));
-      } else {
-        td.style.color = 'var(--dm-text-muted,#aaa)';
-        td.textContent = txt;
-      }
-      tr.appendChild(td);
-    });
-    gridAttrTable.appendChild(tr);
-  });
-  section2.appendChild(gridAttrTable);
-
-  section2.appendChild(makeSnippet(
-    'Equal columns',
-    '[grid cols="3" gap="4"]\n[col]One[/col]\n[col]Two[/col]\n[col]Three[/col]\n[/grid]',
-    'cols sets the track count; each [col] fills one track.'
-  ));
-
-  section2.appendChild(makeSnippet(
-    'Column spanning (12-col base)',
-    '[grid cols="12" gap="3"]\n[col span="8"]Main content[/col]\n[col span="4"]Sidebar[/col]\n[/grid]',
-    'span values must add up to cols. Common splits: 8/4, 6/6, 9/3.'
-  ));
-
-  section2.appendChild(makeSnippet(
-    'Row (flexbox, equal-width)',
-    '[row gap="4"]\n[col]Left[/col]\n[col]Right[/col]\n[/row]',
-    'Use [row] when you want equal-width columns without specifying a count.'
-  ));
-
-  section2.appendChild(makeSnippet(
-    'Card in a grid',
-    '[grid cols="3" gap="4"]\n[col]\n[card title="One"]Content[/card]\n[/col]\n[col]\n[card title="Two"]Content[/card]\n[/col]\n[col]\n[card title="Three"]Content[/card]\n[/col]\n[/grid]',
-    null
-  ));
-
-  wrap.appendChild(section2);
-
-  // --- Section 3: Card shortcode ---
-  const section3 = document.createElement('div');
-  section3.appendChild(makeH3('Cards'));
-
-  section3.appendChild(makeSnippet(
-    'Basic card',
-    '[card title="Optional Title"]\nMarkdown **works** here.\n[/card]',
-    'Omit title for a card with no header.'
-  ));
-
-  section3.appendChild(makeSnippet(
-    'Collapsible card',
-    '[card title="Click to expand" collapsible="true"]\nHidden by default.\n[/card]',
-    null
-  ));
-
-  wrap.appendChild(section3);
-
-  // --- Section 3c: Hero shortcode ---
-  const section3c = document.createElement('div');
-  section3c.appendChild(makeH3('Hero'));
-  section3c.appendChild(makeNote('Full-width hero sections — no plugin required. Uses Domma\'s built-in Hero CSS component.'));
-
-  const heroAttrTable = document.createElement('table');
-  heroAttrTable.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'],
-    ['class="..."', 'Extra CSS classes'],
-    ['id="..."', 'Element id'],
-  ].forEach(([attr, desc]) => {
-    const tr = document.createElement('tr');
-    const tdCode = document.createElement('td');
-    tdCode.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;';
-    tdCode.appendChild(makeCode(attr));
-    const tdDesc = document.createElement('td');
-    tdDesc.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);';
-    tdDesc.textContent = desc;
-    tr.appendChild(tdCode);
-    tr.appendChild(tdDesc);
-    heroAttrTable.appendChild(tr);
-  });
-  section3c.appendChild(heroAttrTable);
-
-  section3c.appendChild(makeSnippet(
-    'Basic hero',
-    '[hero title="Welcome" tagline="Build something great"][/hero]',
-    null
-  ));
-
-  section3c.appendChild(makeSnippet(
-    'Gradient with body content',
-    '[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]\nSome introductory **Markdown** content here.\n[/hero]',
-    null
-  ));
-
-  section3c.appendChild(makeSnippet(
-    '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.'
-  ));
-
-  wrap.appendChild(section3c);
-
-  // --- Section 3b: Interactive Components ---
-  const section3b = document.createElement('div');
-  section3b.appendChild(makeH3('Interactive Components'));
-  section3b.appendChild(makeNote('Tabs, accordion, carousel, and countdown — no plugin required.'));
-
-  section3b.appendChild(makeSnippet(
-    'Tabs',
-    '[tabs]\n[tab title="First"]Content **A**[/tab]\n[tab title="Second"]Content **B**[/tab]\n[/tabs]',
-    'Add style="pills" for pill-style navigation.'
-  ));
-
-  section3b.appendChild(makeSnippet(
-    'Accordion',
-    '[accordion]\n[item title="Question 1"]Answer here.[/item]\n[item title="Question 2"]Answer here.[/item]\n[/accordion]',
-    'Add multiple="true" to allow several panels open at once.'
-  ));
-
-  section3b.appendChild(makeSnippet(
-    'Carousel',
-    '[carousel autoplay="true" interval="5000"]\n[slide title="Slide 1"]Description[/slide]\n[slide image="/media/photo.jpg" title="Slide 2"]Caption[/slide]\n[/carousel]',
-    'Omit autoplay for a manual carousel. loop="false" disables wrapping.'
-  ));
-
-  section3b.appendChild(makeSnippet(
-    'Countdown (to date)',
-    '[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',
-    null
-  ));
-
-  section3b.appendChild(makeSnippet(
-    'Countdown (duration)',
-    '[countdown duration="300" format="mm:ss" /]',
-    'duration is in seconds. format options: mm:ss · HH:mm:ss · DD:HH:mm:ss'
-  ));
-
-  wrap.appendChild(section3b);
-
-  // --- Section 4: Embedding a Form ---
-  const section4 = document.createElement('div');
-  section4.appendChild(makeH3('Embedding a Form'));
-
-  const formPre = document.createElement('pre');
-  formPre.style.cssText = codeStyle + 'display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;';
-  formPre.textContent = '<div data-form="contact"></div>';
-  section4.appendChild(formPre);
-  section4.appendChild(makeNote('Replace "contact" with the form slug. Forms are managed under Forms in the sidebar.'));
-
-  wrap.appendChild(section4);
-
-  // --- Section 5: Effects shortcodes ---
-  const section5 = document.createElement('div');
-  section5.appendChild(makeH3('Effects'));
-  section5.appendChild(makeNote('Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin.'));
-
-  const effectsRows = [
-    ['[reveal animation="fade"]...[/reveal]', 'Fade/slide/zoom on scroll'],
-    ['[breathe]...[/breathe]', 'Continuous gentle scale loop'],
-    ['[pulse]...[/pulse]', 'Repeating scale pulse'],
-    ['[shake]...[/shake]', 'One-shot shake'],
-    ['[scribe speed="50"]...[/scribe]', 'Typewriter — simple mode (text typed letter by letter)'],
-    ['[scribe loop="true"][render]Text[/render][wait]1500[/wait][undo /][/scribe]', 'Typewriter — script mode (sequenced render/wait/undo actions)'],
-    ['[scramble]...[/scramble]', 'Character-scramble reveal'],
-    ['[counter to="100" /]', 'Animated number counter (self-closing)'],
-    ['[ripple]...[/ripple]', 'Click-triggered ripple'],
-    ['[twinkle count="50"]...[/twinkle]', 'Particle/star overlay'],
-    ['[animate type="fade-in-up"]...[/animate]', 'CSS-only animation (no plugin needed)'],
-    ['[ambient type="aurora"]...[/ambient]', 'CSS-only animated background'],
-    ['[firework type="burst" colour="rainbow" /]', 'CSS firework (self-closing)'],
-    ['[fireworks]...[/fireworks]', 'Fireworks display container'],
-    ['[celebrate theme="auto" /]', 'Seasonal canvas celebration'],
-  ];
-
-  const effectsTable = document.createElement('table');
-  effectsTable.style.cssText = 'width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;';
-  effectsRows.forEach(([syntax, desc]) => {
-    const tr = document.createElement('tr');
-    const tdCode = document.createElement('td');
-    tdCode.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;';
-    tdCode.appendChild(makeCode(syntax));
-    const tdDesc = document.createElement('td');
-    tdDesc.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);';
-    tdDesc.textContent = desc;
-    tr.appendChild(tdCode);
-    tr.appendChild(tdDesc);
-    effectsTable.appendChild(tr);
-  });
-  section5.appendChild(effectsTable);
-
-  section5.appendChild(makeSnippet(
-    'Scribe script — looping multi-phrase typewriter',
-    '[scribe loop="true" loop-delay="2000" delete-speed="20"]\n[render]We build things that matter.[/render]\n[wait]1200[/wait]\n[undo all="true" /]\n[render]We design for humans.[/render]\n[wait]1200[/wait]\n[undo all="true" /]\n[/scribe]',
-    'Use [render]...[/render] to type text, [wait]Ms[/wait] to pause, and [undo /] to delete. loop="true" replays the sequence. Only [render], [wait], and [undo] shortcodes are parsed — plain text between actions is ignored.'
-  ));
-
-  section5.appendChild(makeNote('Enable the Domma Effects plugin to activate these shortcodes on your site.'));
-
-  wrap.appendChild(section5);
-
-  // --- Section 6: Tables shortcode ---
-  const section6t = document.createElement('div');
-  section6t.appendChild(makeH3('Tables'));
-  section6t.appendChild(makeNote('Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling.'));
-
-  const tableAttrTable = document.createElement('table');
-  tableAttrTable.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(([attr, desc]) => {
-    const tr = document.createElement('tr');
-    const tdCode = document.createElement('td');
-    tdCode.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;';
-    tdCode.appendChild(makeCode(attr));
-    const tdDesc = document.createElement('td');
-    tdDesc.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);';
-    tdDesc.textContent = desc;
-    tr.appendChild(tdCode);
-    tr.appendChild(tdDesc);
-    tableAttrTable.appendChild(tr);
-  });
-  section6t.appendChild(tableAttrTable);
-
-  section6t.appendChild(makeSnippet(
-    'Striped + bordered table',
-    '[table striped="true" bordered="true" caption="Product Pricing"]\n| Product | Price |\n| ------- | ----: |\n| Widget  | $9.99 |\n| Gadget  | $14.99 |\n[/table]',
-    'The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.'
-  ));
-
-  wrap.appendChild(section6t);
-
-  // --- Section 7: Slideover shortcode ---
-  const section6 = document.createElement('div');
-  section6.appendChild(makeH3('Slideover'));
-  section6.appendChild(makeNote('A trigger button that opens a slide-in panel with Markdown content. No plugin required.'));
-
-  const soAttrTable = document.createElement('table');
-  soAttrTable.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(([attr, desc]) => {
-    const tr = document.createElement('tr');
-    const tdCode = document.createElement('td');
-    tdCode.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;';
-    tdCode.appendChild(makeCode(attr));
-    const tdDesc = document.createElement('td');
-    tdDesc.style.cssText = 'padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);';
-    tdDesc.textContent = desc;
-    tr.appendChild(tdCode);
-    tr.appendChild(tdDesc);
-    soAttrTable.appendChild(tr);
-  });
-  section6.appendChild(soAttrTable);
-
-  section6.appendChild(makeSnippet(
-    'Example',
-    '[slideover title="More Info" trigger="Read more" size="md"]\n## Details\nMarkdown content here.\n[/slideover]',
-    'Nested [card] and [grid] shortcodes work inside the slideover body.'
-  ));
-
-  wrap.appendChild(section6);
-
-  // --- Section 7: DConfig ---
-  const section7 = document.createElement('div');
-  section7.appendChild(makeH3('DConfig — Declarative Behaviour'));
-  section7.appendChild(makeNote('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.'));
-
-  section7.appendChild(makeSnippet(
-    'Toggle a class on click',
-    '{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }',
-    'Selector keys use standard CSS selectors. "target" is optional — defaults to the element itself.'
-  ));
-
-  section7.appendChild(makeSnippet(
-    'Inline shortcode syntax',
-    '[dconfig]\n{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }\n[/dconfig]',
-    null
-  ));
-
-  wrap.appendChild(section7);
-
-  so.setContent(wrap);
-  so.open();
-}
-
-// Module-level state for unsaved-changes guard
-let _dirty = false;
-let _beforeUnload = null;
-let _guardRegistered = false;
-
-export const pageEditorView = {
-    templateUrl: '/admin/js/templates/page-editor.html',
-
-    async onMount($container) {
-        const hash = window.location.hash;
-        const editMatch = hash.match(/#\/pages\/edit(\/.*)/);  // .* allows home page path "/"
-        const urlPath = editMatch ? editMatch[1] : null;
-        const isEdit = !!urlPath;
-
-        const fetches = [api.layouts.get().catch(() => ({}))];
-        if (isEdit) fetches.push(api.pages.get(urlPath).catch(() => null));
-
-        const [layouts, page] = await Promise.all(fetches);
-
-        if (isEdit && !page) {
-            E.toast('Page not found.', { type: 'error' });
-            R.navigate('/pages');
-            return;
-        }
-
-        // Title
-        $container.find('#editor-title').text(isEdit ? 'Edit Page' : 'New Page');
-
-        // URL path field
-        if (isEdit) {
-            $container.find('#page-url-path').val(urlPath);
-        }
-
-        // Populate form fields
-        if (page) {
-            $container.find('#field-title').val(page.title || '');
-            $container.find('#field-description').val(page.description || '');
-            $container.find('#field-status').val(page.status || 'draft');
-            $container.find('#field-sort-order').val(page.sortOrder ?? 99);
-            $container.find('#field-show-in-nav').prop('checked', !!page.showInNav);
-            $container.find('#field-sidebar').prop('checked', !!page.sidebar);
-          $container.find('#field-category').val(page.category || '');
-          $container.find('#field-visibility').val(page.visibility || 'public');
-            $container.find('#field-seo-title').val(page.seo?.title || '');
-            $container.find('#field-seo-desc').val(page.seo?.description || '');
-          if (page.dconfig) {
-            $container.find('#field-dconfig').val(JSON.stringify(page.dconfig, null, 2));
-          }
-        }
-
-        // Layouts dropdown
-        const $layoutSelect = $container.find('#field-layout').empty();
-        Object.entries(layouts).forEach(([key, preset]) => {
-            const selected = (page?.layout || 'default') === key ? 'selected' : '';
-            $layoutSelect.append(`<option value="${key}" ${selected}>${preset.label || key}</option>`);
-        });
-
-      // Initialise meta tabs
-      E.tabs($container.find('#editor-meta-tabs').get(0));
-
-        // Markdown editor + live preview
-        const $editor = $container.find('#markdown-editor');
-        const $preview = $container.find('#markdown-preview');
-        if (page) $editor.val(page.content || '');
-
-      let _previewTimer = null;
-        const updatePreview = () => {
-          clearTimeout(_previewTimer);
-          _previewTimer = setTimeout(async () => {
-            try {
-              const {html} = await api.pages.preview($editor.val());
-              $preview.html(html);
-              Domma.icons.scan();
-            } catch {
-              if (window.marked) $preview.html(marked.parse($editor.val()));
-            }
-          }, 400);
-        };
-
-      // Create toolbar
-      const toolbar = createToolbar($editor, $container.find('#editor-toolbar'));
-
-      // Link callback: prompt for URL
-      toolbar.onLink((ta) => {
-        const url = prompt('Enter URL:');
-        if (url) wrapSelection(ta, '[', `](${url})`);
-      });
-
-      // Image callback: open media picker modal
-      toolbar.onImage(async (ta) => {
-        const files = await api.media.list().catch(() => []);
-        const images = files.filter(f => /\.(png|jpe?g|gif|webp|svg)$/i.test(f.name));
-
-        const grid = document.createElement('div');
-        grid.className = 'media-picker-grid';
-
-        if (images.length) {
-          images.forEach(img => {
-            const item = document.createElement('div');
-            item.className = 'media-picker-item';
-            item.dataset.url = img.url;
-
-            const image = document.createElement('img');
-            image.src = img.url;
-            image.alt = img.name;
-
-            const label = document.createElement('span');
-            label.textContent = img.name;
-
-            item.appendChild(image);
-            item.appendChild(label);
-            grid.appendChild(item);
-          });
-        } else {
-          const empty = document.createElement('p');
-          empty.className = 'text-muted p-3';
-          empty.textContent = 'No images uploaded yet.';
-          grid.appendChild(empty);
-        }
-
-        const modal = E.modal({title: 'Insert Image', size: 'lg'});
-        modal.element.appendChild(grid);
-
-        $(modal.element).on('click', '.media-picker-item', function () {
-          const url = $(this).data('url');
-          const alt = $(this).find('span').text();
-          insertAtCursor(ta, `![${alt}](${url})`);
-          modal.close();
-          $editor.get(0).dispatchEvent(new Event('input', {bubbles: true}));
-        });
-
-        modal.open();
-      });
-
-      // Help callback: open editor reference slideover
-      toolbar.onHelp(() => {
-        openEditorHelp();
-      });
-
-      // View mode switching
-      $container.find('.editor-view-btn').on('click', function () {
-        const mode = $(this).data('mode');
-        $container.find('.editor-view-btn').removeClass('active');
-        $(this).addClass('active');
-        $container.find('#editor-body')
-          .removeClass('editor-mode-split editor-mode-write editor-mode-preview')
-          .addClass(`editor-mode-${mode}`);
-      });
-
-      // Fullscreen toggle
-      $container.find('#fullscreen-btn').on('click', function () {
-        $container.find('.editor-card').toggleClass('editor-fullscreen');
-      });
-
-      // Dirty tracking + unsaved-changes guard
-      _dirty = false;
-      if (_beforeUnload) window.removeEventListener('beforeunload', _beforeUnload);
-      _beforeUnload = (e) => {
-        if (_dirty) e.preventDefault();
-      };
-      window.addEventListener('beforeunload', _beforeUnload);
-
-      // SPA navigation guard — registered once at module level
-      if (!_guardRegistered) {
-        _guardRegistered = true;
-        R.use((to, from, next) => {
-          const onEditor = window.location.hash.startsWith('#/pages/edit') ||
-            window.location.hash === '#/pages/new';
-          if (!_dirty || !onEditor) return next();
-          E.confirm('You have unsaved changes. Leave this page?').then(ok => {
-            if (ok) {
-              _dirty = false;
-              next();
-            }
-          });
-        });
-      }
-
-      $editor.on('input', () => {
-        _dirty = true;
-        updatePreview();
-      });
-        updatePreview();
-
-        // Save
-        $container.find('#save-btn').on('click', async () => {
-            const enteredPath = $container.find('#page-url-path').val().trim();
-            if (!enteredPath) { E.toast('URL path is required.', { type: 'warning' }); return; }
-
-          // Validate DConfig JSON before save attempt
-          const dconfigRaw = $container.find('#field-dconfig').val().trim();
-          let dconfig = null;
-          if (dconfigRaw) {
-            try {
-              dconfig = JSON.parse(dconfigRaw);
-            } catch {
-              E.toast('DConfig JSON is invalid. Please check the format before saving.', {type: 'warning'});
-              return;
-            }
-          }
-
-            const frontmatter = {
-                title: $container.find('#field-title').val().trim() || 'Untitled',
-                description: $container.find('#field-description').val().trim(),
-                layout: $container.find('#field-layout').val(),
-                status: $container.find('#field-status').val(),
-                sortOrder: parseInt($container.find('#field-sort-order').val(), 10) || 99,
-                showInNav: $container.find('#field-show-in-nav').is(':checked'),
-                sidebar: $container.find('#field-sidebar').is(':checked'),
-              category: $container.find('#field-category').val().trim() || null,
-              visibility: $container.find('#field-visibility').val() || 'public',
-                seo: {
-                    title: $container.find('#field-seo-title').val().trim(),
-                    description: $container.find('#field-seo-desc').val().trim()
-                },
-              dconfig
-            };
-
-            try {
-                $container.find('#save-btn').prop('disabled', true).text('Saving…');
-                if (isEdit) {
-                    const payload = { frontmatter, body: $editor.val() };
-                    if (enteredPath !== urlPath) payload.newUrlPath = enteredPath;
-                    await api.pages.update(urlPath, payload);
-                    E.toast('Page saved successfully.', { type: 'success' });
-                  _dirty = false;
-                    if (enteredPath !== urlPath) R.navigate(`/pages/edit${enteredPath}`);
-                } else {
-                    await api.pages.create({ urlPath: enteredPath, frontmatter, body: $editor.val() });
-                    E.toast('Page saved successfully.', { type: 'success' });
-                  _dirty = false;
-                    R.navigate('/pages');
-                }
-            } catch (err) {
-                E.toast(`Save failed: ${err.message || 'Unknown error'}`, { type: 'error' });
-            } finally {
-                $container.find('#save-btn').prop('disabled', false).text('Save');
-            }
-        });
-
-        // Cancel
-        $container.find('#cancel-btn').on('click', () => R.navigate('/pages'));
-
-        Domma.icons.scan();
-    }
-};
+import{api as x}from"../api.js";import{createToolbar as _,insertAtCursor as j,wrapSelection as J}from"../lib/markdown-toolbar.js";function Q(){const e=E.slideover({title:"Editor Reference",size:"md",position:"right"}),M="background:var(--dm-surface-subtle,#1a1a2e);padding:.2rem .4rem;border-radius:3px;font-size:.85em;font-family:monospace;",B="margin:1rem 0 .5rem;font-size:1rem;";function f(l){const n=document.createElement("code");return n.style.cssText=M,n.textContent=l,n}function c(l){const n=document.createElement("h3");return n.style.cssText=B,n.textContent=l,n}const g=document.createElement("div");g.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:1rem;";const z=document.createElement("div");z.appendChild(c("Markdown Basics"));const S=document.createElement("table");S.style.cssText="width:100%;border-collapse:collapse;font-size:.9em;";const s=document.createElement("thead"),U=document.createElement("tr");["Syntax","Result"].forEach(l=>{const n=document.createElement("th");n.style.cssText="text-align:left;padding:.4rem .5rem;border-bottom:1px solid var(--dm-border,#333);",n.textContent=l,U.appendChild(n)}),s.appendChild(U),S.appendChild(s);const F=document.createElement("tbody");[["**bold**","bold (rendered bold)"],["_italic_","italic (rendered italic)"],["## Heading","Heading (h2)"],["[text](url)","Link"],["![alt](url)","Image"],["- item","Bullet list"],["`code`","Inline code"],["---","Divider"]].forEach(([l,n])=>{const o=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.35rem .5rem;vertical-align:top;",a.appendChild(f(l));const d=document.createElement("td");d.style.cssText="padding:.35rem .5rem;vertical-align:top;color:var(--dm-text-muted,#aaa);font-size:.85em;",d.textContent=n,o.appendChild(a),o.appendChild(d),F.appendChild(o)}),S.appendChild(F),z.appendChild(S),g.appendChild(z);const C=document.createElement("div");C.appendChild(c("Grid & Columns"));function v(l){const n=document.createElement("p");return n.style.cssText="margin:.3rem 0 .6rem;font-size:.82em;color:var(--dm-text-muted,#aaa);",n.textContent=l,n}function i(l,n,o){const a=document.createElement("p");a.style.cssText="margin:.75rem 0 .25rem;font-size:.85em;font-weight:600;",a.textContent=l;const d=document.createElement("pre");d.style.cssText=M+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;margin:0;",d.textContent=n;const D=document.createDocumentFragment();return D.appendChild(a),D.appendChild(d),o&&D.appendChild(v(o)),D}const y=document.createElement("table");y.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"],['class="x"',"all","Add extra CSS classes"]].forEach(([l,n,o])=>{const a=document.createElement("tr");[l,n,o].forEach((d,D)=>{const A=document.createElement("td");A.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",D===0?A.appendChild(f(l)):(A.style.color="var(--dm-text-muted,#aaa)",A.textContent=d),a.appendChild(A)}),y.appendChild(a)}),C.appendChild(y),C.appendChild(i("Equal columns",`[grid cols="3" gap="4"]
+[col]One[/col]
+[col]Two[/col]
+[col]Three[/col]
+[/grid]`,"cols sets the track count; each [col] fills one track.")),C.appendChild(i("Column spanning (12-col base)",`[grid cols="12" gap="3"]
+[col span="8"]Main content[/col]
+[col span="4"]Sidebar[/col]
+[/grid]`,"span values must add up to cols. Common splits: 8/4, 6/6, 9/3.")),C.appendChild(i("Row (flexbox, equal-width)",`[row gap="4"]
+[col]Left[/col]
+[col]Right[/col]
+[/row]`,"Use [row] when you want equal-width columns without specifying a count.")),C.appendChild(i("Card in a grid",`[grid cols="3" gap="4"]
+[col]
+[card title="One"]Content[/card]
+[/col]
+[col]
+[card title="Two"]Content[/card]
+[/col]
+[col]
+[card title="Three"]Content[/card]
+[/col]
+[/grid]`,null)),g.appendChild(C);const t=document.createElement("div");t.appendChild(c("Cards")),t.appendChild(i("Basic card",`[card title="Optional Title"]
+Markdown **works** here.
+[/card]`,"Omit title for a card with no header.")),t.appendChild(i("Collapsible card",`[card title="Click to expand" collapsible="true"]
+Hidden by default.
+[/card]`,null)),g.appendChild(t);const r=document.createElement("div");r.appendChild(c("Hero")),r.appendChild(v("Full-width hero sections \u2014 no plugin required. Uses Domma's built-in Hero CSS component."));const m=document.createElement("table");m.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"],['class="..."',"Extra CSS classes"],['id="..."',"Element id"]].forEach(([l,n])=>{const o=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(f(l));const d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",d.textContent=n,o.appendChild(a),o.appendChild(d),m.appendChild(o)}),r.appendChild(m),r.appendChild(i("Basic hero",'[hero title="Welcome" tagline="Build something great"][/hero]',null)),r.appendChild(i("Gradient with body content",`[hero title="Get Started" tagline="Everything you need." size="lg" variant="gradient-blue" align="center"]
+Some introductory **Markdown** content here.
+[/hero]`,null)),r.appendChild(i("Background image with overlay",'[hero title="Our Story" image="/media/hero.jpg" overlay="dark" size="full"][/hero]',"Combine image + overlay for text legibility over photos.")),g.appendChild(r);const p=document.createElement("div");p.appendChild(c("Interactive Components")),p.appendChild(v("Tabs, accordion, carousel, and countdown \u2014 no plugin required.")),p.appendChild(i("Tabs",`[tabs]
+[tab title="First"]Content **A**[/tab]
+[tab title="Second"]Content **B**[/tab]
+[/tabs]`,'Add style="pills" for pill-style navigation.')),p.appendChild(i("Accordion",`[accordion]
+[item title="Question 1"]Answer here.[/item]
+[item title="Question 2"]Answer here.[/item]
+[/accordion]`,'Add multiple="true" to allow several panels open at once.')),p.appendChild(i("Carousel",`[carousel autoplay="true" interval="5000"]
+[slide title="Slide 1"]Description[/slide]
+[slide image="/media/photo.jpg" title="Slide 2"]Caption[/slide]
+[/carousel]`,'Omit autoplay for a manual carousel. loop="false" disables wrapping.')),p.appendChild(i("Countdown (to date)",'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',null)),p.appendChild(i("Countdown (duration)",'[countdown duration="300" format="mm:ss" /]',"duration is in seconds. format options: mm:ss \xB7 HH:mm:ss \xB7 DD:HH:mm:ss")),g.appendChild(p);const u=document.createElement("div");u.appendChild(c("Embedding a Form"));const h=document.createElement("pre");h.style.cssText=M+"display:block;padding:.5rem .75rem;white-space:pre;overflow-x:auto;",h.textContent='<div data-form="contact"></div>',u.appendChild(h),u.appendChild(v('Replace "contact" with the form slug. Forms are managed under Forms in the sidebar.')),g.appendChild(u);const b=document.createElement("div");b.appendChild(c("Effects")),b.appendChild(v("Shortcodes for scroll-triggered animations, counters, typewriter text, and more. Requires the Domma Effects plugin."));const P=[['[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"]],T=document.createElement("table");T.style.cssText="width:100%;border-collapse:collapse;font-size:.85em;margin-bottom:.5rem;",P.forEach(([l,n])=>{const o=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(f(l));const d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",d.textContent=n,o.appendChild(a),o.appendChild(d),T.appendChild(o)}),b.appendChild(T),b.appendChild(i("Scribe script \u2014 looping multi-phrase typewriter",`[scribe loop="true" loop-delay="2000" delete-speed="20"]
+[render]We build things that matter.[/render]
+[wait]1200[/wait]
+[undo all="true" /]
+[render]We design for humans.[/render]
+[wait]1200[/wait]
+[undo all="true" /]
+[/scribe]`,'Use [render]...[/render] to type text, [wait]Ms[/wait] to pause, and [undo /] to delete. loop="true" replays the sequence. Only [render], [wait], and [undo] shortcodes are parsed \u2014 plain text between actions is ignored.')),b.appendChild(v("Enable the Domma Effects plugin to activate these shortcodes on your site.")),g.appendChild(b);const H=document.createElement("div");H.appendChild(c("Tables")),H.appendChild(v("Wrap a standard Markdown (GFM) table with Domma CSS classes and responsive horizontal scrolling."));const q=document.createElement("table");q.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(([l,n])=>{const o=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(f(l));const d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",d.textContent=n,o.appendChild(a),o.appendChild(d),q.appendChild(o)}),H.appendChild(q),H.appendChild(i("Striped + bordered table",`[table striped="true" bordered="true" caption="Product Pricing"]
+| Product | Price |
+| ------- | ----: |
+| Widget  | $9.99 |
+| Gadget  | $14.99 |
+[/table]`,"The inner content must be a valid GFM Markdown table. The shortcode adds Domma CSS classes and wraps in a responsive scroll container.")),g.appendChild(H);const N=document.createElement("div");N.appendChild(c("Slideover")),N.appendChild(v("A trigger button that opens a slide-in panel with Markdown content. No plugin required."));const G=document.createElement("table");G.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(([l,n])=>{const o=document.createElement("tr"),a=document.createElement("td");a.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;",a.appendChild(f(l));const d=document.createElement("td");d.style.cssText="padding:.3rem .4rem;border-bottom:1px solid var(--dm-border,#333);vertical-align:top;color:var(--dm-text-muted,#aaa);",d.textContent=n,o.appendChild(a),o.appendChild(d),G.appendChild(o)}),N.appendChild(G),N.appendChild(i("Example",`[slideover title="More Info" trigger="Read more" size="md"]
+## Details
+Markdown content here.
+[/slideover]`,"Nested [card] and [grid] shortcodes work inside the slideover body.")),g.appendChild(N);const O=document.createElement("div");O.appendChild(c("DConfig \u2014 Declarative Behaviour")),O.appendChild(v("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.")),O.appendChild(i("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.')),O.appendChild(i("Inline shortcode syntax",`[dconfig]
+{ "#my-btn": { "events": { "click": { "target": "#panel", "toggleClass": "hidden" } } } }
+[/dconfig]`,null)),g.appendChild(O),e.setContent(g),e.open()}let k=!1,L=null,W=!1;export const pageEditorView={templateUrl:"/admin/js/templates/page-editor.html",async onMount(e){const B=window.location.hash.match(/#\/pages\/edit(\/.*)/),f=B?B[1]:null,c=!!f,g=[x.layouts.get().catch(()=>({})),x.settings.get().catch(()=>({}))];c&&g.push(x.pages.get(f).catch(()=>null));const[z,S,s]=await Promise.all(g),U=S?.layoutOptions?.spacerSize??40;if(c&&!s){E.toast("Page not found.",{type:"error"}),R.navigate("/pages");return}e.find("#editor-title").text(c?"Edit Page":"New Page"),c&&e.find("#page-url-path").val(f),s&&(e.find("#field-title").val(s.title||""),e.find("#field-description").val(s.description||""),e.find("#field-status").val(s.status||"draft"),e.find("#field-sort-order").val(s.sortOrder??99),e.find("#field-show-in-nav").prop("checked",!!s.showInNav),e.find("#field-sidebar").prop("checked",!!s.sidebar),e.find("#field-category").val(s.category||""),e.find("#field-visibility").val(s.visibility||"public"),e.find("#field-seo-title").val(s.seo?.title||""),e.find("#field-seo-desc").val(s.seo?.description||""),s.dconfig&&e.find("#field-dconfig").val(JSON.stringify(s.dconfig,null,2)));const F=e.find("#field-layout").empty();if(Object.entries(z).forEach(([t,r])=>{const m=(s?.layout||"default")===t?"selected":"";F.append(`<option value="${t}" ${m}>${r.label||t}</option>`)}),c){const t=e.find("#view-page-btn").get(0);t.href=f,t.style.display="";const r=e.find("#live-preview-tab").get(0);r.style.display=""}if(E.tabs(e.find("#editor-meta-tabs").get(0)),c){const t=e.find("#live-preview-tab").get(0),r=e.find("#live-preview-frame").get(0);let m=!1;t.addEventListener("click",function(){m||(r.src=f,m=!0)})}const w=e.find("#markdown-editor"),C=e.find("#markdown-preview");s&&w.val(s.content||"");let v=null;const i=()=>{clearTimeout(v),v=setTimeout(async()=>{try{const{html:t}=await x.pages.preview(w.val());C.html(t,{safe:!1}),I.scan(C.get(0))}catch{window.marked&&C.html(marked.parse(w.val()))}},400)},y=_(w,e.find("#editor-toolbar"),{spacerDefault:U});y.onLink(t=>{const r=prompt("Enter URL:");r&&J(t,"[",`](${r})`)}),y.onImage(async t=>{const m=(await x.media.list().catch(()=>[])).filter(h=>/\.(png|jpe?g|gif|webp|svg)$/i.test(h.name)),p=document.createElement("div");if(p.className="media-picker-grid",m.length)m.forEach(h=>{const b=document.createElement("div");b.className="media-picker-item",b.dataset.url=h.url;const P=document.createElement("img");P.src=h.url,P.alt=h.name;const T=document.createElement("span");T.textContent=h.name,b.appendChild(P),b.appendChild(T),p.appendChild(b)});else{const h=document.createElement("p");h.className="text-muted p-3",h.textContent="No images uploaded yet.",p.appendChild(h)}const u=E.modal({title:"Insert Image",size:"lg"});u.element.appendChild(p),$(u.element).on("click",".media-picker-item",function(){const h=$(this).data("url"),b=$(this).find("span").text();j(t,`![${b}](${h})`),u.close(),w.get(0).dispatchEvent(new Event("input",{bubbles:!0}))}),u.open()}),y.onHelp(()=>{Q()}),e.find(".editor-view-btn").on("click",function(){const t=$(this).data("mode");e.find(".editor-view-btn").removeClass("active"),$(this).addClass("active"),e.find("#editor-body").removeClass("editor-mode-split editor-mode-write editor-mode-preview").addClass(`editor-mode-${t}`)}),e.find("#fullscreen-btn").on("click",function(){e.find(".editor-card").toggleClass("editor-fullscreen")}),k=!1,L&&window.removeEventListener("beforeunload",L),L=t=>{k&&t.preventDefault()},window.addEventListener("beforeunload",L),W||(W=!0,R.use((t,r,m)=>{const p=window.location.hash.startsWith("#/pages/edit")||window.location.hash==="#/pages/new";if(!k||!p)return m();E.confirm("You have unsaved changes. Leave this page?").then(u=>{u&&(k=!1,m())})})),w.on("input",()=>{k=!0,i()}),i(),e.find("#save-btn").on("click",async()=>{const t=e.find("#page-url-path").val().trim();if(!t){E.toast("URL path is required.",{type:"warning"});return}const r=e.find("#field-dconfig").val().trim();let m=null;if(r)try{m=JSON.parse(r)}catch{E.toast("DConfig JSON is invalid. Please check the format before saving.",{type:"warning"});return}const p={title:e.find("#field-title").val().trim()||"Untitled",description:e.find("#field-description").val().trim(),layout:e.find("#field-layout").val(),status:e.find("#field-status").val(),sortOrder:parseInt(e.find("#field-sort-order").val(),10)||99,showInNav:e.find("#field-show-in-nav").is(":checked"),sidebar:e.find("#field-sidebar").is(":checked"),category:e.find("#field-category").val().trim()||null,visibility:e.find("#field-visibility").val()||"public",seo:{title:e.find("#field-seo-title").val().trim(),description:e.find("#field-seo-desc").val().trim()},dconfig:m};try{if(e.find("#save-btn").prop("disabled",!0).text("Saving\u2026"),c){const u={frontmatter:p,body:w.val()};t!==f&&(u.newUrlPath=t),await x.pages.update(f,u),E.toast("Page saved successfully.",{type:"success"}),k=!1,t!==f&&R.navigate(`/pages/edit${t}`)}else await x.pages.create({urlPath:t,frontmatter:p,body:w.val()}),E.toast("Page saved successfully.",{type:"success"}),k=!1,R.navigate("/pages")}catch(u){E.toast(`Save failed: ${u.message||"Unknown error"}`,{type:"error"})}finally{e.find("#save-btn").prop("disabled",!1).text("Save")}}),e.find("#cancel-btn").on("click",()=>R.navigate("/pages")),Domma.icons.scan()}};