@warp-ds/elements 2.3.0-next.12 → 2.3.0-next.14

package/dist/packages/select/select.stories.js

@@ -32,14 +32,14 @@ export const Default = {
 export const HelpText = {
     args: {
         label: 'Berries',
-        'help-text': 'We assume this is your jam preference'
+        'help-text': 'We assume this is your jam preference',
     },
 };
 export const Invalid = {
     args: {
         label: 'Berries',
         invalid: true,
-        'help-text': 'Wrong choice'
+        'help-text': 'Wrong choice',
     },
 };
 export const Disabled = {

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

@@ -1,4 +1,4 @@
-var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{throw TypeError(s)};var d=(s,r,e,o)=>{for(var a=o>1?void 0:o?se(r,e):r,p=s.length-1,m;p>=0;p--)(m=s[p])&&(a=(o?m(r,e,a):m(a))||a);return o&&a&&ne(r,e,a),a};var le=(s,r,e)=>r.has(s)||G("Cannot "+e);var W=(s,r,e)=>r.has(s)?G("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(s):r.set(s,e);var v=(s,r,e)=>(le(s,r,"access private method"),e);var n=function(s,r,e,o){if(e==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?s!==r||!o:!r.has(s))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?o:e==="a"?o.call(s):o?o.value:r.get(s)},h=function(s,r,e,o,a){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof r=="function"?s!==r||!a:!r.has(s))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?a.call(s,e):a?a.value=e:r.set(s,e),e};function J(s){var r,e,o,a,p,m,w,Y,x,V,F,E,f,P,A,_,O,D,L;class ie extends s{constructor(...t){var i,c,b;super(...t),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),o.set(this,!1),a.set(this,!1),p.set(this,void 0),m.set(this,void 0),w.set(this,!0),x.set(this,""),V.set(this,()=>{h(this,a,!0,"f"),h(this,e,!0,"f"),n(this,r,"m",_).call(this)}),F.set(this,()=>{h(this,e,!1,"f"),n(this,r,"m",O).call(this,this.shouldFormValueUpdate()?n(this,x,"f"):""),!this.validity.valid&&n(this,a,"f")&&h(this,o,!0,"f");let k=n(this,r,"m",_).call(this);this.validationMessageCallback&&this.validationMessageCallback(k?this.internals.validationMessage:"")}),E.set(this,()=>{var k;n(this,w,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),h(this,w,!1,"f")),h(this,a,!0,"f"),h(this,o,!0,"f"),n(this,r,"m",_).call(this),(k=this===null||this===void 0?void 0:this.validationMessageCallback)===null||k===void 0||k.call(this,this.showError?this.internals.validationMessage:"")}),f.set(this,void 0),P.set(this,!1),A.set(this,Promise.resolve()),(i=this.addEventListener)===null||i===void 0||i.call(this,"focus",n(this,V,"f")),(c=this.addEventListener)===null||c===void 0||c.call(this,"blur",n(this,F,"f")),(b=this.addEventListener)===null||b===void 0||b.call(this,"invalid",n(this,E,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let t=this.validators.map(b=>b.attribute).flat(),i=super.observedAttributes||[];return[...new Set([...i,...t])]}static getValidator(t){return this.validators.find(i=>i.attribute===t)||null}static getValidators(t){return this.validators.filter(i=>{var c;if(i.attribute===t||!((c=i.attribute)===null||c===void 0)&&c.includes(t))return!0})}get form(){return this.internals.form}get showError(){return n(this,r,"m",_).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(t,i,c){var b;(b=super.attributeChangedCallback)===null||b===void 0||b.call(this,t,i,c);let j=this.constructor.getValidators(t);j!=null&&j.length&&this.validationTarget&&this.setValue(n(this,x,"f"))}setValue(t){var i;h(this,o,!1,"f"),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,""),h(this,x,t,"f");let b=this.shouldFormValueUpdate()?t:null;this.internals.setFormValue(b),n(this,r,"m",O).call(this,b),this.valueChangedCallback&&this.valueChangedCallback(b),n(this,r,"m",_).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(t=>t(n(this,A,"f")))}formResetCallback(){var t,i;h(this,a,!1,"f"),h(this,o,!1,"f"),n(this,r,"m",_).call(this),(t=this.resetFormControl)===null||t===void 0||t.call(this),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,n(this,r,"m",_).call(this)?this.validationMessage:"")}}return e=new WeakMap,o=new WeakMap,a=new WeakMap,p=new WeakMap,m=new WeakMap,w=new WeakMap,x=new WeakMap,V=new WeakMap,F=new WeakMap,E=new WeakMap,f=new WeakMap,P=new WeakMap,A=new WeakMap,r=new WeakSet,Y=function(){let t=this.getRootNode(),i=`${this.localName}[name="${this.getAttribute("name")}"]`;return t.querySelectorAll(i)},_=function(){if(this.hasAttribute("disabled"))return!1;let t=n(this,o,"f")||n(this,a,"f")&&!this.validity.valid&&!n(this,e,"f");return t&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),t},O=function(t){let i=this.constructor,c={},b=i.validators,k=[],j=b.some(g=>g.isValid instanceof Promise);n(this,P,"f")||(h(this,A,new Promise(g=>{h(this,f,g,"f")}),"f"),h(this,P,!0,"f")),n(this,p,"f")&&(n(this,p,"f").abort(),h(this,m,n(this,p,"f"),"f"));let X=new AbortController;h(this,p,X,"f");let N,B=!1;b.length&&(b.forEach(g=>{let T=g.key||"customError",$=g.isValid(this,t,X.signal);$ instanceof Promise?(k.push($),$.then(Z=>{Z!=null&&(c[T]=!Z,N=n(this,r,"m",L).call(this,g,t),n(this,r,"m",D).call(this,c,N))})):(c[T]=!$,this.validity[T]!==!$&&(B=!0),!$&&!N&&(N=n(this,r,"m",L).call(this,g,t)))}),Promise.allSettled(k).then(()=>{var g;X!=null&&X.signal.aborted||(h(this,P,!1,"f"),(g=n(this,f,"f"))===null||g===void 0||g.call(this))}),(B||!j)&&n(this,r,"m",D).call(this,c,N))},D=function(t,i){if(this.validationTarget)this.internals.setValidity(t,i,this.validationTarget),h(this,w,!1,"f");else{if(this.internals.setValidity(t,i),this.internals.validity.valid)return;h(this,w,!0,"f")}},L=function(t,i){if(this.validityCallback){let c=this.validityCallback(t.key||"customError");if(c)return c}return t.message instanceof Function?t.message(this,i):t.message},ie}import{html as M,LitElement as oe,nothing as z}from"lit";import{property as C,query as te,state as y}from"lit/decorators.js";import{ifDefined as U}from"lit/directives/if-defined.js";import{css as K}from"lit";var Q=K`
+var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{throw TypeError(s)};var h=(s,o,e,r)=>{for(var a=r>1?void 0:r?de(o,e):o,d=s.length-1,m;d>=0;d--)(m=s[d])&&(a=(r?m(o,e,a):m(a))||a);return r&&a&&le(o,e,a),a};var ce=(s,o,e)=>o.has(s)||K("Cannot "+e);var W=(s,o,e)=>o.has(s)?K("Cannot add the same private member more than once"):o instanceof WeakSet?o.add(s):o.set(s,e);var g=(s,o,e)=>(ce(s,o,"access private method"),e);var n=function(s,o,e,r){if(e==="a"&&!r)throw new TypeError("Private accessor was defined without a getter");if(typeof o=="function"?s!==o||!r:!o.has(s))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?r:e==="a"?r.call(s):r?r.value:o.get(s)},u=function(s,o,e,r,a){if(r==="m")throw new TypeError("Private method is not writable");if(r==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof o=="function"?s!==o||!a:!o.has(s))throw new TypeError("Cannot write private member to an object whose class did not declare it");return r==="a"?a.call(s,e):a?a.value=e:o.set(s,e),e};function J(s){var o,e,r,a,d,m,w,M,f,x,F,k,j,P,A,C,D,L,I;class se extends s{constructor(...t){var i,b,p;super(...t),o.add(this),this.internals=this.attachInternals(),e.set(this,!1),r.set(this,!1),a.set(this,!1),d.set(this,void 0),m.set(this,void 0),w.set(this,!0),f.set(this,""),x.set(this,()=>{u(this,a,!0,"f"),u(this,e,!0,"f"),n(this,o,"m",C).call(this)}),F.set(this,()=>{u(this,e,!1,"f"),n(this,o,"m",D).call(this,this.shouldFormValueUpdate()?n(this,f,"f"):""),!this.validity.valid&&n(this,a,"f")&&u(this,r,!0,"f");let y=n(this,o,"m",C).call(this);this.validationMessageCallback&&this.validationMessageCallback(y?this.internals.validationMessage:"")}),k.set(this,()=>{var y;n(this,w,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),u(this,w,!1,"f")),u(this,a,!0,"f"),u(this,r,!0,"f"),n(this,o,"m",C).call(this),(y=this===null||this===void 0?void 0:this.validationMessageCallback)===null||y===void 0||y.call(this,this.showError?this.internals.validationMessage:"")}),j.set(this,void 0),P.set(this,!1),A.set(this,Promise.resolve()),(i=this.addEventListener)===null||i===void 0||i.call(this,"focus",n(this,x,"f")),(b=this.addEventListener)===null||b===void 0||b.call(this,"blur",n(this,F,"f")),(p=this.addEventListener)===null||p===void 0||p.call(this,"invalid",n(this,k,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let t=this.validators.map(p=>p.attribute).flat(),i=super.observedAttributes||[];return[...new Set([...i,...t])]}static getValidator(t){return this.validators.find(i=>i.attribute===t)||null}static getValidators(t){return this.validators.filter(i=>{var b;if(i.attribute===t||!((b=i.attribute)===null||b===void 0)&&b.includes(t))return!0})}get form(){return this.internals.form}get showError(){return n(this,o,"m",C).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(t,i,b){var p;(p=super.attributeChangedCallback)===null||p===void 0||p.call(this,t,i,b);let Y=this.constructor.getValidators(t);Y!=null&&Y.length&&this.validationTarget&&this.setValue(n(this,f,"f"))}setValue(t){var i;u(this,r,!1,"f"),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,""),u(this,f,t,"f");let p=this.shouldFormValueUpdate()?t:null;this.internals.setFormValue(p),n(this,o,"m",D).call(this,p),this.valueChangedCallback&&this.valueChangedCallback(p),n(this,o,"m",C).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(t=>t(n(this,A,"f")))}formResetCallback(){var t,i;u(this,a,!1,"f"),u(this,r,!1,"f"),n(this,o,"m",C).call(this),(t=this.resetFormControl)===null||t===void 0||t.call(this),(i=this.validationMessageCallback)===null||i===void 0||i.call(this,n(this,o,"m",C).call(this)?this.validationMessage:"")}}return e=new WeakMap,r=new WeakMap,a=new WeakMap,d=new WeakMap,m=new WeakMap,w=new WeakMap,f=new WeakMap,x=new WeakMap,F=new WeakMap,k=new WeakMap,j=new WeakMap,P=new WeakMap,A=new WeakMap,o=new WeakSet,M=function(){let t=this.getRootNode(),i=`${this.localName}[name="${this.getAttribute("name")}"]`;return t.querySelectorAll(i)},C=function(){if(this.hasAttribute("disabled"))return!1;let t=n(this,r,"f")||n(this,a,"f")&&!this.validity.valid&&!n(this,e,"f");return t&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),t},D=function(t){let i=this.constructor,b={},p=i.validators,y=[],Y=p.some(v=>v.isValid instanceof Promise);n(this,P,"f")||(u(this,A,new Promise(v=>{u(this,j,v,"f")}),"f"),u(this,P,!0,"f")),n(this,d,"f")&&(n(this,d,"f").abort(),u(this,m,n(this,d,"f"),"f"));let N=new AbortController;u(this,d,N,"f");let S,G=!1;p.length&&(p.forEach(v=>{let T=v.key||"customError",E=v.isValid(this,t,N.signal);E instanceof Promise?(y.push(E),E.then(Z=>{Z!=null&&(b[T]=!Z,S=n(this,o,"m",I).call(this,v,t),n(this,o,"m",L).call(this,b,S))})):(b[T]=!E,this.validity[T]!==!E&&(G=!0),!E&&!S&&(S=n(this,o,"m",I).call(this,v,t)))}),Promise.allSettled(y).then(()=>{var v;N!=null&&N.signal.aborted||(u(this,P,!1,"f"),(v=n(this,j,"f"))===null||v===void 0||v.call(this))}),(G||!Y)&&n(this,o,"m",L).call(this,b,S))},L=function(t,i){if(this.validationTarget)this.internals.setValidity(t,i,this.validationTarget),u(this,w,!1,"f");else{if(this.internals.setValidity(t,i),this.internals.validity.valid)return;u(this,w,!0,"f")}},I=function(t,i){if(this.validityCallback){let b=this.validityCallback(t.key||"customError");if(b)return b}return t.message instanceof Function?t.message(this,i):t.message},se}import{html as $,LitElement as te,nothing as _}from"lit";import{property as V,query as ae,state as z}from"lit/decorators.js";import{ifDefined as U}from"lit/directives/if-defined.js";import{css as Q}from"lit";var ee=Q`
   *,
   :before,
   :after {
@@ -271,7 +271,7 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
   svg {
     pointer-events: none;
   }
-`,ge=K`*, :before, :after {
+`,ve=Q`*, :before, :after {
             --w-rotate: 0;
             --w-rotate-x: 0;
             --w-rotate-y: 0;
@@ -2437,7 +2437,7 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
                     display: none
                 }
             }
-        `;import{css as de}from"lit";var ee=de`
+        `;import{css as he}from"lit";var re=he`
   .w-slider-thumb {
     position: relative;
     display: grid;
@@ -2601,7 +2601,7 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
   :host([name='to']) .w-slider-thumb__range::-moz-range-thumb {
     transform: translateX(calc(var(--w-slider-thumb-size) - 1px));
   }
-`;import{css as ce}from"lit";var re=ce`*,: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}`;var ae={};var u,S,I,q,H,l=class extends J(oe){constructor(){super(...arguments);W(this,u);this.allowValuesOutsideRange=!1;this._showTooltip=!1;this._inputHasFocus=!1;this.anchorPositioningStyleElement=null}async connectedCallback(){if(super.connectedCallback(),"anchorName"in document.documentElement.style)await this.updateComplete;else{let e=ae.url.substring(0,ae.url.lastIndexOf("/"));try{let[{default:o}]=await Promise.all([import(`${e}/oddbird-css-anchor-positioning.js`),this.updateComplete]);this.anchorPositioningStyleElement||(this.anchorPositioningStyleElement=document.createElement("style"),this.shadowRoot.prepend(this.anchorPositioningStyleElement)),this.anchorPositioningStyleElement.textContent=`
+`;import{css as be}from"lit";var oe=be`*,: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}`;var ie={};var c,O,X,q,H,B,ne,l=class extends J(te){constructor(){super(...arguments);W(this,c);this.allowValuesOutsideRange=!1;this._showTooltip=!1;this._inputHasFocus=!1;this.anchorPositioningStyleElement=null}async connectedCallback(){if(super.connectedCallback(),"anchorName"in document.documentElement.style)await this.updateComplete;else{let e=ie.url.substring(0,ie.url.lastIndexOf("/"));try{let[{default:r}]=await Promise.all([import(`${e}/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
@@ -2650,10 +2650,10 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
           left: anchor(--polyfilled-thumb left);
           margin-left: 38px;
         }
-      `,await o({roots:[this.shadowRoot],elements:[this.anchorPositioningStyleElement]})}catch(o){console.error(new Error("Error registering the CSS anchor positioning polyfill. The UI will look broken.",{cause:o}))}}v(this,u,q).call(this)}get boundaryValue(){return this.slot==="from"?this.min:this.max}get textFieldDisplayValue(){var e,o;return this._inputHasFocus?this.value===""?(o=(e=this.range)==null?void 0:e.value)!=null?o:"":this.value:this.value}get tooltipDisplayValue(){var e,o;return this.formatter?this.formatter(this.value,this.slot):this.value===""?(o=(e=this.range)==null?void 0:e.value)!=null?o:this.boundaryValue:this.value||0}updated(e){e.has("value")&&(this.setValue(this.value),v(this,u,q).call(this)),e.has("invalid")&&this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:this.invalid}}))}render(){return M`
+      `,await r({roots:[this.shadowRoot],elements:[this.anchorPositioningStyleElement]})}catch(r){console.error(new Error("Error registering the CSS anchor positioning polyfill. The UI will look broken.",{cause:r}))}}g(this,c,q).call(this)}get boundaryValue(){return this.slot==="from"?this.min:this.max}get textFieldDisplayValue(){var e,r;return this._inputHasFocus?this.value===""?(r=(e=this.range)==null?void 0:e.value)!=null?r:"":this.value:this.value}get tooltipDisplayValue(){var e,r;return this.formatter?this.formatter(this.value,this.slot):this.value===""?(r=(e=this.range)==null?void 0:e.value)!=null?r:this.boundaryValue:this.value||0}updated(e){e.has("value")&&(this.setValue(this.value),g(this,c,q).call(this)),e.has("invalid")&&this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:this.invalid}}))}render(){return $`
       <div class="w-slider-thumb">
         <label for="range">${this.label}</label>
-        ${"anchorName"in document.documentElement.style?z:M`<div class="polyfill-range">
+        ${"anchorName"in document.documentElement.style?_:$`<div class="polyfill-range">
               <div class="polyfill-active-range"></div>
             </div>`}
         <input
@@ -2666,41 +2666,42 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
           aria-valuetext="${this.tooltipDisplayValue}"
           min="${this.min}"
           max="${this.max}"
-          step="${U(this.step?this.step:void 0)}"
+          step="${U(!this.allowValuesOutsideRange&&this.step?this.step:void 0)}"
           ?disabled="${this.disabled}"
-          @mousedown="${v(this,u,S)}"
-          @mouseup="${v(this,u,I)}"
-          @touchstart="${v(this,u,S)}"
-          @touchend="${v(this,u,I)}"
-          @focus="${v(this,u,S)}"
-          @blur="${v(this,u,I)}"
-          @input="${v(this,u,H)}"
+          @mousedown="${g(this,c,O)}"
+          @mouseup="${g(this,c,X)}"
+          @touchstart="${g(this,c,O)}"
+          @touchend="${g(this,c,X)}"
+          @focus="${g(this,c,O)}"
+          @blur="${g(this,c,X)}"
+          @input="${g(this,c,B)}"
+          @keydown="${this.allowValuesOutsideRange?g(this,c,ne):_}"
         />
 
-        ${this.slot==="from"?M`<span class="w-slider-thumb__from-marker"
+        ${this.slot==="from"?$`<span class="w-slider-thumb__from-marker"
               >${this.formatter?this.formatter(this.allowValuesOutsideRange?"":this.min,"from"):this.min}
               ${this.suffix}</span
-            >`:z}
-        ${this.slot==="to"?M`<span class="w-slider-thumb__to-marker"
+            >`:_}
+        ${this.slot==="to"?$`<span class="w-slider-thumb__to-marker"
               >${this.formatter?this.formatter(this.allowValuesOutsideRange?"":this.max,"to"):this.max}
               ${this.suffix}</span
-            >`:z}
+            >`:_}
 
         <w-textfield
           aria-label="${this.ariaLabel}"
           aria-description="${U(this.ariaDescription)}"
           class="w-slider-thumb__textfield"
           type="number"
-          .formatter=${this.formatter?e=>this.formatter(e,this.slot):z}
+          .formatter=${this.formatter?e=>this.formatter(e,this.slot):_}
           .value="${this.textFieldDisplayValue}"
-          min="${this.allowValuesOutsideRange?z:this.min}"
-          max="${this.allowValuesOutsideRange?z:this.max}"
+          min="${this.allowValuesOutsideRange?_:this.min}"
+          max="${this.allowValuesOutsideRange?_:this.max}"
           ?invalid="${this.invalid}"
-          @input="${v(this,u,H)}"
+          @input="${g(this,c,B)}"
           @focus="${()=>this._inputHasFocus=!0}"
           @blur="${()=>this._inputHasFocus=!1}"
         >
-          ${this.suffix?M`<w-affix slot="suffix" label="${this.suffix}"></w-affix>`:z}
+          ${this.suffix?$`<w-affix slot="suffix" label="${this.suffix}"></w-affix>`:_}
         </w-textfield>
 
         <w-attention
@@ -2716,7 +2717,7 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
             slot="target"
           ></output>
           <span slot="message">
-            ${this.tooltipDisplayValue}${this.suffix?M`&nbsp;${this.suffix}`:z}
+            ${this.tooltipDisplayValue}${this.suffix?$`&nbsp;${this.suffix}`:_}
           </span>
         </w-attention>
 
@@ -2725,5 +2726,5 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var G=s=>{th
           >${this.ariaDescription}</span
         >
       </div>
-    `}};u=new WeakSet,S=function(){this._showTooltip=!0,this.shadowRoot.querySelector("w-attention").handleDone()},I=function(){this._showTooltip=!1},q=function(){this.range&&(this.value===""?this.range.value=this.boundaryValue:this.value&&(this.range.value=this.value))},H=async function(e){let o=e.currentTarget.tagName==="W-TEXTFIELD";if(e instanceof CustomEvent)return;let a=e.currentTarget.value,p=Number.parseInt(a),m=Number.parseInt(this.max),w=Number.parseInt(this.min);if(!this.allowValuesOutsideRange&&(p>m||p<w))return this.invalid=!0,!1;if(a==="")return this.required&&(this.invalid=!0),!1;this.invalid&&(this.invalid=!1),this.value=a;let Y=a===this.max||a===this.min,x=!1;if(this.slot){let V=getComputedStyle(this),F=V.getPropertyValue("--to"),E=V.getPropertyValue("--from");if(this.slot==="from"){let f=Math.min(Number.parseInt(F),this.allowValuesOutsideRange?m-1:m);p>f&&(x=!0,this.allowValuesOutsideRange&&Y?this.value=String(f):this.value=F,o&&(this.invalid=!0,await this.updateComplete,this.textfield.value=a))}else{let f=Math.max(Number.parseInt(E),this.allowValuesOutsideRange?w+1:w);p<f&&(x=!0,this.allowValuesOutsideRange&&Y?this.value=String(f):this.value=E,o&&(this.invalid=!0,await this.updateComplete,this.textfield.value=a))}}return x?(e.preventDefault(),!1):(this.range.value=Math.min(Math.max(Number(a),Number(this.min)),Number(this.max)).toString(),this.value=this.allowValuesOutsideRange&&!o&&Y?"":a,this.shadowRoot.querySelector("w-attention").handleDone(),!0)},l.shadowRootOptions={...oe.shadowRootOptions,delegatesFocus:!0},l.styles=[Q,re,ee],d([C({attribute:"aria-label",reflect:!0})],l.prototype,"ariaLabel",2),d([C({attribute:"aria-description",reflect:!0})],l.prototype,"ariaDescription",2),d([C({reflect:!0})],l.prototype,"label",2),d([C({reflect:!0})],l.prototype,"name",2),d([C({reflect:!0})],l.prototype,"value",2),d([C({type:Boolean,reflect:!0})],l.prototype,"disabled",2),d([C({type:Boolean,reflect:!0})],l.prototype,"invalid",2),d([C({attribute:!1,reflect:!1})],l.prototype,"allowValuesOutsideRange",2),d([y()],l.prototype,"markers",2),d([y()],l.prototype,"required",2),d([y()],l.prototype,"step",2),d([y()],l.prototype,"min",2),d([y()],l.prototype,"max",2),d([y()],l.prototype,"suffix",2),d([y()],l.prototype,"formatter",2),d([te('input[type="range"]')],l.prototype,"range",2),d([te("w-textfield")],l.prototype,"textfield",2),d([y()],l.prototype,"_showTooltip",2),d([y()],l.prototype,"_inputHasFocus",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",l);export{l as WarpSliderThumb};
+    `}};c=new WeakSet,O=function(){this._showTooltip=!0,this.shadowRoot.querySelector("w-attention").handleDone()},X=function(){this._showTooltip=!1},q=function(){this.range&&(this.value===""?this.range.value=this.boundaryValue:this.value&&(this.range.value=this.value))},H=async function(e,r){let a=Number.parseInt(e);if(this.allowValuesOutsideRange&&!r&&!(this.slot==="to"&&a>=Number(this.max)-1||this.slot==="from"&&a<=Number(this.min)+1)){let x=1/this.step;a=Math.round(a*x)/x,e=a.toString()}let d=Number.parseInt(this.max),m=Number.parseInt(this.min);if(!this.allowValuesOutsideRange&&(a>d||a<m))return this.invalid=!0,{shouldCancel:!0};if(e==="")return this.required&&(this.invalid=!0),{shouldCancel:!0};this.invalid&&(this.invalid=!1),this.value=e;let w=e===this.max||e===this.min,M=!1;if(this.slot){let f=getComputedStyle(this),x=f.getPropertyValue("--to"),F=f.getPropertyValue("--from");if(this.slot==="from"){let k=Math.min(Number.parseInt(x),this.allowValuesOutsideRange?d-1:d);a>k&&(M=!0,this.allowValuesOutsideRange&&w?this.value=String(k):this.value=x,r&&(this.invalid=!0,await this.updateComplete,this.textfield.value=e))}else{let k=Math.max(Number.parseInt(F),this.allowValuesOutsideRange?m+1:m);a<k&&(M=!0,this.allowValuesOutsideRange&&w?this.value=String(k):this.value=F,r&&(this.invalid=!0,await this.updateComplete,this.textfield.value=e))}}return M?{shouldCancel:!0}:(this.range.value=Math.min(Math.max(Number(e),Number(this.min)),Number(this.max)).toString(),this.value=this.allowValuesOutsideRange&&!r&&w?"":e,this.shadowRoot.querySelector("w-attention").handleDone(),{shouldCancel:!1})},B=async function(e){let r=e.currentTarget.tagName==="W-TEXTFIELD";if(e instanceof CustomEvent)return;let a=e.currentTarget.value;return(await g(this,c,H).call(this,a,r)).shouldCancel?(e.preventDefault(),!1):!0},ne=async function(e){if(e.key!=="ArrowLeft"&&e.key!=="ArrowRight")return;let r=Number(this.range.value),a=this.step||1,d;e.key==="ArrowLeft"?d=r-a:d=r+a,d=Math.min(Math.max(d,Number(this.min)),Number(this.max)),(await g(this,c,H).call(this,d.toString(),!1)).shouldCancel&&e.preventDefault()},l.shadowRootOptions={...te.shadowRootOptions,delegatesFocus:!0},l.styles=[ee,oe,re],h([V({attribute:"aria-label",reflect:!0})],l.prototype,"ariaLabel",2),h([V({attribute:"aria-description",reflect:!0})],l.prototype,"ariaDescription",2),h([V({reflect:!0})],l.prototype,"label",2),h([V({reflect:!0})],l.prototype,"name",2),h([V({reflect:!0})],l.prototype,"value",2),h([V({type:Boolean,reflect:!0})],l.prototype,"disabled",2),h([V({type:Boolean,reflect:!0})],l.prototype,"invalid",2),h([V({attribute:!1,reflect:!1})],l.prototype,"allowValuesOutsideRange",2),h([z()],l.prototype,"markers",2),h([z()],l.prototype,"required",2),h([z()],l.prototype,"step",2),h([z()],l.prototype,"min",2),h([z()],l.prototype,"max",2),h([z()],l.prototype,"suffix",2),h([z()],l.prototype,"formatter",2),h([ae('input[type="range"]')],l.prototype,"range",2),h([ae("w-textfield")],l.prototype,"textfield",2),h([z()],l.prototype,"_showTooltip",2),h([z()],l.prototype,"_inputHasFocus",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",l);export{l as WarpSliderThumb};
 //# sourceMappingURL=slider-thumb.js.map