domma-cms 0.1.0 → 0.2.0

package/plugins/form-builder/public/inject-body.html

@@ -17,7 +17,7 @@
     function buildBlueprintFromFields(fields) {
         var blueprint = {};
         fields.forEach(function (field) {
-            if (field.type === 'page-break') return;
+          if (field.type === 'page-break' || field.type === 'spacer') return;
             var def = {
                 type:        field.type,
                 label:       field.label        || field.name,
@@ -52,7 +52,7 @@
                 group = [];
                 title = field.label       || ('Step ' + (steps.length + 1));
                 desc  = field.description || '';
-            } else {
+            } else if (field.type !== 'spacer') {
                 group.push(field);
             }
         });
@@ -101,6 +101,12 @@
                             }
                         });
 
+                        // Init conditional logic engine on wizard form
+                        if (window.FormLogicEngine && fields.some(function (f) { return f.logic; })) {
+                            var wizardRuntime = new window.FormLogicEngine.FormLogicRuntime(form, wrapper);
+                            wizardRuntime.init();
+                        }
+
                         // Inject honeypot into the first step's form element
                         if (settings.honeypot) {
                             var firstForm = wrapper.querySelector('form');
@@ -121,6 +127,18 @@
                             }
                         });
 
+                        // Init conditional logic engine on standard form
+                        if (window.FormLogicEngine && fields.some(function (f) { return f.logic; })) {
+                            var stdRuntime = new window.FormLogicEngine.FormLogicRuntime(form, wrapper);
+                            stdRuntime.init();
+                        }
+
+                      if (fields.some(function (f) {
+                        return f.type === 'spacer';
+                      })) {
+                        injectSpacers(wrapper, fields);
+                      }
+
                         if (settings.honeypot) {
                             var formEl = wrapper.querySelector('form');
                             if (formEl) injectHoneypot(formEl);
@@ -129,7 +147,9 @@
 
                 } else {
                     // Fallback: manual form rendering (no Domma dependency)
-                    renderManualForm(wrapper, fields.filter(function (f) { return f.type !== 'page-break'; }), settings, slug);
+                  renderManualForm(wrapper, fields.filter(function (f) {
+                    return f.type !== 'page-break' && f.type !== 'spacer';
+                  }), settings, slug, form);
                 }
             })
             .catch(function (err) {
@@ -141,6 +161,33 @@
             });
     }
 
+  /**
+   * After Domma renders a form, insert .fb-spacer divs at the positions
+   * where spacer pseudo-fields appear in the original fields array.
+   */
+  function injectSpacers(wrapper, allFields) {
+    var form = wrapper.querySelector('form');
+    if (!form) return;
+    var groups = Array.from(form.querySelectorAll('.form-group'));
+    var groupIdx = 0;
+    allFields.forEach(function (field) {
+      if (field.type === 'spacer') {
+        var spacer = document.createElement('div');
+        spacer.className = 'fb-spacer';
+        var target = groups[groupIdx];
+        if (target) {
+          form.insertBefore(spacer, target);
+        } else {
+          var submitBtn = form.querySelector('[type="submit"]');
+          if (submitBtn) form.insertBefore(spacer, submitBtn);
+          else form.appendChild(spacer);
+        }
+      } else if (field.type !== 'page-break') {
+        groupIdx++;
+      }
+    });
+  }
+
     function injectHoneypot(formEl) {
         var hpWrap = document.createElement('div');
         hpWrap.className = 'fb-form-honeypot';
@@ -186,7 +233,7 @@
     }
 
     // Manual form renderer — used when Domma forms API is unavailable
-    function renderManualForm(wrapper, fields, settings, slug) {
+    function renderManualForm(wrapper, fields, settings, slug, formDef) {
         var form = document.createElement('form');
         form.noValidate = true;
 
@@ -246,8 +293,6 @@
 
         form.addEventListener('submit', function (e) {
             e.preventDefault();
-            wrapper.classList.add('fb-form-loading');
-            submitBtn.disabled = true;
 
             var data = {};
             fields.forEach(function (field) {
@@ -255,6 +300,37 @@
                 if (el) data[field.name] = el.value;
             });
 
+            // Client-side logic validation for manual fallback
+            if (window.FormLogicEngine && formDef) {
+                var Engine = window.FormLogicEngine;
+                var requiredErrors = [];
+                var validationErrors = [];
+                fields.forEach(function (field) {
+                    var vis = Engine.evaluateFieldVisibility(field, data);
+                    if (vis === 'hidden') {
+                        delete data[field.name];
+                        return;
+                    }
+                    var required = Engine.evaluateFieldRequirement(field, data);
+                    var val = data[field.name];
+                    if (required && (!val || !String(val).trim())) {
+                        requiredErrors.push(field.label || field.name);
+                    }
+                    var errors = Engine.validateField(field, val || '', data);
+                    if (errors.length) validationErrors.push(errors[0].message);
+                });
+                if (requiredErrors.length || validationErrors.length) {
+                    var errParts = [];
+                    if (requiredErrors.length) errParts.push('Required: ' + requiredErrors.join(', '));
+                    if (validationErrors.length) errParts.push(validationErrors.join('; '));
+                    showMessage(wrapper, errParts.join('. '), 'error');
+                    return;
+                }
+            }
+
+            wrapper.classList.add('fb-form-loading');
+            submitBtn.disabled = true;
+
             submitForm(slug, data, settings, wrapper, form).finally(function () {
                 wrapper.classList.remove('fb-form-loading');
                 submitBtn.disabled = false;
@@ -262,6 +338,12 @@
         });
 
         wrapper.appendChild(form);
+
+        // Init conditional logic engine on manual form
+        if (window.FormLogicEngine && formDef && fields.some(function (f) { return f.logic; })) {
+            var manualRuntime = new window.FormLogicEngine.FormLogicRuntime(formDef, wrapper);
+            manualRuntime.init();
+        }
     }
 
     // Initialise all form targets on the page

package/plugins/form-builder/public/inject-head.html

@@ -39,4 +39,20 @@
 .wizard-step-title { font-size: 1.1rem; font-weight: 600; margin-bottom: .25rem; }
 .wizard-step-description { font-size: .875rem; color: var(--text-muted, #888); margin-bottom: 1rem; }
 .wizard-nav { display: flex; justify-content: space-between; gap: .5rem; margin-top: 1rem; }
+
+.fb-field-hidden { display: none !important; }
+.fb-validation-error { color: var(--danger, #ef4444); font-size: .8rem; margin-top: .25rem; }
+
+.fb-form-wrapper .domma-form-field {
+    margin-bottom: 2rem;
+}
+
+.fb-form-wrapper .form-group:not(.form-buttons) {
+    margin-bottom: 2rem;
+}
+
+.fb-spacer {
+    height: 2rem;
+}
 </style>
+<script src="/plugins/form-builder/public/form-logic-engine.js"></script>

package/plugins/form-builder/public/package.json

@@ -0,0 +1 @@
+{ "type": "commonjs" }

package/public/css/site.css

@@ -29,6 +29,11 @@ body, button, input, select, textarea {
     overflow: hidden;
 }
 
+.table-responsive {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+}
+
 .container {
     max-width: 860px;
     margin: 0 auto;
@@ -147,6 +152,8 @@ body, button, input, select, textarea {
 /* Navbar icon tweaks */
 .navbar-link span[data-icon],
 .navbar-link svg,
+.navbar-dropdown-toggle span[data-icon],
+.navbar-dropdown-toggle svg,
 .navbar-dropdown-item span[data-icon],
 .navbar-dropdown-item svg {
     width: 13px !important;
@@ -154,6 +161,33 @@ body, button, input, select, textarea {
     margin-right: 10px !important;
 }
 
+/* Normalise dropdown toggle font size to match regular nav links at every breakpoint */
+.navbar-dropdown-toggle {
+    font-size: var(--dm-font-size-base);
+}
+
+@media (min-width: 993px) {
+    .navbar-dropdown-toggle {
+        font-size: var(--dm-font-size-sm);
+    }
+}
+
+@media (min-width: 1201px) {
+    .navbar-dropdown-toggle {
+        font-size: var(--dm-font-size-xs);
+    }
+}
+
+/* Reduced motion override — applied when user enables the footer toggle */
+.dm-reduced-motion *,
+.dm-reduced-motion *::before,
+.dm-reduced-motion *::after {
+    animation-duration: 0.001ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.001ms !important;
+    scroll-behavior: auto !important;
+}
+
 /* Footer */
 .page-footer {
     border-top: 1px solid var(--border-color, rgba(255,255,255,.08));
@@ -183,7 +217,86 @@ body, button, input, select, textarea {
 
 .footer-links a:hover { color: var(--text, #eee); }
 
+.footer-social {
+    display: flex;
+    gap: 0.5rem;
+    align-items: center;
+}
+
+.footer-social-link {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 1.75rem;
+    height: 1.75rem;
+    color: var(--text-muted, #888);
+    transition: color 0.15s;
+}
+
+.footer-social-link:hover {
+    color: var(--text, #eee);
+}
+
+.footer-social-link svg {
+    width: 1rem;
+    height: 1rem;
+}
+
+.footer-motion-switch {
+    font-size: .8rem;
+    color: var(--text-muted, #888);
+    white-space: nowrap;
+}
+
+.footer-motion-switch .form-switch-label {
+    color: var(--text-muted, #888);
+}
+
+.footer-motion-switch .form-switch-input {
+    width: 2rem;
+    height: 1.125rem;
+}
+
+.footer-motion-switch .form-switch-input::after {
+    width: .875rem;
+    height: .875rem;
+}
+
+.footer-motion-switch .form-switch-input:checked::after {
+    transform: translateX(.875rem);
+}
+
+/* Slideover panel layout */
+.dm-slideover-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: .875rem 1.25rem;
+    border-bottom: 1px solid var(--border-color, rgba(255, 255, 255, .08));
+    flex-shrink: 0;
+}
+
+.dm-slideover-title {
+    margin: 0;
+    font-size: 1rem;
+    font-weight: 600;
+    line-height: 1.4;
+}
+
+.dm-slideover-body {
+    padding: 1.25rem;
+    overflow-y: auto;
+    flex: 1;
+}
+
 @media (max-width: 768px) {
     .site-main.with-sidebar { grid-template-columns: 1fr; }
     .site-sidebar { display: none; }
 }
+
+/* Hero full-width breakout — escapes the .container to span the full viewport */
+.hero-breakout {
+    width: 100vw;
+    margin-left: calc(50% - 50vw);
+    margin-right: calc(50% - 50vw);
+}

package/public/js/btt.js

@@ -0,0 +1,90 @@
+(function () {
+  'use strict';
+
+  var cfg = window.__CMS_SITE__ && window.__CMS_SITE__.backToTop;
+  if (!cfg) return;
+
+  var BTN_ID = 'back-to-top-btn';
+  var threshold = cfg.scrollThreshold || 300;
+  var position  = cfg.position || 'bottom-right';
+  var label     = cfg.label || '';
+  var smooth    = cfg.smooth !== false;
+  var offset    = cfg.offset || 32;
+
+  var btn = document.createElement('button');
+  btn.id   = BTN_ID;
+  btn.type = 'button';
+  btn.setAttribute('aria-label', 'Back to top');
+  btn.setAttribute('title', 'Back to top');
+
+  var svgNS = 'http://www.w3.org/2000/svg';
+  var svg   = document.createElementNS(svgNS, 'svg');
+  svg.setAttribute('viewBox', '0 0 24 24');
+  svg.setAttribute('width', '20');
+  svg.setAttribute('height', '20');
+  svg.setAttribute('fill', 'none');
+  svg.setAttribute('stroke', 'currentColor');
+  svg.setAttribute('stroke-width', '2');
+  svg.setAttribute('stroke-linecap', 'round');
+  svg.setAttribute('stroke-linejoin', 'round');
+  var path = document.createElementNS(svgNS, 'path');
+  path.setAttribute('d', 'M12 19V5M5 12l7-7 7 7');
+  svg.appendChild(path);
+  btn.appendChild(svg);
+
+  if (label) {
+    var span = document.createElement('span');
+    span.textContent    = label;
+    span.style.marginLeft = '6px';
+    btn.appendChild(span);
+  }
+
+  var isRight = position !== 'bottom-left';
+  Object.assign(btn.style, {
+    position:       'fixed',
+    bottom:         offset + 'px',
+    right:          isRight ? offset + 'px' : 'auto',
+    left:           isRight ? 'auto' : offset + 'px',
+    zIndex:         '9999',
+    display:        'flex',
+    alignItems:     'center',
+    padding:        '10px',
+    borderRadius:   '50%',
+    border:         'none',
+    cursor:         'pointer',
+    background:     'rgba(0,0,0,0.5)',
+    color:          '#fff',
+    backdropFilter: 'blur(4px)',
+    opacity:        '0',
+    transform:      'translateY(12px)',
+    transition:     'opacity .25s, transform .25s',
+    pointerEvents:  'none'
+  });
+
+  if (label) {
+    btn.style.borderRadius = '999px';
+    btn.style.padding      = '10px 16px';
+  }
+
+  document.body.appendChild(btn);
+
+  function show() {
+    btn.style.opacity      = '1';
+    btn.style.transform    = 'translateY(0)';
+    btn.style.pointerEvents = 'auto';
+  }
+
+  function hide() {
+    btn.style.opacity      = '0';
+    btn.style.transform    = 'translateY(12px)';
+    btn.style.pointerEvents = 'none';
+  }
+
+  window.addEventListener('scroll', function () {
+    if (window.scrollY > threshold) { show(); } else { hide(); }
+  }, {passive: true});
+
+  btn.addEventListener('click', function () {
+    window.scrollTo({top: 0, behavior: smooth ? 'smooth' : 'auto'});
+  });
+})();

package/public/js/cookie-consent.js

@@ -0,0 +1,61 @@
+(function () {
+  'use strict';
+
+  if (!window.Domma || !window.Domma.components || !window.Domma.components.cookieConsent) return;
+
+  var s = window.__CMS_SITE__ && window.__CMS_SITE__.cookieConsent;
+  if (!s) return;
+
+  var categories = {
+    necessary: {
+      label:       'Necessary Cookies',
+      description: 'These cookies are essential for the website to function properly.',
+      required:    true
+    }
+  };
+
+  if (s.showFunctional !== false) {
+    categories.functional = {
+      label:       'Functional Cookies',
+      description: 'These cookies enable personalised features and functionality.',
+      required:    false
+    };
+  }
+
+  if (s.showAnalytics !== false) {
+    categories.analytics = {
+      label:       'Analytics Cookies',
+      description: 'These cookies help us understand how visitors interact with our website.',
+      required:    false
+    };
+  }
+
+  if (s.showMarketing !== false) {
+    categories.marketing = {
+      label:       'Marketing Cookies',
+      description: 'These cookies are used to deliver relevant ads and marketing campaigns.',
+      required:    false
+    };
+  }
+
+  var cfg = {
+    message:              s.message,
+    acceptAllText:        s.acceptAllText,
+    rejectAllText:        s.rejectAllText,
+    customizeText:        s.customizeText,
+    savePreferencesText:  s.savePreferencesText,
+    privacyPolicyText:    s.privacyPolicyText,
+    privacyPolicyUrl:     s.privacyPolicyUrl || null,
+    cookiePolicyText:     s.cookiePolicyText,
+    cookiePolicyUrl:      s.cookiePolicyUrl || null,
+    position:             s.position || 'bottom',
+    layout:               s.layout || 'bar',
+    theme:                s.theme || 'dark',
+    categories:           categories,
+    consentVersion:       s.consentVersion || '1.0',
+    autoShow:             true,
+    animation:            true
+  };
+
+  Domma.components.cookieConsent(cfg);
+})();

package/public/js/site.js

@@ -10,29 +10,93 @@ $(() => {
     // Initialise navbar
     const $navbar = $('#site-navbar');
     if ($navbar.length && nav.brand) {
+      // Build brand.html when an icon is configured — Domma navbar doesn't natively support data-icon spans
+      const brand = {...nav.brand};
+      if (brand.icon) {
+        let html = `<span data-icon="${brand.icon}" style="width:1.1em;height:1.1em;margin-right:.35em;vertical-align:middle;"></span>`;
+        if (brand.text) html += `<span class="navbar-brand-text">${brand.text}</span>`;
+        brand.html = html;
+      }
         Domma.elements.navbar('#site-navbar', {
-            brand: nav.brand,
+          brand,
             items: nav.items || [],
             variant: nav.variant || 'dark',
             position: nav.position || 'sticky',
             collapsible: true
         });
+      Domma.icons.scan('#site-navbar');
     }
 
     // Initialise footer
     const $footer = $('#site-footer');
-    if ($footer.length && site.footer) {
-        const footer = site.footer;
-        let html = `<div class="footer-inner container"><p>${footer.copyright || ''}</p>`;
-        if (footer.links?.length) {
-            html += `<nav class="footer-links">`;
-            footer.links.forEach(link => {
-                html += `<a href="${link.url}">${link.text}</a>`;
-            });
-            html += `</nav>`;
-        }
+  if ($footer.length) {
+    const social = site.social || {};
+    const SOCIAL_ICONS = {
+      twitter: {
+        label: 'X / Twitter',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-4.714-6.231-5.401 6.231H2.742l7.73-8.835L1.254 2.25H8.08l4.259 5.629L18.244 2.25zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>'
+      },
+      facebook: {
+        label: 'Facebook',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>'
+      },
+      instagram: {
+        label: 'Instagram',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 100 12.324 6.162 6.162 0 000-12.324zM12 16a4 4 0 110-8 4 4 0 010 8zm6.406-11.845a1.44 1.44 0 100 2.881 1.44 1.44 0 000-2.881z"/></svg>'
+      },
+      linkedin: {
+        label: 'LinkedIn',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.062 2.062 0 01-2.063-2.065 2.064 2.064 0 112.063 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>'
+      },
+      github: {
+        label: 'GitHub',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>'
+      },
+      youtube: {
+        label: 'YouTube',
+        svg: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M23.495 6.205a3.007 3.007 0 00-2.088-2.088c-1.87-.501-9.396-.501-9.396-.501s-7.507-.01-9.396.501A3.007 3.007 0 00.527 6.205a31.247 31.247 0 00-.522 5.805 31.247 31.247 0 00.522 5.783 3.007 3.007 0 002.088 2.088c1.868.502 9.396.502 9.396.502s7.506 0 9.396-.502a3.007 3.007 0 002.088-2.088 31.247 31.247 0 00.5-5.783 31.247 31.247 0 00-.5-5.805zM9.609 15.601V8.408l6.264 3.602z"/></svg>'
+      }
+    };
+
+    let html = '<div class="footer-inner container">';
+
+    if (site.footer) {
+      const footer = site.footer;
+      html += `<p>${footer.copyright || ''}</p>`;
+      if (footer.links?.length) {
+        html += `<nav class="footer-links">`;
+        footer.links.forEach(link => {
+          html += `<a href="${link.url}">${link.text}</a>`;
+        });
+        html += `</nav>`;
+      }
+      const activeSocial = Object.keys(SOCIAL_ICONS).filter(k => social[k]);
+      if (activeSocial.length) {
+        html += `<div class="footer-social">`;
+        activeSocial.forEach(k => {
+          const {label, svg} = SOCIAL_ICONS[k];
+          html += `<a href="${social[k]}" target="_blank" rel="noopener noreferrer" aria-label="${label}" class="footer-social-link">${svg}</a>`;
+        });
         html += `</div>`;
+      }
+    }
+
+    const storedPref = S.get('reduced_motion');
+    const motionOn = storedPref !== null
+      ? !!storedPref
+      : !!(window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches);
+    html += `<label class="form-switch footer-motion-switch" title="Reduce motion">` +
+      `<input type="checkbox" class="form-switch-input" id="dm-motion-switch"${motionOn ? ' checked' : ''}>` +
+      `<span class="form-switch-label">Reduce motion</span>` +
+      `</label>`;
+
+    html += '</div>';
         $footer.html(html, { safe: false });
+
+    document.getElementById('dm-motion-switch').addEventListener('change', function () {
+      S.set('reduced_motion', this.checked);
+      window.location.reload();
+    });
     }
 
     // Initialise sidebar (auto-generate from headings if enabled)
@@ -50,34 +114,17 @@ $(() => {
     // Icons
     Domma.icons.scan();
 
-    // Back to top
-    if (document.querySelector('.site-main')) {
-        Domma.elements.backToTop?.();
-    }
-
   // -------------------------------------------------------
   // Auto-initialise Domma components inside page content
   // -------------------------------------------------------
   const $pageBody = $('.page-body');
   if ($pageBody.length) {
 
-    // Reveal effects
-    $pageBody.find('.dm-reveal').each(function () {
-      const $el = $(this);
-      const opts = {};
-      const classes = $el.attr('class') || '';
-      const m = classes.match(/dm-reveal-(fade|slide-up|slide-down|slide-left|slide-right|zoom|flip)/);
-      if (m) opts.animation = m[1];
-      if ($el.data('reveal-duration')) opts.duration = parseInt($el.data('reveal-duration'), 10);
-      if ($el.data('reveal-delay')) opts.delay = parseInt($el.data('reveal-delay'), 10);
-      if ($el.data('reveal-threshold')) opts.threshold = parseFloat($el.data('reveal-threshold'));
-      if ($el.data('reveal-once') === 'false') opts.once = false;
-      Domma.elements.reveal(this, opts);
-    });
-
-    // Accordion
+    // Accordion — reads data-multi attribute set by [accordion multiple="true"] shortcode
     $pageBody.find('.accordion').each(function () {
-      Domma.elements.accordion(this);
+      Domma.elements.accordion(this, {
+        allowMultiple: this.dataset.multi === 'true'
+      });
     });
 
     // Tabs
@@ -85,9 +132,23 @@ $(() => {
       Domma.elements.tabs(this);
     });
 
-    // Carousel
+    // Carousel — reads data attributes set by [carousel] shortcode
     $pageBody.find('.carousel').each(function () {
-      Domma.elements.carousel(this);
+      Domma.elements.carousel(this, {
+        autoplay: this.dataset.autoplay === 'true',
+        interval: parseInt(this.dataset.interval, 10) || 5000,
+        loop: this.dataset.loop !== 'false',
+        animation: this.dataset.animation || 'slide'
+      });
+    });
+
+    // Countdown — initialises .dm-countdown elements via E.timer()
+    $pageBody.find('.dm-countdown').each(function () {
+      const opts = {autoStart: true};
+      if (this.dataset.to) opts.targetDate = new Date(this.dataset.to);
+      if (this.dataset.duration) opts.duration = parseInt(this.dataset.duration, 10);
+      if (this.dataset.format) opts.format = this.dataset.format;
+      Domma.elements.timer(this, opts);
     });
 
     // Tooltips
@@ -105,5 +166,39 @@ $(() => {
         header.addEventListener('click', () => this.classList.toggle('is-collapsed'));
       }
     });
+
+    // Slideover triggers — wired from [slideover] shortcode
+    $pageBody.find('.dm-so-trigger').each(function () {
+      this.addEventListener('click', () => {
+        const targetId = this.dataset.soTarget;
+        const contentEl = document.getElementById(targetId);
+        if (!contentEl) return;
+        const so = E.slideover({
+          title: contentEl.dataset.soTitle || '',
+          size: contentEl.dataset.soSize || 'md',
+          position: contentEl.dataset.soPosition || 'right'
+        });
+        contentEl.style.display = '';
+        so.setContent(contentEl);
+        so.open();
+      });
+    });
+  }
+
+  // DConfig — merge window.__CMS_DCONFIG__ (editor section) with inline [dconfig] shortcodes
+  // Inline shortcodes win on selector conflict (assigned last via Object.assign)
+  if (typeof $.setup === 'function') {
+    const merged = Object.assign({}, window.__CMS_DCONFIG__ || {});
+    document.querySelectorAll('.dm-page-config[data-config]').forEach(el => {
+      try {
+        const decoded = atob(el.dataset.config);
+        const parsed = JSON.parse(decoded);
+        Object.assign(merged, parsed);
+      } catch { /* skip malformed blocks */
+      }
+    });
+    if (Object.keys(merged).length) {
+      $.setup(merged);
+    }
   }
 });