@descope/web-components-ui 1.0.100 → 1.0.102

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 (28) hide show
  1. package/dist/index.esm.js +124 -63
  2. package/dist/index.esm.js.map +1 -1
  3. package/dist/umd/0.js +1 -1
  4. package/dist/umd/890.js +1 -1
  5. package/dist/umd/descope-combo-box-index-js.js +1 -1
  6. package/dist/umd/descope-new-password-descope-new-password-internal-index-js.js +1 -1
  7. package/dist/umd/descope-new-password-index-js.js +1 -1
  8. package/dist/umd/descope-passcode-index-js.js +1 -1
  9. package/dist/umd/descope-phone-field-descope-phone-field-internal-index-js.js +1 -1
  10. package/dist/umd/descope-phone-field-index-js.js +1 -1
  11. package/dist/umd/descope-text-field-index-js.js +1 -1
  12. package/package.json +1 -1
  13. package/src/components/descope-combo-box/ComboBox.js +17 -2
  14. package/src/components/descope-new-password/NewPassword.js +2 -1
  15. package/src/components/descope-new-password/index.js +2 -0
  16. package/src/components/descope-passcode/index.js +2 -0
  17. package/src/components/descope-password-field/PasswordField.js +3 -0
  18. package/src/components/descope-phone-field/PhoneField.js +20 -1
  19. package/src/components/descope-phone-field/descope-phone-field-internal/PhoneFieldInternal.js +1 -0
  20. package/src/components/descope-text-field/TextField.js +1 -1
  21. package/src/index.js +20 -20
  22. package/src/mixins/createStyleMixin/index.js +4 -1
  23. package/src/mixins/normalizeBooleanAttributesMixin.js +29 -4
  24. package/src/theme/components/comboBox.js +6 -0
  25. package/src/theme/components/passwordField.js +1 -1
  26. package/src/theme/components/phoneField.js +12 -6
  27. package/src/theme/components/text.js +0 -2
  28. package/src/theme/components/textArea.js +5 -1
package/src/theme/components/passwordField.js CHANGED
@@ -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.sm,
13
+ [vars.wrapperBorderRadius]: globalRefs.radius.xs,
14
14
  [vars.backgroundColor]: globalRefs.colors.surface.light,
15
15
 
16
16
  [vars.outlineWidth]: '2px',
package/src/theme/components/phoneField.js CHANGED
@@ -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
+
package/src/theme/components/text.js CHANGED
@@ -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'
package/src/theme/components/textArea.js CHANGED
@@ -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]: globalRefs.colors.surface.main,
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