@descope/web-components-ui 1.0.109 → 1.0.111
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.d.ts +7 -7
- package/dist/index.esm.js +14 -14
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/boolean-fields-descope-switch-toggle-index-js.js +1 -1
- package/dist/umd/descope-button-index-js.js +1 -1
- package/dist/umd/descope-combo-box-index-js.js +1 -1
- package/dist/umd/descope-email-field-index-js.js +1 -1
- package/dist/umd/descope-logo-index-js.js +1 -1
- package/dist/umd/descope-number-field-index-js.js +1 -1
- package/dist/umd/descope-text-field-index-js.js +1 -1
- package/package.json +1 -1
- package/src/components/boolean-fields/descope-switch-toggle/SwitchToggle.js +1 -1
- package/src/components/descope-button/Button.js +1 -1
- package/src/components/descope-combo-box/ComboBox.js +2 -2
- package/src/components/descope-email-field/EmailField.js +3 -3
- package/src/components/descope-link/Link.js +3 -3
- package/src/components/descope-logo/Logo.js +1 -1
- package/src/components/descope-new-password/NewPassword.js +3 -3
- package/src/components/descope-new-password/descope-new-password-internal/NewPasswordInternal.js +2 -2
- package/src/components/descope-number-field/NumberField.js +3 -3
- package/src/components/descope-passcode/Passcode.js +4 -4
- package/src/components/descope-phone-field/PhoneField.js +8 -8
- package/src/components/descope-text-field/TextField.js +3 -3
- package/src/theme/components/button.js +2 -2
- package/src/theme/components/checkbox.js +2 -2
- package/src/theme/components/comboBox.js +2 -2
- package/src/theme/components/container.js +3 -3
- package/src/theme/components/divider.js +2 -2
- package/src/theme/components/emailField.js +2 -2
- package/src/theme/components/image.js +2 -2
- package/src/theme/components/link.js +2 -2
- package/src/theme/components/loader/loaderLinear.js +2 -2
- package/src/theme/components/loader/loaderRadial.js +2 -2
- package/src/theme/components/logo.js +2 -2
- package/src/theme/components/newPassword.js +2 -2
- package/src/theme/components/numberField.js +2 -2
- package/src/theme/components/passcode.js +2 -2
- package/src/theme/components/passwordField.js +2 -2
- package/src/theme/components/phoneField.js +2 -2
- package/src/theme/components/switchToggle.js +2 -2
- package/src/theme/components/text.js +2 -2
- package/src/theme/components/textArea.js +2 -2
- package/src/theme/components/textField.js +2 -2
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[483],{4332:(t,e,r)=>{r.r(e),r.d(e,{SwitchToggleClass:()=>
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[483],{4332:(t,e,r)=>{r.r(e),r.d(e,{SwitchToggleClass:()=>f});var o=r(4567),c=r(2061),n=r(9241),a=r(818),i=r(6882);const p=(0,o.iY)("switch-toggle"),{host:l,component:d,checkboxElement:s,checkboxSurface:h,checkboxHiddenLabel:b,label:k,requiredIndicator:y}={host:{selector:()=>":host"},label:{selector:"::part(label)"},requiredIndicator:{selector:"::part(required-indicator)::after"},component:{selector:"vaadin-checkbox"},checkboxElement:{selector:"vaadin-checkbox::part(checkbox)"},checkboxSurface:{selector:"vaadin-checkbox::part(checkbox)::after"},checkboxHiddenLabel:{selector:'vaadin-checkbox [slot="label"]'}},u=(0,c.qC)((0,n.yk)({mappings:{width:l,cursor:[d,b,s],fontSize:[d,k,b],trackBorderWidth:{...s,property:"border-width"},trackBorderStyle:{...s,property:"border-style"},trackBorderColor:{...s,property:"border-color"},trackBackgroundColor:{...s,property:"background-color"},trackRadius:{...s,property:"border-radius"},trackWidth:[{...s,property:"width"}],trackHeight:[{...h,property:"font-size"},{...s,property:"height"}],switchOutlineWidth:{...s,property:"outline-width"},switchOutlineOffset:{...s,property:"outline-offset"},switchOutlineColor:{...s,property:"outline-color"},switchOutlineStyle:{...s,property:"outline-style"},knobSize:[{...h,property:"width"},{...h,property:"height"}],knobTextColor:{...h,property:"color"},knobRadius:{...h,property:"border-radius"},knobTransition:{...h,property:"transition"},knobColor:{...h,property:"background-color"},knobTopOffset:{...h,property:"top"},knobPosition:{...h,property:"left"},labelMargin:[{...k,property:"padding-left"},{...b,property:"padding-left"}],labelLineHeight:[{...k,property:"line-height"},{...b,property:"line-height"}],labelFontWeight:[{...k,property:"font-weight"},{...b,property:"font-weight"}],labelTextColor:[{...k,property:"color"},{...y,property:"color"}]}}),n.e4,n.dj,n.Ae,a.h)((0,n.DM)({slots:[],wrappedEleName:"vaadin-text-field",style:()=>`\n\t\t${i.Z}\n\n\t\tvaadin-text-field::part(label) {\n\t\t\tleft: calc(var(${u.cssVarList.trackWidth}) + var(${u.cssVarList.trackBorderWidth}) * 2);\n\t\t}\n\n\t\tvaadin-checkbox[active]::part(checkbox) {\n\t\t\ttransform: none;\n\t\t}\n\t\tvaadin-checkbox[checked]::part(checkbox) {\n\t\t\tbackground: none;\n\t\t}\n\t\tvaadin-checkbox::part(checkbox)::after {\n\t\t\tposition: absolute;\n\t\t\topacity: 1;\n\t\t\tcontent: '';\n\t\t}\n\t\t`,excludeAttrsSync:["tabindex"],componentName:p})),f=u;r(9515),r(9789),r(6676),customElements.define(p,f)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[662],{3029:(t,n,e)=>{e.r(n),e.d(n,{ButtonClass:()=>u}),e(729);var r=e(2061),o=e(4567),a=e(9241);const i=(0,o.iY)("button"),{host:l,label:d}={host:{selector:()=>":host"},label:{selector:"::part(label)"}},s=(0,r.qC)((0,a.yk)({mappings:{color:{},textDecoration:d,fontSize:{},cursor:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},width:l,gap:d,verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}]}}),a.e4,a.Ae)((0,a.DM)({slots:["prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t\t\t${c}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:i})),{color:p,fontSize:b}=
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[662],{3029:(t,n,e)=>{e.r(n),e.d(n,{ButtonClass:()=>u}),e(729);var r=e(2061),o=e(4567),a=e(9241);const i=(0,o.iY)("button"),{host:l,label:d}={host:{selector:()=>":host"},label:{selector:"::part(label)"}},s=(0,r.qC)((0,a.yk)({mappings:{color:{},textDecoration:d,fontSize:{},cursor:{},backgroundColor:{},borderRadius:{},borderColor:{},borderStyle:{},borderWidth:{},width:l,gap:d,verticalPadding:[{property:"padding-top"},{property:"padding-bottom"}],horizontalPadding:[{property:"padding-left"},{property:"padding-right"}]}}),a.e4,a.Ae)((0,a.DM)({slots:["prefix","label","suffix"],wrappedEleName:"vaadin-button",style:()=>`\n\t\t\t\n\t:host {\n\t\tdisplay: inline-block;\n\t}\n\tvaadin-button {\n\t\tmargin: 0;\n\t\tmin-width: 0;\n\t\twidth: 100%;\n\t\theight: auto;\n\t}\n\tvaadin-button::part(label) {\n\t\tpadding: 0;\n\t}\n\tvaadin-button::part(prefix) {\n\t\tmargin-left: 0;\n\t\tmargin-right: 0;\n\t}\n\n\t\t\t\n\tvaadin-button::part(prefix),\n\tvaadin-button::part(label) {\n\t\tdisplay: flex;\n\t\tjustify-content: center;\n\t\talign-items: center;\n\t}\n\n\t\t\t${c}\n\t\t\tvaadin-button::part(label) { pointer-events: none; }\n\t\t`,excludeAttrsSync:["tabindex"],componentName:i})),{color:p,fontSize:b}=s.cssVarList,c=`\n\t@keyframes spin {\n\t\t0% { -webkit-transform: rotate(0deg); }\n\t\t100% { -webkit-transform: rotate(360deg); }\n\t}\n\t:host([loading="true"]) ::before {\n\t\tanimation: spin 2s linear infinite;\n\t\tposition: absolute;\n\t\tcontent: '';\n\t\tz-index: 1;\n\t\tbox-sizing: border-box;\n\t\tborder-radius: 50%;\n\t\tborder-bottom-color: transparent;\n\t\tborder-left-color: transparent;\n\t\tborder-style: solid;\n\t\tcolor: var(${p});\n\t\ttop: calc(50% - (var(${b}) / 2));\n\t\tleft: calc(50% - (var(${b}) / 2));\n\t\tborder-width: calc(var(${b}) / 10);\n\t\twidth: var(${b});\n\t\theight: var(${b});\n\t}\n\t:host([loading="true"])::part(prefix),\n\t:host([loading="true"])::part(label) {\n\t\tvisibility: hidden;\n\t}\n`,u=s;customElements.define(i,u)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[4],{3352:(t,e,o)=>{o.d(e,{Z:()=>
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[4],{3352:(t,e,o)=>{o.d(e,{Z:()=>u,f:()=>i});var r=o(2061),n=o(4567),a=o(9241);const i=(0,n.iY)("combo-box"),{host:l,input:d,placeholder:s,toggle:c,label:p}={host:{selector:()=>":host"},input:{selector:"::part(input-field)"},placeholder:{selector:"> input:placeholder-shown"},toggle:{selector:"::part(toggle-button)"},label:{selector:"::part(label)"}},b=(0,r.qC)((0,a.yk)({mappings:{width:l,height:d,padding:d,inputBackgroundColor:{...d,property:"background-color"},boxShadow:d,borderColor:d,borderWidth:d,borderStyle:d,borderRadius:d,color:[p,d],fontSize:[{},l],placeholderColor:{...s,property:"color"},toggleCursor:{...c,property:"cursor"},toggleColor:{...c,property:"color"},overlayBackground:{property:()=>b.cssVarList.overlay.backgroundColor},overlayBorder:{property:()=>b.cssVarList.overlay.border}}}),a.e4,(0,a.Iw)({name:"overlay",selector:"",mappings:{backgroundColor:{selector:"vaadin-combo-box-scroller"},cursor:{selector:"vaadin-combo-box-item"}},forward:{include:!1,attributes:["size"]}}),a.dj,a.Ae,(t=>class extends t{constructor(){super()}#t(){const t=this.shadowRoot.querySelector(this.baseSelector),e=Array.from(this.children);e.length&&(e.forEach((t=>{Object.defineProperty(t,"data-name",{value:t.getAttribute("data-name")}),Object.defineProperty(t,"data-id",{value:t.getAttribute("data-id")})})),t.items=e,t.renderer=(t,e,o)=>{t.innerHTML=o.item.outerHTML})}#e(){const t=this.baseElement.shadowRoot.querySelector("vaadin-combo-box-overlay");t._attachOverlay=function(){this.bringToFront()},t._detachOverlay=function(){},t._enterModalState=function(){}}init(){super.init?.(),this.#e(),(0,n.P$)(this,this.#t.bind(this))}}))((0,a.DM)({slots:["prefix"],wrappedEleName:"vaadin-combo-box",style:()=>'\n\t\t:host {\n\t\t\tdisplay: inline-flex;\n\t\t\tbox-sizing: border-box;\n\t\t\t-webkit-mask-image: none;\n\t\t}\n\t\tvaadin-combo-box {\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-combo-box [slot="input"] {\n\t\t\t-webkit-mask-image: none;\n\t\t\tmin-height: 0;\n\t\t}\n\t\tvaadin-combo-box::part(input-field) {\n\t\t\t-webkit-mask-image: none;\n\t\t\tborder-radius: 0;\n\t\t\tpadding: 0;\n\t\t}\n\t\tvaadin-combo-box::part(input-field)::after {\n\t\t\topacity: 0;\n\t\t}\n\t\tvaadin-combo-box[readonly]::part(input-field)::after {\n\t\t\tborder: none;\n\t\t}\n\t\tvaadin-combo-box[readonly] > input:placeholder-shown {\n\t\t\topacity: 1;\n\t\t}\t\t\n\t\t',excludeAttrsSync:["tabindex","size"],componentName:i,includeForwardProps:["items","renderer","selectedItem"]})),u=b},1294:(t,e,o)=>{o.r(e),o.d(e,{ComboBoxClass:()=>r.Z}),o(9314);var r=o(3352);customElements.define(r.f,r.Z)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[760],{689:(t,i,e)=>{e.r(i),e.d(i,{EmailFieldClass:()=>r}),e(9437);var n=e(9241),a=e(4447),l=e(2061);const d=(0,e(4567).iY)("email-field");let o="";const s=(0,l.qC)((0,n.yk)({mappings:{...a.Z}}),n.e4,n.dj,n.Ae)((0,n.DM)({slots:["suffix"],wrappedEleName:"vaadin-email-field",style:()=>o,excludeAttrsSync:["tabindex"],componentName:d}));o=`\n\t:host {\n\t\tdisplay: inline-block;\n\t\tmin-width: 10em;\n\t\tmax-width: 100%;\n\t}\n\tvaadin-email-field {\n\t\tmargin: 0;\n\t\twidth: 100%;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-email-field::before {\n\t\theight: 0;\n\t}\n\tvaadin-email-field > input {\n\t\t-webkit-mask-image: none;\n\t}\n\tvaadin-email-field::part(input-field) {\n\t\toverflow: hidden;\n\t\tpadding: 0;\n\t}\n\tvaadin-email-field[readonly] > input:placeholder-shown {\n\t\topacity: 1;\n\t}\n\tvaadin-email-field input:-webkit-autofill,\n\tvaadin-email-field input:-webkit-autofill::first-line,\n\tvaadin-email-field input:-webkit-autofill:hover,\n\tvaadin-email-field input:-webkit-autofill:active,\n\tvaadin-email-field input:-webkit-autofill:focus {\n\t\t-webkit-text-fill-color: var(${
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[760],{689:(t,i,e)=>{e.r(i),e.d(i,{EmailFieldClass:()=>r}),e(9437);var n=e(9241),a=e(4447),l=e(2061);const d=(0,e(4567).iY)("email-field");let o="";const s=(0,l.qC)((0,n.yk)({mappings:{...a.Z}}),n.e4,n.dj,n.Ae)((0,n.DM)({slots:["suffix"],wrappedEleName:"vaadin-email-field",style:()=>o,excludeAttrsSync:["tabindex"],componentName:d}));o=`\n\t:host {\n\t\tdisplay: inline-block;\n\t\tmin-width: 10em;\n\t\tmax-width: 100%;\n\t}\n\tvaadin-email-field {\n\t\tmargin: 0;\n\t\twidth: 100%;\n\t\tbox-sizing: border-box;\n\t}\n\tvaadin-email-field::before {\n\t\theight: 0;\n\t}\n\tvaadin-email-field > input {\n\t\t-webkit-mask-image: none;\n\t}\n\tvaadin-email-field::part(input-field) {\n\t\toverflow: hidden;\n\t\tpadding: 0;\n\t}\n\tvaadin-email-field[readonly] > input:placeholder-shown {\n\t\topacity: 1;\n\t}\n\tvaadin-email-field input:-webkit-autofill,\n\tvaadin-email-field input:-webkit-autofill::first-line,\n\tvaadin-email-field input:-webkit-autofill:hover,\n\tvaadin-email-field input:-webkit-autofill:active,\n\tvaadin-email-field input:-webkit-autofill:focus {\n\t\t-webkit-text-fill-color: var(${s.cssVarList.color});\n\t\tbox-shadow: 0 0 0 var(${s.cssVarList.height}) var(${s.cssVarList.backgroundColor}) inset;\n\t}\n\tvaadin-email-field[required]::part(required-indicator)::after {\n\t\tcontent: "*";\n\t\tcolor: var(${s.cssVarList.color});\n\t}\n\tvaadin-email-field[readonly]::part(input-field)::after {\n\t\tborder: 0 solid;\n\t}\n`;const r=s;customElements.define(d,r)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[984],{4641:(t,n,e)=>{e.r(n),e.d(n,{LogoClass:()=>h});var s=e(9241),o=e(693),a=e(2061);const c=(0,e(4567).iY)("logo");let i;class l extends((0,o.s)({componentName:c,baseSelector:":host > div"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n\t\t<style>\n\t\t\t${i}\n\t\t</style>\n\t\t<div></div>`}}const r=(0,a.qC)((0,s.yk)({mappings:{height:{selector:()=>":host"},width:{selector:()=>":host"},fallbackUrl:{property:"content"},url:{property:"content"}}}),s.e4,s.Ae)(l);i=`\n:host {\n\tdisplay: inline-flex;\n}\n:host > div {\n\tdisplay: inline-block;\n\tcontent: var(${
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[984],{4641:(t,n,e)=>{e.r(n),e.d(n,{LogoClass:()=>h});var s=e(9241),o=e(693),a=e(2061);const c=(0,e(4567).iY)("logo");let i;class l extends((0,o.s)({componentName:c,baseSelector:":host > div"})){constructor(){super(),this.attachShadow({mode:"open"}).innerHTML=`\n\t\t<style>\n\t\t\t${i}\n\t\t</style>\n\t\t<div></div>`}}const r=(0,a.qC)((0,s.yk)({mappings:{height:{selector:()=>":host"},width:{selector:()=>":host"},fallbackUrl:{property:"content"},url:{property:"content"}}}),s.e4,s.Ae)(l);i=`\n:host {\n\tdisplay: inline-flex;\n}\n:host > div {\n\tdisplay: inline-block;\n\tcontent: var(${r.cssVarList.url}, var(${r.cssVarList.fallbackUrl}));\n\tmax-width: 100%;\n\tmax-height: 100%;\n\tobject-fit: contain;\n\tmargin: auto;\n}\n:host([draggable="true"]) > div {\n\tpointer-events: none\n}\n`;const h=r;customElements.define(c,h)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[142],{4951:(t,n,e)=>{e.r(n),e.d(n,{NumberFieldClass:()=>
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[142],{4951:(t,n,e)=>{e.r(n),e.d(n,{NumberFieldClass:()=>s}),e(5806);var i=e(9241),a=e(4447),d=e(2061);const r=(0,e(4567).iY)("number-field");let l="";const o=(0,d.qC)((0,i.yk)({mappings:{...a.Z}}),i.e4,i.dj,i.Ae)((0,i.DM)({slots:["prefix","suffix"],wrappedEleName:"vaadin-number-field",style:()=>l,excludeAttrsSync:["tabindex"],componentName:r}));l=`\n\t:host {\n\t\tdisplay: inline-block;\n\t\tmin-width: 10em;\n\t\tmax-width: 100%;\n\t}\n\tvaadin-number-field {\n\t\tmargin: 0;\n\t\tpadding: 0;\n\t\twidth: 100%;\n\t}\n\tvaadin-number-field > input {\n\t\t-webkit-mask-image: none;\n\t}\n\tvaadin-number-field::part(input-field) {\n\t\tpadding: 0;\n\t}\n\tvaadin-number-field[readonly] > input:placeholder-shown {\n\t\topacity: 1;\n\t}\n\tvaadin-number-field input:-webkit-autofill,\n\tvaadin-number-field input:-webkit-autofill::first-line,\n\tvaadin-number-field input:-webkit-autofill:hover,\n\tvaadin-number-field input:-webkit-autofill:active,\n\tvaadin-number-field input:-webkit-autofill:focus {\n\t\t-webkit-text-fill-color: var(${o.cssVarList.color});\n\t\tbox-shadow: 0 0 0 var(${o.cssVarList.height}) var(${o.cssVarList.backgroundColor}) inset;\n\t}\n\tvaadin-number-field[required]::part(required-indicator)::after {\n\t\tcontent: "*";\n\t\tcolor: var(${o.cssVarList.color});\n\t}\n\tvaadin-number-field[readonly]::part(input-field)::after {\n\t\tborder: 0 solid;\n\t}\n`;const s=o;customElements.define(r,s)}}]);
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[934],{9063:(t,e,n)=>{n.d(e,{Z:()=>f,f:()=>l});var i=n(9241),a=n(4447),d=n(2061);const l=(0,n(4567).iY)("text-field");let s="";const o=["type"],r=(0,d.qC)((0,i.yk)({mappings:a.Z}),i.e4,i.dj,i.Ae,(t=>class extends t{static get observedAttributes(){return o.concat(t.observedAttributes||[])}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n)}}))((0,i.DM)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>s,excludeAttrsSync:["tabindex"],componentName:l}));s=`\n\t:host {\n\t\tdisplay: inline-block;\n\t\t--vaadin-field-default-width: auto;\n\t\tmax-width: 100%;\n\t\tmin-width: 10em;\n\n\t}\n\tvaadin-text-field {\n\t\tmargin: 0;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbox-sizing: border-box;\n\t}\n\n\tvaadin-text-field::part(input-field) {\n\t\toverflow: hidden;\n\t\tpadding: 0;\n\t}\n\tvaadin-text-field[disabled] > input:placeholder-shown,\n\tvaadin-text-field[readonly] > input:placeholder-shown {\n\t\topacity: 1;\n\t}\n\tvaadin-text-field input:-webkit-autofill,\n\tvaadin-text-field input:-webkit-autofill::first-line,\n\tvaadin-text-field input:-webkit-autofill:hover,\n\tvaadin-text-field input:-webkit-autofill:active,\n\tvaadin-text-field input:-webkit-autofill:focus {\n\t\t-webkit-text-fill-color: var(${
|
1
|
+
"use strict";(self.webpackChunkDescopeUI=self.webpackChunkDescopeUI||[]).push([[934],{9063:(t,e,n)=>{n.d(e,{Z:()=>f,f:()=>l});var i=n(9241),a=n(4447),d=n(2061);const l=(0,n(4567).iY)("text-field");let s="";const o=["type"],r=(0,d.qC)((0,i.yk)({mappings:a.Z}),i.e4,i.dj,i.Ae,(t=>class extends t{static get observedAttributes(){return o.concat(t.observedAttributes||[])}attributeChangedCallback(t,e,n){super.attributeChangeCallback?.(t,e,n),"type"===t&&this.baseElement._setType(n)}}))((0,i.DM)({slots:["prefix","suffix"],wrappedEleName:"vaadin-text-field",style:()=>s,excludeAttrsSync:["tabindex"],componentName:l}));s=`\n\t:host {\n\t\tdisplay: inline-block;\n\t\t--vaadin-field-default-width: auto;\n\t\tmax-width: 100%;\n\t\tmin-width: 10em;\n\n\t}\n\tvaadin-text-field {\n\t\tmargin: 0;\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\tbox-sizing: border-box;\n\t}\n\n\tvaadin-text-field::part(input-field) {\n\t\toverflow: hidden;\n\t\tpadding: 0;\n\t}\n\tvaadin-text-field[disabled] > input:placeholder-shown,\n\tvaadin-text-field[readonly] > input:placeholder-shown {\n\t\topacity: 1;\n\t}\n\tvaadin-text-field input:-webkit-autofill,\n\tvaadin-text-field input:-webkit-autofill::first-line,\n\tvaadin-text-field input:-webkit-autofill:hover,\n\tvaadin-text-field input:-webkit-autofill:active,\n\tvaadin-text-field input:-webkit-autofill:focus {\n\t\t-webkit-text-fill-color: var(${r.cssVarList.color});\n\t\tbox-shadow: 0 0 0 var(${r.cssVarList.height}) var(${r.cssVarList.backgroundColor}) inset;\n\t}\n\n\tvaadin-text-field > input {\n\t\t-webkit-mask-image: none;\n\t\tmin-height: 0;\n\t}\n\n\tvaadin-text-field[required]::part(required-indicator)::after {\n\t\tcontent: "*";\n\t\tcolor: var(${r.cssVarList.color});\n\t}\n\tvaadin-text-field::part(input-field)::after {\n\t\topacity: 0 !important;\n\t}\n\n\tvaadin-text-field::before {\n\t\theight: unset;\n\t}\n`;const f=r},9357:(t,e,n)=>{n.r(e),n.d(e,{TextFieldClass:()=>i.Z}),n(9789);var i=n(9063);customElements.define(i.f,i.Z)}}]);
|
package/package.json
CHANGED
@@ -101,7 +101,7 @@ const SwitchToggleClass = compose(
|
|
101
101
|
${commonStyles}
|
102
102
|
|
103
103
|
vaadin-text-field::part(label) {
|
104
|
-
left: calc(var(${
|
104
|
+
left: calc(var(${SwitchToggleClass.cssVarList.trackWidth}) + var(${SwitchToggleClass.cssVarList.trackBorderWidth}) * 2);
|
105
105
|
}
|
106
106
|
|
107
107
|
vaadin-checkbox[active]::part(checkbox) {
|
@@ -110,8 +110,8 @@ const ComboBoxClass = compose(
|
|
110
110
|
// so we need to use an arrow function on the selector
|
111
111
|
// for that to work, because ComboBox is not available
|
112
112
|
// at this time.
|
113
|
-
overlayBackground: { property: () =>
|
114
|
-
overlayBorder: { property: () =>
|
113
|
+
overlayBackground: { property: () => ComboBoxClass.cssVarList.overlay.backgroundColor },
|
114
|
+
overlayBorder: { property: () => ComboBoxClass.cssVarList.overlay.border }
|
115
115
|
}
|
116
116
|
}),
|
117
117
|
draggableMixin,
|
@@ -61,12 +61,12 @@ overrides = `
|
|
61
61
|
vaadin-email-field input:-webkit-autofill:hover,
|
62
62
|
vaadin-email-field input:-webkit-autofill:active,
|
63
63
|
vaadin-email-field input:-webkit-autofill:focus {
|
64
|
-
-webkit-text-fill-color: var(${
|
65
|
-
box-shadow: 0 0 0 var(${
|
64
|
+
-webkit-text-fill-color: var(${EmailFieldClass.cssVarList.color});
|
65
|
+
box-shadow: 0 0 0 var(${EmailFieldClass.cssVarList.height}) var(${EmailFieldClass.cssVarList.backgroundColor}) inset;
|
66
66
|
}
|
67
67
|
vaadin-email-field[required]::part(required-indicator)::after {
|
68
68
|
content: "*";
|
69
|
-
color: var(${
|
69
|
+
color: var(${EmailFieldClass.cssVarList.color});
|
70
70
|
}
|
71
71
|
vaadin-email-field[readonly]::part(input-field)::after {
|
72
72
|
border: 0 solid;
|
@@ -4,7 +4,7 @@ import {
|
|
4
4
|
componentNameValidationMixin,
|
5
5
|
} from '../../mixins';
|
6
6
|
import { createBaseClass } from '../../baseClasses/createBaseClass';
|
7
|
-
import
|
7
|
+
import TextClass from '../descope-text/Text';
|
8
8
|
import { compose } from '../../helpers';
|
9
9
|
import { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';
|
10
10
|
|
@@ -48,7 +48,7 @@ const selectors = {
|
|
48
48
|
host: { selector: () => ':host' },
|
49
49
|
anchor: {},
|
50
50
|
wrapper: { selector: () => ':host > div' },
|
51
|
-
text: { selector: () =>
|
51
|
+
text: { selector: () => TextClass.componentName }
|
52
52
|
};
|
53
53
|
|
54
54
|
const { anchor, text, host, wrapper } = selectors;
|
@@ -58,7 +58,7 @@ const LinkClass = compose(
|
|
58
58
|
mappings: {
|
59
59
|
width: host,
|
60
60
|
textAlign: wrapper,
|
61
|
-
color: [anchor, { ...text, property:
|
61
|
+
color: [anchor, { ...text, property: TextClass.cssVarList.color }],
|
62
62
|
cursor: anchor,
|
63
63
|
borderBottomWidth: anchor,
|
64
64
|
borderBottomStyle: anchor,
|
@@ -43,7 +43,7 @@ style = `
|
|
43
43
|
}
|
44
44
|
:host > div {
|
45
45
|
display: inline-block;
|
46
|
-
content: var(${
|
46
|
+
content: var(${LogoClass.cssVarList.url}, var(${LogoClass.cssVarList.fallbackUrl}));
|
47
47
|
max-width: 100%;
|
48
48
|
max-height: 100%;
|
49
49
|
object-fit: contain;
|
@@ -7,7 +7,7 @@ import {
|
|
7
7
|
createProxy,
|
8
8
|
} from '../../mixins';
|
9
9
|
import { componentName as descopeInternalComponentName } from './descope-new-password-internal/componentName';
|
10
|
-
import
|
10
|
+
import PasswordFieldClass from '../descope-password-field/PasswordField';
|
11
11
|
|
12
12
|
export const componentName = getComponentName('new-password');
|
13
13
|
|
@@ -63,8 +63,8 @@ const NewPasswordClass = compose(
|
|
63
63
|
fontSize: [
|
64
64
|
host,
|
65
65
|
{
|
66
|
-
selector:
|
67
|
-
property:
|
66
|
+
selector: PasswordFieldClass.componentName,
|
67
|
+
property: PasswordFieldClass.cssVarList.fontSize
|
68
68
|
}
|
69
69
|
],
|
70
70
|
componentWidth: { ...host, property: 'width' },
|
package/src/components/descope-new-password/descope-new-password-internal/NewPasswordInternal.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import { createBaseInputClass } from '../../../baseClasses/createBaseInputClass';
|
2
2
|
import { observeAttributes } from '../../../helpers/componentHelpers';
|
3
|
-
import
|
3
|
+
import NewPasswordClass from '../NewPassword';
|
4
4
|
import { componentName } from './componentName';
|
5
5
|
|
6
6
|
const passwordAttrPrefixRegex = /^password-/
|
@@ -117,7 +117,7 @@ class NewPasswordInternal extends BaseInputClass {
|
|
117
117
|
const styleTag = document.createElement('style');
|
118
118
|
styleTag.innerHTML = `
|
119
119
|
:host::part(required-indicator)::after {
|
120
|
-
content: var(${
|
120
|
+
content: var(${NewPasswordClass.cssVarList.requiredContent});
|
121
121
|
}
|
122
122
|
`;
|
123
123
|
input?.shadowRoot.appendChild(styleTag);
|
@@ -57,12 +57,12 @@ overrides = `
|
|
57
57
|
vaadin-number-field input:-webkit-autofill:hover,
|
58
58
|
vaadin-number-field input:-webkit-autofill:active,
|
59
59
|
vaadin-number-field input:-webkit-autofill:focus {
|
60
|
-
-webkit-text-fill-color: var(${
|
61
|
-
box-shadow: 0 0 0 var(${
|
60
|
+
-webkit-text-fill-color: var(${NumberFieldClass.cssVarList.color});
|
61
|
+
box-shadow: 0 0 0 var(${NumberFieldClass.cssVarList.height}) var(${NumberFieldClass.cssVarList.backgroundColor}) inset;
|
62
62
|
}
|
63
63
|
vaadin-number-field[required]::part(required-indicator)::after {
|
64
64
|
content: "*";
|
65
|
-
color: var(${
|
65
|
+
color: var(${NumberFieldClass.cssVarList.color});
|
66
66
|
}
|
67
67
|
vaadin-number-field[readonly]::part(input-field)::after {
|
68
68
|
border: 0 solid;
|
@@ -7,7 +7,7 @@ import {
|
|
7
7
|
} from '../../mixins';
|
8
8
|
import textFieldMappings from '../descope-text-field/textFieldMappings';
|
9
9
|
import { componentName as descopeInternalComponentName } from './descope-passcode-internal/PasscodeInternal';
|
10
|
-
import
|
10
|
+
import TextFieldClass from '../descope-text-field/TextField'
|
11
11
|
import { compose } from '../../helpers';
|
12
12
|
import { forwardAttrs, getComponentName } from '../../helpers/componentHelpers';
|
13
13
|
|
@@ -64,14 +64,14 @@ const { borderStyle, borderWidth, ...restTextFieldMappings } =
|
|
64
64
|
textFieldMappings;
|
65
65
|
|
66
66
|
const { digitField, label, requiredIndicator, internalWrapper, focusedDigitField } = {
|
67
|
-
focusedDigitField: { selector: () => `${
|
68
|
-
digitField: { selector: () =>
|
67
|
+
focusedDigitField: { selector: () => `${TextFieldClass.componentName}[focused="true"]` },
|
68
|
+
digitField: { selector: () => TextFieldClass.componentName },
|
69
69
|
label: { selector: '::part(label)' },
|
70
70
|
requiredIndicator: { selector: '[required]::part(required-indicator)::after' },
|
71
71
|
internalWrapper: { selector: 'descope-passcode-internal .wrapper' }
|
72
72
|
}
|
73
73
|
|
74
|
-
const textVars =
|
74
|
+
const textVars = TextFieldClass.cssVarList
|
75
75
|
|
76
76
|
const PasscodeClass = compose(
|
77
77
|
createStyleMixin({
|
@@ -7,12 +7,12 @@ import {
|
|
7
7
|
draggableMixin,
|
8
8
|
proxyInputMixin
|
9
9
|
} from '../../mixins';
|
10
|
-
import
|
11
|
-
import
|
10
|
+
import TextFieldClass from '../descope-text-field/TextField';
|
11
|
+
import ComboBoxClass from '../descope-combo-box/ComboBox';
|
12
12
|
import CountryCodes from './CountryCodes';
|
13
13
|
|
14
|
-
const textVars =
|
15
|
-
const comboVars =
|
14
|
+
const textVars = TextFieldClass.cssVarList;
|
15
|
+
const comboVars = ComboBoxClass.cssVarList;
|
16
16
|
|
17
17
|
export const componentName = getComponentName('phone-field');
|
18
18
|
|
@@ -81,12 +81,12 @@ const PhoneFieldClass = compose(
|
|
81
81
|
fontSize: [
|
82
82
|
host, inputWrapper,
|
83
83
|
{
|
84
|
-
selector:
|
85
|
-
property:
|
84
|
+
selector: TextFieldClass.componentName,
|
85
|
+
property: TextFieldClass.cssVarList.fontSize
|
86
86
|
},
|
87
87
|
{
|
88
|
-
selector:
|
89
|
-
property:
|
88
|
+
selector: ComboBoxClass.componentName,
|
89
|
+
property: ComboBoxClass.cssVarList.fontSize
|
90
90
|
}
|
91
91
|
],
|
92
92
|
|
@@ -81,8 +81,8 @@ overrides = `
|
|
81
81
|
vaadin-text-field input:-webkit-autofill:hover,
|
82
82
|
vaadin-text-field input:-webkit-autofill:active,
|
83
83
|
vaadin-text-field input:-webkit-autofill:focus {
|
84
|
-
-webkit-text-fill-color: var(${
|
85
|
-
box-shadow: 0 0 0 var(${
|
84
|
+
-webkit-text-fill-color: var(${TextFieldClass.cssVarList.color});
|
85
|
+
box-shadow: 0 0 0 var(${TextFieldClass.cssVarList.height}) var(${TextFieldClass.cssVarList.backgroundColor}) inset;
|
86
86
|
}
|
87
87
|
|
88
88
|
vaadin-text-field > input {
|
@@ -92,7 +92,7 @@ overrides = `
|
|
92
92
|
|
93
93
|
vaadin-text-field[required]::part(required-indicator)::after {
|
94
94
|
content: "*";
|
95
|
-
color: var(${
|
95
|
+
color: var(${TextFieldClass.cssVarList.color});
|
96
96
|
}
|
97
97
|
vaadin-text-field::part(input-field)::after {
|
98
98
|
opacity: 0 !important;
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs, createHelperVars } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import ButtonClass, { componentName } from '../../components/descope-button/Button';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
|
-
const vars =
|
6
|
+
const vars = ButtonClass.cssVarList;
|
7
7
|
|
8
8
|
const mode = {
|
9
9
|
primary: globalRefs.colors.primary,
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import CheckboxClass from '../../components/boolean-fields/descope-checkbox/Checkbox';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
|
-
const vars =
|
6
|
+
const vars = CheckboxClass.cssVarList;
|
7
7
|
|
8
8
|
const checkbox = {
|
9
9
|
[vars.checkboxBackgroundColor]: globalRefs.colors.surface.main,
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import globals from '../globals';
|
2
|
-
import
|
2
|
+
import ComboBoxClass from '../../components/descope-combo-box/ComboBox';
|
3
3
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = ComboBoxClass.cssVarList;
|
8
8
|
|
9
9
|
export const comboBox = {
|
10
10
|
[vars.borderColor]: globalRefs.colors.surface.main,
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import globals from "../globals";
|
2
2
|
import { getThemeRefs, createHelperVars } from "../../helpers/themeHelpers";
|
3
|
-
import
|
3
|
+
import ContainerClass from "../../components/descope-container/Container";
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = ContainerClass.cssVarList
|
8
8
|
|
9
9
|
const verticalAlignment = {
|
10
10
|
start: { verticalAlignment: 'start' },
|
@@ -23,7 +23,7 @@ const [helperTheme, helperRefs, helperVars] =
|
|
23
23
|
verticalAlignment,
|
24
24
|
horizontalAlignment,
|
25
25
|
shadowColor: '#00000020' //if we want to support transparency vars, we should use different color format
|
26
|
-
},
|
26
|
+
}, ContainerClass.componentName)
|
27
27
|
|
28
28
|
const container = {
|
29
29
|
...helperTheme,
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import
|
1
|
+
import DividerClass, { componentName } from '../../components/descope-divider/Divider';
|
2
2
|
import { createHelperVars, getThemeRefs } from '../../helpers/themeHelpers';
|
3
3
|
import globals from '../globals';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = DividerClass.cssVarList;
|
8
8
|
|
9
9
|
const thickness = '2px'
|
10
10
|
const textPaddingSize = '10px'
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import
|
1
|
+
import EmailFieldClass from '../../components/descope-email-field/EmailField';
|
2
2
|
import { textField } from './textField';
|
3
3
|
|
4
4
|
const emailField = {
|
5
|
-
...textField(
|
5
|
+
...textField(EmailFieldClass.cssVarList)
|
6
6
|
};
|
7
7
|
|
8
8
|
export default emailField;
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import LinkClass from '../../components/descope-link/Link';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
|
-
const vars =
|
6
|
+
const vars = LinkClass.cssVarList;
|
7
7
|
|
8
8
|
const link = {
|
9
9
|
[vars.cursor]: 'pointer',
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import
|
1
|
+
import LoaderLinearClass from '../../../components/descope-loader-linear/LoaderLinear';
|
2
2
|
import { getThemeRefs } from '../../../helpers/themeHelpers';
|
3
3
|
import globals from '../../globals';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = LoaderLinearClass.cssVarList;
|
8
8
|
|
9
9
|
const loaderLinear = {
|
10
10
|
[vars.display]: 'inline-block',
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import
|
1
|
+
import LoaderRadialClass from '../../../components/descope-loader-radial/LoaderRadial';
|
2
2
|
import { getThemeRefs } from '../../../helpers/themeHelpers';
|
3
3
|
import globals from '../../globals';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = LoaderRadialClass.cssVarList;
|
8
8
|
|
9
9
|
const loaderRadial = {
|
10
10
|
[vars.display]: 'inline-block',
|
@@ -1,6 +1,6 @@
|
|
1
|
-
import
|
1
|
+
import LogoClass from "../../components/descope-logo/Logo";
|
2
2
|
|
3
|
-
const vars =
|
3
|
+
const vars = LogoClass.cssVarList
|
4
4
|
|
5
5
|
const logo = {
|
6
6
|
[vars.fallbackUrl]: 'url(https://imgs.descope.com/components/no-logo-placeholder.svg)'
|
@@ -1,6 +1,6 @@
|
|
1
|
-
import
|
1
|
+
import NewPasswordClass from '../../components/descope-new-password/NewPassword';
|
2
2
|
|
3
|
-
const vars =
|
3
|
+
const vars = NewPasswordClass.cssVarList;
|
4
4
|
|
5
5
|
const newPassword = {
|
6
6
|
[vars.inputsGap]: '1em',
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import
|
1
|
+
import NumberFieldClass from '../../components/descope-number-field/NumberField';
|
2
2
|
import { textField } from './textField';
|
3
3
|
|
4
4
|
const numberField = {
|
5
|
-
...textField(
|
5
|
+
...textField(NumberFieldClass.cssVarList)
|
6
6
|
};
|
7
7
|
|
8
8
|
export default numberField;
|
@@ -1,8 +1,8 @@
|
|
1
|
-
import
|
1
|
+
import PasscodeClass from '../../components/descope-passcode/Passcode';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
3
|
import globals from '../globals';
|
4
4
|
|
5
|
-
const vars =
|
5
|
+
const vars = PasscodeClass.cssVarList
|
6
6
|
const globalRefs = getThemeRefs(globals);
|
7
7
|
|
8
8
|
const passcode = {
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import
|
1
|
+
import PasswordFieldClass from '../../components/descope-password-field/PasswordField';
|
2
2
|
import globals from '../globals';
|
3
3
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = PasswordFieldClass.cssVarList;
|
8
8
|
|
9
9
|
const passwordField = {
|
10
10
|
[vars.wrapperBorderStyle]: 'solid',
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import globals from '../globals';
|
2
|
-
import
|
2
|
+
import PhoneFieldClass from '../../components/descope-phone-field/PhoneField';
|
3
3
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
|
-
const vars =
|
6
|
+
const vars = PhoneFieldClass.cssVarList;
|
7
7
|
|
8
8
|
const phoneField = {
|
9
9
|
[vars.wrapperBorderStyle]: 'solid',
|
@@ -1,13 +1,13 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import SwitchToggleClass from '../../components/boolean-fields/descope-switch-toggle/SwitchToggle';
|
4
4
|
|
5
5
|
const knobMargin = '2px';
|
6
6
|
const checkboxHeight = '1.25em';
|
7
7
|
const trackBorderWidth = '2px';
|
8
8
|
|
9
9
|
const globalRefs = getThemeRefs(globals);
|
10
|
-
const vars =
|
10
|
+
const vars = SwitchToggleClass.cssVarList;
|
11
11
|
|
12
12
|
const switchToggle = {
|
13
13
|
size: {
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import TextClass from '../../components/descope-text/Text';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = TextClass.cssVarList;
|
8
8
|
|
9
9
|
const text = {
|
10
10
|
[vars.lineHeight]: '1em',
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import TextAreaClass from '../../components/descope-text-area/TextArea';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
|
-
const vars =
|
6
|
+
const vars = TextAreaClass.cssVarList;
|
7
7
|
|
8
8
|
const textArea = {
|
9
9
|
[vars.labelColor]: globalRefs.colors.surface.contrast,
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import globals from '../globals';
|
2
2
|
import { getThemeRefs } from '../../helpers/themeHelpers';
|
3
|
-
import
|
3
|
+
import TextFieldClass from '../../components/descope-text-field/TextField';
|
4
4
|
|
5
5
|
const globalRefs = getThemeRefs(globals);
|
6
6
|
|
7
|
-
const vars =
|
7
|
+
const vars = TextFieldClass.cssVarList;
|
8
8
|
|
9
9
|
export const textField = (vars) => ({
|
10
10
|
[vars.padding]: '0 1em',
|