i-tech-shared-components 1.1.8 → 1.1.9

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 (39) hide show
  1. package/README.md +23 -23
  2. package/esm2022/lib/components/autocomplete-select/autocomplete-select.component.mjs +3 -3
  3. package/esm2022/lib/components/button/button.component.mjs +3 -3
  4. package/esm2022/lib/components/clear-value/clear-value.component.mjs +11 -11
  5. package/esm2022/lib/components/date-picker/date-picker.component.mjs +17 -3
  6. package/esm2022/lib/components/date-range-datepicker/date-range-datepicker.component.mjs +3 -3
  7. package/esm2022/lib/components/icon-button/icon-button.component.mjs +3 -3
  8. package/esm2022/lib/components/menu/menu.component.mjs +51 -0
  9. package/esm2022/lib/components/text/text-input.component.mjs +3 -3
  10. package/esm2022/lib/directives/date-mask.directive.mjs +1 -1
  11. package/esm2022/lib/directives/input-mask.directive.mjs +1 -1
  12. package/esm2022/lib/interfaces/app-input.interface.mjs +1 -1
  13. package/esm2022/lib/interfaces/autocomplete-configs.interface.mjs +1 -1
  14. package/esm2022/lib/interfaces/button-types.enum.mjs +1 -1
  15. package/esm2022/lib/interfaces/dropdown-selection.constants.mjs +12 -0
  16. package/esm2022/lib/pipes/array-to-string.pipe.mjs +1 -1
  17. package/esm2022/lib/pipes/generate-error-messages.pipe.mjs +1 -1
  18. package/esm2022/lib/pipes/get-value-by-key-from-object.pipe.mjs +1 -1
  19. package/esm2022/lib/services/input.service.mjs +1 -1
  20. package/esm2022/public-api.mjs +2 -1
  21. package/fesm2022/i-tech-shared-components.mjs +92 -25
  22. package/fesm2022/i-tech-shared-components.mjs.map +1 -1
  23. package/lib/components/date-picker/date-picker.component.d.ts +4 -1
  24. package/lib/components/menu/menu.component.d.ts +28 -0
  25. package/lib/interfaces/autocomplete-configs.interface.d.ts +3 -3
  26. package/lib/interfaces/dropdown-selection.constants.d.ts +10 -0
  27. package/package.json +1 -1
  28. package/public-api.d.ts +1 -0
  29. package/theme/_buttons.scss +63 -63
  30. package/theme/_color_themes.scss +136 -136
  31. package/theme/_date_picker.scss +77 -77
  32. package/theme/_form_fields.scss +112 -112
  33. package/theme/_icon-button.scss +123 -123
  34. package/theme/_label.scss +119 -119
  35. package/theme/_mat-selects.scss +248 -248
  36. package/theme/_menu.scss +9 -9
  37. package/theme/_text_input.scss +28 -28
  38. package/theme/variables/_colors.scss +20 -20
  39. package/theme.scss +31 -31
package/theme/_label.scss CHANGED
@@ -1,119 +1,119 @@
1
- @use "sass:map";
2
- @use '@angular/material' as mat;
3
- @import "./color_themes.scss";
4
-
5
- body {
6
- $types: (
7
- purple: (
8
- main: #DBD4F3,
9
- hover: #E5E0F6,
10
- border: #6F5BBF,
11
- text: #140063
12
- ),
13
- teal: (
14
- main: #D2F3F2,
15
- hover: #DFF6F6,
16
- border: #00CAC3,
17
- text: #006B67
18
- ),
19
- olive: (
20
- main: #EFF2D4,
21
- hover: #F3F6E0,
22
- border: #CDD968,
23
- text: #606C00
24
- ),
25
- orange: (
26
- main: #FFE4DB,
27
- hover: #FFECE5,
28
- border: #FC8156,
29
- text: #A42B00
30
- ),
31
- blue: (
32
- main: #D1E9FF,
33
- hover: #DEEFFF,
34
- border: #42A5FF,
35
- text: #003E77
36
- ),
37
- cyan: (
38
- main: #DBF8FF,
39
- hover: #E5FAFF,
40
- border: #42D8FF,
41
- text: #006681
42
- ),
43
- raspberry: (
44
- main: #EBD6DB,
45
- hover: #F1E1E5,
46
- border: #711A2E,
47
- text: #4B0011
48
- ),
49
- yellow: (
50
- main: #FFFCCB,
51
- hover: #FFFDDA,
52
- border: #FFF000,
53
- text: #847700
54
- ),
55
- wine: (
56
- main: #EDD3E5,
57
- hover: #F2DFEC,
58
- border: #9D4280,
59
- text: #680047
60
- ),
61
- green: (
62
- main: #CFF1DD,
63
- hover: #DCF5E7,
64
- border: #2EB265,
65
- text: #005D27
66
- ),
67
- primary: (
68
- main: #C0E5C7,
69
- hover: #EFFAF1,
70
- border: #42B963,
71
- text: #003A0C
72
- ),
73
- red: (
74
- main: #FFE5E5,
75
- hover: #FFD9D9,
76
- border: #FF4D4D,
77
- text: #8B0000
78
- ),
79
- );
80
-
81
- --mdc-chip-container-shape-radius: 8px !important;
82
- --mdc-chip-label-text-line-height: 16px !important;
83
- --mdc-chip-label-text-size: 11px !important;
84
- --mdc-chip-label-text-weight: 700 !important;
85
- --mdc-chip-label-text-tracking: 0.3 !important;
86
- --mdc-chip-outline-width: 0 !important;
87
- --mdc-chip-container-height: 32px !important;
88
-
89
- @each $type, $value in $types {
90
- .label_#{$type} {
91
- --mdc-chip-elevated-container-color: #{map.get($value, "main")};
92
- --mdc-chip-outline-color: #{map.get($value, "border")};
93
- --mdc-chip-label-text-color: #{map.get($value, "text")};
94
-
95
- mat-icon {
96
- width: 18px;
97
- height: 18px;
98
- font-size: 18px;
99
- }
100
- }
101
- }
102
-
103
- .mat-mdc-chip.small {
104
- // TODO need to review
105
- --mdc-chip-container-height: 28px !important;
106
- }
107
-
108
- .trailing-icon {
109
- .mat-mdc-standard-chip .mdc-evolution-chip__action--primary {
110
- // Chips with trailing icon have -4 right padding per Figma
111
- padding-right: 8px;
112
- }
113
- }
114
-
115
- .mat-mdc-chip.bordered {
116
- --mdc-chip-outline-width: 2.5px !important;
117
- }
118
-
119
- }
1
+ @use "sass:map";
2
+ @use '@angular/material' as mat;
3
+ @import "./color_themes.scss";
4
+
5
+ body {
6
+ $types: (
7
+ purple: (
8
+ main: #DBD4F3,
9
+ hover: #E5E0F6,
10
+ border: #6F5BBF,
11
+ text: #140063
12
+ ),
13
+ teal: (
14
+ main: #D2F3F2,
15
+ hover: #DFF6F6,
16
+ border: #00CAC3,
17
+ text: #006B67
18
+ ),
19
+ olive: (
20
+ main: #EFF2D4,
21
+ hover: #F3F6E0,
22
+ border: #CDD968,
23
+ text: #606C00
24
+ ),
25
+ orange: (
26
+ main: #FFE4DB,
27
+ hover: #FFECE5,
28
+ border: #FC8156,
29
+ text: #A42B00
30
+ ),
31
+ blue: (
32
+ main: #D1E9FF,
33
+ hover: #DEEFFF,
34
+ border: #42A5FF,
35
+ text: #003E77
36
+ ),
37
+ cyan: (
38
+ main: #DBF8FF,
39
+ hover: #E5FAFF,
40
+ border: #42D8FF,
41
+ text: #006681
42
+ ),
43
+ raspberry: (
44
+ main: #EBD6DB,
45
+ hover: #F1E1E5,
46
+ border: #711A2E,
47
+ text: #4B0011
48
+ ),
49
+ yellow: (
50
+ main: #FFFCCB,
51
+ hover: #FFFDDA,
52
+ border: #FFF000,
53
+ text: #847700
54
+ ),
55
+ wine: (
56
+ main: #EDD3E5,
57
+ hover: #F2DFEC,
58
+ border: #9D4280,
59
+ text: #680047
60
+ ),
61
+ green: (
62
+ main: #CFF1DD,
63
+ hover: #DCF5E7,
64
+ border: #2EB265,
65
+ text: #005D27
66
+ ),
67
+ primary: (
68
+ main: #C0E5C7,
69
+ hover: #EFFAF1,
70
+ border: #42B963,
71
+ text: #003A0C
72
+ ),
73
+ red: (
74
+ main: #FFE5E5,
75
+ hover: #FFD9D9,
76
+ border: #FF4D4D,
77
+ text: #8B0000
78
+ ),
79
+ );
80
+
81
+ --mdc-chip-container-shape-radius: 8px !important;
82
+ --mdc-chip-label-text-line-height: 16px !important;
83
+ --mdc-chip-label-text-size: 11px !important;
84
+ --mdc-chip-label-text-weight: 700 !important;
85
+ --mdc-chip-label-text-tracking: 0.3 !important;
86
+ --mdc-chip-outline-width: 0 !important;
87
+ --mdc-chip-container-height: 32px !important;
88
+
89
+ @each $type, $value in $types {
90
+ .label_#{$type} {
91
+ --mdc-chip-elevated-container-color: #{map.get($value, "main")};
92
+ --mdc-chip-outline-color: #{map.get($value, "border")};
93
+ --mdc-chip-label-text-color: #{map.get($value, "text")};
94
+
95
+ mat-icon {
96
+ width: 18px;
97
+ height: 18px;
98
+ font-size: 18px;
99
+ }
100
+ }
101
+ }
102
+
103
+ .mat-mdc-chip.small {
104
+ // TODO need to review
105
+ --mdc-chip-container-height: 28px !important;
106
+ }
107
+
108
+ .trailing-icon {
109
+ .mat-mdc-standard-chip .mdc-evolution-chip__action--primary {
110
+ // Chips with trailing icon have -4 right padding per Figma
111
+ padding-right: 8px;
112
+ }
113
+ }
114
+
115
+ .mat-mdc-chip.bordered {
116
+ --mdc-chip-outline-width: 2.5px !important;
117
+ }
118
+
119
+ }