media-show
Version:
Showcase your media player in style!
513 lines (447 loc) • 117 kB
JavaScript
(()=>{var Ko=Object.defineProperty;var Xo=(t,e,i)=>e in t?Ko(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i;var H=(t,e,i)=>(Xo(t,typeof e!="symbol"?e+"":e,i),i);var Le=window.ShadowRoot&&(window.ShadyCSS===void 0||window.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,Re=Symbol(),mi=new Map,Ei=class{constructor(t,e){if(this._$cssResult$=!0,e!==Re)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t}get styleSheet(){let t=mi.get(this.cssText);return Le&&t===void 0&&(mi.set(this.cssText,t=new CSSStyleSheet),t.replaceSync(this.cssText)),t}toString(){return this.cssText}},ze=t=>new Ei(typeof t=="string"?t:t+"",Re),T=(t,...e)=>{let i=t.length===1?t[0]:e.reduce((o,r,s)=>o+(n=>{if(n._$cssResult$===!0)return n.cssText;if(typeof n=="number")return n;throw Error("Value passed to 'css' function must be a 'css' function result: "+n+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(r)+t[s+1],t[0]);return new Ei(i,Re)},Yo=(t,e)=>{Le?t.adoptedStyleSheets=e.map(i=>i instanceof CSSStyleSheet?i:i.styleSheet):e.forEach(i=>{let o=document.createElement("style"),r=window.litNonce;r!==void 0&&o.setAttribute("nonce",r),o.textContent=i.cssText,t.appendChild(o)})},fi=Le?t=>t:t=>t instanceof CSSStyleSheet?(e=>{let i="";for(let o of e.cssRules)i+=o.cssText;return ze(i)})(t):t,ke,gi=window.trustedTypes,Jo=gi?gi.emptyScript:"",vi=window.reactiveElementPolyfillSupport,Pe={toAttribute(t,e){switch(e){case Boolean:t=t?Jo:null;break;case Object:case Array:t=t==null?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=t!==null;break;case Number:i=t===null?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch{i=null}}return i}},Si=(t,e)=>e!==t&&(e==e||t==t),Ee={attribute:!0,type:String,converter:Pe,reflect:!1,hasChanged:Si},wt=class extends HTMLElement{constructor(){super(),this._$Et=new Map,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Ei=null,this.o()}static addInitializer(t){var e;(e=this.l)!==null&&e!==void 0||(this.l=[]),this.l.push(t)}static get observedAttributes(){this.finalize();let t=[];return this.elementProperties.forEach((e,i)=>{let o=this._$Eh(i,e);o!==void 0&&(this._$Eu.set(o,i),t.push(o))}),t}static createProperty(t,e=Ee){if(e.state&&(e.attribute=!1),this.finalize(),this.elementProperties.set(t,e),!e.noAccessor&&!this.prototype.hasOwnProperty(t)){let i=typeof t=="symbol"?Symbol():"__"+t,o=this.getPropertyDescriptor(t,i,e);o!==void 0&&Object.defineProperty(this.prototype,t,o)}}static getPropertyDescriptor(t,e,i){return{get(){return this[e]},set(o){let r=this[t];this[e]=o,this.requestUpdate(t,r,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)||Ee}static finalize(){if(this.hasOwnProperty("finalized"))return!1;this.finalized=!0;let t=Object.getPrototypeOf(this);if(t.finalize(),this.elementProperties=new Map(t.elementProperties),this._$Eu=new Map,this.hasOwnProperty("properties")){let e=this.properties,i=[...Object.getOwnPropertyNames(e),...Object.getOwnPropertySymbols(e)];for(let o of i)this.createProperty(o,e[o])}return this.elementStyles=this.finalizeStyles(this.styles),!0}static finalizeStyles(t){let e=[];if(Array.isArray(t)){let i=new Set(t.flat(1/0).reverse());for(let o of i)e.unshift(fi(o))}else t!==void 0&&e.push(fi(t));return e}static _$Eh(t,e){let i=e.attribute;return i===!1?void 0:typeof i=="string"?i:typeof t=="string"?t.toLowerCase():void 0}o(){var t;this._$Ep=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$Em(),this.requestUpdate(),(t=this.constructor.l)===null||t===void 0||t.forEach(e=>e(this))}addController(t){var e,i;((e=this._$Eg)!==null&&e!==void 0?e:this._$Eg=[]).push(t),this.renderRoot!==void 0&&this.isConnected&&((i=t.hostConnected)===null||i===void 0||i.call(t))}removeController(t){var e;(e=this._$Eg)===null||e===void 0||e.splice(this._$Eg.indexOf(t)>>>0,1)}_$Em(){this.constructor.elementProperties.forEach((t,e)=>{this.hasOwnProperty(e)&&(this._$Et.set(e,this[e]),delete this[e])})}createRenderRoot(){var t;let e=(t=this.shadowRoot)!==null&&t!==void 0?t:this.attachShadow(this.constructor.shadowRootOptions);return Yo(e,this.constructor.elementStyles),e}connectedCallback(){var t;this.renderRoot===void 0&&(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(t=this._$Eg)===null||t===void 0||t.forEach(e=>{var i;return(i=e.hostConnected)===null||i===void 0?void 0:i.call(e)})}enableUpdating(t){}disconnectedCallback(){var t;(t=this._$Eg)===null||t===void 0||t.forEach(e=>{var i;return(i=e.hostDisconnected)===null||i===void 0?void 0:i.call(e)})}attributeChangedCallback(t,e,i){this._$AK(t,i)}_$ES(t,e,i=Ee){var o,r;let s=this.constructor._$Eh(t,i);if(s!==void 0&&i.reflect===!0){let n=((r=(o=i.converter)===null||o===void 0?void 0:o.toAttribute)!==null&&r!==void 0?r:Pe.toAttribute)(e,i.type);this._$Ei=t,n==null?this.removeAttribute(s):this.setAttribute(s,n),this._$Ei=null}}_$AK(t,e){var i,o,r;let s=this.constructor,n=s._$Eu.get(t);if(n!==void 0&&this._$Ei!==n){let l=s.getPropertyOptions(n),a=l.converter,u=(r=(o=(i=a)===null||i===void 0?void 0:i.fromAttribute)!==null&&o!==void 0?o:typeof a=="function"?a:null)!==null&&r!==void 0?r:Pe.fromAttribute;this._$Ei=n,this[n]=u(e,l.type),this._$Ei=null}}requestUpdate(t,e,i){let o=!0;t!==void 0&&(((i=i||this.constructor.getPropertyOptions(t)).hasChanged||Si)(this[t],e)?(this._$AL.has(t)||this._$AL.set(t,e),i.reflect===!0&&this._$Ei!==t&&(this._$E_===void 0&&(this._$E_=new Map),this._$E_.set(t,i))):o=!1),!this.isUpdatePending&&o&&(this._$Ep=this._$EC())}async _$EC(){this.isUpdatePending=!0;try{await this._$Ep}catch(e){Promise.reject(e)}let t=this.scheduleUpdate();return t!=null&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var t;if(!this.isUpdatePending)return;this.hasUpdated,this._$Et&&(this._$Et.forEach((o,r)=>this[r]=o),this._$Et=void 0);let e=!1,i=this._$AL;try{e=this.shouldUpdate(i),e?(this.willUpdate(i),(t=this._$Eg)===null||t===void 0||t.forEach(o=>{var r;return(r=o.hostUpdate)===null||r===void 0?void 0:r.call(o)}),this.update(i)):this._$EU()}catch(o){throw e=!1,this._$EU(),o}e&&this._$AE(i)}willUpdate(t){}_$AE(t){var e;(e=this._$Eg)===null||e===void 0||e.forEach(i=>{var o;return(o=i.hostUpdated)===null||o===void 0?void 0:o.call(i)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EU(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$Ep}shouldUpdate(t){return!0}update(t){this._$E_!==void 0&&(this._$E_.forEach((e,i)=>this._$ES(i,this[i],e)),this._$E_=void 0),this._$EU()}updated(t){}firstUpdated(t){}};wt.finalized=!0,wt.elementProperties=new Map,wt.elementStyles=[],wt.shadowRootOptions={mode:"open"},vi?.({ReactiveElement:wt}),((ke=globalThis.reactiveElementVersions)!==null&&ke!==void 0?ke:globalThis.reactiveElementVersions=[]).push("1.2.3");var Se,xt=globalThis.trustedTypes,bi=xt?xt.createPolicy("lit-html",{createHTML:t=>t}):void 0,rt=`lit$${(Math.random()+"").slice(9)}$`,Ci="?"+rt,Qo=`<${Ci}>`,$t=document,Lt=(t="")=>$t.createComment(t),Rt=t=>t===null||typeof t!="object"&&typeof t!="function",Ti=Array.isArray,Zo=t=>{var e;return Ti(t)||typeof((e=t)===null||e===void 0?void 0:e[Symbol.iterator])=="function"},Pt=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,yi=/-->/g,wi=/>/g,ht=/>|[ \n \r](?:([^\s"'>=/]+)([ \n \r]*=[ \n \r]*(?:[^ \n \r"'`<>=]|("|')|))|$)/g,_i=/'/g,xi=/"/g,Pi=/^(?:script|style|textarea|title)$/i,Li=t=>(e,...i)=>({_$litType$:t,strings:e,values:i}),A=Li(1),Is=Li(2),D=Symbol.for("lit-noChange"),x=Symbol.for("lit-nothing"),$i=new WeakMap,Go=(t,e,i)=>{var o,r;let s=(o=i?.renderBefore)!==null&&o!==void 0?o:e,n=s._$litPart$;if(n===void 0){let l=(r=i?.renderBefore)!==null&&r!==void 0?r:null;s._$litPart$=n=new Wt(e.insertBefore(Lt(),l),l,void 0,i??{})}return n._$AI(t),n},_t=$t.createTreeWalker($t,129,null,!1),tr=(t,e)=>{let i=t.length-1,o=[],r,s=e===2?"<svg>":"",n=Pt;for(let a=0;a<i;a++){let u=t[a],h,p,m=-1,w=0;for(;w<u.length&&(n.lastIndex=w,p=n.exec(u),p!==null);)w=n.lastIndex,n===Pt?p[1]==="!--"?n=yi:p[1]!==void 0?n=wi:p[2]!==void 0?(Pi.test(p[2])&&(r=RegExp("</"+p[2],"g")),n=ht):p[3]!==void 0&&(n=ht):n===ht?p[0]===">"?(n=r??Pt,m=-1):p[1]===void 0?m=-2:(m=n.lastIndex-p[2].length,h=p[1],n=p[3]===void 0?ht:p[3]==='"'?xi:_i):n===xi||n===_i?n=ht:n===yi||n===wi?n=Pt:(n=ht,r=void 0);let _=n===ht&&t[a+1].startsWith("/>")?" ":"";s+=n===Pt?u+Qo:m>=0?(o.push(h),u.slice(0,m)+"$lit$"+u.slice(m)+rt+_):u+rt+(m===-2?(o.push(void 0),a):_)}let l=s+(t[i]||"<?>")+(e===2?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[bi!==void 0?bi.createHTML(l):l,o]},qt=class{constructor({strings:t,_$litType$:e},i){let o;this.parts=[];let r=0,s=0,n=t.length-1,l=this.parts,[a,u]=tr(t,e);if(this.el=qt.createElement(a,i),_t.currentNode=this.el.content,e===2){let h=this.el.content,p=h.firstChild;p.remove(),h.append(...p.childNodes)}for(;(o=_t.nextNode())!==null&&l.length<n;){if(o.nodeType===1){if(o.hasAttributes()){let h=[];for(let p of o.getAttributeNames())if(p.endsWith("$lit$")||p.startsWith(rt)){let m=u[s++];if(h.push(p),m!==void 0){let w=o.getAttribute(m.toLowerCase()+"$lit$").split(rt),_=/([.?@])?(.*)/.exec(m);l.push({type:1,index:r,name:_[2],strings:w,ctor:_[1]==="."?ir:_[1]==="?"?rr:_[1]==="@"?sr:Kt})}else l.push({type:6,index:r})}for(let p of h)o.removeAttribute(p)}if(Pi.test(o.tagName)){let h=o.textContent.split(rt),p=h.length-1;if(p>0){o.textContent=xt?xt.emptyScript:"";for(let m=0;m<p;m++)o.append(h[m],Lt()),_t.nextNode(),l.push({type:2,index:++r});o.append(h[p],Lt())}}}else if(o.nodeType===8)if(o.data===Ci)l.push({type:2,index:r});else{let h=-1;for(;(h=o.data.indexOf(rt,h+1))!==-1;)l.push({type:7,index:r}),h+=rt.length-1}r++}}static createElement(t,e){let i=$t.createElement("template");return i.innerHTML=t,i}};function At(t,e,i=t,o){var r,s,n,l;if(e===D)return e;let a=o!==void 0?(r=i._$Cl)===null||r===void 0?void 0:r[o]:i._$Cu,u=Rt(e)?void 0:e._$litDirective$;return a?.constructor!==u&&((s=a?._$AO)===null||s===void 0||s.call(a,!1),u===void 0?a=void 0:(a=new u(t),a._$AT(t,i,o)),o!==void 0?((n=(l=i)._$Cl)!==null&&n!==void 0?n:l._$Cl=[])[o]=a:i._$Cu=a),a!==void 0&&(e=At(t,a._$AS(t,e.values),a,o)),e}var er=class{constructor(t,e){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=e}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var e;let{el:{content:i},parts:o}=this._$AD,r=((e=t?.creationScope)!==null&&e!==void 0?e:$t).importNode(i,!0);_t.currentNode=r;let s=_t.nextNode(),n=0,l=0,a=o[0];for(;a!==void 0;){if(n===a.index){let u;a.type===2?u=new Wt(s,s.nextSibling,this,t):a.type===1?u=new a.ctor(s,a.name,a.strings,this,t):a.type===6&&(u=new nr(s,this,t)),this.v.push(u),a=o[++l]}n!==a?.index&&(s=_t.nextNode(),n++)}return r}m(t){let e=0;for(let i of this.v)i!==void 0&&(i.strings!==void 0?(i._$AI(t,i,e),e+=i.strings.length-2):i._$AI(t[e])),e++}},Wt=class{constructor(t,e,i,o){var r;this.type=2,this._$AH=x,this._$AN=void 0,this._$AA=t,this._$AB=e,this._$AM=i,this.options=o,this._$Cg=(r=o?.isConnected)===null||r===void 0||r}get _$AU(){var t,e;return(e=(t=this._$AM)===null||t===void 0?void 0:t._$AU)!==null&&e!==void 0?e:this._$Cg}get parentNode(){let t=this._$AA.parentNode,e=this._$AM;return e!==void 0&&t.nodeType===11&&(t=e.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,e=this){t=At(this,t,e),Rt(t)?t===x||t==null||t===""?(this._$AH!==x&&this._$AR(),this._$AH=x):t!==this._$AH&&t!==D&&this.$(t):t._$litType$!==void 0?this.T(t):t.nodeType!==void 0?this.S(t):Zo(t)?this.A(t):this.$(t)}M(t,e=this._$AB){return this._$AA.parentNode.insertBefore(t,e)}S(t){this._$AH!==t&&(this._$AR(),this._$AH=this.M(t))}$(t){this._$AH!==x&&Rt(this._$AH)?this._$AA.nextSibling.data=t:this.S($t.createTextNode(t)),this._$AH=t}T(t){var e;let{values:i,_$litType$:o}=t,r=typeof o=="number"?this._$AC(t):(o.el===void 0&&(o.el=qt.createElement(o.h,this.options)),o);if(((e=this._$AH)===null||e===void 0?void 0:e._$AD)===r)this._$AH.m(i);else{let s=new er(r,this),n=s.p(this.options);s.m(i),this.S(n),this._$AH=s}}_$AC(t){let e=$i.get(t.strings);return e===void 0&&$i.set(t.strings,e=new qt(t)),e}A(t){Ti(this._$AH)||(this._$AH=[],this._$AR());let e=this._$AH,i,o=0;for(let r of t)o===e.length?e.push(i=new Wt(this.M(Lt()),this.M(Lt()),this,this.options)):i=e[o],i._$AI(r),o++;o<e.length&&(this._$AR(i&&i._$AB.nextSibling,o),e.length=o)}_$AR(t=this._$AA.nextSibling,e){var i;for((i=this._$AP)===null||i===void 0||i.call(this,!1,!0,e);t&&t!==this._$AB;){let o=t.nextSibling;t.remove(),t=o}}setConnected(t){var e;this._$AM===void 0&&(this._$Cg=t,(e=this._$AP)===null||e===void 0||e.call(this,t))}},Kt=class{constructor(t,e,i,o,r){this.type=1,this._$AH=x,this._$AN=void 0,this.element=t,this.name=e,this._$AM=o,this.options=r,i.length>2||i[0]!==""||i[1]!==""?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=x}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,e=this,i,o){let r=this.strings,s=!1;if(r===void 0)t=At(this,t,e,0),s=!Rt(t)||t!==this._$AH&&t!==D,s&&(this._$AH=t);else{let n=t,l,a;for(t=r[0],l=0;l<r.length-1;l++)a=At(this,n[i+l],e,l),a===D&&(a=this._$AH[l]),s||(s=!Rt(a)||a!==this._$AH[l]),a===x?t=x:t!==x&&(t+=(a??"")+r[l+1]),this._$AH[l]=a}s&&!o&&this.k(t)}k(t){t===x?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}},ir=class extends Kt{constructor(){super(...arguments),this.type=3}k(t){this.element[this.name]=t===x?void 0:t}},or=xt?xt.emptyScript:"",rr=class extends Kt{constructor(){super(...arguments),this.type=4}k(t){t&&t!==x?this.element.setAttribute(this.name,or):this.element.removeAttribute(this.name)}},sr=class extends Kt{constructor(t,e,i,o,r){super(t,e,i,o,r),this.type=5}_$AI(t,e=this){var i;if((t=(i=At(this,t,e,0))!==null&&i!==void 0?i:x)===D)return;let o=this._$AH,r=t===x&&o!==x||t.capture!==o.capture||t.once!==o.once||t.passive!==o.passive,s=t!==x&&(o===x||r);r&&this.element.removeEventListener(this.name,this,o),s&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var e,i;typeof this._$AH=="function"?this._$AH.call((i=(e=this.options)===null||e===void 0?void 0:e.host)!==null&&i!==void 0?i:this.element,t):this._$AH.handleEvent(t)}},nr=class{constructor(t,e,i){this.element=t,this.type=6,this._$AN=void 0,this._$AM=e,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(t){At(this,t)}},Ai=window.litHtmlPolyfillSupport;Ai?.(qt,Wt),((Se=globalThis.litHtmlVersions)!==null&&Se!==void 0?Se:globalThis.litHtmlVersions=[]).push("2.1.3");var Ce,Te,C=class extends wt{constructor(){super(...arguments),this.renderOptions={host:this},this._$Dt=void 0}createRenderRoot(){var t,e;let i=super.createRenderRoot();return(t=(e=this.renderOptions).renderBefore)!==null&&t!==void 0||(e.renderBefore=i.firstChild),i}update(t){let e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Dt=Go(e,this.renderRoot,this.renderOptions)}connectedCallback(){var t;super.connectedCallback(),(t=this._$Dt)===null||t===void 0||t.setConnected(!0)}disconnectedCallback(){var t;super.disconnectedCallback(),(t=this._$Dt)===null||t===void 0||t.setConnected(!1)}render(){return D}};C.finalized=!0,C._$litElement$=!0,(Ce=globalThis.litElementHydrateSupport)===null||Ce===void 0||Ce.call(globalThis,{LitElement:C});var ki=globalThis.litElementPolyfillSupport;ki?.({LitElement:C});((Te=globalThis.litElementVersions)!==null&&Te!==void 0?Te:globalThis.litElementVersions=[]).push("3.1.2");var Ri=T`
.form-control .form-control__label {
display: none;
}
.form-control .form-control__help-text {
display: none;
}
/* Label */
.form-control--has-label .form-control__label {
display: inline-block;
color: var(--sl-input-label-color);
margin-bottom: var(--sl-spacing-3x-small);
}
.form-control--has-label.form-control--small .form-control__label {
font-size: var(--sl-input-label-font-size-small);
}
.form-control--has-label.form-control--medium .form-control__label {
font-size: var(--sl-input-label-font-size-medium);
}
.form-control--has-label.form-control--large .form-control_label {
font-size: var(--sl-input-label-font-size-large);
}
/* Help text */
.form-control--has-help-text .form-control__help-text {
display: block;
color: var(--sl-input-help-text-color);
}
.form-control--has-help-text .form-control__help-text ::slotted(*) {
margin-top: var(--sl-spacing-3x-small);
}
.form-control--has-help-text.form-control--small .form-control__help-text {
font-size: var(--sl-input-help-text-font-size-small);
}
.form-control--has-help-text.form-control--medium .form-control__help-text {
font-size: var(--sl-input-help-text-font-size-medium);
}
.form-control--has-help-text.form-control--large .form-control__help-text {
font-size: var(--sl-input-help-text-font-size-large);
}
`;var R=T`
:host {
box-sizing: border-box;
}
:host *,
:host *::before,
:host *::after {
box-sizing: inherit;
}
[hidden] {
display: none !important;
}
`;var zi=T`
${R}
${Ri}
:host {
display: block;
}
.input {
flex: 1 1 auto;
display: inline-flex;
align-items: stretch;
justify-content: start;
position: relative;
width: 100%;
font-family: var(--sl-input-font-family);
font-weight: var(--sl-input-font-weight);
letter-spacing: var(--sl-input-letter-spacing);
vertical-align: middle;
overflow: hidden;
cursor: text;
transition: var(--sl-transition-fast) color, var(--sl-transition-fast) border, var(--sl-transition-fast) box-shadow,
var(--sl-transition-fast) background-color;
}
/* Standard inputs */
.input--standard {
background-color: var(--sl-input-background-color);
border: solid var(--sl-input-border-width) var(--sl-input-border-color);
}
.input--standard:hover:not(.input--disabled) {
background-color: var(--sl-input-background-color-hover);
border-color: var(--sl-input-border-color-hover);
}
.input--standard.input--focused:not(.input--disabled) {
background-color: var(--sl-input-background-color-focus);
border-color: var(--sl-input-border-color-focus);
box-shadow: var(--sl-focus-ring);
}
.input--standard.input--focused:not(.input--disabled) .input__control {
color: var(--sl-input-color-focus);
}
.input--standard.input--disabled {
background-color: var(--sl-input-background-color-disabled);
border-color: var(--sl-input-border-color-disabled);
opacity: 0.5;
cursor: not-allowed;
}
.input--standard.input--disabled .input__control {
color: var(--sl-input-color-disabled);
}
.input--standard.input--disabled .input__control::placeholder {
color: var(--sl-input-placeholder-color-disabled);
}
/* Filled inputs */
.input--filled {
border: none;
background-color: var(--sl-input-filled-background-color);
color: var(--sl-input-color);
}
.input--filled:hover:not(.input--disabled) {
background-color: var(--sl-input-filled-background-color-hover);
}
.input--filled.input--focused:not(.input--disabled) {
background-color: var(--sl-input-filled-background-color-focus);
box-shadow: var(--sl-focus-ring);
}
.input--filled.input--disabled {
background-color: var(--sl-input-filled-background-color-disabled);
opacity: 0.5;
cursor: not-allowed;
}
.input__control {
flex: 1 1 auto;
font-family: inherit;
font-size: inherit;
font-weight: inherit;
min-width: 0;
height: 100%;
color: var(--sl-input-color);
border: none;
background: none;
box-shadow: none;
padding: 0;
margin: 0;
cursor: inherit;
-webkit-appearance: none;
}
.input__control::-webkit-search-decoration,
.input__control::-webkit-search-cancel-button,
.input__control::-webkit-search-results-button,
.input__control::-webkit-search-results-decoration {
-webkit-appearance: none;
}
.input__control:-webkit-autofill,
.input__control:-webkit-autofill:hover,
.input__control:-webkit-autofill:focus,
.input__control:-webkit-autofill:active {
box-shadow: 0 0 0 var(--sl-input-height-large) var(--sl-input-background-color-hover) inset !important;
-webkit-text-fill-color: var(--sl-color-primary-500);
caret-color: var(--sl-input-color);
}
.input--filled .input__control:-webkit-autofill,
.input--filled .input__control:-webkit-autofill:hover,
.input--filled .input__control:-webkit-autofill:focus,
.input--filled .input__control:-webkit-autofill:active {
box-shadow: 0 0 0 var(--sl-input-height-large) var(--sl-input-filled-background-color) inset !important;
}
.input__control::placeholder {
color: var(--sl-input-placeholder-color);
user-select: none;
}
.input:hover:not(.input--disabled) .input__control {
color: var(--sl-input-color-hover);
}
.input__control:focus {
outline: none;
}
.input__prefix,
.input__suffix {
display: inline-flex;
flex: 0 0 auto;
align-items: center;
cursor: default;
}
.input__prefix ::slotted(sl-icon),
.input__suffix ::slotted(sl-icon) {
color: var(--sl-input-icon-color);
}
/*
* Size modifiers
*/
.input--small {
border-radius: var(--sl-input-border-radius-small);
font-size: var(--sl-input-font-size-small);
height: var(--sl-input-height-small);
}
.input--small .input__control {
height: calc(var(--sl-input-height-small) - var(--sl-input-border-width) * 2);
padding: 0 var(--sl-input-spacing-small);
}
.input--small .input__clear,
.input--small .input__password-toggle {
width: calc(1em + var(--sl-input-spacing-small) * 2);
}
.input--small .input__prefix ::slotted(*) {
padding-left: var(--sl-input-spacing-small);
}
.input--small .input__suffix ::slotted(*) {
padding-right: var(--sl-input-spacing-small);
}
.input--medium {
border-radius: var(--sl-input-border-radius-medium);
font-size: var(--sl-input-font-size-medium);
height: var(--sl-input-height-medium);
}
.input--medium .input__control {
height: calc(var(--sl-input-height-medium) - var(--sl-input-border-width) * 2);
padding: 0 var(--sl-input-spacing-medium);
}
.input--medium .input__clear,
.input--medium .input__password-toggle {
width: calc(1em + var(--sl-input-spacing-medium) * 2);
}
.input--medium .input__prefix ::slotted(*) {
padding-left: var(--sl-input-spacing-medium);
}
.input--medium .input__suffix ::slotted(*) {
padding-right: var(--sl-input-spacing-medium);
}
.input--large {
border-radius: var(--sl-input-border-radius-large);
font-size: var(--sl-input-font-size-large);
height: var(--sl-input-height-large);
}
.input--large .input__control {
height: calc(var(--sl-input-height-large) - var(--sl-input-border-width) * 2);
padding: 0 var(--sl-input-spacing-large);
}
.input--large .input__clear,
.input--large .input__password-toggle {
width: calc(1em + var(--sl-input-spacing-large) * 2);
}
.input--large .input__prefix ::slotted(*) {
padding-left: var(--sl-input-spacing-large);
}
.input--large .input__suffix ::slotted(*) {
padding-right: var(--sl-input-spacing-large);
}
/*
* Pill modifier
*/
.input--pill.input--small {
border-radius: var(--sl-input-height-small);
}
.input--pill.input--medium {
border-radius: var(--sl-input-height-medium);
}
.input--pill.input--large {
border-radius: var(--sl-input-height-large);
}
/*
* Clearable + Password Toggle
*/
.input__clear,
.input__password-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: inherit;
color: var(--sl-input-icon-color);
border: none;
background: none;
padding: 0;
transition: var(--sl-transition-fast) color;
cursor: pointer;
}
.input__clear:hover,
.input__password-toggle:hover {
color: var(--sl-input-icon-color-hover);
}
.input__clear:focus,
.input__password-toggle:focus {
outline: none;
}
.input--empty .input__clear {
visibility: hidden;
}
/* Don't show the browser's password toggle in Edge */
::-ms-reveal {
display: none;
}
`;var Oe=new Set,lr=new MutationObserver(Oi),De=new Map,zt=document.documentElement.lang||navigator.language,Ot;lr.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});function ar(...t){t.map(e=>{let i=e.$code.toLowerCase();De.set(i,e),Ot||(Ot=e)}),Oi()}function cr(t,e,...i){let o=t.toLowerCase().slice(0,2),r=t.length>2?t.toLowerCase():"",s=De.get(r),n=De.get(o),l;if(s&&s[e])l=s[e];else if(n&&n[e])l=n[e];else if(Ot&&Ot[e])l=Ot[e];else return console.error(`No translation found for: ${e}`),e;return typeof l=="function"?l(...i):l}function dr(t,e,i){return e=new Date(e),new Intl.DateTimeFormat(t,i).format(e)}function ur(t,e,i){return e=Number(e),isNaN(e)?"":new Intl.NumberFormat(t,i).format(e)}function hr(t,e,i,o){return new Intl.RelativeTimeFormat(t,o).format(e,i)}function Oi(){zt=document.documentElement.lang||navigator.language,[...Oe.keys()].map(t=>{typeof t.requestUpdate=="function"&&t.requestUpdate()})}var Xt=class{constructor(t){this.host=t,this.host.addController(this)}hostConnected(){Oe.add(this.host)}hostDisconnected(){Oe.delete(this.host)}term(t,...e){return cr(this.host.lang||zt,t,...e)}date(t,e){return dr(this.host.lang||zt,t,e)}number(t,e){return ur(this.host.lang||zt,t,e)}relativeTime(t,e,i){return hr(this.host.lang||zt,t,e,i)}},pr={$code:"en",$name:"English",$dir:"ltr",clearEntry:"Clear entry",close:"Close",copy:"Copy",currentValue:"Current value",hidePassword:"Hide password",progress:"Progress",remove:"Remove",resize:"Resize",scrollToEnd:"Scroll to end",scrollToStart:"Scroll to start",selectAColorFromTheScreen:"Select a color from the screen",showPassword:"Show password",toggleColorFormat:"Toggle color format"};ar(pr);var j={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},pt=t=>(...e)=>({_$litDirective$:t,values:e}),kt=class{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,i){this._$Ct=t,this._$AM=e,this._$Ci=i}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}};var mr=t=>t.strings===void 0,fr={},gr=(t,e=fr)=>t._$AH=e,Dt=pt(class extends kt{constructor(t){if(super(t),t.type!==j.PROPERTY&&t.type!==j.ATTRIBUTE&&t.type!==j.BOOLEAN_ATTRIBUTE)throw Error("The `live` directive is not allowed on child or event bindings");if(!mr(t))throw Error("`live` bindings can only contain a single expression")}render(t){return t}update(t,[e]){if(e===D||e===x)return e;let i=t.element,o=t.name;if(t.type===j.PROPERTY){if(e===i[o])return D}else if(t.type===j.BOOLEAN_ATTRIBUTE){if(!!e===i.hasAttribute(o))return D}else if(t.type===j.ATTRIBUTE&&i.getAttribute(o)===e+"")return D;return gr(t),e}});var Ni=Object.defineProperty,vr=Object.defineProperties,br=Object.getOwnPropertyDescriptor,yr=Object.getOwnPropertyDescriptors;var Yt=Object.getOwnPropertySymbols;var Mi=Object.prototype.hasOwnProperty,Ii=Object.prototype.propertyIsEnumerable,Di=(t,e,i)=>e in t?Ni(t,e,{enumerable:!0,configurable:!0,writable:!0,value:i}):t[e]=i,v=(t,e)=>{for(var i in e||(e={}))Mi.call(e,i)&&Di(t,i,e[i]);if(Yt)for(var i of Yt(e))Ii.call(e,i)&&Di(t,i,e[i]);return t},z=(t,e)=>vr(t,yr(e));var Jt=(t,e)=>{var i={};for(var o in t)Mi.call(t,o)&&e.indexOf(o)<0&&(i[o]=t[o]);if(t!=null&&Yt)for(var o of Yt(t))e.indexOf(o)<0&&Ii.call(t,o)&&(i[o]=t[o]);return i};var c=(t,e,i,o)=>{for(var r=o>1?void 0:o?br(e,i):e,s=t.length-1,n;s>=0;s--)(n=t[s])&&(r=(o?n(e,i,r):n(r))||r);return o&&r&&Ni(e,i,r),r};var wr=class extends Event{constructor(t){super("formdata"),this.formData=t}},_r=class extends FormData{constructor(t){super(t),this.form=t,t.dispatchEvent(new wr(this))}append(t,e){let i=this.form.elements[t];if(i||(i=document.createElement("input"),i.type="hidden",i.name=t,this.form.appendChild(i)),this.has(t)){let o=this.getAll(t),r=o.indexOf(i.value);r!==-1&&o.splice(r,1),o.push(e),this.set(t,o)}else super.append(t,e);i.value=e}};function xr(){let t=document.createElement("form"),e=!1;return document.body.append(t),t.addEventListener("submit",i=>{new FormData(i.target),i.preventDefault()}),t.addEventListener("formdata",()=>e=!0),t.dispatchEvent(new Event("submit",{cancelable:!0})),t.remove(),e}function Ui(){!window.FormData||xr()||(window.FormData=_r,window.addEventListener("submit",t=>{t.defaultPrevented||new FormData(t.target)}))}document.readyState==="complete"?Ui():window.addEventListener("DOMContentLoaded",()=>Ui());var Qt=class{constructor(t,e){(this.host=t).addController(this),this.options=v({form:i=>i.closest("form"),name:i=>i.name,value:i=>i.value,disabled:i=>i.disabled,reportValidity:i=>typeof i.reportValidity=="function"?i.reportValidity():!0},e),this.handleFormData=this.handleFormData.bind(this),this.handleFormSubmit=this.handleFormSubmit.bind(this)}hostConnected(){document.addEventListener("formdata",this.handleFormData,{capture:!0}),document.addEventListener("submit",this.handleFormSubmit,{capture:!0})}hostDisconnected(){document.removeEventListener("formdata",this.handleFormData,{capture:!0}),document.removeEventListener("submit",this.handleFormSubmit,{capture:!0})}handleFormData(t){let e=this.options.disabled(this.host),i=this.options.name(this.host),o=this.options.value(this.host);!e&&typeof i=="string"&&typeof o<"u"&&(Array.isArray(o)?o.forEach(r=>{t.formData.append(i,r.toString())}):t.formData.append(i,o.toString()))}handleFormSubmit(t){let e=this.options.form(this.host),i=this.options.disabled(this.host),o=this.options.reportValidity;t.target===e&&!i&&!e?.noValidate&&!o(this.host)&&(t.preventDefault(),t.stopImmediatePropagation())}submit(t){let e=this.options.form(this.host);if(e){let i=document.createElement("button");i.type="submit",i.style.position="absolute",i.style.width="0",i.style.height="0",i.style.clipPath="inset(50%)",i.style.overflow="hidden",i.style.whiteSpace="nowrap",t&&["formaction","formmethod","formnovalidate","formtarget"].forEach(o=>{t.hasAttribute(o)&&i.setAttribute(o,t.getAttribute(o))}),e.append(i),i.click(),i.remove()}}};var Bi=class{constructor(t,...e){this.slotNames=[],(this.host=t).addController(this),this.slotNames=e,this.handleSlotChange=this.handleSlotChange.bind(this)}hasDefaultSlot(){return[...this.host.childNodes].some(t=>{if(t.nodeType===t.TEXT_NODE&&t.textContent.trim()!=="")return!0;if(t.nodeType===t.ELEMENT_NODE){let e=t;if(e.tagName.toLowerCase()==="sl-visually-hidden")return!1;if(!e.hasAttribute("slot"))return!0}return!1})}hasNamedSlot(t){return this.host.querySelector(`:scope > [slot="${t}"]`)!==null}test(t){return t==="[default]"?this.hasDefaultSlot():this.hasNamedSlot(t)}hostConnected(){this.host.shadowRoot.addEventListener("slotchange",this.handleSlotChange)}hostDisconnected(){this.host.shadowRoot.removeEventListener("slotchange",this.handleSlotChange)}handleSlotChange(t){let e=t.target;(this.slotNames.includes("[default]")&&!e.name||e.name&&this.slotNames.includes(e.name))&&this.host.requestUpdate()}};function Hi(t){if(!t)return"";let e=t.assignedNodes({flatten:!0}),i="";return[...e].forEach(o=>{o.nodeType===Node.TEXT_NODE&&(i+=o.textContent)}),i}var q=pt(class extends kt{constructor(t){var e;if(super(t),t.type!==j.ATTRIBUTE||t.name!=="class"||((e=t.strings)===null||e===void 0?void 0:e.length)>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(t){return" "+Object.keys(t).filter(e=>t[e]).join(" ")+" "}update(t,[e]){var i,o;if(this.st===void 0){this.st=new Set,t.strings!==void 0&&(this.et=new Set(t.strings.join(" ").split(/\s/).filter(s=>s!=="")));for(let s in e)e[s]&&!(!((i=this.et)===null||i===void 0)&&i.has(s))&&this.st.add(s);return this.render(e)}let r=t.element.classList;this.st.forEach(s=>{s in e||(r.remove(s),this.st.delete(s))});for(let s in e){let n=!!e[s];n===this.st.has(s)||((o=this.et)===null||o===void 0?void 0:o.has(s))||(n?(r.add(s),this.st.add(s)):(r.remove(s),this.st.delete(s)))}return D}});var g=t=>t??x;function k(t,e){let i=v({waitUntilFirstUpdate:!1},e);return(o,r)=>{let{update:s}=o;if(t in o){let n=t;o.update=function(l){if(l.has(n)){let a=l.get(n),u=this[n];a!==u&&(!i.waitUntilFirstUpdate||this.hasUpdated)&&this[r](a,u)}s.call(this,l)}}}}function y(t,e,i){let o=new CustomEvent(e,v({bubbles:!0,cancelable:!1,composed:!0,detail:{}},i));return t.dispatchEvent(o),o}function Ne(t,e){return new Promise(i=>{function o(r){r.target===t&&(t.removeEventListener(e,o),i())}t.addEventListener(e,o)})}var O=t=>e=>typeof e=="function"?((i,o)=>(window.customElements.define(i,o),o))(t,e):((i,o)=>{let{kind:r,elements:s}=o;return{kind:r,elements:s,finisher(n){window.customElements.define(i,n)}}})(t,e),$r=(t,e)=>e.kind==="method"&&e.descriptor&&!("value"in e.descriptor)?z(v({},e),{finisher(i){i.createProperty(e.key,t)}}):{kind:"field",key:Symbol(),placement:"own",descriptor:{},originalKey:e.key,initializer(){typeof e.initializer=="function"&&(this[e.key]=e.initializer.call(this))},finisher(i){i.createProperty(e.key,t)}};function d(t){return(e,i)=>i!==void 0?((o,r,s)=>{r.constructor.createProperty(s,o)})(t,e,i):$r(t,e)}function mt(t){return d(z(v({},t),{state:!0}))}var Ar=({finisher:t,descriptor:e})=>(i,o)=>{var r;if(o===void 0){let s=(r=i.originalKey)!==null&&r!==void 0?r:i.key,n=e!=null?{kind:"method",placement:"prototype",key:s,descriptor:e(i.key)}:z(v({},i),{key:s});return t!=null&&(n.finisher=function(l){t(l,s)}),n}{let s=i.constructor;e!==void 0&&Object.defineProperty(i,o,e(o)),t?.(s,o)}};function P(t,e){return Ar({descriptor:i=>{let o={get(){var r,s;return(s=(r=this.renderRoot)===null||r===void 0?void 0:r.querySelector(t))!==null&&s!==void 0?s:null},enumerable:!0,configurable:!0};if(e){let r=typeof i=="symbol"?Symbol():"__"+i;o.get=function(){var s,n;return this[r]===void 0&&(this[r]=(n=(s=this.renderRoot)===null||s===void 0?void 0:s.querySelector(t))!==null&&n!==void 0?n:null),this[r]}}return o}})}var Me,zn=((Me=window.HTMLSlotElement)===null||Me===void 0?void 0:Me.prototype.assignedElements)!=null?(t,e)=>t.assignedElements(e):(t,e)=>t.assignedNodes(e).filter(i=>i.nodeType===Node.ELEMENT_NODE);var f=class extends C{constructor(){super(...arguments),this.formSubmitController=new Qt(this),this.hasSlotController=new Bi(this,"help-text","label"),this.localize=new Xt(this),this.hasFocus=!1,this.isPasswordVisible=!1,this.type="text",this.size="medium",this.value="",this.filled=!1,this.pill=!1,this.label="",this.helpText="",this.clearable=!1,this.togglePassword=!1,this.disabled=!1,this.readonly=!1,this.required=!1,this.invalid=!1}get valueAsDate(){var t,e;return(e=(t=this.input)==null?void 0:t.valueAsDate)!=null?e:null}set valueAsDate(t){this.updateComplete.then(()=>{this.input.valueAsDate=t,this.value=this.input.value})}get valueAsNumber(){var t,e;return(e=(t=this.input)==null?void 0:t.valueAsNumber)!=null?e:parseFloat(this.value)}set valueAsNumber(t){this.updateComplete.then(()=>{this.input.valueAsNumber=t,this.value=this.input.value})}firstUpdated(){this.invalid=!this.input.checkValidity()}focus(t){this.input.focus(t)}blur(){this.input.blur()}select(){this.input.select()}setSelectionRange(t,e,i="none"){this.input.setSelectionRange(t,e,i)}setRangeText(t,e,i,o="preserve"){this.input.setRangeText(t,e,i,o),this.value!==this.input.value&&(this.value=this.input.value,y(this,"sl-input"),y(this,"sl-change"))}reportValidity(){return this.input.reportValidity()}setCustomValidity(t){this.input.setCustomValidity(t),this.invalid=!this.input.checkValidity()}handleBlur(){this.hasFocus=!1,y(this,"sl-blur")}handleChange(){this.value=this.input.value,y(this,"sl-change")}handleClearClick(t){this.value="",y(this,"sl-clear"),y(this,"sl-input"),y(this,"sl-change"),this.input.focus(),t.stopPropagation()}handleDisabledChange(){this.input.disabled=this.disabled,this.invalid=!this.input.checkValidity()}handleFocus(){this.hasFocus=!0,y(this,"sl-focus")}handleInput(){this.value=this.input.value,y(this,"sl-input")}handleInvalid(){this.invalid=!0}handleKeyDown(t){let e=t.metaKey||t.ctrlKey||t.shiftKey||t.altKey;t.key==="Enter"&&!e&&this.formSubmitController.submit()}handlePasswordToggle(){this.isPasswordVisible=!this.isPasswordVisible}handleValueChange(){this.invalid=!this.input.checkValidity()}render(){let t=this.hasSlotController.test("label"),e=this.hasSlotController.test("help-text"),i=this.label?!0:!!t,o=this.helpText?!0:!!e;return A`
<div
part="form-control"
class=${q({"form-control":!0,"form-control--small":this.size==="small","form-control--medium":this.size==="medium","form-control--large":this.size==="large","form-control--has-label":i,"form-control--has-help-text":o})}
>
<label
part="form-control-label"
class="form-control__label"
for="input"
aria-hidden=${i?"false":"true"}
>
<slot name="label">${this.label}</slot>
</label>
<div part="form-control-input" class="form-control-input">
<div
part="base"
class=${q({input:!0,"input--small":this.size==="small","input--medium":this.size==="medium","input--large":this.size==="large","input--pill":this.pill,"input--standard":!this.filled,"input--filled":this.filled,"input--disabled":this.disabled,"input--focused":this.hasFocus,"input--empty":this.value.length===0,"input--invalid":this.invalid})}
>
<span part="prefix" class="input__prefix">
<slot name="prefix"></slot>
</span>
<input
part="input"
id="input"
class="input__control"
type=${this.type==="password"&&this.isPasswordVisible?"text":this.type}
name=${g(this.name)}
?disabled=${this.disabled}
?readonly=${this.readonly}
?required=${this.required}
placeholder=${g(this.placeholder)}
minlength=${g(this.minlength)}
maxlength=${g(this.maxlength)}
min=${g(this.min)}
max=${g(this.max)}
step=${g(this.step)}
.value=${Dt(this.value)}
autocapitalize=${g(this.autocapitalize)}
autocomplete=${g(this.autocomplete)}
autocorrect=${g(this.autocorrect)}
?autofocus=${this.autofocus}
spellcheck=${g(this.spellcheck)}
pattern=${g(this.pattern)}
enterkeyhint=${g(this.enterkeyhint)}
inputmode=${g(this.inputmode)}
aria-describedby="help-text"
aria-invalid=${this.invalid?"true":"false"}
@change=${this.handleChange}
@input=${this.handleInput}
@invalid=${this.handleInvalid}
@keydown=${this.handleKeyDown}
@focus=${this.handleFocus}
@blur=${this.handleBlur}
/>
${this.clearable&&this.value.length>0?A`
<button
part="clear-button"
class="input__clear"
type="button"
aria-label=${this.localize.term("clearEntry")}
@click=${this.handleClearClick}
tabindex="-1"
>
<slot name="clear-icon">
<sl-icon name="x-circle-fill" library="system"></sl-icon>
</slot>
</button>
`:""}
${this.togglePassword?A`
<button
part="password-toggle-button"
class="input__password-toggle"
type="button"
aria-label=${this.localize.term(this.isPasswordVisible?"hidePassword":"showPassword")}
@click=${this.handlePasswordToggle}
tabindex="-1"
>
${this.isPasswordVisible?A`
<slot name="show-password-icon">
<sl-icon name="eye-slash" library="system"></sl-icon>
</slot>
`:A`
<slot name="hide-password-icon">
<sl-icon name="eye" library="system"></sl-icon>
</slot>
`}
</button>
`:""}
<span part="suffix" class="input__suffix">
<slot name="suffix"></slot>
</span>
</div>
</div>
<div
part="form-control-help-text"
id="help-text"
class="form-control__help-text"
aria-hidden=${o?"false":"true"}
>
<slot name="help-text">${this.helpText}</slot>
</div>
</div>
`}};f.styles=zi;c([P(".input__control")],f.prototype,"input",2);c([mt()],f.prototype,"hasFocus",2);c([mt()],f.prototype,"isPasswordVisible",2);c([d({reflect:!0})],f.prototype,"type",2);c([d({reflect:!0})],f.prototype,"size",2);c([d()],f.prototype,"name",2);c([d()],f.prototype,"value",2);c([d({type:Boolean,reflect:!0})],f.prototype,"filled",2);c([d({type:Boolean,reflect:!0})],f.prototype,"pill",2);c([d()],f.prototype,"label",2);c([d({attribute:"help-text"})],f.prototype,"helpText",2);c([d({type:Boolean})],f.prototype,"clearable",2);c([d({attribute:"toggle-password",type:Boolean})],f.prototype,"togglePassword",2);c([d()],f.prototype,"placeholder",2);c([d({type:Boolean,reflect:!0})],f.prototype,"disabled",2);c([d({type:Boolean,reflect:!0})],f.prototype,"readonly",2);c([d({type:Number})],f.prototype,"minlength",2);c([d({type:Number})],f.prototype,"maxlength",2);c([d()],f.prototype,"min",2);c([d()],f.prototype,"max",2);c([d({type:Number})],f.prototype,"step",2);c([d()],f.prototype,"pattern",2);c([d({type:Boolean,reflect:!0})],f.prototype,"required",2);c([d({type:Boolean,reflect:!0})],f.prototype,"invalid",2);c([d()],f.prototype,"autocapitalize",2);c([d()],f.prototype,"autocorrect",2);c([d()],f.prototype,"autocomplete",2);c([d({type:Boolean})],f.prototype,"autofocus",2);c([d()],f.prototype,"enterkeyhint",2);c([d({type:Boolean})],f.prototype,"spellcheck",2);c([d()],f.prototype,"inputmode",2);c([k("disabled",{waitUntilFirstUpdate:!0})],f.prototype,"handleDisabledChange",1);c([k("value",{waitUntilFirstUpdate:!0})],f.prototype,"handleValueChange",1);f=c([O("sl-input")],f);var ji="";function Fi(t){ji=t}function qi(){return ji.replace(/\/$/,"")}var Wi=[...document.getElementsByTagName("script")],Vi=Wi.find(t=>t.hasAttribute("data-shoelace"));if(Vi)Fi(Vi.getAttribute("data-shoelace"));else{let t=Wi.find(i=>/shoelace(\.min)?\.js($|\?)/.test(i.src)),e="";t&&(e=t.getAttribute("src")),Fi(e.split("/").slice(0,-1).join("/"))}var kr={name:"default",resolver:t=>`${qi()}/assets/icons/${t}.svg`},Ki=kr;var Xi={"check-lg":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check-lg" viewBox="0 0 16 16">
<path d="M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425a.247.247 0 0 1 .02-.022Z"></path>
</svg>
`,"chevron-down":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-down" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/>
</svg>
`,"chevron-left":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-left" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"/>
</svg>
`,"chevron-right":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-right" viewBox="0 0 16 16">
<path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z"/>
</svg>
`,eye:`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye" viewBox="0 0 16 16">
<path d="M16 8s-3-5.5-8-5.5S0 8 0 8s3 5.5 8 5.5S16 8 16 8zM1.173 8a13.133 13.133 0 0 1 1.66-2.043C4.12 4.668 5.88 3.5 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.133 13.133 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755C11.879 11.332 10.119 12.5 8 12.5c-2.12 0-3.879-1.168-5.168-2.457A13.134 13.134 0 0 1 1.172 8z"/>
<path d="M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5zM4.5 8a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0z"/>
</svg>
`,"eye-slash":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eye-slash" viewBox="0 0 16 16">
<path d="M13.359 11.238C15.06 9.72 16 8 16 8s-3-5.5-8-5.5a7.028 7.028 0 0 0-2.79.588l.77.771A5.944 5.944 0 0 1 8 3.5c2.12 0 3.879 1.168 5.168 2.457A13.134 13.134 0 0 1 14.828 8c-.058.087-.122.183-.195.288-.335.48-.83 1.12-1.465 1.755-.165.165-.337.328-.517.486l.708.709z"/>
<path d="M11.297 9.176a3.5 3.5 0 0 0-4.474-4.474l.823.823a2.5 2.5 0 0 1 2.829 2.829l.822.822zm-2.943 1.299.822.822a3.5 3.5 0 0 1-4.474-4.474l.823.823a2.5 2.5 0 0 0 2.829 2.829z"/>
<path d="M3.35 5.47c-.18.16-.353.322-.518.487A13.134 13.134 0 0 0 1.172 8l.195.288c.335.48.83 1.12 1.465 1.755C4.121 11.332 5.881 12.5 8 12.5c.716 0 1.39-.133 2.02-.36l.77.772A7.029 7.029 0 0 1 8 13.5C3 13.5 0 8 0 8s.939-1.721 2.641-3.238l.708.709zm10.296 8.884-12-12 .708-.708 12 12-.708.708z"/>
</svg>
`,eyedropper:`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-eyedropper" viewBox="0 0 16 16">
<path d="M13.354.646a1.207 1.207 0 0 0-1.708 0L8.5 3.793l-.646-.647a.5.5 0 1 0-.708.708L8.293 5l-7.147 7.146A.5.5 0 0 0 1 12.5v1.793l-.854.853a.5.5 0 1 0 .708.707L1.707 15H3.5a.5.5 0 0 0 .354-.146L11 7.707l1.146 1.147a.5.5 0 0 0 .708-.708l-.647-.646 3.147-3.146a1.207 1.207 0 0 0 0-1.708l-2-2zM2 12.707l7-7L10.293 7l-7 7H2v-1.293z"></path>
</svg>
`,"grip-vertical":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-grip-vertical" viewBox="0 0 16 16">
<path d="M7 2a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM7 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zM7 8a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-3 3a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-3 3a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm3 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z"/>
</svg>
`,"person-fill":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 16 16">
<path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/>
</svg>
`,"play-fill":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-play-fill" viewBox="0 0 16 16">
<path d="m11.596 8.697-6.363 3.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01 1.233-.696l6.363 3.692a.802.802 0 0 1 0 1.393z"></path>
</svg>
`,"pause-fill":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-pause-fill" viewBox="0 0 16 16">
<path d="M5.5 3.5A1.5 1.5 0 0 1 7 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5zm5 0A1.5 1.5 0 0 1 12 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5z"></path>
</svg>
`,"star-fill":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-star-fill" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"/>
</svg>
`,x:`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x" viewBox="0 0 16 16">
<path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
</svg>
`,"x-circle-fill":`
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM5.354 4.646a.5.5 0 1 0-.708.708L7.293 8l-2.647 2.646a.5.5 0 0 0 .708.708L8 8.707l2.646 2.647a.5.5 0 0 0 .708-.708L8.707 8l2.647-2.646a.5.5 0 0 0-.708-.708L8 7.293 5.354 4.646z"></path>
</svg>
`},Er={name:"system",resolver:t=>t in Xi?`data:image/svg+xml,${encodeURIComponent(Xi[t])}`:""},Yi=Er;var Zt=[Ki,Yi],Gt=[];function Ji(t){Gt.push(t)}function Qi(t){Gt=Gt.filter(e=>e!==t)}function Ie(t){return Zt.find(e=>e.name===t)}function Ue(t,e){Zi(t),Zt.push({name:t,resolver:e.resolver,mutator:e.mutator}),Gt.forEach(i=>{i.library===t&&i.redraw()})}function Zi(t){Zt=Zt.filter(e=>e.name!==t)}var Be=new Map;function Gi(t,e="cors"){if(Be.has(t))return Be.get(t);let i=fetch(t,{mode:e}).then(async o=>({ok:o.ok,status:o.status,html:await o.text()}));return Be.set(t,i),i}var He=new Map;async function to(t){if(He.has(t))return He.get(t);let e=await Gi(t),i={ok:e.ok,status:e.status,svg:null};if(e.ok){let o=document.createElement("div");o.innerHTML=e.html;let r=o.firstElementChild;i.svg=r?.tagName.toLowerCase()==="svg"?r.outerHTML:""}return He.set(t,i),i}var eo=T`
${R}
:host {
display: inline-block;
width: 1em;
he