@ptsecurity/mosaic 13.5.0 → 13.6.0

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 (70) hide show
  1. package/_theming.scss +119 -82
  2. package/_visual.scss +45 -41
  3. package/core/selection/pseudo-checkbox/pseudo-checkbox.d.ts +11 -2
  4. package/design-tokens/legacy-2017/tokens/components/alert.json5 +10 -10
  5. package/design-tokens/legacy-2017/tokens/components/button.json5 +8 -8
  6. package/design-tokens/legacy-2017/tokens/components/checkbox.json5 +14 -14
  7. package/design-tokens/legacy-2017/tokens/components/divider.json5 +6 -0
  8. package/design-tokens/legacy-2017/tokens/components/form-field.json5 +6 -6
  9. package/design-tokens/legacy-2017/tokens/components/popup.json5 +0 -2
  10. package/design-tokens/legacy-2017/tokens/components/sidepanel.json5 +12 -0
  11. package/design-tokens/legacy-2017/tokens/components/tags.json5 +16 -16
  12. package/design-tokens/legacy-2017/tokens.d.ts +56 -52
  13. package/design-tokens/pt-2022/tokens/components/alert.json5 +10 -10
  14. package/design-tokens/pt-2022/tokens/components/button.json5 +8 -8
  15. package/design-tokens/pt-2022/tokens/components/checkbox.json5 +18 -18
  16. package/design-tokens/pt-2022/tokens/components/divider.json5 +6 -0
  17. package/design-tokens/pt-2022/tokens/components/form-field.json5 +6 -6
  18. package/design-tokens/pt-2022/tokens/components/popup.json5 +0 -2
  19. package/design-tokens/pt-2022/tokens/components/sidepanel.json5 +12 -0
  20. package/design-tokens/pt-2022/tokens/components/tags.json5 +12 -12
  21. package/design-tokens/pt-2022/tokens.d.ts +45 -41
  22. package/esm2020/core/option/option.mjs +1 -1
  23. package/esm2020/core/selection/pseudo-checkbox/pseudo-checkbox.mjs +20 -8
  24. package/esm2020/design-tokens/legacy-2017/tokens.mjs +57 -53
  25. package/esm2020/design-tokens/pt-2022/tokens.mjs +46 -42
  26. package/esm2020/form-field/password-hint.mjs +6 -1
  27. package/esm2020/input/input-password.mjs +12 -8
  28. package/esm2020/list/list-selection.component.mjs +1 -1
  29. package/esm2020/select/select.component.mjs +3 -3
  30. package/esm2020/tree/control/flat-tree-control.mjs +5 -2
  31. package/esm2020/tree/tree-option.component.mjs +3 -3
  32. package/esm2020/tree-select/tree-select.component.mjs +23 -18
  33. package/fesm2015/ptsecurity-mosaic-core.mjs +19 -8
  34. package/fesm2015/ptsecurity-mosaic-core.mjs.map +1 -1
  35. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs +126 -114
  36. package/fesm2015/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  37. package/fesm2015/ptsecurity-mosaic-form-field.mjs +5 -0
  38. package/fesm2015/ptsecurity-mosaic-form-field.mjs.map +1 -1
  39. package/fesm2015/ptsecurity-mosaic-input.mjs +11 -7
  40. package/fesm2015/ptsecurity-mosaic-input.mjs.map +1 -1
  41. package/fesm2015/ptsecurity-mosaic-list.mjs +1 -1
  42. package/fesm2015/ptsecurity-mosaic-list.mjs.map +1 -1
  43. package/fesm2015/ptsecurity-mosaic-select.mjs +2 -2
  44. package/fesm2015/ptsecurity-mosaic-select.mjs.map +1 -1
  45. package/fesm2015/ptsecurity-mosaic-tree-select.mjs +22 -17
  46. package/fesm2015/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  47. package/fesm2015/ptsecurity-mosaic-tree.mjs +6 -3
  48. package/fesm2015/ptsecurity-mosaic-tree.mjs.map +1 -1
  49. package/fesm2020/ptsecurity-mosaic-core.mjs +19 -8
  50. package/fesm2020/ptsecurity-mosaic-core.mjs.map +1 -1
  51. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs +126 -114
  52. package/fesm2020/ptsecurity-mosaic-design-tokens.mjs.map +1 -1
  53. package/fesm2020/ptsecurity-mosaic-form-field.mjs +5 -0
  54. package/fesm2020/ptsecurity-mosaic-form-field.mjs.map +1 -1
  55. package/fesm2020/ptsecurity-mosaic-input.mjs +11 -7
  56. package/fesm2020/ptsecurity-mosaic-input.mjs.map +1 -1
  57. package/fesm2020/ptsecurity-mosaic-list.mjs +1 -1
  58. package/fesm2020/ptsecurity-mosaic-list.mjs.map +1 -1
  59. package/fesm2020/ptsecurity-mosaic-select.mjs +2 -2
  60. package/fesm2020/ptsecurity-mosaic-select.mjs.map +1 -1
  61. package/fesm2020/ptsecurity-mosaic-tree-select.mjs +22 -17
  62. package/fesm2020/ptsecurity-mosaic-tree-select.mjs.map +1 -1
  63. package/fesm2020/ptsecurity-mosaic-tree.mjs +6 -3
  64. package/fesm2020/ptsecurity-mosaic-tree.mjs.map +1 -1
  65. package/input/input-password.d.ts +7 -5
  66. package/package.json +4 -4
  67. package/prebuilt-themes/dark-theme.css +1 -1
  68. package/prebuilt-themes/default-theme.css +1 -1
  69. package/tree/control/flat-tree-control.d.ts +5 -1
  70. package/tree-select/tree-select.component.d.ts +7 -2
@@ -1,5 +1,13 @@
1
+ import { ElementRef } from '@angular/core';
2
+ import { CanColor, CanColorCtor, CanDisable, CanDisableCtor } from '../../common-behaviors';
1
3
  import * as i0 from "@angular/core";
2
4
  export declare type McPseudoCheckboxState = 'unchecked' | 'checked' | 'indeterminate';
5
+ /** @docs-private */
6
+ export declare class McPseudoCheckboxBase {
7
+ _elementRef: ElementRef;
8
+ constructor(_elementRef: ElementRef);
9
+ }
10
+ export declare const McPseudoCheckboxMixinBase: CanColorCtor & CanDisableCtor & typeof McPseudoCheckboxBase;
3
11
  /**
4
12
  * Component that shows a simplified checkbox without including any kind of "real" checkbox.
5
13
  * Meant to be used when the checkbox is purely decorative and a large number of them will be
@@ -13,9 +21,10 @@ export declare type McPseudoCheckboxState = 'unchecked' | 'checked' | 'indetermi
13
21
  * of more complex components that appropriately handle selected / checked state.
14
22
  * @docs-private
15
23
  */
16
- export declare class McPseudoCheckbox {
24
+ export declare class McPseudoCheckbox extends McPseudoCheckboxMixinBase implements CanColor, CanDisable {
17
25
  state: McPseudoCheckboxState;
18
26
  disabled: boolean;
27
+ constructor(elementRef: ElementRef);
19
28
  static ɵfac: i0.ɵɵFactoryDeclaration<McPseudoCheckbox, never>;
20
- static ɵcmp: i0.ɵɵComponentDeclaration<McPseudoCheckbox, "mc-pseudo-checkbox", never, { "state": "state"; "disabled": "disabled"; }, {}, never, never>;
29
+ static ɵcmp: i0.ɵɵComponentDeclaration<McPseudoCheckbox, "mc-pseudo-checkbox", never, { "color": "color"; "state": "state"; "disabled": "disabled"; }, {}, never, never>;
21
30
  }
@@ -4,54 +4,54 @@
4
4
  error: {
5
5
  background: { value: '{light-color-scheme.error.palette.value.60}' },
6
6
  border: { value: '{light-color-scheme.error.default}' },
7
- icon: { value: '{light-color-scheme.error.default}' }
7
+ icon: { value: '{icon.light-color-scheme.error.default}' }
8
8
  },
9
9
  warning: {
10
10
  background: { value: '{light-color-scheme.warning.palette.value.60}' },
11
11
  border: { value: '{light-color-scheme.warning.default}' },
12
- icon: { value: '{light-color-scheme.warning.palette.value.400}' }
12
+ icon: { value: '{icon.light-color-scheme.warning.default}' }
13
13
  },
14
14
  success: {
15
15
  background: { value: '{light-color-scheme.success.palette.value.60}' },
16
16
  border: { value: '{light-color-scheme.success.default}' },
17
- icon: { value: '{light-color-scheme.success.palette.value.400}' }
17
+ icon: { value: '{icon.light-color-scheme.success.default}' }
18
18
  },
19
19
  info: {
20
20
  background: { value: '{light-color-scheme.info.palette.value.60}' },
21
21
  border: { value: '{light-color-scheme.info.default}' },
22
- icon: { value: '{light-color-scheme.info.palette.value.400}' }
22
+ icon: { value: '{icon.light-color-scheme.info.default}' }
23
23
  },
24
24
  default: {
25
25
  background: { value: '{light-color-scheme.second.palette.value.60}' },
26
26
  border: { value: '{light-color-scheme.second.default}' },
27
- icon: { value: '{light-color-scheme.second.palette.value.200}' }
27
+ icon: { value: '{icon.light-color-scheme.secondary.default}' }
28
28
  }
29
29
  },
30
30
  'dark-color-scheme': {
31
31
  error: {
32
32
  background: { value: '{dark-color-scheme.error.palette.value.700}' },
33
33
  border: { value: '{dark-color-scheme.error.palette.value.700}' },
34
- icon: { value: '{dark-color-scheme.error.default}' }
34
+ icon: { value: '{icon.dark-color-scheme.error.default}' }
35
35
  },
36
36
  warning: {
37
37
  background: { value: '{dark-color-scheme.warning.palette.value.700}' },
38
38
  border: { value: '{dark-color-scheme.warning.palette.value.700}' },
39
- icon: { value: '{dark-color-scheme.warning.default}' }
39
+ icon: { value: '{icon.dark-color-scheme.warning.default}' }
40
40
  },
41
41
  success: {
42
42
  background: { value: '{dark-color-scheme.success.palette.value.700}' },
43
43
  border: { value: '{dark-color-scheme.success.palette.value.700}' },
44
- icon: { value: '{dark-color-scheme.success.default}' }
44
+ icon: { value: '{icon.dark-color-scheme.success.default}' }
45
45
  },
46
46
  info: {
47
47
  background: { value: '{dark-color-scheme.info.palette.value.700}' },
48
48
  border: { value: '{dark-color-scheme.info.palette.value.700}' },
49
- icon: { value: '{dark-color-scheme.info.default}' }
49
+ icon: { value: '{icon.dark-color-scheme.info.default}' }
50
50
  },
51
51
  default: {
52
52
  background: { value: '{dark-color-scheme.second.palette.value.700}' },
53
53
  border: { value: '{dark-color-scheme.second.palette.value.700}' },
54
- icon: { value: '{dark-color-scheme.second.default}' }
54
+ icon: { value: '{icon.dark-color-scheme.secondary.default}' }
55
55
  }
56
56
  },
57
57
  size: {
@@ -19,16 +19,16 @@
19
19
  },
20
20
  primary_transparent: {
21
21
  color: { value: '{light-color-scheme.primary.palette.value.500}' },
22
- icon: { value: '{light-color-scheme.primary.palette.value.500}' },
22
+ icon: { value: '{icon.light-color-scheme.primary.default}' },
23
23
 
24
24
  states: {
25
25
  hover: {
26
26
  color: { value: '{light-color-scheme.primary.palette.value.600}' },
27
- icon: { value: '{light-color-scheme.primary.palette.value.600}' }
27
+ icon: { value: '{icon.light-color-scheme.primary.states.hover}' }
28
28
  },
29
29
  active: {
30
30
  color: { value: '{light-color-scheme.primary.palette.value.700}' },
31
- icon: { value: '{light-color-scheme.primary.palette.value.700}' }
31
+ icon: { value: '{icon.light-color-scheme.primary.states.active}' }
32
32
  }
33
33
  }
34
34
  },
@@ -36,7 +36,7 @@
36
36
  border: { value: '{light-color-scheme.foreground.border}' },
37
37
  background: { value: '{light-color-scheme.background.background-disabled}' },
38
38
  color: { value: '{light-color-scheme.foreground.text}' },
39
- icon: { value: '{light-color-scheme.foreground.text-less-contrast}' },
39
+ icon: { value: '{icon.light-color-scheme.secondary.default}' },
40
40
 
41
41
  states: {
42
42
  active: {
@@ -79,16 +79,16 @@
79
79
 
80
80
  primary_transparent: {
81
81
  color: { value: '{dark-color-scheme.primary.palette.value.500}' },
82
- icon: { value: '{dark-color-scheme.primary.palette.value.500}' },
82
+ icon: { value: '{icon.dark-color-scheme.primary.default}' },
83
83
 
84
84
  states: {
85
85
  hover: {
86
86
  color: { value: '{dark-color-scheme.primary.palette.value.600}' },
87
- icon: { value: '{dark-color-scheme.primary.palette.value.600}' }
87
+ icon: { value: '{icon.dark-color-scheme.primary.states.hover}' }
88
88
  },
89
89
  active: {
90
90
  color: { value: '{dark-color-scheme.primary.palette.value.700}' },
91
- icon: { value: '{dark-color-scheme.primary.palette.value.700}' }
91
+ icon: { value: '{icon.dark-color-scheme.primary.states.active}' }
92
92
  }
93
93
  }
94
94
  },
@@ -96,7 +96,7 @@
96
96
  border: { value: '{dark-color-scheme.foreground.border}' },
97
97
  background: { value: '{dark-color-scheme.background.background-disabled}' },
98
98
  color: { value: '{dark-color-scheme.foreground.text}' },
99
- icon: { value: '{dark-color-scheme.foreground.text-less-contrast}' },
99
+ icon: { value: '{icon.dark-color-scheme.secondary.default}' },
100
100
 
101
101
  states: {
102
102
  active: {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  checkbox: {
3
3
  'light-color-scheme': {
4
- primary: {
4
+ default: {
5
5
  border: { value: '{light-color-scheme.foreground.border}' },
6
6
 
7
7
  states: {
@@ -10,13 +10,13 @@
10
10
  background: { value: '{light-color-scheme.primary.palette.value.500}' },
11
11
  },
12
12
  focused: {
13
- border: { value: '{light-color-scheme.primary.palette.value.500}' },
14
- shadow: { value: '0 0 0 1px {light-color-scheme.primary.palette.value.500}' },
13
+ border: { value: '{light-color-scheme.states.focused-color}' },
14
+ shadow: { value: '0 0 0 1px {light-color-scheme.states.focused-color}' },
15
15
  },
16
16
  'checked-focused': {
17
- border: { value: '{light-color-scheme.primary.palette.value.500}' },
17
+ border: { value: '{light-color-scheme.states.focused-color}' },
18
18
  background: { value: '{light-color-scheme.primary.palette.value.500}' },
19
- shadow: { value: '0 0 0 1px {light-color-scheme.primary.palette.value.500}' },
19
+ shadow: { value: '0 0 0 1px {light-color-scheme.states.focused-color}' },
20
20
  outline: { value: '1px solid {light-color-scheme.background.background}' },
21
21
  }
22
22
  }
@@ -30,20 +30,20 @@
30
30
  background: { value: '{light-color-scheme.error.palette.value.500}'},
31
31
  },
32
32
  focused: {
33
- border: { value: '{light-color-scheme.error.palette.value.500}' },
34
- shadow: { value: '0 0 0 1px {light-color-scheme.error.palette.value.500}' },
33
+ border: { value: '{light-color-scheme.error.palette.value.400}' },
34
+ shadow: { value: '0 0 0 1px {light-color-scheme.error.palette.value.400}' },
35
35
  },
36
36
  'checked-focused': {
37
- border: { value: '{light-color-scheme.error.palette.value.500}' },
37
+ border: { value: '{light-color-scheme.error.palette.value.400}' },
38
38
  background: { value: '{light-color-scheme.error.palette.value.500}'},
39
- shadow: { value: '0 0 0 1px {light-color-scheme.error.palette.value.500}' },
39
+ shadow: { value: '0 0 0 1px {light-color-scheme.error.palette.value.400}' },
40
40
  outline: { value: '1px solid {light-color-scheme.background.background}' },
41
41
  }
42
42
  }
43
43
  },
44
44
  },
45
45
  'dark-color-scheme': {
46
- primary: {
46
+ default: {
47
47
  border: { value: '{dark-color-scheme.foreground.border}' },
48
48
 
49
49
  states: {
@@ -52,13 +52,13 @@
52
52
  background: { value: '{dark-color-scheme.primary.palette.value.600}' }
53
53
  },
54
54
  focused: {
55
- border: { value: '{dark-color-scheme.primary.palette.value.400}' },
56
- shadow: { value: '0 0 0 1px {dark-color-scheme.primary.palette.value.400}' }
55
+ border: { value: '{dark-color-scheme.states.focused-color}' },
56
+ shadow: { value: '0 0 0 1px {dark-color-scheme.states.focused-color}' }
57
57
  },
58
58
  'checked-focused': {
59
- border: { value: '{dark-color-scheme.primary.palette.value.400}' },
59
+ border: { value: '{dark-color-scheme.states.focused-color}' },
60
60
  background: { value: '{dark-color-scheme.primary.palette.value.600}' },
61
- shadow: { value: '0 0 0 1px {dark-color-scheme.primary.palette.value.400}' },
61
+ shadow: { value: '0 0 0 1px {dark-color-scheme.states.focused-color}' },
62
62
  outline: { value: '1px solid {dark-color-scheme.background.background}' },
63
63
  }
64
64
  }
@@ -1,5 +1,11 @@
1
1
  {
2
2
  divider: {
3
+ 'light-color-scheme': {
4
+ color: { value: '{light-color-scheme.foreground.divider}' }
5
+ },
6
+ 'dark-color-scheme': {
7
+ color: { value: '{dark-color-scheme.foreground.divider}' }
8
+ },
3
9
  size: {
4
10
  width: { value: '1px' },
5
11
  'inset-margin': { value: '80px' }
@@ -53,31 +53,31 @@
53
53
  'form-field-password-hint': {
54
54
  'light-color-scheme': {
55
55
  'text-color': { value: '{light-color-scheme.foreground.text}' },
56
- 'icon-color': { value: '{light-color-scheme.foreground.text}' },
56
+ 'icon-color': { value: '{icon.light-color-scheme.secondary.default}' },
57
57
 
58
58
  states: {
59
59
  invalid: {
60
- 'icon-color': { value: '{light-color-scheme.foreground.text-error}' },
60
+ 'icon-color': { value: '{icon.light-color-scheme.error.default}' },
61
61
  'text-color': { value: '{light-color-scheme.foreground.text}' }
62
62
  },
63
63
  valid: {
64
64
  'text-color': { value: '{light-color-scheme.foreground.text-success}' },
65
- 'icon-color': { value: '{light-color-scheme.foreground.text-success}' }
65
+ 'icon-color': { value: '{icon.light-color-scheme.success.default}' }
66
66
  }
67
67
  }
68
68
  },
69
69
  'dark-color-scheme': {
70
70
  'text-color': { value: '{dark-color-scheme.foreground.text}' },
71
- 'icon-color': { value: '{dark-color-scheme.foreground.text}' },
71
+ 'icon-color': { value: '{icon.dark-color-scheme.secondary.default}' },
72
72
 
73
73
  states: {
74
74
  invalid: {
75
- 'icon-color': { value: '{dark-color-scheme.foreground.text-error}' },
75
+ 'icon-color': { value: '{icon.dark-color-scheme.error.default}' },
76
76
  'text-color': { value: '{dark-color-scheme.foreground.text}' }
77
77
  },
78
78
  valid: {
79
79
  'text-color': { value: '{dark-color-scheme.foreground.text-success}' },
80
- 'icon-color': { value: '{dark-color-scheme.foreground.text-success}' }
80
+ 'icon-color': { value: '{icon.dark-color-scheme.success.default}' }
81
81
  }
82
82
  }
83
83
  },
@@ -3,14 +3,12 @@
3
3
  'light-color-scheme': {
4
4
  shadow: { value: '0 3px 3px 0 {light-color-scheme.second.palette.value.A200}' },
5
5
  border: { value: '{light-color-scheme.second.palette.value.300}' },
6
- divider: { value: '{light-color-scheme.second.palette.value.200}' },
7
6
  background: { value: 'white' },
8
7
  'footer-background': { value: '{light-color-scheme.second.palette.value.60}' }
9
8
  },
10
9
  'dark-color-scheme': {
11
10
  shadow: { value: '0 3px 3px 0 {dark-color-scheme.second.palette.value.A200}' },
12
11
  border: { value: '{dark-color-scheme.second.palette.value.400}' },
13
- divider: { value: '{dark-color-scheme.foreground.divider}' },
14
12
  background: { value: '{dark-color-scheme.second.palette.value.700}' },
15
13
  'footer-background': { value: 'transparent' }
16
14
  }
@@ -11,6 +11,12 @@
11
11
  }
12
12
  },
13
13
  'sidepanel-header': {
14
+ 'light-color-scheme': {
15
+ border: { value: '{light-color-scheme.foreground.divider}' }
16
+ },
17
+ 'dark-color-scheme': {
18
+ border: { value: '{dark-color-scheme.foreground.divider}' }
19
+ },
14
20
  size: {
15
21
  height: { value: '{size.6xl}' },
16
22
  padding: { value: '0 {size.l}' },
@@ -21,6 +27,12 @@
21
27
  }
22
28
  },
23
29
  'sidepanel-footer': {
30
+ 'light-color-scheme': {
31
+ border: { value: '{light-color-scheme.foreground.divider}' }
32
+ },
33
+ 'dark-color-scheme': {
34
+ border: { value: '{dark-color-scheme.foreground.divider}' }
35
+ },
24
36
  size: {
25
37
  height: { value: '{size.7xl}' },
26
38
  padding: { value: '0 {size.l}' }
@@ -5,12 +5,12 @@
5
5
  background: { value: '{light-color-scheme.primary.palette.value.100}' },
6
6
  border: { value: '{light-color-scheme.primary.palette.value.100}' },
7
7
  text: { value: '{light-color-scheme.primary.default}' },
8
- icon: { value: 'mix({light-color-scheme.primary.palette.value.400}, {light-color-scheme.background.overlay-hover})' },
8
+ icon: { value: '{icon.light-color-scheme.primary.default}' },
9
9
  states: {
10
10
  hover: {
11
- icon: { value: '{light-color-scheme.primary.palette.value.600}' }
11
+ icon: { value: '{icon.light-color-scheme.primary.states.hover}' }
12
12
  },
13
- focused:{ value: '{light-color-scheme.primary.palette.value.500}' },
13
+ focused:{ value: '{light-color-scheme.states.focused-color}' },
14
14
  disabled: {
15
15
  text: { value: 'mix({light-color-scheme.primary.palette.value.500}, transparent, 50%)' },
16
16
  background: { value: 'mix({light-color-scheme.primary.palette.value.500}, transparent, 10%)' },
@@ -22,12 +22,12 @@
22
22
  background: { value: '{light-color-scheme.second.palette.value.100}' },
23
23
  border: { value: '{light-color-scheme.second.palette.value.100}' },
24
24
  text: { value: '{light-color-scheme.foreground.text}' },
25
- icon: { value: 'mix({light-color-scheme.second.palette.value.400}, {light-color-scheme.background.overlay-hover})' },
25
+ icon: { value: '{icon.light-color-scheme.secondary.default}' },
26
26
  states: {
27
27
  hover: {
28
- icon: { value: '{light-color-scheme.second.palette.value.400}' }
28
+ icon: { value: '{icon.light-color-scheme.secondary.states.hover}' }
29
29
  },
30
- focused: { value: '{light-color-scheme.primary.palette.value.500}' },
30
+ focused: { value: '{light-color-scheme.states.focused-color}' },
31
31
  disabled: {
32
32
  text: { value: 'mix({light-color-scheme.second.palette.value.300}, transparent, 50%)' },
33
33
  background: { value: 'mix({light-color-scheme.second.palette.value.300}, transparent, 10%)' },
@@ -39,10 +39,10 @@
39
39
  background: { value: '{light-color-scheme.error.palette.value.100}' },
40
40
  border: { value: '{light-color-scheme.error.palette.value.100}' },
41
41
  text: { value: '{light-color-scheme.error.default}' },
42
- icon: { value: 'mix({light-color-scheme.error.palette.value.400}, {light-color-scheme.background.overlay-hover})' },
42
+ icon: { value: '{icon.light-color-scheme.error.default}' },
43
43
  states: {
44
44
  hover: {
45
- icon: { value: '{light-color-scheme.error.palette.value.500}' }
45
+ icon: { value: '{icon.light-color-scheme.error.states.hover}' }
46
46
  },
47
47
  focused: { value: '{light-color-scheme.error.palette.value.400}' },
48
48
  disabled: {
@@ -58,12 +58,12 @@
58
58
  background: { value: '{dark-color-scheme.primary.palette.value.700}' },
59
59
  border: { value: '{dark-color-scheme.primary.palette.value.700}' },
60
60
  text: { value: '{dark-color-scheme.primary.palette.value.200}' },
61
- icon: { value: 'mix({dark-color-scheme.primary.palette.value.400}, {dark-color-scheme.background.overlay-hover})' },
61
+ icon: { value: '{icon.dark-color-scheme.primary.default}' },
62
62
  states: {
63
63
  hover: {
64
- icon: { value: '{dark-color-scheme.primary.palette.value.500}' }
64
+ icon: { value: '{icon.dark-color-scheme.primary.states.hover}' }
65
65
  },
66
- focused: { value: '{dark-color-scheme.primary.palette.value.400}' },
66
+ focused: { value: '{dark-color-scheme.states.focused-color}' },
67
67
  disabled: {
68
68
  text: { value: 'mix({dark-color-scheme.primary.palette.value.400}, transparent, 50%)' },
69
69
  background: { value: 'mix({dark-color-scheme.primary.palette.value.400}, transparent, 10%)' }
@@ -74,12 +74,12 @@
74
74
  background: { value: '{dark-color-scheme.second.palette.value.700}' },
75
75
  border: { value: '{dark-color-scheme.second.palette.value.700}' },
76
76
  text: { value: '{dark-color-scheme.second.palette.value.200}' },
77
- icon: { value: 'mix({dark-color-scheme.second.palette.value.400}, {dark-color-scheme.background.overlay-hover})' },
77
+ icon: { value: '{icon.dark-color-scheme.secondary.default}' },
78
78
  states: {
79
79
  hover: {
80
- icon: { value: '{dark-color-scheme.second.palette.value.100}' }
80
+ icon: { value: '{icon.dark-color-scheme.secondary.states.hover}' }
81
81
  },
82
- focused: { value: '{dark-color-scheme.primary.palette.value.400}' },
82
+ focused: { value: '{dark-color-scheme.states.focused-color}' },
83
83
  disabled: {
84
84
  text: { value: 'mix({dark-color-scheme.second.palette.value.400}, transparent, 50%)' },
85
85
  background: { value: 'mix({dark-color-scheme.second.palette.value.400}, transparent, 10%)' }
@@ -90,10 +90,10 @@
90
90
  background: { value: '{dark-color-scheme.error.palette.value.700}' },
91
91
  border: { value: '{dark-color-scheme.error.palette.value.700}' },
92
92
  text: { value: '{dark-color-scheme.error.palette.value.200}' },
93
- icon: { value: 'mix({dark-color-scheme.error.palette.value.400}, {dark-color-scheme.background.overlay-hover})' },
93
+ icon: { value: '{icon.dark-color-scheme.error.default}' },
94
94
  states: {
95
95
  hover: {
96
- icon: { value: '{dark-color-scheme.error.palette.value.200}' }
96
+ icon: { value: '{icon.dark-color-scheme.error.states.hover}' }
97
97
  },
98
98
  focused: { value: '{dark-color-scheme.error.palette.value.400}' },
99
99
  disabled: {