| 1 |
(function(){"use strict";const Ir="desktop-mode";function ri(){return window.wp?.i18n}function d(s,e=Ir){return ri()?.__(s,e)??s}function j(s,...e){const t=ri()?.sprintf;if(t)return t(s,...e);let o=0;return s.replace(/%(?:(\d+)\$)?[sd]/g,(i,n)=>{const r=n?Number.parseInt(n,10)-1:o++;return String(e[r]??"")})}function c(s,...e){return{__wpdHtml:!0,strings:s,values:e}}function Mr(s){return!!s&&s.__wpdHtml===!0}const Dr="$$wpd$$",D=/\$\$wpd\$\$(\d+)\$\$/g;function Nr(s){let e=s[0];for(let t=1;t<s.length;t++)e+=`${Dr}${t-1}$$`+s[t];return e}const ai=new WeakMap;function li(s){const e=ai.get(s);if(e)return e;const t=document.createElement("template");t.innerHTML=Nr(s);const o=[],i=(a,l)=>{if(a.nodeType===Node.ELEMENT_NODE){const p=a;for(const m of Array.from(p.attributes)){const _=m.name,b=m.value,w=_[0];if(D.test(b))if(D.lastIndex=0,w==="@"){const v=D.exec(b);D.lastIndex=0,o.push({path:l,kind:"event",name:_.slice(1),valueIndex:v?Number(v[1]):0}),p.removeAttribute(_)}else if(w==="."){const v=D.exec(b);D.lastIndex=0,o.push({path:l,kind:"prop",name:_.slice(1),valueIndex:v?Number(v[1]):0}),p.removeAttribute(_)}else if(w==="?"){const v=D.exec(b);D.lastIndex=0,o.push({path:l,kind:"bool",name:_.slice(1),valueIndex:v?Number(v[1]):0}),p.removeAttribute(_)}else{const v=[],g=[];let f=0,y;for(D.lastIndex=0;(y=D.exec(b))!==null;)v.push(b.slice(f,y.index)),g.push(Number(y[1])),f=y.index+y[0].length;v.push(b.slice(f)),o.push({path:l,kind:"attr",name:_,template:v,valueIndices:g}),p.setAttribute(_,"")}}}const u=Array.from(a.childNodes);let h=0;for(let p=0;p<u.length;p++){const m=u[p],_=p+h;if(m.nodeType===Node.TEXT_NODE){const b=m.textContent||"";if(!D.test(b)){D.lastIndex=0;continue}D.lastIndex=0;const w=m.parentNode;let v=0,g;const f=[],y=[];for(D.lastIndex=0;(g=D.exec(b))!==null;){g.index>v&&f.push(document.createTextNode(b.slice(v,g.index)));const A=document.createTextNode("");f.push(A),y.push({path:[...l,_+f.length-1],kind:"node",valueIndex:Number(g[1])}),v=g.index+g[0].length}v<b.length&&f.push(document.createTextNode(b.slice(v)));for(const A of f)w.insertBefore(A,m);w.removeChild(m),h+=f.length-1,o.push(...y)}else i(m,[...l,_])}};i(t.content,[]);const r={template:t,buildParts:a=>{const l=[];for(const u of o){let h=a;for(const p of u.path)h=h.childNodes[p];u.kind==="node"?l.push({kind:"node",valueIndex:u.valueIndex,child:{anchor:h,state:null}}):u.kind==="attr"?l.push({kind:"attr",element:h,name:u.name,template:u.template,valueIndices:u.valueIndices}):u.kind==="event"?l.push({kind:"event",valueIndex:u.valueIndex,element:h,name:u.name}):u.kind==="prop"?l.push({kind:"prop",valueIndex:u.valueIndex,element:h,name:u.name}):u.kind==="bool"&&l.push({kind:"bool",valueIndex:u.valueIndex,element:h,name:u.name})}return l}};return ai.set(s,r),r}const ci=new WeakMap;function Hr(s,e){for(const t of s.nodes)if(t.parentNode!==e)return!1;return!0}function L(s,e){const t=ci.get(e);if(t&&t.strings===s.strings&&Hr(t,e)){Nt(t.parts,s.values);return}const o=li(s.strings),i=o.template.content.cloneNode(!0),n=o.buildParts(i),r=Array.from(i.childNodes);for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(i),Nt(n,s.values),ci.set(e,{strings:s.strings,parts:n,nodes:r})}function Nt(s,e){for(const t of s)if(t.kind==="node")ls(t.child,e[t.valueIndex]);else if(t.kind==="attr"){let o=t.template[0];for(let i=0;i<t.valueIndices.length;i++)o+=di(e[t.valueIndices[i]]),o+=t.template[i+1];o!==t.last&&(t.last=o,o===""?t.element.removeAttribute(t.name):t.element.setAttribute(t.name,o))}else if(t.kind==="event"){const o=e[t.valueIndex];o!==t.current&&(t.current&&t.element.removeEventListener(t.name,t.current),o&&t.element.addEventListener(t.name,o),t.current=o)}else if(t.kind==="prop"){const o=e[t.valueIndex];o!==t.last&&(t.last=o,t.element[t.name]=o)}else if(t.kind==="bool"){const o=!!e[t.valueIndex];o!==t.last&&(t.last=o,o?t.element.setAttribute(t.name,""):t.element.removeAttribute(t.name))}}function ls(s,e){if(e==null||e===!1){s.state&&(ne(s.state),s.state=null);return}if(Array.isArray(e)){Wr(s,e);return}if(Mr(e)){Fr(s,e);return}if(e instanceof Node){qr(s,e);return}Ur(s,di(e))}function qr(s,e){const t=s.state;t?.shape==="node"&&t.node===e||(t&&ne(t),Ht(s,[e]),s.state={shape:"node",node:e})}function Ur(s,e){const t=s.state;if(t?.shape==="text"){t.text!==e&&(t.node.textContent=e,t.text=e);return}t&&ne(t);const o=document.createTextNode(e);Ht(s,[o]),s.state={shape:"text",node:o,text:e}}function Fr(s,e){const t=s.state;if(t?.shape==="template"&&t.strings===e.strings){Nt(t.parts,e.values);return}t&&ne(t);const o=li(e.strings),i=o.template.content.cloneNode(!0),n=o.buildParts(i),r=Array.from(i.childNodes);Ht(s,[i]),Nt(n,e.values),s.state={shape:"template",strings:e.strings,parts:n,nodes:r}}function Wr(s,e){const t=s.state;if(t?.shape==="array"&&t.entries.length===e.length){for(let i=0;i<e.length;i++)ls(t.entries[i],e[i]);return}t&&ne(t);const o=[];for(const i of e){const n=document.createTextNode("");Ht(s,[n]);const r={anchor:n,state:null};ls(r,i),o.push(r)}s.state={shape:"array",entries:o}}function Ht(s,e){const t=s.anchor.parentNode;if(t)for(const o of e)t.insertBefore(o,s.anchor)}function ne(s){if(s.shape==="text"){s.node.remove();return}if(s.shape==="template"){for(const e of s.parts)e.kind==="node"&&e.child.state&&(ne(e.child.state),e.child.state=null);for(const e of s.nodes)e.parentNode&&e.parentNode.removeChild(e);return}if(s.shape==="node"){s.node.parentNode&&s.node.parentNode.removeChild(s.node);return}for(const e of s.entries)e.state&&ne(e.state),e.anchor.remove()}function di(s){return s==null||s===!1?"":String(s)}const se=class se 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(ui)}connectedCallback(){this._adoptStyles(),this.requestUpdate()}attributeChangedCallback(e,t,o){if(t===o)return;const i=jr(e);this._propValues[i]=o,this.requestUpdate()}get classNames(){return Array.from(this.classList)}set classNames(e){if(e==null){this.removeAttribute("class");return}const o=(Array.isArray(e)?e:String(e).split(/\s+/)).map(i=>String(i).trim()).filter(i=>i!=="");this.className=o.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 o=ui(t);Object.defineProperty(this,t,{get:()=>t in this._propValues?this._propValues[t]:this.getAttribute(o),set:i=>{let n;i==null||i===!1?n=null:i===!0?n="":n=String(i),this._propValues[t]=n,n===null?this.removeAttribute(o):this.setAttribute(o,n),this.requestUpdate()},enumerable:!0,configurable:!0})}}_scheduleRender(){this._renderScheduled||!this.isConnected||(this._renderScheduled=!0,queueMicrotask(()=>{this._renderScheduled=!1,this.isConnected&&L(this.render(),this._renderRoot)}))}_adoptStyles(){const e=this.constructor;if(e.styles.length!==0)if(e.shadow&&this.shadowRoot){const t=e.styles.map(o=>o.sheet).filter(o=>o!==null);if(this.shadowRoot.adoptedStyleSheets=t,t.length!==e.styles.length){for(const o of e.styles)if(!o.sheet){const i=document.createElement("style");i.textContent=o.cssText,this.shadowRoot.appendChild(i)}}}else this._adoptLightStyles(e)}_adoptLightStyles(e){if(!se._lightStylesAdopted.has(e)){se._lightStylesAdopted.add(e);for(const t of e.styles){const o=document.createElement("style");o.dataset.osUi=this.tagName.toLowerCase(),o.textContent=t.cssText,document.head.appendChild(o)}}}};se.props=[],se.styles=[],se.shadow=!0,se._lightStylesAdopted=new WeakSet;let k=se;function $(s,e){customElements.get(s)||customElements.define(s,e)}function ui(s){return s.replace(/[A-Z]/g,e=>"-"+e.toLowerCase())}function jr(s){return s.replace(/-([a-z])/g,(e,t)=>t.toUpperCase())}const Vr=(()=>{try{return typeof new CSSStyleSheet().replaceSync=="function"}catch{return!1}})();function x(s,...e){let t=s[0];for(let o=1;o<s.length;o++){const i=e[o-1];if(typeof i=="string"||typeof i=="number")t+=String(i);else if(i&&i.__wpdCss)t+=i.cssText;else throw new TypeError("[os-ui] css`` interpolations must be strings, numbers, or other css`` results. Got: "+typeof i);t+=s[o]}if(Vr){const o=new CSSStyleSheet;return o.replaceSync(t),{__wpdCss:!0,sheet:o,cssText:t}}return{__wpdCss:!0,sheet:null,cssText:t}}function Or(s){const e=[],t=[];let o=null,i=s.parentElement;for(;i&&!(i===document.body||i===document.documentElement);){const r=i.id||"";if(r.startsWith("wp-window-")){o=r.slice(10);break}if(i.tagName.toLowerCase()==="os-tabpanel"){const a=i.getAttribute("for");a&&t.unshift(a)}i=i.parentElement}o&&e.push(cs(o));for(const r of t)e.push("tab-"+cs(r));const n=s.getAttribute("label");return n&&e.push(cs(n)),e.length===0?"os-unnamed":"os-"+e.filter(r=>r!=="").join("-")}function cs(s){return s.toLowerCase().replace(/[^a-z0-9]+/g,"-").replace(/^-+|-+$/g,"")}function ge(s){if(s.id)return s.id;const e=Or(s);return s.id=e,e}const hi={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 pi(s){return s.replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""")}function Kr(s){return Object.prototype.hasOwnProperty.call(hi,s)?hi[s]:null}function Br(s,e={}){const t=Kr(s);if(!t)return"";const{size:o=24,className:i,title:n,rotate:r}=e,a=['xmlns="http://www.w3.org/2000/svg"','viewBox="0 0 24 24"'];o!=null&&a.push(`width="${o}"`,`height="${o}"`),a.push(t.a),i&&a.push(`class="${pi(i)}"`),n?a.push('role="img"',`aria-label="${pi(n)}"`):a.push('aria-hidden="true"','focusable="false"');const l=r?`<g transform="rotate(${r} 12 12)">${t.b}</g>`:t.b;return`<svg ${a.join(" ")}>${l}</svg>`}function z(s,e={}){const t=Br(s,e),o=document.createElement("div");o.innerHTML=t;const i=o.firstElementChild;return i instanceof SVGSVGElement?i:document.createElementNS("http://www.w3.org/2000/svg","svg")}const R=x`: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 ) )}`,Gr=x` .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%}}`,qt=x` .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%}}`,fi=x` .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}}`,Ut=x` .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}}`,ds=x` .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}}`,gi=x` .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%}}`,us=x` .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}}`,hs=x` 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}}`,Ft=x` 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-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-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-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}}`,bi=x` @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}}`;x` ${R} ${Gr} ${qt} ${fi} ${Ut} ${ds} ${gi} ${us} ${hs} ${Ft} ${bi} `;const Xr=x` ${R} ${qt} ${fi} ${Ut} ${ds} ${bi}: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-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 )}}`,Ce=class Ce extends k{render(){const e=this.disabled!==null,t=this.busy!==null,o=this.type||"button";return c` |
| 2 |
<button |
| 3 |
part="button" |
| 4 |
class="os-holo-edge os-holo-sheen" |
| 5 |
type=${o} |
| 6 |
?disabled=${e||t} |
| 7 |
aria-busy=${t?"true":"false"} |
| 8 |
> |
| 9 |
${t?c`<span class="os-button__spinner" aria-hidden="true"></span>`:""} |
| 10 |
<slot></slot> |
| 11 |
<!-- |
| 12 |
The two motion layers. Elements rather than |
| 13 |
pseudo-elements because the sheen and the hairline |
| 14 |
have already taken this button's ::before and |
| 15 |
::after — see the pseudo-element budget note in |
| 16 |
src/ui/holo.ts. Both are inert and aria-hidden. |
| 17 |
--> |
| 18 |
<span class="os-holo-glint" aria-hidden="true"></span> |
| 19 |
<span class="os-holo-ring" aria-hidden="true"></span> |
| 20 |
</button> |
| 21 |
`}};Ce.props=["variant","disabled","type","busy","fill-cell"],Ce.styles=[Xr],Ce.help=void 0;let ps=Ce;$("os-button",ps);const Zr=x` ${R} ${Ft}: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}`,Se=class Se extends k{render(){const e=this.label||"",t=this.checked!==null,o=this.disabled!==null;return c` |
| 22 |
<label> |
| 23 |
<input |
| 24 |
type="checkbox" |
| 25 |
?checked=${t} |
| 26 |
?disabled=${o} |
| 27 |
@change=${i=>this._onChange(i)} |
| 28 |
/> |
| 29 |
<span class="os-checkbox-label__text">${e}</span> |
| 30 |
</label> |
| 31 |
`}_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})}};Se.props=["label","checked","disabled"],Se.styles=[Zr],Se.help=void 0;let fs=Se;$("os-checkbox-label",fs);const Yr=x` ${R}: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}`,Ee=class Ee extends k{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 c` |
| 32 |
<label> |
| 33 |
<span class="os-color-field__label">${e}</span> |
| 34 |
<input |
| 35 |
type="color" |
| 36 |
.value=${t} |
| 37 |
@input=${o=>this._onInput(o)} |
| 38 |
/> |
| 39 |
</label> |
| 40 |
`}_onInput(e){const t=e.target;this.value=t.value,this.emit("os-color-change",{value:t.value})}};Ee.props=["label","value","variant"],Ee.styles=[Yr],Ee.help=void 0;let gs=Ee;$("os-color-field",gs);const Jr=x`: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 Wt=null;function Qr(s){let e=s.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 mi(){const s=new Map;if(typeof document>"u")return s;const e=Array.from(document.styleSheets??[]);for(const t of e){let o=null;try{o=t.cssRules}catch{continue}if(o)for(const i of Array.from(o)){const n=i;if(!n||!n.selectorText)continue;const r=n.selectorText.match(/\.dashicons-([a-z0-9-]+)::?before/i);if(!r)continue;const a=n.style?.content;if(!a)continue;const l=Qr(a);l&&s.set(r[1],l)}}return s}function ea(s){Wt||(Wt=mi());const e=s.startsWith("dashicons-")?s.slice(10):s;return Wt.get(e)??null}function ta(){Wt=mi()}let vi=!1;function sa(){if(vi||typeof window>"u")return;vi=!0;const s=()=>{ta()};document.readyState==="loading"&&document.addEventListener("DOMContentLoaded",s,{once:!0}),window.addEventListener("load",s,{once:!0})}sa();const Le=class Le extends k{render(){const e=this.name||"",t=e.startsWith("dashicons-")?e.slice(10):e,o=this.size;o&&/^\d+$/.test(o)&&this.style.setProperty("--os-ui-icon-size",`${o}px`);const i=ea(t);return i?c`<span |
| 41 |
class="os-icon__glyph os-icon__glyph--char dashicons dashicons-${t}" |
| 42 |
aria-hidden="true" |
| 43 |
>${i}</span>`:c`<span |
| 44 |
class="os-icon__glyph dashicons dashicons-${t}" |
| 45 |
aria-hidden="true" |
| 46 |
></span>`}};Le.props=["name","size"],Le.styles=[Jr],Le.help=void 0;let bs=Le;$("os-icon",bs);const oa=x`: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}`,Re=class Re extends k{render(){const e=this.icon||"",t=this.heading||"",o=this.description||"";return c` |
| 47 |
${e?c`<os-icon |
| 48 |
class="os-empty-state__icon" |
| 49 |
name=${e} |
| 50 |
size="28" |
| 51 |
></os-icon>`:null} |
| 52 |
<h3 class="os-empty-state__heading">${t}</h3> |
| 53 |
<p class="os-empty-state__description">${o}</p> |
| 54 |
<div class="os-empty-state__cta"> |
| 55 |
<slot name="cta"></slot> |
| 56 |
</div> |
| 57 |
<slot></slot> |
| 58 |
`}};Re.props=["icon","heading","description"],Re.styles=[oa],Re.help=void 0;let ms=Re;$("os-empty-state",ms);const ia=x`: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 ) )}`,na="desktop-mode-notice-dismissed";function ra(){const e=window.wp?.os?.config?.currentUserId;return typeof e=="number"&&e>0?String(e):"anon"}function _i(){return`${na}:${ra()}`}function vs(){try{const s=window.localStorage.getItem(_i());if(!s)return{};const e=JSON.parse(s);if(e&&typeof e=="object"&&!Array.isArray(e))return e}catch{}return{}}function yi(s){try{window.localStorage.setItem(_i(),JSON.stringify(s))}catch{}}function aa(s){return s?vs()[s]===!0:!1}function la(s){if(!s)return;const e=vs();e[s]=!0,yi(e)}function ca(s){if(!s)return;const e=vs();e[s]&&(delete e[s],yi(e))}const Te=class Te extends k{connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","status"),this.hasAttribute("tone")||this.setAttribute("tone","info");const e=this.getAttribute("notice-id");e&&aa(e)&&(this.hidden=!0)}dismiss(){this.hidden=!0;const e=this.getAttribute("notice-id");e&&la(e),this.emit("os-notice-dismiss",{noticeId:e??void 0})}undismiss(){const e=this.getAttribute("notice-id");e&&ca(e),this.hidden=!1}render(){const e=this.getAttribute("icon"),t=!this.hasAttribute("not-dismissible");return c` |
| 59 |
<span |
| 60 |
class="os-notice__icon dashicons ${e??""}" |
| 61 |
?hidden=${!e} |
| 62 |
aria-hidden="true" |
| 63 |
></span> |
| 64 |
<span class="os-notice__label"><slot></slot></span> |
| 65 |
<button |
| 66 |
type="button" |
| 67 |
class="os-notice__close" |
| 68 |
?hidden=${!t} |
| 69 |
aria-label=${d("Dismiss notice")} |
| 70 |
@click=${o=>this._onDismiss(o)} |
| 71 |
> |
| 72 |
${z("close",{size:null})} |
| 73 |
</button> |
| 74 |
`}_onDismiss(e){e.preventDefault(),e.stopPropagation(),this.dismiss()}};Te.props=["tone","notDismissible","icon","noticeId"],Te.styles=[ia],Te.help=void 0;let _s=Te;$("os-notice",_s);const da=x`: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}`,Pe=class Pe extends k{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`),c`<slot></slot>`}};Pe.props=["gap","padding"],Pe.styles=[da],Pe.help=void 0;let ys=Pe;$("os-panel",ys);const ua=x` ${R}: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 ha(s,e,t){const o=Number.parseFloat(s),i=Number.parseFloat(e),n=Number.parseFloat(t);if(!Number.isFinite(o)||!Number.isFinite(i)||!Number.isFinite(n)||n===i)return"0%";const r=(o-i)/(n-i);return`${Math.min(100,Math.max(0,r*100)).toFixed(2)}%`}function pa(s){const e=s.indexOf(".");return e<0?0:Math.min(3,s.length-e-1)}function fa(s,e,t,o){const i=r=>{const a=Number.parseFloat(r);return Number.isFinite(a)?String(Math.trunc(Math.abs(a))).length+(a<0?1:0):3};return Math.max(i(s),i(e))+(t>0?t+1:0)+o.length}const ze=class ze extends k{render(){const e=this.label||"",t=this.value||"0",o=this.min||"0",i=this.max||"100",n=this.step||"1",r=this.suffix||"",a=this.decimals,l=a?Math.min(6,Math.max(0,Number.parseInt(a,10)||0)):pa(n),u=Number.parseFloat(t),h=Number.isFinite(u)?u.toFixed(l):t,p=fa(o,i,l,r);return c` |
| 75 |
<label class="os-range-field__label">${e}</label> |
| 76 |
<input |
| 77 |
type="range" |
| 78 |
min=${o} |
| 79 |
max=${i} |
| 80 |
step=${n} |
| 81 |
style="--_fill: ${ha(t,o,i)}" |
| 82 |
.value=${t} |
| 83 |
@input=${m=>this._onInput(m)} |
| 84 |
/> |
| 85 |
<span |
| 86 |
class="os-range-field__value" |
| 87 |
style="--os-ui-range-readout-width: ${p}ch" |
| 88 |
>${h}${r}</span |
| 89 |
> |
| 90 |
`}connectedCallback(){super.connectedCallback(),getComputedStyle(this).direction==="rtl"&&this.style.setProperty("--_range-angle","270deg")}_onInput(e){const t=e.target,o=parseFloat(t.value);Number.isFinite(o)&&(this.value=String(o),this.emit("os-range-change",{value:o}))}};ze.props=["label","value","min","max","step","suffix","decimals"],ze.styles=[ua],ze.help=void 0;let ws=ze;$("os-range-field",ws);const ga=x`: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 )}`,Ie=class Ie extends k{render(){const e=this.heading||"",t=this.description||"";return c` |
| 91 |
${e?c`<h3 class="os-section__heading">${e}</h3>`:""} |
| 92 |
${t?c`<p class="os-section__description">${t}</p>`:""} |
| 93 |
<div class="os-section__body" part="body"><slot></slot></div> |
| 94 |
`}};Ie.props=["heading","description","stack"],Ie.styles=[ga],Ie.help=void 0;let xs=Ie;$("os-section",xs);const ba=x` ${R}: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}.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,var( --os-ui-accent,#2271b1 ) );background-image:var( --os-ui-segmented-selected-image,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}}`,ma=x` ${R} ${qt}:host{flex:1 1 auto;min-width:0}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 )}button:focus-visible{outline:none;box-shadow:var( --_holo-focus )}:host( [ aria-checked='true' ] ) button{color:var( --os-ui-segmented-selected-fg,var( --os-ui-fg-on-accent,#fff ) );transition-duration:var( --_holo-t-fast )}:host( [ aria-checked='true' ] ) button::before{display:none}`,Me=class Me extends k{render(){return this.setAttribute("role","radio"),c` |
| 95 |
<button |
| 96 |
type="button" |
| 97 |
class="os-holo-sheen" |
| 98 |
@click=${()=>this._onPick()} |
| 99 |
> |
| 100 |
<slot></slot> |
| 101 |
</button> |
| 102 |
`}_onPick(){this.emit("os-segment-pick",{value:this.value})}};Me.props=["value"],Me.styles=[ma],Me.help=void 0;let ks=Me;$("os-segment",ks);const De=class De extends k{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,o=Array.from(this.querySelectorAll(":scope > os-segment")).find(u=>u.getAttribute("value")===t);if(!o||this.offsetWidth===0){this.removeAttribute("data-thumb");return}const i=this.getBoundingClientRect(),n=i.width/this.offsetWidth,r=Math.abs(n-1)<.02?1:n;if(!(r>0))return;const a=o.getBoundingClientRect(),l=u=>`${Math.round(u*100)/100}px`;this.style.setProperty("--_thumb-x",l((a.left-i.left)/r)),this.style.setProperty("--_thumb-w",l(a.width/r)),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 n of Array.from(t))n.remove();for(const n of e){const r=document.createElement("os-segment");r.setAttribute("value",n.value),r.textContent=n.label,this.appendChild(r)}const o=this.value;!(o!==null&&e.some(n=>n.value===o))&&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 o=this.querySelectorAll("os-segment");for(const i of Array.from(o)){const n=i.getAttribute("value");i.setAttribute("aria-checked",n===t?"true":"false")}this._placeThumb()}),c`<span class="os-segmented__thumb" aria-hidden="true"></span |
| 103 |
><slot></slot>`}};De.props=["value","label"],De.styles=[ba],De.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:c` |
| 104 |
<os-segmented value="md" label="Dock size"> |
| 105 |
<os-segment value="sm">Small</os-segment> |
| 106 |
<os-segment value="md">Medium</os-segment> |
| 107 |
<os-segment value="lg">Large</os-segment> |
| 108 |
</os-segmented> |
| 109 |
`};let $s=De;$("os-segmented",$s);const va=x` ${R}: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-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}}`,_a=x`:host{display:none}`,Ne=class Ne extends k{render(){return c``}};Ne.props=["value","disabled"],Ne.styles=[_a],Ne.help=void 0;let As=Ne;$("os-option",As);const He=class He extends k{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,o=this._popup();o&&t instanceof Node&&(t===o||o.contains(t))||this._hide()},this._onWindowResize=()=>this._hide()}set items(e){const t=this.querySelectorAll(":scope > os-option");for(const n of Array.from(t))n.remove();for(const n of e){const r=document.createElement("os-option");r.setAttribute("value",n.value),r.textContent=n.label,this.appendChild(r)}const o=this.value;!(o!==null&&e.some(n=>n.value===o))&&e.length>0&&(this.value=e[0].value),this.requestUpdate()}connectedCallback(){super.connectedCallback(),ge(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,o=this.placeholder||"",i=this.disabled!==null;e&&this.setAttribute("aria-label",e);const n=this.getAttribute("aria-label")||"",r=e||n||o,a=this._readOptions(),l=a.find(b=>b.value===t),u=l?l.label:o,h=this.id||"os-unnamed",p=`${h}__listbox`,m=`${h}__trigger`,_=this._open&&this._activeIndex>=0?`${h}__opt-${this._activeIndex}`:"";return c` |
| 110 |
${e?c`<label |
| 111 |
class="os-select__label" |
| 112 |
for=${m} |
| 113 |
>${e}</label>`:c``} |
| 114 |
<button |
| 115 |
type="button" |
| 116 |
class="os-select__trigger" |
| 117 |
id=${m} |
| 118 |
role="combobox" |
| 119 |
aria-haspopup="listbox" |
| 120 |
aria-expanded=${this._open?"true":"false"} |
| 121 |
aria-controls=${p} |
| 122 |
aria-label=${r} |
| 123 |
aria-activedescendant=${_} |
| 124 |
?disabled=${i} |
| 125 |
@click=${()=>this._toggle()} |
| 126 |
@keydown=${b=>this._onTriggerKeydown(b)} |
| 127 |
> |
| 128 |
<span |
| 129 |
class="os-select__value${l?"":" os-select__value--placeholder"}" |
| 130 |
>${u}</span |
| 131 |
> |
| 132 |
${z("chevron-right",{size:16,rotate:90,className:"os-select__chevron"})} |
| 133 |
</button> |
| 134 |
<div |
| 135 |
class="os-select__popup" |
| 136 |
id=${p} |
| 137 |
role="listbox" |
| 138 |
popover="auto" |
| 139 |
aria-label=${r} |
| 140 |
@toggle=${b=>this._onPopoverToggle(b)} |
| 141 |
> |
| 142 |
${a.map((b,w)=>c` |
| 143 |
<div |
| 144 |
class="os-select__option" |
| 145 |
id=${`${h}__opt-${w}`} |
| 146 |
role="option" |
| 147 |
data-value=${b.value} |
| 148 |
aria-selected=${b.value===t?"true":"false"} |
| 149 |
aria-disabled=${b.disabled?"true":"false"} |
| 150 |
?data-active=${this._open&&w===this._activeIndex} |
| 151 |
@click=${()=>this._onOptionClick(b)} |
| 152 |
@pointermove=${()=>this._setActive(w)} |
| 153 |
> |
| 154 |
${z("check",{size:16,className:"os-select__check"})} |
| 155 |
<span class="os-select__option-label" |
| 156 |
>${b.label}</span |
| 157 |
> |
| 158 |
</div> |
| 159 |
`)} |
| 160 |
</div> |
| 161 |
`}_readOptions(){const e=[],t=this.querySelectorAll(":scope > os-option");for(const o of Array.from(t)){const i=o.getAttribute("value");i!==null&&e.push({value:i,label:(o.textContent||i).trim(),disabled:o.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 o=this._readOptions(),i=this.value,n=o.findIndex(a=>a.value===i&&!a.disabled);this._activeIndex=n>=0?n:o.findIndex(a=>!a.disabled);const r=t.getBoundingClientRect();e.style.minWidth=`${r.width}px`,typeof e.showPopover=="function"?(e.style.left=`${r.left}px`,e.style.top=`${r.bottom+4}px`,e.showPopover(),r.bottom+4+e.offsetHeight>window.innerHeight-8&&(e.style.top=`${Math.max(8,r.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 o=this._activeIndex;for(let i=0;i<t.length&&(o=Math.min(Math.max(o+e,0),t.length-1),!(!t[o]?.disabled||o===0||o===t.length-1));i++);o!==this._activeIndex&&t[o]&&!t[o].disabled&&(this._activeIndex=o,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 o=this._readOptions().findIndex(i=>!i.disabled&&i.label.toLowerCase().startsWith(this._typed));o>=0&&(this._activeIndex=o,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(o=>!o.disabled)),e.key==="End"){for(let o=t.length-1;o>=0;o--)if(!t[o].disabled){this._activeIndex=o;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(o=>!o.disabled),this.requestUpdate(),this._scrollActiveIntoView();break;case"End":e.preventDefault();for(let o=t.length-1;o>=0;o--)if(!t[o].disabled){this._activeIndex=o,this.requestUpdate(),this._scrollActiveIntoView();break}break;case"Enter":case" ":{e.preventDefault();const o=t[this._activeIndex];o&&!o.disabled&&this._commit(o.value);break}case"Tab":{const o=t[this._activeIndex];o&&!o.disabled?this._commit(o.value):this._hide();break}case"Escape":e.preventDefault(),this._hide();break;default:e.key.length===1&&e.key.trim()!==""&&this._typeAhead(e.key)}}}};He.props=["value","label","placeholder","disabled","name"],He.styles=[va],He.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:c` |
| 162 |
<os-select value="eur" label="Currency"> |
| 163 |
<os-option value="eur">Euro</os-option> |
| 164 |
<os-option value="usd">US Dollar</os-option> |
| 165 |
<os-option value="jpy">Japanese Yen</os-option> |
| 166 |
</os-select> |
| 167 |
`};let Cs=He;$("os-select",Cs);const ya=x` ${R}: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 2px var( --os-ui-accent,#2271b1 )}button[ aria-pressed='true' ]:focus-visible{box-shadow:var( --_holo-focus )}:host( [ variant='wallpaper' ] ) button:hover{transform:translateY( -2px )}`,qe=class qe extends k{render(){const e=this.selected!==null,t=this.label||"",o=this.preview||"";return c` |
| 168 |
<button |
| 169 |
type="button" |
| 170 |
aria-pressed=${e?"true":"false"} |
| 171 |
aria-label=${t} |
| 172 |
title=${t} |
| 173 |
style="background: ${o}" |
| 174 |
@click=${()=>this._onPick()} |
| 175 |
> |
| 176 |
<slot></slot> |
| 177 |
</button> |
| 178 |
`}_onPick(){this.emit("os-pick",{value:this.value})}};qe.props=["value","label","selected","preview","size","variant"],qe.styles=[ya],qe.help=void 0;let Ss=qe;$("os-swatch",Ss);const wa=x`: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}`,Ue=class Ue extends k{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),c`<slot></slot>`}};Ue.props=["label","columns","mode"],Ue.styles=[wa],Ue.help=void 0;let Es=Ue;$("os-swatch-grid",Es);const xa=x`: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}`,ka=x`:host{display:block}:host( [ hidden ] ){display:none}:host(:focus-visible ){outline:2px solid var( --os-ui-accent,#2271b1 );outline-offset:4px;border-radius:4px}`,$a=x` ${R}: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 ) )}:host( [ data-orientation='vertical' ] ) button{display:flex;align-items:center;gap:11px;isolation:isolate;width:100%;min-height:40px;padding:0 14px 0 20px;margin-bottom:0;border-radius:0;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:2px;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-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:1}@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}}`,Fe=class Fe extends k{render(){return this.setAttribute("role","tab"),c` |
| 179 |
<button type="button" @click=${()=>this._onPick()}> |
| 180 |
<slot></slot> |
| 181 |
</button> |
| 182 |
`}_onPick(){this.emit("os-tab-pick",{value:this.value})}};Fe.props=["value"],Fe.styles=[$a],Fe.help=void 0;let Ls=Fe;$("os-tab",Ls);const We=class We extends k{constructor(){super(...arguments),this._tabObserver=null,this._onKeyDown=e=>{const t=this.orientation==="vertical",o=t?"ArrowDown":"ArrowRight",i=t?"ArrowUp":"ArrowLeft";if(e.key!==o&&e.key!==i&&e.key!=="Home"&&e.key!=="End")return;const n=Array.from(this.querySelectorAll("os-tab")).filter(h=>!h.hasAttribute("data-search-hidden"));if(n.length===0)return;const r=this.value,a=n.findIndex(h=>h.getAttribute("value")===r);let l=0;if(e.key==="End")l=n.length-1;else if(e.key!=="Home"){const h=e.key===o?1:-1;l=(a+h+n.length)%n.length}const u=n[l]?.getAttribute("value");!u||u===r||(e.preventDefault(),this.value=u,this.emit("os-tab-change",{value:u}),queueMicrotask(()=>{n[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){Aa(this,"os-tab",e);const t=this.value;!(t!==null&&e.some(i=>i.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 i of Array.from(this.querySelectorAll("os-tab")))t?i.setAttribute("data-orientation","vertical"):i.removeAttribute("data-orientation");const o=this.value;return queueMicrotask(()=>{const i=this.querySelectorAll("os-tab");for(const n of Array.from(i)){const r=n.getAttribute("value");n.setAttribute("aria-selected",r===o?"true":"false"),n.setAttribute("tabindex",r===o?"0":"-1")}wi(this,o)}),c`<slot></slot>`}};We.props=["value","label","orientation"],We.styles=[xa],We.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:c` |
| 183 |
<os-tabs value="one" label="Demo tabs"> |
| 184 |
<os-tab value="one">One</os-tab> |
| 185 |
<os-tab value="two">Two</os-tab> |
| 186 |
<os-tab value="three">Three</os-tab> |
| 187 |
</os-tabs> |
| 188 |
<os-tabpanel for="one">First panel.</os-tabpanel> |
| 189 |
<os-tabpanel for="two">Second panel.</os-tabpanel> |
| 190 |
<os-tabpanel for="three">Third panel.</os-tabpanel> |
| 191 |
`};let Rs=We;$("os-tabs",Rs);const je=class je extends k{connectedCallback(){super.connectedCallback(),this.setAttribute("role","tabpanel"),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0");const e=Ca(this);e&&wi(e,e.getAttribute("value"))}render(){return c`<slot></slot>`}};je.props=["for"],je.styles=[ka],je.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:c` |
| 192 |
<os-tabs value="two" label="Demo tabs"> |
| 193 |
<os-tab value="one">One</os-tab> |
| 194 |
<os-tab value="two">Two</os-tab> |
| 195 |
</os-tabs> |
| 196 |
<os-tabpanel for="one"> |
| 197 |
Hidden — the strip is on "two". |
| 198 |
</os-tabpanel> |
| 199 |
<os-tabpanel for="two"> |
| 200 |
Visible, because this panel's <code>for</code> matches the |
| 201 |
strip's <code>value</code>. |
| 202 |
</os-tabpanel> |
| 203 |
`};let Ts=je;$("os-tabpanel",Ts);function Aa(s,e,t){const o=s.querySelectorAll(`:scope > ${e}`);for(const i of Array.from(o))i.remove();for(const i of t){const n=document.createElement(e);n.setAttribute("value",i.value),n.textContent=i.label,s.appendChild(n)}}function Ca(s){const e=s.parentElement;if(!e)return null;const t=e.querySelector(":scope > os-tabs");return t||s.closest("os-tabs")}function wi(s,e){const t=new Set,o=s.parentElement;if(o)for(const i of Array.from(o.querySelectorAll(":scope > os-tabpanel")))t.add(i);for(const i of Array.from(s.querySelectorAll(":scope > os-tabpanel")))t.add(i);for(const i of t){const n=i.getAttribute("for"),r=n!==null&&n===e;r?i.removeAttribute("hidden"):i.setAttribute("hidden",""),i.setAttribute("aria-hidden",r?"false":"true")}}const xi=x` ${R} ${hs}:host{display:flex;flex-direction:column;gap:4px;font-size:13px;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__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:6px;font:inherit;font-size:13px;color:var( --os-ui-fg,#1d2327 )}.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}.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}`,Ve=class Ve extends k{constructor(){super(...arguments),this._revealed=!1}connectedCallback(){super.connectedCallback(),ge(this)}render(){const e=this.label||"",t=this.value??"",o=this.placeholder||"",i=this.disabled!==null,n=this.readonly!==null,r=this.autocomplete,a=this.type||"text",l=a==="password";let u=r||"off";l&&(!r||u==="off")&&(u="new-password");const h=this.maxlength,p=this.minlength,m=this.pattern||"",_=this.name||"",b=this.suffix||"",w=this.invalid!==null,v=this.reveal!==null,g=a==="password",f=g&&!(v&&this._revealed);let y;g||v&&this._revealed?y="text":y=a;const A=v?"os-text-field__row os-text-field__row--has-reveal":"os-text-field__row",M=f?"os-text-field__input os-text-field__input--masked":"os-text-field__input",N=`${this.id||"os-unnamed"}__input`;return c` |
| 204 |
${e?c`<label |
| 205 |
class="os-text-field__label" |
| 206 |
for=${N} |
| 207 |
>${e}</label>`:c``} |
| 208 |
<span class=${A}> |
| 209 |
<input |
| 210 |
id=${N} |
| 211 |
class=${M} |
| 212 |
type=${y} |
| 213 |
.value=${t} |
| 214 |
placeholder=${o} |
| 215 |
?disabled=${i} |
| 216 |
?readonly=${n} |
| 217 |
autocomplete=${u} |
| 218 |
maxlength=${h??""} |
| 219 |
minlength=${p??""} |
| 220 |
pattern=${m} |
| 221 |
name=${_} |
| 222 |
aria-invalid=${w?"true":"false"} |
| 223 |
aria-label=${e||""} |
| 224 |
@input=${E=>this._onInput(E)} |
| 225 |
@change=${E=>this._onChange(E)} |
| 226 |
@keydown=${E=>this._onKeyDown(E)} |
| 227 |
/> |
| 228 |
${b?c`<span class="os-text-field__suffix">${b}</span>`:c``} |
| 229 |
${v?this._renderRevealButton(i):c``} |
| 230 |
</span> |
| 231 |
`}_renderRevealButton(e){const t=this._revealed?"Hide":"Show";return c` |
| 232 |
<button |
| 233 |
type="button" |
| 234 |
class="os-text-field__reveal" |
| 235 |
aria-label=${t} |
| 236 |
aria-pressed=${this._revealed?"true":"false"} |
| 237 |
?disabled=${e} |
| 238 |
tabindex="0" |
| 239 |
@click=${()=>this._onToggleReveal()} |
| 240 |
> |
| 241 |
${this._revealed?Ea():Sa()} |
| 242 |
</button> |
| 243 |
`}_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})}}};Ve.props=["label","value","placeholder","disabled","readonly","autocomplete","type","maxlength","minlength","pattern","name","suffix","invalid","reveal"],Ve.styles=[xi],Ve.help=void 0;let Ps=Ve;$("os-text-field",Ps);function Sa(){return c` |
| 244 |
<svg |
| 245 |
viewBox="0 0 16 16" |
| 246 |
width="14" |
| 247 |
height="14" |
| 248 |
fill="none" |
| 249 |
stroke="currentColor" |
| 250 |
stroke-width="1.5" |
| 251 |
stroke-linecap="round" |
| 252 |
stroke-linejoin="round" |
| 253 |
aria-hidden="true" |
| 254 |
focusable="false" |
| 255 |
> |
| 256 |
<path d="M1 8C1 8 3.5 3 8 3s7 5 7 5-2.5 5-7 5S1 8 1 8z" /> |
| 257 |
<circle cx="8" cy="8" r="2" /> |
| 258 |
</svg> |
| 259 |
`}function Ea(){return c` |
| 260 |
<svg |
| 261 |
viewBox="0 0 16 16" |
| 262 |
width="14" |
| 263 |
height="14" |
| 264 |
fill="none" |
| 265 |
stroke="currentColor" |
| 266 |
stroke-width="1.5" |
| 267 |
stroke-linecap="round" |
| 268 |
stroke-linejoin="round" |
| 269 |
aria-hidden="true" |
| 270 |
focusable="false" |
| 271 |
> |
| 272 |
<path d="M1 8C1 8 3.5 3 8 3s7 5 7 5-2.5 5-7 5S1 8 1 8z" /> |
| 273 |
<circle cx="8" cy="8" r="2" /> |
| 274 |
<line x1="2" y1="2" x2="14" y2="14" /> |
| 275 |
</svg> |
| 276 |
`}const La="os-window-tab-change";function ki(s){return Array.from(s.querySelectorAll(".os-window__tab"))}function $i(s){return s.replace(/[^a-zA-Z0-9_-]/g,"-")}function Ai(s,e){return`${s.id||"os-window"}-tab-${$i(e)}`}function Ci(s,e){return`${s.id||"os-window"}-panel-${$i(e)}`}function Ra(s){const e=s.querySelector(".os-window__tab-plate");if(!e)return;const t=s.querySelector(".os-window__tab--active");if(!t){e.dataset.empty="",s.dataset.tabPlateEmpty="";return}delete e.dataset.empty,delete s.dataset.tabPlateEmpty,s.style.setProperty("--_tab-plate-x",`${t.offsetLeft}px`),s.style.setProperty("--_tab-plate-w",`${t.offsetWidth}px`),s.style.setProperty("--_tab-strip-w",`${s.clientWidth}px`),t.offsetWidth>0&&(e.dataset.placed="")}function Ta(s){if(s){if(s.querySelector(":scope > .os-window__tab")){s.setAttribute("role","tablist");const e=s.dataset.tablistLabel;e&&s.setAttribute("aria-label",e);return}s.setAttribute("role","presentation"),s.removeAttribute("aria-label")}}function Pa(s){const e=ki(s);if(e.length===0)return;const t=e.find(o=>o.classList.contains("os-window__tab--active"))??e[0];for(const o of e){const i=o===t?0:-1;o.tabIndex!==i&&(o.tabIndex=i)}}function Si(s){const e=new Map;for(const t of ki(s))t.dataset.kind==="panel"&&t.dataset.panel&&e.set(t.dataset.panel,t);return e}function Ei(s){const e=s.querySelector(".os-window__body");return e?Array.from(e.querySelectorAll("os-tabpanel[ for ]")).filter(t=>!t.parentElement?.closest("os-tabpanel, os-tabs")):[]}function za(s,e){const t=s.querySelector(".os-window__tabs");if(!t)return;let o=!1;for(const[i,n]of Si(t)){const r=i===e;o=o||r,n.classList.toggle("os-window__tab--active",r),n.setAttribute("aria-selected",r?"true":"false")}if(o){for(const i of Ei(s)){const n=i.getAttribute("for")===e;i.toggleAttribute("hidden",!n),i.setAttribute("aria-hidden",n?"false":"true")}Pa(t),Ra(t),s.dispatchEvent(new CustomEvent(La,{bubbles:!0,detail:{value:e}}))}}function Ia(s,e,t){const o=s.querySelector(".os-window__tabs");if(!o)return;const i=Si(o),n=Array.from(i.entries()).find(([,h])=>h.classList.contains("os-window__tab--active"))?.[0];let r=o.querySelector(".os-window__tab-plate");for(const h of e){let p=i.get(h.value);if(p)i.delete(h.value);else{const m=document.createElement("button");m.type="button",p=m,p.className="os-window__tab",p.dataset.kind="panel",p.dataset.panel=h.value,p.setAttribute("role","tab"),p.setAttribute("aria-selected","false"),p.tabIndex=-1}p.textContent!==h.label&&(p.textContent=h.label),p.id=Ai(s,h.value),p.setAttribute("aria-controls",Ci(s,h.value)),p.previousElementSibling!==r&&o.insertBefore(p,r?r.nextSibling:o.firstChild),r=p}for(const h of i.values())h.remove();Ta(o);const a=o.querySelector(":scope > .os-window__tab")!==null;for(const h of Ei(s)){const p=h.getAttribute("for");p&&(h.id=Ci(s,p),a?h.setAttribute("aria-labelledby",Ai(s,p)):h.removeAttribute("aria-labelledby"))}const l=h=>h!==void 0&&e.some(p=>p.value===h),u=[t,n,e[0]?.value].find(l);u!==void 0&&za(s,u)}const be={size:null},Li={appearance:()=>z("color",be),themes:()=>{const s=document.createElementNS("http://www.w3.org/2000/svg","svg");return s.setAttribute("viewBox","0 0 24 24"),s.setAttribute("fill","currentColor"),s.setAttribute("aria-hidden","true"),s.innerHTML='<path fill-rule="evenodd" clip-rule="evenodd" d="M20 12a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-1.5 0a6.5 6.5 0 0 1-6.5 6.5v-13a6.5 6.5 0 0 1 6.5 6.5Z" />',s},windows:()=>z("windows",be),navigation:()=>{const s=document.createElementNS("http://www.w3.org/2000/svg","svg");return s.setAttribute("viewBox","0 0 24 24"),s.setAttribute("fill","currentColor"),s.setAttribute("aria-hidden","true"),s.innerHTML='<path d="M12 4c-4.4 0-8 3.6-8 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14.5c-3.6 0-6.5-2.9-6.5-6.5S8.4 5.5 12 5.5s6.5 2.9 6.5 6.5-2.9 6.5-6.5 6.5zM9 16l4.5-3L15 8.4l-4.5 3L9 16z" />',s},features:()=>z("settings",be),help:()=>z("widgets",be),"os-file-associations":()=>{const s=document.createElementNS("http://www.w3.org/2000/svg","svg");return s.setAttribute("viewBox","0 0 24 24"),s.setAttribute("fill","currentColor"),s.setAttribute("aria-hidden","true"),s.innerHTML='<path d="M15.5 7.5h-7V9h7V7.5Zm-7 3.5h7v1.5h-7V11Zm7 3.5h-7V16h7v-1.5Z" /><path d="M17 4H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2ZM7 5.5h10a.5.5 0 0 1 .5.5v12a.5.5 0 0 1-.5.5H7a.5.5 0 0 1-.5-.5V6a.5.5 0 0 1 .5-.5Z" />',s},about:()=>z("info",be)},zs=1920,Is=1080,Ma=40,Da=300,jt="custom-gradient",V="custom-image",Ri="galaxy",me="custom",Ti=[{id:"pulse",label:"Pulse",value:"#f252fc"},{id:"nebula",label:"Nebula",value:"#ec9bff"},{id:"sirius",label:"Sirius",value:"#9af2ff"},{id:"lagoon",label:"Lagoon",value:"#9f98ff"},{id:"wp-blue",label:"WordPress Blue",value:"#2271b1"},{id:"indigo",label:"Indigo",value:"#3858e9"},{id:"teal",label:"Teal",value:"#04a4cc"},{id:"emerald",label:"Emerald",value:"#059669"},{id:"amber",label:"Amber",value:"#d97706"},{id:"rose",label:"Rose",value:"#e11d48"}];function Ms(){const e=window.wp?.os?.config?.accentColors;if(!Array.isArray(e)||e.length===0)return Ti;const t=[];for(const o of e)o&&typeof o=="object"&&typeof o.id=="string"&&typeof o.label=="string"&&typeof o.value=="string"&&o.id!==""&&o.label!==""&&/^#[0-9a-f]{3,8}$/i.test(o.value)&&t.push({id:o.id,label:o.label,value:o.value});return t.length>0?t:Ti}const Pi=[{id:"compact",label:"Compact",width:48,icon:18},{id:"default",label:"Default",width:56,icon:20},{id:"large",label:"Large",width:72,icon:26}],zi=[{id:"sharp",label:"Sharp",value:0},{id:"default",label:"Default",value:8},{id:"round",label:"Round",value:16}],Ii=[{id:"static",label:"Static"},{id:"dynamic",label:"Dynamic"},{id:"hidden",label:"Hidden"}],Mi=[{id:"bottom",label:"Bottom"},{id:"left",label:"Left"},{id:"right",label:"Right"}],Di=[{id:"unified",label:"Unified"},{id:"classic",label:"Split"}],Y={wallpaper:Ri,accent:"pulse",customAccent:"#f252fc",dockSize:"default",windowRadius:"round",adminBarMode:"hidden",desktopLayout:"unified",dockPlacement:"bottom",dockRailRenderer:"default",desktopTheme:"",appliedThemeRecommendations:[],unfocusEffect:"darken",windowReveal:"none",windowRevealDuration:0,windowLinkRenderer:"svg-splines",windowLinkVisibility:"always",windowLinksEnabled:!0,windowLinkRaiseOnFocus:!0,windowLinkHighlight:!0,customGradient:{from:"#2271b1",to:"#7c3aed",angle:135},customImage:null,wallpaperSettings:{},libraryHdOnly:!0,ai:{enabled:!1},heartbeatRate:60,nativePostsEnabled:!1,nativePostsHiddenColumns:[],nativePagesEnabled:!1,nativeUsersEnabled:!1,nativePluginsEnabled:!1,nativeCommentsEnabled:!1,stationHomeEnabled:!1,showDesktopOnWallpaperClick:!1,mioEnabled:!1,mioStyle:{appearance:{},physics:{}},showPostStatusRibbons:!0,developerModeEnabled:!1,foldersSharingEnabled:!0,navPlacement:{},navOrder:[],dockPromotedPositions:{}};function Ds(s){return!!s&&typeof s=="object"&&typeof s.then=="function"}function Na(s){return s.replace(/[^a-zA-Z0-9._-]+/g,"-").replace(/^-+|-+$/g,"")||"wallpaper"}function Ha(s){if(!s||typeof s.id!="number"||!s.source_url)return!1;const e=s.media_details;return!!e&&typeof e.width=="number"&&typeof e.height=="number"&&e.width>0&&e.height>0}function qa(s){if(!s)return"";const e=document.createElement("div");return e.innerHTML=s,e.textContent?.trim()||""}const Ni="X-WP-Nonce";function Ua(s,e){const t=Fa();if(!t)return e;const o=Wa(s);if(!o||!ja(o))return e;const i=e?.headers??(typeof Request<"u"&&s instanceof Request?s.headers:void 0),n=new Headers(i??{});return n.has(Ni)?e:(n.set(Ni,t),{...e??{},headers:n})}function Fa(){if(typeof window>"u")return;const e=window.openStationConfig?.restNonce;return typeof e=="string"&&e.length>0?e:void 0}function Wa(s){try{const e=typeof window<"u"&&window.location?window.location.href:void 0;return typeof s=="string"?new URL(s,e):s instanceof URL?s:typeof Request<"u"&&s instanceof Request?new URL(s.url,e):null}catch{return null}}function ja(s){return typeof window>"u"||!window.location||s.origin!==window.location.origin?!1:!!(s.pathname.includes("/wp-json/")||s.searchParams.has("rest_route"))}function O(s,e,t={}){const o=window.wp?.os?.fetch;if(typeof o=="function")return o(s,e,t);const i=Ua(s,e);return fetch(s,i)}function Va(){return{...Y,customGradient:{...Y.customGradient},customImage:null,wallpaperSettings:{...Y.wallpaperSettings},ai:{...Y.ai},appliedThemeRecommendations:[...Y.appliedThemeRecommendations],navPlacement:{...Y.navPlacement},navOrder:[...Y.navOrder],dockPromotedPositions:{...Y.dockPromotedPositions}}}const Hi="__openStationSharedStores";function Oa(){const s=window;let e=s[Hi];return e||(e=new Map,s[Hi]=e),e}function K(s,e){const t=Oa();let o=t.get(s);o||(o={state:e(),listeners:new Set,rebuild:e},t.set(s,o));const i={get state(){return o.state},set state(n){o.state=n},getState(){return o.state},notify(){for(const n of Array.from(o.listeners))try{n(o.state)}catch(r){console.error(`[desktop-mode/shared-store:${s}] subscriber threw:`,r)}},subscribe(n){return o.listeners.add(n),()=>{o.listeners.delete(n)}},setState(n){const r=o.state;if(typeof r!="object"||r===null){console.warn(`[desktop-mode/shared-store:${s}] setState called on a primitive store; use the state setter instead.`);return}Object.assign(r,n),i.notify()},reset(){const n=o.rebuild(),r=o.state;if(typeof r=="object"&&r!==null&&typeof n=="object"&&n!==null){const a=r;for(const l of Object.keys(a))delete a[l];Object.assign(a,n)}else o.state=n;o.listeners.clear()}};return i}const qi=K("desktop-mode/settings-tab-registry",()=>({registry:new Map,listeners:new Set})),Ka=qi.state.registry,Ui=qi.state.listeners;function Ba(){return Array.from(Ka.values()).sort((s,e)=>(s.order??100)-(e.order??100))}function Ga(s){return Ui.add(s),()=>{Ui.delete(s)}}const Fi="https://openstation.blog/",Wi="https://openstation.blog/feed/",Xa="https://github.com/WordPress/openstation/";function Za(s,e){return s.clientWidth>0&&s.clientHeight>0?Promise.resolve():new Promise(t=>{const o=()=>{i.disconnect(),e.removeEventListener("abort",o),t()},i=new ResizeObserver(()=>{s.clientWidth>0&&s.clientHeight>0&&o()});e.addEventListener("abort",o,{once:!0}),i.observe(s)})}function Ns(s){if(typeof s!="string"||s==="")return"";try{const e=new URL(s,window.location.href);return e.protocol==="http:"||e.protocol==="https:"?e.href:""}catch{return""}}function ae(s){return typeof s=="string"?s.trim():""}function Ya(s){if(!s||typeof s!="object")return null;const e=s,o=(Array.isArray(e.items)?e.items:[]).map(i=>{if(!i||typeof i!="object")return null;const n=i,r=ae(n.title),a=Ns(n.url);return r===""||a===""?null:{title:r,url:a,author:ae(n.author),publishedAt:ae(n.publishedAt),excerpt:ae(n.excerpt)}}).filter(i=>i!==null).slice(0,5);return{title:ae(e.title)||d("OpenStation"),description:ae(e.description)||d("A public dev diary — building a desktop OS for wp-admin."),homeUrl:Ns(e.homeUrl)||Fi,feedUrl:Ns(e.feedUrl)||Wi,items:o,stale:e.stale===!0}}function Ja(s){if(s==="")return"";const e=new Date(s);return Number.isNaN(e.getTime())?"":e.toLocaleDateString(void 0,{month:"short",day:"numeric",year:"numeric"})}function ji(s){const e=Ja(s.publishedAt);return e&&s.author?j("%1$s · %2$s",e,s.author):e||s.author}function Qa(s){return c` |
| 277 |
<article class="os-settings__about-featured"> |
| 278 |
<a href=${s.url} target="_blank" rel="noopener noreferrer"> |
| 279 |
<div class="os-settings__about-featured-copy"> |
| 280 |
<span class="os-settings__about-kicker" |
| 281 |
>${d("Latest dispatch")}</span |
| 282 |
> |
| 283 |
<h3>${s.title}</h3> |
| 284 |
${s.excerpt?c`<p>${s.excerpt}</p>`:c``} |
| 285 |
</div> |
| 286 |
<footer> |
| 287 |
<span>${ji(s)}</span> |
| 288 |
<strong |
| 289 |
>${d("Read the dispatch")} |
| 290 |
<span aria-hidden="true">↗</span></strong |
| 291 |
> |
| 292 |
</footer> |
| 293 |
</a> |
| 294 |
</article> |
| 295 |
`}function el(s){return c` |
| 296 |
<article class="os-settings__about-card" role="listitem"> |
| 297 |
<a href=${s.url} target="_blank" rel="noopener noreferrer"> |
| 298 |
<span class="os-settings__about-card-meta" |
| 299 |
>${ji(s)}</span |
| 300 |
> |
| 301 |
<h3>${s.title}</h3> |
| 302 |
${s.excerpt?c`<p>${s.excerpt}</p>`:c``} |
| 303 |
<strong |
| 304 |
>${d("Read more")} |
| 305 |
<span aria-hidden="true">↗</span></strong |
| 306 |
> |
| 307 |
</a> |
| 308 |
</article> |
| 309 |
`}function tl(s){if(s.kind==="loading")return c` |
| 310 |
<div |
| 311 |
class="os-settings__about-status" |
| 312 |
role="status" |
| 313 |
aria-live="polite" |
| 314 |
> |
| 315 |
<span |
| 316 |
class="os-settings__about-spinner" |
| 317 |
aria-hidden="true" |
| 318 |
></span> |
| 319 |
<div> |
| 320 |
<strong>${d("Opening the journal…")}</strong> |
| 321 |
<span |
| 322 |
>${d("The latest posts are arriving over RSS.")}</span |
| 323 |
> |
| 324 |
</div> |
| 325 |
</div> |
| 326 |
`;if(s.kind==="error")return c` |
| 327 |
<div |
| 328 |
class="os-settings__about-status os-settings__about-status--error" |
| 329 |
role="alert" |
| 330 |
> |
| 331 |
<span class="dashicons dashicons-rss" aria-hidden="true"></span> |
| 332 |
<div> |
| 333 |
<strong>${d("The journal could not be reached.")}</strong> |
| 334 |
<span |
| 335 |
>${d("You can still read every post on openstation.blog.")}</span |
| 336 |
> |
| 337 |
</div> |
| 338 |
</div> |
| 339 |
`;if(s.feed.items.length===0)return c` |
| 340 |
<div class="os-settings__about-status" role="status"> |
| 341 |
<span class="dashicons dashicons-rss" aria-hidden="true"></span> |
| 342 |
<div> |
| 343 |
<strong>${d("No dispatches yet.")}</strong> |
| 344 |
<span |
| 345 |
>${d("The journal is open and waiting for its next post.")}</span |
| 346 |
> |
| 347 |
</div> |
| 348 |
</div> |
| 349 |
`;const[e,...t]=s.feed.items;return c` |
| 350 |
${s.feed.stale?c`<p class="os-settings__about-stale" role="status"> |
| 351 |
${d("Showing the last saved copy while the journal reconnects.")} |
| 352 |
</p>`:c``} |
| 353 |
<section |
| 354 |
class="os-settings__about-feed" |
| 355 |
aria-label=${d("Latest journal posts")} |
| 356 |
> |
| 357 |
${Qa(e)} |
| 358 |
${t.length>0?c`<div class="os-settings__about-grid" role="list"> |
| 359 |
${t.map(el)} |
| 360 |
</div>`:c``} |
| 361 |
</section> |
| 362 |
`}function Vt(s,e,t){const o=t.kind==="ready"?t.feed:null,i=o?.homeUrl||Fi,n=o?.feedUrl||Wi,r=o?.description||d("A public dev diary — building a desktop OS for wp-admin."),a=`${e.pluginUrl??""}/assets/images/openstation-mark.svg`,l=e.pluginVersion??"";L(c` |
| 363 |
<div class="os-settings__about-inner"> |
| 364 |
<header class="os-settings__about-overview"> |
| 365 |
<div class="os-settings__about-identity"> |
| 366 |
<img src=${a} alt="" width="64" height="64" /> |
| 367 |
<div> |
| 368 |
<span class="os-settings__about-eyebrow" |
| 369 |
>${d("About OpenStation")}</span |
| 370 |
> |
| 371 |
<h2>${d("A desktop for WordPress.")}</h2> |
| 372 |
<p> |
| 373 |
${d("OpenStation reshapes wp-admin into a personal workspace, with movable windows, a dock, themes, and focused tools that keep your site close at hand.")} |
| 374 |
</p> |
| 375 |
</div> |
| 376 |
</div> |
| 377 |
<div class="os-settings__about-story"> |
| 378 |
<p> |
| 379 |
${d("It is a playful, open-source experiment by Automattic exploring what WordPress can feel like when the dashboard becomes a place of its own.")} |
| 380 |
</p> |
| 381 |
<div class="os-settings__about-meta"> |
| 382 |
<span> |
| 383 |
<strong |
| 384 |
>OpenStation${l?` ${l}`:""}</strong |
| 385 |
> |
| 386 |
<small |
| 387 |
>${d("An experiment by Automattic")}</small |
| 388 |
> |
| 389 |
</span> |
| 390 |
<a |
| 391 |
href=${Xa} |
| 392 |
target="_blank" |
| 393 |
rel="noopener noreferrer" |
| 394 |
> |
| 395 |
${d("View the project")} |
| 396 |
<span aria-hidden="true">↗</span> |
| 397 |
</a> |
| 398 |
</div> |
| 399 |
</div> |
| 400 |
</header> |
| 401 |
|
| 402 |
<div class="os-settings__about-journal-head"> |
| 403 |
<div> |
| 404 |
<span class="os-settings__about-eyebrow" |
| 405 |
>${d("OpenStation Journal")}</span |
| 406 |
> |
| 407 |
<h2>${d("Latest from the station")}</h2> |
| 408 |
<p>${r}</p> |
| 409 |
</div> |
| 410 |
<a |
| 411 |
class="os-settings__about-journal-link" |
| 412 |
href=${i} |
| 413 |
target="_blank" |
| 414 |
rel="noopener noreferrer" |
| 415 |
> |
| 416 |
${d("Visit the journal")} |
| 417 |
<span aria-hidden="true">↗</span> |
| 418 |
</a> |
| 419 |
</div> |
| 420 |
|
| 421 |
${tl(t)} |
| 422 |
|
| 423 |
<footer class="os-settings__about-footer"> |
| 424 |
<p> |
| 425 |
<strong>${d("OpenStation Journal")}</strong> |
| 426 |
<span |
| 427 |
>${d("News and field notes, delivered over RSS.")}</span |
| 428 |
> |
| 429 |
</p> |
| 430 |
<a |
| 431 |
href=${n} |
| 432 |
target="_blank" |
| 433 |
rel="noopener noreferrer" |
| 434 |
> |
| 435 |
<span |
| 436 |
class="dashicons dashicons-rss" |
| 437 |
aria-hidden="true" |
| 438 |
></span> |
| 439 |
${d("RSS feed")} |
| 440 |
</a> |
| 441 |
</footer> |
| 442 |
</div> |
| 443 |
`,s)}function sl(){const s=document.createElement("div");s.classList.add("os-settings__about");const e=window.openStationConfig??{};Vt(s,e,{kind:"loading"});const t=new AbortController;let o=!1;const i=async()=>{if(await Za(s,t.signal),!(o||!s.isConnected)){if(!e.aboutFeedUrl){Vt(s,e,{kind:"error"});return}try{const r=await O(e.aboutFeedUrl,{credentials:"same-origin",signal:t.signal},{windowId:"desktop-mode-os-settings",source:"openstation/about-feed"});if(!r.ok)throw new Error(`about feed returned ${r.status}`);const a=await r.json(),l=a.success?Ya(a.data):null;if(!l)throw new Error("about feed returned an invalid payload");!o&&s.isConnected&&Vt(s,e,{kind:"ready",feed:l})}catch(r){if(t.signal.aborted||o)return;typeof console<"u"&&console.error("[openstation/about] journal feed failed:",r),Vt(s,e,{kind:"error"})}}};requestAnimationFrame(()=>{i()});const n=new MutationObserver(()=>{s.isConnected||(o=!0,t.abort(),n.disconnect())});return n.observe(document.body,{childList:!0,subtree:!0}),s}function ol(s,e){switch(s){case"wp-blue":return d("WordPress Blue");case"indigo":return d("Indigo");case"teal":return d("Teal");case"emerald":return d("Emerald");case"amber":return d("Amber");case"rose":return d("Rose");default:return e}}function il(s,e){switch(s){case"compact":return d("Compact");case"default":return d("Default");case"large":return d("Large");default:return e}}function nl(s,e){switch(s){case"sharp":return d("Sharp");case"default":return d("Default");case"round":return d("Round");default:return e}}function rl(s,e){switch(s){case"static":return d("Static");case"dynamic":return d("Dynamic");case"hidden":return d("Hidden");default:return e}}function al(s,e){switch(s){case"bottom":return d("Bottom");case"left":return d("Left");case"right":return d("Right");default:return e}}function ll(s,e){switch(s){case"classic":return d("Split");case"unified":return d("Unified");default:return e}}function cl(s){switch(s){case"classic":return d("Core admin menus are placed in a sidebar; plugins, apps, and OpenStation controls in a dock along the bottom edge.");case"unified":return d("Every menu in a single dock.");default:return""}}const dl="conic-gradient( #f252fc, #9af2ff, #93f0c6, #f8f2b6, #ff5a5a, #f252fc )";function ul(s){const e=()=>{const r=i.querySelector(".os-settings__accent-picker");if(r)try{r.showPicker()}catch{r.click()}},t=r=>{const a=r.detail?.value??"";a!==me&&!Ms().some(l=>l.id===a)||(s.state.accent=a,s.save(),s.apply(),n(),a===me&&e())},o=r=>{const a=r.target.value;/^#[0-9a-fA-F]{6}$/.test(a)&&(s.state.customAccent=a,s.state.accent=me,s.save(),s.apply(),n())},i=document.createElement("div"),n=()=>{const r=s.state.accent===me;L(c` |
| 444 |
<os-section |
| 445 |
heading=${d("Accent color")} |
| 446 |
description=${d("Used in focused window title bars, buttons, and focus rings.")} |
| 447 |
> |
| 448 |
<os-swatch-grid |
| 449 |
label=${d("Accent color")} |
| 450 |
mode="row" |
| 451 |
@os-pick=${t} |
| 452 |
> |
| 453 |
${Ms().map(a=>c`<os-swatch |
| 454 |
value=${a.id} |
| 455 |
label=${ol(a.id,a.label)} |
| 456 |
preview=${a.value} |
| 457 |
size="small" |
| 458 |
variant="accent" |
| 459 |
?selected=${s.state.accent===a.id} |
| 460 |
></os-swatch>`)} |
| 461 |
<span class="os-settings__accent-custom"> |
| 462 |
<os-swatch |
| 463 |
value=${me} |
| 464 |
label=${d("Custom")} |
| 465 |
preview=${r?s.state.customAccent:dl} |
| 466 |
size="small" |
| 467 |
variant="accent" |
| 468 |
?selected=${r} |
| 469 |
></os-swatch> |
| 470 |
<input |
| 471 |
type="color" |
| 472 |
class="os-settings__accent-picker" |
| 473 |
tabindex="-1" |
| 474 |
aria-hidden="true" |
| 475 |
.value=${s.state.customAccent} |
| 476 |
@input=${o} |
| 477 |
/> |
| 478 |
</span> |
| 479 |
</os-swatch-grid> |
| 480 |
</os-section> |
| 481 |
`,i)};return n(),i}function hl(s){switch(s){case"dynamic":return d("The admin bar slides out of the way and comes back when you move the pointer to the top edge of the screen.");case"hidden":return d("The admin bar is never shown. Use the Exit OpenStation tile on the dock to get back to the classic admin.");default:return d("The admin bar is always visible above the desktop.")}}function pl(s){const e=i=>{const n=i.detail?.value??"";Ii.some(r=>r.id===n)&&(s.state.adminBarMode=n,s.save(),s.apply(),o())},t=document.createElement("div"),o=()=>L(c` |
| 482 |
<os-section |
| 483 |
heading=${d("Admin bar")} |
| 484 |
description=${hl(s.state.adminBarMode)} |
| 485 |
> |
| 486 |
<os-segmented |
| 487 |
value=${s.state.adminBarMode} |
| 488 |
label=${d("Admin bar")} |
| 489 |
@os-pick=${e} |
| 490 |
> |
| 491 |
${Ii.map(i=>c`<os-segment value=${i.id} |
| 492 |
>${rl(i.id,i.label)}</os-segment |
| 493 |
>`)} |
| 494 |
</os-segmented> |
| 495 |
</os-section> |
| 496 |
`,t);return o(),t}const fl=x` ${R}: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}.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-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 )}`,Vi='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])';function gl(s){let e=s?.activeElement??null;for(;e?.shadowRoot?.activeElement;)e=e.shadowRoot.activeElement;return e&&e!==s?.body?e:null}function Oi(s){const e=s.composedPath(),t=e.length>0?e[0]:s.target;return t instanceof HTMLElement?t:null}function Ki(s){return s!==null&&s.matches(Vi)}const Oe=class Oe extends k{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(Ki(Oi(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}),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,o){super.attributeChangedCallback(e,t,o),e==="open"&&(o!==null?(this._prevFocus=gl(this.ownerDocument),this._focusTries=0,queueMicrotask(this._focusInitial)):this._restoreFocus())}_focusables(){const e=this.shadowRoot;return e?Array.from(e.querySelectorAll(Vi)):[]}_trapTab(e){const t=this._focusables();if(t.length===0)return;const o=t[0],i=t[t.length-1],n=Oi(e),r=!Ki(n);e.shiftKey&&(r||n===o)?(e.preventDefault(),i.focus()):!e.shiftKey&&(r||n===i)&&(e.preventDefault(),o.focus())}_initialFocusTarget(){const e=this.shadowRoot;if(!e)return null;const t=e.querySelector(".btn--secondary"),o=e.querySelector(".dialog");return this.hasAttribute("danger")?t??e.querySelector(".close")??o:e.querySelector(".btn--primary, .btn--danger")??t??o}_restoreFocus(){const e=this._prevFocus;this._prevFocus=null,!(!e||!e.isConnected)&&e.focus()}render(){const e=this.title??"",t=this.message??"",o=this["confirm-label"]||"Confirm",i=this["cancel-label"]||"Cancel",n=this.hasAttribute("danger"),r=this.hasAttribute("hide-cancel"),a=this.hasAttribute("dismissable");return c` |
| 497 |
<div class="dialog" tabindex="-1"> |
| 498 |
${a?c`<button |
| 499 |
type="button" |
| 500 |
class="close" |
| 501 |
aria-label="Close" |
| 502 |
@click=${()=>this._cancel()} |
| 503 |
>×</button>`:c``} |
| 504 |
${e?c`<h2 class="title">${e}</h2>`:c``} |
| 505 |
${t?c`<p class="message">${t}</p>`:c``} |
| 506 |
<div class="actions"> |
| 507 |
${r?c``:c`<button |
| 508 |
type="button" |
| 509 |
class="btn btn--secondary" |
| 510 |
@click=${()=>this._cancel()} |
| 511 |
> |
| 512 |
${i} |
| 513 |
</button>`} |
| 514 |
<button |
| 515 |
type="button" |
| 516 |
class="btn ${n?"btn--danger":"btn--primary"}" |
| 517 |
@click=${()=>this._confirm()} |
| 518 |
> |
| 519 |
${o} |
| 520 |
</button> |
| 521 |
</div> |
| 522 |
</div> |
| 523 |
`}};Oe.props=["open","title","message","confirm-label","cancel-label","danger","hide-cancel","dismissable"],Oe.styles=[fl],Oe.help=void 0;let Hs=Oe;$("os-confirm-dialog",Hs);function Bi(s){return new Promise(e=>{const t=document.createElement("os-confirm-dialog");t.setAttribute("open",""),s.title&&t.setAttribute("title",s.title),t.setAttribute("message",s.message),s.confirmLabel&&t.setAttribute("confirm-label",s.confirmLabel),s.cancelLabel&&t.setAttribute("cancel-label",s.cancelLabel),s.danger&&t.setAttribute("danger",""),s.hideCancel&&t.setAttribute("hide-cancel",""),s.dismissable&&t.setAttribute("dismissable","");const o=i=>{t.remove(),e(i)};t.addEventListener("os-confirm",()=>o(!0)),t.addEventListener("os-cancel",()=>o(!1)),document.body.appendChild(t)})}const Gi=K("desktop-mode/dock-rail-registry",()=>({registry:new Map,listeners:new Set,activeId:"default"})),Xi=Gi.state.registry,Zi=Gi.state.listeners;function bl(s){return Xi.get(s)}function Yi(){return Array.from(Xi.values())}function ml(s){return Zi.add(s),()=>{Zi.delete(s)}}function Ot(){const s=window.wp?.hooks;if(!s)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 s}function vl(s,e,t,o){Ot().addAction(s,e,t,o)}function _l(s,e){return Ot().removeAction(s,e)}function J(s,e,...t){return Ot().applyFilters(s,e,...t)}function re(s,...e){Ot().doAction(s,...e)}const F={WALLPAPERS:"os.wallpapers",UNFOCUS_EFFECTS:"os.unfocus-effects",WINDOW_REVEALS:"os.window-reveals",WALLPAPER_PREVIEW_PARAMS:"os.wallpaper.preview-params",WALLPAPER_SETTINGS_CHANGED:"os.wallpaper.settings-changed",SHELL_ERROR:"os.shell.error",DESKTOP_THEME_ICON:"os.os-theme.icon",DESKTOP_THEME_ICON_COLOR:"os.os-theme.icon-color",WALLPAPERS_SERVER_CHANGED:"os.wallpapers.server-changed",WINDOW_LINK_RENDERERS:"os.window-links.renderers"};function Ji(s,e){if(!s||typeof s!="object")return["def (not an object)"];const t=s,o=[];for(const i of e)i.valid(t)||o.push(`${i.field} (${i.message})`);return o}class yl extends Error{constructor(e,t,o){super(`[openstation] ${e} registration rejected — fields: `+t.join(", ")+"."),this.name="RegistrationError",this.kind=e,this.errors=t,this.def=o}}function qs(s,e,t){if(e.length!==0)throw new yl(s,e,t)}const Q=[[0,0],[100,0],[100,100],[0,100]],wl=48,xl=80,Us=6,Fs=8,Qi=4,en=3,tn=64,Ws=105,ee=2;function sn(s){return`${Math.round(s*1e3)/1e3}%`}function te(s){return s.slice().reverse()}function ve(s,e,t,o){return[[s,e],[t,e],[t,o],[s,o]]}function kl(s,e,t,o){const i=[];for(let n=0;n<o;n++){const r=n/o*Math.PI*2;i.push([s+Math.cos(r)*t,e+Math.sin(r)*t])}return i}function B(s,e=[]){const t=[],o=i=>{t.push(`${sn(i[0])} ${sn(i[1])}`)};for(const i of s)o(i);if(e.length>0){o(s[0]);for(const i of e){for(const n of i)o(n);o(i[0]),o(s[0])}}return`polygon( ${t.join(", ")} )`}function on(s){return B(Q,[te(kl(50,50,s,wl))])}function nn(s){return B(Q,[te(ve(50-s,-ee,50+s,100+ee))])}function rn(s){const e=100/Us,t=[];for(let o=0;o<Us;o++){const i=o*e;t.push(te(ve(-ee,i,100+ee,i+s)))}return B(Q,t)}function an(s){return B(Q,[te(ve(-ee,50-s,100+ee,50+s))])}function ln(s){const e=100/Fs,t=[];for(let o=0;o<Fs;o++){const i=o*e;t.push(te(ve(i,-ee,i+s,100+ee)))}return B(Q,t)}function cn(s){return B(Q,[te([[50,50-s],[50+s,50],[50,50+s],[50-s,50]])])}function dn(s){const e=100/Qi,t=100/en,o=[];for(let i=0;i<en;i++)for(let n=0;n<Qi;n++){const r=n*e+e/2,a=i*t+t/2,l=e/2*s,u=t/2*s;o.push(te(ve(r-l,a-u,r+l,a+u)))}return B(Q,o)}function un(s){const e=-Math.PI/2,t=s/180*Math.PI,o=[[50,50]];for(let i=0;i<tn;i++){const n=e+i/(tn-1)*t;o.push([50+Math.cos(n)*Ws,50+Math.sin(n)*Ws])}return B(Q,[te(o)])}function $l(){return{from:on(0),to:on(xl)}}function Al(){return{from:nn(0),to:nn(52)}}function Cl(){return{from:rn(0),to:rn(100/Us+.5)}}function Sl(){return{from:an(0),to:an(52)}}function El(){return{from:ln(0),to:ln(100/Fs+.5)}}function Ll(){return{from:cn(0),to:cn(Ws)}}function Rl(){return{from:dn(0),to:dn(1.04)}}function Tl(){return{from:un(0),to:un(360)}}function Pl(){return{from:"inset( 0% 0% 0% 0% )",to:"inset( 0% 0% 100% 0% )"}}function zl(){return{from:"inset( 0% 0% 0% 0% )",to:"inset( 0% 0% 0% 100% )"}}function Il(){return{from:B([[-60,0],[100,0],[100,100],[0,100]]),to:B([[100,0],[260,0],[260,100],[160,100]])}}const js=6,Vs=100,le=Vs/2,Kt=200,hn=90,pn=["#5c5c6d","#525261","#484855","#3e3e49","#34343d","#2a2a31"],Ml="#101014",Dl=1.25,ce="http://www.w3.org/2000/svg";let Nl=0;function Bt(s){return Math.round(s*1e3)/1e3}function Os(s){return s/js*Math.PI*2-Math.PI/2}function Hl(s){const t=Os(s)+Math.PI/js+Math.PI/2;return{x:Math.cos(t),y:Math.sin(t)}}function ql(s){const e=Os(s),t=Os(s+1);return[[le,le],[le+Math.cos(e)*Kt,le+Math.sin(e)*Kt],[le+Math.cos(t)*Kt,le+Math.sin(t)*Kt]]}function fn(s,e){const t=ql(s),o=document.createElementNS(ce,"path");return o.setAttribute("d",`M ${t.map(([i,n])=>`${Bt(i)} ${Bt(n)}`).join(" L ")} Z`),e?o.setAttribute("fill","#fff"):(o.setAttribute("fill",pn[s%pn.length]),o.setAttribute("stroke",Ml),o.setAttribute("stroke-width",String(Dl)),o.setAttribute("vector-effect","non-scaling-stroke"),o.setAttribute("stroke-linejoin","round")),o}function Ul(){const s=`os-iris-${++Nl}`,e=document.createElementNS(ce,"svg");e.setAttribute("viewBox",`0 0 ${Vs} ${Vs}`),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(ce,"defs"),o=document.createElementNS(ce,"mask");o.setAttribute("id",s);const i=document.createElementNS(ce,"g"),n=document.createElementNS(ce,"g");n.setAttribute("mask",`url(#${s})`);const r=[];for(let l=0;l<js;l++){const u=fn(l,!0),h=fn(l,!1);i.appendChild(u),n.appendChild(h),r.push({el:u,index:l},{el:h,index:l})}o.appendChild(i),t.appendChild(o),e.appendChild(t),e.appendChild(n);const a=document.createElement("div");return a.appendChild(e),{element:a,play:l=>r.map(({el:u,index:h})=>{const p=Hl(h),m=Bt(p.x*hn),_=Bt(p.y*hn);return u.animate([{transform:"translate( 0px, 0px )"},{transform:`translate( ${m}px, ${_}px )`}],{duration:l.duration,easing:l.easing,delay:l.delay,fill:"both"})})}}const _e="none",gn=K("desktop-mode/window-reveal-registry",()=>({registry:new Map,listeners:new Set})),Ks=gn.state.registry,Bs=gn.state.listeners,bn=/^[a-z0-9_/-]+$/;function mn(s){const e=/^\s*([a-zA-Z-]+)\s*\(/.exec(s);return e?e[1].toLowerCase():""}const Fl=0;function vn(s,e){const t=[],o=typeof s.from=="string"&&s.from.trim()!=="",i=typeof s.to=="string"&&s.to.trim()!=="";if(o||t.push(`${e}.from (missing — the clip-path covering the window)`),i||t.push(`${e}.to (missing — the clip-path uncovering the window)`),o&&i){const n=mn(s.from),r=mn(s.to);n===""||r===""?t.push(`${e}.from|to (must be shape functions, e.g. \`inset( … )\` or \`polygon( … )\` — bare keywords like \`none\` cannot be animated)`):n!==r&&t.push(`${e}.from|to (must use the same shape function to interpolate — got \`${n}()\` and \`${r}()\`)`)}return t}function Wl(s){if(typeof KeyframeEffect!="function")return!0;try{return new KeyframeEffect(null,null,{easing:s}),!0}catch{return!1}}function W(s){const e=[];if(!s||typeof s!="object")e.push("def (not an object)");else{typeof s.id!="string"||s.id.trim()===""?e.push("id (missing)"):bn.test(s.id.trim().toLowerCase())?s.id.trim().toLowerCase()===_e&&e.push('id ("none" is reserved)'):e.push(`id (must match ${bn} — lowercase alphanum, hyphens, underscores, slashes for vendor/sub-id)`),(typeof s.label!="string"||s.label.trim()==="")&&e.push("label (missing)");const o=s.render!==void 0,i=Array.isArray(s.layers),n=s.from!==void 0||s.to!==void 0;o&&typeof s.render!="function"?e.push("render (not a function)"):o&&(i||n)?e.push("render|layers|from|to (supply exactly one of: a from/to pair, a layers array, or a render function)"):o||(i&&n?e.push("layers|from|to (supply EITHER a single from/to pair OR a layers array, not both)"):i?(s.layers.length===0&&e.push("layers (empty — supply at least one matched pair)"),s.layers.forEach((r,a)=>{if(!r||typeof r!="object"){e.push(`layers[ ${a} ] (not an object)`);return}e.push(...vn(r,`layers[ ${a} ]`))})):e.push(...vn(s,"").map(r=>r.replace(/^\./,"")))),s.easing!==void 0&&(typeof s.easing!="string"||s.easing.trim()===""?e.push("easing (not a non-empty string)"):Wl(s.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)"))}qs("WindowReveal",e,s);const t=s.id.trim().toLowerCase();Ks.set(t,{...s,id:t}),Ol()}function _n(){const s=Array.from(Ks.values()),e=J(F.WINDOW_REVEALS,s);return Array.isArray(e)?e:(typeof console<"u"&&console.warn("[openstation] `os.window-reveals` filter returned a non-array; falling back to registry list."),s)}function jl(s){return Ks.has(s)}function Vl(s){return Bs.add(s),()=>{Bs.delete(s)}}function Ol(){const s=Array.from(Bs);for(const e of s)try{e()}catch(t){typeof console<"u"&&console.error("[openstation] window-reveal registry listener threw:",t)}}W({id:"sweep",label:d("Sweep"),description:d("A straight edge travels across the window, uncovering the page behind it."),...zl(),duration:420}),W({id:"iris",label:d("Iris"),description:d("The page opens out from the centre of the window, like a camera shutter."),...$l(),duration:520}),W({id:"curtain",label:d("Curtain"),description:d("Two panels part from the middle of the window and slide off the sides."),...Al(),duration:480}),W({id:"blinds",label:d("Blinds"),description:d("Six horizontal slats retract at once, letting the page through between them."),...Cl(),duration:560}),W({id:"diagonal",label:d("Diagonal"),description:d("A slanted edge sweeps off the trailing corner of the window."),...Il(),duration:460}),W({id:"rise",label:d("Rise"),description:d("The page rises into the window from the bottom edge upward."),...Pl(),duration:440}),W({id:"shutter",label:d("Shutter"),description:d("Two panels part from the middle of the window and slide off the top and bottom."),...Sl(),duration:480}),W({id:"slats",label:d("Slats"),description:d("Eight vertical slats retract at once, letting the page through between them."),...El(),duration:560}),W({id:"diamond",label:d("Diamond"),description:d("The page opens out from the centre of the window through a growing rhombus."),...Ll(),duration:520}),W({id:"mosaic",label:d("Mosaic"),description:d("The page arrives as a grid of tiles, each opening out from its own centre."),...Rl(),duration:600}),W({id:"obturator",label:d("Camera shutter"),description:d("Six wedges slide aside in unison, opening a hexagonal aperture from the centre like the iris of a camera lens."),render:Ul,duration:720,edgeLag:0}),W({id:"radar",label:d("Radar"),description:d("A spoke sweeps a full turn around the centre of the window, uncovering the page behind it."),...Tl(),duration:760});const yn={dockSize:["compact","default","large"],desktopLayout:["classic","unified"],dockPlacement:["bottom","left","right"],windowRadius:["sharp","default","round"],adminBarMode:["static","dynamic","hidden"]},wn=["dockRailRenderer","windowReveal","accent"],xn={windowRevealDuration:{min:80,max:4e3}},Kl=/^[a-z0-9_-]+$/;[...Object.keys(yn),...wn,...Object.keys(xn)];function kn(s){if(!s||typeof s!="object"||Array.isArray(s))return{};const e=s,t={},o={};for(const[i,n]of Object.entries(yn)){const r=e[i];typeof r=="string"&&n.includes(r)&&(t[i]=r)}for(const i of wn){const n=e[i];typeof n=="string"&&Kl.test(n)&&(t[i]=n)}for(const[i,n]of Object.entries(xn)){const r=e[i];typeof r=="number"&&Number.isFinite(r)&&(o[i]=Math.min(n.max,Math.max(n.min,Math.round(r))))}return{...t,...o}}function Gs(s){const e=kn(s);return typeof e.dockRailRenderer=="string"&&bl(e.dockRailRenderer)===void 0&&delete e.dockRailRenderer,typeof e.windowReveal=="string"&&e.windowReveal!==_e&&!jl(e.windowReveal)&&delete e.windowReveal,typeof e.accent=="string"&&!Ms().some(t=>t.id===e.accent)&&delete e.accent,e}const Bl=/^[a-z0-9_-]+$/,$n=128;function Gl(s){return typeof s!="string"||s===""||s.length>2048?!1:s.startsWith("dashicons-")||s.startsWith("https://")||s.startsWith("http://")||s.startsWith("data:image/")}function An(s){if(!s||typeof s!="object")return null;const e=s,t=typeof e.slug=="string"?e.slug:"";if(!Bl.test(t))return null;const o={};if(e.icons&&typeof e.icons=="object"){let l=0;for(const[u,h]of Object.entries(e.icons)){if(l>=$n)break;u===""||!Gl(h)||(o[u]=h,l+=1)}}const i={};if(e.tokens&&typeof e.tokens=="object")for(const[l,u]of Object.entries(e.tokens))typeof u=="string"&&(i[l]=u);const n=[];if(Array.isArray(e.fonts))for(const l of e.fonts)typeof l=="string"&&l!==""&&n.push(l);const r={};if(e.iconColors&&typeof e.iconColors=="object"){let l=0;for(const[u,h]of Object.entries(e.iconColors)){if(l>=$n)break;u===""||typeof h!="string"||h===""||(r[u]=h,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:i,fonts:n,icons:o,iconColors:r,recommendedOsSettings:kn(e.recommendedOsSettings),installedAt:typeof e.installedAt=="number"?e.installedAt:0,source:e.source==="code"?"code":"upload"}}function Xl(){const e=window.openStationConfig?.serverDesktopThemes,t=[];if(Array.isArray(e))for(const o of e){const i=An(o);i&&t.push(i)}return{themes:t,activeId:null,activeIcons:null,activeIconColors:null}}const X=K("desktop-mode/desktop-themes",Xl);function Cn(){return X}function Zl(){return X.getState().themes.slice()}function Sn(s){if(typeof s!="string"||s==="")return null;const e=s.replace(/\//g,"-");return X.getState().themes.find(t=>t.slug===e||t.id===s)??null}function Yl(s){const e=An(s);if(!e)return null;const t=X.state.themes.slice(),o=t.findIndex(i=>i.slug===e.slug);return o>=0?t[o]=e:t.push(e),t.sort((i,n)=>i.name.localeCompare(n.name)),X.setState({themes:t}),e}function Jl(s){const e=X.state.themes.filter(t=>t.slug!==s);e.length!==X.state.themes.length&&X.setState({themes:e})}function Ql(s){return X.subscribe(s)}async function En(s,e){try{const t=await s.json();if(t&&typeof t.message=="string"&&t.message!=="")return t.message}catch{}return`${e} (HTTP ${s.status}).`}function Ln(s){const e=s?.serverWallpapers;Array.isArray(e)&&re(F.WALLPAPERS_SERVER_CHANGED,{wallpapers:e})}async function ec(s,e){const t=s.desktopThemesUrl??"";if(t==="")throw new Error("[openstation] No desktopThemesUrl in the shell config — the desktop-themes REST route is unavailable.");const o=new FormData;o.append("file",e,e.name);const i=await O(t,{method:"POST",credentials:"same-origin",headers:{"X-WP-Nonce":s.restNonce},body:o},{source:"desktop-mode/desktop-themes/upload"});if(!i.ok)throw new Error(await En(i,"Theme upload failed"));const n=await i.json();return Ln(n),n}async function tc(s,e){const t=s.desktopThemesUrl??"";if(t==="")throw new Error("[openstation] No desktopThemesUrl in the shell config — the desktop-themes REST route is unavailable.");const o=await O(`${t}/${encodeURIComponent(e)}`,{method:"DELETE",credentials:"same-origin",headers:{"X-WP-Nonce":s.restNonce}},{source:"desktop-mode/desktop-themes/delete"});if(!o.ok)throw new Error(await En(o,"Theme delete failed"));try{Ln(await o.json())}catch{}}function sc(s){const e=Cn().state;if(e.activeIcons===null||!s)return null;const t=e.activeIcons[s];if(typeof t!="string"||t==="")return null;const o=J(F.DESKTOP_THEME_ICON,t,{slot:s,themeId:e.activeId??""});return typeof o=="string"&&o!==""?o:null}function oc(s){const e=Cn().state;if(e.activeIconColors===null||!s)return null;const t=e.activeIconColors[s];if(typeof t!="string"||t==="")return null;const o=J(F.DESKTOP_THEME_ICON_COLOR,t,{slot:s,themeId:e.activeId??""});return typeof o=="string"&&o!==""?ic(o):null}function ic(s){const e=s.trim();if(e===""||e.length>64||/[;{}<>"'\\]/.test(e))return null;let t=0;for(const o of e)if(o==="(")t+=1;else if(o===")"&&(t-=1,t<0))return null;return t===0?e:null}const ye={OS_SETTINGS:"OS_SETTINGS",RECYCLE_BIN:"RECYCLE_BIN",BUG_REPORT:"BUG_REPORT",EXIT_OPENSTATION:"EXIT_OPENSTATION",PWA_INSTALL:"PWA_INSTALL"},nc={"desktop-mode-os-settings":ye.OS_SETTINGS,"desktop-mode-recycle-bin":ye.RECYCLE_BIN,"desktop-mode-bug-report":ye.BUG_REPORT,"os-exit":ye.EXIT_OPENSTATION,"os-pwa-install":ye.PWA_INSTALL};function rc(s){if(typeof s!="string"||s==="")return"";const e=nc[s];if(e)return e;const t=s.toLowerCase().replace(/[^a-z0-9_-]/g,"");return t===""?"":`APP:${t}`}const Rn="",ac="system-default",Tn={accent:"pulse",desktopLayout:"unified",dockPlacement:"bottom"};function Pn(s,e,t={}){const o=e===Rn,i=o?null:Sn(e);if(!o&&!i)return{};const n=o?ac:i.slug,r=s.appliedThemeRecommendations.includes(n);if(r&&!t.force)return{};const a=Gs(o?Tn:i.recommendedOsSettings),l=Object.keys(a);if(l.length===0)return{};const u=s,h={};for(const p of l){const m=a[p];typeof m!="string"&&typeof m!="number"||!(p in s)||typeof u[p]!=typeof m||(u[p]=m,h[p]=m)}return Object.keys(h).length===0?{}:(r||(s.appliedThemeRecommendations=[...s.appliedThemeRecommendations,n].slice(-64)),h)}function lc(s){if(s===Rn)return Object.keys(Gs(Tn)).length>0;const e=Sn(s);return e?Object.keys(Gs(e.recommendedOsSettings)).length>0:!1}const Gt="",zn="OpenStation";function cc(s){const e=s.trim().split(/\s+/).filter(Boolean);return e.length===0?"?":e.length>=2?(e[0][0]+e[1][0]).toUpperCase():e[0].slice(0,2).toUpperCase()}function dc(s){const e=document.createElement("div");e.className="os-settings__themes";let t="",o=!1;const i=!!s.config.canManageDesktopThemes,n=g=>{s.state.desktopTheme!==g&&(s.state.desktopTheme=g,Pn(s.state,g),s.save(),s.apply(),w())},r=g=>{const f=Pn(s.state,g,{force:!0});Object.keys(f).length!==0&&(s.save(),s.apply(),w())},a=async g=>{if(!o){o=!0,t="",w();try{const f=await ec(s.config,g);Yl(f)}catch(f){t=f instanceof Error?f.message:d("That theme could not be installed.")}finally{o=!1,w()}}},l=async g=>{if(await Bi({title:d("Delete this theme?"),message:j(d("“%s” will be removed from this site for everyone. This cannot be undone."),g.name),confirmLabel:d("Delete"),danger:!0})){t="";try{await tc(s.config,g.slug),Jl(g.slug),s.state.desktopTheme===g.slug&&(s.state.desktopTheme=Gt,s.save(),s.apply())}catch(y){t=y instanceof Error?y.message:d("That theme could not be deleted.")}w()}},u=g=>{const f=g.currentTarget,y=f.files?.[0];y&&a(y),f.value=""},h=g=>{g.preventDefault(),g.currentTarget.classList.remove("os-settings__theme-upload--dragover");const f=g.dataTransfer?.files?.[0];f&&a(f)},p=g=>{const f=s.state.desktopTheme===g.slug;return c`<div class="os-settings__theme-card-wrap"> |
| 524 |
<button |
| 525 |
type="button" |
| 526 |
class="os-settings__theme-card" |
| 527 |
aria-pressed=${f?"true":"false"} |
| 528 |
data-theme-slug=${g.slug} |
| 529 |
@click=${()=>n(g.slug)} |
| 530 |
> |
| 531 |
<span class="os-settings__theme-preview"> |
| 532 |
${g.previewUrl?c`<img |
| 533 |
src=${g.previewUrl} |
| 534 |
alt="" |
| 535 |
aria-hidden="true" |
| 536 |
draggable="false" |
| 537 |
/>`:c`<span |
| 538 |
class="os-settings__theme-initials" |
| 539 |
aria-hidden="true" |
| 540 |
>${cc(g.name)}</span |
| 541 |
>`} |
| 542 |
</span> |
| 543 |
<span class="os-settings__theme-name" |
| 544 |
>${g.name}</span |
| 545 |
> |
| 546 |
<span class="os-settings__theme-meta"> |
| 547 |
${g.version!==""?j(d("Version %s"),g.version):""} |
| 548 |
</span> |
| 549 |
</button> |
| 550 |
${i&&g.source!=="code"?c`<button |
| 551 |
type="button" |
| 552 |
class="os-settings__theme-delete" |
| 553 |
aria-label=${j(d("Delete %s"),g.name)} |
| 554 |
@click=${()=>void l(g)} |
| 555 |
> |
| 556 |
× |
| 557 |
</button>`:""} |
| 558 |
</div>`},m=()=>{const g=s.state.desktopTheme===Gt;return c`<div class="os-settings__theme-card-wrap"> |
| 559 |
<button |
| 560 |
type="button" |
| 561 |
class="os-settings__theme-card os-settings__theme-card--system" |
| 562 |
aria-pressed=${g?"true":"false"} |
| 563 |
@click=${()=>n(Gt)} |
| 564 |
> |
| 565 |
<span |
| 566 |
class="os-settings__theme-preview os-settings__theme-preview--system" |
| 567 |
aria-hidden="true" |
| 568 |
></span> |
| 569 |
<span class="os-settings__theme-name" |
| 570 |
>${zn}</span |
| 571 |
> |
| 572 |
<span class="os-settings__theme-meta" |
| 573 |
>${d("The look OpenStation ships with")}</span |
| 574 |
> |
| 575 |
</button> |
| 576 |
</div>`},_=()=>c`<div |
| 577 |
class=${o?"os-settings__theme-upload os-settings__theme-upload--busy":"os-settings__theme-upload"} |
| 578 |
@dragover=${g=>{g.preventDefault(),g.currentTarget.classList.add("os-settings__theme-upload--dragover")}} |
| 579 |
@dragleave=${g=>{g.currentTarget.classList.remove("os-settings__theme-upload--dragover")}} |
| 580 |
@drop=${h} |
| 581 |
> |
| 582 |
<label class="os-settings__theme-upload-label"> |
| 583 |
<input |
| 584 |
type="file" |
| 585 |
accept=".zip,application/zip" |
| 586 |
class="os-settings__file-input" |
| 587 |
?disabled=${o} |
| 588 |
@change=${u} |
| 589 |
/> |
| 590 |
<span class="os-settings__theme-upload-plus" aria-hidden="true" |
| 591 |
>+</span |
| 592 |
> |
| 593 |
<span class="os-settings__theme-upload-prompt" |
| 594 |
>${d(o?"Installing…":"Drop a theme .zip here, or click to upload")}</span |
| 595 |
> |
| 596 |
</label> |
| 597 |
</div>`,b=g=>{const f=s.state.desktopTheme;if(!lc(f))return"";const y=f===Gt?zn:g.find(A=>A.slug===f)?.name;return y===void 0?"":c`<div class="os-settings__theme-recommendation"> |
| 598 |
<os-button |
| 599 |
variant="secondary" |
| 600 |
@click=${()=>r(f)} |
| 601 |
>${j(d("Apply %s’s recommended layout and effects"),y)}</os-button |
| 602 |
> |
| 603 |
</div>`};function w(){const g=Zl();L(c` |
| 604 |
${t!==""?c`<os-notice tone="error">${t}</os-notice>`:""} |
| 605 |
<os-section heading=${d("Installed")}> |
| 606 |
<!-- |
| 607 |
role="group", not radiogroup. The upload tile is the |
| 608 |
last cell of this grid, the way the wallpaper picker |
| 609 |
on Appearance ends with "Use your own image", and a |
| 610 |
radiogroup may contain nothing but radios. The cards |
| 611 |
are toggle buttons carrying aria-pressed, which is |
| 612 |
what the swatches in that other picker already do, |
| 613 |
so the two now agree. |
| 614 |
--> |
| 615 |
<div |
| 616 |
class="os-settings__theme-grid" |
| 617 |
role="group" |
| 618 |
aria-label=${d("Desktop theme")} |
| 619 |
> |
| 620 |
${m()} |
| 621 |
${g.map(f=>p(f))} |
| 622 |
${i?_():""} |
| 623 |
</div> |
| 624 |
${b(g)} |
| 625 |
</os-section> |
| 626 |
`,e)}w();const v=Ql(()=>{if(!e.isConnected){v();return}w()});return e}function In(s){if(!s)return 214;let e=5381;for(let t=0;t<s.length;t++)e=Math.imul(e,33)+s.charCodeAt(t);return(e%360+360)%360}function uc(s){return typeof s!="string"||s===""||s.length>4096||!/^(https?:\/\/|data:image\/)/i.test(s)?!1:!/['"()\\<>\s]/.test(s)}function Mn(s,e,t){if(!uc(e))return!1;const o=`url("${e}") center / contain no-repeat`;return s.style.backgroundImage="none",s.style.backgroundColor=t,s.style.setProperty("-webkit-mask",o),s.style.setProperty("mask",o),!0}const Dn="data:image/svg+xml;base64,",Xt=new Map;function hc(s){const e=Xt.get(s);if(e!==void 0)return e;let t=!1;try{t=atob(s.slice(Dn.length)).includes("currentColor")}catch{}return Xt.size>=256&&Xt.clear(),Xt.set(s,t),t}function Nn(s,e){const t=e.className??"",o=e.title??"";let i=null;if(e.slot){const l=sc(e.slot);l!==null&&(s=l),i=oc(e.slot)}if(typeof s=="string"&&s.startsWith("dashicons-")){const l=document.createElement("span");return l.className=`dashicons ${s} ${t}`.trim(),l.setAttribute("aria-hidden","true"),i!==null&&(l.style.color=i),l}if(i!==null&&typeof s=="string"){const l=document.createElement("span");if(l.className=t,l.setAttribute("aria-hidden","true"),l.style.display="inline-block",Mn(l,s,i))return l}if(typeof s=="string"&&s.startsWith("data:image/svg+xml;base64,")){const l=s.slice(Dn.length);if(/^[A-Za-z0-9+/=]+$/.test(l)){const u=document.createElement("span");return u.className=t,u.setAttribute("aria-hidden","true"),u.style.display="inline-block",hc(s)&&Mn(u,s,"currentColor")||(u.style.backgroundImage=`url("${s}")`,u.style.backgroundRepeat="no-repeat",u.style.backgroundPosition="center",u.style.backgroundSize="contain"),u}}if(typeof s=="string"&&/^data:image\/(png|jpeg|jpg|gif|webp|x-icon|vnd\.microsoft\.icon);base64,/i.test(s)){const l=s.indexOf(","),u=l>=0?s.slice(l+1):"";if(/^[A-Za-z0-9+/=]+$/.test(u))return Hn(s,t)}if(typeof s=="string"&&(s.startsWith("http://")||s.startsWith("https://")))return Hn(s,t);const n=document.createElement("span");n.className=`${t} os-icon-letter`.trim(),n.setAttribute("aria-hidden","true");const r=pc(o);n.textContent=r;const a=In(o);return n.style.backgroundColor=`hsl( ${a}, 60%, 45% )`,n.style.color="#fff",n.style.display="inline-flex",n.style.alignItems="center",n.style.justifyContent="center",n.style.fontWeight="600",n.style.borderRadius="4px",n}function Hn(s,e){const t=document.createElement("img");return t.className=e,t.src=s,t.alt="",t.setAttribute("aria-hidden","true"),t.draggable=!1,t}function pc(s){const e=(s??"").trim();if(e==="")return"?";const t=e.split(/\s+/);if(t.length>=2)return(t[0][0]+t[1][0]).toUpperCase();const o=t[0];return o.length>=2?o.slice(0,2).toUpperCase():o.toUpperCase()}const fc={core:"rail",plugin:"rail",app:"desktop",control:"rail"};function gc(s,e){return s==="core"&&e==="classic"?"sidebar":"dock"}function bc(s,e){return s.locked?"rail":e[s.id]??s.defaultPlacement??fc[s.kind]}function mc(s){return s.map((e,t)=>({item:e,index:t})).sort((e,t)=>(e.item.order??0)-(t.item.order??0)||e.index-t.index).map(e=>e.item)}const vc=[{kinds:["core"],heading:d("WordPress Core"),description:d("The admin menus WordPress itself registers.")},{kinds:["plugin","app"],heading:d("Plugins & Apps"),description:d("Menus from installed plugins and apps.")},{kinds:["control"],heading:d("OpenStation"),description:d("The OpenStation’s own controls.")}];function _c(){const s=window.wp?.os;return typeof s?.getNavItems=="function"?s.getNavItems():[]}function yc(s){return s.locked||s.transient?!1:s.menu||s.entry?!0:s.tile?.placeable===!0}function wc(s){const e=document.createElement("div"),t=(u,h)=>{s.state.navPlacement={...s.state.navPlacement,[u]:h},s.save(),r()},o=u=>h=>{const m=h.detail?.value;(m==="both"||m==="rail"||m==="desktop"||m==="hidden")&&t(u,m)},i=u=>d(u==="classic"?"Choose where each menu shows up: on the dock/sidebar, on the desktop wallpaper, both, or hidden entirely. Changes apply instantly.":"Choose where each menu shows up: on the dock, on the desktop wallpaper, both, or hidden entirely. Changes apply instantly."),n=(u,h)=>[{id:"rail",label:gc(u,h)==="sidebar"?d("In the sidebar"):d("On the dock")},{id:"desktop",label:d("On the desktop")},{id:"both",label:d("On both")},{id:"hidden",label:d("Hidden")}],r=(u=s.state.navPlacement,h=s.state.desktopLayout)=>{const p=_c().filter(yc),m=vc.map(_=>({..._,rows:mc(p.filter(b=>_.kinds.includes(b.kind)))})).filter(_=>_.rows.length>0);L(c` |
| 627 |
<p class="os-settings__page-description os-nav-settings__lead"> |
| 628 |
${i(h)} |
| 629 |
</p> |
| 630 |
${m.length===0?c`<os-empty-state |
| 631 |
heading=${d("Nothing registered yet")} |
| 632 |
description=${d("Plugins and the admin menu will appear here once they’re registered.")} |
| 633 |
></os-empty-state>`:m.map(_=>c` |
| 634 |
<os-section |
| 635 |
class="os-nav-settings" |
| 636 |
heading=${_.heading} |
| 637 |
description=${_.description} |
| 638 |
> |
| 639 |
${_.rows.map(b=>a(b,u,h))} |
| 640 |
</os-section> |
| 641 |
`)} |
| 642 |
`,e)},a=(u,h,p)=>c`<div class="os-nav-settings__row" data-item-id=${u.id}> |
| 643 |
<div class="os-nav-settings__identity"> |
| 644 |
${Nn(u.icon,{title:u.title,className:"os-nav-settings__icon",slot:rc(u.id)})} |
| 645 |
<div class="os-nav-settings__title">${u.title}</div> |
| 646 |
</div> |
| 647 |
<os-select |
| 648 |
plain |
| 649 |
label=${u.title} |
| 650 |
value=${bc(u,h)} |
| 651 |
@os-pick=${o(u.id)} |
| 652 |
> |
| 653 |
${n(u.kind,p).map(m=>c`<os-option value=${m.id}>${m.label}</os-option>`)} |
| 654 |
</os-select> |
| 655 |
</div>`;r();const l=window.wp?.os;if(l?.subscribeOsSettings){const u=l.subscribeOsSettings(h=>{if(!e.isConnected){u();return}r(h.navPlacement,h.desktopLayout)})}return e}const xc={unified:[{kind:"win",style:"left:12%;top:14%;width:44%;height:42%"},{kind:"win",style:"left:30%;top:30%;width:44%;height:42%"},{kind:"bar",accent:!0,style:"left:24%;bottom:10%;width:52%;height:9%"}],classic:[{kind:"bar",accent:!0,style:"left:0;top:0;bottom:0;width:5%"},{kind:"win",style:"left:14%;top:14%;width:44%;height:42%"},{kind:"win",style:"left:32%;top:30%;width:44%;height:42%"},{kind:"bar",accent:!0,style:"left:33%;bottom:10%;width:38%;height:9%"}]};function kc(s){const e=l=>{Di.some(u=>u.id===l)&&(s.state.desktopLayout=l,s.save(),s.apply(),a())},t=l=>{const u=l.detail?.value??"";Mi.some(h=>h.id===u)&&(s.state.dockPlacement=u,s.save(),s.apply(),a())},o=l=>{const u=l.detail?.value??"";Pi.some(h=>h.id===u)&&(s.state.dockSize=u,s.save(),s.apply(),a())},i=()=>c`<div class="os-settings__dock-options"> |
| 656 |
<div class="os-settings__dock-option"> |
| 657 |
<span |
| 658 |
class="os-settings__dock-option-label" |
| 659 |
id="os-settings-dock-placement-label" |
| 660 |
>${d("Placement")}</span |
| 661 |
> |
| 662 |
<os-segmented |
| 663 |
value=${s.state.dockPlacement} |
| 664 |
label=${d("Dock position")} |
| 665 |
@os-pick=${t} |
| 666 |
> |
| 667 |
${Mi.map(l=>c`<os-segment value=${l.id} |
| 668 |
>${al(l.id,l.label)}</os-segment |
| 669 |
>`)} |
| 670 |
</os-segmented> |
| 671 |
</div> |
| 672 |
</div>`,n=()=>c`<div |
| 673 |
class="os-settings__dock-options os-settings__dock-options--page" |
| 674 |
> |
| 675 |
<div class="os-settings__dock-option"> |
| 676 |
<span |
| 677 |
class="os-settings__dock-option-label" |
| 678 |
id="os-settings-dock-size-label" |
| 679 |
>${d("Dock size")}</span |
| 680 |
> |
| 681 |
<os-segmented |
| 682 |
value=${s.state.dockSize} |
| 683 |
label=${d("Dock size")} |
| 684 |
@os-pick=${o} |
| 685 |
> |
| 686 |
${Pi.map(l=>c`<os-segment value=${l.id} |
| 687 |
>${il(l.id,l.label)}</os-segment |
| 688 |
>`)} |
| 689 |
</os-segmented> |
| 690 |
</div> |
| 691 |
</div>`,r=document.createElement("div"),a=()=>L(c` |
| 692 |
<os-section |
| 693 |
heading=${d("Desktop layout")} |
| 694 |
description=${d("Where the menus live.")} |
| 695 |
> |
| 696 |
<div |
| 697 |
class="os-settings__layout-grid" |
| 698 |
role="radiogroup" |
| 699 |
aria-label=${d("Desktop layout")} |
| 700 |
> |
| 701 |
${Di.map(l=>{const u=s.state.desktopLayout===l.id;return c`<div class="os-settings__layout-card"> |
| 702 |
<button |
| 703 |
type="button" |
| 704 |
class="os-settings__layout-choice" |
| 705 |
role="radio" |
| 706 |
aria-checked=${u?"true":"false"} |
| 707 |
@click=${()=>e(l.id)} |
| 708 |
> |
| 709 |
<span |
| 710 |
class="os-settings__layout-preview" |
| 711 |
aria-hidden="true" |
| 712 |
> |
| 713 |
${(xc[l.id]??[]).map(h=>c`<span |
| 714 |
class="os-settings__layout-${h.kind}${h.accent?" is-accent":""}" |
| 715 |
style=${h.style} |
| 716 |
></span>`)} |
| 717 |
</span> |
| 718 |
<span class="os-settings__layout-name" |
| 719 |
>${ll(l.id,l.label)}</span |
| 720 |
> |
| 721 |
<span class="os-settings__layout-desc" |
| 722 |
>${cl(l.id)}</span |
| 723 |
> |
| 724 |
</button> |
| 725 |
${l.id==="unified"&&u?i():c``} |
| 726 |
</div>`})} |
| 727 |
</div> |
| 728 |
${n()} |
| 729 |
</os-section> |
| 730 |
`,r);return a(),r}function $c(s){const e=i=>{const n=i.detail?.value??"";zi.some(r=>r.id===n)&&(s.state.windowRadius=n,s.save(),s.apply(),o())},t=document.createElement("div"),o=()=>L(c` |
| 731 |
<os-section |
| 732 |
heading=${d("Window corners")} |
| 733 |
description=${d("How rounded the corners of windows are.")} |
| 734 |
> |
| 735 |
<os-segmented |
| 736 |
value=${s.state.windowRadius} |
| 737 |
label=${d("Window corners")} |
| 738 |
@os-pick=${e} |
| 739 |
> |
| 740 |
${zi.map(i=>c`<os-segment value=${i.id} |
| 741 |
>${nl(i.id,i.label)}</os-segment |
| 742 |
>`)} |
| 743 |
</os-segmented> |
| 744 |
</os-section> |
| 745 |
`,t);return o(),t}const Ac="os.activity.";function Xs(s){return Ac+String(s).replace(/[^a-zA-Z0-9_.-]/g,".")}let Cc=0;const qn={publish(s,e){re(Xs(s),e)},subscribe(s,e){const t=`os/activity-sub/${++Cc}`,o=Xs(s);vl(o,t,n=>e(n));let i=!1;return()=>{i||(i=!0,_l(o,t))}},filter(s,e,...t){return J(Xs(s),e,...t)}};function Sc(s){s.style.setProperty("--os-file-tile-enter-delay",`${(Math.random()*.25).toFixed(3)}s`),s.style.setProperty("--os-file-tile-enter-duration",`${(.3+Math.random()*.25).toFixed(3)}s`)}const Zs=new Map;function Ec(s){let e,t;try{const i=new URL(s,document.baseURI);e=i.origin,t=i.pathname}catch{return null}if(!t)return null;const o=document.querySelectorAll("script[src]");for(const i of Array.from(o))try{const n=new URL(i.src,document.baseURI);if(n.origin===e&&n.pathname===t)return i}catch{}return null}function Lc(s,e){const t=Zs.get(s);if(t)return t;const o=new Promise((i,n)=>{const r=`script[data-os-vendor="${Rc(s)}"]`,a=document.querySelector(r);if(a){if(a.dataset.loaded==="1"){i();return}a.addEventListener("load",()=>i(),{once:!0}),a.addEventListener("error",()=>n(new Error(`Failed to load ${s}`)),{once:!0});return}const l=Ec(s);if(l){l.dataset.osVendor=s,l.dataset.loaded="1",i();return}e?.translations&&Zt(e.translations);for(const h of e?.l10n??[])Zt(h);for(const h of e?.before??[])Zt(h);const u=document.createElement("script");u.src=s,u.async=!0,u.dataset.osVendor=s,u.addEventListener("load",()=>{u.dataset.loaded="1";for(const h of e?.after??[])Zt(h);i()},{once:!0}),u.addEventListener("error",()=>{Zs.delete(s),u.remove(),n(new Error(`Failed to load ${s}`))},{once:!0}),document.head.appendChild(u)});return Zs.set(s,o),o}function Zt(s){if(!s)return;const e=document.createElement("script");e.textContent=s,e.dataset.osVendorInline="1",document.head.appendChild(e)}function Rc(s){return typeof CSS<"u"&&typeof CSS.escape=="function"?CSS.escape(s):s.replace(/["\\]/g,"\\$&")}K("desktop-mode/native-url-remap",()=>({remaps:[],deps:null}));function Tc(s){const e=document.createElement("div"),t=a=>{const l=a.detail?.value??"";l!==""&&(s.state.dockRailRenderer=l,s.save(),s.apply(),i())};let o=Yi();const i=()=>{if(o.length<=1){L(c``,e);return}L(c` |
| 746 |
<os-section |
| 747 |
heading=${d("Dock style")} |
| 748 |
description=${d("How the rail itself paints — the shipped icon strip, or anything a plugin replaces it with. Switching is instant; the dock rebuilds with the new renderer.")} |
| 749 |
> |
| 750 |
<os-segmented |
| 751 |
value=${s.state.dockRailRenderer} |
| 752 |
label=${d("Dock style")} |
| 753 |
@os-pick=${t} |
| 754 |
> |
| 755 |
${o.map(a=>c`<os-segment value=${a.id} |
| 756 |
>${a.label}</os-segment |
| 757 |
>`)} |
| 758 |
</os-segmented> |
| 759 |
</os-section> |
| 760 |
`,e)},n=ml(()=>{o=Yi(),i()}),r=new MutationObserver(()=>{e.isConnected||(n(),r.disconnect())});return queueMicrotask(()=>{e.parentNode&&r.observe(e.parentNode,{childList:!0,subtree:!1})}),i(),e}const Yt="none",Un=K("desktop-mode/unfocus-effect-registry",()=>({registry:new Map,listeners:new Set})),Fn=Un.state.registry,Ys=Un.state.listeners,Wn=/^[a-z0-9_/-]+$/;function Js(s){const e=[];!s||typeof s!="object"?e.push("def (not an object)"):(typeof s.id!="string"||s.id.trim()===""?e.push("id (missing)"):Wn.test(s.id.trim().toLowerCase())?s.id.trim().toLowerCase()===Yt&&e.push('id ("none" is reserved)'):e.push(`id (must match ${Wn} — lowercase alphanum, hyphens, underscores, slashes for vendor/sub-id)`),(typeof s.label!="string"||s.label.trim()==="")&&e.push("label (missing)"),typeof s.className!="string"&&typeof s.apply!="function"&&e.push("className|apply (at least one must be provided — a CSS class to toggle or an apply callback)")),qs("UnfocusEffect",e,s);const t=s.id.trim().toLowerCase();Fn.set(t,{...s,id:t}),zc()}function jn(){const s=Array.from(Fn.values()),e=J(F.UNFOCUS_EFFECTS,s);return Array.isArray(e)?e:(typeof console<"u"&&console.warn("[openstation] `os.unfocus-effects` filter returned a non-array; falling back to registry list."),s)}function Pc(s){return Ys.add(s),()=>{Ys.delete(s)}}function zc(){const s=Array.from(Ys);for(const e of s)try{e()}catch(t){typeof console<"u"&&console.error("[openstation] unfocus-effect registry listener threw:",t)}}Js({id:"darken",label:d("Darken"),description:d("Dim unfocused windows so the focused one stands out."),className:"os-window--fx-darken"}),Js({id:"frost",label:d("Frost"),description:d("Throw unfocused windows out of focus — a soft, frosted-glass blur, as if you were looking at them through an iced-over pane."),className:"os-window--fx-frost"}),Js({id:"grayscale",label:d("Grayscale"),description:d("Drain the colour from unfocused windows so the focused one is the only thing still in colour — your eye snaps right to it."),className:"os-window--fx-grayscale"});const Qs="none",Vn=K("desktop-mode/window-link-renderer-registry",()=>({registry:new Map,listeners:new Set})),Ic=Vn.state.registry,On=Vn.state.listeners;function Kn(){const s=Array.from(Ic.values()),e=J(F.WINDOW_LINK_RENDERERS,s);return Array.isArray(e)?e:(typeof console<"u"&&console.warn("[openstation] `os.window-links.renderers` filter returned a non-array; falling back to registry list."),s)}function Mc(s){return On.add(s),()=>{On.delete(s)}}const Bn=[{value:Fl,label:()=>d("Default (per reveal)")},{value:200,label:()=>d("Very fast — 200 ms")},{value:320,label:()=>d("Fast — 320 ms")},{value:460,label:()=>d("Normal — 460 ms")},{value:700,label:()=>d("Slow — 700 ms")},{value:1100,label:()=>d("Very slow — 1100 ms")}],Dc=[{id:"focus",label:()=>d("When a related window is focused")},{id:"always",label:()=>d("Always")},{id:"off",label:()=>d("Off")}];function Nc(s){const e=document.createElement("div"),t=w=>{const v=w.detail?.value??"";v!==""&&(v!==Yt&&!a.some(g=>g.id===v)||(s.state.unfocusEffect=v,s.save(),s.apply(),h()))},o=w=>{const v=w.detail?.value??"";v!==""&&(v!==_e&&!l.some(g=>g.id===v)||(s.state.windowReveal=v,s.save(),h()))},i=w=>{const v=w.detail?.value??"";if(v==="")return;const g=Number(v);Bn.some(f=>f.value===g)&&(s.state.windowRevealDuration=g,s.save(),h())},n=w=>{const v=w.detail?.value??"";v!==""&&(v!==Qs&&!u.some(g=>g.id===v)||(s.state.windowLinkRenderer=v,s.save(),s.apply(),h()))},r=w=>{const v=w.detail?.value??"";v!=="focus"&&v!=="always"&&v!=="off"||(s.state.windowLinkVisibility=v,s.save(),s.apply(),h())};let a=jn(),l=_n(),u=Kn();const h=()=>{const w=a.find(E=>E.id===s.state.unfocusEffect),v=d("Apply a visual treatment to every window except the one you are working in."),g=s.state.unfocusEffect!==Yt&&w?.description?w.description:v,f=l.find(E=>E.id===s.state.windowReveal),y=d("Uncover a window’s content when it finishes loading, instead of fading it in."),A=s.state.windowReveal!==_e&&f?.description?f.description:y,M=u.find(E=>E.id===s.state.windowLinkRenderer),oe=d("Draw a visual tie between windows showing related content — a post and its comments or media."),N=s.state.windowLinkRenderer!==Qs&&M?.description?M.description:oe;L(c` |
| 761 |
<os-section |
| 762 |
heading=${d("Unfocused windows")} |
| 763 |
description=${g} |
| 764 |
> |
| 765 |
<os-select |
| 766 |
value=${s.state.unfocusEffect} |
| 767 |
label=${d("Unfocused window effect")} |
| 768 |
@os-pick=${t} |
| 769 |
> |
| 770 |
<os-option value=${Yt}> |
| 771 |
${d("None")} |
| 772 |
</os-option> |
| 773 |
${a.map(E=>c`<os-option value=${E.id} |
| 774 |
>${E.label}</os-option |
| 775 |
>`)} |
| 776 |
</os-select> |
| 777 |
</os-section> |
| 778 |
<os-section |
| 779 |
heading=${d("Window reveal")} |
| 780 |
description=${A} |
| 781 |
> |
| 782 |
<os-select |
| 783 |
value=${s.state.windowReveal} |
| 784 |
label=${d("Reveal style")} |
| 785 |
@os-pick=${o} |
| 786 |
> |
| 787 |
<os-option value=${_e}> |
| 788 |
${d("None")} |
| 789 |
</os-option> |
| 790 |
${l.map(E=>c`<os-option value=${E.id} |
| 791 |
>${E.label}</os-option |
| 792 |
>`)} |
| 793 |
</os-select> |
| 794 |
<os-select |
| 795 |
value=${String(s.state.windowRevealDuration)} |
| 796 |
label=${d("Reveal speed")} |
| 797 |
@os-pick=${i} |
| 798 |
> |
| 799 |
${Bn.map(E=>c`<os-option value=${String(E.value)} |
| 800 |
>${E.label()}</os-option |
| 801 |
>`)} |
| 802 |
</os-select> |
| 803 |
</os-section> |
| 804 |
<os-section |
| 805 |
heading=${d("Window links")} |
| 806 |
description=${N} |
| 807 |
> |
| 808 |
<os-select |
| 809 |
value=${s.state.windowLinkRenderer} |
| 810 |
label=${d("Link style")} |
| 811 |
@os-pick=${n} |
| 812 |
> |
| 813 |
<os-option value=${Qs}> |
| 814 |
${d("None")} |
| 815 |
</os-option> |
| 816 |
${u.map(E=>c`<os-option value=${E.id} |
| 817 |
>${E.label}</os-option |
| 818 |
>`)} |
| 819 |
</os-select> |
| 820 |
<os-select |
| 821 |
value=${s.state.windowLinkVisibility} |
| 822 |
label=${d("Show links")} |
| 823 |
@os-pick=${r} |
| 824 |
> |
| 825 |
${Dc.map(E=>c`<os-option value=${E.id} |
| 826 |
>${E.label()}</os-option |
| 827 |
>`)} |
| 828 |
</os-select> |
| 829 |
</os-section> |
| 830 |
`,e)},p=Pc(()=>{a=jn(),h()}),m=Vl(()=>{l=_n(),h()}),_=Mc(()=>{u=Kn(),h()}),b=new MutationObserver(()=>{e.isConnected||(p(),m(),_(),b.disconnect())});return queueMicrotask(()=>{e.parentNode&&b.observe(e.parentNode,{childList:!0,subtree:!1})}),h(),e}function Hc(s){const{extendedOptions:e,extendedOptionsUrl:t,restNonce:o}=s.config,i={media_library_enhanced:e?.media_library_enhanced===!0,games:e?.games===!0,agents:e?.agents===!0,saving:!1,error:""},n=document.createElement("div");let r=!1;const a=async()=>{if(!(!t||!o)){if(i.saving){r=!0;return}i.saving=!0,i.error="",p();try{const m=await O(t,{method:"POST",headers:{"Content-Type":"application/json","X-WP-Nonce":o},body:JSON.stringify({options:{media_library_enhanced:i.media_library_enhanced,games:i.games,agents:i.agents}})},{source:"desktop-mode/settings/extended"});if(m.ok){const _=await m.json().catch(()=>null);_&&typeof _=="object"&&(s.config.extendedOptions=_)}else{const _=await m.json().catch(()=>({}));i.error=_.message??`Error ${m.status}`}}catch{i.error=d("Network error — check your connection.")}finally{i.saving=!1,r?(r=!1,await a()):p()}}},l=m=>{i.media_library_enhanced=m.detail?.checked===!0,a()},u=m=>{i.games=m.detail?.checked===!0,a()},h=m=>{i.agents=m.detail?.checked===!0,a()},p=()=>L(c` |
| 831 |
<os-section |
| 832 |
heading=${d("Extended options")} |
| 833 |
description=${d("Site-wide enhancements that apply to every user. Toggling requires the affected page to be reloaded for the change to take effect.")} |
| 834 |
> |
| 835 |
<div class="os-features__item"> |
| 836 |
<os-checkbox-label |
| 837 |
label=${d("Enable drag-and-drop in the Media Library")} |
| 838 |
?checked=${i.media_library_enhanced} |
| 839 |
@os-checkbox-change=${l} |
| 840 |
></os-checkbox-label> |
| 841 |
<p class="os-features__hint"> |
| 842 |
${d("Makes every item in the WordPress Media Library draggable. Drop a media item into text fields, rich-text editors, Gutenberg blocks, or any target that accepts images or files. No replacement of the library — just a drag-and-drop layer on top of the one you already know.")} |
| 843 |
</p> |
| 844 |
</div> |
| 845 |
|
| 846 |
<div class="os-features__item"> |
| 847 |
<os-checkbox-label |
| 848 |
label=${d("Enable games")} |
| 849 |
?checked=${i.games} |
| 850 |
@os-checkbox-change=${u} |
| 851 |
></os-checkbox-label> |
| 852 |
<p class="os-features__hint"> |
| 853 |
${d("Adds a Games app for every user: built-in games, scoreboards, and player-to-player challenges. Off by default — while off, nothing game-related runs anywhere, on the server or in the browser. Saved scores are kept across a disable and reappear when re-enabled.")} |
| 854 |
</p> |
| 855 |
</div> |
| 856 |
|
| 857 |
<div class="os-features__item"> |
| 858 |
<os-checkbox-label |
| 859 |
label=${d("Enable AI agents")} |
| 860 |
?checked=${i.agents} |
| 861 |
@os-checkbox-change=${h} |
| 862 |
></os-checkbox-label> |
| 863 |
<p class="os-features__hint"> |
| 864 |
${d("Adds an Agents section to WP Explorer: durable AI workers that live on the site as login-blocked users, act through the WordPress Abilities API under their own role, and answer in a chat window. Requires a configured AI connector to run. Off by default — while off, nothing agent-related loads. Agent definitions are kept across a disable and reappear when re-enabled.")} |
| 865 |
</p> |
| 866 |
</div> |
| 867 |
|
| 868 |
${i.error?c`<p class="os-ext__error">${i.error}</p>`:c``} |
| 869 |
${i.saving?c`<p class="os-ext__saving">${d("Saving…")}</p>`:c``} |
| 870 |
</os-section> |
| 871 |
`,n);return p(),n}let eo=null;function Jt(){return!!window.openStationShellOverlays}function qc(s){return new Promise((e,t)=>{const o=document.querySelector('script[data-os-shell-overlays="1"]'),i=()=>{if(Jt()){e();return}t(new Error("[openstation] shell-overlays bundle loaded but did not set `window.openStationShellOverlays`."))};if(o){Jt()?i():(o.addEventListener("load",i),o.addEventListener("error",()=>t(new Error("failed to load shell-overlays bundle"))));return}const n=document.createElement("script");n.src=s,n.async=!0,n.dataset.osShellOverlays="1",n.addEventListener("load",i),n.addEventListener("error",()=>t(new Error("failed to load shell-overlays bundle"))),document.head.appendChild(n)})}function Uc(s){return Jt()||!s?Promise.resolve():(eo||(eo=qc(s)),eo)}function Fc(){return window.openStationConfig?.shellOverlaysBundleUrl??""}function Wc(s,e){const t=Fc();if(Jt()||!t){e();return}Uc(t).then(()=>{s()&&e()}).catch(o=>{typeof console<"u"&&console.warn("[openstation] shell-overlays failed to load; menu/dialog suppressed:",o)})}const jc=4e3,Vc=200,Oc=1200;function to(s){const e=qn.filter("os/toast-requested",{...s});if(!e||e.cancel===!0)return()=>{};let t=!1,o=null;return Wc(()=>!t,()=>{o=Kc(e)}),()=>{t=!0,o&&o()}}function Kc(s){const e=Zc(),t=document.createElement("os-toast");t.textContent=s.message,s.action&&(t.setAttribute("action",s.action.label),t.addEventListener("os-toast-action",()=>{s.action?.onClick(),l()})),s.dismissible&&(t.setAttribute("dismissible",""),t.addEventListener("os-toast-dismiss",()=>{s.onDismiss?.(),l()})),e.appendChild(t);let o=!1,i=null,n=s.duration??jc,r=0;const a=()=>{i!==null&&(window.clearTimeout(i),i=null)},l=()=>{o||(o=!0,a(),Xc(t),t.setAttribute("state","out"),window.setTimeout(()=>{t.remove(),Gc()},Vc))},u=()=>{o||s.persistent||i!==null||(r=Date.now(),i=window.setTimeout(l,n))},h=()=>{i!==null&&(n=Math.max(0,n-(Date.now()-r)),a())};return requestAnimationFrame(()=>{t.setAttribute("state","in")}),t.addEventListener("os-toast-hold",p=>{if(p.detail?.held){h();return}n=Math.max(n,Oc),u()}),Bc(t),u(),qn.publish("os/toast-shown",{...s}),l}let Qt=null,we=0;function Gn(s){const e=s.target;e instanceof HTMLElement&&(e.closest("os-toast-container")||(Qt=e))}function Bc(s){we===0&&document.addEventListener("focusin",Gn,!0),we+=1;const e=s.ownerDocument,t=e.activeElement;t instanceof HTMLElement&&t!==e.body&&!t.closest("os-toast-container")&&(Qt=t)}function Gc(){we=Math.max(0,we-1),we===0&&document.removeEventListener("focusin",Gn,!0)}function Xc(s){const e=s.ownerDocument.activeElement;e!==s&&!s.contains(e)||Qt?.isConnected===!0&&Qt.focus()}function Zc(){const s=document.querySelector("os-toast-container");if(s)return s;const e=document.createElement("os-toast-container");return document.body.appendChild(e),e}let so=!1;function Yc(){so=!0}document.addEventListener("os-settings-save-lifecycle",s=>{if(!so)return;const e=s.detail?.phase;if(e!=="saved"&&e!=="failed"||(so=!1,e!=="saved"))return;const t=window.wp?.os?.refreshMenu;typeof t=="function"&&t()});const Jc=typeof navigator<"u"&&/Mac|iPhone|iPad|iPod/i.test(navigator.platform||navigator.userAgent||"")?"⌘K":"Ctrl+K";function Qc(s){const e=document.createElement("div"),t=C=>{const S=C.detail?.checked===!0;s.state.nativePostsEnabled=S,s.save(),T()},o=C=>{const S=C.detail?.value,I=Number(S);if([15,30,45,60].includes(I)){s.state.heartbeatRate=I,s.save();try{const H=window.wp,ie=I>=60?"slow":"standard";H?.heartbeat?.interval?.(ie)}catch{}T()}},i=C=>{const S=C.detail?.checked===!0;s.state.nativePagesEnabled=S,s.save(),T()},n=C=>{const S=C.detail?.checked===!0;s.state.nativeUsersEnabled=S,s.save(),T()},r=C=>{const S=C.detail?.checked===!0;s.state.nativePluginsEnabled=S,s.save(),T()},a=C=>{const S=C.detail?.checked===!0;s.state.nativeCommentsEnabled=S,s.save(),T()},l=C=>{const S=C.detail?.checked===!0;s.state.stationHomeEnabled=S,s.save(),T()},u=C=>{const S=C.detail?.checked===!0;s.state.showDesktopOnWallpaperClick=S,s.save(),T()},h=C=>{const S=C.detail?.checked===!0;s.state.windowLinksEnabled=S,s.save(),s.apply(),T()},p=C=>{const S=C.detail?.checked===!0;s.state.windowLinkRaiseOnFocus=S,s.save(),s.apply(),T()},m=C=>{const S=C.detail?.checked===!0;s.state.windowLinkHighlight=S,s.save(),s.apply(),T()},_=C=>{const S=C.detail?.checked===!0;s.state.showPostStatusRibbons=S,s.save(),T()},b=C=>{const S=C.detail?.checked===!0;s.state.developerModeEnabled=S,s.save(),T(),Yc()},w=C=>{const S=C.detail?.checked===!0;s.state.foldersSharingEnabled=S,s.save(),T()};let v=!1;const g=async()=>{if(v||!await Bi({title:d("Delete folder sharing data?"),message:d("This drops every shares table on the site (current + legacy). All invites, accept/deny decisions, and share rows are permanently removed. Recipients lose their access until someone shares with them again. The empty tables are recreated on the next admin load so the feature keeps working — but every existing share is gone."),confirmLabel:d("Delete data"),danger:!0}))return;const S=f?.filesUrl,I=f?.restNonce;if(!S||!I){to({message:d("Files REST endpoint is not available.")});return}v=!0,T();try{const H=S.replace(/\/+$/,"")+"/folder-sharing-tables/purge",ie=await O(H,{method:"POST",headers:{"X-WP-Nonce":I},credentials:"same-origin"},{source:"os-settings/folder-sharing-purge"});if(!ie.ok){const Sh=await ie.text();throw new Error(`${ie.status}: ${Sh.slice(0,200)}`)}const Ch=await ie.json();to({message:d("Folder sharing data deleted.")+" ("+Ch.dropped.length+" tables)"})}catch(H){const ie=H instanceof Error?H.message:String(H);to({message:d("Could not delete sharing data.")+" "+ie})}finally{v=!1,T()}},f=window.openStationConfig,y={enabled:f?.commentsAi?.enabled??!1,providerConfigured:f?.commentsAi?.providerConfigured??!1,saving:!1},A=async C=>{const S=C.detail?.checked===!0;if(!(!f?.commentsAiUrl||y.saving)){y.saving=!0,y.enabled=S,T();try{const I=await O(f.commentsAiUrl,{method:"POST",credentials:"same-origin",headers:{"Content-Type":"application/json","X-WP-Nonce":f.restNonce??""},body:JSON.stringify({enabled:S})},{source:"os-settings/comments-ai"});if(I.ok){const H=await I.json();y.enabled=H.enabled,y.providerConfigured=H.providerConfigured,f.commentsAi&&(f.commentsAi.enabled=H.enabled,f.commentsAi.providerConfigured=H.providerConfigured)}else y.enabled=!S}catch{y.enabled=!S}y.saving=!1,T()}},M=C=>{const S=C.detail?.checked===!0;s.state.ai={...s.state.ai,enabled:S},s.save(),T()},oe=async()=>{const C=f?.aiAssistant;if(!(!C||!f?.aiStatusUrl))try{const S=await O(f.aiStatusUrl,{credentials:"same-origin",headers:{"X-WP-Nonce":f.restNonce??""}},{source:"os-settings/ai-status",silent:!0});if(!S.ok)return;const I=await S.json(),H=C.available!==(I.available===!0)||C.assistantProviderConfigured!==(I.assistantProviderConfigured===!0);C.available=I.available===!0,C.providerConfigured=I.providerConfigured===!0,C.assistantProviderConfigured=I.assistantProviderConfigured===!0,y.providerConfigured=C.providerConfigured,T(),H&&document.dispatchEvent(new CustomEvent("os-ai-status-changed"))}catch{}};let N=!1;const E=C=>{C.detail?.windowId==="desktop-mode-os-settings"&&(N||(N=!0,oe().finally(()=>{N=!1})))};document.addEventListener("os-window-focused",E);const Z=new MutationObserver(()=>{e.isConnected||(document.removeEventListener("os-window-focused",E),Z.disconnect())});Z.observe(document.body,{childList:!0,subtree:!0});const zr=()=>{const C=f?.aiAssistant?.connectorsUrl??"";if(!C)return;const S=window.wp?.os;if(S?.windowManager?.open){const I=S.deriveWindowId?S.deriveWindowId(C):C;S.windowManager.open({id:I,url:C,title:d("Connectors"),icon:"dashicons-admin-settings"})}else window.open(C,"_blank","noopener")};let Dt=!1;const Ah=async()=>{if(Dt)return;const C=window.openStationConfig;if(C?.seenIntrosUrl){Dt=!0,T();try{await O(C.seenIntrosUrl,{method:"DELETE",credentials:"same-origin",headers:{"X-WP-Nonce":C.restNonce??""}},{source:"os-settings/reset-intros"}),document.dispatchEvent(new CustomEvent("os-intros-reset"))}catch{}Dt=!1,T()}},T=()=>L(c` |
| 872 |
<!-- |
| 873 |
No heading. The page title above already says |
| 874 |
"Features", and its description already covers the |
| 875 |
per-account, takes-effect-immediately point that used |
| 876 |
to open this section. |
| 877 |
--> |
| 878 |
<os-section |
| 879 |
heading="" |
| 880 |
description=${d("Watch the dot in the OpenStation Preferences title bar to see when a change has been saved.")} |
| 881 |
> |
| 882 |
${f?.aiAssistant?.available?c` |
| 883 |
<div class="os-features__item"> |
| 884 |
<os-checkbox-label |
| 885 |
label=${d("AI assistant")} |
| 886 |
?checked=${s.state.ai.enabled} |
| 887 |
?disabled=${!f.aiAssistant.assistantProviderConfigured} |
| 888 |
@os-checkbox-change=${M} |
| 889 |
></os-checkbox-label> |
| 890 |
<p class="os-features__hint"> |
| 891 |
${j(d("Adds an AI mode to the %s command palette: find content and ask about your site."),Jc)} |
| 892 |
</p> |
| 893 |
${f.aiAssistant.assistantProviderConfigured?"":c` |
| 894 |
<os-notice tone="warning" not-dismissible> |
| 895 |
${d("This feature requires an AI provider configured in")} |
| 896 |
<a |
| 897 |
href=${f.aiAssistant.connectorsUrl} |
| 898 |
@click=${C=>{C.preventDefault(),zr()}} |
| 899 |
>${d("Settings → Connectors")}</a |
| 900 |
>. |
| 901 |
</os-notice> |
| 902 |
`} |
| 903 |
</div> |
| 904 |
`:""} |
| 905 |
${f?.commentsAi?c` |
| 906 |
<div class="os-features__item"> |
| 907 |
<os-checkbox-label |
| 908 |
label=${d("Score new comments with AI")} |
| 909 |
?checked=${y.enabled} |
| 910 |
?disabled=${y.saving||!y.providerConfigured} |
| 911 |
@os-checkbox-change=${A} |
| 912 |
></os-checkbox-label> |
| 913 |
<p class="os-features__hint"> |
| 914 |
${d("Rates incoming comments so you can triage the queue faster.")} |
| 915 |
</p> |
| 916 |
${y.providerConfigured?"":c` |
| 917 |
<os-notice tone="warning" not-dismissible> |
| 918 |
${d("This feature requires an AI provider configured in")} |
| 919 |
<a |
| 920 |
href=${f?.aiAssistant?.connectorsUrl??""} |
| 921 |
@click=${C=>{C.preventDefault(),zr()}} |
| 922 |
>${d("Settings → Connectors")}</a |
| 923 |
>. |
| 924 |
</os-notice> |
| 925 |
`} |
| 926 |
</div> |
| 927 |
`:""} |
| 928 |
<div class="os-features__item"> |
| 929 |
<os-checkbox-label |
| 930 |
label=${d("Window links")} |
| 931 |
?checked=${s.state.windowLinksEnabled} |
| 932 |
@os-checkbox-change=${h} |
| 933 |
></os-checkbox-label> |
| 934 |
<p class="os-features__hint"> |
| 935 |
${d("Draws connector lines between related windows. Line style and visibility live in Windows → Window links.")} |
| 936 |
</p> |
| 937 |
<div class="os-features__item"> |
| 938 |
<os-checkbox-label |
| 939 |
label=${d("Bring related windows to front")} |
| 940 |
?checked=${s.state.windowLinkRaiseOnFocus} |
| 941 |
?disabled=${!s.state.windowLinksEnabled} |
| 942 |
@os-checkbox-change=${p} |
| 943 |
></os-checkbox-label> |
| 944 |
<p class="os-features__hint"> |
| 945 |
${d("Clicking a window also surfaces its parent and children.")} |
| 946 |
</p> |
| 947 |
</div> |
| 948 |
<div class="os-features__item"> |
| 949 |
<os-checkbox-label |
| 950 |
label=${d("Highlight related windows")} |
| 951 |
?checked=${s.state.windowLinkHighlight} |
| 952 |
?disabled=${!s.state.windowLinksEnabled} |
| 953 |
@os-checkbox-change=${m} |
| 954 |
></os-checkbox-label> |
| 955 |
<p class="os-features__hint"> |
| 956 |
${d("Related windows get an accent outline while one of them is focused.")} |
| 957 |
</p> |
| 958 |
</div> |
| 959 |
</div> |
| 960 |
<div class="os-features__item"> |
| 961 |
<os-checkbox-label |
| 962 |
label=${d("Show desktop when clicking the wallpaper")} |
| 963 |
?checked=${s.state.showDesktopOnWallpaperClick} |
| 964 |
@os-checkbox-change=${u} |
| 965 |
></os-checkbox-label> |
| 966 |
<p class="os-features__hint"> |
| 967 |
${d("A click on the empty desktop minimizes every window; a second click restores them.")} |
| 968 |
</p> |
| 969 |
</div> |
| 970 |
<div class="os-features__item"> |
| 971 |
<os-checkbox-label |
| 972 |
label=${d("Show post/page status ribbon")} |
| 973 |
?checked=${s.state.showPostStatusRibbons} |
| 974 |
@os-checkbox-change=${_} |
| 975 |
></os-checkbox-label> |
| 976 |
<p class="os-features__hint"> |
| 977 |
${d("Marks unpublished posts and pages with a corner ribbon on their tiles.")} |
| 978 |
</p> |
| 979 |
</div> |
| 980 |
<div class="os-features__item"> |
| 981 |
<os-checkbox-label |
| 982 |
label=${d("Enable developer mode")} |
| 983 |
?checked=${s.state.developerModeEnabled} |
| 984 |
@os-checkbox-change=${b} |
| 985 |
></os-checkbox-label> |
| 986 |
<p class="os-features__hint"> |
| 987 |
${d("Unlocks developer surfaces meant for plugin authors.")} |
| 988 |
</p> |
| 989 |
</div> |
| 990 |
<div class="os-features__item"> |
| 991 |
<os-checkbox-label |
| 992 |
label=${d("Folder sharing")} |
| 993 |
?checked=${s.state.foldersSharingEnabled} |
| 994 |
@os-checkbox-change=${w} |
| 995 |
></os-checkbox-label> |
| 996 |
<p class="os-features__hint"> |
| 997 |
${d("Share desktop folders with other users or roles, with read or write access.")} |
| 998 |
</p> |
| 999 |
${f?.currentUserIsAdmin?c` |
| 1000 |
<div class="os-features__danger-row"> |
| 1001 |
<p class="os-features__hint"> |
| 1002 |
${d("Removes every share and its access list. Cannot be undone.")} |
| 1003 |
</p> |
| 1004 |
<os-button |
| 1005 |
variant="danger" |
| 1006 |
?disabled=${v} |
| 1007 |
@click=${g} |
| 1008 |
> |
| 1009 |
${d(v?"Deleting…":"Delete folder sharing data")} |
| 1010 |
</os-button> |
| 1011 |
</div> |
| 1012 |
`:""} |
| 1013 |
</div> |
| 1014 |
<div class="os-features__item"> |
| 1015 |
<label class="os-features__select-label"> |
| 1016 |
<span class="os-features__select-title">${d("WordPress Heartbeat rate")}</span> |
| 1017 |
<os-select |
| 1018 |
value=${String(s.state.heartbeatRate)} |
| 1019 |
@os-pick=${o} |
| 1020 |
> |
| 1021 |
<os-option value="15">${d("Fast (15s, not recommended)")}</os-option> |
| 1022 |
<os-option value="30">${d("Medium (30s)")}</os-option> |
| 1023 |
<os-option value="45">${d("Slow (45s)")}</os-option> |
| 1024 |
<os-option value="60">${d("Very slow (60s, default)")}</os-option> |
| 1025 |
</os-select> |
| 1026 |
</label> |
| 1027 |
<p class="os-features__hint"> |
| 1028 |
${d("How often the Heartbeat API runs. Faster means quicker live updates and more server traffic. The 30s and 45s rates apply exactly from the next page load.")} |
| 1029 |
</p> |
| 1030 |
</div> |
| 1031 |
<div class="os-features__row"> |
| 1032 |
<p class="os-features__hint"> |
| 1033 |
${d("Brings back the one-time announcements you have dismissed, such as the welcome dialog.")} |
| 1034 |
</p> |
| 1035 |
<os-button |
| 1036 |
variant="secondary" |
| 1037 |
?disabled=${Dt} |
| 1038 |
@click=${Ah} |
| 1039 |
> |
| 1040 |
${d(Dt?"Resetting…":"Reset what’s-new dialogs")} |
| 1041 |
</os-button> |
| 1042 |
</div> |
| 1043 |
</os-section> |
| 1044 |
<os-section |
| 1045 |
heading=${d("Beta features")} |
| 1046 |
description=${d("Experimental redesigns of core admin screens, off by default. Each toggle affects only your account and takes effect immediately.")} |
| 1047 |
> |
| 1048 |
<div class="os-features__item"> |
| 1049 |
<os-checkbox-label |
| 1050 |
label=${d("Use Station Home as your Dashboard")} |
| 1051 |
?checked=${s.state.stationHomeEnabled} |
| 1052 |
@os-checkbox-change=${l} |
| 1053 |
></os-checkbox-label> |
| 1054 |
<p class="os-features__hint"> |
| 1055 |
${d("Opens Station Home instead of the classic WordPress Dashboard: recent work, site pulse, and quick actions in one native window. Leave off to keep the classic Dashboard, including any customizations plugins have made to it.")} |
| 1056 |
</p> |
| 1057 |
</div> |
| 1058 |
<div class="os-features__item"> |
| 1059 |
<os-checkbox-label |
| 1060 |
label=${d("Use the native Posts window")} |
| 1061 |
?checked=${s.state.nativePostsEnabled} |
| 1062 |
@os-checkbox-change=${t} |
| 1063 |
></os-checkbox-label> |
| 1064 |
<p class="os-features__hint"> |
| 1065 |
${d("Replaces the classic Posts list with a native table window: sticky header, paginated rows, bulk actions, and a row preview.")} |
| 1066 |
</p> |
| 1067 |
</div> |
| 1068 |
<div class="os-features__item"> |
| 1069 |
<os-checkbox-label |
| 1070 |
label=${d("Use the native Pages window")} |
| 1071 |
?checked=${s.state.nativePagesEnabled} |
| 1072 |
@os-checkbox-change=${i} |
| 1073 |
></os-checkbox-label> |
| 1074 |
<p class="os-features__hint"> |
| 1075 |
${d("The Posts table experience for Pages, with a Parent column, hierarchical sort, and edit-lock indicators.")} |
| 1076 |
</p> |
| 1077 |
</div> |
| 1078 |
<div class="os-features__item"> |
| 1079 |
<os-checkbox-label |
| 1080 |
label=${d("Use the native Users window")} |
| 1081 |
?checked=${s.state.nativeUsersEnabled} |
| 1082 |
@os-checkbox-change=${n} |
| 1083 |
></os-checkbox-label> |
| 1084 |
<p class="os-features__hint"> |
| 1085 |
${d("A native Users list with bulk role changes, online indicators, and one-click password resets.")} |
| 1086 |
</p> |
| 1087 |
</div> |
| 1088 |
<div class="os-features__item"> |
| 1089 |
<os-checkbox-label |
| 1090 |
label=${d("Use the native Plugins window")} |
| 1091 |
?checked=${s.state.nativePluginsEnabled} |
| 1092 |
@os-checkbox-change=${r} |
| 1093 |
></os-checkbox-label> |
| 1094 |
<p class="os-features__hint"> |
| 1095 |
${d("A native Plugins window with an Installed list, bulk actions, and a Browse gallery from the WordPress.org directory.")} |
| 1096 |
</p> |
| 1097 |
</div> |
| 1098 |
<div class="os-features__item"> |
| 1099 |
<os-checkbox-label |
| 1100 |
label=${d("Use the native Comments window")} |
| 1101 |
?checked=${s.state.nativeCommentsEnabled} |
| 1102 |
@os-checkbox-change=${a} |
| 1103 |
></os-checkbox-label> |
| 1104 |
<p class="os-features__hint"> |
| 1105 |
${d("A native two-pane Comments window: a list of conversations beside the full reply thread.")} |
| 1106 |
</p> |
| 1107 |
</div> |
| 1108 |
</os-section> |
| 1109 |
`,e);return T(),e}const ed=x` |
| 1110 |
:host { |
| 1111 |
display: flex; |
| 1112 |
flex-direction: column; |
| 1113 |
gap: 4px; |
| 1114 |
font-size: 13px; |
| 1115 |
color: var( --os-ui-fg, #1d2327 ); |
| 1116 |
min-width: 0; |
| 1117 |
} |
| 1118 |
|
| 1119 |
:host( [ hidden ] ) { |
| 1120 |
display: none; |
| 1121 |
} |
| 1122 |
|
| 1123 |
.os-multiselect__label { |
| 1124 |
font-size: 12px; |
| 1125 |
color: var( --os-ui-fg-muted, #646970 ); |
| 1126 |
} |
| 1127 |
|
| 1128 |
.os-multiselect__trigger { |
| 1129 |
appearance: none; |
| 1130 |
display: inline-flex; |
| 1131 |
align-items: center; |
| 1132 |
justify-content: space-between; |
| 1133 |
gap: 8px; |
| 1134 |
width: 100%; |
| 1135 |
min-width: 0; |
| 1136 |
padding: 7px 12px 7px 12px; |
| 1137 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.05 ) ); |
| 1138 |
border: 1px solid transparent; |
| 1139 |
border-radius: 7px; |
| 1140 |
font: inherit; |
| 1141 |
font-size: 13px; |
| 1142 |
color: var( --os-ui-fg, #1d2327 ); |
| 1143 |
cursor: pointer; |
| 1144 |
text-align: start; |
| 1145 |
transition: background-color 0.12s ease, border-color 0.12s ease, |
| 1146 |
box-shadow 0.12s ease; |
| 1147 |
} |
| 1148 |
|
| 1149 |
.os-multiselect__trigger:hover { |
| 1150 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.08 ) ); |
| 1151 |
} |
| 1152 |
|
| 1153 |
.os-multiselect__trigger:focus-visible { |
| 1154 |
outline: none; |
| 1155 |
border-color: var( --os-ui-accent, #2271b1 ); |
| 1156 |
box-shadow: var( |
| 1157 |
--os-ui-focus-ring-field, |
| 1158 |
0 0 0 1px #2271b1, 0 0 0 4px rgba( 34, 113, 177, 0.18 ) |
| 1159 |
); |
| 1160 |
} |
| 1161 |
|
| 1162 |
.os-multiselect__trigger:disabled { |
| 1163 |
opacity: 0.5; |
| 1164 |
cursor: not-allowed; |
| 1165 |
} |
| 1166 |
|
| 1167 |
.os-multiselect__trigger[ data-active='true' ] { |
| 1168 |
color: var( --wp-admin-theme-color, #2271b1 ); |
| 1169 |
font-weight: 600; |
| 1170 |
} |
| 1171 |
|
| 1172 |
.os-multiselect__summary { |
| 1173 |
flex: 1 1 auto; |
| 1174 |
min-width: 0; |
| 1175 |
overflow: hidden; |
| 1176 |
text-overflow: ellipsis; |
| 1177 |
white-space: nowrap; |
| 1178 |
} |
| 1179 |
|
| 1180 |
.os-multiselect__chevron { |
| 1181 |
color: var( --os-ui-fg-muted, #646970 ); |
| 1182 |
flex-shrink: 0; |
| 1183 |
transition: color 0.12s ease, transform 0.18s ease; |
| 1184 |
} |
| 1185 |
|
| 1186 |
.os-multiselect__trigger:hover .os-multiselect__chevron, |
| 1187 |
.os-multiselect__trigger:focus-visible .os-multiselect__chevron { |
| 1188 |
color: var( --os-ui-fg, #1d2327 ); |
| 1189 |
} |
| 1190 |
|
| 1191 |
:host( [ open ] ) .os-multiselect__chevron { |
| 1192 |
transform: rotate( 180deg ); |
| 1193 |
} |
| 1194 |
`;function td(){const s="os-multiselect-popover-styles";if(document.getElementById(s))return;const e=document.createElement("style");e.id=s,e.textContent=` |
| 1195 |
.os-multiselect__popover { |
| 1196 |
position: fixed; |
| 1197 |
z-index: 100000; |
| 1198 |
max-height: 320px; |
| 1199 |
overflow-y: auto; |
| 1200 |
min-width: 200px; |
| 1201 |
padding: 4px 0; |
| 1202 |
background: var( --os-window-bg, #fff ); |
| 1203 |
color: var( --os-ui-fg, #1d2327 ); |
| 1204 |
border: 1px solid var( --os-window-border, #c3c4c7 ); |
| 1205 |
border-radius: 8px; |
| 1206 |
box-shadow: 0 8px 28px rgba( 0, 0, 0, 0.18 ); |
| 1207 |
font: inherit; |
| 1208 |
font-size: 13px; |
| 1209 |
} |
| 1210 |
|
| 1211 |
.os-multiselect__clear { |
| 1212 |
display: block; |
| 1213 |
width: 100%; |
| 1214 |
padding: 6px 12px; |
| 1215 |
font: inherit; |
| 1216 |
font-size: 11px; |
| 1217 |
font-weight: 600; |
| 1218 |
letter-spacing: 0.04em; |
| 1219 |
text-transform: uppercase; |
| 1220 |
text-align: start; |
| 1221 |
border: 0; |
| 1222 |
border-bottom: 1px solid var( --os-window-border, #dcdcde ); |
| 1223 |
background: transparent; |
| 1224 |
color: var( --wp-admin-theme-color, #2271b1 ); |
| 1225 |
cursor: pointer; |
| 1226 |
} |
| 1227 |
|
| 1228 |
.os-multiselect__clear:hover { |
| 1229 |
background: color-mix( |
| 1230 |
in srgb, |
| 1231 |
var( --wp-admin-theme-color, #2271b1 ) 10%, |
| 1232 |
transparent |
| 1233 |
); |
| 1234 |
} |
| 1235 |
|
| 1236 |
.os-multiselect__option { |
| 1237 |
display: flex; |
| 1238 |
align-items: center; |
| 1239 |
gap: 8px; |
| 1240 |
padding: 6px 12px; |
| 1241 |
cursor: pointer; |
| 1242 |
user-select: none; |
| 1243 |
} |
| 1244 |
|
| 1245 |
.os-multiselect__option:hover { |
| 1246 |
background: var( --os-ui-hover, rgba( 0, 0, 0, 0.05 ) ); |
| 1247 |
} |
| 1248 |
|
| 1249 |
.os-multiselect__option[ data-disabled='true' ] { |
| 1250 |
opacity: 0.5; |
| 1251 |
cursor: not-allowed; |
| 1252 |
} |
| 1253 |
|
| 1254 |
.os-multiselect__option > span { |
| 1255 |
flex: 1 1 auto; |
| 1256 |
min-width: 0; |
| 1257 |
overflow: hidden; |
| 1258 |
text-overflow: ellipsis; |
| 1259 |
white-space: nowrap; |
| 1260 |
} |
| 1261 |
|
| 1262 |
.os-multiselect__option > input[ type='checkbox' ] { |
| 1263 |
margin: 0; |
| 1264 |
flex-shrink: 0; |
| 1265 |
accent-color: var( --wp-admin-theme-color, #2271b1 ); |
| 1266 |
} |
| 1267 |
|
| 1268 |
.os-multiselect__empty { |
| 1269 |
padding: 8px 12px; |
| 1270 |
color: var( --os-ui-fg-muted, #646970 ); |
| 1271 |
font-style: italic; |
| 1272 |
} |
| 1273 |
|
| 1274 |
.os-multiselect__loading { |
| 1275 |
display: flex; |
| 1276 |
align-items: center; |
| 1277 |
gap: 8px; |
| 1278 |
padding: 8px 12px; |
| 1279 |
color: var( --os-ui-fg-muted, #646970 ); |
| 1280 |
font-size: 12px; |
| 1281 |
} |
| 1282 |
|
| 1283 |
.os-multiselect__spinner { |
| 1284 |
display: inline-block; |
| 1285 |
width: 12px; |
| 1286 |
height: 12px; |
| 1287 |
border-radius: 50%; |
| 1288 |
border: 2px solid currentColor; |
| 1289 |
border-top-color: transparent; |
| 1290 |
animation: os-multiselect-spin 0.8s linear infinite; |
| 1291 |
} |
| 1292 |
|
| 1293 |
@keyframes os-multiselect-spin { |
| 1294 |
to { transform: rotate( 360deg ); } |
| 1295 |
} |
| 1296 |
`,document.head.appendChild(e)}typeof document<"u"&&td();const Ke=class Ke extends k{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 n of Array.from(t))n.remove();for(const n of e){const r=document.createElement("os-option");r.setAttribute("value",n.value),r.textContent=n.label,this.appendChild(r)}this._loadingMore=!1;const o=new Set(e.map(n=>n.value)),i=this._readValues().filter(n=>o.has(n));this._writeValueAttribute(i),this.requestUpdate(),this._refreshPopover()}get values(){return this._readValues()}set values(e){const t=Array.isArray(e)?e.map(o=>String(o)).filter(o=>o!==""):[];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(o=>o.getAttribute("value")));for(const o of e){if(t.has(o.value))continue;const i=document.createElement("os-option");i.setAttribute("value",o.value),i.textContent=o.label,this.appendChild(i)}this.requestUpdate(),this._refreshPopover()}connectedCallback(){super.connectedCallback(),ge(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",o=this.disabled!==null;e?this.setAttribute("aria-label",e):this.removeAttribute("aria-label");const i=e||t,n=this._summarize(t),r=this._readValues().length>0,l=`${this.id||"os-unnamed"}__trigger`;return c` |
| 1297 |
${e?c`<label |
| 1298 |
class="os-multiselect__label" |
| 1299 |
for=${l} |
| 1300 |
>${e}</label>`:c``} |
| 1301 |
<button |
| 1302 |
id=${l} |
| 1303 |
type="button" |
| 1304 |
class="os-multiselect__trigger" |
| 1305 |
aria-haspopup="listbox" |
| 1306 |
aria-expanded=${this._isOpen()?"true":"false"} |
| 1307 |
aria-label=${i} |
| 1308 |
?disabled=${o} |
| 1309 |
data-active=${r?"true":"false"} |
| 1310 |
@click=${u=>this._onTriggerClick(u)} |
| 1311 |
> |
| 1312 |
<span class="os-multiselect__summary">${n}</span> |
| 1313 |
${z("chevron-right",{size:16,rotate:90,className:"os-multiselect__chevron"})} |
| 1314 |
</button> |
| 1315 |
`}_readOptions(){const e=[],t=this.querySelectorAll(":scope > os-option");for(const o of Array.from(t)){const i=o.getAttribute("value");i!==null&&e.push({value:i,label:(o.textContent||i).trim(),disabled:o.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 o=this._readOptions(),i=new Map(o.map(n=>[n.value,n.label]));return t.length===1?i.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=r=>{const a=r.target;if(!a)return;const l=this.shadowRoot?.querySelector(".os-multiselect__trigger");e.contains(a)||l&&l.contains(a)||this._closePopover()},o=r=>{r.key==="Escape"&&(r.stopPropagation(),this._closePopover(),this.shadowRoot?.querySelector(".os-multiselect__trigger")?.focus())},i=()=>this._placePopover(),n=()=>{if(!this._hasMore||this._loadingMore)return;const r=e.scrollHeight,a=e.clientHeight,l=e.scrollTop;r-(l+a)<64&&this.emit("os-multiselect-load-more",{})};setTimeout(()=>{document.addEventListener("pointerdown",t,!0)},0),document.addEventListener("keydown",o,!0),window.addEventListener("resize",i),window.addEventListener("scroll",i,!0),e.addEventListener("scroll",n),this._teardownOpen=()=>{document.removeEventListener("pointerdown",t,!0),document.removeEventListener("keydown",o,!0),window.removeEventListener("resize",i),window.removeEventListener("scroll",i,!0),e.removeEventListener("scroll",n)},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(),o=new Set(this._readValues());if(e.replaceChildren(),t.length===0){const i=document.createElement("div");i.className="os-multiselect__empty",i.textContent="No options",e.appendChild(i);return}if(o.size>0){const i=document.createElement("button");i.type="button",i.className="os-multiselect__clear",i.textContent="Clear",i.addEventListener("click",n=>{n.preventDefault(),n.stopPropagation(),this._writeValueAttribute([]),this.requestUpdate(),this._refreshPopover(),this._emitPick()}),e.appendChild(i)}for(const i of t){const n=document.createElement("label");n.className="os-multiselect__option",n.setAttribute("role","option"),n.setAttribute("aria-selected",o.has(i.value)?"true":"false"),i.disabled&&(n.setAttribute("aria-disabled","true"),n.dataset.disabled="true");const r=document.createElement("input");r.type="checkbox",r.checked=o.has(i.value),r.disabled=i.disabled,r.addEventListener("change",()=>{const l=new Set(this._readValues());r.checked?l.add(i.value):l.delete(i.value);const u=t.map(h=>h.value).filter(h=>l.has(h));this._writeValueAttribute(u),n.setAttribute("aria-selected",r.checked?"true":"false"),this.requestUpdate(),this._refreshPopover(),this._emitPick()});const a=document.createElement("span");a.textContent=i.label,n.appendChild(r),n.appendChild(a),e.appendChild(n)}if(this._loadingMore){const i=document.createElement("div");i.className="os-multiselect__loading";const n=document.createElement("span");n.className="os-multiselect__spinner",n.setAttribute("aria-hidden","true");const r=document.createElement("span");r.textContent="Loading…",i.appendChild(n),i.appendChild(r),e.appendChild(i)}}_placePopover(){const e=this._popover,t=this.shadowRoot?.querySelector(".os-multiselect__trigger");if(!e||!t)return;const o=t.getBoundingClientRect(),i=window.innerWidth,n=window.innerHeight,r=Math.max(o.width,200);e.style.minWidth=`${r}px`;let a=o.left;a+r>i-8&&(a=Math.max(8,i-r-8)),e.style.left=`${a}px`,e.style.top=`${o.bottom+4}px`;const l=e.offsetHeight||200;o.bottom+4+l>n-8&&(e.style.top=`${Math.max(8,o.top-l-4)}px`)}_emitPick(){const e=this._readValues();this.emit("os-pick",{value:e.join(","),values:e})}};Ke.props=["value","label","placeholder","disabled","name","open"],Ke.styles=[ed],Ke.help=void 0;let oo=Ke;$("os-multiselect",oo);const Be=class Be extends k{connectedCallback(){super.connectedCallback(),ge(this)}render(){const e=this.label||"",t=this.value??"",o=this.placeholder||"",i=this.disabled!==null,n=this.readonly!==null,r=this.name||"",a=this.suffix||"",l=this.min,u=this.max,h=this.step||"any",p=this.invalid!==null,_=`${this.id||"os-unnamed"}__input`;return c` |
| 1316 |
${e?c`<label |
| 1317 |
class="os-text-field__label" |
| 1318 |
for=${_} |
| 1319 |
>${e}</label>`:c``} |
| 1320 |
<span class="os-text-field__row"> |
| 1321 |
<input |
| 1322 |
id=${_} |
| 1323 |
type="number" |
| 1324 |
.value=${t} |
| 1325 |
placeholder=${o} |
| 1326 |
?disabled=${i} |
| 1327 |
?readonly=${n} |
| 1328 |
inputmode="decimal" |
| 1329 |
autocomplete="off" |
| 1330 |
min=${l??""} |
| 1331 |
max=${u??""} |
| 1332 |
step=${h} |
| 1333 |
name=${r} |
| 1334 |
aria-invalid=${p?"true":"false"} |
| 1335 |
aria-label=${e||""} |
| 1336 |
@input=${b=>this._onInput(b)} |
| 1337 |
@change=${b=>this._onCommit(b)} |
| 1338 |
@keydown=${b=>this._onKeyDown(b)} |
| 1339 |
/> |
| 1340 |
${a?c`<span class="os-text-field__suffix">${a}</span>`:c``} |
| 1341 |
</span> |
| 1342 |
`}_readRange(){const e=this.min,t=this.max,o=e!==null?parseFloat(e):-1/0,i=t!==null?parseFloat(t):1/0;return{min:Number.isFinite(o)?o:-1/0,max:Number.isFinite(i)?i:1/0}}_clamp(e){const{min:t,max:o}=this._readRange();return e<t?t:e>o?o:e}_onInput(e){const t=e.target,o=parseFloat(t.value);Number.isFinite(o)&&(this.value=String(o),this.emit("os-input-change",{value:o}))}_onCommit(e){const t=e.target,o=parseFloat(t.value);if(!Number.isFinite(o))return;const i=this._clamp(o);i!==o&&(t.value=String(i),this.value=String(i)),this.emit("os-input-commit",{value:i})}_onKeyDown(e){if(e.key==="Enter"&&!e.shiftKey&&!e.altKey&&!e.metaKey){const t=e.target,o=parseFloat(t.value);if(!Number.isFinite(o))return;const i=this._clamp(o);i!==o&&(t.value=String(i),this.value=String(i)),this.emit("os-submit",{value:i})}}};Be.props=["label","value","placeholder","disabled","readonly","name","suffix","min","max","step","invalid"],Be.styles=[xi],Be.help=void 0;let io=Be;$("os-number-field",io);const sd=x` ${R} ${Ft}: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}`,Ge=class Ge extends k{render(){const e=this.checked!==null,t=this.disabled!==null,o=this.label||"",i=this.value;return c` |
| 1343 |
<label> |
| 1344 |
<input |
| 1345 |
type="checkbox" |
| 1346 |
?checked=${e} |
| 1347 |
?disabled=${t} |
| 1348 |
.value=${i??""} |
| 1349 |
@change=${n=>this._onChange(n)} |
| 1350 |
/> |
| 1351 |
<span class="os-checkbox__label">${o}</span> |
| 1352 |
</label> |
| 1353 |
`}_onChange(e){const o=e.target.checked;o?this.setAttribute("checked",""):this.removeAttribute("checked"),this.emit("os-checkbox-change",{checked:o,value:this.value})}};Ge.props=["checked","value","label","disabled"],Ge.styles=[sd],Ge.help=void 0;let no=Ge;$("os-checkbox",no);const od=x` ${R}: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}}`,id=4,Xe=class Xe extends k{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,o=this._attr("label")||"",i=this._attr("description")||"";return c` |
| 1354 |
<div class="os-switch__row"> |
| 1355 |
<span class="os-switch__text"> |
| 1356 |
<span class="os-switch__label">${o}</span> |
| 1357 |
<span class="os-switch__description" id="os-switch-desc" |
| 1358 |
>${i}</span |
| 1359 |
> |
| 1360 |
</span> |
| 1361 |
<button |
| 1362 |
type="button" |
| 1363 |
role="switch" |
| 1364 |
aria-checked=${e?"true":"false"} |
| 1365 |
aria-label=${o||"Toggle"} |
| 1366 |
aria-describedby=${i?"os-switch-desc":""} |
| 1367 |
?disabled=${t} |
| 1368 |
@click=${()=>this._onClick()} |
| 1369 |
@keydown=${n=>this._onKeyDown(n)} |
| 1370 |
@pointerdown=${n=>this._onPointerDown(n)} |
| 1371 |
@pointermove=${n=>this._onPointerMove(n)} |
| 1372 |
@pointerup=${n=>this._onPointerUp(n)} |
| 1373 |
@pointercancel=${()=>this._endGesture()} |
| 1374 |
> |
| 1375 |
<span class="os-switch__knob"></span> |
| 1376 |
</button> |
| 1377 |
</div> |
| 1378 |
`}_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)>=id&&(this._moved=!0,this.setAttribute("data-dragging","")),!this._moved)return;const o=this._attr("checked")!==null,i=o?-this._travel:0,n=o?0:this._travel;this.style.setProperty("--_drag",`${Math.min(n,Math.max(i,t))}px`)}_onPointerUp(e){if(this._pointerId!==e.pointerId)return;const t=this._moved,o=(e.clientX-this._startX)*this._dir;if(this._swallowClick=t,this._endGesture(),!t)return;const i=this._attr("checked")!==null,r=(i?this._travel:0)+o>this._travel/2;r!==i&&this._commit(r)}_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}};Xe.props=["checked","value","label","description","disabled","size","tone","block","labelPosition"],Xe.styles=[od],Xe.help=void 0;let ro=Xe;$("os-switch",ro);const nd=x`:host{position:fixed;top:calc( 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}`,rd=x` ${R}:host{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}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}}`,rs=class rs extends k{connectedCallback(){super.connectedCallback(),this.setAttribute("aria-live","polite")}render(){return c`<slot></slot>`}};rs.styles=[nd],rs.help=void 0;let ao=rs;$("os-toast-container",ao);const Ze=class Ze extends k{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 o=t.parentNode;t=o instanceof ShadowRoot?o.host:o}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");return c` |
| 1379 |
<span class="os-toast__label"><slot></slot></span> |
| 1380 |
<button |
| 1381 |
type="button" |
| 1382 |
?hidden=${!e} |
| 1383 |
@click=${o=>this._onAction(o)} |
| 1384 |
> |
| 1385 |
${e} |
| 1386 |
</button> |
| 1387 |
<button |
| 1388 |
type="button" |
| 1389 |
class="os-toast__close" |
| 1390 |
aria-label=${d("Dismiss")} |
| 1391 |
?hidden=${!t} |
| 1392 |
@click=${o=>this._onDismiss(o)} |
| 1393 |
> |
| 1394 |
${z("close",{size:16})} |
| 1395 |
</button> |
| 1396 |
`}_onAction(e){e.preventDefault(),e.stopPropagation(),this.emit("os-toast-action",{})}_onDismiss(e){e.preventDefault(),e.stopPropagation(),this.emit("os-toast-dismiss",{})}};Ze.props=["action","state","dismissible"],Ze.styles=[rd],Ze.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:"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:c` |
| 1397 |
<os-toast state="in" action="Undo">Post moved to trash.</os-toast> |
| 1398 |
`};let lo=Ze;$("os-toast",lo);const ad=x`: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{transform:scale( 0.9 )}@media ( prefers-reduced-motion:reduce ){button:active{transform:none}}button:hover{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}`,ld={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 cd(s){const e=(s??"").trim();return e===""||e.length>4096||!/^(https?:\/\/|data:image\/)/i.test(e)||/['"()\\<>\s]/.test(e)?"":e}const Ye=class Ye extends k{constructor(){super(...arguments),this._activateWired=!1}static get observedAttributes(){return[...super.observedAttributes,"aria-label"]}render(){const e=cd(this["icon-src"]||this.getAttribute("icon-src")||""),t=e?"":this.icon||"",o=ld[t]||"",i=this.getAttribute("aria-label")||"";return e?c` |
| 1399 |
<button type="button" aria-label="${i}"> |
| 1400 |
<span |
| 1401 |
class="themed-icon" |
| 1402 |
aria-hidden="true" |
| 1403 |
style="-webkit-mask: url('${e}') center / contain no-repeat; mask: url('${e}') center / contain no-repeat;" |
| 1404 |
></span> |
| 1405 |
<slot></slot> |
| 1406 |
</button> |
| 1407 |
`:c` |
| 1408 |
<button type="button" aria-label="${i}"> |
| 1409 |
<svg |
| 1410 |
width="14" |
| 1411 |
height="14" |
| 1412 |
viewBox="0 0 12 12" |
| 1413 |
aria-hidden="true" |
| 1414 |
focusable="false" |
| 1415 |
></svg> |
| 1416 |
<slot></slot> |
| 1417 |
</button> |
| 1418 |
<span data-svg-buffer style="display:none">${o}</span> |
| 1419 |
`}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._paintSvg()),queueMicrotask(()=>this._wireActivateEvent())}attributeChangedCallback(e,t,o){super.attributeChangedCallback(e,t,o),queueMicrotask(()=>this._paintSvg())}_paintSvg(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("svg"),o=e.querySelector("[data-svg-buffer]");if(t&&o){const i=o.textContent||"";t.innerHTML!==i&&(t.innerHTML=i)}}_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.dispatchEvent(new CustomEvent("os-button-activate",{bubbles:!0,composed:!0,cancelable:!0}))}))}};Ye.props=["icon","icon-src","active","danger"],Ye.styles=[ad],Ye.help=void 0;let co=Ye;$("os-window-button",co);const dd=x` ${R} ${us}: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}`,ud=x`: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 )}`,as=class as extends k{connectedCallback(){super.connectedCallback(),this.setAttribute("role","menu")}render(){return c`<slot></slot>`}};as.styles=[dd],as.help=void 0;let uo=as;$("os-menu",uo);const Je=class Je extends k{connectedCallback(){super.connectedCallback(),this.hasAttribute("role")||this.setAttribute("role","menuitem")}render(){const e=this.icon||"",t=this.getAttribute("role")==="menuitemcheckbox",o=this.checked!==null;return t&&this.setAttribute("aria-checked",o?"true":"false"),c` |
| 1420 |
<button type="button" @click=${i=>this._onPick(i)}> |
| 1421 |
<span |
| 1422 |
class="os-menu-item__check" |
| 1423 |
?hidden=${!t} |
| 1424 |
></span> |
| 1425 |
<span |
| 1426 |
class="os-menu-item__icon dashicons ${e}" |
| 1427 |
aria-hidden="true" |
| 1428 |
?hidden=${t||!e} |
| 1429 |
></span> |
| 1430 |
<span class="os-menu-item__label"> |
| 1431 |
<slot></slot> |
| 1432 |
</span> |
| 1433 |
</button> |
| 1434 |
`}_onPick(e){e.preventDefault(),this.emit("os-menu-item-click",{value:this.value})}};Je.props=["icon","value","checked"],Je.styles=[ud],Je.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:c` |
| 1435 |
<os-menu> |
| 1436 |
<os-menu-item value="plain">Plain item</os-menu-item> |
| 1437 |
<os-menu-item value="icon" icon="dashicons-external"> |
| 1438 |
With an icon |
| 1439 |
</os-menu-item> |
| 1440 |
<os-menu-item value="startup" role="menuitemcheckbox" checked> |
| 1441 |
Checked (menuitemcheckbox) |
| 1442 |
</os-menu-item> |
| 1443 |
</os-menu> |
| 1444 |
`};let ho=Je;$("os-menu-item",ho);const hd=x` ${R} ${us}: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}:host( [ open ]:dir( rtl ) ){transform-origin:top right}@media ( prefers-reduced-motion:reduce ){:host( [ open ] ){animation:none}}`,pd=x`: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}`,Qe=class Qe extends k{render(){return c` |
| 1445 |
<slot></slot> |
| 1446 |
`}connectedCallback(){super.connectedCallback(),this.setAttribute("role","menu")}};Qe.props=["open"],Qe.styles=[hd],Qe.help=void 0;let po=Qe;$("os-context-menu",po);const et=class et extends k{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"),o=this.hasAttribute("checked");return c` |
| 1447 |
${o?c`<span class="check" aria-hidden="true">✓</span>`:c``} |
| 1448 |
${e?c`<span class="icon dashicons ${e}" aria-hidden="true"></span>`:c``} |
| 1449 |
<span class="label"><slot></slot></span> |
| 1450 |
${t?c`<span class="chevron" aria-hidden="true">›</span>`:c``} |
| 1451 |
`}};et.props=["value","icon","disabled","danger","heading","has-children","checked"],et.styles=[pd],et.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:c` |
| 1452 |
<os-context-menu open style="position: relative; z-index: 0"> |
| 1453 |
<os-context-menu-option heading>Every variant</os-context-menu-option> |
| 1454 |
<os-context-menu-option value="plain">Plain</os-context-menu-option> |
| 1455 |
<os-context-menu-option value="icon" icon="dashicons-admin-page"> |
| 1456 |
With an icon |
| 1457 |
</os-context-menu-option> |
| 1458 |
<os-context-menu-option value="checked" checked> |
| 1459 |
Checked |
| 1460 |
</os-context-menu-option> |
| 1461 |
<os-context-menu-option value="children" has-children> |
| 1462 |
With a submenu |
| 1463 |
</os-context-menu-option> |
| 1464 |
<os-context-menu-option value="off" disabled>Disabled</os-context-menu-option> |
| 1465 |
<os-context-menu-option value="del" danger icon="dashicons-trash"> |
| 1466 |
Danger |
| 1467 |
</os-context-menu-option> |
| 1468 |
</os-context-menu> |
| 1469 |
`};let fo=et;$("os-context-menu-option",fo);const fd=x` ${R}: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 ) )}: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}`,Xn='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])',tt=class tt extends k{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 o=t[0],i=t[t.length-1],n=this.ownerDocument,r=n?n.activeElement:null,a=e.composedPath()[0]||r;e.shiftKey&&a===o?(e.preventDefault(),i.focus()):!e.shiftKey&&a===i&&(e.preventDefault(),o.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,o){if(super.attributeChangedCallback?.(e,t,o),e==="open"){if(o!==null){const i=this.ownerDocument;this._prevFocus=i?i.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(Xn)),o=Array.from(e.querySelectorAll(Xn));return[...t,...o].filter(i=>i.offsetParent!==null||i.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 c` |
| 1470 |
<div part="dialog" class="dialog" tabindex="-1"> |
| 1471 |
${e?c` |
| 1472 |
<div class="header"> |
| 1473 |
<h2 class="title">${e}</h2> |
| 1474 |
<div class="header-actions"> |
| 1475 |
<slot name="header-actions"></slot> |
| 1476 |
${t?c``:c`<button |
| 1477 |
type="button" |
| 1478 |
class="close" |
| 1479 |
aria-label="Close" |
| 1480 |
@click=${()=>this._cancel()} |
| 1481 |
>×</button>`} |
| 1482 |
</div> |
| 1483 |
</div> |
| 1484 |
`:c``} |
| 1485 |
<div class="body"> |
| 1486 |
<slot></slot> |
| 1487 |
</div> |
| 1488 |
<div class="footer"> |
| 1489 |
<slot name="footer"></slot> |
| 1490 |
</div> |
| 1491 |
</div> |
| 1492 |
`}};tt.props=["open","title","size","mandatory"],tt.styles=[fd],tt.help=void 0;let go=tt;$("os-modal",go);const gd=x`: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}`,st=class st extends k{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 o=new AbortController;this._abort=o;const i=this.getAttribute("exclude")||"",n=t+"?q="+encodeURIComponent(e)+"&exclude="+encodeURIComponent(i);try{const r={signal:o.signal,credentials:"same-origin"},a=await O(n,r,{source:"desktop-mode/files-user-search",silent:!0});if(!a.ok)throw new Error(`HTTP ${a.status}`);const l=await a.json();this._results=l&&Array.isArray(l.users)?l.users:[],this._phase="ready",this._error="",this._open=!0}catch(r){if(r.name==="AbortError")return;this._results=[],this._phase="error",this._error=r.message||"Search failed.",this._open=!0}this._positionDropdown(),this.requestUpdate()}_positionDropdown(){const e=this.shadowRoot?.querySelector(".input");if(!e)return;const t=e.getBoundingClientRect(),o=t.bottom+4,i=t.left,n=t.width,a=window.innerHeight-t.bottom,l=t.top,u=Math.max(120,Math.min(280,Math.max(a,l)-16));a<200&&l>a?this._dropdownStyle=["position:fixed",`left:${i}px`,`top:${t.top-4-u}px`,`width:${n}px`,`max-height:${u}px`].join(";"):this._dropdownStyle=["position:fixed",`left:${i}px`,`top:${o}px`,`width:${n}px`,`max-height:${u}px`].join(";")}_dropdownContent(){if(this._phase==="loading")return c`<div class="empty">Searching…</div>`;if(this._phase==="error")return c`<div class="empty error">${this._error}</div>`;if(this._results.length===0){const e=this._query?"No matches.":"No users available.";return c`<div class="empty">${e}</div>`}return this._results.map(e=>c` |
| 1493 |
<button |
| 1494 |
type="button" |
| 1495 |
class="item" |
| 1496 |
role="option" |
| 1497 |
@mousedown=${t=>t.preventDefault()} |
| 1498 |
@click=${()=>this._pick(e)} |
| 1499 |
> |
| 1500 |
<img class="avatar" src=${e.avatarUrl} alt="" /> |
| 1501 |
<div> |
| 1502 |
<div class="name">${e.name}</div> |
| 1503 |
<div class="slug">${e.slug}</div> |
| 1504 |
</div> |
| 1505 |
</button> |
| 1506 |
`)}render(){const e=this.getAttribute("placeholder")||"Search users…";return c` |
| 1507 |
<input |
| 1508 |
class="input" |
| 1509 |
type="search" |
| 1510 |
placeholder=${e} |
| 1511 |
autocomplete="off" |
| 1512 |
@input=${this._onInput} |
| 1513 |
@focus=${this._onFocus} |
| 1514 |
@blur=${this._onBlur} |
| 1515 |
.value=${this._query} |
| 1516 |
/> |
| 1517 |
${this._open?c` |
| 1518 |
<div class="dropdown" role="listbox" style=${this._dropdownStyle}> |
| 1519 |
${this._dropdownContent()} |
| 1520 |
</div> |
| 1521 |
`:c``} |
| 1522 |
`}};st.props=["placeholder","exclude","endpoint"],st.styles=[gd],st.help=void 0;let bo=st;$("os-user-search",bo);const bd=x`: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-fg-on-accent,#fff )}.empty{color:var( --os-ui-fg-muted,rgba( 255,255,255,0.5 ) );font-size:12px}`,ot=class ot extends k{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 c`<span class="empty">No eligible roles.</span>`;const t=this._selectedSet();return c` |
| 1523 |
${e.map(o=>{const i=t.has(o.slug);return c` |
| 1524 |
<button |
| 1525 |
type="button" |
| 1526 |
class="chip" |
| 1527 |
aria-pressed=${i?"true":"false"} |
| 1528 |
@click=${()=>this._onToggle(o.slug)} |
| 1529 |
>${o.name}</button> |
| 1530 |
`})} |
| 1531 |
`}};ot.props=["selected","roles"],ot.styles=[bd],ot.help=void 0;let mo=ot;$("os-role-picker",mo);const md=x`: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}}`,Zn=["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(","),vd="[data-flyout-close]",it=class it extends k{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,o){super.attributeChangedCallback(e,t,o),e==="open"&&(o!==null&&t===null?this._handleOpen():o===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 o=t.composedPath();o.includes(this)||this._trigger&&o.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 o=this._allFocusable();if(o.length===0){t.preventDefault();return}const i=o[0],n=o[o.length-1],r=this.ownerDocument?.activeElement??null;t.shiftKey&&(r===i||r===this)?(t.preventDefault(),n.focus({preventScroll:!0})):!t.shiftKey&&r===n&&(t.preventDefault(),i.focus({preventScroll:!0}))},this.addEventListener("keydown",this._onHostKeyDown),this._onHostClick=t=>{const i=t.target?.closest?.(vd);i&&this.contains(i)&&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(Zn)??null}_allFocusable(){return Array.from(this.querySelectorAll(Zn)).filter(e=>!e.disabled)}render(){return c`<slot></slot>`}};it.props=["open","placement","scope","aria-label","aria-labelledby"],it.styles=[md],it.help=void 0;let vo=it;$("os-flyout",vo);const _d=x` ${R}: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}}`,yd={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"/>'},nt=class nt extends k{render(){const e=this.variant||"",t=yd[e]||"";return c` |
| 1532 |
<button type="button"> |
| 1533 |
<svg |
| 1534 |
viewBox="0 0 12 12" |
| 1535 |
aria-hidden="true" |
| 1536 |
focusable="false" |
| 1537 |
></svg> |
| 1538 |
<slot></slot> |
| 1539 |
</button> |
| 1540 |
<span data-svg-buffer style="display:none">${t}</span> |
| 1541 |
`}connectedCallback(){super.connectedCallback(),queueMicrotask(()=>this._paintSvg())}attributeChangedCallback(e,t,o){super.attributeChangedCallback(e,t,o),queueMicrotask(()=>this._paintSvg())}_paintSvg(){const e=this.shadowRoot;if(!e)return;const t=e.querySelector("svg"),o=e.querySelector("[data-svg-buffer]");if(t&&o){const i=o.textContent||"";t.innerHTML!==i&&(t.innerHTML=i)}}};nt.props=["variant"],nt.styles=[_d],nt.help=void 0;let _o=nt;$("os-tab-chip",_o);const wd=x`: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}`,rt=class rt extends k{render(){const e=this.gap,t=this.align,o=this.padding,i=e&&/^\d+$/.test(e)?`${e}px`:"";return i&&this.style.setProperty("--os-ui-stack-gap",i),t&&this.style.setProperty("--os-ui-stack-align",t),o!==null&&/^\d+$/.test(o)&&this.style.setProperty("--os-ui-stack-padding",`${o}px`),c`<slot></slot>`}};rt.props=["gap","align","padding"],rt.styles=[wd],rt.help=void 0;let yo=rt;$("os-stack",yo);const xd=x`: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}`,at=class at extends k{render(){const e=this.gap,t=this.justify,o=this.align,i=e&&/^\d+$/.test(e)?`${e}px`:"";return i&&this.style.setProperty("--os-ui-cluster-gap",i),t&&this.style.setProperty("--os-ui-cluster-justify",t),o&&this.style.setProperty("--os-ui-cluster-align",o),c`<slot></slot>`}};at.props=["gap","justify","align"],at.styles=[xd],at.help=void 0;let wo=at;$("os-cluster",wo);const kd=x`: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}`,lt=class lt extends k{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`),c`<slot></slot>`}};lt.props=["gap","padding","scroll"],lt.styles=[kd],lt.help=void 0;let xo=lt;$("os-body",xo);const $d=x`: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}`,ct=class ct extends k{render(){const e=this.gap,t=this["column-gap"],o=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`),o&&/^\d+$/.test(o)&&this.style.setProperty("--os-ui-row-row-gap",`${o}px`),c`<slot></slot>`}};ct.props=["gap","column-gap","row-gap"],ct.styles=[$d],ct.help=void 0;let ko=ct;$("os-row",ko);const Ad=x`:host{display:grid;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}`,dt=class dt extends k{render(){const e=this.columns,t=this.rows,o=this.gap,i=this["column-gap"],n=this["row-gap"];return e&&/^\d+$/.test(e)&&this.style.setProperty("--os-ui-grid-columns",`repeat(${e}, minmax(0, 1fr))`),t&&/^\d+$/.test(t)&&this.style.setProperty("--os-ui-grid-rows",`repeat(${t}, minmax(0, 1fr))`),o&&/^\d+$/.test(o)&&this.style.setProperty("--os-ui-grid-gap",`${o}px`),i&&/^\d+$/.test(i)&&this.style.setProperty("--os-ui-grid-column-gap",`${i}px`),n&&/^\d+$/.test(n)&&this.style.setProperty("--os-ui-grid-row-gap",`${n}px`),c`<slot></slot>`}};dt.props=["columns","rows","gap","column-gap","row-gap"],dt.styles=[Ad],dt.help=void 0;let $o=dt;$("os-grid",$o);const Cd=x`: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}`,Yn={sm:"16px",md:"20px",lg:"28px",xl:"40px"},ut=class ut extends k{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",o=this.align||"end";return this.style.setProperty("--os-ui-display-size",Yn[t]||Yn.lg),this.style.setProperty("--os-ui-display-align",o),c` |
| 1542 |
<output part="output" class="os-display__output"> |
| 1543 |
${e??c`<slot></slot>`} |
| 1544 |
</output> |
| 1545 |
`}};ut.props=["value","size","align"],ut.styles=[Cd],ut.help=void 0;let Ao=ut;$("os-display",Ao);const Sd=x` ${R} ${qt} ${Ut} ${ds}: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}`,es="os-key--pressed",ht=class ht extends k{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 c` |
| 1546 |
<button |
| 1547 |
part="button" |
| 1548 |
class="os-holo-sheen" |
| 1549 |
type="button" |
| 1550 |
?disabled=${t} |
| 1551 |
@click=${o=>this.handleClick(o)} |
| 1552 |
> |
| 1553 |
${e!=null&&e!==""?e:c`<slot></slot>`} |
| 1554 |
<span class="os-holo-glint" aria-hidden="true"></span> |
| 1555 |
<span class="os-holo-ring" aria-hidden="true"></span> |
| 1556 |
</button> |
| 1557 |
`}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(es);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(es),this.hasAttribute("hold")&&this.emitKey("os-key-up",this.buildDetail("keyboard")))}matchesEvent(e,t=!1){const o=this.code||"",i=this.key||"";if(o){if(e.code!==o)return!1}else if(i){if(e.key!==i)return!1}else return!1;const n=this.modifier||"",r=new Set(n.split("+").map(p=>p.trim().toLowerCase()).filter(Boolean)),a=r.has("ctrl")||r.has("control"),l=r.has("alt"),u=r.has("shift"),h=r.has("meta")||r.has("cmd")||r.has("command");return e.ctrlKey===a&&e.altKey===l&&e.shiftKey===u&&e.metaKey===h}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(es),window.setTimeout(()=>{this.classList.remove(es)},120)}};ht.props=["key","code","label","variant","fill-cell","hold","modifier","disabled"],ht.styles=[Sd],ht.help=void 0;let Co=ht;$("os-key",Co);const Ed=x`: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;overflow-x:auto}:host( [ copy ] ){position:relative}:host( [ copy ] ):not( [ block ] ){display:inline-flex;align-items:center;gap:4px}.copy{appearance:none;background:transparent;border:0;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;line-height:1;font-size:0.95em}.copy:hover,.copy:focus-visible{opacity:1;color:var( --os-ui-code-copy-color-hover,var( --wp-admin-theme-color,#007cba ) )}:host( [ block ] ) .copy{position:absolute;top:6px;inset-inline-end:8px;padding:4px 6px;background:var( --os-ui-code-copy-bg,var( --os-ui-hover,rgba( 255,255,255,0.6 ) ) );border-radius:4px;opacity:0}:host( [ block ] ):hover .copy,:host( [ block ] ):focus-within .copy{opacity:1}`,pt=class pt extends k{constructor(){super(...arguments),this._copied=!1,this._resetTimer=null,this._onCopy=e=>{e.stopPropagation();const t=this._readSlotText();if(t==="")return;const o=n=>{n&&(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))},i=navigator.clipboard;i&&typeof i.writeText=="function"?i.writeText(t).then(()=>o(!0),()=>o(this._fallbackCopy(t))):o(this._fallbackCopy(t))}}_readSlotText(){const e=this.shadowRoot?.querySelector("slot");return e?e.assignedNodes({flatten:!0}).map(i=>i.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 o=document.execCommand("copy");return document.body.removeChild(t),o}catch{return!1}}render(){const e=this.getAttribute("copy")!==null;return c`<code><slot></slot></code>${e?c`<button |
| 1558 |
type="button" |
| 1559 |
class="copy" |
| 1560 |
part="copy" |
| 1561 |
aria-label="${this._copied?"Copied":"Copy code to clipboard"}" |
| 1562 |
@click=${this._onCopy} |
| 1563 |
> |
| 1564 |
${this._copied?"✓":"⧉"} |
| 1565 |
</button>`:""}`}};pt.props=["block","copy"],pt.styles=[Ed],pt.help=void 0;let So=pt;$("os-code",So);const Ld=x` ${R}: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}`,ft=class ft extends k{render(){return c`<span class="dot" aria-hidden="true"></span><slot></slot>`}};ft.props=["tone","noDot"],ft.styles=[Ld],ft.help=void 0;let Eo=ft;$("os-badge",Eo);const Rd=x`: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 ) )}`,gt=class gt extends k{render(){return c`<span class="banner" part="banner"><slot></slot></span>`}};gt.props=["placement","tone"],gt.styles=[Rd],gt.help=void 0;let Lo=gt;$("os-ribbon",Lo);const Td=x`:host{display:inline-block}`,P="os-file-tile",Jn={draft:"Draft",pending:"Pending",private:"Private",future:"Scheduled"};function Pd(){const s=window.wp?.os?.getOsSettings;if(typeof s!="function")return!0;try{return s()?.showPostStatusRibbons!==!1}catch{return!0}}function zd(){return window.wp?.os?.dragManager??null}const Id=["type","ref","label","icon","thumbnail","kind","status","selected","selectable","missing","access-gated","drag-kind","drag-title","drag-icon"],fe=class fe extends k{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,o){if(t!==o){if(e==="selected"||e==="selectable"||e==="aria-selected"){this._paintSelection();return}super.attributeChangedCallback(e,t,o)}}_paintSelection(){const e=this.hasAttribute("selected"),t=this.hasAttribute("selectable");if(this.classList.toggle(`${P}--selected`,e),this.setAttribute("role",t?"option":"listitem"),t){const o=e?"true":"false";this.getAttribute("aria-selected")!==o&&this.setAttribute("aria-selected",o)}else this.removeAttribute("aria-selected")}render(){return c``}_paint(){const e=this.getAttribute("type")??"",t=this.getAttribute("ref")??"",o=this.getAttribute("label")??"",i=this.getAttribute("icon")??"",n=this.getAttribute("thumbnail")??"",r=this.getAttribute("kind")??"entry",a=this.getAttribute("status")??"",l=this.hasAttribute("selected"),u=this.hasAttribute("selectable"),h=this.hasAttribute("missing"),p=this.hasAttribute("access-gated"),m=[P,`${P}--folder`,`${P}--missing`,`${P}--access-gated`,`${P}--selected`];for(const g of m)this.classList.remove(g);this.classList.add(P),r==="folder"&&this.classList.add(`${P}--folder`),h&&this.classList.add(`${P}--missing`),p&&this.classList.add(`${P}--access-gated`),l&&this.classList.add(`${P}--selected`),this.dataset.fileType=e,this.dataset.fileRef=t,r&&(this.dataset.role=r),this.setAttribute("role",u?"option":"listitem"),u?this.setAttribute("aria-selected",l?"true":"false"):this.removeAttribute("aria-selected"),this.setAttribute("aria-label",o),this.hasAttribute("tabindex")||this.setAttribute("tabindex","0");const _="You don’t have permission to open this — ask the folder owner for access.";p?(this.title=_,this.setAttribute("aria-disabled","true")):(this.removeAttribute("aria-disabled"),this.title===_&&this.removeAttribute("title"));const b=[`${P}__visual`,`${P}__label`,`${P}__lock`];for(const g of b)this.querySelectorAll(`:scope > .${g}`).forEach(f=>f.remove());this.querySelectorAll(":scope > os-ribbon").forEach(g=>g.remove());const w=document.createElement("span");if(w.className=`${P}__visual`,n){const g=document.createElement("img");g.src=n,g.alt="",g.loading="lazy",g.decoding="async",g.className=`${P}__preview`,g.draggable=!1,w.appendChild(g)}else if(i){const g=Nn(i,{title:o,className:`${P}__icon`});w.appendChild(g)}this.appendChild(w);const v=document.createElement("span");if(v.className=`${P}__label`,v.textContent=o,this.appendChild(v),p){const g=document.createElement("span");g.className=`${P}__lock dashicons dashicons-lock`,g.setAttribute("aria-hidden","true"),this.appendChild(g)}if(a&&a!=="publish"&&Jn[a]&&Pd()){const g=document.createElement("os-ribbon");g.setAttribute("placement","top-end"),g.setAttribute("tone",Md(a)),g.textContent=Jn[a],this.appendChild(g)}Sc(this),re("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=o=>{if(o.button!==0)return;const i=zd();if(!i)return;const n=this.getAttribute("ref")??"",r=this.getAttribute("drag-title")??this.getAttribute("label")??void 0,a=this.getAttribute("drag-icon")??this.getAttribute("icon")??void 0,l=this.getBoundingClientRect();i.start({payload:{type:"shortcut",source:this,data:{kind:e,ref:n,title:r,icon:a},ghost:{offsetX:o.clientX-l.left,offsetY:o.clientY-l.top}},origin:o})};this._pointerdownHandler=t,this.addEventListener("pointerdown",t)}};fe.shadow=!1,fe.props=Id,fe.styles=[Td],fe.help=void 0;let Ro=fe;function Md(s){switch(s){case"draft":return"warning";case"pending":return"info";case"private":return"danger";case"future":return"primary";default:return"primary"}}$("os-tile",Ro);const Dd=x`: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 Qn(s){const e=document.createElement("span");let t;if(typeof s=="string")t=s;else try{t=JSON.stringify(s)}catch{t=String(s)}return e.textContent=t,e}const bt=class bt extends k{constructor(){super(...arguments),this._entries=[],this._renderRow=Qn,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:Qn,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 o=0;for(let i=0;i<this._entries.length;i++){t[i]=o;const n=this._heights[i];o+=Number.isFinite(n)&&n>0?n:e}this._offsets=t,this._totalHeight=o,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 o=0,i=t.length-1;for(;o<i;){const n=Math.floor((o+i+1)/2);t[n]<=e?o=n:i=n-1}return o}_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 o=this._isAutoHeight(),i=this._readRowHeight(),n=this._readOverscan(),r=this.clientHeight,a=this.scrollTop;let l,u;if(o){this._ensureOffsets();const b=this._findIndexAtOffset(a),w=this._findIndexAtOffset(a+r);l=Math.max(0,b-n),u=Math.min(this._entries.length,w+1+n)}else l=Math.max(0,Math.floor(a/i)-n),u=Math.min(this._entries.length,Math.ceil((a+r)/i)+n);const h=document.createDocumentFragment(),p=[];for(let b=l;b<u;b++){const w=this._renderRow(this._entries[b],b);let v;w instanceof HTMLElement?v=w:(v=document.createElement("span"),v.textContent=String(w)),v.classList.add("row"),v.style.position="absolute",v.style.left="0",v.style.right="0",o?(v.style.top=`${this._offsets[b]}px`,v.style.height="auto"):(v.style.top=`${b*i}px`,v.style.height=`${i}px`),h.appendChild(v),p.push({idx:b,el:v})}if(e.replaceChildren(h),!o)return;let m=!1;const _=this._readRowHeight();for(const{idx:b,el:w}of p){const v=w.offsetHeight||_,g=this._heights[b];(!Number.isFinite(g)||Math.abs(g-v)>.5)&&(this._heights[b]=v,m=!0)}if(m){this._invalidateOffsets(),this._ensureOffsets();for(const{idx:b,el:w}of p)w.style.top=`${this._offsets[b]}px`;this._paintSpacer(),this._stickToBottom&&(this.scrollTop=this.scrollHeight)}}render(){const e=this.getAttribute("empty")||"No entries";return c` |
| 1566 |
<div class="spacer"> |
| 1567 |
<div class="window" part="window"></div> |
| 1568 |
</div> |
| 1569 |
<div class="empty" part="empty">${e}</div> |
| 1570 |
`}};bt.props=["rowHeight","maxRows","overscan","empty","autoRowHeight"],bt.styles=[Dd],bt.help=void 0;let To=bt;$("os-log",To);const Nd=x`: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}`,Hd=x`:host{display:grid;grid-template-columns:var( --os-ui-step-chip-size,28px ) 1fr;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 );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 ) );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 ) )}.os-step__body{min-width:0}.os-step__title{margin:0 0 4px;font-size:14px;font-weight:600;color:var( --os-ui-fg,#1d2327 );line-height:1.3}.os-step__title:empty{display:none}.os-step__body::slotted( * ){margin-block:0}`,mt=class mt extends k{render(){return c`<ol class="os-steps__list"><slot></slot></ol>`}};mt.props=[],mt.styles=[Nd],mt.help=void 0;let Po=mt;$("os-steps",Po);const vt=class vt extends k{render(){const e=this.title||"";return c` |
| 1571 |
<div class="os-step__body"> |
| 1572 |
<div class="os-step__title">${e}</div> |
| 1573 |
<slot></slot> |
| 1574 |
</div> |
| 1575 |
`}};vt.props=["title","done"],vt.styles=[Hd],vt.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."}],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"}],example:c` |
| 1576 |
<os-steps> |
| 1577 |
<os-step title="Configure">Open OpenStation Preferences → AI.</os-step> |
| 1578 |
<os-step title="Connect" done>Key confirmed.</os-step> |
| 1579 |
</os-steps> |
| 1580 |
`};let zo=vt;$("os-step",zo);const qd=x` ${R} ${Ft}: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 )}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}}`,xe="__wpd_expander__",ke="__wpd_select__",_t=class _t extends k{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._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(o=>o.key));for(const o of Object.keys(this._filters))t.has(o)||delete this._filters[o];for(const o of Array.from(this._filterCache.keys()))t.has(o)||this._filterCache.delete(o);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,o)=>{this._selection.has(this._getRowId(t,o))&&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,o)=>o,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(),o=t==="single"?Array.from(this._selection):[];t==="single"&&this._selection.clear(),this._selection.add(e),this._emitSelectionChange(),this._syncSelectionDom([e,...o])}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 o=t.querySelector("tbody");if(!o)return;let i=null;if(e!=="all"){i=new Set;for(const a of e)i.add(String(a))}const n=o.querySelectorAll("tr[data-row-id]");for(const a of n){const l=a.dataset.rowId;if(l===void 0||i&&!i.has(l))continue;const u=Number(a.dataset.rowIndex);if(!Number.isFinite(u))continue;const h=this._data[u];if(h===void 0)continue;const p=this._getRowId(h,u),m=this._selection.has(p);a.classList.toggle("is-selected",m);const _=a.querySelector("input.select-row-checkbox");_&&_.checked!==m&&(_.checked=m)}const r=t.querySelector("thead .select-all-checkbox");if(r){const{total:a,selected:l}=this._visibleSelectionStats();r.checked=a>0&&l===a,r.indeterminate=l>0&&l<a}}scrollToRow(e){const t=this.shadowRoot;if(!t)return;const i=t.querySelectorAll("tbody tr:not(.subtable):not(.empty):not(.skeleton)")[e];i&&i.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 c` |
| 1581 |
<div class="scroll" part="scroll"> |
| 1582 |
<table part="table"> |
| 1583 |
<colgroup></colgroup> |
| 1584 |
<thead></thead> |
| 1585 |
<tbody></tbody> |
| 1586 |
</table> |
| 1587 |
</div> |
| 1588 |
`}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")||L(this.render(),e);const t=e.querySelector("colgroup"),o=e.querySelector("thead"),i=e.querySelector("tbody");if(!t||!o||!i)return;const n=this._effectiveColumns(),r=this._readStickyColumns();this._lastStickyIndex=this._computeLastStickyIndex(n,r),this._paintColgroup(t,n),this._paintHead(o,n,r),this._paintBody(i,n,r),this._applyStickyOffsets(),this._measureHeaderHeight(),this._scheduleStickyOffsets(),this._maybeWarnStickyHeader(),this._maybeWarnLoadingDesync(i),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 o=[];for(const i of t){const n=document.createElement("col");i.width&&(n.style.width=i.width),o.push(n)}e.replaceChildren(...o)}_paintHead(e,t,o){const i=document.createElement("tr");i.setAttribute("part","header-row");for(let l=0;l<t.length;l++)i.appendChild(this._buildHeaderCell(t[l],l,o));const n=e.querySelector(':scope > tr[part="header-row"]');n?e.replaceChild(i,n):e.insertBefore(i,e.firstChild);const r=t.some(l=>l.filter||Array.isArray(l.filterOptions)||typeof l.filterRender=="function");let a=e.querySelector(":scope > tr.filter-row");if(r){const l=[];for(let p=0;p<t.length;p++)l.push(this._buildFilterCell(t[p],p,o));a||(a=document.createElement("tr"),a.classList.add("filter-row"),a.setAttribute("part","filter-row"),e.appendChild(a));const u=Array.from(a.children);let h=u.length===l.length;if(h){for(let p=0;p<l.length;p++)if(u[p]!==l[p]){h=!1;break}}if(!h){const p=new Set(l);for(const m of l)a.appendChild(m);for(const m of Array.from(a.children))p.has(m)||a.removeChild(m)}}else a&&a.remove()}_buildHeaderCell(e,t,o){const i=document.createElement("th");if(i.setAttribute("scope","col"),i.dataset.key=e.key,this._applyCellClasses(i,e,t,o),e.minWidth&&(i.style.minWidth=e.minWidth),e.key===ke){if(this._readSelectable()==="multi"){const r=document.createElement("input");r.type="checkbox",r.className="select-all-checkbox",r.setAttribute("data-noclick",""),r.setAttribute("aria-label","Select all rows");const{total:a,selected:l}=this._visibleSelectionStats();r.checked=a>0&&l===a,r.indeterminate=l>0&&l<a,r.addEventListener("change",()=>{r.checked?this.selectAll():this.clearSelection()}),i.appendChild(r)}return i}if(i.textContent=e.label??(e.key===xe?"":e.key),e.sortable){i.classList.add("is-sortable");const n=this._sort?.key===e.key,r=document.createElement("span");r.className="sort-indicator";let a="";n&&(a=this._sort.direction==="asc"?" ▲":" ▼"),r.textContent=a,i.appendChild(r),n&&i.classList.add(this._sort.direction==="asc"?"sort-asc":"sort-desc"),i.addEventListener("click",()=>this._cycleSort(e.key))}return i}_buildFilterCell(e,t,o){const i=this._filterCache.get(e.key),n=Array.isArray(e.filterOptions),r=typeof e.filterRender=="function";let a;if(!e.filter&&!n&&!r||e.key===xe||e.key===ke?a="none":r?a="custom":e.filter==="select"||n?a="select":a="text",i&&i.kind===a){if(i.th.className="",this._applyCellClasses(i.th,e,t,o),a==="select"){const p=i.control,m=this._resolveFilterOptions(e),_=m.map(b=>b.value).join("|");_!==i.optionsKey?(this._populateSelect(p,m,this._filters[e.key]??""),i.optionsKey=_):p.value=this._filters[e.key]??""}else if(a==="text"){const p=i.control,m=this._filters[e.key]??"";p.value!==m&&p.ownerDocument.activeElement!==p&&(p.value=m)}else a==="custom"&&e.filterRender&&e.filterRender(i.th,{value:this._filters[e.key]??"",setValue:p=>this._onFilterChange(e.key,p),col:e});return i.th}const l=document.createElement("th");if(this._applyCellClasses(l,e,t,o),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:p=>this._onFilterChange(e.key,p),col:e}),this._filterCache.set(e.key,{th:l,control:null,optionsKey:"",kind:"custom"}),l;let u,h="";if(a==="select"){const p=document.createElement("select");p.classList.add("filter-select"),p.setAttribute("data-noclick",""),p.setAttribute("aria-label",`Filter ${e.label??e.key}`);const m=this._resolveFilterOptions(e);this._populateSelect(p,m,this._filters[e.key]??""),h=m.map(_=>_.value).join("|"),p.addEventListener("change",()=>{this._onFilterChange(e.key,p.value)}),u=p}else{const p=document.createElement("input");p.type="search",p.classList.add("filter-input"),p.setAttribute("data-noclick",""),p.setAttribute("placeholder","Filter…"),p.setAttribute("aria-label",`Filter ${e.label??e.key}`),p.value=this._filters[e.key]??"",p.addEventListener("input",()=>{this._onFilterChange(e.key,p.value)}),u=p}return l.appendChild(u),this._filterCache.set(e.key,{th:l,control:u,optionsKey:h,kind:a}),l}_populateSelect(e,t,o){e.replaceChildren();const i=document.createElement("option");i.value="",i.textContent="All",e.appendChild(i);for(const n of t){const r=document.createElement("option");r.value=n.value,r.textContent=n.label,n.value===o&&(r.selected=!0),e.appendChild(r)}e.value=o}_resolveFilterOptions(e){return Array.isArray(e.filterOptions)?e.filterOptions:this._uniqueValues(e.key).map(t=>({value:t,label:t}))}_paintBody(e,t,o){if(e.replaceChildren(),this.hasAttribute("loading")){const n=this._readLoadingRows();for(let r=0;r<n;r++)e.appendChild(this._buildSkeletonRow(t,r));return}const i=this._sortedRows(this._filteredRows());if(i.length===0){e.appendChild(this._buildEmptyRow(t.length));return}for(const{row:n,index:r}of i)if(e.appendChild(this._buildBodyRow(n,r,t,o)),this._expanded.has(r)&&this._subTable){const a=this._subTable(n,r);a&&e.appendChild(this._buildSubTableRow(a,t.length))}}_buildEmptyRow(e){const t=document.createElement("tr");t.classList.add("empty");const o=document.createElement("td");o.colSpan=e;const i=document.createElement("slot");return i.name="empty",i.textContent=this.getAttribute("empty")||"No data",o.appendChild(i),t.appendChild(o),t}_buildSkeletonRow(e,t){const o=document.createElement("tr");o.classList.add("skeleton"),o.setAttribute("aria-hidden","true");for(const i of e){const n=document.createElement("td"),r=document.createElement("span");r.className="skeleton-bar";const a=50+(t*7+o.children.length*13)%40;r.style.width=`${a}%`,n.appendChild(r),o.appendChild(n)}return o}_buildBodyRow(e,t,o,i){const n=document.createElement("tr");n.setAttribute("part","row"),n.dataset.rowIndex=String(t);const r=this._getRowId(e,t);n.dataset.rowId=String(r),this._selection.has(r)&&n.classList.add("is-selected"),n.addEventListener("click",a=>{this._onRowClick(e,t,a)});for(let a=0;a<o.length;a++)n.appendChild(this._buildBodyCell(o[a],a,e,t,i));return n}_buildBodyCell(e,t,o,i,n){const r=document.createElement("td");if(this._applyCellClasses(r,e,t,n),e.minWidth&&(r.style.minWidth=e.minWidth),e.key===ke){const l=this._getRowId(o,i),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(l),u.addEventListener("change",()=>{u.checked?this.select(l):this.deselect(l)}),r.appendChild(u),r}if(e.key===xe){if(!(this._subTable?!!this._subTable(o,i):!1))return r;const u=this._expanded.has(i),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(i,o,p)}),r.appendChild(h),r}const a=o[e.key];if(e.render){const l=e.render(a,o,i);this._mountCellContent(r,l)}else a!=null&&(r.textContent=String(a));return r}_buildSubTableRow(e,t){const o=document.createElement("tr");o.classList.add("subtable"),o.setAttribute("part","subtable-row");const i=document.createElement("td");i.colSpan=t;const n=document.createElement("div");if(n.classList.add("subtable-inner"),e instanceof Node)n.appendChild(e);else if(er(e))L(e,n);else{const r=document.createElement("os-table");r.columns=e.columns,r.data=e.data,e.subTable&&(r.subTable=e.subTable),n.appendChild(r)}return i.appendChild(n),o.appendChild(i),o}_mountCellContent(e,t){if(typeof t=="string"){e.textContent=t;return}if(t instanceof Node){e.appendChild(t);return}er(t)&&L(t,e)}_onFilterChange(e,t){t===""?delete this._filters[e]:this._filters[e]=t,this.emit("os-table-filter-change",{filters:{...this._filters}});const i=this.shadowRoot?.querySelector("tbody");if(i){const n=this._effectiveColumns(),r=this._readStickyColumns();this._lastStickyIndex=this._computeLastStickyIndex(n,r),this._paintBody(i,n,r),this._applyStickyOffsets()}}_onRowClick(e,t,o){const i=o.composedPath?.()??[];for(const n of i){if(n instanceof Element&&n.hasAttribute("data-noclick"))return;if(n===this)break}this.emit("os-table-row-click",{row:e,index:t,originalEvent:o})}_toggleRow(e,t,o){o.stopPropagation();const i=this._expanded.has(e);i?this._expanded.delete(e):this._expanded.add(e),this.emit("os-table-expand-change",{row:t,index:e,expanded:!i}),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(o=>this._filters[o]!=="");for(let o=0;o<this._data.length;o++){const i=this._data[o];let n=!0;for(const r of t){const a=this._columns.find(p=>p.key===r);if(a&&typeof a.filterRender=="function")continue;const l=this._filters[r]??"",u=i[r],h=u==null?"":String(u);if(a?.filter==="select"){if(h!==l){n=!1;break}}else if(!h.toLowerCase().includes(l.toLowerCase())){n=!1;break}}n&&e.push({row:i,index:o})}return e}_sortedRows(e){if(!this._sort)return e;const t=this._columns.find(n=>n.key===this._sort.key);if(!t)return e;const o=this._sort.direction==="desc"?-1:1,i=e.slice();return i.sort((n,r)=>{const a=t.sortValue?t.sortValue(n.row,n.row[t.key]):n.row[t.key],l=t.sortValue?t.sortValue(r.row,r.row[t.key]):r.row[t.key];return Ud(a,l)*o}),i}_uniqueValues(e){const t=new Set;for(const o of this._data){const i=o[e];i!=null&&t.add(String(i))}return Array.from(t).sort()}_visibleSelectionStats(){let e=0,t=0;for(const{row:o,index:i}of this._filteredRows())e++,this._selection.has(this._getRowId(o,i))&&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,o){return o.sticky===!1?!1:o.sticky===!0?!0:e<t}_computeLastStickyIndex(e,t){let o=-1;for(let i=0;i<e.length;i++)this._isStickyIndex(i,t,e[i])&&(o=i);return o}_applyCellClasses(e,t,o,i){t.key===xe&&e.classList.add("col-expander"),t.key===ke&&e.classList.add("col-select"),t.align==="center"&&e.classList.add("align-center"),t.align==="end"&&e.classList.add("align-end"),this._isStickyIndex(o,i,t)&&(e.classList.add("is-sticky"),o===this._lastStickyIndex&&e.classList.add("is-sticky-edge"))}_effectiveColumns(){const e=[];return this._readSelectable()&&e.push({key:ke,label:"",width:"40px",align:"center"}),this._subTable&&e.push({key:xe,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 o=Array.from(t.children),i=[];let n=0;for(let a=0;a<o.length;a++)i[a]=n,o[a].classList.contains("is-sticky")&&(n+=o[a].offsetWidth);e.querySelectorAll("thead tr, tbody tr:not(.subtable):not(.empty):not(.skeleton)").forEach(a=>{const l=Array.from(a.children);for(let u=0;u<l.length;u++)l[u].classList.contains("is-sticky")&&(l[u].style.insetInlineStart=`${i[u]}px`)}),this._maybeWarnStickyOffsetRace(o,i)}_maybeWarnStickyOffsetRace(e,t){if(this._stickyRaceWarned)return;const o=this._readStickyColumns();if(o<2)return;const i=Math.min(o-1,e.length-1);if(i<=0||t[i]!==0||this.offsetWidth===0)return;this._stickyRaceWarned=!0;const n=e[0]?.offsetWidth??0;console.warn(`[os-table] sticky-columns: column ${i} resolved to inset-inline-start: 0px while the host is visible. ths[0].offsetWidth was ${n}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 o=t.offsetHeight;o>0&&this.style.setProperty("--os-ui-table-header-height",`${o}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."))}};_t.props=["stickyColumns","stickyHeader","striped","hover","compact","bordered","empty","loading","loadingRows","selectable"],_t.styles=[qd],_t.help=void 0;let Io=_t;function er(s){return!!s&&s.__wpdHtml===!0}function Ud(s,e){if(s===e)return 0;if(s==null)return-1;if(e==null)return 1;if(typeof s=="number"&&typeof e=="number")return s-e;if(s instanceof Date&&e instanceof Date)return s.getTime()-e.getTime();const t=Number(s),o=Number(e);return Number.isFinite(t)&&Number.isFinite(o)?t-o:String(s).localeCompare(String(e))}$("os-table",Io);const Fd=x`: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}}`,tr=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}}),q=61.26,U=61.26,sr=58.453,Wd='<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"/>',yt=class yt extends k{constructor(){super(...arguments),this._paintScheduled=!1}connectedCallback(){super.connectedCallback(),this._schedulePaint()}render(){return c`<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,o,i)=>{const n=this.getAttribute(t);n===null?this.style.removeProperty(o):this.style.setProperty(o,i?i(n):n)};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=tr[e]??tr.classic,o=(r,a)=>{const l=this.getAttribute(r);if(l===null)return a;const u=parseFloat(l);return Number.isFinite(u)?u:a},i=(r,a)=>{const l=this.getAttribute(r);if(l===null)return a;const u=l.toLowerCase();return u==="-1"||u==="ccw"||u==="reverse"?-1:1},n=()=>{const r=this.getAttribute("pulse");return r==="scale"||r==="opacity"||r==="both"||r==="none"?r:t.pulse};return{sp1:o("sp1",t.sp1),sp2:o("sp2",t.sp2),sp3:o("sp3",t.sp3),a1:o("a1",t.a1),a2:o("a2",t.a2),a3:o("a3",t.a3),gap:o("gap",t.gap),dir2:i("dir2",t.dir2),dir3:i("dir3",t.dir3),pulse:n(),dots:Math.max(0,Math.floor(o("dots",t.dots)))}}_buildInlineSvg(e){const t=or(this.getAttribute("label")??"Loading"),o=9,i=(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="${o}" fill="none" stroke="currentColor" stroke-width="2.4" stroke-opacity="0.22"/><circle cx="12" cy="12" r="${o}" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-dasharray="${ts(o,e.a1)}" style="transform-origin:12px 12px;animation: os-spinner-spin ${i}s linear infinite"/></svg>`}_buildSvg(){const e=this._effectiveConfig();if(this.getAttribute("preset")==="inline")return this._buildInlineSvg(e);const t=or(this.getAttribute("label")??"Loading"),o=e.gap*3+14,i=-o,n=122.52+o*2,r=sr+e.gap+2,a=r+e.gap+2,l=a+e.gap+1.5,u=`animation: os-spinner-spin ${(e.sp1/10).toFixed(2)}s linear infinite`,h=`animation: os-spinner-spin ${(e.sp2/10).toFixed(2)}s linear infinite${e.dir2<0?" reverse":""}`,p=`animation: os-spinner-spin ${(e.sp3/10).toFixed(2)}s linear infinite${e.dir3<0?" reverse":""}`,m=(e.sp1*1.8/10).toFixed(1),_=(e.sp1*2.3/10).toFixed(1);let b="";e.pulse==="scale"?b=`animation: os-spinner-scale ${m}s ease-in-out infinite`:e.pulse==="opacity"?b=`animation: os-spinner-opacity ${_}s ease-in-out infinite`:e.pulse==="both"&&(b=`animation: os-spinner-scale ${m}s ease-in-out infinite, os-spinner-opacity ${_}s ease-in-out infinite`);let w="";if(e.dots>0){const v=l+e.gap+1,g=2*Math.PI*v,f=1.6,y=(e.sp1*.65/10).toFixed(2);for(let A=0;A<e.dots;A++){const M=-(A/e.dots)*g;w+=`<circle cx="${q}" cy="${U}" r="${v.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="${f}" stroke-dasharray="${f.toFixed(2)} ${(g-f).toFixed(2)}" stroke-dashoffset="${M.toFixed(2)}" stroke-linecap="round" stroke-opacity="0.65" style="transform-origin:${q}px ${U}px;animation: os-spinner-spin ${y}s linear infinite"/>`}}return`<svg xmlns="http://www.w3.org/2000/svg" viewBox="${i} ${i} ${n} ${n}" role="img" aria-label="${t}"><g style="transform-origin:${q}px ${U}px${b?";"+b:""}"><circle cx="${q}" cy="${U}" r="${sr}" fill="currentColor"/><g class="mark">${Wd}</g></g><circle cx="${q}" cy="${U}" r="${r.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.6" stroke-opacity="0.2"/><circle cx="${q}" cy="${U}" r="${r.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="2.2" stroke-dasharray="${ts(r,e.a1)}" stroke-linecap="round" style="transform-origin:${q}px ${U}px;${u}"/><circle cx="${q}" cy="${U}" r="${a.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.5" stroke-opacity="0.15"/><circle cx="${q}" cy="${U}" r="${a.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="1.6" stroke-opacity="0.8" stroke-dasharray="${ts(a,e.a2)}" stroke-linecap="round" style="transform-origin:${q}px ${U}px;${h}"/><circle cx="${q}" cy="${U}" r="${l.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="0.4" stroke-opacity="0.12"/><circle cx="${q}" cy="${U}" r="${l.toFixed(2)}" fill="none" stroke="currentColor" stroke-width="1.0" stroke-opacity="0.6" stroke-dasharray="${ts(l,e.a3)}" stroke-linecap="round" style="transform-origin:${q}px ${U}px;${p}"/>`+w+"</svg>"}};yt.props=["preset","size","color","accent","sp1","sp2","sp3","a1","a2","a3","gap","dir2","dir3","pulse","dots","label"],yt.styles=[Fd],yt.help=void 0;let Mo=yt;function ts(s,e){const t=2*Math.PI*s,o=e/100*t,i=t-o;return`${o.toFixed(2)} ${i.toFixed(2)}`}function or(s){return String(s).replace(/&/g,"&").replace(/"/g,""").replace(/</g,"<").replace(/>/g,">")}$("os-spinner",Mo);const jd=x`:host{display:inline;color:inherit;font:inherit}`,ss=new Set;let $e=null;const Vd=3e4;function Od(){$e===null&&($e=window.setInterval(()=>{for(const s of ss)s.tick()},Vd))}function Kd(){$e!==null&&ss.size===0&&(window.clearInterval($e),$e=null)}function Bd(s){if(!s)return null;const e=t=>{const o=new Date(t);return Number.isNaN(o.getTime())?null:o};return Gd(s)?e(s):e(s.replace(" ","T")+"Z")}function Gd(s){const e=Math.max(s.indexOf("T"),s.indexOf(" ")),t=e===-1?"":s.slice(e+1);return/(?:[Zz]|[+-]\d{2}:?\d{2})$/.test(t)}let Do=null,No=null;function ir(){return typeof navigator<"u"&&navigator.language||"en"}function Xd(){return Do||(Do=new Intl.RelativeTimeFormat(ir(),{numeric:"auto"})),Do}function nr(){return No||(No=new Intl.RelativeTimeFormat(ir(),{numeric:"always",style:"narrow"})),No}function Zd(s,e){const t=Xd(),o=s.getTime()-e,i=Math.round(o/1e3),n=Math.abs;return n(i)<45?t.format(0,"second"):rr(t,i)}function rr(s,e){const t=Math.abs,o=Math.round(e/60);if(t(o)<45)return s.format(o,"minute");const i=Math.round(o/60);if(t(i)<22)return s.format(i,"hour");const n=Math.round(i/24);if(t(n)<26)return s.format(n,"day");const r=Math.round(n/30);if(t(r)<11)return s.format(r,"month");const a=Math.round(n/365);return s.format(a,"year")}function Yd(s,e){const t=Math.round((s.getTime()-e)/1e3),o=Math.abs;return o(t)<45?nr().format(0,"second"):o(t)>7*24*60*60?s.toLocaleDateString(void 0,{month:"short",day:"numeric"}):rr(nr(),t)}const wt=class wt extends k{connectedCallback(){super.connectedCallback(),ss.add(this),Od()}disconnectedCallback(){ss.delete(this),Kd()}tick(){this.requestUpdate()}render(){const e=this.datetime,t=Bd(e);if(!t)return c`<span>${e??""}</span>`;const o=Date.now(),i=this.hasAttribute("compact")?Yd(t,o):Zd(t,o),n=t.toLocaleString();return c`<time datetime=${t.toISOString()} title=${n} |
| 1589 |
>${i}</time |
| 1590 |
>`}};wt.props=["datetime","compact"],wt.styles=[jd],wt.help=void 0;let Ho=wt;$("os-relative-time",Ho);const Jd=x`: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}}`,ar={xs:20,sm:24,md:40,lg:64,xl:96},lr=new Set(["online","inactive","offline"]),xt=class xt extends k{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,o){super.attributeChangedCallback(e,t,o),e==="src"&&(this._imgFailed=!1),(e==="user-id"||e==="presence")&&this._maybeAttachPresenceListener()}render(){const e=this._attr("src"),t=this._attr("name")||"",o=this._attr("alt"),i=o!==null?o:t,n=this._attr("size"),r=this._resolveSize(n),a=this._presenceForRender(),l=this._attr("clickable")!==null;this.style.setProperty("--os-ui-avatar-size",`${r}px`);const u=e&&!this._imgFailed?"":this._initialsBg(t),h=e&&!this._imgFailed?c`<img |
| 1591 |
src=${e} |
| 1592 |
alt=${i} |
| 1593 |
@error=${()=>this._onImgError()} |
| 1594 |
loading="lazy" |
| 1595 |
/>`:this._initials(t),p=a?c`<span |
| 1596 |
class=${`os-avatar__dot os-avatar__dot--${a}`} |
| 1597 |
aria-label=${this._presenceLabel(a)} |
| 1598 |
></span>`:c``;return l?c` |
| 1599 |
<button |
| 1600 |
type="button" |
| 1601 |
class="os-avatar__tile" |
| 1602 |
aria-label=${i||"User"} |
| 1603 |
style=${u?`background:${u};`:""} |
| 1604 |
@click=${m=>this._onClick(m)} |
| 1605 |
>${h}</button> |
| 1606 |
${p} |
| 1607 |
`:c` |
| 1608 |
<div |
| 1609 |
class="os-avatar__tile" |
| 1610 |
role="img" |
| 1611 |
aria-label=${i||"User"} |
| 1612 |
style=${u?`background:${u};`:""} |
| 1613 |
>${h}</div> |
| 1614 |
${p} |
| 1615 |
`}_attr(e){return this.getAttribute(e)}_resolveSize(e){if(!e)return 32;if(e in ar)return ar[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=In(e);return`linear-gradient(135deg, hsl(${t} 62% 55%), hsl(${(t+24)%360} 58% 42%))`}_presenceForRender(){const e=this._attr("presence");return e&&lr.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"),o={userId:t!==null&&Number(t)||null,originalEvent:e};this.emit("os-avatar-click",o)}_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 o=this.getBoundingClientRect();if(o.width===0||o.height===0)return;const i=(t.clientX-o.left)/o.width-.5,n=(t.clientY-o.top)/o.height-.5,r=14;this._pendingTiltY=`${(i*r).toFixed(2)}deg`,this._pendingTiltX=`${(-n*r).toFixed(2)}deg`;const a=Math.max(0,Math.min(100,(i+.5)*100)),l=Math.max(0,Math.min(100,(n+.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"),o=!!e&&!t;o&&!this._presenceHandler?(this._presenceHandler=i=>{const n=i.detail;n&&String(n.userId)===String(e)&&n.newStatus&&lr.has(n.newStatus)&&this.setAttribute("presence",n.newStatus)},document.addEventListener("os-presence-changed",this._presenceHandler)):!o&&this._presenceHandler&&(document.removeEventListener("os-presence-changed",this._presenceHandler),this._presenceHandler=null)}};xt.props=["src","alt","name","size","presence","userId","clickable"],xt.styles=[Jd],xt.help=void 0;let qo=xt;$("os-avatar",qo);const Qd=x` ${R} ${hs}:host{display:flex;flex-direction:column;gap:4px;font-size:13px;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:6px;font:inherit;font-size:13px;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}`,kt=class kt extends k{constructor(){super(...arguments),this._textareaEl=null}connectedCallback(){super.connectedCallback(),ge(this)}render(){const e=this._attr("label")||"",t=this._attr("value")??"",o=this._attr("placeholder")||"",i=this._boolAttr("disabled"),n=this._boolAttr("readonly"),r=this._attr("aria-label")||e,a=this._attr("name")||"",l=Number(this._attr("rows"))||3,u=this._attr("maxlength"),h=this._attr("minlength"),p=this._boolAttr("invalid"),_=`${this.id||"os-unnamed"}__field`;return c` |
| 1616 |
${e?c`<label class="os-textarea__label" for=${_}>${e}</label>`:c``} |
| 1617 |
<textarea |
| 1618 |
id=${_} |
| 1619 |
part="textarea" |
| 1620 |
.value=${t} |
| 1621 |
placeholder=${o} |
| 1622 |
?disabled=${i} |
| 1623 |
?readonly=${n} |
| 1624 |
rows=${l} |
| 1625 |
maxlength=${u??""} |
| 1626 |
minlength=${h??""} |
| 1627 |
name=${a} |
| 1628 |
aria-invalid=${p?"true":"false"} |
| 1629 |
aria-label=${r||""} |
| 1630 |
@input=${b=>this._onInput(b)} |
| 1631 |
@change=${b=>this._onChange(b)} |
| 1632 |
@keydown=${b=>this._onKeyDown(b)} |
| 1633 |
></textarea> |
| 1634 |
`}_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.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,o=window.getComputedStyle(e),i=parseFloat(o.fontSize)||13,n=o.lineHeight,r=n==="normal"?i*1.45:parseFloat(n)||i*1.45,a=parseFloat(o.paddingTop)||0,l=parseFloat(o.paddingBottom)||0,u=r*t+a+l;e.style.height="auto";const h=Math.min(e.scrollHeight,u);e.style.height=`${h}px`}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))}};kt.props=["label","value","placeholder","disabled","readonly","ariaLabel","name","rows","maxlength","minlength","invalid","autoGrow","maxRows","submitOnEnter"],kt.styles=[Qd],kt.help=void 0;let Uo=kt;$("os-textarea",Uo);const eu=x` ${R}: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}`,$t=class $t extends k{constructor(){super(...arguments),this._onHostKeyDown=e=>{if(this.dismissible!==null&&(e.key==="Backspace"||e.key==="Delete")){if(e.preventDefault(),this.disabled!==null)return;const i=this.label??"";this.emit("os-chip-dismiss",{label:i})}}}connectedCallback(){super.connectedCallback(),this.addEventListener("keydown",this._onHostKeyDown)}disconnectedCallback(){this.removeEventListener("keydown",this._onHostKeyDown)}render(){const e=this.label??"",t=this.dismissible!==null,o=this.disabled!==null;return c` |
| 1635 |
<span part="chip" class="os-chip"> |
| 1636 |
<span class="os-chip__icon"> |
| 1637 |
<slot name="icon"></slot> |
| 1638 |
</span> |
| 1639 |
<span class="os-chip__label"> |
| 1640 |
${e===""?c`<slot></slot>`:e} |
| 1641 |
</span> |
| 1642 |
${t?c` |
| 1643 |
<button |
| 1644 |
part="dismiss" |
| 1645 |
class="os-chip__dismiss" |
| 1646 |
type="button" |
| 1647 |
aria-label=${`Remove ${e||"chip"}`} |
| 1648 |
?disabled=${o} |
| 1649 |
@click=${i=>this._onDismiss(i)} |
| 1650 |
> |
| 1651 |
${z("close",{size:null})} |
| 1652 |
</button> |
| 1653 |
`:c``} |
| 1654 |
</span> |
| 1655 |
`}_onDismiss(e){if(e.stopPropagation(),this.disabled!==null)return;const o=this.label??"";this.emit("os-chip-dismiss",{label:o})}};$t.props=["label","tone","size","dismissible","disabled","pending","selected"],$t.styles=[eu],$t.help=void 0;let Fo=$t;$("os-chip",Fo);const tu=x`: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: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}`,At=class At extends k{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,o=this.readonly!==null,i=this.removable!==null||this.removable===null&&!o,n=this.creatable!==null,r=this["add-label"]||"Add",a=this.placeholder||"Add a tag…";return c` |
| 1656 |
<span |
| 1657 |
class="os-tag-input" |
| 1658 |
role="group" |
| 1659 |
aria-label=${this.label??""} |
| 1660 |
> |
| 1661 |
${this._renderChips(i,t)} |
| 1662 |
${this._renderTrailing({isOpen:e,readonly:o,disabled:t,placeholder:a,creatable:n,addLabel:r})} |
| 1663 |
</span> |
| 1664 |
`}_renderTrailing(e){return e.isOpen?this._renderEditor(e.placeholder,e.creatable):e.readonly||e.disabled?c``:this._renderTrigger(e.addLabel)}_renderChips(e,t){const o=this._value;return o.length===0?c``:c` |
| 1665 |
<span class="os-tag-input__chips" role="list"> |
| 1666 |
${o.map((i,n)=>{const r=i.tone??"neutral";return c` |
| 1667 |
<os-chip |
| 1668 |
role="listitem" |
| 1669 |
size="compact" |
| 1670 |
tone=${r} |
| 1671 |
label=${i.label} |
| 1672 |
?dismissible=${e&&!t} |
| 1673 |
?disabled=${t} |
| 1674 |
?pending=${!!i.pending} |
| 1675 |
tabindex=${n===this._focusedChip?"0":"-1"} |
| 1676 |
data-idx=${String(n)} |
| 1677 |
@os-chip-dismiss=${a=>this._onChipDismiss(a,i)} |
| 1678 |
@focus=${()=>this._focusedChip=n} |
| 1679 |
></os-chip> |
| 1680 |
`})} |
| 1681 |
</span> |
| 1682 |
`}_renderTrigger(e){const t=this.disabled!==null;return c` |
| 1683 |
<button |
| 1684 |
type="button" |
| 1685 |
class="os-tag-input__add" |
| 1686 |
aria-label=${e} |
| 1687 |
aria-haspopup="listbox" |
| 1688 |
aria-expanded="false" |
| 1689 |
?disabled=${t} |
| 1690 |
@click=${()=>this.openInput()} |
| 1691 |
> |
| 1692 |
${su()} |
| 1693 |
<span>${e}</span> |
| 1694 |
</button> |
| 1695 |
`}_renderEditor(e,t){const o=this._suggestions.length>0||this._suggestionsLoading||t&&this._query.trim().length>0;return c` |
| 1696 |
<span class="os-tag-input__editor"> |
| 1697 |
<input |
| 1698 |
class="os-tag-input__input" |
| 1699 |
type="text" |
| 1700 |
autocomplete="off" |
| 1701 |
autocapitalize="off" |
| 1702 |
spellcheck="false" |
| 1703 |
placeholder=${e} |
| 1704 |
.value=${this._query} |
| 1705 |
aria-autocomplete="list" |
| 1706 |
aria-expanded=${o?"true":"false"} |
| 1707 |
aria-activedescendant=${this._highlight>=0?`os-tag-suggestion-${this._highlight}`:""} |
| 1708 |
@input=${i=>this._onInput(i)} |
| 1709 |
@keydown=${i=>this._onInputKeyDown(i)} |
| 1710 |
@blur=${i=>this._onInputBlur(i)} |
| 1711 |
/> |
| 1712 |
${o?this._renderSuggestions(t):c``} |
| 1713 |
</span> |
| 1714 |
`}_renderSuggestions(e){const t=this._query.trim(),o=this._suggestions,i=e&&t.length>0&&!o.some(n=>n.label.toLowerCase()===t.toLowerCase())&&!this._value.some(n=>n.label.toLowerCase()===t.toLowerCase());return c` |
| 1715 |
<div |
| 1716 |
class="os-tag-input__suggestions" |
| 1717 |
role="listbox" |
| 1718 |
> |
| 1719 |
${this._suggestionsLoading?c` |
| 1720 |
<div class="os-tag-input__suggestion-loading"> |
| 1721 |
<span class="os-tag-input__suggestion-spinner" aria-hidden="true"></span> |
| 1722 |
<span>Searching…</span> |
| 1723 |
</div> |
| 1724 |
`:c``} |
| 1725 |
${o.length===0&&!this._suggestionsLoading&&!i?c` |
| 1726 |
<div class="os-tag-input__suggestion-empty"> |
| 1727 |
${t.length>0?"No matches.":"Type to search."} |
| 1728 |
</div> |
| 1729 |
`:c``} |
| 1730 |
${o.map((n,r)=>{const a=r===this._highlight;return c` |
| 1731 |
<div |
| 1732 |
id=${`os-tag-suggestion-${r}`} |
| 1733 |
role="option" |
| 1734 |
aria-selected=${a?"true":"false"} |
| 1735 |
class="os-tag-input__suggestion-item" |
| 1736 |
@mousedown=${l=>{l.preventDefault(),this._addSuggestion(n,!1)}} |
| 1737 |
@mouseenter=${()=>{this._highlight=r,this.requestUpdate()}} |
| 1738 |
> |
| 1739 |
<span>${n.label}</span> |
| 1740 |
</div> |
| 1741 |
`})} |
| 1742 |
${i?c` |
| 1743 |
<div |
| 1744 |
id=${`os-tag-suggestion-${o.length}`} |
| 1745 |
role="option" |
| 1746 |
aria-selected=${this._highlight===o.length?"true":"false"} |
| 1747 |
class="os-tag-input__suggestion-item os-tag-input__suggestion-create" |
| 1748 |
@mousedown=${n=>{n.preventDefault(),this._addSuggestion({label:t},!0)}} |
| 1749 |
@mouseenter=${()=>{this._highlight=o.length,this.requestUpdate()}} |
| 1750 |
> |
| 1751 |
Create "${t}" |
| 1752 |
</div> |
| 1753 |
`:c``} |
| 1754 |
</div> |
| 1755 |
`}_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,o=this._suggestions,i=this._query.trim(),n=t&&i.length>0&&!o.some(a=>a.label.toLowerCase()===i.toLowerCase())&&!this._value.some(a=>a.label.toLowerCase()===i.toLowerCase()),r=o.length+(n?1:0);switch(e.key){case"ArrowDown":{if(r===0)return;e.preventDefault(),this._highlight=this._highlight+1>=r?0:this._highlight+1,this.requestUpdate();return}case"ArrowUp":{if(r===0)return;e.preventDefault(),this._highlight=this._highlight<=0?r-1:this._highlight-1,this.requestUpdate();return}case"Enter":{if(e.preventDefault(),this._highlight>=0&&this._highlight<o.length){this._addSuggestion(o[this._highlight],!1);return}if(this._highlight===o.length&&n){this._addSuggestion({label:i},!0);return}if(n&&i.length>0){this._addSuggestion({label:i},!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(i=>i.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()})}};At.props=["label","placeholder","add-label","creatable","removable","disabled","readonly","size","min-query","open"],At.styles=[tu],At.help=void 0;let Wo=At;$("os-tag-input",Wo);function su(){return z("plus",{size:14})}const ou=x`: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}}`,Ct=class Ct extends k{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("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("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",o=this.error||"",i=this.busy!==null,r=this["show-reset"]!=="false";return c` |
| 1756 |
<div class="header" part="header"> |
| 1757 |
<slot name="header"></slot> |
| 1758 |
</div> |
| 1759 |
<div class="fields" part="fields"> |
| 1760 |
<slot></slot> |
| 1761 |
</div> |
| 1762 |
<slot name="error"> |
| 1763 |
${o?c`<p class="error" role="alert" part="error">${o}</p>`:c`<p class="error" role="alert" part="error" hidden></p>`} |
| 1764 |
</slot> |
| 1765 |
<footer class="footer" part="footer"> |
| 1766 |
<span class="footer-leading" |
| 1767 |
><slot name="footer-leading"></slot |
| 1768 |
></span> |
| 1769 |
<span class="footer-actions"> |
| 1770 |
${r?c`<os-button |
| 1771 |
variant="ghost" |
| 1772 |
data-os-form-action="reset" |
| 1773 |
?disabled=${i} |
| 1774 |
@click=${()=>this.reset()} |
| 1775 |
>${t}</os-button>`:c``} |
| 1776 |
<os-button |
| 1777 |
variant="primary" |
| 1778 |
data-os-form-action="submit" |
| 1779 |
?disabled=${i} |
| 1780 |
@click=${()=>this.submit()} |
| 1781 |
> |
| 1782 |
${i?c`<span class="busy-spinner" aria-hidden="true"></span>`:c``} |
| 1783 |
${e} |
| 1784 |
</os-button> |
| 1785 |
</span> |
| 1786 |
<span class="footer-trailing" |
| 1787 |
><slot name="footer-trailing"></slot |
| 1788 |
></span> |
| 1789 |
</footer> |
| 1790 |
`}getValues(){const e={};for(const t of this._namedFields()){const o=t.getAttribute("name");o&&(e[o]=this._readField(t))}return e}setValues(e){for(const[t,o]of Object.entries(e)){const i=this._fieldByName(t);i&&this._writeField(i,o)}}setBusy(e){e?this.setAttribute("busy",""):this.removeAttribute("busy")}setError(e){e?this.setAttribute("error",e):this.removeAttribute("error")}setFieldInvalid(e,t=!0,o=null){const i=this._fieldByName(e);i&&(t?(i.setAttribute("invalid",""),o!==null&&i.setAttribute("error",o)):(i.removeAttribute("invalid"),i.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 o=this._fieldByName(e);if(o){if(t.checked!==null){o.checked=t.checked,t.checked?o.setAttribute("checked",""):o.removeAttribute("checked");continue}this._writeField(o,t.value)}}this.dispatchEvent(new CustomEvent("os-form-reset",{bubbles:!0,composed:!0,detail:{form:this}}))}submit(){const e=[];for(const i of this._namedFields()){const n=i.getAttribute("name");if(!n||!i.hasAttribute("required"))continue;const a=this._readField(i);if(a==null||a===""||Array.isArray(a)&&a.length===0){i.setAttribute("invalid","");const u=i.getAttribute("label");e.push(u||n)}}if(e.length>0){const i=e.join(", ");this.setError(`Required: ${i}`);return}const t=this.getValues(),o=new CustomEvent("os-form-submit",{bubbles:!0,composed:!0,cancelable:!0,detail:{values:t,form:this}});this.dispatchEvent(o)}_captureInitialValues(){if(this._captured)return;const e=this._namedFields();if(e.length!==0){for(const t of e){const o=t.getAttribute("name");if(!o)continue;const i=t.tagName==="OS-CHECKBOX"||t.tagName==="OS-CHECKBOX-LABEL"||t.tagName==="INPUT"&&t.type==="checkbox";this._initial.set(o,{value:this._readField(t),checked:i?!!t.checked: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-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 o=e.tagName.toUpperCase();if(o==="OS-CHECKBOX"||o==="OS-CHECKBOX-LABEL"||o==="INPUT"&&e.type==="checkbox"){const r=!!t;e.checked=r,r?e.setAttribute("checked",""):e.removeAttribute("checked");return}const n=t==null?"":String(t);e.value=n,e.setAttribute("value",n)}_onAnyFieldInput(e){const t=e.target;if(!t)return;const o=t.getAttribute?.("name");o&&(this.dispatchEvent(new CustomEvent("os-form-input",{bubbles:!0,composed:!0,detail:{name:o,value:this._readField(t),form:this}})),t.hasAttribute("invalid")&&t.removeAttribute("invalid"))}};Ct.props=["submit-label","reset-label","error","busy","columns","min-column","show-reset","align"],Ct.styles=[ou],Ct.help=void 0;let jo=Ct;$("os-form",jo);const iu=x`: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%}`,cr="os-settings-save-lifecycle",nu=2200,ru=6e3,St=class St extends k{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,o){if(super.attributeChangedCallback(e,t,o),(e==="auto"||e==="event")&&(this._removeAutoListener(),this.auto!==null&&this._installAutoListener()),e==="phase"){this._scheduleAutoClear();const i={phase:this.phase??"idle",error:this.error??void 0};this.emit("os-save-status-change",i)}}render(){const e=this.phase??"idle",t=this.mode??"dot",i=(this.error??"")||this._labelForPhase(e);return i?this.setAttribute("title",i):this.removeAttribute("title"),this.setAttribute("aria-live",e==="failed"?"assertive":"polite"),this.setAttribute("role",e==="failed"?"alert":"status"),c` |
| 1791 |
<span class="os-save-status"> |
| 1792 |
<span class="os-save-status__indicator" aria-hidden="true"> |
| 1793 |
<span class="os-save-status__glyph">${this._renderGlyph(e)}</span> |
| 1794 |
</span> |
| 1795 |
${t==="pill"?c`<span class="os-save-status__label" |
| 1796 |
>${this._labelForPhase(e)}</span |
| 1797 |
>`:c``} |
| 1798 |
</span> |
| 1799 |
`}_renderGlyph(e){return e==="saved"?au():e==="failed"?lu():""}_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||cr;this._docListener=t=>{const o=t.detail;!o||typeof o.phase!="string"||(this.phase=o.phase,o.error?this.error=o.error:o.phase!=="failed"&&this.error&&this.removeAttribute("error"))},document.addEventListener(e,this._docListener)}_removeAutoListener(){if(!this._docListener)return;const e=this.event||cr;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)||nu}if(e==="failed"){const t=this["auto-clear-failed-ms"];return parseInt(t||"",10)||ru}return 0}};St.props=["phase","mode","variant","animation","auto","event","error","saving-label","saved-label","idle-label","auto-clear-saved-ms","auto-clear-failed-ms"],St.styles=[iu],St.help=void 0;let Vo=St;$("os-save-status",Vo);function au(){return c` |
| 1800 |
<svg |
| 1801 |
viewBox="0 0 12 12" |
| 1802 |
aria-hidden="true" |
| 1803 |
focusable="false" |
| 1804 |
fill="none" |
| 1805 |
stroke="currentColor" |
| 1806 |
stroke-width="2" |
| 1807 |
stroke-linecap="round" |
| 1808 |
stroke-linejoin="round" |
| 1809 |
> |
| 1810 |
<path d="M2.5 6 L5 8.5 L9.5 4" /> |
| 1811 |
</svg> |
| 1812 |
`}function lu(){return c` |
| 1813 |
<svg |
| 1814 |
viewBox="0 0 12 12" |
| 1815 |
aria-hidden="true" |
| 1816 |
focusable="false" |
| 1817 |
fill="currentColor" |
| 1818 |
> |
| 1819 |
<path |
| 1820 |
d="M5 2 H7 V7 H5 z M5 8.5 H7 V10.5 H5 z" |
| 1821 |
/> |
| 1822 |
</svg> |
| 1823 |
`}const cu=x`: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: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-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-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}`,G="10px",du=x`: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% - ${G} ) 0,100% 50%,calc( 100% - ${G} ) 100%,0 100% )}.os-crumb--middle{padding-inline:22px;margin-inline-start:calc( -1 * ${G} );clip-path:polygon( ${G} 0,calc( 100% - ${G} ) 0,100% 50%,calc( 100% - ${G} ) 100%,${G} 100%,0 50% )}.os-crumb--last{padding-inline-start:22px;padding-inline-end:14px;margin-inline-start:calc( -1 * ${G} );clip-path:polygon( ${G} 0,100% 0,100% 100%,${G} 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}`,Et=class Et extends k{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?c``:c` |
| 1824 |
<div class="os-crumb-chain" role="group"> |
| 1825 |
${t.map((o,i)=>{const n=dr(i,t.length),r=o.color??"rgba( 0, 0, 0, 0.08 )",a=ur(r),l=`--os-ui-crumb-bg: ${r}; --os-ui-crumb-fg: ${a};`;return c` |
| 1826 |
<span |
| 1827 |
class=${`os-crumb os-crumb--${n}`} |
| 1828 |
style=${l} |
| 1829 |
title=${o.name} |
| 1830 |
draggable="true" |
| 1831 |
@click=${u=>this._onSegmentClick(u,i,o)} |
| 1832 |
@dragstart=${u=>this._onSegmentDragStart(u,i,o)} |
| 1833 |
> |
| 1834 |
<span class="os-crumb__label">${o.name}</span> |
| 1835 |
${e?c` |
| 1836 |
<button |
| 1837 |
type="button" |
| 1838 |
class="os-crumb__remove" |
| 1839 |
aria-label=${`Remove ${o.name}`} |
| 1840 |
draggable="false" |
| 1841 |
@click=${u=>this._onRemove(u,i,o)} |
| 1842 |
>${pu()}</button> |
| 1843 |
`:c``} |
| 1844 |
</span> |
| 1845 |
`})} |
| 1846 |
</div> |
| 1847 |
`}_onSegmentDragStart(e,t,o){if(e.target?.closest(".os-crumb__remove")){e.preventDefault();return}const n=this._segments.slice(t);if(e.dataTransfer){const r=hu(n);document.body.appendChild(r);const a=e.currentTarget?.getBoundingClientRect(),l=a?Math.min(30,a.width/2):16,u=a?Math.min(16,a.height/2):12;e.dataTransfer.setDragImage(r,l,u),requestAnimationFrame(()=>r.remove())}this.emit("os-chain-segment-dragstart",{index:t,id:o.id,segment:o,segments:n,dragEvent:e})}_onSegmentClick(e,t,o){e.target?.closest(".os-crumb__remove")||this.emit("os-chain-segment-click",{index:t,id:o.id,segment:o})}_onRemove(e,t,o){e.stopPropagation(),this.emit("os-chain-remove",{index:t,id:o.id,segment:o})}};Et.props=["removable","disabled"],Et.styles=[du],Et.help=void 0;let Oo=Et;$("os-crumb-chain",Oo);const uu=10;function hu(s){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=s.length;return s.forEach((o,i)=>{const n=document.createElement("span"),r=o.color??"rgba( 0, 0, 0, 0.08 )",a=ur(r),l=dr(i,t),u=["display: inline-flex","align-items: center","justify-content: center","min-height: 22px",`background: ${r}`,`color: ${a}`,"white-space: nowrap","box-sizing: border-box","letter-spacing: 0.01em"],h=uu;l==="solo"?u.push("padding: 2px 12px","border-radius: 999px"):l==="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% )`):l==="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}function dr(s,e){return e===1?"solo":s===0?"first":s===e-1?"last":"middle"}let Ae=null;function ur(s){Ae||(Ae=document.createElement("canvas"),Ae.width=1,Ae.height=1);const e=Ae.getContext("2d",{willReadFrequently:!0});if(!e)return"#1d2327";try{e.clearRect(0,0,1,1),e.fillStyle=s,e.fillRect(0,0,1,1);const t=e.getImageData(0,0,1,1).data,o=t[3]/255,i=t[0]*o+255*(1-o),n=t[1]*o+255*(1-o),r=t[2]*o+255*(1-o),a=u=>{const h=u/255;return h<=.03928?h/12.92:Math.pow((h+.055)/1.055,2.4)};return .2126*a(i)+.7152*a(n)+.0722*a(r)>.55?"#1d2327":"#fff"}catch{return"#1d2327"}}function pu(){return z("close",{size:null})}const hr="uncategorized",fu=1;function os(s){return s.id===fu?!0:(s.name||"").toLowerCase()===hr}const Lt=class Lt extends k{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 o=this.disabled!==null,i=this.readonly!==null;o||i||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,o=this.readonly!==null,i=this.loading!==null,n=this["add-label"]||"Categorize",r=this.placeholder||"Search categories…",a=Math.max(0,parseInt(this["max-visible"]||"2",10)||2);return c` |
| 1848 |
<span class="os-cat" role="group"> |
| 1849 |
${this._renderChipRow(a,o,t,n)} |
| 1850 |
${e?this._renderPopover(r,i):c``} |
| 1851 |
</span> |
| 1852 |
`}_renderChipRow(e,t,o,i){const n=this._selectedItemsInOrder();if(n.length===0)return c` |
| 1853 |
<span class="os-cat__chips" role="list"> |
| 1854 |
<span |
| 1855 |
class="os-cat__uncategorized" |
| 1856 |
title=${'Posts with no category appear as "Uncategorized" in WordPress.'} |
| 1857 |
@click=${this._onCellClick} |
| 1858 |
>${"Uncategorized"}</span> |
| 1859 |
</span> |
| 1860 |
`;const r=this._buildChains(n);return c` |
| 1861 |
<div |
| 1862 |
class="os-cat__chains" |
| 1863 |
role="list" |
| 1864 |
@click=${this._onCellClick} |
| 1865 |
> |
| 1866 |
${r.map(a=>this._renderChain(a,t,o))} |
| 1867 |
</div> |
| 1868 |
`}_buildChains(e){const t=new Map;for(const a of this._items)t.set(a.id,a);const o=new Set(e.map(a=>a.id)),i=a=>{for(const l of o){if(l===a)continue;let u=t.get(l),h=16;for(;u&&h-- >0;){if(u.parent===a)return!0;if(!u.parent)break;u=t.get(u.parent)}}return!1},n=e.filter(a=>!i(a.id)),r=[];for(const a of n){const l=[];let u=a,h=16;for(;u&&h-- >0&&((u===a||o.has(u.id))&&l.unshift(u),!!u.parent);)u=t.get(u.parent);const p=l.map(m=>({id:m.id,name:m.name}));r.push({id:a.id,segments:p})}return r}_renderChain(e,t,o){const i=!t&&!o,n=a=>{a.stopPropagation();const l=a.detail,u=typeof l?.index=="number"?l.index:e.segments.length-1,h=new Set;for(const m of e.segments.slice(u))typeof m.id=="number"&&h.add(m.id);const p=this._value.filter(m=>!h.has(m));p.length!==this._value.length&&this.emit("os-categories-change",{value:p})},r=document.createElement("os-crumb-chain");return r.segments=e.segments,i&&r.setAttribute("removable",""),r.addEventListener("os-chain-remove",n),c`<div role="listitem">${r}</div>`}_renderPopover(e,t){const o=this._buildTree(),i=this._filterTree(o,this._query),n=this._flattenForDisplay(i);return this._focusedRow>=n.length&&(this._focusedRow=n.length>0?n.length-1:-1),c` |
| 1869 |
<div class="os-cat__popover" role="dialog" aria-label="Choose categories"> |
| 1870 |
<input |
| 1871 |
class="os-cat__search" |
| 1872 |
type="text" |
| 1873 |
autocomplete="off" |
| 1874 |
placeholder=${e} |
| 1875 |
.value=${this._query} |
| 1876 |
@input=${r=>this._onSearchInput(r)} |
| 1877 |
@keydown=${r=>this._onSearchKeydown(r,n)} |
| 1878 |
/> |
| 1879 |
<div class="os-cat__tree" role="listbox" aria-multiselectable="true"> |
| 1880 |
${this._renderCreateRow(0,12,0,"")} |
| 1881 |
${this._renderTreeBody(t,n)} |
| 1882 |
</div> |
| 1883 |
<div class="os-cat__footer"> |
| 1884 |
<span class="dashicons dashicons-info-outline" aria-hidden="true"></span> |
| 1885 |
<span> |
| 1886 |
Posts with no category appear as |
| 1887 |
<strong>Uncategorized</strong>. |
| 1888 |
</span> |
| 1889 |
</div> |
| 1890 |
</div> |
| 1891 |
`}_renderTreeBody(e,t){return e?c` |
| 1892 |
<div class="os-cat__loading"> |
| 1893 |
<span class="os-cat__loading-spinner" aria-hidden="true"></span> |
| 1894 |
${"Loading categories…"} |
| 1895 |
</div> |
| 1896 |
`:t.length===0?c` |
| 1897 |
<div class="os-cat__empty"> |
| 1898 |
${this._items.length===0?"No categories yet — create one in WordPress to assign.":"No matches."} |
| 1899 |
</div> |
| 1900 |
`:t.map((o,i)=>this._renderRow(o,i,t.length))}_renderRow(e,t,o){const{node:i,hasChildren:n}=e,r=this._value.includes(i.item.id),a=!this._collapsed.has(i.item.id),l=12+i.depth*16,u=i.depth>0?i.depth*16:0,h=t===this._focusedRow;return c` |
| 1901 |
<div class="os-cat__row-block"> |
| 1902 |
<div |
| 1903 |
class="os-cat__row" |
| 1904 |
role="option" |
| 1905 |
aria-selected=${r?"true":"false"} |
| 1906 |
data-selected=${r?"true":"false"} |
| 1907 |
data-expanded=${a?"true":"false"} |
| 1908 |
data-focused=${h?"true":"false"} |
| 1909 |
data-row-id=${String(i.item.id)} |
| 1910 |
style=${`--os-ui-cat-row-indent: ${l}px; --os-ui-cat-guide-width: ${u}px;`} |
| 1911 |
@mouseenter=${()=>{this._focusedRow=t,this.requestUpdate()}} |
| 1912 |
@click=${p=>{p.preventDefault(),this._toggleSelection(i.item.id)}} |
| 1913 |
> |
| 1914 |
${n?c`<button |
| 1915 |
type="button" |
| 1916 |
class="os-cat__expander" |
| 1917 |
aria-label=${a?"Collapse":"Expand"} |
| 1918 |
@click=${p=>{p.stopPropagation(),this._toggleExpand(i.item.id)}} |
| 1919 |
>${pr()}</button>`:c`<span class="os-cat__expander os-cat__expander--placeholder" aria-hidden="true">${pr()}</span>`} |
| 1920 |
<span class="os-cat__check" aria-hidden="true">${bu()}</span> |
| 1921 |
<span class="os-cat__label">${this._highlight(i.item.name,this._query)}</span> |
| 1922 |
${os(i.item)?c``:c`<button |
| 1923 |
type="button" |
| 1924 |
class="os-cat__delete" |
| 1925 |
aria-label=${`Delete ${i.item.name}`} |
| 1926 |
title=${`Delete ${i.item.name}`} |
| 1927 |
@click=${p=>this._onDeleteClick(p,i.item)} |
| 1928 |
>${mu()}</button>`} |
| 1929 |
</div> |
| 1930 |
${a&&!os(i.item)?this._renderCreateRow(i.item.id,12+(i.depth+1)*16,(i.depth+1)*16,i.item.name):c``} |
| 1931 |
</div> |
| 1932 |
`}_renderCreateRow(e,t,o,i){const n=this._creatingValues.get(e)??"",r=this._creatingPending.has(e),a=e===0?"Add new category…":`Add child of "${i}"…`;return c` |
| 1933 |
<div |
| 1934 |
class="os-cat__create-row" |
| 1935 |
style=${`--os-ui-cat-row-indent: ${t}px; --os-ui-cat-guide-width: ${o}px;`} |
| 1936 |
@click=${l=>l.stopPropagation()} |
| 1937 |
> |
| 1938 |
<div class="os-cat__create-wrap"> |
| 1939 |
<input |
| 1940 |
class="os-cat__create-input" |
| 1941 |
type="text" |
| 1942 |
autocomplete="off" |
| 1943 |
spellcheck="false" |
| 1944 |
placeholder=${a} |
| 1945 |
aria-label=${a} |
| 1946 |
.value=${n} |
| 1947 |
?disabled=${r} |
| 1948 |
@input=${l=>this._onCreateInput(l,e)} |
| 1949 |
@keydown=${l=>this._onCreateKeydown(l,e)} |
| 1950 |
/> |
| 1951 |
${r?c`<span class="os-cat__create-spinner" aria-hidden="true"></span>`:c`<button |
| 1952 |
type="button" |
| 1953 |
class="os-cat__create-submit" |
| 1954 |
aria-label=${e===0?"Create category":`Create child of ${i}`} |
| 1955 |
?disabled=${n.trim().length===0} |
| 1956 |
@click=${l=>{l.stopPropagation(),this._submitCreate(e)}} |
| 1957 |
>${gu()}</button>`} |
| 1958 |
</div> |
| 1959 |
</div> |
| 1960 |
`}_onCreateInput(e,t){const o=e.target.value;o===""?this._creatingValues.delete(t):this._creatingValues.set(t,o),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 n of this._items)e.set(n.id,{item:n,children:[],depth:0});const t=[];for(const n of e.values()){const r=n.item.parent;r&&e.has(r)?e.get(r).children.push(n):t.push(n)}const o=(n,r)=>{n.depth=r;for(const a of n.children)o(a,r+1)};for(const n of t)o(n,0);const i=n=>{n.sort((r,a)=>{const l=os(r.item),u=os(a.item);return l!==u?l?-1:1:r.item.name.localeCompare(a.item.name)});for(const r of n)i(r.children)};return i(t),t}_filterTree(e,t){const o=t.trim().toLowerCase();if(!o)return e;const i=n=>{if(n.item.name.toLowerCase().includes(o))return{item:n.item,children:n.children.slice(),depth:n.depth};const a=n.children.map(i).filter(l=>l!==null);return a.length>0?{item:n.item,children:a,depth:n.depth}:null};return e.map(i).filter(n=>n!==null)}_flattenForDisplay(e){const t=[],o=this._query.trim()!=="",i=n=>{for(const r of n)t.push({node:r,visible:!0,hasChildren:r.children.length>0}),!(this._collapsed.has(r.item.id)&&!o)&&r.children.length>0&&i(r.children)};return i(e),t}_selectedItemsInOrder(){const e=new Map;for(const i of this._items)e.set(i.id,i);const t=[],o=[];for(const i of this._value){const n=e.get(i);n&&(n.name.toLowerCase()===hr||n.id===1?o.push(n):t.push(n))}return t.length>0?t:o.length>0?[]:t}_highlight(e,t){const o=t.trim();if(!o)return e;const i=e.toLowerCase(),n=o.toLowerCase(),r=i.indexOf(n);return r===-1?e:c`${e.slice(0,r)}<span class="os-cat__match" |
| 1961 |
>${e.slice(r,r+o.length)}</span |
| 1962 |
>${e.slice(r+o.length)}`}_toggleSelection(e){const t=this._value.includes(e)?this._value.filter(o=>o!==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 o=t[this._focusedRow];o.hasChildren&&this._collapsed.has(o.node.item.id)&&(e.preventDefault(),this._toggleExpand(o.node.item.id));return}case"ArrowLeft":{if(this._focusedRow<0||this._focusedRow>=t.length)return;const o=t[this._focusedRow];o.hasChildren&&!this._collapsed.has(o.node.item.id)&&(e.preventDefault(),this._toggleExpand(o.node.item.id));return}case"Enter":case" ":{if(this._focusedRow<0||this._focusedRow>=t.length)return;e.preventDefault();const o=t[this._focusedRow];this._toggleSelection(o.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 o=t.getBoundingClientRect(),i=e.getBoundingClientRect();o.top<i.top?t.scrollIntoView({block:"nearest"}):o.bottom>i.bottom&&t.scrollIntoView({block:"nearest"})})}_positionPopover(){const e=this.shadowRoot?.querySelector(".os-cat__popover");if(!e)return;const t=this.getBoundingClientRect(),o=e.getBoundingClientRect(),i=window.innerWidth,n=window.innerHeight,r=8;let a=t.bottom+4;const l=a+o.height+r>n,u=t.top-4-o.height>=r;l&&u?a=t.top-4-o.height:l&&(a=Math.max(r,n-o.height-r));let h=t.left;h+o.width+r>i&&(h=t.right-o.width),h=Math.max(r,Math.min(h,i-o.width-r)),e.style.top=`${a}px`,e.style.left=`${h}px`}};Lt.props=["placeholder","add-label","disabled","readonly","open","loading","max-visible"],Lt.styles=[cu],Lt.help=void 0;let Ko=Lt;$("os-category-picker",Ko);function pr(){return z("chevron-right",{size:14})}function gu(){return z("plus",{size:16})}function bu(){return z("check",{size:null})}function mu(){return z("close",{size:null})}const vu=x` ${R} ${Ut}: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}`,fr="[data-noclick]",Rt=class Rt extends k{constructor(){super(...arguments),this._onClick=e=>{!this.hasAttribute("interactive")||this.hasAttribute("disabled")||e.target?.closest(fr)||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(fr)||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(),c`<span class="os-holo-glint" aria-hidden="true"></span |
| 1963 |
><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}))}};Rt.props=["interactive","selected","compact","disabled"],Rt.styles=[vu],Rt.help=void 0;let Bo=Rt;$("os-card",Bo);const _u=x`: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}}`,Tt=class Tt extends k{constructor(){super(...arguments),this._ratings={}}get ratings(){return{...this._ratings}}set ratings(e){this._ratings=e?{...e}:{},this.requestUpdate()}render(){const e=yu(gr(this,"rating")),t=e/100*5,o=gr(this,"total"),i=o>0?o:(this._ratings[5]??0)+(this._ratings[4]??0)+(this._ratings[3]??0)+(this._ratings[2]??0)+(this._ratings[1]??0),n=new Intl.NumberFormat,r=e>0?(e/100*5).toFixed(1):"—";return c` |
| 1964 |
<div class="summary-card" role="img" aria-label=${wu(e,i)}> |
| 1965 |
<div class="summary"> |
| 1966 |
<div class="big">${r}</div> |
| 1967 |
<div class="stars" aria-hidden="true"> |
| 1968 |
${xu(t)} |
| 1969 |
</div> |
| 1970 |
<div class="total"> |
| 1971 |
${i===1?"1 rating":`${n.format(i)} ratings`} |
| 1972 |
</div> |
| 1973 |
</div> |
| 1974 |
<div class="bars"> |
| 1975 |
${[5,4,3,2,1].map(a=>{const l=this._ratings[String(a)]??0,u=i===0?0:l/i;return c` |
| 1976 |
<div |
| 1977 |
class="row" |
| 1978 |
role="presentation" |
| 1979 |
aria-label=${`${a} stars: ${n.format(l)}`} |
| 1980 |
> |
| 1981 |
<span class="row__label"> |
| 1982 |
${a} ${br()} |
| 1983 |
</span> |
| 1984 |
<span class="row__track"> |
| 1985 |
<span |
| 1986 |
class="row__fill" |
| 1987 |
style=${`--ratio: ${u.toFixed(4)}`} |
| 1988 |
></span> |
| 1989 |
</span> |
| 1990 |
<span class="row__count">${n.format(l)}</span> |
| 1991 |
</div> |
| 1992 |
`})} |
| 1993 |
</div> |
| 1994 |
</div> |
| 1995 |
`}};Tt.props=["rating","total"],Tt.styles=[_u],Tt.help=void 0;let Go=Tt;function gr(s,e){const t=s.getAttribute(e);if(t===null||t==="")return 0;const o=Number(t);return Number.isFinite(o)?o:0}function yu(s){return s<0?0:s>100?100:s}function wu(s,e){return e===0?"No ratings yet":`Average rating ${(s/100*5).toFixed(1)} out of 5, from ${e} ratings`}function xu(s){const e=Math.floor(s),t=s-e>=.5?1:0,o=5-e-t,i=[];for(let n=0;n<e;n++)i.push(br());for(let n=0;n<t;n++)i.push(ku());for(let n=0;n<o;n++)i.push($u());return i}function br(){return c` |
| 1996 |
<svg viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"> |
| 1997 |
<path |
| 1998 |
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" |
| 1999 |
/> |
| 2000 |
</svg> |
| 2001 |
`}function ku(){return c` |
| 2002 |
<svg viewBox="0 0 16 16" aria-hidden="true"> |
| 2003 |
<defs> |
| 2004 |
<linearGradient id="os-half-star"> |
| 2005 |
<stop offset="50%" stop-color="currentColor" /> |
| 2006 |
<stop |
| 2007 |
offset="50%" |
| 2008 |
stop-color="currentColor" |
| 2009 |
stop-opacity="0.22" |
| 2010 |
/> |
| 2011 |
</linearGradient> |
| 2012 |
</defs> |
| 2013 |
<path |
| 2014 |
fill="url(#os-half-star)" |
| 2015 |
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" |
| 2016 |
/> |
| 2017 |
</svg> |
| 2018 |
`}function $u(){return c` |
| 2019 |
<svg |
| 2020 |
class="empty" |
| 2021 |
viewBox="0 0 16 16" |
| 2022 |
fill="currentColor" |
| 2023 |
aria-hidden="true" |
| 2024 |
> |
| 2025 |
<path |
| 2026 |
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" |
| 2027 |
/> |
| 2028 |
</svg> |
| 2029 |
`}$("os-rating-summary",Go);const Au=x` ${R} ${gi}: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}}`,Pt=class Pt extends k{constructor(){super(...arguments),this._ownedAriaLabel=null}render(){return c`<div class="root" part="root"> |
| 2030 |
<div class="header" part="header" hidden> |
| 2031 |
<span class="label" part="label"></span> |
| 2032 |
<span class="percent" part="percent"></span> |
| 2033 |
</div> |
| 2034 |
<div class="track" part="track"> |
| 2035 |
<div class="fill" part="fill"></div> |
| 2036 |
</div> |
| 2037 |
</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(),o=this.hasAttribute("indeterminate")||t<=0,i=o?0:this._readValue(t),n=o?0:i/t,r=Math.round(n*100),a=this.getAttribute("label")??"",l=this.hasAttribute("show-percent"),u=e.querySelector(".fill");u&&!o?u.style.width=`${(n*100).toFixed(2)}%`:u&&o&&u.style.removeProperty("width");const h=e.querySelector(".header"),p=e.querySelector(".label"),m=e.querySelector(".percent");if(h&&p&&m){const b=a||l&&!o;h.hidden=!b,p.textContent=a,m.hidden=!(l&&!o),m.textContent=`${r}%`}this._syncAria(t,i,o,a);const _=e.querySelector(".track");_&&(_.setAttribute("role","progressbar"),_.setAttribute("aria-valuemin","0"),o?(_.removeAttribute("aria-valuenow"),_.removeAttribute("aria-valuemax")):(_.setAttribute("aria-valuemax",String(t)),_.setAttribute("aria-valuenow",String(i))),a?_.setAttribute("aria-label",a):_.removeAttribute("aria-label"))}_syncAria(e,t,o,i){this.setAttribute("role","progressbar"),this.setAttribute("aria-valuemin","0"),o?(this.removeAttribute("aria-valuenow"),this.removeAttribute("aria-valuemax")):(this.setAttribute("aria-valuemax",String(e)),this.setAttribute("aria-valuenow",String(t)));const n=this.getAttribute("aria-label");i?(n===null||n===this._ownedAriaLabel)&&(this.setAttribute("aria-label",i),this._ownedAriaLabel=i):n!==null&&n===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}};Pt.props=["value","max","indeterminate","tone","label","showPercent"],Pt.styles=[Au],Pt.help=void 0;let Xo=Pt;$("os-progress-bar",Xo);const Cu=x`: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}`,Su='input, select, textarea, [contenteditable="true"], [role="textbox"], [role="combobox"], [os-field-control]';let Eu=0;const zt=class zt extends k{constructor(){super(...arguments),this.uid=`os-field-row-${++Eu}`,this.syncControl=()=>{const e=this.control;if(!e)return;const t=this.error,o=this.hint,i=this.hasAttribute("required");let n="";t?n=`${this.uid}-error`:o&&(n=`${this.uid}-hint`);const r=(e.getAttribute("aria-describedby")??"").split(/\s+/).filter(l=>l&&!l.startsWith(this.uid)),a=n?[...r,n]:r;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"),i&&(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(Su)}render(){const e=this.label||"",t=this.hint||"",o=this.error||"",i=this.hasAttribute("required");queueMicrotask(this.syncControl);let n=null;return o?n=c`<p |
| 2038 |
class="os-field-row__error" |
| 2039 |
id="${this.uid}-error" |
| 2040 |
role="alert" |
| 2041 |
> |
| 2042 |
${o} |
| 2043 |
</p>`:t&&(n=c`<p class="os-field-row__hint" id="${this.uid}-hint"> |
| 2044 |
${t} |
| 2045 |
</p>`),c` |
| 2046 |
<div class="os-field-row__head"> |
| 2047 |
${e?c`<span |
| 2048 |
class="os-field-row__label" |
| 2049 |
id="${this.uid}-label" |
| 2050 |
@click=${this.focusControl} |
| 2051 |
> |
| 2052 |
${e}${i?c`<span |
| 2053 |
class="os-field-row__required" |
| 2054 |
aria-hidden="true" |
| 2055 |
>*</span |
| 2056 |
>`:null} |
| 2057 |
</span>`:null} |
| 2058 |
<span class="os-field-row__action"><slot name="action"></slot></span> |
| 2059 |
</div> |
| 2060 |
<div class="os-field-row__control"> |
| 2061 |
<slot @slotchange=${this.syncControl}></slot> |
| 2062 |
</div> |
| 2063 |
${n} |
| 2064 |
`}};zt.props=["label","hint","error","required","layout","control-id"],zt.styles=[Cu],zt.help=void 0;let Zo=zt;$("os-field-row",Zo);const Lu=x`: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}`,It=class It extends k{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 i=e.target?.closest?.('[slot^="row-"]')?.getAttribute("slot")?.slice(4);i&&(e.preventDefault(),this.onMove(i,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 o=Number(t);return Number.isFinite(o)?o: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(o=>o!==e)})}onMove(e,t){if(this.isDisabled)return;const o=this._keys.indexOf(e),i=o+t;if(o<0||i<0||i>=this._keys.length)return;const n=[...this._keys];n.splice(i,0,...n.splice(o,1)),this.emit("os-repeater-move",{key:e,from:o,to:i,keys:n})}render(){const e=this._keys,t=this.isDisabled,o=this.hasAttribute("reorderable"),i=this,n=i["row-label"]||"row",r=i["add-label"]||"Add row",a=i["empty-text"]||"",l=this.numeric("min"),u=this.numeric("max"),h=l===null||e.length>l,p=u===null||e.length<u;return c` |
| 2065 |
<div class="os-repeater__rows" @keydown=${this.onKeydown}> |
| 2066 |
${e.length===0?c`<div class="os-repeater__empty"> |
| 2067 |
<slot name="empty">${a}</slot> |
| 2068 |
</div>`:e.map((m,_)=>c` |
| 2069 |
<div class="os-repeater__row" data-key=${m}> |
| 2070 |
${o?c`<div class="os-repeater__handles"> |
| 2071 |
<button |
| 2072 |
type="button" |
| 2073 |
class="os-repeater__handle" |
| 2074 |
?disabled=${t||_===0} |
| 2075 |
aria-label="Move ${n} up" |
| 2076 |
@click=${()=>this.onMove(m,-1)} |
| 2077 |
> |
| 2078 |
<os-icon name="arrow-up-alt2" size="14"></os-icon> |
| 2079 |
</button> |
| 2080 |
<button |
| 2081 |
type="button" |
| 2082 |
class="os-repeater__handle" |
| 2083 |
?disabled=${t||_===e.length-1} |
| 2084 |
aria-label="Move ${n} down" |
| 2085 |
@click=${()=>this.onMove(m,1)} |
| 2086 |
> |
| 2087 |
<os-icon name="arrow-down-alt2" size="14"></os-icon> |
| 2088 |
</button> |
| 2089 |
</div>`:null} |
| 2090 |
<div class="os-repeater__content"> |
| 2091 |
<slot name="row-${m}"></slot> |
| 2092 |
</div> |
| 2093 |
<button |
| 2094 |
type="button" |
| 2095 |
class="os-repeater__remove" |
| 2096 |
?disabled=${t||!h} |
| 2097 |
aria-label="Remove ${n}" |
| 2098 |
@click=${()=>this.onRemove(m)} |
| 2099 |
> |
| 2100 |
<os-icon name="trash" size="14"></os-icon> |
| 2101 |
</button> |
| 2102 |
</div> |
| 2103 |
`)} |
| 2104 |
</div> |
| 2105 |
<div class="os-repeater__footer"> |
| 2106 |
<os-button |
| 2107 |
variant="secondary" |
| 2108 |
size="small" |
| 2109 |
?disabled=${t||!p} |
| 2110 |
@click=${this.onAdd} |
| 2111 |
>${r}</os-button |
| 2112 |
> |
| 2113 |
<slot name="footer"></slot> |
| 2114 |
</div> |
| 2115 |
`}};It.props=["add-label","empty-text","disabled","reorderable","min","max","row-label"],It.styles=[Lu],It.help=void 0;let Yo=It;$("os-repeater",Yo);const Ru=x`: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}`,Mt=class Mt extends k{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 o=t.group??"",i=e.get(o);i?i.push(t):e.set(o,[t])}return[...e.entries()].sort((t,o)=>t[0]===""?1:o[0]===""?-1:0)}preview(){let e=this._value,t=!1;for(const o of this._tokens)!o.sample||!e.includes(o.token)||(e=e.split(o.token).join(o.sample),t=!0);return t?e:null}insert(e){const t=this.field,o=this.caret??{start:this._value.length,end:this._value.length},i=this._value.slice(0,o.start),n=this._value.slice(o.end);this._value=`${i}${e.token}${n}`,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 r=i.length+e.token.length;this.caret={start:r,end:r},queueMicrotask(()=>{const a=this.field;a?.focus(),a?.setSelectionRange?.(r,r)})}render(){const e=this.label||"",t=this.hint||"",o=this.placeholder||"",i=this,n=i["insert-label"]||"Insert a value",r=i["preview-label"]||"Reads as",a=this.hasAttribute("multiline"),l=this.hasAttribute("disabled"),u=this.hasAttribute("readonly"),h=Number(this.getAttribute("rows"))||4,p=this.preview(),m=this.grouped(),_=a?c`<textarea |
| 2116 |
class="os-token-field__input" |
| 2117 |
rows=${h} |
| 2118 |
placeholder=${o} |
| 2119 |
?disabled=${l} |
| 2120 |
?readonly=${u} |
| 2121 |
.value=${this._value} |
| 2122 |
@input=${this.onInput} |
| 2123 |
@keyup=${this.rememberCaret} |
| 2124 |
@click=${this.rememberCaret} |
| 2125 |
@blur=${this.rememberCaret} |
| 2126 |
></textarea>`:c`<input |
| 2127 |
type="text" |
| 2128 |
class="os-token-field__input" |
| 2129 |
placeholder=${o} |
| 2130 |
?disabled=${l} |
| 2131 |
?readonly=${u} |
| 2132 |
.value=${this._value} |
| 2133 |
@input=${this.onInput} |
| 2134 |
@keyup=${this.rememberCaret} |
| 2135 |
@click=${this.rememberCaret} |
| 2136 |
@blur=${this.rememberCaret} |
| 2137 |
/>`;return c` |
| 2138 |
<div class="os-token-field" @keydown=${this.onKeydown}> |
| 2139 |
${e?c`<span class="os-token-field__label">${e}</span>`:null} |
| 2140 |
${_} |
| 2141 |
<div class="os-token-field__toolbar"> |
| 2142 |
<os-button |
| 2143 |
variant="ghost" |
| 2144 |
size="small" |
| 2145 |
?disabled=${l||u||m.length===0} |
| 2146 |
aria-expanded=${this.isOpen?"true":"false"} |
| 2147 |
@click=${this.toggleCatalogue} |
| 2148 |
> |
| 2149 |
<os-icon name="editor-code" size="14"></os-icon> |
| 2150 |
${n} |
| 2151 |
</os-button> |
| 2152 |
<slot name="action"></slot> |
| 2153 |
</div> |
| 2154 |
${this.isOpen?c`<div |
| 2155 |
class="os-token-field__catalogue" |
| 2156 |
role="listbox" |
| 2157 |
aria-label=${n} |
| 2158 |
> |
| 2159 |
${m.map(([b,w])=>c` |
| 2160 |
${b?c`<p class="os-token-field__group">${b}</p>`:null} |
| 2161 |
${w.map(v=>c` |
| 2162 |
<button |
| 2163 |
type="button" |
| 2164 |
role="option" |
| 2165 |
class="os-token-field__option" |
| 2166 |
@click=${()=>this.insert(v)} |
| 2167 |
> |
| 2168 |
<span class="os-token-field__option-label" |
| 2169 |
>${v.label}</span |
| 2170 |
> |
| 2171 |
<code class="os-token-field__option-token" |
| 2172 |
>${v.token}</code |
| 2173 |
> |
| 2174 |
${v.sample?c`<span class="os-token-field__option-sample" |
| 2175 |
>${v.sample}</span |
| 2176 |
>`:null} |
| 2177 |
${v.description?c`<span |
| 2178 |
class="os-token-field__option-description" |
| 2179 |
>${v.description}</span |
| 2180 |
>`:null} |
| 2181 |
</button> |
| 2182 |
`)} |
| 2183 |
`)} |
| 2184 |
</div>`:null} |
| 2185 |
${t?c`<p class="os-token-field__hint">${t}</p>`:null} |
| 2186 |
${p!==null?c`<p class="os-token-field__preview"> |
| 2187 |
<span class="os-token-field__preview-label" |
| 2188 |
>${r}</span |
| 2189 |
> |
| 2190 |
<span class="os-token-field__preview-body">${p}</span> |
| 2191 |
</p>`:null} |
| 2192 |
</div> |
| 2193 |
`}};Mt.props=["label","placeholder","hint","multiline","rows","disabled","readonly","insert-label","preview-label","open"],Mt.styles=[Ru],Mt.help=void 0;let Jo=Mt;$("os-token-field",Jo);const Tu=["os-section","os-button","os-swatch","os-swatch-grid","os-segmented","os-segment","os-select","os-option","os-multiselect","os-color-field","os-range-field","os-text-field","os-number-field","os-checkbox","os-checkbox-label","os-switch","os-toast","os-toast-container","os-tabs","os-tab","os-tabpanel","os-window-button","os-menu","os-menu-item","os-context-menu","os-context-menu-option","os-confirm-dialog","os-modal","os-user-search","os-role-picker","os-flyout","os-tab-chip","os-stack","os-cluster","os-icon","os-body","os-panel","os-row","os-grid","os-display","os-empty-state","os-key","os-code","os-badge","os-ribbon","os-tile","os-log","os-steps","os-step","os-table","os-spinner","os-relative-time","os-avatar","os-textarea","os-chip","os-tag-input","os-form","os-save-status","os-category-picker","os-crumb-chain","os-card","os-rating-summary","os-notice","os-progress-bar","os-field-row","os-repeater","os-token-field"];function Pu(s,e,t,o){const i=[s,e,...o];if(t){i.push(t.summary??"",t.status??"");const n=[t.props,t.slots,t.events,t.parts,t.cssProps];for(const r of n)for(const a of r??[]){const l=a;i.push(l.name??"",l.description??"")}}return i.join(" ").toLowerCase()}function zu(s,e){const t=e.toLowerCase().split(/\s+/).filter(Boolean);return t.length?t.every(o=>s.haystack.includes(o)):!0}function Iu(s,e){const t=e?.help?.exampleInit,o=s.querySelector(".os-settings__help-example");if(!(!t||!o)){customElements.upgrade(o);try{t(o)}catch(i){console.error(`[openstation] <${e?.tag}> exampleInit threw:`,i)}}}const Mu=["<!-- 1 — invented name, nothing close in the registry. -->","<os-example-console-fail-due-to-unregistered-component>","</os-example-console-fail-due-to-unregistered-component>","","<!-- 2 — typo within edit distance of a real tag. -->","<os-buton></os-buton>"].join(` |
| 2194 |
`);let mr=!1;function Du(){if(mr)return;mr=!0;const s=["background: #ffb400","color: #1a1a1a","font-weight: 700","font-size: 12px","padding: 4px 8px","border-radius: 3px"].join(";"),e=["color: #b25c00","font-weight: 500"].join(";");console.log(`%c⚠ wp.os — INTENTIONAL DEMO%c |
| 2195 |
The next two console.error entries are fired ON PURPOSE by the |
| 2196 |
OpenStation Preferences → Components tab to demonstrate the <os-*> missing- |
| 2197 |
import warner. They are not real bugs. |
| 2198 |
|
| 2199 |
1. <os-example-console-fail-due-to-unregistered-component> |
| 2200 |
2. <os-buton> (typo of <os-button>) |
| 2201 |
|
| 2202 |
Source: src/settings/sections/help.ts — the "Missing-import |
| 2203 |
warner — live demo" section. Remove that section in your fork |
| 2204 |
if you want a quieter Components tab.`,s,e)}function Nu(s){const e=Ou(),t=document.createElement("div");t.classList.add("os-settings__help");let o=e[0]?.tag??"",i="",n="";const r=()=>{s.state.developerModeEnabled&&Du();const l=e.filter(p=>zu(p,i)),u=l.find(p=>p.tag===o)??l[0];L(c` |
| 2205 |
<!-- |
| 2206 |
No intro card. The page header above already names the |
| 2207 |
tab and says what it is, and a count of how many |
| 2208 |
components are registered answered a question nobody |
| 2209 |
asked while costing the two panes the height they |
| 2210 |
actually need. This tab is the list; it starts at the |
| 2211 |
list. |
| 2212 |
--> |
| 2213 |
${s.state.developerModeEnabled?c` |
| 2214 |
<!-- |
| 2215 |
The sentence lives in the body rather than on the |
| 2216 |
description attribute because it has to sit BESIDE |
| 2217 |
the snippet on a wide window, and the description |
| 2218 |
renders in the os-section shadow tree — nothing in |
| 2219 |
the slot can share a row with it. |
| 2220 |
--> |
| 2221 |
<os-section |
| 2222 |
heading=${d("Missing-import warner — live demo")} |
| 2223 |
> |
| 2224 |
<div class="os-settings__help-warner"> |
| 2225 |
<p class="os-settings__help-warner-text"> |
| 2226 |
${d('Both <os-*> tags in the next piece of code are intentionally bogus, one per answer the warner has. Open the browser console: within ~2 seconds you should see two console.error entries from the framework, each pointing the developer at the fix — a name nothing in the registry comes close to, and a typo the warner can suggest a fix for ("did you mean"). Live copies of the same two tags are rendered off-screen, so the demo fires without affecting layout. Remove this section in your fork if you want a quieter Components tab.')} |
| 2227 |
</p> |
| 2228 |
<pre |
| 2229 |
class="os-settings__help-warner-code" |
| 2230 |
><code>${Mu}</code></pre> |
| 2231 |
</div> |
| 2232 |
|
| 2233 |
<!-- |
| 2234 |
The live copies. Real elements, because the |
| 2235 |
warner watches the document for tags nothing |
| 2236 |
registered — a snippet of text cannot trigger |
| 2237 |
it. Clipped rather than display:none so the |
| 2238 |
upgrade path runs exactly as it would on a |
| 2239 |
visible element. |
| 2240 |
|
| 2241 |
Case 1 — invented name, nothing close in the |
| 2242 |
registry: the "no component by that name |
| 2243 |
exists" branch. |
| 2244 |
Case 2 — typo within Levenshtein distance of a |
| 2245 |
real tag: the "Did you mean <os-button>?" |
| 2246 |
branch. |
| 2247 |
--> |
| 2248 |
<div |
| 2249 |
class="os-settings__help-warner-demo" |
| 2250 |
aria-hidden="true" |
| 2251 |
style="position:absolute;width:0;height:0;overflow:hidden;clip:rect(0 0 0 0);" |
| 2252 |
> |
| 2253 |
<os-example-console-fail-due-to-unregistered-component></os-example-console-fail-due-to-unregistered-component> |
| 2254 |
<os-buton></os-buton> |
| 2255 |
</div> |
| 2256 |
</os-section> |
| 2257 |
`:""} |
| 2258 |
|
| 2259 |
<div class="os-settings__help-layout"> |
| 2260 |
<div class="os-settings__help-sidebar"> |
| 2261 |
<os-text-field |
| 2262 |
class="os-settings__help-search" |
| 2263 |
type="search" |
| 2264 |
label=${d("Search components")} |
| 2265 |
placeholder=${d("Name, tag, prop, event…")} |
| 2266 |
autocomplete="off" |
| 2267 |
value=${i} |
| 2268 |
@os-input-change=${p=>{i=(p.detail?.value??"").trim(),r()}} |
| 2269 |
></os-text-field> |
| 2270 |
<nav |
| 2271 |
class="os-settings__help-nav" |
| 2272 |
aria-label=${d("Components")} |
| 2273 |
> |
| 2274 |
${l.length?"":c`<p |
| 2275 |
class="os-settings__help-nav-empty" |
| 2276 |
> |
| 2277 |
${d("No components match.")} |
| 2278 |
</p>`} |
| 2279 |
${l.map(p=>c` |
| 2280 |
<button |
| 2281 |
type="button" |
| 2282 |
class=${vr("os-settings__help-nav-item",p.tag===(u?.tag??"")?"is-active":"")} |
| 2283 |
aria-pressed=${p.tag===(u?.tag??"")?"true":"false"} |
| 2284 |
@click=${()=>{o=p.tag,r()}} |
| 2285 |
> |
| 2286 |
<span class="os-settings__help-nav-title" |
| 2287 |
>${p.title}</span |
| 2288 |
> |
| 2289 |
<span class="os-settings__help-nav-tag" |
| 2290 |
><${p.tag}></span |
| 2291 |
> |
| 2292 |
</button> |
| 2293 |
`)} |
| 2294 |
</nav> |
| 2295 |
</div> |
| 2296 |
<div class="os-settings__help-detail"> |
| 2297 |
${u?Hu(u):Vu()} |
| 2298 |
</div> |
| 2299 |
</div> |
| 2300 |
`,t);const h=t.querySelector(".os-settings__help-detail");h&&(u?.tag??"")!==n&&(h.scrollTop=0),n=u?.tag??"",Iu(t,u)};r();const a=window.wp?.os;if(a?.subscribeOsSettings){const l=a.subscribeOsSettings(()=>{if(!t.isConnected){l();return}r()})}return t}function Hu(s){const e=s.help,t=e?.status??"stable";return c` |
| 2301 |
<header class="os-settings__help-head"> |
| 2302 |
<h3 class="os-settings__help-title">${s.title}</h3> |
| 2303 |
<code class="os-settings__help-code" |
| 2304 |
><${s.tag}></code |
| 2305 |
> |
| 2306 |
<span |
| 2307 |
class=${vr("os-settings__help-badge",`is-${t}`)} |
| 2308 |
>${Bu(t)}</span |
| 2309 |
> |
| 2310 |
</header> |
| 2311 |
|
| 2312 |
${e?.summary?c`<p class="os-settings__help-summary"> |
| 2313 |
${e.summary} |
| 2314 |
</p>`:c``} |
| 2315 |
|
| 2316 |
${e?.example?c` |
| 2317 |
<section class="os-settings__help-group"> |
| 2318 |
<h4>${d("Example")}</h4> |
| 2319 |
<div class="os-settings__help-example"> |
| 2320 |
${e.example} |
| 2321 |
</div> |
| 2322 |
</section> |
| 2323 |
`:c``} |
| 2324 |
${qu(s,e)} ${Uu(e)} |
| 2325 |
${Fu(e)} ${Wu(e)} |
| 2326 |
${ju(e)} |
| 2327 |
${e?c``:c`<p class="os-settings__help-note"> |
| 2328 |
${d("This component has no help descriptor yet. Add `static help` to its class for a fuller reference.")} |
| 2329 |
</p>`} |
| 2330 |
`}function qu(s,e){const t=e?.props??[],o=new Set(t.map(n=>n.name)),i=s.props.filter(n=>!o.has(n));return t.length===0&&i.length===0?c``:c` |
| 2331 |
<section class="os-settings__help-group"> |
| 2332 |
<h4>${d("Props")}</h4> |
| 2333 |
<table class="os-settings__help-table"> |
| 2334 |
<thead> |
| 2335 |
<tr> |
| 2336 |
<th>${d("Name")}</th> |
| 2337 |
<th>${d("Type")}</th> |
| 2338 |
<th>${d("Default")}</th> |
| 2339 |
<th>${d("Description")}</th> |
| 2340 |
</tr> |
| 2341 |
</thead> |
| 2342 |
<tbody> |
| 2343 |
${t.map(n=>c` |
| 2344 |
<tr> |
| 2345 |
<td><code>${n.name}</code></td> |
| 2346 |
<td>${n.type??"—"}</td> |
| 2347 |
<td>${n.default??"—"}</td> |
| 2348 |
<td>${n.description??""}</td> |
| 2349 |
</tr> |
| 2350 |
`)} |
| 2351 |
${i.map(n=>c` |
| 2352 |
<tr> |
| 2353 |
<td><code>${n}</code></td> |
| 2354 |
<td>—</td> |
| 2355 |
<td>—</td> |
| 2356 |
<td> |
| 2357 |
<em |
| 2358 |
>${d("Undocumented — declared via static props.")}</em |
| 2359 |
> |
| 2360 |
</td> |
| 2361 |
</tr> |
| 2362 |
`)} |
| 2363 |
</tbody> |
| 2364 |
</table> |
| 2365 |
</section> |
| 2366 |
`}function Uu(s){return s?.slots?.length?c` |
| 2367 |
<section class="os-settings__help-group"> |
| 2368 |
<h4>${d("Slots")}</h4> |
| 2369 |
<ul class="os-settings__help-list"> |
| 2370 |
${s.slots.map(e=>c` |
| 2371 |
<li> |
| 2372 |
<code>${e.name}</code> |
| 2373 |
${e.description?c` — ${e.description}`:c``} |
| 2374 |
</li> |
| 2375 |
`)} |
| 2376 |
</ul> |
| 2377 |
</section> |
| 2378 |
`:c``}function Fu(s){return s?.events?.length?c` |
| 2379 |
<section class="os-settings__help-group"> |
| 2380 |
<h4>${d("Events")}</h4> |
| 2381 |
<ul class="os-settings__help-list"> |
| 2382 |
${s.events.map(e=>c` |
| 2383 |
<li> |
| 2384 |
<code>${e.name}</code> |
| 2385 |
${e.detail?c` — <code>${e.detail}</code>`:c``} |
| 2386 |
${e.description?c` — ${e.description}`:c``} |
| 2387 |
</li> |
| 2388 |
`)} |
| 2389 |
</ul> |
| 2390 |
</section> |
| 2391 |
`:c``}function Wu(s){return s?.parts?.length?c` |
| 2392 |
<section class="os-settings__help-group"> |
| 2393 |
<h4>${d("Shadow parts")}</h4> |
| 2394 |
<ul class="os-settings__help-list"> |
| 2395 |
${s.parts.map(e=>c` |
| 2396 |
<li> |
| 2397 |
<code>::part(${e.name})</code> |
| 2398 |
${e.description?c` — ${e.description}`:c``} |
| 2399 |
</li> |
| 2400 |
`)} |
| 2401 |
</ul> |
| 2402 |
</section> |
| 2403 |
`:c``}function ju(s){return s?.cssProps?.length?c` |
| 2404 |
<section class="os-settings__help-group"> |
| 2405 |
<h4>${d("CSS custom properties")}</h4> |
| 2406 |
<ul class="os-settings__help-list"> |
| 2407 |
${s.cssProps.map(e=>c` |
| 2408 |
<li> |
| 2409 |
<code>${e.name}</code> |
| 2410 |
${e.default?c` |
| 2411 |
(${d("default")} |
| 2412 |
<code>${e.default}</code>) |
| 2413 |
`:c``} |
| 2414 |
${e.description?c` — ${e.description}`:c``} |
| 2415 |
</li> |
| 2416 |
`)} |
| 2417 |
</ul> |
| 2418 |
</section> |
| 2419 |
`:c``}function Vu(){return c`<p>${d("No components registered.")}</p>`}function Ou(){const s=[];for(const e of Tu){const t=customElements.get(e);if(!t)continue;const o=t.help??null,i=o?.title??Ku(e),n=t.props??[];s.push({tag:e,title:i,help:o,props:n,haystack:Pu(e,i,o,n)})}return s.sort((e,t)=>e.title.localeCompare(t.title)),s}function Ku(s){const e=s.replace(/^os-/,"").replace(/-/g," ");return e.charAt(0).toUpperCase()+e.slice(1)}function Bu(s){switch(s){case"experimental":return d("Experimental");case"planned":return d("Planned");case"stable":default:return d("Stable")}}function vr(...s){return s.filter(Boolean).join(" ")}const _r=K("desktop-mode/wallpaper-registry",()=>({seed:[],listeners:new Set})),de=_r.state.seed,Qo=_r.state.listeners;function ei(s){qs("Wallpaper",Ji(s,xr),s);const e=de.findIndex(t=>t.id===s.id);e>=0?de[e]=s:de.push(s),yr()}function Gu(s){const e=de.findIndex(t=>t.id===s);e>=0&&(de.splice(e,1),yr())}function Xu(s){return Qo.add(s),()=>{Qo.delete(s)}}function yr(){const s=Array.from(Qo);for(const e of s)try{e()}catch(t){typeof console<"u"&&console.error("[openstation] wallpaper registry listener threw:",t)}}function wr(){const s=de.slice(),e=J(F.WALLPAPERS,s);return Array.isArray(e)?e.filter(Zu):(typeof console<"u"&&console.warn("[openstation] `os.wallpapers` filter returned a non-array; falling back to seed list."),s)}function ue(s){return wr().find(e=>e.id===s)}const xr=[{field:"id",message:"missing or not a non-empty string",valid:s=>typeof s.id=="string"&&s.id!==""},{field:"label",message:"missing or not a non-empty string",valid:s=>typeof s.label=="string"&&s.label!==""},{field:"preview",message:"missing or not a non-empty string",valid:s=>typeof s.preview=="string"&&s.preview!==""},{field:"type",message:'must be "css" or "canvas"',valid:s=>s.type==="css"||s.type==="canvas"},{field:"value/resolveValue/mount",message:"css types need `value` or `resolveValue`; canvas types need `mount`",valid:s=>s.type==="css"?typeof s.value=="string"||typeof s.resolveValue=="function":s.type==="canvas"?typeof s.mount=="function":!0}];function Zu(s){return Ji(s,xr).length===0}const he=K("desktop-mode/wallpaper-lazy",()=>({pending:new Map,inflight:new Map}));function Yu(s){he.state.pending.delete(s)}function Ju(s){return(window.openStationWallpapers||{})[s]??null}function Qu(s){const e=he.state.inflight.get(s);if(e)return e;const t=he.state.pending.get(s);if(!t)return Promise.resolve(null);const o=(async()=>{try{await Lc(t.scriptUrl,{translations:t.scriptTranslations,l10n:t.scriptL10n,before:t.scriptBefore,after:t.scriptAfter})}catch(n){return re(F.SHELL_ERROR,{scope:"wallpaper-script-load",id:t.id,error:n}),null}let i=Ju(t.id);if(i&&!i.description&&t.description&&(i={...i,description:t.description}),!i)return re(F.SHELL_ERROR,{scope:"wallpaper-missing-def",id:t.id,error:new Error(`[openstation] No wallpaper def on window.openStationWallpapers["${t.id}"]. Script loaded but didn't publish a def — check the plugin's enqueue + global assignment.`)}),null;try{ei(i)}catch(n){return re(F.SHELL_ERROR,{scope:"wallpaper-register",id:t.id,error:n}),null}return Yu(t.id),i})().finally(()=>{he.state.inflight.delete(s)});return he.state.inflight.set(s,o),o}async function eh(){const s=Array.from(he.state.pending.keys());s.length!==0&&await Promise.all(s.map(e=>Qu(e)))}const kr=K("desktop-mode/wallpaper-settings",()=>({values:{}}));function ti(s){return{...kr.state.values[s]??{}}}function th(s,e){kr.state.values[s]={...e},re(F.WALLPAPER_SETTINGS_CHANGED,{id:s,settings:{...e}})}async function sh(s,e,t,o){const i=new URL(s.mediaUrl);i.searchParams.set("media_type","image"),i.searchParams.set("per_page",String(Ma)),i.searchParams.set("page",String(e)),i.searchParams.set("orderby","date"),i.searchParams.set("order","desc"),i.searchParams.set("_fields","id,source_url,alt_text,title,media_details"),t&&i.searchParams.set("search",t),o&&(i.searchParams.set("openstation_min_width",String(zs)),i.searchParams.set("openstation_min_height",String(Is)));const n=await O(i.toString(),{credentials:"same-origin",headers:{"X-WP-Nonce":s.restNonce}},{source:"desktop-mode/settings/media"});if(!n.ok){let u=`HTTP ${n.status}`;try{const h=await n.json();h&&typeof h.message=="string"&&(u=h.message)}catch{}throw new Error(u)}const r=n.headers.get("X-WP-TotalPages"),a=r?parseInt(r,10):1;return{items:(await n.json()).filter(Ha),totalPages:a||1}}async function oh(s,e){const t=await O(s.mediaUrl,{method:"POST",credentials:"same-origin",headers:{"X-WP-Nonce":s.restNonce,"Content-Type":e.type,"Content-Disposition":`attachment; filename="${Na(e.name)}"`},body:e},{source:"desktop-mode/settings/media-upload"});if(!t.ok){let i=`Upload failed (HTTP ${t.status}).`;try{const n=await t.json();n&&typeof n.message=="string"&&(i=n.message)}catch{}throw new Error(i)}const o=await t.json();return{id:o.id,url:o.source_url}}function ih(s,e){const t=[],o=document.createElement("div");o.className="os-settings__tab-pane",s.config.canUpload&&t.push({key:"upload",label:d("Upload new"),render:()=>nh(s,o,e)}),t.push({key:"library",label:d("Media Library"),render:()=>rh(s,o,e)});const i=t[0].key,n=a=>{const l=a.detail.value;t.find(u=>u.key===l)?.render()},r=document.createElement("div");return L(c` |
| 2420 |
<div class="os-settings__uploader"> |
| 2421 |
<!-- |
| 2422 |
No heading. "Use your own image" is the dashed tile in |
| 2423 |
the grid above that opens this, and repeating it here |
| 2424 |
names the same thing twice within 40px. |
| 2425 |
--> |
| 2426 |
${t.length>1?c`<os-tabs |
| 2427 |
value=${i} |
| 2428 |
label=${d("Image source")} |
| 2429 |
@os-tab-change=${n} |
| 2430 |
> |
| 2431 |
${t.map(a=>c`<os-tab value=${a.key} |
| 2432 |
>${a.label}</os-tab |
| 2433 |
>`)} |
| 2434 |
</os-tabs>`:null} |
| 2435 |
${o} |
| 2436 |
</div> |
| 2437 |
`,r),t.find(a=>a.key===i)?.render(),r.firstElementChild}function nh(s,e,t){const o=document.createElement("div");o.className="os-settings__upload-tile",o.dataset.wallpaperId=V,o.setAttribute("aria-pressed",s.state.wallpaper===V?"true":"false");const i=document.createElement("input");i.type="file",i.accept="image/*",i.className="os-settings__file-input",i.addEventListener("change",()=>{const n=i.files?.[0];n&&$r(s,n,o,t),i.value=""}),L(c`${i}${o}`,e),is(s,o,i,t)}function is(s,e,t,o){e.classList.remove("os-settings__upload-tile--filled"),e.classList.remove("os-settings__upload-tile--dragover"),e.classList.remove("os-settings__upload-tile--busy"),e.removeAttribute("aria-label");const i=!!s.state.customImage;i?(e.classList.add("os-settings__upload-tile--filled"),e.setAttribute("aria-label",d("Custom image wallpaper")),e.style.backgroundImage=`url("${encodeURI(s.state.customImage.url)}")`):(e.style.backgroundImage="",e.setAttribute("aria-label",d("Upload a wallpaper image")));const n=r=>{r.stopPropagation(),s.state.customImage=null,s.state.wallpaper===V&&(s.state.wallpaper=Ri),oi(s.state),s.save(),s.apply(),is(s,e,t,o),ns(s,o)};L(i?c` |
| 2438 |
<os-button |
| 2439 |
variant="danger" |
| 2440 |
class="os-settings__upload-remove" |
| 2441 |
aria-label=${d("Remove custom image")} |
| 2442 |
@click=${n} |
| 2443 |
>${d("Remove")}</os-button |
| 2444 |
> |
| 2445 |
`:c` |
| 2446 |
<div class="os-settings__upload-inner"> |
| 2447 |
<span |
| 2448 |
class="os-settings__upload-plus" |
| 2449 |
aria-hidden="true" |
| 2450 |
>+</span |
| 2451 |
> |
| 2452 |
<span class="os-settings__upload-prompt" |
| 2453 |
>${d("Drop an image here, or click to upload")}</span |
| 2454 |
> |
| 2455 |
<span class="os-settings__upload-hint" |
| 2456 |
>${d("JPEG, PNG, or WebP · goes straight to your Media Library")}</span |
| 2457 |
> |
| 2458 |
</div> |
| 2459 |
`,e),e.onclick=()=>{if(!e.classList.contains("os-settings__upload-tile--busy")){if(s.state.customImage){Lr(s,V,o);return}t.click()}},e.ondragover=r=>{r.preventDefault(),e.classList.add("os-settings__upload-tile--dragover")},e.ondragleave=()=>{e.classList.remove("os-settings__upload-tile--dragover")},e.ondrop=r=>{r.preventDefault(),e.classList.remove("os-settings__upload-tile--dragover");const a=r.dataTransfer?.files?.[0];a&&$r(s,a,e,o)}}async function $r(s,e,t,o){if(!e.type.startsWith("image/")){Ar(t,d("That file isn’t an image."));return}t.classList.add("os-settings__upload-tile--busy"),L(c`<span class="os-settings__upload-status" |
| 2460 |
>${d("Uploading…")}</span |
| 2461 |
>`,t);const i=t.parentElement?.querySelector(".os-settings__file-input");try{const n=await oh(s.config,e);s.state.customImage={id:n.id,url:n.url},s.state.wallpaper=V,oi(s.state),s.save(),s.apply(),i&&is(s,t,i,o),ns(s,o)}catch(n){t.classList.remove("os-settings__upload-tile--busy"),i&&is(s,t,i,o);const r=n instanceof Error?n.message:d("Upload failed.");Ar(t,r)}}function Ar(s,e){let t=s.querySelector(".os-settings__upload-error");t||(t=document.createElement("span"),t.className="os-settings__upload-error",t.setAttribute("role","status"),s.appendChild(t)),t.textContent=e,window.setTimeout(()=>{t?.remove()},4e3)}function rh(s,e,t){const o=document.createElement("input");o.type="search",o.placeholder=d("Search your media"),o.className="os-settings__library-search",o.setAttribute("aria-label",d("Search media"));const i=document.createElement("div");i.className="os-settings__library-grid";const n=document.createElement("span");n.className="os-settings__library-meta";const r=document.createElement("os-button");r.setAttribute("variant","ghost"),r.textContent=d("Load more");let a="",l=0,u=0,h=[],p=0,m=!1;const _=y=>{s.state.libraryHdOnly=y.detail.checked,s.save(),g()};L(c` |
| 2462 |
<div class="os-settings__library"> |
| 2463 |
<div class="os-settings__library-toolbar"> |
| 2464 |
${o} |
| 2465 |
<os-checkbox-label |
| 2466 |
label=${j(d("Only HD (≥%1$d×%2$d)"),zs,Is)} |
| 2467 |
?checked=${s.state.libraryHdOnly} |
| 2468 |
@os-checkbox-change=${_} |
| 2469 |
></os-checkbox-label> |
| 2470 |
</div> |
| 2471 |
${i} |
| 2472 |
<div class="os-settings__library-footer"> |
| 2473 |
${n}${r} |
| 2474 |
</div> |
| 2475 |
</div> |
| 2476 |
`,e);const b=()=>{const y=Cr(s.state,h).length,A=[j(d("Showing %d"),y)];s.state.libraryHdOnly&&p>0&&A.push(j(d("%d hidden by HD filter"),p)),n.textContent=A.join(" · "),r.hidden=l>=u,m?r.setAttribute("disabled",""):r.removeAttribute("disabled")},w=()=>{const y=Cr(s.state,h);if(p=h.length-y.length,y.length===0&&!m)L(c`<p class="os-settings__library-empty"> |
| 2477 |
${s.state.libraryHdOnly?d("No HD images found. Try unchecking the filter, or upload a larger image."):d("No images in your Media Library yet.")} |
| 2478 |
</p>`,i);else{i.innerHTML="";for(const A of y)i.appendChild(ah(s,A,t))}b()},v=async()=>{if(!(m||u>0&&l>=u)){m=!0,b(),l===0&&L(c`${Array.from({length:8},()=>c`<div |
| 2479 |
class="os-settings__library-tile os-settings__library-tile--skeleton" |
| 2480 |
></div>`)}`,i);try{const y=await sh(s.config,l+1,a,s.state.libraryHdOnly);l=l+1,u=y.totalPages,h=h.concat(y.items),w()}catch(y){L(c`<p class="os-settings__library-error"> |
| 2481 |
${y instanceof Error?j(d("Couldn’t load your media: %s"),y.message):d("Couldn’t load your media.")} |
| 2482 |
</p>`,i)}finally{m=!1,b()}}},g=()=>{l=0,u=0,h=[],p=0,v()};let f=null;o.addEventListener("input",()=>{f!==null&&window.clearTimeout(f),f=window.setTimeout(()=>{f=null,a=o.value.trim(),g()},Da)}),r.addEventListener("click",()=>{v()}),v()}function Cr(s,e){return s.libraryHdOnly?e.filter(t=>t.media_details.width>=zs&&t.media_details.height>=Is):e}function ah(s,e,t){const o=s.state.wallpaper===V&&s.state.customImage?.id===e.id,i=e.media_details.sizes||{},n=i.medium?.source_url||i.thumbnail?.source_url||i.large?.source_url||e.source_url,r=e.alt_text||qa(e.title?.rendered||"")||`Image #${e.id}`,a=()=>{s.state.customImage={id:e.id,url:e.source_url},s.state.wallpaper=V,oi(s.state),s.save(),s.apply(),ns(s,t);const u=l.firstElementChild?.parentElement;u&&u.querySelectorAll("[data-media-id]").forEach(h=>{const p=h.dataset.mediaId===String(e.id);h.setAttribute("aria-pressed",p?"true":"false"),h.classList.toggle("os-settings__library-tile--selected",p)})},l=document.createElement("div");return L(c` |
| 2483 |
<button |
| 2484 |
type="button" |
| 2485 |
class=${o?"os-settings__library-tile os-settings__library-tile--selected":"os-settings__library-tile"} |
| 2486 |
data-media-id=${String(e.id)} |
| 2487 |
aria-pressed=${o?"true":"false"} |
| 2488 |
aria-label=${r} |
| 2489 |
title=${r} |
| 2490 |
style=${`background-image: url("${encodeURI(n)}")`} |
| 2491 |
@click=${a} |
| 2492 |
> |
| 2493 |
<span class="os-settings__library-tile-dims" |
| 2494 |
>${e.media_details.width}×${e.media_details.height}</span |
| 2495 |
> |
| 2496 |
</button> |
| 2497 |
`,l),l.firstElementChild}const lh=4,Sr=24,Er=4,ch=250,dh="os-settings__wallpaper-live-preview";function uh(s){const e=s.type==="canvas"?s.needs:void 0;if(!e||e.length===0)return Promise.resolve();const t=window.wp?.os;return t?.loadModules?t.loadModules(e):Promise.reject(new Error(`[openstation] Wallpaper "${s.id}" declares needs but wp.os.loadModules is unavailable.`))}function hh(){return window.openStationConfig?.pluginUrl??""}function ph(){return typeof window.matchMedia=="function"&&window.matchMedia("( prefers-reduced-motion: reduce )").matches}function fh(s){const e={...s.previewParams??{}},t=J(F.WALLPAPER_PREVIEW_PARAMS,e,s.id);return!t||typeof t!="object"?e:t}function gh(s){const e=new Map;let t=!1;const o=()=>{let f=0;return e.forEach(y=>{(y.teardown||y.mounting)&&f++}),f},i=f=>{f.remountTimer!==null&&(clearTimeout(f.remountTimer),f.remountTimer=null)},n=f=>{if(f.generation++,f.mounting=!1,i(f),f.teardown){const y=f.teardown;f.teardown=null;try{y()}catch(A){typeof console<"u"&&console.error(`[openstation] Wallpaper "${f.defId}" preview teardown threw:`,A)}}f.overlay.innerHTML=""},r=f=>{t||!f.visible||f.teardown||f.mounting||_&&(f.tile.clientWidth<Sr||f.tile.clientHeight<Sr)||a(f)},a=f=>{const y=ue(f.defId);if(!y?.renderPreview||o()>=lh)return;const A=++f.generation;f.mounting=!0,f.mountWidth=f.tile.clientWidth,f.mountHeight=f.tile.clientHeight;const M={id:y.id,pluginUrl:hh(),prefersReducedMotion:ph(),visible:!document.hidden,settings:ti(y.id),params:fh(y),width:f.mountWidth,height:f.mountHeight},oe=E=>{if(A!==f.generation||t){try{E()}catch{}return}f.mounting=!1,f.teardown=E,l(f)&&u(f)},N=E=>{A===f.generation&&(f.mounting=!1,f.overlay.innerHTML="",typeof console<"u"&&console.error(`[openstation] Wallpaper "${y.id}" renderPreview failed:`,E))};uh(y).then(()=>{if(A!==f.generation||t)return;let E;try{E=y.renderPreview(f.overlay,M)}catch(Z){N(Z);return}if(Ds(E)){E.then(oe,N);return}oe(E)},N)},l=f=>Math.abs(f.tile.clientWidth-f.mountWidth)>Er||Math.abs(f.tile.clientHeight-f.mountHeight)>Er,u=f=>{i(f),f.remountTimer=setTimeout(()=>{f.remountTimer=null,!(t||!f.teardown||!l(f))&&(n(f),r(f))},ch)},h=f=>{for(const y of f){const A=e.get(y.target);A&&(A.visible=y.isIntersecting,y.isIntersecting?r(A):n(A))}},p=typeof IntersectionObserver=="function"?new IntersectionObserver(h,{threshold:.1}):null,m=f=>{for(const y of f){const A=e.get(y.target);!A||t||(!A.teardown&&!A.mounting?r(A):A.teardown&&l(A)&&u(A))}},_=typeof ResizeObserver=="function"?new ResizeObserver(m):null,b=f=>{n(f),p?.unobserve(f.tile),_?.unobserve(f.tile),f.overlay.remove(),e.delete(f.tile)},w=()=>{if(t)return;const f=s.querySelectorAll("os-swatch[data-wallpaper-id]"),y=new Set;f.forEach(A=>{y.add(A);const M=A.dataset.wallpaperId??"",N=!!ue(M)?.renderPreview&&!!p,E=e.get(A);if(E&&(E.defId!==M||!N)&&b(E),!N||e.has(A))return;const Z=document.createElement("div");Z.className=dh,Z.setAttribute("aria-hidden","true"),A.appendChild(Z),e.set(A,{tile:A,overlay:Z,defId:M,generation:0,teardown:null,mounting:!1,visible:!1,mountWidth:0,mountHeight:0,remountTimer:null}),p.observe(A),_?.observe(A)}),e.forEach((A,M)=>{y.has(M)||b(A)})},v=()=>{t||(t=!0,e.forEach(f=>n(f)),e.clear(),p?.disconnect(),_?.disconnect(),document.removeEventListener("os-window-closed",g))},g=()=>{s.isConnected||v()};return document.addEventListener("os-window-closed",g),{sync:w,dispose:v}}function si(s){const{from:e,to:t,angle:o}=s.customGradient;return`linear-gradient(${o}deg, ${e}, ${t})`}const bh=()=>d("Mix your own two-colour gradient and set the angle — your desk, your palette.");function mh(s){ei({id:jt,label:d("Custom gradient"),type:"css",preview:si(s.state),description:bh(),resolveValue:()=>si(s.state),renderEditor:e=>_h(s,e)})}function oi(s){if(!s.customImage){Gu(V);return}const t=`url("${encodeURI(s.customImage.url)}") center/cover no-repeat, #1d2327`;ei({id:V,label:d("Custom image"),type:"css",value:t,preview:t,description:d("Any image from your media library or an upload, sized to cover the whole desk.")})}function Lr(s,e,t){s.state.wallpaper=e,s.save(),s.apply(),ns(s,t);const o=t.querySelector(".os-settings__wallpaper-config-slot");o&&ii(s,o)}function ii(s,e){const t=e.firstElementChild;if(!t)return;const o=ue(s.state.wallpaper);if(!o||typeof o.renderConfig!="function"){e.dataset.expanded="false",e.style.marginTop="";return}e.style.marginTop="12px",L(c` |
| 2498 |
<div class="os-settings__wallpaper-config"> |
| 2499 |
<os-button |
| 2500 |
variant="secondary" |
| 2501 |
@click=${()=>vh(s,o)} |
| 2502 |
> |
| 2503 |
<os-icon name="admin-generic"></os-icon> |
| 2504 |
${d("Wallpaper settings")} |
| 2505 |
</os-button> |
| 2506 |
</div> |
| 2507 |
`,t),e.dataset.expanded="true"}function vh(s,e){if(typeof e.renderConfig!="function")return;const t=document.createElement("os-modal");t.setAttribute("size","sm"),t.setAttribute("title",j(d("%s settings"),e.label));const o=document.createElement("div");o.className="os-settings__wallpaper-config-form",o.style.display="flex",o.style.flexDirection="column",o.style.gap="14px",t.appendChild(o);const i=document.createElement("os-button");i.setAttribute("slot","footer"),i.setAttribute("variant","primary"),i.textContent=d("Done"),t.appendChild(i);let n=null,r=!1;const a=()=>{if(!r){if(r=!0,n){try{n()}catch(u){typeof console<"u"&&console.error(`[openstation] Wallpaper "${e.id}" config teardown threw:`,u)}n=null}t.remove()}};i.addEventListener("click",a),t.addEventListener("os-modal-cancel",a);const l={id:e.id,pluginUrl:"",prefersReducedMotion:typeof window.matchMedia=="function"&&window.matchMedia("( prefers-reduced-motion: reduce )").matches,visible:!document.hidden,settings:ti(e.id),setSettings:u=>{const h={...s.state.wallpaperSettings[e.id]??{},...u};s.state.wallpaperSettings[e.id]=h,s.save(),th(e.id,h)}};document.body.appendChild(t),t.setAttribute("open","");try{const u=e.renderConfig(o,l);Ds(u)?u.then(h=>{if(r){try{h()}catch{}return}n=h}):n=u}catch(u){typeof console<"u"&&console.error(`[openstation] Wallpaper "${e.id}" renderConfig threw:`,u),a()}}function ns(s,e){e.querySelectorAll("[data-wallpaper-id]").forEach(t=>{const o=t.dataset.wallpaperId===s.state.wallpaper;o?t.setAttribute("selected",""):t.removeAttribute("selected"),t.setAttribute("aria-pressed",o?"true":"false")})}function ni(s,e,t){Rr(s);const o=document.createElement("div");if(o.className="os-settings__editor-slot-inner",e.textContent="",e.appendChild(o),!t.renderEditor){e.dataset.expanded="false";return}const i={id:t.id,pluginUrl:"",prefersReducedMotion:typeof window.matchMedia=="function"&&window.matchMedia("( prefers-reduced-motion: reduce )").matches,visible:!document.hidden,settings:ti(t.id)};try{const n=t.renderEditor(o,i);Ds(n)?n.then(r=>{s.activeEditorTeardown=r}):s.activeEditorTeardown=n}catch(n){typeof console<"u"&&console.error(`[openstation] Wallpaper "${t.id}" renderEditor threw:`,n)}e.dataset.expanded="true"}function Rr(s){if(s.activeEditorTeardown){try{s.activeEditorTeardown()}catch(e){typeof console<"u"&&console.error("[openstation] Wallpaper editor teardown threw:",e)}s.activeEditorTeardown=null}}function _h(s,e){e.classList.add("os-settings__gradient-editor-inner");const t=a=>{s.state.customGradient.from=a.detail.value,n()},o=a=>{s.state.customGradient.to=a.detail.value,n()},i=a=>{s.state.customGradient.angle=a.detail.value,n()},n=()=>{s.save(),s.apply(),yh(s,e),r()},r=()=>L(c` |
| 2508 |
<div class="os-settings__gradient-row"> |
| 2509 |
<os-color-field |
| 2510 |
variant="block" |
| 2511 |
label=${d("From")} |
| 2512 |
value=${s.state.customGradient.from} |
| 2513 |
@os-color-change=${t} |
| 2514 |
></os-color-field> |
| 2515 |
<os-color-field |
| 2516 |
variant="block" |
| 2517 |
label=${d("To")} |
| 2518 |
value=${s.state.customGradient.to} |
| 2519 |
@os-color-change=${o} |
| 2520 |
></os-color-field> |
| 2521 |
</div> |
| 2522 |
<os-range-field |
| 2523 |
label=${d("Angle")} |
| 2524 |
min="0" |
| 2525 |
max="360" |
| 2526 |
step="1" |
| 2527 |
suffix="°" |
| 2528 |
value=${String(s.state.customGradient.angle)} |
| 2529 |
@os-range-change=${i} |
| 2530 |
></os-range-field> |
| 2531 |
`,e);return r(),()=>{}}function yh(s,e){const o=e.closest("os-section")?.querySelector(`[data-wallpaper-id="${jt}"]`);o&&(o.style.background=si(s.state))}let Tr=null;function wh(s,e){const t=document.createElement("div");t.className="os-settings__editor-slot",t.dataset.expanded="false";const o=document.createElement("div");o.className="os-settings__editor-slot-inner",t.appendChild(o);const i=document.createElement("div");i.className="os-settings__wallpaper-config-slot",i.dataset.expanded="false";const n=document.createElement("div");n.className="os-settings__wallpaper-config-slot-inner",i.appendChild(n);const r=g=>{const f=g.detail?.value??"",y=ue(f);!y||y.id===V||(Lr(s,y.id,e),ni(s,t,y),b())},a=ih(s,e);let l=!!s.state.customImage;const u=document.createElement("div");u.className="os-settings__image-picker-slot",u.dataset.expanded=String(l);const h=document.createElement("div");h.className="os-settings__image-picker-slot-inner",h.appendChild(a),u.appendChild(h);const p=()=>{l=!l,u.dataset.expanded=String(l),b()},m=document.createElement("div");Tr?.dispose();const _=gh(m);Tr=_;const b=()=>L(c` |
| 2532 |
<os-section |
| 2533 |
heading=${d("Wallpaper")} |
| 2534 |
description=${d("The backdrop behind your windows. Pick a preset, mix your own gradient, or drop in an image.")} |
| 2535 |
> |
| 2536 |
<div |
| 2537 |
class="os-settings__grid os-settings__grid--wallpapers" |
| 2538 |
@os-pick=${r} |
| 2539 |
> |
| 2540 |
${wr().filter(g=>g.id!==V).sort((g,f)=>+(g.id===jt)-+(f.id===jt)).map(g=>c`<os-swatch |
| 2541 |
value=${g.id} |
| 2542 |
label=${g.label} |
| 2543 |
preview=${g.preview} |
| 2544 |
variant="wallpaper" |
| 2545 |
data-wallpaper-id=${g.id} |
| 2546 |
?selected=${s.state.wallpaper===g.id} |
| 2547 |
> |
| 2548 |
<span class="os-settings__swatch-label" |
| 2549 |
>${g.label}</span |
| 2550 |
> |
| 2551 |
</os-swatch>`)} |
| 2552 |
<!-- |
| 2553 |
Your own image, as a tile in the grid rather |
| 2554 |
than as a heading under it. It is one of the |
| 2555 |
ways to answer "what is behind my windows", |
| 2556 |
so it belongs in the row of answers; dashed |
| 2557 |
because it is the only one that cannot show |
| 2558 |
you what you are picking until you have |
| 2559 |
picked it. |
| 2560 |
--> |
| 2561 |
<button |
| 2562 |
type="button" |
| 2563 |
class="os-settings__wallpaper-add" |
| 2564 |
aria-expanded=${l?"true":"false"} |
| 2565 |
@click=${p} |
| 2566 |
> |
| 2567 |
<span |
| 2568 |
class="os-settings__wallpaper-add-plus" |
| 2569 |
aria-hidden="true" |
| 2570 |
>+</span |
| 2571 |
> |
| 2572 |
<span>${d("Use your own image")}</span> |
| 2573 |
</button> |
| 2574 |
</div> |
| 2575 |
${i} ${t} |
| 2576 |
${u} |
| 2577 |
</os-section> |
| 2578 |
`,m);b(),_.sync();const w=ue(s.state.wallpaper);w&&ni(s,t,w),ii(s,i);const v=Xu(()=>{if(!m.isConnected){v(),_.dispose();return}b(),_.sync();const g=ue(s.state.wallpaper);g&&ni(s,t,g),ii(s,i)});return eh(),m}function xh(s,e){return s.capability&&s.capability==="manage_options"?e:!0}function Pr(s){return s<20?1:s<40?2:3}const kh=["heading","description","label","placeholder"];function pe(s,e=""){return c` |
| 2579 |
<header class="os-settings__page-header"> |
| 2580 |
<h2 class="os-settings__page-title">${s}</h2> |
| 2581 |
${e?c`<p class="os-settings__page-description"> |
| 2582 |
${e} |
| 2583 |
</p>`:c``} |
| 2584 |
</header> |
| 2585 |
`}function $h(s,e){mh(s),Rr(s),s.tabRegistryUnsubscribe&&(s.tabRegistryUnsubscribe(),s.tabRegistryUnsubscribe=null),e.classList.add("os-settings");const t=()=>{const b=s.state.customImage;s.state={...Va(),customImage:b},s.save(),s.apply(),s.renderPanel(e)},o=s.config.isAdmin,i=Ba().filter(b=>xh(b,o)),n=[{id:"appearance",order:10,label:d("Appearance"),panel:c`<os-tabpanel for="appearance"> |
| 2586 |
<os-panel> |
| 2587 |
${pe(d("Appearance"),d("Personalize your desktop. Changes apply instantly and are saved to this browser."))} |
| 2588 |
<!-- |
| 2589 |
Accent first. It is one row of swatches and the |
| 2590 |
fastest thing on the page to change, where the |
| 2591 |
wallpaper grid below it is fourteen tiles deep. |
| 2592 |
Under the grid it fell below the fold on a short |
| 2593 |
window and read as an afterthought to it. |
| 2594 |
--> |
| 2595 |
${ul(s)} |
| 2596 |
${wh(s,e)} |
| 2597 |
${kc(s)} |
| 2598 |
${Tc(s)} |
| 2599 |
${pl(s)} |
| 2600 |
</os-panel> |
| 2601 |
</os-tabpanel>`},{id:"windows",order:18,label:d("Windows"),panel:c`<os-tabpanel for="windows"> |
| 2602 |
<os-panel> |
| 2603 |
${pe(d("Windows"),d("How windows look, how they arrive, and how they behave when they are not the one you are using."))} |
| 2604 |
${$c(s)} |
| 2605 |
${Nc(s)} |
| 2606 |
</os-panel> |
| 2607 |
</os-tabpanel>`},{id:"features",order:30,label:d("Features"),panel:c`<os-tabpanel for="features"> |
| 2608 |
<os-panel> |
| 2609 |
${pe(d("Features"),d("The assistant, the developer tools, and the betas. Every switch here affects only your account and takes effect immediately."))} |
| 2610 |
${Qc(s)} |
| 2611 |
${o?Hc(s):""} |
| 2612 |
</os-panel> |
| 2613 |
</os-tabpanel>`},{id:"themes",order:12,label:d("Themes"),panel:c`<os-tabpanel for="themes"> |
| 2614 |
<os-panel> |
| 2615 |
${pe(d("Themes"),d("A desktop theme repaints every token at once. A coarser version of what Appearance does one control at a time."))} |
| 2616 |
${dc(s)} |
| 2617 |
</os-panel> |
| 2618 |
</os-tabpanel>`},{id:"navigation",order:22,label:d("Navigation"),panel:c`<os-tabpanel for="navigation"> |
| 2619 |
<os-panel> |
| 2620 |
<!-- |
| 2621 |
No description here. The page's opening |
| 2622 |
sentence names the rails the user is |
| 2623 |
actually looking at, which the split layout |
| 2624 |
changes, so the section owns it — that is |
| 2625 |
the node that repaints on a settings change. |
| 2626 |
--> |
| 2627 |
${pe(d("Navigation"))} |
| 2628 |
${wc(s)} |
| 2629 |
</os-panel> |
| 2630 |
</os-tabpanel>`}];o&&n.push({id:"help",order:40,label:d("Components"),panel:c`<os-tabpanel for="help"> |
| 2631 |
<os-panel> |
| 2632 |
${pe(d("Components"),d("Every <os-*> web component shipped by this plugin, with its props, slots, and a live example."))} |
| 2633 |
${Nu(s)} |
| 2634 |
</os-panel> |
| 2635 |
</os-tabpanel>`}),n.push({id:"about",order:Number.MAX_SAFE_INTEGER,label:d("About"),panel:c`<os-tabpanel for="about"> |
| 2636 |
<os-panel padding="0">${sl()}</os-panel> |
| 2637 |
</os-tabpanel>`});for(const b of i){const w=`ext-${b.id}`,v=`os-settings-tab-host-${b.id}`,g=b;n.push({id:w,order:b.order??100,label:b.label,icon:Li[b.id]?.(),panel:c`<os-tabpanel for=${w}> |
| 2638 |
<os-panel><div data-host=${v}></div></os-panel> |
| 2639 |
</os-tabpanel>`,mount:f=>{const y=f.querySelector(`[data-host="${v}"]`);if(y)try{g.render(y,{isAdmin:o,getOsSettings:()=>s.getOsSettingsSnapshot(),subscribeOsSettings:A=>s.subscribeOsSettings(A)})}catch(A){typeof console<"u"&&console.error("[openstation] settings tab render threw:",g.id,A)}}})}n.sort((b,w)=>b.order-w.order);const r=s.activeTabId??"appearance",l=n.some(b=>b.id===r)?r:"appearance",u=()=>{const b=new Map;for(const w of n){const v=e.querySelector(`os-tabpanel[for="${w.id}"]`),g=[w.label,v?.textContent??""];if(v){const f=v.querySelectorAll("[heading],[description],[label],[placeholder]");for(const y of Array.from(f))for(const A of kh)g.push(y.getAttribute(A)??"")}b.set(w.id,g.join(" ").replace(/\s+/g," ").toLowerCase())}return b};let h=null;const p=b=>{const w=b.target.value.trim().toLowerCase();h=h??u();let v=0;for(const f of Array.from(e.querySelectorAll(":scope > os-tabs > os-tab"))){const y=f.getAttribute("value")??"",A=w===""||(h.get(y)??"").includes(w);f.toggleAttribute("data-search-hidden",!A),A&&v++}const g=e.querySelector(".os-settings__search-empty");g&&(g.hidden=v>0)};L(c` |
| 2640 |
<div class="os-settings__search"> |
| 2641 |
<label class="os-settings__search-field"> |
| 2642 |
${z("search",{size:null})} |
| 2643 |
<input |
| 2644 |
type="search" |
| 2645 |
class="os-settings__search-input" |
| 2646 |
placeholder=${d("Search settings")} |
| 2647 |
aria-label=${d("Search settings")} |
| 2648 |
aria-controls="os-settings-nav" |
| 2649 |
@input=${p} |
| 2650 |
/> |
| 2651 |
</label> |
| 2652 |
</div> |
| 2653 |
<os-tabs |
| 2654 |
id="os-settings-nav" |
| 2655 |
orientation="vertical" |
| 2656 |
value=${l} |
| 2657 |
label=${d("Settings sections")} |
| 2658 |
> |
| 2659 |
${n.map((b,w)=>{const v=w>0&&Pr(b.order)!==Pr(n[w-1].order);return c`<os-tab |
| 2660 |
value=${b.id} |
| 2661 |
data-group-start=${v?"true":null} |
| 2662 |
>${Li[b.id]?.()??b.icon??c`<span |
| 2663 |
class="os-settings__nav-glyph-blank" |
| 2664 |
aria-hidden="true" |
| 2665 |
></span>`}${b.label}</os-tab |
| 2666 |
>`})} |
| 2667 |
</os-tabs> |
| 2668 |
<p class="os-settings__search-empty" hidden> |
| 2669 |
${d("No settings match that.")} |
| 2670 |
</p> |
| 2671 |
<os-panel class="os-settings__footer"> |
| 2672 |
<os-button variant="ghost" @click=${t} |
| 2673 |
>${d("Reset to defaults")}</os-button |
| 2674 |
> |
| 2675 |
</os-panel> |
| 2676 |
${n.map(b=>b.panel)} |
| 2677 |
`,e);for(const b of n)b.mount&&b.mount(e);const m=e.querySelector("os-tabs");if(m){s.tabChangeAbort?.abort();const b=new AbortController;s.tabChangeAbort=b,m.addEventListener("os-tab-change",w=>{const v=w.detail;v?.value&&(s.activeTabId=v.value)},{signal:b.signal})}const _=e.closest(".os-window");_&&Ia(_,[]),s.activeTabId=l,s.tabRegistryUnsubscribe=Ga(()=>{if(!e.isConnected){s.tabRegistryUnsubscribe&&(s.tabRegistryUnsubscribe(),s.tabRegistryUnsubscribe=null);return}s.renderPanel(e)})}window.openStationRenderOsSettingsPanel=$h})(); |
| 2678 |
|
