@descope/web-components-ui 1.0.100 → 1.0.102
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.esm.js +124 -63
- package/dist/index.esm.js.map +1 -1
- package/dist/umd/0.js +1 -1
- package/dist/umd/890.js +1 -1
- package/dist/umd/descope-combo-box-index-js.js +1 -1
- package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
- package/dist/umd/descope-new-password-index-js.js +1 -1
- package/dist/umd/descope-passcode-index-js.js +1 -1
- package/dist/umd/descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
- package/dist/umd/descope-phone-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/descope-combo-box/ComboBox.js +17 -2
- package/src/components/descope-new-password/NewPassword.js +2 -1
- package/src/components/descope-new-password/index.js +2 -0
- package/src/components/descope-passcode/index.js +2 -0
- package/src/components/descope-password-field/PasswordField.js +3 -0
- package/src/components/descope-phone-field/PhoneField.js +20 -1
- package/src/components/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +1 -0
- package/src/components/descope-text-field/TextField.js +1 -1
- package/src/index.js +20 -20
- package/src/mixins/createStyleMixin/index.js +4 -1
- package/src/mixins/normalizeBooleanAttributesMixin.js +29 -4
- package/src/theme/components/comboBox.js +6 -0
- package/src/theme/components/passwordField.js +1 -1
- package/src/theme/components/phoneField.js +12 -6
- package/src/theme/components/text.js +0 -2
- package/src/theme/components/textArea.js +5 -1
|
@@ -10,7 +10,7 @@ const passwordField = {
|
|
|
10
10
|
[vars.wrapperBorderStyle]: 'solid',
|
|
11
11
|
[vars.wrapperBorderWidth]: '1px',
|
|
12
12
|
[vars.wrapperBorderColor]: 'transparent',
|
|
13
|
-
[vars.wrapperBorderRadius]: globalRefs.radius.
|
|
13
|
+
[vars.wrapperBorderRadius]: globalRefs.radius.xs,
|
|
14
14
|
[vars.backgroundColor]: globalRefs.colors.surface.light,
|
|
15
15
|
|
|
16
16
|
[vars.outlineWidth]: '2px',
|
|
@@ -21,31 +21,26 @@ const phoneField = {
|
|
|
21
21
|
xs: {
|
|
22
22
|
[vars.inputHeight]: '14px',
|
|
23
23
|
[vars.fontSize]: '8px',
|
|
24
|
-
[vars.padding]: `0 ${globalRefs.spacing.xs}`,
|
|
25
24
|
[vars.countryCodeDropdownWidth]: '200px',
|
|
26
25
|
},
|
|
27
26
|
sm: {
|
|
28
27
|
[vars.inputHeight]: '20px',
|
|
29
28
|
[vars.fontSize]: '10px',
|
|
30
|
-
[vars.padding]: `0 ${globalRefs.spacing.sm}`,
|
|
31
29
|
[vars.countryCodeDropdownWidth]: '240px',
|
|
32
30
|
},
|
|
33
31
|
md: {
|
|
34
32
|
[vars.inputHeight]: '30px',
|
|
35
33
|
[vars.fontSize]: '14px',
|
|
36
|
-
[vars.padding]: `0 ${globalRefs.spacing.md}`,
|
|
37
34
|
[vars.countryCodeDropdownWidth]: '250px',
|
|
38
35
|
},
|
|
39
36
|
lg: {
|
|
40
37
|
[vars.inputHeight]: '40px',
|
|
41
38
|
[vars.fontSize]: '46px',
|
|
42
|
-
[vars.padding]: `0 ${globalRefs.spacing.lg}`,
|
|
43
39
|
[vars.countryCodeDropdownWidth]: '250px',
|
|
44
40
|
},
|
|
45
41
|
xl: {
|
|
46
42
|
[vars.inputHeight]: '50px',
|
|
47
43
|
[vars.fontSize]: '25px',
|
|
48
|
-
[vars.padding]: `0 ${globalRefs.spacing.xl}`,
|
|
49
44
|
[vars.countryCodeDropdownWidth]: '400px',
|
|
50
45
|
}
|
|
51
46
|
},
|
|
@@ -60,7 +55,16 @@ const phoneField = {
|
|
|
60
55
|
[vars.wrapperBorderColor]: globalRefs.colors.surface.main
|
|
61
56
|
},
|
|
62
57
|
|
|
58
|
+
[vars.outlineStyle]: 'solid',
|
|
59
|
+
[vars.outlineWidth]: '0.1em',
|
|
60
|
+
[vars.outlineColor]: 'transparent',
|
|
61
|
+
|
|
62
|
+
_focused: {
|
|
63
|
+
[vars.outlineColor]: globalRefs.colors.surface.main
|
|
64
|
+
},
|
|
65
|
+
|
|
63
66
|
_invalid: {
|
|
67
|
+
[vars.outlineColor]: globalRefs.colors.error.light,
|
|
64
68
|
[vars.color]: globalRefs.colors.error.main,
|
|
65
69
|
[vars.placeholderColor]: globalRefs.colors.error.light,
|
|
66
70
|
[vars.wrapperBorderColor]: globalRefs.colors.error.main
|
|
@@ -71,4 +75,6 @@ const phoneField = {
|
|
|
71
75
|
// }
|
|
72
76
|
};
|
|
73
77
|
|
|
74
|
-
export default phoneField;
|
|
78
|
+
export default phoneField;
|
|
79
|
+
|
|
80
|
+
|
|
@@ -8,7 +8,6 @@ const vars = Text.cssVarList;
|
|
|
8
8
|
|
|
9
9
|
const text = {
|
|
10
10
|
[vars.lineHeight]: '1em',
|
|
11
|
-
[vars.display]: 'inline-block',
|
|
12
11
|
[vars.textAlign]: 'left',
|
|
13
12
|
[vars.color]: globalRefs.colors.surface.dark,
|
|
14
13
|
variant: {
|
|
@@ -69,7 +68,6 @@ const text = {
|
|
|
69
68
|
},
|
|
70
69
|
_fullWidth: {
|
|
71
70
|
[vars.width]: '100%',
|
|
72
|
-
[vars.display]: 'block'
|
|
73
71
|
},
|
|
74
72
|
_italic: {
|
|
75
73
|
[vars.fontStyle]: 'italic'
|
|
@@ -16,7 +16,7 @@ const textArea = {
|
|
|
16
16
|
[vars.borderRadius]: globalRefs.radius.sm,
|
|
17
17
|
[vars.borderWidth]: '1px',
|
|
18
18
|
[vars.borderStyle]: 'solid',
|
|
19
|
-
[vars.borderColor]:
|
|
19
|
+
[vars.borderColor]: 'transparent',
|
|
20
20
|
[vars.outlineWidth]: '2px',
|
|
21
21
|
[vars.outlineStyle]: 'solid',
|
|
22
22
|
[vars.outlineColor]: 'transparent',
|
|
@@ -34,6 +34,10 @@ const textArea = {
|
|
|
34
34
|
[vars.cursor]: 'not-allowed'
|
|
35
35
|
},
|
|
36
36
|
|
|
37
|
+
_bordered: {
|
|
38
|
+
[vars.borderColor]: globalRefs.colors.surface.main,
|
|
39
|
+
},
|
|
40
|
+
|
|
37
41
|
_invalid: {
|
|
38
42
|
[vars.labelColor]: globalRefs.colors.error.main,
|
|
39
43
|
[vars.outlineColor]: globalRefs.colors.error.main
|