@warp-ds/elements 2.10.0-next.15 → 2.10.0-next.17

package/dist/packages/slider-thumb/slider-thumb.js

@@ -6,280 +6,280 @@ That means you use raw catalog or your catalog doesn't have a translation for th
 ICU features such as interpolation and plurals will not work properly for that message. 
 
 Please compile your catalog first. 
-`)),N(b)&&ve.test(b)?fe(b):N(b)?b:Ae(b,this._locale,this._locales)(e,t?.formats)}date(r,e){return le(this._locales||this._locale,r,e)}number(r,e){return ae(this._locales||this._locale,r,e)}};function Ie(o={}){return new se(o)}var E=Ie();var h=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},v=function(o,r,e,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function xe(o){var r,e,t,a,i,n,s,b,f,F,y,$,x,z,M,k,_,Y,J;class Fe extends o{constructor(...l){var c,g,w;super(...l),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),i.set(this,void 0),n.set(this,void 0),s.set(this,!0),f.set(this,""),F.set(this,()=>{v(this,a,!0,"f"),v(this,e,!0,"f"),h(this,r,"m",k).call(this)}),y.set(this,()=>{v(this,e,!1,"f"),h(this,r,"m",_).call(this,this.shouldFormValueUpdate()?h(this,f,"f"):""),!this.validity.valid&&h(this,a,"f")&&v(this,t,!0,"f");let S=h(this,r,"m",k).call(this);this.validationMessageCallback&&this.validationMessageCallback(S?this.internals.validationMessage:"")}),$.set(this,()=>{var S;h(this,s,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),v(this,s,!1,"f")),v(this,a,!0,"f"),v(this,t,!0,"f"),h(this,r,"m",k).call(this),(S=this===null||this===void 0?void 0:this.validationMessageCallback)===null||S===void 0||S.call(this,this.showError?this.internals.validationMessage:"")}),x.set(this,void 0),z.set(this,!1),M.set(this,Promise.resolve()),(c=this.addEventListener)===null||c===void 0||c.call(this,"focus",h(this,F,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",h(this,y,"f")),(w=this.addEventListener)===null||w===void 0||w.call(this,"invalid",h(this,$,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(w=>w.attribute).flat(),c=super.observedAttributes||[];return[...new Set([...c,...l])]}static getValidator(l){return this.validators.find(c=>c.attribute===l)||null}static getValidators(l){return this.validators.filter(c=>{var g;if(c.attribute===l||!((g=c.attribute)===null||g===void 0)&&g.includes(l))return!0})}get form(){return this.internals.form}get showError(){return h(this,r,"m",k).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,c,g){var w;(w=super.attributeChangedCallback)===null||w===void 0||w.call(this,l,c,g);let X=this.constructor.getValidators(l);X?.length&&this.validationTarget&&this.setValue(h(this,f,"f"))}setValue(l){var c;v(this,t,!1,"f"),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,""),v(this,f,l,"f");let w=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(w),h(this,r,"m",_).call(this,w),this.valueChangedCallback&&this.valueChangedCallback(w),h(this,r,"m",k).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(h(this,M,"f")))}formResetCallback(){var l,c;v(this,a,!1,"f"),v(this,t,!1,"f"),h(this,r,"m",k).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,h(this,r,"m",k).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,i=new WeakMap,n=new WeakMap,s=new WeakMap,f=new WeakMap,F=new WeakMap,y=new WeakMap,$=new WeakMap,x=new WeakMap,z=new WeakMap,M=new WeakMap,r=new WeakSet,b=function(){let l=this.getRootNode(),c=`${this.localName}[name="${this.getAttribute("name")}"]`;return l.querySelectorAll(c)},k=function(){if(this.hasAttribute("disabled"))return!1;let l=h(this,t,"f")||h(this,a,"f")&&!this.validity.valid&&!h(this,e,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},_=function(l){let c=this.constructor,g={},w=c.validators,S=[],X=w.some(C=>C.isValid instanceof Promise);h(this,z,"f")||(v(this,M,new Promise(C=>{v(this,x,C,"f")}),"f"),v(this,z,!0,"f")),h(this,i,"f")&&(h(this,i,"f").abort(),v(this,n,h(this,i,"f"),"f"));let R=new AbortController;v(this,i,R,"f");let O,ue=!1;w.length&&(w.forEach(C=>{let Q=C.key||"customError",T=C.isValid(this,l,R.signal);T instanceof Promise?(S.push(T),T.then(W=>{W!=null&&(g[Q]=!W,O=h(this,r,"m",J).call(this,C,l),h(this,r,"m",Y).call(this,g,O))})):(g[Q]=!T,this.validity[Q]!==!T&&(ue=!0),!T&&!O&&(O=h(this,r,"m",J).call(this,C,l)))}),Promise.allSettled(S).then(()=>{var C;R?.signal.aborted||(v(this,z,!1,"f"),(C=h(this,x,"f"))===null||C===void 0||C.call(this))}),(ue||!X)&&h(this,r,"m",Y).call(this,g,O))},Y=function(l,c){if(this.validationTarget)this.internals.setValidity(l,c,this.validationTarget),v(this,s,!1,"f");else{if(this.internals.setValidity(l,c),this.internals.validity.valid)return;v(this,s,!0,"f")}},J=function(l,c){if(this.validityCallback){let g=this.validityCallback(l.key||"customError");if(g)return g}return l.message instanceof Function?l.message(this,c):l.message},Fe}import{html as q,LitElement as ze,nothing as A}from"lit";import{property as V,query as de,state as P}from"lit/decorators.js";import{classMap as Ue}from"lit/directives/class-map.js";import{ifDefined as K}from"lit/directives/if-defined.js";import{unsafeCSS as Xe}from"lit";var ke=Xe("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hidden{display:none}.absolute{position:absolute}.relative{position:relative}.static{position:static}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}");import{css as Re}from"lit";import{unsafeCSS as Oe}from"lit";var ye=Re`
-  *,
-  :before,
-  :after {
-    box-sizing: border-box;
-    border-style: solid;
-    border-width: 0;
-    border-color: var(--w-s-color-border);
-  }
-  html {
-    font-size: 62.5%;
-  }
-  body {
-    background-color: var(--w-s-color-background);
-    min-height: 100%;
-    margin: 0;
-    overflow-y: scroll;
-  }
-  body,
-  :host {
-    -webkit-text-size-adjust: 100%;
-    tab-size: 4;
-    -webkit-tap-highlight-color: transparent;
-    font-family: var(--w-font-family);
-    font-size: var(--w-font-size-m);
-    line-height: var(--w-line-height-m);
-    color: var(--w-s-color-text);
-  }
-  hr {
-    color: inherit;
-    border-top-width: 1px;
-    height: 0;
-  }
-  abbr:where([title]) {
-    -webkit-text-decoration: underline dotted;
-    text-decoration: underline dotted;
-  }
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-size: inherit;
-    font-weight: 700;
-  }
-  a {
-    cursor: pointer;
-    color: var(--w-s-color-text-link);
-    text-decoration: none;
-  }
-  a:hover,
-  a:focus,
-  a:active {
-    text-decoration: underline;
-  }
-  a:focus-visible {
-    outline: 2px solid var(--w-s-color-border-focus);
-    outline-offset: 1px;
-  }
-  b,
-  strong {
-    font-weight: 700;
-  }
-  code,
-  kbd,
-  samp,
-  pre {
-    font-family:
-      ui-monospace,
-      SFMono-Regular,
-      Menlo,
-      Monaco,
-      Consolas,
-      Liberation Mono,
-      Courier New,
-      monospace;
-    font-size: 1em;
-  }
-  sub,
-  sup {
-    vertical-align: baseline;
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-  }
-  sub {
-    bottom: -0.25em;
-  }
-  sup {
-    top: -0.5em;
-  }
-  table {
-    text-indent: 0;
-    border-color: inherit;
-    border-collapse: collapse;
-  }
-  button,
-  input,
-  optgroup,
-  select,
-  textarea {
-    font-family: inherit;
-    font-size: 100%;
-    font-weight: inherit;
-    line-height: inherit;
-    color: inherit;
-    margin: 0;
-    padding: 0;
-  }
-  button,
-  select {
-    text-transform: none;
-  }
-  button,
-  [type='button'],
-  [type='reset'],
-  [type='submit'] {
-    -webkit-appearance: button;
-  }
-  :-moz-focusring {
-    outline: auto;
-  }
-  :-moz-ui-invalid {
-    box-shadow: none;
-  }
-  progress {
-    vertical-align: baseline;
-  }
-  ::-webkit-inner-spin-button {
-    height: auto;
-  }
-  ::-webkit-outer-spin-button {
-    height: auto;
-  }
-  [type='search'] {
-    -webkit-appearance: textfield;
-    outline-offset: -2px;
-  }
-  ::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
-  ::-webkit-file-upload-button {
-    -webkit-appearance: button;
-    font: inherit;
-  }
-  summary {
-    display: list-item;
-  }
-  blockquote,
-  dl,
-  dd,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  hr,
-  figure,
-  p,
-  pre {
-    margin: 0;
-  }
-  fieldset {
-    margin: 0;
-    padding: 0;
-  }
-  legend {
-    padding: 0;
-  }
-  ol,
-  ul,
-  menu {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-  textarea {
-    resize: vertical;
-  }
-  input::placeholder,
-  textarea::placeholder {
-    opacity: 1;
-    color: var(--w-s-color-text-placeholder);
-  }
-  button,
-  [role='button'] {
-    cursor: pointer;
-  }
-  :disabled {
-    cursor: default;
-  }
-  img,
-  svg,
-  video,
-  canvas,
-  audio,
-  iframe,
-  embed,
-  object {
-    vertical-align: middle;
-    display: block;
-  }
-  img,
-  video {
-    max-width: 100%;
-    height: auto;
-  }
-  h1 {
-    font-size: var(--w-font-size-xxl);
-    line-height: var(--w-line-height-xxl);
-  }
-  h2 {
-    font-size: var(--w-font-size-xl);
-    line-height: var(--w-line-height-xl);
-  }
-  h3 {
-    font-size: var(--w-font-size-l);
-    line-height: var(--w-line-height-l);
-  }
-  h4 {
-    font-size: var(--w-font-size-m);
-    line-height: var(--w-line-height-m);
-  }
-  h5 {
-    font-size: var(--w-font-size-s);
-    line-height: var(--w-line-height-s);
-  }
-  dt,
-  dd {
-    margin: 0 16px;
-  }
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  ul,
-  ol,
-  dl,
-  p,
-  blockquote {
-    margin: 0 0 8px;
-  }
-  [hidden] {
-    display: none !important;
-  }
-  [tabindex='-1']:focus:not(:focus-visible) {
-    outline: none;
-  }
-  legend {
-    float: left;
-    width: 100%;
-    margin: 0;
-    padding: 0;
-    display: table;
-  }
-  legend + * {
-    clear: both;
-  }
-  fieldset {
-    border: 0;
-    min-width: 0;
-    margin: 0;
-    padding: 0.01em 0 0;
-  }
-  body:not(:-moz-handler-blocked) fieldset {
-    display: table-cell;
-  }
-  svg {
-    pointer-events: none;
-  }
-`,er=Oe(`*, :before, :after {
+`)),N(b)&&ve.test(b)?fe(b):N(b)?b:Ae(b,this._locale,this._locales)(e,t?.formats)}date(r,e){return le(this._locales||this._locale,r,e)}number(r,e){return ae(this._locales||this._locale,r,e)}};function Ie(o={}){return new se(o)}var E=Ie();var h=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},v=function(o,r,e,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function xe(o){var r,e,t,a,i,n,s,b,f,F,y,$,x,z,M,k,_,Y,J;class Fe extends o{constructor(...l){var c,g,w;super(...l),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),i.set(this,void 0),n.set(this,void 0),s.set(this,!0),f.set(this,""),F.set(this,()=>{v(this,a,!0,"f"),v(this,e,!0,"f"),h(this,r,"m",k).call(this)}),y.set(this,()=>{v(this,e,!1,"f"),h(this,r,"m",_).call(this,this.shouldFormValueUpdate()?h(this,f,"f"):""),!this.validity.valid&&h(this,a,"f")&&v(this,t,!0,"f");let S=h(this,r,"m",k).call(this);this.validationMessageCallback&&this.validationMessageCallback(S?this.internals.validationMessage:"")}),$.set(this,()=>{var S;h(this,s,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),v(this,s,!1,"f")),v(this,a,!0,"f"),v(this,t,!0,"f"),h(this,r,"m",k).call(this),(S=this===null||this===void 0?void 0:this.validationMessageCallback)===null||S===void 0||S.call(this,this.showError?this.internals.validationMessage:"")}),x.set(this,void 0),z.set(this,!1),M.set(this,Promise.resolve()),(c=this.addEventListener)===null||c===void 0||c.call(this,"focus",h(this,F,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",h(this,y,"f")),(w=this.addEventListener)===null||w===void 0||w.call(this,"invalid",h(this,$,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(w=>w.attribute).flat(),c=super.observedAttributes||[];return[...new Set([...c,...l])]}static getValidator(l){return this.validators.find(c=>c.attribute===l)||null}static getValidators(l){return this.validators.filter(c=>{var g;if(c.attribute===l||!((g=c.attribute)===null||g===void 0)&&g.includes(l))return!0})}get form(){return this.internals.form}get showError(){return h(this,r,"m",k).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,c,g){var w;(w=super.attributeChangedCallback)===null||w===void 0||w.call(this,l,c,g);let R=this.constructor.getValidators(l);R?.length&&this.validationTarget&&this.setValue(h(this,f,"f"))}setValue(l){var c;v(this,t,!1,"f"),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,""),v(this,f,l,"f");let w=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(w),h(this,r,"m",_).call(this,w),this.valueChangedCallback&&this.valueChangedCallback(w),h(this,r,"m",k).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(h(this,M,"f")))}formResetCallback(){var l,c;v(this,a,!1,"f"),v(this,t,!1,"f"),h(this,r,"m",k).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,h(this,r,"m",k).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,i=new WeakMap,n=new WeakMap,s=new WeakMap,f=new WeakMap,F=new WeakMap,y=new WeakMap,$=new WeakMap,x=new WeakMap,z=new WeakMap,M=new WeakMap,r=new WeakSet,b=function(){let l=this.getRootNode(),c=`${this.localName}[name="${this.getAttribute("name")}"]`;return l.querySelectorAll(c)},k=function(){if(this.hasAttribute("disabled"))return!1;let l=h(this,t,"f")||h(this,a,"f")&&!this.validity.valid&&!h(this,e,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},_=function(l){let c=this.constructor,g={},w=c.validators,S=[],R=w.some(C=>C.isValid instanceof Promise);h(this,z,"f")||(v(this,M,new Promise(C=>{v(this,x,C,"f")}),"f"),v(this,z,!0,"f")),h(this,i,"f")&&(h(this,i,"f").abort(),v(this,n,h(this,i,"f"),"f"));let X=new AbortController;v(this,i,X,"f");let O,ue=!1;w.length&&(w.forEach(C=>{let Q=C.key||"customError",T=C.isValid(this,l,X.signal);T instanceof Promise?(S.push(T),T.then(W=>{W!=null&&(g[Q]=!W,O=h(this,r,"m",J).call(this,C,l),h(this,r,"m",Y).call(this,g,O))})):(g[Q]=!T,this.validity[Q]!==!T&&(ue=!0),!T&&!O&&(O=h(this,r,"m",J).call(this,C,l)))}),Promise.allSettled(S).then(()=>{var C;X?.signal.aborted||(v(this,z,!1,"f"),(C=h(this,x,"f"))===null||C===void 0||C.call(this))}),(ue||!R)&&h(this,r,"m",Y).call(this,g,O))},Y=function(l,c){if(this.validationTarget)this.internals.setValidity(l,c,this.validationTarget),v(this,s,!1,"f");else{if(this.internals.setValidity(l,c),this.internals.validity.valid)return;v(this,s,!0,"f")}},J=function(l,c){if(this.validityCallback){let g=this.validityCallback(l.key||"customError");if(g)return g}return l.message instanceof Function?l.message(this,c):l.message},Fe}import{html as q,LitElement as ze,nothing as A}from"lit";import{property as V,query as de,state as P}from"lit/decorators.js";import{classMap as Ue}from"lit/directives/class-map.js";import{ifDefined as K}from"lit/directives/if-defined.js";import{unsafeCSS as Re}from"lit";var ke=Re("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hidden{display:none}.absolute{position:absolute}.relative{position:relative}.static{position:static}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}");import{css as Xe}from"lit";import{unsafeCSS as Oe}from"lit";var ye=Xe`
+	*,
+	:before,
+	:after {
+		box-sizing: border-box;
+		border-style: solid;
+		border-width: 0;
+		border-color: var(--w-s-color-border);
+	}
+	html {
+		font-size: 62.5%;
+	}
+	body {
+		background-color: var(--w-s-color-background);
+		min-height: 100%;
+		margin: 0;
+		overflow-y: scroll;
+	}
+	body,
+	:host {
+		-webkit-text-size-adjust: 100%;
+		tab-size: 4;
+		-webkit-tap-highlight-color: transparent;
+		font-family: var(--w-font-family);
+		font-size: var(--w-font-size-m);
+		line-height: var(--w-line-height-m);
+		color: var(--w-s-color-text);
+	}
+	hr {
+		color: inherit;
+		border-top-width: 1px;
+		height: 0;
+	}
+	abbr:where([title]) {
+		-webkit-text-decoration: underline dotted;
+		text-decoration: underline dotted;
+	}
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6 {
+		font-size: inherit;
+		font-weight: 700;
+	}
+	a {
+		cursor: pointer;
+		color: var(--w-s-color-text-link);
+		text-decoration: none;
+	}
+	a:hover,
+	a:focus,
+	a:active {
+		text-decoration: underline;
+	}
+	a:focus-visible {
+		outline: 2px solid var(--w-s-color-border-focus);
+		outline-offset: 1px;
+	}
+	b,
+	strong {
+		font-weight: 700;
+	}
+	code,
+	kbd,
+	samp,
+	pre {
+		font-family:
+			ui-monospace,
+			SFMono-Regular,
+			Menlo,
+			Monaco,
+			Consolas,
+			Liberation Mono,
+			Courier New,
+			monospace;
+		font-size: 1em;
+	}
+	sub,
+	sup {
+		vertical-align: baseline;
+		font-size: 75%;
+		line-height: 0;
+		position: relative;
+	}
+	sub {
+		bottom: -0.25em;
+	}
+	sup {
+		top: -0.5em;
+	}
+	table {
+		text-indent: 0;
+		border-color: inherit;
+		border-collapse: collapse;
+	}
+	button,
+	input,
+	optgroup,
+	select,
+	textarea {
+		font-family: inherit;
+		font-size: 100%;
+		font-weight: inherit;
+		line-height: inherit;
+		color: inherit;
+		margin: 0;
+		padding: 0;
+	}
+	button,
+	select {
+		text-transform: none;
+	}
+	button,
+	[type="button"],
+	[type="reset"],
+	[type="submit"] {
+		-webkit-appearance: button;
+	}
+	:-moz-focusring {
+		outline: auto;
+	}
+	:-moz-ui-invalid {
+		box-shadow: none;
+	}
+	progress {
+		vertical-align: baseline;
+	}
+	::-webkit-inner-spin-button {
+		height: auto;
+	}
+	::-webkit-outer-spin-button {
+		height: auto;
+	}
+	[type="search"] {
+		-webkit-appearance: textfield;
+		outline-offset: -2px;
+	}
+	::-webkit-search-decoration {
+		-webkit-appearance: none;
+	}
+	::-webkit-file-upload-button {
+		-webkit-appearance: button;
+		font: inherit;
+	}
+	summary {
+		display: list-item;
+	}
+	blockquote,
+	dl,
+	dd,
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6,
+	hr,
+	figure,
+	p,
+	pre {
+		margin: 0;
+	}
+	fieldset {
+		margin: 0;
+		padding: 0;
+	}
+	legend {
+		padding: 0;
+	}
+	ol,
+	ul,
+	menu {
+		margin: 0;
+		padding: 0;
+		list-style: none;
+	}
+	textarea {
+		resize: vertical;
+	}
+	input::placeholder,
+	textarea::placeholder {
+		opacity: 1;
+		color: var(--w-s-color-text-placeholder);
+	}
+	button,
+	[role="button"] {
+		cursor: pointer;
+	}
+	:disabled {
+		cursor: default;
+	}
+	img,
+	svg,
+	video,
+	canvas,
+	audio,
+	iframe,
+	embed,
+	object {
+		vertical-align: middle;
+		display: block;
+	}
+	img,
+	video {
+		max-width: 100%;
+		height: auto;
+	}
+	h1 {
+		font-size: var(--w-font-size-xxl);
+		line-height: var(--w-line-height-xxl);
+	}
+	h2 {
+		font-size: var(--w-font-size-xl);
+		line-height: var(--w-line-height-xl);
+	}
+	h3 {
+		font-size: var(--w-font-size-l);
+		line-height: var(--w-line-height-l);
+	}
+	h4 {
+		font-size: var(--w-font-size-m);
+		line-height: var(--w-line-height-m);
+	}
+	h5 {
+		font-size: var(--w-font-size-s);
+		line-height: var(--w-line-height-s);
+	}
+	dt,
+	dd {
+		margin: 0 16px;
+	}
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	ul,
+	ol,
+	dl,
+	p,
+	blockquote {
+		margin: 0 0 8px;
+	}
+	[hidden] {
+		display: none !important;
+	}
+	[tabindex="-1"]:focus:not(:focus-visible) {
+		outline: none;
+	}
+	legend {
+		float: left;
+		width: 100%;
+		margin: 0;
+		padding: 0;
+		display: table;
+	}
+	legend + * {
+		clear: both;
+	}
+	fieldset {
+		border: 0;
+		min-width: 0;
+		margin: 0;
+		padding: 0.01em 0 0;
+	}
+	body:not(:-moz-handler-blocked) fieldset {
+		display: table-cell;
+	}
+	svg {
+		pointer-events: none;
+	}
+`,tr=Oe(`*, :before, :after {
             --w-rotate: 0;
             --w-rotate-x: 0;
             --w-rotate-y: 0;
@@ -2446,197 +2446,198 @@ Please compile your catalog first.
                 }
             }
         `);import{css as qe}from"lit";var _e=qe`
-  .w-slider-thumb {
-    position: relative;
-    display: grid;
-    pointer-events: none; /* For range inputs we position two of these on top of each other. Let clicks go through the top one. */
-    grid-template-areas:
-      "slider slider slider"
-      "frommarker . tomarker"
-      "fromtextfield . totextfield";
-    grid-template-columns: 1fr 24px 1fr;
-  }
-
-  .w-slider-thumb__range {
-    appearance: none;
-    background-color: transparent;
-    grid-area: slider;
-    height: 44px; /* touch target */
-    margin-left: 0;
-    pointer-events: none; /* let clicks pass through for range slider where we place two inputs over each other */
-  }
-
-  .w-slider-thumb__range::-webkit-slider-runnable-track {
-    box-shadow: none;
-    color: var(--w-s-color-text);
-    height: var(--w-slider-track-height);
-  }
-
-  /*
+	.w-slider-thumb {
+		position: relative;
+		display: grid;
+		pointer-events: none; /* For range inputs we position two of these on top of each other. Let clicks go through the top one. */
+		grid-template-areas:
+			"slider slider slider"
+			"frommarker . tomarker"
+			"fromtextfield . totextfield";
+		grid-template-columns: 1fr 24px 1fr;
+	}
+
+	.w-slider-thumb__range {
+		appearance: none;
+		background-color: transparent;
+		grid-area: slider;
+		height: 44px; /* touch target */
+		margin-left: 0;
+		pointer-events: none; /* let clicks pass through for range slider where we place two inputs over each other */
+	}
+
+	.w-slider-thumb__range::-webkit-slider-runnable-track {
+		box-shadow: none;
+		color: var(--w-s-color-text);
+		height: var(--w-slider-track-height);
+	}
+
+	/*
     Use anchor positioning to place the tooltip target in relation to the slider thumb.
     We use a polyfill to bring support to older Safari, Firefox at time of writing.
    */
-  .w-slider-thumb__range::-webkit-slider-thumb {
-    anchor-name: --thumb;
-
-    appearance: none;
-    cursor: pointer;
-    background: var(--w-slider-thumb-background);
-    border-radius: 50%;
-    height: var(--w-slider-thumb-size, 28px);
-    margin-top: calc(
-      -1 * calc(var(--w-slider-thumb-offset) - calc(
-              var(--w-slider-track-height) / 2
-            ))
-    );
-    pointer-events: initial;
-    width: var(--w-slider-thumb-size, 28px);
-    z-index: 1;
-  }
-
-  .w-slider-thumb__range[disabled]::-webkit-slider-thumb {
-    cursor: auto;
-  }
-
-  .w-slider-thumb__range::-moz-range-thumb {
-    anchor-name: --thumb;
-
-    appearance: none;
-    cursor: pointer;
-    background: var(--w-slider-thumb-background);
-    border-radius: 50%;
-    border-color: transparent;
-    height: var(--w-slider-thumb-size, 28px);
-    margin-top: calc(
-      -1 * calc(var(--w-slider-thumb-offset) - calc(
-              var(--w-slider-track-height) / 2
-            ))
-    );
-    pointer-events: initial;
-    width: var(--w-slider-thumb-size, 28px);
-    z-index: 1;
-
-    box-shadow: none;
-  }
-
-  .w-slider-thumb__range[disabled]::-moz-range-thumb {
-    cursor: auto;
-  }
-
-  .w-slider-thumb__range:active::-webkit-slider-thumb,
-  .w-slider-thumb__range:hover::-webkit-slider-thumb {
-    background: var(--w-slider-thumb-background);
-    box-shadow: var(--w-shadow-slider-handle-hover);
-  }
-
-  .w-slider-thumb__range:focus,
-  .w-slider-thumb__range:focus-visible {
-    outline: none;
-  }
-
-  .w-slider-thumb__range:focus-visible::-webkit-slider-thumb {
-    outline: 2px solid var(--w-s-color-border-focus);
-    outline-offset: var(--w-outline-offset, 1px);
-    box-shadow: none;
-  }
-
-  .w-slider-thumb__range:active::-moz-range-thumb,
-  .w-slider-thumb__range:hover::-moz-range-thumb {
-    background: var(--w-s-color-background-primary-hover);
-    box-shadow: var(--w-shadow-slider-handle-hover);
-  }
-
-  .w-slider-thumb__range:focus-visible::-moz-range-thumb {
-    outline: 2px solid var(--w-s-color-border-focus);
-    outline-offset: var(--w-outline-offset, 1px);
-    box-shadow: none;
-  }
-
-  .w-slider-thumb__tooltip-target {
-    display: block;
-    pointer-events: none;
-    position: absolute;
-    border: 2px solid transparent;
-    border-radius: 20px;
-    width: 8px;
-    height: 8px;
-    position-anchor: --thumb;
-    position-area: center; /* Position the tooltip target right on the range thumb */
-  }
-
-  /* Uncomment this to debug the invisible anchor target */
-  /* .w-slider-thumb__tooltip-target { border-color: lime; } */
-
-  .w-slider-thumb__from-marker,
-  .w-slider-thumb__to-marker {
-    margin-inline: 2px; /* visual alignment with input border, slider thumb */
-    color: var(--w-s-color-text-subtle);
-    font-size: var(--w-font-size-s);
-    line-height: var(--w-line-height-s);
-  }
-
-  .w-slider-thumb__from-marker {
-    grid-area: frommarker;
-  }
-
-  .w-slider-thumb__to-marker {
-    grid-area: tomarker;
-    text-align: right;
-  }
-
-  .w-slider-thumb__textfield {
-    margin-top: 12px;
-    pointer-events: auto;
-    grid-row: 3 / 4;
-    grid-column: 1 / 3; /* Single sliders should have the text field use the fromtextfield _and_ gap portion of the CSS grid. */
-  }
-
-  :host([slot="from"]) .w-slider-thumb__textfield {
-    grid-column: 1 / 2; /* Range sliders should leave the gap empty. */
-  }
-
-  :host([slot="from"]) .w-slider-thumb__range {
-    margin-left: var(--w-slider-thumb-size, 28px);
-  }
-
-  :host([slot="to"]) .w-slider-thumb__range {
-    margin-right: var(--w-slider-thumb-size, 28px);
-  }
-
-
-  :host([slot="from"]) .w-slider-thumb__tooltip-target {
-    transform: translateX(calc(-1 * var(--transform-offset, 0px) - 1px));
-  }
-
-  :host([slot="from"]) .w-slider-thumb__range::-webkit-slider-thumb {
-    transform: translateX(calc(-1 * var(--w-slider-thumb-size, 28px) - 1px));
-  }
-
-  :host([slot="from"]) .w-slider-thumb__range::-moz-range-thumb {
-    transform: translateX(calc(-1 * var(--w-slider-thumb-size, 28px) - 1px));
-  }
-
-  :host([slot="to"]) .w-slider-thumb__textfield {
-    grid-row: 3 / 4;
-    grid-column: 3 / 4;
-  }
-
-  :host([slot="to"]) .w-slider-thumb__tooltip-target {
-    transform: translateX(calc(var(--transform-offset, 0px) - 1px));
-  }
-
-  :host([slot="to"]) .w-slider-thumb__range::-webkit-slider-thumb {
-    transform: translateX(calc(var(--w-slider-thumb-size, 28px) - 1px));
-  }
-
-  :host([slot="to"]) .w-slider-thumb__range::-moz-range-thumb {
-    transform: translateX(calc(var(--w-slider-thumb-size, 28px) - 1px));
-  }
-
-  w-textfield {
-    --w-textfield-placeholder-color-text: var(--w-s-color-text);
-  }
-`;var D,d,B,G,ce,j,U,he,Ce,Ee,u=class extends xe(ze){constructor(){super(...arguments);te(this,d);this.ariaLabel=null;this.ariaDescription=null;this.disabled=!1;this.invalid=!1;this.openEnded=!1;this.required=!1;this.suffix="";this._showTooltip=!1;this._inputHasFocus=!1;this._hiddenTextfield=!1;te(this,D);this.anchorPositioningStyleElement=null}resetFormControl(){this.value=re(this,D),this.dispatchEvent(new CustomEvent("thumbreset",{bubbles:!0}))}async updateFieldAfterValidation(){let e=this.shadowRoot.querySelector("w-textfield");await m(this,d,U).call(this,e.value,!0)}async connectedCallback(){if(super.connectedCallback(),oe(this,D,this.value),this.setValue(this.value),this.slot&&!this.ariaDescription&&(this.slot==="from"?this.ariaDescription=E.t({id:"slider.label.from",comment:"Accessible label for the 'from value' input field in a range slider",message:"From"}):this.slot==="to"&&(this.ariaDescription=E.t({id:"slider.label.to",comment:"Accessible label for the 'to value' input field in a range slider",message:"To"}))),"anchorName"in document.documentElement.style)await this.updateComplete;else{let a=import.meta.url.substring(0,import.meta.url.lastIndexOf("/"));try{let[{default:i}]=await Promise.all([import(`${a}/oddbird-css-anchor-positioning.js`),this.updateComplete]);this.anchorPositioningStyleElement||(this.anchorPositioningStyleElement=document.createElement("style"),this.shadowRoot.prepend(this.anchorPositioningStyleElement)),this.anchorPositioningStyleElement.textContent=`
+	.w-slider-thumb__range::-webkit-slider-thumb {
+		anchor-name: --thumb;
+
+		appearance: none;
+		cursor: pointer;
+		background: var(--w-slider-thumb-background);
+		border-radius: 50%;
+		height: var(--w-slider-thumb-size, 28px);
+		margin-top: calc(
+			-1 *
+				calc(
+					var(--w-slider-thumb-offset) - calc(var(--w-slider-track-height) / 2)
+				)
+		);
+		pointer-events: initial;
+		width: var(--w-slider-thumb-size, 28px);
+		z-index: 1;
+	}
+
+	.w-slider-thumb__range[disabled]::-webkit-slider-thumb {
+		cursor: auto;
+	}
+
+	.w-slider-thumb__range::-moz-range-thumb {
+		anchor-name: --thumb;
+
+		appearance: none;
+		cursor: pointer;
+		background: var(--w-slider-thumb-background);
+		border-radius: 50%;
+		border-color: transparent;
+		height: var(--w-slider-thumb-size, 28px);
+		margin-top: calc(
+			-1 *
+				calc(
+					var(--w-slider-thumb-offset) - calc(var(--w-slider-track-height) / 2)
+				)
+		);
+		pointer-events: initial;
+		width: var(--w-slider-thumb-size, 28px);
+		z-index: 1;
+
+		box-shadow: none;
+	}
+
+	.w-slider-thumb__range[disabled]::-moz-range-thumb {
+		cursor: auto;
+	}
+
+	.w-slider-thumb__range:active::-webkit-slider-thumb,
+	.w-slider-thumb__range:hover::-webkit-slider-thumb {
+		background: var(--w-slider-thumb-background);
+		box-shadow: var(--w-shadow-slider-handle-hover);
+	}
+
+	.w-slider-thumb__range:focus,
+	.w-slider-thumb__range:focus-visible {
+		outline: none;
+	}
+
+	.w-slider-thumb__range:focus-visible::-webkit-slider-thumb {
+		outline: 2px solid var(--w-s-color-border-focus);
+		outline-offset: var(--w-outline-offset, 1px);
+		box-shadow: none;
+	}
+
+	.w-slider-thumb__range:active::-moz-range-thumb,
+	.w-slider-thumb__range:hover::-moz-range-thumb {
+		background: var(--w-s-color-background-primary-hover);
+		box-shadow: var(--w-shadow-slider-handle-hover);
+	}
+
+	.w-slider-thumb__range:focus-visible::-moz-range-thumb {
+		outline: 2px solid var(--w-s-color-border-focus);
+		outline-offset: var(--w-outline-offset, 1px);
+		box-shadow: none;
+	}
+
+	.w-slider-thumb__tooltip-target {
+		display: block;
+		pointer-events: none;
+		position: absolute;
+		border: 2px solid transparent;
+		border-radius: 20px;
+		width: 8px;
+		height: 8px;
+		position-anchor: --thumb;
+		position-area: center; /* Position the tooltip target right on the range thumb */
+	}
+
+	/* Uncomment this to debug the invisible anchor target */
+	/* .w-slider-thumb__tooltip-target { border-color: lime; } */
+
+	.w-slider-thumb__from-marker,
+	.w-slider-thumb__to-marker {
+		margin-inline: 2px; /* visual alignment with input border, slider thumb */
+		color: var(--w-s-color-text-subtle);
+		font-size: var(--w-font-size-s);
+		line-height: var(--w-line-height-s);
+	}
+
+	.w-slider-thumb__from-marker {
+		grid-area: frommarker;
+	}
+
+	.w-slider-thumb__to-marker {
+		grid-area: tomarker;
+		text-align: right;
+	}
+
+	.w-slider-thumb__textfield {
+		margin-top: 12px;
+		pointer-events: auto;
+		grid-row: 3 / 4;
+		grid-column: 1 / 3; /* Single sliders should have the text field use the fromtextfield _and_ gap portion of the CSS grid. */
+	}
+
+	:host([slot="from"]) .w-slider-thumb__textfield {
+		grid-column: 1 / 2; /* Range sliders should leave the gap empty. */
+	}
+
+	:host([slot="from"]) .w-slider-thumb__range {
+		margin-left: var(--w-slider-thumb-size, 28px);
+	}
+
+	:host([slot="to"]) .w-slider-thumb__range {
+		margin-right: var(--w-slider-thumb-size, 28px);
+	}
+
+	:host([slot="from"]) .w-slider-thumb__tooltip-target {
+		transform: translateX(calc(-1 * var(--transform-offset, 0px) - 1px));
+	}
+
+	:host([slot="from"]) .w-slider-thumb__range::-webkit-slider-thumb {
+		transform: translateX(calc(-1 * var(--w-slider-thumb-size, 28px) - 1px));
+	}
+
+	:host([slot="from"]) .w-slider-thumb__range::-moz-range-thumb {
+		transform: translateX(calc(-1 * var(--w-slider-thumb-size, 28px) - 1px));
+	}
+
+	:host([slot="to"]) .w-slider-thumb__textfield {
+		grid-row: 3 / 4;
+		grid-column: 3 / 4;
+	}
+
+	:host([slot="to"]) .w-slider-thumb__tooltip-target {
+		transform: translateX(calc(var(--transform-offset, 0px) - 1px));
+	}
+
+	:host([slot="to"]) .w-slider-thumb__range::-webkit-slider-thumb {
+		transform: translateX(calc(var(--w-slider-thumb-size, 28px) - 1px));
+	}
+
+	:host([slot="to"]) .w-slider-thumb__range::-moz-range-thumb {
+		transform: translateX(calc(var(--w-slider-thumb-size, 28px) - 1px));
+	}
+
+	w-textfield {
+		--w-textfield-placeholder-color-text: var(--w-s-color-text);
+	}
+`;var He=/WebKit/,Ze=/Chrome/,D,d,B,G,ce,j,U,he,Ce,Ee,u=class extends xe(ze){constructor(){super(...arguments);te(this,d);this.ariaLabel=null;this.ariaDescription=null;this.disabled=!1;this.invalid=!1;this.openEnded=!1;this.required=!1;this.suffix="";this._showTooltip=!1;this._inputHasFocus=!1;this._hiddenTextfield=!1;te(this,D);this.anchorPositioningStyleElement=null}resetFormControl(){this.value=re(this,D),this.dispatchEvent(new CustomEvent("thumbreset",{bubbles:!0}))}async updateFieldAfterValidation(){let e=this.shadowRoot.querySelector("w-textfield");await m(this,d,U).call(this,e.value,!0)}async connectedCallback(){if(super.connectedCallback(),oe(this,D,this.value),this.setValue(this.value),this.slot&&!this.ariaDescription&&(this.slot==="from"?this.ariaDescription=E.t({id:"slider.label.from",comment:"Accessible label for the 'from value' input field in a range slider",message:"From"}):this.slot==="to"&&(this.ariaDescription=E.t({id:"slider.label.to",comment:"Accessible label for the 'to value' input field in a range slider",message:"To"}))),"anchorName"in document.documentElement.style)await this.updateComplete;else{let a=import.meta.url.substring(0,import.meta.url.lastIndexOf("/"));try{let[{default:i}]=await Promise.all([import(`${a}/oddbird-css-anchor-positioning.js`),this.updateComplete]);this.anchorPositioningStyleElement||(this.anchorPositioningStyleElement=document.createElement("style"),this.shadowRoot.prepend(this.anchorPositioningStyleElement)),this.anchorPositioningStyleElement.textContent=`
         /*
          * The polyfill can only anchor to ::before and ::after pseudo elements, not the pseudo element slider thumb.
          * We work around that by recreating a transparent version of the active range
@@ -2685,90 +2686,86 @@ Please compile your catalog first.
           left: anchor(--polyfilled-thumb left);
           margin-left: 38px;
         }
-      `,await i({roots:[this.shadowRoot],elements:[this.anchorPositioningStyleElement]})}catch(i){console.error(new Error("Error registering the CSS anchor positioning polyfill. The UI will look broken.",{cause:i}))}}let e=window.navigator.userAgent;/WebKit/.test(e)&&!/Chrome/.test(e)&&this.tooltipTarget&&this.tooltipTarget.style.setProperty("--transform-offset","var(--w-slider-thumb-size, 28px)"),m(this,d,ce).call(this)}get boundaryValue(){return this.slot==="from"?this.min:this.max}get textFieldDisplayValue(){return this._inputHasFocus?this.value!==""?this.value:this.range?.value?Math.min(Math.max(Number(this.range.value),Number(this.min)+1),Number(this.max)-1).toString():"":this.value}get tooltipDisplayValue(){let e=0;return this.tooltipFormatter?e=this.tooltipFormatter(this.value,this.slot):this.valueFormatter?e=this.valueFormatter(this.value,this.slot):this.value===""?e=this.range?.value??this.boundaryValue:e=this.value||0,e}get ariaDescriptionText(){let e="",t=this.ariaDescription||"",a=this.value==="";return this.openEnded&&a&&(e=this.slot==="from"?E.t({id:"slider.placeholder.from",message:"Min"}):E.t({id:"slider.placeholder.to",message:"Max"})),e?`${e}, ${t}`:t}updated(e){if(e.has("openEnded")&&this.openEnded&&!this.placeholder&&(this.slot==="to"||this.slot===""?this.placeholder=E.t({id:"slider.placeholder.to",message:"Max",comment:"Max as in short for Maximum"}):this.slot==="from"&&(this.placeholder=E.t({id:"slider.placeholder.from",message:"Min",comment:"Min as in short for Minimum"}))),e.has("value")){typeof re(this,D)>"u"&&typeof this.value<"u"&&oe(this,D,this.value),this.setValue(this.value),m(this,d,ce).call(this);let t=e.get("value");this.value===""&&t&&this.dispatchEvent(new CustomEvent("thumbreset",{bubbles:!0}))}}render(){let e=this.placeholder&&!this.value;return q`
-      <div class="w-slider-thumb">
-        ${"anchorName"in document.documentElement.style?A:q`<div class="polyfill-range">
-              <div class="polyfill-active-range"></div>
-            </div>`}
-        <input
-          id="range"
-          aria-label="${this.ariaLabel}"
-          aria-describedby="${K(this.ariaDescription?"aria-description":void 0)}"
-          class="w-slider-thumb__range"
-          type="range"
-          .value="${this.value}"
-          min="${this.min}"
-          max="${this.max}"
-          step="${K(!this.openEnded&&this.step?this.step:void 0)}"
-          ?disabled="${this.disabled}"
-          @mousedown="${m(this,d,B)}"
-          @mouseup="${m(this,d,G)}"
-          @touchstart="${m(this,d,B)}"
-          @touchend="${m(this,d,G)}"
-          @focus="${m(this,d,B)}"
-          @blur="${m(this,d,G)}"
-          @input="${m(this,d,he)}"
-          @keydown="${m(this,d,Ce)}"
-        />
-
-        ${this.slot==="from"||!this.slot?q`
-              <span class="sr-only">
-                ${E.t({id:"slider.label.from",message:"From"})+" "+(this.labelFormatter?this.labelFormatter("from"):this.min)+", "+E.t({id:"slider.label.to",message:"To"})+" "+(this.labelFormatter?this.labelFormatter("to"):this.max)}
-              </span>`:A}
-
-        <span
-          aria-hidden="true"
-          class="w-slider-thumb__from-marker"
-        >
-          ${this.labelFormatter?this.labelFormatter("from"):this.min}
-        </span>
-        <span
-          aria-hidden="true"
-          class="w-slider-thumb__to-marker"
-        >
-          ${this.labelFormatter?this.labelFormatter("to"):this.max}
-        </span>
-
-        <w-textfield
-          aria-label="${this.ariaLabel}"
-          aria-description="${K(this.ariaDescriptionText)}"
-          class="${Ue({"w-slider-thumb__textfield":!0,"sr-only":this._hiddenTextfield})}"
-          type="number"
-          tabindex="${this._hiddenTextfield?-1:A}"
-          placeholder="${this.placeholder}"
-          .value="${this.textFieldDisplayValue}"
-          .formatter=${this.valueFormatter&&!e?t=>this.valueFormatter(t,this.slot):A}
-          min="${this.openEnded?A:this.min}"
-          max="${this.openEnded?A:this.max}"
-          step="${K(this.step)}"
-          ?invalid="${!!this.invalid}"
-          @input="${m(this,d,he)}"
-          @keydown="${m(this,d,Ee)}"
-          ?disabled="${this.disabled}"
-        >
-          ${this.suffix??""?q`<w-affix slot="suffix" label="${this.suffix??""}"></w-affix>`:A}
-        </w-textfield>
-        <w-attention
-          tooltip
-          placement="top"
-          flip
-          distance="24"
-          .show="${this._showTooltip}"
-        >
-          <output
-            id="target"
-            class="w-slider-thumb__tooltip-target"
-            slot="target"
-          ></output>
-          <span slot="message">
-            ${this.tooltipDisplayValue}${this.suffix??""?q`&nbsp;${this.suffix??""}`:A}
-          </span>
-        </w-attention>
-
-        <!-- aria-description is still not recommended for general use, so make a visually hidden element and refer to it with aria-describedby -->
-        <span class="sr-only" id="aria-description">
-          ${this.ariaDescriptionText}
-        </span>
-      </div>
-    `}};D=new WeakMap,d=new WeakSet,B=function(){this._showTooltip=!0,this.shadowRoot.querySelector("w-attention").handleDone()},G=function(){this._showTooltip=!1},ce=function(){this.range&&(this.value===""?this.range.value=this.boundaryValue:this.value&&(this.range.value=this.value))},j=function(e){this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:e,slot:this.slot}}))},U=async function(e,t){let a=this.suffix??"",i=Number.parseInt(e);if(this.openEnded&&!t&&this.step&&!(this.slot==="to"&&i>=Number(this.max)-1||this.slot==="from"&&i<=Number(this.min)+1)){let y=1/this.step;i=Math.round(i*y)/y,e=i.toString()}let n=Number.parseInt(this.max),s=Number.parseInt(this.min);if(!this.openEnded&&(i>n||i<s))return m(this,d,j).call(this,E.t({id:"slider.error.out_of_bounds",message:"Value must be between {min} and {max}",values:{min:`${this.min} ${a}`.trim(),max:`${this.max} ${a}`.trim()}})),{shouldCancel:!0};e===""&&this.required&&m(this,d,j).call(this,E.t({id:"slider.error.required",message:"This field is required"})),this.value=e;let b=e===this.max||e===this.min,f=!1;if(this.slot){let F=this.parentElement.querySelector('w-slider-thumb[slot="to"]'),y=this.parentElement.querySelector('w-slider-thumb[slot="from"]'),$=F.textfield.value||this.max,x=y.textfield.value||this.min,z=Number.parseInt($),M=Number.parseInt(x),k=E.t({id:"slider.error.overlap",message:"The maximum value cannot be less than the minimum"});if(this.slot==="from"){let _=this.openEnded&&z>n?z:Math.min(z,this.openEnded?n-1:n);i>_&&(f=!0,this.openEnded&&b?this.value=String(_):this.value=$,t&&(m(this,d,j).call(this,k),await this.updateComplete,this.textfield.value=e))}else{let _=this.openEnded&&M<s?M:Math.max(Number.parseInt(x),this.openEnded?s+1:s);i<_&&(f=!0,this.openEnded&&b?this.value=String(_):this.value=x,t&&(m(this,d,j).call(this,k),await this.updateComplete,this.textfield.value=e))}}return f?{shouldCancel:!0}:(m(this,d,j).call(this,""),this.range.value=Math.min(Math.max(Number(e),Number(this.min)),Number(this.max)).toString(),this.value=this.openEnded&&!t&&b?"":e,this.shadowRoot.querySelector("w-attention").handleDone(),{shouldCancel:!1})},he=async function(e){let t=e.currentTarget.tagName==="W-TEXTFIELD";if(e instanceof CustomEvent)return!1;let a=e.currentTarget.value;return(await m(this,d,U).call(this,a,t)).shouldCancel?(e.preventDefault(),!1):!0},Ce=async function(e){if(e.key==="Enter"&&this.internals.form){this.internals.form.requestSubmit();return}if(!this.openEnded||e.key!=="ArrowLeft"&&e.key!=="ArrowRight")return;let t=Number(this.range.value),a=this.step||1,i;e.key==="ArrowLeft"?i=t-a:i=t+a,i=Math.min(Math.max(i,Number(this.min)),Number(this.max)),(await m(this,d,U).call(this,i.toString(),!1)).shouldCancel&&e.preventDefault()},Ee=async function(e){if(e.key==="Enter"&&this.internals.form){this.internals.form.requestSubmit();return}if(this.textfield.value)return;let t="";this.slot==="from"?e.key==="ArrowUp"?t=String(Number(this.min)+1)||"1":e.key==="ArrowDown"&&(t=String(Number(this.min))||"0"):e.key==="ArrowUp"?t=String(Number(this.max))||"100":e.key==="ArrowDown"&&(t=String(Number(this.max)-1)||"99"),t&&(e.preventDefault(),await m(this,d,U).call(this,t,!0))},u.shadowRootOptions={...ze.shadowRootOptions,delegatesFocus:!0},u.styles=[ye,ke,_e],p([V({attribute:"aria-label"})],u.prototype,"ariaLabel",2),p([V({attribute:"aria-description"})],u.prototype,"ariaDescription",2),p([V({reflect:!0})],u.prototype,"name",2),p([V({reflect:!0})],u.prototype,"value",2),p([V({type:Boolean,reflect:!0})],u.prototype,"disabled",2),p([V({type:Boolean,reflect:!0})],u.prototype,"invalid",2),p([V({attribute:!1,reflect:!1})],u.prototype,"openEnded",2),p([V({reflect:!0})],u.prototype,"placeholder",2),p([P()],u.prototype,"markers",2),p([P()],u.prototype,"required",2),p([P()],u.prototype,"step",2),p([P()],u.prototype,"min",2),p([P()],u.prototype,"max",2),p([P()],u.prototype,"suffix",2),p([V({attribute:!1})],u.prototype,"valueFormatter",2),p([V({attribute:!1})],u.prototype,"tooltipFormatter",2),p([V({attribute:!1})],u.prototype,"labelFormatter",2),p([de('input[type="range"]')],u.prototype,"range",2),p([de(".w-slider-thumb__tooltip-target")],u.prototype,"tooltipTarget",2),p([de("w-textfield")],u.prototype,"textfield",2),p([P()],u.prototype,"_showTooltip",2),p([P()],u.prototype,"_inputHasFocus",2),p([P()],u.prototype,"_hiddenTextfield",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",u);export{u as WarpSliderThumb};
+      `,await i({roots:[this.shadowRoot],elements:[this.anchorPositioningStyleElement]})}catch(i){console.error(new Error("Error registering the CSS anchor positioning polyfill. The UI will look broken.",{cause:i}))}}let e=window.navigator.userAgent;He.test(e)&&!Ze.test(e)&&this.tooltipTarget&&this.tooltipTarget.style.setProperty("--transform-offset","var(--w-slider-thumb-size, 28px)"),m(this,d,ce).call(this)}get boundaryValue(){return this.slot==="from"?this.min:this.max}get textFieldDisplayValue(){return this._inputHasFocus?this.value!==""?this.value:this.range?.value?Math.min(Math.max(Number(this.range.value),Number(this.min)+1),Number(this.max)-1).toString():"":this.value}get tooltipDisplayValue(){let e;return this.tooltipFormatter?e=this.tooltipFormatter(this.value,this.slot):this.valueFormatter?e=this.valueFormatter(this.value,this.slot):this.value===""?e=this.range?.value??this.boundaryValue:e=this.value||0,e}get ariaDescriptionText(){let e="",t=this.ariaDescription||"",a=this.value==="";return this.openEnded&&a&&(e=this.slot==="from"?E.t({id:"slider.placeholder.from",message:"Min"}):E.t({id:"slider.placeholder.to",message:"Max"})),e?`${e}, ${t}`:t}updated(e){if(e.has("openEnded")&&this.openEnded&&!this.placeholder&&(this.slot==="to"||this.slot===""?this.placeholder=E.t({id:"slider.placeholder.to",message:"Max",comment:"Max as in short for Maximum"}):this.slot==="from"&&(this.placeholder=E.t({id:"slider.placeholder.from",message:"Min",comment:"Min as in short for Minimum"}))),e.has("value")){typeof re(this,D)>"u"&&typeof this.value<"u"&&oe(this,D,this.value),this.setValue(this.value),m(this,d,ce).call(this);let t=e.get("value");this.value===""&&t&&this.dispatchEvent(new CustomEvent("thumbreset",{bubbles:!0}))}}render(){let e=this.placeholder&&!this.value;return q`
+			<div class="w-slider-thumb">
+				${"anchorName"in document.documentElement.style?A:q`<div class="polyfill-range">
+							<div class="polyfill-active-range"></div>
+						</div>`}
+				<input
+					id="range"
+					aria-label="${this.ariaLabel}"
+					aria-describedby="${K(this.ariaDescription?"aria-description":void 0)}"
+					class="w-slider-thumb__range"
+					type="range"
+					.value="${this.value}"
+					min="${this.min}"
+					max="${this.max}"
+					step="${K(!this.openEnded&&this.step?this.step:void 0)}"
+					?disabled="${this.disabled}"
+					@mousedown="${m(this,d,B)}"
+					@mouseup="${m(this,d,G)}"
+					@touchstart="${m(this,d,B)}"
+					@touchend="${m(this,d,G)}"
+					@focus="${m(this,d,B)}"
+					@blur="${m(this,d,G)}"
+					@input="${m(this,d,he)}"
+					@keydown="${m(this,d,Ce)}"
+				/>
+
+				${this.slot==="from"||!this.slot?q` <span class="sr-only">
+							${E.t({id:"slider.label.from",message:"From"})+" "+(this.labelFormatter?this.labelFormatter("from"):this.min)+", "+E.t({id:"slider.label.to",message:"To"})+" "+(this.labelFormatter?this.labelFormatter("to"):this.max)}
+						</span>`:A}
+
+				<span aria-hidden="true" class="w-slider-thumb__from-marker">
+					${this.labelFormatter?this.labelFormatter("from"):this.min}
+				</span>
+				<span aria-hidden="true" class="w-slider-thumb__to-marker">
+					${this.labelFormatter?this.labelFormatter("to"):this.max}
+				</span>
+
+				<w-textfield
+					aria-label="${this.ariaLabel}"
+					aria-description="${K(this.ariaDescriptionText)}"
+					class="${Ue({"w-slider-thumb__textfield":!0,"sr-only":this._hiddenTextfield})}"
+					type="number"
+					tabindex="${this._hiddenTextfield?-1:A}"
+					placeholder="${this.placeholder}"
+					.value="${this.textFieldDisplayValue}"
+					.formatter=${this.valueFormatter&&!e?t=>this.valueFormatter(t,this.slot):A}
+					min="${this.openEnded?A:this.min}"
+					max="${this.openEnded?A:this.max}"
+					step="${K(this.step)}"
+					?invalid="${!!this.invalid}"
+					@input="${m(this,d,he)}"
+					@keydown="${m(this,d,Ee)}"
+					?disabled="${this.disabled}"
+				>
+					${this.suffix??""?q`<w-affix
+								slot="suffix"
+								label="${this.suffix??""}"
+							></w-affix>`:A}
+				</w-textfield>
+				<w-attention
+					tooltip
+					placement="top"
+					flip
+					distance="24"
+					.show="${this._showTooltip}"
+				>
+					<output
+						id="target"
+						class="w-slider-thumb__tooltip-target"
+						slot="target"
+					></output>
+					<span slot="message">
+						${this.tooltipDisplayValue}${this.suffix??""?q`&nbsp;${this.suffix??""}`:A}
+					</span>
+				</w-attention>
+
+				<!-- aria-description is still not recommended for general use, so make a visually hidden element and refer to it with aria-describedby -->
+				<span class="sr-only" id="aria-description">
+					${this.ariaDescriptionText}
+				</span>
+			</div>
+		`}};D=new WeakMap,d=new WeakSet,B=function(){this._showTooltip=!0,this.shadowRoot.querySelector("w-attention").handleDone()},G=function(){this._showTooltip=!1},ce=function(){this.range&&(this.value===""?this.range.value=this.boundaryValue:this.value&&(this.range.value=this.value))},j=function(e){this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:e,slot:this.slot}}))},U=async function(e,t){let a=this.suffix??"",i=Number.parseInt(e);if(this.openEnded&&!t&&this.step&&!(this.slot==="to"&&i>=Number(this.max)-1||this.slot==="from"&&i<=Number(this.min)+1)){let y=1/this.step;i=Math.round(i*y)/y,e=i.toString()}let n=Number.parseInt(this.max),s=Number.parseInt(this.min);if(!this.openEnded&&(i>n||i<s))return m(this,d,j).call(this,E.t({id:"slider.error.out_of_bounds",message:"Value must be between {min} and {max}",values:{min:`${this.min} ${a}`.trim(),max:`${this.max} ${a}`.trim()}})),{shouldCancel:!0};e===""&&this.required&&m(this,d,j).call(this,E.t({id:"slider.error.required",message:"This field is required"})),this.value=e;let b=e===this.max||e===this.min,f=!1;if(this.slot){let F=this.parentElement.querySelector('w-slider-thumb[slot="to"]'),y=this.parentElement.querySelector('w-slider-thumb[slot="from"]'),$=F.textfield.value||this.max,x=y.textfield.value||this.min,z=Number.parseInt($),M=Number.parseInt(x),k=E.t({id:"slider.error.overlap",message:"The maximum value cannot be less than the minimum"});if(this.slot==="from"){let _=this.openEnded&&z>n?z:Math.min(z,this.openEnded?n-1:n);i>_&&(f=!0,this.openEnded&&b?this.value=String(_):this.value=$,t&&(m(this,d,j).call(this,k),await this.updateComplete,this.textfield.value=e))}else{let _=this.openEnded&&M<s?M:Math.max(Number.parseInt(x),this.openEnded?s+1:s);i<_&&(f=!0,this.openEnded&&b?this.value=String(_):this.value=x,t&&(m(this,d,j).call(this,k),await this.updateComplete,this.textfield.value=e))}}return f?{shouldCancel:!0}:(m(this,d,j).call(this,""),this.range.value=Math.min(Math.max(Number(e),Number(this.min)),Number(this.max)).toString(),this.value=this.openEnded&&!t&&b?"":e,this.shadowRoot.querySelector("w-attention").handleDone(),{shouldCancel:!1})},he=async function(e){let t=e.currentTarget.tagName==="W-TEXTFIELD";if(e instanceof CustomEvent)return!1;let a=e.currentTarget.value;return(await m(this,d,U).call(this,a,t)).shouldCancel?(e.preventDefault(),!1):!0},Ce=async function(e){if(e.key==="Enter"&&this.internals.form){this.internals.form.requestSubmit();return}if(!this.openEnded||e.key!=="ArrowLeft"&&e.key!=="ArrowRight")return;let t=Number(this.range.value),a=this.step||1,i;e.key==="ArrowLeft"?i=t-a:i=t+a,i=Math.min(Math.max(i,Number(this.min)),Number(this.max)),(await m(this,d,U).call(this,i.toString(),!1)).shouldCancel&&e.preventDefault()},Ee=async function(e){if(e.key==="Enter"&&this.internals.form){this.internals.form.requestSubmit();return}if(this.textfield.value)return;let t="";this.slot==="from"?e.key==="ArrowUp"?t=String(Number(this.min)+1)||"1":e.key==="ArrowDown"&&(t=String(Number(this.min))||"0"):e.key==="ArrowUp"?t=String(Number(this.max))||"100":e.key==="ArrowDown"&&(t=String(Number(this.max)-1)||"99"),t&&(e.preventDefault(),await m(this,d,U).call(this,t,!0))},u.shadowRootOptions={...ze.shadowRootOptions,delegatesFocus:!0},u.styles=[ye,ke,_e],p([V({attribute:"aria-label"})],u.prototype,"ariaLabel",2),p([V({attribute:"aria-description"})],u.prototype,"ariaDescription",2),p([V({reflect:!0})],u.prototype,"name",2),p([V({reflect:!0})],u.prototype,"value",2),p([V({type:Boolean,reflect:!0})],u.prototype,"disabled",2),p([V({type:Boolean,reflect:!0})],u.prototype,"invalid",2),p([V({attribute:!1,reflect:!1})],u.prototype,"openEnded",2),p([V({reflect:!0})],u.prototype,"placeholder",2),p([P()],u.prototype,"markers",2),p([P()],u.prototype,"required",2),p([P()],u.prototype,"step",2),p([P()],u.prototype,"min",2),p([P()],u.prototype,"max",2),p([P()],u.prototype,"suffix",2),p([V({attribute:!1})],u.prototype,"valueFormatter",2),p([V({attribute:!1})],u.prototype,"tooltipFormatter",2),p([V({attribute:!1})],u.prototype,"labelFormatter",2),p([de('input[type="range"]')],u.prototype,"range",2),p([de(".w-slider-thumb__tooltip-target")],u.prototype,"tooltipTarget",2),p([de("w-textfield")],u.prototype,"textfield",2),p([P()],u.prototype,"_showTooltip",2),p([P()],u.prototype,"_inputHasFocus",2),p([P()],u.prototype,"_hiddenTextfield",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",u);export{u as WarpSliderThumb};
 //# sourceMappingURL=slider-thumb.js.map