domma-cms 0.13.5 → 0.14.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/admin/css/admin.css +1 -1
- package/admin/js/api.js +1 -1
- package/admin/js/app.js +2 -2
- package/admin/js/config/sidebar-config.js +1 -1
- package/admin/js/lib/markdown-toolbar.js +24 -18
- package/admin/js/lib/scribe-composer.js +4 -0
- package/admin/js/lib/simple-editor.js +49 -0
- package/admin/js/templates/block-editor.html +76 -18
- package/admin/js/templates/blocks.html +18 -8
- package/admin/js/templates/component-editor.html +141 -0
- package/admin/js/templates/components.html +18 -0
- package/admin/js/views/block-editor-enhance.js +1 -0
- package/admin/js/views/block-editor.js +8 -8
- package/admin/js/views/blocks.js +11 -4
- package/admin/js/views/component-editor.js +28 -0
- package/admin/js/views/components.js +11 -0
- package/admin/js/views/index.js +1 -1
- package/admin/js/views/layouts.js +1 -1
- package/admin/js/views/page-editor.js +6 -6
- package/admin/js/views/pages.js +5 -2
- package/config/navigation.json +5 -0
- package/config/plugins.json +5 -5
- package/config/presets.json +92 -40
- package/config/site.json +75 -8
- package/package.json +2 -2
- package/public/css/site.css +1 -1
- package/server/routes/api/blocks.js +128 -60
- package/server/routes/api/components.js +115 -0
- package/server/routes/api/layouts.js +24 -0
- package/server/routes/api/pages.js +135 -132
- package/server/routes/api/versions.js +16 -0
- package/server/server.js +6 -0
- package/server/services/blocks.js +387 -284
- package/server/services/components.js +653 -0
- package/server/services/content.js +334 -334
- package/server/services/hooks.js +28 -0
- package/server/services/markdown.js +2836 -2629
- package/server/services/permissionRegistry.js +13 -0
- package/server/services/renderer.js +13 -3
- package/server/services/versions.js +37 -0
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
function
|
|
2
|
-
`,i-1)+1,o=t.value.substring(
|
|
3
|
-
`,t.selectionStart-1)+1,
|
|
4
|
-
`,t.selectionStart),o=
|
|
1
|
+
function se(){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("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"})}export function wrapSelection(t,e,p){const i=t.selectionStart,l=t.selectionEnd,o=t.value,s=o.substring(i,l);s?(t.value=o.substring(0,i)+e+s+p+o.substring(l),t.selectionStart=i+e.length,t.selectionEnd=l+e.length):(t.value=o.substring(0,i)+e+p+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 p=t.selectionStart,i=t.value;t.value=i.substring(0,p)+e+i.substring(p),t.selectionStart=t.selectionEnd=p+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 l=t.value.lastIndexOf(`
|
|
2
|
+
`,i-1)+1,o=t.value.substring(l).match(/^ {1,2}/);o&&(t.value=t.value.substring(0,l)+t.value.substring(l+o[0].length),t.selectionStart=t.selectionEnd=Math.max(l,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 p=e.key.toLowerCase();if(p==="z")e.preventDefault(),document.execCommand("undo"),E.toast("Undo",{type:"info",duration:1200});else if(p==="y")e.preventDefault(),document.execCommand("redo"),E.toast("Redo",{type:"info",duration:1200});else if(p==="x"&&t.selectionStart===t.selectionEnd){e.preventDefault();const i=t.value.lastIndexOf(`
|
|
3
|
+
`,t.selectionStart-1)+1,l=t.value.indexOf(`
|
|
4
|
+
`,t.selectionStart),o=l===-1?t.value.length:l+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(p==="c"&&t.selectionStart===t.selectionEnd){e.preventDefault();const i=t.selectionStart,l=t.value.lastIndexOf(`
|
|
5
5
|
`,i-1)+1,o=t.value.indexOf(`
|
|
6
|
-
`,i),
|
|
7
|
-
`,
|
|
8
|
-
`,
|
|
6
|
+
`,i),s=o===-1?t.value.length:o+1;t.setSelectionRange(l,s),document.execCommand("copy"),t.setSelectionRange(i,i),E.toast("Line copied",{type:"info",duration:1200})}})}export function insertLine(t,e){const p=t.selectionStart,i=t.value,l=i.lastIndexOf(`
|
|
7
|
+
`,p-1)+1,o=i.indexOf(`
|
|
8
|
+
`,l),s=i.substring(l,o===-1?i.length:o);if(s.startsWith(e)){const r=o===-1?"":i.substring(o);t.value=i.substring(0,l)+s.substring(e.length)+r,t.selectionStart=t.selectionEnd=Math.max(l,p-e.length)}else t.value=i.substring(0,l)+e+i.substring(l),t.selectionStart=t.selectionEnd=p+e.length;t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}const le=[{category:"Entrance"},{label:"Reveal (fade)",snippet:t=>`[reveal animation="fade"]
|
|
9
9
|
${t||"Content"}
|
|
10
10
|
[/reveal]`},{label:"Reveal (slide up)",snippet:t=>`[reveal animation="slide-up"]
|
|
11
11
|
${t||"Content"}
|
|
@@ -34,12 +34,12 @@ ${t||"Content"}
|
|
|
34
34
|
[/firework]`},{label:"Fireworks show",snippet:()=>`[fireworks]
|
|
35
35
|
[firework type="burst" colour="rainbow" /]
|
|
36
36
|
[firework type="sparkle" colour="primary" /]
|
|
37
|
-
[/fireworks]`,insert:!0},{label:"Celebrate",snippet:()=>'[celebrate theme="auto" intensity="medium" /]',insert:!0}];function
|
|
38
|
-
`)});const n=e.getBoundingClientRect(),
|
|
39
|
-
${e.value.substring(
|
|
40
|
-
[/card]`;e.value=e.value.substring(0,
|
|
41
|
-
${e.value.substring(
|
|
42
|
-
[/hero]`;e.value=e.value.substring(0,
|
|
37
|
+
[/fireworks]`,insert:!0},{label:"Celebrate",snippet:()=>'[celebrate theme="auto" intensity="medium" /]',insert:!0}];function ce(t,e){const p=document.querySelector(".editor-effects-dropdown-menu");if(p){p.remove();return}const i=document.createElement("div");i.className="editor-effects-dropdown-menu",le.forEach(function(r){if(r.category){const a=document.createElement("div");a.className="editor-effects-category",a.textContent=r.category,i.appendChild(a)}else{const a=document.createElement("button");a.type="button",a.className="editor-effects-item",a.textContent=r.label,a.addEventListener("click",function(){if(i.remove(),r.insert)insertAtCursor(t,r.snippet(""));else{const d=t.selectionStart,h=t.selectionEnd,n=t.value.substring(d,h),c=r.snippet(n);t.value=t.value.substring(0,d)+c+t.value.substring(h),t.selectionStart=d,t.selectionEnd=d+c.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()}}),i.appendChild(a)}});const l=e.getBoundingClientRect(),o=e.closest(".editor-toolbar").getBoundingClientRect();i.style.top=l.bottom-o.top+4+"px",i.style.left=l.left-o.left+"px",e.closest(".editor-toolbar").appendChild(i);function s(r){!i.contains(r.target)&&r.target!==e&&(i.remove(),document.removeEventListener("click",s,!0))}setTimeout(function(){document.addEventListener("click",s,!0)},0)}const J=["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 ae(t,e,p){const i=document.querySelector(".editor-spacer-picker");if(i){i.remove();return}const l=document.createElement("div");l.className="editor-spacer-picker";const o=document.createElement("div");o.className="editor-spacer-picker-label",o.textContent="Spacer height",l.appendChild(o);const s=document.createElement("div");s.className="editor-spacer-picker-row";const r=document.createElement("input");r.type="range",r.className="editor-spacer-slider",r.min="4",r.max="200",r.step="4",r.value=p;const a=document.createElement("span");a.className="editor-spacer-slider-value",a.textContent=p+"px",r.addEventListener("input",function(){a.textContent=this.value+"px"}),s.appendChild(r),s.appendChild(a),l.appendChild(s);const d=document.createElement("button");d.type="button",d.className="btn btn-primary btn-sm editor-spacer-insert-btn",d.textContent="Insert",l.appendChild(d);function h(k){!l.contains(k.target)&&k.target!==e&&(l.remove(),document.removeEventListener("click",h,!0))}d.addEventListener("click",function(){l.remove(),document.removeEventListener("click",h,!0),insertAtCursor(t,`[spacer size="${r.value}" /]
|
|
38
|
+
`)});const n=e.getBoundingClientRect(),c=e.closest(".editor-toolbar").getBoundingClientRect();l.style.top=n.bottom-c.top+4+"px";const u=n.left-c.left;l.style.left=Math.min(u,c.width-240-8)+"px",e.closest(".editor-toolbar").appendChild(l),setTimeout(function(){document.addEventListener("click",h,!0)},0)}function de(t,e){const p=document.querySelector(".editor-icon-picker");if(p){p.remove();return}const i=document.createElement("div");i.className="editor-icon-picker";const l=document.createElement("input");l.type="text",l.className="form-input editor-icon-picker-search",l.placeholder="Search icons\u2026",i.appendChild(l);const o=document.createElement("div");o.className="editor-icon-picker-size-row";const s=document.createElement("label");s.textContent="Size (px)";const r=document.createElement("input");r.type="number",r.className="form-input editor-icon-picker-size",r.placeholder="default",r.min="8",r.max="256",o.appendChild(s),o.appendChild(r),i.appendChild(o);const a=document.createElement("div");a.className="editor-icon-picker-grid",i.appendChild(a);function d(C){!i.contains(C.target)&&C.target!==e&&(i.remove(),document.removeEventListener("click",d,!0))}function h(C){a.textContent="";const x=C?J.filter(S=>S.includes(C.toLowerCase())):J;if(x.length===0){const S=document.createElement("div");S.className="editor-icon-picker-empty",S.textContent="No icons found",a.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 b=document.createElement("span");b.textContent=S,M.appendChild(v),M.appendChild(b),M.addEventListener("click",function(){i.remove(),document.removeEventListener("click",d,!0);const w=r.value.trim(),L=w?`[icon name="${S}" size="${w}" /]`:`[icon name="${S}" /]`;insertAtCursor(t,L)}),a.appendChild(M)}),Domma.icons.scan(a)}h(""),l.addEventListener("input",function(){h(this.value.trim())});const n=e.getBoundingClientRect(),c=e.closest(".editor-toolbar").getBoundingClientRect();i.style.top=n.bottom-c.top+4+"px";const u=n.left-c.left,k=320,y=c.width;i.style.left=Math.min(u,y-k-8)+"px",e.closest(".editor-toolbar").appendChild(i),requestAnimationFrame(function(){l.focus()}),setTimeout(function(){document.addEventListener("click",d,!0)},0)}function ue(t,e,p,i){const l=document.querySelector(".editor-toolbar-dropdown");if(l){l.remove();return}const o=document.createElement("div");o.className="editor-toolbar-dropdown",p.forEach(function(h){const n=document.createElement("button");if(n.type="button",n.className="editor-toolbar-dropdown-item",h.icon){const u=document.createElement("span");u.setAttribute("data-icon",h.icon),n.appendChild(u)}const c=document.createElement("span");c.textContent=h.label,n.appendChild(c),n.addEventListener("click",function(){o.remove(),document.removeEventListener("click",d,!0),U(h.action,t,e,i)}),o.appendChild(n)});const s=e.getBoundingClientRect(),r=e.closest(".editor-toolbar").getBoundingClientRect();o.style.top=s.bottom-r.top+4+"px";const a=s.left-r.left;o.style.left=Math.min(a,r.width-180-8)+"px",e.closest(".editor-toolbar").appendChild(o),Domma.icons.scan(o);function d(h){!o.contains(h.target)&&h.target!==e&&(o.remove(),document.removeEventListener("click",d,!0))}setTimeout(function(){document.addEventListener("click",d,!0)},0)}function U(t,e,p,i){const{spacerDefault:l,handlers:o}=i;if(typeof t=="function")t(e);else if(t==="block")if(o.block)o.block(e);else{const s=e.selectionStart,r='[block template="" /]';e.value=e.value.substring(0,s)+r+e.value.substring(s),e.selectionStart=e.selectionEnd=s+17,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="component")o.component?o.component(e):pe(e);else if(t==="button")if(o.button)o.button(e);else{const s=e.selectionStart,r=e.selectionEnd,d=`[button href="" variant="primary"]${e.value.substring(s,r)||"Click me"}[/button]`;e.value=e.value.substring(0,s)+d+e.value.substring(r),e.selectionStart=e.selectionEnd=s+14,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="linksc")if(o.linksc)o.linksc(e);else{const s=e.selectionStart,r=e.selectionEnd,d=`[link href=""]${e.value.substring(s,r)||"Link text"}[/link]`;e.value=e.value.substring(0,s)+d+e.value.substring(r),e.selectionStart=e.selectionEnd=s+12,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="colourpick"){const s=e.selectionStart;document.getElementById("dm-colour-overlay")?.remove();const r=document.createElement("div");r.id="dm-colour-overlay",r.style.cssText="position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);";const a=document.createElement("div");a.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 h=document.createElement("input");h.type="color",h.value="#000000",h.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 u=document.createElement("button");u.type="button",u.className="btn btn-ghost btn-sm",u.textContent="Copy";const k=document.createElement("button");k.type="button",k.className="btn btn-primary btn-sm",k.textContent="Insert";const y=()=>r.remove();h.addEventListener("input",()=>{c.value=h.value}),c.addEventListener("input",()=>{/^#[0-9a-f]{6}$/i.test(c.value)&&(h.value=c.value)}),u.addEventListener("click",()=>{const C=document.createElement("input");C.value=c.value,document.body.appendChild(C),C.select(),document.execCommand("copy"),C.remove(),u.textContent="Copied!",setTimeout(()=>{u.textContent="Copy"},1500)}),k.addEventListener("click",()=>{e.selectionStart=e.selectionEnd=s,insertAtCursor(e,c.value),y()}),r.addEventListener("click",C=>{C.target===r&&y()}),n.appendChild(c),n.appendChild(u),n.appendChild(k),a.appendChild(d),a.appendChild(h),a.appendChild(n),r.appendChild(a),document.body.appendChild(r)}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 s=e.selectionStart,r=e.selectionEnd,d=`[card title="Card Title"]
|
|
39
|
+
${e.value.substring(s,r)||"Content here"}
|
|
40
|
+
[/card]`;e.value=e.value.substring(0,s)+d+e.value.substring(r),e.selectionStart=s+13,e.selectionEnd=s+23,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="hero")if(o.hero)o.hero(e);else{const s=e.selectionStart,r=e.selectionEnd,d=`[hero title="Hero Title" tagline="A short tagline" size="lg"]
|
|
41
|
+
${e.value.substring(s,r)||"Optional body content here."}
|
|
42
|
+
[/hero]`;e.value=e.value.substring(0,s)+d+e.value.substring(r),e.selectionStart=e.selectionEnd=s+d.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="grid")if(o.grid)o.grid(e);else{const s=e.selectionStart,r=`[grid cols="2" gap="4"]
|
|
43
43
|
[col]
|
|
44
44
|
Column 1
|
|
45
45
|
[/col]
|
|
@@ -47,7 +47,7 @@ Column 1
|
|
|
47
47
|
Column 2
|
|
48
48
|
[/col]
|
|
49
49
|
[/grid]
|
|
50
|
-
`;e.value=e.value.substring(0,
|
|
50
|
+
`;e.value=e.value.substring(0,s)+r+e.value.substring(s),e.selectionStart=e.selectionEnd=s+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="badge"){const s=e.selectionStart,r=e.selectionEnd,d=`[badge variant="primary"]${e.value.substring(s,r)||"New"}[/badge]`;e.value=e.value.substring(0,s)+d+e.value.substring(r),e.selectionStart=s+16,e.selectionEnd=s+23,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="timeline"){const s=e.selectionStart,r=`[timeline layout="vertical"]
|
|
51
51
|
[event title="First Event" date="${new Date().toISOString().slice(0,10)}" status="completed"]
|
|
52
52
|
Describe this event.
|
|
53
53
|
[/event]
|
|
@@ -55,15 +55,21 @@ Describe this event.
|
|
|
55
55
|
Describe this event.
|
|
56
56
|
[/event]
|
|
57
57
|
[/timeline]
|
|
58
|
-
`;e.value=e.value.substring(0,
|
|
58
|
+
`;e.value=e.value.substring(0,s)+r+e.value.substring(s),e.selectionStart=e.selectionEnd=s+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="effects")o.effects?o.effects(e):ce(e,p);else if(t==="spacerpick")ae(e,p,l);else if(t==="iconpick")de(e,p);else if(t==="listgroup")o.listgroup?o.listgroup(e):insertAtCursor(e,`[listgroup]
|
|
59
59
|
[item]Item 1[/item]
|
|
60
60
|
[item]Item 2[/item]
|
|
61
61
|
[item]Item 3[/item]
|
|
62
62
|
[/listgroup]
|
|
63
|
-
`);else if(t==="collection")o.collection?o.collection(e):insertAtCursor(e,'[collection slug="" display="table" /]');else if(t==="view")o.view&&o.view(e);else if(t==="cta")o.cta&&o.cta(e);else if(t==="form")o.form?o.form(e):insertAtCursor(e,'[form slug="" /]');else if(t==="tabs")o.tabs&&o.tabs(e);else if(t==="banner")o.banner&&o.banner(e);else if(t==="
|
|
63
|
+
`);else if(t==="collection")o.collection?o.collection(e):insertAtCursor(e,'[collection slug="" display="table" /]');else if(t==="view")o.view&&o.view(e);else if(t==="cta")o.cta&&o.cta(e);else if(t==="form")o.form?o.form(e):insertAtCursor(e,'[form slug="" /]');else if(t==="tabs")o.tabs&&o.tabs(e);else if(t==="banner")o.banner&&o.banner(e);else if(t==="scribe")if(o.scribe)o.scribe(e);else{const s=e.selectionStart,r=`[scribe]
|
|
64
|
+
[render]Type text here.[/render]
|
|
65
|
+
[wait]1500[/wait]
|
|
66
|
+
[undo all="true" /]
|
|
67
|
+
[render]More text.[/render]
|
|
68
|
+
[/scribe]
|
|
69
|
+
`;e.value=e.value.substring(0,s)+r+e.value.substring(s),e.selectionStart=e.selectionEnd=s+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="accordion")if(o.accordion)o.accordion(e);else{const s=e.selectionStart,r=`[accordion]
|
|
64
70
|
[item title="Item 1"]Content here.[/item]
|
|
65
71
|
[item title="Item 2"]Content here.[/item]
|
|
66
72
|
[/accordion]
|
|
67
|
-
`;e.value=e.value.substring(0,
|
|
73
|
+
`;e.value=e.value.substring(0,s)+r+e.value.substring(s),e.selectionStart=e.selectionEnd=s+r.length,e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()}else if(t==="text"){let n=function(f,m){const g=document.createElement("div"),N=document.createElement("label");return N.style.cssText=d,N.textContent=f,g.appendChild(N),g.appendChild(m),g},c=function(f){const m=document.createElement("select");return m.style.cssText=h,[["","\u2014 default \u2014"],...f].forEach(([g,N])=>{const O=document.createElement("option");O.value=g,O.textContent=N,m.appendChild(O)}),m},u=function(f,m){const g=document.createElement("input");return g.type="text",g.placeholder=f||"",g.value=m||"",g.style.cssText=h,g},k=function(f){const m=document.createElement("label");m.style.cssText="display:flex;align-items:center;gap:.5rem;cursor:pointer;";const g=document.createElement("input");g.type="checkbox";const N=document.createElement("span");return N.style.cssText="font-size:.85em;color:var(--dm-text,#eee);",N.textContent=f,m.appendChild(g),m.appendChild(N),{wrap:m,cb:g}},y=function(f,m){const g=document.createElement("div");return g.style.cssText="display:grid;grid-template-columns:1fr 1fr;gap:.5rem;",g.appendChild(f),g.appendChild(m),g},C=function(f){const m=document.createElement("div");return m.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;",m.textContent=f,m},F=function(){const f=[];M.value&&f.push(`font-size:${ee[M.value]||M.value}`);const m=parseFloat(v.value);!isNaN(m)&&m>0&&f.push(`font-size:${m}pt`),L.checked?f.push("font-weight:700"):b.value&&f.push(`font-weight:${te[b.value]||b.value}`),T.checked&&f.push("font-style:italic");const g=B.value.trim();g&&f.push(`color:${Y[g]||g}`),A.value&&f.push(`font-family:${oe[A.value]}`),R.value&&f.push(`text-transform:${ie[R.value]}`),P.value&&f.push(`text-decoration:${re[P.value]}`),W.value&&f.push(`letter-spacing:${ne[W.value]}`),H.value&&(f.push("display:block"),f.push(`text-align:${H.value}`)),V.value.trim()&&f.push(V.value.trim()),q.style.cssText=f.join(";"),q.textContent=S.value||"Preview text"};const s=e.selectionStart,r=e.selectionEnd,a=e.value.substring(s,r)||"",d="display:block;font-size:.7rem;font-weight:600;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;",h="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=u("Text to style\u2026",a);x.appendChild(n("Content",S)),x.appendChild(C("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=u("pt value (overrides Size)");x.appendChild(y(n("Size",M),n("Point Size (pt)",v)));const b=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:w,cb:L}=k("Bold (overrides Weight)"),{wrap:z,cb:T}=k("Italic"),j=document.createElement("div");j.style.cssText="display:flex;flex-direction:column;gap:.4rem;justify-content:flex-end;",j.appendChild(w),j.appendChild(z),x.appendChild(y(n("Weight",b),j)),x.appendChild(C("Appearance"));const B=u("e.g. primary, #ff0000"),A=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",A))),x.appendChild(C("Formatting"));const R=c([["upper","Uppercase"],["lower","Lowercase"],["capitalize","Capitalise"],["none","None"]]),P=c([["underline","Underline"],["line-through","Line-through"],["none","None"]]);x.appendChild(y(n("Transform",R),n("Decoration",P)));const W=c([["tight","Tight"],["normal","Normal"],["wide","Wide"],["wider","Wider"]]),H=c([["left","Left"],["center","Centre"],["right","Right"],["justify","Justify"]]);x.appendChild(y(n("Spacing",W),n("Align",H))),x.appendChild(C("Advanced"));const V=u("e.g. margin-top:1rem;display:block");x.appendChild(n("Style",V));const _=u("CSS class(es)"),G=u("ID");x.appendChild(y(n("Class",_),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=a||"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",()=>{b.disabled=L.checked,L.checked&&(b.value=""),F()}),[M,b,A,R,P,W,H].forEach(f=>{f.addEventListener("change",F)}),[B,S,V,v].forEach(f=>{f.addEventListener("input",F)}),T.addEventListener("change",F);const D=document.createElement("button");D.type="button",D.className="btn btn-primary",D.textContent="Insert",x.appendChild(D);const Z=E.modal({title:"Style Text",size:"md"});Z.element.appendChild(x),Z.open(),D.addEventListener("click",()=>{const f=S.value;if(!f.trim())return;const m=[];M.value&&m.push(`size="${M.value}"`);const g=parseFloat(v.value);!isNaN(g)&&g>0&&m.push(`point-size="${g}"`),L.checked?m.push("bold"):b.value&&m.push(`weight="${b.value}"`),T.checked&&m.push("italic"),B.value.trim()&&m.push(`color="${B.value.trim()}"`),A.value&&m.push(`font="${A.value}"`),R.value&&m.push(`transform="${R.value}"`),P.value&&m.push(`decoration="${P.value}"`),W.value&&m.push(`spacing="${W.value}"`),H.value&&m.push(`align="${H.value}"`),V.value.trim()&&m.push(`style="${V.value.trim().replace(/"/g,""")}"`),_.value.trim()&&m.push(`class="${_.value.trim()}"`),G.value.trim()&&m.push(`id="${G.value.trim()}"`);const O=`[text${m.length?" "+m.join(" "):""}]${f}[/text]`;Z.close(),insertAtCursor(e,O),e.dispatchEvent(new Event("input",{bubbles:!0})),e.focus()})}else t==="help"&&o.help&&o.help(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,`
|
|
68
74
|
---
|
|
69
|
-
`)}]},"|",{type:"dropdown",icon:"code-inline",title:"Code",items:[{label:"Inline code",icon:"code-inline",action:t=>wrapSelection(t,"`","`")},{label:"Code block",icon:"code-block",action:t=>wrapSelection(t,"\n```\n","\n```\n")}]},"|",{type:"dropdown",icon:"plus-circle",title:"Insert",items:[{label:"Accordion",icon:"accordion-insert",action:"accordion"},{label:"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:"Colour Picker",icon:"colour-picker",action:"colourpick"},{label:"Collection",icon:"database",action:"collection"},{label:"CTA Button",icon:"mouse-pointer",action:"cta"},{label:"Form",icon:"file-text",action:"form"},{label:"Grid",icon:"columns",action:"grid"},{label:"Hero",icon:"hero",action:"hero"},{label:"Icon",icon:"icon-pick",action:"iconpick"},{label:"Image",icon:"image-add",action:"image"},{label:"Link",icon:"link-shortcode",action:"linksc"},{label:"List Group",icon:"list",action:"listgroup"},{label:"Spacer",icon:"spacer-insert",action:"spacerpick"},{label:"Tabs",icon:"layout-list",action:"tabs"},{label:"Text",icon:"text-style",action:"text"},{label:"Timeline",icon:"activity",action:"timeline"},{label:"View",icon:"eye",action:"view"}]},"|",{icon:"sparkles",title:"Effects",action:"effects"},{icon:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,h={}){re();const i={link:null,image:null,card:null,grid:null,help:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null,hero:null,banner:null},c=h.spacerDefault??40,o=t.get(0),l=e.get(0);l.textContent="",J.forEach((n,s)=>{if(n==="|"){const p=document.createElement("span");p.className="editor-toolbar-sep",l.appendChild(p)}else{const p=document.createElement("button");p.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",p.setAttribute("data-tooltip",n.title),p.setAttribute("data-idx",String(s)),p.type="button";const v=document.createElement("span");if(v.setAttribute("data-icon",n.icon),p.appendChild(v),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",p.appendChild(y)}l.appendChild(p)}});const r=document.createElement("div");r.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const s=document.createElement("button");s.className="editor-view-btn"+(n.active?" active":""),s.setAttribute("data-mode",n.mode),s.setAttribute("data-tooltip",n.label),s.type="button";const p=document.createElement("span");p.setAttribute("data-icon",n.icon),s.appendChild(p),r.appendChild(s)});const d=document.createElement("span");d.className="editor-toolbar-sep",r.appendChild(d);const a=document.createElement("button");a.id="fullscreen-btn",a.className="editor-toolbar-btn",a.setAttribute("data-tooltip","Toggle fullscreen"),a.type="button";const b=document.createElement("span");return b.setAttribute("data-icon","expand"),a.appendChild(b),r.appendChild(a),l.appendChild(r),Domma.icons.scan(),l.querySelectorAll("[data-tooltip]").forEach(n=>{E.tooltip(n,{content:n.getAttribute("data-tooltip"),position:"top"})}),e.on("click",".editor-toolbar-btn[data-idx]",function(){const n=parseInt($(this).data("idx"),10),s=J[n];if(!s||s==="|")return;const p=e.get(0).querySelector(`[data-idx="${n}"]`),v={spacerDefault:c,handlers:i};s.type==="dropdown"?de(o,p,s.items,v):U(s.action,o,p,v)}),attachEditorKeybindings(o),o.addEventListener("keydown",n=>{const s=n.key.toLowerCase();(n.ctrlKey||n.metaKey)&&(s==="b"?(n.preventDefault(),wrapSelection(o,"**","**")):s==="i"?(n.preventDefault(),wrapSelection(o,"_","_")):s==="k"&&(n.preventDefault(),i.link&&i.link(o)))}),{$toolbar:e,onLink(n){i.link=n},onImage(n){i.image=n},onCard(n){i.card=n},onGrid(n){i.grid=n},onHelp(n){i.help=n},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onAccordion(n){i.accordion=n},onHero(n){i.hero=n},onBanner(n){i.banner=n},onListGroup(n){i.listgroup=n}}}
|
|
75
|
+
`)}]},"|",{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:"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:"help-circle",title:"Editor help",action:"help"}];export function createToolbar(t,e,p={}){se();const i={link:null,image:null,card:null,grid:null,help:null,effects:null,collection:null,view:null,cta:null,form:null,button:null,linksc:null,tabs:null,accordion:null,hero:null,banner:null},l=p.spacerDefault??40,o=t.get(0),s=e.get(0);s.textContent="",Q.forEach((n,c)=>{if(n==="|"){const u=document.createElement("span");u.className="editor-toolbar-sep",s.appendChild(u)}else{const u=document.createElement("button");u.className=n.type==="dropdown"?"editor-toolbar-btn editor-toolbar-dropdown-trigger":"editor-toolbar-btn",u.setAttribute("data-tooltip",n.title),u.setAttribute("data-idx",String(c)),u.type="button";const k=document.createElement("span");if(k.setAttribute("data-icon",n.icon),u.appendChild(k),n.type==="dropdown"){const y=document.createElement("span");y.className="editor-toolbar-caret",y.textContent="\u25BE",u.appendChild(y)}s.appendChild(u)}});const r=document.createElement("div");r.className="editor-toolbar-right",[{mode:"split",icon:"columns",label:"Split view",active:!0},{mode:"write",icon:"file-text",label:"Write only",active:!1},{mode:"preview",icon:"eye",label:"Preview only",active:!1}].forEach(n=>{const 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 u=document.createElement("span");u.setAttribute("data-icon",n.icon),c.appendChild(u),r.appendChild(c)});const a=document.createElement("span");a.className="editor-toolbar-sep",r.appendChild(a);const d=document.createElement("button");d.id="fullscreen-btn",d.className="editor-toolbar-btn",d.setAttribute("data-tooltip","Toggle fullscreen"),d.type="button";const h=document.createElement("span");return h.setAttribute("data-icon","expand"),d.appendChild(h),r.appendChild(d),s.appendChild(r),Domma.icons.scan(),s.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 u=e.get(0).querySelector(`[data-idx="${n}"]`),k={spacerDefault:l,handlers:i};c.type==="dropdown"?ue(o,u,c.items,k):U(c.action,o,u,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},onEffects(n){i.effects=n},onCollection(n){i.collection=n},onBlock(n){i.block=n},onView(n){i.view=n},onCta(n){i.cta=n},onForm(n){i.form=n},onButton(n){i.button=n},onLinkShortcode(n){i.linksc=n},onTabs(n){i.tabs=n},onAccordion(n){i.accordion=n},onHero(n){i.hero=n},onBanner(n){i.banner=n},onListGroup(n){i.listgroup=n},onScribe(n){i.scribe=n}}}async function pe(t){const{api:e}=await import("../api.js");let p;try{p=await e.components.list()}catch(v){E.toast(v.message||"Failed to load components.",{type:"error"});return}if(!p?.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 s=document.createElement("div");s.style.cssText="display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem;";const r=document.createElement("div");r.style.cssText="font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;color:var(--dm-text-muted,#888);",r.textContent="Props";const a=document.createElement("div");a.style.cssText="padding:.6rem;border:1px solid var(--dm-border,rgba(255,255,255,.08));border-radius:4px;min-height:40px;",a.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 h=document.createElement("iframe");h.src="/admin/preview/component-preview.html",h.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 u=document.createElement("button");u.className="btn btn-primary",u.textContent="Insert",u.disabled=!0,n.appendChild(c),n.appendChild(u),l.appendChild(o),l.appendChild(s),l.appendChild(r),l.appendChild(a),l.appendChild(d),l.appendChild(h),l.appendChild(n),i.element.appendChild(l),i.open();let k=null,y={};function C(){s.replaceChildren();for(const v of p){const b=document.createElement("button");b.type="button",b.className="btn btn-ghost",b.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 w=document.createElement("strong");w.style.cssText="font-size:.9rem;",w.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)`,b.appendChild(w),b.appendChild(L),b.addEventListener("click",()=>x(v)),s.appendChild(b)}}function x(v){k=v,y={};for(const[b,w]of Object.entries(v.props||{}))y[b]=w.default!==void 0?w.default:"";u.disabled=!1,S(),M()}function S(){a.replaceChildren();const v=Object.entries(k.props||{});if(v.length===0){const b=document.createElement("p");b.className="text-muted",b.style.margin="0",b.textContent="This component takes no props.",a.appendChild(b);return}for(const[b,w]of v){const L=document.createElement("div");L.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.4rem;";const z=document.createElement("label");z.style.cssText="font-size:.8rem;min-width:120px;color:var(--dm-text-muted,#aaa);",z.textContent=w.label||b,L.appendChild(z);const T=me(w);he(T,w,y[b]),T.addEventListener("input",()=>{y[b]=X(T,w),h.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),T.addEventListener("change",()=>{y[b]=X(T,w),h.contentWindow?.postMessage({type:"update",payload:{props:y}},"*")}),L.appendChild(T),a.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 b=await v.text();h.contentWindow?.postMessage({type:"remount",payload:{compiledJs:b,tagName:`dm-${k.name}`,props:y}},"*")}catch(v){E.toast(v.message||"Failed to load preview.",{type:"error"})}}c.addEventListener("click",()=>i.close()),u.addEventListener("click",()=>{if(!k)return;const v=t.selectionStart,b=t.selectionEnd,w=Object.entries(y).map(([z,T])=>{const j=z.replace(/([A-Z])/g,"-$1").toLowerCase(),B=String(T??"").replace(/"/g,""");return`${j}="${B}"`}).join(" "),L=`[component name="${k.name}"${w?" "+w:""} /]`;t.value=t.value.substring(0,v)+L+t.value.substring(b),t.selectionStart=t.selectionEnd=v+L.length,t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus(),i.close()}),C()}function me(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 he(t,e,p){e.type==="boolean"?t.checked=!!p:e.type==="array"||e.type==="object"?t.value=JSON.stringify(p??null):t.value=p??""}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import{insertAtCursor as se}from"./markdown-toolbar.js";const le=20,V={render:{label:"Render",icon:"edit-3",color:"#3b82f6"},wait:{label:"Wait",icon:"clock",color:"#f59e0b"},undo:{label:"Undo",icon:"corner-up-left",color:"#a855f7"},redraw:{label:"Redraw",icon:"refresh-cw",color:"#22c55e"}},T="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;box-sizing:border-box;width:100%;",ce="display:block;font-size:.7rem;font-weight:600;color:var(--dm-text-muted,#aaa);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.25rem;",de="display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.85em;";export function openScribeComposer(n){const r=ae(),e=[];let o=null;const u=E.slideover({title:"Scribe Composer",size:"lg",position:"right"});be();const b=document.createElement("div");b.className="scribe-composer",b.style.cssText="display:flex;flex-direction:column;height:100%;";const y=document.createElement("div");y.style.cssText="padding:1rem 1.25rem;border-bottom:1px solid var(--dm-border,#333);background:var(--dm-surface-subtle,#0f0f17);";const g=document.createElement("div");g.style.cssText="min-height:3.5rem;padding:.85rem 1rem;background:var(--dm-surface,#1a1a1a);border:1px dashed var(--dm-border,#333);border-radius:6px;font-size:1.25rem;line-height:1.5;overflow-wrap:anywhere;",y.appendChild(g);const w=document.createElement("div");w.style.cssText="display:flex;gap:.5rem;margin-top:.75rem;align-items:center;";const $=ee("rotate-cw","Replay"),B=ee("code","Show code"),k=document.createElement("span");k.style.cssText="font-size:.8em;color:var(--dm-text-muted,#aaa);flex:1;text-align:right;margin-right:.5rem;",w.appendChild($),w.appendChild(k),w.appendChild(B),y.appendChild(w);const p=document.createElement("pre");p.style.cssText="display:none;margin:.75rem 0 0;padding:.6rem .75rem;background:var(--dm-surface,#0a0a0a);border:1px solid var(--dm-border,#333);border-radius:4px;font-family:monospace;font-size:.78em;white-space:pre-wrap;word-break:break-all;color:var(--dm-text-muted,#bbb);max-height:200px;overflow:auto;",y.appendChild(p),B.addEventListener("click",()=>{const t=p.style.display!=="none";p.style.display=t?"none":"block"}),$.addEventListener("click",()=>X()),b.appendChild(y);const R=document.createElement("div");R.style.cssText="display:flex;flex:1;min-height:0;overflow:hidden;";const F=ue(r,()=>{v(),x()});R.appendChild(F.el);const M=document.createElement("main");M.style.cssText="flex:1;overflow-y:auto;padding:1rem 1.25rem;display:flex;flex-direction:column;";const W=document.createElement("h4");W.textContent="Actions",W.style.cssText="margin:0 0 .75rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--dm-text-muted,#aaa);",M.appendChild(W);const z=document.createElement("div");z.style.cssText="display:flex;flex-direction:column;gap:.6rem;",M.appendChild(z);const H=document.createElement("div");H.style.cssText="display:flex;gap:.4rem;margin-top:.9rem;flex-wrap:wrap;",Object.entries(V).forEach(([t,s])=>{const l=document.createElement("button");l.type="button",l.style.cssText=`padding:.4rem .8rem;background:transparent;border:1px dashed ${s.color}66;border-radius:4px;color:${s.color};cursor:pointer;font-size:.85em;display:inline-flex;align-items:center;gap:.35rem;`;const a=document.createElement("span");a.setAttribute("data-icon",s.icon),l.appendChild(a),l.appendChild(document.createTextNode(` + ${s.label}`)),l.addEventListener("click",()=>{v(),r.actions.push(ie(t)),j(),x()}),H.appendChild(l)}),M.appendChild(H),R.appendChild(M),b.appendChild(R);const L=document.createElement("div");L.style.cssText="display:flex;padding:.75rem 1rem;border-top:1px solid var(--dm-border,#333);background:var(--dm-surface-subtle,#0f0f17);gap:.5rem;align-items:center;";const S=document.createElement("button");S.type="button",S.className="btn btn-ghost btn-sm",S.textContent="Undo (Ctrl+Z)",S.addEventListener("click",()=>J()),L.appendChild(S);const U=document.createElement("span");U.style.cssText="font-size:.75em;color:var(--dm-text-muted,#aaa);",L.appendChild(U);const G=document.createElement("div");G.style.flex="1",L.appendChild(G);const A=document.createElement("button");A.type="button",A.className="btn btn-ghost",A.textContent="Cancel",A.addEventListener("click",()=>u.close()),L.appendChild(A);const D=document.createElement("button");D.type="button",D.className="btn btn-primary",D.textContent="Insert Scribe",D.addEventListener("click",()=>{se(n,Q()),u.close()}),L.appendChild(D),b.appendChild(L),u.element.appendChild(b),b.addEventListener("keydown",t=>{const s=(t.key||"").toLowerCase();(t.ctrlKey||t.metaKey)&&s==="z"&&!t.shiftKey&&e.length>0&&(t.preventDefault(),t.stopPropagation(),J())}),j(),x(),P(),requestAnimationFrame(()=>{Domma.icons.scan()}),u.open();function v(){e.push(JSON.stringify(r)),e.length>le&&e.shift(),P()}function J(){if(e.length===0){E.toast("Nothing to undo",{type:"info",duration:700});return}const t=JSON.parse(e.pop());Object.assign(r.globals,t.globals),r.actions.length=0,t.actions.forEach(s=>r.actions.push(s)),F.sync(),j(),x(),P(),E.toast("Undone",{type:"info",duration:500})}function P(){U.textContent=e.length===0?"":`${e.length} step${e.length===1?"":"s"} stored`,S.disabled=e.length===0,S.style.opacity=e.length===0?".4":"1"}function x(t=150){clearTimeout(o),o=setTimeout(X,t)}function X(){te(g),g.style.color="",g.style.fontStyle="",p.textContent=Q();const t=r.actions.filter(c=>c.type==="render"||c.type==="redraw"?(c.text||"").length>0:!0);if(t.length===0){g.textContent="(add an action to preview)",g.style.color="var(--dm-text-muted,#666)",g.style.fontStyle="italic",k.textContent="";return}const s=document.createElement("span");s.className="dm-fx-scribe",g.appendChild(s);const l=r.globals,a={speed:l.speed,deleteSpeed:l.deleteSpeed,cursor:l.cursor,cursorType:l.cursorType,loop:l.loop,loopDelay:l.loopDelay,pauseOnHover:l.pauseOnHover,actions:pe(t)};l.cursorChar&&(a.cursorChar=l.cursorChar);try{E.scribe(s,a),k.textContent=`${t.length} action${t.length===1?"":"s"}`}catch{k.textContent="Preview error"}}function j(){if(te(z),r.actions.length===0){const t=document.createElement("p");t.textContent="No actions yet \u2014 add one from the buttons below.",t.style.cssText="font-size:.85em;color:var(--dm-text-muted,#888);font-style:italic;margin:.5rem 0;",z.appendChild(t);return}r.actions.forEach((t,s)=>{z.appendChild(oe(t,s))}),requestAnimationFrame(()=>Domma.icons.scan())}function oe(t,s){const l=V[t.type],a=document.createElement("div");a.style.cssText=`border:1px solid var(--dm-border,#333);border-left:3px solid ${l.color};border-radius:4px;padding:.6rem .75rem;background:var(--dm-surface,#15151a);`;const c=document.createElement("div");c.style.cssText="display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem;";const N=document.createElement("span");N.style.cssText=`display:inline-flex;align-items:center;gap:.3rem;font-size:.72rem;font-weight:700;color:${l.color};text-transform:uppercase;letter-spacing:.06em;`;const d=document.createElement("span");d.setAttribute("data-icon",l.icon),N.appendChild(d),N.appendChild(document.createTextNode(l.label)),c.appendChild(N);const f=document.createElement("span");f.textContent=`#${s+1}`,f.style.cssText="font-size:.7rem;color:var(--dm-text-muted,#888);",c.appendChild(f);const m=document.createElement("div");m.style.flex="1",c.appendChild(m);const i=q("chevron-up","Move up");s===0&&(i.disabled=!0,i.style.opacity=".3"),i.addEventListener("click",()=>Z(s,-1)),c.appendChild(i);const h=q("chevron-down","Move down");s===r.actions.length-1&&(h.disabled=!0,h.style.opacity=".3"),h.addEventListener("click",()=>Z(s,1)),c.appendChild(h);const C=q("x","Remove");return C.addEventListener("click",()=>{v(),r.actions.splice(s,1),j(),x()}),c.appendChild(C),a.appendChild(c),a.appendChild(re(t)),a}function Z(t,s){const l=t+s;if(l<0||l>=r.actions.length)return;v();const[a]=r.actions.splice(t,1);r.actions.splice(l,0,a),j(),x()}function re(t){const s=document.createElement("div");if(s.style.cssText="display:flex;flex-direction:column;gap:.5rem;",t.type==="render"||t.type==="redraw"){const d=document.createElement("textarea");d.value=t.text||"",d.placeholder=t.type==="redraw"?"New text \u2014 clears everything first, then types this":"Text to type out",d.rows=2,d.style.cssText=T+"resize:vertical;font-family:inherit;min-height:2.2rem;";let f=d.value;d.addEventListener("input",()=>{t.text=d.value,x()}),d.addEventListener("blur",()=>{d.value!==f&&(v(),f=d.value)}),s.appendChild(d);const m=document.createElement("div");m.style.cssText="display:flex;align-items:center;gap:.5rem;font-size:.8em;";const i=document.createElement("label");i.textContent="Effect:",i.style.color="var(--dm-text-muted,#aaa)";const h=document.createElement("select");return h.style.cssText=T+"width:auto;padding:.25rem .4rem;",["none","fade","bounce","glow"].forEach(C=>{const _=document.createElement("option");_.value=C,_.textContent=C.charAt(0).toUpperCase()+C.slice(1),h.appendChild(_)}),h.value=t.effect||"none",h.addEventListener("change",()=>{v(),t.effect=h.value,x()}),m.appendChild(i),m.appendChild(h),s.appendChild(m),s}if(t.type==="wait"){const d=document.createElement("div");d.style.cssText="display:flex;gap:.4rem;align-items:center;";const f=document.createElement("input");f.type="number",f.min="0",f.value=String(t.duration??1e3),f.style.cssText=T+"flex:1;",f.addEventListener("input",()=>{const i=parseInt(f.value,10);!Number.isNaN(i)&&i>=0&&(t.duration=i,x())}),f.addEventListener("blur",()=>v()),d.appendChild(f);const m=document.createElement("select");return m.style.cssText=T+"width:auto;",[["ms","ms"],["s","seconds"]].forEach(([i,h])=>{const C=document.createElement("option");C.value=i,C.textContent=h,m.appendChild(C)}),m.value=t.unit||"ms",m.addEventListener("change",()=>{v(),t.unit=m.value,x()}),d.appendChild(m),s.appendChild(d),s}const l=document.createElement("div");l.style.cssText="display:flex;gap:.75rem;align-items:center;flex-wrap:wrap;font-size:.85em;";const a=document.createElement("input");a.type="number",a.min="1",a.value=String(t.count||5),a.style.cssText=T+"width:5rem;",a.addEventListener("input",()=>{const d=parseInt(a.value,10);!Number.isNaN(d)&&d>0&&(t.count=d,x())}),a.addEventListener("blur",()=>v());const c=`undo-mode-${Math.random().toString(36).slice(2)}`;return[["last","Last render"],["all","All text"],["count","Exactly N chars"]].forEach(([d,f])=>{const m=document.createElement("label");m.style.cssText="display:inline-flex;align-items:center;gap:.3rem;cursor:pointer;";const i=document.createElement("input");i.type="radio",i.name=c,i.value=d,i.checked=(t.mode||"last")===d,i.addEventListener("change",()=>{i.checked&&(v(),t.mode=d,a.style.display=d==="count"?"":"none",x())}),m.appendChild(i),m.appendChild(document.createTextNode(f)),l.appendChild(m),d==="count"&&(l.appendChild(a),a.style.display=(t.mode||"last")==="count"?"":"none")}),s.appendChild(l),s}function Q(){const t=r.globals,s=[];t.speed!==50&&s.push(`speed="${t.speed}"`),t.deleteSpeed!==30&&s.push(`delete-speed="${t.deleteSpeed}"`),t.cursor?(t.cursorType!=="caret"&&s.push(`cursor-type="${t.cursorType}"`),t.cursorChar&&s.push(`cursor-char="${he(t.cursorChar)}"`)):s.push('cursor="false"'),t.loop&&(s.push('loop="true"'),t.loopDelay!==1e3&&s.push(`loop-delay="${t.loopDelay}"`)),t.pauseOnHover&&s.push('pause-on-hover="true"');const l=s.length?" "+s.join(" "):"",a=r.actions.map(c=>c.type==="render"?`[render${c.effect&&c.effect!=="none"?` effect="${c.effect}"`:""}]${c.text||""}[/render]`:c.type==="redraw"?`[redraw${c.effect&&c.effect!=="none"?` effect="${c.effect}"`:""}]${c.text||""}[/redraw]`:c.type==="wait"?`[wait]${c.duration}${c.unit==="s"?"s":""}[/wait]`:c.mode==="all"?'[undo all="true" /]':c.mode==="count"?`[undo count="${c.count}" /]`:"[undo /]");return`[scribe${l}]
|
|
2
|
+
${a.join(`
|
|
3
|
+
`)}
|
|
4
|
+
[/scribe]`}}function ae(){return{globals:{speed:50,deleteSpeed:30,cursor:!0,cursorType:"caret",cursorChar:"",loop:!1,loopDelay:1e3,pauseOnHover:!1},actions:[{type:"render",text:"We build things that matter.",effect:"none"},{type:"wait",duration:1500,unit:"ms"},{type:"redraw",text:"We create solutions that last.",effect:"none"},{type:"wait",duration:1500,unit:"ms"}]}}function ie(n){switch(n){case"render":return{type:"render",text:"",effect:"none"};case"wait":return{type:"wait",duration:1e3,unit:"ms"};case"undo":return{type:"undo",mode:"last",count:5};case"redraw":return{type:"redraw",text:"",effect:"none"}}return{type:"render",text:"",effect:"none"}}function pe(n){const r=[];return n.forEach(e=>{if(e.type==="render"){const o={render:e.text||""};e.effect&&e.effect!=="none"&&(o.effect=e.effect),r.push(o)}else if(e.type==="redraw"){r.push({undoRender:"all"});const o={render:e.text||""};e.effect&&e.effect!=="none"&&(o.effect=e.effect),r.push(o)}else e.type==="wait"?r.push({wait:e.unit==="s"?(e.duration||0)*1e3:e.duration||0}):e.type==="undo"&&(e.mode==="all"?r.push({undoRender:"all"}):e.mode==="count"?r.push({undoRender:e.count}):r.push({undoRender:!0}))}),r}function ue(n,r){const e=document.createElement("aside");e.style.cssText="width:240px;flex-shrink:0;padding:1rem 1.25rem;border-right:1px solid var(--dm-border,#333);overflow-y:auto;display:flex;flex-direction:column;gap:.75rem;background:var(--dm-surface-subtle,#0c0c12);";const o=document.createElement("h4");o.textContent="Global settings",o.style.cssText="margin:0 0 .25rem;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--dm-text-muted,#aaa);",e.appendChild(o);const u=K(n.globals.speed,p=>{n.globals.speed=p,r()}),b=K(n.globals.deleteSpeed,p=>{n.globals.deleteSpeed=p,r()}),y=Y(n.globals.cursor,p=>{n.globals.cursor=p,r()},"Show cursor"),g=fe([["caret","Caret (|)"],["block","Block (\u2588)"],["underline","Underline (_)"]],n.globals.cursorType,p=>{n.globals.cursorType=p,r()}),w=me(n.globals.cursorChar,"\u258C (optional override)",p=>{n.globals.cursorChar=p,r()}),$=Y(n.globals.loop,p=>{n.globals.loop=p,r()},"Loop forever"),B=K(n.globals.loopDelay,p=>{n.globals.loopDelay=p,r()},0),k=Y(n.globals.pauseOnHover,p=>{n.globals.pauseOnHover=p,r()},"Pause on hover");return e.appendChild(O("Speed (ms / char)",u)),e.appendChild(O("Delete speed (ms / char)",b)),e.appendChild(y.wrap),e.appendChild(O("Cursor style",g)),e.appendChild(O("Custom cursor char",w)),e.appendChild($.wrap),e.appendChild(O("Loop delay (ms)",B)),e.appendChild(k.wrap),{el:e,sync(){u.value=String(n.globals.speed),b.value=String(n.globals.deleteSpeed),y.input.checked=n.globals.cursor,g.value=n.globals.cursorType,w.value=n.globals.cursorChar,$.input.checked=n.globals.loop,B.value=String(n.globals.loopDelay),k.input.checked=n.globals.pauseOnHover}}}function O(n,r){const e=document.createElement("div"),o=document.createElement("label");return o.style.cssText=ce,o.textContent=n,e.appendChild(o),e.appendChild(r),e}function K(n,r,e=1){const o=document.createElement("input");return o.type="number",o.min=String(e),o.value=String(n),o.style.cssText=T,o.addEventListener("input",()=>{const u=parseInt(o.value,10);!Number.isNaN(u)&&u>=e&&r(u)}),o}function me(n,r,e){const o=document.createElement("input");return o.type="text",o.value=n,o.placeholder=r,o.style.cssText=T,o.addEventListener("input",()=>e(o.value)),o}function fe(n,r,e){const o=document.createElement("select");return o.style.cssText=T,n.forEach(([u,b])=>{const y=document.createElement("option");y.value=u,y.textContent=b,o.appendChild(y)}),o.value=r,o.addEventListener("change",()=>e(o.value)),o}function Y(n,r,e){const o=document.createElement("label");o.style.cssText=de;const u=document.createElement("input");return u.type="checkbox",u.checked=n,u.addEventListener("change",()=>r(u.checked)),o.appendChild(u),o.appendChild(document.createTextNode(e)),{wrap:o,input:u}}function ee(n,r){const e=document.createElement("button");e.type="button",e.className="btn btn-ghost btn-sm",e.style.cssText="display:inline-flex;align-items:center;gap:.35rem;";const o=document.createElement("span");return o.setAttribute("data-icon",n),e.appendChild(o),e.appendChild(document.createTextNode(r)),e}function q(n,r){const e=document.createElement("button");e.type="button",e.title=r,e.style.cssText="padding:.25rem .4rem;background:transparent;border:1px solid var(--dm-border,#333);border-radius:3px;color:var(--dm-text-muted,#aaa);cursor:pointer;display:inline-flex;align-items:center;";const o=document.createElement("span");return o.setAttribute("data-icon",n),e.appendChild(o),e}function te(n){for(;n.firstChild;)n.removeChild(n.firstChild)}function he(n){return String(n).replace(/&/g,"&").replace(/"/g,""")}let ne=!1;function be(){ne||(ne=!0,I.register("edit-3",{viewBox:"0 0 24 24",paths:["M12 20h9","M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("clock",{viewBox:"0 0 24 24",paths:["M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10z","M12 6v6l4 2"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("corner-up-left",{viewBox:"0 0 24 24",paths:["M9 14 4 9l5-5","M20 20v-7a4 4 0 0 0-4-4H4"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("refresh-cw",{viewBox:"0 0 24 24",paths:["M23 4v6h-6","M1 20v-6h6","M3.51 9a9 9 0 0 1 14.85-3.36L23 10","M20.49 15a9 9 0 0 1-14.85 3.36L1 14"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("rotate-cw",{viewBox:"0 0 24 24",paths:["M23 4v6h-6","M20.49 15a9 9 0 1 1-2.12-9.36L23 10"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("code",{viewBox:"0 0 24 24",paths:["M16 18l6-6-6-6","M8 6l-6 6 6 6"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("chevron-up",{viewBox:"0 0 24 24",path:"M18 15l-6-6-6 6",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("chevron-down",{viewBox:"0 0 24 24",path:"M6 9l6 6 6-6",stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}),I.register("x",{viewBox:"0 0 24 24",paths:["M18 6L6 18","M6 6l12 12"],stroke:"currentColor",fill:"none",strokeWidth:2,strokeLinecap:"round",strokeLinejoin:"round"}))}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
function w(){if(document.getElementById("dm-simple-editor-style"))return;const r=document.createElement("style");r.id="dm-simple-editor-style",r.textContent=`
|
|
2
|
+
.dm-edit-wrap {
|
|
3
|
+
display: flex;
|
|
4
|
+
flex-direction: row;
|
|
5
|
+
width: 100%;
|
|
6
|
+
height: 100%;
|
|
7
|
+
min-height: 0;
|
|
8
|
+
background: var(--dm-surface, rgba(0,0,0,.02));
|
|
9
|
+
overflow: hidden;
|
|
10
|
+
}
|
|
11
|
+
.dm-edit-gutter {
|
|
12
|
+
flex-shrink: 0;
|
|
13
|
+
min-width: 2.5rem;
|
|
14
|
+
padding: .75rem .6rem .75rem .75rem;
|
|
15
|
+
background: var(--dm-background-alt, rgba(0,0,0,.15));
|
|
16
|
+
border-right: 1px solid var(--dm-border, rgba(255,255,255,.08));
|
|
17
|
+
color: var(--dm-text-muted, #666);
|
|
18
|
+
font-family: var(--dm-font-mono, 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace);
|
|
19
|
+
font-size: .85rem;
|
|
20
|
+
line-height: 1.55;
|
|
21
|
+
text-align: right;
|
|
22
|
+
user-select: none;
|
|
23
|
+
white-space: pre;
|
|
24
|
+
overflow: hidden;
|
|
25
|
+
box-sizing: border-box;
|
|
26
|
+
}
|
|
27
|
+
.dm-edit-area {
|
|
28
|
+
flex: 1;
|
|
29
|
+
min-width: 0;
|
|
30
|
+
padding: .75rem;
|
|
31
|
+
border: 0;
|
|
32
|
+
margin: 0;
|
|
33
|
+
background: transparent;
|
|
34
|
+
color: inherit;
|
|
35
|
+
font-family: var(--dm-font-mono, 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace);
|
|
36
|
+
font-size: .85rem;
|
|
37
|
+
line-height: 1.55;
|
|
38
|
+
tab-size: 2;
|
|
39
|
+
-moz-tab-size: 2;
|
|
40
|
+
outline: none;
|
|
41
|
+
resize: none;
|
|
42
|
+
white-space: pre;
|
|
43
|
+
overflow: auto;
|
|
44
|
+
box-sizing: border-box;
|
|
45
|
+
}
|
|
46
|
+
`,document.head.appendChild(r)}export function createSimpleEditor(r,g={}){if(!r)throw new Error("createSimpleEditor: mountEl is required.");const{initialValue:v="",onChange:h=null}=g;for(w();r.firstChild;)r.removeChild(r.firstChild);const a=document.createElement("div"),l=document.createElement("div"),e=document.createElement("textarea");a.className="dm-edit-wrap",l.className="dm-edit-gutter",e.className="dm-edit-area",e.spellcheck=!1,e.setAttribute("autocomplete","off"),e.setAttribute("autocorrect","off"),e.setAttribute("autocapitalize","off"),a.appendChild(l),a.appendChild(e),r.appendChild(a);function u(){const t=e.value.split(`
|
|
47
|
+
`).length||1,n=new Array(t);for(let i=0;i<t;i++)n[i]=String(i+1);l.textContent=n.join(`
|
|
48
|
+
`);const o=String(t).length;l.style.minWidth=`calc(${o}ch + 1.5rem)`}function s(){requestAnimationFrame(()=>{l.scrollTop=e.scrollTop})}function b(t){if(t.key!=="Tab")return;t.preventDefault();const{selectionStart:n,selectionEnd:o,value:i}=e;if(!t.shiftKey)e.value=i.slice(0,n)+" "+i.slice(o),e.selectionStart=e.selectionEnd=n+2;else{const d=i.lastIndexOf(`
|
|
49
|
+
`,n-1)+1,p=i.slice(d,d+2),f=p===" "?2:p[0]===" "?1:0;f>0&&(e.value=i.slice(0,d)+i.slice(d+f),e.selectionStart=e.selectionEnd=Math.max(d,n-f))}e.dispatchEvent(new Event("input",{bubbles:!0}))}const m=[];function c(t,n,o){t.addEventListener(n,o),m.push([t,n,o])}return c(e,"input",()=>{u(),s(),h&&h(e.value)}),c(e,"scroll",s),c(e,"keydown",b),c(e,"keyup",s),e.value=v,u(),{textarea:e,gutter:l,getValue(){return e.value},setValue(t){e.value!==t&&(e.value=t??"",u(),s())},focus(){e.focus()},destroy(){for(const[t,n,o]of m)t.removeEventListener(n,o);m.length=0,a.parentNode===r&&r.removeChild(a)}}}
|