domma-cms 0.35.0 → 0.36.0
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/CLAUDE.md +2 -1
- package/admin/js/lib/effects-builder.js +1 -1
- package/admin/js/lib/embed-builder.js +1 -0
- package/admin/js/lib/markdown-toolbar.js +17 -17
- package/admin/js/lib/shortcode-context-menu.js +9 -0
- package/admin/js/lib/shortcode-registry.js +45 -0
- package/admin/js/lib/shortcode-tags.js +1 -0
- package/admin/js/templates/effects.html +752 -752
- package/admin/js/templates/forms.html +17 -17
- package/admin/js/templates/my-profile.html +17 -17
- package/admin/js/templates/role-editor.html +70 -70
- package/admin/js/templates/roles.html +10 -10
- package/admin/js/views/page-editor.js +14 -14
- package/bin/lib/config-merge.js +44 -44
- package/config/connections.json.bak +9 -0
- package/config/embeds.json +9 -0
- package/package.json +1 -1
- package/public/css/site.css +1 -1
- package/server/middleware/auth.js +253 -253
- package/server/routes/api/auth.js +309 -309
- package/server/routes/api/navigation.js +42 -42
- package/server/routes/api/settings.js +141 -141
- package/server/services/email.js +167 -167
- package/server/services/markdown.js +188 -1
- package/server/services/userProfiles.js +199 -199
- package/server/services/users.js +302 -302
package/CLAUDE.md
CHANGED
|
@@ -76,7 +76,7 @@ Page content here. Shortcodes work anywhere in the body.
|
|
|
76
76
|
|
|
77
77
|
**Page visibility** is enforced server-side in `server/routes/public.js` — unauthenticated users and insufficient role levels receive a 403/redirect.
|
|
78
78
|
|
|
79
|
-
### Shortcodes (~
|
|
79
|
+
### Shortcodes (~28 types — full syntax in `docs/markdown-shortcodes.md`)
|
|
80
80
|
|
|
81
81
|
| Shortcode | Purpose |
|
|
82
82
|
|-----------------------------------------|----------------------------------------------------|
|
|
@@ -96,6 +96,7 @@ Page content here. Shortcodes work anywhere in the body.
|
|
|
96
96
|
| `[spacer /]` | Vertical spacer |
|
|
97
97
|
| `[center]` | Centre-align content |
|
|
98
98
|
| `[icon name="..." /]` | Inline icon |
|
|
99
|
+
| `[embed url="..." /]` | Video (YouTube/Vimeo/self-hosted) or iframe embed |
|
|
99
100
|
| `[cta action="..."]` | Collection action trigger (admin) |
|
|
100
101
|
| `[block name="..."]` | Embed a reusable content block |
|
|
101
102
|
| `[view slug="..."]` | Embed a saved view |
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{EFFECTS as z,effectsByCategory as A,effectsInjectableInto as j,getEffect as g}from"./effect-defs.js";import{insertAtCursor as R}from"./markdown-toolbar.js";let h=null;export const EffectsBuilder={open(e){if(h)return;const t={textarea:e,activeEffect:S.get("effects-builder-last")||"reveal",scope:"standalone",host:null,editing:null,fieldValues:{}};if(t.host=P(e),t.host&&j(t.host.name).map(o=>o.name).includes(t.activeEffect)&&!(t.activeEffect in t.host.attrs)&&(t.scope="inject"),t.editing=N(e),t.editing){t.activeEffect=t.editing.name,t.scope="standalone";const l=g(t.editing.name);for(const o of l.attrs)if(o.name in t.editing.attrs){const s=t.editing.attrs[o.name];o.type==="number"?t.fieldValues[o.name]=Number(s):o.type==="checkbox"?t.fieldValues[o.name]=s==="true":t.fieldValues[o.name]=s}}const n=E.slideover({title:"Effects",size:"lg",position:"right"}),c=L(t,n);n.element.appendChild(c),n.open(),I.scan(c),h={state:t,slideover:n}},close(){h&&(h.slideover.close(),h=null)}};function L(e,t){const n=document.createElement("div");n.style.cssText="display:grid;grid-template-columns:170px 1fr;height:100%;min-height:520px;";const c=document.createElement("div");c.className="effects-rail",c.style.cssText="background:var(--dm-surface-subtle,#15152a);border-right:1px solid var(--dm-border,#2a2a40);padding:.5rem .35rem;font-size:.8rem;overflow-y:auto;";const l=document.createElement("div");l.className="effects-pane",l.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;";function o(){D(l,e,t)}return v(c,e,o),o(),n.appendChild(c),n.appendChild(l),n}function v(e,t,n){e.replaceChildren();for(const c of A()){const l=document.createElement("div");l.style.cssText="color:var(--dm-text-muted,#888);text-transform:uppercase;font-size:.65rem;letter-spacing:.05em;margin:.4rem .35rem .25rem;",l.textContent=c.category,e.appendChild(l);for(const o of c.effects){const s=document.createElement("button");s.type="button",s.dataset.effect=o.name,s.style.cssText="display:block;width:100%;text-align:left;padding:.3rem .5rem;border:none;background:transparent;color:var(--dm-text,#ddd);border-radius:3px;font-size:.8rem;cursor:pointer;margin-bottom:.1rem;",s.textContent=o.label,o.name===t.activeEffect&&(s.style.background="var(--dm-primary,#4338ca)",s.style.color="#fff"),s.addEventListener("click",()=>{t.activeEffect=o.name,S.set("effects-builder-last",o.name),t.fieldValues={},v(e,t,n),n()}),e.appendChild(s)}}}function O(e,t){if(e.type==="select"){const c=document.createElement("select");c.style.cssText="width:100%;padding:.35rem .5rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text,#eee);font-size:.85rem;";for(const[l,o]of e.options){const s=document.createElement("option");s.value=l,s.textContent=o,c.appendChild(s)}return c.value=t??e.default??"",c}if(e.type==="checkbox"){const c=document.createElement("input");return c.type="checkbox",c.checked=t??e.default??!1,c}const n=document.createElement("input");return n.type=e.type==="number"?"number":e.type==="colour"?"color":"text",n.value=t??e.default??"",e.placeholder&&(n.placeholder=e.placeholder),e.type==="number"&&(e.min!=null&&(n.min=e.min),e.max!=null&&(n.max=e.max),e.step!=null&&(n.step=e.step)),n.style.cssText="width:100%;padding:.35rem .5rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text,#eee);font-size:.85rem;",n}function y(e,t){return t.type==="checkbox"?e.checked:t.type==="number"?e.value===""?"":Number(e.value):e.value}function V(e,t,n){const c=g(t.activeEffect);if(e.replaceChildren(),c.attrs.length===0){const o=document.createElement("div");o.style.cssText="color:var(--dm-text-muted,#888);font-size:.8rem;font-style:italic;",o.textContent="This effect takes no parameters.",e.appendChild(o);return}const l=document.createElement("div");l.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.6rem .7rem;";for(const o of c.attrs){const s=document.createElement("div"),i=document.createElement("label");i.style.cssText="display:block;color:var(--dm-text-muted,#888);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.2rem;",i.textContent=o.label,s.appendChild(i);const a=O(o,t.fieldValues[o.name]);if(a.addEventListener("input",()=>{t.fieldValues[o.name]=y(a,o),n()}),a.addEventListener("change",()=>{t.fieldValues[o.name]=y(a,o),n()}),s.appendChild(a),o.hint){const r=document.createElement("div");r.style.cssText="color:var(--dm-text-muted,#666);font-size:.7rem;margin-top:.15rem;",r.textContent=o.hint,s.appendChild(r)}l.appendChild(s)}e.appendChild(l)}function C(e){const t={},n=/(\w[\w-]*)(?:\s*=\s*"([^"]*)"|\s*=\s*'([^']*)'|\s*=\s*(\S+))?/g;for(const c of e.matchAll(n)){const l=c[1],o=c[2]??c[3]??c[4]??"";t[l]=o}return t}const B=z.filter(e=>!e.selfClosing).map(e=>e.name);function N(e){const t=e.value,n=e.selectionStart;for(const c of B){const l=new RegExp(`\\[${c}([^\\]]*)\\]`,"g"),o=new RegExp(`\\[/${c}\\]`,"g"),s=[];for(const r of t.matchAll(l)){if(r.index>=n)break;s.push({type:"open",start:r.index,end:r.index+r[0].length,attrStr:r[1]})}for(const r of t.matchAll(o)){if(r.index>=n)break;s.push({type:"close",start:r.index,end:r.index+r[0].length})}s.sort((r,f)=>r.start-f.start);let i=0,a=null;for(const r of s)r.type==="open"?(i++,a=r):(i--,i<0&&(i=0,a=null));if(i>0&&a){const r=new RegExp(`\\[/${c}\\]`,"g"),f=t.slice(n),d=f.match(r);if(d){const p=n+f.indexOf(d[0]);return{name:c,blockStart:a.start,blockEnd:p+d[0].length,openTagEnd:a.end,attrs:C(a.attrStr)}}}}return null}const q=["card","hero","banner","col","button"];function P(e){const t=e.value,n=e.selectionStart;for(const c of q){const l=new RegExp(`\\[${c}([^\\]]*)\\]`,"g"),o=new RegExp(`\\[/${c}\\]`,"g"),s=[];for(const r of t.matchAll(l)){if(r.index>=n)break;s.push({type:"open",start:r.index,end:r.index+r[0].length,attrStr:r[1]})}for(const r of t.matchAll(o)){if(r.index>=n)break;s.push({type:"close",start:r.index,end:r.index+r[0].length})}s.sort((r,f)=>r.start-f.start);let i=0,a=null;for(const r of s)r.type==="open"?(i++,a=r):(i--,i<0&&(i=0,a=null));if(i>0&&a){const r=new RegExp(`\\[/${c}\\]`,"g"),f=t.slice(n),d=f.match(r);if(d){const p=n+f.indexOf(d[0]);return{name:c,openTagStart:a.start,openTagEnd:a.end,closeTagStart:p,closeTagEnd:p+d[0].length,attrs:C(a.attrStr)}}}}return null}function k(e,t){const n=[];for(const c of t.attrs){const l=e.fieldValues[c.name];l===void 0||l===""||l===null||l!==c.default&&(c.type==="checkbox"?n.push(`${c.name}="${l?"true":"false"}"`):n.push(`${c.name}="${String(l).replace(/"/g,""")}"`))}return n.join(" ")}function $(e){const t=g(e.activeEffect),n=k(e,t),c=n?" ":"";if(e.scope==="inject"&&e.host){const l=e.host.attrs,o=t.name,s=[];for(const i of Object.keys(l)){if(i===o||i.startsWith(o+"-"))continue;const a=l[i];s.push(a===""?i:`${i}="${String(a).replace(/"/g,""")}"`)}s.push(o);for(const i of t.attrs){const a=e.fieldValues[i.name];if(a===void 0||a===""||a===null||a===i.default)continue;const r=i.type==="checkbox"?a?"true":"false":String(a).replace(/"/g,""");s.push(`${o}-${i.name}="${r}"`)}return`[${e.host.name} ${s.join(" ")}]\u2026[/${e.host.name}]`}return t.selfClosing?`[${t.name}${c}${n} /]`:`[${t.name}${c}${n}]
|
|
1
|
+
import{EFFECTS as z,effectsByCategory as A,effectsInjectableInto as j,getEffect as g}from"./effect-defs.js";import{insertAtCursor as R}from"./markdown-toolbar.js";let h=null;export const EffectsBuilder={open(e){if(h)return;const t={textarea:e,activeEffect:S.get("effects-builder-last")||"reveal",scope:"standalone",host:null,editing:null,fieldValues:{}};if(t.host=P(e),t.host&&j(t.host.name).map(o=>o.name).includes(t.activeEffect)&&!(t.activeEffect in t.host.attrs)&&(t.scope="inject"),t.editing=N(e),t.editing){t.activeEffect=t.editing.name,t.scope="standalone";const l=g(t.editing.name);for(const o of l.attrs)if(o.name in t.editing.attrs){const s=t.editing.attrs[o.name];o.type==="number"?t.fieldValues[o.name]=Number(s):o.type==="checkbox"?t.fieldValues[o.name]=s==="true":t.fieldValues[o.name]=s}}const n=E.slideover({title:"Effects",size:"lg",position:"right",onClose:()=>{h=null}}),c=L(t,n);n.element.appendChild(c),n.open(),I.scan(c),h={state:t,slideover:n}},close(){h&&(h.slideover.close(),h=null)}};function L(e,t){const n=document.createElement("div");n.style.cssText="display:grid;grid-template-columns:170px 1fr;height:100%;min-height:520px;";const c=document.createElement("div");c.className="effects-rail",c.style.cssText="background:var(--dm-surface-subtle,#15152a);border-right:1px solid var(--dm-border,#2a2a40);padding:.5rem .35rem;font-size:.8rem;overflow-y:auto;";const l=document.createElement("div");l.className="effects-pane",l.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.75rem;overflow-y:auto;";function o(){D(l,e,t)}return v(c,e,o),o(),n.appendChild(c),n.appendChild(l),n}function v(e,t,n){e.replaceChildren();for(const c of A()){const l=document.createElement("div");l.style.cssText="color:var(--dm-text-muted,#888);text-transform:uppercase;font-size:.65rem;letter-spacing:.05em;margin:.4rem .35rem .25rem;",l.textContent=c.category,e.appendChild(l);for(const o of c.effects){const s=document.createElement("button");s.type="button",s.dataset.effect=o.name,s.style.cssText="display:block;width:100%;text-align:left;padding:.3rem .5rem;border:none;background:transparent;color:var(--dm-text,#ddd);border-radius:3px;font-size:.8rem;cursor:pointer;margin-bottom:.1rem;",s.textContent=o.label,o.name===t.activeEffect&&(s.style.background="var(--dm-primary,#4338ca)",s.style.color="#fff"),s.addEventListener("click",()=>{t.activeEffect=o.name,S.set("effects-builder-last",o.name),t.fieldValues={},v(e,t,n),n()}),e.appendChild(s)}}}function O(e,t){if(e.type==="select"){const c=document.createElement("select");c.style.cssText="width:100%;padding:.35rem .5rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text,#eee);font-size:.85rem;";for(const[l,o]of e.options){const s=document.createElement("option");s.value=l,s.textContent=o,c.appendChild(s)}return c.value=t??e.default??"",c}if(e.type==="checkbox"){const c=document.createElement("input");return c.type="checkbox",c.checked=t??e.default??!1,c}const n=document.createElement("input");return n.type=e.type==="number"?"number":e.type==="colour"?"color":"text",n.value=t??e.default??"",e.placeholder&&(n.placeholder=e.placeholder),e.type==="number"&&(e.min!=null&&(n.min=e.min),e.max!=null&&(n.max=e.max),e.step!=null&&(n.step=e.step)),n.style.cssText="width:100%;padding:.35rem .5rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text,#eee);font-size:.85rem;",n}function y(e,t){return t.type==="checkbox"?e.checked:t.type==="number"?e.value===""?"":Number(e.value):e.value}function V(e,t,n){const c=g(t.activeEffect);if(e.replaceChildren(),c.attrs.length===0){const o=document.createElement("div");o.style.cssText="color:var(--dm-text-muted,#888);font-size:.8rem;font-style:italic;",o.textContent="This effect takes no parameters.",e.appendChild(o);return}const l=document.createElement("div");l.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.6rem .7rem;";for(const o of c.attrs){const s=document.createElement("div"),i=document.createElement("label");i.style.cssText="display:block;color:var(--dm-text-muted,#888);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.2rem;",i.textContent=o.label,s.appendChild(i);const a=O(o,t.fieldValues[o.name]);if(a.addEventListener("input",()=>{t.fieldValues[o.name]=y(a,o),n()}),a.addEventListener("change",()=>{t.fieldValues[o.name]=y(a,o),n()}),s.appendChild(a),o.hint){const r=document.createElement("div");r.style.cssText="color:var(--dm-text-muted,#666);font-size:.7rem;margin-top:.15rem;",r.textContent=o.hint,s.appendChild(r)}l.appendChild(s)}e.appendChild(l)}function C(e){const t={},n=/(\w[\w-]*)(?:\s*=\s*"([^"]*)"|\s*=\s*'([^']*)'|\s*=\s*(\S+))?/g;for(const c of e.matchAll(n)){const l=c[1],o=c[2]??c[3]??c[4]??"";t[l]=o}return t}const B=z.filter(e=>!e.selfClosing).map(e=>e.name);function N(e){const t=e.value,n=e.selectionStart;for(const c of B){const l=new RegExp(`\\[${c}([^\\]]*)\\]`,"g"),o=new RegExp(`\\[/${c}\\]`,"g"),s=[];for(const r of t.matchAll(l)){if(r.index>=n)break;s.push({type:"open",start:r.index,end:r.index+r[0].length,attrStr:r[1]})}for(const r of t.matchAll(o)){if(r.index>=n)break;s.push({type:"close",start:r.index,end:r.index+r[0].length})}s.sort((r,f)=>r.start-f.start);let i=0,a=null;for(const r of s)r.type==="open"?(i++,a=r):(i--,i<0&&(i=0,a=null));if(i>0&&a){const r=new RegExp(`\\[/${c}\\]`,"g"),f=t.slice(n),d=f.match(r);if(d){const p=n+f.indexOf(d[0]);return{name:c,blockStart:a.start,blockEnd:p+d[0].length,openTagEnd:a.end,attrs:C(a.attrStr)}}}}return null}const q=["card","hero","banner","col","button"];function P(e){const t=e.value,n=e.selectionStart;for(const c of q){const l=new RegExp(`\\[${c}([^\\]]*)\\]`,"g"),o=new RegExp(`\\[/${c}\\]`,"g"),s=[];for(const r of t.matchAll(l)){if(r.index>=n)break;s.push({type:"open",start:r.index,end:r.index+r[0].length,attrStr:r[1]})}for(const r of t.matchAll(o)){if(r.index>=n)break;s.push({type:"close",start:r.index,end:r.index+r[0].length})}s.sort((r,f)=>r.start-f.start);let i=0,a=null;for(const r of s)r.type==="open"?(i++,a=r):(i--,i<0&&(i=0,a=null));if(i>0&&a){const r=new RegExp(`\\[/${c}\\]`,"g"),f=t.slice(n),d=f.match(r);if(d){const p=n+f.indexOf(d[0]);return{name:c,openTagStart:a.start,openTagEnd:a.end,closeTagStart:p,closeTagEnd:p+d[0].length,attrs:C(a.attrStr)}}}}return null}function k(e,t){const n=[];for(const c of t.attrs){const l=e.fieldValues[c.name];l===void 0||l===""||l===null||l!==c.default&&(c.type==="checkbox"?n.push(`${c.name}="${l?"true":"false"}"`):n.push(`${c.name}="${String(l).replace(/"/g,""")}"`))}return n.join(" ")}function $(e){const t=g(e.activeEffect),n=k(e,t),c=n?" ":"";if(e.scope==="inject"&&e.host){const l=e.host.attrs,o=t.name,s=[];for(const i of Object.keys(l)){if(i===o||i.startsWith(o+"-"))continue;const a=l[i];s.push(a===""?i:`${i}="${String(a).replace(/"/g,""")}"`)}s.push(o);for(const i of t.attrs){const a=e.fieldValues[i.name];if(a===void 0||a===""||a===null||a===i.default)continue;const r=i.type==="checkbox"?a?"true":"false":String(a).replace(/"/g,""");s.push(`${o}-${i.name}="${r}"`)}return`[${e.host.name} ${s.join(" ")}]\u2026[/${e.host.name}]`}return t.selfClosing?`[${t.name}${c}${n} /]`:`[${t.name}${c}${n}]
|
|
2
2
|
Content
|
|
3
3
|
[/${t.name}]`}function w(e,t){e.replaceChildren();const n=document.createElement("div");n.style.cssText="color:var(--dm-text-muted,#888);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem;",n.textContent="Shortcode (live)",e.appendChild(n);const c=document.createElement("pre");c.style.cssText="background:var(--dm-surface-deep,#000);border:1px solid var(--dm-border,#333);padding:.5rem .65rem;border-radius:3px;font-family:var(--dm-font-mono,monospace);font-size:.75rem;color:#7c6af7;line-height:1.5;white-space:pre-wrap;word-break:break-all;margin:0;",c.textContent=$(t),e.appendChild(c)}function F(e,t,n){if(e.replaceChildren(),t.editing)return;const c=g(t.activeEffect),l=t.host&&c.hosts.includes(t.host.name),o=document.createElement("div");o.style.cssText="background:var(--dm-surface-subtle,#15152a);border:1px solid var(--dm-border,#2a2a40);border-radius:4px;padding:.5rem .6rem;";const s=document.createElement("div");if(s.style.cssText="color:var(--dm-text-muted,#888);text-transform:uppercase;font-size:.65rem;letter-spacing:.05em;margin-bottom:.3rem;",s.textContent="Apply as",o.appendChild(s),!l){const r=document.createElement("div");r.style.cssText="color:var(--dm-text-muted,#888);font-size:.75rem;font-style:italic;",t.host?r.textContent=`Inserted as a standalone block (${c.label} cannot be injected into [${t.host.name}]).`:r.textContent="Inserted as a standalone block.",o.appendChild(r),e.appendChild(o),t.scope="standalone";return}const i=document.createElement("div");i.style.cssText="display:flex;gap:.3rem;";function a(r,f){const d=document.createElement("button");return d.type="button",d.style.cssText="flex:1;padding:.35rem;border:1px solid var(--dm-border,#333);border-radius:3px;font-size:.75rem;font-weight:600;cursor:pointer;",t.scope===r?(d.style.background="var(--dm-primary,#4338ca)",d.style.color="#fff",d.style.borderColor="var(--dm-primary,#4338ca)"):(d.style.background="transparent",d.style.color="var(--dm-text-muted,#bbb)"),d.textContent=f,d.addEventListener("click",()=>{t.scope=r,n()}),d}i.appendChild(a("standalone","Standalone block")),i.appendChild(a("inject",`Inject into [${t.host.name}]`)),o.appendChild(i),e.appendChild(o)}let x=0;function T(e){return e.replace(/-([a-z])/g,(t,n)=>n.toUpperCase())}function _(e,t){e.replaceChildren();const n=g(t.activeEffect),c=document.createElement("div");c.style.cssText="display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem;";const l=document.createElement("div");if(l.style.cssText="color:var(--dm-text-muted,#888);text-transform:uppercase;font-size:.65rem;letter-spacing:.05em;",l.textContent="Live preview",c.appendChild(l),!n.previewable){const a=document.createElement("div");a.style.cssText="background:var(--dm-surface-subtle,#15152a);border:1px solid var(--dm-border,#2a2a40);border-radius:4px;padding:.6rem;color:var(--dm-text-muted,#888);font-size:.8rem;font-style:italic;text-align:center;",a.textContent="Runs full-page on the published site \u2014 no inline preview.",e.appendChild(a);return}const o=document.createElement("button");o.type="button",o.style.cssText="background:transparent;border:1px solid var(--dm-border,#333);color:var(--dm-text-muted,#888);font-size:.65rem;padding:.15rem .4rem;border-radius:2px;cursor:pointer;",o.textContent="\u21BB Replay",c.appendChild(o),e.appendChild(c);const s=document.createElement("div");s.style.cssText="background:var(--dm-surface-subtle,#1a1a2e);border:1px solid var(--dm-border,#2a2a40);border-radius:4px;padding:1rem;text-align:center;min-height:80px;position:relative;overflow:hidden;",e.appendChild(s);function i(){x++;const a=x;s.replaceChildren();const r=document.createElement("div");r.style.cssText="background:linear-gradient(135deg,#6366f1,#a855f7);color:#fff;padding:.6rem;border-radius:4px;font-size:.8rem;font-weight:600;",r.textContent="Sample content",s.appendChild(r);const f=window.Domma&&window.Domma.effects;if(!f)return;const d={};for(const p of n.attrs){const m=t.fieldValues[p.name];m===void 0||m===""||m===null||(d[T(p.name)]=m)}try{const p=f[T(n.name)];if(typeof p=="function"){if(a!==x)return;p(r,d)}}catch(p){console.warn("Effects preview failed:",p)}}o.addEventListener("click",i),i()}function D(e,t,n){const c=g(t.activeEffect);e.replaceChildren();const l=document.createElement("h3");l.style.cssText="margin:0;font-size:1rem;color:var(--dm-text,#eee);",l.textContent=c.label,e.appendChild(l);const o=document.createElement("p");o.style.cssText="margin:0;color:var(--dm-text-muted,#999);font-size:.8rem;line-height:1.4;",o.textContent=c.description,e.appendChild(o);const s=document.createElement("div");e.appendChild(s);const i=document.createElement("div");e.appendChild(i);const a=document.createElement("div");e.appendChild(a);const r=document.createElement("div");e.appendChild(r);function f(){F(s,t,f),V(i,t,()=>{w(a,t),_(r,t)}),w(a,t),_(r,t)}f();const d=document.createElement("div");d.style.cssText="display:flex;gap:.5rem;margin-top:auto;padding-top:.75rem;border-top:1px solid var(--dm-border,#2a2a40);";const p=document.createElement("button");p.type="button",p.className="btn btn-ghost",p.textContent="Cancel",p.addEventListener("click",()=>n.close()),d.appendChild(p);const m=document.createElement("button");m.type="button",m.className="btn btn-primary",m.style.flex="2",m.textContent=t.editing?"Update":"Insert effect",m.addEventListener("click",()=>H(t,n)),d.appendChild(m),e.appendChild(d)}function H(e,t){const n=e.textarea,c=$(e);if(e.editing){const l=g(e.editing.name),o=n.value,s=o.substring(0,e.editing.blockStart),i=o.substring(e.editing.blockEnd),a=`[/${l.name}]`.length,r=e.editing.openTagEnd,f=e.editing.blockEnd-a,d=o.substring(r,f),p=k(e,l),m=p?" ":"",u=l.selfClosing?`[${l.name}${m}${p} /]`:`[${l.name}${m}${p}]${d}[/${l.name}]`;n.value=s+u+i;const b=l.selfClosing?s.length+u.length:s.length+u.indexOf("]")+1;n.selectionStart=n.selectionEnd=b,n.dispatchEvent(new Event("input",{bubbles:!0})),t.close();return}if(e.scope==="inject"&&e.host){const l=g(e.activeEffect),o=n.value,s=o.substring(0,e.host.openTagStart),i=o.substring(e.host.openTagEnd),a=e.host.attrs,r=l.name,f=[];for(const m of Object.keys(a)){if(m===r||m.startsWith(r+"-"))continue;const u=a[m];f.push(u===""?m:`${m}="${String(u).replace(/"/g,""")}"`)}f.push(r);for(const m of l.attrs){const u=e.fieldValues[m.name];if(u===void 0||u===""||u===null||u===m.default)continue;const b=m.type==="checkbox"?u?"true":"false":String(u).replace(/"/g,""");f.push(`${r}-${m.name}="${b}"`)}const d=`[${e.host.name} ${f.join(" ")}]`;n.value=s+d+i;const p=s.length+d.length;n.selectionStart=n.selectionEnd=p,n.dispatchEvent(new Event("input",{bubbles:!0})),t.close();return}R(n,c),n.dispatchEvent(new Event("input",{bubbles:!0})),t.close()}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{insertAtCursor as U}from"./markdown-toolbar.js";import{api as D}from"../api.js";let x=null;const Y=["16:9","4:3","1:1","21:9","9:16","3:4"],R=/\.(mp4|webm|ogg|ogv)(?:\?|#|$)/i;export const EmbedBuilder={open(e){if(x)return;const t={textarea:e,url:"",ratio:"16:9",title:"",width:"",align:"",autoplay:!1,loop:!1,muted:!1},o=E.slideover({title:"Insert embed",size:"lg",position:"right",onClose:()=>{x=null}}),d=O(t,o);o.element.appendChild(d),o.open(),window.I&&I.scan(d),x={state:t,slideover:o}},close(){x&&(x.slideover.close(),x=null)}};function F(e){const t=String(e||"").trim();return t?/(?:youtube(?:-nocookie)?\.com\/(?:watch\?|embed\/|shorts\/|live\/)|youtu\.be\/)/i.test(t)?"YouTube":/vimeo\.com\//i.test(t)?"Vimeo":R.test(t)?"Self-hosted video":/^https?:\/\//i.test(t)?"Generic iframe":"Unknown":null}function N(e){return String(e).replace(/"/g,""")}function B(e){const t=[`url="${N(e.url||"")}"`];return e.ratio&&e.ratio!=="16:9"&&t.push(`ratio="${e.ratio}"`),e.title&&t.push(`title="${N(e.title)}"`),e.width&&t.push(`width="${N(e.width)}"`),e.align&&t.push(`align="${e.align}"`),e.autoplay&&t.push("autoplay"),e.muted&&t.push("muted"),e.loop&&t.push("loop"),`[embed ${t.join(" ")} /]`}const g="width:100%;padding:.4rem .55rem;background:var(--dm-input-bg,#1a1a1a);border:1px solid var(--dm-border,#333);border-radius:4px;color:var(--dm-text,#eee);font-size:.85rem;",M="display:block;color:var(--dm-text-muted,#888);font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem;";function s(e){const t=document.createElement("label");return t.style.cssText=M,t.textContent=e,t}function O(e,t){const o=document.createElement("div");o.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.85rem;min-height:100%;";const d=document.createElement("div");d.appendChild(s("Embed URL or media path"));const i=document.createElement("input");i.type="text",i.placeholder="https://youtu.be/\u2026 or /media/clip.mp4",i.style.cssText=g;const p=document.createElement("div");p.style.cssText="color:var(--dm-text-muted,#888);font-size:.72rem;margin-top:.25rem;min-height:1em;";let n;function r(){e.url=i.value.trim();const l=F(e.url);p.textContent=l?`Detected: ${l}`:"",n&&(n.textContent=B(e))}i.addEventListener("input",r);const m=document.createElement("button");m.type="button",m.className="btn btn-ghost",m.style.cssText="margin-top:.4rem;font-size:.78rem;",m.textContent="Browse self-hosted video\u2026";const L=document.createElement("div");L.style.cssText="display:none;margin-top:.4rem;max-height:180px;overflow-y:auto;border:1px solid var(--dm-border,#2a2a40);border-radius:4px;",m.addEventListener("click",()=>V(L,i,r)),d.appendChild(i),d.appendChild(p),d.appendChild(m),d.appendChild(L),o.appendChild(d);const k=document.createElement("div");k.appendChild(s("Aspect ratio"));const u=document.createElement("select");u.style.cssText=g;for(const l of Y){const a=document.createElement("option");a.value=l,a.textContent=l,u.appendChild(a)}u.value=e.ratio,u.addEventListener("change",()=>{e.ratio=u.value,r()}),k.appendChild(u),o.appendChild(k);const z=document.createElement("div");z.appendChild(s("Caption / title (optional)"));const v=document.createElement("input");v.type="text",v.style.cssText=g,v.addEventListener("input",()=>{e.title=v.value,r()}),z.appendChild(v),o.appendChild(z);const C=document.createElement("div");C.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.7rem;";const S=document.createElement("div");S.appendChild(s("Max width (px or %)"));const h=document.createElement("input");h.type="text",h.placeholder="e.g. 640 or 80%",h.style.cssText=g,h.addEventListener("input",()=>{e.width=h.value.trim(),r()}),S.appendChild(h);const $=document.createElement("div");$.appendChild(s("Alignment"));const y=document.createElement("select");y.style.cssText=g;for(const[l,a]of[["","Full width"],["left","Left"],["center","Centre"],["right","Right"]]){const c=document.createElement("option");c.value=l,c.textContent=a,y.appendChild(c)}y.addEventListener("change",()=>{e.align=y.value,r()}),$.appendChild(y),C.appendChild(S),C.appendChild($),o.appendChild(C);const w=document.createElement("div");w.appendChild(s("Playback"));const A=document.createElement("div");A.style.cssText="display:flex;gap:1.2rem;flex-wrap:wrap;";for(const l of["autoplay","loop","muted"]){const a=document.createElement("label");a.style.cssText="display:flex;align-items:center;gap:.35rem;font-size:.82rem;color:var(--dm-text,#ddd);cursor:pointer;";const c=document.createElement("input");c.type="checkbox",c.addEventListener("change",()=>{e[l]=c.checked,r()}),a.appendChild(c),a.appendChild(document.createTextNode(l.charAt(0).toUpperCase()+l.slice(1))),A.appendChild(a)}w.appendChild(A);const _=document.createElement("div");_.style.cssText="color:var(--dm-text-muted,#666);font-size:.7rem;margin-top:.3rem;",_.textContent="Autoplay is muted automatically (browser policy).",w.appendChild(_),o.appendChild(w);const W=document.createElement("div");W.appendChild(s("Shortcode (live)")),n=document.createElement("pre"),n.style.cssText="background:var(--dm-surface-deep,#000);border:1px solid var(--dm-border,#333);padding:.5rem .65rem;border-radius:4px;font-family:var(--dm-font-mono,monospace);font-size:.75rem;color:#7c6af7;line-height:1.5;white-space:pre-wrap;word-break:break-all;margin:0;",W.appendChild(n),o.appendChild(W),r();const T=document.createElement("div");T.style.cssText="display:flex;gap:.5rem;margin-top:auto;padding-top:.85rem;border-top:1px solid var(--dm-border,#2a2a40);";const b=document.createElement("button");b.type="button",b.className="btn btn-ghost",b.textContent="Cancel",b.addEventListener("click",()=>t.close());const f=document.createElement("button");return f.type="button",f.className="btn btn-primary",f.style.flex="2",f.textContent="Insert embed",f.addEventListener("click",()=>{if(!e.url){window.E&&E.toast("Enter a URL or media path first.",{type:"warning"}),i.focus();return}U(e.textarea,B(e)),e.textarea.dispatchEvent(new Event("input",{bubbles:!0})),t.close()}),T.appendChild(b),T.appendChild(f),o.appendChild(T),o}async function V(e,t,o){if(e.style.display!=="none"){e.style.display="none";return}e.style.display="block",e.replaceChildren();const d=document.createElement("div");d.style.cssText="padding:.5rem .6rem;color:var(--dm-text-muted,#888);font-size:.8rem;",d.textContent="Loading\u2026",e.appendChild(d);let i=[];try{i=await D.media.list()||[]}catch{i=[]}const p=i.filter(n=>R.test(n.name||n.url||""));if(e.replaceChildren(),!p.length){const n=document.createElement("div");n.style.cssText="padding:.5rem .6rem;color:var(--dm-text-muted,#888);font-size:.8rem;",n.textContent="No video files uploaded yet.",e.appendChild(n);return}for(const n of p){const r=document.createElement("button");r.type="button",r.style.cssText="display:block;width:100%;text-align:left;padding:.4rem .6rem;border:none;background:transparent;color:var(--dm-text,#ddd);font-size:.8rem;cursor:pointer;border-bottom:1px solid var(--dm-border,#2a2a40);",r.textContent=n.name||n.url,r.addEventListener("click",()=>{t.value=n.url||`/media/${n.name}`,e.style.display="none",o(),t.focus()}),e.appendChild(r)}}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
function
|
|
2
|
-
`,i-1)+1,o=t.value.substring(
|
|
3
|
-
`,t.selectionStart-1)+1,
|
|
4
|
-
`,t.selectionStart),o=
|
|
1
|
+
function le(){I.register("bold",{viewBox:"0 0 24 24",path:"M7 5H14a3 3 0 0 1 0 6H7V5zM7 11H15a3 3 0 0 1 0 6H7V11z",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("italic",{viewBox:"0 0 24 24",path:"M11 5h4M9 19h4M13 5l-2 14",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("strikethrough",{viewBox:"0 0 24 24",path:"M16 4H9a3 3 0 0 0 0 6h6a3 3 0 0 1 0 6H6M3 12h18",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("quote",{viewBox:"0 0 24 24",path:"M3 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2H4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.031V20c0 1 0 1 1 1zM15 21c3 0 7-1 7-8V5c0-1.25-.757-2.017-2-2h-4c-1.25 0-2 .75-2 1.972V11c0 1.25.75 2 2 2h.75c0 2.25.25 4-2.75 4v3c0 1 0 1 1 1z",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("eye",{viewBox:"0 0 24 24",path:"M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8zM12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6z",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("expand",{viewBox:"0 0 24 24",path:"M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("columns",{viewBox:"0 0 24 24",path:"M3 4h18a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1zM12 4v16",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("card",{viewBox:"0 0 24 24",paths:["M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z","M3 9h18"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("help-circle",{viewBox:"0 0 24 24",path:"M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10zM12 17h.01M12 13a2 2 0 0 0 2-2 2 2 0 0 0-2-2 2 2 0 0 0-2 2",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("book-open",{viewBox:"0 0 24 24",paths:["M2 4h7a2 2 0 0 1 2 2v14a2 2 0 0 0-2-2H2z","M22 4h-7a2 2 0 0 0-2 2v14a2 2 0 0 1 2-2h7z"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("spacer-insert",{viewBox:"0 0 24 24",paths:["M3 8h18","M3 16h18","M12 8v8"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("icon-pick",{viewBox:"0 0 24 24",paths:["M4 4h6v6H4z","M14 4h6v6h-6z","M4 14h6v6H4z","M14 14h6v6h-6z"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("colour-picker",{viewBox:"0 0 24 24",paths:["M12 2a5 5 0 0 1 5 5c0 3-5 10-5 10S7 10 7 7a5 5 0 0 1 5-5z","M12 7a1 1 0 1 0 0-2 1 1 0 0 0 0 2"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("btn-insert",{viewBox:"0 0 24 24",paths:["M3 7a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V7z","M8 12h8M12 9v6"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("link-shortcode",{viewBox:"0 0 24 24",paths:["M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71","M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("layout-list",{viewBox:"0 0 24 24",paths:["M3 5h18M3 9h18","M3 14h4v6H3zM9 14h12M9 17h8"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("sparkles",{viewBox:"0 0 24 24",paths:["M12 3L13.5 8.5H19L14.5 11.5L16 17L12 14L8 17L9.5 11.5L5 8.5H10.5L12 3Z","M19 3L19.7 5.3H22L20.2 6.6L20.9 9L19 7.7L17.1 9L17.8 6.6L16 5.3H18.3L19 3Z","M5 13L5.5 14.7H7L5.8 15.5L6.3 17.2L5 16.3L3.7 17.2L4.2 15.5L3 14.7H4.5L5 13Z"],stroke:"currentColor",fill:"none",strokeWidth:1.5,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("accordion-insert",{viewBox:"0 0 24 24",paths:["M3 4h18","M3 8h18","M8 11l4 4 4-4","M3 16h18","M3 20h18"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("banner-insert",{viewBox:"0 0 24 24",paths:["M3 6h18","M3 10h18","M3 14h12"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("hero",{viewBox:"0 0 24 24",paths:["M3 5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5z","M7 8h10M7 11h6"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("text-style",{viewBox:"0 0 24 24",paths:["M4 7V5h16v2","M9 19h6","M12 5v14","M5 12h14"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("css-code",{viewBox:"0 0 24 24",paths:["M9 9l-6 3 6 3","M15 9l6 3-6 3","M13 5l-2 14"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("scribe-insert",{viewBox:"0 0 24 24",paths:["M4 20h3l10-10-3-3L4 17v3z","M14 7l3 3","M4 4h6"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("carousel-insert",{viewBox:"0 0 24 24",paths:["M7 5h10v14H7z","M3 8h2v8H3z","M19 8h2v8h-2z"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"})}export function wrapSelection(t,e,m){const i=t.selectionStart,s=t.selectionEnd,o=t.value,r=o.substring(i,s);r?(t.value=o.substring(0,i)+e+r+m+o.substring(s),t.selectionStart=i+e.length,t.selectionEnd=s+e.length):(t.value=o.substring(0,i)+e+m+o.substring(i),t.selectionStart=t.selectionEnd=i+e.length),t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}export function insertAtCursor(t,e){const m=t.selectionStart,i=t.value;t.value=i.substring(0,m)+e+i.substring(m),t.selectionStart=t.selectionEnd=m+e.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}export function attachEditorKeybindings(t){t.addEventListener("keydown",e=>{if(e.key==="Tab"){e.preventDefault();const i=t.selectionStart;if(e.shiftKey){const s=t.value.lastIndexOf(`
|
|
2
|
+
`,i-1)+1,o=t.value.substring(s).match(/^ {1,2}/);o&&(t.value=t.value.substring(0,s)+t.value.substring(s+o[0].length),t.selectionStart=t.selectionEnd=Math.max(s,i-o[0].length),t.dispatchEvent(new Event("input",{bubbles:!0})),E.toast("Dedented",{type:"info",duration:800}))}else t.value=t.value.substring(0,i)+" "+t.value.substring(i),t.selectionStart=t.selectionEnd=i+2,t.dispatchEvent(new Event("input",{bubbles:!0})),E.toast("Indented",{type:"info",duration:800});return}if(!(e.ctrlKey||e.metaKey))return;const m=e.key.toLowerCase();if(m==="z")e.preventDefault(),document.execCommand("undo"),E.toast("Undo",{type:"info",duration:1200});else if(m==="y")e.preventDefault(),document.execCommand("redo"),E.toast("Redo",{type:"info",duration:1200});else if(m==="x"&&t.selectionStart===t.selectionEnd){e.preventDefault();const i=t.value.lastIndexOf(`
|
|
3
|
+
`,t.selectionStart-1)+1,s=t.value.indexOf(`
|
|
4
|
+
`,t.selectionStart),o=s===-1?t.value.length:s+1;t.setSelectionRange(i,o),document.execCommand("cut"),t.dispatchEvent(new Event("input",{bubbles:!0})),E.toast("Line cut",{type:"info",duration:1200})}else if(m==="c"&&t.selectionStart===t.selectionEnd){e.preventDefault();const i=t.selectionStart,s=t.value.lastIndexOf(`
|
|
5
5
|
`,i-1)+1,o=t.value.indexOf(`
|
|
6
|
-
`,i),r=o===-1?t.value.length:o+1;t.setSelectionRange(
|
|
6
|
+
`,i),r=o===-1?t.value.length:o+1;t.setSelectionRange(s,r),document.execCommand("copy"),t.setSelectionRange(i,i),E.toast("Line copied",{type:"info",duration:1200})}})}export function insertLine(t,e){const m=t.selectionStart,i=t.value,s=i.lastIndexOf(`
|
|
7
7
|
`,m-1)+1,o=i.indexOf(`
|
|
8
|
-
`,
|
|
9
|
-
`)});const n=e.getBoundingClientRect(),c=e.closest(".editor-toolbar").getBoundingClientRect();
|
|
10
|
-
${e.value.substring(r,
|
|
11
|
-
[/card]`;e.value=e.value.substring(0,r)+d+e.value.substring(
|
|
12
|
-
${e.value.substring(r,
|
|
13
|
-
[/hero]`;e.value=e.value.substring(0,r)+d+e.value.substring(
|
|
8
|
+
`,s),r=i.substring(s,o===-1?i.length:o);if(r.startsWith(e)){const l=o===-1?"":i.substring(o);t.value=i.substring(0,s)+r.substring(e.length)+l,t.selectionStart=t.selectionEnd=Math.max(s,m-e.length)}else t.value=i.substring(0,s)+e+i.substring(s),t.selectionStart=t.selectionEnd=m+e.length;t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}const Z=["activity","airpods","airport","alert-circle","alert-warning","ambulance","angry","annoyed","apartment","arch","archive","arrow-down","arrow-down-left","arrow-down-right","arrow-left","arrow-right","arrow-up","arrow-up-left","arrow-up-right","astonished","at-sign","attachment","award","badge","ban","bandage","bank","banknote","barbell","barcode","barn","baseball","basketball","battery","battery-charging","bauble","bell","bell-off","bells","bicycle","bitcoin","blood-drop","blush","bold","bone","book","book-closed","book-open","bookmark","bookmark-filled","bowling","box","boxing-glove","brain","bridge","briefcase","building","bus","cabin","cake","calculator","calendar","camera","camera-off","candy-cane","capsule","car","cart","cart-add","cash","cast","castle","chart-area","chart-bar","chart-bar-horizontal","chart-candlestick","chart-line","chart-pie","chat","chat-alt","check","check-circle","check-circle-filled","check-square","chevron-down","chevron-left","chevron-right","chevron-up","chevrons-down","chevrons-left","chevrons-right","chevrons-up","church","circle","circle-filled","clear-format","clipboard","clipboard-check","clipboard-list","clock","close","cloud","cloud-download","cloud-drizzle","cloud-lightning","cloud-off","cloud-rain","cloud-sun","cloud-upload","code","code-block","code-inline","cog","coins","columns","comment","compass","component","confused","cool","copy","corner-down-left","corner-down-right","corner-up-left","corner-up-right","court","cpu","credit-card","crown","crutch","cry","currency-dollar","currency-euro","currency-pound","cycling","database","dead","desktop","disappointed","dna","document","document-add","document-check","document-remove","document-text","dollar-sign","dome","dot","dots-horizontal","dots-vertical","download","droplet","droplets","dumbbell","edit","embed","emoji-happy","emoji-sad","euro-sign","exclamation","expand","expressionless","external-link","eye","eye-medical","eye-off","factory","fast-forward","feather","file-code","file-text","file-zip","fill","film","filter","fire","first-aid","fishing","flag","fog","folder","folder-add","folder-minus","folder-open","folder-plus","folder-remove","football","fortress","fuel","gamepad","garage","gauge","gift","git-branch","github","globe","golf","grid","grin","growth","hard-drive","hash","haze","heading-1","heading-2","heading-3","headphones","heart","heart-eyes","heart-filled","heart-pulse","heartbeat","help-circle","holly","home","hospital","hotel","house","image","image-add","images","inbox","indent","info","info-filled","investment","invoice","italic","joy","joystick","key","kettlebell","keyboard","laptop","laugh","layers","layout","library","lighthouse","lightning","link","link-2","link-add","linkedin","list","list-bullet","list-numbered","loader","loading","lock","log-in","log-out","lungs","mail","mail-open","map","map-pin","mask","maximize","medal","medical-cross","menu","menu-alt","message-circle","message-square","mic","mic-off","microscope","minimize","minus","minus-circle","minus-square","monitor","monument","moon","moon-star","more-horizontal","more-vertical","mosque","motorcycle","mountain","mouse","mouse-pointer","move","museum","music","nerd","neutral","notification","obelisk","office","outdent","package","palette","panel-bottom","panel-left","panel-right","panel-top","paperclip","parking","pause","pause-filled","percent","phone","phone-call","phone-incoming","phone-off","phone-outgoing","piggy-bank","pill","pill-bottle","pin","play","play-circle","play-filled","plug","plus","plus-circle","plus-square","podium","pound-sign","printer","pulse","pyramid","qrcode","question","quote","racket","radio","rage","rain","rainbow","receipt","redo","refresh","refresh-cw","reindeer","rewind","road","rotate-ccw","rotate-cw","router","rss","running","sad","safe","save","scale","scale-weight","school","search","send","server","settings","share","share-2","share-alt","shield","shield-alert","shield-check","shield-x","shipping","shocked","shopping-bag","shrink","sick","sidebar-left","sidebar-right","silly","skate","ski","skip-back","skip-forward","skyscraper","sleepy","sleigh","sliders","smartphone","smartwatch","smile","snow","snowflake","snowman","sob","soccer","sort","sparkles","speaker","spinner","square","stadium","star","star-decoration","star-eyes","star-filled","stethoscope","stop","stop-filled","stopwatch","store","strikethrough","sun","sunrise","sunset","surfboard","surprised","swimming","sync","syringe","tablet","tablet-smartphone","tag","tags","target","taxi","temple","tennis","tent","terminal","test-tube","text-center","text-left","text-right","thermometer","thermometer-medical","thermometer-sun","thinking","thumb-down","thumb-up","tongue","tool","tooth","tower","train-station","trash","tree","trending-down","trending-neutral","trending-up","trophy","truck","tv","tv-minimal","twitter","type","umbrella","underline","undo","university","unlink","unlock","upload","usb","user","user-add","user-check","user-group","user-plus","user-remove","users","vaccine","van","vault","video","video-off","volleyball","volume","volume-down","volume-mute","volume-off","volume-up","wallet","warehouse","warning","warning-filled","watch","webcam","wheelchair","whistle","wifi","wifi-off","wind","windmill","wink","wreath","x","x-circle","x-circle-filled","yoga","youtube","zany","zap"];function se(t,e,m){const i=document.querySelector(".editor-spacer-picker");if(i){i.remove();return}const s=document.createElement("div");s.className="editor-spacer-picker";const o=document.createElement("div");o.className="editor-spacer-picker-label",o.textContent="Spacer height",s.appendChild(o);const r=document.createElement("div");r.className="editor-spacer-picker-row";const l=document.createElement("input");l.type="range",l.className="editor-spacer-slider",l.min="4",l.max="200",l.step="4",l.value=m;const p=document.createElement("span");p.className="editor-spacer-slider-value",p.textContent=m+"px",l.addEventListener("input",function(){p.textContent=this.value+"px"}),r.appendChild(l),r.appendChild(p),s.appendChild(r);const d=document.createElement("button");d.type="button",d.className="btn btn-primary btn-sm editor-spacer-insert-btn",d.textContent="Insert",s.appendChild(d);function f(k){!s.contains(k.target)&&k.target!==e&&(s.remove(),document.removeEventListener("click",f,!0))}d.addEventListener("click",function(){s.remove(),document.removeEventListener("click",f,!0),insertAtCursor(t,`[spacer size="${l.value}" /]
|
|
9
|
+
`)});const n=e.getBoundingClientRect(),c=e.closest(".editor-toolbar").getBoundingClientRect();s.style.top=n.bottom-c.top+4+"px";const a=n.left-c.left;s.style.left=Math.min(a,c.width-240-8)+"px",e.closest(".editor-toolbar").appendChild(s),setTimeout(function(){document.addEventListener("click",f,!0)},0)}function ce(t,e){const m=document.querySelector(".editor-icon-picker");if(m){m.remove();return}const i=document.createElement("div");i.className="editor-icon-picker";const s=document.createElement("input");s.type="text",s.className="form-input editor-icon-picker-search",s.placeholder="Search icons\u2026",i.appendChild(s);const o=document.createElement("div");o.className="editor-icon-picker-size-row";const r=document.createElement("label");r.textContent="Size (px)";const l=document.createElement("input");l.type="number",l.className="form-input editor-icon-picker-size",l.placeholder="default",l.min="8",l.max="256",o.appendChild(r),o.appendChild(l),i.appendChild(o);const p=document.createElement("div");p.className="editor-icon-picker-grid",i.appendChild(p);function d(w){!i.contains(w.target)&&w.target!==e&&(i.remove(),document.removeEventListener("click",d,!0))}function f(w){p.textContent="";const x=w?Z.filter(S=>S.includes(w.toLowerCase())):Z;if(x.length===0){const S=document.createElement("div");S.className="editor-icon-picker-empty",S.textContent="No icons found",p.appendChild(S);return}x.forEach(function(S){const M=document.createElement("button");M.type="button",M.className="editor-icon-picker-item";const v=document.createElement("span");v.setAttribute("data-icon",S);const h=document.createElement("span");h.textContent=S,M.appendChild(v),M.appendChild(h),M.addEventListener("click",function(){i.remove(),document.removeEventListener("click",d,!0);const C=l.value.trim(),L=C?`[icon name="${S}" size="${C}" /]`:`[icon name="${S}" /]`;insertAtCursor(t,L)}),p.appendChild(M)}),Domma.icons.scan(p)}f(""),s.addEventListener("input",function(){f(this.value.trim())});const n=e.getBoundingClientRect(),c=e.closest(".editor-toolbar").getBoundingClientRect();i.style.top=n.bottom-c.top+4+"px";const a=n.left-c.left,k=320,y=c.width;i.style.left=Math.min(a,y-k-8)+"px",e.closest(".editor-toolbar").appendChild(i),requestAnimationFrame(function(){s.focus()}),setTimeout(function(){document.addEventListener("click",d,!0)},0)}function ae(t,e,m,i){const s=document.querySelector(".editor-toolbar-dropdown");if(s){s.remove();return}const o=document.createElement("div");o.className="editor-toolbar-dropdown",m.forEach(function(f){const n=document.createElement("button");if(n.type="button",n.className="editor-toolbar-dropdown-item",f.icon){const a=document.createElement("span");a.setAttribute("data-icon",f.icon),n.appendChild(a)}const c=document.createElement("span");c.textContent=f.label,n.appendChild(c),n.addEventListener("click",function(){o.remove(),document.removeEventListener("click",d,!0),J(f.action,t,e,i)}),o.appendChild(n)});const r=e.getBoundingClientRect(),l=e.closest(".editor-toolbar").getBoundingClientRect();o.style.top=r.bottom-l.top+4+"px";const p=r.left-l.left;o.style.left=Math.min(p,l.width-180-8)+"px",e.closest(".editor-toolbar").appendChild(o),Domma.icons.scan(o);function d(f){!o.contains(f.target)&&f.target!==e&&(o.remove(),document.removeEventListener("click",d,!0))}setTimeout(function(){document.addEventListener("click",d,!0)},0)}function J(t,e,m,i){const{spacerDefault:s,handlers:o}=i;if(typeof t=="function")t(e);else if(t==="block")if(o.block)o.block(e);else{const r=e.selectionStart,l='[block template="" /]';e.value=e.value.substring(0,r)+l+e.value.substring(r),e.selectionStart=e.selectionEnd=r+17,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="component")o.component?o.component(e):de(e);else if(t==="button")if(o.button)o.button(e);else{const r=e.selectionStart,l=e.selectionEnd,d=`[button href="" variant="primary"]${e.value.substring(r,l)||"Click me"}[/button]`;e.value=e.value.substring(0,r)+d+e.value.substring(l),e.selectionStart=e.selectionEnd=r+14,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="linksc")if(o.linksc)o.linksc(e);else{const r=e.selectionStart,l=e.selectionEnd,d=`[link href=""]${e.value.substring(r,l)||"Link text"}[/link]`;e.value=e.value.substring(0,r)+d+e.value.substring(l),e.selectionStart=e.selectionEnd=r+12,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="colourpick"){const r=e.selectionStart;document.getElementById("dm-colour-overlay")?.remove();const l=document.createElement("div");l.id="dm-colour-overlay",l.style.cssText="position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);";const p=document.createElement("div");p.style.cssText="background:var(--dm-surface,#1e1e2e);border:1px solid var(--dm-border,#3a3a5c);border-radius:12px;padding:1.75rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.25rem;min-width:260px;box-shadow:0 16px 48px rgba(0,0,0,.55);";const d=document.createElement("p");d.textContent="Colour Picker",d.style.cssText="margin:0;font-weight:700;font-size:1rem;letter-spacing:.02em;";const f=document.createElement("input");f.type="color",f.value="#000000",f.style.cssText="width:160px;height:110px;cursor:pointer;border:none;background:none;padding:0;border-radius:6px;overflow:hidden;";const n=document.createElement("div");n.style.cssText="display:flex;align-items:center;gap:.5rem;";const c=document.createElement("input");c.type="text",c.value="#000000",c.className="form-input",c.style.cssText="font-family:monospace;width:100px;text-transform:uppercase;letter-spacing:.05em;";const a=document.createElement("button");a.type="button",a.className="btn btn-ghost btn-sm",a.textContent="Copy";const k=document.createElement("button");k.type="button",k.className="btn btn-primary btn-sm",k.textContent="Insert";const y=()=>l.remove();f.addEventListener("input",()=>{c.value=f.value}),c.addEventListener("input",()=>{/^#[0-9a-f]{6}$/i.test(c.value)&&(f.value=c.value)}),a.addEventListener("click",()=>{const w=document.createElement("input");w.value=c.value,document.body.appendChild(w),w.select(),document.execCommand("copy"),w.remove(),a.textContent="Copied!",setTimeout(()=>{a.textContent="Copy"},1500)}),k.addEventListener("click",()=>{e.selectionStart=e.selectionEnd=r,insertAtCursor(e,c.value),y()}),l.addEventListener("click",w=>{w.target===l&&y()}),n.appendChild(c),n.appendChild(a),n.appendChild(k),p.appendChild(d),p.appendChild(f),p.appendChild(n),l.appendChild(p),document.body.appendChild(l)}else if(t==="link")o.link&&o.link(e);else if(t==="image")o.image&&o.image(e);else if(t==="card")if(o.card)o.card(e);else{const r=e.selectionStart,l=e.selectionEnd,d=`[card title="Card Title"]
|
|
10
|
+
${e.value.substring(r,l)||"Content here"}
|
|
11
|
+
[/card]`;e.value=e.value.substring(0,r)+d+e.value.substring(l),e.selectionStart=r+13,e.selectionEnd=r+23,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="hero")if(o.hero)o.hero(e);else{const r=e.selectionStart,l=e.selectionEnd,d=`[hero title="Hero Title" tagline="A short tagline" size="lg"]
|
|
12
|
+
${e.value.substring(r,l)||"Optional body content here."}
|
|
13
|
+
[/hero]`;e.value=e.value.substring(0,r)+d+e.value.substring(l),e.selectionStart=e.selectionEnd=r+d.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="grid")if(o.grid)o.grid(e);else{const r=e.selectionStart,l=`[grid cols="2" gap="4"]
|
|
14
14
|
[col]
|
|
15
15
|
Column 1
|
|
16
16
|
[/col]
|
|
@@ -18,7 +18,7 @@ Column 1
|
|
|
18
18
|
Column 2
|
|
19
19
|
[/col]
|
|
20
20
|
[/grid]
|
|
21
|
-
`;e.value=e.value.substring(0,r)+
|
|
21
|
+
`;e.value=e.value.substring(0,r)+l+e.value.substring(r),e.selectionStart=e.selectionEnd=r+l.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="badge"){const r=e.selectionStart,l=e.selectionEnd,d=`[badge variant="primary"]${e.value.substring(r,l)||"New"}[/badge]`;e.value=e.value.substring(0,r)+d+e.value.substring(l),e.selectionStart=r+16,e.selectionEnd=r+23,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="timeline")if(o.timeline)o.timeline(e);else{const r=e.selectionStart,l=`[timeline layout="vertical"]
|
|
22
22
|
[event title="First Event" date="${new Date().toISOString().slice(0,10)}" status="completed"]
|
|
23
23
|
Describe this event.
|
|
24
24
|
[/event]
|
|
@@ -26,21 +26,21 @@ Describe this event.
|
|
|
26
26
|
Describe this event.
|
|
27
27
|
[/event]
|
|
28
28
|
[/timeline]
|
|
29
|
-
`;e.value=e.value.substring(0,r)+
|
|
29
|
+
`;e.value=e.value.substring(0,r)+l+e.value.substring(r),e.selectionStart=e.selectionEnd=r+l.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="effects")o.effects&&o.effects(e);else if(t==="embed")import("./embed-builder.js").then(r=>r.EmbedBuilder.open(e)).catch(r=>console.error("Embed builder failed to load",r));else if(t==="spacerpick")se(e,m,s);else if(t==="iconpick")ce(e,m);else if(t==="listgroup")o.listgroup?o.listgroup(e):insertAtCursor(e,`[listgroup]
|
|
30
30
|
[item]Item 1[/item]
|
|
31
31
|
[item]Item 2[/item]
|
|
32
32
|
[item]Item 3[/item]
|
|
33
33
|
[/listgroup]
|
|
34
|
-
`);else if(t==="collection")o.collection?o.collection(e):insertAtCursor(e,'[collection slug="" display="table" /]');else if(t==="view")o.view&&o.view(e);else if(t==="cta")o.cta&&o.cta(e);else if(t==="form")o.form?o.form(e):insertAtCursor(e,'[form slug="" /]');else if(t==="tabs")o.tabs&&o.tabs(e);else if(t==="carousel")o.carousel&&o.carousel(e);else if(t==="banner")o.banner&&o.banner(e);else if(t==="scribe")if(o.scribe)o.scribe(e);else{const r=e.selectionStart,
|
|
34
|
+
`);else if(t==="collection")o.collection?o.collection(e):insertAtCursor(e,'[collection slug="" display="table" /]');else if(t==="view")o.view&&o.view(e);else if(t==="cta")o.cta&&o.cta(e);else if(t==="form")o.form?o.form(e):insertAtCursor(e,'[form slug="" /]');else if(t==="tabs")o.tabs&&o.tabs(e);else if(t==="carousel")o.carousel&&o.carousel(e);else if(t==="banner")o.banner&&o.banner(e);else if(t==="scribe")if(o.scribe)o.scribe(e);else{const r=e.selectionStart,l=`[scribe]
|
|
35
35
|
[render]Type text here.[/render]
|
|
36
36
|
[wait]1500[/wait]
|
|
37
37
|
[undo all="true" /]
|
|
38
38
|
[render]More text.[/render]
|
|
39
39
|
[/scribe]
|
|
40
|
-
`;e.value=e.value.substring(0,r)+
|
|
40
|
+
`;e.value=e.value.substring(0,r)+l+e.value.substring(r),e.selectionStart=e.selectionEnd=r+l.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="accordion")if(o.accordion)o.accordion(e);else{const r=e.selectionStart,l=`[accordion]
|
|
41
41
|
[item title="Item 1"]Content here.[/item]
|
|
42
42
|
[item title="Item 2"]Content here.[/item]
|
|
43
43
|
[/accordion]
|
|
44
|
-
`;e.value=e.value.substring(0,r)+
|
|
44
|
+
`;e.value=e.value.substring(0,r)+l+e.value.substring(r),e.selectionStart=e.selectionEnd=r+l.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="text"){let n=function(b,u){const g=document.createElement("div"),T=document.createElement("label");return T.style.cssText=d,T.textContent=b,g.appendChild(T),g.appendChild(u),g},c=function(b){const u=document.createElement("select");return u.style.cssText=f,[["","\u2014 default \u2014"],...b].forEach(([g,T])=>{const O=document.createElement("option");O.value=g,O.textContent=T,u.appendChild(O)}),u},a=function(b,u){const g=document.createElement("input");return g.type="text",g.placeholder=b||"",g.value=u||"",g.style.cssText=f,g},k=function(b){const u=document.createElement("label");u.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const g=document.createElement("input");g.type="checkbox";const T=document.createElement("span");return T.style.cssText="font-size:.85em;color:var(--dm-text,#eee);",T.textContent=b,u.appendChild(g),u.appendChild(T),{wrap:u,cb:g}},y=function(b,u){const g=document.createElement("div");return g.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.5rem;",g.appendChild(b),g.appendChild(u),g},w=function(b){const u=document.createElement("div");return u.style.cssText="border-top:1px solid var(--dm-border,#333);padding-top:.5rem;margin-top:.1rem;font-size:.65rem;font-weight:700;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.08em;",u.textContent=b,u},_=function(){const b=[];M.value&&b.push(`font-size:${ee[M.value]||M.value}`);const u=parseFloat(v.value);!isNaN(u)&&u>0&&b.push(`font-size:${u}pt`),L.checked?b.push("font-weight:700"):h.value&&b.push(`font-weight:${te[h.value]||h.value}`),z.checked&&b.push("font-style:italic");const g=B.value.trim();g&&b.push(`color:${Y[g]||g}`),W.value&&b.push(`font-family:${oe[W.value]}`),P.value&&b.push(`text-transform:${ie[P.value]}`),A.value&&b.push(`text-decoration:${re[A.value]}`),H.value&&b.push(`letter-spacing:${ne[H.value]}`),R.value&&(b.push("display:block"),b.push(`text-align:${R.value}`)),D.value.trim()&&b.push(D.value.trim()),q.style.cssText=b.join(";"),q.textContent=S.value||"Preview text"};const r=e.selectionStart,l=e.selectionEnd,p=e.value.substring(r,l)||"",d="display:block;font-size:.7rem;font-weight:600;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;",x=document.createElement("div");x.style.cssText="padding:1rem;display:flex;flex-direction:column;gap:.6rem;overflow-y:auto;max-height:75vh;";const S=a("Text to style\u2026",p);x.appendChild(n("Content",S)),x.appendChild(w("Typography"));const M=c([["xs","xs \u2014 0.75rem"],["sm","sm \u2014 0.875rem"],["base","base \u2014 1rem"],["lg","lg \u2014 1.125rem"],["xl","xl \u2014 1.25rem"],["2xl","2xl \u2014 1.5rem"],["3xl","3xl \u2014 1.875rem"],["4xl","4xl \u2014 2.25rem"]]),v=a("pt value (overrides Size)");x.appendChild(y(n("Size",M),n("Point Size (pt)",v)));const h=c([["thin","Thin (100)"],["light","Light (300)"],["normal","Normal (400)"],["medium","Medium (500)"],["semibold","Semibold (600)"],["bold","Bold (700)"],["extrabold","Extrabold (800)"],["black","Black (900)"]]),{wrap:C,cb:L}=k("Bold (overrides Weight)"),{wrap:N,cb:z}=k("Italic"),j=document.createElement("div");j.style.cssText="display:flex;flex-direction:column;gap:.4rem;justify-content:flex-end;",j.appendChild(C),j.appendChild(N),x.appendChild(y(n("Weight",h),j)),x.appendChild(w("Appearance"));const B=a("e.g. primary, #ff0000"),W=c([["Georgia","Georgia (serif)"],["Arial","Arial (sans-serif)"],["Verdana","Verdana (sans-serif)"],["Courier New","Courier New (mono)"],["Times New Roman","Times New Roman (serif)"],["Trebuchet MS","Trebuchet MS"]]);x.appendChild(y(n("Colour",B),n("Font",W))),x.appendChild(w("Formatting"));const P=c([["upper","Uppercase"],["lower","Lowercase"],["capitalize","Capitalise"],["none","None"]]),A=c([["underline","Underline"],["line-through","Line-through"],["none","None"]]);x.appendChild(y(n("Transform",P),n("Decoration",A)));const H=c([["tight","Tight"],["normal","Normal"],["wide","Wide"],["wider","Wider"]]),R=c([["left","Left"],["center","Centre"],["right","Right"],["justify","Justify"]]);x.appendChild(y(n("Spacing",H),n("Align",R))),x.appendChild(w("Advanced"));const D=a("e.g. margin-top:1rem;display:block");x.appendChild(n("Style",D));const F=a("CSS class(es)"),G=a("ID");x.appendChild(y(n("Class",F),n("ID",G)));const K=document.createElement("div");K.style.cssText="padding:.75rem;background:var(--dm-surface-subtle,#111);border-radius:4px;min-height:2.5rem;display:flex;align-items:center;";const q=document.createElement("span");q.textContent=p||"Preview text",K.appendChild(q),x.appendChild(n("Preview",K));const Y={primary:"var(--dm-color-primary)",secondary:"var(--dm-color-secondary)",muted:"var(--dm-text-muted)",danger:"var(--dm-color-danger)",success:"var(--dm-color-success)",warning:"var(--dm-color-warning)",info:"var(--dm-color-info)"},ee={xs:".75rem",sm:".875rem",base:"1rem",lg:"1.125rem",xl:"1.25rem","2xl":"1.5rem","3xl":"1.875rem","4xl":"2.25rem"},te={thin:"100",light:"300",normal:"400",medium:"500",semibold:"600",bold:"700",extrabold:"800",black:"900"},ne={tight:"-0.05em",normal:"0em",wide:"0.05em",wider:"0.1em"},oe={Georgia:"Georgia,serif",Arial:"Arial,sans-serif",Verdana:"Verdana,sans-serif","Courier New":"'Courier New',monospace","Times New Roman":"'Times New Roman',serif","Trebuchet MS":"'Trebuchet MS',sans-serif"},ie={upper:"uppercase",lower:"lowercase",capitalize:"capitalize",none:"none"},re={underline:"underline","line-through":"line-through",none:"none"};L.addEventListener("change",()=>{h.disabled=L.checked,L.checked&&(h.value=""),_()}),[M,h,W,P,A,H,R].forEach(b=>{b.addEventListener("change",_)}),[B,S,D,v].forEach(b=>{b.addEventListener("input",_)}),z.addEventListener("change",_);const V=document.createElement("button");V.type="button",V.className="btn btn-primary",V.textContent="Insert",x.appendChild(V);const U=E.slideover({title:"Style Text",size:"md",position:"right",content:x});U.open(),V.addEventListener("click",()=>{const b=S.value;if(!b.trim())return;const u=[];M.value&&u.push(`size="${M.value}"`);const g=parseFloat(v.value);!isNaN(g)&&g>0&&u.push(`point-size="${g}"`),L.checked?u.push("bold"):h.value&&u.push(`weight="${h.value}"`),z.checked&&u.push("italic"),B.value.trim()&&u.push(`color="${B.value.trim()}"`),W.value&&u.push(`font="${W.value}"`),P.value&&u.push(`transform="${P.value}"`),A.value&&u.push(`decoration="${A.value}"`),H.value&&u.push(`spacing="${H.value}"`),R.value&&u.push(`align="${R.value}"`),D.value.trim()&&u.push(`style="${D.value.trim().replace(/"/g,""")}"`),F.value.trim()&&u.push(`class="${F.value.trim()}"`),G.value.trim()&&u.push(`id="${G.value.trim()}"`);const O=`[text${u.length?" "+u.join(" "):""}]${b}[/text]`;U.close(),insertAtCursor(e,O),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}else t==="help"?o.help&&o.help(e):t==="tutorial"&&o.tutorial&&o.tutorial(e)}const Q=[{icon:"bold",title:"Bold (Ctrl+B)",action:t=>wrapSelection(t,"**","**")},{icon:"italic",title:"Italic (Ctrl+I)",action:t=>wrapSelection(t,"_","_")},{icon:"strikethrough",title:"Strikethrough",action:t=>wrapSelection(t,"~~","~~")},"|",{type:"dropdown",icon:"heading-1",title:"Headings",items:[{label:"Heading 1",icon:"heading-1",action:t=>insertLine(t,"# ")},{label:"Heading 2",icon:"heading-2",action:t=>insertLine(t,"## ")},{label:"Heading 3",icon:"heading-3",action:t=>insertLine(t,"### ")}]},"|",{icon:"list-bullet",title:"Bullet list",action:t=>insertLine(t,"- ")},{icon:"list-numbered",title:"Numbered list",action:t=>insertLine(t,"1. ")},"|",{type:"dropdown",icon:"quote",title:"Paragraph",items:[{label:"Blockquote",icon:"quote",action:t=>insertLine(t,"> ")},{label:"Horizontal rule",icon:"minus-circle",action:t=>insertAtCursor(t,`
|
|
45
45
|
---
|
|
46
|
-
`)}]},"|",{type:"dropdown",icon:"code-inline",title:"Code",items:[{label:"Inline code",icon:"code-inline",action:t=>wrapSelection(t,"`","`")},{label:"Code block",icon:"code-block",action:t=>wrapSelection(t,"\n```\n","\n```\n")}]},"|",{type:"dropdown",icon:"plus-circle",title:"Insert",items:[{label:"Accordion",icon:"accordion-insert",action:"accordion"},{label:"Banner",icon:"banner-insert",action:"banner"},{label:"Badge",icon:"badge",action:"badge"},{label:"Block",icon:"layout",action:"block"},{label:"Button",icon:"btn-insert",action:"button"},{label:"Card",icon:"card",action:"card"},{label:"Carousel",icon:"carousel-insert",action:"carousel"},{label:"Colour Picker",icon:"colour-picker",action:"colourpick"},{label:"Collection",icon:"database",action:"collection"},{label:"Component",icon:"component",action:"component"},{label:"CTA Button",icon:"mouse-pointer",action:"cta"},{label:"Form",icon:"file-text",action:"form"},{label:"Grid",icon:"columns",action:"grid"},{label:"Hero",icon:"hero",action:"hero"},{label:"Icon",icon:"icon-pick",action:"iconpick"},{label:"Image",icon:"image-add",action:"image"},{label:"Link",icon:"link-shortcode",action:"linksc"},{label:"List Group",icon:"list",action:"listgroup"},{label:"Scribe",icon:"scribe-insert",action:"scribe"},{label:"Spacer",icon:"spacer-insert",action:"spacerpick"},{label:"Tabs",icon:"layout-list",action:"tabs"},{label:"Text",icon:"text-style",action:"text"},{label:"Timeline",icon:"activity",action:"timeline"},{label:"View",icon:"eye",action:"view"}]},"|",{icon:"sparkles",title:"Effects",action:"effects"},{icon:"book-open",title:"CRUD tutorial",action:"tutorial"},{icon:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,m={}){se();const i={link:null,image:null,card:null,grid:null,help:null,tutorial:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null,carousel:null,hero:null,banner:null},l=m.spacerDefault??40,o=t.get(0),r=e.get(0);r.textContent="",Q.forEach((n,c)=>{if(n==="|"){const a=document.createElement("span");a.className="editor-toolbar-sep",r.appendChild(a)}else{const a=document.createElement("button");a.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",a.setAttribute("data-tooltip",n.title),a.setAttribute("data-idx",String(c)),a.type="button";const k=document.createElement("span");if(k.setAttribute("data-icon",n.icon),a.appendChild(k),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",a.appendChild(y)}r.appendChild(a)}});const s=document.createElement("div");s.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const c=document.createElement("button");c.className="editor-view-btn"+(n.active?" active":""),c.setAttribute("data-mode",n.mode),c.setAttribute("data-tooltip",n.label),c.type="button";const a=document.createElement("span");a.setAttribute("data-icon",n.icon),c.appendChild(a),s.appendChild(c)});const p=document.createElement("span");p.className="editor-toolbar-sep",s.appendChild(p);const d=document.createElement("button");d.id="fullscreen-btn",d.className="editor-toolbar-btn",d.setAttribute("data-tooltip","Toggle fullscreen"),d.type="button";const f=document.createElement("span");return f.setAttribute("data-icon","expand"),d.appendChild(f),s.appendChild(d),r.appendChild(s),Domma.icons.scan(),r.querySelectorAll("[data-tooltip]").forEach(n=>{E.tooltip(n,{content:n.getAttribute("data-tooltip"),position:"top"})}),e.on("click",".editor-toolbar-btn[data-idx]",function(){const n=parseInt($(this).data("idx"),10),c=Q[n];if(!c||c==="|")return;const a=e.get(0).querySelector(`[data-idx="${n}"]`),k={spacerDefault:l,handlers:i};c.type==="dropdown"?ae(o,a,c.items,k):J(c.action,o,a,k)}),attachEditorKeybindings(o),o.addEventListener("keydown",n=>{const c=n.key.toLowerCase();(n.ctrlKey||n.metaKey)&&(c==="b"?(n.preventDefault(),wrapSelection(o,"**","**")):c==="i"?(n.preventDefault(),wrapSelection(o,"_","_")):c==="k"&&(n.preventDefault(),i.link&&i.link(o)))}),{$toolbar:e,onLink(n){i.link=n},onImage(n){i.image=n},onCard(n){i.card=n},onGrid(n){i.grid=n},onHelp(n){i.help=n},onTutorial(n){i.tutorial=n},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onCarousel(n){i.carousel=n},onAccordion(n){i.accordion=n},onHero(n){i.hero=n},onBanner(n){i.banner=n},onListGroup(n){i.listgroup=n},onScribe(n){i.scribe=n},onTimeline(n){i.timeline=n}}}async function de(t){const{api:e}=await import("../api.js");let m;try{m=await e.components.list()}catch(v){E.toast(v.message||"Failed to load components.",{type:"error"});return}if(!m?.length){E.toast("No components yet. Create one in Data \u2192 Components first.",{type:"info"});return}const i=E.slideover({title:"Insert Component",size:"lg",position:"right"}),l=document.createElement("div");l.style.cssText="display:flex;flex-direction:column;gap:1rem;padding:.75rem;min-height:100%;";const o=document.createElement("div");o.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",o.textContent="Gallery";const r=document.createElement("div");r.style.cssText="display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;";const s=document.createElement("div");s.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",s.textContent="Props";const p=document.createElement("div");p.style.cssText="padding:.6rem;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;min-height:40px;",p.textContent="Select a component from the gallery above.";const d=document.createElement("div");d.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",d.textContent="Preview";const f=document.createElement("iframe");f.src="/admin/preview/component-preview.html",f.style.cssText="width:100%;min-height:180px;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;background:#fff;";const n=document.createElement("div");n.style.cssText="display:flex;justify-content:flex-end;gap:.5rem;margin-top:auto;padding-top:.75rem;border-top:1px solid var(--dm-border,rgba(255,255,255,.08));";const c=document.createElement("button");c.className="btn btn-ghost",c.textContent="Cancel";const a=document.createElement("button");a.className="btn btn-primary",a.textContent="Insert",a.disabled=!0,n.appendChild(c),n.appendChild(a),l.appendChild(o),l.appendChild(r),l.appendChild(s),l.appendChild(p),l.appendChild(d),l.appendChild(f),l.appendChild(n),i.setContent(l),i.open();let k=null,y={};function w(){r.replaceChildren();for(const v of m){const h=document.createElement("button");h.type="button",h.className="btn btn-ghost",h.style.cssText="display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;padding:.6rem;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;text-align:left;";const C=document.createElement("strong");C.style.cssText="font-size:.9rem;",C.textContent=v.name;const L=document.createElement("span");L.style.cssText="font-size:.72rem;color:var(--dm-text-muted,#888);",L.textContent=`${Object.keys(v.props||{}).length} prop(s)`,h.appendChild(C),h.appendChild(L),h.addEventListener("click",()=>x(v)),r.appendChild(h)}}function x(v){k=v,y={};for(const[h,C]of Object.entries(v.props||{}))y[h]=C.default!==void 0?C.default:"";a.disabled=!1,S(),M()}function S(){p.replaceChildren();const v=Object.entries(k.props||{});if(v.length===0){const h=document.createElement("p");h.className="text-muted",h.style.margin="0",h.textContent="This component takes no props.",p.appendChild(h);return}for(const[h,C]of v){const L=document.createElement("div");L.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;";const N=document.createElement("label");N.style.cssText="font-size:.8rem;min-width:120px;color:var(--dm-text-muted,#aaa);",N.textContent=C.label||h,L.appendChild(N);const z=ue(C);pe(z,C,y[h]),z.addEventListener("input",()=>{y[h]=X(z,C),f.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),z.addEventListener("change",()=>{y[h]=X(z,C),f.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),L.appendChild(z),p.appendChild(L)}}async function M(){if(k)try{const v=await fetch(`/api/components/${encodeURIComponent(k.name)}.js`);if(!v.ok)throw new Error(`Failed to load component (${v.status})`);const h=await v.text();f.contentWindow?.postMessage({type:"remount",payload:{compiledJs:h,tagName:`dm-${k.name}`,props:y}},"*")}catch(v){E.toast(v.message||"Failed to load preview.",{type:"error"})}}c.addEventListener("click",()=>i.close()),a.addEventListener("click",()=>{if(!k)return;const v=t.selectionStart,h=t.selectionEnd,C=Object.entries(y).map(([N,z])=>{const j=N.replace(/([A-Z])/g,"-$1").toLowerCase(),B=String(z??"").replace(/"/g,""");return`${j}="${B}"`}).join(" "),L=`[component name="${k.name}"${C?" "+C:""} /]`;t.value=t.value.substring(0,v)+L+t.value.substring(h),t.selectionStart=t.selectionEnd=v+L.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus(),i.close()}),w()}function ue(t){let e;return t.type==="number"?(e=document.createElement("input"),e.type="number",e.className="form-input form-input--sm"):t.type==="boolean"?(e=document.createElement("input"),e.type="checkbox",e.className="form-check"):t.type==="array"||t.type==="object"?(e=document.createElement("textarea"),e.rows=2,e.className="form-input form-input--sm",e.style.fontFamily="var(--dm-font-mono, monospace)"):(e=document.createElement("input"),e.type="text",e.className="form-input form-input--sm"),e.style.flex="1",e}function X(t,e){if(e.type==="number")return t.value===""?null:Number(t.value);if(e.type==="boolean")return!!t.checked;if(e.type==="array"||e.type==="object")try{return JSON.parse(t.value||"null")}catch{return null}return t.value}function pe(t,e,m){e.type==="boolean"?t.checked=!!m:e.type==="array"||e.type==="object"?t.value=JSON.stringify(m??null):t.value=m??""}
|
|
46
|
+
`)}]},"|",{type:"dropdown",icon:"code-inline",title:"Code",items:[{label:"Inline code",icon:"code-inline",action:t=>wrapSelection(t,"`","`")},{label:"Code block",icon:"code-block",action:t=>wrapSelection(t,"\n```\n","\n```\n")}]},"|",{type:"dropdown",icon:"plus-circle",title:"Insert",items:[{label:"Accordion",icon:"accordion-insert",action:"accordion"},{label:"Banner",icon:"banner-insert",action:"banner"},{label:"Badge",icon:"badge",action:"badge"},{label:"Block",icon:"layout",action:"block"},{label:"Button",icon:"btn-insert",action:"button"},{label:"Card",icon:"card",action:"card"},{label:"Carousel",icon:"carousel-insert",action:"carousel"},{label:"Colour Picker",icon:"colour-picker",action:"colourpick"},{label:"Collection",icon:"database",action:"collection"},{label:"Component",icon:"component",action:"component"},{label:"CTA Button",icon:"mouse-pointer",action:"cta"},{label:"Embed",icon:"video",action:"embed"},{label:"Form",icon:"file-text",action:"form"},{label:"Grid",icon:"columns",action:"grid"},{label:"Hero",icon:"hero",action:"hero"},{label:"Icon",icon:"icon-pick",action:"iconpick"},{label:"Image",icon:"image-add",action:"image"},{label:"Link",icon:"link-shortcode",action:"linksc"},{label:"List Group",icon:"list",action:"listgroup"},{label:"Scribe",icon:"scribe-insert",action:"scribe"},{label:"Spacer",icon:"spacer-insert",action:"spacerpick"},{label:"Tabs",icon:"layout-list",action:"tabs"},{label:"Text",icon:"text-style",action:"text"},{label:"Timeline",icon:"activity",action:"timeline"},{label:"View",icon:"eye",action:"view"}]},"|",{icon:"sparkles",title:"Effects",action:"effects"},{icon:"book-open",title:"CRUD tutorial",action:"tutorial"},{icon:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,m={}){le();const i={link:null,image:null,card:null,grid:null,help:null,tutorial:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null,carousel:null,hero:null,banner:null},s=m.spacerDefault??40,o=t.get(0),r=e.get(0);r.textContent="",Q.forEach((n,c)=>{if(n==="|"){const a=document.createElement("span");a.className="editor-toolbar-sep",r.appendChild(a)}else{const a=document.createElement("button");a.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",a.setAttribute("data-tooltip",n.title),a.setAttribute("data-idx",String(c)),a.type="button";const k=document.createElement("span");if(k.setAttribute("data-icon",n.icon),a.appendChild(k),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",a.appendChild(y)}r.appendChild(a)}});const l=document.createElement("div");l.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const c=document.createElement("button");c.className="editor-view-btn"+(n.active?" active":""),c.setAttribute("data-mode",n.mode),c.setAttribute("data-tooltip",n.label),c.type="button";const a=document.createElement("span");a.setAttribute("data-icon",n.icon),c.appendChild(a),l.appendChild(c)});const p=document.createElement("span");p.className="editor-toolbar-sep",l.appendChild(p);const d=document.createElement("button");d.id="fullscreen-btn",d.className="editor-toolbar-btn",d.setAttribute("data-tooltip","Toggle fullscreen"),d.type="button";const f=document.createElement("span");return f.setAttribute("data-icon","expand"),d.appendChild(f),l.appendChild(d),r.appendChild(l),Domma.icons.scan(),r.querySelectorAll("[data-tooltip]").forEach(n=>{E.tooltip(n,{content:n.getAttribute("data-tooltip"),position:"top"})}),e.on("click",".editor-toolbar-btn[data-idx]",function(){const n=parseInt($(this).data("idx"),10),c=Q[n];if(!c||c==="|")return;const a=e.get(0).querySelector(`[data-idx="${n}"]`),k={spacerDefault:s,handlers:i};c.type==="dropdown"?ae(o,a,c.items,k):J(c.action,o,a,k)}),attachEditorKeybindings(o),o.addEventListener("keydown",n=>{const c=n.key.toLowerCase();(n.ctrlKey||n.metaKey)&&(c==="b"?(n.preventDefault(),wrapSelection(o,"**","**")):c==="i"?(n.preventDefault(),wrapSelection(o,"_","_")):c==="k"&&(n.preventDefault(),i.link&&i.link(o)))}),{$toolbar:e,onLink(n){i.link=n},onImage(n){i.image=n},onCard(n){i.card=n},onGrid(n){i.grid=n},onHelp(n){i.help=n},onTutorial(n){i.tutorial=n},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onCarousel(n){i.carousel=n},onAccordion(n){i.accordion=n},onHero(n){i.hero=n},onBanner(n){i.banner=n},onListGroup(n){i.listgroup=n},onScribe(n){i.scribe=n},onTimeline(n){i.timeline=n}}}async function de(t){const{api:e}=await import("../api.js");let m;try{m=await e.components.list()}catch(v){E.toast(v.message||"Failed to load components.",{type:"error"});return}if(!m?.length){E.toast("No components yet. Create one in Data \u2192 Components first.",{type:"info"});return}const i=E.slideover({title:"Insert Component",size:"lg",position:"right"}),s=document.createElement("div");s.style.cssText="display:flex;flex-direction:column;gap:1rem;padding:.75rem;min-height:100%;";const o=document.createElement("div");o.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",o.textContent="Gallery";const r=document.createElement("div");r.style.cssText="display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;";const l=document.createElement("div");l.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",l.textContent="Props";const p=document.createElement("div");p.style.cssText="padding:.6rem;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;min-height:40px;",p.textContent="Select a component from the gallery above.";const d=document.createElement("div");d.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",d.textContent="Preview";const f=document.createElement("iframe");f.src="/admin/preview/component-preview.html",f.style.cssText="width:100%;min-height:180px;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;background:#fff;";const n=document.createElement("div");n.style.cssText="display:flex;justify-content:flex-end;gap:.5rem;margin-top:auto;padding-top:.75rem;border-top:1px solid var(--dm-border,rgba(255,255,255,.08));";const c=document.createElement("button");c.className="btn btn-ghost",c.textContent="Cancel";const a=document.createElement("button");a.className="btn btn-primary",a.textContent="Insert",a.disabled=!0,n.appendChild(c),n.appendChild(a),s.appendChild(o),s.appendChild(r),s.appendChild(l),s.appendChild(p),s.appendChild(d),s.appendChild(f),s.appendChild(n),i.setContent(s),i.open();let k=null,y={};function w(){r.replaceChildren();for(const v of m){const h=document.createElement("button");h.type="button",h.className="btn btn-ghost",h.style.cssText="display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;padding:.6rem;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;text-align:left;";const C=document.createElement("strong");C.style.cssText="font-size:.9rem;",C.textContent=v.name;const L=document.createElement("span");L.style.cssText="font-size:.72rem;color:var(--dm-text-muted,#888);",L.textContent=`${Object.keys(v.props||{}).length} prop(s)`,h.appendChild(C),h.appendChild(L),h.addEventListener("click",()=>x(v)),r.appendChild(h)}}function x(v){k=v,y={};for(const[h,C]of Object.entries(v.props||{}))y[h]=C.default!==void 0?C.default:"";a.disabled=!1,S(),M()}function S(){p.replaceChildren();const v=Object.entries(k.props||{});if(v.length===0){const h=document.createElement("p");h.className="text-muted",h.style.margin="0",h.textContent="This component takes no props.",p.appendChild(h);return}for(const[h,C]of v){const L=document.createElement("div");L.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;";const N=document.createElement("label");N.style.cssText="font-size:.8rem;min-width:120px;color:var(--dm-text-muted,#aaa);",N.textContent=C.label||h,L.appendChild(N);const z=ue(C);pe(z,C,y[h]),z.addEventListener("input",()=>{y[h]=X(z,C),f.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),z.addEventListener("change",()=>{y[h]=X(z,C),f.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),L.appendChild(z),p.appendChild(L)}}async function M(){if(k)try{const v=await fetch(`/api/components/${encodeURIComponent(k.name)}.js`);if(!v.ok)throw new Error(`Failed to load component (${v.status})`);const h=await v.text();f.contentWindow?.postMessage({type:"remount",payload:{compiledJs:h,tagName:`dm-${k.name}`,props:y}},"*")}catch(v){E.toast(v.message||"Failed to load preview.",{type:"error"})}}c.addEventListener("click",()=>i.close()),a.addEventListener("click",()=>{if(!k)return;const v=t.selectionStart,h=t.selectionEnd,C=Object.entries(y).map(([N,z])=>{const j=N.replace(/([A-Z])/g,"-$1").toLowerCase(),B=String(z??"").replace(/"/g,""");return`${j}="${B}"`}).join(" "),L=`[component name="${k.name}"${C?" "+C:""} /]`;t.value=t.value.substring(0,v)+L+t.value.substring(h),t.selectionStart=t.selectionEnd=v+L.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus(),i.close()}),w()}function ue(t){let e;return t.type==="number"?(e=document.createElement("input"),e.type="number",e.className="form-input form-input--sm"):t.type==="boolean"?(e=document.createElement("input"),e.type="checkbox",e.className="form-check"):t.type==="array"||t.type==="object"?(e=document.createElement("textarea"),e.rows=2,e.className="form-input form-input--sm",e.style.fontFamily="var(--dm-font-mono, monospace)"):(e=document.createElement("input"),e.type="text",e.className="form-input form-input--sm"),e.style.flex="1",e}function X(t,e){if(e.type==="number")return t.value===""?null:Number(t.value);if(e.type==="boolean")return!!t.checked;if(e.type==="array"||e.type==="object")try{return JSON.parse(t.value||"null")}catch{return null}return t.value}function pe(t,e,m){e.type==="boolean"?t.checked=!!m:e.type==="array"||e.type==="object"?t.value=JSON.stringify(m??null):t.value=m??""}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import{SHORTCODES as f}from"./shortcode-registry.js";import{EFFECTS as p}from"./effect-defs.js";import{findEnclosingShortcode as k,setAttr as g,setAttrs as M,effectAttrKeys as R}from"./shortcode-tags.js";import{insertAtCursor as C}from"./markdown-toolbar.js";const A=f.map(e=>({name:e.name,selfClosing:!!e.selfClosing})),N=new Map(f.map(e=>[e.name,e])),D=["Layout","Content","Components","Data","Media","Effects"],P=new Map(p.map(e=>[e.name,e])),Y=p.map(e=>({name:e.name,selfClosing:!!e.selfClosing})),j=[...A,...Y],w=new Set(["card","hero","banner","col","button"]);let a=null;const y="position:fixed;z-index:10000;min-width:210px;max-height:70vh;overflow-y:auto;background:var(--dm-surface,#1c1c30);border:1px solid var(--dm-border,#2a2a40);border-radius:6px;box-shadow:0 8px 28px rgba(0,0,0,.45);padding:.3rem;font-size:.83rem;color:var(--dm-text,#e5e5e5);",d="display:flex;align-items:center;gap:.5rem;width:100%;text-align:left;padding:.35rem .55rem;border:none;background:transparent;color:inherit;border-radius:4px;cursor:pointer;font-size:.83rem;",z="padding:.3rem .55rem;color:var(--dm-text-muted,#8a8a9a);font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;",F="flex:1;min-width:0;padding:.2rem .4rem;background:var(--dm-input-bg,#12121e);border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text,#eee);font-size:.8rem;",O="height:1px;background:var(--dm-border,#2a2a40);margin:.3rem .2rem;";function m(e){return e.addEventListener("mouseenter",()=>{e.style.background="var(--dm-primary,#4338ca)",e.style.color="#fff"}),e.addEventListener("mouseleave",()=>{e.style.background="transparent",e.style.color="inherit"}),e}export function attachContextMenu(e){e.addEventListener("contextmenu",t=>{t.preventDefault(),u();const n=k(e,j);W(e,n,t.clientX,t.clientY)})}function u(){a&&(v(),a.root.remove(),document.removeEventListener("mousedown",T,!0),document.removeEventListener("keydown",_,!0),window.removeEventListener("scroll",u,!0),a=null)}const T=e=>{a&&!a.root.contains(e.target)&&!(a.submenu&&a.submenu.contains(e.target))&&u()},_=e=>{e.key==="Escape"&&u()};function W(e,t,n,o){const c=document.createElement("div");c.className="dm-sc-menu",c.style.cssText=y,a={root:c,textarea:e,span:t,submenu:null};const s=t&&(N.get(t.name)||P.get(t.name)),r=t&&w.has(t.name)?p.filter(l=>t.attrs[l.name]===!0):[];s&&B(c,s);for(const l of r)X(c,l);(s||r.length)&&c.appendChild(H()),c.appendChild(E("Add effect\u2026",()=>q())),c.appendChild(E("Insert\u2026",()=>J()));const i=e.selectionStart!==e.selectionEnd;(t||i)&&c.appendChild(E(i?"Wrap selection in\u2026":"Wrap in\u2026",()=>Q())),document.body.appendChild(c),$(c,n,o),document.addEventListener("mousedown",T,!0),document.addEventListener("keydown",_,!0),window.addEventListener("scroll",u,!0),window.I&&I.scan(c)}function H(){const e=document.createElement("div");return e.style.cssText=O,e}function h(e){const t=document.createElement("div");return t.style.cssText=z,t.textContent=e,t}function B(e,t){e.appendChild(h(`${t.label} options`));for(const n of t.attrs||[])e.appendChild(L(n))}function L(e,t=e.name){const n=a.span.attrs[t];switch(e.type){case"checkbox":return K(e,t,n===!0);case"select":return V(e,t,n);case"colour":return G(e,t,n);default:return U(e,t,n)}}function b(e,t){a.span=g(a.textarea,a.span,e,t)}function K(e,t,n){const o=m(document.createElement("label"));o.style.cssText=d;const c=document.createElement("input");return c.type="checkbox",c.checked=n,c.addEventListener("change",()=>b(t,!!c.checked)),o.appendChild(c),o.appendChild(document.createTextNode(e.label)),o}function U(e,t,n){const o=document.createElement("div");o.style.cssText=d+"cursor:default;";const c=document.createElement("span");c.textContent=e.label,c.style.cssText="white-space:nowrap;color:var(--dm-text-muted,#9a9aac);";const s=document.createElement("input");s.type=e.type==="number"?"number":"text",s.value=n===!0||n==null?"":n,s.style.cssText=F;let r=null;return s.addEventListener("input",()=>{clearTimeout(r),r=setTimeout(()=>b(t,s.value.trim()),180)}),s.addEventListener("mousedown",i=>i.stopPropagation()),o.appendChild(c),o.appendChild(s),o}function G(e,t,n){const o=document.createElement("div");o.style.cssText=d+"cursor:default;";const c=document.createElement("span");c.textContent=e.label,c.style.flex="1";const s=document.createElement("input");return s.type="color",typeof n=="string"&&/^#/.test(n)&&(s.value=n),s.addEventListener("input",()=>b(t,s.value)),o.appendChild(c),o.appendChild(s),o}function V(e,t,n){return E(`${e.label}${n&&n!==!0?`: ${n}`:""}`,()=>{const o=x();for(const[c,s]of e.options||[]){const r=m(document.createElement("button"));r.type="button",r.style.cssText=d,r.textContent=s,c===n&&(r.style.fontWeight="700"),r.addEventListener("click",()=>{b(t,c),v()}),o.appendChild(r)}return o})}function X(e,t){e.appendChild(h(`Effect: ${t.label}`));for(const o of t.attrs||[])e.appendChild(L(o,`${t.name}-${o.name}`));const n=m(document.createElement("button"));n.type="button",n.style.cssText=d,n.textContent="\u2715 Remove effect",n.addEventListener("click",()=>{const o={};for(const c of R(a.span.attrs,t.name))o[c]=null;M(a.textarea,a.span,o),u()}),e.appendChild(n)}function q(){const e=x(),t=a.span,n=t&&w.has(t.name)?t.name:null;for(const o of[...new Set(p.map(c=>c.category))]){const c=p.filter(s=>s.category===o);if(c.length){e.appendChild(h(o));for(const s of c){const r=n&&(s.hosts||[]).includes(n)&&t.attrs[s.name]!==!0,i=m(document.createElement("button"));if(i.type="button",i.style.cssText=d+"justify-content:space-between;",i.appendChild(document.createTextNode(s.label)),r){const l=document.createElement("span");l.textContent=`inject \u2192 [${n}]`,l.style.cssText="opacity:.6;font-size:.7rem;",i.appendChild(l)}i.addEventListener("click",()=>{if(r)g(a.textarea,a.span,s.name,!0);else{const l=s.selfClosing?`[${s.name} /]`:`[${s.name}]
|
|
2
|
+
Content
|
|
3
|
+
[/${s.name}]`;C(a.textarea,l),a.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}u()}),e.appendChild(i)}}}return e}function E(e,t){const n=m(document.createElement("button"));n.type="button",n.style.cssText=d+"justify-content:space-between;",n.appendChild(document.createTextNode(e));const o=document.createElement("span");return o.textContent="\u25B8",o.style.opacity=".6",n.appendChild(o),n.addEventListener("mouseenter",()=>S(n,t)),n.addEventListener("click",c=>{c.stopPropagation(),S(n,t)}),n}function x(){const e=document.createElement("div");return e.className="dm-sc-submenu",e.style.cssText=y,e}function S(e,t){v();const n=t();a.submenu=n,document.body.appendChild(n);const o=e.getBoundingClientRect();$(n,o.right+2,o.top,o.left-2),window.I&&I.scan(n)}function v(){a&&a.submenu&&(a.submenu.remove(),a.submenu=null)}function J(){const e=x();for(const t of D){const n=f.filter(o=>o.category===t&&!o.child);if(n.length){e.appendChild(h(t));for(const o of n){const c=m(document.createElement("button"));c.type="button",c.style.cssText=d,c.textContent=o.label,c.addEventListener("click",()=>{C(a.textarea,o.template||`[${o.name} /]`),a.textarea.dispatchEvent(new Event("input",{bubbles:!0})),u()}),e.appendChild(c)}}}return e}function Q(){const e=x(),t=f.filter(n=>n.wrappable||n.container);for(const n of t){const o=m(document.createElement("button"));o.type="button",o.style.cssText=d,o.textContent=n.label,o.addEventListener("click",()=>{Z(n),u()}),e.appendChild(o)}return e}function Z(e){const t=a.textarea,n=t.selectionStart,o=t.selectionEnd,c=t.value.slice(n,o)||"Content";let s;e.name==="grid"?s=`[grid cols="2"]
|
|
4
|
+
[col]
|
|
5
|
+
${c}
|
|
6
|
+
[/col]
|
|
7
|
+
[/grid]`:s=`[${e.name}]
|
|
8
|
+
${c}
|
|
9
|
+
[/${e.name}]`,t.value=t.value.slice(0,n)+s+t.value.slice(o),t.selectionStart=t.selectionEnd=n+s.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}function $(e,t,n,o){e.style.left="0px",e.style.top="0px";const c=e.getBoundingClientRect();let s=t;t+c.width>window.innerWidth-8&&(s=o!=null?o-c.width:t-c.width);let r=n;n+c.height>window.innerHeight-8&&(r=Math.max(8,window.innerHeight-c.height-8)),e.style.left=`${Math.max(8,s)}px`,e.style.top=`${Math.max(8,r)}px`}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
export const SHORTCODES=[{name:"card",label:"Card",category:"Layout",selfClosing:!1,container:!0,wrappable:!0,template:`[card title="Title"]
|
|
2
|
+
Content
|
|
3
|
+
[/card]`,attrs:[{name:"title",type:"text",label:"Title"},{name:"subtitle",type:"text",label:"Subtitle"},{name:"icon",type:"icon",label:"Icon"},{name:"icon-layout",type:"select",label:"Icon layout",options:[["inline","Inline"],["stacked","Stacked"]]},{name:"footer",type:"text",label:"Footer"},{name:"variant",type:"select",label:"Variant",options:[["","Default"],["primary","Primary"]]},{name:"collapsible",type:"checkbox",label:"Collapsible"},{name:"hover",type:"checkbox",label:"Hover highlight"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"grid",label:"Grid",category:"Layout",selfClosing:!1,container:!0,wrappable:!1,template:`[grid cols="2" gap="3"]
|
|
4
|
+
[col]
|
|
5
|
+
Left
|
|
6
|
+
[/col]
|
|
7
|
+
[col]
|
|
8
|
+
Right
|
|
9
|
+
[/col]
|
|
10
|
+
[/grid]`,attrs:[{name:"cols",type:"number",label:"Columns"},{name:"gap",type:"number",label:"Gap"},{name:"responsive",type:"select",label:"Responsive stacking",options:[["","On (default)"],["false","Off"]]},{name:"fullwidth",type:"checkbox",label:"Break out full-width"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"row",label:"Row",category:"Layout",selfClosing:!1,container:!0,wrappable:!1,template:`[row gap="3"]
|
|
11
|
+
[col]
|
|
12
|
+
Left
|
|
13
|
+
[/col]
|
|
14
|
+
[col]
|
|
15
|
+
Right
|
|
16
|
+
[/col]
|
|
17
|
+
[/row]`,attrs:[{name:"gap",type:"number",label:"Gap"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"},{name:"reveal",type:"checkbox",label:"Scroll reveal"},{name:"reveal-mode",type:"select",label:"Reveal mode",options:[["stagger","Stagger"],["sequence","Sequence"]]},{name:"reveal-animation",type:"select",label:"Reveal animation",options:[["slide-up","Slide up"],["slide-down","Slide down"],["slide-left","Slide left"],["slide-right","Slide right"],["fade","Fade"],["zoom","Zoom"],["flip","Flip"]]},{name:"reveal-duration",type:"number",label:"Reveal duration (ms)"},{name:"reveal-stagger",type:"number",label:"Reveal stagger (ms)"},{name:"reveal-delay",type:"number",label:"Reveal delay (ms)"},{name:"reveal-direction",type:"select",label:"Reveal direction",options:[["ltr","Left to right"],["rtl","Right to left"]]}]},{name:"col",label:"Column",category:"Layout",child:!0,selfClosing:!1,container:!0,wrappable:!0,template:`[col]
|
|
18
|
+
Content
|
|
19
|
+
[/col]`,attrs:[{name:"span",type:"number",label:"Span"},{name:"id",type:"text",label:"ID"}]},{name:"slideover",label:"Slideover",category:"Layout",selfClosing:!1,container:!0,wrappable:!0,template:`[slideover title="More information" trigger="Read more"]
|
|
20
|
+
Content
|
|
21
|
+
[/slideover]`,attrs:[{name:"title",type:"text",label:"Title"},{name:"trigger",type:"text",label:"Trigger label"},{name:"size",type:"select",label:"Size",options:[["sm","Small"],["md","Medium"],["lg","Large"]]},{name:"position",type:"select",label:"Position",options:[["right","Right"],["left","Left"]]}]},{name:"center",label:"Centre",category:"Layout",selfClosing:!1,container:!0,wrappable:!0,template:`[center]
|
|
22
|
+
Centred content
|
|
23
|
+
[/center]`,attrs:[{name:"class",type:"text",label:"CSS class"}]},{name:"spacer",label:"Spacer",category:"Layout",selfClosing:!0,container:!1,wrappable:!1,template:'[spacer size="24" /]',attrs:[{name:"size",type:"number",label:"Height (px)"},{name:"class",type:"text",label:"CSS class"}]},{name:"banner",label:"Banner",category:"Layout",selfClosing:!1,container:!0,wrappable:!0,template:`[banner type="info" title="Note"]
|
|
24
|
+
Banner content
|
|
25
|
+
[/banner]`,attrs:[{name:"type",type:"select",label:"Type",options:[["info","Info"],["success","Success"],["warning","Warning"],["danger","Danger"],["neutral","Neutral"]]},{name:"title",type:"text",label:"Title"},{name:"icon",type:"icon",label:"Icon"},{name:"dismissible",type:"checkbox",label:"Dismissible"},{name:"class",type:"text",label:"CSS class"}]},{name:"tabs",label:"Tabs",category:"Components",selfClosing:!1,container:!0,wrappable:!1,template:`[tabs]
|
|
26
|
+
[tab title="First"]First tab content.[/tab]
|
|
27
|
+
[tab title="Second"]Second tab content.[/tab]
|
|
28
|
+
[/tabs]`,attrs:[{name:"style",type:"select",label:"Style",options:[["","Underline"],["pills","Pills"],["bordered","Bordered"]]},{name:"align",type:"select",label:"Alignment",options:[["","Left"],["center","Centre"],["right","Right"]]},{name:"fade",type:"checkbox",label:"Fade panels"},{name:"id",type:"text",label:"ID"}]},{name:"tab",label:"Tab",category:"Components",child:!0,selfClosing:!1,container:!0,wrappable:!1,template:'[tab title="Tab title"]Content[/tab]',attrs:[{name:"title",type:"text",label:"Title"},{name:"icon",type:"icon",label:"Icon"}]},{name:"accordion",label:"Accordion",category:"Components",selfClosing:!1,container:!0,wrappable:!1,template:`[accordion]
|
|
29
|
+
[item title="Question 1"]Answer 1.[/item]
|
|
30
|
+
[item title="Question 2"]Answer 2.[/item]
|
|
31
|
+
[/accordion]`,attrs:[{name:"multiple",type:"checkbox",label:"Allow multiple open"},{name:"id",type:"text",label:"ID"}]},{name:"item",label:"Item",category:"Components",child:!0,selfClosing:!1,container:!0,wrappable:!1,template:'[item title="Item title"]Content[/item]',attrs:[{name:"title",type:"text",label:"Title"}]},{name:"carousel",label:"Carousel",category:"Components",selfClosing:!1,container:!0,wrappable:!1,template:`[carousel autoplay="true" interval="5000"]
|
|
32
|
+
[slide title="Slide 1" image="/media/photo.jpg"]Caption.[/slide]
|
|
33
|
+
[slide title="Slide 2"]Text-only slide.[/slide]
|
|
34
|
+
[/carousel]`,attrs:[{name:"autoplay",type:"checkbox",label:"Autoplay"},{name:"interval",type:"number",label:"Interval (ms)"},{name:"loop",type:"checkbox",label:"Loop"},{name:"animation",type:"select",label:"Animation",options:[["slide","Slide"],["fade","Fade"],["crossfade","Crossfade"]]},{name:"animation-duration",type:"number",label:"Animation duration (ms)"},{name:"animation-easing",type:"text",label:"Animation easing"},{name:"id",type:"text",label:"ID"}]},{name:"slide",label:"Slide",category:"Components",child:!0,selfClosing:!1,container:!0,wrappable:!1,template:'[slide title="Slide title" image="/media/photo.jpg"]Caption[/slide]',attrs:[{name:"title",type:"text",label:"Title"},{name:"image",type:"url",label:"Image"}]},{name:"countdown",label:"Countdown",category:"Components",selfClosing:!0,container:!1,wrappable:!1,template:'[countdown to="2026-12-31" format="DD:HH:mm:ss" /]',attrs:[{name:"to",type:"text",label:"Target date (ISO)"},{name:"duration",type:"number",label:"Duration (seconds)"},{name:"format",type:"select",label:"Format",options:[["mm:ss","mm:ss"],["HH:mm:ss","HH:mm:ss"],["DD:HH:mm:ss","DD:HH:mm:ss"]]},{name:"id",type:"text",label:"ID"}]},{name:"timeline",label:"Timeline",category:"Components",selfClosing:!1,container:!0,wrappable:!1,template:`[timeline layout="vertical" theme="modern"]
|
|
35
|
+
[event title="Launch" date="2025-01-15" status="completed"]Launched.[/event]
|
|
36
|
+
[/timeline]`,attrs:[{name:"layout",type:"select",label:"Layout",options:[["vertical","Vertical"],["centred","Centred"],["horizontal","Horizontal"]]},{name:"theme",type:"select",label:"Theme",options:[["minimal","Minimal"],["corporate","Corporate"],["modern","Modern"]]},{name:"mode",type:"select",label:"Mode",options:[["timeline","Timeline"],["roadmap","Roadmap"]]},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"event",label:"Event",category:"Components",child:!0,selfClosing:!1,container:!0,wrappable:!1,template:'[event title="Milestone" date="2025-01-15" status="completed"]Description[/event]',attrs:[{name:"title",type:"text",label:"Title"},{name:"date",type:"text",label:"Date"},{name:"status",type:"select",label:"Status",options:[["planned","Planned"],["in-progress","In progress"],["completed","Completed"],["blocked","Blocked"]]},{name:"icon",type:"icon",label:"Icon"}]},{name:"hero",label:"Hero",category:"Content",selfClosing:!1,container:!0,wrappable:!0,template:`[hero title="Welcome" tagline="Build something great" size="lg" variant="gradient-blue"]
|
|
37
|
+
Optional body content.
|
|
38
|
+
[/hero]`,attrs:[{name:"title",type:"text",label:"Title"},{name:"tagline",type:"text",label:"Tagline"},{name:"size",type:"select",label:"Size",options:[["","Default"],["sm","Small"],["lg","Large"],["full","Full"]]},{name:"variant",type:"select",label:"Variant",options:[["","None"],["dark","Dark"],["primary","Primary"],["gradient-purple","Gradient purple"],["gradient-blue","Gradient blue"],["gradient-green","Gradient green"],["gradient-sunset","Gradient sunset"],["gradient-ocean","Gradient ocean"],["gradient-rose","Gradient rose"],["gradient-forest","Gradient forest"],["gradient-night","Gradient night"]]},{name:"image",type:"url",label:"Background image"},{name:"overlay",type:"select",label:"Overlay",options:[["","None"],["light","Light"],["dark","Dark"],["darker","Darker"],["gradient","Gradient"],["gradient-reverse","Gradient reverse"]]},{name:"align",type:"select",label:"Alignment",options:[["center","Centre"],["left","Left"]]},{name:"bg",type:"colour",label:"Background colour"},{name:"color",type:"colour",label:"Background colour (alias)"},{name:"min-height",type:"text",label:"Min height"},{name:"fullwidth",type:"checkbox",label:"Break out full-width"},{name:"twinkle",type:"checkbox",label:"Twinkle particles"},{name:"twinkle-count",type:"number",label:"Twinkle count"},{name:"twinkle-colour",type:"colour",label:"Twinkle colour"},{name:"blobs",type:"checkbox",label:"Ambient blobs"},{name:"blobs-type",type:"text",label:"Blobs type"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"table",label:"Table",category:"Content",selfClosing:!1,container:!1,wrappable:!1,template:`[table striped="true"]
|
|
39
|
+
| Product | Price |
|
|
40
|
+
| ------- | ----: |
|
|
41
|
+
| Widget | $9.99 |
|
|
42
|
+
[/table]`,attrs:[{name:"striped",type:"checkbox",label:"Striped"},{name:"bordered",type:"checkbox",label:"Bordered"},{name:"compact",type:"checkbox",label:"Compact"},{name:"caption",type:"text",label:"Caption"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"badge",label:"Badge",category:"Content",selfClosing:!1,container:!1,wrappable:!1,template:'[badge variant="success"]New[/badge]',attrs:[{name:"variant",type:"select",label:"Variant",options:[["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"],["light","Light"],["dark","Dark"]]},{name:"pill",type:"checkbox",label:"Pill"},{name:"outline",type:"checkbox",label:"Outline"},{name:"size",type:"select",label:"Size",options:[["","Default"],["small","Small"],["large","Large"]]}]},{name:"text",label:"Text",category:"Content",selfClosing:!1,container:!0,wrappable:!0,template:'[text size="xl" bold color="primary"]Styled text[/text]',attrs:[{name:"size",type:"select",label:"Size",options:[["xs","XS"],["sm","Small"],["base","Base"],["lg","Large"],["xl","XL"],["2xl","2XL"],["3xl","3XL"],["4xl","4XL"]]},{name:"weight",type:"select",label:"Weight",options:[["thin","Thin"],["light","Light"],["normal","Normal"],["medium","Medium"],["semibold","Semibold"],["bold","Bold"],["extrabold","Extra bold"],["black","Black"]]},{name:"bold",type:"checkbox",label:"Bold"},{name:"italic",type:"checkbox",label:"Italic"},{name:"color",type:"colour",label:"Colour"},{name:"font",type:"select",label:"Font",options:[["Georgia","Georgia"],["Arial","Arial"],["Verdana","Verdana"],["Courier New","Courier New"],["Times New Roman","Times New Roman"],["Trebuchet MS","Trebuchet MS"]]},{name:"transform",type:"select",label:"Transform",options:[["upper","Uppercase"],["lower","Lowercase"],["capitalize","Capitalise"],["none","None"]]},{name:"decoration",type:"select",label:"Decoration",options:[["underline","Underline"],["line-through","Line through"],["none","None"]]},{name:"spacing",type:"select",label:"Letter spacing",options:[["tight","Tight"],["normal","Normal"],["wide","Wide"],["wider","Wider"]]},{name:"align",type:"select",label:"Align",options:[["","None"],["left","Left"],["center","Centre"],["right","Right"]]},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"button",label:"Button",category:"Content",selfClosing:!0,container:!1,wrappable:!1,template:'[button href="/contact" variant="primary" label="Get in touch" /]',attrs:[{name:"href",type:"url",label:"Link"},{name:"label",type:"text",label:"Label"},{name:"variant",type:"select",label:"Variant",options:[["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"],["outline","Outline"],["ghost","Ghost"],["link","Link"],["outline-success","Outline success"],["outline-danger","Outline danger"],["outline-warning","Outline warning"],["outline-info","Outline info"]]},{name:"size",type:"select",label:"Size",options:[["","Default"],["sm","Small"],["lg","Large"]]},{name:"icon",type:"icon",label:"Icon (before)"},{name:"icon-after",type:"icon",label:"Icon (after)"},{name:"target",type:"text",label:"Target"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"link",label:"Link",category:"Content",selfClosing:!0,container:!1,wrappable:!1,template:'[link href="/about" label="About us" /]',attrs:[{name:"href",type:"url",label:"Link"},{name:"label",type:"text",label:"Label"},{name:"target",type:"text",label:"Target"},{name:"class",type:"text",label:"CSS class"},{name:"icon",type:"icon",label:"Icon (before)"},{name:"icon-after",type:"icon",label:"Icon (after)"},{name:"id",type:"text",label:"ID"}]},{name:"listgroup",label:"List group",category:"Content",selfClosing:!1,container:!0,wrappable:!1,template:`[listgroup]
|
|
43
|
+
[item]First item[/item]
|
|
44
|
+
[item]Second item[/item]
|
|
45
|
+
[/listgroup]`,attrs:[{name:"variant",type:"select",label:"Variant",options:[["","Default"],["flush","Flush"],["numbered","Numbered"],["horizontal","Horizontal"]]},{name:"size",type:"select",label:"Size",options:[["","Default"],["sm","Small"],["lg","Large"]]},{name:"itemvariant",type:"select",label:"Item variant",options:[["","Default"],["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"]]},{name:"action",type:"checkbox",label:"Actionable items"}]},{name:"collection",label:"Collection",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[collection slug="enquiries" display="table" /]',attrs:[{name:"slug",type:"text",label:"Collection slug"},{name:"display",type:"select",label:"Display",options:[["table","Table"],["cards","Cards"],["list","List"],["accordion","Accordion"],["timeline","Timeline"],["block","Block"]]},{name:"fields",type:"text",label:"Fields (comma-separated)"},{name:"limit",type:"number",label:"Limit"},{name:"sort",type:"text",label:"Sort field"},{name:"order",type:"select",label:"Order",options:[["desc","Descending"],["asc","Ascending"]]},{name:"title-field",type:"text",label:"Title field"},{name:"columns",type:"number",label:"Card columns"},{name:"search",type:"checkbox",label:"Search (table)"},{name:"sortable",type:"checkbox",label:"Sortable (table)"},{name:"exportable",type:"checkbox",label:"CSV export"},{name:"page-size",type:"number",label:"Page size"},{name:"empty",type:"text",label:"Empty message"},{name:"scope",type:"select",label:"Scope",options:[["","All"],["mine","Current user"]]},{name:"cta",type:"text",label:"CTA action slug"},{name:"cta-label",type:"text",label:"CTA label"},{name:"cta-icon",type:"icon",label:"CTA icon"},{name:"cta-style",type:"select",label:"CTA style",options:[["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"]]},{name:"cta-confirm",type:"text",label:"CTA confirm text"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"view",label:"View",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[view slug="products" display="table" limit="50" /]',attrs:[{name:"slug",type:"text",label:"View slug"},{name:"display",type:"select",label:"Display",options:[["table","Table"],["cards","Cards"],["list","List"],["accordion","Accordion"],["timeline","Timeline"],["block","Block"]]},{name:"limit",type:"number",label:"Limit"},{name:"fields",type:"text",label:"Fields (comma-separated)"},{name:"title-field",type:"text",label:"Title field"},{name:"columns",type:"number",label:"Card columns"},{name:"empty",type:"text",label:"Empty message"}]},{name:"block",label:"Block",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[block template="post-card" title="My Post" /]',attrs:[{name:"template",type:"text",label:"Template name"}]},{name:"form",label:"Form",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[form name="contact" /]',attrs:[{name:"name",type:"text",label:"Form slug"},{name:"class",type:"text",label:"CSS class"},{name:"id",type:"text",label:"ID"}]},{name:"cta",label:"CTA",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[cta action="send-welcome" entry="abc123" style="primary" label="Send" /]',attrs:[{name:"action",type:"text",label:"Action slug"},{name:"entry",type:"text",label:"Entry ID"},{name:"style",type:"select",label:"Style",options:[["primary","Primary"],["secondary","Secondary"],["success","Success"],["danger","Danger"],["warning","Warning"],["info","Info"]]},{name:"icon",type:"icon",label:"Icon"},{name:"size",type:"select",label:"Size",options:[["","Default"],["sm","Small"],["lg","Large"]]},{name:"confirm",type:"text",label:"Confirm text"},{name:"label",type:"text",label:"Label"}]},{name:"menu",label:"Menu",category:"Data",selfClosing:!0,container:!1,wrappable:!1,template:'[menu slug="legal" /]',attrs:[{name:"slug",type:"text",label:"Menu slug"},{name:"location",type:"text",label:"Location slot"},{name:"variant",type:"text",label:"Variant"},{name:"class",type:"text",label:"CSS class"},{name:"depth",type:"number",label:"Max depth"}]},{name:"icon",label:"Icon",category:"Media",selfClosing:!0,container:!1,wrappable:!1,template:'[icon name="arrow-right" /]',attrs:[{name:"name",type:"icon",label:"Icon name"},{name:"size",type:"number",label:"Size (px)"},{name:"color",type:"colour",label:"Colour"},{name:"class",type:"text",label:"CSS class"}]},{name:"embed",label:"Embed",category:"Media",selfClosing:!0,container:!1,wrappable:!1,template:'[embed url="https://youtu.be/dQw4w9WgXcQ" /]',attrs:[{name:"url",type:"url",label:"URL"},{name:"ratio",type:"select",label:"Aspect ratio",options:[["16:9","16:9"],["4:3","4:3"],["1:1","1:1"],["21:9","21:9"],["9:16","9:16"],["3:4","3:4"]]},{name:"title",type:"text",label:"Title / caption"},{name:"width",type:"text",label:"Width"},{name:"align",type:"select",label:"Alignment",options:[["left","Left"],["center","Centre"],["right","Right"]]},{name:"autoplay",type:"checkbox",label:"Autoplay"},{name:"loop",type:"checkbox",label:"Loop"},{name:"muted",type:"checkbox",label:"Muted"}]}];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export function parseAttrs(s){const e=String(s??""),o={};for(const[,i,c,n]of e.matchAll(/([\w-]+)=(?:"([^"]*)"|'([^']*)')/g))o[i]=c??n??"";const r=e.replace(/([\w-]+)=(?:"[^"]*"|'[^']*')/g,i=>" ".repeat(i.length));for(const[,i]of r.matchAll(/\b([\w-]+)\b/g))i in o||(o[i]=!0);return o}export function serialiseTag(s,e,o){const r=[];for(const[c,n]of Object.entries(e))if(n===!0)r.push(c);else{if(n===!1||n===null||n===void 0||n==="")continue;r.push(`${c}="${String(n).replace(/"/g,""")}"`)}const i=r.length?` ${r.join(" ")}`:"";return o?`[${s}${i} /]`:`[${s}${i}]`}function a(s,e,o,r){const i=s.slice(e,o),c=/\/\s*\]$/.test(i),n=i.match(new RegExp(`^\\[${r}([\\s\\S]*?)\\s*/?\\]$`)),t=n?n[1]:"";return{name:r,openTagStart:e,openTagEnd:o,attrStr:t,attrs:parseAttrs(t),selfClosing:c}}function u(s,e,o){const r=new RegExp(`\\[${o}(?=[\\s\\]/])([^\\]]*)\\]`,"g"),i=new RegExp(`\\[/${o}\\]`,"g"),c=[];for(const l of s.matchAll(r)){if(l.index>=e)break;c.push({type:"open",start:l.index,end:l.index+l[0].length})}for(const l of s.matchAll(i)){if(l.index>=e)break;c.push({type:"close",start:l.index})}c.sort((l,f)=>l.start-f.start);let n=0,t=null;for(const l of c)l.type==="open"?(n++,t=l):(n--,n<0&&(n=0,t=null));return n>0&&t&&new RegExp(`\\[/${o}\\]`).test(s.slice(e))?{start:t.start,end:t.end}:null}export function findEnclosingShortcode(s,e){const o=s.value,r=s.selectionStart,i=new Map(e.map(t=>[t.name,t]));let c=null;for(const t of o.matchAll(/\[(\/)?([a-zA-Z][\w-]*)((?:[^\]]*?))\]/g)){const l=t.index,f=l+t[0].length;r<l||r>f||i.has(t[2])&&(c={name:t[2],start:l,end:f,close:!!t[1]})}if(c)if(c.close){const t=u(o,c.start,c.name);if(t)return a(o,t.start,t.end,c.name)}else return a(o,c.start,c.end,c.name);let n=null;for(const t of e){if(t.selfClosing)continue;const l=u(o,r,t.name);l&&(!n||l.start>n.start)&&(n={...l,name:t.name})}return n?a(o,n.start,n.end,n.name):null}export function setAttr(s,e,o,r){return setAttrs(s,e,{[o]:r})}export function setAttrs(s,e,o){const r={...e.attrs};for(const[n,t]of Object.entries(o))t===!1||t===null||t===void 0||t===""?delete r[n]:r[n]=t;const i=serialiseTag(e.name,r,e.selfClosing);s.value=s.value.slice(0,e.openTagStart)+i+s.value.slice(e.openTagEnd);const c=e.openTagStart+i.length;return s.selectionStart=s.selectionEnd=c,s.dispatchEvent(new Event("input",{bubbles:!0})),a(s.value,e.openTagStart,c,e.name)}export function effectAttrKeys(s,e){const o=`${e}-`;return Object.keys(s).filter(r=>r===e||r.startsWith(o))}
|