@ngx-stoui/core 15.0.1 → 16.0.1

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 (66) hide show
  1. package/README.md +7 -7
  2. package/{esm2020 → esm2022}/index.mjs +1 -1
  3. package/{esm2020 → esm2022}/lib/abstract-and-interfaces/keyPress.enum.mjs +1 -1
  4. package/esm2022/lib/sto-directives/context-menu.directive.mjs +36 -0
  5. package/esm2022/lib/sto-directives/date-form-field-click.directive.mjs +46 -0
  6. package/esm2022/lib/sto-directives/directives.module.mjs +64 -0
  7. package/{esm2020 → esm2022}/lib/sto-directives/index.mjs +1 -1
  8. package/esm2022/lib/sto-directives/menu-overlay.directive.mjs +48 -0
  9. package/{esm2020 → esm2022}/lib/sto-directives/quick-keys.directive.mjs +4 -4
  10. package/{esm2020 → esm2022}/lib/sto-directives/sto-grid.directive.mjs +10 -10
  11. package/{esm2020 → esm2022}/lib/sto-directives/sto-select-text-on-focus.directive.mjs +4 -4
  12. package/{esm2020 → esm2022}/lib/sto-pipes/currency-format.pipe.mjs +4 -4
  13. package/{esm2020 → esm2022}/lib/sto-pipes/date-format.pipe.mjs +4 -4
  14. package/{esm2020 → esm2022}/lib/sto-pipes/keys.pipe.mjs +4 -4
  15. package/{esm2020 → esm2022}/lib/sto-pipes/number-format.pipe.mjs +4 -4
  16. package/{esm2020 → esm2022}/lib/sto-pipes/sto-pipes.module.mjs +17 -17
  17. package/{esm2020 → esm2022}/lib/sto-pipes/with-unit.mjs +7 -7
  18. package/{esm2020 → esm2022}/lib/sto-pipes/yes-no.mjs +4 -4
  19. package/{fesm2020 → fesm2022}/ngx-stoui-core.mjs +83 -84
  20. package/fesm2022/ngx-stoui-core.mjs.map +1 -0
  21. package/lib/sto-directives/context-menu.directive.d.ts +2 -2
  22. package/lib/sto-directives/date-form-field-click.directive.d.ts +2 -2
  23. package/lib/sto-directives/menu-overlay.directive.d.ts +1 -1
  24. package/lib/sto-directives/quick-keys.directive.d.ts +1 -1
  25. package/lib/sto-directives/sto-grid.directive.d.ts +2 -2
  26. package/ngx-datatable.css +31 -13
  27. package/ngx-stoui.css +3301 -3555
  28. package/package.json +18 -18
  29. package/style/_fonts.scss +3 -3
  30. package/style/datatable/_ngx-datatable-compact.scss +144 -144
  31. package/style/datatable/_ngx-datatable-form.scss +94 -95
  32. package/style/datatable/_ngx-datatable-variables.scss +10 -10
  33. package/style/datatable/ngx-datatable.scss +400 -398
  34. package/style/form/sto-form.scss +348 -342
  35. package/style/grid.scss +20 -20
  36. package/style/sto-dialog.scss +73 -73
  37. package/style/sto-grid.scss +65 -67
  38. package/style/theme/_action-footer.scss +20 -20
  39. package/style/theme/_appheader.scss +121 -122
  40. package/style/theme/_card.scss +28 -26
  41. package/style/theme/_colors.scss +170 -170
  42. package/style/theme/_datatable.scss +244 -224
  43. package/style/theme/_daterange.scss +47 -51
  44. package/style/theme/_dialog.scss +25 -25
  45. package/style/theme/_filterpanel.scss +88 -88
  46. package/style/theme/_input-overrides.scss +119 -117
  47. package/style/theme/_message-panel.scss +89 -89
  48. package/style/theme/_number-input.scss +23 -23
  49. package/style/theme/_number-unit-input.scss +34 -34
  50. package/style/theme/_select-filter.scss +16 -16
  51. package/style/theme/_sto-indicators.scss +89 -89
  52. package/style/theme/_theme-variables.scss +63 -61
  53. package/style/theme/_theme.scss +22 -16
  54. package/style/theme/_typography.scss +44 -41
  55. package/style/theme/_wysiwyg.scss +38 -38
  56. package/style/theme/components.scss +16 -16
  57. package/style/theme/preference-manager.scss +50 -50
  58. package/style/theme.scss +41 -35
  59. package/esm2020/lib/sto-directives/context-menu.directive.mjs +0 -36
  60. package/esm2020/lib/sto-directives/date-form-field-click.directive.mjs +0 -46
  61. package/esm2020/lib/sto-directives/directives.module.mjs +0 -64
  62. package/esm2020/lib/sto-directives/menu-overlay.directive.mjs +0 -48
  63. package/fesm2015/ngx-stoui-core.mjs +0 -829
  64. package/fesm2015/ngx-stoui-core.mjs.map +0 -1
  65. package/fesm2020/ngx-stoui-core.mjs.map +0 -1
  66. /package/{esm2020 → esm2022}/ngx-stoui-core.mjs +0 -0
package/style/theme/_colors.scss CHANGED
@@ -1,170 +1,170 @@
1
- @use '@angular/material' as mat;
2
- @use 'sass:map';
3
-
4
-
5
- $sto-warning-map: (
6
- highlight: var(--warning-highlight),
7
- resting: var(--warning-resting),
8
- hover: var(--warning-hover),
9
- text: var(--warning-text),
10
- contrast: (
11
- highlight: var(--warning-highlight-contrast),
12
- resting: var(--warning-resting-contrast),
13
- hover: var(--warning-hover-contrast),
14
- text: var(--warning-text-contrast),
15
- )
16
- );
17
-
18
- $sto-warning: mat.define-palette($sto-warning-map, highlight, resting, hover, text);
19
-
20
- $sto-danger-map: (
21
- highlight: var(--danger-highlight),
22
- resting: var(--danger-resting),
23
- hover: var(--danger-hover),
24
- text: var(--danger-text),
25
- contrast: (
26
- highlight: var(--danger-highlight-contrast),
27
- resting: var(--danger-resting-contrast),
28
- hover: var(--danger-hover-contrast),
29
- )
30
- );
31
- $sto-danger: mat.define-palette($sto-danger-map, highlight, resting, hover, text);
32
-
33
- $sto-success-map: (
34
- highlight: var(--success-highlight),
35
- resting: var(--success-resting),
36
- hover: var(--success-hover),
37
- text: var(--success-text),
38
- contrast: (
39
- highlight: --success-highlight-contrast,
40
- resting: --success-resting-contrast,
41
- hover: --success-hover-contrast,
42
- )
43
- );
44
- $sto-success: mat.define-palette($sto-success-map, highlight, resting, hover, text);
45
-
46
- $sto-primary: (
47
- highlight: var(--primary-highlight),
48
- selected-hover: var(--primary-selected-hover),
49
- resting: var(--primary-resting),
50
- hover: var(--primary-hover),
51
- hover-alt: var(--primary-hover-alt),
52
- text: var(--primary-text),
53
- contrast: (
54
- highlight: var(--primary-contrast-highlight),
55
- resting: var(--primary-contrast-resting),
56
- hover: var(--primary-contrast-hover),
57
- )
58
- );
59
-
60
- $primary: mat.define-palette($sto-primary, resting, highlight, hover, text);
61
-
62
- $sto-indicators-map: (
63
- success: $sto-success,
64
- warning: $sto-warning,
65
- danger: $sto-danger
66
- );
67
-
68
-
69
- $sto-accent: (
70
- highlight: var(--accent-highlight),
71
- resting: var(--accent-resting),
72
- hover: var(--accent-hover),
73
- text: var(--accent-text),
74
- 200: var(--accent-toggle), // For slide toggle,
75
- contrast : (
76
- highlight: var(--accent-highlight-contrast),
77
- resting: var(--accent-resting-contrast),
78
- hover: var(--accent-hover-contrast),
79
- )
80
- );
81
-
82
- $accent: mat.define-palette($sto-accent, highlight, resting, hover);
83
-
84
- $sto-warn: mat.define-palette(mat.$red-palette);
85
-
86
-
87
- $eds-dark-foreground: (
88
- secondary: #DEE5E7,
89
- primary: #FFFFFF,
90
- tertiary: #9CA6AC,
91
- disabled: #637583,
92
- divider: #3E4F5C,
93
- );
94
- $eds-dark-background: (
95
- default: #132634,
96
- semi-transparent: rgba(255, 255, 255, 0.16),
97
- light: #2E3F4D,
98
- medium: #243746,
99
- info: #D5EAF4,
100
- warning: rgba(255, 198, 122, 0.1),
101
- danger: rgba(255, 102, 112, 0.1),
102
- scrim: #132634,
103
- overlay: #2E3F4D,
104
- disabled: #344450,
105
- hover: #324D62,
106
- focus: #2E3F4D
107
- );
108
-
109
-
110
- $eds-light-foreground: (
111
- secondary: #565656,
112
- primary: #3D3D3D,
113
- tertiary: #6F6F6F,
114
- disabled: #BEBEBE,
115
- divider: #DCDCDC,
116
- );
117
- $eds-light-background: (
118
- default: #FFFFFF,
119
- semi-transparent: rgba(255, 255, 255, 0.2),
120
- light: #F7F7F7,
121
- medium: #DCDCDC,
122
- info: #D5EAF4,
123
- warning: #FFE7D6,
124
- danger: #FFC1C1,
125
- scrim: rgba(0, 0, 0, 0.4),
126
- overlay: rgba(0, 0, 0, 0.8),
127
- disabled: #EAEAEA,
128
- hover: #EAEAEA,
129
- focus: #007079
130
- );
131
-
132
- $theme-fg: (
133
- base: var(--text),
134
- divider: var(--divider),
135
- dividers: var(--divider),
136
- disabled: var(--text-disabled),
137
- disabled-button: var(--text-disabled),
138
- disabled-text: var(--text-disabled),
139
- hint-text: var(--text-disabled),
140
- secondary-text: var(--text-secondary),
141
- icon: var(--text-secondary),
142
- icons: var(--text-secondary),
143
- text: var(--text),
144
- slider-min: var(--text-secondary),
145
- slider-off: var(--text-disabled),
146
- slider-off-active: var(--text-disabled),
147
- );
148
-
149
- $theme-bg: (
150
- app-bar: var(--bg-card),
151
- background: var(--bg-app),
152
- hover: var(--bg-hover),
153
- card: var(--bg-card),
154
- dialog: var(--bg-card),
155
- disabled-button: var(--bg-disabled),
156
- raised-button: var(--bg-card),
157
- focused-button: var(--bg-focus),
158
- selected-button: var(--bg-light),
159
- selected-disabled-button: var(--bg-disabled),
160
- disabled-button-toggle: var(--bg-disabled),
161
- unselected-chip: var(--bg-light),
162
- disabled-list-option: var(--bg-disabled),
163
- tooltip: var(--bg-overlay),
164
- );
165
-
166
- $sto-indicators: (
167
- indicators: $sto-indicators-map,
168
- foreground: $theme-fg,
169
- background: $theme-bg,
170
- );
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+
4
+
5
+ $sto-warning-map: (
6
+ highlight: var(--warning-highlight),
7
+ resting: var(--warning-resting),
8
+ hover: var(--warning-hover),
9
+ text: var(--warning-text),
10
+ contrast: (
11
+ highlight: var(--warning-highlight-contrast),
12
+ resting: var(--warning-resting-contrast),
13
+ hover: var(--warning-hover-contrast),
14
+ text: var(--warning-text-contrast),
15
+ )
16
+ );
17
+
18
+ $sto-warning: mat.define-palette($sto-warning-map, highlight, resting, hover, text);
19
+
20
+ $sto-danger-map: (
21
+ highlight: var(--danger-highlight),
22
+ resting: var(--danger-resting),
23
+ hover: var(--danger-hover),
24
+ text: var(--danger-text),
25
+ contrast: (
26
+ highlight: var(--danger-highlight-contrast),
27
+ resting: var(--danger-resting-contrast),
28
+ hover: var(--danger-hover-contrast),
29
+ )
30
+ );
31
+ $sto-danger: mat.define-palette($sto-danger-map, highlight, resting, hover, text);
32
+
33
+ $sto-success-map: (
34
+ highlight: var(--success-highlight),
35
+ resting: var(--success-resting),
36
+ hover: var(--success-hover),
37
+ text: var(--success-text),
38
+ contrast: (
39
+ highlight: --success-highlight-contrast,
40
+ resting: --success-resting-contrast,
41
+ hover: --success-hover-contrast,
42
+ )
43
+ );
44
+ $sto-success: mat.define-palette($sto-success-map, highlight, resting, hover, text);
45
+
46
+ $sto-primary: (
47
+ highlight: var(--primary-highlight),
48
+ selected-hover: var(--primary-selected-hover),
49
+ resting: var(--primary-resting),
50
+ hover: var(--primary-hover),
51
+ hover-alt: var(--primary-hover-alt),
52
+ text: var(--primary-text),
53
+ contrast: (
54
+ highlight: var(--primary-contrast-highlight),
55
+ resting: var(--primary-contrast-resting),
56
+ hover: var(--primary-contrast-hover),
57
+ )
58
+ );
59
+
60
+ $primary: mat.define-palette($sto-primary, resting, highlight, hover, text);
61
+
62
+ $sto-indicators-map: (
63
+ success: $sto-success,
64
+ warning: $sto-warning,
65
+ danger: $sto-danger
66
+ );
67
+
68
+
69
+ $sto-accent: (
70
+ highlight: var(--accent-highlight),
71
+ resting: var(--accent-resting),
72
+ hover: var(--accent-hover),
73
+ text: var(--accent-text),
74
+ 200: var(--accent-toggle), // For slide toggle,
75
+ contrast : (
76
+ highlight: var(--accent-highlight-contrast),
77
+ resting: var(--accent-resting-contrast),
78
+ hover: var(--accent-hover-contrast),
79
+ )
80
+ );
81
+
82
+ $accent: mat.define-palette($sto-accent, highlight, resting, hover);
83
+
84
+ $sto-warn: mat.define-palette(mat.$red-palette);
85
+
86
+
87
+ $eds-dark-foreground: (
88
+ secondary: #DEE5E7,
89
+ primary: #FFFFFF,
90
+ tertiary: #9CA6AC,
91
+ disabled: #637583,
92
+ divider: #3E4F5C,
93
+ );
94
+ $eds-dark-background: (
95
+ default: #132634,
96
+ semi-transparent: rgba(255, 255, 255, 0.16),
97
+ light: #2E3F4D,
98
+ medium: #243746,
99
+ info: #D5EAF4,
100
+ warning: rgba(255, 198, 122, 0.1),
101
+ danger: rgba(255, 102, 112, 0.1),
102
+ scrim: #132634,
103
+ overlay: #2E3F4D,
104
+ disabled: #344450,
105
+ hover: #324D62,
106
+ focus: #2E3F4D
107
+ );
108
+
109
+
110
+ $eds-light-foreground: (
111
+ secondary: #565656,
112
+ primary: #3D3D3D,
113
+ tertiary: #6F6F6F,
114
+ disabled: #BEBEBE,
115
+ divider: #DCDCDC,
116
+ );
117
+ $eds-light-background: (
118
+ default: #FFFFFF,
119
+ semi-transparent: rgba(255, 255, 255, 0.2),
120
+ light: #F7F7F7,
121
+ medium: #DCDCDC,
122
+ info: #D5EAF4,
123
+ warning: #FFE7D6,
124
+ danger: #FFC1C1,
125
+ scrim: rgba(0, 0, 0, 0.4),
126
+ overlay: rgba(0, 0, 0, 0.8),
127
+ disabled: #EAEAEA,
128
+ hover: #EAEAEA,
129
+ focus: #007079
130
+ );
131
+
132
+ $theme-fg: (
133
+ base: var(--text),
134
+ divider: var(--divider),
135
+ dividers: var(--divider),
136
+ disabled: var(--text-disabled),
137
+ disabled-button: var(--text-disabled),
138
+ disabled-text: var(--text-disabled),
139
+ hint-text: var(--text-disabled),
140
+ secondary-text: var(--text-secondary),
141
+ icon: var(--text-secondary),
142
+ icons: var(--text-secondary),
143
+ text: var(--text),
144
+ slider-min: var(--text-secondary),
145
+ slider-off: var(--text-disabled),
146
+ slider-off-active: var(--text-disabled),
147
+ );
148
+
149
+ $theme-bg: (
150
+ app-bar: var(--bg-card),
151
+ background: var(--bg-app),
152
+ hover: var(--bg-hover),
153
+ card: var(--bg-card),
154
+ dialog: var(--bg-card),
155
+ disabled-button: var(--bg-disabled),
156
+ raised-button: var(--bg-card),
157
+ focused-button: var(--bg-focus),
158
+ selected-button: var(--bg-light),
159
+ selected-disabled-button: var(--bg-disabled),
160
+ disabled-button-toggle: var(--bg-disabled),
161
+ unselected-chip: var(--bg-light),
162
+ disabled-list-option: var(--bg-disabled),
163
+ tooltip: var(--bg-overlay),
164
+ );
165
+
166
+ $sto-indicators: (
167
+ indicators: $sto-indicators-map,
168
+ foreground: $theme-fg,
169
+ background: $theme-bg,
170
+ );