| 1 |
(function(){"use strict";function d(r,...e){return{__wpdHtml:!0,strings:r,values:e}}function _r(r){return!!r&&r.__wpdHtml===!0}const xr="$$wpd$$",R=/\$\$wpd\$\$(\d+)\$\$/g,yr="$$wpd-node$$",wr=/^\$\$wpd-node\$\$(\d+)\$\$$/,kr=new Set(["style","script","textarea","title"]);function $r(r){let e="",t=!1,s=null,o=!1,i=null,n="",a=!1;for(let l=0;l<r.length;l++){const c=r[l];e+=c;for(let u=0;u<c.length;u++){const h=c[u];if(o){c.startsWith("-->",u)&&(o=!1,u+=2);continue}if(i!==null){h==="<"&&c[u+1]==="/"&&c.slice(u+2,u+2+i.length).toLowerCase()===i&&(u+=1+i.length,i=null,t=!0,a=!1,n="");continue}if(s!==null){h===s&&(s=null);continue}if(t){h==='"'||h==="'"?(s=h,a=!1):h===">"?(t=!1,a=!1,kr.has(n)&&(i=n),n=""):a&&(/[a-zA-Z0-9-]/.test(h)?n+=h.toLowerCase():a=!1);continue}if(c.startsWith("<!--",u)){o=!0,u+=3;continue}const p=c[u+1]??"";h==="<"&&/[a-zA-Z/!]/.test(p)&&(t=!0,n="",a=/[a-zA-Z]/.test(p))}l<r.length-1&&(e+=t||o||i!==null?`${xr}${l}$$`:`<!--${yr}${l}$$-->`)}return e}const Fo=new WeakMap;function Uo(r){const e=Fo.get(r);if(e)return e;const t=document.createElement("template");t.innerHTML=$r(r);const s=[],o=(a,l)=>{if(a.nodeType===Node.ELEMENT_NODE){const h=a;for(const p of Array.from(h.attributes)){const f=p.name,g=p.value,x=f[0];if(R.test(g))if(R.lastIndex=0,x==="@"){const _=R.exec(g);R.lastIndex=0,s.push({path:l,kind:"event",name:f.slice(1),valueIndex:_?Number(_[1]):0}),h.removeAttribute(f)}else if(x==="."){const _=R.exec(g);R.lastIndex=0,s.push({path:l,kind:"prop",name:f.slice(1),valueIndex:_?Number(_[1]):0}),h.removeAttribute(f)}else if(x==="?"){const _=R.exec(g);R.lastIndex=0,s.push({path:l,kind:"bool",name:f.slice(1),valueIndex:_?Number(_[1]):0}),h.removeAttribute(f)}else{const _=[],y=[];let w=0,S;for(R.lastIndex=0;(S=R.exec(g))!==null;)_.push(g.slice(w,S.index)),y.push(Number(S[1])),w=S.index+S[0].length;_.push(g.slice(w)),s.push({path:l,kind:"attr",name:f,template:_,valueIndices:y}),h.setAttribute(f,"")}}}const c=Array.from(a.childNodes);let u=0;for(let h=0;h<c.length;h++){const p=c[h],f=h+u;if(p.nodeType===Node.COMMENT_NODE){const g=wr.exec(p.data);if(g){const x=document.createTextNode("");p.parentNode.replaceChild(x,p),s.push({path:[...l,f],kind:"node",valueIndex:Number(g[1])})}continue}if(p.nodeType===Node.TEXT_NODE){const g=p.textContent||"";if(!R.test(g)){R.lastIndex=0;continue}R.lastIndex=0;const x=p.parentNode;let _=0,y;const w=[],S=[];for(R.lastIndex=0;(y=R.exec(g))!==null;){y.index>_&&w.push(document.createTextNode(g.slice(_,y.index)));const z=document.createTextNode("");w.push(z),S.push({path:[...l,f+w.length-1],kind:"node",valueIndex:Number(y[1])}),_=y.index+y[0].length}_<g.length&&w.push(document.createTextNode(g.slice(_)));for(const z of w)x.insertBefore(z,p);x.removeChild(p),u+=w.length-1,s.push(...S)}else o(p,[...l,f])}};o(t.content,[]);const n={template:t,buildParts:a=>{const l=[];for(const c of s){let u=a;for(const h of c.path)u=u.childNodes[h];c.kind==="node"?l.push({kind:"node",valueIndex:c.valueIndex,child:{anchor:u,state:null}}):c.kind==="attr"?l.push({kind:"attr",element:u,name:c.name,template:c.template,valueIndices:c.valueIndices}):c.kind==="event"?l.push({kind:"event",valueIndex:c.valueIndex,element:u,name:c.name}):c.kind==="prop"?l.push({kind:"prop",valueIndex:c.valueIndex,element:u,name:c.name}):c.kind==="bool"&&l.push({kind:"bool",valueIndex:c.valueIndex,element:u,name:c.name})}return l}};return Fo.set(r,n),n}const Ko=new WeakMap;function Cr(r,e){for(const t of r.nodes)if(t.parentNode!==e)return!1;return!0}function Mt(r,e){const t=Ko.get(e);if(t&&t.strings===r.strings&&Cr(t,e)){Rt(t.parts,r.values);return}const s=Uo(r.strings),o=s.template.content.cloneNode(!0),i=s.buildParts(o),n=Array.from(o.childNodes);for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(o),Rt(i,r.values),Ko.set(e,{strings:r.strings,parts:i,nodes:n})}function Rt(r,e){for(const t of r)if(t.kind==="node")It(t.child,e[t.valueIndex]);else if(t.kind==="attr"){let s=t.template[0];for(let o=0;o<t.valueIndices.length;o++)s+=Vo(e[t.valueIndices[o]]),s+=t.template[o+1];s!==t.last&&(t.last=s,s===""?t.element.removeAttribute(t.name):t.element.setAttribute(t.name,s))}else if(t.kind==="event"){const s=e[t.valueIndex];s!==t.current&&(t.current&&t.element.removeEventListener(t.name,t.current),s&&t.element.addEventListener(t.name,s),t.current=s)}else if(t.kind==="prop"){const s=e[t.valueIndex];s!==t.last&&(t.last=s,t.element[t.name]=s)}else if(t.kind==="bool"){const s=!!e[t.valueIndex];s!==t.last&&(t.last=s,s?t.element.setAttribute(t.name,""):t.element.removeAttribute(t.name))}}function It(r,e){if(e==null||e===!1){r.state&&(j(r.state),r.state=null);return}if(Array.isArray(e)){Er(r,e);return}if(_r(e)){zr(r,e);return}if(e instanceof Node){Ar(r,e);return}Sr(r,Vo(e))}function Ar(r,e){const t=r.state;t?.shape==="node"&&t.node===e||(t&&j(t),oe(r,[e]),r.state={shape:"node",node:e})}function Sr(r,e){const t=r.state;if(t?.shape==="text"){t.text!==e&&(t.node.textContent=e,t.text=e);return}t&&j(t);const s=document.createTextNode(e);oe(r,[s]),r.state={shape:"text",node:s,text:e}}function zr(r,e){const t=r.state;if(t?.shape==="template"&&t.strings===e.strings){Rt(t.parts,e.values);return}t&&j(t);const s=Uo(e.strings),o=s.template.content.cloneNode(!0),i=s.buildParts(o),n=Array.from(o.childNodes);oe(r,[o]),Rt(i,e.values),r.state={shape:"template",strings:e.strings,parts:i,nodes:n}}function Er(r,e){const t=r.state;if(t?.shape==="array"){const o=Math.min(t.entries.length,e.length);for(let i=0;i<o;i++)It(t.entries[i],e[i]);if(e.length<t.entries.length){for(let i=e.length;i<t.entries.length;i++){const n=t.entries[i];n.state&&j(n.state),n.anchor.remove()}t.entries.length=e.length}else for(let i=t.entries.length;i<e.length;i++){const n=document.createTextNode("");oe(r,[n]);const a={anchor:n,state:null};It(a,e[i]),t.entries.push(a)}return}t&&j(t);const s=[];for(const o of e){const i=document.createTextNode("");oe(r,[i]);const n={anchor:i,state:null};It(n,o),s.push(n)}r.state={shape:"array",entries:s}}function oe(r,e){const t=r.anchor.parentNode;if(t)for(const s of e)t.insertBefore(s,r.anchor)}function j(r){if(r.shape==="text"){r.node.remove();return}if(r.shape==="template"){for(const e of r.parts)e.kind==="node"&&e.child.state&&(j(e.child.state),e.child.state=null);for(const e of r.nodes)e.parentNode&&e.parentNode.removeChild(e);return}if(r.shape==="node"){r.node.parentNode&&r.node.parentNode.removeChild(r.node);return}for(const e of r.entries)e.state&&j(e.state),e.anchor.remove()}function Vo(r){return r==null||r===!1?"":String(r)}const Y=class Y extends HTMLElement{constructor(){super(),this._renderScheduled=!1,this._propValues={},this.constructor.shadow?(this.attachShadow({mode:"open"}),this._renderRoot=this.shadowRoot):this._renderRoot=this,this._installPropAccessors()}static get observedAttributes(){return this.props.map(jo)}connectedCallback(){this._adoptStyles(),this.requestUpdate()}attributeChangedCallback(e,t,s){if(t===s)return;const o=Lr(e);this._propValues[o]=s,this.requestUpdate()}get classNames(){return Array.from(this.classList)}set classNames(e){if(e==null){this.removeAttribute("class");return}const s=(Array.isArray(e)?e:String(e).split(/\s+/)).map(o=>String(o).trim()).filter(o=>o!=="");this.className=s.join(" ")}requestUpdate(){this._scheduleRender()}emit(e,t){return this.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}_installPropAccessors(){const e=this.constructor;for(const t of e.props){if(Object.getOwnPropertyDescriptor(this,t))continue;const s=jo(t);Object.defineProperty(this,t,{get:()=>t in this._propValues?this._propValues[t]:this.getAttribute(s),set:o=>{let i;o==null||o===!1?i=null:o===!0?i="":i=String(o),this._propValues[t]=i,i===null?this.removeAttribute(s):this.setAttribute(s,i),this.requestUpdate()},enumerable:!0,configurable:!0})}}_scheduleRender(){this._renderScheduled||!this.isConnected||(this._renderScheduled=!0,queueMicrotask(()=>{this._renderScheduled=!1,this.isConnected&&Mt(this.render(),this._renderRoot)}))}_adoptStyles(){const e=this.constructor;if(e.styles.length!==0)if(e.shadow&&this.shadowRoot){const t=e.styles.map(s=>s.sheet).filter(s=>s!==null);if(this.shadowRoot.adoptedStyleSheets=t,t.length!==e.styles.length){for(const s of e.styles)if(!s.sheet){const o=document.createElement("style");o.textContent=s.cssText,this.shadowRoot.appendChild(o)}}}else this._adoptLightStyles(e)}_adoptLightStyles(e){if(!Y._lightStylesAdopted.has(e)){Y._lightStylesAdopted.add(e);for(const t of e.styles){const s=document.createElement("style");s.dataset.osUi=this.tagName.toLowerCase(),s.textContent=t.cssText,document.head.appendChild(s)}}}};Y.props=[],Y.styles=[],Y.shadow=!0,Y._lightStylesAdopted=new WeakSet;let m=Y;function v(r,e){customElements.get(r)||customElements.define(r,e)}function jo(r){return r.replace(/[A-Z]/g,e=>"-"+e.toLowerCase())}function Lr(r){return r.replace(/-([a-z])/g,(e,t)=>t.toUpperCase())}const Mr=(()=>{try{return typeof new CSSStyleSheet().replaceSync=="function"}catch{return!1}})();function b(r,...e){let t=r[0];for(let s=1;s<r.length;s++){const o=e[s-1];if(typeof o=="string"||typeof o=="number")t+=String(o);else if(o&&o.__wpdCss)t+=o.cssText;else throw new TypeError("[os-ui] css`` interpolations must be strings, numbers, or other css`` results. Got: "+typeof o);t+=r[s]}if(Mr){const s=new CSSStyleSheet;return s.replaceSync(t),{__wpdCss:!0,sheet:s,cssText:t}}return{__wpdCss:!0,sheet:null,cssText:t}}function Rr(r){const e=[],t=[];let s=null,o=r.parentElement;for(;o&&!(o===document.body||o===document.documentElement);){const n=o.id||"";if(n.startsWith("wp-window-")){s=n.slice(10);break}if(o.tagName.toLowerCase()==="os-tabpanel"){const a=o.getAttribute("for");a&&t.unshift(a)}o=o.parentElement}s&&e.push(Yt(s));for(const n of t)e.push("tab-"+Yt(n));const i=r.getAttribute("label");return i&&e.push(Yt(i)),e.length===0?"os-unnamed":"os-"+e.filter(n=>n!=="").join("-")}function Yt(r){return r.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}function ie(r){if(r.id)return r.id;const e=Rr(r);return r.id=e,e}const Ir=b`:host{display:block;margin-block-end:36px}:host( [ hidden ] ){display:none}.os-section__heading{margin:0 0 5px;font-size:20px;font-weight:500;letter-spacing:-0.01em;color:var( --os-ui-fg,#1d2327 )}.os-section__description{margin:0 0 14px;max-width:78ch;font-size:14px;color:var( --os-ui-fg-muted,#646970 );line-height:1.55}.os-section__description:empty{display:none}:host( [ stack ] ) .os-section__body{display:flex;flex-direction:column;gap:var( --os-ui-section-gap,12px )}`,ce=class ce extends m{render(){const e=this.heading||"",t=this.description||"";return d` |
| 2 |
${e?d`<h3 class="os-section__heading">${e}</h3>`:""} |
| 3 |
${t?d`<p class="os-section__description">${t}</p>`:""} |
| 4 |
<div class="os-section__body" part="body"><slot></slot></div> |
| 5 |
`}};ce.props=["heading","description","stack"],ce.styles=[Ir],ce.help=void 0;let Qt=ce;v("os-section",Qt);const $=b`:host{--_holo-fill:var( --os-ui-holo-fill,${"linear-gradient( 124deg, #afa2e8 0%, #f5a8ea 46%, #8ee9f7 100% )"} );--_holo-ink:var( --os-ui-holo-ink,#0c0b0f );--_holo-sheen:var( --os-ui-holo-sheen,linear-gradient( 124deg,rgba( 159,214,255,0.1 ) 0%,rgba( 236,155,255,0.12 ) 34%,rgba( 242,82,252,0.1 ) 58%,rgba( 147,240,198,0.09 ) 100% ) );--_holo-edge:var( --os-ui-holo-edge,linear-gradient( 124deg,rgba( 154,242,255,0.7 ) 0%,rgba( 236,155,255,0.85 ) 38%,rgba( 242,82,252,0.7 ) 62%,rgba( 159,152,255,0.6 ) 100% ) );--_holo-edge-quiet:var( --os-ui-holo-edge-quiet,linear-gradient( 124deg,rgba( 154,242,255,0.22 ) 0%,rgba( 236,155,255,0.28 ) 38%,rgba( 242,82,252,0.22 ) 62%,rgba( 159,152,255,0.2 ) 100% ) );--_holo-glow:var( --os-ui-holo-glow,0 0 0 1px rgba( 242,82,252,0.28 ),0 2px 10px rgba( 242,82,252,0.22 ) );--_holo-glow-strong:var( --os-ui-holo-glow-strong,0 0 0 1px rgba( 242,82,252,0.42 ),0 4px 18px rgba( 242,82,252,0.38 ),0 1px 3px rgba( 12,11,15,0.6 ) );--_holo-track:var( --os-ui-holo-track,rgba( 255,251,255,0.16 ) );--_holo-track-edge:var( --os-ui-holo-track-edge,#8c8f94 );--_holo-ring-color:var( --os-ui-accent-dim,#2271b1 );--_holo-focus:var( --os-ui-focus-ring,0 0 0 2px rgba( 12,11,15,0.9 ),0 0 0 4px #f252fc,0 0 12px 2px rgba( 242,82,252,0.45 ) );--_holo-focus-field:var( --os-ui-focus-ring-field,0 0 0 1px #f252fc,0 0 0 4px rgba( 242,82,252,0.18 ) );--_holo-t:var( --os-ui-holo-transition,220ms );--_holo-t-fast:var( --os-ui-motion-fast,140ms );--_holo-t-slow:var( --os-ui-motion-slow,340ms );--_holo-t-ambient:var( --os-ui-motion-ambient,12s );--_holo-spring:var( --os-ui-ease-spring,cubic-bezier( 0.32,1.5,0.55,1 ) );--_holo-ease:var( --os-ui-ease-out,cubic-bezier( 0.22,0.9,0.28,1 ) );--_holo-loop:var( --os-ui-ease-loop,cubic-bezier( 0.45,0,0.55,1 ) )}`,Pr=b` .os-holo-fill{background-color:transparent;background-image:var( --_holo-fill );background-size:220% 220%;background-position:22% 28%;background-repeat:no-repeat;color:var( --_holo-ink );transition:background-position var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease,filter var( --_holo-t ) ease}.os-holo-fill:hover{background-position:74% 66%}.os-holo-fill:active{background-position:88% 82%;filter:brightness( 0.94 )}@media ( prefers-reduced-motion:reduce ){.os-holo-fill{transition-duration:1ms}.os-holo-fill:hover,.os-holo-fill:active{background-position:22% 28%}}`,Pt=b` .os-holo-sheen{position:relative;isolation:isolate}.os-holo-sheen::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:inherit;background-image:var( --_holo-sheen );background-size:200% 200%;background-position:20% 30%;opacity:0;pointer-events:none;transition:opacity var( --_holo-t ) ease,background-position var( --_holo-t ) ease}.os-holo-sheen:hover::before,.os-holo-sheen:focus-visible::before{opacity:1;background-position:76% 68%}@media ( prefers-reduced-motion:reduce ){.os-holo-sheen::before{transition-duration:1ms}.os-holo-sheen:hover::before,.os-holo-sheen:focus-visible::before{background-position:20% 30%}}`,Bo=b` .os-holo-edge{position:relative}.os-holo-edge::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background-image:var( --_holo-edge-quiet );opacity:0;pointer-events:none;-webkit-mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );-webkit-mask-composite:xor;mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );mask-composite:exclude;transition:opacity var( --_holo-t ) ease}.os-holo-edge:hover::after,.os-holo-edge:focus-visible::after{background-image:var( --_holo-edge );opacity:1}.os-holo-edge.is-lit::after{background-image:var( --_holo-edge );opacity:1}@media ( prefers-reduced-motion:reduce ){.os-holo-edge::after{transition-duration:1ms}}`,Tt=b` .os-holo-glint{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}.os-holo-glint::before{content:'';position:absolute;top:-60%;bottom:-60%;width:45%;inset-inline-start:-60%;background:linear-gradient( 90deg,transparent 0%,rgba( 255,251,255,0.14 ) 45%,rgba( 255,251,255,0.22 ) 50%,rgba( 255,251,255,0.14 ) 55%,transparent 100% );transform:rotate( 18deg ) translateX( 0 );opacity:0}:hover>.os-holo-glint::before,:focus-visible>.os-holo-glint::before,:host(:hover )>.os-holo-glint::before,:host(:focus-visible )>.os-holo-glint::before{animation:os-holo-glint var( --_holo-t-slow ) var( --_holo-ease )}@keyframes os-holo-glint{0%{opacity:0;transform:rotate( 18deg ) translateX( 0 )}15%{opacity:1}85%{opacity:1}100%{opacity:0;transform:rotate( 18deg ) translateX( 240vw )}}@media ( prefers-reduced-motion:reduce ){:hover>.os-holo-glint::before,:focus-visible>.os-holo-glint::before,:host(:hover )>.os-holo-glint::before,:host(:focus-visible )>.os-holo-glint::before{animation:none}}`,Jt=b` .os-holo-ring{position:absolute;inset:0;border-radius:inherit;box-shadow:0 0 0 0 var( --_holo-ring-color );opacity:0;pointer-events:none}:active:not(:disabled )>.os-holo-ring,:host(:active:not( [ disabled ] ) )>.os-holo-ring{animation:os-holo-ring var( --_holo-t-slow ) var( --_holo-ease )}@keyframes os-holo-ring{0%{opacity:0.45;box-shadow:0 0 0 0 var( --_holo-ring-color )}100%{opacity:0;box-shadow:0 0 0 10px transparent}}@media ( prefers-reduced-motion:reduce ){:active:not(:disabled )>.os-holo-ring,:host(:active:not( [ disabled ] ) )>.os-holo-ring{animation:none}}`,Wo=b` .os-holo-shimmer{background-image:var( --_holo-fill );background-size:300% 300%;background-repeat:no-repeat;animation:os-holo-shimmer 2.4s var( --_holo-loop ) infinite}@keyframes os-holo-shimmer{0%{background-position:0% 50%}100%{background-position:100% 50%}}@media ( prefers-reduced-motion:reduce ){.os-holo-shimmer{animation:none;background-position:30% 50%}}`,Ot=b` .os-holo-enter{animation:os-holo-enter var( --_holo-t ) var( --_holo-spring )}@keyframes os-holo-enter{from{opacity:0;transform:scale( 0.96 )}}@media ( prefers-reduced-motion:reduce ){.os-holo-enter{animation:none}}`,es=b` input:where(:not( [ type='checkbox' ] ):not( [ type='radio' ] ) ),select,textarea{transition:background-color var( --_holo-t ) ease,border-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}input:where(:not( [ type='checkbox' ] ):not( [ type='radio' ] ) ):hover:not(:disabled ),select:hover:not(:disabled ),textarea:hover:not(:disabled ){border-color:var( --os-ui-border-strong,#8c8f94 )}input:where(:not( [ type='checkbox' ] ):not( [ type='radio' ] ) ):focus,input:where(:not( [ type='checkbox' ] ):not( [ type='radio' ] ) ):focus-visible,select:focus,select:focus-visible,textarea:focus,textarea:focus-visible{outline:none;border-color:var( --os-ui-accent,#2271b1 );box-shadow:var( --_holo-focus-field )}input::placeholder,textarea::placeholder{color:var( --os-ui-fg-faint,#8c8f94 );opacity:1}input::selection,textarea::selection{background:var( --os-ui-selection-bg,rgba( 159,152,255,0.6 ) );color:var( --os-ui-selection-fg,#fffbff )}@media ( prefers-reduced-motion:reduce ){input:where(:not( [ type='checkbox' ] ):not( [ type='radio' ] ) ),select,textarea{transition-duration:1ms}}`,Dt=b` input[ type='checkbox' ],input[ type='radio' ]{appearance:none;-webkit-appearance:none;position:relative;flex:0 0 auto;box-sizing:border-box;width:16px;height:16px;margin:0;padding:0;border:1px solid var( --_holo-track-edge );border-radius:4px;background-color:var( --_holo-track );background-image:none;background-repeat:no-repeat;cursor:inherit;transition:background-color var( --_holo-t ) ease,border-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}input[ type='radio' ]{border-radius:50%}input[ type='checkbox' ]:hover:not(:disabled ),input[ type='radio' ]:hover:not(:disabled ){border-color:var( --os-ui-accent,#2271b1 )}input[ type='checkbox' ]:focus-visible,input[ type='radio' ]:focus-visible{outline:none;box-shadow:var( --_holo-focus )}input[ type='checkbox' ]:checked,input[ type='checkbox' ]:indeterminate,input[ type='radio' ]:checked{border-color:transparent;background-color:var( --os-ui-accent,#2271b1 )}input[ type='checkbox' ]:checked:focus-visible,input[ type='radio' ]:checked:focus-visible{box-shadow:var( --_holo-focus )}input[ type='checkbox' ]:checked::after{content:'';position:absolute;inset-inline-start:50%;top:46%;width:3.5px;height:7.5px;border:solid var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) );border-width:0 2px 2px 0;transform:translate( -50%,-50% ) rotate( 45deg );animation:os-holo-tick 180ms cubic-bezier( 0.3,1.4,0.6,1 )}input[ type='checkbox' ]:indeterminate::after{content:'';position:absolute;inset-inline-start:50%;top:50%;width:8px;height:2px;border:0;border-radius:1px;background:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) );transform:translate( -50%,-50% )}input[ type='radio' ]:checked::after{content:'';position:absolute;inset-inline-start:50%;top:50%;width:6px;height:6px;border-radius:50%;background:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) );transform:translate( -50%,-50% );animation:os-holo-tick 180ms cubic-bezier( 0.3,1.4,0.6,1 )}input[ type='checkbox' ]:disabled,input[ type='radio' ]:disabled{cursor:not-allowed}@keyframes os-holo-tick{from{opacity:0;transform:translate( -50%,-50% ) rotate( 45deg ) scale( 0.4 )}}@media ( prefers-reduced-motion:reduce ){input[ type='checkbox' ]:checked::after,input[ type='radio' ]:checked::after{animation:none}}`,Xo=b` @keyframes os-holo-drift{0%{background-position:16% 26%}50%{background-position:84% 74%}100%{background-position:16% 26%}}.os-holo-alive{animation:os-holo-drift var( --_holo-t-ambient ) var( --_holo-loop ) infinite}@media ( prefers-reduced-motion:reduce ){.os-holo-alive{animation:none}}`;b` ${$} ${Pr} ${Pt} ${Bo} ${Tt} ${Jt} ${Wo} ${Ot} ${es} ${Dt} ${Xo} `;const Tr=b` ${$} ${Pt} ${Bo} ${Tt} ${Jt} ${Xo}:host{display:inline-flex}:host( [ fill-cell ] ){display:flex;width:100%}button{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:var( --os-ui-button-padding,6px 12px );border-radius:var( --os-ui-button-border-radius,6px );font:inherit;font-weight:500;cursor:pointer;transition:background-color var( --_holo-t ) ease,color var( --_holo-t ) ease,border-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease,transform 80ms ease;background:var( --os-ui-button-bg,transparent );background-image:var( --os-ui-button-bg-image,none );background-repeat:var( --os-ui-button-bg-image-repeat,repeat );background-size:var( --os-ui-button-bg-image-size,auto );background-position:var( --os-ui-button-bg-image-position,center );color:var( --os-ui-button-fg,var( --os-ui-fg,#1d2327 ) );border:var( --os-ui-button-border,1px solid var( --os-ui-border,#c3c4c7 ) )}:host( [ fill-cell ] ) button{width:100%;min-height:var( --os-ui-button-min-height,44px )}button:disabled{opacity:0.5;cursor:not-allowed}button:active:not(:disabled ){transform:translateY( 1px )}button:hover:not(:disabled ){background-color:var( --os-ui-button-bg-hover,var( --os-ui-hover,rgba( 0,0,0,0.04 ) ) )}button:focus-visible{outline:none;box-shadow:var( --_holo-focus )}button:disabled::before,button:disabled::after,button:disabled .os-holo-glint{opacity:0 !important}:host( [ variant='primary' ] ) button{background-color:var( --os-ui-button-bg,var( --wp-admin-theme-color,#2271b1 ) );color:var( --os-ui-button-fg,var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) ) );border:var( --os-ui-button-border,1px solid transparent )}:host( [ variant='primary' ] ) button:hover:not(:disabled ){filter:brightness( 1.06 );background-color:var( --os-ui-button-bg,var( --wp-admin-theme-color,#2271b1 ) );box-shadow:var( --_holo-glow )}:host( [ variant='holo' ] ) button{background-color:transparent;background-image:var( --_holo-fill );background-size:220% 220%;background-position:22% 28%;background-repeat:no-repeat;color:var( --os-ui-button-fg,var( --_holo-ink ) );border:var( --os-ui-button-border,1px solid transparent );box-shadow:var( --_holo-glow );font-weight:600;transition:background-position var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease,filter var( --_holo-t ) ease,transform 80ms ease}:host( [ variant='holo' ] ) button:hover:not(:disabled ){background-color:transparent;background-position:74% 66%;box-shadow:var( --_holo-glow-strong )}:host( [ variant='holo' ] ) button:active:not(:disabled ){background-position:88% 82%;filter:brightness( 0.94 )}:host( [ variant='holo' ] ) button::before{display:none}@media ( prefers-reduced-motion:reduce ){:host( [ variant='holo' ] ) button:hover:not(:disabled ),:host( [ variant='holo' ] ) button:active:not(:disabled ){background-position:22% 28%}}:host( [ variant='secondary' ] ) button{background-color:var( --os-ui-button-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );color:var( --os-ui-button-fg,var( --os-ui-fg,#1d2327 ) );border:var( --os-ui-button-border,1px solid transparent )}:host( [ variant='secondary' ] ) button:hover:not(:disabled ){background-color:var( --os-ui-button-bg-hover,var( --os-ui-hover,rgba( 0,0,0,0.1 ) ) )}:host( [ variant='danger' ] ) button{background-color:var( --os-ui-button-bg,transparent );color:var( --os-ui-button-fg,var( --os-ui-danger,#d63638 ) );border:var( --os-ui-button-border,1px solid currentColor )}:host( [ variant='danger' ] ) button:hover:not(:disabled ){background-color:var( --os-ui-danger,#d63638 );color:var( --os-ui-fg-on-accent,#fff )}:host( [ variant='danger' ] ) button::after{display:none}:host( [ variant='link' ] ) button{background-color:transparent;background-image:none;color:var( --os-ui-button-fg,var( --wp-admin-theme-color,#2271b1 ) );border:0;padding:0;text-decoration:underline}:host( [ variant='link' ] ) button::before,:host( [ variant='link' ] ) button::after,:host( [ variant='link' ] ) .os-holo-glint,:host( [ variant='link' ] ) .os-holo-ring{display:none}:host( [ variant='link' ] ) button:active:not(:disabled ){transform:none}:host( [ busy ] ) button{pointer-events:none;opacity:0.75}:host( [ variant='holo' ][ busy ] ) button{animation:os-holo-drift 12s ease-in-out infinite}@media ( prefers-reduced-motion:reduce ){:host( [ variant='holo' ][ busy ] ) button{animation:none}}.os-button__spinner{box-sizing:border-box;display:inline-block;width:12px;height:12px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:os-button-spin 0.6s linear infinite;flex-shrink:0}@keyframes os-button-spin{to{transform:rotate( 360deg )}}`,de=class de extends m{static get observedAttributes(){return[...super.observedAttributes,"aria-label"]}render(){const e=this.disabled!==null,t=this.busy!==null,s=this.type||"button",o=this.getAttribute("aria-label")||"";return d` |
| 6 |
<button |
| 7 |
part="button" |
| 8 |
class="os-holo-edge os-holo-sheen" |
| 9 |
type=${s} |
| 10 |
?disabled=${e||t} |
| 11 |
aria-busy=${t?"true":"false"} |
| 12 |
aria-label=${o} |
| 13 |
> |
| 14 |
${t?d`<span class="os-button__spinner" aria-hidden="true"></span>`:""} |
| 15 |
<slot></slot> |
| 16 |
<!-- |
| 17 |
The two motion layers. Elements rather than |
| 18 |
pseudo-elements because the sheen and the hairline |
| 19 |
have already taken this button's ::before and |
| 20 |
::after — see the pseudo-element budget note in |
| 21 |
src/ui/holo.ts. Both are inert and aria-hidden. |
| 22 |
--> |
| 23 |
<span class="os-holo-glint" aria-hidden="true"></span> |
| 24 |
<span class="os-holo-ring" aria-hidden="true"></span> |
| 25 |
</button> |
| 26 |
`}};de.props=["variant","disabled","type","busy","fill-cell"],de.styles=[Tr],de.help=void 0;let ts=de;v("os-button",ts);const Dr=b` ${$}:host{display:block;width:100%;aspect-ratio:4 / 3}:host( [ size='small' ] ){display:inline-block;width:32px;height:32px;aspect-ratio:1 / 1;flex:0 0 auto}:host( [ variant='accent' ] ){display:inline-block;width:28px;height:28px;aspect-ratio:1 / 1;flex:0 0 auto}:host( [ size='small' ][ variant='accent' ] ) button{border-radius:8px}:host( [ size='small' ][ variant='accent' ] ) button[ aria-pressed='true' ]{box-shadow:0 0 0 2px var( --os-ui-surface-sunken,#f0f0f1 ),0 0 0 4px var( --os-ui-accent,#2271b1 )}:host( [ size='small' ][ variant='accent' ] ) button[ aria-pressed='true' ]:focus-visible{box-shadow:var( --_holo-focus )}:host( [ variant='wallpaper' ] ){aspect-ratio:16 / 10}:host( [ variant='wallpaper' ] ) button{display:flex;align-items:flex-end;justify-content:flex-start;padding:8px;overflow:hidden}button{appearance:none;position:relative;width:100%;height:100%;padding:0;border-radius:10px;border:2px solid transparent;cursor:pointer;background-color:var( --os-ui-surface-sunken,#eee );background-size:cover;background-position:center;transition:transform 0.15s ease,border-color 0.15s ease,box-shadow 0.15s ease}:host( [ size='small' ] ) button{border-radius:50%}button:hover{transform:scale( 1.04 )}button:focus-visible{outline:none;box-shadow:var( --_holo-focus )}button[ aria-pressed='true' ]{border-color:transparent;box-shadow:0 0 0 var( --os-ui-swatch-ring-width,2px ) var( --os-ui-accent,#2271b1 ),var( --os-ui-swatch-lift,0 0 0 0 transparent )}:host(:not( [ variant='accent' ] ) ) button[ aria-pressed='true' ]::after{content:'';position:absolute;top:6px;inset-inline-end:6px;width:18px;height:18px;border-radius:50%;background:var( --os-ui-swatch-badge-bg,transparent );pointer-events:none;-webkit-mask:url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E" ) center / 12px no-repeat,linear-gradient( #000 0 0 );-webkit-mask-composite:xor;mask:url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E" ) center / 12px no-repeat,linear-gradient( #000 0 0 );mask-composite:exclude}button[ aria-pressed='true' ]:focus-visible{box-shadow:var( --_holo-focus )}:host( [ variant='wallpaper' ] ) button:hover{transform:translateY( -2px )}`,ue=class ue extends m{render(){const e=this.selected!==null,t=this.label||"",s=this.preview||"";return d` |
| 27 |
<button |
| 28 |
type="button" |
| 29 |
aria-pressed=${e?"true":"false"} |
| 30 |
aria-label=${t} |
| 31 |
title=${t} |
| 32 |
style="background: ${s}" |
| 33 |
@click=${()=>this._onPick()} |
| 34 |
> |
| 35 |
<slot></slot> |
| 36 |
</button> |
| 37 |
`}_onPick(){this.emit("os-pick",{value:this.value})}};ue.props=["value","label","selected","preview","size","variant"],ue.styles=[Dr],ue.help=void 0;let ss=ue;v("os-swatch",ss);const qr=b`:host{display:grid;grid-template-columns:repeat( var( --os-ui-swatch-grid-cols,4 ),1fr );gap:12px}:host( [ mode='row' ] ){display:flex;flex-wrap:wrap;align-items:center;gap:10px}`,he=class he extends m{render(){const e=this.label||"",t=this.columns||"";return t&&this.style.setProperty("--os-ui-swatch-grid-cols",t),this.setAttribute("role","radiogroup"),e&&this.setAttribute("aria-label",e),d`<slot></slot>`}};he.props=["label","columns","mode"],he.styles=[qr],he.help=void 0;let os=he;v("os-swatch-grid",os);const Nr=b` ${$}:host{display:inline-flex;position:relative;padding:3px;background:var( --os-ui-segmented-bg,var( --os-ui-hover,rgba( 0,0,0,0.05 ) ) );border-radius:8px;gap:2px;box-shadow:var( --os-ui-segmented-edge,none )}.os-segmented__thumb{position:absolute;top:3px;bottom:3px;left:0;width:var( --_thumb-w,0px );border-radius:6px;background-color:var( --os-ui-segmented-selected-bg,color-mix( in srgb,var( --os-ui-accent,#2271b1 ) var( --os-ui-segmented-selected-accent,100% ),var( --os-ui-segmented-selected-base,var( --os-ui-surface,#fff ) ) ) );background-image:var( --os-ui-segmented-selected-image,none );box-shadow:var( --os-ui-segmented-selected-shadow,none );background-size:220% 220%;background-position:22% 28%;background-repeat:no-repeat;transform:translateX( var( --_thumb-x,0px ) );pointer-events:none;opacity:0}:host( [ data-thumb ] ) .os-segmented__thumb{opacity:1}:host( [ data-thumb-ready ] ) .os-segmented__thumb{transition:transform var( --_holo-t-slow ) var( --_holo-spring ),width var( --_holo-t-slow ) var( --_holo-ease ),opacity var( --_holo-t-fast ) linear}@media ( prefers-reduced-motion:reduce ){:host( [ data-thumb-ready ] ) .os-segmented__thumb{transition-duration:1ms}}`,Hr=b` ${$} ${Pt}:host{flex:1 1 auto;min-width:0;--_holo-sheen:var( --os-ui-segmented-hover-sheen,var( --os-ui-holo-sheen,linear-gradient( 124deg,rgba( 159,214,255,0.1 ) 0%,rgba( 236,155,255,0.12 ) 34%,rgba( 242,82,252,0.1 ) 58%,rgba( 147,240,198,0.09 ) 100% ) ) )}button{appearance:none;display:block;width:100%;padding:6px 13px;background:transparent;border:0;font:inherit;font-size:13px;color:var( --os-ui-fg-muted,#646970 );cursor:pointer;border-radius:6px;transition:background-color var( --_holo-t ) ease,color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease,background-position var( --_holo-t ) ease;white-space:nowrap}button:hover{color:var( --os-ui-fg,#1d2327 )}:host(:not( [ aria-checked='true' ] ) ) button:hover{background-color:var( --os-ui-segmented-hover-bg,transparent )}button:focus-visible{outline:none;box-shadow:var( --_holo-focus )}:host( [ aria-checked='true' ] ) button{color:var( --os-ui-segmented-selected-fg,color-mix( in srgb,var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) ) var( --os-ui-segmented-selected-accent,100% ),var( --os-ui-fg,#1d2327 ) ) );transition-duration:var( --_holo-t-fast )}:host( [ aria-checked='true' ] ) button::before{display:none}`,pe=class pe extends m{render(){return this.setAttribute("role","radio"),d` |
| 38 |
<button |
| 39 |
type="button" |
| 40 |
class="os-holo-sheen" |
| 41 |
@click=${()=>this._onPick()} |
| 42 |
> |
| 43 |
<slot></slot> |
| 44 |
</button> |
| 45 |
`}_onPick(){this.emit("os-segment-pick",{value:this.value})}};pe.props=["value"],pe.styles=[Hr],pe.help=void 0;let is=pe;v("os-segment",is);const ge=class ge extends m{constructor(){super(...arguments),this._resizeObserver=null}connectedCallback(){super.connectedCallback(),this.addEventListener("os-segment-pick",e=>{const t=e.detail;e.stopPropagation(),this.value=t.value,this.emit("os-pick",{value:t.value})}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._placeThumb()),this._resizeObserver.observe(this))}disconnectedCallback(){this._resizeObserver?.disconnect(),this._resizeObserver=null}_placeThumb(){if(!this.shadowRoot?.querySelector(".os-segmented__thumb"))return;const t=this.value,s=Array.from(this.querySelectorAll(":scope > os-segment")).find(c=>c.getAttribute("value")===t);if(!s||this.offsetWidth===0){this.removeAttribute("data-thumb");return}const o=this.getBoundingClientRect(),i=o.width/this.offsetWidth,n=Math.abs(i-1)<.02?1:i;if(!(n>0))return;const a=s.getBoundingClientRect(),l=c=>`${Math.round(c*100)/100}px`;this.style.setProperty("--_thumb-x",l((a.left-o.left)/n)),this.style.setProperty("--_thumb-w",l(a.width/n)),this.setAttribute("data-thumb",""),this.hasAttribute("data-thumb-ready")||requestAnimationFrame(()=>this.setAttribute("data-thumb-ready",""))}set items(e){const t=this.querySelectorAll(":scope > os-segment");for(const i of Array.from(t))i.remove();for(const i of e){const n=document.createElement("os-segment");n.setAttribute("value",i.value),n.textContent=i.label,this.appendChild(n)}const s=this.value;!(s!==null&&e.some(i=>i.value===s))&&e.length>0?this.value=e[0].value:this.requestUpdate()}render(){const e=this.label||"";e&&this.setAttribute("aria-label",e),this.setAttribute("role","radiogroup");const t=this.value;return queueMicrotask(()=>{const s=this.querySelectorAll("os-segment");for(const o of Array.from(s)){const i=o.getAttribute("value");o.setAttribute("aria-checked",i===t?"true":"false")}this._placeThumb()}),d`<span class="os-segmented__thumb" aria-hidden="true"></span |
| 46 |
><slot></slot>`}};ge.props=["value","label"],ge.styles=[Nr],ge.help={title:"Segmented",summary:"iOS-style segmented radio group. Pill-shaped bar of equal-width <os-segment> children where exactly one is active.",status:"stable",props:[{name:"value",type:"string",description:"Currently selected segment value. Mirrored onto child aria-checked."},{name:"label",type:"string",description:"aria-label for the radiogroup."}],slots:[{name:"(default)",description:'<os-segment value="…"> children.'}],events:[{name:"os-pick",description:"Fires when the selected segment changes.",detail:"{ value: string }"}],cssProps:[{name:"--os-window-bg",description:"Pill background."},{name:"--os-ui-fg",description:"Active label colour."},{name:"--os-ui-fg-muted",description:"Inactive label colour."}],example:d` |
| 47 |
<os-segmented value="md" label="Dock size"> |
| 48 |
<os-segment value="sm">Small</os-segment> |
| 49 |
<os-segment value="md">Medium</os-segment> |
| 50 |
<os-segment value="lg">Large</os-segment> |
| 51 |
</os-segmented> |
| 52 |
`};let rs=ge;v("os-segmented",rs);const Go={close:{a:'fill="currentColor"',b:'<path d="m13.06 12 6.47-6.47-1.06-1.06L12 10.94 5.53 4.47 4.47 5.53 10.94 12l-6.47 6.47 1.06 1.06L12 13.06l6.47 6.47 1.06-1.06L13.06 12Z" />'},check:{a:'fill="currentColor"',b:'<path d="M16.5 7.5 10 13.9l-2.5-2.4-1 1 3.5 3.6 7.5-7.6z" />'},"chevron-right":{a:'fill="currentColor"',b:'<path d="M10.6 6L9.4 7l4.6 5-4.6 5 1.2 1 5.4-6z" />'},"arrow-up-right":{a:'fill="currentColor"',b:'<path d="M10 6H18V14H16.5V8.5L7 18L6 17L15.5 7.5H10V6Z" />'},plus:{a:'fill="currentColor"',b:'<path d="M11 12.5V17.5H12.5V12.5H17.5V11H12.5V6H11V11H6V12.5H11Z" />'},search:{a:'fill="currentColor"',b:'<path d="M13 5c-3.3 0-6 2.7-6 6 0 1.4.5 2.7 1.3 3.7l-3.8 3.8 1.1 1.1 3.8-3.8c1 .8 2.3 1.3 3.7 1.3 3.3 0 6-2.7 6-6S16.3 5 13 5zm0 10.5c-2.5 0-4.5-2-4.5-4.5s2-4.5 4.5-4.5 4.5 2 4.5 4.5-2 4.5-4.5 4.5z" />'},pin:{a:'fill="currentColor"',b:'<path d="m21.5 9.1-6.6-6.6-4.2 5.6c-1.2-.1-2.4.1-3.6.7-.1 0-.1.1-.2.1-.5.3-.9.6-1.2.9l3.7 3.7-5.7 5.7v1.1h1.1l5.7-5.7 3.7 3.7c.4-.4.7-.8.9-1.2.1-.1.1-.2.2-.3.6-1.1.8-2.4.6-3.6l5.6-4.1zm-7.3 3.5.1.9c.1.9 0 1.8-.4 2.6l-6-6c.8-.4 1.7-.5 2.6-.4l.9.1L15 4.9 19.1 9l-4.9 3.6z" />'},trash:{a:'fill="currentColor"',b:'<path fill-rule="evenodd" clip-rule="evenodd" d="M12 5.5A2.25 2.25 0 0 0 9.878 7h4.244A2.251 2.251 0 0 0 12 5.5ZM12 4a3.751 3.751 0 0 0-3.675 3H5v1.5h1.27l.818 8.997a2.75 2.75 0 0 0 2.739 2.501h4.347a2.75 2.75 0 0 0 2.738-2.5L17.73 8.5H19V7h-3.325A3.751 3.751 0 0 0 12 4Zm4.224 4.5H7.776l.806 8.861a1.25 1.25 0 0 0 1.245 1.137h4.347a1.25 1.25 0 0 0 1.245-1.137l.805-8.861Z" />'},download:{a:'fill="currentColor"',b:'<path d="M18 11.3l-1-1.1-4 4V3h-1.5v11.3L7 10.2l-1 1.1 6.2 5.8 5.8-5.8zm.5 3.7v3.5h-13V15H4v5h16v-5h-1.5z" />'},settings:{a:'fill="currentColor"',b:'<path d="m19 7.5h-7.628c-.3089-.87389-1.1423-1.5-2.122-1.5-.97966 0-1.81309.62611-2.12197 1.5h-2.12803v1.5h2.12803c.30888.87389 1.14231 1.5 2.12197 1.5.9797 0 1.8131-.62611 2.122-1.5h7.628z" /><path d="m19 15h-2.128c-.3089-.8739-1.1423-1.5-2.122-1.5s-1.8131.6261-2.122 1.5h-7.628v1.5h7.628c.3089.8739 1.1423 1.5 2.122 1.5s1.8131-.6261 2.122-1.5h2.128z" />'},info:{a:'fill="currentColor"',b:'<path fill-rule="evenodd" clip-rule="evenodd" d="M5.5 12a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0ZM12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm.75 4v1.5h-1.5V8h1.5Zm0 8v-5h-1.5v5h1.5Z" />'},bell:{a:'fill="currentColor"',b:'<path fill-rule="evenodd" clip-rule="evenodd" d="M17 11.5c0 1.353.17 2.368.976 3 .266.209.602.376 1.024.5v1H5v-1c.422-.124.757-.291 1.024-.5.806-.632.976-1.647.976-3V9c0-2.8 2.2-5 5-5s5 2.2 5 5v2.5ZM15.5 9v2.5c0 .93.066 1.98.515 2.897l.053.103H7.932a4.018 4.018 0 0 0 .053-.103c.449-.917.515-1.967.515-2.897V9c0-1.972 1.528-3.5 3.5-3.5s3.5 1.528 3.5 3.5Zm-5.492 9.008c0-.176.023-.346.065-.508h3.854A1.996 1.996 0 0 1 12 20c-1.1 0-1.992-.892-1.992-1.992Z" />'},more:{a:'fill="currentColor"',b:'<path d="M11 13h2v-2h-2v2zm-6 0h2v-2H5v2zm12-2v2h2v-2h-2z" />'},maximize:{a:'fill="currentColor"',b:'<path d="M6 4a2 2 0 0 0-2 2v3h1.5V6a.5.5 0 0 1 .5-.5h3V4H6Zm3 14.5H6a.5.5 0 0 1-.5-.5v-3H4v3a2 2 0 0 0 2 2h3v-1.5Zm6 1.5v-1.5h3a.5.5 0 0 0 .5-.5v-3H20v3a2 2 0 0 1-2 2h-3Zm3-16a2 2 0 0 1 2 2v3h-1.5V6a.5.5 0 0 0-.5-.5h-3V4h3Z" />'},edit:{a:'fill="currentColor"',b:'<path d="m19 7-3-3-8.5 8.5-1 4 4-1L19 7Zm-7 11.5H5V20h7v-1.5Z" />'},color:{a:'fill="currentColor"',b:'<path d="M17.2 10.9c-.5-1-1.2-2.1-2.1-3.2-.6-.9-1.3-1.7-2.1-2.6L12 4l-1 1.1c-.6.9-1.3 1.7-2 2.6-.8 1.2-1.5 2.3-2 3.2-.6 1.2-1 2.2-1 3 0 3.4 2.7 6.1 6.1 6.1s6.1-2.7 6.1-6.1c0-.8-.3-1.8-1-3zm-5.1 7.6c-2.5 0-4.6-2.1-4.6-4.6 0-.3.1-1 .8-2.3.5-.9 1.1-1.9 2-3.1.7-.9 1.3-1.7 1.8-2.3.7.8 1.3 1.6 1.8 2.3.8 1.1 1.5 2.2 2 3.1.7 1.3.8 2 .8 2.3 0 2.5-2.1 4.6-4.6 4.6z" />'},wallpaper:{a:'fill="currentColor"',b:'<path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM5 4.5h14c.3 0 .5.2.5.5v8.4l-3-2.9c-.3-.3-.8-.3-1 0L11.9 14 9 12c-.3-.2-.6-.2-.8 0l-3.6 2.6V5c-.1-.3.1-.5.4-.5zm14 15H5c-.3 0-.5-.2-.5-.5v-2.4l4.1-3 3 1.9c.3.2.7.2.9-.1L16 12l3.5 3.4V19c0 .3-.2.5-.5.5z" />'},warning:{a:'fill="currentColor"',b:'<path fill-rule="evenodd" clip-rule="evenodd" d="M5.5 12a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0ZM12 4a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm-.75 12v-1.5h1.5V16h-1.5Zm0-8v5h1.5V8h-1.5Z" />'},minimize:{a:'fill="currentColor"',b:'<path d="M5 11.25h14v1.5H5z" />'},window:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="4.125" y="5.4375" width="15.75" height="13.125" rx="1.75"/><path d="M4.125 9.8125h15.75"/><circle cx="7.275" cy="7.625" r="0.7438" fill="currentColor" stroke="none"/>'},windows:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="3.6875" y="8.5" width="11.375" height="10.0625" rx="1.75"/><path d="M3.6875 12h11.375"/><path d="M8.5 8.5V7.1875a1.75 1.75 0 0 1 1.75-1.75h7.875A1.75 1.75 0 0 1 19.875 7.1875v7a1.75 1.75 0 0 1-1.75 1.75h-3.0625"/>'},dock:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="3.25" y="8.5" width="17.5" height="7" rx="3.5"/><circle cx="7.625" cy="12" r="1.0062" fill="currentColor" stroke="none"/><circle cx="12" cy="12" r="1.0062" fill="currentColor" stroke="none"/><circle cx="16.375" cy="12" r="1.0062" fill="currentColor" stroke="none"/>'},spaces:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="3.6875" y="5.4375" width="7.4375" height="7.875" rx="1.75"/><rect x="12.875" y="5.4375" width="7.4375" height="7.875" rx="1.75"/><circle cx="9.375" cy="17.6875" r="0.7875" fill="currentColor" stroke="none"/><circle cx="12" cy="17.6875" r="0.7875" fill="currentColor" stroke="none"/><circle cx="14.625" cy="17.6875" r="0.7875" fill="currentColor" stroke="none"/>'},copilot:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<path d="M10 2.5Q10.9 8.5 17.5 10Q10.9 11.5 10 17.5Q9.1 11.5 2.5 10Q9.1 8.5 10 2.5Z" fill="currentColor" stroke="none"/><path d="M17.9 14Q18.35 17.1 21.5 17.6Q18.35 18.1 17.9 21.2Q17.45 18.1 14.3 17.6Q17.45 17.1 17.9 14Z" fill="currentColor" stroke="none"/>'},snap:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="3.6875" y="5.4375" width="16.625" height="13.125" rx="1.75"/><path d="M12 5.4375v13.125"/><path d="M12 12h8.3125"/>'},command:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<path d="M14.625 6.75v10.5a2.625 2.625 0 1 0 2.625-2.625H6.75a2.625 2.625 0 1 0 2.625 2.625V6.75a2.625 2.625 0 1 0-2.625 2.625h10.5a2.625 2.625 0 1 0-2.625-2.625"/>'},apps:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="4.125" y="4.125" width="6.5625" height="6.5625" rx="1.75"/><rect x="13.3125" y="4.125" width="6.5625" height="6.5625" rx="1.75"/><rect x="4.125" y="13.3125" width="6.5625" height="6.5625" rx="1.75"/><rect x="13.3125" y="13.3125" width="6.5625" height="6.5625" rx="1.75"/>'},widgets:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="3.6875" y="3.6875" width="9.625" height="9.625" rx="1.75"/><rect x="15.0625" y="3.6875" width="5.25" height="5.25" rx="1.75"/><rect x="15.0625" y="10.6875" width="5.25" height="9.625" rx="1.75"/><rect x="3.6875" y="15.0625" width="9.625" height="5.25" rx="1.75"/>'},user:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<circle cx="12" cy="8.9375" r="3.5"/><path d="M5.4375 19.4375a6.5625 6.5625 0 0 1 13.125 0"/>'},lock:{a:'fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"',b:'<rect x="5.4375" y="10.6875" width="13.125" height="8.75" rx="1.75"/><path d="M8.5 10.6875V8.0625a3.5 3.5 0 0 1 7 0v2.625"/>'}};function Zo(r){return r.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function Fr(r){return Object.prototype.hasOwnProperty.call(Go,r)?Go[r]:null}function Ur(r,e={}){const t=Fr(r);if(!t)return"";const{size:s=24,className:o,title:i,rotate:n}=e,a=['xmlns="http://www.w3.org/2000/svg"','viewBox="0 0 24 24"'];s!=null&&a.push(`width="${s}"`,`height="${s}"`),a.push(t.a),o&&a.push(`class="${Zo(o)}"`),i?a.push('role="img"',`aria-label="${Zo(i)}"`):a.push('aria-hidden="true"','focusable="false"');const l=n?`<g transform="rotate(${n} 12 12)">${t.b}</g>`:t.b;return`<svg ${a.join(" ")}>${l}</svg>`}function I(r,e={}){const t=Ur(r,e),s=document.createElement("div");s.innerHTML=t;const o=s.firstElementChild;return o instanceof SVGSVGElement?o:document.createElementNS("http://www.w3.org/2000/svg","svg")}const Kr=b` ${$}:host{display:flex;flex-direction:column;gap:8px;font-size:13px;color:var( --os-ui-fg,#1d2327 );min-width:0}:host( [ hidden ] ){display:none}.os-select__label{font-size:13px;line-height:1.5;color:var( --os-ui-fg-muted,#646970 )}.os-select__trigger{appearance:none;display:flex;align-items:center;gap:8px;width:100%;min-width:0;padding:8px 12px;background:var( --os-ui-hover,rgba( 0,0,0,0.05 ) );border:1px solid transparent;border-radius:8px;font:inherit;font-size:13px;line-height:1.5;color:var( --os-ui-fg,#1d2327 );text-align:start;cursor:pointer;transition:background-color var( --_holo-t ) ease,border-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}.os-select__trigger:hover:not(:disabled ){background:var( --os-ui-hover,rgba( 0,0,0,0.08 ) );border-color:var( --os-ui-border-strong,#8c8f94 )}.os-select__trigger:focus,.os-select__trigger:focus-visible{outline:none;border-color:var( --os-ui-accent,#2271b1 );box-shadow:var( --_holo-focus-field )}.os-select__trigger:disabled{opacity:0.5;cursor:not-allowed}:host( [ plain ] ){display:inline-flex;flex-direction:row;align-items:center}:host( [ plain ] ) .os-select__label{display:none}:host( [ plain ] ) .os-select__trigger{width:auto;padding:4px 6px;background:transparent;border-color:transparent;border-radius:6px}:host( [ plain ] ) .os-select__trigger:hover:not(:disabled ){background:var( --os-ui-hover,rgba( 0,0,0,0.05 ) );border-color:transparent}:host( [ plain ] ) .os-select__trigger:focus,:host( [ plain ] ) .os-select__trigger:focus-visible{border-color:var( --os-ui-accent,#2271b1 )}:host( [ plain ] ) .os-select__value{flex:0 1 auto}.os-select__value{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-select__value--placeholder{color:var( --os-ui-fg-muted,#646970 )}.os-select__chevron{flex:0 0 auto;pointer-events:none;color:var( --os-ui-fg-muted,#646970 )}.os-select__trigger:hover .os-select__chevron{color:var( --os-ui-fg,#1d2327 )}.os-select__trigger:focus .os-select__chevron,.os-select__trigger:focus-visible .os-select__chevron{color:var( --os-ui-accent,#2271b1 )}.os-select__popup{position:fixed;inset:auto;margin:0;max-height:min( 320px,60vh );overflow-y:auto;padding:4px;background:var( --os-ui-surface,#fff );border:1px solid var( --os-ui-border,#dcdcde );border-radius:8px;box-shadow:0 12px 32px rgba( 0,0,0,0.45 );color:var( --os-ui-fg,#1d2327 )}.os-select__popup:not( [ data-open ] ){display:none}.os-select__popup:popover-open{display:block}.os-select__popup[ data-open ]{position:absolute;top:calc( 100% + 4px );left:0;min-width:100%;z-index:1000}:host{position:relative}.os-select__option{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;font-size:13px;line-height:1.5;cursor:pointer;white-space:nowrap}.os-select__check{flex:0 0 auto;visibility:hidden}.os-select__option[ aria-selected='true' ] .os-select__check{visibility:visible}.os-select__option[ data-active ],.os-select__option:hover{background:var( --os-ui-accent,#2271b1 );color:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) )}.os-select__option[ aria-disabled='true' ]{opacity:0.5;cursor:not-allowed}.os-select__option[ aria-disabled='true' ]:hover{background:transparent;color:inherit}@media ( prefers-reduced-motion:reduce ){.os-select__trigger{transition-duration:1ms}}`,Vr=b`:host{display:none}`,be=class be extends m{render(){return d``}};be.props=["value","disabled"],be.styles=[Vr],be.help=void 0;let ns=be;v("os-option",ns);const fe=class fe extends m{constructor(){super(...arguments),this._optionObserver=null,this._open=!1,this._activeIndex=-1,this._typed="",this._dismissedAt=0,this._typedTimer=null,this._onWindowScroll=e=>{const t=e.target,s=this._popup();s&&t instanceof Node&&(t===s||s.contains(t))||this._hide()},this._onWindowResize=()=>this._hide()}set items(e){const t=this.querySelectorAll(":scope > os-option");for(const i of Array.from(t))i.remove();for(const i of e){const n=document.createElement("os-option");n.setAttribute("value",i.value),n.textContent=i.label,this.appendChild(n)}const s=this.value;!(s!==null&&e.some(i=>i.value===s))&&e.length>0&&(this.value=e[0].value),this.requestUpdate()}connectedCallback(){super.connectedCallback(),ie(this),this._optionObserver=new MutationObserver(()=>this.requestUpdate()),this._optionObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","disabled"],characterData:!0})}disconnectedCallback(){this._optionObserver?.disconnect(),this._optionObserver=null,this._teardownDismiss(),this._open=!1,this._typedTimer&&(clearTimeout(this._typedTimer),this._typedTimer=null)}render(){const e=this.label||"",t=this.value,s=this.placeholder||"",o=this.disabled!==null;e&&this.setAttribute("aria-label",e);const i=this.getAttribute("aria-label")||"",n=e||i||s,a=this._readOptions(),l=a.find(g=>g.value===t),c=l?l.label:s,u=this.id||"os-unnamed",h=`${u}__listbox`,p=`${u}__trigger`,f=this._open&&this._activeIndex>=0?`${u}__opt-${this._activeIndex}`:"";return d` |
| 53 |
${e?d`<label |
| 54 |
class="os-select__label" |
| 55 |
for=${p} |
| 56 |
>${e}</label>`:d``} |
| 57 |
<button |
| 58 |
type="button" |
| 59 |
class="os-select__trigger" |
| 60 |
id=${p} |
| 61 |
role="combobox" |
| 62 |
aria-haspopup="listbox" |
| 63 |
aria-expanded=${this._open?"true":"false"} |
| 64 |
aria-controls=${h} |
| 65 |
aria-label=${n} |
| 66 |
aria-activedescendant=${f} |
| 67 |
?disabled=${o} |
| 68 |
@click=${()=>this._toggle()} |
| 69 |
@keydown=${g=>this._onTriggerKeydown(g)} |
| 70 |
> |
| 71 |
<span |
| 72 |
class="os-select__value${l?"":" os-select__value--placeholder"}" |
| 73 |
>${c}</span |
| 74 |
> |
| 75 |
${I("chevron-right",{size:16,rotate:90,className:"os-select__chevron"})} |
| 76 |
</button> |
| 77 |
<div |
| 78 |
class="os-select__popup" |
| 79 |
id=${h} |
| 80 |
role="listbox" |
| 81 |
popover="auto" |
| 82 |
aria-label=${n} |
| 83 |
@toggle=${g=>this._onPopoverToggle(g)} |
| 84 |
> |
| 85 |
${a.map((g,x)=>d` |
| 86 |
<div |
| 87 |
class="os-select__option" |
| 88 |
id=${`${u}__opt-${x}`} |
| 89 |
role="option" |
| 90 |
data-value=${g.value} |
| 91 |
aria-selected=${g.value===t?"true":"false"} |
| 92 |
aria-disabled=${g.disabled?"true":"false"} |
| 93 |
?data-active=${this._open&&x===this._activeIndex} |
| 94 |
@click=${()=>this._onOptionClick(g)} |
| 95 |
@pointermove=${()=>this._setActive(x)} |
| 96 |
> |
| 97 |
${I("check",{size:16,className:"os-select__check"})} |
| 98 |
<span class="os-select__option-label" |
| 99 |
>${g.label}</span |
| 100 |
> |
| 101 |
</div> |
| 102 |
`)} |
| 103 |
</div> |
| 104 |
`}_readOptions(){const e=[],t=this.querySelectorAll(":scope > os-option");for(const s of Array.from(t)){const o=s.getAttribute("value");o!==null&&e.push({value:o,label:(s.textContent||o).trim(),disabled:s.hasAttribute("disabled")})}return e}_popup(){return this.shadowRoot?.querySelector(".os-select__popup")??null}_trigger(){return this.shadowRoot?.querySelector(".os-select__trigger")??null}_toggle(){if(this._open){this._hide();return}performance.now()-this._dismissedAt<250||this._show()}_show(){const e=this._popup(),t=this._trigger();if(!e||!t||this._open)return;this._open=!0;const s=this._readOptions(),o=this.value,i=s.findIndex(a=>a.value===o&&!a.disabled);this._activeIndex=i>=0?i:s.findIndex(a=>!a.disabled);const n=t.getBoundingClientRect();e.style.minWidth=`${n.width}px`,typeof e.showPopover=="function"?(e.style.left=`${n.left}px`,e.style.top=`${n.bottom+4}px`,e.showPopover(),n.bottom+4+e.offsetHeight>window.innerHeight-8&&(e.style.top=`${Math.max(8,n.top-4-e.offsetHeight)}px`)):e.setAttribute("data-open",""),window.addEventListener("scroll",this._onWindowScroll,{capture:!0,passive:!0}),window.addEventListener("resize",this._onWindowResize),this.requestUpdate(),this._scrollActiveIntoView()}_hide(){if(!this._open)return;this._open=!1;const e=this._popup();if(e){if(typeof e.hidePopover=="function")try{e.hidePopover()}catch{}e.removeAttribute("data-open")}this._teardownDismiss(),this.requestUpdate()}_teardownDismiss(){window.removeEventListener("scroll",this._onWindowScroll,{capture:!0}),window.removeEventListener("resize",this._onWindowResize)}_onPopoverToggle(e){e.newState==="closed"&&this._open&&(this._dismissedAt=performance.now(),this._open=!1,this._teardownDismiss(),this.requestUpdate())}_onOptionClick(e){e.disabled||this._commit(e.value)}_commit(e){this._hide(),this.value=e,this.emit("os-pick",{value:e})}_setActive(e){if(e===this._activeIndex)return;const t=this._readOptions();!t[e]||t[e].disabled||(this._activeIndex=e,this.requestUpdate())}_moveActive(e){const t=this._readOptions();let s=this._activeIndex;for(let o=0;o<t.length&&(s=Math.min(Math.max(s+e,0),t.length-1),!(!t[s]?.disabled||s===0||s===t.length-1));o++);s!==this._activeIndex&&t[s]&&!t[s].disabled&&(this._activeIndex=s,this.requestUpdate(),this._scrollActiveIntoView())}_scrollActiveIntoView(){queueMicrotask(()=>{this.shadowRoot?.querySelector(".os-select__option[data-active]")?.scrollIntoView?.({block:"nearest"})})}_typeAhead(e){this._typedTimer&&clearTimeout(this._typedTimer),this._typed+=e.toLowerCase(),this._typedTimer=setTimeout(()=>{this._typed=""},500);const s=this._readOptions().findIndex(o=>!o.disabled&&o.label.toLowerCase().startsWith(this._typed));s>=0&&(this._activeIndex=s,this.requestUpdate(),this._scrollActiveIntoView())}_onTriggerKeydown(e){const t=this._readOptions();if(t.length!==0){if(!this._open){if(["ArrowDown","ArrowUp","Enter"," ","Home","End"].includes(e.key)){if(e.preventDefault(),this._show(),e.key==="Home"&&(this._activeIndex=t.findIndex(s=>!s.disabled)),e.key==="End"){for(let s=t.length-1;s>=0;s--)if(!t[s].disabled){this._activeIndex=s;break}}this.requestUpdate()}else e.key.length===1&&e.key.trim()!==""&&(this._show(),this._typeAhead(e.key));return}switch(e.key){case"ArrowDown":e.preventDefault(),this._moveActive(1);break;case"ArrowUp":e.preventDefault(),this._moveActive(-1);break;case"Home":e.preventDefault(),this._activeIndex=t.findIndex(s=>!s.disabled),this.requestUpdate(),this._scrollActiveIntoView();break;case"End":e.preventDefault();for(let s=t.length-1;s>=0;s--)if(!t[s].disabled){this._activeIndex=s,this.requestUpdate(),this._scrollActiveIntoView();break}break;case"Enter":case" ":{e.preventDefault();const s=t[this._activeIndex];s&&!s.disabled&&this._commit(s.value);break}case"Tab":{const s=t[this._activeIndex];s&&!s.disabled?this._commit(s.value):this._hide();break}case"Escape":e.preventDefault(),this._hide();break;default:e.key.length===1&&e.key.trim()!==""&&this._typeAhead(e.key)}}}};fe.props=["value","label","placeholder","disabled","name"],fe.styles=[Kr],fe.help={title:"Select",summary:"Dropdown picker: a combobox trigger plus a custom top-layer listbox, so the popup wears the station instead of the operating system. Mirrors the <os-segmented> contract (set value, listen for os-pick).",status:"stable",props:[{name:"value",type:"string",description:"Currently selected option value."},{name:"label",type:"string",description:"Visible label rendered above the trigger and used as the accessible name."},{name:"placeholder",type:"string",description:"Trigger text shown when no value is set."},{name:"disabled",type:"boolean attribute",description:"Disables the trigger and dims the chrome."},{name:"plain",type:"boolean attribute",description:"Drops the field chrome and shrinks to the value, for a picker that is a list row’s trailing control rather than a field of its own. The container already draws the box; use with no `label`."},{name:"name",type:"string",description:"Accepted for compatibility. Shadow-DOM controls never participated in light-DOM form submission, so nothing is lost by the native select being gone; read `value` off the host instead."}],slots:[{name:"(default)",description:'<os-option value="…"> children.'}],events:[{name:"os-pick",description:"Fires when the user picks a new option.",detail:"{ value: string }"}],cssProps:[{name:"--os-ui-fg",description:"Label + value colour."},{name:"--os-ui-fg-muted",description:"Placeholder + chevron colour."},{name:"--os-ui-accent",description:"Active option row + selected check."}],example:d` |
| 105 |
<os-select value="eur" label="Currency"> |
| 106 |
<os-option value="eur">Euro</os-option> |
| 107 |
<os-option value="usd">US Dollar</os-option> |
| 108 |
<os-option value="jpy">Japanese Yen</os-option> |
| 109 |
</os-select> |
| 110 |
`};let as=fe;v("os-select",as);const jr=b` |
| 111 |
:host { |
| 112 |
display: flex; |
| 113 |
flex-direction: column; |
| 114 |
gap: 4px; |
| 115 |
font-size: 13px; |
| 116 |
color: var( --os-ui-fg, #1d2327 ); |
| 117 |
min-width: 0; |
| 118 |
} |
| 119 |
|
| 120 |
:host( [ hidden ] ) { |
| 121 |
display: none; |
| 122 |
} |
| 123 |
|
| 124 |
.os-multiselect__label { |
| 125 |
font-size: 12px; |
| 126 |
color: var( --os-ui-fg-muted, #646970 ); |
| 127 |
} |
| 128 |
|
| 129 |
.os-multiselect__trigger { |
| 130 |
appearance: none; |
| 131 |
display: inline-flex; |
| 132 |
align-items: center; |
| 133 |
justify-content: space-between; |
| 134 |
gap: 8px; |
| 135 |
width: 100%; |
| 136 |
min-width: 0; |
| 137 |
padding: 7px 12px 7px 12px; |
| 138 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.05 ) ); |
| 139 |
border: 1px solid transparent; |
| 140 |
border-radius: 7px; |
| 141 |
font: inherit; |
| 142 |
font-size: 13px; |
| 143 |
color: var( --os-ui-fg, #1d2327 ); |
| 144 |
cursor: pointer; |
| 145 |
text-align: start; |
| 146 |
transition: background-color 0.12s ease, border-color 0.12s ease, |
| 147 |
box-shadow 0.12s ease; |
| 148 |
} |
| 149 |
|
| 150 |
.os-multiselect__trigger:hover { |
| 151 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.08 ) ); |
| 152 |
} |
| 153 |
|
| 154 |
.os-multiselect__trigger:focus-visible { |
| 155 |
outline: none; |
| 156 |
border-color: var( --os-ui-accent, #2271b1 ); |
| 157 |
box-shadow: var( |
| 158 |
--os-ui-focus-ring-field, |
| 159 |
0 0 0 1px #2271b1, 0 0 0 4px rgba( 34, 113, 177, 0.18 ) |
| 160 |
); |
| 161 |
} |
| 162 |
|
| 163 |
.os-multiselect__trigger:disabled { |
| 164 |
opacity: 0.5; |
| 165 |
cursor: not-allowed; |
| 166 |
} |
| 167 |
|
| 168 |
.os-multiselect__trigger[ data-active='true' ] { |
| 169 |
color: var( --wp-admin-theme-color, #2271b1 ); |
| 170 |
font-weight: 600; |
| 171 |
} |
| 172 |
|
| 173 |
.os-multiselect__summary { |
| 174 |
flex: 1 1 auto; |
| 175 |
min-width: 0; |
| 176 |
overflow: hidden; |
| 177 |
text-overflow: ellipsis; |
| 178 |
white-space: nowrap; |
| 179 |
} |
| 180 |
|
| 181 |
.os-multiselect__chevron { |
| 182 |
color: var( --os-ui-fg-muted, #646970 ); |
| 183 |
flex-shrink: 0; |
| 184 |
transition: color 0.12s ease, transform 0.18s ease; |
| 185 |
} |
| 186 |
|
| 187 |
.os-multiselect__trigger:hover .os-multiselect__chevron, |
| 188 |
.os-multiselect__trigger:focus-visible .os-multiselect__chevron { |
| 189 |
color: var( --os-ui-fg, #1d2327 ); |
| 190 |
} |
| 191 |
|
| 192 |
:host( [ open ] ) .os-multiselect__chevron { |
| 193 |
transform: rotate( 180deg ); |
| 194 |
} |
| 195 |
`;function Br(){const r="os-multiselect-popover-styles";if(document.getElementById(r))return;const e=document.createElement("style");e.id=r,e.textContent=` |
| 196 |
.os-multiselect__popover { |
| 197 |
position: fixed; |
| 198 |
z-index: 100000; |
| 199 |
max-height: 320px; |
| 200 |
overflow-y: auto; |
| 201 |
min-width: 200px; |
| 202 |
padding: 4px 0; |
| 203 |
background: var( --os-window-bg, #fff ); |
| 204 |
color: var( --os-ui-fg, #1d2327 ); |
| 205 |
border: 1px solid var( --os-window-border, #c3c4c7 ); |
| 206 |
border-radius: 8px; |
| 207 |
box-shadow: 0 8px 28px rgba( 0, 0, 0, 0.18 ); |
| 208 |
font: inherit; |
| 209 |
font-size: 13px; |
| 210 |
} |
| 211 |
|
| 212 |
.os-multiselect__clear { |
| 213 |
display: block; |
| 214 |
width: 100%; |
| 215 |
padding: 6px 12px; |
| 216 |
font: inherit; |
| 217 |
font-size: 11px; |
| 218 |
font-weight: 600; |
| 219 |
letter-spacing: 0.04em; |
| 220 |
text-transform: uppercase; |
| 221 |
text-align: start; |
| 222 |
border: 0; |
| 223 |
border-bottom: 1px solid var( --os-window-border, #dcdcde ); |
| 224 |
background: transparent; |
| 225 |
color: var( --wp-admin-theme-color, #2271b1 ); |
| 226 |
cursor: pointer; |
| 227 |
} |
| 228 |
|
| 229 |
.os-multiselect__clear:hover { |
| 230 |
background: color-mix( |
| 231 |
in srgb, |
| 232 |
var( --wp-admin-theme-color, #2271b1 ) 10%, |
| 233 |
transparent |
| 234 |
); |
| 235 |
} |
| 236 |
|
| 237 |
.os-multiselect__option { |
| 238 |
display: flex; |
| 239 |
align-items: center; |
| 240 |
gap: 8px; |
| 241 |
padding: 6px 12px; |
| 242 |
cursor: pointer; |
| 243 |
user-select: none; |
| 244 |
} |
| 245 |
|
| 246 |
.os-multiselect__option:hover { |
| 247 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.05 ) ); |
| 248 |
} |
| 249 |
|
| 250 |
.os-multiselect__option[ data-disabled='true' ] { |
| 251 |
opacity: 0.5; |
| 252 |
cursor: not-allowed; |
| 253 |
} |
| 254 |
|
| 255 |
.os-multiselect__option > span { |
| 256 |
flex: 1 1 auto; |
| 257 |
min-width: 0; |
| 258 |
overflow: hidden; |
| 259 |
text-overflow: ellipsis; |
| 260 |
white-space: nowrap; |
| 261 |
} |
| 262 |
|
| 263 |
.os-multiselect__option > input[ type='checkbox' ] { |
| 264 |
margin: 0; |
| 265 |
flex-shrink: 0; |
| 266 |
accent-color: var( --wp-admin-theme-color, #2271b1 ); |
| 267 |
} |
| 268 |
|
| 269 |
.os-multiselect__empty { |
| 270 |
padding: 8px 12px; |
| 271 |
color: var( --os-ui-fg-muted, #646970 ); |
| 272 |
font-style: italic; |
| 273 |
} |
| 274 |
|
| 275 |
.os-multiselect__loading { |
| 276 |
display: flex; |
| 277 |
align-items: center; |
| 278 |
gap: 8px; |
| 279 |
padding: 8px 12px; |
| 280 |
color: var( --os-ui-fg-muted, #646970 ); |
| 281 |
font-size: 12px; |
| 282 |
} |
| 283 |
|
| 284 |
.os-multiselect__spinner { |
| 285 |
display: inline-block; |
| 286 |
width: 12px; |
| 287 |
height: 12px; |
| 288 |
border-radius: 50%; |
| 289 |
border: 2px solid currentColor; |
| 290 |
border-top-color: transparent; |
| 291 |
animation: os-multiselect-spin 0.8s linear infinite; |
| 292 |
} |
| 293 |
|
| 294 |
@keyframes os-multiselect-spin { |
| 295 |
to { transform: rotate( 360deg ); } |
| 296 |
} |
| 297 |
`,document.head.appendChild(e)}typeof document<"u"&&Br();const me=class me extends m{constructor(){super(...arguments),this._optionObserver=null,this._popover=null,this._teardownOpen=null,this._hasMore=!1,this._loadingMore=!1}set items(e){const t=this.querySelectorAll(":scope > os-option");for(const i of Array.from(t))i.remove();for(const i of e){const n=document.createElement("os-option");n.setAttribute("value",i.value),n.textContent=i.label,this.appendChild(n)}this._loadingMore=!1;const s=new Set(e.map(i=>i.value)),o=this._readValues().filter(i=>s.has(i));this._writeValueAttribute(o),this.requestUpdate(),this._refreshPopover()}get values(){return this._readValues()}set values(e){const t=Array.isArray(e)?e.map(s=>String(s)).filter(s=>s!==""):[];this._writeValueAttribute(t),this.requestUpdate(),this._refreshPopover()}get hasMore(){return this._hasMore}set hasMore(e){this._hasMore=!!e,this._refreshPopover()}get loadingMore(){return this._loadingMore}set loadingMore(e){this._loadingMore=!!e,this._refreshPopover()}appendItems(e){if(this._loadingMore=!1,!e||e.length===0){this._refreshPopover();return}const t=new Set(Array.from(this.querySelectorAll(":scope > os-option")).map(s=>s.getAttribute("value")));for(const s of e){if(t.has(s.value))continue;const o=document.createElement("os-option");o.setAttribute("value",s.value),o.textContent=s.label,this.appendChild(o)}this.requestUpdate(),this._refreshPopover()}connectedCallback(){super.connectedCallback(),ie(this),this._optionObserver=new MutationObserver(()=>{this.requestUpdate(),this._refreshPopover()}),this._optionObserver.observe(this,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["value","disabled"],characterData:!0})}disconnectedCallback(){this._optionObserver?.disconnect(),this._optionObserver=null,this._closePopover()}render(){const e=this.label||"",t=this.placeholder||"All",s=this.disabled!==null;e?this.setAttribute("aria-label",e):this.removeAttribute("aria-label");const o=e||t,i=this._summarize(t),n=this._readValues().length>0,l=`${this.id||"os-unnamed"}__trigger`;return d` |
| 298 |
${e?d`<label |
| 299 |
class="os-multiselect__label" |
| 300 |
for=${l} |
| 301 |
>${e}</label>`:d``} |
| 302 |
<button |
| 303 |
id=${l} |
| 304 |
type="button" |
| 305 |
class="os-multiselect__trigger" |
| 306 |
aria-haspopup="listbox" |
| 307 |
aria-expanded=${this._isOpen()?"true":"false"} |
| 308 |
aria-label=${o} |
| 309 |
?disabled=${s} |
| 310 |
data-active=${n?"true":"false"} |
| 311 |
@click=${c=>this._onTriggerClick(c)} |
| 312 |
> |
| 313 |
<span class="os-multiselect__summary">${i}</span> |
| 314 |
${I("chevron-right",{size:16,rotate:90,className:"os-multiselect__chevron"})} |
| 315 |
</button> |
| 316 |
`}_readOptions(){const e=[],t=this.querySelectorAll(":scope > os-option");for(const s of Array.from(t)){const o=s.getAttribute("value");o!==null&&e.push({value:o,label:(s.textContent||o).trim(),disabled:s.hasAttribute("disabled")})}return e}_readValues(){return(this.value??"").split(",").map(t=>t.trim()).filter(t=>t!=="")}_writeValueAttribute(e){const t=e.join(",");this.value=t}_summarize(e){const t=this._readValues();if(t.length===0)return e;const s=this._readOptions(),o=new Map(s.map(i=>[i.value,i.label]));return t.length===1?o.get(t[0])??t[0]:`${t.length} selected`}_isOpen(){return this.open!==null}_onTriggerClick(e){e.stopPropagation(),e.preventDefault(),this.disabled===null&&(this._popover?this._closePopover():this._openPopover())}_openPopover(){if(this._popover)return;const e=document.createElement("div");e.className="os-multiselect__popover",e.setAttribute("role","listbox"),e.setAttribute("aria-multiselectable","true"),e.style.setProperty("--wp-admin-theme-color",getComputedStyle(this).getPropertyValue("--wp-admin-theme-color")||"#2271b1"),document.body.appendChild(e),this._popover=e,this._refreshPopover(),this._placePopover();const t=n=>{const a=n.target;if(!a)return;const l=this.shadowRoot?.querySelector(".os-multiselect__trigger");e.contains(a)||l&&l.contains(a)||this._closePopover()},s=n=>{n.key==="Escape"&&(n.stopPropagation(),this._closePopover(),this.shadowRoot?.querySelector(".os-multiselect__trigger")?.focus())},o=()=>this._placePopover(),i=()=>{if(!this._hasMore||this._loadingMore)return;const n=e.scrollHeight,a=e.clientHeight,l=e.scrollTop;n-(l+a)<64&&this.emit("os-multiselect-load-more",{})};setTimeout(()=>{document.addEventListener("pointerdown",t,!0)},0),document.addEventListener("keydown",s,!0),window.addEventListener("resize",o),window.addEventListener("scroll",o,!0),e.addEventListener("scroll",i),this._teardownOpen=()=>{document.removeEventListener("pointerdown",t,!0),document.removeEventListener("keydown",s,!0),window.removeEventListener("resize",o),window.removeEventListener("scroll",o,!0),e.removeEventListener("scroll",i)},this.setAttribute("open",""),this.requestUpdate(),this.emit("os-multiselect-open",{})}_closePopover(){this._teardownOpen&&(this._teardownOpen(),this._teardownOpen=null),this._popover&&(this._popover.remove(),this._popover=null,this.removeAttribute("open"),this.requestUpdate(),this.emit("os-multiselect-close",{}))}_refreshPopover(){const e=this._popover;if(!e)return;const t=this._readOptions(),s=new Set(this._readValues());if(e.replaceChildren(),t.length===0){const o=document.createElement("div");o.className="os-multiselect__empty",o.textContent="No options",e.appendChild(o);return}if(s.size>0){const o=document.createElement("button");o.type="button",o.className="os-multiselect__clear",o.textContent="Clear",o.addEventListener("click",i=>{i.preventDefault(),i.stopPropagation(),this._writeValueAttribute([]),this.requestUpdate(),this._refreshPopover(),this._emitPick()}),e.appendChild(o)}for(const o of t){const i=document.createElement("label");i.className="os-multiselect__option",i.setAttribute("role","option"),i.setAttribute("aria-selected",s.has(o.value)?"true":"false"),o.disabled&&(i.setAttribute("aria-disabled","true"),i.dataset.disabled="true");const n=document.createElement("input");n.type="checkbox",n.checked=s.has(o.value),n.disabled=o.disabled,n.addEventListener("change",()=>{const l=new Set(this._readValues());n.checked?l.add(o.value):l.delete(o.value);const c=t.map(u=>u.value).filter(u=>l.has(u));this._writeValueAttribute(c),i.setAttribute("aria-selected",n.checked?"true":"false"),this.requestUpdate(),this._refreshPopover(),this._emitPick()});const a=document.createElement("span");a.textContent=o.label,i.appendChild(n),i.appendChild(a),e.appendChild(i)}if(this._loadingMore){const o=document.createElement("div");o.className="os-multiselect__loading";const i=document.createElement("span");i.className="os-multiselect__spinner",i.setAttribute("aria-hidden","true");const n=document.createElement("span");n.textContent="Loading…",o.appendChild(i),o.appendChild(n),e.appendChild(o)}}_placePopover(){const e=this._popover,t=this.shadowRoot?.querySelector(".os-multiselect__trigger");if(!e||!t)return;const s=t.getBoundingClientRect(),o=window.innerWidth,i=window.innerHeight,n=Math.max(s.width,200);e.style.minWidth=`${n}px`;let a=s.left;a+n>o-8&&(a=Math.max(8,o-n-8)),e.style.left=`${a}px`,e.style.top=`${s.bottom+4}px`;const l=e.offsetHeight||200;s.bottom+4+l>i-8&&(e.style.top=`${Math.max(8,s.top-l-4)}px`)}_emitPick(){const e=this._readValues();this.emit("os-pick",{value:e.join(","),values:e})}};me.props=["value","label","placeholder","disabled","name","open"],me.styles=[jr],me.help=void 0;let ls=me;v("os-multiselect",ls);const Wr=b` ${$}:host{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var( --os-ui-fg-muted,#646970 )}label{display:inline-flex;align-items:center;gap:8px}input[ type='color' ]{width:28px;height:28px;padding:0;border:1px solid var( --os-ui-border,#c3c4c7 );border-radius:6px;background:transparent;cursor:pointer;transition:border-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}input[ type='color' ]:hover{border-color:var( --os-ui-border-strong,#8c8f94 )}input[ type='color' ]:focus-visible{outline:none;box-shadow:var( --_holo-focus )}:host( [ variant='block' ] ){display:flex;width:100%}:host( [ variant='block' ] ) label{display:flex;flex:1;align-items:center}:host( [ variant='block' ] ) input[ type='color' ]{flex:1;width:auto;height:32px}input[ type='color' ]::-webkit-color-swatch-wrapper{padding:2px}input[ type='color' ]::-webkit-color-swatch{border:none;border-radius:2px}`,ve=class ve extends m{open(){const e=()=>{const t=this.shadowRoot?.querySelector("input");if(!t)return!1;try{t.showPicker()}catch{t.click()}return!0};e()||queueMicrotask(()=>void e())}render(){const e=this.label||"",t=this.value||"#000000";return d` |
| 317 |
<label> |
| 318 |
<span class="os-color-field__label">${e}</span> |
| 319 |
<input |
| 320 |
type="color" |
| 321 |
.value=${t} |
| 322 |
@input=${s=>this._onInput(s)} |
| 323 |
/> |
| 324 |
</label> |
| 325 |
`}_onInput(e){const t=e.target;this.value=t.value,this.emit("os-color-change",{value:t.value})}};ve.props=["name","label","value","variant"],ve.styles=[Wr],ve.help=void 0;let cs=ve;v("os-color-field",cs);const Xr=b` ${$}:host{display:flex;align-items:center;gap:10px;font-size:12px;color:var( --os-ui-fg-muted,#646970 )}input[ type='range' ]{appearance:none;-webkit-appearance:none;flex:1;min-width:0;height:18px;margin:0;padding:0;background:transparent;cursor:pointer}input[ type='range' ]:disabled{cursor:not-allowed;opacity:0.5}input[ type='range' ]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background-image:linear-gradient( var( --_range-angle,90deg ),transparent var( --_fill,0% ),var( --_holo-track ) var( --_fill,0% ) ),linear-gradient( var( --os-ui-accent,#2271b1 ),var( --os-ui-accent,#2271b1 ) );background-size:auto,auto;background-position:center,center;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px var( --_holo-track-edge )}input[ type='range' ]::-moz-range-track{height:6px;border-radius:999px;background-image:linear-gradient( var( --_range-angle,90deg ),transparent var( --_fill,0% ),var( --_holo-track ) var( --_fill,0% ) ),linear-gradient( var( --os-ui-accent,#2271b1 ),var( --os-ui-accent,#2271b1 ) );background-size:auto,auto;background-position:center,center;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px var( --_holo-track-edge )}input[ type='range' ]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:16px;height:16px;margin-top:-5px;border:0;border-radius:50%;background:var( --os-ui-switch-knob,#fffbff );box-shadow:0 1px 3px rgba( 12,11,15,0.5 ),0 0 0 1px rgba( 12,11,15,0.14 );cursor:inherit;transition:transform var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}input[ type='range' ]::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:var( --os-ui-switch-knob,#fffbff );box-shadow:0 1px 3px rgba( 12,11,15,0.5 ),0 0 0 1px rgba( 12,11,15,0.14 );cursor:inherit;transition:transform var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}input[ type='range' ]:active::-webkit-slider-thumb{transform:scale( 1.15 );box-shadow:var( --_holo-glow-strong )}input[ type='range' ]:active::-moz-range-thumb{transform:scale( 1.15 );box-shadow:var( --_holo-glow-strong )}input[ type='range' ]:focus-visible{outline:none}input[ type='range' ]:focus-visible::-webkit-slider-thumb{box-shadow:var( --_holo-focus )}input[ type='range' ]:focus-visible::-moz-range-thumb{box-shadow:var( --_holo-focus )}.os-range-field__value{width:var( --os-ui-range-readout-width,3ch );flex:none;text-align:end;font-variant-numeric:tabular-nums;color:var( --os-ui-fg,#1d2327 )}@media ( prefers-reduced-motion:reduce ){input[ type='range' ]::-webkit-slider-thumb{transition-duration:1ms}input[ type='range' ]::-moz-range-thumb{transition-duration:1ms}}`;function Gr(r,e,t){const s=Number.parseFloat(r),o=Number.parseFloat(e),i=Number.parseFloat(t);if(!Number.isFinite(s)||!Number.isFinite(o)||!Number.isFinite(i)||i===o)return"0%";const n=(s-o)/(i-o);return`${Math.min(100,Math.max(0,n*100)).toFixed(2)}%`}function Zr(r){const e=r.indexOf(".");return e<0?0:Math.min(3,r.length-e-1)}function Yr(r,e,t,s){const o=n=>{const a=Number.parseFloat(n);return Number.isFinite(a)?String(Math.trunc(Math.abs(a))).length+(a<0?1:0):3};return Math.max(o(r),o(e))+(t>0?t+1:0)+s.length}const _e=class _e extends m{render(){const e=this.label||"",t=this.value||"0",s=this.min||"0",o=this.max||"100",i=this.step||"1",n=this.suffix||"",a=this.decimals,l=a?Math.min(6,Math.max(0,Number.parseInt(a,10)||0)):Zr(i),c=Number.parseFloat(t),u=Number.isFinite(c)?c.toFixed(l):t,h=Yr(s,o,l,n);return d` |
| 326 |
<label class="os-range-field__label">${e}</label> |
| 327 |
<input |
| 328 |
type="range" |
| 329 |
min=${s} |
| 330 |
max=${o} |
| 331 |
step=${i} |
| 332 |
style="--_fill: ${Gr(t,s,o)}" |
| 333 |
.value=${t} |
| 334 |
@input=${p=>this._onInput(p)} |
| 335 |
/> |
| 336 |
<span |
| 337 |
class="os-range-field__value" |
| 338 |
style="--os-ui-range-readout-width: ${h}ch" |
| 339 |
>${u}${n}</span |
| 340 |
> |
| 341 |
`}connectedCallback(){super.connectedCallback(),getComputedStyle(this).direction==="rtl"&&this.style.setProperty("--_range-angle","270deg")}_onInput(e){const t=e.target,s=parseFloat(t.value);Number.isFinite(s)&&(this.value=String(s),this.emit("os-range-change",{value:s}))}};_e.props=["name","label","value","min","max","step","suffix","decimals"],_e.styles=[Xr],_e.help=void 0;let ds=_e;v("os-range-field",ds);const Yo=b` ${$} ${es}:host{--_field-size:var( --os-ui-field-font-size,13px );--_field-radius:var( --os-ui-field-radius,6px );display:flex;flex-direction:column;gap:4px;font-size:var( --_field-size );color:var( --os-ui-fg,#1d2327 );min-width:0}:host( [ hidden ] ){display:none}.os-text-field__label{font-size:12px;color:var( --os-ui-fg-muted,#646970 )}.os-text-field__label--hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;white-space:nowrap;clip-path:inset( 50% )}.os-text-field__row{position:relative;display:flex;align-items:center;width:100%}input{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;box-sizing:border-box;padding:7px 10px;background:var( --os-window-bg,#fff );border:1px solid var( --os-ui-border,#dcdcde );border-radius:var( --_field-radius );font:inherit;font-size:var( --_field-size );color:var( --os-ui-fg,#1d2327 )}input:is( [ type='date' ],[ type='datetime-local' ],[ type='month' ],[ type='week' ] )::-webkit-calendar-picker-indicator{--_calendar-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='1.5'%3E%3Cpath d='M4.75 7.25L4.75 18C4.75 18.6904 5.30964 19.25 6 19.25H18C18.6904 19.25 19.25 18.6904 19.25 18V7.25V6C19.25 5.30964 18.6904 4.75 18 4.75H6C5.30964 4.75 4.75 5.30964 4.75 6V7.25ZM19.25 7.25H4.75M7.25 10.75H9.25M11 10.75H13M14.75 10.75H16.75M7.25 14.5H9.25M11 14.5H13M14.75 14.5H16.75' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M18 4.75H6C5.30964 4.75 4.75 5.30964 4.75 6V7.25H19.25V6C19.25 5.30964 18.6904 4.75 18 4.75Z' fill='currentColor' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");background:var( --os-ui-fg-muted,#646970 );-webkit-mask:var( --_calendar-icon ) center / contain no-repeat;mask:var( --_calendar-icon ) center / contain no-repeat;width:16px;height:16px;cursor:pointer}@media ( forced-colors:active ){input:is( [ type='date' ],[ type='datetime-local' ],[ type='month' ],[ type='week' ] )::-webkit-calendar-picker-indicator{background:ButtonText;forced-color-adjust:none}}.os-text-field__suffix{position:absolute;inset-inline-end:10px;top:50%;transform:translateY( -50% );pointer-events:none;font-size:12px;color:var( --os-ui-fg-muted,#646970 )}.os-text-field__row--has-reveal input{padding-inline-end:36px}:host( [ clearable ] ) input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}.os-text-field__row--has-clear input{padding-inline-end:36px}.os-text-field__row--has-reveal.os-text-field__row--has-clear input{padding-inline-end:68px}.os-text-field__clear{position:absolute;inset-inline-end:0;top:0;bottom:0;width:34px;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;color:var( --os-ui-fg-muted,#646970 );cursor:pointer;border-radius:0 6px 6px 0}.os-text-field__row--has-reveal .os-text-field__clear{inset-inline-end:34px;border-radius:0}.os-text-field__clear:hover{color:var( --os-ui-accent,#2271b1 )}.os-text-field__clear:focus-visible{outline:none;color:var( --os-ui-accent,#2271b1 );box-shadow:inset 0 0 0 2px var( --os-ui-accent,#2271b1 )}.os-text-field__clear:disabled{opacity:0.45;cursor:default}.os-text-field__reveal{position:absolute;inset-inline-end:0;top:0;bottom:0;width:34px;display:flex;align-items:center;justify-content:center;padding:0;border:none;background:transparent;color:var( --os-ui-fg-muted,#646970 );cursor:pointer;border-radius:0 6px 6px 0;transition:color 0.12s ease}.os-text-field__reveal:hover{color:var( --os-ui-accent,#2271b1 )}.os-text-field__reveal:focus-visible{outline:none;color:var( --os-ui-accent,#2271b1 );box-shadow:inset 0 0 0 2px var( --os-ui-accent,#2271b1 );border-radius:0 6px 6px 0}.os-text-field__reveal:disabled{opacity:0.45;cursor:not-allowed}.os-text-field__input--masked{-webkit-text-security:disc;text-security:disc}@supports not ( ( -webkit-text-security:disc ) or ( text-security:disc ) ){.os-text-field__input--masked{font-family:text-security-disc,"password",monospace;letter-spacing:0.2em}}input:disabled{opacity:0.55;cursor:not-allowed;background:var( --os-ui-hover,rgba( 0,0,0,0.03 ) )}input[ aria-invalid='true' ],input[ aria-invalid='true' ]:hover:not(:disabled ){border-color:var( --os-ui-danger,#d63638 )}input[ aria-invalid='true' ]:focus,input[ aria-invalid='true' ]:focus-visible{border-color:var( --os-ui-danger,#d63638 );box-shadow:0 0 0 1px var( --os-ui-danger,#d63638 ),0 0 0 4px rgba( 214,54,56,0.18 )}input[ type='number' ]::-webkit-inner-spin-button,input[ type='number' ]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[ type='number' ]{-moz-appearance:textfield}`,xe=class xe extends m{constructor(){super(...arguments),this._revealed=!1}connectedCallback(){super.connectedCallback(),ie(this)}render(){const e=this.label||"",t=this.hideLabel!==null,s=this.value??"",o=this.placeholder||"",i=this.disabled!==null,n=this.readonly!==null,a=this.autocomplete,l=this.type||"text",c=l==="password";let u=a||"off";c&&(!a||u==="off")&&(u="new-password");const h=this.maxlength,p=this.minlength,f=this.pattern||"",g=this.name||"",x=this.suffix||"",_=this.invalid!==null,y=this.reveal!==null,w=this.clearable!==null,S=l==="password",z=S&&!(y&&this._revealed);let M;S||y&&this._revealed?M="text":M=l;const A=["os-text-field__row",y?"os-text-field__row--has-reveal":"",w?"os-text-field__row--has-clear":""].filter(Boolean).join(" "),U=z?"os-text-field__input os-text-field__input--masked":"os-text-field__input",Et=`${this.id||"os-unnamed"}__input`;return d` |
| 342 |
${e?d`<label |
| 343 |
class=${t?"os-text-field__label os-text-field__label--hidden":"os-text-field__label"} |
| 344 |
for=${Et} |
| 345 |
>${e}</label>`:d``} |
| 346 |
<span class=${A}> |
| 347 |
<input |
| 348 |
id=${Et} |
| 349 |
class=${U} |
| 350 |
type=${M} |
| 351 |
.value=${s} |
| 352 |
placeholder=${o} |
| 353 |
?disabled=${i} |
| 354 |
?readonly=${n} |
| 355 |
autocomplete=${u} |
| 356 |
maxlength=${h??""} |
| 357 |
minlength=${p??""} |
| 358 |
pattern=${f} |
| 359 |
name=${g} |
| 360 |
aria-invalid=${_?"true":"false"} |
| 361 |
aria-label=${e||""} |
| 362 |
@input=${Q=>this._onInput(Q)} |
| 363 |
@change=${Q=>this._onChange(Q)} |
| 364 |
@keydown=${Q=>this._onKeyDown(Q)} |
| 365 |
/> |
| 366 |
${x?d`<span class="os-text-field__suffix">${x}</span>`:d``} |
| 367 |
${w&&s!==""?this._renderClearButton(i):d``} |
| 368 |
${y?this._renderRevealButton(i):d``} |
| 369 |
</span> |
| 370 |
`}_renderClearButton(e){return d` |
| 371 |
<button |
| 372 |
type="button" |
| 373 |
class="os-text-field__clear" |
| 374 |
aria-label="Clear" |
| 375 |
?disabled=${e} |
| 376 |
tabindex="0" |
| 377 |
@click=${()=>this._onClear()} |
| 378 |
> |
| 379 |
${Qr()} |
| 380 |
</button> |
| 381 |
`}_onClear(){this.value="",this.emit("os-input-change",{value:""}),this.emit("os-input-commit",{value:""}),this.shadowRoot?.querySelector("input")?.focus()}_renderRevealButton(e){const t=this._revealed?"Hide":"Show";return d` |
| 382 |
<button |
| 383 |
type="button" |
| 384 |
class="os-text-field__reveal" |
| 385 |
aria-label=${t} |
| 386 |
aria-pressed=${this._revealed?"true":"false"} |
| 387 |
?disabled=${e} |
| 388 |
tabindex="0" |
| 389 |
@click=${()=>this._onToggleReveal()} |
| 390 |
> |
| 391 |
${this._revealed?Or():Jr()} |
| 392 |
</button> |
| 393 |
`}_onToggleReveal(){this._revealed=!this._revealed,this.requestUpdate()}_onInput(e){const t=e.target;this.value=t.value,this.emit("os-input-change",{value:t.value})}_onChange(e){const t=e.target;this.emit("os-input-commit",{value:t.value})}_onKeyDown(e){if(e.key==="Enter"&&!e.shiftKey&&!e.altKey&&!e.metaKey){const t=e.target;this.emit("os-submit",{value:t.value})}}};xe.props=["label","hideLabel","value","placeholder","disabled","readonly","autocomplete","type","maxlength","minlength","pattern","name","suffix","invalid","reveal","clearable"],xe.styles=[Yo],xe.help=void 0;let us=xe;v("os-text-field",us);function Qr(){return d` |
| 394 |
<svg |
| 395 |
viewBox="0 0 16 16" |
| 396 |
width="14" |
| 397 |
height="14" |
| 398 |
fill="none" |
| 399 |
stroke="currentColor" |
| 400 |
stroke-width="1.5" |
| 401 |
stroke-linecap="round" |
| 402 |
aria-hidden="true" |
| 403 |
focusable="false" |
| 404 |
> |
| 405 |
<path d="M4 4l8 8M12 4l-8 8" /> |
| 406 |
</svg> |
| 407 |
`}function Jr(){return d` |
| 408 |
<svg |
| 409 |
viewBox="0 0 16 16" |
| 410 |
width="14" |
| 411 |
height="14" |
| 412 |
fill="none" |
| 413 |
stroke="currentColor" |
| 414 |
stroke-width="1.5" |
| 415 |
stroke-linecap="round" |
| 416 |
stroke-linejoin="round" |
| 417 |
aria-hidden="true" |
| 418 |
focusable="false" |
| 419 |
> |
| 420 |
<path d="M1 8C1 8 3.5 3 8 3s7 5 7 5-2.5 5-7 5S1 8 1 8z" /> |
| 421 |
<circle cx="8" cy="8" r="2" /> |
| 422 |
</svg> |
| 423 |
`}function Or(){return d` |
| 424 |
<svg |
| 425 |
viewBox="0 0 16 16" |
| 426 |
width="14" |
| 427 |
height="14" |
| 428 |
fill="none" |
| 429 |
stroke="currentColor" |
| 430 |
stroke-width="1.5" |
| 431 |
stroke-linecap="round" |
| 432 |
stroke-linejoin="round" |
| 433 |
aria-hidden="true" |
| 434 |
focusable="false" |
| 435 |
> |
| 436 |
<path d="M1 8C1 8 3.5 3 8 3s7 5 7 5-2.5 5-7 5S1 8 1 8z" /> |
| 437 |
<circle cx="8" cy="8" r="2" /> |
| 438 |
<line x1="2" y1="2" x2="14" y2="14" /> |
| 439 |
</svg> |
| 440 |
`}const ye=class ye extends m{connectedCallback(){super.connectedCallback(),ie(this)}render(){const e=this.label||"",t=this.value??"",s=this.placeholder||"",o=this.disabled!==null,i=this.readonly!==null,n=this.name||"",a=this.suffix||"",l=this.min,c=this.max,u=this.step||"any",h=this.invalid!==null,f=`${this.id||"os-unnamed"}__input`;return d` |
| 441 |
${e?d`<label |
| 442 |
class="os-text-field__label" |
| 443 |
for=${f} |
| 444 |
>${e}</label>`:d``} |
| 445 |
<span class="os-text-field__row"> |
| 446 |
<input |
| 447 |
id=${f} |
| 448 |
type="number" |
| 449 |
.value=${t} |
| 450 |
placeholder=${s} |
| 451 |
?disabled=${o} |
| 452 |
?readonly=${i} |
| 453 |
inputmode="decimal" |
| 454 |
autocomplete="off" |
| 455 |
min=${l??""} |
| 456 |
max=${c??""} |
| 457 |
step=${u} |
| 458 |
name=${n} |
| 459 |
aria-invalid=${h?"true":"false"} |
| 460 |
aria-label=${e||""} |
| 461 |
@input=${g=>this._onInput(g)} |
| 462 |
@change=${g=>this._onCommit(g)} |
| 463 |
@keydown=${g=>this._onKeyDown(g)} |
| 464 |
/> |
| 465 |
${a?d`<span class="os-text-field__suffix">${a}</span>`:d``} |
| 466 |
</span> |
| 467 |
`}_readRange(){const e=this.min,t=this.max,s=e!==null?parseFloat(e):-1/0,o=t!==null?parseFloat(t):1/0;return{min:Number.isFinite(s)?s:-1/0,max:Number.isFinite(o)?o:1/0}}_clamp(e){const{min:t,max:s}=this._readRange();return e<t?t:e>s?s:e}_onInput(e){const t=e.target,s=parseFloat(t.value);Number.isFinite(s)&&(this.value=String(s),this.emit("os-input-change",{value:s}))}_onCommit(e){const t=e.target,s=parseFloat(t.value);if(!Number.isFinite(s))return;const o=this._clamp(s);o!==s&&(t.value=String(o),this.value=String(o)),this.emit("os-input-commit",{value:o})}_onKeyDown(e){if(e.key==="Enter"&&!e.shiftKey&&!e.altKey&&!e.metaKey){const t=e.target,s=parseFloat(t.value);if(!Number.isFinite(s))return;const o=this._clamp(s);o!==s&&(t.value=String(o),this.value=String(o)),this.emit("os-submit",{value:o})}}};ye.props=["label","value","placeholder","disabled","readonly","name","suffix","min","max","step","invalid"],ye.styles=[Yo],ye.help=void 0;let hs=ye;v("os-number-field",hs);const en=b` ${$} ${Dt}:host{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var( --os-ui-fg,#1d2327 );cursor:pointer}:host( [ disabled ] ){cursor:not-allowed;opacity:0.55}:host( [ block ] ){display:flex;cursor:default}:host( [ block ] ) label{cursor:pointer}:host( [ block ][ disabled ] ) label{cursor:not-allowed}label{display:inline-flex;align-items:center;gap:6px;cursor:inherit}.os-checkbox__label{line-height:1.3}.os-checkbox__label:empty{display:none}`,we=class we extends m{render(){const e=this.checked!==null,t=this.disabled!==null,s=this.label||"",o=this.value;return d` |
| 468 |
<label> |
| 469 |
<input |
| 470 |
type="checkbox" |
| 471 |
.checked=${e} |
| 472 |
?disabled=${t} |
| 473 |
.value=${o??""} |
| 474 |
@change=${i=>this._onChange(i)} |
| 475 |
/> |
| 476 |
<span class="os-checkbox__label">${s}</span> |
| 477 |
</label> |
| 478 |
`}_onChange(e){const s=e.target.checked;s?this.setAttribute("checked",""):this.removeAttribute("checked"),this.emit("os-checkbox-change",{checked:s,value:this.value})}};we.props=["checked","value","label","disabled"],we.styles=[en],we.help=void 0;let ps=we;v("os-checkbox",ps);const tn=b` ${$} ${Dt}:host{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var( --os-ui-fg,#1d2327 );cursor:pointer;-webkit-user-select:none;user-select:none}label{display:inline-flex;align-items:center;gap:8px;cursor:pointer}:host( [ disabled ] ){opacity:0.5;cursor:not-allowed}:host( [ disabled ] ) label,:host( [ disabled ] ) input[ type='checkbox' ]{cursor:not-allowed}`,ke=class ke extends m{render(){const e=this.label||"",t=this.checked!==null,s=this.disabled!==null;return d` |
| 479 |
<label> |
| 480 |
<input |
| 481 |
type="checkbox" |
| 482 |
?checked=${t} |
| 483 |
?disabled=${s} |
| 484 |
@change=${o=>this._onChange(o)} |
| 485 |
/> |
| 486 |
<span class="os-checkbox-label__text">${e}</span> |
| 487 |
</label> |
| 488 |
`}_onChange(e){if(this.disabled!==null)return;const t=e.target.checked;t?this.setAttribute("checked",""):this.removeAttribute("checked"),this.emit("os-checkbox-change",{checked:t})}};ke.props=["label","checked","disabled"],ke.styles=[tn],ke.help=void 0;let gs=ke;v("os-checkbox-label",gs);const sn=b` ${$}:host{--_h:22px;--_pad:2px;--_knob:calc( var( --_h ) - 2 * var( --_pad ) );--_travel:calc( var( --_w ) - var( --_knob ) - 2 * var( --_pad ) );--_w:calc( var( --_h ) * 1.85 );--_drag:0px;--_dir:1;display:inline-flex;align-items:center;gap:10px;font-size:13px;line-height:1.3;color:var( --os-ui-fg,#1d2327 );cursor:pointer;-webkit-user-select:none;user-select:none}:host( [ size='sm' ] ){--_h:16px;--_pad:2px;font-size:12px;gap:8px}:host( [ size='lg' ] ){--_h:30px;--_pad:3px;font-size:14px;gap:12px}:host( [ block ] ){display:flex;width:100%;justify-content:space-between}:host( [ label-position='start' ] ) .os-switch__row{flex-direction:row-reverse}:host( [ disabled ] ){cursor:not-allowed;opacity:0.5}.os-switch__row{display:inline-flex;align-items:center;gap:inherit;flex:1 1 auto;justify-content:inherit}button{appearance:none;flex:0 0 auto;position:relative;box-sizing:border-box;width:var( --_w );height:var( --_h );padding:0;margin:0;border:0;border-radius:999px;background-color:var( --_holo-track );background-image:none;box-shadow:inset 0 0 0 1px var( --_holo-track-edge );cursor:inherit;outline:none;transition:background-color var( --_holo-t ) ease,box-shadow var( --_holo-t ) ease}button:disabled{cursor:not-allowed}:host( [ checked ] ) button{background-image:none;background-color:var( --os-ui-accent,#2271b1 );box-shadow:none}button:focus-visible{box-shadow:var( --_holo-focus ),inset 0 0 0 1px var( --_holo-track-edge )}:host( [ checked ] ) button:focus-visible{box-shadow:var( --_holo-focus )}:host( [ tone='accent' ][ checked ] ) button,:host( [ tone='danger' ][ checked ] ) button,:host( [ tone='success' ][ checked ] ) button{background-image:none}:host( [ tone='accent' ][ checked ] ) button{background-color:var( --os-ui-accent,#2271b1 )}:host( [ tone='danger' ][ checked ] ) button{background-color:var( --os-ui-danger,#d63638 );box-shadow:0 0 0 1px rgba( 255,90,90,0.3 ),0 2px 10px rgba( 255,90,90,0.25 )}:host( [ tone='success' ][ checked ] ) button{background-color:var( --os-ui-success-fg,#00a32a );box-shadow:0 0 0 1px rgba( 147,240,198,0.3 ),0 2px 10px rgba( 147,240,198,0.25 )}.os-switch__knob{position:absolute;top:var( --_pad );inset-inline-start:var( --_pad );width:var( --_knob );height:var( --_knob );border-radius:999px;background:var( --os-ui-switch-knob,#fffbff );box-shadow:0 1px 2px rgba( 12,11,15,0.45 ),0 0 0 1px var( --os-ui-switch-knob-edge,rgba( 12,11,15,0.55 ) );pointer-events:none;transition:transform var( --_holo-t ) var( --_holo-spring ),width var( --_holo-t ) ease}.os-switch__knob{transform:translateX( calc( var( --_dir ) * var( --_drag ) ) )}:host( [ checked ] ) .os-switch__knob{transform:translateX( calc( var( --_dir ) * ( var( --_travel ) + var( --_drag ) ) ) )}:host(:not( [ disabled ] ) ) button:active .os-switch__knob{width:calc( var( --_knob ) * 1.28 )}:host( [ checked ]:not( [ disabled ] ) ) button:active .os-switch__knob{width:calc( var( --_knob ) * 1.28 );transform:translateX( calc( var( --_dir ) * ( var( --_travel ) - var( --_knob ) * 0.28 + var( --_drag ) ) ) )}:host( [ data-dragging ] ) .os-switch__knob{transition:width var( --_holo-t ) ease}.os-switch__label{line-height:1.3}.os-switch__label:empty{display:none}.os-switch__text{display:flex;flex-direction:column;gap:2px;min-width:0}.os-switch__description{font-size:0.92em;color:var( --os-ui-fg-muted,#646970 )}@media ( prefers-reduced-motion:reduce ){.os-switch__knob{transition-duration:1ms}}`,on=4,$e=class $e extends m{constructor(){super(...arguments),this._pointerId=null,this._startX=0,this._travel=0,this._moved=!1,this._dir=1,this._swallowClick=!1}render(){const e=this._attr("checked")!==null,t=this._attr("disabled")!==null,s=this._attr("label")||"",o=this._attr("description")||"";return d` |
| 489 |
<div class="os-switch__row"> |
| 490 |
<span class="os-switch__text"> |
| 491 |
<span class="os-switch__label">${s}</span> |
| 492 |
<span class="os-switch__description" id="os-switch-desc" |
| 493 |
>${o}</span |
| 494 |
> |
| 495 |
</span> |
| 496 |
<button |
| 497 |
type="button" |
| 498 |
role="switch" |
| 499 |
aria-checked=${e?"true":"false"} |
| 500 |
aria-label=${s||"Toggle"} |
| 501 |
aria-describedby=${o?"os-switch-desc":""} |
| 502 |
?disabled=${t} |
| 503 |
@click=${()=>this._onClick()} |
| 504 |
@keydown=${i=>this._onKeyDown(i)} |
| 505 |
@pointerdown=${i=>this._onPointerDown(i)} |
| 506 |
@pointermove=${i=>this._onPointerMove(i)} |
| 507 |
@pointerup=${i=>this._onPointerUp(i)} |
| 508 |
@pointercancel=${()=>this._endGesture()} |
| 509 |
> |
| 510 |
<span class="os-switch__knob"></span> |
| 511 |
</button> |
| 512 |
</div> |
| 513 |
`}_onPointerDown(e){if(this._attr("disabled")!==null)return;const t=e.currentTarget;this._pointerId=e.pointerId,this._startX=e.clientX,this._moved=!1,this._dir=getComputedStyle(this).direction==="rtl"?-1:1,this.style.setProperty("--_dir",String(this._dir)),this._travel=Math.max(0,t.clientWidth-t.clientHeight),t.setPointerCapture(e.pointerId)}_onPointerMove(e){if(this._pointerId!==e.pointerId||this._travel===0)return;const t=(e.clientX-this._startX)*this._dir;if(!this._moved&&Math.abs(t)>=on&&(this._moved=!0,this.setAttribute("data-dragging","")),!this._moved)return;const s=this._attr("checked")!==null,o=s?-this._travel:0,i=s?0:this._travel;this.style.setProperty("--_drag",`${Math.min(i,Math.max(o,t))}px`)}_onPointerUp(e){if(this._pointerId!==e.pointerId)return;const t=this._moved,s=(e.clientX-this._startX)*this._dir;if(this._swallowClick=t,this._endGesture(),!t)return;const o=this._attr("checked")!==null,n=(o?this._travel:0)+s>this._travel/2;n!==o&&this._commit(n)}_endGesture(){this._pointerId=null,this._moved=!1,this.removeAttribute("data-dragging"),this.style.removeProperty("--_drag")}_onClick(){if(this._swallowClick){this._swallowClick=!1;return}this._attr("disabled")===null&&this._commit(this._attr("checked")===null)}_onKeyDown(e){this._attr("disabled")===null&&(e.key==="ArrowRight"||e.key==="End"?(e.preventDefault(),this._attr("checked")===null&&this._commit(!0)):(e.key==="ArrowLeft"||e.key==="Home")&&(e.preventDefault(),this._attr("checked")!==null&&this._commit(!1)))}_commit(e){e?this.setAttribute("checked",""):this.removeAttribute("checked");const t={checked:e,value:this._attr("value")};this.emit("os-switch-change",t),this.emit("os-checkbox-change",t)}_attr(e){return this[e]??null}};$e.props=["name","checked","value","label","description","disabled","size","tone","block","labelPosition"],$e.styles=[sn],$e.help=void 0;let bs=$e;v("os-switch",bs);const rn="desktop-mode";function nn(){return window.wp?.i18n}function k(r,e=rn){return nn()?.__(r,e)??r}const an=b`:host{position:fixed;top:calc( var( --os-admin-bar-height,var( --wp-admin--admin-bar--height,32px ) ) + 16px );inset-inline-end:16px;display:flex;flex-direction:column;gap:8px;z-index:calc( var( --os-z-fullscreen,99999 ) + 10 );pointer-events:none}`,ln=b` ${$}:host{position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;min-width:280px;max-width:420px;padding:10px 14px;background-color:var( --os-ui-toast-bg,var( --os-ui-modal-bg,#1d2327 ) );background-image:var( --os-ui-toast-bg-image,none );background-repeat:var( --os-ui-toast-bg-image-repeat,repeat );background-size:var( --os-ui-toast-bg-image-size,auto );background-position:var( --os-ui-toast-bg-image-position,center );color:var( --os-ui-fg-on-accent,#fff );border-radius:10px;border:1px solid var( --os-ui-border,rgba( 255,255,255,0.12 ) );box-shadow:0 10px 30px rgba( 0,0,0,0.4 ),0 2px 6px rgba( 0,0,0,0.18 ),inset 0 0 0 1px rgba( 255,255,255,0.04 );font-size:13px;line-height:1.4;opacity:0;transform:translateY( -10px ) scale( 0.97 );transition:opacity var( --_holo-t-fast ) linear,transform var( --_holo-t ) var( --_holo-spring );pointer-events:auto}:host( [ state='in' ] ){opacity:1;transform:translateY( 0 ) scale( 1 )}:host( [ state='out' ] ){opacity:0;transform:translateX( 16px ) scale( 0.97 );transition:opacity var( --_holo-t-fast ) linear,transform var( --_holo-t ) var( --_holo-ease )}.os-toast__label{flex:1}.os-toast__icon{display:inline-flex;flex-shrink:0;color:var( --os-ui-toast-accent,currentColor )}.os-toast__icon[ hidden ]{display:none}:host( [ tone ] )::before{content:'';position:absolute;inset-block:0;inset-inline-start:0;width:3px;background:var( --os-ui-toast-accent,transparent )}:host( [ tone='positive' ] ){--os-ui-toast-accent:var( --os-ui-notice-success,var( --os-ui-success-fg,#1a7f37 ) )}:host( [ tone='warning' ] ){--os-ui-toast-accent:var( --os-ui-notice-warning,var( --os-ui-warning-fg,#9a6700 ) )}:host( [ tone='critical' ] ){--os-ui-toast-accent:var( --os-ui-notice-error,var( --os-ui-danger,#cf222e ) )}:host( [ tone='neutral' ] ){--os-ui-toast-accent:var( --os-ui-notice-neutral,var( --os-ui-fg-muted,#57606a ) )}button[ hidden ]{display:none}button{flex-shrink:0;padding:4px 10px;border:none;border-radius:4px;background:var( --os-ui-hover,rgba( 255,255,255,0.12 ) );color:var( --os-ui-fg-on-accent,#fff );font:inherit;font-size:12px;font-weight:500;cursor:pointer;transition:background-color 0.12s ease}button:hover{background:var( --os-ui-scrim,rgba( 255,255,255,0.22 ) )}button:focus-visible{outline:2px solid var( --os-ui-border,rgba( 255,255,255,0.6 ) );outline-offset:2px}.os-toast__close{display:inline-flex;align-items:center;justify-content:center;padding:4px;border-radius:6px;background:transparent;color:var( --os-ui-fg-muted,rgba( 255,255,255,0.7 ) )}.os-toast__close:hover{background:var( --os-ui-hover,rgba( 255,255,255,0.14 ) );color:var( --os-ui-fg-on-accent,#fff )}@media ( prefers-reduced-motion:reduce ){:host{transition-duration:0.01ms}}`,Wt=class Wt extends m{connectedCallback(){super.connectedCallback(),this.setAttribute("aria-live","polite")}render(){return d`<slot></slot>`}};Wt.styles=[an],Wt.help=void 0;let fs=Wt;v("os-toast-container",fs);const cn={positive:"check",warning:"warning",critical:"warning",neutral:"info"},Ce=class Ce extends m{constructor(){super(...arguments),this._hovered=!1,this._focused=!1,this._onEnter=()=>{this._hovered=!0,this._syncHold()},this._onLeave=()=>{this._hovered=!1,this._syncHold()},this._onFocusIn=()=>{this._focused=!0,this._syncHold()},this._onFocusOut=e=>{const t=e.relatedTarget;t instanceof Node&&this._containsDeep(t)||(this._focused=!1,this._syncHold())}}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","status"),this.addEventListener("mouseenter",this._onEnter),this.addEventListener("mouseleave",this._onLeave),this.addEventListener("focusin",this._onFocusIn),this.addEventListener("focusout",this._onFocusOut)}disconnectedCallback(){this.removeEventListener("mouseenter",this._onEnter),this.removeEventListener("mouseleave",this._onLeave),this.removeEventListener("focusin",this._onFocusIn),this.removeEventListener("focusout",this._onFocusOut)}_containsDeep(e){let t=e;for(;t;){if(t===this)return!0;const s=t.parentNode;t=s instanceof ShadowRoot?s.host:s}return!1}_syncHold(){const e=this._hovered||this._focused;e!==this.hasAttribute("held")&&(e?this.setAttribute("held",""):this.removeAttribute("held"),this.emit("os-toast-hold",{held:e}))}render(){const e=this.action||"",t=this.hasAttribute("dismissible"),s=this.tone||"";return d` |
| 514 |
<span class="os-toast__icon" ?hidden=${!s} aria-hidden="true"> |
| 515 |
${I(cn[s]??"info",{size:16})} |
| 516 |
</span> |
| 517 |
<span class="os-toast__label"><slot></slot></span> |
| 518 |
<button |
| 519 |
type="button" |
| 520 |
?hidden=${!e} |
| 521 |
@click=${o=>this._onAction(o)} |
| 522 |
> |
| 523 |
${e} |
| 524 |
</button> |
| 525 |
<button |
| 526 |
type="button" |
| 527 |
class="os-toast__close" |
| 528 |
aria-label=${k("Dismiss")} |
| 529 |
?hidden=${!t} |
| 530 |
@click=${o=>this._onDismiss(o)} |
| 531 |
> |
| 532 |
${I("close",{size:16})} |
| 533 |
</button> |
| 534 |
`}_onAction(e){e.preventDefault(),e.stopPropagation(),this.emit("os-toast-action",{})}_onDismiss(e){e.preventDefault(),e.stopPropagation(),this.emit("os-toast-dismiss",{})}};Ce.props=["action","state","dismissible","tone"],Ce.styles=[ln],Ce.help={title:"Toast",summary:'Single transient notification. Message is slotted; fade-in / fade-out is CSS-driven by flipping the state attribute between "in" and "out". Usually created via the showToast() helper rather than authored by hand.',status:"stable",props:[{name:"action",type:"string",description:"Optional action button label. When set, a button renders on the right and emits os-toast-action on click."},{name:"state",type:"'in' | 'out'",description:'Drives the CSS fade transition. Set to "in" when rendered, flip to "out" before removal.'},{name:"dismissible",type:"boolean",description:"When set, a close (×) button renders on the right and emits os-toast-dismiss on click. Use for persistent toasts the user must be able to close."},{name:"tone",type:"'positive' | 'warning' | 'critical' | 'neutral'",description:"What kind of news this is. Paints a coloured edge and a leading icon from the palette’s notice tokens; absent, the toast is the plain dark chip. showToast() sets it from the type option through the server’s toast-type registry."},{name:"held",type:"boolean (reflected, read-only)",description:"Set by the component while the pointer is over the toast or focus is inside it. showToast() pauses the auto-dismiss timer for as long as it is present. Do not set it by hand — pass `persistent` for a toast that should never expire."}],slots:[{name:"(default)",description:"Message text."}],events:[{name:"os-toast-action",description:"Fires when the action button is clicked.",detail:"{}"},{name:"os-toast-dismiss",description:"Fires when the close (×) button is clicked.",detail:"{}"},{name:"os-toast-hold",description:"Fires when the toast starts or stops being attended to — pointer over it, or focus inside it. showToast() pauses the auto-dismiss timer while held is true.",detail:"{ held: boolean }"}],example:d` |
| 535 |
<os-toast state="in" action="Undo">Post moved to trash.</os-toast> |
| 536 |
<os-toast state="in" tone="critical">Could not move the post to trash.</os-toast> |
| 537 |
`};let ms=Ce;v("os-toast",ms);const dn=b`:host{display:flex;gap:4px;margin-bottom:10px;border-bottom:1px solid var( --os-ui-border,#dcdcde )}:host( [ orientation='vertical' ] ){flex-direction:column;align-items:stretch;gap:0;margin-bottom:0;border-bottom:0}`,un=b`:host{display:block}:host( [ hidden ] ){display:none}:host(:focus-visible ){outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:4px;border-radius:4px}`,hn=b` ${$}:host{display:inline-block}:host( [ data-orientation='vertical' ] ){display:block;--_tab-edge:var( --os-ui-tab-edge,linear-gradient( var( --os-ui-accent,#f252fc ),var( --os-ui-accent,#f252fc ) ) );--_tab-wash:var( --os-ui-tab-wash,linear-gradient( 90deg,rgba( 242,82,252,0.16 ) 0%,rgba( 255,251,255,0.04 ) 42%,transparent 100% ) );--_tab-bloom:var( --os-ui-tab-bloom,linear-gradient( 90deg,rgba( 242,82,252,0.26 ),transparent ) );--_tab-edge-w:var( --os-ui-tab-edge-width,2px );--_tab-bloom-o:var( --os-ui-tab-bloom-opacity,1 );--_tab-fill:var( --os-ui-tab-fill,transparent );--_tab-radius:var( --os-ui-tab-radius,0px );--_tab-inset:var( --os-ui-tab-inset,0px )}:host( [ data-orientation='vertical' ] ) button{display:flex;align-items:center;gap:11px;isolation:isolate;overflow:hidden;width:calc( 100% - 2 * var( --_tab-inset ) );min-height:40px;padding:0 14px 0 calc( 20px - var( --_tab-inset ) );margin-bottom:0;margin-inline:var( --_tab-inset );border-radius:var( --_tab-radius );text-align:start;font-size:14px;font-weight:400;line-height:1.5;white-space:nowrap}:host( [ data-orientation='vertical' ] ) slot::slotted( svg ){flex:0 0 17px;width:17px;height:17px;opacity:0.8;transition:opacity var( --_holo-t ) var( --_holo-ease )}:host( [ data-orientation='vertical' ] ) button:hover slot::slotted( svg ),:host( [ data-orientation='vertical' ][ aria-selected='true' ] ) slot::slotted( svg ){opacity:1}:host( [ data-orientation='vertical' ] ) button::after{inset-inline:0 auto;inset-block:0;z-index:-1;width:var( --_tab-edge-w );height:auto;border-radius:0;background-image:var( --_tab-edge );transition:opacity var( --_holo-t ) var( --_holo-ease )}:host( [ data-orientation='vertical' ] ) button::before{content:'';position:absolute;inset-inline:0 auto;inset-block:0;z-index:-1;width:44px;background-image:var( --_tab-bloom );filter:blur( 8px );opacity:0;pointer-events:none;transition:opacity var( --_holo-t ) var( --_holo-ease )}:host( [ data-orientation='vertical' ] ) button:hover::after{inset-inline:0 auto;opacity:0}:host( [ data-orientation='vertical' ][ aria-selected='true' ] ) button{background-color:var( --_tab-fill );background-image:var( --_tab-wash );font-weight:400}:host( [ data-orientation='vertical' ][ aria-selected='true' ] ) button::after,:host( [ data-orientation='vertical' ][ aria-selected='true' ] ) button:hover::after{inset-inline:0 auto;opacity:1}:host( [ data-orientation='vertical' ][ aria-selected='true' ] ) button::before{opacity:var( --_tab-bloom-o )}@media ( prefers-reduced-motion:reduce ){:host( [ data-orientation='vertical' ] ) button::before,:host( [ data-orientation='vertical' ] ) slot::slotted( svg ){transition-duration:1ms}}button{appearance:none;position:relative;padding:6px 10px 8px;border:none;background:transparent;color:var( --os-ui-fg-muted,#50575e );font:inherit;font-size:12px;font-weight:500;cursor:pointer;margin-bottom:-1px;transition:color var( --_holo-t ) ease}button::after{content:'';position:absolute;inset-inline:50%;bottom:0;height:2px;border-radius:2px 2px 0 0;background-image:linear-gradient( var( --os-ui-accent,#2271b1 ),var( --os-ui-accent,#2271b1 ) );background-size:100% 100%;opacity:0;transition:inset-inline var( --_holo-t ) ease,opacity var( --_holo-t ) ease}button:hover{color:var( --os-ui-fg,#1d2327 )}button:hover::after{inset-inline:30%;opacity:0.45}button:focus-visible{outline:none;box-shadow:var( --_holo-focus );border-radius:4px}:host( [ aria-selected='true' ] ) button{color:var( --os-ui-fg,#1d2327 );font-weight:600}:host( [ aria-selected='true' ] ) button::after,:host( [ aria-selected='true' ] ) button:hover::after{inset-inline:0;opacity:1}@media ( prefers-reduced-motion:reduce ){button::after{transition-duration:1ms}}`,Ae=class Ae extends m{render(){return this.setAttribute("role","tab"),d` |
| 538 |
<button type="button" @click=${()=>this._onPick()}> |
| 539 |
<slot></slot> |
| 540 |
</button> |
| 541 |
`}_onPick(){this.emit("os-tab-pick",{value:this.value})}};Ae.props=["value"],Ae.styles=[hn],Ae.help=void 0;let vs=Ae;v("os-tab",vs);const Se=class Se extends m{constructor(){super(...arguments),this._tabObserver=null,this._onKeyDown=e=>{const t=this.orientation==="vertical",s=t?"ArrowDown":"ArrowRight",o=t?"ArrowUp":"ArrowLeft";if(e.key!==s&&e.key!==o&&e.key!=="Home"&&e.key!=="End")return;const i=Array.from(this.querySelectorAll("os-tab")).filter(u=>!u.hasAttribute("data-search-hidden"));if(i.length===0)return;const n=this.value,a=i.findIndex(u=>u.getAttribute("value")===n);let l=0;if(e.key==="End")l=i.length-1;else if(e.key!=="Home"){const u=e.key===s?1:-1;l=(a+u+i.length)%i.length}const c=i[l]?.getAttribute("value");!c||c===n||(e.preventDefault(),this.value=c,this.emit("os-tab-change",{value:c}),queueMicrotask(()=>{i[l]?.focus()}))}}connectedCallback(){super.connectedCallback(),this.addEventListener("os-tab-pick",e=>{const t=e.detail;e.stopPropagation(),this.value=t.value,this.emit("os-tab-change",{value:t.value})}),this.addEventListener("keydown",this._onKeyDown),this._tabObserver=new MutationObserver(()=>this.requestUpdate()),this._tabObserver.observe(this,{childList:!0})}disconnectedCallback(){this._tabObserver?.disconnect(),this._tabObserver=null,this.removeEventListener("keydown",this._onKeyDown)}set items(e){pn(this,"os-tab",e);const t=this.value;!(t!==null&&e.some(o=>o.value===t))&&e.length>0?this.value=e[0].value:this.requestUpdate()}render(){this.setAttribute("role","tablist");const e=this.label||"";e&&this.setAttribute("aria-label",e);const t=this.orientation==="vertical";this.setAttribute("aria-orientation",t?"vertical":"horizontal");for(const o of Array.from(this.querySelectorAll("os-tab")))t?o.setAttribute("data-orientation","vertical"):o.removeAttribute("data-orientation");const s=this.value;return queueMicrotask(()=>{const o=this.querySelectorAll("os-tab");for(const i of Array.from(o)){const n=i.getAttribute("value");i.setAttribute("aria-selected",n===s?"true":"false"),i.setAttribute("tabindex",n===s?"0":"-1")}Qo(this,s)}),d`<slot></slot>`}};Se.props=["value","label","orientation"],Se.styles=[dn],Se.help={title:"Tabs",summary:'Underline-accent tab strip. Pair with sibling <os-tabpanel for="…"> elements and the strip auto-toggles their hidden attribute on selection. Set orientation="vertical" for a sidebar instead of a strip.',status:"stable",props:[{name:"value",type:"string",description:"Currently active tab value. Mirrored to child <os-tab> aria-selected."},{name:"label",type:"string",description:"aria-label for the tablist — describe the tab group for assistive tech."},{name:"orientation",type:"'horizontal' | 'vertical'",description:"Lay the tabs across the top (default) or down the side. Vertical also sets aria-orientation and moves each tab's accent from an underline to a leading edge."}],slots:[{name:"(default)",description:'<os-tab value="…"> children forming the strip.'}],events:[{name:"os-tab-change",description:"Fires when the active tab changes.",detail:"{ value: string }"}],example:d` |
| 542 |
<os-tabs value="one" label="Demo tabs"> |
| 543 |
<os-tab value="one">One</os-tab> |
| 544 |
<os-tab value="two">Two</os-tab> |
| 545 |
<os-tab value="three">Three</os-tab> |
| 546 |
</os-tabs> |
| 547 |
<os-tabpanel for="one">First panel.</os-tabpanel> |
| 548 |
<os-tabpanel for="two">Second panel.</os-tabpanel> |
| 549 |
<os-tabpanel for="three">Third panel.</os-tabpanel> |
| 550 |
`};let _s=Se;v("os-tabs",_s);const ze=class ze extends m{connectedCallback(){super.connectedCallback(),this.setAttribute("role","tabpanel"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0");const e=gn(this);e&&Qo(e,e.getAttribute("value"))}render(){return d`<slot></slot>`}};ze.props=["for"],ze.styles=[un],ze.help={title:"Tab panel",summary:'Auto-managed panel paired with a sibling <os-tabs>. Declares which tab it belongs to via `for="<tab-value>"`; the parent strip toggles `hidden` whenever the active tab changes. role="tabpanel" and tabindex="0" are set automatically.',status:"stable",props:[{name:"for",type:"string",description:"Matches the `value` of the owning <os-tab>. Panel is shown when its parent tabs strip is on that value."}],slots:[{name:"(default)",description:"Panel body content."}],example:d` |
| 551 |
<os-tabs value="two" label="Demo tabs"> |
| 552 |
<os-tab value="one">One</os-tab> |
| 553 |
<os-tab value="two">Two</os-tab> |
| 554 |
</os-tabs> |
| 555 |
<os-tabpanel for="one"> |
| 556 |
Hidden — the strip is on "two". |
| 557 |
</os-tabpanel> |
| 558 |
<os-tabpanel for="two"> |
| 559 |
Visible, because this panel's <code>for</code> matches the |
| 560 |
strip's <code>value</code>. |
| 561 |
</os-tabpanel> |
| 562 |
`};let xs=ze;v("os-tabpanel",xs);function pn(r,e,t){const s=r.querySelectorAll(`:scope > ${e}`);for(const o of Array.from(s))o.remove();for(const o of t){const i=document.createElement(e);i.setAttribute("value",o.value),i.textContent=o.label,r.appendChild(i)}}function gn(r){const e=r.parentElement;if(!e)return null;const t=e.querySelector(":scope > os-tabs");return t||r.closest("os-tabs")}function Qo(r,e){const t=new Set,s=r.parentElement;if(s)for(const o of Array.from(s.querySelectorAll(":scope > os-tabpanel")))t.add(o);for(const o of Array.from(r.querySelectorAll(":scope > os-tabpanel")))t.add(o);for(const o of t){const i=o.getAttribute("for"),n=i!==null&&i===e;n?o.removeAttribute("hidden"):o.setAttribute("hidden",""),o.setAttribute("aria-hidden",n?"false":"true")}}const bn=b`:host{display:inline-flex}button{display:flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;border:none;border-radius:var( --os-ui-btn-radius,5px );background-color:var( --os-ui-btn-bg,transparent );background-image:var( --os-ui-btn-bg-image,none );background-repeat:var( --os-ui-btn-bg-image-repeat,no-repeat );background-size:var( --os-ui-btn-bg-image-size,auto );background-position:var( --os-ui-btn-bg-image-position,center );color:var( --os-ui-btn-color,currentColor );cursor:pointer;transition:background-color 0.15s ease,color 0.15s ease,transform 80ms ease}button:active:not(:disabled){transform:scale( 0.9 )}@media ( prefers-reduced-motion:reduce ){button:active:not(:disabled){transform:none}}button:disabled{opacity:0.5;cursor:default}button:hover:not(:disabled){color:var( --os-ui-btn-color-hover,currentColor );background-color:var( --os-ui-btn-bg-hover,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) )}button:focus-visible{color:var( --os-ui-btn-color-hover,currentColor );background-color:var( --os-ui-btn-bg-hover,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );outline:2px solid var( --os-ui-btn-outline,currentColor );outline-offset:1px}:host( [ active ] ) button{color:var( --os-ui-btn-color-hover,currentColor );background-color:var( --os-ui-btn-bg-active,var( --os-ui-hover,rgba( 0,0,0,0.08 ) ) )}:host( [ danger ] ) button:hover{color:var( --os-ui-fg-on-accent,#fff );background-color:var( --os-ui-btn-danger-hover,var( --os-ui-danger,#d63638 ) )}svg{display:block;pointer-events:none;flex-shrink:0}svg:empty{display:none}.themed-icon{display:block;width:14px;height:14px;flex-shrink:0;pointer-events:none;background-color:var( --os-ui-btn-icon-color,currentColor )}::slotted( span ){line-height:1}::slotted( svg ){display:block}`,fn={minimize:'<path d="M3 6h6" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>',maximize:'<rect x="3" y="3" width="6" height="6" rx="1" stroke="currentColor" stroke-width="1.25" fill="none"/>',fullscreen:'<path d="M4.5 2H2v2.5M10 4.5V2H7.5M4.5 10H2V7.5M10 7.5V10H7.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round" fill="none"/>',"fullscreen-exit":'<path d="M2 4.5H4.5V2M7.5 2V4.5H10M2 7.5H4.5V10M7.5 10V7.5H10" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round" fill="none"/>',detach:'<path d="M5 2H2.5v7.5H10V7M6.5 2H10v3.5M10 2L5.5 6.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round" fill="none"/>',reload:'<g transform="translate(0.6 0.6) scale(0.021)" fill="currentColor"><path d="m504.554 233.704-76.447 91.467c-6.329 7.572-15.417 11.479-24.571 11.479a31.872 31.872 0 0 1-20.504-7.447l-91.467-76.447c-13.561-11.334-15.366-31.515-4.032-45.075s31.515-15.366 45.075-4.032l37.506 31.347c-10.274-74.891-74.668-132.774-152.337-132.774C132.984 102.223 64 171.207 64 256s68.984 153.777 153.777 153.777c17.673 0 32 14.327 32 32s-14.327 32-32 32c-58.17 0-112.859-22.653-153.991-63.785C22.653 368.859 0 314.17 0 256s22.653-112.859 63.786-153.992c41.132-41.132 95.821-63.785 153.991-63.785s112.859 22.653 153.992 63.785c32.517 32.516 53.471 73.508 60.829 117.991l22.849-27.339c11.334-13.56 31.515-15.364 45.075-4.032 13.56 11.335 15.365 31.516 4.032 45.076z"/></g>',close:'<path d="M3.25 3.25l5.5 5.5M3.25 8.75l5.5-5.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round"/>',menu:'<circle cx="3" cy="6" r="1.2" fill="currentColor"/><circle cx="6" cy="6" r="1.2" fill="currentColor"/><circle cx="9" cy="6" r="1.2" fill="currentColor"/>'};function mn(r){const e=(r??"").trim();return e===""||e.length>4096||!/^(https?:\/\/|data:image\/)/i.test(e)||/['"()\\<>\s]/.test(e)?"":e}const Ee=class Ee extends m{constructor(){super(...arguments),this._activateWired=!1}static get observedAttributes(){return[...super.observedAttributes,"aria-label","aria-pressed"]}render(){const e=mn(this["icon-src"]||this.getAttribute("icon-src")||""),t=e?"":this.icon||"",s=fn[t]||"",o=this.getAttribute("aria-label")||"";return e?d` |
| 563 |
<button type="button" aria-label="${o}" aria-pressed="${this.getAttribute("aria-pressed")||""}" ?disabled="${this.hasAttribute("disabled")}"> |
| 564 |
<span |
| 565 |
class="themed-icon" |
| 566 |
aria-hidden="true" |
| 567 |
style="-webkit-mask: url('${e}') center / contain no-repeat; mask: url('${e}') center / contain no-repeat;" |
| 568 |
></span> |
| 569 |
<slot></slot> |
| 570 |
</button> |
| 571 |
`:d` |
| 572 |
<button type="button" aria-label="${o}" aria-pressed="${this.getAttribute("aria-pressed")||""}" ?disabled="${this.hasAttribute("disabled")}"> |
| 573 |
<svg |
| 574 |
width="14" |
| 575 |
height="14" |
| 576 |
viewBox="0 0 12 12" |
| 577 |
aria-hidden="true" |
| 578 |
focusable="false" |
| 579 |
></svg> |
| 580 |
<slot></slot> |
| 581 |
</button> |
| 582 |
<span data-svg-buffer style="display:none">${s}</span> |
| 583 |
`}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._paintSvg()),queueMicrotask(()=>this._wireActivateEvent())}attributeChangedCallback(e,t,s){super.attributeChangedCallback(e,t,s),queueMicrotask(()=>this._paintSvg())}_paintSvg(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("svg"),s=e.querySelector("[data-svg-buffer]");if(t&&s){const o=s.textContent||"";t.innerHTML!==o&&(t.innerHTML=o)}}_wireActivateEvent(){if(this._activateWired)return;const e=this.shadowRoot;if(!e)return;const t=e.querySelector("button");t&&(this._activateWired=!0,t.addEventListener("click",()=>{this.hasAttribute("disabled")||this.dispatchEvent(new CustomEvent("os-button-activate",{bubbles:!0,composed:!0,cancelable:!0}))}))}};Ee.props=["icon","icon-src","active","danger","disabled"],Ee.styles=[bn],Ee.help=void 0;let ys=Ee;v("os-window-button",ys);const vn=b` ${$} ${Ot}:host{display:none;position:fixed;min-width:180px;background-color:var( --os-ui-context-menu-bg,#1d2327 );background-image:var( --os-ui-menu-bg-image,none );background-repeat:var( --os-ui-menu-bg-image-repeat,repeat );background-size:var( --os-ui-menu-bg-image-size,auto );background-position:var( --os-ui-menu-bg-image-position,center );color:var( --os-ui-context-menu-fg,var( --os-fg,#fff ) );border:1px solid var( --os-ui-border,rgba( 255,255,255,0.08 ) );border-radius:8px;box-shadow:0 8px 24px rgba( 0,0,0,0.45 );padding:4px;font-size:13px;line-height:1.3;z-index:9999}:host( [ open ] ){display:block;animation:os-holo-enter var( --_holo-t-fast ) var( --_holo-ease );transform-origin:top left;box-sizing:border-box;max-block-size:calc( 100vh - 16px );max-block-size:calc( 100dvh - 16px );overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}:host( [ open ]:dir( rtl ) ){transform-origin:top right}@media ( prefers-reduced-motion:reduce ){:host( [ open ] ){animation:none}}`,_n=b`:host{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;background:transparent;color:inherit;text-align:start;cursor:pointer;border-radius:4px;box-sizing:border-box;user-select:none}:host(:hover ),:host( [ active ] ){background:var( --os-ui-hover,rgba( 255,255,255,0.1 ) );outline:none}:host( [ disabled ] ){opacity:0.45;cursor:not-allowed}:host( [ danger ] ){color:var( --os-ui-danger-hover,#ff8a8a )}:host( [ danger ]:hover ){background:var( --os-ui-badge-danger-bg,rgba( 255,90,90,0.18 ) )}:host( [ heading ] ){padding:8px 10px 4px;font-size:10px;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var( --os-ui-context-menu-fg-muted,var( --os-ui-fg-muted,rgba( 255,255,255,0.5 ) ) );pointer-events:none}.icon{display:inline-flex;align-items:center;justify-content:center;font-size:18px;width:20px;height:20px}.label{flex:1}.chevron{margin-inline-start:auto;padding-inline-start:8px;font-size:16px;line-height:1;opacity:0.7}.check{display:inline-flex;align-items:center;justify-content:center;width:14px;font-size:13px;line-height:1;opacity:0.95}`,Le=class Le extends m{render(){return d` |
| 584 |
<slot></slot> |
| 585 |
`}connectedCallback(){super.connectedCallback(),this.setAttribute("role","menu")}};Le.props=["open"],Le.styles=[vn],Le.help=void 0;let ws=Le;v("os-context-menu",ws);const Me=class Me extends m{constructor(){super(...arguments),this._onActivate=e=>{if(this.hasAttribute("disabled")||this.hasAttribute("heading"))return;const t=e.target;t&&t!==this&&t.closest("os-context-menu-option")!==this||this.emit("os-context-menu-pick",{id:this.dataset.menuItemId??this.id??"",value:this.getAttribute("value")??""})},this._onKey=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this._onActivate(e))}}connectedCallback(){super.connectedCallback();const e=this.hasAttribute("heading");this.setAttribute("role",e?"presentation":"menuitem"),e||this.setAttribute("tabindex","0"),this.addEventListener("click",this._onActivate),this.addEventListener("keydown",this._onKey)}disconnectedCallback(){this.removeEventListener("click",this._onActivate),this.removeEventListener("keydown",this._onKey)}render(){const e=this.getAttribute("icon"),t=this.hasAttribute("has-children"),s=this.hasAttribute("checked");return d` |
| 586 |
${s?d`<span class="check" aria-hidden="true">✓</span>`:d``} |
| 587 |
${e?d`<span class="icon dashicons ${e}" aria-hidden="true"></span>`:d``} |
| 588 |
<span class="label"><slot></slot></span> |
| 589 |
${t?d`<span class="chevron" aria-hidden="true">›</span>`:d``} |
| 590 |
`}};Me.props=["value","icon","disabled","danger","heading","has-children","checked"],Me.styles=[_n],Me.help={title:"Context menu option",summary:"Single row inside <os-context-menu>. Use `icon` for a leading dashicon, `danger` for destructive items, `heading` for a non-interactive section header, `has-children` to render a trailing chevron.",status:"stable",props:[{name:"value",type:"string",description:"Forwarded as `detail.value` on activation."},{name:"icon",type:"string",description:"Dashicon class (e.g. `dashicons-trash`)."},{name:"disabled",type:"boolean attribute",description:"Renders the option dimmed; clicks are ignored."},{name:"danger",type:"boolean attribute",description:"Destructive styling — red text, red hover."},{name:"heading",type:"boolean attribute",description:"Non-interactive section header. Ignores clicks."},{name:"has-children",type:"boolean attribute",description:"Renders a trailing chevron to suggest a submenu."},{name:"checked",type:"boolean attribute",description:"Renders a leading check mark — for radio-style picks inside a submenu (e.g. the active Sort By order)."}],slots:[{name:"(default)",description:"Visible label."}],events:[{name:"os-context-menu-pick",description:"Bubbled on click / Enter for non-heading non-disabled options. Detail: `{ id, value }`."}],example:d` |
| 591 |
<os-context-menu open style="position: relative; z-index: 0"> |
| 592 |
<os-context-menu-option heading>Every variant</os-context-menu-option> |
| 593 |
<os-context-menu-option value="plain">Plain</os-context-menu-option> |
| 594 |
<os-context-menu-option value="icon" icon="dashicons-admin-page"> |
| 595 |
With an icon |
| 596 |
</os-context-menu-option> |
| 597 |
<os-context-menu-option value="checked" checked> |
| 598 |
Checked |
| 599 |
</os-context-menu-option> |
| 600 |
<os-context-menu-option value="children" has-children> |
| 601 |
With a submenu |
| 602 |
</os-context-menu-option> |
| 603 |
<os-context-menu-option value="off" disabled>Disabled</os-context-menu-option> |
| 604 |
<os-context-menu-option value="del" danger icon="dashicons-trash"> |
| 605 |
Danger |
| 606 |
</os-context-menu-option> |
| 607 |
</os-context-menu> |
| 608 |
`};let ks=Me;v("os-context-menu-option",ks);function xn(r,e){r.style.visibility="hidden";const t=()=>{r.isConnected&&(e(r.getBoundingClientRect()),r.style.visibility="")};typeof requestAnimationFrame=="function"?requestAnimationFrame(t):t()}const yn=b`:host{display:inline-block}:host([hidden]){display:none}.panel{position:fixed;inset:auto;margin:0;padding:0;border:0;background:transparent;overflow:visible;max-inline-size:calc(100vw - 16px)}.panel[hidden]{display:none}os-context-menu{position:relative;inset:auto;max-inline-size:calc(100vw - 16px)}os-button::part(button){min-block-size:30px}.chevron{display:inline-block;inline-size:5px;block-size:5px;border-inline-end:1.5px solid currentColor;border-block-end:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-inline-start:5px;vertical-align:middle}:host(:dir(rtl)) .chevron{transform:translateY(-2px) rotate(-45deg)}`,Re=class Re extends m{constructor(){super(...arguments),this.opened=!1,this.listeners=null,this.onKey=e=>{if(e.key==="Escape"||e.key==="Tab"){e.key==="Escape"&&(e.preventDefault(),e.stopPropagation()),this.close();return}if(!["ArrowDown","ArrowUp","Home","End"].includes(e.key))return;e.preventDefault(),e.stopPropagation();const t=this.options();let o=t.indexOf(this.ownerDocument.activeElement)+(e.key==="ArrowUp"?-1:1);e.key==="Home"&&(o=0),e.key==="End"&&(o=t.length-1),t[(o+t.length)%t.length]?.focus()}}get panel(){return this.shadowRoot?.querySelector(".panel")??null}get trigger(){return this.shadowRoot?.querySelector("os-button")?.shadowRoot?.querySelector("button")??null}options(){return Array.from(this.querySelectorAll("os-context-menu-option:not([heading]):not([disabled])"))}render(){return d`<os-button variant="ghost" @click=${()=>this.opened?this.close():this.show()} @keydown=${e=>{(e.key==="ArrowDown"||e.key==="ArrowUp")&&(e.preventDefault(),this.show(e.key==="ArrowUp"))}}>${this.getAttribute("text")||"Actions"} <span class="chevron" aria-hidden="true"></span></os-button> |
| 609 |
<div class="panel" popover="manual" hidden><os-context-menu open aria-label=${this.getAttribute("label")||"Actions"}><slot></slot></os-context-menu></div>`}requestUpdate(){this.opened&&this.close(!1),super.requestUpdate(),queueMicrotask(()=>queueMicrotask(()=>this.syncTrigger()))}syncTrigger(){this.trigger?.setAttribute("aria-label",this.getAttribute("label")||"Actions"),this.trigger?.setAttribute("aria-haspopup","menu"),this.trigger?.setAttribute("aria-expanded",String(this.opened))}show(e=!1){if(this.opened||!this.panel)return;this.opened=!0,this.panel.hidden=!1,this.panel.showPopover?.(),this.syncTrigger();const t=this.panel;xn(t,o=>{if(!this.opened)return;const i=this.getBoundingClientRect(),n=getComputedStyle(this).direction==="rtl";t.style.left=`${Math.max(8,Math.min(n?i.left:i.right-o.width,window.innerWidth-o.width-8))}px`,t.style.top=`${Math.max(8,Math.min(i.bottom+5+o.height<=window.innerHeight-8?i.bottom+5:i.top-o.height-5,window.innerHeight-o.height-8))}px`;const a=this.options();a[e?a.length-1:0]?.focus({preventScroll:!0})}),this.listeners=new AbortController;const{signal:s}=this.listeners;document.addEventListener("pointerdown",o=>{o.composedPath().includes(this)||this.close(!1)},{capture:!0,signal:s}),document.addEventListener("focusin",o=>{o.composedPath().includes(this)||this.close(!1)},{signal:s}),document.addEventListener("scroll",o=>{o.composedPath().includes(t)||this.close(!1)},{capture:!0,signal:s}),window.addEventListener("resize",()=>this.close(!1),{signal:s}),this.addEventListener("keydown",this.onKey,{signal:s}),this.addEventListener("os-context-menu-pick",()=>this.close(),{capture:!0,signal:s})}close(e=!0){this.opened&&(this.opened=!1,this.listeners?.abort(),this.listeners=null,this.panel?.isConnected&&this.panel.hidePopover?.(),this.panel&&(this.panel.hidden=!0),this.syncTrigger(),e&&this.isConnected&&this.trigger?.focus({preventScroll:!0}))}disconnectedCallback(){this.close(!1)}};Re.props=["label","text"],Re.styles=[yn],Re.help=void 0;let $s=Re;v("os-action-menu",$s);const wn=b` ${$} ${Ot}:host{display:block;animation:os-holo-enter var( --_holo-t ) var( --_holo-spring );transform-origin:top left;min-width:220px;padding:4px;background:var( --os-window-bg,#fff );background-image:var( --os-ui-menu-bg-image,none );background-repeat:var( --os-ui-menu-bg-image-repeat,repeat );background-size:var( --os-ui-menu-bg-image-size,auto );background-position:var( --os-ui-menu-bg-image-position,center );color:var( --os-ui-fg,#1d2327 );border:1px solid var( --os-window-border,#c3c4c7 );border-radius:8px;box-shadow:0 8px 24px rgba( 0,0,0,0.18 ),0 2px 6px rgba( 0,0,0,0.08 )}:host(:dir( rtl ) ){transform-origin:top right}@media ( prefers-reduced-motion:reduce ){:host{animation:none}}:host( [ hidden ] ){display:none}`,kn=b`:host{display:block}button{display:flex;align-items:center;gap:10px;width:100%;min-height:32px;padding:6px 10px;border:none;border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:13px;line-height:1.3;text-align:start;cursor:pointer;transition:background-color 0.12s ease,color 0.12s ease}button:hover,button:focus-visible{background:var( --os-ui-hover,rgba( 0,0,0,0.06 ) );color:var( --os-ui-fg,#000 );outline:none}button:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var( --os-ui-accent,#2271b1 )}.os-menu-item__icon{flex-shrink:0;width:18px;height:18px;font-size:18px;line-height:1;color:var( --wp-admin-theme-color,#2271b1 )}.os-menu-item__icon[ hidden ]{display:none}.os-menu-item__label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.os-menu-item__check{flex-shrink:0;width:16px;height:16px;border-radius:3px;border:1.5px solid var( --os-ui-border,rgba( 0,0,0,0.25 ) );position:relative;background:transparent;transition:background-color 0.12s ease,border-color 0.12s ease}.os-menu-item__check[ hidden ]{display:none}:host( [ checked ] ) .os-menu-item__check{background-color:transparent;background-image:var( --os-ui-holo-fill,linear-gradient( 124deg,#afa2e8 0%,#f5a8ea 46%,#8ee9f7 100% ) );background-size:200% 200%;background-position:25% 30%;border-color:transparent;box-shadow:var( --os-ui-holo-glow,0 0 0 1px rgba( 242,82,252,0.28 ),0 2px 10px rgba( 242,82,252,0.22 ) )}:host( [ checked ] ) .os-menu-item__check::after{content:'';position:absolute;top:1px;left:4px;width:4px;height:8px;border:solid var( --os-ui-holo-ink,#0c0b0f );border-width:0 2px 2px 0;transform:rotate( 45deg )}`,Xt=class Xt extends m{connectedCallback(){super.connectedCallback(),this.setAttribute("role","menu")}render(){return d`<slot></slot>`}};Xt.styles=[wn],Xt.help=void 0;let Cs=Xt;v("os-menu",Cs);const Ie=class Ie extends m{connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","menuitem")}render(){const e=this.icon||"",t=this.getAttribute("role")==="menuitemcheckbox",s=this.checked!==null;return t&&this.setAttribute("aria-checked",s?"true":"false"),d` |
| 610 |
<button type="button" @click=${o=>this._onPick(o)}> |
| 611 |
<span |
| 612 |
class="os-menu-item__check" |
| 613 |
?hidden=${!t} |
| 614 |
></span> |
| 615 |
<span |
| 616 |
class="os-menu-item__icon dashicons ${e}" |
| 617 |
aria-hidden="true" |
| 618 |
?hidden=${t||!e} |
| 619 |
></span> |
| 620 |
<span class="os-menu-item__label"> |
| 621 |
<slot></slot> |
| 622 |
</span> |
| 623 |
</button> |
| 624 |
`}_onPick(e){e.preventDefault(),this.emit("os-menu-item-click",{value:this.value})}};Ie.props=["icon","value","checked"],Ie.styles=[kn],Ie.help={title:"Menu item",summary:'Single row inside a <os-menu>. Supports three looks: plain label, left-aligned dashicon (icon="dashicons-…"), or a checkbox indicator (role="menuitemcheckbox" + checked).',status:"stable",props:[{name:"icon",type:"string (dashicons class)",description:'Dashicons class rendered on the left. Ignored when role="menuitemcheckbox".'},{name:"value",type:"string",description:"Identifier emitted in os-menu-item-click.detail.value."},{name:"checked",type:"boolean attribute",description:'Visible check indicator. Only honoured when role="menuitemcheckbox".'}],slots:[{name:"(default)",description:"Menu item label."}],events:[{name:"os-menu-item-click",description:"Fires when the item is clicked; bubbles so the <os-menu> parent can delegate.",detail:"{ value: string | null }"}],example:d` |
| 625 |
<os-menu> |
| 626 |
<os-menu-item value="plain">Plain item</os-menu-item> |
| 627 |
<os-menu-item value="icon" icon="dashicons-external"> |
| 628 |
With an icon |
| 629 |
</os-menu-item> |
| 630 |
<os-menu-item value="startup" role="menuitemcheckbox" checked> |
| 631 |
Checked (menuitemcheckbox) |
| 632 |
</os-menu-item> |
| 633 |
</os-menu> |
| 634 |
`};let As=Ie;v("os-menu-item",As);const $n=b` ${$}:host{display:none;position:fixed;inset:0;align-items:center;justify-content:center;background:var( --os-ui-scrim,rgba( 0,0,0,0.45 ) );background-image:var( --os-ui-scrim-image,none );background-repeat:var( --os-ui-scrim-image-repeat,repeat );background-size:var( --os-ui-scrim-image-size,auto );background-position:var( --os-ui-scrim-image-position,center );backdrop-filter:blur( 2px );z-index:10000}:host( [ open ] ){display:flex;animation:os-confirm-scrim var( --_holo-t ) var( --_holo-ease )}:host( [ open ] ) .dialog{animation:os-confirm-dialog var( --_holo-t ) var( --_holo-spring )}@keyframes os-confirm-scrim{from{opacity:0}}@keyframes os-confirm-dialog{from{opacity:0;transform:scale( 0.96 ) translateY( 8px )}}@media ( prefers-reduced-motion:reduce ){:host( [ open ] ),:host( [ open ] ) .dialog{animation:none}}.dialog{width:min( 420px,92vw );background-color:var( --os-ui-confirm-dialog-bg,#1d2327 );background-image:var( --os-ui-dialog-bg-image,none );background-repeat:var( --os-ui-dialog-bg-image-repeat,repeat );background-size:var( --os-ui-dialog-bg-image-size,auto );background-position:var( --os-ui-dialog-bg-image-position,center );color:var( --os-ui-confirm-dialog-fg,var( --os-fg,#fff ) );border:1px solid var( --os-ui-border,rgba( 255,255,255,0.08 ) );border-radius:10px;box-shadow:0 20px 50px rgba( 0,0,0,0.6 );padding:20px 22px 18px;display:flex;flex-direction:column;gap:10px;position:relative}.close{position:absolute;top:8px;right:10px;width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:6px;color:var( --os-ui-confirm-dialog-fg-muted,var( --os-ui-fg-muted,rgba( 255,255,255,0.7 ) ) );cursor:pointer;font-size:22px;line-height:1;padding:0}.close:hover{background:var( --os-ui-hover,rgba( 255,255,255,0.08 ) );color:inherit}.btn:focus,.close:focus{outline:none;box-shadow:var( --_holo-focus )}.dialog:focus,.dialog:focus-visible{outline:none}.title{margin:0 0 4px;font-size:16px;font-weight:600}.message{margin:0;color:var( --os-ui-confirm-dialog-fg-muted,var( --os-ui-fg-muted,rgba( 255,255,255,0.7 ) ) );line-height:1.45;white-space:pre-line}.remember{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:12px;color:var( --os-ui-confirm-dialog-fg-muted,var( --os-ui-fg-muted,rgba( 255,255,255,0.7 ) ) );cursor:pointer;user-select:none}.remember__box{margin:0;accent-color:var( --os-ui-accent,#2271b1 );cursor:pointer}.remember__box:focus,.remember__box:focus-visible{outline:none;box-shadow:var( --_holo-focus )}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:6px}.btn{border:0;border-radius:6px;padding:8px 14px;font-size:13px;cursor:pointer;font-weight:500}.btn--secondary{background:var( --os-ui-hover,rgba( 255,255,255,0.08 ) );color:inherit}.btn--secondary:hover{background:var( --os-ui-hover,rgba( 255,255,255,0.14 ) )}.btn--primary{background:var( --wp-admin-theme-color,#2271b1 );color:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) )}.btn--primary:hover{filter:brightness( 1.08 )}.btn--danger{background:var( --os-ui-danger,#d63638 );color:var( --os-ui-fg-on-accent,#fff )}.btn--danger:hover{filter:brightness( 1.08 )}`,Jo='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';function Cn(r){let e=r?.activeElement??null;for(;e?.shadowRoot?.activeElement;)e=e.shadowRoot.activeElement;return e&&e!==r?.body?e:null}function Oo(r){const e=r.composedPath(),t=e.length>0?e[0]:r.target;return t instanceof HTMLElement?t:null}function ei(r){return r!==null&&r.matches(Jo)}const Pe=class Pe extends m{constructor(){super(...arguments),this._prevFocus=null,this._focusTries=0,this._onKey=e=>{if(e.key==="Escape"){e.preventDefault(),this._cancel();return}if(e.key==="Tab"){this._trapTab(e);return}if(e.key==="Enter"&&!e.isComposing){if(ei(Oo(e))||this.hasAttribute("danger"))return;e.preventDefault(),this._confirm()}},this._focusInitial=()=>{if(!this.hasAttribute("open"))return;const e=this.isConnected?this._initialFocusTarget():null;if(e){e.focus();return}if(this._focusTries++<5){queueMicrotask(this._focusInitial);return}this.isConnected&&this.focus()},this._onBackdrop=e=>{const t=e.composedPath();(t.length>0?t[0]:e.target)===this&&this._cancel()},this._confirm=()=>{this.emit("os-confirm",{confirmed:!0,remember:this._remembered()}),this.removeAttribute("open")},this._cancel=()=>{this.emit("os-cancel",{confirmed:!1}),this.removeAttribute("open")}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","dialog"),this.setAttribute("aria-modal","true"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","-1"),this.addEventListener("keydown",this._onKey),this.addEventListener("click",this._onBackdrop)}disconnectedCallback(){this.removeEventListener("keydown",this._onKey),this.removeEventListener("click",this._onBackdrop),this._restoreFocus()}attributeChangedCallback(e,t,s){super.attributeChangedCallback(e,t,s),e==="open"&&(s!==null?(this._prevFocus=Cn(this.ownerDocument),this._focusTries=0,queueMicrotask(this._focusInitial)):this._restoreFocus())}_focusables(){const e=this.shadowRoot;return e?Array.from(e.querySelectorAll(Jo)):[]}_trapTab(e){const t=this._focusables();if(t.length===0)return;const s=t[0],o=t[t.length-1],i=Oo(e),n=!ei(i);e.shiftKey&&(n||i===s)?(e.preventDefault(),o.focus()):!e.shiftKey&&(n||i===o)&&(e.preventDefault(),s.focus())}_initialFocusTarget(){const e=this.shadowRoot;if(!e)return null;const t=e.querySelector(".btn--secondary"),s=e.querySelector(".dialog");return this.hasAttribute("danger")?t??e.querySelector(".close")??s:e.querySelector(".btn--primary, .btn--danger")??t??s}_restoreFocus(){const e=this._prevFocus;this._prevFocus=null,!(!e||!e.isConnected)&&e.focus()}_remembered(){return this.shadowRoot?.querySelector(".remember__box")?.checked===!0}render(){const e=this.title??"",t=this.message??"",s=this["confirm-label"]||"Confirm",o=this["cancel-label"]||"Cancel",i=this.hasAttribute("danger"),n=this.hasAttribute("hide-cancel"),a=this.hasAttribute("dismissable"),l=this["remember-label"]??"";return d` |
| 635 |
<div class="dialog" tabindex="-1"> |
| 636 |
${a?d`<button |
| 637 |
type="button" |
| 638 |
class="close" |
| 639 |
aria-label="Close" |
| 640 |
@click=${()=>this._cancel()} |
| 641 |
>×</button>`:d``} |
| 642 |
${e?d`<h2 class="title">${e}</h2>`:d``} |
| 643 |
${t?d`<p class="message">${t}</p>`:d``} |
| 644 |
${l?d`<label class="remember"> |
| 645 |
<input type="checkbox" class="remember__box" /> |
| 646 |
<span class="remember__label">${l}</span> |
| 647 |
</label>`:d``} |
| 648 |
<div class="actions"> |
| 649 |
${n?d``:d`<button |
| 650 |
type="button" |
| 651 |
class="btn btn--secondary" |
| 652 |
@click=${()=>this._cancel()} |
| 653 |
> |
| 654 |
${o} |
| 655 |
</button>`} |
| 656 |
<button |
| 657 |
type="button" |
| 658 |
class="btn ${i?"btn--danger":"btn--primary"}" |
| 659 |
@click=${()=>this._confirm()} |
| 660 |
> |
| 661 |
${s} |
| 662 |
</button> |
| 663 |
</div> |
| 664 |
</div> |
| 665 |
`}};Pe.props=["open","title","message","confirm-label","cancel-label","danger","hide-cancel","dismissable","remember-label"],Pe.styles=[$n],Pe.help=void 0;let Ss=Pe;v("os-confirm-dialog",Ss);const An=b` ${$}:host{display:none;position:fixed;inset:0;align-items:center;justify-content:center;background:var( --os-ui-scrim,rgba( 0,0,0,0.45 ) );background-image:var( --os-ui-scrim-image,none );background-repeat:var( --os-ui-scrim-image-repeat,repeat );background-size:var( --os-ui-scrim-image-size,auto );background-position:var( --os-ui-scrim-image-position,center );backdrop-filter:blur( 2px );z-index:10000;--os-ui-fg:var( --os-ui-modal-text,#f0f0f1 );--os-ui-fg-muted:var( --os-ui-modal-text-muted,#a7aaad );--os-ui-border:var( --os-ui-modal-border,rgba( 255,255,255,0.25 ) );--os-window-bg:var( --os-ui-modal-field-bg,#2c3338 );--os-ui-button-bg-hover:var( --os-ui-modal-button-bg-hover,rgba( 255,255,255,0.08 ) );--os-ui-surface:var( --os-ui-modal-surface,#2c3338 );--os-ui-surface-elevated:var( --os-ui-modal-surface-elevated,#3c434a );--os-ui-border-strong:var( --os-ui-modal-border-strong,rgba( 255,255,255,0.35 ) );--os-ui-hover:var( --os-ui-modal-hover,rgba( 255,255,255,0.08 ) );--os-ui-notice-color:var( --os-ui-modal-text,#f0f0f1 );--os-ui-card-bg:var( --os-ui-modal-surface,#2c3338 );--os-ui-card-fg:var( --os-ui-modal-text,#f0f0f1 );--os-ui-card-border:var( --os-ui-modal-border,rgba( 255,255,255,0.25 ) );--os-ui-card-border-hover:var( --os-ui-modal-border-strong,rgba( 255,255,255,0.35 ) )}:host( [ open ] ){display:flex;animation:os-modal-scrim var( --_holo-t ) var( --_holo-ease )}:host( [ open ] ) .dialog{animation:os-modal-dialog var( --_holo-t ) var( --_holo-spring )}@keyframes os-modal-scrim{from{opacity:0}}@keyframes os-modal-dialog{from{opacity:0;transform:scale( 0.96 ) translateY( 8px )}}@media ( prefers-reduced-motion:reduce ){:host( [ open ] ),:host( [ open ] ) .dialog{animation:none}}.dialog{max-width:92vw;max-height:90vh;background-color:var( --os-ui-modal-bg,#1d2327 );background-image:var( --os-ui-dialog-bg-image,none );background-repeat:var( --os-ui-dialog-bg-image-repeat,repeat );background-size:var( --os-ui-dialog-bg-image-size,auto );background-position:var( --os-ui-dialog-bg-image-position,center );color:var( --os-ui-modal-fg,var( --os-fg,#fff ) );border:1px solid var( --os-ui-border,rgba( 255,255,255,0.08 ) );border-radius:10px;box-shadow:0 20px 50px rgba( 0,0,0,0.6 );display:flex;flex-direction:column;overflow:hidden}:host( [ size='sm' ] ) .dialog{width:min( 360px,92vw )}:host(:not( [ size ] ) ) .dialog,:host( [ size='md' ] ) .dialog{width:min( 540px,92vw )}:host( [ size='lg' ] ) .dialog{width:min( 760px,94vw )}.header{display:flex;align-items:center;gap:10px;padding:16px 20px 12px;border-bottom:1px solid var( --os-ui-border,rgba( 255,255,255,0.06 ) )}.title{margin:0;flex:1;font-size:15px;font-weight:600}.header-actions{display:flex;gap:6px}.header-actions::slotted( * ){margin-inline-start:6px}.close{background:transparent;border:0;color:inherit;font-size:18px;line-height:1;padding:4px 8px;border-radius:4px;cursor:pointer;opacity:0.7}.close:hover{opacity:1;background:var( --os-ui-hover,rgba( 255,255,255,0.08 ) )}.body{padding:16px 20px;overflow:auto;flex:1 1 auto;font-size:13px;line-height:1.5}.footer{padding:12px 20px 16px;border-top:1px solid var( --os-ui-border,rgba( 255,255,255,0.06 ) )}.footer slot{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}:host( [ mandatory ] ) .close{display:none}`,ti='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',Te=class Te extends m{constructor(){super(...arguments),this._prevFocus=null,this._onKey=e=>{if(e.key==="Escape"&&!this.hasAttribute("mandatory")){e.preventDefault(),this._cancel();return}if(e.key==="Tab"){const t=this._focusables();if(t.length===0)return;const s=t[0],o=t[t.length-1],i=this.ownerDocument,n=i?i.activeElement:null,a=e.composedPath()[0]||n;e.shiftKey&&a===s?(e.preventDefault(),o.focus()):!e.shiftKey&&a===o&&(e.preventDefault(),s.focus())}},this._onBackdrop=e=>{if(this.hasAttribute("mandatory"))return;const t=e.composedPath();(t.length>0?t[0]:e.target)===this&&this._cancel()}}connectedCallback(){super.connectedCallback(),this.setAttribute("role","dialog"),this.setAttribute("aria-modal","true"),this.addEventListener("keydown",this._onKey),this.addEventListener("click",this._onBackdrop)}disconnectedCallback(){this.removeEventListener("keydown",this._onKey),this.removeEventListener("click",this._onBackdrop)}attributeChangedCallback(e,t,s){if(super.attributeChangedCallback?.(e,t,s),e==="open"){if(s!==null){const o=this.ownerDocument;this._prevFocus=o?o.activeElement:null,queueMicrotask(()=>this._focusFirst())}else if(this._prevFocus){try{this._prevFocus.focus()}catch{}this._prevFocus=null}}}showModal(){this.setAttribute("open","")}hideModal(){this.removeAttribute("open")}_focusables(){const e=this.shadowRoot;if(!e)return[];const t=Array.from(this.querySelectorAll(ti)),s=Array.from(e.querySelectorAll(ti));return[...t,...s].filter(o=>o.offsetParent!==null||o.tagName==="BUTTON")}_focusFirst(){const e=this._focusables();e.length>0?e[0].focus():this.shadowRoot?.querySelector(".dialog")?.focus?.()}_cancel(){const e=new CustomEvent("os-modal-cancel",{bubbles:!0,cancelable:!0,composed:!0});this.dispatchEvent(e)&&this.hideModal()}render(){const e=this.getAttribute("title")??"",t=this.hasAttribute("mandatory");return d` |
| 666 |
<div part="dialog" class="dialog" tabindex="-1"> |
| 667 |
${e?d` |
| 668 |
<div class="header"> |
| 669 |
<h2 class="title">${e}</h2> |
| 670 |
<div class="header-actions"> |
| 671 |
<slot name="header-actions"></slot> |
| 672 |
${t?d``:d`<button |
| 673 |
type="button" |
| 674 |
class="close" |
| 675 |
aria-label="Close" |
| 676 |
@click=${()=>this._cancel()} |
| 677 |
>×</button>`} |
| 678 |
</div> |
| 679 |
</div> |
| 680 |
`:d``} |
| 681 |
<div class="body"> |
| 682 |
<slot></slot> |
| 683 |
</div> |
| 684 |
<div class="footer"> |
| 685 |
<slot name="footer"></slot> |
| 686 |
</div> |
| 687 |
</div> |
| 688 |
`}};Te.props=["open","title","size","mandatory"],Te.styles=[An],Te.help=void 0;let zs=Te;v("os-modal",zs);const si="X-WP-Nonce";function Sn(r,e){const t=zn();if(!t)return e;const s=En(r);if(!s||!Ln(s))return e;const o=e?.headers??(typeof Request<"u"&&r instanceof Request?r.headers:void 0),i=new Headers(o??{});return i.has(si)?e:(i.set(si,t),{...e??{},headers:i})}function zn(){if(typeof window>"u")return;const e=window.openStationConfig?.restNonce;return typeof e=="string"&&e.length>0?e:void 0}function En(r){try{const e=typeof window<"u"&&window.location?window.location.href:void 0;return typeof r=="string"?new URL(r,e):r instanceof URL?r:typeof Request<"u"&&r instanceof Request?new URL(r.url,e):null}catch{return null}}function Ln(r){return typeof window>"u"||!window.location||r.origin!==window.location.origin?!1:!!(r.pathname.includes("/wp-json/")||r.searchParams.has("rest_route"))}function Mn(r,e,t={}){const s=window.wp?.os?.fetch;if(typeof s=="function")return s(r,e,t);const o=Sn(r,e);return fetch(r,o)}class Rn extends Error{constructor(e,t){super(e||t.serverMessage||`HTTP ${t.status}`),this.name="RestError",this.status=t.status,this.code=t.code,this.data=t.data,this.serverMessage=t.serverMessage??""}}function In(r){const e=typeof r=="object"&&r!==null?r:void 0;return{code:typeof e?.code=="string"?e.code:void 0,data:e?.data,serverMessage:typeof e?.message=="string"?e.message:""}}function Pn(r,e,t=""){return new Rn(t,{status:r,...In(e)})}async function Tn(r,e=""){let t=null;try{t=await r.json()}catch{t=null}return Pn(r.status,t,e)}const Dn=b`:host{display:block;position:relative;font-size:13px}.input{width:100%;padding:8px 10px;background:var( --os-ui-input-bg,var( --os-ui-hover,rgba( 255,255,255,0.06 ) ) );color:inherit;border:1px solid var( --os-ui-border,rgba( 255,255,255,0.12 ) );border-radius:6px;font:inherit;box-sizing:border-box}.input:focus{outline:none;border-color:var( --os-ui-accent,#2271b1 );box-shadow:var( --os-ui-focus-ring-field,0 0 0 1px #2271b1,0 0 0 4px rgba( 34,113,177,0.18 ) )}.dropdown{background:var( --os-bg,#1d2327 );color:var( --os-fg,#fff );border:1px solid var( --os-ui-border,rgba( 255,255,255,0.18 ) );border-radius:6px;overflow:auto;z-index:11000;box-shadow:0 12px 32px rgba( 0,0,0,0.5 )}.empty.error{color:var( --os-ui-danger-hover,#ff8080 )}.item{display:flex;align-items:center;gap:10px;padding:8px 10px;cursor:pointer;border:0;background:transparent;color:inherit;width:100%;text-align:start;font:inherit}.item:hover,.item:focus{background:var( --os-ui-hover,rgba( 255,255,255,0.06 ) );outline:none}.avatar{width:24px;height:24px;border-radius:50%;flex:0 0 auto;background:var( --os-ui-hover,rgba( 255,255,255,0.1 ) )}.name{font-weight:500}.slug{opacity:0.6;font-size:12px}.empty{padding:12px;color:var( --os-ui-fg-muted,rgba( 255,255,255,0.5 ) );font-size:12px}`,De=class De extends m{constructor(){super(...arguments),this._timer=null,this._abort=null,this._results=[],this._query="",this._open=!1,this._phase="idle",this._error="",this._dropdownStyle="",this._onScrollOrResize=()=>{},this._onInput=e=>{const t=e.target.value;this._query=t,this._scheduleSearch(t)},this._onFocus=()=>{if(this._results.length===0&&this._phase==="idle"){this._scheduleSearch(this._query);return}this._open=!0,this._positionDropdown(),this.requestUpdate()},this._onBlur=()=>{setTimeout(()=>{this._open=!1,this.requestUpdate()},150)},this._pick=e=>{this.emit("os-user-pick",{user:e}),this._results=[],this._open=!1,this._phase="idle",this._query="";const t=this.shadowRoot?.querySelector(".input");t&&(t.value=""),this.requestUpdate()}}connectedCallback(){super.connectedCallback(),this._onScrollOrResize=()=>{this._open&&(this._positionDropdown(),this.requestUpdate())},window.addEventListener("resize",this._onScrollOrResize),window.addEventListener("scroll",this._onScrollOrResize,!0)}disconnectedCallback(){this._timer&&clearTimeout(this._timer),this._abort&&this._abort.abort(),window.removeEventListener("resize",this._onScrollOrResize),window.removeEventListener("scroll",this._onScrollOrResize,!0)}_endpoint(){const e=this.getAttribute("endpoint");return e||window.openStationConfig?.filesUsersSearchUrl||""}_scheduleSearch(e){this._timer&&clearTimeout(this._timer),this._phase="loading",this._open=!0,this._positionDropdown(),this.requestUpdate(),this._timer=setTimeout(()=>this._runSearch(e),200)}async _runSearch(e){const t=this._endpoint();if(!t){this._phase="error",this._error="Search endpoint is not configured.",this._results=[],this._open=!0,this.requestUpdate();return}this._abort&&this._abort.abort();const s=new AbortController;this._abort=s;const o=this.getAttribute("exclude")||"",i=t+"?q="+encodeURIComponent(e)+"&exclude="+encodeURIComponent(o);try{const n={signal:s.signal,credentials:"same-origin"},a=await Mn(i,n,{source:"desktop-mode/files-user-search",silent:!0});if(!a.ok)throw await Tn(a);const l=await a.json();this._results=l&&Array.isArray(l.users)?l.users:[],this._phase="ready",this._error="",this._open=!0}catch(n){if(n.name==="AbortError")return;this._results=[],this._phase="error",this._error=n.message||"Search failed.",this._open=!0}this._positionDropdown(),this.requestUpdate()}_positionDropdown(){const e=this.shadowRoot?.querySelector(".input");if(!e)return;const t=e.getBoundingClientRect(),s=t.bottom+4,o=t.left,i=t.width,a=window.innerHeight-t.bottom,l=t.top,c=Math.max(120,Math.min(280,Math.max(a,l)-16));a<200&&l>a?this._dropdownStyle=["position:fixed",`left:${o}px`,`top:${t.top-4-c}px`,`width:${i}px`,`max-height:${c}px`].join(";"):this._dropdownStyle=["position:fixed",`left:${o}px`,`top:${s}px`,`width:${i}px`,`max-height:${c}px`].join(";")}_dropdownContent(){if(this._phase==="loading")return d`<div class="empty">Searching…</div>`;if(this._phase==="error")return d`<div class="empty error">${this._error}</div>`;if(this._results.length===0){const e=this._query?"No matches.":"No users available.";return d`<div class="empty">${e}</div>`}return this._results.map(e=>d` |
| 689 |
<button |
| 690 |
type="button" |
| 691 |
class="item" |
| 692 |
role="option" |
| 693 |
@mousedown=${t=>t.preventDefault()} |
| 694 |
@click=${()=>this._pick(e)} |
| 695 |
> |
| 696 |
<img class="avatar" src=${e.avatarUrl} alt="" /> |
| 697 |
<div> |
| 698 |
<div class="name">${e.name}</div> |
| 699 |
<div class="slug">${e.slug}</div> |
| 700 |
</div> |
| 701 |
</button> |
| 702 |
`)}render(){const e=this.getAttribute("placeholder")||"Search users…";return d` |
| 703 |
<input |
| 704 |
class="input" |
| 705 |
type="search" |
| 706 |
placeholder=${e} |
| 707 |
autocomplete="off" |
| 708 |
@input=${this._onInput} |
| 709 |
@focus=${this._onFocus} |
| 710 |
@blur=${this._onBlur} |
| 711 |
.value=${this._query} |
| 712 |
/> |
| 713 |
${this._open?d` |
| 714 |
<div class="dropdown" role="listbox" style=${this._dropdownStyle}> |
| 715 |
${this._dropdownContent()} |
| 716 |
</div> |
| 717 |
`:d``} |
| 718 |
`}};De.props=["placeholder","exclude","endpoint"],De.styles=[Dn],De.help=void 0;let Es=De;v("os-user-search",Es);const qn=b`:host{display:flex;flex-wrap:wrap;gap:6px;font-size:13px}.chip{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:var( --os-ui-hover,rgba( 255,255,255,0.06 ) );color:inherit;border:1px solid var( --os-ui-border,rgba( 255,255,255,0.12 ) );cursor:pointer;font:inherit}.chip:hover{background:var( --os-ui-hover,rgba( 255,255,255,0.12 ) )}.chip[ aria-pressed='true' ]{background:var( --wp-admin-theme-color,#2271b1 );border-color:var( --wp-admin-theme-color,#2271b1 );color:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) )}.empty{color:var( --os-ui-fg-muted,rgba( 255,255,255,0.5 ) );font-size:12px}`,qe=class qe extends m{constructor(){super(...arguments),this._onToggle=e=>{const t=!this._selectedSet().has(e);this.emit("os-role-toggle",{slug:e,selected:t})}}_selectedSet(){const e=this.getAttribute("selected")||"";return new Set(e.split(",").map(t=>t.trim()).filter(t=>t!==""))}_roles(){const e=this.getAttribute("roles");if(e)try{const t=JSON.parse(e);if(Array.isArray(t))return t}catch{}return window.openStationConfig?.shareEligibleRoles||[]}render(){const e=this._roles();if(e.length===0)return d`<span class="empty">No eligible roles.</span>`;const t=this._selectedSet();return d` |
| 719 |
${e.map(s=>{const o=t.has(s.slug);return d` |
| 720 |
<button |
| 721 |
type="button" |
| 722 |
class="chip" |
| 723 |
aria-pressed=${o?"true":"false"} |
| 724 |
@click=${()=>this._onToggle(s.slug)} |
| 725 |
>${s.name}</button> |
| 726 |
`})} |
| 727 |
`}};qe.props=["selected","roles"],qe.styles=[qn],qe.help=void 0;let Ls=qe;v("os-role-picker",Ls);const Nn=b`:host{display:block;position:absolute;z-index:10;background:var( --os-ui-flyout-bg,var( --os-ui-surface-elevated,#ffffff ) );background-image:var( --os-ui-panel-bg-image,none );background-repeat:var( --os-ui-panel-bg-image-repeat,repeat );background-size:var( --os-ui-panel-bg-image-size,auto );background-position:var( --os-ui-panel-bg-image-position,center );color:var( --os-ui-flyout-fg,var( --os-fg,#1d2327 ) );border-radius:14px;box-shadow:var( --os-ui-flyout-shadow,0 16px 48px rgba( 0,25,53,0.4 ) );transform:translateX( 110% );opacity:0;pointer-events:none;transition:transform 220ms cubic-bezier( 0.22,1,0.36,1 ),opacity 180ms ease}:host( [ open ] ){transform:translateX( 0 );opacity:1;pointer-events:auto}:host( [ placement='end' ] ),:host(:not( [ placement ] ) ){inset-block:64px 14px;inset-inline-end:14px;width:min( 320px,calc( 100% - 28px ) )}:host( [ placement='start' ] ){inset-block:64px 14px;inset-inline-start:14px;width:min( 320px,calc( 100% - 28px ) );transform:translateX( -110% )}:host( [ placement='start' ][ open ] ){transform:translateX( 0 )}:host( [ placement='top' ] ){inset-block-start:14px;inset-inline:14px;max-block-size:calc( 100% - 28px );transform:translateY( -110% )}:host( [ placement='top' ][ open ] ){transform:translateY( 0 )}:host-context( [ dir='rtl' ] ):host( [ placement='end' ] ),:host-context( [ dir='rtl' ] ):host(:not( [ placement ] ) ){transform:translateX( -110% )}:host-context( [ dir='rtl' ] ):host( [ placement='end' ][ open ] ),:host-context( [ dir='rtl' ] ):host(:not( [ placement ] ) [ open ] ){transform:translateX( 0 )}:host-context( [ dir='rtl' ] ):host( [ placement='start' ] ){transform:translateX( 110% )}:host-context( [ dir='rtl' ] ):host( [ placement='start' ][ open ] ){transform:translateX( 0 )}:host::before{content:'';position:fixed;inset:0;background:var( --os-ui-flyout-backdrop,transparent );z-index:-1;pointer-events:none;transition:opacity 180ms ease;opacity:0}:host( [ open ] )::before{opacity:1}@media ( prefers-reduced-motion:reduce ){:host{transition:none}:host::before{transition:none}}`,oi=["a[href]","area[href]","button:not([disabled])",'input:not([disabled]):not([type="hidden"])',"select:not([disabled])","textarea:not([disabled])",'[tabindex]:not([tabindex="-1"])','[contenteditable="true"]'].join(","),Hn="[data-flyout-close]",Ne=class Ne extends m{constructor(){super(...arguments),this._trigger=null,this._onDocKey=null,this._onScopePointerDown=null,this._onHostClick=null,this._onHostKeyDown=null,this._pendingReason=null}connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","dialog"),this.hasAttribute("open")||this.setAttribute("inert","")}disconnectedCallback(){this._detachOpenListeners()}attributeChangedCallback(e,t,s){super.attributeChangedCallback(e,t,s),e==="open"&&(s!==null&&t===null?this._handleOpen():s===null&&t!==null&&this._handleClose())}_handleOpen(){this.removeAttribute("inert");const e=this.ownerDocument,t=e?.activeElement??null;this._trigger=t instanceof HTMLElement&&t!==this&&t!==e?.body&&t!==e?.documentElement?t:null,queueMicrotask(()=>{if(!this.hasAttribute("open"))return;(this._firstFocusable()??this).focus?.({preventScroll:!0})}),this._attachOpenListeners()}_handleClose(){const e=this._pendingReason??"api";this._pendingReason=null,this.setAttribute("inert",""),this._detachOpenListeners(),this.emit("os-flyout-dismiss",{reason:e});const t=this._trigger;this._trigger=null,t&&t.isConnected&&t.focus?.({preventScroll:!0})}_dismiss(e){this.hasAttribute("open")&&(this._pendingReason=e,this.removeAttribute("open"))}_attachOpenListeners(){const e=this._resolveScopeRoot();this._onScopePointerDown=t=>{if(!this.hasAttribute("open"))return;const s=t.composedPath();s.includes(this)||this._trigger&&s.includes(this._trigger)||this._dismiss("pointer")},e.addEventListener("pointerdown",this._onScopePointerDown),this._onDocKey=t=>{t.key==="Escape"&&this.hasAttribute("open")&&(t.preventDefault(),this._dismiss("escape"))},document.addEventListener("keydown",this._onDocKey),this._onHostKeyDown=t=>{if(t.key!=="Tab")return;const s=this._allFocusable();if(s.length===0){t.preventDefault();return}const o=s[0],i=s[s.length-1],n=this.ownerDocument?.activeElement??null;t.shiftKey&&(n===o||n===this)?(t.preventDefault(),i.focus({preventScroll:!0})):!t.shiftKey&&n===i&&(t.preventDefault(),o.focus({preventScroll:!0}))},this.addEventListener("keydown",this._onHostKeyDown),this._onHostClick=t=>{const o=t.target?.closest?.(Hn);o&&this.contains(o)&&this._dismiss("close-button")},this.addEventListener("click",this._onHostClick)}_detachOpenListeners(){this._onDocKey&&(document.removeEventListener("keydown",this._onDocKey),this._onDocKey=null),this._onScopePointerDown&&(this._resolveScopeRoot().removeEventListener("pointerdown",this._onScopePointerDown),this._onScopePointerDown=null),this._onHostKeyDown&&(this.removeEventListener("keydown",this._onHostKeyDown),this._onHostKeyDown=null),this._onHostClick&&(this.removeEventListener("click",this._onHostClick),this._onHostClick=null)}_resolveScopeRoot(){const e=this.getAttribute("scope")??"window";return e==="document"?document.body:e==="parent"?this.parentElement??document.body:this.closest(".os-window__body")??this.parentElement??document.body}_firstFocusable(){return this.querySelector(oi)??null}_allFocusable(){return Array.from(this.querySelectorAll(oi)).filter(e=>!e.disabled)}render(){return d`<slot></slot>`}};Ne.props=["open","placement","scope","aria-label","aria-labelledby"],Ne.styles=[Nn],Ne.help=void 0;let Ms=Ne;v("os-flyout",Ms);const Fn=b`:host{display:contents;--_accent:var( --os-ui-accent,#f252fc );--_glow:var( --os-ui-accent-dim,#d846e0 );--_bg:var( --os-ui-surface-elevated,#ffffff );--_fg:var( --os-ui-fg,#1d2327 );--_muted:var( --os-ui-fg-muted,#646970 );--_border:var( --os-ui-border-strong,rgba( 0,0,0,0.12 ) );--_shadow:var( --os-ui-flyout-shadow,0 16px 48px rgba( 0,25,53,0.4 ) );--_ease:cubic-bezier( 0.22,1,0.36,1 );--_step:360ms}.layer{position:fixed;inset:0;margin:0;padding:0;border:0;width:auto;height:auto;max-width:none;max-height:none;overflow:visible;background:transparent;color:inherit;pointer-events:none}.layer[hidden]{display:none}.outline{position:fixed;box-sizing:border-box;border:2px solid var( --_accent );border-radius:12px;box-shadow:0 0 0 4px color-mix( in srgb,var( --_glow ) 28%,transparent );pointer-events:none;animation:os-coachmark-pulse 1.6s ease-in-out infinite}.outline[hidden]{display:none}@keyframes os-coachmark-pulse{0%,100%{box-shadow:0 0 0 4px color-mix( in srgb,var( --_glow ) 28%,transparent )}50%{box-shadow:0 0 0 8px color-mix( in srgb,var( --_glow ) 12%,transparent )}}.card{position:fixed;box-sizing:border-box;width:min( 320px,calc( 100vw - 24px ) );padding:16px 18px 14px;border-radius:14px;background:var( --_bg );background-image:var( --os-ui-panel-bg-image,none );background-repeat:var( --os-ui-panel-bg-image-repeat,repeat );background-size:var( --os-ui-panel-bg-image-size,auto );background-position:var( --os-ui-panel-bg-image-position,center );color:var( --_fg );border:1px solid var( --_border );box-shadow:var( --_shadow );pointer-events:auto;outline:none;font-size:13px;line-height:1.5;animation:os-coachmark-in 240ms var( --_ease ) both}.card:focus-visible{box-shadow:var( --_shadow ),0 0 0 2px var( --_accent )}@keyframes os-coachmark-in{from{opacity:0;transform:translateY( 6px )}to{opacity:1;transform:none}}.layer.stepping .card,.layer.stepping .outline{transition:left var( --_step ) var( --_ease ),top var( --_step ) var( --_ease ),width var( --_step ) var( --_ease ),height var( --_step ) var( --_ease )}.card.swap{animation:os-coachmark-swap 300ms var( --_ease )}@keyframes os-coachmark-swap{from{opacity:0.35;transform:scale( 0.97 )}to{opacity:1;transform:none}}.layer.leaving .card,.layer.leaving .outline{animation:os-coachmark-out 180ms ease forwards;pointer-events:none}@keyframes os-coachmark-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY( 6px )}}@keyframes os-coachmark-fade{from{opacity:0}to{opacity:1}}.tail{position:absolute;width:14px;height:14px;box-sizing:border-box;background:var( --_bg );border:1px solid var( --_border );transform:rotate( 45deg );pointer-events:none}.tail[hidden]{display:none}.tail[data-edge='bottom']{bottom:-8px;left:calc( var( --_tail-at,50% ) - 7px );border-top-color:transparent;border-left-color:transparent}.tail[data-edge='top']{top:-8px;left:calc( var( --_tail-at,50% ) - 7px );border-bottom-color:transparent;border-right-color:transparent}.tail[data-edge='left']{left:-8px;top:calc( var( --_tail-at,50% ) - 7px );border-top-color:transparent;border-right-color:transparent}.tail[data-edge='right']{right:-8px;top:calc( var( --_tail-at,50% ) - 7px );border-bottom-color:transparent;border-left-color:transparent}.meta{font-size:11px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;color:var( --_accent );margin:0 0 4px}.meta:empty{display:none}h2{margin:0 0 6px;font-size:15px;font-weight:600;line-height:1.3;color:inherit}.body{color:var( --_muted )}.body::slotted( p ){margin:0 0 8px}.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:12px}.actions os-button[hidden]{display:none}@media ( prefers-reduced-motion:reduce ){.outline{animation:none}.card,.card.swap{animation:os-coachmark-fade 160ms ease}.layer.stepping .card,.layer.stepping .outline{transition:none}.layer.leaving .card,.layer.leaving .outline{animation:os-coachmark-fade 140ms ease reverse forwards}}`,Un=12,P=12,B=4,Kn=16,ii=28,Vn=180,jn=360,ri="gone",Rs=["bottom","top","end","start"];function ni(r){switch(r){case"top":return"bottom";case"bottom":return"top";case"start":return"end";default:return"start"}}function ai(r){if(!r.isConnected)return!1;const e=r.checkVisibility;return typeof e!="function"||e.call(r)}const He=class He extends m{constructor(){super(...arguments),this._anchor=null,this._returnFocus=null,this._shown=!1,this._raf=0,this._lastKey="",this._listeners=null,this._leaving=!1,this._exitTimer=0,this._stepTimer=0,this._speakerKey="",this._onKeyDown=e=>{if(e.key==="Escape"){e.preventDefault(),e.stopPropagation(),this.emit("os-coachmark-dismiss",{step:this.stepNumber});return}if(e.key!=="Tab")return;const t=Array.from(this.card?.querySelectorAll("os-button")??[]).filter(i=>!i.hidden);if(t.length===0){e.preventDefault();return}const s=this._focusables(),o=t.indexOf(this._activeHost());e.shiftKey&&o<=0?(e.preventDefault(),s[s.length-1]?.focus({preventScroll:!0})):!e.shiftKey&&(o===-1||o===t.length-1)&&(e.preventDefault(),s[0]?.focus({preventScroll:!0}))}}get anchor(){return this._anchor}set anchor(e){this._anchor=e??null,this._lastKey="",this._shown&&(this._beginStep(),this._position())}get stepNumber(){return Number(this.getAttribute("step")??0)||0}get layer(){return this.shadowRoot?.querySelector(".layer")??null}get card(){return this.shadowRoot?.querySelector(".card")??null}get outline(){return this.shadowRoot?.querySelector(".outline")??null}disconnectedCallback(){this._teardown(),this._finishExit(),window.clearTimeout(this._stepTimer)}render(){const e=this.hasAttribute("open"),t=this.getAttribute("step"),s=this.getAttribute("total"),o=t&&s?this.getAttribute("counter-label")||`${t} of ${s}`:"",i=this.getAttribute("primary-label")??"Next",n=this.getAttribute("secondary-label")??"Skip";return d`<div class="layer" popover="manual" ?hidden=${!e&&!this._leaving}> |
| 728 |
<div class="outline" hidden aria-hidden="true"></div> |
| 729 |
<div |
| 730 |
class="card" |
| 731 |
role="dialog" |
| 732 |
aria-labelledby="os-coachmark-heading" |
| 733 |
tabindex="-1" |
| 734 |
@keydown=${this._onKeyDown} |
| 735 |
> |
| 736 |
<span class="tail" hidden aria-hidden="true"></span> |
| 737 |
<p class="meta">${o}</p> |
| 738 |
<h2 id="os-coachmark-heading">${this.getAttribute("heading")??""}</h2> |
| 739 |
<div class="body"><slot></slot></div> |
| 740 |
<div class="actions"> |
| 741 |
<os-button |
| 742 |
variant="ghost" |
| 743 |
class="secondary" |
| 744 |
?hidden=${n===""} |
| 745 |
@click=${()=>this.emit("os-coachmark-secondary",{step:this.stepNumber})} |
| 746 |
>${n}</os-button |
| 747 |
> |
| 748 |
<os-button |
| 749 |
variant="primary" |
| 750 |
class="primary" |
| 751 |
@click=${()=>this.emit("os-coachmark-primary",{step:this.stepNumber})} |
| 752 |
>${i}</os-button |
| 753 |
> |
| 754 |
</div> |
| 755 |
</div> |
| 756 |
</div>`}requestUpdate(){super.requestUpdate(),queueMicrotask(()=>queueMicrotask(()=>this._afterRender()))}_afterRender(){if(!this.isConnected)return;const e=this.hasAttribute("open");e&&!this._shown?this._show():!e&&this._shown?this._hide():e&&(this._lastKey="",this._position())}_show(){const e=this.layer;if(!e)return;this._finishExit(!1),this.card?.classList.remove("swap"),this._shown=!0;const t=this.ownerDocument.activeElement;this._returnFocus=t instanceof HTMLElement&&t!==this.ownerDocument.body?t:null;try{e.showPopover?.()}catch{}this._listeners=new AbortController;const{signal:s}=this._listeners,o=()=>{this._lastKey="",this._position()};window.addEventListener("resize",o,{signal:s}),document.addEventListener("os-work-area-changed",o,{signal:s}),this._position(),this._track(),this._focusPrimary()}_hide(){this._teardown();const e=this._returnFocus;this._returnFocus=null,e&&e.isConnected&&e.focus?.({preventScroll:!0});const t=this.layer;t&&(this._leaving=!0,t.classList.add("leaving"),this.requestUpdate(),this._exitTimer=window.setTimeout(()=>this._finishExit(),Vn))}_finishExit(e=!0){if(!this._leaving)return;window.clearTimeout(this._exitTimer),this._exitTimer=0,this._leaving=!1;const t=this.layer;if(t?.classList.remove("leaving"),e&&t)try{t.hidePopover?.()}catch{}this.requestUpdate()}_beginStep(){const e=this.layer,t=this.card;!e||!t||(e.classList.add("stepping"),t.classList.remove("swap"),t.offsetWidth,t.classList.add("swap"),window.clearTimeout(this._stepTimer),this._stepTimer=window.setTimeout(()=>{e.classList.remove("stepping")},jn))}_teardown(){this._shown=!1,this._raf&&(cancelAnimationFrame(this._raf),this._raf=0),this._listeners?.abort(),this._listeners=null}_track(){if(typeof requestAnimationFrame!="function")return;const e=()=>{if(!this._shown){this._raf=0;return}if(this._anchor){let t=ri;if(ai(this._anchor)){const s=this._anchor.getBoundingClientRect();t=`${s.left},${s.top},${s.width},${s.height}`}t!==this._lastKey&&this._position()}this._raf=requestAnimationFrame(e)};this._raf=requestAnimationFrame(e)}_position(){const e=this.card,t=this.outline;if(!e||!t)return;const s=window.innerWidth,o=window.innerHeight,i=e.getBoundingClientRect(),n=this._anchor&&ai(this._anchor)?this._anchor:null,a=Math.max(0,Number(this.getAttribute("speaker-size"))||0),l=Un;if(!n){t.hidden=!0;const A=Math.max(P,(s-i.width)/2),U=Math.max(P,(o-i.height)/2);e.style.left=`${A}px`,e.style.top=`${U}px`,this._lastKey=this._anchor?ri:"",this._placeSpeaker("top",A,U,i,a);return}const c=n.getBoundingClientRect();this._lastKey=`${c.left},${c.top},${c.width},${c.height}`,t.hidden=!1,t.style.left=`${c.left-B}px`,t.style.top=`${c.top-B}px`,t.style.width=`${c.width+B*2}px`,t.style.height=`${c.height+B*2}px`;const u=getComputedStyle(this.ownerDocument.documentElement).direction==="rtl",h={top:c.top,bottom:o-c.bottom,start:u?s-c.right:c.left,end:u?c.left:s-c.right},p=A=>(A==="top"||A==="bottom"?i.height:i.width)+l+P,f=A=>h[A]>=p(A),g=this.getAttribute("placement")??"auto",x=Rs.find(A=>A===g);let _;x?_=f(x)||!f(ni(x))?x:ni(x):(_=Rs.reduce((A,U)=>h[U]>h[A]?U:A,Rs[0]),f("bottom")?_="bottom":f("top")&&(_="top"));let y,w;const S=c.left+c.width/2-i.width/2,z=c.top+c.height/2-i.height/2,M=A=>A==="start"!==u?"left":"right";switch(_){case"top":y=S,w=c.top-B-l-i.height;break;case"bottom":y=S,w=c.bottom+B+l;break;default:w=z,y=M(_)==="left"?c.left-B-l-i.width:c.right+B+l}y=Math.min(Math.max(P,y),Math.max(P,s-i.width-P)),w=Math.min(Math.max(P,w),Math.max(P,o-i.height-P)),e.style.left=`${y}px`,e.style.top=`${w}px`,this._placeSpeaker(_,y,w,i,a)}_placeSpeaker(e,t,s,o,i){const n=this.card?.querySelector(".tail");if(!n)return;if(i<=0){n.hidden=!0,this._speakerKey="";return}const a=window.innerWidth,l=window.innerHeight,c=Kn+i/2,u=(y,w,S)=>Math.min(Math.max(y,w),Math.max(w,S));let h,p;e==="top"||e==="bottom"?(h=a-(t+o.width)>=t?"right":"left",p={x:h==="right"?t+o.width+c:t-c,y:u(s+o.height/2,P+i/2,l-P-i/2)}):(h=l-(s+o.height)>=s?"bottom":"top",p={x:u(t+o.width/2,P+i/2,a-P-i/2),y:h==="bottom"?s+o.height+c:s-c}),n.hidden=!1,n.dataset.edge=h;const f=h==="top"||h==="bottom",g=f?o.width:o.height,x=u(f?p.x-t:p.y-s,ii,g-ii);n.style.setProperty("--_tail-at",`${x}px`);const _=`${Math.round(p.x)},${Math.round(p.y)}`;_!==this._speakerKey&&(this._speakerKey=_,this.emit("os-coachmark-speaker",p))}_focusables(){const e=this.card;return e?Array.from(e.querySelectorAll("os-button")).filter(t=>!t.hidden).map(t=>t.shadowRoot?.querySelector("button")??t):[]}_focusPrimary(){const e=this._focusables();(e[e.length-1]??this.card)?.focus?.({preventScroll:!0})}_activeHost(){return this.shadowRoot?.activeElement??null}};He.props=["open","placement","step","total","counter-label","heading","primary-label","secondary-label","speaker-size"],He.styles=[Fn],He.help=void 0;let Is=He;v("os-coachmark",Is);const Bn=b`:host{--_bg:var( --os-tooltip-bg,var( --os-ui-scrim,rgba( 0,0,0,0.85 ) ) );--_fg:var( --os-tooltip-fg,var( --os-ui-fg-on-accent,#fff ) );position:fixed;top:0;left:0;z-index:calc( var( --os-z-fullscreen,99999 ) + 1 );display:block;max-width:280px;pointer-events:none;opacity:0;visibility:hidden;transform:translateY( -2px );transition:opacity 0.15s ease,transform 0.15s ease,visibility 0s linear 0.15s}:host( [ open ] ){opacity:1;visibility:visible;transform:none;transition:opacity 0.15s ease,transform 0.15s ease,visibility 0s}.surface{display:flex;flex-direction:column;gap:2px;padding:6px 12px;border-radius:6px;background:var( --_bg );color:var( --_fg );font-size:12px;font-weight:400;line-height:1.4;overflow-wrap:anywhere}.heading{font-weight:600}.heading + .text{opacity:0.8}@media ( prefers-reduced-motion:reduce ){:host,:host( [ open ] ){transform:none;transition:none}}`,Fe=class Fe extends m{connectedCallback(){super.connectedCallback?.(),this.setAttribute("role","tooltip")}render(){const e=this.heading,t=this.text;return d` |
| 757 |
<div part="surface" class="surface"> |
| 758 |
${e?d`<strong class="heading">${e}</strong>`:""} |
| 759 |
${t?d`<span class="text">${t}</span>`:""} |
| 760 |
</div> |
| 761 |
`}};Fe.props=["heading","text","open"],Fe.styles=[Bn],Fe.help=void 0;let Ps=Fe;v("os-tooltip",Ps);const Wn=b` ${$}:host{display:inline-flex}button{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:4px;background:transparent;color:var( --os-ui-fg-muted,rgba( 0,0,0,0.45 ) );cursor:pointer;transition:background-color 0.15s ease,color 0.15s ease,transform 0.12s ease}:host( [ variant='detach' ] ) button:hover{color:var( --wp-admin-theme-color,#2271b1 );background:var( --os-ui-accent-soft,rgba( 34,113,177,0.12 ) );transform:translateY( -1px )}:host( [ variant='detach' ] ) button:focus-visible{outline:none;color:var( --os-ui-accent,#2271b1 );background:var( --os-ui-accent-soft,rgba( 34,113,177,0.12 ) );box-shadow:var( --_holo-focus )}:host( [ variant='close' ] ) button:hover{color:var( --os-ui-fg-on-accent,#fff );background:var( --os-ui-danger,#d63638 )}:host( [ variant='close' ] ) button:focus-visible{color:var( --os-ui-fg-on-accent,#fff );background:var( --os-ui-danger,#d63638 );outline:none;box-shadow:0 0 0 2px rgba( 12,11,15,0.9 ),0 0 0 4px var( --os-ui-danger,#d63638 ),0 0 12px 2px rgba( 214,54,56,0.45 )}svg{display:block;pointer-events:none;width:12px;height:12px}@media ( prefers-reduced-motion:reduce ){button{transition-duration:0.01ms}:host( [ variant='detach' ] ) button:hover{transform:none}}`,Xn={detach:'<path d="M5 2H2.5v7.5H10V7M6.5 2H10v3.5M10 2L5.5 6.5" stroke="currentColor" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round" fill="none"/>',close:'<path d="M2.5 2.5l7 7M9.5 2.5l-7 7" stroke="currentColor" stroke-width="1.6" stroke-linecap="round"/>'},Ue=class Ue extends m{render(){const e=this.variant||"",t=Xn[e]||"";return d` |
| 762 |
<button type="button"> |
| 763 |
<svg |
| 764 |
viewBox="0 0 12 12" |
| 765 |
aria-hidden="true" |
| 766 |
focusable="false" |
| 767 |
></svg> |
| 768 |
<slot></slot> |
| 769 |
</button> |
| 770 |
<span data-svg-buffer style="display:none">${t}</span> |
| 771 |
`}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._paintSvg())}attributeChangedCallback(e,t,s){super.attributeChangedCallback(e,t,s),queueMicrotask(()=>this._paintSvg())}_paintSvg(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("svg"),s=e.querySelector("[data-svg-buffer]");if(t&&s){const o=s.textContent||"";t.innerHTML!==o&&(t.innerHTML=o)}}};Ue.props=["variant"],Ue.styles=[Wn],Ue.help=void 0;let Ts=Ue;v("os-tab-chip",Ts);const Gn=b`:host{display:flex;flex-direction:column;gap:var( --os-ui-stack-gap,12px );align-items:var( --os-ui-stack-align,stretch );padding:var( --os-ui-stack-padding,0 )}:host( [ hidden ] ){display:none}`,Ke=class Ke extends m{render(){const e=this.gap,t=this.align,s=this.padding,o=e&&/^\d+$/.test(e)?`${e}px`:"";return o&&this.style.setProperty("--os-ui-stack-gap",o),t&&this.style.setProperty("--os-ui-stack-align",t),s!==null&&/^\d+$/.test(s)&&this.style.setProperty("--os-ui-stack-padding",`${s}px`),d`<slot></slot>`}};Ke.props=["gap","align","padding"],Ke.styles=[Gn],Ke.help=void 0;let Ds=Ke;v("os-stack",Ds);const Zn=b`:host{display:flex;flex-direction:row;flex-wrap:wrap;gap:var( --os-ui-cluster-gap,8px );justify-content:var( --os-ui-cluster-justify,flex-start );align-items:var( --os-ui-cluster-align,center )}:host( [ hidden ] ){display:none}`,Ve=class Ve extends m{render(){const e=this.gap,t=this.justify,s=this.align,o=e&&/^\d+$/.test(e)?`${e}px`:"";return o&&this.style.setProperty("--os-ui-cluster-gap",o),t&&this.style.setProperty("--os-ui-cluster-justify",t),s&&this.style.setProperty("--os-ui-cluster-align",s),d`<slot></slot>`}};Ve.props=["gap","justify","align"],Ve.styles=[Zn],Ve.help=void 0;let qs=Ve;v("os-cluster",qs);const Yn=b`:host{display:inline-flex;align-items:center;justify-content:center;width:var( --os-ui-icon-size,16px );height:var( --os-ui-icon-size,16px );color:inherit;line-height:1}:host( [ hidden ] ){display:none}.os-icon__glyph{font-size:var( --os-ui-icon-size,16px );width:var( --os-ui-icon-size,16px );height:var( --os-ui-icon-size,16px );line-height:1;color:inherit;display:inline-flex;align-items:center;justify-content:center}.os-icon__glyph--char{font-family:dashicons;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;speak:none}.os-icon__glyph.dashicons{font-family:dashicons}`;let qt=null;function Qn(r){let e=r.trim();if(e==="")return null;(e.startsWith('"')&&e.endsWith('"')||e.startsWith("'")&&e.endsWith("'"))&&(e=e.slice(1,-1));const t=e.match(/^\\([0-9a-f]{1,6})\s?$/i);return t?String.fromCodePoint(parseInt(t[1],16)):e||null}function li(){const r=new Map;if(typeof document>"u")return r;const e=Array.from(document.styleSheets??[]);for(const t of e){let s=null;try{s=t.cssRules}catch{continue}if(s)for(const o of Array.from(s)){const i=o;if(!i||!i.selectorText)continue;const n=i.selectorText.match(/\.dashicons-([a-z0-9-]+)::?before/i);if(!n)continue;const a=i.style?.content;if(!a)continue;const l=Qn(a);l&&r.set(n[1],l)}}return r}function Jn(r){qt||(qt=li());const e=r.startsWith("dashicons-")?r.slice(10):r;return qt.get(e)??null}function On(){qt=li()}let ci=!1;function ea(){if(ci||typeof window>"u")return;ci=!0;const r=()=>{On()};document.readyState==="loading"&&document.addEventListener("DOMContentLoaded",r,{once:!0}),window.addEventListener("load",r,{once:!0})}ea();const je=class je extends m{render(){const e=this.name||"",t=e.startsWith("dashicons-")?e.slice(10):e,s=this.size;s&&/^\d+$/.test(s)&&this.style.setProperty("--os-ui-icon-size",`${s}px`);const o=Jn(t);return o?d`<span |
| 772 |
class="os-icon__glyph os-icon__glyph--char dashicons dashicons-${t}" |
| 773 |
aria-hidden="true" |
| 774 |
>${o}</span>`:d`<span |
| 775 |
class="os-icon__glyph dashicons dashicons-${t}" |
| 776 |
aria-hidden="true" |
| 777 |
></span>`}};je.props=["name","size"],je.styles=[Yn],je.help=void 0;let Ns=je;v("os-icon",Ns);const ta=b`:host{display:flex;flex-direction:column;gap:var( --os-ui-body-gap,12px );padding:var( --os-ui-body-padding,16px );box-sizing:border-box;width:100%;height:100%;min-width:0;min-height:0}:host( [ scroll ] ){overflow:auto}:host( [ hidden ] ){display:none}::slotted( * ){min-width:0}`,Be=class Be extends m{render(){const e=this.gap,t=this.padding;return e&&/^\d+$/.test(e)&&this.style.setProperty("--os-ui-body-gap",`${e}px`),t&&/^\d+$/.test(t)&&this.style.setProperty("--os-ui-body-padding",`${t}px`),d`<slot></slot>`}};Be.props=["gap","padding","scroll"],Be.styles=[ta],Be.help=void 0;let Hs=Be;v("os-body",Hs);const sa=b`:host{display:flex;flex-direction:column;gap:var( --os-ui-panel-gap,12px );padding:var( --os-ui-panel-padding,16px );background-image:var( --os-ui-panel-bg-image,none );background-repeat:var( --os-ui-panel-bg-image-repeat,repeat );background-size:var( --os-ui-panel-bg-image-size,auto );background-position:var( --os-ui-panel-bg-image-position,center );box-sizing:border-box}:host( [ hidden ] ){display:none}`,We=class We extends m{render(){const e=this.gap,t=this.padding;return e&&/^\d+$/.test(e)&&this.style.setProperty("--os-ui-panel-gap",`${e}px`),t&&/^\d+$/.test(t)&&this.style.setProperty("--os-ui-panel-padding",`${t}px`),d`<slot></slot>`}};We.props=["gap","padding"],We.styles=[sa],We.help=void 0;let Fs=We;v("os-panel",Fs);const oa=b`:host{display:grid;grid-template-columns:repeat( 12,minmax( 0,1fr ) );gap:var( --os-ui-row-gap,12px );row-gap:var( --os-ui-row-row-gap,var( --os-ui-row-gap,12px ) );column-gap:var( --os-ui-row-column-gap,var( --os-ui-row-gap,12px ) );width:100%;min-width:0}:host( [ hidden ] ){display:none}::slotted( [ col='1' ] ){grid-column:span 1}::slotted( [ col='2' ] ){grid-column:span 2}::slotted( [ col='3' ] ){grid-column:span 3}::slotted( [ col='4' ] ){grid-column:span 4}::slotted( [ col='5' ] ){grid-column:span 5}::slotted( [ col='6' ] ){grid-column:span 6}::slotted( [ col='7' ] ){grid-column:span 7}::slotted( [ col='8' ] ){grid-column:span 8}::slotted( [ col='9' ] ){grid-column:span 9}::slotted( [ col='10' ] ){grid-column:span 10}::slotted( [ col='11' ] ){grid-column:span 11}::slotted( [ col='12' ] ){grid-column:span 12}::slotted(:not( [ col ] ) ){grid-column:1 / -1}::slotted( * ){min-width:0}`,Xe=class Xe extends m{render(){const e=this.gap,t=this["column-gap"],s=this["row-gap"];return e&&/^\d+$/.test(e)&&this.style.setProperty("--os-ui-row-gap",`${e}px`),t&&/^\d+$/.test(t)&&this.style.setProperty("--os-ui-row-column-gap",`${t}px`),s&&/^\d+$/.test(s)&&this.style.setProperty("--os-ui-row-row-gap",`${s}px`),d`<slot></slot>`}};Xe.props=["gap","column-gap","row-gap"],Xe.styles=[oa],Xe.help=void 0;let Us=Xe;v("os-row",Us);const ia=b`:host{display:grid;grid-template-rows:auto auto minmax( 0,1fr ) auto;flex:1 1 auto;min-inline-size:0;min-block-size:0;block-size:100%;overflow:hidden}:host( [ hidden ] ){display:none}.content{min-inline-size:0;min-block-size:0;overflow:auto}:host( [ contained ] ) .content{display:flex;flex-direction:column;overflow:hidden}::slotted( * ){min-inline-size:0}:host( [ contained ] ) slot:not( [ name ] )::slotted( * ){flex:1 1 auto;min-block-size:0}`,Ge=class Ge extends m{render(){return d`<div><slot name="header"></slot></div> |
| 778 |
<div><slot name="toolbar"></slot></div> |
| 779 |
<div class="content" part="content"><slot></slot></div> |
| 780 |
<div><slot name="footer"></slot></div>`}};Ge.props=["contained"],Ge.styles=[ia],Ge.help=void 0;let Ks=Ge;v("os-app-frame",Ks);const ra=b`:host{display:flex;flex:1 1 auto;min-inline-size:0;min-block-size:0;overflow:hidden}:host( [ hidden ] ){display:none}.layout{display:grid;flex:1;min-inline-size:0;min-block-size:0;grid-template-columns:minmax( 0,var( --_split-start,35% ) ) auto minmax( 0,1fr );grid-template-rows:minmax( 0,1fr )}.pane{display:flex;flex-direction:column;min-inline-size:0;min-block-size:0;overflow:auto}::slotted( * ){flex:1 1 auto;min-inline-size:0;min-block-size:0}.divider{inline-size:0;outline:none}.divider.enabled{position:relative;inline-size:8px;cursor:col-resize;touch-action:none;user-select:none}.divider.enabled::before,.divider.enabled::after{content:'';position:absolute;inset-inline:0;margin-inline:auto;inset-block-start:50%;transform:translateY( -50% );pointer-events:none;transition:background-color 120ms ease}.divider.enabled::before{inline-size:1px;block-size:100%;background:var( --os-ui-border,#dcdcde );opacity:0.65}.divider.enabled::after{inline-size:3px;block-size:28px;border-radius:999px;background:var( --os-ui-fg-faint,#787c82 )}.divider.enabled:hover::after,.divider.dragging::after,.divider:focus-visible::after{background:var( --os-ui-accent,#2271b1 )}.divider:focus-visible{outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:-2px;border-radius:4px}:host( [ direction='vertical' ] ) .layout{grid-template-columns:minmax( 0,1fr );grid-template-rows:minmax( 0,var( --_split-start,35% ) ) auto minmax( 0,1fr )}:host( [ direction='vertical' ] ) .divider.enabled{inline-size:auto;block-size:8px;cursor:row-resize}:host( [ direction='vertical' ] ) .divider.enabled::before{inline-size:100%;block-size:1px}:host( [ direction='vertical' ] ) .divider.enabled::after{inline-size:28px;block-size:3px}:host .layout.compact{grid-template-columns:minmax( 0,1fr );grid-template-rows:minmax( 0,1fr ) minmax( 0,1fr )}.layout.compact .divider{display:none}:host .layout.compact.start,:host .layout.compact.end{grid-template-rows:minmax( 0,1fr )}.layout.compact.start .end,.layout.compact.end .start{display:none}.shield{position:fixed;inset:0;z-index:2147483647;cursor:col-resize}:host( [ direction='vertical' ] ) .shield{cursor:row-resize}.shield[hidden]{display:none}@media ( prefers-reduced-motion:reduce ){.divider.enabled::before,.divider.enabled::after{transition:none}}`,Ze=class Ze extends m{constructor(){super(...arguments),this.observer=null,this.width=0,this.height=0,this.drag=null,this.onDown=e=>{if(!this.enabled()||e.button!==0||this.drag||this.extent()<=0)return;e.preventDefault();const t=e.currentTarget;t.focus(),this.drag={id:e.pointerId,origin:this.coordinate(e),last:this.coordinate(e),position:this.positionValue(),initial:this.positionValue(),target:t},t.setPointerCapture(e.pointerId),this.requestUpdate()},this.onMove=e=>{this.drag?.id===e.pointerId&&(this.drag.last=this.coordinate(e),this.setPosition(this.drag.position+(this.coordinate(e)-this.drag.origin)*this.sign()/Math.max(1,this.extent())*100))},this.cancelDrag=()=>this.finishDrag(!1),this.onCancel=e=>{this.drag?.id===e.pointerId&&this.cancelDrag()},this.onLostCapture=e=>{this.drag?.id===e.pointerId&&this.finishDrag(!0)},this.onUp=e=>{this.drag?.id===e.pointerId&&(this.onMove(e),this.finishDrag(!0))},this.onKey=e=>{if(!this.enabled())return;if(e.key==="Escape"&&this.drag){e.preventDefault(),this.cancelDrag();return}const[t,s]=this.bounds(),o=this.positionValue(),i=e.shiftKey?10:2,n=this.isVertical()?"ArrowDown":"ArrowRight",a=this.isVertical()?"ArrowUp":"ArrowLeft";let l=o;if(e.key==="Home")l=t;else if(e.key==="End")l=s;else if(e.key===n||e.key===a)l+=i*this.sign()*(e.key===n?1:-1);else return;e.preventDefault(),this.setPosition(l),o!==this.positionValue()&&this.emit("os-split-change",{position:this.positionValue()})}}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(this.observer=new ResizeObserver(e=>{const{width:t,height:s}=e[0].contentRect;if(t===this.width&&s===this.height)return;const o=this.positionValue();this.width=t,this.height=s,this.isCompact()?this.cancelDrag():this.drag&&(this.setPosition(o),this.drag.origin=this.drag.last,this.drag.position=this.positionValue()),this.requestUpdate()}),this.observer.observe(this))}disconnectedCallback(){this.observer?.disconnect(),this.observer=null,this.cancelDrag()}attributeChangedCallback(e,t,s){t!==s&&e==="direction"&&this.cancelDrag(),super.attributeChangedCallback(e,t,s)}number(e,t){const s=this.getAttribute(e),o=s===null||s.trim()===""?NaN:Number(s);return Number.isFinite(o)&&o>=0?o:t}isVertical(){return this.getAttribute("direction")==="vertical"}isCompact(){const e=this.number("collapse-at",600);return this.hasAttribute("compact")||!this.isVertical()&&e>0&&this.width>0&&this.width<=e}extent(){return Math.max(0,(this.isVertical()?this.height:this.width)-(this.hasAttribute("resizable")?8:0))}bounds(){const e=this.extent();if(e<=0)return[0,100];const t=this.number("min-start",160),s=this.number("min-end",160),o=t+s,i=o>e?e/o:1;return[t*i/e*100,100-s*i/e*100]}positionValue(){const[e,t]=this.bounds();return Math.min(t,Math.max(e,this.number("position",35)))}enabled(){return this.hasAttribute("resizable")&&!this.isCompact()}setPosition(e){const[t,s]=this.bounds();this.setAttribute("position",String(Math.min(s,Math.max(t,e))))}coordinate(e){return this.isVertical()?e.clientY:e.clientX}sign(){return!this.isVertical()&&getComputedStyle(this).direction==="rtl"?-1:1}finishDrag(e){const t=this.drag;t&&(this.drag=null,e||this.setPosition(t.initial),t.target.hasPointerCapture(t.id)&&t.target.releasePointerCapture(t.id),this.requestUpdate(),e&&this.positionValue()!==t.initial&&this.emit("os-split-change",{position:this.positionValue()}))}recoverFocus(e){const t=e==="end"?"start":"end",o=this.getRootNode().activeElement,i=e!=="stack"&&Array.from(this.children).some(a=>a.slot===t&&a.contains(o)),n=this.shadowRoot?.activeElement?.classList.contains("divider");!i&&!n||queueMicrotask(()=>{this.isConnected&&this.shadowRoot?.querySelector(e==="end"?".pane.end":".pane.start")?.focus()})}render(){!this.enabled()&&this.drag&&this.cancelDrag();const e=this.enabled(),t=this.positionValue(),[s,o]=this.bounds(),i=this.getAttribute("narrow"),n=i==="start"||i==="end"?i:"stack";return this.style.setProperty("--_split-start",`calc((100% - ${this.hasAttribute("resizable")?8:0}px) * ${t/100})`),this.isCompact()&&this.recoverFocus(n),d`<div class="layout ${this.isCompact()?"compact "+n:""}"> |
| 781 |
<div class="pane start" part="start" id="start" tabindex="-1"><slot name="start"></slot></div> |
| 782 |
<div class="divider ${e?"enabled":""} ${this.drag?"dragging":""}" part="divider" |
| 783 |
role=${e?"separator":"presentation"} aria-hidden=${e?"false":"true"} tabindex=${e?"0":"-1"} |
| 784 |
aria-label=${this.getAttribute("label")||k("Resize panes")} |
| 785 |
aria-controls="start" aria-orientation=${this.isVertical()?"horizontal":"vertical"} |
| 786 |
aria-valuemin=${String(s)} aria-valuemax=${String(o)} aria-valuenow=${String(t)} |
| 787 |
@pointerdown=${this.onDown} @pointermove=${this.onMove} @pointerup=${this.onUp} |
| 788 |
@pointercancel=${this.onCancel} @lostpointercapture=${this.onLostCapture} @keydown=${this.onKey}></div> |
| 789 |
<div class="pane end" part="end" tabindex="-1"><slot name="end"></slot></div> |
| 790 |
</div><div class="shield" ?hidden=${!this.drag} aria-hidden="true"></div>`}};Ze.props=["position","min-start","min-end","resizable","direction","collapse-at","narrow","compact","label"],Ze.styles=[ra],Ze.help=void 0;let Vs=Ze;v("os-split",Vs);const na=b`:host{display:grid;min-inline-size:0;min-block-size:0;grid-template-columns:var( --os-ui-grid-columns,1fr );grid-template-rows:var( --os-ui-grid-rows,auto );gap:var( --os-ui-grid-gap,8px );column-gap:var( --os-ui-grid-column-gap,var( --os-ui-grid-gap,8px ) );row-gap:var( --os-ui-grid-row-gap,var( --os-ui-grid-gap,8px ) )}:host( [ hidden ] ){display:none}::slotted( * ){min-inline-size:0}::slotted( [ col-span='1' ] ){grid-column:span min( 1,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='1' ] ){grid-row:span 1}::slotted( [ col-span='2' ] ){grid-column:span min( 2,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='2' ] ){grid-row:span 2}::slotted( [ col-span='3' ] ){grid-column:span min( 3,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='3' ] ){grid-row:span 3}::slotted( [ col-span='4' ] ){grid-column:span min( 4,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='4' ] ){grid-row:span 4}::slotted( [ col-span='5' ] ){grid-column:span min( 5,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='5' ] ){grid-row:span 5}::slotted( [ col-span='6' ] ){grid-column:span min( 6,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='6' ] ){grid-row:span 6}::slotted( [ col-span='7' ] ){grid-column:span min( 7,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='7' ] ){grid-row:span 7}::slotted( [ col-span='8' ] ){grid-column:span min( 8,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='8' ] ){grid-row:span 8}::slotted( [ col-span='9' ] ){grid-column:span min( 9,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='9' ] ){grid-row:span 9}::slotted( [ col-span='10' ] ){grid-column:span min( 10,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='10' ] ){grid-row:span 10}::slotted( [ col-span='11' ] ){grid-column:span min( 11,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='11' ] ){grid-row:span 11}::slotted( [ col-span='12' ] ){grid-column:span min( 12,var( --_os-grid-tracks,1 ) )}::slotted( [ row-span='12' ] ){grid-row:span 12}:host( [ data-single-column ] ){grid-template-rows:none}:host( [ data-single-column ] )::slotted( [ row-span ] ){grid-row:auto}`,Ye=class Ye extends m{constructor(){super(...arguments),this.observer=null,this.availableWidth=0,this.overrides=new Map}overrideToken(e,t){if(t!==null)this.overrides.has(e)||this.overrides.set(e,{value:this.style.getPropertyValue(e),priority:this.style.getPropertyPriority(e)}),this.style.setProperty(e,t);else{const s=this.overrides.get(e);s&&(s.value?this.style.setProperty(e,s.value,s.priority):this.style.removeProperty(e),this.overrides.delete(e))}}connectedCallback(){super.connectedCallback(),!(typeof ResizeObserver>"u")&&(this.observer=new ResizeObserver(e=>{this.availableWidth=e[0].contentRect.width,this.updateTracks()}),this.observer.observe(this))}disconnectedCallback(){this.observer?.disconnect(),this.observer=null}updateTracks(){const e=Number(this.getAttribute("min-item-width")),t=Number.isFinite(e)&&e>0,s=parseFloat(getComputedStyle(this).columnGap)||0,o=Number(this.getAttribute("columns")),i=Number.isSafeInteger(o)&&o>0?o:1,n=t?Math.max(1,Math.floor((this.availableWidth+s)/(e+s))):i;this.style.setProperty("--_os-grid-tracks",String(n)),this.toggleAttribute("data-single-column",t&&n===1),t||Number.isSafeInteger(o)&&o>0?this.overrideToken("--os-ui-grid-columns",`repeat(${n}, minmax(0, 1fr))`):this.overrideToken("--os-ui-grid-columns",null)}render(){const e=this.getAttribute("rows");e&&/^[1-9]\d*$/.test(e)?this.overrideToken("--os-ui-grid-rows",`repeat(${e}, minmax(0, 1fr))`):this.overrideToken("--os-ui-grid-rows",null);for(const t of["gap","column-gap","row-gap"]){const s=this.getAttribute(t);s!==null&&/^\d+$/.test(s)?this.overrideToken(`--os-ui-grid-${t}`,`${s}px`):this.overrideToken(`--os-ui-grid-${t}`,null)}return this.updateTracks(),d`<slot></slot>`}};Ye.props=["columns","rows","gap","column-gap","row-gap","min-item-width"],Ye.styles=[na],Ye.help=void 0;let js=Ye;v("os-grid",js);const aa=b`:host{display:flex;align-items:center;justify-content:var( --os-ui-display-align,flex-end );width:100%;min-height:calc( var( --os-ui-display-size,28px ) * 1.4 );padding:8px 14px;box-sizing:border-box;font-size:var( --os-ui-display-size,28px );font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:0.01em;color:var( --os-ui-display-fg,var( --os-ui-fg,#1d2327 ) );background:var( --os-ui-display-bg,transparent );border-radius:var( --os-ui-display-border-radius,0 );line-height:1.1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host( [ hidden ] ){display:none}.os-display__output{display:block;font:inherit;color:inherit;text-align:var( --os-ui-display-align,end );overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}`,di={sm:"16px",md:"20px",lg:"28px",xl:"40px"},Qe=class Qe extends m{connectedCallback(){super.connectedCallback?.(),this.hasAttribute("aria-live")||this.setAttribute("aria-live","polite"),this.hasAttribute("role")||this.setAttribute("role","status")}render(){const e=this.value,t=this.size||"lg",s=this.align||"end";return this.style.setProperty("--os-ui-display-size",di[t]||di.lg),this.style.setProperty("--os-ui-display-align",s),d` |
| 791 |
<output part="output" class="os-display__output"> |
| 792 |
${e??d`<slot></slot>`} |
| 793 |
</output> |
| 794 |
`}};Qe.props=["value","size","align"],Qe.styles=[aa],Qe.help=void 0;let Bs=Qe;v("os-display",Bs);const la=b`:host{display:block}:host( [ hidden ] ){display:none}.os-disclosure__summary{display:flex;align-items:center;gap:8px;width:100%;padding:0;background:none;border:0;font:inherit;color:var( --os-ui-fg,#1d2327 );text-align:start;cursor:pointer}.os-disclosure__summary:focus-visible{outline:2px solid var( --os-ui-accent,#f252fc );outline-offset:2px;border-radius:4px}.os-disclosure__heading{flex:1 1 auto;min-width:0;margin:0;font-size:20px;font-weight:500;letter-spacing:-0.01em}.os-disclosure__hint{flex:0 0 auto;font-size:13px;font-weight:400;color:var( --os-ui-fg-muted,#646970 )}.os-disclosure__marker{flex:0 0 auto;width:8px;height:8px;margin-inline-end:2px;border-inline-end:2px solid currentColor;border-block-end:2px solid currentColor;transform:rotate( -45deg );transition:transform 160ms ease;opacity:0.7}:host( [ open ] ) .os-disclosure__marker{transform:rotate( 45deg )}@media ( prefers-reduced-motion:reduce ){.os-disclosure__marker{transition:none}}.os-disclosure__body{margin-block-start:14px}.os-disclosure__body[ hidden ]{display:none}`;let ca=0;const Je=class Je extends m{constructor(){super(...arguments),this.bodyId=`os-disclosure-body-${++ca}`,this.onToggle=()=>{const e=!this.isOpen();e?this.setAttribute("open",""):this.removeAttribute("open"),this.emit("os-disclosure-toggle",{open:e})}}isOpen(){return this.hasAttribute("open")}render(){const e=this.heading||"",t=this.hint||"",s=this.isOpen();return d` |
| 795 |
<button |
| 796 |
type="button" |
| 797 |
class="os-disclosure__summary" |
| 798 |
part="summary" |
| 799 |
aria-expanded=${s?"true":"false"} |
| 800 |
aria-controls=${this.bodyId} |
| 801 |
@click=${this.onToggle} |
| 802 |
> |
| 803 |
<span class="os-disclosure__marker" aria-hidden="true"></span> |
| 804 |
<h3 part="heading" class="os-disclosure__heading">${e}</h3> |
| 805 |
${t?d`<span class="os-disclosure__hint">${t}</span>`:""} |
| 806 |
</button> |
| 807 |
<div |
| 808 |
id=${this.bodyId} |
| 809 |
class="os-disclosure__body" |
| 810 |
part="body" |
| 811 |
?hidden=${!s} |
| 812 |
> |
| 813 |
<slot></slot> |
| 814 |
</div> |
| 815 |
`}};Je.props=["heading","hint","open"],Je.styles=[la],Je.help=void 0;let Ws=Je;v("os-disclosure",Ws);const da=b`:host{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:32px 24px;text-align:center;color:var( --os-ui-empty-state-fg,var( --os-ui-fg-muted,#646970 ) )}:host( [ hidden ] ){display:none}.os-empty-state__icon{margin-bottom:4px;color:var( --os-ui-empty-state-icon-color,currentColor );opacity:0.75}.os-empty-state__heading{margin:0;font-size:14px;font-weight:600;color:var( --os-ui-fg,#1d2327 )}.os-empty-state__description{margin:0;font-size:12px;line-height:1.4;max-width:48ch}.os-empty-state__description:empty{display:none}.os-empty-state__cta{margin-top:8px}.os-empty-state__cta:empty{display:none}`,Oe=class Oe extends m{render(){const e=this.icon||"",t=this.heading||"",s=this.description||"";return d` |
| 816 |
${e?d`<os-icon |
| 817 |
class="os-empty-state__icon" |
| 818 |
name=${e} |
| 819 |
size="28" |
| 820 |
></os-icon>`:null} |
| 821 |
<h3 class="os-empty-state__heading">${t}</h3> |
| 822 |
<p class="os-empty-state__description">${s}</p> |
| 823 |
<div class="os-empty-state__cta"> |
| 824 |
<slot name="cta"></slot> |
| 825 |
</div> |
| 826 |
<slot></slot> |
| 827 |
`}};Oe.props=["icon","heading","description"],Oe.styles=[da],Oe.help=void 0;let Xs=Oe;v("os-empty-state",Xs);const ua=b` ${$} ${Pt} ${Tt} ${Jt}:host{display:inline-flex;user-select:none}:host( [ fill-cell ] ),:host{display:flex;width:100%}:host( [ hidden ] ){display:none}button{width:100%;min-height:var( --os-ui-key-min-height,48px );appearance:none;display:inline-flex;align-items:center;justify-content:center;padding:var( --os-ui-key-padding,8px 12px );font:inherit;font-size:var( --os-ui-key-font-size,16px );font-weight:500;cursor:pointer;border-radius:var( --os-ui-key-border-radius,8px );background:var( --os-ui-key-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );color:var( --os-ui-key-fg,var( --os-ui-fg,#1d2327 ) );border:var( --os-ui-key-border,1px solid transparent );transition:transform 0.08s ease,background-color 0.12s ease,box-shadow 0.12s ease}button:hover:not(:disabled ){background:var( --os-ui-key-bg-hover,var( --os-ui-hover,rgba( 0,0,0,0.1 ) ) )}button:focus-visible{outline:none;box-shadow:var( --_holo-focus )}button:disabled::before{opacity:0 !important}:host( [ variant='primary' ] ) button{background:var( --os-ui-key-bg,var( --wp-admin-theme-color,#2271b1 ) );color:var( --os-ui-key-fg,var( --os-ui-fg-on-accent,#fff ) )}:host( [ variant='primary' ] ) button:hover:not(:disabled ){filter:brightness( 1.06 )}:host( [ variant='secondary' ] ) button{background:var( --os-ui-key-bg,var( --os-ui-hover,rgba( 0,0,0,0.04 ) ) )}:host( [ variant='ghost' ] ) button{background:transparent;border:var( --os-ui-key-border,1px solid var( --os-ui-border,#c3c4c7 ) )}:host( [ variant='danger' ] ) button{background:transparent;color:var( --os-ui-danger,#d63638 );border:1px solid currentColor}:host( .os-key--pressed ) button,button:active:not(:disabled ){transform:scale( 0.96 );box-shadow:inset 0 1px 2px rgba( 0,0,0,0.22 );background:var( --os-ui-key-bg-pressed,var( --os-ui-hover,rgba( 0,0,0,0.14 ) ) )}button:disabled{opacity:0.5;cursor:not-allowed}`,Nt="os-key--pressed",et=class et extends m{constructor(){super(...arguments),this._onKeyDown=null,this._onKeyUp=null,this._keyHeldByKeyboard=!1}connectedCallback(){super.connectedCallback?.(),this._onKeyDown=e=>this.handleKeyboardDown(e),this._onKeyUp=e=>this.handleKeyboardUp(e),document.addEventListener("keydown",this._onKeyDown),document.addEventListener("keyup",this._onKeyUp)}disconnectedCallback(){this._onKeyDown&&document.removeEventListener("keydown",this._onKeyDown),this._onKeyUp&&document.removeEventListener("keyup",this._onKeyUp)}render(){const e=this.label,t=this.disabled!==null;return d` |
| 828 |
<button |
| 829 |
part="button" |
| 830 |
class="os-holo-sheen" |
| 831 |
type="button" |
| 832 |
?disabled=${t} |
| 833 |
@click=${s=>this.handleClick(s)} |
| 834 |
> |
| 835 |
${e!=null&&e!==""?e:d`<slot></slot>`} |
| 836 |
<span class="os-holo-glint" aria-hidden="true"></span> |
| 837 |
<span class="os-holo-ring" aria-hidden="true"></span> |
| 838 |
</button> |
| 839 |
`}handleClick(e){if(this.isDisabled())return;const t=this.buildDetail("click");this.flashPressed(),this.hasAttribute("hold")?(this.emitKey("os-key-down",t),this.emitKey("os-key-up",t)):this.emitKey("os-key",t),e.stopPropagation()}handleKeyboardDown(e){if(this.isDisabled()||!this.matchesEvent(e)||this._keyHeldByKeyboard)return;this._keyHeldByKeyboard=!0,this.classList.add(Nt);const t=this.buildDetail("keyboard");this.hasAttribute("hold")?this.emitKey("os-key-down",t):this.emitKey("os-key",t)}handleKeyboardUp(e){!this._keyHeldByKeyboard||!this.matchesEvent(e,!0)||(this._keyHeldByKeyboard=!1,this.classList.remove(Nt),this.hasAttribute("hold")&&this.emitKey("os-key-up",this.buildDetail("keyboard")))}matchesEvent(e,t=!1){const s=this.code||"",o=this.key||"";if(s){if(e.code!==s)return!1}else if(o){if(e.key!==o)return!1}else return!1;const i=this.modifier||"",n=new Set(i.split("+").map(h=>h.trim().toLowerCase()).filter(Boolean)),a=n.has("ctrl")||n.has("control"),l=n.has("alt"),c=n.has("shift"),u=n.has("meta")||n.has("cmd")||n.has("command");return e.ctrlKey===a&&e.altKey===l&&e.shiftKey===c&&e.metaKey===u}buildDetail(e){const t=this.label||this.textContent?.trim()||"";return{key:this.key||"",code:this.code||"",label:t,source:e}}isDisabled(){return this.disabled!==null}emitKey(e,t){this.dispatchEvent(new CustomEvent(e,{detail:t,bubbles:!0,composed:!0}))}flashPressed(){this.classList.add(Nt),window.setTimeout(()=>{this.classList.remove(Nt)},120)}};et.props=["key","code","label","variant","fill-cell","hold","modifier","disabled"],et.styles=[ua],et.help=void 0;let Gs=et;v("os-key",Gs);const ha=b`:host{display:inline}:host( [ hidden ] ){display:none}code{font-family:var( --os-ui-code-font-family,ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace );font-size:var( --os-ui-code-font-size,0.92em );padding:var( --os-ui-code-padding,0.1em 0.4em );border-radius:var( --os-ui-code-border-radius,4px );background:var( --os-ui-code-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );color:var( --os-ui-code-fg,var( --os-ui-fg,#1d2327 ) );border:var( --os-ui-code-border,1px solid rgba( 0,0,0,0.08 ) );white-space:var( --os-ui-code-white-space,nowrap );overflow-wrap:anywhere}:host( [ block ] ){display:block}:host( [ block ] ) code{display:block;padding:var( --os-ui-code-block-padding,10px 12px );white-space:pre;max-block-size:var( --os-ui-code-block-max-block-size,none );overflow:auto}:host( [ wrap ] ) code{white-space:pre-wrap;overflow-wrap:anywhere}:host( [ copy ] ){position:relative}:host( [ copy ] ):not( [ block ] ){display:inline-flex;align-items:center;gap:var( --os-ui-code-copy-gap,8px )}.copy{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex:none;inline-size:var( --os-ui-code-copy-size,24px );block-size:var( --os-ui-code-copy-size,24px );background:transparent;border:0;border-radius:4px;padding:0;margin:0;font:inherit;cursor:pointer;color:var( --os-ui-code-copy-color,var( --os-ui-fg-muted,#57606a ) );opacity:var( --os-ui-code-copy-opacity,0.6 );transition:opacity 120ms ease,color 120ms ease,background-color 120ms ease;line-height:1;font-size:1.05em}.copy:hover,.copy:focus-visible{opacity:1;color:var( --os-ui-code-copy-color-hover,var( --wp-admin-theme-color,#007cba ) );background:var( --os-ui-code-copy-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) )}:host( [ block ] ) .copy{position:absolute;top:6px;inset-inline-end:6px;background:var( --os-ui-code-copy-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );opacity:var( --os-ui-code-copy-opacity,0.6 )}:host( [ block ] ):hover .copy,:host( [ block ] ):focus-within .copy{opacity:1}:host( [ block ][ copy ] ) code{padding-inline-end:var( --os-ui-code-copy-inset,42px )}`,tt=class tt extends m{constructor(){super(...arguments),this._copied=!1,this._resetTimer=null,this._onCopy=e=>{e.stopPropagation();const t=this._readSlotText();if(t==="")return;const s=i=>{i&&(this._copied=!0,this.requestUpdate(),this.emit("os-copy",{text:t}),this._resetTimer&&clearTimeout(this._resetTimer),this._resetTimer=setTimeout(()=>{this._copied=!1,this._resetTimer=null,this.requestUpdate()},1500))},o=navigator.clipboard;o&&typeof o.writeText=="function"?o.writeText(t).then(()=>s(!0),()=>s(this._fallbackCopy(t))):s(this._fallbackCopy(t))}}_readSlotText(){const e=this.shadowRoot?.querySelector("slot");return e?e.assignedNodes({flatten:!0}).map(o=>o.textContent??"").join("").trim():(this.textContent||"").trim()}_fallbackCopy(e){try{const t=document.createElement("textarea");t.value=e,t.setAttribute("readonly",""),t.style.position="absolute",t.style.left="-9999px",document.body.appendChild(t),t.select();const s=document.execCommand("copy");return document.body.removeChild(t),s}catch{return!1}}render(){const e=this.getAttribute("copy")!==null;return d`<code><slot></slot></code>${e?d`<button |
| 840 |
type="button" |
| 841 |
class="copy" |
| 842 |
part="copy" |
| 843 |
aria-label="${this._copied?"Copied":"Copy code to clipboard"}" |
| 844 |
title="${this._copied?"Copied":"Copy to clipboard"}" |
| 845 |
@click=${this._onCopy} |
| 846 |
> |
| 847 |
${this._copied?"✓":"⧉"} |
| 848 |
</button>`:""}`}};tt.props=["block","copy","wrap"],tt.styles=[ha],tt.help=void 0;let Zs=tt;v("os-code",Zs);const pa=b` ${$}:host{display:inline-flex;align-items:center;gap:var( --os-ui-badge-gap,6px );padding:var( --os-ui-badge-padding,2px 8px );font:var( --os-ui-badge-font,500 12px/1.4 var( --os-font,system-ui ) );color:var( --os-ui-badge-color,var( --os-ui-fg,#1d2327 ) );background:var( --os-ui-badge-bg,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) );border:var( --os-ui-badge-border,1px solid transparent );border-radius:var( --os-ui-badge-border-radius,999px );white-space:nowrap;vertical-align:baseline}:host( [ hidden ] ){display:none}.dot{width:var( --os-ui-badge-dot-size,8px );height:var( --os-ui-badge-dot-size,8px );border-radius:50%;background:currentColor;flex:0 0 auto}:host( [ tone="success" ] ){--os-ui-badge-color:var( --os-ui-badge-success,var( --os-ui-success-fg,#1a7f37 ) );--os-ui-badge-bg:var( --os-ui-badge-success-bg,rgba( 26,127,55,0.12 ) )}:host( [ tone="warning" ] ){--os-ui-badge-color:var( --os-ui-badge-warning,var( --os-ui-warning-fg,#9a6700 ) );--os-ui-badge-bg:var( --os-ui-badge-warning-bg,rgba( 154,103,0,0.12 ) )}:host( [ tone="danger" ] ){--os-ui-badge-color:var( --os-ui-badge-danger,var( --os-ui-danger,#cf222e ) );--os-ui-badge-bg:var( --os-ui-badge-danger-bg,rgba( 207,34,46,0.12 ) )}:host( [ tone="info" ] ){--os-ui-badge-color:var( --os-ui-badge-info,var( --os-ui-info-fg,#0969da ) );--os-ui-badge-bg:var( --os-ui-badge-info-bg,rgba( 9,105,218,0.12 ) )}:host( [ tone="neutral" ] ){--os-ui-badge-color:var( --os-ui-badge-neutral,var( --os-ui-fg-muted,#57606a ) );--os-ui-badge-bg:var( --os-ui-badge-neutral-bg,rgba( 87,96,106,0.12 ) )}:host( [ tone="accent" ] ){--os-ui-badge-color:var( --os-ui-badge-accent,var( --_holo-ink ) );background-color:transparent;background-image:var( --os-ui-badge-accent-bg,var( --_holo-fill ) );background-size:220% 220%;background-position:22% 28%;background-repeat:no-repeat;box-shadow:var( --_holo-glow );font-weight:600}:host( [ tone="accent" ] ) .dot{display:none}:host( [ no-dot ] ) .dot{display:none}`,st=class st extends m{render(){return d`<span class="dot" aria-hidden="true"></span><slot></slot>`}};st.props=["tone","noDot"],st.styles=[pa],st.help=void 0;let Ys=st;v("os-badge",Ys);const ga=b`:host{position:absolute;width:var( --os-ui-ribbon-size,90px );height:var( --os-ui-ribbon-size,90px );overflow:hidden;pointer-events:none;z-index:var( --os-ui-ribbon-z,2 )}:host( [ hidden ] ){display:none}.banner{position:absolute;display:block;width:var( --os-ui-ribbon-banner-width,140px );padding:var( --os-ui-ribbon-padding,4px 0 );text-align:center;font:var( --os-ui-ribbon-font,700 10px/1.4 var( --os-font,system-ui ) );letter-spacing:var( --os-ui-ribbon-tracking,0.06em );text-transform:uppercase;color:var( --os-ui-ribbon-fg,var( --os-ui-fg-on-accent,#fff ) );background:var( --os-ui-ribbon-bg,var( --wp-admin-theme-color,#2271b1 ) );background-size:260% 260%;background-position:30% 40%;box-shadow:var( --os-ui-ribbon-shadow,0 2px 4px rgba( 0,0,0,0.2 ) )}:host(:not( [ placement ] ) ),:host( [ placement='top-end' ] ){inset-block-start:0;inset-inline-end:0}:host(:not( [ placement ] ) ) .banner,:host( [ placement='top-end' ] ) .banner{inset-block-start:var( --os-ui-ribbon-banner-offset,20px );inset-inline-end:var( --os-ui-ribbon-banner-pull,-36px );transform:rotate( 45deg )}:host( [ placement='top-start' ] ){inset-block-start:0;inset-inline-start:0}:host( [ placement='top-start' ] ) .banner{inset-block-start:var( --os-ui-ribbon-banner-offset,20px );inset-inline-start:var( --os-ui-ribbon-banner-pull,-36px );transform:rotate( -45deg )}:host( [ placement='bottom-end' ] ){inset-block-end:0;inset-inline-end:0}:host( [ placement='bottom-end' ] ) .banner{inset-block-end:var( --os-ui-ribbon-banner-offset,20px );inset-inline-end:var( --os-ui-ribbon-banner-pull,-36px );transform:rotate( -45deg )}:host( [ placement='bottom-start' ] ){inset-block-end:0;inset-inline-start:0}:host( [ placement='bottom-start' ] ) .banner{inset-block-end:var( --os-ui-ribbon-banner-offset,20px );inset-inline-start:var( --os-ui-ribbon-banner-pull,-36px );transform:rotate( 45deg )}:host-context( [ dir='rtl' ] ):host(:not( [ placement ] ) ) .banner,:host-context( [ dir='rtl' ] ):host( [ placement='top-end' ] ) .banner{transform:rotate( -45deg )}:host-context( [ dir='rtl' ] ):host( [ placement='top-start' ] ) .banner{transform:rotate( 45deg )}:host-context( [ dir='rtl' ] ):host( [ placement='bottom-end' ] ) .banner{transform:rotate( 45deg )}:host-context( [ dir='rtl' ] ):host( [ placement='bottom-start' ] ) .banner{transform:rotate( -45deg )}:host( [ tone='success' ] ) .banner{background:var( --os-ui-ribbon-success,var( --os-ui-success-fg,#1a7f37 ) )}:host( [ tone='warning' ] ) .banner{background:var( --os-ui-ribbon-warning,var( --os-ui-warning-bg,#9a6700 ) )}:host( [ tone='danger' ] ) .banner{background:var( --os-ui-ribbon-danger,var( --os-ui-danger,#cf222e ) )}:host( [ tone='info' ] ) .banner{background:var( --os-ui-ribbon-info,var( --os-ui-info-bg,#0969da ) )}:host( [ tone='neutral' ] ) .banner{background:var( --os-ui-ribbon-neutral,var( --os-ui-surface,#57606a ) )}`,ot=class ot extends m{render(){return d`<span class="banner" part="banner"><slot></slot></span>`}};ot.props=["placement","tone"],ot.styles=[ga],ot.help=void 0;let Qs=ot;v("os-ribbon",Qs);function ui(r){if(!r)return 214;let e=5381;for(let t=0;t<r.length;t++)e=Math.imul(e,33)+r.charCodeAt(t);return(e%360+360)%360}function hi(){const r=window.wp?.hooks;if(!r)throw new Error("[openstation] `window.wp.hooks` is not available. The plugin declares `wp-hooks` as a script dependency; if you are seeing this error, verify the enqueue order.");return r}function pi(r,e,...t){return hi().applyFilters(r,e,...t)}function ba(r,...e){hi().doAction(r,...e)}const gi={DESKTOP_THEME_ICON:"os.os-theme.icon",DESKTOP_THEME_ICON_COLOR:"os.os-theme.icon-color"},bi="__openStationSharedStores";function fa(){const r=window;let e=r[bi];return e||(e=new Map,r[bi]=e),e}function Js(r,e){const t=fa();let s=t.get(r);s||(s={state:e(),listeners:new Set,rebuild:e},t.set(r,s));const o={get state(){return s.state},set state(i){s.state=i},getState(){return s.state},notify(){for(const i of Array.from(s.listeners))try{i(s.state)}catch(n){console.error(`[desktop-mode/shared-store:${r}] subscriber threw:`,n)}},subscribe(i){return s.listeners.add(i),()=>{s.listeners.delete(i)}},setState(i){const n=s.state;if(typeof n!="object"||n===null){console.warn(`[desktop-mode/shared-store:${r}] setState called on a primitive store; use the state setter instead.`);return}Object.assign(n,i),o.notify()},reset(){const i=s.rebuild(),n=s.state;if(typeof n=="object"&&n!==null&&typeof i=="object"&&i!==null){const a=n;for(const l of Object.keys(a))delete a[l];Object.assign(a,i)}else s.state=i;s.listeners.clear()}};return o}const fi=Js("desktop-mode/dock-rail-registry",()=>({registry:new Map,listeners:new Set,activeId:"default"}));fi.state.registry,fi.state.listeners;class ma extends Error{constructor(e,t,s){super(`[openstation] ${e} registration rejected — fields: `+t.join(", ")+"."),this.name="RegistrationError",this.kind=e,this.errors=t,this.def=s}}function va(r,e,t){if(e.length!==0)throw new ma(r,e,t)}const W=[[0,0],[100,0],[100,100],[0,100]],_a=48,xa=80,Os=6,eo=8,mi=4,vi=3,_i=64,to=105,X=2;function xi(r){return`${Math.round(r*1e3)/1e3}%`}function G(r){return r.slice().reverse()}function re(r,e,t,s){return[[r,e],[t,e],[t,s],[r,s]]}function ya(r,e,t,s){const o=[];for(let i=0;i<s;i++){const n=i/s*Math.PI*2;o.push([r+Math.cos(n)*t,e+Math.sin(n)*t])}return o}function H(r,e=[]){const t=[],s=o=>{t.push(`${xi(o[0])} ${xi(o[1])}`)};for(const o of r)s(o);if(e.length>0){s(r[0]);for(const o of e){for(const i of o)s(i);s(o[0]),s(r[0])}}return`polygon( ${t.join(", ")} )`}function yi(r){return H(W,[G(ya(50,50,r,_a))])}function wi(r){return H(W,[G(re(50-r,-X,50+r,100+X))])}function ki(r){const e=100/Os,t=[];for(let s=0;s<Os;s++){const o=s*e;t.push(G(re(-X,o,100+X,o+r)))}return H(W,t)}function $i(r){return H(W,[G(re(-X,50-r,100+X,50+r))])}function Ci(r){const e=100/eo,t=[];for(let s=0;s<eo;s++){const o=s*e;t.push(G(re(o,-X,o+r,100+X)))}return H(W,t)}function Ai(r){return H(W,[G([[50,50-r],[50+r,50],[50,50+r],[50-r,50]])])}function Si(r){const e=100/mi,t=100/vi,s=[];for(let o=0;o<vi;o++)for(let i=0;i<mi;i++){const n=i*e+e/2,a=o*t+t/2,l=e/2*r,c=t/2*r;s.push(G(re(n-l,a-c,n+l,a+c)))}return H(W,s)}function zi(r){const e=-Math.PI/2,t=r/180*Math.PI,s=[[50,50]];for(let o=0;o<_i;o++){const i=e+o/(_i-1)*t;s.push([50+Math.cos(i)*to,50+Math.sin(i)*to])}return H(W,[G(s)])}function wa(){return{from:yi(0),to:yi(xa)}}function ka(){return{from:wi(0),to:wi(52)}}function $a(){return{from:ki(0),to:ki(100/Os+.5)}}function Ca(){return{from:$i(0),to:$i(52)}}function Aa(){return{from:Ci(0),to:Ci(100/eo+.5)}}function Sa(){return{from:Ai(0),to:Ai(to)}}function za(){return{from:Si(0),to:Si(1.04)}}function Ea(){return{from:zi(0),to:zi(360)}}function La(){return{from:"inset( 0% 0% 0% 0% )",to:"inset( 0% 0% 100% 0% )"}}function Ma(){return{from:"inset( 0% 0% 0% 0% )",to:"inset( 0% 0% 0% 100% )"}}function Ra(){return{from:H([[-60,0],[100,0],[100,100],[0,100]]),to:H([[100,0],[260,0],[260,100],[160,100]])}}const so=6,oo=100,J=oo/2,Ht=200,Ei=90,Li=["#5c5c6d","#525261","#484855","#3e3e49","#34343d","#2a2a31"],Ia="#101014",Pa=1.25,O="http://www.w3.org/2000/svg";let Ta=0;function Ft(r){return Math.round(r*1e3)/1e3}function io(r){return r/so*Math.PI*2-Math.PI/2}function Da(r){const t=io(r)+Math.PI/so+Math.PI/2;return{x:Math.cos(t),y:Math.sin(t)}}function qa(r){const e=io(r),t=io(r+1);return[[J,J],[J+Math.cos(e)*Ht,J+Math.sin(e)*Ht],[J+Math.cos(t)*Ht,J+Math.sin(t)*Ht]]}function Mi(r,e){const t=qa(r),s=document.createElementNS(O,"path");return s.setAttribute("d",`M ${t.map(([o,i])=>`${Ft(o)} ${Ft(i)}`).join(" L ")} Z`),e?s.setAttribute("fill","#fff"):(s.setAttribute("fill",Li[r%Li.length]),s.setAttribute("stroke",Ia),s.setAttribute("stroke-width",String(Pa)),s.setAttribute("vector-effect","non-scaling-stroke"),s.setAttribute("stroke-linejoin","round")),s}function Na(){const r=`os-iris-${++Ta}`,e=document.createElementNS(O,"svg");e.setAttribute("viewBox",`0 0 ${oo} ${oo}`),e.setAttribute("preserveAspectRatio","none"),e.setAttribute("aria-hidden","true"),e.style.width="100%",e.style.height="100%",e.style.display="block";const t=document.createElementNS(O,"defs"),s=document.createElementNS(O,"mask");s.setAttribute("id",r);const o=document.createElementNS(O,"g"),i=document.createElementNS(O,"g");i.setAttribute("mask",`url(#${r})`);const n=[];for(let l=0;l<so;l++){const c=Mi(l,!0),u=Mi(l,!1);o.appendChild(c),i.appendChild(u),n.push({el:c,index:l},{el:u,index:l})}s.appendChild(o),t.appendChild(s),e.appendChild(t),e.appendChild(i);const a=document.createElement("div");return a.appendChild(e),{element:a,play:l=>n.map(({el:c,index:u})=>{const h=Da(u),p=Ft(h.x*Ei),f=Ft(h.y*Ei);return c.animate([{transform:"translate( 0px, 0px )"},{transform:`translate( ${p}px, ${f}px )`}],{duration:l.duration,easing:l.easing,delay:l.delay,fill:"both"})})}}const Ha="none",Ri=Js("desktop-mode/window-reveal-registry",()=>({registry:new Map,listeners:new Set})),Fa=Ri.state.registry,Ua=Ri.state.listeners,Ii=/^[a-z0-9_/-]+$/;function Pi(r){const e=/^\s*([a-zA-Z-]+)\s*\(/.exec(r);return e?e[1].toLowerCase():""}function Ti(r,e){const t=[],s=typeof r.from=="string"&&r.from.trim()!=="",o=typeof r.to=="string"&&r.to.trim()!=="";if(s||t.push(`${e}.from (missing — the clip-path covering the window)`),o||t.push(`${e}.to (missing — the clip-path uncovering the window)`),s&&o){const i=Pi(r.from),n=Pi(r.to);i===""||n===""?t.push(`${e}.from|to (must be shape functions, e.g. \`inset( … )\` or \`polygon( … )\` — bare keywords like \`none\` cannot be animated)`):i!==n&&t.push(`${e}.from|to (must use the same shape function to interpolate — got \`${i}()\` and \`${n}()\`)`)}return t}function Ka(r){if(typeof KeyframeEffect!="function")return!0;try{return new KeyframeEffect(null,null,{easing:r}),!0}catch{return!1}}function q(r){const e=[];if(!r||typeof r!="object")e.push("def (not an object)");else{typeof r.id!="string"||r.id.trim()===""?e.push("id (missing)"):Ii.test(r.id.trim().toLowerCase())?r.id.trim().toLowerCase()===Ha&&e.push('id ("none" is reserved)'):e.push(`id (must match ${Ii} — lowercase alphanum, hyphens, underscores, slashes for vendor/sub-id)`),(typeof r.label!="string"||r.label.trim()==="")&&e.push("label (missing)");const s=r.render!==void 0,o=Array.isArray(r.layers),i=r.from!==void 0||r.to!==void 0;s&&typeof r.render!="function"?e.push("render (not a function)"):s&&(o||i)?e.push("render|layers|from|to (supply exactly one of: a from/to pair, a layers array, or a render function)"):s||(o&&i?e.push("layers|from|to (supply EITHER a single from/to pair OR a layers array, not both)"):o?(r.layers.length===0&&e.push("layers (empty — supply at least one matched pair)"),r.layers.forEach((n,a)=>{if(!n||typeof n!="object"){e.push(`layers[ ${a} ] (not an object)`);return}e.push(...Ti(n,`layers[ ${a} ]`))})):e.push(...Ti(r,"").map(n=>n.replace(/^\./,"")))),r.easing!==void 0&&(typeof r.easing!="string"||r.easing.trim()===""?e.push("easing (not a non-empty string)"):Ka(r.easing)||e.push("easing (not an easing the browser can parse — `Element.animate()` would throw at play time, with the covering surface already over the window)"))}va("WindowReveal",e,r);const t=r.id.trim().toLowerCase();Fa.set(t,{...r,id:t}),Va()}function Va(){const r=Array.from(Ua);for(const e of r)try{e()}catch(t){typeof console<"u"&&console.error("[openstation] window-reveal registry listener threw:",t)}}q({id:"sweep",label:k("Sweep"),description:k("A straight edge travels across the window, uncovering the page behind it."),...Ma(),duration:420}),q({id:"iris",label:k("Iris"),description:k("The page opens out from the centre of the window, like a camera shutter."),...wa(),duration:520}),q({id:"curtain",label:k("Curtain"),description:k("Two panels part from the middle of the window and slide off the sides."),...ka(),duration:480}),q({id:"blinds",label:k("Blinds"),description:k("Six horizontal slats retract at once, letting the page through between them."),...$a(),duration:560}),q({id:"diagonal",label:k("Diagonal"),description:k("A slanted edge sweeps off the trailing corner of the window."),...Ra(),duration:460}),q({id:"rise",label:k("Rise"),description:k("The page rises into the window from the bottom edge upward."),...La(),duration:440}),q({id:"shutter",label:k("Shutter"),description:k("Two panels part from the middle of the window and slide off the top and bottom."),...Ca(),duration:480}),q({id:"slats",label:k("Slats"),description:k("Eight vertical slats retract at once, letting the page through between them."),...Aa(),duration:560}),q({id:"diamond",label:k("Diamond"),description:k("The page opens out from the centre of the window through a growing rhombus."),...Sa(),duration:520}),q({id:"mosaic",label:k("Mosaic"),description:k("The page arrives as a grid of tiles, each opening out from its own centre."),...za(),duration:600}),q({id:"obturator",label:k("Camera shutter"),description:k("Six wedges slide aside in unison, opening a hexagonal aperture from the centre like the iris of a camera lens."),render:Na,duration:720,edgeLag:0}),q({id:"radar",label:k("Radar"),description:k("A spoke sweeps a full turn around the centre of the window, uncovering the page behind it."),...Ea(),duration:760});const Di={dockSize:["compact","default","large"],desktopLayout:["classic","unified"],dockPlacement:["bottom","left","right"],windowRadius:["sharp","default","round"],adminBarMode:["static","dynamic","hidden"]},qi=["dockRailRenderer","windowReveal","accent"],Ni={windowRevealDuration:{min:80,max:4e3}},ja=/^[a-z0-9_-]+$/;[...Object.keys(Di),...qi,...Object.keys(Ni)];function Ba(r){if(!r||typeof r!="object"||Array.isArray(r))return{};const e=r,t={},s={};for(const[o,i]of Object.entries(Di)){const n=e[o];typeof n=="string"&&i.includes(n)&&(t[o]=n)}for(const o of qi){const i=e[o];typeof i=="string"&&ja.test(i)&&(t[o]=i)}for(const[o,i]of Object.entries(Ni)){const n=e[o];typeof n=="number"&&Number.isFinite(n)&&(s[o]=Math.min(i.max,Math.max(i.min,Math.round(n))))}return{...t,...s}}const Wa=/^[a-z0-9_-]+$/,Hi=128;function Xa(r){return typeof r!="string"||r===""||r.length>2048?!1:r.startsWith("dashicons-")||r.startsWith("https://")||r.startsWith("http://")||r.startsWith("data:image/")}function Ga(r){if(!r||typeof r!="object")return null;const e=r,t=typeof e.slug=="string"?e.slug:"";if(!Wa.test(t))return null;const s={};if(e.icons&&typeof e.icons=="object"){let l=0;for(const[c,u]of Object.entries(e.icons)){if(l>=Hi)break;c===""||!Xa(u)||(s[c]=u,l+=1)}}const o={};if(e.tokens&&typeof e.tokens=="object")for(const[l,c]of Object.entries(e.tokens))typeof c=="string"&&(o[l]=c);const i=[];if(Array.isArray(e.fonts))for(const l of e.fonts)typeof l=="string"&&l!==""&&i.push(l);const n={};if(e.iconColors&&typeof e.iconColors=="object"){let l=0;for(const[c,u]of Object.entries(e.iconColors)){if(l>=Hi)break;c===""||typeof u!="string"||u===""||(n[c]=u,l+=1)}}const a=l=>typeof e[l]=="string"?e[l]:"";return{id:a("id")||t,slug:t,name:a("name")||t,version:a("version"),author:a("author"),description:a("description"),previewUrl:a("previewUrl"),cssUrl:a("cssUrl"),cssText:a("cssText"),tokens:o,fonts:i,icons:s,iconColors:n,recommendedOsSettings:Ba(e.recommendedOsSettings),installedAt:typeof e.installedAt=="number"?e.installedAt:0,source:e.source==="code"?"code":"upload",cssDeferred:e.cssDeferred===!0}}function Za(){const e=window.openStationConfig?.serverDesktopThemes,t=[];if(Array.isArray(e))for(const s of e){const o=Ga(s);o&&t.push(o)}return{themes:t,activeId:null,activeIcons:null,activeIconColors:null}}const Ya=Js("desktop-mode/desktop-themes",Za);function Fi(){return Ya}function Qa(r){const e=Fi().state;if(e.activeIcons===null||!r)return null;const t=e.activeIcons[r];if(typeof t!="string"||t==="")return null;const s=pi(gi.DESKTOP_THEME_ICON,t,{slot:r,themeId:e.activeId??""});return typeof s=="string"&&s!==""?s:null}function Ja(r){const e=Fi().state;if(e.activeIconColors===null||!r)return null;const t=e.activeIconColors[r];if(typeof t!="string"||t==="")return null;const s=pi(gi.DESKTOP_THEME_ICON_COLOR,t,{slot:r,themeId:e.activeId??""});return typeof s=="string"&&s!==""?Oa(s):null}function Oa(r){const e=r.trim();if(e===""||e.length>64||/[;{}<>"'\\]/.test(e))return null;let t=0;for(const s of e)if(s==="(")t+=1;else if(s===")"&&(t-=1,t<0))return null;return t===0?e:null}function el(r){return typeof r!="string"||r===""||r.length>4096||!/^(https?:\/\/|data:image\/)/i.test(r)?!1:!/['"()\\<>\s]/.test(r)}function Ui(r,e,t){if(!el(e))return!1;const s=`url("${e}") center / contain no-repeat`;return r.style.backgroundImage="none",r.style.backgroundColor=t,r.style.setProperty("-webkit-mask",s),r.style.setProperty("mask",s),!0}const Ki="data:image/svg+xml;base64,",Ut=new Map;function tl(r){const e=Ut.get(r);if(e!==void 0)return e;let t=!1;try{t=atob(r.slice(Ki.length)).includes("currentColor")}catch{}return Ut.size>=256&&Ut.clear(),Ut.set(r,t),t}function sl(r,e){const t=e.className??"",s=e.title??"";let o=null;if(e.slot){const l=Qa(e.slot);l!==null&&(r=l),o=Ja(e.slot)}if(typeof r=="string"&&r.startsWith("dashicons-")){const l=document.createElement("span");return l.className=`dashicons ${r} ${t}`.trim(),l.setAttribute("aria-hidden","true"),o!==null&&(l.style.color=o),l}if(o!==null&&typeof r=="string"){const l=document.createElement("span");if(l.className=t,l.setAttribute("aria-hidden","true"),l.style.display="inline-block",Ui(l,r,o))return l}if(typeof r=="string"&&r.startsWith("data:image/svg+xml;base64,")){const l=r.slice(Ki.length);if(/^[A-Za-z0-9+/=]+$/.test(l)){const c=document.createElement("span");return c.className=t,c.setAttribute("aria-hidden","true"),c.style.display="inline-block",tl(r)&&Ui(c,r,"currentColor")||(c.style.backgroundImage=`url("${r}")`,c.style.backgroundRepeat="no-repeat",c.style.backgroundPosition="center",c.style.backgroundSize="contain"),c}}if(typeof r=="string"&&/^data:image\/(png|jpeg|jpg|gif|webp|x-icon|vnd\.microsoft\.icon);base64,/i.test(r)){const l=r.indexOf(","),c=l>=0?r.slice(l+1):"";if(/^[A-Za-z0-9+/=]+$/.test(c))return Vi(r,t)}if(typeof r=="string"&&(r.startsWith("http://")||r.startsWith("https://")))return Vi(r,t);const i=document.createElement("span");i.className=`${t} os-icon-letter`.trim(),i.setAttribute("aria-hidden","true");const n=ol(s);i.textContent=n;const a=ui(s);return i.style.backgroundColor=`hsl( ${a}, 60%, 45% )`,i.style.color="#fff",i.style.display="inline-flex",i.style.alignItems="center",i.style.justifyContent="center",i.style.fontWeight="600",i.style.borderRadius="4px",i}function Vi(r,e){const t=document.createElement("img");return t.className=e,t.src=r,t.alt="",t.setAttribute("aria-hidden","true"),t.draggable=!1,t}function ol(r){const e=(r??"").trim();if(e==="")return"?";const t=e.split(/\s+/);if(t.length>=2)return(t[0][0]+t[1][0]).toUpperCase();const s=t[0];return s.length>=2?s.slice(0,2).toUpperCase():s.toUpperCase()}function il(r){r.style.setProperty("--os-file-tile-enter-delay",`${(Math.random()*.25).toFixed(3)}s`),r.style.setProperty("--os-file-tile-enter-duration",`${(.3+Math.random()*.25).toFixed(3)}s`)}const rl=b`:host{display:inline-block}`,E="os-file-tile",ji={draft:"Draft",pending:"Pending",private:"Private",future:"Scheduled"};function nl(){const r=window.wp?.os?.getOsSettings;if(typeof r!="function")return!0;try{return r()?.showPostStatusRibbons!==!1}catch{return!0}}function al(){return window.wp?.os?.dragManager??null}const ll=["type","ref","label","icon","thumbnail","kind","status","selected","selectable","missing","access-gated","drag-kind","drag-title","drag-icon"],se=class se extends m{constructor(){super(...arguments),this._pointerdownHandler=null,this._keydownHandler=null,this._onSettingsSave=e=>{e.detail?.phase==="saved"&&this._paint()}}connectedCallback(){super.connectedCallback(),this._keydownHandler||(this._keydownHandler=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this.click())},this.addEventListener("keydown",this._keydownHandler)),document.addEventListener("os-settings-save-lifecycle",this._onSettingsSave),this._paint()}disconnectedCallback(){this._pointerdownHandler&&(this.removeEventListener("pointerdown",this._pointerdownHandler),this._pointerdownHandler=null),this._keydownHandler&&(this.removeEventListener("keydown",this._keydownHandler),this._keydownHandler=null),document.removeEventListener("os-settings-save-lifecycle",this._onSettingsSave)}requestUpdate(){this.isConnected&&this._paint()}attributeChangedCallback(e,t,s){if(t!==s){if(e==="selected"||e==="selectable"||e==="aria-selected"){this._paintSelection();return}super.attributeChangedCallback(e,t,s)}}_paintSelection(){const e=this.hasAttribute("selected"),t=this.hasAttribute("selectable");if(this.classList.toggle(`${E}--selected`,e),this.setAttribute("role",t?"option":"listitem"),t){const s=e?"true":"false";this.getAttribute("aria-selected")!==s&&this.setAttribute("aria-selected",s)}else this.removeAttribute("aria-selected")}render(){return d``}_paint(){const e=this.getAttribute("type")??"",t=this.getAttribute("ref")??"",s=this.getAttribute("label")??"",o=this.getAttribute("icon")??"",i=this.getAttribute("thumbnail")??"",n=this.getAttribute("kind")??"entry",a=this.getAttribute("status")??"",l=this.hasAttribute("selected"),c=this.hasAttribute("selectable"),u=this.hasAttribute("missing"),h=this.hasAttribute("access-gated"),p=[E,`${E}--folder`,`${E}--missing`,`${E}--access-gated`,`${E}--selected`];for(const y of p)this.classList.remove(y);this.classList.add(E),n==="folder"&&this.classList.add(`${E}--folder`),u&&this.classList.add(`${E}--missing`),h&&this.classList.add(`${E}--access-gated`),l&&this.classList.add(`${E}--selected`),this.dataset.fileType=e,this.dataset.fileRef=t,n&&(this.dataset.role=n),this.setAttribute("role",c?"option":"listitem"),c?this.setAttribute("aria-selected",l?"true":"false"):this.removeAttribute("aria-selected"),this.setAttribute("aria-label",s),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0");const f="You don’t have permission to open this — ask the folder owner for access.";h?(this.title=f,this.setAttribute("aria-disabled","true")):(this.removeAttribute("aria-disabled"),this.title===f&&this.removeAttribute("title"));const g=[`${E}__visual`,`${E}__label`,`${E}__lock`];for(const y of g)this.querySelectorAll(`:scope > .${y}`).forEach(w=>w.remove());this.querySelectorAll(":scope > os-ribbon").forEach(y=>y.remove());const x=document.createElement("span");if(x.className=`${E}__visual`,i){const y=document.createElement("img");y.src=i,y.alt="",y.loading="lazy",y.decoding="async",y.className=`${E}__preview`,y.draggable=!1,x.appendChild(y)}else if(o){const y=sl(o,{title:s,className:`${E}__icon`});x.appendChild(y)}this.appendChild(x);const _=document.createElement("span");if(_.className=`${E}__label`,_.textContent=s,this.appendChild(_),h){const y=document.createElement("span");y.className=`${E}__lock dashicons dashicons-lock`,y.setAttribute("aria-hidden","true"),this.appendChild(y)}if(a&&a!=="publish"&&ji[a]&&nl()){const y=document.createElement("os-ribbon");y.setAttribute("placement","top-end"),y.setAttribute("tone",cl(a)),y.textContent=ji[a],this.appendChild(y)}il(this),ba("os.tile.rendered",{tile:this}),this._wireDragOut()}_wireDragOut(){this._pointerdownHandler&&(this.removeEventListener("pointerdown",this._pointerdownHandler),this._pointerdownHandler=null);const e=this.getAttribute("drag-kind");if(!e)return;const t=s=>{if(s.button!==0)return;const o=al();if(!o)return;const i=this.getAttribute("ref")??"",n=this.getAttribute("drag-title")??this.getAttribute("label")??void 0,a=this.getAttribute("drag-icon")??this.getAttribute("icon")??void 0,l=this.getBoundingClientRect();o.start({payload:{type:"shortcut",source:this,data:{kind:e,ref:i,title:n,icon:a},ghost:{offsetX:s.clientX-l.left,offsetY:s.clientY-l.top}},origin:s})};this._pointerdownHandler=t,this.addEventListener("pointerdown",t)}};se.shadow=!1,se.props=ll,se.styles=[rl],se.help=void 0;let ro=se;function cl(r){switch(r){case"draft":return"warning";case"pending":return"info";case"private":return"danger";case"future":return"primary";default:return"primary"}}v("os-tile",ro);const dl=b`:host{display:block;position:relative;overflow-y:auto;overflow-x:hidden;font:var( --os-ui-log-font,12px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace );color:var( --os-ui-log-fg,var( --os-ui-fg,#1d2327 ) );background:var( --os-ui-log-bg,transparent );border:var( --os-ui-log-border,1px solid rgba( 0,0,0,0.06 ) );border-radius:var( --os-ui-log-border-radius,4px );min-height:var( --os-ui-log-min-height,120px );contain:strict}:host( [ hidden ] ){display:none}.spacer{position:relative;width:100%}.window{position:absolute;left:0;right:0;top:0}.row{box-sizing:border-box;display:block;padding:var( --os-ui-log-row-padding,2px 8px );min-height:var( --os-ui-log-row-height,22px );border-bottom:var( --os-ui-log-row-border,1px solid rgba( 0,0,0,0.04 ) );white-space:var( --os-ui-log-row-white-space,pre );overflow:hidden;text-overflow:ellipsis}:host( [ auto-row-height ] ) .row{min-height:0;overflow:visible;text-overflow:clip;white-space:var( --os-ui-log-row-white-space,normal )}.empty{display:flex;align-items:center;justify-content:center;padding:16px;color:var( --os-ui-fg-muted,#57606a );font-style:italic}`;function Bi(r){const e=document.createElement("span");let t;if(typeof r=="string")t=r;else try{t=JSON.stringify(r)}catch{t=String(r)}return e.textContent=t,e}const it=class it extends m{constructor(){super(...arguments),this._entries=[],this._renderRow=Bi,this._stickToBottom=!0,this._heights=[],this._offsets=[],this._offsetsValid=!1,this._onScroll=()=>{const e=this.scrollHeight-this.clientHeight-this.scrollTop;this._stickToBottom=e<=4,this._paintWindow()},this._resizeObserver=null}connectedCallback(){super.connectedCallback(),this.addEventListener("scroll",this._onScroll,{passive:!0}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._paintWindow()),this._resizeObserver.observe(this)),queueMicrotask(()=>{this._paintSpacer(),this._stickToBottom&&(this.scrollTop=this.scrollHeight),this._paintWindow()})}disconnectedCallback(){this.removeEventListener("scroll",this._onScroll),this._resizeObserver?.disconnect(),this._resizeObserver=null}get renderRow(){return this._renderRow}set renderRow(e){this._renderRow=typeof e=="function"?e:Bi,this._heights=[],this._invalidateOffsets(),this._paintSpacer(),this._paintWindow()}get entries(){return this._entries}set entries(e){this._entries=Array.isArray(e)?e.slice():[],this._heights=[],this._invalidateOffsets(),this._enforceMaxRows(),this._afterEntriesMutation()}push(e){this._entries.push(e),this._enforceMaxRows(),this._afterEntriesMutation(),this.emit("os-log-append",{entry:e,length:this._entries.length})}pushMany(e){if(!(!Array.isArray(e)||e.length===0)){for(const t of e)this._entries.push(t);this._enforceMaxRows(),this._afterEntriesMutation()}}clear(){this._entries=[],this._heights=[],this._invalidateOffsets(),this._afterEntriesMutation()}scrollToBottom(){this._stickToBottom=!0,this.scrollTop=this.scrollHeight}_enforceMaxRows(){const e=this._readMaxRows();if(e>0&&this._entries.length>e){const t=this._entries.length-e;this._entries.splice(0,t),this._heights.length>0&&this._heights.splice(0,Math.min(t,this._heights.length)),this._invalidateOffsets()}}_afterEntriesMutation(){this._paintSpacer(),this._stickToBottom&&(this.scrollTop=this.scrollHeight),this._paintWindow()}_readRowHeight(){const e=parseFloat(this.getAttribute("row-height")||"22");return Number.isFinite(e)&&e>0?e:22}_readMaxRows(){const e=parseFloat(this.getAttribute("max-rows")||"0");return Number.isFinite(e)&&e>0?Math.floor(e):0}_readOverscan(){const e=parseFloat(this.getAttribute("overscan")||"6");return Number.isFinite(e)&&e>=0?Math.floor(e):6}_isAutoHeight(){return this.getAttribute("auto-row-height")!==null}_invalidateOffsets(){this._offsetsValid=!1,this._offsets=[]}_ensureOffsets(){if(this._offsetsValid)return;const e=this._readRowHeight(),t=new Array(this._entries.length);let s=0;for(let o=0;o<this._entries.length;o++){t[o]=s;const i=this._heights[o];s+=Number.isFinite(i)&&i>0?i:e}this._offsets=t,this._totalHeight=s,this._offsetsValid=!0}_totalContentHeight(){return this._isAutoHeight()?(this._ensureOffsets(),this._totalHeight??0):this._entries.length*this._readRowHeight()}_findIndexAtOffset(e){const t=this._offsets;if(t.length===0)return 0;let s=0,o=t.length-1;for(;s<o;){const i=Math.floor((s+o+1)/2);t[i]<=e?s=i:o=i-1}return s}_paintSpacer(){const e=this.shadowRoot?.querySelector(".spacer");e&&(e.style.height=`${this._totalContentHeight()}px`)}_paintWindow(){const e=this.shadowRoot?.querySelector(".window"),t=this.shadowRoot?.querySelector(".empty");if(!e)return;if(this._entries.length===0){e.replaceChildren(),t&&(t.style.display="");return}t&&(t.style.display="none");const s=this._isAutoHeight(),o=this._readRowHeight(),i=this._readOverscan(),n=this.clientHeight,a=this.scrollTop;let l,c;if(s){this._ensureOffsets();const g=this._findIndexAtOffset(a),x=this._findIndexAtOffset(a+n);l=Math.max(0,g-i),c=Math.min(this._entries.length,x+1+i)}else l=Math.max(0,Math.floor(a/o)-i),c=Math.min(this._entries.length,Math.ceil((a+n)/o)+i);const u=document.createDocumentFragment(),h=[];for(let g=l;g<c;g++){const x=this._renderRow(this._entries[g],g);let _;x instanceof HTMLElement?_=x:(_=document.createElement("span"),_.textContent=String(x)),_.classList.add("row"),_.style.position="absolute",_.style.left="0",_.style.right="0",s?(_.style.top=`${this._offsets[g]}px`,_.style.height="auto"):(_.style.top=`${g*o}px`,_.style.height=`${o}px`),u.appendChild(_),h.push({idx:g,el:_})}if(e.replaceChildren(u),!s)return;let p=!1;const f=this._readRowHeight();for(const{idx:g,el:x}of h){const _=x.offsetHeight||f,y=this._heights[g];(!Number.isFinite(y)||Math.abs(y-_)>.5)&&(this._heights[g]=_,p=!0)}if(p){this._invalidateOffsets(),this._ensureOffsets();for(const{idx:g,el:x}of h)x.style.top=`${this._offsets[g]}px`;this._paintSpacer(),this._stickToBottom&&(this.scrollTop=this.scrollHeight)}}render(){const e=this.getAttribute("empty")||"No entries";return d` |
| 849 |
<div class="spacer"> |
| 850 |
<div class="window" part="window"></div> |
| 851 |
</div> |
| 852 |
<div class="empty" part="empty">${e}</div> |
| 853 |
`}};it.props=["rowHeight","maxRows","overscan","empty","autoRowHeight"],it.styles=[dl],it.help=void 0;let no=it;v("os-log",no);const ul=b`:host{display:block;counter-reset:os-step}:host( [ hidden ] ){display:none}.os-steps__list{display:flex;flex-direction:column;gap:var( --os-ui-steps-gap,16px );margin:0;padding:0;list-style:none}:host( [ horizontal ] ){--os-ui-step-connector-width:20px;--os-ui-step-title-color:var( --os-ui-fg-muted,#646970 );--os-ui-step-title-weight:400}:host( [ horizontal ] ) .os-steps__list{flex-direction:row;align-items:center;flex-wrap:wrap;gap:var( --os-ui-steps-gap,10px )}`,hl=b`:host{display:grid;grid-template-columns:var( --os-ui-step-chip-size,28px ) 1fr var( --os-ui-step-connector-width,0 );column-gap:var( --os-ui-step-gap,12px );align-items:start;counter-increment:os-step}:host( [ hidden ] ){display:none}:host::before{content:counter( os-step );display:inline-flex;align-items:center;justify-content:center;width:var( --os-ui-step-chip-size,28px );height:var( --os-ui-step-chip-size,28px );box-sizing:border-box;border-radius:50%;background:var( --os-ui-step-chip-bg,var( --wp-admin-theme-color,#2271b1 ) );background-size:200% 200%;background-position:30% 40%;color:var( --os-ui-step-chip-fg,var( --os-ui-fg-on-accent,#fff ) );border:var( --os-ui-step-chip-border,0 );font-family:var( --os-ui-step-chip-family,inherit );font-size:var( --os-ui-step-chip-font-size,13px );font-weight:600;line-height:1;flex-shrink:0}:host( [ done ] )::before{content:'✓';background:var( --os-ui-step-chip-done-bg,var( --os-ui-fg-muted,#646970 ) )}:host( [ current ] ) .os-step__title{color:var( --os-ui-fg,#1d2327 );font-weight:600}:host( [ interactive ] ){cursor:pointer}:host( [ interactive ] ) .os-step__title{transition:color 120ms ease}:host( [ interactive ] )::before{transition:border-color 120ms ease}:host( [ interactive ]:hover ) .os-step__title{color:var( --os-ui-step-title-hover-color,var( --os-ui-fg,#1d2327 ) )}:host( [ interactive ]:hover )::before{border-color:var( --os-ui-step-title-hover-color,var( --os-ui-fg,#1d2327 ) )}:host( [ interactive ]:focus-visible ){outline:var( --os-ui-focus-ring,2px solid #2271b1 );outline-offset:2px;border-radius:var( --os-ui-radius,4px )}:host::after{content:'';inline-size:var( --os-ui-step-connector-width,0 );block-size:1px;background:var( --os-ui-border,rgba( 0,0,0,0.08 ) );align-self:center}:host(:last-of-type )::after{content:none}.os-step__body{min-width:0}:host( [ trail ] ){align-items:center}:host( [ trail ] ) .os-step__title{margin:0}.os-step__title{margin:0 0 4px;font-family:var( --os-ui-step-title-family,inherit );font-size:var( --os-ui-step-title-size,14px );font-weight:var( --os-ui-step-title-weight,600 );color:var( --os-ui-step-title-color,var( --os-ui-fg,#1d2327 ) );text-transform:var( --os-ui-step-title-transform,none );letter-spacing:var( --os-ui-step-title-spacing,normal );line-height:1.3}.os-step__title:empty{display:none}.os-step__body::slotted( * ){margin-block:0}`,rt=class rt extends m{constructor(){super(...arguments),this.syncTrail=()=>{const e=this.hasAttribute("horizontal");for(const t of Array.from(this.children))t.tagName==="OS-STEP"&&t.toggleAttribute("trail",e)}}connectedCallback(){super.connectedCallback(),this.syncTrail()}render(){return this.syncTrail(),d`<ol class="os-steps__list"><slot @slotchange=${this.syncTrail}></slot></ol>`}};rt.props=["horizontal"],rt.styles=[ul],rt.help=void 0;let ao=rt;v("os-steps",ao);const nt=class nt extends m{constructor(){super(...arguments),this.onClick=e=>{if(!this.isInteractive())return;const t=e.composedPath();for(const s of t){if(s===this)break;if(s instanceof HTMLElement&&s.hasAttribute("data-noclick"))return}this.dispatchEvent(new CustomEvent("os-step-click",{bubbles:!0,composed:!0}))},this.onKeyDown=e=>{if(!this.isInteractive()||e.key!=="Enter"&&e.key!==" ")return;const t=e.target;t instanceof HTMLElement&&t!==this&&t.closest("button, a, input, select, textarea")||(e.preventDefault(),this.onClick(e))}}isInteractive(){return this.hasAttribute("interactive")}syncRoles(){this.hasAttribute("current")?this.setAttribute("aria-current","step"):this.removeAttribute("aria-current"),this.isInteractive()?(this.setAttribute("role","button"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0")):(this.removeAttribute("role"),this.removeAttribute("tabindex"))}connectedCallback(){super.connectedCallback(),this.syncRoles(),this.addEventListener("click",this.onClick),this.addEventListener("keydown",this.onKeyDown)}disconnectedCallback(){this.removeEventListener("click",this.onClick),this.removeEventListener("keydown",this.onKeyDown)}render(){const e=this.title||"";return this.syncRoles(),d` |
| 854 |
<div class="os-step__body"> |
| 855 |
<div class="os-step__title">${e}</div> |
| 856 |
<slot></slot> |
| 857 |
</div> |
| 858 |
`}};nt.props=["title","done","current","interactive"],nt.styles=[hl],nt.help={title:"Step",summary:"A single numbered step inside <os-steps>. Renders an auto-numbered chip and an optional bold title above the slotted body.",status:"stable",props:[{name:"title",type:"string",description:"Optional bold title rendered above the body."},{name:"done",type:"boolean",description:"When present, the chip shows a ✓ in a muted colour instead of the number."},{name:"current",type:"boolean",description:'Marks the step the reader is on. Mirrors aria-current="step" onto the host.'},{name:"interactive",type:"boolean",description:"Makes the step a jump target: focusable, activated by click or Enter/Space, and emits os-step-click. Lifts the title to full contrast on hover."}],events:[{name:"os-step-click",detail:"none",description:"Fired when an interactive step is activated by pointer or keyboard."}],slots:[{name:"(default)",description:"Step body content."}],cssProps:[{name:"--os-ui-step-gap",default:"12px"},{name:"--os-ui-step-chip-size",default:"28px"},{name:"--os-ui-step-chip-bg",default:"var(--wp-admin-theme-color)"},{name:"--os-ui-step-chip-fg",default:"#fff"},{name:"--os-ui-step-chip-done-bg",default:"var(--os-ui-fg-muted)"},{name:"--os-ui-step-chip-font-size",default:"13px"},{name:"--os-ui-step-title-hover-color",default:"var(--os-ui-fg)",description:"Ink an interactive step takes on hover, on its title and on an outlined chip."}],example:d` |
| 859 |
<os-steps> |
| 860 |
<os-step title="Configure">Open OpenStation Preferences → AI.</os-step> |
| 861 |
<os-step title="Connect" done>Key confirmed.</os-step> |
| 862 |
</os-steps> |
| 863 |
`};let lo=nt;v("os-step",lo);const pl=b` ${$} ${Dt}:host{display:block;--_bg:var( --os-ui-table-bg,var( --os-ui-surface,#fff ) );--_border:var( --os-ui-table-border,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) );--_column-border:var( --os-ui-table-column-border,var( --os-ui-border-strong,rgba( 0,0,0,0.14 ) ) );--_header-bg:var( --os-ui-table-header-bg,var( --os-ui-surface-elevated,#f6f7f7 ) );--_row-hover:var( --os-ui-table-row-hover,var( --os-ui-hover,rgba( 0,0,0,0.04 ) ) );--_stripe:var( --os-ui-table-stripe,var( --os-ui-surface-subtle,rgba( 0,0,0,0.03 ) ) );--_cell-padding:var( --os-ui-table-cell-padding,8px 12px );--_font-size:var( --os-ui-table-font-size,13px );--_max-height:var( --os-ui-table-max-height,none );font-size:var( --_font-size );color:inherit}:host( [ hidden ] ){display:none}.scroll{position:relative;overflow:auto;max-height:var( --_max-height );border:1px solid var( --_border );border-radius:4px;background:var( --_bg )}table{width:100%;border-collapse:separate;border-spacing:0;background:var( --_bg )}thead th{text-align:start;font-weight:600;background-color:var( --_header-bg );background-image:var( --os-ui-table-header-bg-image,none );background-repeat:var( --os-ui-table-header-bg-image-repeat,repeat );background-size:var( --os-ui-table-header-bg-image-size,auto );background-position:var( --os-ui-table-header-bg-image-position,center );padding:var( --_cell-padding );border-bottom:1px solid var( --_border );white-space:nowrap}tbody td{padding:var( --_cell-padding );border-bottom:1px solid var( --_border );background-color:var( --_bg );vertical-align:middle}tbody tr:last-child td{border-bottom:0}:host( [ striped ] ) tbody tr:nth-child( odd ) td{background-image:linear-gradient( var( --_stripe ),var( --_stripe ) )}:host( [ hover ] ) tbody tr:hover td{background-image:linear-gradient( var( --_row-hover ),var( --_row-hover ) )}:host( [ hover ][ striped ] ) tbody tr:nth-child( odd ):hover td{background-image:linear-gradient( var( --_row-hover ),var( --_row-hover ) ),linear-gradient( var( --_stripe ),var( --_stripe ) )}:host( [ compact ] ){--os-ui-table-cell-padding:4px 8px;--os-ui-table-font-size:12px}:host( [ bordered ] ) thead th,:host( [ bordered ] ) tbody td{border-inline-end:1px solid var( --_column-border )}:host( [ bordered ] ) thead th:last-child,:host( [ bordered ] ) tbody td:last-child{border-inline-end:0}th.is-sticky,td.is-sticky{position:sticky;z-index:10}tbody td.is-sticky{background-color:var( --_bg )}thead th.is-sticky{background-color:var( --_header-bg );background-image:var( --os-ui-table-header-bg-image,none );background-repeat:var( --os-ui-table-header-bg-image-repeat,repeat );background-size:var( --os-ui-table-header-bg-image-size,auto );background-position:var( --os-ui-table-header-bg-image-position,center );z-index:30}:host( [ sticky-header ] ) thead th{position:sticky;top:0;z-index:20}:host( [ sticky-header ] ) thead tr.filter-row th{top:var( --os-ui-table-header-height,33px );z-index:20}:host( [ sticky-header ] ) thead th.is-sticky{z-index:40}:host( [ sticky-header ] ) thead tr.filter-row th.is-sticky{z-index:40}th.is-sticky-edge,td.is-sticky-edge{border-inline-end:var( --os-ui-table-sticky-edge,2px solid var( --_border ) )}.align-center{text-align:center}.align-end{text-align:end}.filter-row th{padding:4px 8px;background-color:var( --_header-bg );background-image:var( --os-ui-table-header-bg-image,none );background-repeat:var( --os-ui-table-header-bg-image-repeat,repeat );background-size:var( --os-ui-table-header-bg-image-size,auto );background-position:var( --os-ui-table-header-bg-image-position,center );border-bottom:1px solid var( --_border );font-weight:400}.filter-input,.filter-select{width:100%;min-width:60px;box-sizing:border-box;padding:4px 6px;font:inherit;color:inherit;background-color:var( --_bg );border:1px solid var( --_border );border-radius:3px}.filter-input:focus,.filter-select:focus{outline:none;border-color:var( --os-ui-accent,#2271b1 );box-shadow:var( --_holo-focus-field )}.expander{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;border-radius:3px;font-size:11px;line-height:1}.expander:hover{background:var( --os-ui-hover,rgba( 0,0,0,0.06 ) )}td.col-expander,th.col-expander{width:36px;min-width:36px;padding-left:0;padding-right:0;text-align:center}tr.subtable td{padding:0;background-color:var( --_bg );background-image:linear-gradient( var( --_stripe ),var( --_stripe ) );border-bottom:1px solid var( --_border )}tr.subtable .subtable-inner{padding:8px 12px 8px 32px}tr.empty td{padding:24px;text-align:center;color:var( --os-ui-text-muted,var( --os-ui-fg-muted,rgba( 0,0,0,0.55 ) ) );font-style:italic}thead th.is-sortable{cursor:pointer;user-select:none}thead th.is-sortable:hover{background-image:linear-gradient( var( --_row-hover ),var( --_row-hover ) )}thead th.is-sortable:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var( --os-ui-accent,#2271b1 )}.sort-indicator{font-size:10px;color:var( --os-ui-text-muted,var( --os-ui-fg-muted,rgba( 0,0,0,0.55 ) ) );margin-inline-start:2px}thead th.sort-asc .sort-indicator,thead th.sort-desc .sort-indicator{color:var( --wp-admin-theme-color,#2271b1 )}td.col-select,th.col-select{width:40px;min-width:40px;padding-left:0;padding-right:0;text-align:center}.select-all-checkbox,.select-row-checkbox{cursor:pointer;margin:0}tbody tr.is-selected td{background-color:color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 10%,var( --_bg ) );background-image:none}tbody tr.is-selected:hover td{background-color:color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 16%,var( --_bg ) )}tbody tr.is-selected td:first-child{box-shadow:inset 3px 0 0 0 var( --os-ui-accent,#2271b1 )}tbody:dir( rtl ) tr.is-selected td:first-child{box-shadow:inset -3px 0 0 0 var( --os-ui-accent,#2271b1 )}:host( [ stacked ] ) .scroll{border:0;border-radius:0}:host( [ stacked ] ) table,:host( [ stacked ] ) tbody{display:block;width:100%}:host( [ stacked ] ) colgroup,:host( [ stacked ] ) thead{display:none}:host( [ stacked ] ) tbody tr{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-bottom:1px solid var( --_border );background-color:var( --_bg )}:host( [ stacked ] ) tbody tr:last-child{border-bottom:0}:host( [ stacked ] ) tbody td{display:block;padding:0;border:0;background-color:transparent;background-image:none;box-shadow:none;min-width:0;width:auto;vertical-align:baseline}:host( [ stacked ] ) tbody tr.is-selected td,:host( [ stacked ] ) tbody tr.is-selected:hover td,:host( [ stacked ][ striped ] ) tbody tr:nth-child( odd ) td,:host( [ stacked ][ hover ] ) tbody tr:hover td,:host( [ stacked ][ hover ][ striped ] ) tbody tr:nth-child( odd ):hover td,:host( [ stacked ][ bordered ] ) tbody td{padding:0;border:0;background-color:transparent;background-image:none;box-shadow:none}:host( [ stacked ][ hover ] ) tbody tr:hover{background-image:linear-gradient( var( --_row-hover ),var( --_row-hover ) )}:host( [ stacked ] ) tbody tr.is-selected,:host( [ stacked ] ) tbody tr.is-selected:hover{background-color:color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 10%,var( --_bg ) );background-image:none;box-shadow:inset 3px 0 0 0 var( --os-ui-accent,#2271b1 )}:host( [ stacked ] ) tbody:dir( rtl ) tr.is-selected{box-shadow:inset -3px 0 0 0 var( --os-ui-accent,#2271b1 )}:host( [ stacked ] ) tbody td.col-select,:host( [ stacked ] ) tbody td.col-expander{flex:0 0 auto;display:flex;align-items:center;justify-content:center;min-width:0}:host( [ stacked ] ) tbody td.col-select{width:44px;height:44px;margin:-11px 0 -11px -11px;cursor:pointer}:host( [ stacked ] ) .select-row-checkbox{width:22px;height:22px}:host( [ stacked ] ) tbody td.col-expander{width:28px;height:22px;margin-inline-start:-4px}:host( [ stacked ] ) tbody td.stack-body{flex:1 1 auto;display:flex;flex-direction:column;gap:4px;min-width:0}.stack-cell{display:flex;align-items:baseline;gap:6px;min-width:0;line-height:1.4}.stack-title{font-size:15px;font-weight:600;line-height:1.35}.stack-meta{font-size:13px}.stack-label{flex:0 0 auto;font-size:12px;color:var( --os-ui-text-muted,var( --os-ui-fg-muted,rgba( 0,0,0,0.55 ) ) )}.stack-label::after{content:'·';margin-inline-start:6px}.stack-value{flex:1 1 auto;min-width:0;display:flex;align-items:center;flex-wrap:wrap;gap:6px}.stack-actions{margin-block-start:6px}.stack-actions .stack-value{gap:8px}.stack-actions .stack-value>*{justify-content:flex-start;max-width:100%}:host( [ stacked ] ) tr.subtable,:host( [ stacked ] ) tr.empty{display:block;padding:0}:host( [ stacked ] ) tr.subtable td{background-image:linear-gradient( var( --_stripe ),var( --_stripe ) )}:host( [ stacked ] ) tr.subtable .subtable-inner{padding:8px 14px 12px}:host( [ stacked ] ) tr.empty td{padding:24px}:host( [ stacked ] ) tr.skeleton{display:block;padding:14px;border-bottom:1px solid var( --_border )}:host( [ stacked ] ) tr.skeleton td.stack-body{gap:8px}:host( [ stacked ] ) tr.skeleton .skeleton-bar:first-child{height:15px}tbody tr.skeleton td{padding:var( --_cell-padding )}.skeleton-bar{display:block;height:12px;border-radius:3px;background:linear-gradient( 90deg,var( --os-ui-table-skeleton-color,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) ) 0%,var( --os-ui-table-skeleton-highlight,var( --os-ui-hover,rgba( 0,0,0,0.14 ) ) ) 50%,var( --os-ui-table-skeleton-color,var( --os-ui-hover,rgba( 0,0,0,0.06 ) ) ) 100% );background-size:200% 100%;animation:os-table-skeleton-pulse 1.4s ease-in-out infinite}@keyframes os-table-skeleton-pulse{0%{background-position:200% 50%}100%{background-position:-200% 50%}}@media ( prefers-reduced-motion:reduce ){.skeleton-bar{animation:none}}`,ee="__wpd_expander__",te="__wpd_select__",at=class at extends m{constructor(){super(...arguments),this._data=[],this._columns=[],this._filters={},this._expanded=new Set,this._subTable=null,this._sort=null,this._selection=new Set,this._getRowId=(e,t)=>t,this._filterCache=new Map,this._paintScheduled=!1,this._stacked=!1,this._stickyHeaderWarned=!1,this._stickyRaceWarned=!1,this._resizeObserver=null,this._stickyMicroScheduled=!1,this._stickyRafHandle=null,this._loadingDesyncWarned=!1,this._lastStickyIndex=-1}get data(){return this._data}set data(e){this._data=Array.isArray(e)?e.slice():[],this._expanded.clear(),this._schedulePaint()}get columns(){return this._columns}set columns(e){this._columns=Array.isArray(e)?e.slice():[];const t=new Set(this._columns.map(s=>s.key));for(const s of Object.keys(this._filters))t.has(s)||delete this._filters[s];for(const s of Array.from(this._filterCache.keys()))t.has(s)||this._filterCache.delete(s);this._sort&&!t.has(this._sort.key)&&(this._sort=null),this._schedulePaint()}get filters(){return{...this._filters}}set filters(e){this._filters=e?{...e}:{},this._schedulePaint()}get sort(){return this._sort?{...this._sort}:null}set sort(e){this._sort=e?{...e}:null,this._schedulePaint()}get selection(){return new Set(this._selection)}set selection(e){this._selection=new Set(e??[]),this._schedulePaint()}get selectedRows(){const e=[];return this._data.forEach((t,s)=>{this._selection.has(this._getRowId(t,s))&&e.push(t)}),e}get visibleRows(){return this._filteredRows().map(e=>e.row)}get getRowId(){return this._getRowId}set getRowId(e){this._getRowId=typeof e=="function"?e:(t,s)=>s,this._schedulePaint()}get subTable(){return this._subTable}set subTable(e){this._subTable=typeof e=="function"?e:null,this._expanded.clear(),this._schedulePaint()}get expanded(){return new Set(this._expanded)}set expanded(e){this._expanded=new Set(e??[]),this._schedulePaint()}expand(e){e<0||e>=this._data.length||this._expanded.has(e)||(this._expanded.add(e),this.emit("os-table-expand-change",{row:this._data[e],index:e,expanded:!0}),this._schedulePaint())}collapse(e){this._expanded.has(e)&&(this._expanded.delete(e),this.emit("os-table-expand-change",{row:this._data[e],index:e,expanded:!1}),this._schedulePaint())}expandAll(){if(!this._subTable)return;let e=!1;for(let t=0;t<this._data.length;t++)this._subTable(this._data[t],t)&&(this._expanded.has(t)||(this._expanded.add(t),e=!0));e&&this._schedulePaint()}collapseAll(){this._expanded.size!==0&&(this._expanded.clear(),this._schedulePaint())}isExpanded(e){return this._expanded.has(e)}clearFilters(){Object.keys(this._filters).length!==0&&(this._filters={},this.emit("os-table-filter-change",{filters:{}}),this._schedulePaint())}clearSort(){this._sort!==null&&(this._sort=null,this.emit("os-table-sort-change",{sort:null}),this._schedulePaint())}select(e){if(this._selection.has(e))return;const t=this._readSelectable(),s=t==="single"?Array.from(this._selection):[];t==="single"&&this._selection.clear(),this._selection.add(e),this._emitSelectionChange(),this._syncSelectionDom([e,...s])}deselect(e){this._selection.delete(e)&&(this._emitSelectionChange(),this._syncSelectionDom([e]))}selectAll(){if(this._readSelectable()==="multi"){for(const{row:e,index:t}of this._filteredRows())this._selection.add(this._getRowId(e,t));this._emitSelectionChange(),this._syncSelectionDom("all")}}clearSelection(){this._selection.size!==0&&(this._selection.clear(),this._emitSelectionChange(),this._syncSelectionDom("all"))}_syncSelectionDom(e){const t=this.shadowRoot;if(!t)return;const s=t.querySelector("tbody");if(!s)return;let o=null;if(e!=="all"){o=new Set;for(const a of e)o.add(String(a))}const i=s.querySelectorAll("tr[data-row-id]");for(const a of i){const l=a.dataset.rowId;if(l===void 0||o&&!o.has(l))continue;const c=Number(a.dataset.rowIndex);if(!Number.isFinite(c))continue;const u=this._data[c];if(u===void 0)continue;const h=this._getRowId(u,c),p=this._selection.has(h);a.classList.toggle("is-selected",p);const f=a.querySelector("input.select-row-checkbox");f&&f.checked!==p&&(f.checked=p)}const n=t.querySelector("thead .select-all-checkbox");if(n){const{total:a,selected:l}=this._visibleSelectionStats();n.checked=a>0&&l===a,n.indeterminate=l>0&&l<a}}scrollToRow(e){const t=this.shadowRoot;if(!t)return;const o=t.querySelectorAll("tbody tr:not(.subtable):not(.empty):not(.skeleton)")[e];o&&o.scrollIntoView({block:"nearest",inline:"nearest"})}connectedCallback(){super.connectedCallback(),this._schedulePaint()}disconnectedCallback(){this._resizeObserver?.disconnect(),this._resizeObserver=null,this._stickyRafHandle!==null&&typeof cancelAnimationFrame<"u"&&(cancelAnimationFrame(this._stickyRafHandle),this._stickyRafHandle=null)}recomputeLayout(){this._applyStickyOffsets(),this._measureHeaderHeight()}render(){return d` |
| 864 |
<div class="scroll" part="scroll"> |
| 865 |
<table part="table"> |
| 866 |
<colgroup></colgroup> |
| 867 |
<thead></thead> |
| 868 |
<tbody></tbody> |
| 869 |
</table> |
| 870 |
</div> |
| 871 |
`}requestUpdate(){super.requestUpdate(),this._schedulePaint()}_schedulePaint(){this._paintScheduled||!this.isConnected||(this._paintScheduled=!0,queueMicrotask(()=>{this._paintScheduled=!1,this.isConnected&&this._paint()}))}_paint(){const e=this.shadowRoot;if(!e)return;e.querySelector("tbody")||Mt(this.render(),e);const t=e.querySelector("colgroup"),s=e.querySelector("thead"),o=e.querySelector("tbody");if(!t||!s||!o)return;const i=this._effectiveColumns();this._stacked=this.hasAttribute("stacked");const n=this._readStickyColumns();this._lastStickyIndex=this._computeLastStickyIndex(i,n),this._paintColgroup(t,i),this._paintHead(s,i,n),this._paintBody(o,i,n),this._applyStickyOffsets(),this._measureHeaderHeight(),this._scheduleStickyOffsets(),this._maybeWarnStickyHeader(),this._maybeWarnLoadingDesync(o),this._ensureResizeObserver()}_maybeWarnLoadingDesync(e){this._loadingDesyncWarned||this.hasAttribute("loading")&&(e.querySelector("tr.skeleton")||(this._loadingDesyncWarned=!0,console.warn("[os-table] `loading` attribute is set but no skeleton rows rendered. Either attributeChangedCallback didn't route through requestUpdate (framework regression), or `loading` was set after the most recent paint and no follow-up trigger ran. Toggling `data` will force a paint as a workaround.")))}_scheduleStickyOffsets(){this._stickyMicroScheduled||(this._stickyMicroScheduled=!0,queueMicrotask(()=>{this._stickyMicroScheduled=!1,this.isConnected&&this._applyStickyOffsets()})),this._stickyRafHandle===null&&typeof requestAnimationFrame<"u"&&(this._stickyRafHandle=requestAnimationFrame(()=>{this._stickyRafHandle=null,this.isConnected&&(this._applyStickyOffsets(),this._measureHeaderHeight())}))}_ensureResizeObserver(){if(this._resizeObserver||typeof ResizeObserver>"u")return;const e=this.shadowRoot?.querySelector(".scroll");e&&(this._resizeObserver=new ResizeObserver(()=>{this.isConnected&&(this._applyStickyOffsets(),this._measureHeaderHeight(),this._stickyHeaderWarned=!1,this._maybeWarnStickyHeader())}),this._resizeObserver.observe(e),this._resizeObserver.observe(this))}_paintColgroup(e,t){const s=[];for(const o of t){const i=document.createElement("col");o.width&&(i.style.width=o.width),s.push(i)}e.replaceChildren(...s)}_paintHead(e,t,s){const o=document.createElement("tr");o.setAttribute("part","header-row");for(let l=0;l<t.length;l++)o.appendChild(this._buildHeaderCell(t[l],l,s));const i=e.querySelector(':scope > tr[part="header-row"]');i?e.replaceChild(o,i):e.insertBefore(o,e.firstChild);const n=t.some(l=>l.filter||Array.isArray(l.filterOptions)||typeof l.filterRender=="function");let a=e.querySelector(":scope > tr.filter-row");if(n){const l=[];for(let h=0;h<t.length;h++)l.push(this._buildFilterCell(t[h],h,s));a||(a=document.createElement("tr"),a.classList.add("filter-row"),a.setAttribute("part","filter-row"),e.appendChild(a));const c=Array.from(a.children);let u=c.length===l.length;if(u){for(let h=0;h<l.length;h++)if(c[h]!==l[h]){u=!1;break}}if(!u){const h=new Set(l);for(const p of l)a.appendChild(p);for(const p of Array.from(a.children))h.has(p)||a.removeChild(p)}}else a&&a.remove()}_buildHeaderCell(e,t,s){const o=document.createElement("th");if(o.setAttribute("scope","col"),o.dataset.key=e.key,this._applyCellClasses(o,e,t,s),e.minWidth&&(o.style.minWidth=e.minWidth),e.key===te){if(this._readSelectable()==="multi"){const n=document.createElement("input");n.type="checkbox",n.className="select-all-checkbox",n.setAttribute("data-noclick",""),n.setAttribute("aria-label","Select all rows");const{total:a,selected:l}=this._visibleSelectionStats();n.checked=a>0&&l===a,n.indeterminate=l>0&&l<a,n.addEventListener("change",()=>{n.checked?this.selectAll():this.clearSelection()}),o.appendChild(n)}return o}if(o.textContent=e.label??(e.key===ee?"":e.key),e.sortable){o.classList.add("is-sortable");const i=this._sort?.key===e.key,n=document.createElement("span");n.className="sort-indicator";let a="";i&&(a=this._sort.direction==="asc"?" ▲":" ▼"),n.textContent=a,o.appendChild(n),i&&o.classList.add(this._sort.direction==="asc"?"sort-asc":"sort-desc"),o.addEventListener("click",()=>this._cycleSort(e.key))}return o}_buildFilterCell(e,t,s){const o=this._filterCache.get(e.key),i=Array.isArray(e.filterOptions),n=typeof e.filterRender=="function";let a;if(!e.filter&&!i&&!n||e.key===ee||e.key===te?a="none":n?a="custom":e.filter==="select"||i?a="select":a="text",o&&o.kind===a){if(o.th.className="",this._applyCellClasses(o.th,e,t,s),a==="select"){const h=o.control,p=this._resolveFilterOptions(e),f=p.map(g=>g.value).join("|");f!==o.optionsKey?(this._populateSelect(h,p,this._filters[e.key]??""),o.optionsKey=f):h.value=this._filters[e.key]??""}else if(a==="text"){const h=o.control,p=this._filters[e.key]??"";h.value!==p&&h.ownerDocument.activeElement!==h&&(h.value=p)}else a==="custom"&&e.filterRender&&e.filterRender(o.th,{value:this._filters[e.key]??"",setValue:h=>this._onFilterChange(e.key,h),col:e});return o.th}const l=document.createElement("th");if(this._applyCellClasses(l,e,t,s),a==="none")return this._filterCache.set(e.key,{th:l,control:null,optionsKey:"",kind:"none"}),l;if(a==="custom"&&e.filterRender)return e.filterRender(l,{value:this._filters[e.key]??"",setValue:h=>this._onFilterChange(e.key,h),col:e}),this._filterCache.set(e.key,{th:l,control:null,optionsKey:"",kind:"custom"}),l;let c,u="";if(a==="select"){const h=document.createElement("select");h.classList.add("filter-select"),h.setAttribute("data-noclick",""),h.setAttribute("aria-label",`Filter ${e.label??e.key}`);const p=this._resolveFilterOptions(e);this._populateSelect(h,p,this._filters[e.key]??""),u=p.map(f=>f.value).join("|"),h.addEventListener("change",()=>{this._onFilterChange(e.key,h.value)}),c=h}else{const h=document.createElement("input");h.type="search",h.classList.add("filter-input"),h.setAttribute("data-noclick",""),h.setAttribute("placeholder","Filter…"),h.setAttribute("aria-label",`Filter ${e.label??e.key}`),h.value=this._filters[e.key]??"",h.addEventListener("input",()=>{this._onFilterChange(e.key,h.value)}),c=h}return l.appendChild(c),this._filterCache.set(e.key,{th:l,control:c,optionsKey:u,kind:a}),l}_populateSelect(e,t,s){e.replaceChildren();const o=document.createElement("option");o.value="",o.textContent="All",e.appendChild(o);for(const i of t){const n=document.createElement("option");n.value=i.value,n.textContent=i.label,i.value===s&&(n.selected=!0),e.appendChild(n)}e.value=s}_resolveFilterOptions(e){return Array.isArray(e.filterOptions)?e.filterOptions:this._uniqueValues(e.key).map(t=>({value:t,label:t}))}_paintBody(e,t,s){if(e.replaceChildren(),this.hasAttribute("loading")){const i=this._readLoadingRows();for(let n=0;n<i;n++)e.appendChild(this._buildSkeletonRow(t,n));return}const o=this._sortedRows(this._filteredRows());if(o.length===0){e.appendChild(this._buildEmptyRow(t.length));return}for(const{row:i,index:n}of o)if(e.appendChild(this._stacked?this._buildStackedRow(i,n,t):this._buildBodyRow(i,n,t,s)),this._expanded.has(n)&&this._subTable){const a=this._subTable(i,n);a&&e.appendChild(this._buildSubTableRow(a,t.length))}}_buildEmptyRow(e){const t=document.createElement("tr");t.classList.add("empty");const s=document.createElement("td");s.colSpan=e;const o=document.createElement("slot");return o.name="empty",o.textContent=this.getAttribute("empty")||"No data",s.appendChild(o),t.appendChild(s),t}_buildSkeletonRow(e,t){const s=document.createElement("tr");if(s.classList.add("skeleton"),s.setAttribute("aria-hidden","true"),this._stacked){s.classList.add("stack-row");const o=document.createElement("td");o.className="stack-body",o.colSpan=Math.max(1,e.length);for(const i of[55+t*7%25,30+t*11%15]){const n=document.createElement("span");n.className="skeleton-bar",n.style.width=`${i}%`,o.appendChild(n)}return s.appendChild(o),s}for(const o of e){const i=document.createElement("td"),n=document.createElement("span");n.className="skeleton-bar";const a=50+(t*7+s.children.length*13)%40;n.style.width=`${a}%`,i.appendChild(n),s.appendChild(i)}return s}_buildBodyRow(e,t,s,o){const i=document.createElement("tr");i.setAttribute("part","row"),i.dataset.rowIndex=String(t);const n=this._getRowId(e,t);i.dataset.rowId=String(n),this._selection.has(n)&&i.classList.add("is-selected"),i.addEventListener("click",a=>{this._onRowClick(e,t,a)});for(let a=0;a<s.length;a++)i.appendChild(this._buildBodyCell(s[a],a,e,t,o));return i}_buildStackedRow(e,t,s){const o=document.createElement("tr");o.setAttribute("part","row"),o.classList.add("stack-row"),o.dataset.rowIndex=String(t);const i=this._getRowId(e,t);o.dataset.rowId=String(i),this._selection.has(i)&&o.classList.add("is-selected"),o.addEventListener("click",c=>{this._onRowClick(e,t,c)});const n=document.createElement("td");n.className="stack-body";let a=0,l=0;for(let c=0;c<s.length;c++){const u=s[c];if(u.key===te||u.key===ee){o.appendChild(this._buildBodyCell(u,c,e,t,0));continue}l++;const h=gl(u,a++);if(h==="hidden")continue;const p=document.createElement("div");if(p.className=`stack-cell stack-${h}`,p.dataset.key=u.key,h==="meta"&&u.label){const _=document.createElement("span");_.className="stack-label",_.textContent=u.label,p.appendChild(_)}const f=document.createElement("span");f.className="stack-value";const g=e[u.key],x=Kt(g);u.render?this._mountCellContent(f,u.render(g,e,t)):x!==null?f.appendChild(this._slotFor(x)):g!=null&&(f.textContent=String(g)),p.appendChild(f),n.appendChild(p)}return n.colSpan=Math.max(1,l),o.appendChild(n),o}_buildBodyCell(e,t,s,o,i){const n=document.createElement("td");if(this._applyCellClasses(n,e,t,i),e.minWidth&&(n.style.minWidth=e.minWidth),e.key===te){const c=this._getRowId(s,o),u=document.createElement("input");return u.type="checkbox",u.className="select-row-checkbox",u.setAttribute("data-noclick",""),u.setAttribute("aria-label","Select row"),u.checked=this._selection.has(c),u.addEventListener("change",()=>{u.checked?this.select(c):this.deselect(c)}),n.appendChild(u),this._stacked&&(n.setAttribute("data-noclick",""),n.addEventListener("click",h=>{h.target===n&&(u.checked=!u.checked,u.dispatchEvent(new Event("change")))})),n}if(e.key===ee){if(!(this._subTable?!!this._subTable(s,o):!1))return n;const u=this._expanded.has(o),h=document.createElement("button");return h.type="button",h.className="expander",h.setAttribute("data-noclick",""),h.setAttribute("aria-expanded",u?"true":"false"),h.setAttribute("aria-label",u?"Collapse row":"Expand row"),h.textContent=u?"▾":"▸",h.addEventListener("click",p=>{this._toggleRow(o,s,p)}),n.appendChild(h),n}const a=s[e.key],l=Kt(a);if(e.render){const c=e.render(a,s,o);this._mountCellContent(n,c)}else l!==null?n.appendChild(this._slotFor(l)):a!=null&&(n.textContent=String(a));return n}_slotFor(e){const t=document.createElement("slot");return t.name=e,t}_buildSubTableRow(e,t){const s=document.createElement("tr");s.classList.add("subtable"),s.setAttribute("part","subtable-row");const o=document.createElement("td");o.colSpan=t;const i=document.createElement("div");if(i.classList.add("subtable-inner"),e instanceof Node)i.appendChild(e);else if(Wi(e))Mt(e,i);else{const n=document.createElement("os-table");n.columns=e.columns,n.data=e.data,e.subTable&&(n.subTable=e.subTable),i.appendChild(n)}return o.appendChild(i),s.appendChild(o),s}_mountCellContent(e,t){if(typeof t=="string"){e.textContent=t;return}if(t instanceof Node){e.appendChild(t);return}Wi(t)&&Mt(t,e)}_onFilterChange(e,t){t===""?delete this._filters[e]:this._filters[e]=t,this.emit("os-table-filter-change",{filters:{...this._filters}});const o=this.shadowRoot?.querySelector("tbody");if(o){const i=this._effectiveColumns(),n=this._readStickyColumns();this._lastStickyIndex=this._computeLastStickyIndex(i,n),this._paintBody(o,i,n),this._applyStickyOffsets()}}_onRowClick(e,t,s){const o=s.composedPath?.()??[];for(const i of o){if(i instanceof Element&&i.hasAttribute("data-noclick"))return;if(i===this)break}this.emit("os-table-row-click",{row:e,index:t,originalEvent:s})}_toggleRow(e,t,s){s.stopPropagation();const o=this._expanded.has(e);o?this._expanded.delete(e):this._expanded.add(e),this.emit("os-table-expand-change",{row:t,index:e,expanded:!o}),this._schedulePaint()}_cycleSort(e){!this._sort||this._sort.key!==e?this._sort={key:e,direction:"asc"}:this._sort.direction==="asc"?this._sort={key:e,direction:"desc"}:this._sort=null,this.emit("os-table-sort-change",{sort:this._sort?{...this._sort}:null}),this._schedulePaint()}_emitSelectionChange(){this.emit("os-table-selection-change",{selection:Array.from(this._selection),rows:this.selectedRows})}_filteredRows(){const e=[],t=Object.keys(this._filters).filter(s=>this._filters[s]!=="");for(let s=0;s<this._data.length;s++){const o=this._data[s];let i=!0;for(const n of t){const a=this._columns.find(h=>h.key===n);if(a&&typeof a.filterRender=="function")continue;const l=this._filters[n]??"",c=o[n],u=uo(c);if(a?.filter==="select"){if(u!==l){i=!1;break}}else if(!u.toLowerCase().includes(l.toLowerCase())){i=!1;break}}i&&e.push({row:o,index:s})}return e}_sortedRows(e){if(!this._sort)return e;const t=this._columns.find(i=>i.key===this._sort.key);if(!t)return e;const s=this._sort.direction==="desc"?-1:1,o=e.slice();return o.sort((i,n)=>{const a=i.row[t.key],l=n.row[t.key],c=t.sortValue?t.sortValue(i.row,a):Xi(a),u=t.sortValue?t.sortValue(n.row,l):Xi(l);return bl(c,u)*s}),o}_uniqueValues(e){const t=new Set;for(const s of this._data){const o=s[e];o!=null&&t.add(uo(o))}return Array.from(t).sort()}_visibleSelectionStats(){let e=0,t=0;for(const{row:s,index:o}of this._filteredRows())e++,this._selection.has(this._getRowId(s,o))&&t++;return{total:e,selected:t}}_readStickyColumns(){const e=parseInt(this.getAttribute("sticky-columns")||"0",10);return Number.isFinite(e)&&e>0?e:0}_readLoadingRows(){const e=parseInt(this.getAttribute("loading-rows")||"5",10);return Number.isFinite(e)&&e>0?Math.min(e,100):5}_readSelectable(){const e=this.getAttribute("selectable");return e==="single"?"single":e==="multi"||e===""?"multi":null}_isStickyIndex(e,t,s){return this._stacked||s.sticky===!1?!1:s.sticky===!0?!0:e<t}_computeLastStickyIndex(e,t){let s=-1;for(let o=0;o<e.length;o++)this._isStickyIndex(o,t,e[o])&&(s=o);return s}_applyCellClasses(e,t,s,o){t.key===ee&&e.classList.add("col-expander"),t.key===te&&e.classList.add("col-select"),t.align==="center"&&e.classList.add("align-center"),t.align==="end"&&e.classList.add("align-end"),this._isStickyIndex(s,o,t)&&(e.classList.add("is-sticky"),s===this._lastStickyIndex&&e.classList.add("is-sticky-edge"))}_effectiveColumns(){const e=[];return this._readSelectable()&&e.push({key:te,label:"",width:"40px",align:"center"}),this._subTable&&e.push({key:ee,label:"",width:"36px",align:"center"}),e.push(...this._columns),e}_applyStickyOffsets(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("thead tr");if(!t)return;const s=Array.from(t.children),o=[];let i=0;for(let a=0;a<s.length;a++)o[a]=i,s[a].classList.contains("is-sticky")&&(i+=s[a].offsetWidth);e.querySelectorAll("thead tr, tbody tr:not(.subtable):not(.empty):not(.skeleton)").forEach(a=>{const l=Array.from(a.children);for(let c=0;c<l.length;c++)l[c].classList.contains("is-sticky")&&(l[c].style.insetInlineStart=`${o[c]}px`)}),this._maybeWarnStickyOffsetRace(s,o)}_maybeWarnStickyOffsetRace(e,t){if(this._stickyRaceWarned)return;const s=this._readStickyColumns();if(s<2)return;const o=Math.min(s-1,e.length-1);if(o<=0||t[o]!==0||this.offsetWidth===0)return;this._stickyRaceWarned=!0;const i=e[0]?.offsetWidth??0;console.warn(`[os-table] sticky-columns: column ${o} resolved to inset-inline-start: 0px while the host is visible. ths[0].offsetWidth was ${i}px at measurement time. Likely a layout race — call recomputeLayout() after the panel finishes its mount/transition, or wrap the assignment of \`data\` in a requestAnimationFrame.`)}_measureHeaderHeight(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("thead tr");if(!t)return;const s=t.offsetHeight;s>0&&this.style.setProperty("--os-ui-table-header-height",`${s}px`)}_maybeWarnStickyHeader(){if(this._stickyHeaderWarned||!this.hasAttribute("sticky-header")||this.hasAttribute("loading")||this._data.length<8)return;const e=this.shadowRoot?.querySelector(".scroll");e&&e.offsetWidth!==0&&e.scrollHeight<=e.clientHeight+1&&(this._stickyHeaderWarned=!0,console.warn("[os-table] sticky-header is set but the table has no scroll container. Set --os-ui-table-max-height on the host (or wrap it in a scrolling parent) so the header has something to stick to."))}};at.props=["stickyColumns","stickyHeader","striped","hover","compact","bordered","empty","loading","loadingRows","selectable","stacked"],at.styles=[pl],at.help=void 0;let co=at;function Wi(r){return!!r&&r.__wpdHtml===!0}function gl(r,e){return r.stack?r.stack:e===0?"title":r.label?"meta":"actions"}function Kt(r){return r&&typeof r=="object"&&typeof r.slot=="string"?r.slot:null}function uo(r){if(r==null)return"";if(Kt(r)!==null){const e=r.text;return e==null?"":String(e)}return String(r)}function Xi(r){return Kt(r)!==null?uo(r):r}function bl(r,e){if(r===e)return 0;if(r==null)return-1;if(e==null)return 1;if(typeof r=="number"&&typeof e=="number")return r-e;if(r instanceof Date&&e instanceof Date)return r.getTime()-e.getTime();const t=Number(r),s=Number(e);return Number.isFinite(t)&&Number.isFinite(s)?t-s:String(r).localeCompare(String(e))}v("os-table",co);const fl=b`:host{display:inline-block;--_color:var( --os-ui-spinner-color,var( --wp-admin-theme-color,#21759b ) );--_accent:var( --os-ui-spinner-accent,var( --os-ui-fg-on-accent,#fff ) );--_size:var( --os-ui-spinner-size,48px );width:var( --_size );height:var( --_size );color:var( --_color );vertical-align:middle;line-height:0}:host( [ hidden ] ){display:none}:host( [ preset='inline' ] ){--os-ui-spinner-color:currentColor;--os-ui-spinner-size:16px}.root,.root svg{display:block;width:100%;height:100%}.root svg .mark{fill:var( --_accent )}@keyframes os-spinner-spin{to{transform:rotate( 360deg )}}@keyframes os-spinner-scale{0%,100%{transform:scale( 1 )}50%{transform:scale( 1.045 )}}@keyframes os-spinner-opacity{0%,100%{opacity:1}50%{opacity:0.7}}@media ( prefers-reduced-motion:reduce ){.root svg [ style*='animation' ]{animation:none !important}}`,Gi=Object.freeze({classic:{sp1:12,sp2:24,sp3:40,a1:28,a2:15,a3:8,gap:4,dir2:1,dir3:-1,pulse:"none",dots:0},comet:{sp1:8,sp2:14,sp3:26,a1:50,a2:28,a3:12,gap:3,dir2:1,dir3:1,pulse:"none",dots:5},orbit:{sp1:10,sp2:10,sp3:32,a1:50,a2:50,a3:8,gap:5,dir2:-1,dir3:-1,pulse:"opacity",dots:3},pulse:{sp1:6,sp2:18,sp3:30,a1:20,a2:12,a3:6,gap:4,dir2:1,dir3:-1,pulse:"both",dots:8},inline:{sp1:8,sp2:8,sp3:8,a1:25,a2:25,a3:25,gap:0,dir2:1,dir3:1,pulse:"none",dots:0}}),T=61.26,D=61.26,Zi=58.453,ml='<path d="m8.708 61.26c0 20.802 12.089 38.779 29.619 47.298l-25.069-68.686c-2.916 6.536-4.55 13.769-4.55 21.388z"/><path d="m96.74 58.608c0-6.495-2.333-10.993-4.334-14.494-2.664-4.329-5.161-7.995-5.161-12.324 0-4.831 3.664-9.328 8.825-9.328.233 0 .454.029.681.042-9.35-8.566-21.807-13.796-35.489-13.796-18.36 0-34.513 9.42-43.91 23.688 1.233.037 2.395.063 3.382.063 5.497 0 14.006-.667 14.006-.667 2.833-.167 3.167 3.994.337 4.329 0 0-2.847.335-6.015.501l19.138 56.925 11.501-34.493-8.188-22.434c-2.83-.166-5.511-.501-5.511-.501-2.832-.166-2.5-4.496.332-4.329 0 0 8.679.667 13.843.667 5.496 0 14.006-.667 14.006-.667 2.835-.167 3.168 3.994.337 4.329 0 0-2.853.335-6.015.501l18.992 56.494 5.242-17.517c2.272-7.269 4.001-12.49 4.001-16.989z"/><path d="m62.184 65.857-15.768 45.819c4.708 1.384 9.687 2.141 14.846 2.141 6.12 0 11.989-1.058 17.452-2.979-.141-.225-.269-.464-.374-.724z"/><path d="m107.376 36.046c.226 1.674.354 3.471.354 5.404 0 5.333-.996 11.328-3.996 18.824l-16.053 46.413c15.624-9.111 26.133-26.038 26.133-45.426.001-9.137-2.333-17.729-6.438-25.215z"/>',lt=class lt extends m{constructor(){super(...arguments),this._paintScheduled=!1}connectedCallback(){super.connectedCallback(),this._schedulePaint()}render(){return d`<div class="root" part="root"></div>`}requestUpdate(){super.requestUpdate(),this._schedulePaint()}_schedulePaint(){this._paintScheduled||!this.isConnected||(this._paintScheduled=!0,queueMicrotask(()=>{this._paintScheduled=!1,this.isConnected&&this._paint()}))}_paint(){this._syncCssVars();const e=this.shadowRoot?.querySelector(".root");e&&(e.innerHTML=this._buildSvg())}_syncCssVars(){const e=(t,s,o)=>{const i=this.getAttribute(t);i===null?this.style.removeProperty(s):this.style.setProperty(s,o?o(i):i)};e("color","--os-ui-spinner-color"),e("accent","--os-ui-spinner-accent"),e("size","--os-ui-spinner-size",t=>/^-?\d+(\.\d+)?$/.test(t.trim())?`${t}px`:t)}_effectiveConfig(){const e=this.getAttribute("preset")??"classic",t=Gi[e]??Gi.classic,s=(n,a)=>{const l=this.getAttribute(n);if(l===null)return a;const c=parseFloat(l);return Number.isFinite(c)?c:a},o=(n,a)=>{const l=this.getAttribute(n);if(l===null)return a;const c=l.toLowerCase();return c==="-1"||c==="ccw"||c==="reverse"?-1:1},i=()=>{const n=this.getAttribute("pulse");return n==="scale"||n==="opacity"||n==="both"||n==="none"?n:t.pulse};return{sp1:s("sp1",t.sp1),sp2:s("sp2",t.sp2),sp3:s("sp3",t.sp3),a1:s("a1",t.a1),a2:s("a2",t.a2),a3:s("a3",t.a3),gap:s("gap",t.gap),dir2:o("dir2",t.dir2),dir3:o("dir3",t.dir3),pulse:i(),dots:Math.max(0,Math.floor(s("dots",t.dots)))}}_buildInlineSvg(e){const t=Yi(this.getAttribute("label")??"Loading"),s=9,o=(e.sp1/10).toFixed(2);return`<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-label="${t}"><circle cx="12" cy="12" r="${s}" fill="none" stroke="currentColor" stroke-width="2.4" stroke-opacity="0.22"/><circle cx="12" cy="12" r="${s}" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-dasharray="${Vt(s,e.a1)}" style="transform-origin:12px 12px;animation: os-spinner-spin ${o}s linear infinite"/></svg>`}_buildSvg(){const e=this._effectiveConfig();if(this.getAttribute("preset")==="inline")return this._buildInlineSvg(e);const t=Yi(this.getAttribute("label")??"Loading"),s=e.gap*3+14,o=-s,i=122.52+s*2,n=Zi+e.gap+2,a=n+e.gap+2,l=a+e.gap+1.5,c=`animation: os-spinner-spin ${(e.sp1/10).toFixed(2)}s linear infinite`,u=`animation: os-spinner-spin ${(e.sp2/10).toFixed(2)}s linear infinite${e.dir2<0?" reverse":""}`,h=`animation: os-spinner-spin ${(e.sp3/10).toFixed(2)}s linear infinite${e.dir3<0?" reverse":""}`,p=(e.sp1*1.8/10).toFixed(1),f=(e.sp1*2.3/10).toFixed(1);let g="";e.pulse==="scale"?g=`animation: os-spinner-scale ${p}s ease-in-out infinite`:e.pulse==="opacity"?g=`animation: os-spinner-opacity ${f}s ease-in-out infinite`:e.pulse==="both"&&(g=`animation: os-spinner-scale ${p}s ease-in-out infinite, os-spinner-opacity ${f}s ease-in-out infinite`);let x="";if(e.dots>0){const _=l+e.gap+1,y=2*Math.PI*_,w=1.6,S=(e.sp1*.65/10).toFixed(2);for(let z=0;z<e.dots;z++){const M=-(z/e.dots)*y;x+=`<circle cx="${T}" cy="${D}" r="${_.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="${w}" stroke-dasharray="${w.toFixed(2)} ${(y-w).toFixed(2)}" stroke-dashoffset="${M.toFixed(2)}" stroke-linecap="round" stroke-opacity="0.65" style="transform-origin:${T}px ${D}px;animation: os-spinner-spin ${S}s linear infinite"/>`}}return`<svg xmlns="http://www.w3.org/2000/svg" viewBox="${o} ${o} ${i} ${i}" role="img" aria-label="${t}"><g style="transform-origin:${T}px ${D}px${g?";"+g:""}"><circle cx="${T}" cy="${D}" r="${Zi}" fill="currentColor"/><g class="mark">${ml}</g></g><circle cx="${T}" cy="${D}" r="${n.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.6" stroke-opacity="0.2"/><circle cx="${T}" cy="${D}" r="${n.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="2.2" stroke-dasharray="${Vt(n,e.a1)}" stroke-linecap="round" style="transform-origin:${T}px ${D}px;${c}"/><circle cx="${T}" cy="${D}" r="${a.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.5" stroke-opacity="0.15"/><circle cx="${T}" cy="${D}" r="${a.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="1.6" stroke-opacity="0.8" stroke-dasharray="${Vt(a,e.a2)}" stroke-linecap="round" style="transform-origin:${T}px ${D}px;${u}"/><circle cx="${T}" cy="${D}" r="${l.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.4" stroke-opacity="0.12"/><circle cx="${T}" cy="${D}" r="${l.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="1.0" stroke-opacity="0.6" stroke-dasharray="${Vt(l,e.a3)}" stroke-linecap="round" style="transform-origin:${T}px ${D}px;${h}"/>`+x+"</svg>"}};lt.props=["preset","size","color","accent","sp1","sp2","sp3","a1","a2","a3","gap","dir2","dir3","pulse","dots","label"],lt.styles=[fl],lt.help=void 0;let ho=lt;function Vt(r,e){const t=2*Math.PI*r,s=e/100*t,o=t-s;return`${s.toFixed(2)} ${o.toFixed(2)}`}function Yi(r){return String(r).replace(/&/g,"&").replace(/"/g,""").replace(/</g,"<").replace(/>/g,">")}v("os-spinner",ho);const vl=b`:host{display:inline;color:inherit;font:inherit}`,jt=new Set;let ne=null;const _l=3e4;function xl(){ne===null&&(ne=window.setInterval(()=>{for(const r of jt)r.tick()},_l))}function yl(){ne!==null&&jt.size===0&&(window.clearInterval(ne),ne=null)}function wl(r){if(!r)return null;const e=t=>{const s=new Date(t);return Number.isNaN(s.getTime())?null:s};return kl(r)?e(r):e(r.replace(" ","T")+"Z")}function kl(r){const e=Math.max(r.indexOf("T"),r.indexOf(" ")),t=e===-1?"":r.slice(e+1);return/(?:[Zz]|[+-]\d{2}:?\d{2})$/.test(t)}let po=null,go=null;function Qi(){return typeof navigator<"u"&&navigator.language||"en"}function $l(){return po||(po=new Intl.RelativeTimeFormat(Qi(),{numeric:"auto"})),po}function Ji(){return go||(go=new Intl.RelativeTimeFormat(Qi(),{numeric:"always",style:"narrow"})),go}function Cl(r,e){const t=$l(),s=r.getTime()-e,o=Math.round(s/1e3),i=Math.abs;return i(o)<45?t.format(0,"second"):Oi(t,o)}function Oi(r,e){const t=Math.abs,s=Math.round(e/60);if(t(s)<45)return r.format(s,"minute");const o=Math.round(s/60);if(t(o)<22)return r.format(o,"hour");const i=Math.round(o/24);if(t(i)<26)return r.format(i,"day");const n=Math.round(i/30);if(t(n)<11)return r.format(n,"month");const a=Math.round(i/365);return r.format(a,"year")}function Al(r,e){const t=Math.round((r.getTime()-e)/1e3),s=Math.abs;return s(t)<45?Ji().format(0,"second"):s(t)>7*24*60*60?r.toLocaleDateString(void 0,{month:"short",day:"numeric"}):Oi(Ji(),t)}const ct=class ct extends m{connectedCallback(){super.connectedCallback(),jt.add(this),xl()}disconnectedCallback(){jt.delete(this),yl()}tick(){this.requestUpdate()}render(){const e=this.datetime,t=wl(e);if(!t)return d`<span>${e??""}</span>`;const s=Date.now(),o=this.hasAttribute("compact")?Al(t,s):Cl(t,s),i=t.toLocaleString();return d`<time datetime=${t.toISOString()} title=${i} |
| 872 |
>${o}</time |
| 873 |
>`}};ct.props=["datetime","compact"],ct.styles=[vl],ct.help=void 0;let bo=ct;v("os-relative-time",bo);const Sl=b`:host{display:block;position:relative;color:var( --os-ui-fg,#1d2327 );font-family:var( --os-ui-font,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif );font-size:12px}.head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-block-end:6px}:host(:not( [legend] ):not( [heading] ) ) .head{display:none}.heading{margin:0;font-size:13px;font-weight:600;color:var( --os-ui-fg,#1d2327 )}.heading[hidden]{display:none}.legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-inline-start:auto}:host(:not( [legend] ) ) .legend{display:none}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border:1px solid var( --os-ui-border,#dcdcde );border-radius:999px;background:transparent;color:var( --os-ui-fg-muted,#646970 );font:inherit;cursor:pointer;transition:opacity 0.12s ease,border-color 0.12s ease}.chip[aria-pressed='false']{opacity:0.45}.chip:hover{border-color:var( --os-ui-border-strong,#8c8f94 );color:var( --os-ui-fg,#1d2327 )}.chip:focus-visible{outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:1px}.count{font-variant-numeric:tabular-nums;color:var( --os-ui-fg,#1d2327 )}.swatch{display:inline-block;width:10px;height:10px;border-radius:3px;flex:none}.swatch,.seg{background:var( --_tone );fill:var( --_tone )}[data-tone='danger']{--_tone:var( --os-ui-danger,#d63638 )}[data-tone='warning']{--_tone:var( --os-ui-warning,#dba617 )}[data-tone='info']{--_tone:var( --os-ui-info-fg,#72aee6 )}[data-tone='success']{--_tone:var( --os-ui-success,#00a32a )}[data-tone='accent']{--_tone:var( --os-ui-accent,#2271b1 )}[data-tone='neutral']{--_tone:var( --os-ui-fg-muted,#646970 )}.chart{position:relative}svg{display:block;inline-size:100%}.grid{stroke:var( --os-ui-border,#dcdcde );stroke-width:1}.tick{fill:var( --os-ui-fg-muted,#646970 );font-size:10px;font-variant-numeric:tabular-nums}.hit{fill:transparent;cursor:crosshair}.hover{fill:var( --os-ui-surface-raised,rgba( 0,0,0,0.04 ) );pointer-events:none}.empty{padding:40px 0;text-align:center;font-size:13px;color:var( --os-ui-fg-muted,#646970 )}.tooltip{position:absolute;inset-block-start:4px;transform:translateX( -50% );min-inline-size:150px;padding:8px 10px;border-radius:6px;border:1px solid var( --os-ui-border,#dcdcde );background:var( --os-ui-surface-elevated,#fff );box-shadow:var( --os-ui-shadow,0 2px 8px rgba( 0,0,0,0.15 ) );pointer-events:none;z-index:2}.tooltip[hidden]{display:none}.tooltip-head{margin-block-end:6px;color:var( --os-ui-fg-muted,#646970 );font-size:11px}.tooltip-row{display:flex;align-items:center;gap:6px;line-height:1.6}.tooltip-label{flex:1}.tooltip-value{font-variant-numeric:tabular-nums;font-weight:600}`,zl="http://www.w3.org/2000/svg",ae=8,El=20,N=8,Ll=40,Ml=24,fo=2,Rl=150,Il=new Set(["danger","warning","info","success","accent","neutral"]);function er(r,e){if(!r)return e;try{return JSON.parse(r)}catch{return e}}function Pl(r){if(r<=5)return Math.max(1,r);const e=Math.pow(10,Math.floor(Math.log10(r)));for(const t of[1,2,5,10])if(t*e>=r)return t*e;return 10*e}function Z(r,e){const t=document.createElementNS(zl,r);for(const[s,o]of Object.entries(e))t.setAttribute(s,o);return t}function Tl(r,e,t,s){const o=Math.min(3,s/2,t/2);return`M ${r} ${e+s} L ${r} ${e+o} Q ${r} ${e} ${r+o} ${e} L ${r+t-o} ${e} Q ${r+t} ${e} ${r+t} ${e+o} L ${r+t} ${e+s} Z`}const dt=class dt extends m{constructor(){super(...arguments),this._resize=null,this._tooltip=null}connectedCallback(){super.connectedCallback(),typeof ResizeObserver<"u"&&(this._resize=new ResizeObserver(()=>this.paint()),this._resize.observe(this))}disconnectedCallback(){this._resize?.disconnect(),this._resize=null}requestUpdate(){super.requestUpdate(),queueMicrotask(()=>this.paint())}get seriesList(){const e=er(this.getAttribute("series"),[]);return Array.isArray(e)?e.filter(t=>!!t&&typeof t=="object"&&typeof t.key=="string").map(t=>({key:t.key,label:typeof t.label=="string"?t.label:t.key,tone:t.tone&&Il.has(t.tone)?t.tone:"neutral"})):[]}get columnList(){const e=er(this.getAttribute("columns"),[]);return Array.isArray(e)?e.map(t=>Array.isArray(t)?t.map(s=>Number.isFinite(Number(s))?Math.max(0,Number(s)):0):[]):[]}get hiddenSet(){return new Set((this.getAttribute("hidden-series")??"").split(",").map(e=>e.trim()).filter(e=>e!==""))}totals(){const e=this.seriesList,t=e.map(()=>0);for(const s of this.columnList)e.forEach((o,i)=>{t[i]+=s[i]??0});return t}toggleSeries(e){const t=this.hiddenSet;t.has(e)?t.delete(e):t.add(e);const s=Array.from(t);s.length>0?this.setAttribute("hidden-series",s.join(",")):this.removeAttribute("hidden-series"),this.emit("os-series-toggle",{key:e,hidden:s})}render(){const e=this.seriesList,t=this.totals(),s=this.hiddenSet,o=this.getAttribute("heading")??"";return d` |
| 874 |
<div class="head" part="head"> |
| 875 |
<h2 class="heading" part="heading" ?hidden=${o===""}>${o}</h2> |
| 876 |
<div class="legend" part="legend" role="group"> |
| 877 |
${e.map((i,n)=>d` |
| 878 |
<button |
| 879 |
type="button" |
| 880 |
class="chip" |
| 881 |
data-tone=${i.tone??"neutral"} |
| 882 |
aria-pressed=${s.has(i.key)?"false":"true"} |
| 883 |
@click=${()=>this.toggleSeries(i.key)} |
| 884 |
> |
| 885 |
<span class="swatch"></span> |
| 886 |
<span class="label">${i.label}</span> |
| 887 |
<span class="count">${t[n].toLocaleString()}</span> |
| 888 |
</button> |
| 889 |
`)} |
| 890 |
</div> |
| 891 |
</div> |
| 892 |
<div class="chart" part="chart"></div> |
| 893 |
<div class="tooltip" part="tooltip" hidden></div> |
| 894 |
`}paint(){const e=this.shadowRoot,t=e?.querySelector(".chart"),s=e?.querySelector(".tooltip");if(!t||!s)return;this._tooltip=s,s.hidden=!0,t.textContent="";const o=this.columnList,i=o.some(C=>C.some(L=>L>0));if(o.length===0||!i){const C=document.createElement("div");C.className="empty",C.textContent=this.getAttribute("empty")??"",t.appendChild(C);return}const n=this.seriesList,a=this.hiddenSet,l=n.map((C,L)=>a.has(C.key)?-1:L).filter(C=>C>=0),c=parseInt(this.getAttribute("height")??"",10),u=Number.isFinite(c)&&c>40?c:Rl,h=Math.max(280,this.clientWidth||640),p=h-N-Ll,f=u-ae-El,g=o.length,x=p/g,_=Math.max(2,Math.min(Ml,x-fo)),y=o.reduce((C,L)=>{const K=l.reduce((V,Zt)=>V+(L[Zt]??0),0);return Math.max(C,K)},0),w=Pl(y),S=f/w,z=Z("svg",{width:String(h),height:String(u),viewBox:`0 0 ${h} ${u}`,role:"img"});for(const C of[0,.5,1]){const L=w*C,K=ae+f-L*S;z.appendChild(Z("line",{class:"grid",x1:String(N),y1:String(K),x2:String(N+p),y2:String(K)}));const V=Z("text",{class:"tick",x:String(N+p+6),y:String(K+3.5)});V.textContent=Number.isInteger(L)?L.toLocaleString():String(L),z.appendChild(V)}const M=Number(this.getAttribute("start"))||0,A=Number(this.getAttribute("end"))||M+g,U=Math.max(1,(A-M)/g),fr=A-M>36*3600,Et=C=>new Date(C*1e3).toLocaleString([],fr?{month:"short",day:"numeric"}:{hour:"2-digit",minute:"2-digit"}),Q=C=>new Date(C*1e3).toLocaleString([],{month:"short",day:"numeric",hour:"2-digit",minute:"2-digit"}),Cc=[[M,N,"start"],[M+(A-M)/2,N+p/2,"middle"],[A,N+p,"end"]];for(const[C,L,K]of Cc){const V=Z("text",{class:"tick",x:String(L),y:String(u-5),"text-anchor":K});V.textContent=Et(C),z.appendChild(V)}const Gt=Z("rect",{class:"hover",y:String(ae),width:String(x),height:String(f),visibility:"hidden"});z.appendChild(Gt),o.forEach((C,L)=>{const K=N+L*x+(x-_)/2;let V=ae+f;const Zt=l.filter(Lt=>(C[Lt]??0)>0),Ac=Zt[Zt.length-1];for(const Lt of l){const mr=C[Lt]??0;if(mr===0)continue;const vr=n[Lt].tone??"neutral",No=mr*S,Ho=V-No;Lt===Ac?z.appendChild(Z("path",{class:"seg","data-tone":vr,d:Tl(K,Ho,_,Math.max(1.5,No))})):z.appendChild(Z("rect",{class:"seg","data-tone":vr,x:String(K),y:String(Ho+fo),width:String(_),height:String(Math.max(1.5,No-fo))})),V=Ho}const qo=Z("rect",{class:"hit",x:String(N+L*x),y:String(ae),width:String(x),height:String(f)});qo.addEventListener("pointerenter",()=>{Gt.setAttribute("x",String(N+L*x)),Gt.setAttribute("visibility","visible"),this.showTooltip(L,C,x,h,{head:`${Q(M+L*U)} – ${Et(M+(L+1)*U)}`,series:n,visibleIndexes:l})}),qo.addEventListener("pointerleave",()=>{Gt.setAttribute("visibility","hidden"),s.hidden=!0}),z.appendChild(qo)}),t.appendChild(z)}showTooltip(e,t,s,o,i){const n=this._tooltip;if(!n)return;n.textContent="";const a=document.createElement("div");a.className="tooltip-head",a.textContent=i.head,n.appendChild(a);let l=0;for(const u of[...i.visibleIndexes].reverse()){const h=t[u]??0;if(h===0)continue;l++;const p=document.createElement("div");p.className="tooltip-row";const f=document.createElement("span");f.className="swatch",f.dataset.tone=i.series[u].tone??"neutral";const g=document.createElement("span");g.className="tooltip-label",g.textContent=i.series[u].label;const x=document.createElement("span");x.className="tooltip-value",x.textContent=h.toLocaleString(),p.append(f,g,x),n.appendChild(p)}if(l===0){const u=document.createElement("div");u.className="tooltip-row",u.textContent="—",n.appendChild(u)}n.hidden=!1;const c=N+e*s+s/2;n.style.left=`${Math.max(60,Math.min(c,o-60))}px`}};dt.props=["heading","series","columns","start","end","hidden-series","legend","empty","height"],dt.styles=[Sl],dt.help=void 0;let mo=dt;v("os-histogram",mo);const Dl=b`:host{--_gap-row:var( --os-ui-facts-row-gap,6px );--_gap-column:var( --os-ui-facts-column-gap,14px );display:block;font-size:var( --os-ui-facts-font-size,13px );min-inline-size:0}:host( [ hidden ] ){display:none}dl{display:grid;grid-template-columns:max-content minmax( 0,1fr );gap:var( --_gap-row ) var( --_gap-column );align-items:var( --os-ui-facts-align,baseline );margin:0}:host( [ layout='between' ] ) dl{display:block}:host( [ layout='between' ] )::slotted( os-fact ){display:flex;justify-content:space-between;gap:var( --_gap-column );margin-block:var( --_gap-row )}:host( [ stacked ] ) dl{display:block}:host( [ stacked ] )::slotted( os-fact ){display:block;margin-block:var( --_gap-row )}`,ql=b`:host{display:contents}:host( [ hidden ] ){display:none}dt{color:var( --os-ui-facts-label-color,var( --os-ui-fg-muted,#646970 ) )}dd{margin:0;overflow-wrap:anywhere}::slotted( os-code ){--os-ui-code-bg:var( --os-ui-facts-code-bg,transparent );--os-ui-code-border:var( --os-ui-facts-code-border,none );--os-ui-code-padding:var( --os-ui-facts-code-padding,0 );--os-ui-code-font-size:var( --os-ui-facts-code-font-size,1em )}`,ut=class ut extends m{render(){const e=this.label||"";return d` |
| 895 |
<dt part="label"><slot name="label">${e}</slot></dt> |
| 896 |
<dd part="value"><slot></slot></dd> |
| 897 |
`}};ut.props=["label"],ut.styles=[ql],ut.help=void 0;let vo=ut;v("os-fact",vo);const ht=class ht extends m{render(){return d`<dl part="list"><slot></slot></dl>`}};ht.props=["layout"],ht.styles=[Dl],ht.help={title:"Facts",summary:'Label/value list — a real <dl> whose rows are <os-fact> children. Labels sit in a content-sized column beside their values; `layout="between"` spreads each pair across its own line and `stacked` puts the label above the value.',status:"stable",props:[{name:"layout",type:"'columns' | 'between'",description:"`columns` (default) aligns every value in one column. `between` gives each pair its own line with the value pushed to the far edge."},{name:"stacked",type:"boolean",description:"Label above the value rather than beside it, for a narrow pane."}],slots:[{name:"(default)",description:"<os-fact> children."}],cssProps:[{name:"--os-ui-facts-font-size",default:"13px"},{name:"--os-ui-facts-row-gap",default:"6px"},{name:"--os-ui-facts-column-gap",default:"14px"},{name:"--os-ui-facts-label-color",default:"var(--os-ui-fg-muted, #646970)"},{name:"--os-ui-facts-align",default:"baseline"}],example:d` |
| 898 |
<os-facts> |
| 899 |
<os-fact label="File">class-foo.php</os-fact> |
| 900 |
<os-fact label="Source">Plugin: Akismet</os-fact> |
| 901 |
<os-fact label="Occurrences">1,204</os-fact> |
| 902 |
</os-facts> |
| 903 |
`};let _o=ht;v("os-facts",_o);const Nl=b`:host{--_border:var( --os-ui-stat-border,var( --os-ui-border,#dcdcde ) );--_bg:var( --os-ui-stat-bg,transparent );--_value-color:var( --os-ui-stat-value-color,var( --wp-admin-theme-color,#2271b1 ) );--_value-size:var( --os-ui-stat-value-size,20px );--_label-color:var( --os-ui-stat-label-color,var( --os-ui-fg-muted,#646970 ) );display:flex;flex-direction:column;gap:2px;padding:var( --os-ui-stat-padding,10px 12px );border:1px solid var( --_border );border-radius:var( --os-ui-stat-radius,8px );background:var( --_bg );min-inline-size:0}:host( [ hidden ] ){display:none}.value{font-size:var( --_value-size );font-weight:700;line-height:1.1;color:var( --_value-color );font-variant-numeric:tabular-nums}.label{display:inline-flex;align-items:center;gap:6px;font-size:11px;letter-spacing:0.05em;text-transform:uppercase;color:var( --_label-color )}.caption{font-size:11px;color:var( --_label-color )}.swatch{display:inline-block;inline-size:10px;block-size:10px;border-radius:3px;flex:none;background:var( --os-app-tone,var( --os-ui-fg-muted,#646970 ) )}`,pt=class pt extends m{render(){const e=this,t=e.caption||"";return d` |
| 904 |
<span class="value" part="value">${e.value||""}</span> |
| 905 |
<span class="label" part="label"> |
| 906 |
${this.hasAttribute("swatch")?d`<i class="swatch" aria-hidden="true"></i>`:""} |
| 907 |
${e.label||""} |
| 908 |
</span> |
| 909 |
${t?d`<span class="caption" part="caption">${t}</span>`:""} |
| 910 |
`}};pt.props=["value","label","caption","swatch"],pt.styles=[Nl],pt.help=void 0;let xo=pt;v("os-stat",xo);const Hl=b`:host{display:inline-flex;position:relative;width:var( --os-ui-avatar-size,32px );height:var( --os-ui-avatar-size,32px );flex:0 0 auto;vertical-align:middle;line-height:0;perspective:calc( var( --os-ui-avatar-size,32px ) * 8 );--os-ui-avatar-tilt-x:0deg;--os-ui-avatar-tilt-y:0deg;--os-ui-avatar-hover:0;--os-ui-avatar-glare-x:50%;--os-ui-avatar-glare-y:50%}:host( [ hidden ] ){display:none}.os-avatar__tile{position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;background:var( --os-window-bg,#f0f0f1 );color:var( --os-ui-fg-on-accent,#fff );display:flex;align-items:center;justify-content:center;font-weight:700;font-size:calc( var( --os-ui-avatar-size,32px ) * 0.48 );line-height:1;letter-spacing:0;font-feature-settings:'tnum' 1;user-select:none;transform-style:preserve-3d;transform:rotateX( var( --os-ui-avatar-tilt-x ) ) rotateY( var( --os-ui-avatar-tilt-y ) ) scale( calc( 1 + var( --os-ui-avatar-hover ) * 0.07 ) );transition:transform 220ms cubic-bezier( 0.2,0.8,0.2,1 ),box-shadow 220ms cubic-bezier( 0.2,0.8,0.2,1 );box-shadow:inset 0 0 0 1px rgba( 255,255,255,calc( 0.18 + 0.22 * var( --os-ui-avatar-hover ) ) ),inset 0 0 0 calc( 1px + var( --os-ui-avatar-hover ) * 1px ) rgba( 0,0,0,calc( 0.08 + 0.04 * var( --os-ui-avatar-hover ) ) ),0 calc( 1px + var( --os-ui-avatar-hover ) * 8px ) calc( 6px + var( --os-ui-avatar-hover ) * 18px ) rgba( 0,0,0,calc( 0.08 + 0.18 * var( --os-ui-avatar-hover ) ) )}.os-avatar__tile::after{content:'';position:absolute;inset:0;border-radius:50%;background:radial-gradient( circle at var( --os-ui-avatar-glare-x ) var( --os-ui-avatar-glare-y ),var( --os-ui-scrim,rgba( 255,255,255,0.55 ) ) 0%,var( --os-ui-hover,rgba( 255,255,255,0 ) ) 55% );opacity:var( --os-ui-avatar-hover );mix-blend-mode:overlay;pointer-events:none;transition:opacity 220ms cubic-bezier( 0.2,0.8,0.2,1 )}.os-avatar__tile::before{content:'';position:absolute;inset:calc( var( --os-ui-avatar-hover ) * -3px );border-radius:50%;background:radial-gradient( circle at var( --os-ui-avatar-glare-x ) var( --os-ui-avatar-glare-y ),color-mix( in srgb,var( --os-ui-avatar-halo,rgb( 99,102,241 ) ) calc( 35% * var( --os-ui-avatar-hover ) ),transparent ) 0%,transparent 70% );filter:blur( 4px );pointer-events:none;z-index:-1;transition:inset 220ms cubic-bezier( 0.2,0.8,0.2,1 ),background 220ms}.os-avatar__tile img{width:calc( 100% + 2px );height:calc( 100% + 2px );margin:-1px;object-fit:cover;display:block;transform:translateZ( 1px )}.os-avatar__dot{position:absolute;bottom:0;inset-inline-end:0;width:calc( var( --os-ui-avatar-size,32px ) * 0.32 );height:calc( var( --os-ui-avatar-size,32px ) * 0.32 );min-width:8px;min-height:8px;border-radius:50%;box-sizing:border-box;border:2px solid var( --os-ui-avatar-dot-ring,var( --os-window-bg,#fff ) );background:var( --os-ui-avatar-dot-color,transparent );z-index:2}.os-avatar__dot--online{background:var( --os-ui-success-fg,#00a32a )}.os-avatar__dot--online::after{content:'';position:absolute;inset:-2px;border-radius:50%;border:1px solid var( --os-ui-success-fg,#00a32a );animation:os-avatar-presence 6s var( --os-ui-ease-out,cubic-bezier( 0.22,0.9,0.28,1 ) ) infinite;pointer-events:none}@keyframes os-avatar-presence{0%{opacity:0.6;transform:scale( 1 )}20%{opacity:0;transform:scale( 2.2 )}100%{opacity:0;transform:scale( 2.2 )}}.os-avatar__dot--inactive{background:var( --os-ui-warning-fg,#dba617 )}.os-avatar__dot--offline{background:var( --os-ui-fg-muted,#8c8f94 )}@media ( prefers-reduced-motion:reduce ){.os-avatar__dot--online::after{animation:none;opacity:0.6}.os-avatar__tile{transform:none;transition:box-shadow 200ms}.os-avatar__tile::after,.os-avatar__tile::before{display:none}}`,tr={xs:20,sm:24,md:40,lg:64,xl:96},sr=new Set(["online","inactive","offline"]),gt=class gt extends m{constructor(){super(...arguments),this._presenceHandler=null,this._imgFailed=!1,this._onPointerMove=null,this._onPointerEnter=null,this._onPointerLeave=null,this._tiltRaf=0,this._pendingTiltX="0deg",this._pendingTiltY="0deg",this._pendingGlareX="50%",this._pendingGlareY="50%"}connectedCallback(){super.connectedCallback(),this._maybeAttachPresenceListener(),this._attachHoverEffect()}disconnectedCallback(){this._presenceHandler&&(document.removeEventListener("os-presence-changed",this._presenceHandler),this._presenceHandler=null),this._detachHoverEffect()}attributeChangedCallback(e,t,s){super.attributeChangedCallback(e,t,s),e==="src"&&(this._imgFailed=!1),(e==="user-id"||e==="presence")&&this._maybeAttachPresenceListener()}render(){const e=this._attr("src"),t=this._attr("name")||"",s=this._attr("alt"),o=s!==null?s:t,i=this._attr("size"),n=this._resolveSize(i),a=this._presenceForRender(),l=this._attr("clickable")!==null;this.style.setProperty("--os-ui-avatar-size",`${n}px`);const c=e&&!this._imgFailed?"":this._initialsBg(t),u=e&&!this._imgFailed?d`<img |
| 911 |
src=${e} |
| 912 |
alt=${o} |
| 913 |
@error=${()=>this._onImgError()} |
| 914 |
loading="lazy" |
| 915 |
/>`:this._initials(t),h=a?d`<span |
| 916 |
class=${`os-avatar__dot os-avatar__dot--${a}`} |
| 917 |
aria-label=${this._presenceLabel(a)} |
| 918 |
></span>`:d``;return l?d` |
| 919 |
<button |
| 920 |
type="button" |
| 921 |
class="os-avatar__tile" |
| 922 |
aria-label=${o||"User"} |
| 923 |
style=${c?`background:${c};`:""} |
| 924 |
@click=${p=>this._onClick(p)} |
| 925 |
>${u}</button> |
| 926 |
${h} |
| 927 |
`:d` |
| 928 |
<div |
| 929 |
class="os-avatar__tile" |
| 930 |
role="img" |
| 931 |
aria-label=${o||"User"} |
| 932 |
style=${c?`background:${c};`:""} |
| 933 |
>${u}</div> |
| 934 |
${h} |
| 935 |
`}_attr(e){return this.getAttribute(e)}_resolveSize(e){if(!e)return 32;if(e in tr)return tr[e];const t=Number(e);return Number.isFinite(t)&&t>0?t:32}_initials(e){const t=e.trim();return t?Array.from(t)[0]?.toUpperCase()??"?":"?"}_initialsBg(e){const t=ui(e);return`linear-gradient(135deg, hsl(${t} 62% 55%), hsl(${(t+24)%360} 58% 42%))`}_presenceForRender(){const e=this._attr("presence");return e&&sr.has(e)?e:null}_presenceLabel(e){switch(e){case"online":return"Online";case"inactive":return"Inactive";case"offline":return"Offline"}}_onImgError(){this._imgFailed=!0,this.requestUpdate()}_onClick(e){const t=this._attr("user-id"),s={userId:t!==null&&Number(t)||null,originalEvent:e};this.emit("os-avatar-click",s)}_attachHoverEffect(){typeof window<"u"&&window.matchMedia?.("(prefers-reduced-motion: reduce)").matches||(this._onPointerEnter=()=>{this.style.setProperty("--os-ui-avatar-hover","1")},this._onPointerLeave=()=>{this.style.setProperty("--os-ui-avatar-hover","0"),this._pendingTiltX="0deg",this._pendingTiltY="0deg",this._pendingGlareX="50%",this._pendingGlareY="50%",this._flushTilt()},this._onPointerMove=t=>{const s=this.getBoundingClientRect();if(s.width===0||s.height===0)return;const o=(t.clientX-s.left)/s.width-.5,i=(t.clientY-s.top)/s.height-.5,n=14;this._pendingTiltY=`${(o*n).toFixed(2)}deg`,this._pendingTiltX=`${(-i*n).toFixed(2)}deg`;const a=Math.max(0,Math.min(100,(o+.5)*100)),l=Math.max(0,Math.min(100,(i+.5)*100));this._pendingGlareX=`${a.toFixed(1)}%`,this._pendingGlareY=`${l.toFixed(1)}%`,this._tiltRaf||(this._tiltRaf=requestAnimationFrame(()=>this._flushTilt()))},this.addEventListener("pointerenter",this._onPointerEnter),this.addEventListener("pointerleave",this._onPointerLeave),this.addEventListener("pointermove",this._onPointerMove))}_flushTilt(){this._tiltRaf=0,this.style.setProperty("--os-ui-avatar-tilt-x",this._pendingTiltX),this.style.setProperty("--os-ui-avatar-tilt-y",this._pendingTiltY),this.style.setProperty("--os-ui-avatar-glare-x",this._pendingGlareX),this.style.setProperty("--os-ui-avatar-glare-y",this._pendingGlareY)}_detachHoverEffect(){this._onPointerMove&&(this.removeEventListener("pointermove",this._onPointerMove),this._onPointerMove=null),this._onPointerEnter&&(this.removeEventListener("pointerenter",this._onPointerEnter),this._onPointerEnter=null),this._onPointerLeave&&(this.removeEventListener("pointerleave",this._onPointerLeave),this._onPointerLeave=null),this._tiltRaf&&(cancelAnimationFrame(this._tiltRaf),this._tiltRaf=0)}_maybeAttachPresenceListener(){const e=this._attr("user-id"),t=this._attr("presence"),s=!!e&&!t;s&&!this._presenceHandler?(this._presenceHandler=o=>{const i=o.detail;i&&String(i.userId)===String(e)&&i.newStatus&&sr.has(i.newStatus)&&this.setAttribute("presence",i.newStatus)},document.addEventListener("os-presence-changed",this._presenceHandler)):!s&&this._presenceHandler&&(document.removeEventListener("os-presence-changed",this._presenceHandler),this._presenceHandler=null)}};gt.props=["src","alt","name","size","presence","userId","clickable"],gt.styles=[Hl],gt.help=void 0;let yo=gt;v("os-avatar",yo);const Fl=b` ${$} ${es}:host{--_field-size:var( --os-ui-field-font-size,13px );--_field-radius:var( --os-ui-field-radius,6px );display:flex;flex-direction:column;gap:4px;font-size:var( --_field-size );color:var( --os-ui-fg,#1d2327 );min-width:0}:host( [ hidden ] ){display:none}.os-textarea__label{font-size:12px;color:var( --os-ui-fg-muted,#646970 )}textarea{appearance:none;-webkit-appearance:none;display:block;width:100%;min-width:0;box-sizing:border-box;padding:8px 10px;background:var( --os-window-bg,#fff );border:1px solid var( --os-ui-border,#dcdcde );border-radius:var( --_field-radius );font:inherit;font-size:var( --_field-size );line-height:1.45;color:var( --os-ui-fg,#1d2327 );resize:vertical}textarea:disabled{opacity:0.55;cursor:not-allowed;background:var( --os-ui-hover,rgba( 0,0,0,0.03 ) )}textarea[ aria-invalid='true' ],textarea[ aria-invalid='true' ]:hover:not(:disabled ){border-color:var( --os-ui-danger,#d63638 )}textarea[ aria-invalid='true' ]:focus,textarea[ aria-invalid='true' ]:focus-visible{border-color:var( --os-ui-danger,#d63638 );box-shadow:0 0 0 1px var( --os-ui-danger,#d63638 ),0 0 0 4px rgba( 214,54,56,0.18 )}:host( [ auto-grow ] ) textarea{resize:none;overflow:hidden}`,bt=class bt extends m{constructor(){super(...arguments),this._textareaEl=null}connectedCallback(){super.connectedCallback(),ie(this)}render(){const e=this._attr("label")||"",t=this._attr("value")??"",s=this._attr("placeholder")||"",o=this._boolAttr("disabled"),i=this._boolAttr("readonly"),n=this._attr("aria-label")||e,a=this._attr("name")||"",l=Number(this._attr("rows"))||3,c=this._attr("maxlength"),u=this._attr("minlength"),h=this._boolAttr("invalid"),f=`${this.id||"os-unnamed"}__field`;return d` |
| 936 |
${e?d`<label class="os-textarea__label" for=${f}>${e}</label>`:d``} |
| 937 |
<textarea |
| 938 |
id=${f} |
| 939 |
part="textarea" |
| 940 |
.value=${t} |
| 941 |
placeholder=${s} |
| 942 |
?disabled=${o} |
| 943 |
?readonly=${i} |
| 944 |
rows=${l} |
| 945 |
maxlength=${c??""} |
| 946 |
minlength=${u??""} |
| 947 |
name=${a} |
| 948 |
aria-invalid=${h?"true":"false"} |
| 949 |
aria-label=${n||""} |
| 950 |
@input=${g=>this._onInput(g)} |
| 951 |
@change=${g=>this._onChange(g)} |
| 952 |
@keydown=${g=>this._onKeyDown(g)} |
| 953 |
></textarea> |
| 954 |
`}_attr(e){return this.getAttribute(e)}_boolAttr(e){return this.getAttribute(e)!==null}_onInput(e){const t=e.target;this._textareaEl=t,this.setAttribute("value",t.value),this.emit("os-input-change",{value:t.value}),this._boolAttr("auto-grow")&&this._autosize(t)}_onChange(e){const t=e.target;this.emit("os-input-commit",{value:t.value})}_onKeyDown(e){if(!(!this._boolAttr("submit-on-enter")||e.isComposing||e.keyCode===229)&&e.key==="Enter"&&!e.shiftKey&&!e.altKey&&!e.metaKey&&!e.ctrlKey){e.preventDefault();const t=e.target;this.emit("os-submit",{value:t.value})}}_autosize(e){const t=Number(this._attr("max-rows"))||8,s=window.getComputedStyle(e),o=parseFloat(s.fontSize)||13,i=s.lineHeight,n=i==="normal"?o*1.45:parseFloat(i)||o*1.45,a=parseFloat(s.paddingTop)||0,l=parseFloat(s.paddingBottom)||0,c=(parseFloat(s.borderTopWidth)||0)+(parseFloat(s.borderBottomWidth)||0),u=n*t+a+l+c;e.style.height="auto",e.style.overflowY="hidden";const h=e.value?e.scrollHeight+c:n*(Number(this._attr("rows"))||3)+a+l+c,p=Math.min(h,u);e.style.height=`${Math.ceil(p)}px`,e.style.overflowY=h>Math.ceil(u)?"auto":"hidden"}refreshAutosize(){this._textareaEl&&this._boolAttr("auto-grow")&&this._autosize(this._textareaEl)}focusInput(){(this.shadowRoot??this).querySelector("textarea")?.focus()}clear(){this.setAttribute("value","");const t=(this.shadowRoot??this).querySelector("textarea");t&&(t.value="",this._boolAttr("auto-grow")&&this._autosize(t))}};bt.props=["label","value","placeholder","disabled","readonly","ariaLabel","name","rows","maxlength","minlength","invalid","autoGrow","maxRows","submitOnEnter"],bt.styles=[Fl],bt.help=void 0;let wo=bt;v("os-textarea",wo);const Ul=b` ${$}:host{display:inline-flex;max-width:100%;vertical-align:middle}:host( [ hidden ] ){display:none}.os-chip{display:inline-flex;align-items:center;gap:var( --os-ui-chip-gap,4px );padding:var( --os-ui-chip-padding,2px 8px );border-radius:var( --os-ui-chip-radius,999px );font-size:var( --os-ui-chip-font-size,12px );line-height:var( --os-ui-chip-line-height,1.6 );font-weight:var( --os-ui-chip-font-weight,500 );background:var( --os-ui-chip-bg,var( --os-ui-surface,#f0f0f1 ) );color:var( --os-ui-chip-fg,var( --os-ui-fg,#1d2327 ) );border:var( --os-ui-chip-border,1px solid transparent );max-width:100%;box-sizing:border-box;transition:background-color 0.12s ease,color 0.12s ease,border-color 0.12s ease,transform 0.12s ease,opacity 0.12s ease}:host( [ tone='accent' ] ) .os-chip{background:var( --os-ui-chip-bg,color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 14%,transparent ) );color:var( --os-ui-chip-fg,var( --wp-admin-theme-color,#2271b1 ) )}:host( [ tone='positive' ] ) .os-chip{background:var( --os-ui-chip-bg,rgba( 30,132,73,0.14 ) );color:var( --os-ui-chip-fg,var( --os-ui-success-fg,#1d6f42 ) )}:host( [ tone='warning' ] ) .os-chip{background:var( --os-ui-chip-bg,rgba( 217,119,6,0.18 ) );color:var( --os-ui-chip-fg,var( --os-ui-warning-fg,#8a4a06 ) )}:host( [ tone='danger' ] ) .os-chip{background:var( --os-ui-chip-bg,rgba( 214,54,56,0.14 ) );color:var( --os-ui-chip-fg,var( --os-ui-danger-hover,#a02622 ) )}:host( [ pending ] ) .os-chip{opacity:0.65;animation:os-chip-pulse 1.2s ease-in-out infinite}@keyframes os-chip-pulse{0%,100%{opacity:0.55}50%{opacity:0.95}}.os-chip__label{max-width:var( --os-ui-chip-label-max,220px );overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-chip__icon{display:inline-flex;align-items:center;flex-shrink:0}.os-chip__icon::slotted( * ){display:inline-flex}.os-chip__dismiss{appearance:none;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;margin-inline-start:2px;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer;opacity:0.55;transition:opacity 0.12s ease,background-color 0.12s ease}.os-chip__dismiss:hover,.os-chip__dismiss:focus-visible{opacity:1;background:var( --os-ui-hover,rgba( 0,0,0,0.12 ) );outline:none}.os-chip__dismiss:focus-visible{box-shadow:var( --_holo-focus )}.os-chip__dismiss[ disabled ]{opacity:0.35;cursor:not-allowed}.os-chip__dismiss svg{display:block;width:14px;height:14px}:host( [ disabled ] ) .os-chip{opacity:0.55;cursor:not-allowed}:host( [ size='compact' ] ) .os-chip{padding:var( --os-ui-chip-padding,1px 6px );font-size:var( --os-ui-chip-font-size,11px )}:host( [ selected ] ) .os-chip{position:relative;background:var( --os-ui-chip-bg,var( --os-ui-accent-soft,rgba( 34,113,177,0.14 ) ) );color:var( --os-ui-chip-fg,var( --os-ui-fg,#1d2327 ) )}:host( [ selected ] ) .os-chip::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background-image:var( --_holo-edge );pointer-events:none;-webkit-mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );-webkit-mask-composite:xor;mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );mask-composite:exclude}`,ft=class ft extends m{constructor(){super(...arguments),this._onHostKeyDown=e=>{if(this.dismissible!==null&&(e.key==="Backspace"||e.key==="Delete")){if(e.preventDefault(),this.disabled!==null)return;const o=this.label??"";this.emit("os-chip-dismiss",{label:o})}}}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this._onHostKeyDown)}disconnectedCallback(){this.removeEventListener("keydown",this._onHostKeyDown)}render(){const e=this.label??"",t=this.dismissible!==null,s=this.disabled!==null;return d` |
| 955 |
<span part="chip" class="os-chip"> |
| 956 |
<span class="os-chip__icon"> |
| 957 |
<slot name="icon"></slot> |
| 958 |
</span> |
| 959 |
<span class="os-chip__label"> |
| 960 |
${e===""?d`<slot></slot>`:e} |
| 961 |
</span> |
| 962 |
${t?d` |
| 963 |
<button |
| 964 |
part="dismiss" |
| 965 |
class="os-chip__dismiss" |
| 966 |
type="button" |
| 967 |
aria-label=${`Remove ${e||"chip"}`} |
| 968 |
?disabled=${s} |
| 969 |
@click=${o=>this._onDismiss(o)} |
| 970 |
> |
| 971 |
${I("close",{size:null})} |
| 972 |
</button> |
| 973 |
`:d``} |
| 974 |
</span> |
| 975 |
`}_onDismiss(e){if(e.stopPropagation(),this.disabled!==null)return;const s=this.label??"";this.emit("os-chip-dismiss",{label:s})}};ft.props=["label","tone","size","dismissible","disabled","pending","selected"],ft.styles=[Ul],ft.help=void 0;let ko=ft;v("os-chip",ko);const Kl=b`:host{display:inline-flex;max-width:100%}.os-tag-input{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var( --os-ui-tag-input-gap,4px );padding:var( --os-ui-tag-input-padding,2px );min-height:24px;max-width:100%}.os-tag-input__chips{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var( --os-ui-tag-input-gap,4px );min-width:0}.os-tag-input__add{appearance:none;display:inline-flex;align-items:center;gap:3px;padding:1px 8px;min-height:22px;font:inherit;font-size:11px;font-weight:500;line-height:1;color:var( --os-ui-tag-input-add-fg,var( --os-ui-fg-muted,#50575e ) );background:transparent;border:1px dashed var( --os-ui-tag-input-add-border,var( --os-ui-border,#c3c4c7 ) );border-radius:999px;cursor:pointer;transition:background-color 0.12s ease,color 0.12s ease,border-color 0.12s ease}.os-tag-input__add:hover:not(:disabled ){background:var( --os-ui-hover,rgba( 0,0,0,0.04 ) );color:var( --os-ui-tag-input-add-fg-hover,var( --os-ui-fg,#1d2327 ) );border-color:var( --os-ui-tag-input-add-border-hover,var( --os-ui-border-strong,#8c8f94 ) )}.os-tag-input__add:focus-visible{outline:none;border-style:solid;box-shadow:var( --os-ui-focus-ring,0 0 0 2px rgba( 12,11,15,0.9 ),0 0 0 4px #2271b1 )}.os-tag-input__add:disabled{opacity:0.5;cursor:not-allowed}.os-tag-input__add svg{display:block}.os-tag-input__editor{position:relative;display:inline-flex;align-items:center;flex:0 1 auto;min-width:120px}.os-tag-input__input{appearance:none;font:inherit;font-size:var( --os-ui-field-font-size-compact,12px );line-height:1.4;padding:2px 8px;border:1px solid var( --os-ui-tag-input-input-border,var( --os-ui-border,#2271b1 ) );border-radius:999px;background:var( --os-ui-tag-input-input-bg,var( --os-ui-surface,#fff ) );color:var( --os-ui-tag-input-input-fg,var( --os-ui-fg,#1d2327 ) );min-width:80px;max-width:240px}.os-tag-input__input:focus{outline:none;border-color:var( --os-ui-accent,#2271b1 );box-shadow:var( --os-ui-focus-ring-field,0 0 0 1px #2271b1,0 0 0 4px rgba( 34,113,177,0.18 ) )}.os-tag-input__suggestions{position:absolute;top:calc( 100% + 4px );left:0;min-width:220px;max-width:320px;max-height:240px;overflow-y:auto;padding:4px 0;background:var( --os-ui-tag-input-pop-bg,var( --os-ui-surface,#fff ) );color:var( --os-ui-tag-input-pop-fg,var( --os-ui-fg,#1d2327 ) );border:1px solid var( --os-ui-tag-input-pop-border,var( --os-ui-border,#c3c4c7 ) );border-radius:8px;box-shadow:0 6px 16px rgba( 0,0,0,0.08 ),0 1px 2px rgba( 0,0,0,0.06 );z-index:50}.os-tag-input__suggestion-item{display:flex;align-items:center;gap:6px;padding:6px 12px;font-size:13px;cursor:pointer;user-select:none}.os-tag-input__suggestion-item[ aria-selected='true' ]{background:color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 10%,transparent );color:var( --wp-admin-theme-color,#2271b1 )}.os-tag-input__suggestion-create{font-style:italic;color:var( --os-ui-tag-input-create-fg,var( --os-ui-fg-muted,#50575e ) );border-top:1px solid var( --os-ui-tag-input-pop-divider,var( --os-ui-border,#f0f0f1 ) )}.os-tag-input__suggestion-create[ aria-selected='true' ]{color:var( --wp-admin-theme-color,#2271b1 )}.os-tag-input__suggestion-empty,.os-tag-input__suggestion-loading{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:12px;color:var( --os-ui-tag-input-pop-muted,var( --os-ui-fg-muted,#646970 ) )}.os-tag-input__suggestion-spinner{display:inline-block;width:10px;height:10px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;animation:os-tag-input-spin 0.8s linear infinite}@keyframes os-tag-input-spin{to{transform:rotate( 360deg )}}:host( [ disabled ] ) .os-tag-input{opacity:0.6;pointer-events:none}`,mt=class mt extends m{constructor(){super(...arguments),this._value=[],this._suggestions=[],this._suggestionsLoading=!1,this._query="",this._highlight=-1,this._focusedChip=-1,this._onDocumentPointerDown=e=>{!this.isOpen||e.composedPath().includes(this)||this.closeInput()}}get _input(){const e=this.shadowRoot;return e?e.querySelector(".os-tag-input__input"):null}get value(){return this._value}set value(e){this._value=Array.isArray(e)?e.slice():[],this._focusedChip>=this._value.length&&(this._focusedChip=-1),this.requestUpdate()}get suggestions(){return this._suggestions}set suggestions(e){this._suggestions=Array.isArray(e)?e.slice():[],this._highlight=this._suggestions.length>0?0:-1,this._suggestionsLoading=!1,this.requestUpdate()}get suggestionsLoading(){return this._suggestionsLoading}set suggestionsLoading(e){this._suggestionsLoading=!!e,this.requestUpdate()}get query(){return this._query}get isOpen(){return this.open!==null}openInput(){this.isOpen||(this.open="",this._query="",this._highlight=-1,this.emit("os-tag-open",{}),queueMicrotask(()=>{this._input?.focus(),this._emitSuggest("")}))}closeInput(){this.isOpen&&(this.open=null,this._query="",this._suggestions=[],this._highlight=-1,this._suggestionsLoading=!1,this.emit("os-tag-close",{}),this.requestUpdate())}connectedCallback(){super.connectedCallback(),document.addEventListener("pointerdown",this._onDocumentPointerDown,!0)}disconnectedCallback(){document.removeEventListener("pointerdown",this._onDocumentPointerDown,!0)}render(){const e=this.isOpen,t=this.disabled!==null,s=this.readonly!==null,o=this.removable!==null||this.removable===null&&!s,i=this.creatable!==null,n=this["add-label"]||"Add",a=this.placeholder||"Add a tag…";return d` |
| 976 |
<span |
| 977 |
class="os-tag-input" |
| 978 |
role="group" |
| 979 |
aria-label=${this.label??""} |
| 980 |
> |
| 981 |
${this._renderChips(o,t)} |
| 982 |
${this._renderTrailing({isOpen:e,readonly:s,disabled:t,placeholder:a,creatable:i,addLabel:n})} |
| 983 |
</span> |
| 984 |
`}_renderTrailing(e){return e.isOpen?this._renderEditor(e.placeholder,e.creatable):e.readonly||e.disabled?d``:this._renderTrigger(e.addLabel)}_renderChips(e,t){const s=this._value;return s.length===0?d``:d` |
| 985 |
<span class="os-tag-input__chips" role="list"> |
| 986 |
${s.map((o,i)=>{const n=o.tone??"neutral";return d` |
| 987 |
<os-chip |
| 988 |
role="listitem" |
| 989 |
size="compact" |
| 990 |
tone=${n} |
| 991 |
label=${o.label} |
| 992 |
?dismissible=${e&&!t} |
| 993 |
?disabled=${t} |
| 994 |
?pending=${!!o.pending} |
| 995 |
tabindex=${i===this._focusedChip?"0":"-1"} |
| 996 |
data-idx=${String(i)} |
| 997 |
@os-chip-dismiss=${a=>this._onChipDismiss(a,o)} |
| 998 |
@focus=${()=>this._focusedChip=i} |
| 999 |
></os-chip> |
| 1000 |
`})} |
| 1001 |
</span> |
| 1002 |
`}_renderTrigger(e){const t=this.disabled!==null;return d` |
| 1003 |
<button |
| 1004 |
type="button" |
| 1005 |
class="os-tag-input__add" |
| 1006 |
aria-label=${e} |
| 1007 |
aria-haspopup="listbox" |
| 1008 |
aria-expanded="false" |
| 1009 |
?disabled=${t} |
| 1010 |
@click=${()=>this.openInput()} |
| 1011 |
> |
| 1012 |
${Vl()} |
| 1013 |
<span>${e}</span> |
| 1014 |
</button> |
| 1015 |
`}_renderEditor(e,t){const s=this._suggestions.length>0||this._suggestionsLoading||t&&this._query.trim().length>0;return d` |
| 1016 |
<span class="os-tag-input__editor"> |
| 1017 |
<input |
| 1018 |
class="os-tag-input__input" |
| 1019 |
type="text" |
| 1020 |
autocomplete="off" |
| 1021 |
autocapitalize="off" |
| 1022 |
spellcheck="false" |
| 1023 |
placeholder=${e} |
| 1024 |
.value=${this._query} |
| 1025 |
aria-autocomplete="list" |
| 1026 |
aria-expanded=${s?"true":"false"} |
| 1027 |
aria-activedescendant=${this._highlight>=0?`os-tag-suggestion-${this._highlight}`:""} |
| 1028 |
@input=${o=>this._onInput(o)} |
| 1029 |
@keydown=${o=>this._onInputKeyDown(o)} |
| 1030 |
@blur=${o=>this._onInputBlur(o)} |
| 1031 |
/> |
| 1032 |
${s?this._renderSuggestions(t):d``} |
| 1033 |
</span> |
| 1034 |
`}_renderSuggestions(e){const t=this._query.trim(),s=this._suggestions,o=e&&t.length>0&&!s.some(i=>i.label.toLowerCase()===t.toLowerCase())&&!this._value.some(i=>i.label.toLowerCase()===t.toLowerCase());return d` |
| 1035 |
<div |
| 1036 |
class="os-tag-input__suggestions" |
| 1037 |
role="listbox" |
| 1038 |
> |
| 1039 |
${this._suggestionsLoading?d` |
| 1040 |
<div class="os-tag-input__suggestion-loading"> |
| 1041 |
<span class="os-tag-input__suggestion-spinner" aria-hidden="true"></span> |
| 1042 |
<span>Searching…</span> |
| 1043 |
</div> |
| 1044 |
`:d``} |
| 1045 |
${s.length===0&&!this._suggestionsLoading&&!o?d` |
| 1046 |
<div class="os-tag-input__suggestion-empty"> |
| 1047 |
${t.length>0?"No matches.":"Type to search."} |
| 1048 |
</div> |
| 1049 |
`:d``} |
| 1050 |
${s.map((i,n)=>{const a=n===this._highlight;return d` |
| 1051 |
<div |
| 1052 |
id=${`os-tag-suggestion-${n}`} |
| 1053 |
role="option" |
| 1054 |
aria-selected=${a?"true":"false"} |
| 1055 |
class="os-tag-input__suggestion-item" |
| 1056 |
@mousedown=${l=>{l.preventDefault(),this._addSuggestion(i,!1)}} |
| 1057 |
@mouseenter=${()=>{this._highlight=n,this.requestUpdate()}} |
| 1058 |
> |
| 1059 |
<span>${i.label}</span> |
| 1060 |
</div> |
| 1061 |
`})} |
| 1062 |
${o?d` |
| 1063 |
<div |
| 1064 |
id=${`os-tag-suggestion-${s.length}`} |
| 1065 |
role="option" |
| 1066 |
aria-selected=${this._highlight===s.length?"true":"false"} |
| 1067 |
class="os-tag-input__suggestion-item os-tag-input__suggestion-create" |
| 1068 |
@mousedown=${i=>{i.preventDefault(),this._addSuggestion({label:t},!0)}} |
| 1069 |
@mouseenter=${()=>{this._highlight=s.length,this.requestUpdate()}} |
| 1070 |
> |
| 1071 |
Create "${t}" |
| 1072 |
</div> |
| 1073 |
`:d``} |
| 1074 |
</div> |
| 1075 |
`}_onChipDismiss(e,t){e.stopPropagation(),this.emit("os-tag-remove",{tag:t})}_onInput(e){const t=e.target.value;this._query=t,this._emitSuggest(t)}_emitSuggest(e){const t=parseInt(this["min-query"]||"0",10)||0;if(e.length<t){this._suggestions=[],this._suggestionsLoading=!1,this.requestUpdate();return}this._suggestionsLoading=!0,this.requestUpdate(),this.emit("os-tag-suggest",{query:e})}_onInputKeyDown(e){const t=this.creatable!==null,s=this._suggestions,o=this._query.trim(),i=t&&o.length>0&&!s.some(a=>a.label.toLowerCase()===o.toLowerCase())&&!this._value.some(a=>a.label.toLowerCase()===o.toLowerCase()),n=s.length+(i?1:0);switch(e.key){case"ArrowDown":{if(n===0)return;e.preventDefault(),this._highlight=this._highlight+1>=n?0:this._highlight+1,this.requestUpdate();return}case"ArrowUp":{if(n===0)return;e.preventDefault(),this._highlight=this._highlight<=0?n-1:this._highlight-1,this.requestUpdate();return}case"Enter":{if(e.preventDefault(),this._highlight>=0&&this._highlight<s.length){this._addSuggestion(s[this._highlight],!1);return}if(this._highlight===s.length&&i){this._addSuggestion({label:o},!0);return}if(i&&o.length>0){this._addSuggestion({label:o},!0);return}return}case"Escape":{e.preventDefault(),this.closeInput();return}case"Backspace":{if(this._query===""&&this._value.length>0){e.preventDefault();const a=this._value.length-1;this._focusedChip===a?(this.emit("os-tag-remove",{tag:this._value[a]}),this._focusedChip=-1):(this._focusedChip=a,this.requestUpdate())}return}default:this._focusedChip!==-1&&(this._focusedChip=-1)}}_onInputBlur(e){queueMicrotask(()=>{this.shadowRoot?.activeElement||this.closeInput()})}_addSuggestion(e,t){if(this._value.some(o=>o.label.toLowerCase()===e.label.toLowerCase())){this._query="",this._highlight=-1,this._suggestions=[],this.requestUpdate(),this._input?.focus();return}this.emit("os-tag-add",{tag:e,isNew:t}),this._query="",this._highlight=-1,this._suggestions=[],this._suggestionsLoading=!1,this.requestUpdate(),queueMicrotask(()=>{this._input?.focus()})}};mt.props=["name","label","placeholder","add-label","creatable","removable","disabled","readonly","size","min-query","open"],mt.styles=[Kl],mt.help=void 0;let $o=mt;v("os-tag-input",$o);function Vl(){return I("plus",{size:14})}const jl=b`:host{display:block;container-type:inline-size;container-name:os-form;font-size:13px;color:var( --os-ui-fg,#1d2327 )}:host( [ hidden ] ){display:none}.header{margin:0 0 18px}.header:empty{display:none}.fields{display:grid;grid-template-columns:1fr;gap:14px 16px;margin:0 0 18px}@container os-form ( min-width:480px ){.fields{grid-template-columns:repeat( 2,minmax( 0,1fr ) )}}@container os-form ( min-width:760px ){:host( [ columns="3" ] ) .fields{grid-template-columns:repeat( 3,minmax( 0,1fr ) )}}:host( [ columns="1" ] ) .fields{grid-template-columns:1fr}:host( [ columns="2" ] ) .fields{grid-template-columns:repeat( 2,minmax( 0,1fr ) )}::slotted( [ full-width ] ){grid-column:1 / -1}::slotted( [ slot ] ){display:contents}.error{margin:0 0 14px;padding:10px 12px;border-radius:6px;background:var( --os-ui-notice-error-bg,rgba( 179,45,46,0.10 ) );color:var( --os-ui-danger-hover,#b32d2e );font-size:13px;line-height:1.4}.error[ hidden ]{display:none}.footer{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-end;border-top:1px solid var( --os-ui-border,#dcdcde );padding-top:14px}:host( [ align="start" ] ) .footer{justify-content:flex-start}:host( [ align="stretch" ] ) .footer{justify-content:stretch}:host( [ align="stretch" ] ) .footer .footer-actions{flex:1 1 auto}.footer-leading,.footer-trailing{display:contents}.footer-actions{display:inline-flex;gap:8px;align-items:center;margin-inline-start:auto}:host( [ align="start" ] ) .footer-actions{margin-inline-start:0}:host( [ busy ] ){pointer-events:none}:host( [ busy ] ) .fields{opacity:0.6}:host( [ busy ] ) .footer{pointer-events:auto}.busy-spinner{display:inline-flex;width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:os-form-spin 0.7s linear infinite;vertical-align:-2px;margin-inline-end:6px}@keyframes os-form-spin{to{transform:rotate( 360deg )}}@media ( prefers-reduced-motion:reduce ){.busy-spinner{animation-duration:2s}}`;function or(r){if(r===null||typeof r!="object")return r;try{return structuredClone(r)}catch{return r}}const vt=class vt extends m{constructor(){super(...arguments),this._initial=new Map,this._captured=!1,this._fieldChangeListener=null,this._enterSubmitListener=null}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._captureInitialValues()),this._fieldChangeListener=e=>this._onAnyFieldInput(e),this.addEventListener("os-input-change",this._fieldChangeListener),this.addEventListener("os-input-commit",this._fieldChangeListener),this.addEventListener("os-checkbox-change",this._fieldChangeListener),this.addEventListener("os-select-change",this._fieldChangeListener),this.addEventListener("os-range-change",this._fieldChangeListener),this.addEventListener("os-color-change",this._fieldChangeListener),this.addEventListener("change",this._fieldChangeListener),this._enterSubmitListener=()=>this.submit(),this.addEventListener("os-submit",this._enterSubmitListener)}disconnectedCallback(){this._fieldChangeListener&&(this.removeEventListener("os-input-change",this._fieldChangeListener),this.removeEventListener("os-input-commit",this._fieldChangeListener),this.removeEventListener("os-checkbox-change",this._fieldChangeListener),this.removeEventListener("os-select-change",this._fieldChangeListener),this.removeEventListener("os-range-change",this._fieldChangeListener),this.removeEventListener("os-color-change",this._fieldChangeListener),this.removeEventListener("change",this._fieldChangeListener),this._fieldChangeListener=null),this._enterSubmitListener&&(this.removeEventListener("os-submit",this._enterSubmitListener),this._enterSubmitListener=null)}render(){const e=this["submit-label"]||"Submit",t=this["reset-label"]||"Reset",s=this.error||"",o=this.busy!==null,n=this["show-reset"]!=="false";return d` |
| 1076 |
<div class="header" part="header"> |
| 1077 |
<slot name="header"></slot> |
| 1078 |
</div> |
| 1079 |
<div class="fields" part="fields" ?inert=${o}> |
| 1080 |
<slot></slot> |
| 1081 |
</div> |
| 1082 |
<slot name="error"> |
| 1083 |
${s?d`<p class="error" role="alert" part="error">${s}</p>`:d`<p class="error" role="alert" part="error" hidden></p>`} |
| 1084 |
</slot> |
| 1085 |
<footer class="footer" part="footer"> |
| 1086 |
<span class="footer-leading" |
| 1087 |
><slot name="footer-leading"></slot |
| 1088 |
></span> |
| 1089 |
<span class="footer-actions"> |
| 1090 |
${n?d`<os-button |
| 1091 |
variant="ghost" |
| 1092 |
data-os-form-action="reset" |
| 1093 |
?disabled=${o} |
| 1094 |
@click=${()=>this.reset()} |
| 1095 |
>${t}</os-button>`:d``} |
| 1096 |
<os-button |
| 1097 |
variant="primary" |
| 1098 |
data-os-form-action="submit" |
| 1099 |
?disabled=${o} |
| 1100 |
@click=${()=>this.submit()} |
| 1101 |
> |
| 1102 |
${o?d`<span class="busy-spinner" aria-hidden="true"></span>`:d``} |
| 1103 |
${e} |
| 1104 |
</os-button> |
| 1105 |
</span> |
| 1106 |
<span class="footer-trailing" |
| 1107 |
><slot name="footer-trailing"></slot |
| 1108 |
></span> |
| 1109 |
</footer> |
| 1110 |
`}getValues(){const e={};for(const t of this._namedFields()){const s=t.getAttribute("name");s&&(e[s]=this._readField(t))}return e}setValues(e){for(const[t,s]of Object.entries(e)){const o=this._fieldByName(t);o&&this._writeField(o,s)}}setBusy(e){e?this.setAttribute("busy",""):this.removeAttribute("busy")}setError(e){e?this.setAttribute("error",e):this.removeAttribute("error")}setFieldInvalid(e,t=!0,s=null){const o=this._fieldByName(e);o&&(t?(o.setAttribute("invalid",""),s!==null&&o.setAttribute("error",s)):(o.removeAttribute("invalid"),o.removeAttribute("error")))}clearErrors(){this.setError(null);for(const e of this._namedFields())e.removeAttribute("invalid"),e.removeAttribute("error")}reset(){this.clearErrors();for(const[e,t]of this._initial.entries()){const s=this._fieldByName(e);if(s){if(t.checked!==null){s.checked=t.checked,t.checked?s.setAttribute("checked",""):s.removeAttribute("checked");continue}this._writeField(s,or(t.value))}}this.dispatchEvent(new CustomEvent("os-form-reset",{bubbles:!0,composed:!0,detail:{form:this}}))}submit(){if(this.hasAttribute("busy"))return;const e=[];for(const o of this._namedFields()){const i=o.getAttribute("name");if(!i||!o.hasAttribute("required"))continue;const a=this._readField(o);if(a==null||a===""||Array.isArray(a)&&a.length===0){o.setAttribute("invalid","");const c=o.getAttribute("label");e.push(c||i)}}if(e.length>0){const o=e.join(", ");this.setError(`Required: ${o}`);return}const t=this.getValues(),s=new CustomEvent("os-form-submit",{bubbles:!0,composed:!0,cancelable:!0,detail:{values:t,form:this}});this.dispatchEvent(s)}_captureInitialValues(){if(this._captured)return;const e=this._namedFields();if(e.length!==0){for(const t of e){const s=t.getAttribute("name");if(!s)continue;const o=t.tagName==="OS-SWITCH"||t.tagName==="OS-CHECKBOX"||t.tagName==="OS-CHECKBOX-LABEL"||t.tagName==="INPUT"&&t.type==="checkbox";this._initial.set(s,{value:or(this._readField(t)),checked:o?!!this._readField(t):null})}this._captured=!0}}_namedFields(){return Array.from(this.querySelectorAll("[name]"))}_fieldByName(e){const t=typeof CSS<"u"&&typeof CSS.escape=="function"?CSS.escape(e):e.replace(/["\\]/g,"\\$&");return this.querySelector(`[name="${t}"]`)}_readField(e){const t=e.tagName.toUpperCase();return t==="OS-SWITCH"||t==="OS-CHECKBOX"||t==="OS-CHECKBOX-LABEL"||t==="INPUT"&&e.type==="checkbox"?typeof e.checked=="boolean"?e.checked:e.hasAttribute("checked"):e.value!==void 0&&e.value!==null?e.value:e.getAttribute("value")??""}_writeField(e,t){const s=e.tagName.toUpperCase();if(s==="OS-SWITCH"||s==="OS-CHECKBOX"||s==="OS-CHECKBOX-LABEL"||s==="INPUT"&&e.type==="checkbox"){const n=!!t;e.checked=n,n?e.setAttribute("checked",""):e.removeAttribute("checked");return}if(t!==null&&typeof t=="object"||e.value!==null&&typeof e.value=="object"){e.value=t;return}const i=t==null?"":String(t);e.value=i,e.setAttribute("value",i)}_onAnyFieldInput(e){const t=e.target;if(!t)return;const s=t.getAttribute?.("name");s&&(this.dispatchEvent(new CustomEvent("os-form-input",{bubbles:!0,composed:!0,detail:{name:s,value:this._readField(t),form:this}})),t.hasAttribute("invalid")&&t.removeAttribute("invalid"))}};vt.props=["submit-label","reset-label","error","busy","columns","min-column","show-reset","align"],vt.styles=[jl],vt.help=void 0;let Co=vt;v("os-form",Co);const Bl=b`:host{display:inline-flex;align-items:center;gap:6px;font-size:var( --os-ui-save-status-font-size,11px );line-height:1;color:var( --os-ui-save-status-fg,currentColor );vertical-align:middle;min-width:0;opacity:1;pointer-events:auto}.os-save-status__indicator{display:inline-flex;align-items:center;justify-content:center;width:var( --os-ui-save-status-size,12px );height:var( --os-ui-save-status-size,12px );border-radius:50%;flex-shrink:0;box-sizing:border-box;background:var( --os-ui-save-status-bg,transparent );border:2px solid var( --os-ui-save-status-idle-color,color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 55%,transparent ) );color:var( --wp-admin-theme-color,#2271b1 );transition:background-color 0.2s ease,border-color 0.2s ease,box-shadow 0.2s ease}:host( [ phase='pending' ] ) .os-save-status__indicator,:host( [ phase='saving' ] ) .os-save-status__indicator{background:var( --os-ui-save-status-bg,var( --wp-admin-theme-color,#2271b1 ) );border-color:transparent;color:var( --wp-admin-theme-color,#2271b1 );animation:os-save-status-pulse 1.2s ease-in-out infinite}:host( [ animation='modem' ][ phase='pending' ] ) .os-save-status__indicator,:host( [ animation='modem' ][ phase='saving' ] ) .os-save-status__indicator{background:var( --os-ui-save-status-bg,var( --wp-admin-theme-color,#2271b1 ) );border-color:transparent;color:var( --wp-admin-theme-color,#2271b1 );animation:os-save-status-modem-stutter 1.8s ease-in-out infinite,os-save-status-modem-glow 2.4s ease-in-out infinite}@keyframes os-save-status-modem-stutter{0%,4%{opacity:1}5%,30%{opacity:0.22}31%,36%{opacity:1}37%,39%{opacity:0.22}40%,44%{opacity:1}45%,67%{opacity:0.22}68%,76%{opacity:1}77%,100%{opacity:0.22}}@keyframes os-save-status-modem-glow{0%,12%{box-shadow:0 0 0 0 transparent}13%,22%{box-shadow:0 0 4px 0 currentColor}23%,50%{box-shadow:0 0 0 0 transparent}51%,58%{box-shadow:0 0 4px 0 currentColor}59%,84%{box-shadow:0 0 0 0 transparent}85%,94%{box-shadow:0 0 5px 0 currentColor}95%,100%{box-shadow:0 0 0 0 transparent}}@media ( prefers-reduced-motion:reduce ){:host( [ phase='pending' ] ) .os-save-status__indicator,:host( [ phase='saving' ] ) .os-save-status__indicator,:host( [ animation='modem' ][ phase='pending' ] ) .os-save-status__indicator,:host( [ animation='modem' ][ phase='saving' ] ) .os-save-status__indicator{animation:none;opacity:0.85}}:host( [ phase='saved' ] ) .os-save-status__indicator{background:var( --os-ui-save-status-saved-bg,var( --os-ui-success-fg,#1d6f42 ) );border-color:transparent;color:var( --os-ui-save-status-saved-bg,var( --os-ui-success-fg,#1d6f42 ) )}:host( [ phase='failed' ] ) .os-save-status__indicator{background:var( --os-ui-save-status-failed-bg,var( --os-ui-danger,#d63638 ) );border-color:transparent;color:var( --os-ui-save-status-failed-bg,var( --os-ui-danger,#d63638 ) );animation:os-save-status-pulse 0.8s ease-in-out 2}:host( [ variant='ring' ] ) .os-save-status__indicator{background:transparent}:host( [ variant='ring' ][ phase='pending' ] ) .os-save-status__indicator,:host( [ variant='ring' ][ phase='saving' ] ) .os-save-status__indicator{background:transparent;border-color:var( --os-ui-save-status-ring-color,var( --os-ui-save-status-bg,var( --wp-admin-theme-color,#2271b1 ) ) );animation:os-save-status-ring-pulse 1.6s var( --os-ui-ease-loop,ease-in-out ) infinite}:host( [ variant='ring' ][ phase='failed' ] ) .os-save-status__indicator{background:transparent;border-color:var( --os-ui-save-status-failed-bg,var( --os-ui-danger,#d63638 ) );animation:os-save-status-ring-alert 0.62s var( --os-ui-ease-out,ease-out ) 1}:host( [ variant='ring' ][ phase='failed' ] ) .os-save-status__glyph{color:var( --os-ui-save-status-failed-bg,var( --os-ui-danger,#d63638 ) )}:host( [ variant='ring' ][ phase='saved' ] ) .os-save-status__indicator{background:var( --os-ui-save-status-saved-bg,var( --wp-admin-theme-color,#2271b1 ) );border-color:transparent;animation:os-save-status-ring-land 0.42s var( --os-ui-ease-out,ease-out ) 1}:host( [ variant='ring' ][ phase='saved' ] ) .os-save-status__glyph,:host( [ variant='ring' ][ phase='failed' ] ) .os-save-status__glyph{animation:os-save-status-glyph-in 0.24s var( --os-ui-ease-out,ease-out ) 0.08s 1 backwards}@keyframes os-save-status-ring-pulse{0%,100%{opacity:0.45;scale:0.9}50%{opacity:1;scale:1}}@keyframes os-save-status-ring-land{0%{scale:0.82}55%{scale:1.06}100%{scale:1}}@keyframes os-save-status-ring-alert{0%{scale:0.9}25%{scale:1.08}50%{scale:0.98}75%{scale:1.04}100%{scale:1}}@keyframes os-save-status-glyph-in{0%{opacity:0;scale:0.4}100%{opacity:1;scale:1}}@media ( prefers-reduced-motion:reduce ){:host( [ variant='ring' ] ) .os-save-status__indicator,:host( [ variant='ring' ] ) .os-save-status__glyph{animation:none;opacity:1;scale:1}}@keyframes os-save-status-pulse{0%,100%{opacity:0.55;transform:scale( 0.9 )}50%{opacity:1;transform:scale( 1 )}}:host( [ mode='pill' ] ) .os-save-status{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;background:var( --os-ui-save-status-pill-bg,transparent );font-weight:500;white-space:nowrap}:host( [ mode='pill' ][ phase='saving' ] ) .os-save-status,:host( [ mode='pill' ][ phase='pending' ] ) .os-save-status{background:var( --os-ui-save-status-pill-bg,var( --os-ui-hover,rgba( 0,0,0,0.04 ) ) );color:var( --os-ui-save-status-pill-fg,var( --os-ui-fg-muted,#50575e ) )}:host( [ mode='pill' ][ phase='saved' ] ) .os-save-status{background:var( --os-ui-save-status-pill-bg,rgba( 30,132,73,0.12 ) );color:var( --os-ui-save-status-pill-fg,var( --os-ui-success-fg,#1d6f42 ) )}:host( [ mode='pill' ][ phase='failed' ] ) .os-save-status{background:var( --os-ui-save-status-pill-bg,rgba( 214,54,56,0.12 ) );color:var( --os-ui-save-status-pill-fg,var( --os-ui-danger-hover,#a02622 ) )}.os-save-status__label{min-width:0;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host( [ phase='saved' ] ) .os-save-status__glyph,:host( [ phase='failed' ] ) .os-save-status__glyph{display:inline-block;color:var( --os-ui-fg-on-accent,#fff );width:calc( var( --os-ui-save-status-size,12px ) * 0.66 );height:calc( var( --os-ui-save-status-size,12px ) * 0.66 )}.os-save-status__glyph{display:none}.os-save-status__glyph svg{display:block;width:100%;height:100%}`,ir="os-settings-save-lifecycle",Wl=2200,Xl=6e3,_t=class _t extends m{constructor(){super(...arguments),this._autoTimer=null,this._docListener=null}connectedCallback(){super.connectedCallback(),this.auto!==null&&this._installAutoListener()}disconnectedCallback(){this._removeAutoListener(),this._autoTimer!==null&&(window.clearTimeout(this._autoTimer),this._autoTimer=null)}attributeChangedCallback(e,t,s){if(super.attributeChangedCallback(e,t,s),(e==="auto"||e==="event")&&(this._removeAutoListener(),this.auto!==null&&this._installAutoListener()),e==="phase"){this._scheduleAutoClear();const o={phase:this.phase??"idle",error:this.error??void 0};this.emit("os-save-status-change",o)}}render(){const e=this.phase??"idle",t=this.mode??"dot",o=(this.error??"")||this._labelForPhase(e);return o?this.setAttribute("title",o):this.removeAttribute("title"),this.setAttribute("aria-live",e==="failed"?"assertive":"polite"),this.setAttribute("role",e==="failed"?"alert":"status"),d` |
| 1111 |
<span class="os-save-status"> |
| 1112 |
<span class="os-save-status__indicator" aria-hidden="true"> |
| 1113 |
<span class="os-save-status__glyph">${this._renderGlyph(e)}</span> |
| 1114 |
</span> |
| 1115 |
${t==="pill"?d`<span class="os-save-status__label" |
| 1116 |
>${this._labelForPhase(e)}</span |
| 1117 |
>`:d``} |
| 1118 |
</span> |
| 1119 |
`}_renderGlyph(e){return e==="saved"?Gl():e==="failed"?Zl():""}_labelForPhase(e){switch(e){case"pending":case"saving":return this["saving-label"]??"Saving…";case"saved":return this["saved-label"]??"Saved";case"failed":return(this.error??"")||"Couldn’t save";default:return this["idle-label"]??""}}_installAutoListener(){const e=this.event||ir;this._docListener=t=>{const s=t.detail;!s||typeof s.phase!="string"||(this.phase=s.phase,s.error?this.error=s.error:s.phase!=="failed"&&this.error&&this.removeAttribute("error"))},document.addEventListener(e,this._docListener)}_removeAutoListener(){if(!this._docListener)return;const e=this.event||ir;document.removeEventListener(e,this._docListener),this._docListener=null}_scheduleAutoClear(){this._autoTimer!==null&&(window.clearTimeout(this._autoTimer),this._autoTimer=null);const e=this.phase??"idle",t=this._autoClearMsFor(e);t<=0||(this._autoTimer=window.setTimeout(()=>{this._autoTimer=null,this.phase="idle"},t))}_autoClearMsFor(e){if(e==="saved"){const t=this["auto-clear-saved-ms"];return parseInt(t||"",10)||Wl}if(e==="failed"){const t=this["auto-clear-failed-ms"];return parseInt(t||"",10)||Xl}return 0}};_t.props=["phase","mode","variant","animation","auto","event","error","saving-label","saved-label","idle-label","auto-clear-saved-ms","auto-clear-failed-ms"],_t.styles=[Bl],_t.help=void 0;let Ao=_t;v("os-save-status",Ao);function Gl(){return d` |
| 1120 |
<svg |
| 1121 |
viewBox="0 0 12 12" |
| 1122 |
aria-hidden="true" |
| 1123 |
focusable="false" |
| 1124 |
fill="none" |
| 1125 |
stroke="currentColor" |
| 1126 |
stroke-width="2" |
| 1127 |
stroke-linecap="round" |
| 1128 |
stroke-linejoin="round" |
| 1129 |
> |
| 1130 |
<path d="M2.5 6 L5 8.5 L9.5 4" /> |
| 1131 |
</svg> |
| 1132 |
`}function Zl(){return d` |
| 1133 |
<svg |
| 1134 |
viewBox="0 0 12 12" |
| 1135 |
aria-hidden="true" |
| 1136 |
focusable="false" |
| 1137 |
fill="currentColor" |
| 1138 |
> |
| 1139 |
<path |
| 1140 |
d="M5 2 H7 V7 H5 z M5 8.5 H7 V10.5 H5 z" |
| 1141 |
/> |
| 1142 |
</svg> |
| 1143 |
`}const Yl=b`:host{display:flex;width:100%;min-width:0;max-width:100%;align-items:stretch}.os-cat{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:var( --os-ui-cat-padding,2px );min-height:24px;max-width:100%;width:100%}.os-cat__chips{display:inline-flex;flex-wrap:wrap;align-items:center;gap:var( --os-ui-cat-gap,4px );min-width:0}.os-cat__chains{display:flex;flex-wrap:wrap;gap:4px;min-width:0}.os-cat__viz-host{display:flex;align-items:center;gap:4px;min-width:0;flex:1 1 auto;max-width:100%;min-height:28px;cursor:pointer;position:relative}.os-cat__viz-svg{display:block;width:100%;max-width:100%;min-width:0;overflow:visible;flex:1 1 auto}.os-cat__viz-svg .os-cat-edge{fill:none;stroke:var( --os-ui-cat-edge-color,currentColor );stroke-width:1.25;stroke-linecap:round;opacity:0.55;transition:stroke-width 0.18s ease,opacity 0.18s ease}.os-cat__viz-svg .os-cat-edge[ data-active='true' ]{stroke-width:2;opacity:1}.os-cat__viz-svg .os-cat-node{cursor:pointer;transition:r 0.2s cubic-bezier( 0.34,1.56,0.64,1 ),fill 0.18s ease,stroke-width 0.18s ease,filter 0.18s ease}.os-cat__viz-svg .os-cat-node[ data-selected='true' ]{filter:drop-shadow( 0 0 6px var( --os-ui-cat-node-glow,rgba( 0,0,0,0.18 ) ) )}.os-cat__viz-svg .os-cat-node:hover,.os-cat__viz-svg .os-cat-node:focus-visible{filter:drop-shadow( 0 0 8px var( --os-ui-cat-node-glow,rgba( 0,0,0,0.3 ) ) );outline:none}.os-cat__viz-svg .os-cat-label{font-family:var( --os-ui-font,system-ui,sans-serif );font-size:10.5px;fill:var( --os-ui-cat-label-fg,var( --os-ui-fg,#1d2327 ) );font-weight:500;pointer-events:none;user-select:none}.os-cat__viz-svg .os-cat-label[ data-selected='false' ]{fill:var( --os-ui-cat-label-muted,var( --os-ui-fg-muted,#8c8f94 ) );font-weight:400;font-style:italic}.os-cat__trigger{appearance:none;display:inline-flex;align-items:center;gap:4px;padding:1px 8px;min-height:22px;font:inherit;font-size:11px;font-weight:500;line-height:1;color:var( --os-ui-cat-trigger-fg,var( --os-ui-fg-muted,#50575e ) );background:transparent;border:1px dashed var( --os-ui-cat-trigger-border,var( --os-ui-border,#c3c4c7 ) );border-radius:999px;cursor:pointer;transition:background-color 0.12s ease,color 0.12s ease,border-color 0.12s ease}.os-cat__trigger:hover:not(:disabled ){background:var( --os-ui-hover,rgba( 0,0,0,0.04 ) );color:var( --os-ui-cat-trigger-fg-hover,var( --os-ui-fg,#1d2327 ) );border-color:var( --os-ui-cat-trigger-border-hover,var( --os-ui-border-strong,#8c8f94 ) )}.os-cat__trigger:focus-visible{outline:none;border-style:solid;box-shadow:0 0 0 2px var( --wp-admin-theme-color,#2271b1 )}.os-cat__trigger svg{display:block}.os-cat__uncategorized{display:inline-flex;align-items:center;gap:4px;padding:1px 10px;min-height:22px;font-size:11px;font-weight:500;line-height:1.6;color:var( --os-ui-cat-uncat-fg,var( --os-ui-fg-muted,#8c8f94 ) );background:transparent;border:1px dashed var( --os-ui-cat-uncat-border,var( --os-ui-border,#c3c4c7 ) );border-radius:999px;font-style:italic}.os-cat__popover{position:fixed;top:0;left:0;min-width:280px;max-width:360px;max-height:360px;display:flex;flex-direction:column;background:var( --os-ui-cat-pop-bg,var( --os-ui-surface,#fff ) );color:var( --os-ui-cat-pop-fg,var( --os-ui-fg,#1d2327 ) );border:1px solid var( --os-ui-cat-pop-border,var( --os-ui-border,#c3c4c7 ) );border-radius:8px;box-shadow:0 6px 16px rgba( 0,0,0,0.08 ),0 1px 2px rgba( 0,0,0,0.06 );z-index:1000}.os-cat__editor{position:relative;display:inline-flex;align-items:center}.os-cat__search{appearance:none;font:inherit;font-size:13px;padding:8px 12px;border:0;border-bottom:1px solid var( --os-ui-cat-pop-divider,var( --os-ui-border,#f0f0f1 ) );background:transparent;color:inherit;outline:none}.os-cat__search:focus{border-bottom-color:var( --wp-admin-theme-color,#2271b1 )}.os-cat__tree{flex:1 1 auto;min-height:0;overflow-y:auto;padding:4px 0}.os-cat__row-block{display:contents}.os-cat__row{display:flex;align-items:center;gap:6px;padding:4px 8px 4px var( --os-ui-cat-row-indent,12px );cursor:pointer;user-select:none;font-size:13px;line-height:1.4;position:relative}.os-cat__row:hover,.os-cat__row[ data-focused='true' ]{background:var( --os-ui-hover,rgba( 0,0,0,0.04 ) )}.os-cat__row[ data-selected='true' ]{color:var( --wp-admin-theme-color,#2271b1 );font-weight:600}.os-cat__row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:var( --os-ui-cat-guide-width,0px );border-left:1px dotted var( --os-ui-cat-guide-color,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) )}.os-cat__expander{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;border:0;background:transparent;color:inherit;cursor:pointer;flex-shrink:0;opacity:0.65}.os-cat__expander:hover{opacity:1}.os-cat__expander svg{display:block;transition:transform 0.12s ease}.os-cat__row[ data-expanded='true' ] .os-cat__expander svg{transform:rotate( 90deg )}.os-cat__expander--placeholder{visibility:hidden}.os-cat__create-row{display:flex;align-items:center;padding:2px 8px 2px var( --os-ui-cat-row-indent,28px );position:relative}.os-cat__create-row::before{content:'';position:absolute;left:0;top:0;bottom:0;width:var( --os-ui-cat-guide-width,0px );border-left:1px dotted var( --os-ui-cat-guide-color,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) )}.os-cat__create-wrap{display:inline-flex;align-items:center;flex:1 1 auto;min-width:0;gap:4px;padding:1px 1px 1px 0;border:1px solid transparent;border-radius:6px;background:transparent;transition:border-color 0.12s ease,background-color 0.12s ease,box-shadow 0.12s ease}.os-cat__create-wrap:hover{border-color:var( --os-ui-border,rgba( 0,0,0,0.12 ) );background:var( --os-ui-cat-pop-bg,var( --os-ui-surface,#fff ) )}.os-cat__create-wrap:focus-within{border-color:var( --wp-admin-theme-color,#2271b1 );background:var( --os-ui-cat-pop-bg,var( --os-ui-surface,#fff ) );box-shadow:0 0 0 2px color-mix( in srgb,var( --wp-admin-theme-color,#2271b1 ) 15%,transparent )}.os-cat__create-input{flex:1 1 auto;min-width:0;appearance:none;font:inherit;font-size:var( --os-ui-field-font-size-compact,12px );padding:3px 6px;border:0;background:transparent;color:inherit;outline:none}.os-cat__create-input::placeholder{color:var( --os-ui-cat-pop-muted,var( --os-ui-fg-muted,#8c8f94 ) );font-style:italic;opacity:1}.os-cat__create-submit{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;padding:0;border:0;border-radius:4px;background:transparent;color:var( --os-ui-cat-pop-muted,var( --os-ui-fg-muted,#8c8f94 ) );cursor:pointer;transition:background-color 0.12s ease,color 0.12s ease}.os-cat__create-wrap:focus-within .os-cat__create-submit:not( [ disabled ] ){background:var( --wp-admin-theme-color,#2271b1 );color:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) )}.os-cat__create-submit:hover:not( [ disabled ] ){filter:brightness( 1.05 )}.os-cat__create-submit[ disabled ]{cursor:default;opacity:0.5}.os-cat__create-submit svg{display:block}.os-cat__create-spinner{display:inline-block;width:12px;height:12px;margin:0 4px;border-radius:50%;border:2px solid var( --wp-admin-theme-color,#2271b1 );border-top-color:transparent;animation:os-cat-spin 0.8s linear infinite;flex-shrink:0}.os-cat__check{display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;flex-shrink:0;border:1.5px solid var( --os-ui-cat-check-border,var( --os-ui-border,#8c8f94 ) );border-radius:3px;color:transparent;transition:background-color 0.12s ease,border-color 0.12s ease,color 0.12s ease}.os-cat__row[ data-selected='true' ] .os-cat__check{background:var( --wp-admin-theme-color,#2271b1 );border-color:var( --wp-admin-theme-color,#2271b1 );color:var( --os-ui-accent-ink,var( --os-ui-fg-on-accent,#fff ) )}.os-cat__check svg{display:block;width:14px;height:14px}.os-cat__label{min-width:0;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-cat__delete{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:18px;height:18px;border:0;border-radius:50%;padding:0;background:transparent;color:var( --os-ui-cat-delete-color,var( --os-ui-danger,#d63638 ) );cursor:pointer;opacity:0;transition:opacity 0.12s ease,background-color 0.12s ease}.os-cat__row:hover .os-cat__delete,.os-cat__row[ data-focused='true' ] .os-cat__delete,.os-cat__delete:focus-visible{opacity:1}.os-cat__delete:hover,.os-cat__delete:focus-visible{background:var( --os-ui-badge-danger-bg,rgba( 214,54,56,0.12 ) )}.os-cat__delete svg{display:block;width:14px;height:14px}.os-cat__match{background:var( --os-ui-search-highlight-bg,rgba( 252,211,77,0.45 ) );border-radius:2px;padding:0 1px}.os-cat__empty,.os-cat__loading{padding:12px;font-size:12px;color:var( --os-ui-cat-pop-muted,var( --os-ui-fg-muted,#646970 ) );text-align:center}.os-cat__loading-spinner{display:inline-block;width:12px;height:12px;border-radius:50%;border:2px solid currentColor;border-top-color:transparent;animation:os-cat-spin 0.8s linear infinite;margin-inline-end:8px;vertical-align:middle}@keyframes os-cat-spin{to{transform:rotate( 360deg )}}.os-cat__footer{padding:8px 12px;font-size:11px;color:var( --os-ui-cat-pop-muted,var( --os-ui-fg-muted,#646970 ) );border-top:1px solid var( --os-ui-cat-pop-divider,var( --os-ui-border,#f0f0f1 ) );border-radius:10px;background:var( --os-ui-cat-pop-footer-bg,var( --os-ui-surface,#fafafb ) );display:flex;align-items:center;gap:6px;line-height:1.4}.os-cat__footer .dashicons{font-size:14px;width:14px;height:14px;flex-shrink:0}:host( [ disabled ] ) .os-cat{opacity:0.6;pointer-events:none}`,F="10px",Ql=b`:host{display:inline-flex;max-width:100%;align-items:center;min-width:0;font-family:var( --os-ui-font,system-ui,sans-serif );font-size:12px;line-height:1;font-weight:500}.os-crumb-chain{display:inline-flex;flex-wrap:nowrap;align-items:stretch;max-width:100%;min-width:0;min-height:22px;border-radius:999px;overflow:hidden;filter:drop-shadow( 0 1px 1px rgba( 0,0,0,0.06 ) )}.os-crumb{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:22px;padding:2px 12px;background:var( --os-ui-crumb-bg,var( --os-ui-surface,#c3c4c7 ) );color:var( --os-ui-crumb-fg,var( --os-ui-fg,#1d2327 ) );text-align:center;min-width:0;max-width:100%;flex-shrink:1;font-size:12px;font-weight:500;letter-spacing:0.01em;white-space:nowrap;cursor:grab;transition:filter 0.15s ease,transform 0.15s ease,background-color 0.12s ease}.os-crumb:active{cursor:grabbing}.os-crumb:hover{filter:brightness( 1.06 )}.os-crumb__remove{cursor:pointer}.os-crumb--first{padding-inline-end:22px;clip-path:polygon( 0 0,calc( 100% - ${F} ) 0,100% 50%,calc( 100% - ${F} ) 100%,0 100% )}.os-crumb--middle{padding-inline:22px;margin-inline-start:calc( -1 * ${F} );clip-path:polygon( ${F} 0,calc( 100% - ${F} ) 0,100% 50%,calc( 100% - ${F} ) 100%,${F} 100%,0 50% )}.os-crumb--last{padding-inline-start:22px;padding-inline-end:14px;margin-inline-start:calc( -1 * ${F} );clip-path:polygon( ${F} 0,100% 0,100% 100%,${F} 100%,0 50% )}.os-crumb--solo{padding:2px 12px;border-radius:999px}.os-crumb__label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.4}.os-crumb__remove{appearance:none;display:inline-flex;align-items:center;justify-content:center;width:14px;height:14px;flex-shrink:0;padding:0;border:0;border-radius:50%;background:transparent;color:inherit;cursor:pointer;opacity:0.65;transition:opacity 0.12s ease,background-color 0.12s ease,transform 0.12s ease}.os-crumb__remove:hover,.os-crumb__remove:focus-visible{opacity:1;background:var( --os-ui-scrim,rgba( 0,0,0,0.22 ) );outline:none;transform:scale( 1.1 )}.os-crumb__remove svg{display:block;width:100%;height:100%}.os-crumb-chain:hover{filter:drop-shadow( 0 2px 3px rgba( 0,0,0,0.12 ) )}:host( [ disabled ] ) .os-crumb-chain{opacity:0.55;pointer-events:none}`,xt=class xt extends m{constructor(){super(...arguments),this._segments=[]}get segments(){return this._segments}set segments(e){this._segments=Array.isArray(e)?e.slice():[],this.requestUpdate()}render(){const e=this.removable!==null,t=this._segments;return t.length===0?d``:d` |
| 1144 |
<div class="os-crumb-chain" role="group"> |
| 1145 |
${t.map((s,o)=>{const i=ar(o,t.length),n=s.color,a=n?`--os-ui-crumb-bg: ${n}; --os-ui-crumb-fg: ${lr(n)};`:"";return d` |
| 1146 |
<span |
| 1147 |
class=${`os-crumb os-crumb--${i}`} |
| 1148 |
style=${a} |
| 1149 |
title=${s.name} |
| 1150 |
draggable="true" |
| 1151 |
@click=${l=>this._onSegmentClick(l,o,s)} |
| 1152 |
@dragstart=${l=>this._onSegmentDragStart(l,o,s)} |
| 1153 |
> |
| 1154 |
<span class="os-crumb__label">${s.name}</span> |
| 1155 |
${e?d` |
| 1156 |
<button |
| 1157 |
type="button" |
| 1158 |
class="os-crumb__remove" |
| 1159 |
aria-label=${`Remove ${s.name}`} |
| 1160 |
draggable="false" |
| 1161 |
@click=${l=>this._onRemove(l,o,s)} |
| 1162 |
>${tc()}</button> |
| 1163 |
`:d``} |
| 1164 |
</span> |
| 1165 |
`})} |
| 1166 |
</div> |
| 1167 |
`}_onSegmentDragStart(e,t,s){if(e.target?.closest(".os-crumb__remove")){e.preventDefault();return}const i=this._segments.slice(t);if(e.dataTransfer){const n=Ol(i);document.body.appendChild(n);const a=e.currentTarget?.getBoundingClientRect(),l=a?Math.min(30,a.width/2):16,c=a?Math.min(16,a.height/2):12;e.dataTransfer.setDragImage(n,l,c),requestAnimationFrame(()=>n.remove())}this.emit("os-chain-segment-dragstart",{index:t,id:s.id,segment:s,segments:i,dragEvent:e})}_onSegmentClick(e,t,s){e.target?.closest(".os-crumb__remove")||this.emit("os-chain-segment-click",{index:t,id:s.id,segment:s})}_onRemove(e,t,s){e.stopPropagation(),this.emit("os-chain-remove",{index:t,id:s.id,segment:s})}};xt.props=["removable","disabled"],xt.styles=[Ql],xt.help=void 0;let So=xt;v("os-crumb-chain",So);const Jl=10;function Ol(r){const e=document.createElement("div");e.style.cssText=["display: inline-flex","align-items: stretch","border-radius: 999px","overflow: hidden","filter: drop-shadow( 0 1px 2px rgba( 0, 0, 0, 0.18 ) )",'font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',"font-size: 12px","line-height: 1","font-weight: 500","position: fixed","top: -10000px","left: -10000px","pointer-events: none","z-index: 2147483647"].join("; ");const t=r.length,s=ec();return r.forEach((o,i)=>{const n=document.createElement("span"),a=o.color??s.bg,l=o.color?lr(o.color):s.fg,c=ar(i,t),u=["display: inline-flex","align-items: center","justify-content: center","min-height: 22px",`background: ${a}`,`color: ${l}`,"white-space: nowrap","box-sizing: border-box","letter-spacing: 0.01em"],h=Jl;c==="solo"?u.push("padding: 2px 12px","border-radius: 999px"):c==="first"?u.push("padding: 2px 22px 2px 12px",`clip-path: polygon( 0 0, calc( 100% - ${h}px ) 0, 100% 50%, calc( 100% - ${h}px ) 100%, 0 100% )`):c==="middle"?u.push("padding: 2px 22px",`margin-inline-start: -${h}px`,`clip-path: polygon( ${h}px 0, calc( 100% - ${h}px ) 0, 100% 50%, calc( 100% - ${h}px ) 100%, ${h}px 100%, 0 50% )`):u.push("padding: 2px 14px 2px 22px",`margin-inline-start: -${h}px`,`clip-path: polygon( ${h}px 0, 100% 0, 100% 100%, ${h}px 100%, 0 50% )`),n.style.cssText=u.join("; "),n.textContent=o.name,e.appendChild(n)}),e}const rr="rgba( 0, 0, 0, 0.08 )",nr="#1d2327";function ec(){if(typeof document>"u"||!document.body)return{bg:rr,fg:nr};const r=getComputedStyle(document.body);return{bg:r.getPropertyValue("--os-ui-crumb-bg").trim()||rr,fg:r.getPropertyValue("--os-ui-crumb-fg").trim()||nr}}function ar(r,e){return e===1?"solo":r===0?"first":r===e-1?"last":"middle"}let le=null;function lr(r){le||(le=document.createElement("canvas"),le.width=1,le.height=1);const e=le.getContext("2d",{willReadFrequently:!0});if(!e)return"#1d2327";try{e.clearRect(0,0,1,1),e.fillStyle=r,e.fillRect(0,0,1,1);const t=e.getImageData(0,0,1,1).data,s=t[3]/255,o=t[0]*s+255*(1-s),i=t[1]*s+255*(1-s),n=t[2]*s+255*(1-s),a=c=>{const u=c/255;return u<=.03928?u/12.92:Math.pow((u+.055)/1.055,2.4)};return .2126*a(o)+.7152*a(i)+.0722*a(n)>.55?"#1d2327":"#fff"}catch{return"#1d2327"}}function tc(){return I("close",{size:null})}const cr="uncategorized",sc=1;function Bt(r){return r.id===sc?!0:(r.name||"").toLowerCase()===cr}const yt=class yt extends m{constructor(){super(...arguments),this._items=[],this._value=[],this._query="",this._collapsed=new Set,this._focusedRow=-1,this._creatingValues=new Map,this._creatingPending=new Set,this._onCellClick=e=>{if(e.target?.closest(".os-cat-node")||this.isOpen)return;const s=this.disabled!==null,o=this.readonly!==null;s||o||this.openPicker()},this._onDocPointerDown=e=>{!this.isOpen||e.composedPath().includes(this)||this.closePicker()},this._onLayoutChange=()=>{this.isOpen&&this.closePicker()},this._onDocKeydown=e=>{this.isOpen&&e.key==="Escape"&&(e.preventDefault(),this.closePicker())}}get items(){return this._items}set items(e){this._items=Array.isArray(e)?e.slice():[],this.requestUpdate()}get value(){return this._value}set value(e){this._value=Array.isArray(e)?e.slice():[],this.requestUpdate()}get isOpen(){return this.open!==null}openPicker(){this.isOpen||(this.open="",this._query="",this._focusedRow=0,this.emit("os-categories-open",{}),queueMicrotask(()=>{this._positionPopover(),this._searchInput?.focus()}))}closePicker(){this.isOpen&&(this.open=null,this._query="",this._focusedRow=-1,this.emit("os-categories-close",{}),this.requestUpdate())}connectedCallback(){super.connectedCallback(),document.addEventListener("pointerdown",this._onDocPointerDown,!0),document.addEventListener("keydown",this._onDocKeydown,!0),window.addEventListener("resize",this._onLayoutChange,{passive:!0}),window.addEventListener("scroll",this._onLayoutChange,{passive:!0,capture:!0})}disconnectedCallback(){document.removeEventListener("pointerdown",this._onDocPointerDown,!0),document.removeEventListener("keydown",this._onDocKeydown,!0),window.removeEventListener("resize",this._onLayoutChange),window.removeEventListener("scroll",this._onLayoutChange,{capture:!0})}get _searchInput(){return this.shadowRoot?.querySelector(".os-cat__search")??null}render(){const e=this.isOpen,t=this.disabled!==null,s=this.readonly!==null,o=this.loading!==null,i=this["add-label"]||"Categorize",n=this.placeholder||"Search categories…",a=Math.max(0,parseInt(this["max-visible"]||"2",10)||2);return d` |
| 1168 |
<span class="os-cat" role="group"> |
| 1169 |
${this._renderChipRow(a,s,t,i)} |
| 1170 |
${e?this._renderPopover(n,o):d``} |
| 1171 |
</span> |
| 1172 |
`}_renderChipRow(e,t,s,o){const i=this._selectedItemsInOrder();if(i.length===0)return d` |
| 1173 |
<span class="os-cat__chips" role="list"> |
| 1174 |
<span |
| 1175 |
class="os-cat__uncategorized" |
| 1176 |
title=${'Posts with no category appear as "Uncategorized" in WordPress.'} |
| 1177 |
@click=${this._onCellClick} |
| 1178 |
>${"Uncategorized"}</span> |
| 1179 |
</span> |
| 1180 |
`;const n=this._buildChains(i);return d` |
| 1181 |
<div |
| 1182 |
class="os-cat__chains" |
| 1183 |
role="list" |
| 1184 |
@click=${this._onCellClick} |
| 1185 |
> |
| 1186 |
${n.map(a=>this._renderChain(a,t,s))} |
| 1187 |
</div> |
| 1188 |
`}_buildChains(e){const t=new Map;for(const a of this._items)t.set(a.id,a);const s=new Set(e.map(a=>a.id)),o=a=>{for(const l of s){if(l===a)continue;let c=t.get(l),u=16;for(;c&&u-- >0;){if(c.parent===a)return!0;if(!c.parent)break;c=t.get(c.parent)}}return!1},i=e.filter(a=>!o(a.id)),n=[];for(const a of i){const l=[];let c=a,u=16;for(;c&&u-- >0&&((c===a||s.has(c.id))&&l.unshift(c),!!c.parent);)c=t.get(c.parent);const h=l.map(p=>({id:p.id,name:p.name}));n.push({id:a.id,segments:h})}return n}_renderChain(e,t,s){const o=!t&&!s,i=a=>{a.stopPropagation();const l=a.detail,c=typeof l?.index=="number"?l.index:e.segments.length-1,u=new Set;for(const p of e.segments.slice(c))typeof p.id=="number"&&u.add(p.id);const h=this._value.filter(p=>!u.has(p));h.length!==this._value.length&&this.emit("os-categories-change",{value:h})},n=document.createElement("os-crumb-chain");return n.segments=e.segments,o&&n.setAttribute("removable",""),n.addEventListener("os-chain-remove",i),d`<div role="listitem">${n}</div>`}_renderPopover(e,t){const s=this._buildTree(),o=this._filterTree(s,this._query),i=this._flattenForDisplay(o);return this._focusedRow>=i.length&&(this._focusedRow=i.length>0?i.length-1:-1),d` |
| 1189 |
<div class="os-cat__popover" role="dialog" aria-label="Choose categories"> |
| 1190 |
<input |
| 1191 |
class="os-cat__search" |
| 1192 |
type="text" |
| 1193 |
autocomplete="off" |
| 1194 |
placeholder=${e} |
| 1195 |
.value=${this._query} |
| 1196 |
@input=${n=>this._onSearchInput(n)} |
| 1197 |
@keydown=${n=>this._onSearchKeydown(n,i)} |
| 1198 |
/> |
| 1199 |
<div class="os-cat__tree" role="listbox" aria-multiselectable="true"> |
| 1200 |
${this._renderCreateRow(0,12,0,"")} |
| 1201 |
${this._renderTreeBody(t,i)} |
| 1202 |
</div> |
| 1203 |
<div class="os-cat__footer"> |
| 1204 |
<span class="dashicons dashicons-info-outline" aria-hidden="true"></span> |
| 1205 |
<span> |
| 1206 |
Posts with no category appear as |
| 1207 |
<strong>Uncategorized</strong>. |
| 1208 |
</span> |
| 1209 |
</div> |
| 1210 |
</div> |
| 1211 |
`}_renderTreeBody(e,t){return e?d` |
| 1212 |
<div class="os-cat__loading"> |
| 1213 |
<span class="os-cat__loading-spinner" aria-hidden="true"></span> |
| 1214 |
${"Loading categories…"} |
| 1215 |
</div> |
| 1216 |
`:t.length===0?d` |
| 1217 |
<div class="os-cat__empty"> |
| 1218 |
${this._items.length===0?"No categories yet — create one in WordPress to assign.":"No matches."} |
| 1219 |
</div> |
| 1220 |
`:t.map((s,o)=>this._renderRow(s,o,t.length))}_renderRow(e,t,s){const{node:o,hasChildren:i}=e,n=this._value.includes(o.item.id),a=!this._collapsed.has(o.item.id),l=12+o.depth*16,c=o.depth>0?o.depth*16:0,u=t===this._focusedRow;return d` |
| 1221 |
<div class="os-cat__row-block"> |
| 1222 |
<div |
| 1223 |
class="os-cat__row" |
| 1224 |
role="option" |
| 1225 |
aria-selected=${n?"true":"false"} |
| 1226 |
data-selected=${n?"true":"false"} |
| 1227 |
data-expanded=${a?"true":"false"} |
| 1228 |
data-focused=${u?"true":"false"} |
| 1229 |
data-row-id=${String(o.item.id)} |
| 1230 |
style=${`--os-ui-cat-row-indent: ${l}px; --os-ui-cat-guide-width: ${c}px;`} |
| 1231 |
@mouseenter=${()=>{this._focusedRow=t,this.requestUpdate()}} |
| 1232 |
@click=${h=>{h.preventDefault(),this._toggleSelection(o.item.id)}} |
| 1233 |
> |
| 1234 |
${i?d`<button |
| 1235 |
type="button" |
| 1236 |
class="os-cat__expander" |
| 1237 |
aria-label=${a?"Collapse":"Expand"} |
| 1238 |
@click=${h=>{h.stopPropagation(),this._toggleExpand(o.item.id)}} |
| 1239 |
>${dr()}</button>`:d`<span class="os-cat__expander os-cat__expander--placeholder" aria-hidden="true">${dr()}</span>`} |
| 1240 |
<span class="os-cat__check" aria-hidden="true">${ic()}</span> |
| 1241 |
<span class="os-cat__label">${this._highlight(o.item.name,this._query)}</span> |
| 1242 |
${Bt(o.item)?d``:d`<button |
| 1243 |
type="button" |
| 1244 |
class="os-cat__delete" |
| 1245 |
aria-label=${`Delete ${o.item.name}`} |
| 1246 |
title=${`Delete ${o.item.name}`} |
| 1247 |
@click=${h=>this._onDeleteClick(h,o.item)} |
| 1248 |
>${rc()}</button>`} |
| 1249 |
</div> |
| 1250 |
${a&&!Bt(o.item)?this._renderCreateRow(o.item.id,12+(o.depth+1)*16,(o.depth+1)*16,o.item.name):d``} |
| 1251 |
</div> |
| 1252 |
`}_renderCreateRow(e,t,s,o){const i=this._creatingValues.get(e)??"",n=this._creatingPending.has(e),a=e===0?"Add new category…":`Add child of "${o}"…`;return d` |
| 1253 |
<div |
| 1254 |
class="os-cat__create-row" |
| 1255 |
style=${`--os-ui-cat-row-indent: ${t}px; --os-ui-cat-guide-width: ${s}px;`} |
| 1256 |
@click=${l=>l.stopPropagation()} |
| 1257 |
> |
| 1258 |
<div class="os-cat__create-wrap"> |
| 1259 |
<input |
| 1260 |
class="os-cat__create-input" |
| 1261 |
type="text" |
| 1262 |
autocomplete="off" |
| 1263 |
spellcheck="false" |
| 1264 |
placeholder=${a} |
| 1265 |
aria-label=${a} |
| 1266 |
.value=${i} |
| 1267 |
?disabled=${n} |
| 1268 |
@input=${l=>this._onCreateInput(l,e)} |
| 1269 |
@keydown=${l=>this._onCreateKeydown(l,e)} |
| 1270 |
/> |
| 1271 |
${n?d`<span class="os-cat__create-spinner" aria-hidden="true"></span>`:d`<button |
| 1272 |
type="button" |
| 1273 |
class="os-cat__create-submit" |
| 1274 |
aria-label=${e===0?"Create category":`Create child of ${o}`} |
| 1275 |
?disabled=${i.trim().length===0} |
| 1276 |
@click=${l=>{l.stopPropagation(),this._submitCreate(e)}} |
| 1277 |
>${oc()}</button>`} |
| 1278 |
</div> |
| 1279 |
</div> |
| 1280 |
`}_onCreateInput(e,t){const s=e.target.value;s===""?this._creatingValues.delete(t):this._creatingValues.set(t,s),this.requestUpdate()}_onCreateKeydown(e,t){if(e.key==="Escape"){e.preventDefault(),this._creatingValues.delete(t),this.requestUpdate();return}e.key==="Enter"&&(e.preventDefault(),this._submitCreate(t))}_submitCreate(e){const t=(this._creatingValues.get(e)??"").trim();!t||this._creatingPending.has(e)||(this._creatingPending.add(e),this.requestUpdate(),this.emit("os-categories-create",{name:t,parent:e}))}endCreating(e=0){this._creatingPending.delete(e),this._creatingValues.delete(e),this.requestUpdate()}failCreating(e=0,t){this._creatingPending.delete(e),this.requestUpdate()}_buildTree(){const e=new Map;for(const i of this._items)e.set(i.id,{item:i,children:[],depth:0});const t=[];for(const i of e.values()){const n=i.item.parent;n&&e.has(n)?e.get(n).children.push(i):t.push(i)}const s=(i,n)=>{i.depth=n;for(const a of i.children)s(a,n+1)};for(const i of t)s(i,0);const o=i=>{i.sort((n,a)=>{const l=Bt(n.item),c=Bt(a.item);return l!==c?l?-1:1:n.item.name.localeCompare(a.item.name)});for(const n of i)o(n.children)};return o(t),t}_filterTree(e,t){const s=t.trim().toLowerCase();if(!s)return e;const o=i=>{if(i.item.name.toLowerCase().includes(s))return{item:i.item,children:i.children.slice(),depth:i.depth};const a=i.children.map(o).filter(l=>l!==null);return a.length>0?{item:i.item,children:a,depth:i.depth}:null};return e.map(o).filter(i=>i!==null)}_flattenForDisplay(e){const t=[],s=this._query.trim()!=="",o=i=>{for(const n of i)t.push({node:n,visible:!0,hasChildren:n.children.length>0}),!(this._collapsed.has(n.item.id)&&!s)&&n.children.length>0&&o(n.children)};return o(e),t}_selectedItemsInOrder(){const e=new Map;for(const o of this._items)e.set(o.id,o);const t=[],s=[];for(const o of this._value){const i=e.get(o);i&&(i.name.toLowerCase()===cr||i.id===1?s.push(i):t.push(i))}return t.length>0?t:s.length>0?[]:t}_highlight(e,t){const s=t.trim();if(!s)return e;const o=e.toLowerCase(),i=s.toLowerCase(),n=o.indexOf(i);return n===-1?e:d`${e.slice(0,n)}<span class="os-cat__match" |
| 1281 |
>${e.slice(n,n+s.length)}</span |
| 1282 |
>${e.slice(n+s.length)}`}_toggleSelection(e){const t=this._value.includes(e)?this._value.filter(s=>s!==e):[...this._value,e];this.emit("os-categories-change",{value:t})}_onDeleteClick(e,t){e.stopPropagation(),e.preventDefault(),this.emit("os-categories-delete",{id:t.id,name:t.name})}_toggleExpand(e){this._collapsed.has(e)?this._collapsed.delete(e):this._collapsed.add(e),this.requestUpdate()}_onSearchInput(e){this._query=e.target.value,this._focusedRow=0,this.requestUpdate()}_onSearchKeydown(e,t){switch(e.key){case"ArrowDown":{if(t.length===0)return;e.preventDefault(),this._focusedRow=this._focusedRow+1>=t.length?0:this._focusedRow+1,this.requestUpdate(),this._scrollFocusedIntoView();return}case"ArrowUp":{if(t.length===0)return;e.preventDefault(),this._focusedRow=this._focusedRow<=0?t.length-1:this._focusedRow-1,this.requestUpdate(),this._scrollFocusedIntoView();return}case"ArrowRight":{if(this._focusedRow<0||this._focusedRow>=t.length)return;const s=t[this._focusedRow];s.hasChildren&&this._collapsed.has(s.node.item.id)&&(e.preventDefault(),this._toggleExpand(s.node.item.id));return}case"ArrowLeft":{if(this._focusedRow<0||this._focusedRow>=t.length)return;const s=t[this._focusedRow];s.hasChildren&&!this._collapsed.has(s.node.item.id)&&(e.preventDefault(),this._toggleExpand(s.node.item.id));return}case"Enter":case" ":{if(this._focusedRow<0||this._focusedRow>=t.length)return;e.preventDefault();const s=t[this._focusedRow];this._toggleSelection(s.node.item.id);return}case"Escape":e.preventDefault(),this.closePicker()}}_scrollFocusedIntoView(){queueMicrotask(()=>{const e=this.shadowRoot?.querySelector(".os-cat__tree");if(!e)return;const t=e.querySelector('.os-cat__row[data-focused="true"]');if(!t)return;const s=t.getBoundingClientRect(),o=e.getBoundingClientRect();s.top<o.top?t.scrollIntoView({block:"nearest"}):s.bottom>o.bottom&&t.scrollIntoView({block:"nearest"})})}_positionPopover(){const e=this.shadowRoot?.querySelector(".os-cat__popover");if(!e)return;const t=this.getBoundingClientRect(),s=e.getBoundingClientRect(),o=window.innerWidth,i=window.innerHeight,n=8;let a=t.bottom+4;const l=a+s.height+n>i,c=t.top-4-s.height>=n;l&&c?a=t.top-4-s.height:l&&(a=Math.max(n,i-s.height-n));let u=t.left;u+s.width+n>o&&(u=t.right-s.width),u=Math.max(n,Math.min(u,o-s.width-n)),e.style.top=`${a}px`,e.style.left=`${u}px`}};yt.props=["placeholder","add-label","disabled","readonly","open","loading","max-visible"],yt.styles=[Yl],yt.help=void 0;let zo=yt;v("os-category-picker",zo);function dr(){return I("chevron-right",{size:14})}function oc(){return I("plus",{size:16})}function ic(){return I("check",{size:null})}function rc(){return I("close",{size:null})}const nc=b` ${$} ${Tt}:host(:not( [ interactive ] ) ) .os-holo-glint,:host( [ disabled ] ) .os-holo-glint{display:none}:host{display:flex;flex-direction:column;position:relative;gap:var( --os-ui-card-gap,12px );padding:var( --os-ui-card-padding,16px );border:1px solid var( --os-ui-card-border,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) );border-radius:var( --os-ui-card-radius,12px );background:var( --os-ui-card-bg,var( --os-ui-surface,#fff ) );background-image:var( --os-ui-panel-bg-image,none );background-repeat:var( --os-ui-panel-bg-image-repeat,repeat );background-size:var( --os-ui-panel-bg-image-size,auto );background-position:var( --os-ui-panel-bg-image-position,center );color:var( --os-ui-card-fg,inherit );box-sizing:border-box;min-width:0;transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease}:host( [ hidden ] ){display:none}:host( [ compact ] ){padding:var( --os-ui-card-padding-compact,10px );gap:var( --os-ui-card-gap-compact,6px );border-radius:var( --os-ui-card-radius-compact,8px )}:host( [ interactive ] ){cursor:pointer;outline-offset:2px}:host( [ interactive ]:hover ),:host( [ interactive ]:focus-visible ){transform:translateY( -2px );box-shadow:var( --os-ui-card-shadow-hover,0 4px 16px rgba( 0,0,0,0.08 ) );border-color:var( --os-ui-card-border-hover,var( --os-ui-border-strong,rgba( 0,0,0,0.16 ) ) )}:host( [ interactive ]:focus-visible ){outline:none;box-shadow:var( --_holo-focus )}:host( [ selected ] ){border-color:var( --os-ui-card-border-selected,var( --wp-admin-theme-color,#2271b1 ) );box-shadow:var( --os-ui-card-shadow-selected,0 0 0 1px var( --wp-admin-theme-color,#2271b1 ) inset )}:host( [ selected ] )::after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background-image:var( --_holo-edge );pointer-events:none;-webkit-mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );-webkit-mask-composite:xor;mask:linear-gradient( #000 0 0 ) content-box,linear-gradient( #000 0 0 );mask-composite:exclude}:host( [ disabled ] ){opacity:0.55;pointer-events:none;cursor:not-allowed}@media ( prefers-reduced-motion:reduce ){:host{transition:none}:host( [ interactive ]:hover ),:host( [ interactive ]:focus-visible ){transform:none}}::slotted( header ){display:flex;align-items:center;gap:12px;min-width:0}::slotted( footer ){display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}`,ur="[data-noclick]",wt=class wt extends m{constructor(){super(...arguments),this._onClick=e=>{!this.hasAttribute("interactive")||this.hasAttribute("disabled")||e.target?.closest(ur)||this._emitCardClick(e)},this._onKeyDown=e=>{if(!this.hasAttribute("interactive")||this.hasAttribute("disabled")||e.key!=="Enter"&&e.key!==" "&&e.key!=="Spacebar")return;const t=e.target;t&&t!==this&&t.closest(ur)||t instanceof HTMLElement&&t!==this&&(t.tagName==="BUTTON"||t.tagName==="A"||t.tagName==="INPUT"||t.tagName==="TEXTAREA"||t.tagName==="SELECT")||(e.preventDefault(),this._emitCardClick(e))}}connectedCallback(){super.connectedCallback(),this._syncRoles(),this.addEventListener("click",this._onClick),this.addEventListener("keydown",this._onKeyDown)}disconnectedCallback(){this.removeEventListener("click",this._onClick),this.removeEventListener("keydown",this._onKeyDown)}render(){return this._syncRoles(),d`<span class="os-holo-glint" aria-hidden="true"></span |
| 1283 |
><slot name="header"></slot><slot></slot><slot name="footer"></slot>`}_syncRoles(){const e=this.hasAttribute("interactive"),t=this.hasAttribute("disabled");e?(this.hasAttribute("role")||this.setAttribute("role","button"),this.setAttribute("tabindex",t?"-1":"0"),this.setAttribute("aria-disabled",t?"true":"false")):(this.removeAttribute("role"),this.removeAttribute("tabindex"),this.removeAttribute("aria-disabled"))}_emitCardClick(e){this.dispatchEvent(new CustomEvent("os-card-click",{detail:{originalEvent:e},bubbles:!0,composed:!0}))}};wt.props=["interactive","selected","compact","disabled"],wt.styles=[nc],wt.help=void 0;let Eo=wt;v("os-card",Eo);const ac=b`:host{display:block;--_track:var( --os-ui-rating-track,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) );--_fill:var( --os-ui-rating-fill,linear-gradient( 90deg,#f5af00 0%,#ffd245 100% ) );--_star:var( --os-ui-rating-star,#f5af00 );--_star-empty:var( --os-ui-rating-star-empty,var( --os-ui-fg-faint,rgba( 0,0,0,0.18 ) ) );--_surface:var( --os-ui-rating-surface,var( --os-ui-surface-elevated,rgba( 255,255,255,0.7 ) ) );--_border:var( --os-ui-rating-border,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) );--_fg:var( --os-ui-rating-fg,var( --os-ui-fg,inherit ) );--_fg-muted:var( --os-ui-rating-fg-muted,var( --os-ui-fg-muted,#666 ) )}:host( [ hidden ] ){display:none}.summary-card{display:grid;grid-template-columns:minmax( 140px,180px ) 1fr;gap:28px;align-items:center;padding:18px 20px;background:var( --_surface );border:1px solid var( --_border );border-radius:14px;color:var( --_fg )}.summary{display:flex;flex-direction:column;align-items:center;gap:8px;padding-inline-end:20px;border-inline-end:1px solid var( --_border )}.big{font-size:44px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-0.02em;color:var( --_fg )}.stars{display:inline-flex;gap:2px;color:var( --_star )}.stars svg{width:16px;height:16px;display:block}.stars .empty{color:var( --_star-empty )}.total{font-size:12px;color:var( --_fg-muted )}.bars{display:grid;gap:6px;min-width:0}.row{display:grid;grid-template-columns:42px 1fr 60px;gap:12px;align-items:center;font-size:12.5px;color:var( --_fg-muted )}.row__label{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums;font-weight:600}.row__label svg{width:11px;height:11px;color:var( --_star )}.row__track{position:relative;height:10px;background:var( --_track );border-radius:999px;overflow:hidden}.row__fill{position:absolute;inset:0;background:var( --_fill );border-radius:999px;transform-origin:left center;transform:scaleX( var( --ratio,0 ) );transition:transform 600ms cubic-bezier( 0.2,0.8,0.2,1 )}:host(:dir( rtl ) ) .row__fill,:host-context( [ dir='rtl' ] ) .row__fill{transform-origin:right center}.row__count{text-align:end;font-variant-numeric:tabular-nums;color:var( --_fg )}@media ( prefers-reduced-motion:reduce ){.row__fill{transition:none}}@media ( max-width:540px ){.summary-card{grid-template-columns:1fr;gap:16px}.summary{padding-inline-end:0;border-inline-end:0;border-block-end:1px solid var( --_border );padding-block-end:14px}}`,kt=class kt extends m{constructor(){super(...arguments),this._ratings={}}get ratings(){return{...this._ratings}}set ratings(e){this._ratings=e?{...e}:{},this.requestUpdate()}render(){const e=lc(hr(this,"rating")),t=e/100*5,s=hr(this,"total"),o=s>0?s:(this._ratings[5]??0)+(this._ratings[4]??0)+(this._ratings[3]??0)+(this._ratings[2]??0)+(this._ratings[1]??0),i=new Intl.NumberFormat,n=e>0?(e/100*5).toFixed(1):"—";return d` |
| 1284 |
<div class="summary-card" role="img" aria-label=${cc(e,o)}> |
| 1285 |
<div class="summary"> |
| 1286 |
<div class="big">${n}</div> |
| 1287 |
<div class="stars" aria-hidden="true"> |
| 1288 |
${dc(t)} |
| 1289 |
</div> |
| 1290 |
<div class="total"> |
| 1291 |
${o===1?"1 rating":`${i.format(o)} ratings`} |
| 1292 |
</div> |
| 1293 |
</div> |
| 1294 |
<div class="bars"> |
| 1295 |
${[5,4,3,2,1].map(a=>{const l=this._ratings[String(a)]??0,c=o===0?0:l/o;return d` |
| 1296 |
<div |
| 1297 |
class="row" |
| 1298 |
role="presentation" |
| 1299 |
aria-label=${`${a} stars: ${i.format(l)}`} |
| 1300 |
> |
| 1301 |
<span class="row__label"> |
| 1302 |
${a} ${pr()} |
| 1303 |
</span> |
| 1304 |
<span class="row__track"> |
| 1305 |
<span |
| 1306 |
class="row__fill" |
| 1307 |
style=${`--ratio: ${c.toFixed(4)}`} |
| 1308 |
></span> |
| 1309 |
</span> |
| 1310 |
<span class="row__count">${i.format(l)}</span> |
| 1311 |
</div> |
| 1312 |
`})} |
| 1313 |
</div> |
| 1314 |
</div> |
| 1315 |
`}};kt.props=["rating","total"],kt.styles=[ac],kt.help=void 0;let Lo=kt;function hr(r,e){const t=r.getAttribute(e);if(t===null||t==="")return 0;const s=Number(t);return Number.isFinite(s)?s:0}function lc(r){return r<0?0:r>100?100:r}function cc(r,e){return e===0?"No ratings yet":`Average rating ${(r/100*5).toFixed(1)} out of 5, from ${e} ratings`}function dc(r){const e=Math.floor(r),t=r-e>=.5?1:0,s=5-e-t,o=[];for(let i=0;i<e;i++)o.push(pr());for(let i=0;i<t;i++)o.push(uc());for(let i=0;i<s;i++)o.push(hc());return o}function pr(){return d` |
| 1316 |
<svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"> |
| 1317 |
<path |
| 1318 |
d="M8 1.5l2.06 4.17 4.6.67-3.33 3.25.79 4.58L8 12L3.88 14.17l.79-4.58L1.34 6.34l4.6-.67L8 1.5z" |
| 1319 |
/> |
| 1320 |
</svg> |
| 1321 |
`}function uc(){return d` |
| 1322 |
<svg viewBox="0 0 16 16" aria-hidden="true"> |
| 1323 |
<defs> |
| 1324 |
<linearGradient id="os-half-star"> |
| 1325 |
<stop offset="50%" stop-color="currentColor" /> |
| 1326 |
<stop |
| 1327 |
offset="50%" |
| 1328 |
stop-color="currentColor" |
| 1329 |
stop-opacity="0.22" |
| 1330 |
/> |
| 1331 |
</linearGradient> |
| 1332 |
</defs> |
| 1333 |
<path |
| 1334 |
fill="url(#os-half-star)" |
| 1335 |
d="M8 1.5l2.06 4.17 4.6.67-3.33 3.25.79 4.58L8 12L3.88 14.17l.79-4.58L1.34 6.34l4.6-.67L8 1.5z" |
| 1336 |
/> |
| 1337 |
</svg> |
| 1338 |
`}function hc(){return d` |
| 1339 |
<svg |
| 1340 |
class="empty" |
| 1341 |
viewBox="0 0 16 16" |
| 1342 |
fill="currentColor" |
| 1343 |
aria-hidden="true" |
| 1344 |
> |
| 1345 |
<path |
| 1346 |
d="M8 1.5l2.06 4.17 4.6.67-3.33 3.25.79 4.58L8 12L3.88 14.17l.79-4.58L1.34 6.34l4.6-.67L8 1.5z" |
| 1347 |
/> |
| 1348 |
</svg> |
| 1349 |
`}v("os-rating-summary",Lo);const pc=b`:host{display:flex;align-items:flex-start;gap:10px;width:100%;box-sizing:border-box;padding:10px 14px;font:var( --os-ui-notice-font,13px/1.5 var( --os-font,system-ui ) );color:var( --os-ui-notice-color,var( --os-ui-fg,#1d2327 ) );background:var( --os-ui-notice-bg,var( --os-ui-hover,rgba( 0,0,0,0.04 ) ) );border-block-end:1px solid var( --os-ui-notice-border,var( --os-ui-border,rgba( 0,0,0,0.08 ) ) );border-inline-start:4px solid var( --os-ui-notice-accent,var( --os-ui-border,#646970 ) )}:host( [ hidden ] ){display:none}.os-notice__icon{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;color:var( --os-ui-notice-accent,var( --os-ui-accent,#646970 ) )}.os-notice__icon[ hidden ]{display:none}.os-notice__label{flex:1;min-width:0;word-wrap:break-word}::slotted( a ){color:var( --os-ui-notice-link,var( --wp-admin-theme-color,#2271b1 ) );border-radius:2px}::slotted( a:hover ),::slotted( a:focus-visible ){color:var( --os-ui-notice-link-hover,var( --os-ui-accent-strong,#135e96 ) )}::slotted( a:focus-visible ){outline:2px solid var( --os-ui-notice-link-hover,var( --os-ui-accent-strong,#135e96 ) );outline-offset:2px}::slotted( p:first-child ){margin-block-start:0}::slotted( p:last-child ){margin-block-end:0}.os-notice__close{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;background:transparent;color:inherit;opacity:0.6;cursor:pointer;border-radius:4px;transition:opacity 0.12s ease,background-color 0.12s ease}.os-notice__close:hover{opacity:1;background:var( --os-ui-hover,rgba( 0,0,0,0.06 ) )}.os-notice__close:focus-visible{opacity:1;outline:2px solid var( --wp-admin-theme-color,#2271b1 );outline-offset:1px}.os-notice__close[ hidden ]{display:none}.os-notice__close svg{width:14px;height:14px}:host( [ tone='info' ] ){--os-ui-notice-accent:var( --os-ui-notice-info,var( --os-ui-info-fg,#0969da ) );--os-ui-notice-bg:var( --os-ui-notice-info-bg,rgba( 9,105,218,0.08 ) );--os-ui-notice-border:var( --os-ui-notice-info-border,rgba( 9,105,218,0.16 ) )}:host( [ tone='success' ] ){--os-ui-notice-accent:var( --os-ui-notice-success,var( --os-ui-success-fg,#1a7f37 ) );--os-ui-notice-bg:var( --os-ui-notice-success-bg,rgba( 26,127,55,0.08 ) );--os-ui-notice-border:var( --os-ui-notice-success-border,rgba( 26,127,55,0.16 ) )}:host( [ tone='warning' ] ){--os-ui-notice-accent:var( --os-ui-notice-warning,var( --os-ui-warning-fg,#9a6700 ) );--os-ui-notice-bg:var( --os-ui-notice-warning-bg,rgba( 154,103,0,0.08 ) );--os-ui-notice-border:var( --os-ui-notice-warning-border,rgba( 154,103,0,0.16 ) )}:host( [ tone='error' ] ),:host( [ tone='danger' ] ){--os-ui-notice-accent:var( --os-ui-notice-error,var( --os-ui-danger,#cf222e ) );--os-ui-notice-bg:var( --os-ui-notice-error-bg,rgba( 207,34,46,0.08 ) );--os-ui-notice-border:var( --os-ui-notice-error-border,rgba( 207,34,46,0.16 ) )}:host( [ tone='neutral' ] ){--os-ui-notice-accent:var( --os-ui-notice-neutral,var( --os-ui-fg-muted,#57606a ) );--os-ui-notice-bg:var( --os-ui-notice-neutral-bg,rgba( 87,96,106,0.08 ) );--os-ui-notice-border:var( --os-ui-notice-neutral-border,rgba( 87,96,106,0.16 ) )}`,gc="desktop-mode-notice-dismissed";function bc(){const e=window.wp?.os?.config?.currentUserId;return typeof e=="number"&&e>0?String(e):"anon"}function gr(){return`${gc}:${bc()}`}function Mo(){try{const r=window.localStorage.getItem(gr());if(!r)return{};const e=JSON.parse(r);if(e&&typeof e=="object"&&!Array.isArray(e))return e}catch{}return{}}function br(r){try{window.localStorage.setItem(gr(),JSON.stringify(r))}catch{}}function fc(r){return r?Mo()[r]===!0:!1}function mc(r){if(!r)return;const e=Mo();e[r]=!0,br(e)}function vc(r){if(!r)return;const e=Mo();e[r]&&(delete e[r],br(e))}const $t=class $t extends m{connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","status"),this.hasAttribute("tone")||this.setAttribute("tone","info");const e=this.getAttribute("notice-id");e&&fc(e)&&(this.hidden=!0)}dismiss(){this.hidden=!0;const e=this.getAttribute("notice-id");e&&mc(e),this.emit("os-notice-dismiss",{noticeId:e??void 0})}undismiss(){const e=this.getAttribute("notice-id");e&&vc(e),this.hidden=!1}render(){const e=this.getAttribute("icon"),t=!this.hasAttribute("not-dismissible");return d` |
| 1350 |
<span |
| 1351 |
class="os-notice__icon dashicons ${e??""}" |
| 1352 |
?hidden=${!e} |
| 1353 |
aria-hidden="true" |
| 1354 |
></span> |
| 1355 |
<span class="os-notice__label"><slot></slot></span> |
| 1356 |
<button |
| 1357 |
type="button" |
| 1358 |
class="os-notice__close" |
| 1359 |
?hidden=${!t} |
| 1360 |
aria-label=${k("Dismiss notice")} |
| 1361 |
@click=${s=>this._onDismiss(s)} |
| 1362 |
> |
| 1363 |
${I("close",{size:null})} |
| 1364 |
</button> |
| 1365 |
`}_onDismiss(e){e.preventDefault(),e.stopPropagation(),this.dismiss()}};$t.props=["tone","notDismissible","icon","noticeId"],$t.styles=[pc],$t.help=void 0;let Ro=$t;v("os-notice",Ro);const _c=b` ${$} ${Wo}:host{display:block;--_track-bg:var( --os-ui-progress-track-bg,var( --os-ui-surface-sunken,rgba( 0,0,0,0.08 ) ) );--_fill:var( --os-ui-progress-fill,var( --wp-admin-theme-color,#2271b1 ) );--_height:var( --os-ui-progress-height,6px );--_radius:var( --os-ui-progress-radius,999px );--_label-color:var( --os-ui-progress-label-color,inherit );--_label-size:var( --os-ui-progress-label-size,12px );--_label-gap:var( --os-ui-progress-label-gap,4px );width:100%;font:inherit;color:var( --_label-color )}:host( [ hidden ] ){display:none}.header{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:var( --_label-gap );font-size:var( --_label-size );line-height:1.3}.label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.percent{font-variant-numeric:tabular-nums;opacity:0.75;flex-shrink:0}.track{position:relative;width:100%;height:var( --_height );background:var( --_track-bg );border-radius:var( --_radius );overflow:hidden}.fill{position:absolute;inset-block:0;inset-inline-start:0;width:0;background:var( --_fill );border-radius:inherit;transition:width 0.18s ease-out}:host( [ tone='success' ] ){--os-ui-progress-fill:var( --os-ui-success-fg,#3a8a3a )}:host( [ tone='warning' ] ){--os-ui-progress-fill:var( --os-ui-warning-fg,#dba617 )}:host( [ tone='danger' ] ){--os-ui-progress-fill:var( --os-ui-danger,#d63638 )}:host( [ indeterminate ] ) .fill{width:100%;transition:none;background-image:var( --_fill );background-size:300% 300%;background-repeat:no-repeat;animation:os-holo-shimmer 2.4s var( --_holo-loop ) infinite}:host( [ indeterminate ][ tone ] ) .fill{width:33%;background-image:none;animation:os-progress-sweep 1.1s linear infinite}@keyframes os-progress-sweep{0%{transform:translateX( -120% )}100%{transform:translateX( 320% )}}@media ( prefers-reduced-motion:reduce ){.fill{transition:none}:host( [ indeterminate ] ) .fill,:host( [ indeterminate ][ tone ] ) .fill{animation:none;width:100%;opacity:0.6}}`,Ct=class Ct extends m{constructor(){super(...arguments),this._ownedAriaLabel=null}render(){return d`<div class="root" part="root"> |
| 1366 |
<div class="header" part="header" hidden> |
| 1367 |
<span class="label" part="label"></span> |
| 1368 |
<span class="percent" part="percent"></span> |
| 1369 |
</div> |
| 1370 |
<div class="track" part="track"> |
| 1371 |
<div class="fill" part="fill"></div> |
| 1372 |
</div> |
| 1373 |
</div>`}requestUpdate(){super.requestUpdate(),queueMicrotask(()=>this._paint())}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._paint())}_paint(){const e=this.shadowRoot;if(!e)return;const t=this._readMax(),s=this.hasAttribute("indeterminate")||t<=0,o=s?0:this._readValue(t),i=s?0:o/t,n=Math.round(i*100),a=this.getAttribute("label")??"",l=this.hasAttribute("show-percent"),c=e.querySelector(".fill");c&&!s?c.style.width=`${(i*100).toFixed(2)}%`:c&&s&&c.style.removeProperty("width");const u=e.querySelector(".header"),h=e.querySelector(".label"),p=e.querySelector(".percent");if(u&&h&&p){const g=a||l&&!s;u.hidden=!g,h.textContent=a,p.hidden=!(l&&!s),p.textContent=`${n}%`}this._syncAria(t,o,s,a);const f=e.querySelector(".track");f&&(f.setAttribute("role","progressbar"),f.setAttribute("aria-valuemin","0"),s?(f.removeAttribute("aria-valuenow"),f.removeAttribute("aria-valuemax")):(f.setAttribute("aria-valuemax",String(t)),f.setAttribute("aria-valuenow",String(o))),a?f.setAttribute("aria-label",a):f.removeAttribute("aria-label"))}_syncAria(e,t,s,o){this.setAttribute("role","progressbar"),this.setAttribute("aria-valuemin","0"),s?(this.removeAttribute("aria-valuenow"),this.removeAttribute("aria-valuemax")):(this.setAttribute("aria-valuemax",String(e)),this.setAttribute("aria-valuenow",String(t)));const i=this.getAttribute("aria-label");o?(i===null||i===this._ownedAriaLabel)&&(this.setAttribute("aria-label",o),this._ownedAriaLabel=o):i!==null&&i===this._ownedAriaLabel&&(this.removeAttribute("aria-label"),this._ownedAriaLabel=null)}_readMax(){const e=this.getAttribute("max");if(e===null)return 100;const t=parseFloat(e);return Number.isFinite(t)?t:100}_readValue(e){const t=parseFloat(this.getAttribute("value")??"0");return!Number.isFinite(t)||t<0?0:t>e?e:t}};Ct.props=["value","max","indeterminate","tone","label","showPercent"],Ct.styles=[_c],Ct.help=void 0;let Io=Ct;v("os-progress-bar",Io);const xc=b`:host{--_gap:var( --os-ui-field-row-gap,6px );--_label-width:var( --os-ui-field-row-label-width,12rem );display:flex;flex-direction:column;gap:var( --_gap );container-type:inline-size}:host( [ hidden ] ){display:none}.os-field-row__head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:0}.os-field-row__head:empty{display:none}.os-field-row__label{font-size:13px;font-weight:500;line-height:1.4;color:var( --os-ui-fg,#1d2327 );cursor:default}.os-field-row__required{margin-inline-start:2px;color:var( --os-ui-danger,#d63638 )}.os-field-row__action:empty{display:none}.os-field-row__control{min-width:0}.os-field-row__hint,.os-field-row__error{margin:0;font-size:12px;line-height:1.4}.os-field-row__hint{color:var( --os-ui-fg-muted,#646970 )}.os-field-row__error{color:var( --os-ui-danger,#d63638 )}:host( [ layout='inline' ] ){display:grid;grid-template-columns:var( --_label-width ) minmax( 0,1fr );align-items:start;column-gap:12px;row-gap:2px}:host( [ layout='inline' ] ) .os-field-row__head{grid-column:1;grid-row:1;padding-block-start:5px}:host( [ layout='inline' ] ) .os-field-row__control{grid-column:2;grid-row:1}:host( [ layout='inline' ] ) .os-field-row__hint,:host( [ layout='inline' ] ) .os-field-row__error{grid-column:2;grid-row:2}@container ( max-width:30rem ){:host( [ layout='inline' ] ){display:flex;flex-direction:column;gap:var( --_gap )}:host( [ layout='inline' ] ) .os-field-row__head{padding-block-start:0}}::slotted( input:where(:not( [ type='checkbox' ],[ type='radio' ] ) ) ),::slotted( select ),::slotted( textarea ){box-sizing:border-box;width:100%;padding:6px 8px;border-radius:4px;background:var( --os-ui-field-bg,#fff );border:1px solid var( --os-ui-field-border,#8c8f94 );color:var( --os-ui-field-fg,#2c3338 );font:inherit}`,yc='input, select, textarea, [contenteditable="true"], [role="textbox"], [role="combobox"], [os-field-control]';let wc=0;const At=class At extends m{constructor(){super(...arguments),this.uid=`os-field-row-${++wc}`,this.syncControl=()=>{const e=this.control;if(!e)return;const t=this.error,s=this.hint,o=this.hasAttribute("required");let i="";t?i=`${this.uid}-error`:s&&(i=`${this.uid}-hint`);const n=(e.getAttribute("aria-describedby")??"").split(/\s+/).filter(l=>l&&!l.startsWith(this.uid)),a=i?[...n,i]:n;a.length?e.setAttribute("aria-describedby",a.join(" ")):e.removeAttribute("aria-describedby"),t?e.setAttribute("aria-invalid","true"):e.getAttribute("aria-invalid")==="true"&&e.removeAttribute("aria-invalid"),o&&(e.setAttribute("required",""),e.setAttribute("aria-required","true"))},this.focusControl=()=>{const e=this.control;e&&e.focus?.()}}get control(){const e=this["control-id"];return e?Array.from(this.querySelectorAll("[id]")).find(t=>t.id===e)??null:this.querySelector(yc)}render(){const e=this.label||"",t=this.hint||"",s=this.error||"",o=this.hasAttribute("required");queueMicrotask(this.syncControl);let i=null;return s?i=d`<p |
| 1374 |
class="os-field-row__error" |
| 1375 |
id="${this.uid}-error" |
| 1376 |
role="alert" |
| 1377 |
> |
| 1378 |
${s} |
| 1379 |
</p>`:t&&(i=d`<p class="os-field-row__hint" id="${this.uid}-hint"> |
| 1380 |
${t} |
| 1381 |
</p>`),d` |
| 1382 |
<div class="os-field-row__head"> |
| 1383 |
${e?d`<span |
| 1384 |
class="os-field-row__label" |
| 1385 |
id="${this.uid}-label" |
| 1386 |
@click=${this.focusControl} |
| 1387 |
> |
| 1388 |
${e}${o?d`<span |
| 1389 |
class="os-field-row__required" |
| 1390 |
aria-hidden="true" |
| 1391 |
>*</span |
| 1392 |
>`:null} |
| 1393 |
</span>`:null} |
| 1394 |
<span class="os-field-row__action"><slot name="action"></slot></span> |
| 1395 |
</div> |
| 1396 |
<div class="os-field-row__control"> |
| 1397 |
<slot @slotchange=${this.syncControl}></slot> |
| 1398 |
</div> |
| 1399 |
${i} |
| 1400 |
`}};At.props=["label","hint","error","required","layout","control-id"],At.styles=[xc],At.help=void 0;let Po=At;v("os-field-row",Po);const kc=b`:host{--_gap:var( --os-ui-repeater-gap,8px );--_row-bg:var( --os-ui-repeater-row-bg,var( --os-ui-surface,#fff ) );--_border:var( --os-ui-repeater-row-border,var( --os-ui-border,#dcdcde ) );display:flex;flex-direction:column;gap:var( --_gap )}:host( [ hidden ] ){display:none}.os-repeater__rows{display:flex;flex-direction:column;gap:var( --_gap )}.os-repeater__row{display:flex;align-items:start;gap:6px;padding:8px;border:1px solid var( --_border );border-radius:6px;background:var( --_row-bg )}.os-repeater__content{flex:1 1 auto;min-width:0}.os-repeater__handles{display:flex;flex-direction:column;gap:2px;flex:0 0 auto}.os-repeater__handle,.os-repeater__remove{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:0;border-radius:4px;background:transparent;color:var( --os-ui-fg-muted,#646970 );cursor:pointer}.os-repeater__handle:hover:not(:disabled ),.os-repeater__remove:hover:not(:disabled ){background:var( --os-ui-hover,rgba( 0,0,0,0.06 ) );color:var( --os-ui-fg,#1d2327 )}.os-repeater__remove:hover:not(:disabled ){color:var( --os-ui-danger,#d63638 )}.os-repeater__handle:disabled,.os-repeater__remove:disabled{opacity:0.4;cursor:default}.os-repeater__handle:focus-visible,.os-repeater__remove:focus-visible{outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:1px}.os-repeater__remove{flex:0 0 auto}.os-repeater__empty{padding:12px;border:1px dashed var( --_border );border-radius:6px;font-size:12px;color:var( --os-ui-fg-muted,#646970 )}.os-repeater__empty:has( slot[ name='empty' ]:not(:has( * ) ) ):empty{display:none}.os-repeater__footer{display:flex;align-items:center;gap:8px}`,St=class St extends m{constructor(){super(...arguments),this._keys=[],this.onAdd=()=>{this.isDisabled||this.emit("os-repeater-add",{keys:[...this._keys]})},this.onKeydown=e=>{if(!e.altKey||!this.hasAttribute("reorderable"))return;let t=0;if(e.key==="ArrowUp"?t=-1:e.key==="ArrowDown"&&(t=1),t===0)return;const o=e.target?.closest?.('[slot^="row-"]')?.getAttribute("slot")?.slice(4);o&&(e.preventDefault(),this.onMove(o,t))}}get keys(){return this._keys}set keys(e){this._keys=Array.isArray(e)?[...e]:[],this.requestUpdate()}get isDisabled(){return this.hasAttribute("disabled")}numeric(e){const t=this.getAttribute(e);if(t===null||t.trim()==="")return null;const s=Number(t);return Number.isFinite(s)?s:null}onRemove(e){if(this.isDisabled)return;const t=this._keys.indexOf(e);this.emit("os-repeater-remove",{key:e,index:t,keys:this._keys.filter(s=>s!==e)})}onMove(e,t){if(this.isDisabled)return;const s=this._keys.indexOf(e),o=s+t;if(s<0||o<0||o>=this._keys.length)return;const i=[...this._keys];i.splice(o,0,...i.splice(s,1)),this.emit("os-repeater-move",{key:e,from:s,to:o,keys:i})}render(){const e=this._keys,t=this.isDisabled,s=this.hasAttribute("reorderable"),o=this,i=o["row-label"]||"row",n=o["add-label"]||"Add row",a=o["empty-text"]||"",l=this.numeric("min"),c=this.numeric("max"),u=l===null||e.length>l,h=c===null||e.length<c;return d` |
| 1401 |
<div class="os-repeater__rows" @keydown=${this.onKeydown}> |
| 1402 |
${e.length===0?d`<div class="os-repeater__empty"> |
| 1403 |
<slot name="empty">${a}</slot> |
| 1404 |
</div>`:e.map((p,f)=>d` |
| 1405 |
<div class="os-repeater__row" data-key=${p}> |
| 1406 |
${s?d`<div class="os-repeater__handles"> |
| 1407 |
<button |
| 1408 |
type="button" |
| 1409 |
class="os-repeater__handle" |
| 1410 |
?disabled=${t||f===0} |
| 1411 |
aria-label="Move ${i} up" |
| 1412 |
@click=${()=>this.onMove(p,-1)} |
| 1413 |
> |
| 1414 |
<os-icon name="arrow-up-alt2" size="14"></os-icon> |
| 1415 |
</button> |
| 1416 |
<button |
| 1417 |
type="button" |
| 1418 |
class="os-repeater__handle" |
| 1419 |
?disabled=${t||f===e.length-1} |
| 1420 |
aria-label="Move ${i} down" |
| 1421 |
@click=${()=>this.onMove(p,1)} |
| 1422 |
> |
| 1423 |
<os-icon name="arrow-down-alt2" size="14"></os-icon> |
| 1424 |
</button> |
| 1425 |
</div>`:null} |
| 1426 |
<div class="os-repeater__content"> |
| 1427 |
<slot name="row-${p}"></slot> |
| 1428 |
</div> |
| 1429 |
<button |
| 1430 |
type="button" |
| 1431 |
class="os-repeater__remove" |
| 1432 |
?disabled=${t||!u} |
| 1433 |
aria-label="Remove ${i}" |
| 1434 |
@click=${()=>this.onRemove(p)} |
| 1435 |
> |
| 1436 |
<os-icon name="trash" size="14"></os-icon> |
| 1437 |
</button> |
| 1438 |
</div> |
| 1439 |
`)} |
| 1440 |
</div> |
| 1441 |
<div class="os-repeater__footer"> |
| 1442 |
<os-button |
| 1443 |
variant="secondary" |
| 1444 |
size="small" |
| 1445 |
?disabled=${t||!h} |
| 1446 |
@click=${this.onAdd} |
| 1447 |
>${n}</os-button |
| 1448 |
> |
| 1449 |
<slot name="footer"></slot> |
| 1450 |
</div> |
| 1451 |
`}};St.props=["add-label","empty-text","disabled","reorderable","min","max","row-label"],St.styles=[kc],St.help=void 0;let To=St;v("os-repeater",To);const $c=b`:host{--_bg:var( --os-ui-token-field-bg,var( --os-ui-field-bg,#fff ) );--_border:var( --os-ui-token-field-border,var( --os-ui-field-border,#8c8f94 ) );--_fg:var( --os-ui-token-field-fg,var( --os-ui-field-fg,#2c3338 ) );--_chip-bg:var( --os-ui-token-field-chip-bg,var( --os-ui-surface-raised,rgba( 0,0,0,0.06 ) ) );display:block;position:relative}:host( [ hidden ] ){display:none}.os-token-field{display:flex;flex-direction:column;gap:6px}.os-token-field__label{font-size:13px;font-weight:500;color:var( --os-ui-fg,#1d2327 )}.os-token-field__input{box-sizing:border-box;width:100%;padding:6px 8px;border-radius:4px;background:var( --_bg );border:1px solid var( --_border );color:var( --_fg );font:inherit;resize:vertical}.os-token-field__input:focus-visible{outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:1px}.os-token-field__input:disabled{opacity:0.6}.os-token-field__toolbar{display:flex;align-items:center;gap:6px}.os-token-field__catalogue{position:absolute;inset-inline-start:0;inset-block-start:100%;z-index:20;max-height:18rem;overflow-y:auto;width:100%;padding:4px;box-sizing:border-box;border:1px solid var( --os-ui-border,#dcdcde );border-radius:6px;background:var( --os-ui-surface-elevated,#fff );box-shadow:0 8px 24px rgba( 0,0,0,0.18 )}.os-token-field__group{margin:6px 6px 2px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.04em;color:var( --os-ui-fg-faint,#8c8f94 )}.os-token-field__option{display:grid;grid-template-columns:minmax( 0,1fr ) auto;gap:2px 8px;width:100%;padding:6px 8px;border:0;border-radius:4px;background:transparent;color:var( --os-ui-fg,#1d2327 );font:inherit;text-align:start;cursor:pointer}.os-token-field__option:hover,.os-token-field__option:focus-visible{background:var( --os-ui-hover,rgba( 0,0,0,0.06 ) );outline:none}.os-token-field__option-label{font-size:13px;min-width:0}.os-token-field__option-token{grid-column:2;grid-row:1;padding:1px 5px;border-radius:3px;background:var( --_chip-bg );font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11px;color:var( --os-ui-fg-muted,#646970 )}.os-token-field__option-sample,.os-token-field__option-description{grid-column:1 / -1;font-size:11px;color:var( --os-ui-fg-muted,#646970 )}.os-token-field__option-sample{font-style:italic}.os-token-field__hint{margin:0;font-size:12px;color:var( --os-ui-fg-muted,#646970 )}.os-token-field__preview{display:flex;gap:6px;margin:0;font-size:12px;line-height:1.4;color:var( --os-ui-fg-muted,#646970 )}.os-token-field__preview-label{flex:0 0 auto;font-weight:600}.os-token-field__preview-body{min-width:0;overflow-wrap:anywhere;white-space:pre-wrap}`,zt=class zt extends m{constructor(){super(...arguments),this._tokens=[],this._value="",this.caret=null,this.onInput=e=>{const t=e.target;this._value=t.value,this.emit("os-token-field-input",{value:this._value}),this.requestUpdate()},this.rememberCaret=()=>{const e=this.field;e&&(this.caret={start:e.selectionStart??e.value.length,end:e.selectionEnd??e.value.length})},this.toggleCatalogue=()=>{if(!(this.hasAttribute("disabled")||this.hasAttribute("readonly"))){if(this.isOpen){this.removeAttribute("open");return}this.rememberCaret(),this.setAttribute("open","")}},this.onKeydown=e=>{e.key==="Escape"&&this.isOpen&&(e.stopPropagation(),this.removeAttribute("open"),this.field?.focus())}}get tokens(){return this._tokens}set tokens(e){this._tokens=Array.isArray(e)?[...e]:[],this.requestUpdate()}get value(){return this._value}set value(e){this._value=typeof e=="string"?e:"";const t=this.field;t&&t.value!==this._value&&(t.value=this._value),this.requestUpdate()}get field(){return this.shadowRoot?.querySelector(".os-token-field__input")??null}get isOpen(){return this.hasAttribute("open")}grouped(){const e=new Map;for(const t of this._tokens){const s=t.group??"",o=e.get(s);o?o.push(t):e.set(s,[t])}return[...e.entries()].sort((t,s)=>t[0]===""?1:s[0]===""?-1:0)}preview(){let e=this._value,t=!1;for(const s of this._tokens)!s.sample||!e.includes(s.token)||(e=e.split(s.token).join(s.sample),t=!0);return t?e:null}insert(e){const t=this.field,s=this.caret??{start:this._value.length,end:this._value.length},o=this._value.slice(0,s.start),i=this._value.slice(s.end);this._value=`${o}${e.token}${i}`,this.removeAttribute("open"),t&&(t.value=this._value),this.emit("os-token-insert",{token:e.token,value:this._value}),this.emit("os-token-field-input",{value:this._value}),this.requestUpdate();const n=o.length+e.token.length;this.caret={start:n,end:n},queueMicrotask(()=>{const a=this.field;a?.focus(),a?.setSelectionRange?.(n,n)})}render(){const e=this.label||"",t=this.hint||"",s=this.placeholder||"",o=this,i=o["insert-label"]||"Insert a value",n=o["preview-label"]||"Reads as",a=this.hasAttribute("multiline"),l=this.hasAttribute("disabled"),c=this.hasAttribute("readonly"),u=Number(this.getAttribute("rows"))||4,h=this.preview(),p=this.grouped(),f=a?d`<textarea |
| 1452 |
class="os-token-field__input" |
| 1453 |
rows=${u} |
| 1454 |
placeholder=${s} |
| 1455 |
?disabled=${l} |
| 1456 |
?readonly=${c} |
| 1457 |
.value=${this._value} |
| 1458 |
@input=${this.onInput} |
| 1459 |
@keyup=${this.rememberCaret} |
| 1460 |
@click=${this.rememberCaret} |
| 1461 |
@blur=${this.rememberCaret} |
| 1462 |
></textarea>`:d`<input |
| 1463 |
type="text" |
| 1464 |
class="os-token-field__input" |
| 1465 |
placeholder=${s} |
| 1466 |
?disabled=${l} |
| 1467 |
?readonly=${c} |
| 1468 |
.value=${this._value} |
| 1469 |
@input=${this.onInput} |
| 1470 |
@keyup=${this.rememberCaret} |
| 1471 |
@click=${this.rememberCaret} |
| 1472 |
@blur=${this.rememberCaret} |
| 1473 |
/>`;return d` |
| 1474 |
<div class="os-token-field" @keydown=${this.onKeydown}> |
| 1475 |
${e?d`<span class="os-token-field__label">${e}</span>`:null} |
| 1476 |
${f} |
| 1477 |
<div class="os-token-field__toolbar"> |
| 1478 |
<os-button |
| 1479 |
variant="ghost" |
| 1480 |
size="small" |
| 1481 |
?disabled=${l||c||p.length===0} |
| 1482 |
aria-expanded=${this.isOpen?"true":"false"} |
| 1483 |
@click=${this.toggleCatalogue} |
| 1484 |
> |
| 1485 |
<os-icon name="editor-code" size="14"></os-icon> |
| 1486 |
${i} |
| 1487 |
</os-button> |
| 1488 |
<slot name="action"></slot> |
| 1489 |
</div> |
| 1490 |
${this.isOpen?d`<div |
| 1491 |
class="os-token-field__catalogue" |
| 1492 |
role="listbox" |
| 1493 |
aria-label=${i} |
| 1494 |
> |
| 1495 |
${p.map(([g,x])=>d` |
| 1496 |
${g?d`<p class="os-token-field__group">${g}</p>`:null} |
| 1497 |
${x.map(_=>d` |
| 1498 |
<button |
| 1499 |
type="button" |
| 1500 |
role="option" |
| 1501 |
class="os-token-field__option" |
| 1502 |
@click=${()=>this.insert(_)} |
| 1503 |
> |
| 1504 |
<span class="os-token-field__option-label" |
| 1505 |
>${_.label}</span |
| 1506 |
> |
| 1507 |
<code class="os-token-field__option-token" |
| 1508 |
>${_.token}</code |
| 1509 |
> |
| 1510 |
${_.sample?d`<span class="os-token-field__option-sample" |
| 1511 |
>${_.sample}</span |
| 1512 |
>`:null} |
| 1513 |
${_.description?d`<span |
| 1514 |
class="os-token-field__option-description" |
| 1515 |
>${_.description}</span |
| 1516 |
>`:null} |
| 1517 |
</button> |
| 1518 |
`)} |
| 1519 |
`)} |
| 1520 |
</div>`:null} |
| 1521 |
${t?d`<p class="os-token-field__hint">${t}</p>`:null} |
| 1522 |
${h!==null?d`<p class="os-token-field__preview"> |
| 1523 |
<span class="os-token-field__preview-label" |
| 1524 |
>${n}</span |
| 1525 |
> |
| 1526 |
<span class="os-token-field__preview-body">${h}</span> |
| 1527 |
</p>`:null} |
| 1528 |
</div> |
| 1529 |
`}};zt.props=["label","placeholder","hint","multiline","rows","disabled","readonly","insert-label","preview-label","open"],zt.styles=[$c],zt.help=void 0;let Do=zt;v("os-token-field",Do),window.openStationComponents=!0})(); |
| 1530 |
|