@hazem3500/komo 0.9.35 → 0.9.37

package/dist/design-mode.js

@@ -1 +1 @@
-import{a as e,b as t,e as n,f as i,h as o}from"./chunk-4JLPHVWU.js";import{a as s,b as a}from"./chunk-RPY7OOOR.js";import{a as d}from"./chunk-53M6AOAX.js";import{j as r,k as l}from"./chunk-PLSWBSSX.js";var c=(e,t)=>Object.assign(r("button",e,t),{type:"button"}),p=e=>"function"==typeof matchMedia&&matchMedia(e).matches,g=()=>p("(prefers-reduced-motion: reduce)");function u(u){let h=r("style");h.textContent='.design-outline{position:fixed;z-index:1;pointer-events:none;box-sizing:border-box;outline:2px solid var(--accent,#bda6ef);outline-offset:2px;transition:opacity 80ms ease}.design-outline[data-kind=hover]{outline-style:dashed;opacity:.8}.design-outline--prospective[data-kind=hover]{opacity:.55}.design-inspector{position:absolute;inset:0;z-index:9;display:flex;flex-direction:column;overflow:hidden;color:#e9e6e1;background:#0d0d0d;border-radius:inherit;font:12px/1.4 -apple-system,BlinkMacSystemFont,Inter,Segoe UI,sans-serif;color-scheme:dark;opacity:0;translate:0 6px;pointer-events:none;transition:opacity .15s var(--ease-smooth-out),translate .25s var(--ease-smooth-out)}.design-inspector[hidden]{display:none}:host([data-sidebar="background"]) .design-inspector{position:fixed;inset:0 0 0 auto;width:380px;border-radius:0}:host([data-sidebar="edge"]) .design-inspector__heading{cursor:grab;touch-action:none;padding-top:22px}:host(.design-active[data-sidebar="edge"]) .edge-sidebar .edge-sidebar-grip{z-index:10;opacity:1!important}.design-inspector[data-state=active]{opacity:1;translate:0 0;pointer-events:auto}.design-inspector[data-state=closing]{opacity:0;translate:0 4px}.design-inspector button{cursor:pointer}.design-inspector__heading{flex:none;display:flex;align-items:center;gap:4px;min-height:54px;padding:0 8px 0 12px}.design-inspector__identity{min-width:0;flex:1;display:flex;align-items:baseline;gap:6px;white-space:nowrap}.design-inspector__parent{flex:none;max-width:35%;overflow:hidden;text-overflow:ellipsis;margin-left:-6px;padding:2px 6px;border-radius:7px;color:#909090;font-size:15px;font-weight:500}.design-inspector__parent:after{content:"/";margin-left:6px;color:#555}.design-inspector__target{flex:none;max-width:60%;overflow:hidden;text-overflow:ellipsis;color:#fff;font-weight:600;font-size:15px}.design-inspector__heading small{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#909090;font-size:13px}.design-inspector__back,.design-inspector__close,.design-inspector__fold,.design-inspector__actions button{display:grid;place-items:center;min-width:28px;height:28px;border-radius:7px;color:#909090}.design-inspector__back,.design-inspector__close,.design-inspector__fold{flex:none}.design-inspector__back svg,.design-inspector__close svg,.design-inspector__fold svg,.design-inspector__actions svg{width:16px;height:16px}.design-inspector__back svg{rotate:90deg}.design-inspector__back[hidden]{display:none}.design-inspector__back:hover,.design-inspector__parent:hover,.design-inspector__close:hover,.design-inspector__fold:hover,.design-inspector__actions button:hover:not(:disabled){background:#161616;color:#eee}.design-inspector__fold{display:none}.design-inspector__fold svg{transition:rotate .25s var(--ease-smooth-out)}.design-inspector[data-folded] .design-inspector__fold svg{rotate:180deg}.design-inspector[data-folded]>:not(.design-inspector__heading){display:none}.design-inspector__controls{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}:host([data-sidebar="edge"]) .edge-sidebar[data-design-empty]:not([data-morphing]){height:auto!important}:host([data-sidebar="edge"]) [data-design-empty]>.design-inspector{position:relative;inset:auto}:host([data-sidebar="edge"]) [data-design-empty]:not([data-morphing])>.toolbar{position:absolute}.design-inspector[data-empty] .design-inspector__identity{visibility:hidden}.design-inspector[data-empty] .design-inspector__controls{display:grid;place-items:center}.design-inspector[data-empty] .design-inspector__bar:not([data-changes],[data-message]){display:none}.design-inspector__bar{flex:none;display:flex;align-items:center;gap:8px;min-height:56px;padding:0 12px;border-top:1px solid #ffffff0d;color:#909090;font-size:12px}.design-inspector__actions{display:flex;align-items:center;gap:2px;margin-left:auto}.design-inspector__actions button:disabled{cursor:default;opacity:.35}.design-inspector__actions button:last-child{min-height:34px;margin-left:6px;padding:0 14px;border-radius:8px;background:var(--accent,#bda6ef);color:#211b2d;font-size:12px;font-weight:500}.design-inspector__actions button:last-child:hover:not(:disabled){background:var(--accent,#bda6ef);color:#211b2d;filter:brightness(1.08)}.design-inspector :focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:2px}@media(max-width:520px){.design-inspector{position:fixed;inset:auto 12px calc(12px + env(safe-area-inset-bottom,0px));max-height:min(58dvh,560px);border-radius:24px;box-shadow:0 -1px #ffffff24,0 16px 48px #0005;transition:translate .32s cubic-bezier(.22,1,.36,1),scale .32s cubic-bezier(.22,1,.36,1),opacity .15s ease;transform-origin:bottom center}.design-inspector__heading{height:52px;padding-left:18px}.design-inspector__fold{display:grid}.design-inspector[data-empty] .design-inspector__identity{visibility:visible}.design-inspector .design-field{height:34px}}@media(prefers-reduced-motion:reduce){.design-outline,.design-inspector,.design-inspector__fold svg,.design-inspector__status{transition:none;animation:none}}\n';let m=null,f=import("./design-panel-7XSEHKNG.js").then(e=>{h.textContent+=e.designPanelStyles,m=e},()=>{D.textContent="Design controls unavailable · try again"}),b=r("aside","design-inspector");b.setAttribute("role","dialog"),b.setAttribute("aria-label","Design mode inspector"),b.setAttribute("aria-hidden","true"),b.hidden=!0;let v=r("div","design-outline");v.setAttribute("aria-hidden","true");let x=r("div","design-outline design-outline--prospective");x.setAttribute("aria-hidden","true"),x.dataset.kind="hover",x.hidden=!0;let y=r("div","design-inspector__heading"),_=null,w=c("design-inspector__back");w.hidden=!0,w.append(l("chevron")),w.addEventListener("click",()=>_?.run());let E=c("design-inspector__parent");E.hidden=!0;let k=r("span","design-inspector__target"),C=r("small"),L=c("design-inspector__close");L.setAttribute("aria-label","Exit design mode"),L.append(l("close"));let A=c("design-inspector__fold");A.append(l("chevron"));let P=r("div","design-inspector__identity");P.append(E,k,C),y.append(w,P,A,L);let T=r("div","design-inspector__controls"),M=r("div","design-inspector__bar"),S=r("span","design-inspector__count");S.title="Runtime preview · Undo, Reset or reload to restore";let D=r("p","design-inspector__status");D.setAttribute("role","status");let R=r("div","design-inspector__actions"),z=e=>{let t=c("design-inspector__tool");return t.dataset.tip=e,t.setAttribute("aria-label",e),t},H=z("Undo"),B=z("Reset"),K=z("Copy CSS");K.append(l("copy"));let I=c("","Comment"),j=c("design-text-edit","Edit text");j.title="Edit text",j.setAttribute("aria-label","Edit selected text inline"),R.append(H,B,K,I);let O=r("div","design-inspector__compare");O.setAttribute("role","group"),O.setAttribute("aria-label","Compare with the page");let F=["Before","After"].map((e,t)=>{let n=c("",e);return n.dataset.tip=`${e} · ${t?"→":"←"} or B`,n.setAttribute("aria-pressed",String(!!t)),n.addEventListener("click",()=>xe(!t)),O.append(n),n});M.append(S,O,D,R);let $,U=r("div");U.hidden=!0,b.append(y,U,T,M),u.root.append(h,v,x),(u.panelRoot??u.root).append(b);let V,W=!1,X=0,Y=null,q=null,N=()=>u.page?.()??location.pathname,J=N(),G=new Map,Q=null,Z=0,ee=0,te=null,ne="",ie=null,oe=null,se=new Map,ae=new WeakSet,de=new Map,re=new AbortController,le=()=>import("./design-export-44WHYCLI.js"),ce=e=>{V??=le().then(({footerTips:t})=>t(M,u.root,re.signal,e),()=>{V=void 0})};M.addEventListener("pointerover",ce),M.addEventListener("focusin",ce);let pe=new Set,ge=[],ue=e(ge);function he(e,t,i=e.style.getPropertyValue(t),o=e.style.getPropertyPriority(t)){let s=se.get(e);s||(se.set(e,s=new Map),e.hasAttribute("style")||ae.add(e)),s.has(t)||s.set(t,ie?.originalDesignTokenStyle(e,t)??{...n(e,t),value:i,priority:o})}function me(e,t){let n=de.get(e);n||de.set(e,n=new Map);let i=e.style.getPropertyValue(t);i===(se.get(e)?.get(t)?.value??"")?n.delete(t):n.set(t,i),n.size||de.delete(e),Ae(Y,"selected")}let fe=0;new MutationObserver(()=>{let e=D.textContent??"";D.title=e,M.toggleAttribute("data-message",!!e),clearTimeout(fe),e&&(fe=window.setTimeout(function e(){Q?.element?fe=window.setTimeout(e,2600):D.textContent=""},2600))}).observe(D,{childList:!0,characterData:!0,subtree:!0});let be,ve=!1;function xe(e,t=!0){if(e===ve)return;e&&Q?.element&&Be(),ve=e,e&&ie?.showDesignBefore(!0);let n=t&&!g();for(let[t,i]of se){let s=de.get(t);o(t,i.keys(),()=>{for(let n of i.keys()){let i=se.get(t)?.get(n);e?ye(t,n,i):s?.has(n)&&t.style.setProperty(n,s.get(n),i?.priority)}},n,ae.has(t))}Q?.showBefore(e,t),e||ie?.showDesignBefore(!1),F.forEach((t,n)=>t.setAttribute("aria-pressed",String(!n===e))),b.toggleAttribute("data-before",e),He()}function ye(e,n,o){t(e,n,o),ae.has(e)&&i(e)}function _e(e,t,n){if(!Y||(e.setAttribute("aria-invalid",String(null===n)),null===n))return;he(Y,t);let i=ie?.noteDesignTokenOverride(Y,t,n);ue.override(e,i?.undo),Y.style.setProperty(t,n,i?.priority??se.get(Y)?.get(t)?.priority),me(Y,t),He()}function we(e,t,n=!0){Y&&(ue.commit(e,Y,t,n),He())}function Ee(){if(Oe(),T.replaceChildren(),ke(),!Y)return $&&T.append($.empty),k.textContent="Select an element",C.textContent="",void(E.hidden=!0);let e=`${Y.tagName.toLowerCase()}${Y.id?`#${Y.id}`:""}`;k.textContent=e,C.textContent=Y instanceof HTMLIFrameElement?"Frame only · contents are isolated":Y.classList.length?`.${[...Y.classList].slice(0,2).join(".")}`:"";let t=Y.parentElement;E.hidden=!t||t===document.body||t===document.documentElement,E.textContent=t?.tagName.toLowerCase()??"",E.setAttribute("aria-label",`Select parent ${E.textContent}`);let i=Y,o=m;o?(o.renderPanel(T,{element:i,changed:de.get(i),collapsed:pe,editText:j,begin:(e,t)=>ue.begin(e,n(i,t)),apply:_e,commit:we,cancel(e,t){ue.cancel(e,i,t),me(i,t),He()},rerender:Ee}),(u.design||i.closest("[data-komo-inspectable], [data-komo-design-tokens]"))&&(oe??=import("./react-props-panel-YVEKJH4C.js").then(e=>ie=e).catch(e=>{throw oe=null,e}),oe.then(e=>{if(!W||Y!==i||T.querySelector(".design-react-group, .design-theme-group"))return;let t=u.root;e.attachThemeSwitcher(T,u.design,()=>Se(i),t);let n=e=>{let t=()=>{for(let e of se.get(i)?.keys()??[])me(i,e)};e&&ge.push({element:i,undo:()=>{e(),t()}}),t(),He()},s=e.createReactPropsPanel(i,n,t,Se,u.design,Ee);s&&T.prepend(s),e.attachStyleTokenControls(i,o.fields,T,(e,t,n)=>{he(i,e.property,n),me(i,e.property),ue.begin(t,{value:n,priority:i.style.getPropertyPriority(e.property)}),we(t,e.property)},t,o.valueFor,o.toHex,u.design,n);let a=e.createDesignThemePanel(i,o,He,t);a&&T.append(a)}).catch(()=>{}))):f.then(()=>{W&&Y===i&&Ee()})}function ke(){b.toggleAttribute("data-empty",I.hidden=!Y),$&&($.hint.hidden=!Y),b.parentElement?.toggleAttribute("data-design-empty",W&&!Y);let e=[...G.keys()].filter(Ce);U.hidden=!!Y||!e.length,$&&($.pending.hidden=U.hidden),$?.update(e.length,e.some(e=>e.isConnected&&G.get(e)===N()))}function Ce(e){return!!(de.get(e)?.size||e instanceof HTMLElement&&Q?.hasChanges(e)||ie?.hasReactPropChanges(e)||ie?.hasDesignTokenEdit(e))}function Le(){Be(),Me?.disconnect(),Y=null,q=null,v.hidden=x.hidden=!0,Ee(),He()}function Ae(e,t,n=!1,i=v){if(!W||!e?.isConnected)return void(i.hidden=!0);let o=e.getBoundingClientRect();if(o.width&&o.height){if(i.hidden=!1,i.dataset.kind=t,n&&(e!==te||t!==ne)){te=e,ne=t,clearTimeout(ee);let n=b.getBoundingClientRect(),i=e=>o.left<e+n.width&&o.right>e&&o.top<n.bottom&&o.bottom>n.top;u.flip&&n.width&&i(n.left)&&!i(document.documentElement.clientWidth-n.right)&&(ee=window.setTimeout(u.flip,"hover"===t?350:0))}i.hidden=!d(i,o,e,u.bounds?.(e))}else i.hidden=!0}function Pe(e=!1){Ae(Y??q,Y?"selected":"hover",e),Ae(Y&&q!==Y?q:null,"hover",!1,x)}function Te(){Z||(Z=requestAnimationFrame(()=>{Z=0,Y&&(!Y.isConnected||J!==N())&&Le(),Pe()}))}let Me="function"==typeof ResizeObserver?new ResizeObserver(Te):null;function Se(e){!s(e)||!e.isConnected||u.host.contains(e)||(Q?.element&&Q.element!==e&&Be(),Me?.disconnect(),Me?.observe(e),Y=e,q=e,J=N(),G.set(e,J),Ee(),Ae(e,"selected",!0),x.hidden=!0,He())}let De=()=>p("(max-width:520px)");function Re(e){b.toggleAttribute("data-folded",e&&De()),A.setAttribute("aria-expanded",String(!b.hasAttribute("data-folded"))),A.setAttribute("aria-label",b.hasAttribute("data-folded")?"Expand inspector":"Collapse inspector")}function ze(e){Re(!1),De()&&requestAnimationFrame(()=>{let t=e.getBoundingClientRect(),n=b.getBoundingClientRect().top-12;t.top>=12&&t.bottom<=n||window.scrollBy({top:t.top-Math.max(12,(n-t.height)/2),behavior:g()?"auto":"smooth"})})}function He(){Te(),H.disabled=!ge.length&&!ie?.canUndoReactProp(Y)&&!ie?.canUndoDesignTokenEdit(Y),B.disabled=!function(){let e=Y,t=e?(de.get(e)?.size??0)+ +(e instanceof HTMLElement&&!!Q?.hasChanges(e))+ +!!ie?.hasReactPropChanges(e)||+!!ie?.hasDesignTokenEdit(e):0;return S.textContent=t?`${t} change${t>1?"s":""}`:"",M.toggleAttribute("data-changes",t>0||!H.disabled),O.hidden=!t&&!ve,t}(),K.disabled=!Y||!de.get(Y)?.size,I.disabled=!Y,j.disabled=!(!Q?.busy&&Y?.isConnected&&Y instanceof HTMLElement),j.textContent=Q?.isEditing(Y instanceof HTMLElement?Y:null)?"Done editing":"Edit text",j.setAttribute("aria-label",Q?.isEditing(Y instanceof HTMLElement?Y:null)?"Finish inline text editing":"Edit selected text inline"),ke()}function Be(e=!1){Q?.finish(e),He()}function Ke(e){!W||"Escape"!==e.key||e.defaultPrevented&&!e.composedPath().includes(u.host)||(e.preventDefault(),e.stopImmediatePropagation(),Le(),Ie(!1),u.onExit())}function Ie(e){if(e||(Oe(),Q?.finish(),W&&(be=ve,xe(!0,!1)),ie?.restoreThemes(b)),e&&!W&&void 0!==be){let e=be;be=void 0,xe(e,!1)}e&&Y&&(!Y.isConnected||J!==N())&&Le(),clearTimeout(X),X=0,W=e,ke(),e?(b.hidden=!1,b.setAttribute("aria-hidden","false"),requestAnimationFrame(()=>{W&&(b.dataset.state="active")}),v.hidden=!Y,Ee(),Re(!Y),Ae(Y,"selected"),L.focus({preventScroll:!0})):(q=null,v.hidden=x.hidden=!0,b.setAttribute("aria-hidden","true"),b.dataset.state="closing",g()?(b.hidden=!0,delete b.dataset.state):X=window.setTimeout(()=>{X=0,W||(b.hidden=!0,delete b.dataset.state)},250))}function je(){Oe(),xe(!1,!1),ie?.resetPreviews();for(let[e,t]of se)o(e,t.keys(),()=>{for(let[n,i]of t)ye(e,n,i)},!1,ae.has(e)),ae.delete(e);se.clear(),de.clear(),ge.length=0,Q?.restoreAll(),G.clear(),He()}function Oe(){u.root.dispatchEvent(new Event("komo-preview-cancel"))}function Fe(e,t){return t(e,de.get(e),t=>se.get(e)?.get(t)?.computed,ie?.tokenBoundProperties(e),[e instanceof HTMLElement?Q?.proposal(e):void 0,ie?.proposedDesignChanges(e)],ie?.designContext(e,u.design))}function $e(e){Q?.isEditing(e instanceof HTMLElement?e:null)&&Be(!0);let t=de.get(e),n=(e instanceof HTMLElement&&Q?.hasChanges(e))??!1,i=ie?.hasReactPropChanges(e)??!1,s=ie?.hasDesignTokenEdit(e)??!1;if(t?.size||n||i||s){n&&e instanceof HTMLElement&&Q?.reset(e),s&&ie?.resetDesignTokenEdits(e),o(e,t?.keys()??[],()=>{for(let n of t?.keys()??[])ye(e,n,se.get(e)?.get(n))},!1,ae.has(e)),de.delete(e),se.delete(e),ae.delete(e),G.delete(e),i&&ie?.resetReactProps(e);for(let t=ge.length-1;t>=0;t--)ge[t].element===e&&ge.splice(t,1)}}j.addEventListener("click",e=>{Q||Y&&(D.textContent="Loading inline text editor…",import("./inline-text-editor-LN5QPR3P.js").then(t=>{Q||!Y||!W||(Q=t.bindInlineTextTools({button:j,status:D,selected:()=>Y instanceof HTMLElement?Y:null,active:()=>W,onChange:He,onCommit(e){ge.push({kind:"text",element:e})}}),Q.toggle(e))}).catch(()=>{D.textContent="Inline text editing is unavailable."}))}),A.addEventListener("click",()=>Re(!b.hasAttribute("data-folded"))),E.addEventListener("click",()=>Se(Y?.parentElement??null)),L.addEventListener("click",()=>{Q?.element&&Be(),Le(),Ie(!1),u.onExit()}),H.addEventListener("click",()=>{let e=ge.pop();e?e.kind?"text"===e.kind?Y===(Q?.undo()??e.element)&&Ee():(ye(e.element,e.property,e.before),e.before.bindingUndo?.(),ie?.syncDesignTokenBinding(e.element,e.property),me(e.element,e.property),Y===e.element&&Ee(),Ae(Y??q,Y?"selected":"hover")):(e.undo(),Ee()):(Y&&(ie?.undoDesignTokenEdit(Y),ie?.undoReactProp(Y),Ee()),D.textContent="Runtime preview · Undo, Reset or reload to restore"),He(),(H.disabled?L:H).focus({preventScroll:!0})}),B.addEventListener("click",()=>{Y&&($e(Y),Ee(),Ae(Y,"selected"),He(),L.focus({preventScroll:!0}))}),K.addEventListener("click",()=>{let e=Y,t=e?de.get(e):void 0;!e||!t?.size||le().then(async({cssText:n})=>{let i=n(e,t);try{await navigator.clipboard.writeText(i),D.textContent="CSS copied"}catch{D.textContent=i}})}),I.addEventListener("click",()=>{let e=Y;e&&(Q?.isEditing(e instanceof HTMLElement?e:null)&&Be(),le().then(({designProposal:t})=>{if(!W||Y!==e||!e.isConnected)return;let n=Fe(e,t);$e(e),He(),u.onComment(e,n)},()=>{D.textContent="Comment unavailable · try again"}))});let Ue=()=>xe(!1);for(let e of[T,R,j])for(let t of["pointerdown","focusin","click"])e.addEventListener(t,Ue,!0);document.addEventListener("pointermove",function(e){if(!W)return;if(e.composedPath().includes(u.host))return q=null,void Pe();let t=a(u.targetAt(e.clientX,e.clientY),e.metaKey||e.ctrlKey);q=t&&!u.host.contains(t)?t:null,Pe(!Y)},{capture:!0,signal:re.signal}),document.addEventListener("pointerdown",function(e){if(!W||0!==e.button||e.composedPath().includes(u.host))return;let t=a(u.targetAt(e.clientX,e.clientY),e.metaKey||e.ctrlKey);!t||u.host.contains(t)||Q?.element&&(t===Q.element||Q.element.contains(t))||(Q?.element&&Be(),e.preventDefault(),e.stopImmediatePropagation(),Se(t))},{capture:!0,signal:re.signal}),document.addEventListener("click",function(e){!W||e.composedPath().includes(u.host)||(e.preventDefault(),e.stopImmediatePropagation(),Y&&ze(Y),2===e.detail&&Y?.contains(e.target)&&!j.disabled&&!Q?.element&&j.dispatchEvent(new MouseEvent("click",e)))},{capture:!0,signal:re.signal}),document.addEventListener("keydown",function(e){if(Q?.handleKey(e))return void j.focus({preventScroll:!0});let t=e.key.toLowerCase(),n=e.composedPath()[0],i=n instanceof HTMLElement&&(n.isContentEditable||n.matches("input,textarea,select"));if(!i||"Escape"!==e.key||!n.closest("[data-field-property]")){if(W&&Y&&e.altKey&&!e.ctrlKey&&!e.metaKey&&!i&&("arrowup"===t||"arrowdown"===t)){let n=("arrowup"===t?Y.parentElement:[...Y.children].find(e=>s(e)&&!e.matches("script,style,defs,title,desc,metadata")))??null;return void(s(n)&&n!==document.body&&n!==document.documentElement&&!u.host.contains(n)&&(e.preventDefault(),e.stopImmediatePropagation(),Se(n),ze(n)))}if(W&&!O.hidden&&!e.metaKey&&!e.ctrlKey&&!e.altKey&&("b"===t||"arrowleft"===t||"arrowright"===t)&&!i)return e.preventDefault(),e.stopImmediatePropagation(),void xe("b"===t?!ve:"arrowleft"===t);if(W&&!Q?.element&&("Enter"===e.key||" "===e.key)&&!e.composedPath().includes(u.host)){let t=document.activeElement;if(s(t)&&t!==document.body&&t!==document.documentElement)return e.preventDefault(),e.stopImmediatePropagation(),Se(t),void ze(t)}e.composedPath().includes(u.host)&&Ke(e)}},{capture:!0,signal:re.signal}),window.addEventListener("keydown",Ke,{signal:re.signal}),window.addEventListener("scroll",Te,{capture:!0,passive:!0,signal:re.signal}),window.addEventListener("resize",Te,{passive:!0,signal:re.signal});let Ve=new MutationObserver(()=>{W&&Y&&!Y.isConnected&&Le(),q&&!q.isConnected&&(q=null,Pe())});Ve.observe(document.body,{childList:!0,subtree:!0});let We=le().then(e=>{re.signal.aborted||($=e.selectionViews({exitKey:u.exitKey,review(){let e=[...G.keys()].reverse().find(e=>e.isConnected&&G.get(e)===N()&&Ce(e));e&&Se(e)},reset:je,proposals:()=>[...G.keys()].filter(Ce).map(t=>Fe(t,e.designProposal)),message:e=>{D.textContent=e}}),h.textContent+=$.styles,H.innerHTML=$.icons.undo,B.innerHTML=$.icons.reset,b.insertBefore($.hint,U),U.append($.pending),W?Ee():ke())},()=>{D.textContent="Selection tools unavailable · try again"});return{setActive:Ie,select:Se,clearSelection:Le,setReturnAction(e){_=e,w.hidden=!e,e&&(w.setAttribute("aria-label",e.label),w.title=e.label)},mountPanel(e){b.parentElement!==e&&(b.parentElement?.removeAttribute("data-design-empty"),e.append(b),ke())},get active(){return W},ready:Promise.all([f,We]),destroy(){Q?.finish(!0),Ie(!1),je(),clearTimeout(X),clearTimeout(fe),clearTimeout(ee),Me?.disconnect(),Ve.disconnect(),re.abort(),cancelAnimationFrame(Z),b.remove(),v.remove(),x.remove(),h.remove()}}}export{u as createDesignMode};
+import{a as e,b as t,e as n,f as i,h as o}from"./chunk-4JLPHVWU.js";import{a as s,b as a}from"./chunk-RPY7OOOR.js";import{a as d,b as r}from"./chunk-3276ZULN.js";import{j as l,k as c}from"./chunk-PLSWBSSX.js";var p=(e,t)=>Object.assign(l("button",e,t),{type:"button"}),g=e=>"function"==typeof matchMedia&&matchMedia(e).matches,u=()=>g("(prefers-reduced-motion: reduce)");function h(h){let m=l("style");m.textContent='.design-outline{position:fixed;z-index:1;pointer-events:none;box-sizing:border-box;outline:2px solid var(--accent,#bda6ef);outline-offset:2px;transition:opacity 80ms ease}.design-outline[data-kind=hover]{outline-style:dashed;opacity:.8}.design-outline--prospective[data-kind=hover]{opacity:.55}.design-inspector{position:absolute;inset:0;z-index:9;display:flex;flex-direction:column;overflow:hidden;color:#e9e6e1;background:#0d0d0d;border-radius:inherit;font:12px/1.4 -apple-system,BlinkMacSystemFont,Inter,Segoe UI,sans-serif;color-scheme:dark;opacity:0;translate:0 6px;pointer-events:none;transition:opacity .15s var(--ease-smooth-out),translate .25s var(--ease-smooth-out)}.design-inspector[hidden]{display:none}:host([data-sidebar="background"]) .design-inspector{position:fixed;inset:0 0 0 auto;width:380px;border-radius:0}:host([data-sidebar="edge"]) .design-inspector__heading{cursor:grab;touch-action:none;padding-top:22px}:host(.design-active[data-sidebar="edge"]) .edge-sidebar .edge-sidebar-grip{z-index:10;opacity:1!important}.design-inspector[data-state=active]{opacity:1;translate:0 0;pointer-events:auto}.design-inspector[data-state=closing]{opacity:0;translate:0 4px}.design-inspector button{cursor:pointer}.design-inspector__heading{flex:none;display:flex;align-items:center;gap:4px;min-height:54px;padding:0 8px 0 12px}.design-inspector__identity{min-width:0;flex:1;display:flex;align-items:baseline;gap:6px;white-space:nowrap}.design-inspector__parent{flex:none;max-width:35%;overflow:hidden;text-overflow:ellipsis;margin-left:-6px;padding:2px 6px;border-radius:7px;color:#909090;font-size:15px;font-weight:500}.design-inspector__parent:after{content:"/";margin-left:6px;color:#555}.design-inspector__target{flex:none;max-width:60%;overflow:hidden;text-overflow:ellipsis;color:#fff;font-weight:600;font-size:15px}.design-inspector__heading small{min-width:0;overflow:hidden;text-overflow:ellipsis;color:#909090;font-size:13px}.design-inspector__back,.design-inspector__close,.design-inspector__fold,.design-inspector__actions button{display:grid;place-items:center;min-width:28px;height:28px;border-radius:7px;color:#909090}.design-inspector__back,.design-inspector__close,.design-inspector__fold{flex:none}.design-inspector__back svg,.design-inspector__close svg,.design-inspector__fold svg,.design-inspector__actions svg{width:16px;height:16px}.design-inspector__back svg{rotate:90deg}.design-inspector__back[hidden]{display:none}.design-inspector__back:hover,.design-inspector__parent:hover,.design-inspector__close:hover,.design-inspector__fold:hover,.design-inspector__actions button:hover:not(:disabled){background:#161616;color:#eee}.design-inspector__fold{display:none}.design-inspector__fold svg{transition:rotate .25s var(--ease-smooth-out)}.design-inspector[data-folded] .design-inspector__fold svg{rotate:180deg}.design-inspector[data-folded]>:not(.design-inspector__heading){display:none}.design-inspector__controls{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin}:host([data-sidebar="edge"]) .edge-sidebar[data-design-empty]:not([data-morphing]){height:auto!important}:host([data-sidebar="edge"]) [data-design-empty]>.design-inspector{position:relative;inset:auto}:host([data-sidebar="edge"]) [data-design-empty]:not([data-morphing])>.toolbar{position:absolute}.design-inspector[data-empty] .design-inspector__identity{visibility:hidden}.design-inspector[data-empty] .design-inspector__controls{display:grid;place-items:center}.design-inspector[data-empty] .design-inspector__bar:not([data-changes],[data-message]){display:none}.design-inspector__bar{flex:none;display:flex;align-items:center;gap:8px;min-height:56px;padding:0 12px;border-top:1px solid #ffffff0d;color:#909090;font-size:12px}.design-inspector__actions{display:flex;align-items:center;gap:2px;margin-left:auto}.design-inspector__actions button:disabled{cursor:default;opacity:.35}.design-inspector__actions button:last-child{min-height:34px;margin-left:6px;padding:0 14px;border-radius:8px;background:var(--accent,#bda6ef);color:#211b2d;font-size:12px;font-weight:500}.design-inspector__actions button:last-child:hover:not(:disabled){background:var(--accent,#bda6ef);color:#211b2d;filter:brightness(1.08)}.design-inspector :focus-visible{outline:2px solid var(--accent,#bda6ef);outline-offset:2px}@media(max-width:520px){.design-inspector{position:fixed;inset:auto 12px calc(12px + env(safe-area-inset-bottom,0px));max-height:min(58dvh,560px);border-radius:24px;box-shadow:0 -1px #ffffff24,0 16px 48px #0005;transition:translate .32s cubic-bezier(.22,1,.36,1),scale .32s cubic-bezier(.22,1,.36,1),opacity .15s ease;transform-origin:bottom center}.design-inspector__heading{height:52px;padding-left:18px}.design-inspector__fold{display:grid}.design-inspector[data-empty] .design-inspector__identity{visibility:visible}.design-inspector .design-field{height:34px}}@media(prefers-reduced-motion:reduce){.design-outline,.design-inspector,.design-inspector__fold svg,.design-inspector__status{transition:none;animation:none}}\n';let f=null,b=import("./design-panel-7XSEHKNG.js").then(e=>{m.textContent+=e.designPanelStyles,f=e},()=>{R.textContent="Design controls unavailable · try again"}),v=l("aside","design-inspector");v.setAttribute("role","dialog"),v.setAttribute("aria-label","Design mode inspector"),v.setAttribute("aria-hidden","true"),v.hidden=!0;let x=l("div","design-outline");x.setAttribute("aria-hidden","true");let y=l("div","design-outline design-outline--prospective");y.setAttribute("aria-hidden","true"),y.dataset.kind="hover",y.hidden=!0;let _=l("div","design-inspector__heading"),w=null,E=p("design-inspector__back");E.hidden=!0,E.append(c("chevron")),E.addEventListener("click",()=>w?.run());let k=p("design-inspector__parent");k.hidden=!0;let C=l("span","design-inspector__target"),L=l("small"),P=p("design-inspector__close");P.setAttribute("aria-label","Exit design mode"),P.append(c("close"));let T=p("design-inspector__fold");T.append(c("chevron"));let A=l("div","design-inspector__identity");A.append(k,C,L),_.append(E,A,T,P);let S=l("div","design-inspector__controls"),M=l("div","design-inspector__bar"),D=l("span","design-inspector__count");D.title="Runtime preview · Undo, Reset or reload to restore";let R=l("p","design-inspector__status");R.setAttribute("role","status");let z=l("div","design-inspector__actions"),H=e=>{let t=p("design-inspector__tool");return t.dataset.tip=e,t.setAttribute("aria-label",e),t},B=H("Undo"),K=H("Reset"),I=H("Copy CSS");I.append(c("copy"));let j=p("","Comment"),F=p("design-text-edit","Edit text");F.title="Edit text",F.setAttribute("aria-label","Edit selected text inline"),z.append(B,K,I,j);let U=l("div","design-inspector__compare");U.setAttribute("role","group"),U.setAttribute("aria-label","Compare with the page");let $=["Before","After"].map((e,t)=>{let n=p("",e);return n.dataset.tip=`${e} · ${t?"→":"←"} or B`,n.setAttribute("aria-pressed",String(!!t)),n.addEventListener("click",()=>ye(!t)),U.append(n),n});M.append(D,U,R,z);let O,N=l("div");N.hidden=!0,v.append(_,N,S,M),h.root.append(m,x,y),(h.panelRoot??h.root).append(v);let V,W=!1,Y=0,q=null,X=null,J=()=>h.page?.()??location.pathname,G=J(),Q=new Map,Z=null,ee=0,te=0,ne=null,ie="",oe=null,se=null,ae=new Map,de=new WeakSet,re=new Map,le=new AbortController,ce=()=>import("./design-export-44WHYCLI.js"),pe=e=>{V??=ce().then(({footerTips:t})=>t(M,h.root,le.signal,e),()=>{V=void 0})};M.addEventListener("pointerover",pe),M.addEventListener("focusin",pe);let ge=new Set,ue=[],he=e(ue);function me(e,t,i=e.style.getPropertyValue(t),o=e.style.getPropertyPriority(t)){let s=ae.get(e);s||(ae.set(e,s=new Map),e.hasAttribute("style")||de.add(e)),s.has(t)||s.set(t,oe?.originalDesignTokenStyle(e,t)??{...n(e,t),value:i,priority:o})}function fe(e,t){let n=re.get(e);n||re.set(e,n=new Map);let i=e.style.getPropertyValue(t);i===(ae.get(e)?.get(t)?.value??"")?n.delete(t):n.set(t,i),n.size||re.delete(e),Te(q,"selected")}let be=0;new MutationObserver(()=>{let e=R.textContent??"";R.title=e,M.toggleAttribute("data-message",!!e),clearTimeout(be),e&&(be=window.setTimeout(function e(){Z?.element?be=window.setTimeout(e,2600):R.textContent=""},2600))}).observe(R,{childList:!0,characterData:!0,subtree:!0});let ve,xe=!1;function ye(e,t=!0){if(e===xe)return;e&&Z?.element&&Ke(),xe=e,e&&oe?.showDesignBefore(!0);let n=t&&!u();for(let[t,i]of ae){let s=re.get(t);o(t,i.keys(),()=>{for(let n of i.keys()){let i=ae.get(t)?.get(n);e?_e(t,n,i):s?.has(n)&&t.style.setProperty(n,s.get(n),i?.priority)}},n,de.has(t))}Z?.showBefore(e,t),e||oe?.showDesignBefore(!1),$.forEach((t,n)=>t.setAttribute("aria-pressed",String(!n===e))),v.toggleAttribute("data-before",e),Be()}function _e(e,n,o){t(e,n,o),de.has(e)&&i(e)}function we(e,t,n){if(!q||(e.setAttribute("aria-invalid",String(null===n)),null===n))return;me(q,t);let i=oe?.noteDesignTokenOverride(q,t,n);he.override(e,i?.undo),q.style.setProperty(t,n,i?.priority??ae.get(q)?.get(t)?.priority),fe(q,t),Be()}function Ee(e,t,n=!0){q&&(he.commit(e,q,t,n),Be())}function ke(){if(Ue(),S.replaceChildren(),Ce(),!q)return O&&S.append(O.empty),C.textContent="Select an element",L.textContent="",void(k.hidden=!0);let e=`${q.tagName.toLowerCase()}${q.id?`#${q.id}`:""}`;C.textContent=e,L.textContent=q instanceof HTMLIFrameElement?"Frame only · contents are isolated":q.classList.length?`.${[...q.classList].slice(0,2).join(".")}`:"";let t=q.parentElement;k.hidden=!t||t===document.body||t===document.documentElement,k.textContent=t?.tagName.toLowerCase()??"",k.setAttribute("aria-label",`Select parent ${k.textContent}`);let i=q,o=f;o?(o.renderPanel(S,{element:i,changed:re.get(i),collapsed:ge,editText:F,begin:(e,t)=>he.begin(e,n(i,t)),apply:we,commit:Ee,cancel(e,t){he.cancel(e,i,t),fe(i,t),Be()},rerender:ke}),(h.design||i.closest("[data-komo-inspectable], [data-komo-design-tokens]"))&&(se??=import("./react-props-panel-YVEKJH4C.js").then(e=>oe=e).catch(e=>{throw se=null,e}),se.then(e=>{if(!W||q!==i||S.querySelector(".design-react-group, .design-theme-group"))return;let t=h.root;e.attachThemeSwitcher(S,h.design,()=>De(i),t);let n=e=>{let t=()=>{for(let e of ae.get(i)?.keys()??[])fe(i,e)};e&&ue.push({element:i,undo:()=>{e(),t()}}),t(),Be()},s=e.createReactPropsPanel(i,n,t,De,h.design,ke);s&&S.prepend(s),e.attachStyleTokenControls(i,o.fields,S,(e,t,n)=>{me(i,e.property,n),fe(i,e.property),he.begin(t,{value:n,priority:i.style.getPropertyPriority(e.property)}),Ee(t,e.property)},t,o.valueFor,o.toHex,h.design,n);let a=e.createDesignThemePanel(i,o,Be,t);a&&S.append(a)}).catch(()=>{}))):b.then(()=>{W&&q===i&&ke()})}function Ce(){v.toggleAttribute("data-empty",j.hidden=!q),O&&(O.hint.hidden=!q),v.parentElement?.toggleAttribute("data-design-empty",W&&!q);let e=[...Q.keys()].filter(Le);N.hidden=!!q||!e.length,O&&(O.pending.hidden=N.hidden),O?.update(e.length,e.some(e=>e.isConnected&&Q.get(e)===J()))}function Le(e){return!!(re.get(e)?.size||e instanceof HTMLElement&&Z?.hasChanges(e)||oe?.hasReactPropChanges(e)||oe?.hasDesignTokenEdit(e))}function Pe(){Ke(),Me?.disconnect(),q=null,X=null,x.hidden=y.hidden=!0,ke(),Be()}function Te(e,t,n=!1,i=x){if(!W||!e?.isConnected)return void(i.hidden=!0);let o=e.getBoundingClientRect();if(o.width&&o.height){if(i.hidden=!1,i.dataset.kind=t,n&&(e!==ne||t!==ie)){ne=e,ie=t,clearTimeout(te);let n=v.getBoundingClientRect(),i=e=>o.left<e+n.width&&o.right>e&&o.top<n.bottom&&o.bottom>n.top;h.flip&&n.width&&i(n.left)&&!i(document.documentElement.clientWidth-n.right)&&(te=window.setTimeout(h.flip,"hover"===t?350:0))}i.hidden=!d(i,o,e,h.bounds?.(e))}else i.hidden=!0}function Ae(e=!1){Te(q??X,q?"selected":"hover",e),Te(q&&X!==q?X:null,"hover",!1,y)}function Se(){ee||(ee=requestAnimationFrame(()=>{ee=0,q&&(!q.isConnected||G!==J())&&Pe(),X&&!X.isConnected&&(X=null),Ae()}))}let Me="function"==typeof ResizeObserver?new ResizeObserver(Se):null;function De(e){!s(e)||!e.isConnected||h.host.contains(e)||(Z?.element&&Z.element!==e&&Ke(),Me?.disconnect(),Me?.observe(e),q=e,X=e,G=J(),Q.set(e,G),ke(),Te(e,"selected",!0),y.hidden=!0,Be())}let Re=()=>g("(max-width:520px)");function ze(e){v.toggleAttribute("data-folded",e&&Re()),T.setAttribute("aria-expanded",String(!v.hasAttribute("data-folded"))),T.setAttribute("aria-label",v.hasAttribute("data-folded")?"Expand inspector":"Collapse inspector")}function He(e){ze(!1),Re()&&requestAnimationFrame(()=>{let t=e.getBoundingClientRect(),n=v.getBoundingClientRect().top-12;t.top>=12&&t.bottom<=n||window.scrollBy({top:t.top-Math.max(12,(n-t.height)/2),behavior:u()?"auto":"smooth"})})}function Be(){Se(),B.disabled=!ue.length&&!oe?.canUndoReactProp(q)&&!oe?.canUndoDesignTokenEdit(q),K.disabled=!function(){let e=q,t=e?(re.get(e)?.size??0)+ +(e instanceof HTMLElement&&!!Z?.hasChanges(e))+ +!!oe?.hasReactPropChanges(e)||+!!oe?.hasDesignTokenEdit(e):0;return D.textContent=t?`${t} change${t>1?"s":""}`:"",M.toggleAttribute("data-changes",t>0||!B.disabled),U.hidden=!t&&!xe,t}(),I.disabled=!q||!re.get(q)?.size,j.disabled=!q,F.disabled=!(!Z?.busy&&q?.isConnected&&q instanceof HTMLElement),F.textContent=Z?.isEditing(q instanceof HTMLElement?q:null)?"Done editing":"Edit text",F.setAttribute("aria-label",Z?.isEditing(q instanceof HTMLElement?q:null)?"Finish inline text editing":"Edit selected text inline"),Ce()}function Ke(e=!1){Z?.finish(e),Be()}function Ie(e){!W||"Escape"!==e.key||e.defaultPrevented&&!e.composedPath().includes(h.host)||(e.preventDefault(),e.stopImmediatePropagation(),Pe(),je(!1),h.onExit())}function je(e){if(e||(Ue(),Z?.finish(),W&&(ve=xe,ye(!0,!1)),oe?.restoreThemes(v)),e&&!W&&void 0!==ve){let e=ve;ve=void 0,ye(e,!1)}e&&q&&(!q.isConnected||G!==J())&&Pe(),clearTimeout(Y),Y=0,W=e,Ce(),e?(v.hidden=!1,v.setAttribute("aria-hidden","false"),requestAnimationFrame(()=>{W&&(v.dataset.state="active")}),x.hidden=!q,ke(),ze(!q),Te(q,"selected"),P.focus({preventScroll:!0})):(X=null,x.hidden=y.hidden=!0,v.setAttribute("aria-hidden","true"),v.dataset.state="closing",u()?(v.hidden=!0,delete v.dataset.state):Y=window.setTimeout(()=>{Y=0,W||(v.hidden=!0,delete v.dataset.state)},250))}function Fe(){Ue(),ye(!1,!1),oe?.resetPreviews();for(let[e,t]of ae)o(e,t.keys(),()=>{for(let[n,i]of t)_e(e,n,i)},!1,de.has(e)),de.delete(e);ae.clear(),re.clear(),ue.length=0,Z?.restoreAll(),Q.clear(),Be()}function Ue(){h.root.dispatchEvent(new Event("komo-preview-cancel"))}function $e(e,t){return t(e,re.get(e),t=>ae.get(e)?.get(t)?.computed,oe?.tokenBoundProperties(e),[e instanceof HTMLElement?Z?.proposal(e):void 0,oe?.proposedDesignChanges(e)],oe?.designContext(e,h.design))}function Oe(e){Z?.isEditing(e instanceof HTMLElement?e:null)&&Ke(!0);let t=re.get(e),n=(e instanceof HTMLElement&&Z?.hasChanges(e))??!1,i=oe?.hasReactPropChanges(e)??!1,s=oe?.hasDesignTokenEdit(e)??!1;if(t?.size||n||i||s){n&&e instanceof HTMLElement&&Z?.reset(e),s&&oe?.resetDesignTokenEdits(e),o(e,t?.keys()??[],()=>{for(let n of t?.keys()??[])_e(e,n,ae.get(e)?.get(n))},!1,de.has(e)),re.delete(e),ae.delete(e),de.delete(e),Q.delete(e),i&&oe?.resetReactProps(e);for(let t=ue.length-1;t>=0;t--)ue[t].element===e&&ue.splice(t,1)}}F.addEventListener("click",e=>{Z||q&&(R.textContent="Loading inline text editor…",import("./inline-text-editor-LN5QPR3P.js").then(t=>{Z||!q||!W||(Z=t.bindInlineTextTools({button:F,status:R,selected:()=>q instanceof HTMLElement?q:null,active:()=>W,onChange:Be,onCommit(e){ue.push({kind:"text",element:e})}}),Z.toggle(e))}).catch(()=>{R.textContent="Inline text editing is unavailable."}))}),T.addEventListener("click",()=>ze(!v.hasAttribute("data-folded"))),k.addEventListener("click",()=>De(q?.parentElement??null)),P.addEventListener("click",()=>{Z?.element&&Ke(),Pe(),je(!1),h.onExit()}),B.addEventListener("click",()=>{let e=ue.pop();e?e.kind?"text"===e.kind?q===(Z?.undo()??e.element)&&ke():(_e(e.element,e.property,e.before),e.before.bindingUndo?.(),oe?.syncDesignTokenBinding(e.element,e.property),fe(e.element,e.property),q===e.element&&ke(),Te(q??X,q?"selected":"hover")):(e.undo(),ke()):(q&&(oe?.undoDesignTokenEdit(q),oe?.undoReactProp(q),ke()),R.textContent="Runtime preview · Undo, Reset or reload to restore"),Be(),(B.disabled?P:B).focus({preventScroll:!0})}),K.addEventListener("click",()=>{q&&(Oe(q),ke(),Te(q,"selected"),Be(),P.focus({preventScroll:!0}))}),I.addEventListener("click",()=>{let e=q,t=e?re.get(e):void 0;!e||!t?.size||ce().then(async({cssText:n})=>{let i=n(e,t);try{await navigator.clipboard.writeText(i),R.textContent="CSS copied"}catch{R.textContent=i}})}),j.addEventListener("click",()=>{let e=q;e&&(Z?.isEditing(e instanceof HTMLElement?e:null)&&Ke(),ce().then(({designProposal:t})=>{if(!W||q!==e||!e.isConnected)return;let n=$e(e,t);Oe(e),Be(),h.onComment(e,n)},()=>{R.textContent="Comment unavailable · try again"}))});let Ne=()=>ye(!1);for(let e of[S,z,F])for(let t of["pointerdown","focusin","click"])e.addEventListener(t,Ne,!0);document.addEventListener("pointermove",function(e){if(!W)return;if(e.composedPath().includes(h.host))return X=null,void Ae();let t=a(h.targetAt(e.clientX,e.clientY),e.metaKey||e.ctrlKey);X=t&&!h.host.contains(t)?t:null,Ae(!q)},{capture:!0,signal:le.signal}),document.addEventListener("pointerdown",function(e){if(!W||0!==e.button||e.composedPath().includes(h.host))return;let t=a(h.targetAt(e.clientX,e.clientY),e.metaKey||e.ctrlKey);!t||h.host.contains(t)||Z?.element&&(t===Z.element||Z.element.contains(t))||(Z?.element&&Ke(),e.preventDefault(),e.stopImmediatePropagation(),De(t))},{capture:!0,signal:le.signal}),document.addEventListener("click",function(e){!W||e.composedPath().includes(h.host)||(e.preventDefault(),e.stopImmediatePropagation(),q&&He(q),2===e.detail&&q?.contains(e.target)&&!F.disabled&&!Z?.element&&F.dispatchEvent(new MouseEvent("click",e)))},{capture:!0,signal:le.signal}),document.addEventListener("keydown",function(e){if(Z?.handleKey(e))return void F.focus({preventScroll:!0});let t=e.key.toLowerCase(),n=e.composedPath()[0],i=n instanceof HTMLElement&&(n.isContentEditable||n.matches("input,textarea,select"));if(!i||"Escape"!==e.key||!n.closest("[data-field-property]")){if(W&&q&&e.altKey&&!e.ctrlKey&&!e.metaKey&&!i&&("arrowup"===t||"arrowdown"===t)){let n=("arrowup"===t?q.parentElement:[...q.children].find(e=>s(e)&&!e.matches("script,style,defs,title,desc,metadata")))??null;return void(s(n)&&n!==document.body&&n!==document.documentElement&&!h.host.contains(n)&&(e.preventDefault(),e.stopImmediatePropagation(),De(n),He(n)))}if(W&&!U.hidden&&!e.metaKey&&!e.ctrlKey&&!e.altKey&&("b"===t||"arrowleft"===t||"arrowright"===t)&&!i)return e.preventDefault(),e.stopImmediatePropagation(),void ye("b"===t?!xe:"arrowleft"===t);if(W&&!Z?.element&&("Enter"===e.key||" "===e.key)&&!e.composedPath().includes(h.host)){let t=document.activeElement;if(s(t)&&t!==document.body&&t!==document.documentElement)return e.preventDefault(),e.stopImmediatePropagation(),De(t),void He(t)}e.composedPath().includes(h.host)&&Ie(e)}},{capture:!0,signal:le.signal}),window.addEventListener("keydown",Ie,{signal:le.signal}),window.addEventListener("scroll",Se,{capture:!0,passive:!0,signal:le.signal}),window.addEventListener("resize",Se,{passive:!0,signal:le.signal}),r(h.host,()=>W?[q??X,X]:[],Se,le.signal,Pe);let Ve=ce().then(e=>{le.signal.aborted||(O=e.selectionViews({exitKey:h.exitKey,review(){let e=[...Q.keys()].reverse().find(e=>e.isConnected&&Q.get(e)===J()&&Le(e));e&&De(e)},reset:Fe,proposals:()=>[...Q.keys()].filter(Le).map(t=>$e(t,e.designProposal)),message:e=>{R.textContent=e}}),m.textContent+=O.styles,B.innerHTML=O.icons.undo,K.innerHTML=O.icons.reset,v.insertBefore(O.hint,N),N.append(O.pending),W?ke():Ce())},()=>{R.textContent="Selection tools unavailable · try again"});return{setActive:je,select:De,clearSelection:Pe,setReturnAction(e){w=e,E.hidden=!e,e&&(E.setAttribute("aria-label",e.label),E.title=e.label)},mountPanel(e){v.parentElement!==e&&(v.parentElement?.removeAttribute("data-design-empty"),e.append(v),Ce())},get active(){return W},ready:Promise.all([b,Ve]),destroy(){Z?.finish(!0),je(!1),Fe(),clearTimeout(Y),clearTimeout(be),clearTimeout(te),Me?.disconnect(),le.abort(),cancelAnimationFrame(ee),v.remove(),x.remove(),y.remove(),m.remove()}}}export{h as createDesignMode};

package/dist/highlight.d.ts

@@ -6,4 +6,6 @@ type Box = {
 };
 /** Paint the full border shape before clipping, so cropped edges do not gain corners. */
 export declare function drawHighlight(node: HTMLElement, rect: Box, element: Element | null, bounds?: Box): boolean;
+/** Follow style-only changes and live transitions, without observing feedback chrome. */
+export declare function watchHighlight(host: HTMLElement, targets: () => Array<Element | null>, update: () => void, signal: AbortSignal, lost?: () => void): void;
 export {};

package/dist/index.js

@@ -1 +1 @@
-import{b as o,c as s}from"./chunk-DSOGJW4N.js";import"./chunk-ILX63XAJ.js";import"./chunk-DH22G2S5.js";import"./chunk-53M6AOAX.js";import"./chunk-WGISPOJV.js";import"./chunk-PLSWBSSX.js";export{s as initComments,o as initKomo};
+import{b as o,c as s}from"./chunk-CLVBIZMH.js";import"./chunk-ILX63XAJ.js";import"./chunk-DH22G2S5.js";import"./chunk-3276ZULN.js";import"./chunk-WGISPOJV.js";import"./chunk-PLSWBSSX.js";export{s as initComments,o as initKomo};