@descope/web-components-ui 1.0.180 → 1.0.182

package/dist/umd/2481.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[2481],{2481:(t,e,r)=>{r.d(e,{v:()=>v,f:()=>p});var n=r(1e3),o=r(2061),i=r(4567);var a=r(4201);const p=(0,i.iY)("password"),{host:s,inputField:d,inputElement:l,inputElementPlaceholder:u,revealButtonContainer:c,revealButtonIcon:h,label:y,requiredIndicator:f,errorMessage:b,helperText:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:"> input:placeholder-shown"},revealButtonContainer:{selector:()=>"::part(reveal-button)"},revealButtonIcon:{selector:()=>"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},v=(0,o.qC)((0,n.yk)({mappings:{hostWidth:{...s,property:"width"},hostMinWidth:{...s,property:"min-width"},fontSize:[{},s],fontFamily:[y,d,b,g],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...l,property:"padding-left"},{...l,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelTextColor:[{...y,property:"color"},{...f,property:"color"}],labelRequiredIndicator:{...f,property:"content"},errorMessageTextColor:{...b,property:"color"},inputValueTextColor:[{...l,property:"color"},{...h,property:"color"}],inputPlaceholderTextColor:{...u,property:"color"},revealButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],revealButtonSize:{...c,property:"font-size"}}}),n.e4,(0,n.dj)({proxyProps:["value","selectionStart"]}),n.Ae,(t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){this.addEventListener("mousedown",(t=>{if(this.isDraggable&&this.isReadOnly){const e=this.baseElement.querySelector("input"),r=e.getAttribute("type");e.setAttribute("type","text"),setTimeout((()=>e.focus()));const n=o=>{e.setAttribute("type",r),t.target.removeEventListener("mouseup",n),t.target.removeEventListener("dragend",n)};t.target.addEventListener("mouseup",n,{once:!0}),t.target.addEventListener("dragend",n,{once:!0})}})),super.init?.()}}))((0,n.DM)({slots:["","suffix"],wrappedEleName:"vaadin-password-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: 10em;\n\t\t\t}\n\t\t\t${(0,a.bi)(v.cssVarList)}\n\t\t\t${(0,a.Pd)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n\t\t\t\tmin-height: 0;\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t}\n\t\t\tvaadin-password-field[readonly] > input:placeholder-shown {\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\n\t\t\t[readonly] vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${v.cssVarList.inputOutlineColor});\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:p}))}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[2481],{2481:(t,e,r)=>{r.d(e,{v:()=>v,f:()=>p});var n=r(1e3),o=r(2061),i=r(4567);var a=r(4201);const p=(0,i.iY)("password"),{host:s,inputField:d,inputElement:l,inputElementPlaceholder:u,revealButtonContainer:c,revealButtonIcon:h,label:y,requiredIndicator:b,errorMessage:f,helperText:g}={host:{selector:()=>":host"},inputField:{selector:"::part(input-field)"},inputElement:{selector:"> input"},inputElementPlaceholder:{selector:"> input:placeholder-shown"},revealButtonContainer:{selector:()=>"::part(reveal-button)"},revealButtonIcon:{selector:()=>"::part(reveal-button)::before"},label:{selector:"::part(label)"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},v=(0,o.qC)((0,n.yk)({mappings:{hostWidth:{...s,property:"width"},hostMinWidth:{...s,property:"min-width"},fontSize:[{},s],fontFamily:[y,d,f,g],inputHeight:{...d,property:"height"},inputHorizontalPadding:[{...l,property:"padding-left"},{...l,property:"padding-right"}],inputBackgroundColor:{...d,property:"background-color"},inputBorderStyle:{...d,property:"border-style"},inputBorderWidth:{...d,property:"border-width"},inputBorderColor:{...d,property:"border-color"},inputBorderRadius:{...d,property:"border-radius"},inputOutlineColor:{...d,property:"outline-color"},inputOutlineStyle:{...d,property:"outline-style"},inputOutlineOffset:{...d,property:"outline-offset"},inputOutlineWidth:{...d,property:"outline-width"},labelTextColor:[{...y,property:"color"},{...b,property:"color"}],labelRequiredIndicator:{...b,property:"content"},errorMessageTextColor:{...f,property:"color"},inputValueTextColor:[{...l,property:"color"},{...h,property:"color"}],inputPlaceholderTextColor:{...u,property:"color"},revealButtonOffset:[{...c,property:"margin-right"},{...c,property:"margin-left"}],revealButtonSize:{...c,property:"font-size"}}}),n.e4,(0,n.dj)({proxyProps:["value","selectionStart"]}),n.Ae,(t=>class extends t{get isReadOnly(){return this.hasAttribute("readonly")&&"false"!==this.getAttribute("readonly")}init(){this.addEventListener("mousedown",(t=>{if(this.isDraggable&&this.isReadOnly){const e=this.baseElement.querySelector("input"),r=e.getAttribute("type");e.setAttribute("type","text"),setTimeout((()=>e.focus()));const n=o=>{e.setAttribute("type",r),t.target.removeEventListener("mouseup",n),t.target.removeEventListener("dragend",n)};t.target.addEventListener("mouseup",n,{once:!0}),t.target.addEventListener("dragend",n,{once:!0})}})),super.init?.()}}))((0,n.DM)({slots:["","suffix"],wrappedEleName:"vaadin-password-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: 10em;\n        box-sizing: border-box;        \n\t\t\t}\n\t\t\t${(0,a.bi)(v.cssVarList)}\n\t\t\t${(0,a.Pd)("vaadin-password-field")}\n\n\t\t\tvaadin-password-field {\n\t\t\t\twidth: 100%;\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field) {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tpadding: 0;\n\t\t\t}\n\t\t\tvaadin-password-field[focus-ring]::part(input-field) {\n\t\t\t\tbox-shadow: none;\n\t\t\t}\n\t\t\tvaadin-password-field > input {\n\t\t\t\tmin-height: 0;\n\t\t\t\t-webkit-mask-image: none;\n\t\t\t}\n\t\t\tvaadin-password-field[readonly] > input:placeholder-shown {\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t\tvaadin-password-field::before {\n\t\t\t\theight: initial;\n\t\t\t}\n\t\t\tvaadin-password-field::part(input-field)::after {\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\tvaadin-password-field-button {\n\t\t\t\tcursor: pointer;\n\t\t\t}\n\n\t\t\t[readonly] vaadin-password-field-button {\n\t\t\t\tpointer-events: none;\n\t\t\t}\n\n\t\t\tvaadin-password-field-button[focus-ring] {\n\t\t\t\tbox-shadow: 0 0 0 2px var(${v.cssVarList.inputOutlineColor});\n\t\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:p}))}}]);

package/dist/umd/descope-email-field-index-js.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[9760],{1272:(t,e,s)=>{s.r(e),s.d(e,{EmailFieldClass:()=>p}),s(9437);var i=s(1e3),a=s(4447),n=s(2061),l=s(4567),c=s(4201);const d=(0,l.iY)("email-field"),p=(0,n.qC)((0,i.yk)({mappings:a.Z}),i.e4,(0,i.dj)({proxyProps:["value","selectionStart"]}),i.Ae,(t=>class extends t{init(){super.init?.(),this.baseElement.setAttribute("pattern","^[\\w\\.\\%\\+\\-]+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$")}}))((0,i.DM)({slots:["","suffix"],wrappedEleName:"vaadin-email-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\tpadding: calc(var(${p.cssVarList.inputOutlineWidth}) + var(${p.cssVarList.inputOutlineOffset}))\n\t\t\t}\n\t\t\t${(0,c.bi)(p.cssVarList)}\n\t\t\t${(0,c.wm)("vaadin-email-field",p.cssVarList)}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}));customElements.define(d,p)}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[9760],{1272:(t,e,s)=>{s.r(e),s.d(e,{EmailFieldClass:()=>r}),s(9437);var i=s(1e3),n=s(4447),a=s(2061),l=s(4567),c=s(4201);const d=(0,l.iY)("email-field"),r=(0,a.qC)((0,i.yk)({mappings:n.Z}),i.e4,(0,i.dj)({proxyProps:["value","selectionStart"]}),i.Ae,(t=>class extends t{init(){super.init?.(),this.baseElement.setAttribute("pattern","^[\\w\\.\\%\\+\\-]+@[\\w\\.\\-]+\\.[A-Za-z]{2,}$")}}))((0,i.DM)({slots:["","suffix"],wrappedEleName:"vaadin-email-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\tpadding: calc(var(${r.cssVarList.inputOutlineWidth}) + var(${r.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;        \n\t\t\t}\n\t\t\t${(0,c.bi)(r.cssVarList)}\n\t\t\t${(0,c.wm)("vaadin-email-field",r.cssVarList)}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:d}));customElements.define(d,r)}}]);

package/dist/umd/descope-text-area-index-js.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[3322],{1962:(t,e,r)=>{r.r(e),r.d(e,{TextAreaClass:()=>b}),r(7101);var o=r(1e3),p=r(2061),a=r(4567),i=r(4201);const l=(0,a.iY)("text-area"),{host:n,label:s,placeholder:d,inputField:u,textArea:c,requiredIndicator:h,helperText:y,errorMessage:x}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"textarea:placeholder-shown"},inputField:{selector:"::part(input-field)"},textArea:{selector:"> textarea"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},b=(0,p.qC)((0,o.yk)({mappings:{hostWidth:{...n,property:"width"},hostMinWidth:{...n,property:"min-width"},fontSize:[n,c],fontFamily:[s,u,y,x],labelTextColor:[{...s,property:"color"},{...h,property:"color"}],labelRequiredIndicator:{...h,property:"content"},errorMessageTextColor:{...x,property:"color"},inputBackgroundColor:{...u,property:"background-color"},inputValueTextColor:{...c,property:"color"},inputPlaceholderTextColor:{...d,property:"color"},inputBorderWidth:{...u,property:"border-width"},inputBorderStyle:{...u,property:"border-style"},inputBorderColor:{...u,property:"border-color"},inputBorderRadius:{...u,property:"border-radius"},inputOutlineStyle:{...u,property:"outline-Style"},inputOutlineColor:{...u,property:"outline-color"},inputOutlineOffset:{...u,property:"outline-offset"},inputOutlineWidth:{...u,property:"outline-width"},inputResizeType:{...c,property:"resize"},inputMinHeight:{...c,property:"min-height"}}}),o.e4,(0,o.dj)({proxyProps:["value","selectionStart"]}),o.Ae)((0,o.DM)({slots:[],wrappedEleName:"vaadin-text-area",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n\t\t\t}\n\t\t\ttextarea {\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\t${(0,i.bi)(b.cssVarList)}\n\t\t\t${(0,i.TX)("vaadin-text-area")}\n\t\t\t${(0,i.jl)("vaadin-text-area")}\n\t\t\t${(0,i.jI)("vaadin-text-area","textarea")}\n\t\t\t${(0,i.Pd)("vaadin-text-area")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}));customElements.define(l,b)}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[3322],{1962:(t,e,r)=>{r.r(e),r.d(e,{TextAreaClass:()=>b}),r(7101);var o=r(1e3),p=r(2061),i=r(4567),a=r(4201);const l=(0,i.iY)("text-area"),{host:n,label:s,placeholder:d,inputField:u,textArea:c,requiredIndicator:h,helperText:y,errorMessage:x}={host:{selector:()=>":host"},label:{selector:"::part(label)"},placeholder:{selector:"textarea:placeholder-shown"},inputField:{selector:"::part(input-field)"},textArea:{selector:"> textarea"},requiredIndicator:{selector:"[required]::part(required-indicator)::after"},helperText:{selector:"::part(helper-text)"},errorMessage:{selector:"::part(error-message)"}},b=(0,p.qC)((0,o.yk)({mappings:{hostWidth:{...n,property:"width"},hostMinWidth:{...n,property:"min-width"},fontSize:[n,c],fontFamily:[s,u,y,x],labelTextColor:[{...s,property:"color"},{...h,property:"color"}],labelRequiredIndicator:{...h,property:"content"},errorMessageTextColor:{...x,property:"color"},inputBackgroundColor:{...u,property:"background-color"},inputValueTextColor:{...c,property:"color"},inputPlaceholderTextColor:{...d,property:"color"},inputBorderWidth:{...u,property:"border-width"},inputBorderStyle:{...u,property:"border-style"},inputBorderColor:{...u,property:"border-color"},inputBorderRadius:{...u,property:"border-radius"},inputOutlineStyle:{...u,property:"outline-Style"},inputOutlineColor:{...u,property:"outline-color"},inputOutlineOffset:{...u,property:"outline-offset"},inputOutlineWidth:{...u,property:"outline-width"},inputResizeType:{...c,property:"resize"},inputMinHeight:{...c,property:"min-height"}}}),o.e4,(0,o.dj)({proxyProps:["value","selectionStart"]}),o.Ae)((0,o.DM)({slots:[],wrappedEleName:"vaadin-text-area",style:()=>`\n\t\t\t:host {\n\t\t\t\tdisplay: inline-block;\n\t\t\t\tmax-width: 100%;\n        box-sizing: border-box;        \n\t\t\t}\n\t\t\ttextarea {\n\t\t\t\theight: 100%;\n\t\t\t}\n\t\t\t${(0,a.bi)(b.cssVarList)}\n\t\t\t${(0,a.TX)("vaadin-text-area")}\n\t\t\t${(0,a.jl)("vaadin-text-area")}\n\t\t\t${(0,a.jI)("vaadin-text-area","textarea")}\n\t\t\t${(0,a.Pd)("vaadin-text-area")}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:l}));customElements.define(l,b)}}]);

package/dist/umd/descope-text-field-index-js.js

@@ -1 +1 @@
-"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[2934],{6417:(t,e,s)=>{s.d(e,{f:()=>c,z:()=>p});var a=s(1e3),i=s(4447),n=s(2061),l=s(4567),r=s(4201);const c=(0,l.iY)("text-field"),d=["type"],p=(0,n.qC)((0,a.yk)({mappings:i.Z}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),a.Ae,(t=>class extends t{static get observedAttributes(){return d.concat(t.observedAttributes||[])}attributeChangedCallback(t,e,s){super.attributeChangeCallback?.(t,e,s),"type"===t&&this.baseElement._setType(s)}}))((0,a.DM)({slots:["prefix","suffix"],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\tpadding: calc(var(${p.cssVarList.inputOutlineWidth}) + var(${p.cssVarList.inputOutlineOffset}));\n\t\t\t}\n\t\t\t${(0,r.bi)(p.cssVarList)}\n\t\t\t${(0,r.wm)("vaadin-text-field",p.cssVarList)}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:c}))},9357:(t,e,s)=>{s.r(e),s.d(e,{TextFieldClass:()=>a.z}),s(9789);var a=s(6417);customElements.define(a.f,a.z)}}]);
+"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[2934],{6417:(t,e,s)=>{s.d(e,{f:()=>c,z:()=>p});var a=s(1e3),i=s(4447),n=s(2061),r=s(4567),l=s(4201);const c=(0,r.iY)("text-field"),d=["type"],p=(0,n.qC)((0,a.yk)({mappings:i.Z}),a.e4,(0,a.dj)({proxyProps:["value","selectionStart"]}),a.Ae,(t=>class extends t{static get observedAttributes(){return d.concat(t.observedAttributes||[])}attributeChangedCallback(t,e,s){super.attributeChangeCallback?.(t,e,s),"type"===t&&this.baseElement._setType(s)}}))((0,a.DM)({slots:["prefix","suffix"],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\tpadding: calc(var(${p.cssVarList.inputOutlineWidth}) + var(${p.cssVarList.inputOutlineOffset}));\n        box-sizing: border-box;        \n\t\t\t}\n\t\t\t${(0,l.bi)(p.cssVarList)}\n\t\t\t${(0,l.wm)("vaadin-text-field",p.cssVarList)}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:c}))},9357:(t,e,s)=>{s.r(e),s.d(e,{TextFieldClass:()=>a.z}),s(9789);var a=s(6417);customElements.define(a.f,a.z)}}]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@descope/web-components-ui",
-  "version": "1.0.180",
+  "version": "1.0.182",
   "description": "",
   "main": "dist/cjs/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/descope-email-field/EmailFieldClass.js

@@ -40,7 +40,8 @@ export const EmailFieldClass = compose(
 				max-width: 100%;
 				padding: calc(var(${EmailFieldClass.cssVarList.inputOutlineWidth}) + var(${
           EmailFieldClass.cssVarList.inputOutlineOffset
-        }))
+        }));
+        box-sizing: border-box;        
 			}
 			${useHostExternalPadding(EmailFieldClass.cssVarList)}
 			${resetInputOverrides('vaadin-email-field', EmailFieldClass.cssVarList)}

package/src/components/descope-password/PasswordClass.js

@@ -93,6 +93,7 @@ export const PasswordClass = compose(
 				display: inline-block;
 				max-width: 100%;
 				min-width: 10em;
+        box-sizing: border-box;        
 			}
 			${useHostExternalPadding(PasswordClass.cssVarList)}
 			${resetInputCursor('vaadin-password-field')}

package/src/components/descope-text-area/TextAreaClass.js

@@ -76,6 +76,7 @@ export const TextAreaClass = compose(
 			:host {
 				display: inline-block;
 				max-width: 100%;
+        box-sizing: border-box;        
 			}
 			textarea {
 				height: 100%;

package/src/components/descope-text-field/TextFieldClass.js

@@ -56,6 +56,7 @@ export const TextFieldClass = compose(
 				padding: calc(var(${TextFieldClass.cssVarList.inputOutlineWidth}) + var(${
           TextFieldClass.cssVarList.inputOutlineOffset
         }));
+        box-sizing: border-box;        
 			}
 			${useHostExternalPadding(TextFieldClass.cssVarList)}
 			${resetInputOverrides('vaadin-text-field', TextFieldClass.cssVarList)}

package/src/theme/components/textArea.js

@@ -9,7 +9,7 @@ const vars = TextAreaClass.cssVarList;
 const textArea = {
   [vars.hostWidth]: refs.width,
   [vars.hostMinWidth]: refs.minWidth,
-  [vars.fontSize]: globalRefs.typography.body2.size,
+  [vars.fontSize]: refs.fontSize,
   [vars.fontFamily]: refs.fontFamily,
   [vars.labelTextColor]: refs.labelTextColor,
   [vars.labelRequiredIndicator]: refs.requiredIndicator,