@warp-ds/elements 2.9.0 → 2.9.1-next.2

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.
Files changed (37) hide show
  1. package/dist/custom-elements.json +31 -0
  2. package/dist/docs/box/accessibility.md +29 -0
  3. package/dist/docs/box/api.md +16 -11
  4. package/dist/docs/box/box.md +189 -11
  5. package/dist/docs/box/examples.md +98 -0
  6. package/dist/docs/box/usage.md +47 -0
  7. package/dist/index.d.ts +40 -20
  8. package/dist/packages/box/box.d.ts +15 -14
  9. package/dist/packages/box/box.js +6 -6
  10. package/dist/packages/box/box.js.map +4 -4
  11. package/dist/packages/box/box.react.stories.d.ts +1 -1
  12. package/dist/packages/box/box.stories.d.ts +1 -0
  13. package/dist/packages/box/box.stories.js +12 -5
  14. package/dist/packages/checkbox/checkbox.js +3 -3
  15. package/dist/packages/checkbox/checkbox.js.map +2 -2
  16. package/dist/packages/checkbox/checkbox.test.js +20 -0
  17. package/dist/packages/datepicker/datepicker.js +6 -6
  18. package/dist/packages/datepicker/datepicker.js.map +2 -2
  19. package/dist/packages/datepicker/datepicker.stories.js +8 -1
  20. package/dist/packages/datepicker/datepicker.test.js +23 -1
  21. package/dist/packages/radio/radio.js +2 -2
  22. package/dist/packages/radio/radio.js.map +2 -2
  23. package/dist/packages/radio/radio.test.js +21 -1
  24. package/dist/packages/radio-group/radio-group.js +5 -5
  25. package/dist/packages/radio-group/radio-group.js.map +2 -2
  26. package/dist/packages/select/select.js +10 -10
  27. package/dist/packages/select/select.js.map +3 -3
  28. package/dist/packages/select/select.stories.js +7 -5
  29. package/dist/packages/select/select.test.js +23 -2
  30. package/dist/packages/slider/slider.stories.js +6 -3
  31. package/dist/packages/slider-thumb/slider-thumb.js +16 -16
  32. package/dist/packages/slider-thumb/slider-thumb.js.map +2 -2
  33. package/dist/packages/textfield/textfield.js +9 -8
  34. package/dist/packages/textfield/textfield.js.map +3 -3
  35. package/dist/packages/textfield/textfield.test.js +17 -0
  36. package/dist/web-types.json +35 -7
  37. package/package.json +1 -1
@@ -1,4 +1,4 @@
1
- var te=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var R=a=>{throw TypeError(a)};var d=(a,e,r,o)=>{for(var l=o>1?void 0:o?ae(e,r):e,u=a.length-1,w;u>=0;u--)(w=a[u])&&(l=(o?w(e,r,l):w(l))||l);return o&&l&&te(e,r,l),l};var U=(a,e,r)=>e.has(a)||R("Cannot "+r);var H=(a,e,r)=>(U(a,e,"read from private field"),r?r.call(a):e.get(a)),D=(a,e,r)=>e.has(a)?R("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(a):e.set(a,r),G=(a,e,r,o)=>(U(a,e,"write to private field"),o?o.call(a,r):e.set(a,r),r);var j=function(){for(var a=[],e=arguments.length;e--;)a[e]=arguments[e];return a.reduce(function(r,o){return r.concat(typeof o=="string"?o:Array.isArray(o)?j.apply(void 0,o):typeof o=="object"&&o?Object.keys(o).map(function(l){return o[l]?l:""}):"")},[]).join(" ")};var s=function(a,e,r,o){if(r==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?a!==e||!o:!e.has(a))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?o:r==="a"?o.call(a):o?o.value:e.get(a)},h=function(a,e,r,o,l){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!l)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?a!==e||!l:!e.has(a))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?l.call(a,r):l?l.value=r:e.set(a,r),r};function J(a){var e,r,o,l,u,w,k,re,_,A,F,L,E,z,Y,f,X,N,O;class oe extends a{constructor(...t){var n,b,p;super(...t),e.add(this),this.internals=this.attachInternals(),r.set(this,!1),o.set(this,!1),l.set(this,!1),u.set(this,void 0),w.set(this,void 0),k.set(this,!0),_.set(this,""),A.set(this,()=>{h(this,l,!0,"f"),h(this,r,!0,"f"),s(this,e,"m",f).call(this)}),F.set(this,()=>{h(this,r,!1,"f"),s(this,e,"m",X).call(this,this.shouldFormValueUpdate()?s(this,_,"f"):""),!this.validity.valid&&s(this,l,"f")&&h(this,o,!0,"f");let m=s(this,e,"m",f).call(this);this.validationMessageCallback&&this.validationMessageCallback(m?this.internals.validationMessage:"")}),L.set(this,()=>{var m;s(this,k,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),h(this,k,!1,"f")),h(this,l,!0,"f"),h(this,o,!0,"f"),s(this,e,"m",f).call(this),(m=this===null||this===void 0?void 0:this.validationMessageCallback)===null||m===void 0||m.call(this,this.showError?this.internals.validationMessage:"")}),E.set(this,void 0),z.set(this,!1),Y.set(this,Promise.resolve()),(n=this.addEventListener)===null||n===void 0||n.call(this,"focus",s(this,A,"f")),(b=this.addEventListener)===null||b===void 0||b.call(this,"blur",s(this,F,"f")),(p=this.addEventListener)===null||p===void 0||p.call(this,"invalid",s(this,L,"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(),n=super.observedAttributes||[];return[...new Set([...n,...t])]}static getValidator(t){return this.validators.find(n=>n.attribute===t)||null}static getValidators(t){return this.validators.filter(n=>{var b;if(n.attribute===t||!((b=n.attribute)===null||b===void 0)&&b.includes(t))return!0})}get form(){return this.internals.form}get showError(){return s(this,e,"m",f).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(t,n,b){var p;(p=super.attributeChangedCallback)===null||p===void 0||p.call(this,t,n,b);let $=this.constructor.getValidators(t);$!=null&&$.length&&this.validationTarget&&this.setValue(s(this,_,"f"))}setValue(t){var n;h(this,o,!1,"f"),(n=this.validationMessageCallback)===null||n===void 0||n.call(this,""),h(this,_,t,"f");let p=this.shouldFormValueUpdate()?t:null;this.internals.setFormValue(p),s(this,e,"m",X).call(this,p),this.valueChangedCallback&&this.valueChangedCallback(p),s(this,e,"m",f).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(t=>t(s(this,Y,"f")))}formResetCallback(){var t,n;h(this,l,!1,"f"),h(this,o,!1,"f"),s(this,e,"m",f).call(this),(t=this.resetFormControl)===null||t===void 0||t.call(this),(n=this.validationMessageCallback)===null||n===void 0||n.call(this,s(this,e,"m",f).call(this)?this.validationMessage:"")}}return r=new WeakMap,o=new WeakMap,l=new WeakMap,u=new WeakMap,w=new WeakMap,k=new WeakMap,_=new WeakMap,A=new WeakMap,F=new WeakMap,L=new WeakMap,E=new WeakMap,z=new WeakMap,Y=new WeakMap,e=new WeakSet,re=function(){let t=this.getRootNode(),n=`${this.localName}[name="${this.getAttribute("name")}"]`;return t.querySelectorAll(n)},f=function(){if(this.hasAttribute("disabled"))return!1;let t=s(this,o,"f")||s(this,l,"f")&&!this.validity.valid&&!s(this,r,"f");return t&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),t},X=function(t){let n=this.constructor,b={},p=n.validators,m=[],$=p.some(v=>v.isValid instanceof Promise);s(this,z,"f")||(h(this,Y,new Promise(v=>{h(this,E,v,"f")}),"f"),h(this,z,!0,"f")),s(this,u,"f")&&(s(this,u,"f").abort(),h(this,w,s(this,u,"f"),"f"));let M=new AbortController;h(this,u,M,"f");let S,B=!1;p.length&&(p.forEach(v=>{let Z=v.key||"customError",y=v.isValid(this,t,M.signal);y instanceof Promise?(m.push(y),y.then(I=>{I!=null&&(b[Z]=!I,S=s(this,e,"m",O).call(this,v,t),s(this,e,"m",N).call(this,b,S))})):(b[Z]=!y,this.validity[Z]!==!y&&(B=!0),!y&&!S&&(S=s(this,e,"m",O).call(this,v,t)))}),Promise.allSettled(m).then(()=>{var v;M!=null&&M.signal.aborted||(h(this,z,!1,"f"),(v=s(this,E,"f"))===null||v===void 0||v.call(this))}),(B||!$)&&s(this,e,"m",N).call(this,b,S))},N=function(t,n){if(this.validationTarget)this.internals.setValidity(t,n,this.validationTarget),h(this,k,!1,"f");else{if(this.internals.setValidity(t,n),this.internals.validity.valid)return;h(this,k,!0,"f")}},O=function(t,n){if(this.validityCallback){let b=this.validityCallback(t.key||"customError");if(b)return b}return t.message instanceof Function?t.message(this,n):t.message},oe}import{html as P,LitElement as ee,nothing as se}from"lit";import{property as c,query as le}from"lit/decorators.js";import{classMap as de}from"lit/directives/class-map.js";import{ifDefined as g}from"lit/directives/if-defined.js";import{css as K}from"lit";var Q=K`
1
+ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var D=a=>{throw TypeError(a)};var d=(a,e,r,o)=>{for(var l=o>1?void 0:o?se(e,r):e,u=a.length-1,w;u>=0;u--)(w=a[u])&&(l=(o?w(e,r,l):w(l))||l);return o&&l&&ne(e,r,l),l};var B=(a,e,r)=>e.has(a)||D("Cannot "+r);var G=(a,e,r)=>(B(a,e,"read from private field"),r?r.call(a):e.get(a)),H=(a,e,r)=>e.has(a)?D("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(a):e.set(a,r),K=(a,e,r,o)=>(B(a,e,"write to private field"),o?o.call(a,r):e.set(a,r),r),J=(a,e,r)=>(B(a,e,"access private method"),r);var j=function(){for(var a=[],e=arguments.length;e--;)a[e]=arguments[e];return a.reduce(function(r,o){return r.concat(typeof o=="string"?o:Array.isArray(o)?j.apply(void 0,o):typeof o=="object"&&o?Object.keys(o).map(function(l){return o[l]?l:""}):"")},[]).join(" ")};var s=function(a,e,r,o){if(r==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?a!==e||!o:!e.has(a))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?o:r==="a"?o.call(a):o?o.value:e.get(a)},h=function(a,e,r,o,l){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!l)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?a!==e||!l:!e.has(a))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?l.call(a,r):l?l.value=r:e.set(a,r),r};function Q(a){var e,r,o,l,u,w,k,ae,_,F,L,X,E,z,Y,f,N,O,Z;class ie extends a{constructor(...t){var n,b,p;super(...t),e.add(this),this.internals=this.attachInternals(),r.set(this,!1),o.set(this,!1),l.set(this,!1),u.set(this,void 0),w.set(this,void 0),k.set(this,!0),_.set(this,""),F.set(this,()=>{h(this,l,!0,"f"),h(this,r,!0,"f"),s(this,e,"m",f).call(this)}),L.set(this,()=>{h(this,r,!1,"f"),s(this,e,"m",N).call(this,this.shouldFormValueUpdate()?s(this,_,"f"):""),!this.validity.valid&&s(this,l,"f")&&h(this,o,!0,"f");let m=s(this,e,"m",f).call(this);this.validationMessageCallback&&this.validationMessageCallback(m?this.internals.validationMessage:"")}),X.set(this,()=>{var m;s(this,k,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),h(this,k,!1,"f")),h(this,l,!0,"f"),h(this,o,!0,"f"),s(this,e,"m",f).call(this),(m=this===null||this===void 0?void 0:this.validationMessageCallback)===null||m===void 0||m.call(this,this.showError?this.internals.validationMessage:"")}),E.set(this,void 0),z.set(this,!1),Y.set(this,Promise.resolve()),(n=this.addEventListener)===null||n===void 0||n.call(this,"focus",s(this,F,"f")),(b=this.addEventListener)===null||b===void 0||b.call(this,"blur",s(this,L,"f")),(p=this.addEventListener)===null||p===void 0||p.call(this,"invalid",s(this,X,"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(),n=super.observedAttributes||[];return[...new Set([...n,...t])]}static getValidator(t){return this.validators.find(n=>n.attribute===t)||null}static getValidators(t){return this.validators.filter(n=>{var b;if(n.attribute===t||!((b=n.attribute)===null||b===void 0)&&b.includes(t))return!0})}get form(){return this.internals.form}get showError(){return s(this,e,"m",f).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(t,n,b){var p;(p=super.attributeChangedCallback)===null||p===void 0||p.call(this,t,n,b);let $=this.constructor.getValidators(t);$!=null&&$.length&&this.validationTarget&&this.setValue(s(this,_,"f"))}setValue(t){var n;h(this,o,!1,"f"),(n=this.validationMessageCallback)===null||n===void 0||n.call(this,""),h(this,_,t,"f");let p=this.shouldFormValueUpdate()?t:null;this.internals.setFormValue(p),s(this,e,"m",N).call(this,p),this.valueChangedCallback&&this.valueChangedCallback(p),s(this,e,"m",f).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(t=>t(s(this,Y,"f")))}formResetCallback(){var t,n;h(this,l,!1,"f"),h(this,o,!1,"f"),s(this,e,"m",f).call(this),(t=this.resetFormControl)===null||t===void 0||t.call(this),(n=this.validationMessageCallback)===null||n===void 0||n.call(this,s(this,e,"m",f).call(this)?this.validationMessage:"")}}return r=new WeakMap,o=new WeakMap,l=new WeakMap,u=new WeakMap,w=new WeakMap,k=new WeakMap,_=new WeakMap,F=new WeakMap,L=new WeakMap,X=new WeakMap,E=new WeakMap,z=new WeakMap,Y=new WeakMap,e=new WeakSet,ae=function(){let t=this.getRootNode(),n=`${this.localName}[name="${this.getAttribute("name")}"]`;return t.querySelectorAll(n)},f=function(){if(this.hasAttribute("disabled"))return!1;let t=s(this,o,"f")||s(this,l,"f")&&!this.validity.valid&&!s(this,r,"f");return t&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),t},N=function(t){let n=this.constructor,b={},p=n.validators,m=[],$=p.some(v=>v.isValid instanceof Promise);s(this,z,"f")||(h(this,Y,new Promise(v=>{h(this,E,v,"f")}),"f"),h(this,z,!0,"f")),s(this,u,"f")&&(s(this,u,"f").abort(),h(this,w,s(this,u,"f"),"f"));let M=new AbortController;h(this,u,M,"f");let S,U=!1;p.length&&(p.forEach(v=>{let I=v.key||"customError",y=v.isValid(this,t,M.signal);y instanceof Promise?(m.push(y),y.then(q=>{q!=null&&(b[I]=!q,S=s(this,e,"m",Z).call(this,v,t),s(this,e,"m",O).call(this,b,S))})):(b[I]=!y,this.validity[I]!==!y&&(U=!0),!y&&!S&&(S=s(this,e,"m",Z).call(this,v,t)))}),Promise.allSettled(m).then(()=>{var v;M!=null&&M.signal.aborted||(h(this,z,!1,"f"),(v=s(this,E,"f"))===null||v===void 0||v.call(this))}),(U||!$)&&s(this,e,"m",O).call(this,b,S))},O=function(t,n){if(this.validationTarget)this.internals.setValidity(t,n,this.validationTarget),h(this,k,!1,"f");else{if(this.internals.setValidity(t,n),this.internals.validity.valid)return;h(this,k,!0,"f")}},Z=function(t,n){if(this.validityCallback){let b=this.validityCallback(t.key||"customError");if(b)return b}return t.message instanceof Function?t.message(this,n):t.message},ie}import{html as P,LitElement as oe,nothing as ce}from"lit";import{property as c,query as be}from"lit/decorators.js";import{classMap as he}from"lit/directives/class-map.js";import{ifDefined as g}from"lit/directives/if-defined.js";import{css as T}from"lit";var W=T`
2
2
  *,
3
3
  :before,
4
4
  :after {
@@ -271,7 +271,7 @@ var te=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var R=a=>{th
271
271
  svg {
272
272
  pointer-events: none;
273
273
  }
274
- `,ve=K`*, :before, :after {
274
+ `,we=T`*, :before, :after {
275
275
  --w-rotate: 0;
276
276
  --w-rotate-x: 0;
277
277
  --w-rotate-y: 0;
@@ -2437,7 +2437,7 @@ var te=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var R=a=>{th
2437
2437
  display: none
2438
2438
  }
2439
2439
  }
2440
- `;import{css as ie}from"lit";var T=ie`
2440
+ `;import{css as le}from"lit";var ee=le`
2441
2441
  .w-textfield {
2442
2442
  --_input-padding-top: 12px;
2443
2443
  --_input-padding-left: 8px;
@@ -2495,12 +2495,12 @@ var te=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var R=a=>{th
2495
2495
  text-overflow: ellipsis;
2496
2496
  z-index: 1;
2497
2497
  }
2498
- `;import{css as ne}from"lit";var W=ne`*,: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}.focus\\:\\[--w-outline-offset\\:-2px\\]:focus{--w-outline-offset:-2px}.bg-transparent{background-color:#0000}.border-1{border-width:1px}.rounded-4{border-radius:4px}.caret-current{caret-color:currentColor}.block{display:block}.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}.outline-\\[--w-s-color-border-negative\\]\\!{outline-color:var(--w-s-color-border-negative)!important}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled-subtle{background-color:var(--w-s-color-background-disabled-subtle)}.s-text{color:var(--w-s-color-text)}.s-text-disabled{color:var(--w-s-color-text-disabled)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.placeholder\\:s-text-placeholder::placeholder{color:var(--w-s-color-text-placeholder)}.s-border-disabled{border-color:var(--w-s-color-border-disabled)}.s-border-negative{border-color:var(--w-s-color-border-negative)}.s-border-strong{border-color:var(--w-s-color-border-strong)}.hover\\:s-border-negative-hover:hover{border-color:var(--w-s-color-border-negative-hover)}.hover\\:s-border-strong-hover:hover{border-color:var(--w-s-color-border-strong-hover)}.active\\:s-border-selected:active{border-color:var(--w-s-color-border-selected)}.w-full{width:100%}.min-h-\\[42\\]{min-height:4.2rem}.mb-0{margin-bottom:0}.mt-4{margin-top:.4rem}.px-8{padding-left:.8rem;padding-right:.8rem}.py-12{padding-top:1.2rem;padding-bottom:1.2rem}.pb-4{padding-bottom:.4rem}.pl-0{padding-left:0}.pl-8{padding-left:.8rem}.pr-40{padding-right:4rem}.pl-\\[var\\(--w-prefix-width\\,_40px\\)\\]{padding-left:var(--w-prefix-width,40px)}.cursor-pointer{cursor:pointer}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.font-bold{font-weight:700}.font-normal{font-weight:400}.pointer-events-none{pointer-events:none}.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}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}.leading-m{line-height:var(--w-line-height-m)}@media (min-width:480px){.sm\\:min-h-\\[45\\]{min-height:4.5rem}}`;var x={base:"block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current",default:"border-1 s-text s-bg s-border-strong hover:s-border-strong-hover active:s-border-selected",disabled:"border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none",invalid:"border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!",readOnly:"pl-0 bg-transparent pointer-events-none",placeholder:"placeholder:s-text-placeholder",suffix:"pr-40",prefix:"pl-[var(--w-prefix-width,_40px)]",textArea:"min-h-[42] sm:min-h-[45]"},ce={base:"antialiased block relative text-s font-bold pb-4 cursor-pointer s-text",optional:"pl-8 font-normal text-s s-text-subtle"},q={base:"text-xs mt-4 block",color:"s-text-subtle",colorInvalid:"s-text-negative"},V,i=class extends J(ee){constructor(){super(...arguments);this.disabled=!1;this.invalid=!1;this.readOnly=!1;this.readonly=!1;this.required=!1;this._hasPrefix=!1;this._hasSuffix=!1;D(this,V,null)}updated(r){r.has("value")&&(this.setValue(this.value),this.formatter&&(this.mask.innerText=this.formatter(this.value)))}firstUpdated(r){G(this,V,this.value)}resetFormControl(){this.value=H(this,V)}get _inputstyles(){return j([x.base,this._hasSuffix&&x.suffix,this._hasPrefix&&x.prefix,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&x.default,this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&x.invalid,!this.invalid&&this.disabled&&!(this.readonly||this.readOnly)&&x.disabled,!this.invalid&&!this.disabled&&(this.readonly||this.readOnly)&&x.readOnly])}get _helptextstyles(){return j([q.base,this.invalid?q.colorInvalid:q.color])}get _label(){if(this.label)return P`<label for="${this._id}" class=${ce.base}>${this.label}</label>`}get _helpId(){if(this.helpText)return`${this._id}__hint`}get _id(){return"textfield"}get _error(){if(this.invalid&&this._helpId)return this._helpId}handler(r){let{name:o,value:l}=r.currentTarget;this.value=l;let u=new CustomEvent(r.type,{detail:{name:o,value:l,target:r.target}});this.dispatchEvent(u)}prefixSlotChange(){this.renderRoot.querySelector("slot[name=prefix]").assignedElements().length&&(this._hasPrefix=!0)}suffixSlotChange(){this.renderRoot.querySelector("slot[name=suffix]").assignedElements().length&&(this._hasSuffix=!0)}render(){return P`
2498
+ `;import{css as de}from"lit";var re=de`*,: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}.focus\\:\\[--w-outline-offset\\:-2px\\]:focus{--w-outline-offset:-2px}.bg-transparent{background-color:#0000}.border-1{border-width:1px}.rounded-4{border-radius:4px}.caret-current{caret-color:currentColor}.block{display:block}.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}.outline-\\[--w-s-color-border-negative\\]\\!{outline-color:var(--w-s-color-border-negative)!important}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled-subtle{background-color:var(--w-s-color-background-disabled-subtle)}.s-text{color:var(--w-s-color-text)}.s-text-disabled{color:var(--w-s-color-text-disabled)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.placeholder\\:s-text-placeholder::placeholder{color:var(--w-s-color-text-placeholder)}.s-border-disabled{border-color:var(--w-s-color-border-disabled)}.s-border-negative{border-color:var(--w-s-color-border-negative)}.s-border-strong{border-color:var(--w-s-color-border-strong)}.hover\\:s-border-negative-hover:hover{border-color:var(--w-s-color-border-negative-hover)}.hover\\:s-border-strong-hover:hover{border-color:var(--w-s-color-border-strong-hover)}.active\\:s-border-selected:active{border-color:var(--w-s-color-border-selected)}.w-full{width:100%}.min-h-\\[42\\]{min-height:4.2rem}.mb-0{margin-bottom:0}.mt-4{margin-top:.4rem}.px-8{padding-left:.8rem;padding-right:.8rem}.py-12{padding-top:1.2rem;padding-bottom:1.2rem}.pb-4{padding-bottom:.4rem}.pl-0{padding-left:0}.pl-8{padding-left:.8rem}.pr-40{padding-right:4rem}.pl-\\[var\\(--w-prefix-width\\,_40px\\)\\]{padding-left:var(--w-prefix-width,40px)}.cursor-pointer{cursor:pointer}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.font-bold{font-weight:700}.font-normal{font-weight:400}.pointer-events-none{pointer-events:none}.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}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}.leading-m{line-height:var(--w-line-height-m)}@media (min-width:480px){.sm\\:min-h-\\[45\\]{min-height:4.5rem}}`;var x={base:"block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current",default:"border-1 s-text s-bg s-border-strong hover:s-border-strong-hover active:s-border-selected",disabled:"border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none",invalid:"border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!",readOnly:"pl-0 bg-transparent pointer-events-none",placeholder:"placeholder:s-text-placeholder",suffix:"pr-40",prefix:"pl-[var(--w-prefix-width,_40px)]",textArea:"min-h-[42] sm:min-h-[45]"},pe={base:"antialiased block relative text-s font-bold pb-4 cursor-pointer s-text",optional:"pl-8 font-normal text-s s-text-subtle"},R={base:"text-xs mt-4 block",color:"s-text-subtle",colorInvalid:"s-text-negative"},A,te,V,i=class extends Q(oe){constructor(){super(...arguments);H(this,A);this.disabled=!1;this.invalid=!1;this.readOnly=!1;this.readonly=!1;this.required=!1;this._hasPrefix=!1;this._hasSuffix=!1;H(this,V,null)}updated(r){r.has("value")&&(this.setValue(this.value),this.formatter&&(this.mask.innerText=this.formatter(this.value)))}firstUpdated(r){K(this,V,this.value)}resetFormControl(){this.value=G(this,V)}get _inputstyles(){return j([x.base,this._hasSuffix&&x.suffix,this._hasPrefix&&x.prefix,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&x.default,this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&x.invalid,!this.invalid&&this.disabled&&!(this.readonly||this.readOnly)&&x.disabled,!this.invalid&&!this.disabled&&(this.readonly||this.readOnly)&&x.readOnly])}get _helptextstyles(){return j([R.base,this.invalid?R.colorInvalid:R.color])}get _label(){if(this.label)return P`<label for="${this._id}" class=${pe.base}>${this.label}</label>`}get _helpId(){if(this.helpText)return`${this._id}__hint`}get _id(){return"textfield"}get _error(){if(this.invalid&&this._helpId)return this._helpId}handler(r){let{name:o,value:l}=r.currentTarget;this.value=l;let u=new CustomEvent(r.type,{detail:{name:o,value:l,target:r.target}});this.dispatchEvent(u)}prefixSlotChange(){this.renderRoot.querySelector("slot[name=prefix]").assignedElements().length&&(this._hasPrefix=!0)}suffixSlotChange(){this.renderRoot.querySelector("slot[name=suffix]").assignedElements().length&&(this._hasSuffix=!0)}render(){return P`
2499
2499
  ${this._label}
2500
2500
  <div
2501
- class="${de({"w-textfield":!0,"w-textfield--has-prefix":this._hasPrefix,"w-textfield--has-suffix":this._hasSuffix})}">
2501
+ class="${he({"w-textfield":!0,"w-textfield--has-prefix":this._hasPrefix,"w-textfield--has-suffix":this._hasSuffix})}">
2502
2502
  <div class="w-textfield__input-wrapper">
2503
- ${this.formatter?P`<div class="w-textfield__mask"></div>`:se}
2503
+ ${this.formatter?P`<div class="w-textfield__mask"></div>`:ce}
2504
2504
  <input
2505
2505
  class="${this._inputstyles}"
2506
2506
  type="${this.type||"text"}"
@@ -2525,12 +2525,13 @@ var te=Object.defineProperty;var ae=Object.getOwnPropertyDescriptor;var R=a=>{th
2525
2525
  @blur="${this.handler}"
2526
2526
  @change="${this.handler}"
2527
2527
  @input="${this.handler}"
2528
- @focus="${this.handler}" />
2528
+ @focus="${this.handler}"
2529
+ @keydown="${J(this,A,te)}" />
2529
2530
  </div>
2530
2531
  <slot @slotchange="${this.prefixSlotChange}" name="prefix"></slot>
2531
2532
  <slot @slotchange="${this.suffixSlotChange}" name="suffix"></slot>
2532
2533
  </div>
2533
2534
  <span class="sr-only" id="aria-description">${this.ariaDescription}</span>
2534
2535
  ${this.helpText&&P`<div class="${this._helptextstyles}" id="${this._helpId}">${this.helpText}</div>`}
2535
- `}};V=new WeakMap,i.shadowRootOptions={...ee.shadowRootOptions,delegatesFocus:!0},i.styles=[Q,W,T],d([c({type:Boolean,reflect:!0})],i.prototype,"disabled",2),d([c({type:Boolean,reflect:!0})],i.prototype,"invalid",2),d([c({type:String,reflect:!0})],i.prototype,"label",2),d([c({type:String,reflect:!0,attribute:"help-text"})],i.prototype,"helpText",2),d([c({type:String,reflect:!0})],i.prototype,"size",2),d([c({type:Number,reflect:!0})],i.prototype,"max",2),d([c({type:Number,reflect:!0})],i.prototype,"min",2),d([c({type:Number,reflect:!0,attribute:"min-length"})],i.prototype,"minLength",2),d([c({type:Number,reflect:!0})],i.prototype,"minlength",2),d([c({type:Number,reflect:!0,attribute:"max-length"})],i.prototype,"maxLength",2),d([c({type:Number,reflect:!0})],i.prototype,"maxlength",2),d([c({type:String,reflect:!0})],i.prototype,"pattern",2),d([c({type:String,reflect:!0})],i.prototype,"placeholder",2),d([c({type:Boolean,reflect:!0,attribute:"read-only"})],i.prototype,"readOnly",2),d([c({type:Boolean,reflect:!0})],i.prototype,"readonly",2),d([c({type:Boolean,reflect:!0})],i.prototype,"required",2),d([c({type:String,reflect:!0})],i.prototype,"type",2),d([c({type:String,reflect:!0})],i.prototype,"value",2),d([c({type:String,reflect:!0})],i.prototype,"name",2),d([c({type:Number,reflect:!0})],i.prototype,"step",2),d([c({type:String,reflect:!0})],i.prototype,"autocomplete",2),d([c({attribute:!1})],i.prototype,"formatter",2),d([le(".w-textfield__mask")],i.prototype,"mask",2),d([c({type:Boolean})],i.prototype,"_hasPrefix",2),d([c({type:Boolean})],i.prototype,"_hasSuffix",2);customElements.get("w-textfield")||customElements.define("w-textfield",i);export{i as WarpTextField};
2536
+ `}};A=new WeakSet,te=function(r){r.key==="Enter"&&this.internals.form&&this.internals.form.requestSubmit()},V=new WeakMap,i.shadowRootOptions={...oe.shadowRootOptions,delegatesFocus:!0},i.styles=[W,re,ee],d([c({type:Boolean,reflect:!0})],i.prototype,"disabled",2),d([c({type:Boolean,reflect:!0})],i.prototype,"invalid",2),d([c({type:String,reflect:!0})],i.prototype,"label",2),d([c({type:String,reflect:!0,attribute:"help-text"})],i.prototype,"helpText",2),d([c({type:String,reflect:!0})],i.prototype,"size",2),d([c({type:Number,reflect:!0})],i.prototype,"max",2),d([c({type:Number,reflect:!0})],i.prototype,"min",2),d([c({type:Number,reflect:!0,attribute:"min-length"})],i.prototype,"minLength",2),d([c({type:Number,reflect:!0})],i.prototype,"minlength",2),d([c({type:Number,reflect:!0,attribute:"max-length"})],i.prototype,"maxLength",2),d([c({type:Number,reflect:!0})],i.prototype,"maxlength",2),d([c({type:String,reflect:!0})],i.prototype,"pattern",2),d([c({type:String,reflect:!0})],i.prototype,"placeholder",2),d([c({type:Boolean,reflect:!0,attribute:"read-only"})],i.prototype,"readOnly",2),d([c({type:Boolean,reflect:!0})],i.prototype,"readonly",2),d([c({type:Boolean,reflect:!0})],i.prototype,"required",2),d([c({type:String,reflect:!0})],i.prototype,"type",2),d([c({type:String,reflect:!0})],i.prototype,"value",2),d([c({type:String,reflect:!0})],i.prototype,"name",2),d([c({type:Number,reflect:!0})],i.prototype,"step",2),d([c({type:String,reflect:!0})],i.prototype,"autocomplete",2),d([c({attribute:!1})],i.prototype,"formatter",2),d([be(".w-textfield__mask")],i.prototype,"mask",2),d([c({type:Boolean})],i.prototype,"_hasPrefix",2),d([c({type:Boolean})],i.prototype,"_hasSuffix",2);customElements.get("w-textfield")||customElements.define("w-textfield",i);export{i as WarpTextField};
2536
2537
  //# sourceMappingURL=textfield.js.map