@descope/web-components-ui 1.0.117 → 1.0.119

Sign up to get free protection for your applications and to get access to all the features.
package/dist/umd/201.js CHANGED
@@ -1 +1 @@
1
- "use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[201],{4201:(n,t,i)=>{i.d(t,{DY:()=>u,PH:()=>d,Pd:()=>l,TX:()=>o,jI:()=>p,jl:()=>a,wm:()=>e});const e=(n,t)=>`\n ${o(n)}\n ${l(n)}\n ${p(n)}\n ${a(n)}\n ${r(n,t)}\n\n ${n}::before {\n\t\theight: unset;\n\t}\n\n ${n} > input {\n\t\t-webkit-mask-image: none;\n\t\tmin-height: 0;\n\t}\n\n ${n}::part(input-field)::after {\n\t\topacity: 0 !important;\n }\n`,o=n=>`\n ${n} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,a=n=>`\n ${n}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,l=n=>`\n ${n} > label,\n ${n}::part(label),\n ${n}::part(required-indicator) {\n cursor: pointer;\n }\n`,p=(n,t="input")=>`\n ${n}[disabled] > ${t}:placeholder-shown,\n\t${n}[readonly] > ${t}:placeholder-shown {\n\t\topacity: 1;\n\t} \n`,r=(n,t)=>`\n ${n} input:-webkit-autofill,\n ${n} input:-webkit-autofill::first-line,\n ${n} input:-webkit-autofill:hover,\n ${n} input:-webkit-autofill:active,\n ${n} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${t.inputValueTextColor});\n box-shadow: 0 0 0 var(${t.inputHeight}) var(${t.inputBackgroundColor}) inset;\n } \n`,u=()=>"\n :host {\n --vaadin-field-default-width: auto;\n }\n",d=n=>`\n ${n}::part(input-field)::after {\n opacity: 0;\n }\n`}}]);
1
+ "use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[201],{4201:(n,t,i)=>{i.d(t,{DY:()=>u,PH:()=>d,Pd:()=>l,TX:()=>o,jI:()=>r,jl:()=>a,wm:()=>e});const e=(n,t)=>`\n ${o(n)}\n ${l(n)}\n ${r(n)}\n ${a(n)}\n ${p(n,t)}\n\n ${n}::before {\n\t\theight: unset;\n\t}\n\n ${n} > input {\n\t\t-webkit-mask-image: none;\n\t\tmin-height: 0;\n\t}\n\n ${n}::part(input-field)::after {\n\t\topacity: 0 !important;\n }\n`,o=n=>`\n ${n} {\n margin: 0;\n padding: 0;\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n }\n`,a=n=>`\n ${n}::part(input-field) {\n overflow: hidden;\n padding: 0;\n box-shadow: none;\n }\n`,l=n=>`\n ${n} > label,\n ${n}::part(label),\n ${n}::part(required-indicator) {\n cursor: pointer;\n }\n`,r=(n,t="input")=>`\n ${n}[disabled] > ${t}:placeholder-shown,\n\t${n}[readonly] > ${t}:placeholder-shown {\n\t\topacity: 1;\n\t} \n`,p=(n,t)=>`\n ${n} input:-webkit-autofill,\n ${n} input:-webkit-autofill::first-line,\n ${n} input:-webkit-autofill:hover,\n ${n} input:-webkit-autofill:active,\n ${n} input:-webkit-autofill:focus {\n -webkit-text-fill-color: var(${t.inputValueTextColor});\n box-shadow: 0 0 0 var(${t.inputHeight}) var(${t.inputBackgroundColor}) inset;\n } \n`,u=()=>"\n :host {\n --vaadin-field-default-width: auto;\n box-sizing: border-box;\n }\n",d=n=>`\n ${n}::part(input-field)::after {\n opacity: 0;\n }\n`}}]);
@@ -1 +1 @@
1
- "use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[939],{4919:(t,e,n)=>{n.r(e),n.d(e,{PasscodeClass:()=>x});var i=n(9241),r=n(7361),o=n(6417),a=n(2061),d=n(4567),s=n(4201);const l=(0,d.iY)("passcode"),p=["digits"],{host:c,digitField:u,label:g,requiredIndicator:h,internalWrapper:b,focusedDigitField:m}={host:()=>":host",focusedDigitField:{selector:()=>`${o.z.componentName}[focused="true"]`},digitField:{selector:()=>o.z.componentName},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},internalWrapper:{selector:"descope-passcode-internal .wrapper"}},f=o.z.cssVarList,x=(0,a.qC)((0,i.yk)({mappings:{hostWidth:{property:"width"},fontFamily:c,labelTextColor:[{...g,property:"color"},{...h,property:"color"}],labelRequiredIndicator:{...h,property:"content"},digitValueTextColor:{selector:o.z.componentName,property:f.inputValueTextColor},digitPadding:{...u,property:f.inputPadding},digitTextAlign:{...u,property:f.inputTextAlign},digitCaretTextColor:{...u,property:f.inputCaretTextColor},digitSpacing:{...b,property:"gap"},digitOutlineColor:{...u,property:f.inputOutlineColor},digitOutlineWidth:{...u,property:f.inputOutlineWidth},focusedDigitFieldOutlineColor:{...m,property:f.inputOutlineColor}}}),i.e4,i.dj,i.Ae,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}constructor(){super()}get digits(){return Number.parseInt(this.getAttribute("digits"))||6}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t<${r.f} \n\t\t\t\tbordered="true" \n\t\t\t\tname="code" \n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n\t\t\t></${r.f}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(r.f),(0,d.oP)(this,this.inputElement,{includeAttrs:["digits","size"]})}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),"digits"===t&&this.style.setProperty("--passcode-digits-count",n)}}))((0,i.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmin-width: calc(var(--passcode-digits-count) * 2em);\n\t\t\t}\n\t\t\t${(0,s.DY)()}\n\t\t\t:host::after {\n\t\t\t\tbackground-color: transparent;\n\t\t\t}\n\t\t\t:host::part(input-field)::after {\n\t\t\t\tbackground-color: transparent;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal {\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tmin-height: initial;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal .wrapper {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tmin-height: initial;\n\t\t\t\theight: 100%;\n\t\t\t\tjustify-content: space-between;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal descope-text-field {\n\t\t\t\tmin-width: 2em;\n\t\t\t\tmax-width: var(${f.inputHeight});\n\t\t\t}\n\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tbackground-color: transparent;\n\t\t\t\tpadding: 0;\n\t\t\t\toverflow: hidden;\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t}\n\n\t\t\tvaadin-text-field {\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%\n\t\t\t}\n\n\t\t\tvaadin-text-field::before {\n\t\t\t\theight: 0;\n\t\t\t}\n\n\t\t\tvaadin-text-field[readonly] > input:placeholder-shown {\n\t\t\t\topacity: 1;\n\t\t\t}\n\n\t\t\tvaadin-text-field[readonly]::part(input-field)::after {\n\t\t\t\tborder: 0 solid;\n\t\t\t}\n\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\n\t\t\t${(0,s.Pd)("vaadin-text-field")}\n \t`,excludeAttrsSync:["tabindex"],componentName:l}));n(9357),n(4775),customElements.define(l,x)}}]);
1
+ "use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[939],{4919:(t,e,n)=>{n.r(e),n.d(e,{PasscodeClass:()=>x});var i=n(9241),r=n(7361),o=n(6417),a=n(2061),d=n(4567),s=n(4201);const l=(0,d.iY)("passcode"),p=["digits"],{host:c,digitField:u,label:g,requiredIndicator:h,internalWrapper:m,focusedDigitField:b}={host:()=>":host",focusedDigitField:{selector:()=>`${o.z.componentName}[focused="true"]`},digitField:{selector:()=>o.z.componentName},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},internalWrapper:{selector:"descope-passcode-internal .wrapper"}},f=o.z.cssVarList,x=(0,a.qC)((0,i.yk)({mappings:{hostWidth:{property:"width"},fontFamily:c,labelTextColor:[{...g,property:"color"},{...h,property:"color"}],labelRequiredIndicator:{...h,property:"content"},digitValueTextColor:{selector:o.z.componentName,property:f.inputValueTextColor},digitPadding:{...u,property:f.inputPadding},digitTextAlign:{...u,property:f.inputTextAlign},digitCaretTextColor:{...u,property:f.inputCaretTextColor},digitSpacing:{...m,property:"gap"},digitOutlineColor:{...u,property:f.inputOutlineColor},digitOutlineWidth:{...u,property:f.inputOutlineWidth},focusedDigitFieldOutlineColor:{...b,property:f.inputOutlineColor}}}),i.e4,i.dj,i.Ae,(t=>class extends t{static get observedAttributes(){return p.concat(t.observedAttributes||[])}constructor(){super()}get digits(){return Number.parseInt(this.getAttribute("digits"))||6}init(){super.init?.();const t=document.createElement("template");t.innerHTML=`\n\t\t\t<${r.f} \n\t\t\t\tbordered="true" \n\t\t\t\tname="code" \n\t\t\t\ttabindex="-1"\n\t\t\t\tslot="input"\n\t\t\t></${r.f}>\n\t\t\t`,this.baseElement.appendChild(t.content.cloneNode(!0)),this.inputElement=this.shadowRoot.querySelector(r.f),(0,d.oP)(this,this.inputElement,{includeAttrs:["digits","size"]})}attributeChangedCallback(t,e,n){super.attributeChangedCallback?.(t,e,n),"digits"===t&&this.style.setProperty("--passcode-digits-count",n)}}))((0,i.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-flex;\n\t\t\t\tmax-width: 100%;\n\t\t\t\tmin-width: calc(var(--passcode-digits-count) * 2em);\n\t\t\t}\n\t\t\t${(0,s.DY)()}\n\t\t\t:host::after {\n\t\t\t\tbackground-color: transparent;\n\t\t\t}\n\t\t\t:host::part(input-field)::after {\n\t\t\t\tbackground-color: transparent;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal {\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%;\n\t\t\t\theight: 100%;\n\t\t\t\tmin-height: initial;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal .wrapper {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tmin-height: initial;\n\t\t\t\theight: 100%;\n\t\t\t\tjustify-content: space-between;\n\t\t\t}\n\n\t\t\tdescope-passcode-internal descope-text-field {\n\t\t\t\tmin-width: 2em;\n\t\t\t\tmax-width: var(${f.inputHeight});\n\t\t\t}\n\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tbackground-color: transparent;\n\t\t\t\tpadding: 0;\n\t\t\t\toverflow: hidden;\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t}\n\n\t\t\tvaadin-text-field {\n\t\t\t\tmargin: 0;\n\t\t\t\tpadding: 0;\n\t\t\t\twidth: 100%\n\t\t\t}\n\n\t\t\tvaadin-text-field::before {\n\t\t\t\theight: 0;\n\t\t\t}\n\n\t\t\tvaadin-text-field[readonly] > input:placeholder-shown {\n\t\t\t\topacity: 1;\n\t\t\t}\n\n\t\t\tvaadin-text-field[readonly]::part(input-field)::after {\n\t\t\t\tborder: 0 solid;\n\t\t\t}\n\n\t\t\tvaadin-text-field::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\n\t\t\t${(0,s.Pd)("vaadin-text-field")}\n \t`,excludeAttrsSync:["tabindex"],componentName:l}));n(9357),n(4775),customElements.define(l,x)}}]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@descope/web-components-ui",
3
- "version": "1.0.117",
3
+ "version": "1.0.119",
4
4
  "description": "",
5
5
  "main": "dist/cjs/index.cjs.js",
6
6
  "module": "dist/index.esm.js",
@@ -112,7 +112,7 @@ export const PasscodeClass = compose(
112
112
  wrappedEleName: 'vaadin-text-field',
113
113
  style: () => `
114
114
  :host {
115
- display: inline-block;
115
+ display: inline-flex;
116
116
  max-width: 100%;
117
117
  min-width: calc(var(--passcode-digits-count) * 2em);
118
118
  }
@@ -66,6 +66,7 @@ export const resetInputAutoFill = (name, cssVarList) => `
66
66
  export const resetInputFieldDefaultWidth = () => `
67
67
  :host {
68
68
  --vaadin-field-default-width: auto;
69
+ box-sizing: border-box;
69
70
  }
70
71
  `;
71
72