@warp-ds/elements 2.3.0-next.15 → 2.3.0-next.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +20 -0
- package/dist/packages/attention/index.js +2 -2
- package/dist/packages/attention/index.js.map +2 -2
- package/dist/packages/attention/styles.js +1 -1
- package/dist/packages/slider/slider-thumb.js +17 -17
- package/dist/packages/slider/slider-thumb.js.map +3 -3
- package/dist/packages/slider/slider.react.stories.d.ts +3 -2
- package/dist/packages/slider/slider.react.stories.js +38 -16
- package/dist/packages/slider/slider.stories.d.ts +5 -5
- package/dist/packages/slider/slider.stories.js +29 -25
- package/dist/packages/textfield/index.js +1 -1
- package/dist/packages/textfield/index.js.map +2 -2
- package/dist/web-types.json +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { css } from 'lit';
|
|
2
|
-
export const styles = css `*,: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}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.bg-transparent{background-color:#0000}.bg-\\[--w-color-button-primary-background\\]{background-color:var(--w-color-button-primary-background)}.bg-\\[--w-color-callout-background\\]{background-color:var(--w-color-callout-background)}.bg-\\[--w-s-color-surface-elevated-300\\]{background-color:var(--w-s-color-surface-elevated-300)}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.hover\\:bg-\\[--w-color-button-primary-background-hover\\]:hover{background-color:var(--w-color-button-primary-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.active\\:bg-\\[--w-color-button-primary-background-active\\]:active{background-color:var(--w-color-button-primary-background-active)}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b-0{border-bottom-width:0}.border-r-0{border-right-width:0}.border-\\[--w-color-callout-border\\]{border-color:var(--w-color-callout-border)}.border-\\[--w-s-color-background-inverted\\]{border-color:var(--w-s-color-background-inverted)}.border-\\[--w-s-color-surface-elevated-300\\]{border-color:var(--w-s-color-surface-elevated-300)}.rounded-4{border-radius:4px}.rounded-8{border-radius:8px}.rounded-full{border-radius:9999px}.rounded-tl-4{border-top-left-radius:4px}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.contents{display:contents}.hidden{display:none}.hover\\:underline:hover,.focus\\:underline:focus,.active\\:underline:active{text-decoration-line:underline}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-
|
|
2
|
+
export const styles = css `*,: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}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.bg-transparent{background-color:#0000}.bg-\\[--w-color-button-primary-background\\]{background-color:var(--w-color-button-primary-background)}.bg-\\[--w-color-callout-background\\]{background-color:var(--w-color-callout-background)}.bg-\\[--w-s-color-surface-elevated-300\\]{background-color:var(--w-s-color-surface-elevated-300)}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.hover\\:bg-\\[--w-color-button-primary-background-hover\\]:hover{background-color:var(--w-color-button-primary-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.active\\:bg-\\[--w-color-button-primary-background-active\\]:active{background-color:var(--w-color-button-primary-background-active)}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b-0{border-bottom-width:0}.border-r-0{border-right-width:0}.border-\\[--w-color-callout-border\\]{border-color:var(--w-color-callout-border)}.border-\\[--w-s-color-background-inverted\\]{border-color:var(--w-s-color-background-inverted)}.border-\\[--w-s-color-surface-elevated-300\\]{border-color:var(--w-s-color-surface-elevated-300)}.rounded-4{border-radius:4px}.rounded-8{border-radius:8px}.rounded-full{border-radius:9999px}.rounded-tl-4{border-top-left-radius:4px}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.contents{display:contents}.hidden{display:none}.hover\\:underline:hover,.focus\\:underline:focus,.active\\:underline:active{text-decoration-line:underline}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.-bottom-\\[8px\\]{bottom:-8px}.-left-\\[8px\\]{left:-8px}.-right-\\[8px\\]{right:-8px}.-top-\\[8px\\]{top:-8px}.justify-center{justify-content:center}.absolute{position:absolute}.relative{position:relative}.static{position:static}.z-50{z-index:50}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-inverted{background-color:var(--w-s-color-background-inverted)}.s-bg-negative{background-color:var(--w-s-color-background-negative)}.s-bg-subtle{background-color:var(--w-s-color-background-subtle)}.hover\\:s-bg-hover:hover{background-color:var(--w-s-color-background-hover)}.hover\\:s-bg-negative-hover:hover{background-color:var(--w-s-color-background-negative-hover)}.hover\\:s-bg-negative-subtle-hover:hover{background-color:var(--w-s-color-background-negative-subtle-hover)}.active\\:s-bg-active:active{background-color:var(--w-s-color-background-active)}.active\\:s-bg-negative-active:active{background-color:var(--w-s-color-background-negative-active)}.active\\:s-bg-negative-subtle-active:active{background-color:var(--w-s-color-background-negative-subtle-active)}.s-text{color:var(--w-s-color-text)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-link{color:var(--w-s-color-text-link)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-icon{color:var(--w-s-color-icon)}.hover\\:s-icon-hover:hover{color:var(--w-s-color-icon-hover)}.active\\:s-icon-active:active{color:var(--w-s-color-icon-active)}.s-border{border-color:var(--w-s-color-border)}.hover\\:s-border-hover:hover{border-color:var(--w-s-color-border-hover)}.active\\:s-border-active:active{border-color:var(--w-s-color-border-active)}.drop-shadow-m{filter:drop-shadow(0 3px 8px #4040403d)drop-shadow(0 3px 6px #40404029)}.shadow-m{box-shadow:var(--w-shadow-m)}.h-\\[14px\\]{height:14px}.w-\\[14px\\]{width:14px}.last-child\\:mb-0>:last-child{margin-bottom:0}.ml-8{margin-left:.8rem}.p-16{padding:1.6rem}.p-4{padding:.4rem}.px-16{padding-left:1.6rem;padding-right:1.6rem}.px-8{padding-left:.8rem;padding-right:.8rem}.py-6{padding-top:.6rem;padding-bottom:.6rem}.py-8{padding-top:.8rem;padding-bottom:.8rem}.font-bold{font-weight:700}.resize{resize:both}.translate-z-0{--w-translate-z:0rem;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transform{transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}.leading-\\[24\\]{line-height:2.4rem}`;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var
|
|
1
|
+
var ce=Object.defineProperty;var he=Object.getOwnPropertyDescriptor;var K=s=>{throw TypeError(s)};var h=(s,o,e,r)=>{for(var a=r>1?void 0:r?he(o,e):o,c=s.length-1,m;c>=0;c--)(m=s[c])&&(a=(r?m(o,e,a):m(a))||a);return r&&a&&ce(o,e,a),a};var be=(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)=>(be(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,c,m,w,M,f,x,F,k,j,P,A,C,D,L,I;class de 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),c.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,c=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,c,"f")&&(n(this,c,"f").abort(),u(this,m,n(this,c,"f"),"f"));let N=new AbortController;u(this,c,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},de}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`
|
|
2
2
|
*,
|
|
3
3
|
:before,
|
|
4
4
|
:after {
|
|
@@ -271,7 +271,7 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
271
271
|
svg {
|
|
272
272
|
pointer-events: none;
|
|
273
273
|
}
|
|
274
|
-
`,
|
|
274
|
+
`,fe=Q`*, :before, :after {
|
|
275
275
|
--w-rotate: 0;
|
|
276
276
|
--w-rotate-x: 0;
|
|
277
277
|
--w-rotate-y: 0;
|
|
@@ -2437,7 +2437,7 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2437
2437
|
display: none
|
|
2438
2438
|
}
|
|
2439
2439
|
}
|
|
2440
|
-
`;import{css as
|
|
2440
|
+
`;import{css as ue}from"lit";var re=ue`
|
|
2441
2441
|
.w-slider-thumb {
|
|
2442
2442
|
position: relative;
|
|
2443
2443
|
display: grid;
|
|
@@ -2601,7 +2601,7 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2601
2601
|
:host([name='to']) .w-slider-thumb__range::-moz-range-thumb {
|
|
2602
2602
|
transform: translateX(calc(var(--w-slider-thumb-size) - 1px));
|
|
2603
2603
|
}
|
|
2604
|
-
`;import{css as
|
|
2604
|
+
`;import{css as pe}from"lit";var oe=pe`*,: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 l,O,X,q,H,B,ne,se,le,d=class extends J(te){constructor(){super(...arguments);W(this,l);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=`
|
|
2605
2605
|
/*
|
|
2606
2606
|
* The polyfill can only anchor to ::before and ::after pseudo elements, not the pseudo element slider thumb.
|
|
2607
2607
|
* We work around that by recreating a transparent version of the active range
|
|
@@ -2650,7 +2650,7 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2650
2650
|
left: anchor(--polyfilled-thumb left);
|
|
2651
2651
|
margin-left: 38px;
|
|
2652
2652
|
}
|
|
2653
|
-
`,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,
|
|
2653
|
+
`,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,l,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,l,q).call(this)),e.has("invalid")&&this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:this.invalid}}))}render(){return $`
|
|
2654
2654
|
<div class="w-slider-thumb">
|
|
2655
2655
|
<label for="range">${this.label}</label>
|
|
2656
2656
|
${"anchorName"in document.documentElement.style?_:$`<div class="polyfill-range">
|
|
@@ -2668,14 +2668,14 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2668
2668
|
max="${this.max}"
|
|
2669
2669
|
step="${U(!this.allowValuesOutsideRange&&this.step?this.step:void 0)}"
|
|
2670
2670
|
?disabled="${this.disabled}"
|
|
2671
|
-
@mousedown="${g(this,
|
|
2672
|
-
@mouseup="${g(this,
|
|
2673
|
-
@touchstart="${g(this,
|
|
2674
|
-
@touchend="${g(this,
|
|
2675
|
-
@focus="${g(this,
|
|
2676
|
-
@blur="${g(this,
|
|
2677
|
-
@input="${g(this,
|
|
2678
|
-
@keydown="${this.allowValuesOutsideRange?g(this,
|
|
2671
|
+
@mousedown="${g(this,l,O)}"
|
|
2672
|
+
@mouseup="${g(this,l,X)}"
|
|
2673
|
+
@touchstart="${g(this,l,O)}"
|
|
2674
|
+
@touchend="${g(this,l,X)}"
|
|
2675
|
+
@focus="${g(this,l,O)}"
|
|
2676
|
+
@blur="${g(this,l,X)}"
|
|
2677
|
+
@input="${g(this,l,B)}"
|
|
2678
|
+
@keydown="${this.allowValuesOutsideRange?g(this,l,ne):_}"
|
|
2679
2679
|
/>
|
|
2680
2680
|
|
|
2681
2681
|
${this.slot==="from"?$`<span class="w-slider-thumb__from-marker"
|
|
@@ -2697,9 +2697,9 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2697
2697
|
min="${this.allowValuesOutsideRange?_:this.min}"
|
|
2698
2698
|
max="${this.allowValuesOutsideRange?_:this.max}"
|
|
2699
2699
|
?invalid="${this.invalid}"
|
|
2700
|
-
@input="${g(this,
|
|
2701
|
-
@focus="${()
|
|
2702
|
-
@blur="${()
|
|
2700
|
+
@input="${g(this,l,B)}"
|
|
2701
|
+
@focus="${g(this,l,se)}"
|
|
2702
|
+
@blur="${g(this,l,le)}"
|
|
2703
2703
|
>
|
|
2704
2704
|
${this.suffix?$`<w-affix slot="suffix" label="${this.suffix}"></w-affix>`:_}
|
|
2705
2705
|
</w-textfield>
|
|
@@ -2726,5 +2726,5 @@ var le=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var K=s=>{th
|
|
|
2726
2726
|
>${this.ariaDescription}</span
|
|
2727
2727
|
>
|
|
2728
2728
|
</div>
|
|
2729
|
-
`}};
|
|
2729
|
+
`}};l=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.step&&!(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 c=Number.parseInt(this.max),m=Number.parseInt(this.min);if(!this.allowValuesOutsideRange&&(a>c||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?c-1:c);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,l,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,c;e.key==="ArrowLeft"?c=r-a:c=r+a,c=Math.min(Math.max(c,Number(this.min)),Number(this.max)),(await g(this,l,H).call(this,c.toString(),!1)).shouldCancel&&e.preventDefault()},se=function(e){e instanceof CustomEvent&&e.type==="focus"&&(this._inputHasFocus=!0)},le=function(e){e instanceof CustomEvent&&e.type==="blur"&&(console.log(e),this._inputHasFocus=!1)},d.shadowRootOptions={...te.shadowRootOptions,delegatesFocus:!0},d.styles=[ee,oe,re],h([V({attribute:"aria-label",reflect:!0})],d.prototype,"ariaLabel",2),h([V({attribute:"aria-description",reflect:!0})],d.prototype,"ariaDescription",2),h([V({reflect:!0})],d.prototype,"label",2),h([V({reflect:!0})],d.prototype,"name",2),h([V({reflect:!0})],d.prototype,"value",2),h([V({type:Boolean,reflect:!0})],d.prototype,"disabled",2),h([V({type:Boolean,reflect:!0})],d.prototype,"invalid",2),h([V({attribute:!1,reflect:!1})],d.prototype,"allowValuesOutsideRange",2),h([z()],d.prototype,"markers",2),h([z()],d.prototype,"required",2),h([z()],d.prototype,"step",2),h([z()],d.prototype,"min",2),h([z()],d.prototype,"max",2),h([z()],d.prototype,"suffix",2),h([z()],d.prototype,"formatter",2),h([ae('input[type="range"]')],d.prototype,"range",2),h([ae("w-textfield")],d.prototype,"textfield",2),h([z()],d.prototype,"_showTooltip",2),h([z()],d.prototype,"_inputHasFocus",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",d);export{d as WarpSliderThumb};
|
|
2730
2730
|
//# sourceMappingURL=slider-thumb.js.map
|