domma-cms 0.76.0 → 0.77.1

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

@@ -1,47 +1,25 @@
-import{api as S}from"../api.js";import{colourToCss as It,HIGHLIGHT_HOVER as mt,HIGHLIGHT_ACTIVE as ut,HIGHLIGHT_HOVER_LABELS as ht,HIGHLIGHT_ACTIVE_LABELS as bt}from"/public/js/menu-decor.mjs?v=20260918-item-highlight";import{openIconPicker as _t}from"../lib/card-builder.js";import{applyDrop as St}from"../lib/menu-tree.js";import{placeTools as Ht,ensureLockedTools as Ot,isLockedUrl as Lt,TOOLS_FOLDER_KEY as Tt}from"../lib/sidebar-grouping.js";import{flatten as jt,nest as Ct,uid as it}from"../lib/menu-rows.js";const Et=760,Rt="admin-sidebar";function g(t){return String(t||"").replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;")}function Nt(t,c){let r=0,i=c.find(a=>a.id===t);for(;i&&i.parentId;)r++,i=c.find(a=>a.id===i.parentId);return r}function gt(t,c){const{top:r,height:i}=t.getBoundingClientRect(),a=i?(c-r)/i:.5;return a<.25?"above":a>.75?"below":"into"}const vt=["me-drop-above","me-drop-below","me-drop-into"];function rt(t){t.get(0).querySelectorAll(".menu-tree-row").forEach(c=>c.classList.remove(...vt))}function Ft(t,c,r){let i=null;t.get(0).querySelectorAll(".menu-tree-row").forEach(a=>{const o=a.querySelector(".menu-tree-grip");a.draggable=!1,o&&(o.addEventListener("mousedown",()=>{a.draggable=!0}),o.addEventListener("mouseup",()=>{a.draggable=!1})),a.addEventListener("dragstart",m=>{i=a.dataset.id,a.style.opacity="0.45",m.dataTransfer.effectAllowed="move";try{m.dataTransfer.setData("text/plain",i)}catch{}}),a.addEventListener("dragend",()=>{a.style.opacity="",a.draggable=!1,i=null,rt(t)}),a.addEventListener("dragover",m=>{if(!i||i===a.dataset.id)return;m.preventDefault(),m.dataTransfer.dropEffect="move";const p=gt(a,m.clientY);rt(t),a.classList.add(`me-drop-${p}`)}),a.addEventListener("dragleave",()=>a.classList.remove(...vt)),a.addEventListener("drop",m=>{m.preventDefault();const p=a.dataset.id,x=gt(a,m.clientY);if(rt(t),!i)return;const k=St(c(),i,p,x);if(k){const v=c().find(L=>L.id===i);v&&(v.touched=!0)}i=null,k&&r()})})}function lt(t){const c=new Set,r=new Set,i=a=>{for(const o of t.filter(m=>m.parentId===a))!o.type&&Lt(o.url)&&!r.has(o.url)&&(r.add(o.url),c.add(o.id)),i(o.id)};return i(null),c}function zt(t,c,r=()=>"",i=!1){t.html("");const a=i?lt(c):new Set;function o(m){for(const p of c.filter(x=>x.parentId===m)){const x=Nt(p.id,c);if(p.type==="separator"){t.append(`
-                    <div class="menu-tree-row menu-tree-row--separator" data-id="${p.id}" style="margin-left:${x*28}px">
-                        <span class="menu-tree-grip" data-icon="move"></span>
+import{api as T}from"../api.js";import{colourToCss as St,HIGHLIGHT_HOVER as ot,HIGHLIGHT_ACTIVE as at,HIGHLIGHT_HOVER_LABELS as it,HIGHLIGHT_ACTIVE_LABELS as st}from"/public/js/menu-decor.mjs?v=20260918-item-highlight";import{openIconPicker as $t}from"../lib/card-builder.js";import{applyDrop as At}from"../lib/menu-tree.js";import{placeTools as xt,ensureLockedTools as Et,isLockedUrl as Lt,TOOLS_FOLDER_KEY as _t}from"../lib/sidebar-grouping.js";import{flatten as Ht,nest as Ct,uid as Ee}from"../lib/menu-rows.js";import{addBannerAction as Me}from"../lib/plugin-chrome.js";import{helpPopovers as It}from"../lib/help-popover.js";import{onceClosed as Tt,openMenuAt as ze,sidebarCount as Dt}from"../lib/tool-kit.js";import{addChild as Rt,bindingFrom as jt,duplicateRow as Nt,indentRow as Ot,insertBelow as Pt,isStructural as ae,menuFromForm as Bt,menuProblems as lt,moveRow as rt,outdentRow as Ft,siblingsOf as Mt,snapshot as Le}from"../lib/menu-editor-arrange.js";const zt=760,qt="admin-sidebar",Wt=/^\/menus\/(new|edit\/[^?#]+)(\?.*)?$/;function w(t){return String(t||"").replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;")}const _e=t=>String(t??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;");function Kt(t,r){let l=0,i=r.find(o=>o.id===t);for(;i&&i.parentId;)l++,i=r.find(o=>o.id===i.parentId);return l}function ct(t,r){const{top:l,height:i}=t.getBoundingClientRect(),o=i?(r-l)/i:.5;return o<.25?"above":o>.75?"below":"into"}const dt=["me-drop-above","me-drop-below","me-drop-into"];function qe(t){t.querySelectorAll(".menu-tree-row").forEach(r=>r.classList.remove(...dt))}function Ut(t,r,l){let i=null;t.querySelectorAll(".menu-tree-row").forEach(o=>{const f=o.querySelector(".menu-tree-grip");o.draggable=!1,f&&(f.addEventListener("mousedown",()=>{o.draggable=!0}),f.addEventListener("mouseup",()=>{o.draggable=!1})),o.addEventListener("dragstart",h=>{i=o.dataset.id,o.style.opacity="0.45",h.dataTransfer.effectAllowed="move";try{h.dataTransfer.setData("text/plain",i)}catch{}}),o.addEventListener("dragend",()=>{o.style.opacity="",o.draggable=!1,i=null,qe(t)}),o.addEventListener("dragover",h=>{if(!i||i===o.dataset.id)return;h.preventDefault(),h.dataTransfer.dropEffect="move";const d=ct(o,h.clientY);qe(t),o.classList.add(`me-drop-${d}`)}),o.addEventListener("dragleave",()=>o.classList.remove(...dt)),o.addEventListener("drop",h=>{h.preventDefault();const d=o.dataset.id,C=ct(o,h.clientY);if(qe(t),!i)return;const $=At(r(),i,d,C);if($){const N=r().find(A=>A.id===i);N&&(N.touched=!0)}i=null,$&&l()})})}function ut(t){const r=new Set,l=new Set,i=o=>{for(const f of t.filter(h=>h.parentId===o))!f.type&&Lt(f.url)&&!l.has(f.url)&&(l.add(f.url),r.add(f.id)),i(f.id)};return i(null),r}const We='<button type="button" class="btn btn-sm btn-ghost mex-kebab" aria-label="Actions" title="Actions (right-click, or Shift+F10)">\u22EE</button>';function Gt(t,r,l=!1){const i=l?ut(r):new Set,o=[];function f(h){for(const d of r.filter(C=>C.parentId===h)){const $=`style="margin-left:${Kt(d.id,r)*28}px"`;if(d.type==="separator"){o.push(`
+                    <div class="menu-tree-row menu-tree-row--separator" data-id="${d.id}" tabindex="0" ${$}>
+                        <span class="menu-tree-grip" data-icon="move" title="Drag to move"></span>
                         <span class="me-sep-line"><span class="me-sep-label">Separator</span></span>
-                        <button class="btn btn-sm btn-ghost me-ins-item" data-tooltip="Add item below"><span data-icon="plus"></span></button>
-                        <button class="btn btn-sm btn-ghost me-ins-sep"  data-tooltip="Add separator below"><span data-icon="minus"></span></button>
-                        <button class="btn btn-sm btn-ghost me-outdent" data-tooltip="Outdent"><span data-icon="chevron-left"></span></button>
-                        <button class="btn btn-sm btn-ghost me-indent"  data-tooltip="Indent"><span data-icon="chevron-right"></span></button>
-                        <button class="btn btn-sm btn-ghost me-up"      data-tooltip="Move up"><span data-icon="arrow-up"></span></button>
-                        <button class="btn btn-sm btn-ghost me-down"    data-tooltip="Move down"><span data-icon="arrow-down"></span></button>
-                        <button class="btn btn-sm btn-ghost me-remove" data-tooltip="Remove"><span data-icon="trash"></span></button>
-                    </div>
-                `);continue}if(p.type==="spacer"){const M=["xs","sm","md","lg","xl","flex"].map(s=>`<option value="${s}"${(p.size||"md")===s?" selected":""}>${s==="flex"?"flexible":s}</option>`).join("");t.append(`
-                    <div class="menu-tree-row menu-tree-row--spacer" data-id="${p.id}" style="margin-left:${x*28}px">
-                        <span class="menu-tree-grip" data-icon="move"></span>
+                        ${We}
+                    </div>`);continue}if(d.type==="spacer"){const te=["xs","sm","md","lg","xl","flex"].map(B=>`<option value="${B}"${(d.size||"md")===B?" selected":""}>${B==="flex"?"flexible":B}</option>`).join("");o.push(`
+                    <div class="menu-tree-row menu-tree-row--spacer" data-id="${d.id}" tabindex="0" ${$}>
+                        <span class="menu-tree-grip" data-icon="move" title="Drag to move"></span>
                         <span class="me-spacer-line">
                             <span class="me-spacer-label">Spacer</span>
-                            <select class="form-input me-spacer-size" data-tooltip="Spacer size - flexible fills the leftover room">${M}</select>
+                            <select class="form-input me-spacer-size" title="Spacer size - flexible fills the leftover room" aria-label="Spacer size">${te}</select>
                         </span>
-                        <button class="btn btn-sm btn-ghost me-ins-item" data-tooltip="Add item below"><span data-icon="plus"></span></button>
-                        <button class="btn btn-sm btn-ghost me-ins-sep"  data-tooltip="Add separator below"><span data-icon="minus"></span></button>
-                        <button class="btn btn-sm btn-ghost me-outdent" data-tooltip="Outdent"><span data-icon="chevron-left"></span></button>
-                        <button class="btn btn-sm btn-ghost me-indent"  data-tooltip="Indent"><span data-icon="chevron-right"></span></button>
-                        <button class="btn btn-sm btn-ghost me-up"      data-tooltip="Move up"><span data-icon="arrow-up"></span></button>
-                        <button class="btn btn-sm btn-ghost me-down"    data-tooltip="Move down"><span data-icon="arrow-down"></span></button>
-                        <button class="btn btn-sm btn-ghost me-remove" data-tooltip="Remove"><span data-icon="trash"></span></button>
-                    </div>
-                `);continue}const k=p.badge&&(p.badge.text||p.badge.countFrom)?`<span class="dm-menu-badge">${g(String(p.badge.text||"#"))}</span>`:"",v=p.tool,L=v&&(v.persisted||p.touched),V=v?v.orphan?' <span class="badge badge-secondary me-tool-badge" data-tooltip="A placeholder for a Tool that is not enabled - it returns here when it is">Not enabled</span>':` <span class="badge badge-secondary me-tool-badge" data-tooltip="${L?"A Tool, placed here by this menu":"A Tool in its default place - move or edit it to place it here"}">${g(v.source||"Tool")}${L?"":" \xB7 default"}</span>`:"",q=a.has(p.id),Z=q?'<button class="btn btn-sm btn-ghost" disabled data-tooltip="Always in the sidebar - it can be moved, not removed"><span data-icon="lock"></span></button>':v&&!v.orphan?L?'<button class="btn btn-sm btn-ghost me-reset" data-tooltip="Back to its default place"><span data-icon="rotate-ccw"></span></button>':'<button class="btn btn-sm btn-ghost" disabled data-tooltip="A Tool cannot be removed - hide it instead"><span data-icon="trash"></span></button>':'<button class="btn btn-sm btn-ghost me-remove" data-tooltip="Remove"><span data-icon="trash"></span></button>',W=It(p.colour),C=W?` style="color:${g(W)}"`:"";t.append(`
-                <div class="menu-tree-row menu-tree-row--slim${p.hidden?" menu-tree-row--hidden":""}${v?" menu-tree-row--tool":""}${v&&!L?" menu-tree-row--default":""}" data-id="${p.id}" style="margin-left:${x*28}px">
-                    <span class="menu-tree-grip" data-icon="move"></span>
-                    <span class="me-row-label"${C}>${g(p.text||v?.label||"(untitled)")}${k}${V}</span>
-                    <span class="me-row-url">${g(p.url||"")}</span>
-                    <button class="btn btn-sm btn-ghost me-ins-item" data-tooltip="Add item below"><span data-icon="plus"></span></button>
-                    <button class="btn btn-sm btn-ghost me-ins-sep"  data-tooltip="Add separator below"><span data-icon="minus"></span></button>
-                    <button class="btn btn-sm btn-ghost me-outdent" data-tooltip="Outdent"><span data-icon="chevron-left"></span></button>
-                    <button class="btn btn-sm btn-ghost me-indent"  data-tooltip="Indent"><span data-icon="chevron-right"></span></button>
-                    <button class="btn btn-sm btn-ghost me-up"      data-tooltip="Move up"><span data-icon="arrow-up"></span></button>
-                    <button class="btn btn-sm btn-ghost me-down"    data-tooltip="Move down"><span data-icon="arrow-down"></span></button>
-                    ${q?'<button class="btn btn-sm btn-ghost" disabled data-tooltip="Always shown"><span data-icon="eye-off"></span></button>':`<button class="btn btn-sm btn-ghost me-hidden ${p.hidden?"active":""}" data-tooltip="${p.hidden?"Show":"Hide"}"><span data-icon="eye-off"></span></button>`}
-                    <button class="btn btn-sm btn-secondary me-edit" data-tooltip="Edit"><span data-icon="edit"></span></button>
-                    ${Z}
-                </div>
-            `),o(p.id)}}o(null),Domma.icons.scan(t.get(0)),t.get(0).querySelectorAll("[data-tooltip]").forEach(m=>{E.tooltip(m,{content:m.getAttribute("data-tooltip"),position:"top"})})}function j(t,c){t.find(".menu-tree-row").each(function(){const r=$(this).data("id"),i=c.find(k=>k.id===r);if(!i||i.type==="separator")return;if(i.type==="spacer"){const k=$(this).find(".me-spacer-size");k.length&&(i.size=k.val());return}const a=$(this).find(".me-text");a.length&&(i.text=a.val());const o=$(this).find(".me-url");o.length&&(i.url=o.val());const m=$(this).find(".me-icon");m.length&&(i.icon=m.val());const p=$(this).find(".me-vis");p.length&&(i.visibility=p.val());const x=$(this).find(".me-perm");x.length&&(i.permission=x.val())})}function Ut(t,c){const r={};for(const i of c){const a=t.querySelector(`[name="${i}"]`);a&&(r[i]=a.type==="checkbox"?a.checked:a.value)}return r}function w(t,c={},...r){const i=document.createElement(t);Object.assign(i,c);for(const a of r)a!=null&&i.append(a);return i}function O(t,c,r){const i=w("label",{className:"form-field"},w("span",{className:"form-label",textContent:t}),c);return r&&i.append(w("small",{className:"form-hint",textContent:r,style:"display:block;font-size:.78em;opacity:.7;margin-top:.25rem;line-height:1.35"})),i}function Pt(t,c){const r=[["","- Everyone -"],["public","Public - anyone, incl. logged-out"],...(c||[]).map(a=>[a.name,`${a.label||a.name} and above`]),...(c||[]).filter(a=>a.level!==0).map(a=>[`=${a.name}`,`${a.label||a.name} only`]),["private","Private - super-admin only"]];t&&!r.some(([a])=>a===t)&&r.push([t,`${t} (custom)`]);const i=D(r,t||"");return i.name="visibility",i}function D(t,c){const r=w("select",{className:"form-select"});return t.forEach(([i,a])=>r.add(new Option(a,i))),r.value=c??"",r}function dt(t,c){const r=typeof c=="string"&&c.startsWith("#"),i=D([["","- none -"],["primary","primary"],["success","success"],["danger","danger"],["warning","warning"],["info","info"],["neutral","neutral"],["__custom__","Custom\u2026"]],r?"__custom__":c||""),a=w("input",{type:"color",className:"form-input me-colour-hex",value:r?c:"#000000"});a.style.display=r?"":"none",i.addEventListener("change",()=>{a.style.display=i.value==="__custom__"?"":"none"});const o=O(t,i);return o.append(a),o._read=()=>i.value==="__custom__"?a.value:i.value,o}function Bt(t,c){const r=w("input",{className:"form-input me-icon",name:"icon",value:c||""}),i=w("span",{className:"me-icon-preview"});c&&i.setAttribute("data-icon",c);const a=w("button",{type:"button",className:"btn btn-sm btn-ghost",textContent:"Browse\u2026"}),o=m=>{m?i.setAttribute("data-icon",m):i.removeAttribute("data-icon"),Domma.icons.scan(i.parentNode||i)};return a.addEventListener("click",()=>_t(m=>{r.value=m,o(m)})),r.addEventListener("input",()=>o(r.value.trim())),O(t,w("div",{className:"me-icon-field"},r,a,i))}function ct(...t){return w("div",{className:"me-field-grid"},...t)}async function Dt(t,c,r,i,a){const o=b=>w("h4",{className:"me-form-section",textContent:b}),m=O("Label",w("input",{className:"form-input",name:"text",value:t.text||""}),"The text shown for this item."),p=w("input",{className:"form-input",name:"url",value:t.url||""}),x=O("URL",p,t.tool||t.locked?"A Tool's address is its identity, so it cannot be changed here.":"Where it links. Must start with /, #, https://, or mailto: . Leave blank for a parent that only groups sub-items.");(t.tool||t.locked)&&(p.readOnly=!0);const k=Bt("Icon",t.icon||""),v=Pt(t.visibility||"",i),L=O("Visibility",v,t.locked?"Always in the sidebar for everyone who may use it, so it cannot be restricted here.":'Who can see this item. "Role and above" shows it to that role and anyone more senior; "Role only" shows it to holders of that role alone (and the super-admin). Blank = everyone.');t.locked&&(v.disabled=!0);const V=D([["","- no permission gate -"],...(c||[]).map(b=>[b.key,b.label||b.key])],t.permission||"");V.name="permission";const q=O("Permission",V,t.tool||t.locked?"A Tool is guarded by its own permission, which always applies.":"Hide unless the viewer holds this specific permission. Independent of Visibility - both must pass.");(t.tool||t.locked)&&(V.disabled=!0);const Z=O("Badge text",w("input",{className:"form-input",name:"badgeText",value:t.badge?.text||""})),W=D([["","- none -"],...(r||[]).map(b=>[b.slug,b.title||b.slug])],t.badge?.countFrom||"");W.name="badgeCount";const C=O("Badge count from",W,"Show a live count of this collection\u2019s entries as the badge."),M=dt("Badge colour",t.badge?.variant||""),s=D([["link","Link"],["pill","Pill"]],t.pill?"pill":"link");s.name="renderAs";const A=O("Render as",s,"Pill draws the item as a rounded chip. Pill styling applies to top-level navbar items."),y=O("Pill style",D([["filled","Filled"],["outline","Outline"]],t.pill?.style||"filled"));y.querySelector("select").name="pillStyle";const J=dt("Pill colour",t.pill?.variant||""),Y=w("div",{className:"me-pill-wrap"},ct(y,J));Y.style.display=t.pill?"":"none",s.addEventListener("change",()=>{Y.style.display=s.value==="pill"?"":"none"});const Q=dt("Text colour",t.colour||""),U=D([["","- use the menu default -"],...mt.map(b=>[b,ht[b]||b])],t.highlight?.hover||"");U.name="hlHover";const at=O("Hover effect",U,"Overrides the menu-wide hover effect for this item only."),N=D([["","- use the menu default -"],...ut.map(b=>[b,bt[b]||b])],t.highlight?.active||"");N.name="hlActive";const tt=O("When selected",N,"How this item is marked when it points at the page being viewed."),X=dt("Highlight colour",t.highlight?.accent||""),st=w("button",{className:"btn btn-primary",textContent:"Apply"}),F=w("div",{className:"me-item-form"},o("Link"),m,x,k,o("Access"),ct(L,q),o("Badge"),ct(Z,M),C,o("Appearance"),A,Y,Q,o("Highlighting"),ct(at,tt),X,st),R=E.slideover({title:"Edit menu item",size:"lg",position:"right"});R.element.appendChild(F),R.open();const K=R.element.closest(".dm-slideover")||R.element.querySelector(".dm-slideover")||R.element;K.style.setProperty("width",Et+"px","important"),K.style.setProperty("max-width","95vw","important"),Domma.icons.scan(F);const _=b=>F.querySelector(`[name="${b}"]`)?.value||"";st.addEventListener("click",()=>{t.text=_("text"),t.icon=_("icon"),t.locked||(t.visibility=_("visibility")),!t.tool&&!t.locked?(t.url=_("url"),t.permission=_("permission")):t.touched=!0;const b=_("badgeText"),G=_("badgeCount"),et=M._read();if(t.badge=b||G?{...b&&{text:b},...G&&{countFrom:G},...et&&{variant:et}}:null,_("renderAs")==="pill"){const B=J._read();t.pill={style:_("pillStyle")||"filled",...B&&{variant:B}}}else t.pill=null;t.colour=Q._read();const nt=_("hlHover"),z=_("hlActive"),P=X._read();t.highlight=nt||z||P?{...nt&&{hover:nt},...z&&{active:z},...P&&{accent:P}}:null,R.close(),a()})}export const menuEditorView={templateUrl:"/admin/js/templates/menu-editor.html",async onMount(t){const c=location.hash.match(/^#\/menus\/edit\/(.+)$/),r=c?decodeURIComponent(c[1]):null,i=!r,a=E.loader(t.get(0),{type:"dots"});let o,m,p,x,k,v,L;try{if(i)o={slug:"",name:"",description:"",items:[]};else try{o=await S.menus.get(r)}catch(e){E.toast(`Failed to load menu: ${e.message||e}`,{type:"error"}),location.hash="#/menus";return}m=await S.projects.list().catch(()=>[]),p=await H.get("/api/auth/permissions-registry").catch(()=>({resources:[]})),x=await S.collections.list().catch(()=>[]),k=await S.get("/collections/roles/entries?limit=100").catch(()=>null),v=await S.menuLocations.registry().catch(()=>[]),L=await S.pages.list().catch(()=>[])}finally{a.destroy()}const q=(Array.isArray(k)?k:k?.entries||[]).map(e=>({name:e.data?.name,label:e.data?.label,level:e.data?.level??99})).filter(e=>e.name).sort((e,n)=>n.level-e.level),Z='<option value="">- no permission gate -</option>',W=e=>Z+(p.resources||[]).map(n=>{const l=(e||"")===n.key?" selected":"";return`<option value="${n.key}"${l}>${n.label||n.key}</option>`}).join("");t.find("#me-title").text(i?"New menu":`Edit "${o.slug}"`);const C=!i&&r===Rt;let M=[];C&&(M=await H.get("/api/sidebar/registered-items").catch(()=>(E.toast("Could not load the Tools - they are not shown, and saving keeps their places as they are.",{type:"warning",duration:8e3}),[])));let s=jt(C?Ot(Ht(o.items||[],M,{forEditor:!0}),{leaveInHiddenFolders:!0}):o.items);const A=t.find("#me-items-list");function y(){zt(A,s,W,C),Ft(A,()=>s,y)}y(),t.find("#me-add-item").on("click",()=>{j(A,s),s.push({id:it(),parentId:null,text:"",url:"/",icon:"",visibility:"",permission:"",hidden:!1,bundled:!1}),y()}),t.find("#me-add-separator").on("click",()=>{j(A,s),s.push({id:it(),parentId:null,type:"separator"}),y()}),t.find("#me-add-spacer").on("click",()=>{j(A,s),s.push({id:it(),parentId:null,type:"spacer",size:"md"}),y()});function J(e){return function(){j(A,s);const n=$(this).closest(".menu-tree-row").data("id"),l=s.findIndex(f=>f.id===n);if(l===-1)return;const u=s[l],d={separator:{type:"separator"},spacer:{type:"spacer",size:"md"}}[e],h=d?{id:it(),parentId:u.parentId,...d}:{id:it(),parentId:u.parentId,text:"",url:"/",icon:"",visibility:"",permission:"",hidden:!1,bundled:!1};s.splice(l+1,0,h),y()}}t.off("click",".me-ins-item").on("click",".me-ins-item",J("item")),t.off("click",".me-ins-sep").on("click",".me-ins-sep",J("separator"));function Y(e){const n=u=>s.find(d=>!d.type&&!d.url&&!d.tool&&(d.key||"").toLowerCase()===u)||s.find(d=>!d.type&&!d.url&&!d.tool&&!d.key&&(d.text||"").toLowerCase()===u),l=n(String(e.tool.folder||"").toLowerCase())||n(Tt);e.parentId=l?l.id:null,s.splice(s.indexOf(e),1),s.push(e),Object.assign(e,{text:e.tool.defaults.text,icon:e.tool.defaults.icon,visibility:"",hidden:!1,badge:null,pill:null,colour:"",highlight:null,touched:!1}),e.tool={...e.tool,persisted:!1}}t.off("click",".me-remove").on("click",".me-remove",function(){const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(f=>f.id===e),l=f=>{let I=f;for(;I;){if(I.id===e)return!0;I=s.find(T=>T.id===I.parentId)}return!1},u=C?lt(s):new Set;if(u.has(e))return;const d=s.filter(f=>f.id!==e&&f.tool&&l(f)),h=s.filter(f=>f.id!==e&&!f.tool&&u.has(f.id)&&l(f));s=s.filter(f=>!l(f)||d.includes(f)||h.includes(f));for(const f of h)f.parentId=n?.parentId??null;for(const f of d)f.tool.orphan?f.parentId=n?.parentId??null:Y(f);y()}),t.off("click",".me-indent").on("click",".me-indent",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(d=>d.id===e);if(!n)return;const l=s.filter(d=>d.parentId===n.parentId),u=l.findIndex(d=>d.id===e);u<=0||["separator","spacer"].includes(l[u-1].type)||(n.parentId=l[u-1].id,n.touched=!0,y())}),t.off("click",".me-outdent").on("click",".me-outdent",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(u=>u.id===e);if(!n||n.parentId==null)return;const l=s.find(u=>u.id===n.parentId);n.parentId=l?l.parentId:null,n.touched=!0,y()}),t.off("click",".me-up").on("click",".me-up",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.filter(h=>h.parentId===s.find(f=>f.id===e)?.parentId),l=n.findIndex(h=>h.id===e);if(l<=0)return;n[l].touched=!0;const u=s.indexOf(n[l]),d=s.indexOf(n[l-1]);[s[u],s[d]]=[s[d],s[u]],y()}),t.off("click",".me-down").on("click",".me-down",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.filter(h=>h.parentId===s.find(f=>f.id===e)?.parentId),l=n.findIndex(h=>h.id===e);if(l===-1||l>=n.length-1)return;n[l].touched=!0;const u=s.indexOf(n[l]),d=s.indexOf(n[l+1]);[s[u],s[d]]=[s[d],s[u]],y()}),t.off("click",".me-hidden").on("click",".me-hidden",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(l=>l.id===e);n&&!(C&&lt(s).has(n.id))&&(n.hidden=!n.hidden,n.touched=!0),y()}),t.off("click",".me-reset").on("click",".me-reset",function(){j(A,s);const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(l=>l.id===e);!n?.tool||n.tool.orphan||(Y(n),y())}),t.off("click",".me-edit").on("click",".me-edit",function(){const e=$(this).closest(".menu-tree-row").data("id"),n=s.find(l=>l.id===e);!n||["separator","spacer"].includes(n.type)||(n.locked=C&&lt(s).has(n.id),Dt(n,p.resources||[],x,q,()=>y()))}),E.tabs(t.find("#me-tabs").get(0)),t.find("#me-variant").val(o.variant||""),t.find("#me-position").val(o.position||"");const Q=t.find("#me-appearOnHover").get(0);Q&&(Q.checked=o.appearOnHover===!0),t.find("#me-float-anchor").val(o.float?.anchor||"TL"),t.find("#me-float-offsetX").val(o.float?.offsetX??""),t.find("#me-float-offsetY").val(o.float?.offsetY??""),t.find("#me-float-width").val(o.float?.width??""),t.find("#me-float-radius").val(o.float?.radius??""),t.find("#me-float-shadow").val(o.float?.shadow||""),t.find("#me-float-opacity").val(o.float?.opacity??""),t.find("#me-float-title").val(o.float?.title||"");for(const[e,n]of[["#me-float-collapsible",o.float?.collapsible],["#me-float-collapsed",o.float?.collapsed],["#me-float-movable",o.float?.movable],["#me-float-resizable",o.float?.resizable]]){const l=t.find(e).get(0);l&&(l.checked=n===!0)}const U=o.float?.accent||"",at=U.startsWith("#"),N=t.find("#me-float-accent"),tt=t.find("#me-float-accent-hex");N.val(at?"__custom__":U),at&&tt.val(U);const X=()=>{tt.get(0).style.display=N.val()==="__custom__"?"":"none"};X(),N.on("change",X);const st=()=>N.val()==="__custom__"?tt.val():N.val(),F=()=>{const e=t.find("#me-position").val()==="floating";t.find(".dm-float-field").each(function(){this.style.display=e?"":"none"}),e&&X();const n=t.find("#me-orientation").val()==="vertical";t.find(".dm-vertical-field").each(function(){this.style.display=n?"":"none"});const l=!!(t.find("#me-float-collapsible").get(0)||{}).checked;t.find(".dm-float-collapsed-field").each(function(){this.style.display=e&&l?"":"none"})};t.find("#me-orientation").val(o.orientation||""),t.find("#me-align").val(o.align||""),t.find("#me-side").val(o.side||"left"),F(),t.find("#me-position").on("change",F),t.find("#me-orientation").on("change",F),t.find("#me-float-collapsible").on("change",F);const R=(e,n,l,u)=>{const d=t.find(e).get(0);d&&(d.innerHTML="",d.add(new Option(u,"")),n.forEach(h=>d.add(new Option(l[h]||h,h))))};R("#me-highlight-hover",mt,ht,"- theme default -"),R("#me-highlight-active",ut,bt,"- theme default -"),t.find("#me-highlight-hover").val(o.highlight?.hover||""),t.find("#me-highlight-active").val(o.highlight?.active||"");const K=o.highlight?.accent||"",_=K.startsWith("#"),b=t.find("#me-highlight-accent"),G=t.find("#me-highlight-accent-hex");b.val(_?"__custom__":K),_&&G.val(K);const et=()=>{G.get(0).style.display=b.val()==="__custom__"?"":"none"};et(),b.on("change",et);const nt=()=>b.val()==="__custom__"?G.val():b.val();t.find("#me-fontFamily").val(o.style?.fontFamily||""),t.find("#me-fontSize").val(o.style?.fontSize||""),t.find("#me-fontWeight").val(o.style?.fontWeight||""),t.find("#me-letterSpacing").val(o.style?.letterSpacing||""),t.find("#me-iconSize").val(o.style?.iconSize||"");const z=t.find("#me-bind-slot"),P=t.find("#me-bind-projects"),B=t.find("#me-bind-pages");z.html('<option value="">- not bound -</option>'+(v||[]).map(e=>`<option value="${g(e.slot)}">${g(e.label||e.slot)} (${g(e.slot)})</option>`).join("")),P.html(m.map(e=>`<option value="${g(e.slug)}">${g(e.name||e.slug)}</option>`).join("")),z.val(o.binding?.slot||"");const yt=new Set(o.binding?.projects||[]);Array.from(P.get(0).options).forEach(e=>{e.selected=yt.has(e.value)}),B.val((o.binding?.pages||[]).join(`
-`)),t.find("#me-bind-page-pick").html('<option value="">- pick a page -</option>'+L.map(e=>{const n=e.urlPath||e.url||"";return n?`<option value="${g(n)}">${g(e.title||n)} - ${g(n)}</option>`:""}).join("")),t.find("#me-bind-page-add").on("click",()=>{const e=t.find("#me-bind-page-pick").val();if(!e)return;const n=B.val().split(`
-`).map(l=>l.trim()).filter(Boolean);n.includes(e)||n.push(e),B.val(n.join(`
-`)),ot()});function pt(){const e=z.val();return e?{slot:e,projects:Array.from(P.get(0).selectedOptions).map(n=>n.value),pages:B.val().split(`
-`).map(n=>n.trim()).filter(Boolean)}:null}function ot(){const e=pt(),n=t.find("#me-bind-summary");if(!e){n.html('<span class="text-muted">Not bound - this menu renders only where it is mapped or placed by a shortcode.</span>');return}const l=[];e.projects.length&&l.push(`pages in ${e.projects.map(h=>`<code>${g(h)}</code>`).join(", ")}`),e.pages.length&&l.push(`pages matching ${e.pages.map(h=>`<code>${g(h)}</code>`).join(", ")}`);const u=e.pages.filter(h=>!/^\/[^\s?#*]*(\/\*)?$|^\/\*$/.test(h)),d=u.length?`<div class="text-danger" style="margin-top:.4rem">Not valid page patterns: ${u.map(h=>`<code>${g(h)}</code>`).join(", ")}</div>`:"";n.html(l.length?`Takes over the <code>${g(e.slot)}</code> slot on ${l.join(" and ")}.${d}`:`<span class="text-warning">Slot <code>${g(e.slot)}</code> selected but no project or page chosen - the binding will never match.</span>`)}z.on("change",ot),P.on("change",ot),B.on("input",ot),ot();const{getProjectFromHash:wt}=await import("../lib/project-context.js"),kt=i?wt():null,ft=t.find("#me-project");ft.html('<option value="">- none -</option>'+m.map(e=>`<option value="${g(e.slug)}">${g(e.name||e.slug)}</option>`).join("")),t.find("#me-slug").val(o.slug||""),t.find("#me-name").val(o.name||""),t.find("#me-description").val(o.description||""),ft.val(o.meta?.project||kt||""),Domma.icons.scan(t.get(0)),t.find("#me-save").on("click",async()=>{j(A,s);const e={variant:t.find("#me-variant").val(),position:t.find("#me-position").val(),appearOnHover:!!(t.find("#me-appearOnHover").get(0)||{}).checked,floatAnchor:t.find("#me-float-anchor").val(),floatOffsetX:t.find("#me-float-offsetX").val(),floatOffsetY:t.find("#me-float-offsetY").val(),floatWidth:t.find("#me-float-width").val(),floatRadius:t.find("#me-float-radius").val(),floatShadow:t.find("#me-float-shadow").val(),floatAccent:st(),floatOpacity:t.find("#me-float-opacity").val(),floatTitle:t.find("#me-float-title").val().trim(),floatCollapsible:!!(t.find("#me-float-collapsible").get(0)||{}).checked,floatCollapsed:!!(t.find("#me-float-collapsed").get(0)||{}).checked,floatMovable:!!(t.find("#me-float-movable").get(0)||{}).checked,floatResizable:!!(t.find("#me-float-resizable").get(0)||{}).checked,highlightHover:t.find("#me-highlight-hover").val(),highlightActive:t.find("#me-highlight-active").val(),highlightAccent:nt(),orientation:t.find("#me-orientation").val(),align:t.find("#me-align").val(),side:t.find("#me-side").val(),fontFamily:t.find("#me-fontFamily").val(),fontSize:t.find("#me-fontSize").val(),fontWeight:t.find("#me-fontWeight").val(),letterSpacing:t.find("#me-letterSpacing").val(),iconSize:t.find("#me-iconSize").val()},n={slug:t.find("#me-slug").val().trim(),name:t.find("#me-name").val().trim(),description:t.find("#me-description").val().trim(),project:t.find("#me-project").val()},l=["fontFamily","fontSize","fontWeight","letterSpacing","iconSize"],u=Object.fromEntries(Object.entries(e).filter(([I,T])=>l.includes(I)&&T)),d={};if(e.position==="floating"){e.floatAnchor&&(d.anchor=e.floatAnchor);for(const[I,T]of[["offsetX",e.floatOffsetX],["offsetY",e.floatOffsetY],["width",e.floatWidth],["radius",e.floatRadius],["opacity",e.floatOpacity]])T!==""&&T!=null&&Number.isFinite(Number(T))&&(d[I]=Number(T));e.floatShadow&&(d.shadow=e.floatShadow),e.floatAccent&&(d.accent=e.floatAccent),e.floatTitle&&(d.title=e.floatTitle),e.floatCollapsible&&(d.collapsible=!0),e.floatCollapsible&&e.floatCollapsed&&(d.collapsed=!0),e.floatMovable&&(d.movable=!0),e.floatResizable&&(d.resizable=!0)}const h={};e.highlightHover&&(h.hover=e.highlightHover),e.highlightActive&&(h.active=e.highlightActive),e.highlightAccent&&(h.accent=e.highlightAccent);const f={slug:n.slug,name:n.name,description:n.description,...e.variant&&{variant:e.variant},...e.position&&{position:e.position},...e.orientation&&{orientation:e.orientation},...e.orientation==="vertical"&&e.side&&{side:e.side},...e.orientation!=="vertical"&&e.align&&{align:e.align},...Object.keys(d).length&&{float:d},...Object.keys(h).length&&{highlight:h},...e.appearOnHover&&{appearOnHover:!0},...Object.keys(u).length&&{style:u},binding:pt(),items:Ct(s),meta:{...o.meta||{},project:n.project||null}};try{if(i)await S.menus.create(f);else if(f.slug!==o.slug){await S.menus.create(f);const I=await S.menuLocations.get();let T=!1;for(const[xt,At]of Object.entries(I))At===o.slug&&(I[xt]=f.slug,T=!0);T&&await S.menuLocations.save(I),await S.menus.remove(o.slug)}else await S.menus.update(o.slug,f);E.toast("Saved.",{type:"success"}),location.hash="#/menus/edit/"+encodeURIComponent(f.slug)}catch(I){E.toast(`Save failed: ${I.message||I}`,{type:"error"})}})}};
+                        ${We}
+                    </div>`);continue}const N=d.badge&&(d.badge.text||d.badge.countFrom)?`<span class="dm-menu-badge">${w(String(d.badge.text||"#"))}</span>`:"",A=d.tool,g=A&&(A.persisted||d.touched),K=A?A.orphan?' <span class="badge badge-secondary me-tool-badge" title="A placeholder for a Tool that is not enabled - it returns here when it is">Not enabled</span>':` <span class="badge badge-secondary me-tool-badge" title="${g?"A Tool, placed here by this menu":"A Tool in its default place - move or edit it to place it here"}">${w(A.source||"Tool")}${g?"":" \xB7 default"}</span>`:"",ie=i.has(d.id),ee=St(d.colour),U=ee?` style="color:${w(ee)}"`:"",se=ie?'<button type="button" class="btn btn-sm btn-ghost" disabled title="Always shown - it can be moved, not hidden" aria-label="Always shown"><span data-icon="lock"></span></button>':`<button type="button" class="btn btn-sm btn-ghost me-hidden ${d.hidden?"active":""}" title="${d.hidden?"Hidden - click to show":"Hide"}" aria-label="${d.hidden?"Show":"Hide"}" aria-pressed="${d.hidden?"true":"false"}"><span data-icon="${d.hidden?"eye-off":"eye"}"></span></button>`;o.push(`
+                <div class="menu-tree-row menu-tree-row--slim${d.hidden?" menu-tree-row--hidden":""}${A?" menu-tree-row--tool":""}${A&&!g?" menu-tree-row--default":""}" data-id="${d.id}" tabindex="0" ${$}>
+                    <span class="menu-tree-grip" data-icon="move" title="Drag to move"></span>
+                    <span class="me-row-label${!d.text&&!A?" mex-untitled":""}"${U}>${w(d.text||A?.label||"(no label - click to add one)")}${N}${K}</span>
+                    <span class="me-row-url">${w(d.url||"")}</span>
+                    ${se}
+                    <button type="button" class="btn btn-sm btn-ghost me-edit" title="Edit" aria-label="Edit"><span data-icon="edit"></span></button>
+                    ${We}
+                </div>`),f(d.id)}}f(null),t.innerHTML=o.join("")||'<p class="mex-note">No items yet - Add item, or right-click an item for more.</p>',I.scan(t)}function k(t,r={},...l){const i=document.createElement(t);Object.assign(i,r);for(const o of l)o!=null&&i.append(o);return i}function j(t,r,l){const i=k("label",{className:"form-field"},k("span",{className:"form-label",textContent:t}),r);return l&&i.append(k("small",{className:"form-hint",textContent:l,style:"display:block;font-size:.78em;opacity:.7;margin-top:.25rem;line-height:1.35"})),i}function Vt(t,r){const l=[["","- Everyone -"],["public","Public - anyone, incl. logged-out"],...(r||[]).map(o=>[o.name,`${o.label||o.name} and above`]),...(r||[]).filter(o=>o.level!==0).map(o=>[`=${o.name}`,`${o.label||o.name} only`]),["private","Private - super-admin only"]];t&&!l.some(([o])=>o===t)&&l.push([t,`${t} (custom)`]);const i=Q(l,t||"");return i.name="visibility",i}function Q(t,r){const l=k("select",{className:"form-select"});return t.forEach(([i,o])=>l.add(new Option(o,i))),l.value=r??"",l}function He(t,r){const l=typeof r=="string"&&r.startsWith("#"),i=Q([["","- none -"],["primary","primary"],["success","success"],["danger","danger"],["warning","warning"],["info","info"],["neutral","neutral"],["__custom__","Custom\u2026"]],l?"__custom__":r||""),o=k("input",{type:"color",className:"form-input me-colour-hex",value:l?r:"#000000"});o.style.display=l?"":"none",i.addEventListener("change",()=>{o.style.display=i.value==="__custom__"?"":"none"});const f=j(t,i);return f.append(o),f._read=()=>i.value==="__custom__"?o.value:i.value,f}function Yt(t,r){const l=k("input",{className:"form-input me-icon",name:"icon",value:r||""}),i=k("span",{className:"me-icon-preview"});r&&i.setAttribute("data-icon",r);const o=k("button",{type:"button",className:"btn btn-sm btn-ghost",textContent:"Browse\u2026"}),f=h=>{h?i.setAttribute("data-icon",h):i.removeAttribute("data-icon"),Domma.icons.scan(i.parentNode||i)};return o.addEventListener("click",()=>$t(h=>{l.value=h,f(h)})),l.addEventListener("input",()=>f(l.value.trim())),j(t,k("div",{className:"me-icon-field"},l,o,i))}function Ce(...t){return k("div",{className:"me-field-grid"},...t)}async function Xt(t,r,l,i,o){const f=t.text||t.tool?.label||"",h=c=>k("h4",{className:"me-form-section",textContent:c}),d=j("Label",k("input",{className:"form-input",name:"text",value:t.text||""}),"The text shown for this item."),C=k("input",{className:"form-input",name:"url",value:t.url||""}),$=j("URL",C,t.tool||t.locked?"A Tool's address is its identity, so it cannot be changed here.":"Where it links. Must start with /, #, https://, or mailto: . Leave blank for a parent that only groups sub-items.");(t.tool||t.locked)&&(C.readOnly=!0);const N=Yt("Icon",t.icon||""),A=Vt(t.visibility||"",i),g=j("Visibility",A,t.locked?"Always in the sidebar for everyone who may use it, so it cannot be restricted here.":'Who can see this item. "Role and above" shows it to that role and anyone more senior; "Role only" shows it to holders of that role alone (and the super-admin). Blank = everyone.');t.locked&&(A.disabled=!0);const K=Q([["","- no permission gate -"],...(r||[]).map(c=>[c.key,c.label||c.key])],t.permission||"");K.name="permission";const ie=j("Permission",K,t.tool||t.locked?"A Tool is guarded by its own permission, which always applies.":"Hide unless the viewer holds this specific permission. Independent of Visibility - both must pass.");(t.tool||t.locked)&&(K.disabled=!0);const ee=j("Badge text",k("input",{className:"form-input",name:"badgeText",value:t.badge?.text||""})),U=Q([["","- none -"],...(l||[]).map(c=>[c.slug,c.title||c.slug])],t.badge?.countFrom||"");U.name="badgeCount";const se=j("Badge count from",U,"Show a live count of this collection\u2019s entries as the badge."),te=He("Badge colour",t.badge?.variant||""),B=Q([["link","Link"],["pill","Pill"]],t.pill?"pill":"link");B.name="renderAs";const Ie=j("Render as",B,"Pill draws the item as a rounded chip. Pill styling applies to top-level navbar items."),G=j("Pill style",Q([["filled","Filled"],["outline","Outline"]],t.pill?.style||"filled"));G.querySelector("select").name="pillStyle";const pe=He("Pill colour",t.pill?.variant||""),le=k("div",{className:"me-pill-wrap"},Ce(G,pe));le.style.display=t.pill?"":"none",B.addEventListener("change",()=>{le.style.display=B.value==="pill"?"":"none"});const p=He("Text colour",t.colour||""),O=Q([["","- use the menu default -"],...ot.map(c=>[c,it[c]||c])],t.highlight?.hover||"");O.name="hlHover";const re=j("Hover effect",O,"Overrides the menu-wide hover effect for this item only."),fe=Q([["","- use the menu default -"],...at.map(c=>[c,st[c]||c])],t.highlight?.active||"");fe.name="hlActive";const ye=j("When selected",fe,"How this item is marked when it points at the page being viewed."),F=He("Highlight colour",t.highlight?.accent||""),x=k("button",{className:"btn btn-primary",textContent:"Apply",title:"Apply to the item (Ctrl+Enter) - Save the menu to keep it"}),z=k("div",{className:"me-item-form"},h("Link"),d,$,N,h("Access"),Ce(g,ie),h("Badge"),Ce(ee,te),se,h("Appearance"),Ie,le,p,h("Highlighting"),Ce(re,ye),F,x),y=E.slideover({title:f?`Edit ${_e(f)}`:"Edit menu item",size:"lg",position:"right"});y.element.appendChild(z);const X=()=>JSON.stringify([...z.querySelectorAll("input, select, textarea")].map(c=>c.type==="checkbox"?c.checked:c.value)),ne=X();let V=!1,ce=!1;Tt(y);const we=y.close.bind(y);y.close=async c=>{if(!V&&c!==!0&&X()!==ne){if(ce)return;ce=!0;const Y=await E.confirm("Discard the changes to this item?");if(ce=!1,!Y)return}return V=!0,we()},z.addEventListener("keydown",c=>{(c.ctrlKey||c.metaKey)&&c.key==="Enter"&&(c.preventDefault(),x.click())}),y.open();const he=y.element.closest(".dm-slideover")||y.element.querySelector(".dm-slideover")||y.element;he.style.setProperty("width",zt+"px","important"),he.style.setProperty("max-width","95vw","important"),Domma.icons.scan(z);const L=c=>z.querySelector(`[name="${c}"]`)?.value||"";x.addEventListener("click",()=>{t.text=L("text"),t.icon=L("icon"),t.locked||(t.visibility=L("visibility")),!t.tool&&!t.locked?(t.url=L("url"),t.permission=L("permission")):t.touched=!0;const c=L("badgeText"),Y=L("badgeCount"),oe=te._read();if(t.badge=c||Y?{...c&&{text:c},...Y&&{countFrom:Y},...oe&&{variant:oe}}:null,L("renderAs")==="pill"){const ve=pe._read();t.pill={style:L("pillStyle")||"filled",...ve&&{variant:ve}}}else t.pill=null;t.colour=p._read();const de=L("hlHover"),ue=L("hlActive"),me=F._read();t.highlight=de||ue||me?{...de&&{hover:de},...ue&&{active:ue},...me&&{accent:me}}:null,V=!0,y.close(!0),o()})}let W=null,mt=!1;function Jt(){mt||!window.R?.use||(mt=!0,R.use((t,r,l)=>{const i=r?.path||"";return!(Wt.test(i)&&(t?.path||"")!==i)||!W?.dirty()?l():E.confirm(`You have unsaved changes to the menu "${_e(W.name())}". Leave anyway? They are kept as a draft for your next visit.`).then(f=>{f?l():history.replaceState(null,"",`#${i}`)})}),M.subscribe("router:afterChange",({to:t}={})=>{if(W&&(t?.path||"")!==W.path){const r=W;W=null,r.dispose()}}))}function pt(t,r){const l=t.querySelector(".dm-plugin-banner-name"),i=l?.querySelector(".dm-plugin-banner-sep");if(!(!l||!i)){for(;i.nextSibling;)i.nextSibling.remove();l.appendChild(document.createTextNode(r))}}export const menuEditorView={templateUrl:"/admin/js/templates/menu-editor.html",async onMount(t){if(Jt(),W){const e=W;W=null,e.dispose()}const r=[],l=e=>(r.push(e),e);let i=!1;const o=t.get(0).querySelector(".mex")||t.get(0),f=()=>!i&&o.isConnected,h=location.hash.replace(/^#/,""),d=location.hash.match(/^#\/menus\/edit\/([^?#]+)/),C=d?decodeURIComponent(d[1]):null,$=!C,N=`menu-editor.draft.${C||"new"}`,A=E.loader(t.get(0),{type:"dots"});let g,K,ie,ee,U,se,te;try{if($)g={slug:"",name:"",description:"",items:[]};else try{g=await T.menus.get(C)}catch(e){E.toast(`Failed to load menu: ${e.message||e}`,{type:"error"}),location.hash="#/menus";return}[K,ie,ee,U,se,te]=await Promise.all([T.projects.list().catch(()=>[]),H.get("/api/auth/permissions-registry").catch(()=>({resources:[]})),T.collections.list().catch(()=>[]),T.get("/collections/roles/entries?limit=100").catch(()=>null),T.menuLocations.registry().catch(()=>[]),T.pages.list().catch(()=>[])])}finally{A.destroy()}if(!o.isConnected)return;const Ie=(Array.isArray(U)?U:U?.entries||[]).map(e=>({name:e.data?.name,label:e.data?.label,level:e.data?.level??99})).filter(e=>e.name).sort((e,n)=>n.level-e.level),G=!$&&C===qt;let pe=[];if(G&&(pe=await H.get("/api/sidebar/registered-items").catch(()=>(E.toast("Could not load the Tools - they are not shown, and saving keeps their places as they are.",{type:"warning",duration:8e3}),[])),!o.isConnected))return;const le=e=>Ht(G?Et(xt(e||[],pe,{forEditor:!0}),{leaveInHiddenFolders:!0}):e);let p=le(g.items);const O=M.observable(!1),re=M.observable(!1),fe=M.observable(""),ye=M.observable(0);let F="";const x=o.querySelector("#me-items-list");function z(){Gt(x,p,G),Ut(x,()=>p,()=>{z(),q()}),ye.value=p.filter(e=>!ae(e)).length}const y=()=>{z(),q()},X=()=>G?ut(p):new Set,ne=e=>p.find(n=>n.id===e);function V(e){requestAnimationFrame(()=>x.querySelector(`.menu-tree-row[data-id="${CSS.escape(e)}"]`)?.focus())}function ce(e){const n=u=>p.find(m=>!m.type&&!m.url&&!m.tool&&(m.key||"").toLowerCase()===u)||p.find(m=>!m.type&&!m.url&&!m.tool&&!m.key&&(m.text||"").toLowerCase()===u),s=n(String(e.tool.folder||"").toLowerCase())||n(_t);e.parentId=s?s.id:null,p.splice(p.indexOf(e),1),p.push(e),Object.assign(e,{text:e.tool.defaults.text,icon:e.tool.defaults.icon,visibility:"",hidden:!1,badge:null,pill:null,colour:"",highlight:null,touched:!1}),e.tool={...e.tool,persisted:!1}}const we=e=>!X().has(e.id)&&!(e.tool&&!e.tool.orphan);async function he(e){const n=ne(e);if(!n||!we(n))return;const s=b=>{let Z=b;for(;Z;){if(Z.id===e)return!0;Z=p.find(P=>P.id===Z.parentId)}return!1},u=p.filter(b=>b.id!==e&&s(b));if(u.length&&!await E.confirm(`Remove "${_e(n.text||n.type||"this item")}" and the ${u.length} item${u.length===1?"":"s"} beneath it?`))return;const m=X(),v=u.filter(b=>b.tool),_=u.filter(b=>!b.tool&&m.has(b.id));p=p.filter(b=>!s(b)||v.includes(b)||_.includes(b));for(const b of _)b.parentId=n.parentId??null;for(const b of v)b.tool.orphan?b.parentId=n.parentId??null:ce(b);y()}function L(e){const n=ne(e);!n||ae(n)||X().has(e)||(n.hidden=!n.hidden,n.touched=!0,y())}function c(e){const n=ne(e);!n||ae(n)||(n.locked=G&&X().has(n.id),Xt(n,ie.resources||[],ee,Ie,()=>{y(),V(e)}))}function Y(e){const n={id:Ee(),parentId:null,...e==="separator"?{type:e}:e==="spacer"?{type:e,size:"md"}:{text:"",url:"/",icon:"",visibility:"",permission:"",hidden:!1,bundled:!1}};p.push(n),y(),ae(n)?V(n.id):c(n.id)}const oe=e=>n=>{e(n)&&(y(),V(n))},de=oe(e=>rt(p,e,-1)),ue=oe(e=>rt(p,e,1)),me=oe(e=>Ot(p,e)),ve=oe(e=>Ft(p,e));function ft(e){const n=ne(e);if(!n)return[];const s=ae(n),u=X().has(e),m=Mt(p,e),v=m.findIndex(P=>P.id===e),_=n.tool,b=_&&(_.persisted||n.touched),Z=P=>()=>{const be=Pt(p,e,P,Ee());y(),be&&!ae(be)?c(be.id):be&&V(be.id)};return[{header:s?n.type==="separator"?"Separator":"Spacer":n.text||_?.label||"(untitled)"},...s?[]:[{label:"Edit\u2026",icon:"edit",action:()=>c(e)}],{type:"divider"},{label:"Add item below",icon:"plus",action:Z("item")},{label:"Add sub-item",icon:"corner-down-right",disabled:s,action:()=>{const P=Rt(p,e,Ee());y(),P&&c(P.id)}},{label:"Add separator below",icon:"minus",action:Z("separator")},{label:"Add spacer below",icon:"move",action:Z("spacer")},{type:"divider"},{label:"Move up",icon:"arrow-up",shortcut:"Alt+\u2191",disabled:v<=0,action:()=>de(e)},{label:"Move down",icon:"arrow-down",shortcut:"Alt+\u2193",disabled:v<0||v>=m.length-1,action:()=>ue(e)},{label:"Indent",icon:"chevron-right",shortcut:"Alt+\u2192",disabled:v<=0||ae(m[v-1]),action:()=>me(e)},{label:"Outdent",icon:"chevron-left",shortcut:"Alt+\u2190",disabled:n.parentId==null,action:()=>ve(e)},{type:"divider"},...s?[]:[{label:n.hidden?"Show":"Hide",icon:n.hidden?"eye":"eye-off",disabled:u,action:()=>L(e)}],{label:"Duplicate",icon:"copy",disabled:!!_,action:()=>{const P=Nt(p,e,Ee);y(),P&&V(P.id)}},..._&&!_.orphan&&b?[{label:"Back to its default place",icon:"rotate-ccw",action:()=>{ce(n),y()}}]:[],{label:u?"Remove - always in the sidebar":_&&!_.orphan?"Remove - a Tool is hidden, not removed":"Remove\u2026",icon:"trash",danger:!0,disabled:!we(n),action:()=>he(e)}]}const ht=E.contextMenu(x,{cursor:"glyph",match:".menu-tree-row",inherit:!1,density:"compact",items:e=>ft(e.dataset.id)});l(()=>ht?.destroy?.());const Ke=e=>{const n=e.target.closest(".menu-tree-row");if(!n)return;const s=n.dataset.id;if(e.target.closest(".mex-kebab")){ze(e.target.closest(".mex-kebab"));return}if(e.target.closest(".me-hidden")){L(s);return}if(e.target.closest(".me-edit")){c(s);return}e.target.closest("select, .menu-tree-grip, button")||c(s)},Ue=e=>{const n=e.target.closest(".menu-tree-row");if(!n||e.target!==n){n&&e.key==="F10"&&e.shiftKey&&(e.preventDefault(),ze(n));return}const s=n.dataset.id;if(e.key==="F10"&&e.shiftKey)e.preventDefault(),ze(n);else if(e.key==="Enter")e.preventDefault(),c(s);else if(e.key==="Delete")e.preventDefault(),he(s);else if(e.altKey&&e.key==="ArrowUp")e.preventDefault(),de(s);else if(e.altKey&&e.key==="ArrowDown")e.preventDefault(),ue(s);else if(e.altKey&&e.key==="ArrowRight")e.preventDefault(),me(s);else if(e.altKey&&e.key==="ArrowLeft")e.preventDefault(),ve(s);else if(e.key==="ArrowDown"||e.key==="ArrowUp"){const u=[...x.querySelectorAll(".menu-tree-row")],m=u.indexOf(n)+(e.key==="ArrowDown"?1:-1);u[m]&&(e.preventDefault(),u[m].focus())}},Ge=e=>{if(!e.target.matches(".me-spacer-size"))return;const n=ne(e.target.closest(".menu-tree-row")?.dataset.id);n&&(n.size=e.target.value,q())};x.addEventListener("click",Ke),x.addEventListener("keydown",Ue),x.addEventListener("change",Ge),l(()=>{x.removeEventListener("click",Ke),x.removeEventListener("keydown",Ue),x.removeEventListener("change",Ge)});const a=e=>t.find(e),ke=a("#me-float-accent"),Te=a("#me-float-accent-hex"),De=()=>{Te.get(0).style.display=ke.val()==="__custom__"?"":"none"},vt=()=>ke.val()==="__custom__"?Te.val():ke.val(),Se=a("#me-highlight-accent"),Re=a("#me-highlight-accent-hex"),Ve=()=>{Re.get(0).style.display=Se.val()==="__custom__"?"":"none"},gt=()=>Se.val()==="__custom__"?Re.val():Se.val(),Ye=()=>{const e=a("#me-position").val()==="floating";a(".dm-float-field").each(function(){this.style.display=e?"":"none"}),e&&De();const n=a("#me-orientation").val()==="vertical";a(".dm-vertical-field").each(function(){this.style.display=n?"":"none"});const s=!!(a("#me-float-collapsible").get(0)||{}).checked;a(".dm-float-collapsed-field").each(function(){this.style.display=e&&s?"":"none"})},Xe=(e,n,s,u)=>{const m=a(e).get(0);m&&(m.innerHTML="",m.add(new Option(u,"")),n.forEach(v=>m.add(new Option(s[v]||v,v))))};Xe("#me-highlight-hover",ot,it,"- theme default -"),Xe("#me-highlight-active",at,st,"- theme default -");const je=a("#me-bind-slot"),Ne=a("#me-bind-projects"),$e=a("#me-bind-pages");je.html('<option value="">- not bound -</option>'+(se||[]).map(e=>`<option value="${w(e.slot)}">${w(e.label||e.slot)} (${w(e.slot)})</option>`).join("")),Ne.html(K.map(e=>`<option value="${w(e.slug)}">${w(e.name||e.slug)}</option>`).join("")),a("#me-bind-page-pick").html('<option value="">- pick a page -</option>'+te.map(e=>{const n=e.urlPath||e.url||"";return n?`<option value="${w(n)}">${w(e.title||n)} - ${w(n)}</option>`:""}).join(""));const Je=()=>jt({slot:je.val(),projects:Array.from(Ne.get(0).selectedOptions).map(e=>e.value),pagesText:$e.val()});function Oe(){const e=Je(),n=a("#me-bind-summary");if(!e){n.html('<span class="text-muted">Not bound - this menu renders only where it is mapped or placed by a shortcode.</span>');return}const s=[];e.projects.length&&s.push(`pages in ${e.projects.map(v=>`<code>${w(v)}</code>`).join(", ")}`),e.pages.length&&s.push(`pages matching ${e.pages.map(v=>`<code>${w(v)}</code>`).join(", ")}`);const u=e.pages.filter(v=>!/^\/[^\s?#*]*(\/\*)?$|^\/\*$/.test(v)),m=u.length?`<div class="text-danger" style="margin-top:.4rem">Not valid page patterns: ${u.map(v=>`<code>${w(v)}</code>`).join(", ")}</div>`:"";n.html(s.length?`Takes over the <code>${w(e.slot)}</code> slot on ${s.join(" and ")}.${m}`:`<span class="text-warning">Slot <code>${w(e.slot)}</code> selected but no project or page chosen - the binding will never match.</span>`)}const{getProjectFromHash:bt}=await import("../lib/project-context.js");if(!f())return;const yt=$?bt():null;a("#me-project").html('<option value="">- none -</option>'+K.map(e=>`<option value="${w(e.slug)}">${w(e.name||e.slug)}</option>`).join(""));function Pe(e){p=le(e.items),a("#me-variant").val(e.variant||""),a("#me-position").val(e.position||"");const n=a("#me-appearOnHover").get(0);n&&(n.checked=e.appearOnHover===!0),a("#me-float-anchor").val(e.float?.anchor||"TL"),a("#me-float-offsetX").val(e.float?.offsetX??""),a("#me-float-offsetY").val(e.float?.offsetY??""),a("#me-float-width").val(e.float?.width??""),a("#me-float-radius").val(e.float?.radius??""),a("#me-float-shadow").val(e.float?.shadow||""),a("#me-float-opacity").val(e.float?.opacity??""),a("#me-float-title").val(e.float?.title||"");for(const[v,_]of[["#me-float-collapsible",e.float?.collapsible],["#me-float-collapsed",e.float?.collapsed],["#me-float-movable",e.float?.movable],["#me-float-resizable",e.float?.resizable]]){const b=a(v).get(0);b&&(b.checked=_===!0)}const s=e.float?.accent||"";ke.val(s.startsWith("#")?"__custom__":s),s.startsWith("#")&&Te.val(s),De(),a("#me-orientation").val(e.orientation||""),a("#me-align").val(e.align||""),a("#me-side").val(e.side||"left"),a("#me-highlight-hover").val(e.highlight?.hover||""),a("#me-highlight-active").val(e.highlight?.active||"");const u=e.highlight?.accent||"";Se.val(u.startsWith("#")?"__custom__":u),u.startsWith("#")&&Re.val(u),Ve(),a("#me-fontFamily").val(e.style?.fontFamily||""),a("#me-fontSize").val(e.style?.fontSize||""),a("#me-fontWeight").val(e.style?.fontWeight||""),a("#me-letterSpacing").val(e.style?.letterSpacing||""),a("#me-iconSize").val(e.style?.iconSize||""),je.val(e.binding?.slot||"");const m=new Set(e.binding?.projects||[]);Array.from(Ne.get(0).options).forEach(v=>{v.selected=m.has(v.value)}),$e.val((e.binding?.pages||[]).join(`
+`)),a("#me-slug").val(e.slug||""),a("#me-name").val(e.name||""),a("#me-description").val(e.description||""),a("#me-project").val(e.meta?.project||yt||""),Ye(),Oe(),z()}const ge=e=>!!(a(e).get(0)||{}).checked;function Ae(){const e={variant:a("#me-variant").val(),position:a("#me-position").val(),appearOnHover:ge("#me-appearOnHover"),floatAnchor:a("#me-float-anchor").val(),floatOffsetX:a("#me-float-offsetX").val(),floatOffsetY:a("#me-float-offsetY").val(),floatWidth:a("#me-float-width").val(),floatRadius:a("#me-float-radius").val(),floatShadow:a("#me-float-shadow").val(),floatAccent:vt(),floatOpacity:a("#me-float-opacity").val(),floatTitle:a("#me-float-title").val(),floatCollapsible:ge("#me-float-collapsible"),floatCollapsed:ge("#me-float-collapsed"),floatMovable:ge("#me-float-movable"),floatResizable:ge("#me-float-resizable"),highlightHover:a("#me-highlight-hover").val(),highlightActive:a("#me-highlight-active").val(),highlightAccent:gt(),orientation:a("#me-orientation").val(),align:a("#me-align").val(),side:a("#me-side").val(),fontFamily:a("#me-fontFamily").val(),fontSize:a("#me-fontSize").val(),fontWeight:a("#me-fontWeight").val(),letterSpacing:a("#me-letterSpacing").val(),iconSize:a("#me-iconSize").val()},n={slug:a("#me-slug").val(),name:a("#me-name").val(),description:a("#me-description").val(),project:a("#me-project").val()};return Bt(e,n,Je(),Ct(p),g.meta||{})}let Ze=!1,Be=null;function q(){if(!F)return;const e=Ae();Be=e,O.value=Le(e)!==F,fe.value=O.peek()||Ze?lt(e).join(" "):""}const xe=e=>{e.target.closest("#me-items-list")||(e.target.matches("#me-position, #me-orientation, #me-float-collapsible")&&Ye(),e.target.matches("#me-float-accent")&&De(),e.target.matches("#me-highlight-accent")&&Ve(),e.target.closest("#me-binding")&&Oe(),q())};o.addEventListener("input",xe),o.addEventListener("change",xe),l(()=>{o.removeEventListener("input",xe),o.removeEventListener("change",xe)}),a("#me-bind-page-add").on("click",()=>{const e=a("#me-bind-page-pick").val();if(!e)return;const n=$e.val().split(`
+`).map(s=>s.trim()).filter(Boolean);n.includes(e)||n.push(e),$e.val(n.join(`
+`)),Oe(),q()}),Pe(g),F=Le(Ae()),q();const Qe=()=>{try{S.remove?S.remove(N):S.set(N,null)}catch{}};async function Fe(){if(re.peek())return;const e=Ae(),n=lt(e);if(n.length){Ze=!0,q(),E.toast(n.join(" "),{type:"warning",duration:7e3});return}re.value=!0;try{if($)await T.menus.create(e);else if(e.slug!==g.slug){await T.menus.create(e);const s=await T.menuLocations.get();let u=!1;for(const[m,v]of Object.entries(s))v===g.slug&&(s[m]=e.slug,u=!0);u&&await T.menuLocations.save(s),await T.menus.remove(g.slug)}else await T.menus.update(g.slug,e);if(F=Le(e),O.value=!1,Qe(),Dt("#/menus"),E.toast("Saved.",{type:"success"}),$||e.slug!==g.slug)location.hash="#/menus/edit/"+encodeURIComponent(e.slug);else{g={...g,...e};for(const s of p)s.tool&&s.touched&&(s.tool={...s.tool,persisted:!0});z(),F=Le(Ae()),q(),pt(t.get(0),e.name||e.slug)}if(G)try{document.dispatchEvent(new CustomEvent("dm:sidebar-rebuild"))}catch{}}catch(s){E.toast(`Save failed: ${s.message||s}`,{type:"error"})}finally{re.value=!1}}async function wt(){!O.peek()||!await E.confirm("Throw away the changes you have not saved?")||(Pe(g),q())}E.tabs(a("#me-tabs").get(0));const kt=M.applyBindings({dirty:O,saving:re,problems:fe,itemCount:ye},o,{methods:{save:()=>Fe(),discard:()=>wt(),addItem:()=>Y("item"),addSeparator:()=>Y("separator"),addSpacer:()=>Y("spacer")}});l(()=>kt.dispose()),l(It(o,{position:"bottom"})),pt(t.get(0),$?"New menu":g.name||g.slug),Me(t,{id:"menu-editor-back",icon:"arrow-left",title:"All menus",onClick:()=>{location.hash="#/menus"}}),Me(t,{id:"menu-editor-locations",icon:"map-pin",title:"Menu locations",onClick:()=>{location.hash="#/menu-locations"}}),Me(t,{id:"menu-editor-save",icon:"save",title:"Save (Ctrl+S)",onClick:()=>Fe()});const et=e=>{if(!(!(e.ctrlKey||e.metaKey)||e.key!=="s")){if(e.preventDefault(),e.stopImmediatePropagation(),document.querySelector(".me-item-form")?.offsetParent){E.toast("Apply the item first (Ctrl+Enter), then Save.",{type:"info"});return}Fe()}};document.addEventListener("keydown",et,!0),l(()=>document.removeEventListener("keydown",et,!0));const tt=()=>{if(!(!O.peek()||!Be))try{S.set(N,{menu:Be,base:F,at:new Date().toISOString()})}catch{}},nt=e=>{O.peek()&&(tt(),e.preventDefault(),e.returnValue="")};window.addEventListener("beforeunload",nt),l(()=>window.removeEventListener("beforeunload",nt)),W={path:h,dirty:()=>O.peek(),name:()=>a("#me-name").val()||g.name||g.slug||"new menu",dispose(){i=!0,tt(),r.splice(0).reverse().forEach(e=>{try{e()}catch{}})}},I.scan(o);let J=null;try{J=S.get(N)}catch{}if(J?.menu){Qe();const e=J.base&&J.base!==F,n=J.at?` (${D(J.at).format("D MMM HH:mm")})`:"",s=$?"the new menu you started":`the menu "${_e(g.name||g.slug)}"`,u=e?`You left unsaved changes to ${s}${n}, but the saved menu has changed since. Restore your version anyway?`:`You left unsaved changes to ${s}${n}. Restore them?`;await E.confirm(u)&&f()&&(Pe({...J.menu,meta:{...g.meta||{},...J.menu.meta||{}}}),q())}}};

package/admin/js/views/menu-locations.js

@@ -1 +1,16 @@
-import{api as i}from"../api.js";function d(s){if(!Array.isArray(s)||s.length===0)return 0;let c=0;for(const l of s){const r=Array.isArray(l.items)&&l.items.length?d(l.items):0;r>c&&(c=r)}return c+1}function a(s){return String(s??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}export const menuLocationsView={templateUrl:"/admin/js/templates/menu-locations.html",async onMount(s){const c=E.loader(s.get(0),{type:"dots"});let l,r,p,u;try{[l,r,p]=await Promise.all([i.menuLocations.registry().catch(()=>[]),i.menuLocations.get().catch(()=>({})),i.menus.list().catch(()=>[])]),u=await Promise.all(p.map(e=>i.menus.get(e.slug).catch(()=>null)))}finally{c.destroy()}const m={};for(const e of u)e&&e.slug&&(m[e.slug]=d(e.items||[]));const g=(l||[]).map(e=>({slot:e.slot,label:e.label,source:e.source,description:e.description,maxDepth:e.maxDepth,menu:r[e.slot]||""}));T.create("#ml-table",{pageSize:25,data:g,emptyMessage:"No menu slots registered.",columns:[{key:"slot",title:"Slot",render:e=>`<code>${a(e)}</code>`},{key:"label",title:"Label",render:e=>a(e)},{key:"source",title:"Source",render:e=>e?`<span class="badge badge-secondary">${a(e)}</span>`:""},{key:"description",title:"Description",render:e=>e?`<span class="text-muted">${a(e)}</span>`:""},{key:"menu",title:"Mapped menu",render:(e,t)=>{const n=['<option value="">- none -</option>'].concat(p.map(o=>{const h=o.slug===t.menu?" selected":"",y=a(o.name||o.slug);return`<option value="${a(o.slug)}"${h}>${y}</option>`}));return`<select class="form-select ml-select" data-slot="${a(t.slot)}">${n.join("")}</select>`}},{key:"_warning",title:"",render:(e,t)=>{if(!t.menu||t.maxDepth==null)return"";const n=m[t.menu]||0;if(n>t.maxDepth){const o=`This slot supports max depth ${t.maxDepth}; menu is depth ${n}`;return`<span class="badge badge-warning" data-tooltip="${a(o)}">&#9888; depth</span>`}return""}}]}),Domma.icons.scan("#ml-table"),document.querySelectorAll("#ml-table [data-tooltip]").forEach(e=>{E.tooltip(e,{content:e.getAttribute("data-tooltip"),position:"top"})}),s.find("#ml-save").on("click",async()=>{const e={};s.find(".ml-select").each(function(){const t=$(this).data("slot"),n=$(this).val();t&&n&&(e[t]=n)});try{await i.menuLocations.save(e),E.toast("Locations saved.",{type:"success"})}catch(t){E.toast(`Save failed: ${t.message||t}`,{type:"error"})}})}};
+import{api as g}from"../api.js";import{addBannerAction as N}from"../lib/plugin-chrome.js";import{helpPopovers as te}from"../lib/help-popover.js";import{openMenuAt as V,sidebarCount as ne}from"../lib/tool-kit.js";import{depthOfItems as ae,locationRows as se,locationsPayload as oe,locationsSnapshot as w}from"../lib/menu-editor-arrange.js";const O=/^\/menu-locations\/?(\?.*)?$/,v="menu-locations.draft",le=`
+<div class="mlx-row" data-slot="{{slot}}" tabindex="0" data-bind-class="(changed ? 'is-changed ' : '') + (tooDeep || missing ? 'is-bad' : '')">
+    <span class="mlx-main">
+        <strong>{{label}}</strong>
+        <small><code>{{slot}}</code> <span data-bind-hidden="!source">\xB7 {{source}}</span></small>
+        <small class="mlx-desc" data-bind-hidden="!description">{{description}}</small>
+    </span>
+    <span class="mlx-chips">
+        <span class="mlx-chip is-warn" data-bind-hidden="!tooDeep" data-bind-text="depthText"></span>
+        <span class="mlx-chip is-danger" data-bind-hidden="!missing">Menu not found</span>
+        <span class="mlx-chip" data-bind-hidden="!empty" data-bind-text="emptyText"></span>
+        <span class="mlx-chip is-changed" data-bind-hidden="!changed">Changed</span>
+    </span>
+    <select class="form-input mlx-select" aria-label="Menu for {{label}}"></select>
+    <button type="button" class="mlx-kebab" aria-label="Actions for {{label}}" title="Actions">\u22EE</button>
+</div>`,ie=o=>String(o??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;");let u=null,W=!1;function re(){W||!window.R?.use||(W=!0,R.use((o,p,s)=>!(O.test(p?.path||"")&&!O.test(o?.path||""))||!u?.dirty()?s():E.confirm("You have unsaved menu locations. Leave anyway? They are kept as a draft for your next visit.").then(d=>{d?s():history.replaceState(null,"","#/menu-locations")})),M.subscribe("router:afterChange",({to:o}={})=>{if(u&&!O.test(o?.path||"")){const p=u;u=null,p.dispose()}}))}export const menuLocationsView={templateUrl:"/admin/js/templates/menu-locations.html",async onMount(o){if(re(),u){const e=u;u=null,e.dispose()}const p=[],s=e=>(p.push(e),e);let k=!1;const d=o.get(0).querySelector(".mlx")||o.get(0),f=()=>!k&&d.isConnected,x=M.observable([]),L=M.observable([]),P=M.observable({}),l=M.observable({}),a=M.observable({}),C=M.observable(!0),$=M.observable(""),y=M.observable(!1),h=M.computed(()=>w(a.value)!==w(l.value)),b=M.observable([]);s(M.effect(()=>{b.value=se(x.value,a.value,l.value,L.value,P.value)}));const _=M.computed(()=>{const e=b.value;return`${e.filter(n=>!n.empty).length} of ${e.length} slot${e.length===1?"":"s"} have a menu`});async function z(){try{const[e,t,n]=await Promise.all([g.menuLocations.registry(),g.menuLocations.get().catch(()=>({})),g.menus.list().catch(()=>[])]),r=await Promise.all((n||[]).map(c=>g.menus.get(c.slug).catch(()=>null)));if(!f())return;x.value=Array.isArray(e)?e:[],L.value=n||[],P.value=Object.fromEntries(r.filter(Boolean).map(c=>[c.slug,ae(c.items||[])])),l.value={...t||{}},a.value={...t||{}},$.value=""}catch(e){$.value=`Could not load the locations: ${e.message||e}`}finally{C.value=!1}}const A=(e,t)=>{a.value={...a.peek(),[e]:t||""}};async function T(){if(!(y.peek()||C.peek())){y.value=!0;try{const e=oe(a.peek(),x.peek());if(await g.menuLocations.save(e),!f())return;l.value={...e},a.value={...e};try{S.remove?S.remove(v):S.set(v,null)}catch{}ne("#/menus"),E.toast("Locations saved.",{type:"success"})}catch(e){E.toast(`Save failed: ${e.message||e}`,{type:"error"})}finally{y.value=!1}}}async function G(){!h.peek()||!await E.confirm("Throw away the changes you have not saved?")||(a.value={...l.peek()})}const i=d.querySelector(".mlx-list");i.innerHTML=le;const J=M.applyBindings({rows:b,loading:C,loadError:$,saving:y,dirty:h,summary:_},d,{methods:{save:()=>T(),discard:()=>G()}});s(()=>J.dispose()),s(te(d,{position:"bottom"}));const Q=()=>{const e=[["","- none -"],...L.peek().map(t=>[t.slug,t.name||t.slug])];for(const t of i.querySelectorAll(".mlx-select")){const n=t.closest(".mlx-row")?.dataset.slot;if(!t.options.length)for(const[c,ee]of e)t.add(new Option(ee,c));const r=a.peek()[n]||"";r&&![...t.options].some(c=>c.value===r)&&t.add(new Option(`${r} (missing)`,r)),t.value!==r&&(t.value=r)}};s(M.effect(()=>{b.value,requestAnimationFrame(()=>{f()&&Q()})}));const q=e=>{e.target.matches(".mlx-select")&&A(e.target.closest(".mlx-row").dataset.slot,e.target.value)},K=e=>{const t=a.peek()[e];t&&(location.hash=`#/menus/edit/${encodeURIComponent(t)}`)},U=(e,t)=>navigator.clipboard?.writeText(e).then(()=>E.toast(`${t} copied.`,{type:"success"}),()=>E.toast(e,{type:"info",duration:8e3})),X=e=>{const t=b.peek().find(n=>n.slot===e);return t?[{header:t.label},{label:t.menu?`Edit "${t.menuName}"`:"Edit its menu",icon:"edit",disabled:!t.menu||t.missing,action:()=>K(e)},{label:"Clear this slot",icon:"x-circle",disabled:!t.menu,action:()=>A(e,"")},{label:"Undo the change",icon:"rotate-ccw",disabled:!t.changed,action:()=>A(e,l.peek()[e]||"")},{type:"divider"},{label:"Copy slot name",icon:"copy",action:()=>U(e,"Slot name")},{label:"Copy [menu location] shortcode",icon:"code",action:()=>U(`[menu location="${e}" /]`,"Shortcode")}]:[]},Z=E.contextMenu(i,{cursor:"glyph",match:".mlx-row",inherit:!1,density:"compact",items:e=>X(e.dataset.slot)});s(()=>Z?.destroy?.());const Y=e=>{const t=e.target.closest(".mlx-row");if(!t)return;const n=e.target.closest(".mlx-kebab");if(n){V(n);return}e.target.closest("select")||K(t.dataset.slot)},B=e=>{const t=e.target.closest(".mlx-row");t&&(e.key==="F10"&&e.shiftKey?(e.preventDefault(),V(t)):e.key==="Enter"&&e.target===t&&K(t.dataset.slot))};i.addEventListener("change",q),i.addEventListener("click",Y),i.addEventListener("keydown",B),s(()=>{i.removeEventListener("change",q),i.removeEventListener("click",Y),i.removeEventListener("keydown",B)}),N(o,{id:"menu-locations-back",icon:"arrow-left",title:"All menus",onClick:()=>{location.hash="#/menus"}}),N(o,{id:"menu-locations-save",icon:"save",title:"Save (Ctrl+S)",onClick:()=>T()});const F=e=>{!(e.ctrlKey||e.metaKey)||e.key!=="s"||(e.preventDefault(),e.stopImmediatePropagation(),T())};document.addEventListener("keydown",F,!0),s(()=>document.removeEventListener("keydown",F,!0));const H=()=>{if(h.peek())try{S.set(v,{map:a.peek(),base:w(l.peek()),at:new Date().toISOString()})}catch{}},j=e=>{h.peek()&&(H(),e.preventDefault(),e.returnValue="")};if(window.addEventListener("beforeunload",j),s(()=>window.removeEventListener("beforeunload",j)),u={dirty:()=>h.peek(),dispose(){k=!0,H(),p.splice(0).reverse().forEach(e=>{try{e()}catch{}})}},I.scan(d),await z(),!f())return;let m=null;try{m=S.get(v)}catch{}if(m?.map){try{S.remove?S.remove(v):S.set(v,null)}catch{}const e=m.base&&m.base!==w(l.peek()),t=m.at?` (${D(m.at).format("D MMM HH:mm")})`:"",n=e?`You left unsaved menu locations${t}, but the saved locations have changed since. Restore your version anyway?`:`You left unsaved menu locations${t}. Restore them?`;await E.confirm(ie(n))&&f()&&(a.value={...l.peek(),...m.map})}}};