@haiilo/catalyst 9.0.0 → 10.0.2

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 (68) hide show
  1. package/dist/catalyst/catalyst.css +82 -48
  2. package/dist/catalyst/catalyst.esm.js +1 -1
  3. package/dist/catalyst/index.esm.js +1 -1
  4. package/dist/catalyst/p-3c7a135c.entry.js +10 -0
  5. package/dist/catalyst/p-3c7a135c.entry.js.map +1 -0
  6. package/dist/catalyst/p-f5febe1f.js +2 -0
  7. package/dist/catalyst/p-f5febe1f.js.map +1 -0
  8. package/dist/catalyst/scss/core/_dialog.scss +38 -0
  9. package/dist/catalyst/scss/utils/_color.scss +6 -6
  10. package/dist/cjs/cat-alert_26.cjs.entry.js +6 -6
  11. package/dist/cjs/cat-alert_26.cjs.entry.js.map +1 -1
  12. package/dist/cjs/catalyst.cjs.js +1 -1
  13. package/dist/cjs/index.cjs.js +1 -1
  14. package/dist/cjs/loader.cjs.js +1 -1
  15. package/dist/cjs/{of-4c3bdf21.js → of-30c47b72.js} +10 -10
  16. package/dist/cjs/of-30c47b72.js.map +1 -0
  17. package/dist/collection/components/cat-alert/cat-alert.css +18 -18
  18. package/dist/collection/components/cat-i18n/cat-i18n-registry.js +6 -6
  19. package/dist/collection/components/cat-i18n/cat-i18n-registry.js.map +1 -1
  20. package/dist/collection/components/cat-icon/cat-icon-registry.js +3 -3
  21. package/dist/collection/components/cat-icon/cat-icon-registry.js.map +1 -1
  22. package/dist/collection/components/cat-input/cat-input.css +48 -48
  23. package/dist/collection/components/cat-radio/cat-radio.js +3 -3
  24. package/dist/collection/components/cat-radio/cat-radio.js.map +1 -1
  25. package/dist/collection/components/cat-radio-group/cat-radio-group.js +3 -3
  26. package/dist/collection/components/cat-radio-group/cat-radio-group.js.map +1 -1
  27. package/dist/collection/components/cat-select/cat-select.css +48 -48
  28. package/dist/collection/components/cat-textarea/cat-textarea.css +48 -48
  29. package/dist/collection/components/cat-tooltip/cat-tooltip.css +2 -2
  30. package/dist/collection/scss/core/_dialog.scss +38 -0
  31. package/dist/collection/scss/utils/_color.scss +6 -6
  32. package/dist/collection/utils/coerce.js.map +1 -1
  33. package/dist/components/cat-alert.js +1 -1
  34. package/dist/components/cat-alert.js.map +1 -1
  35. package/dist/components/cat-i18n-registry.js +6 -6
  36. package/dist/components/cat-i18n-registry.js.map +1 -1
  37. package/dist/components/cat-icon-registry.js +3 -3
  38. package/dist/components/cat-icon-registry.js.map +1 -1
  39. package/dist/components/cat-input2.js +1 -1
  40. package/dist/components/cat-input2.js.map +1 -1
  41. package/dist/components/cat-radio-group.js +1 -1
  42. package/dist/components/cat-radio-group.js.map +1 -1
  43. package/dist/components/cat-radio.js +1 -1
  44. package/dist/components/cat-radio.js.map +1 -1
  45. package/dist/components/cat-select2.js +1 -1
  46. package/dist/components/cat-select2.js.map +1 -1
  47. package/dist/components/cat-textarea.js +1 -1
  48. package/dist/components/cat-textarea.js.map +1 -1
  49. package/dist/components/cat-tooltip.js +1 -1
  50. package/dist/components/cat-tooltip.js.map +1 -1
  51. package/dist/components/coerce.js.map +1 -1
  52. package/dist/esm/cat-alert_26.entry.js +6 -6
  53. package/dist/esm/cat-alert_26.entry.js.map +1 -1
  54. package/dist/esm/catalyst.js +1 -1
  55. package/dist/esm/index.js +2 -2
  56. package/dist/esm/loader.js +1 -1
  57. package/dist/esm/{of-ec88a583.js → of-4b71dda1.js} +10 -10
  58. package/dist/esm/of-4b71dda1.js.map +1 -0
  59. package/dist/types/components/cat-radio/cat-radio.d.ts +1 -1
  60. package/dist/types/components/cat-radio-group/cat-radio-group.d.ts +1 -1
  61. package/dist/types/components.d.ts +4 -4
  62. package/package.json +2 -2
  63. package/dist/catalyst/p-30644946.entry.js +0 -10
  64. package/dist/catalyst/p-30644946.entry.js.map +0 -1
  65. package/dist/catalyst/p-f65e3491.js +0 -2
  66. package/dist/catalyst/p-f65e3491.js.map +0 -1
  67. package/dist/cjs/of-4c3bdf21.js.map +0 -1
  68. package/dist/esm/of-ec88a583.js.map +0 -1
@@ -26,9 +26,9 @@
26
26
  .cat-bg-primary {
27
27
  background-color: rgb(var(--cat-primary-bg, 0, 129, 148)) !important;
28
28
  color: rgb(var(--cat-primary-fill, 255, 255, 255)) !important;
29
- --cat-primary-text: cat-token("color.theme.primary.fill", $wrap: false);
30
- --cat-primary-text-hover: cat-token("color.theme.primary.fill-hover", $wrap: false);
31
- --cat-primary-text-active: cat-token("color.theme.primary.fill-active", $wrap: false);
29
+ --cat-primary-text: var(--cat-primary-fill, 255, 255, 255);
30
+ --cat-primary-text-hover: var(--cat-primary-fill-hover, 255, 255, 255);
31
+ --cat-primary-text-active: var(--cat-primary-fill-active, 255, 255, 255);
32
32
  --cat-link-decoration: underline;
33
33
  }
34
34
 
@@ -38,9 +38,9 @@
38
38
  .cat-bg-primary-hover:hover {
39
39
  background-color: rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;
40
40
  color: rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;
41
- --cat-primary-text: cat-token("color.theme.primary.fill", $wrap: false);
42
- --cat-primary-text-hover: cat-token("color.theme.primary.fill-hover", $wrap: false);
43
- --cat-primary-text-active: cat-token("color.theme.primary.fill-active", $wrap: false);
41
+ --cat-primary-text: var(--cat-primary-fill, 255, 255, 255);
42
+ --cat-primary-text-hover: var(--cat-primary-fill-hover, 255, 255, 255);
43
+ --cat-primary-text-active: var(--cat-primary-fill-active, 255, 255, 255);
44
44
  --cat-link-decoration: underline;
45
45
  }
46
46
 
@@ -65,9 +65,9 @@
65
65
  .cat-bg-primaryInverted {
66
66
  background-color: #93b4f2 !important;
67
67
  color: black !important;
68
- --cat-primary-text: cat-token("color.theme.primaryInverted.fill", $wrap: false);
69
- --cat-primary-text-hover: cat-token("color.theme.primaryInverted.fill-hover", $wrap: false);
70
- --cat-primary-text-active: cat-token("color.theme.primaryInverted.fill-active", $wrap: false);
68
+ --cat-primary-text: 0, 0, 0;
69
+ --cat-primary-text-hover: 0, 0, 0;
70
+ --cat-primary-text-active: 0, 0, 0;
71
71
  --cat-link-decoration: underline;
72
72
  }
73
73
 
@@ -77,9 +77,9 @@
77
77
  .cat-bg-primaryInverted-hover:hover {
78
78
  background-color: #93b4f2 !important;
79
79
  color: black !important;
80
- --cat-primary-text: cat-token("color.theme.primaryInverted.fill", $wrap: false);
81
- --cat-primary-text-hover: cat-token("color.theme.primaryInverted.fill-hover", $wrap: false);
82
- --cat-primary-text-active: cat-token("color.theme.primaryInverted.fill-active", $wrap: false);
80
+ --cat-primary-text: 0, 0, 0;
81
+ --cat-primary-text-hover: 0, 0, 0;
82
+ --cat-primary-text-active: 0, 0, 0;
83
83
  --cat-link-decoration: underline;
84
84
  }
85
85
 
@@ -104,9 +104,9 @@
104
104
  .cat-bg-secondary {
105
105
  background-color: rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;
106
106
  color: rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;
107
- --cat-primary-text: cat-token("color.theme.secondary.fill", $wrap: false);
108
- --cat-primary-text-hover: cat-token("color.theme.secondary.fill-hover", $wrap: false);
109
- --cat-primary-text-active: cat-token("color.theme.secondary.fill-active", $wrap: false);
107
+ --cat-primary-text: var(--cat-secondary-fill, 255, 255, 255);
108
+ --cat-primary-text-hover: var(--cat-secondary-fill-hover, 255, 255, 255);
109
+ --cat-primary-text-active: var(--cat-secondary-fill-active, 255, 255, 255);
110
110
  --cat-link-decoration: underline;
111
111
  }
112
112
 
@@ -116,9 +116,9 @@
116
116
  .cat-bg-secondary-hover:hover {
117
117
  background-color: rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;
118
118
  color: rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;
119
- --cat-primary-text: cat-token("color.theme.secondary.fill", $wrap: false);
120
- --cat-primary-text-hover: cat-token("color.theme.secondary.fill-hover", $wrap: false);
121
- --cat-primary-text-active: cat-token("color.theme.secondary.fill-active", $wrap: false);
119
+ --cat-primary-text: var(--cat-secondary-fill, 255, 255, 255);
120
+ --cat-primary-text-hover: var(--cat-secondary-fill-hover, 255, 255, 255);
121
+ --cat-primary-text-active: var(--cat-secondary-fill-active, 255, 255, 255);
122
122
  --cat-link-decoration: underline;
123
123
  }
124
124
 
@@ -143,9 +143,9 @@
143
143
  .cat-bg-secondaryInverted {
144
144
  background-color: #697687 !important;
145
145
  color: black !important;
146
- --cat-primary-text: cat-token("color.theme.secondaryInverted.fill", $wrap: false);
147
- --cat-primary-text-hover: cat-token("color.theme.secondaryInverted.fill-hover", $wrap: false);
148
- --cat-primary-text-active: cat-token("color.theme.secondaryInverted.fill-active", $wrap: false);
146
+ --cat-primary-text: 0, 0, 0;
147
+ --cat-primary-text-hover: 0, 0, 0;
148
+ --cat-primary-text-active: 0, 0, 0;
149
149
  --cat-link-decoration: underline;
150
150
  }
151
151
 
@@ -155,9 +155,9 @@
155
155
  .cat-bg-secondaryInverted-hover:hover {
156
156
  background-color: #697687 !important;
157
157
  color: black !important;
158
- --cat-primary-text: cat-token("color.theme.secondaryInverted.fill", $wrap: false);
159
- --cat-primary-text-hover: cat-token("color.theme.secondaryInverted.fill-hover", $wrap: false);
160
- --cat-primary-text-active: cat-token("color.theme.secondaryInverted.fill-active", $wrap: false);
158
+ --cat-primary-text: 0, 0, 0;
159
+ --cat-primary-text-hover: 0, 0, 0;
160
+ --cat-primary-text-active: 0, 0, 0;
161
161
  --cat-link-decoration: underline;
162
162
  }
163
163
 
@@ -182,9 +182,9 @@
182
182
  .cat-bg-info {
183
183
  background-color: rgb(var(--cat-success-bg, 0, 115, 230)) !important;
184
184
  color: rgb(var(--cat-success-fill, 255, 255, 255)) !important;
185
- --cat-primary-text: cat-token("color.theme.info.fill", $wrap: false);
186
- --cat-primary-text-hover: cat-token("color.theme.info.fill-hover", $wrap: false);
187
- --cat-primary-text-active: cat-token("color.theme.info.fill-active", $wrap: false);
185
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
186
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
187
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
188
188
  --cat-link-decoration: underline;
189
189
  }
190
190
 
@@ -194,9 +194,9 @@
194
194
  .cat-bg-info-hover:hover {
195
195
  background-color: rgb(var(--cat-success-bg-hover, 0, 107, 227)) !important;
196
196
  color: rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;
197
- --cat-primary-text: cat-token("color.theme.info.fill", $wrap: false);
198
- --cat-primary-text-hover: cat-token("color.theme.info.fill-hover", $wrap: false);
199
- --cat-primary-text-active: cat-token("color.theme.info.fill-active", $wrap: false);
197
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
198
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
199
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
200
200
  --cat-link-decoration: underline;
201
201
  }
202
202
 
@@ -221,9 +221,9 @@
221
221
  .cat-bg-success {
222
222
  background-color: rgb(var(--cat-success-bg, 0, 132, 88)) !important;
223
223
  color: rgb(var(--cat-success-fill, 255, 255, 255)) !important;
224
- --cat-primary-text: cat-token("color.theme.success.fill", $wrap: false);
225
- --cat-primary-text-hover: cat-token("color.theme.success.fill-hover", $wrap: false);
226
- --cat-primary-text-active: cat-token("color.theme.success.fill-active", $wrap: false);
224
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
225
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
226
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
227
227
  --cat-link-decoration: underline;
228
228
  }
229
229
 
@@ -233,9 +233,9 @@
233
233
  .cat-bg-success-hover:hover {
234
234
  background-color: rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;
235
235
  color: rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;
236
- --cat-primary-text: cat-token("color.theme.success.fill", $wrap: false);
237
- --cat-primary-text-hover: cat-token("color.theme.success.fill-hover", $wrap: false);
238
- --cat-primary-text-active: cat-token("color.theme.success.fill-active", $wrap: false);
236
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
237
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
238
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
239
239
  --cat-link-decoration: underline;
240
240
  }
241
241
 
@@ -260,9 +260,9 @@
260
260
  .cat-bg-warning {
261
261
  background-color: rgb(var(--cat-warning-bg, 255, 206, 128)) !important;
262
262
  color: rgb(var(--cat-warning-fill, 0, 0, 0)) !important;
263
- --cat-primary-text: cat-token("color.theme.warning.fill", $wrap: false);
264
- --cat-primary-text-hover: cat-token("color.theme.warning.fill-hover", $wrap: false);
265
- --cat-primary-text-active: cat-token("color.theme.warning.fill-active", $wrap: false);
263
+ --cat-primary-text: var(--cat-warning-fill, 0, 0, 0);
264
+ --cat-primary-text-hover: var(--cat-warning-fill-hover, 0, 0, 0);
265
+ --cat-primary-text-active: var(--cat-warning-fill-active, 0, 0, 0);
266
266
  --cat-link-decoration: underline;
267
267
  }
268
268
 
@@ -272,9 +272,9 @@
272
272
  .cat-bg-warning-hover:hover {
273
273
  background-color: rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;
274
274
  color: rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;
275
- --cat-primary-text: cat-token("color.theme.warning.fill", $wrap: false);
276
- --cat-primary-text-hover: cat-token("color.theme.warning.fill-hover", $wrap: false);
277
- --cat-primary-text-active: cat-token("color.theme.warning.fill-active", $wrap: false);
275
+ --cat-primary-text: var(--cat-warning-fill, 0, 0, 0);
276
+ --cat-primary-text-hover: var(--cat-warning-fill-hover, 0, 0, 0);
277
+ --cat-primary-text-active: var(--cat-warning-fill-active, 0, 0, 0);
278
278
  --cat-link-decoration: underline;
279
279
  }
280
280
 
@@ -299,9 +299,9 @@
299
299
  .cat-bg-danger {
300
300
  background-color: rgb(var(--cat-danger-bg, 217, 52, 13)) !important;
301
301
  color: rgb(var(--cat-danger-fill, 255, 255, 255)) !important;
302
- --cat-primary-text: cat-token("color.theme.danger.fill", $wrap: false);
303
- --cat-primary-text-hover: cat-token("color.theme.danger.fill-hover", $wrap: false);
304
- --cat-primary-text-active: cat-token("color.theme.danger.fill-active", $wrap: false);
302
+ --cat-primary-text: var(--cat-danger-fill, 255, 255, 255);
303
+ --cat-primary-text-hover: var(--cat-danger-fill-hover, 255, 255, 255);
304
+ --cat-primary-text-active: var(--cat-danger-fill-active, 255, 255, 255);
305
305
  --cat-link-decoration: underline;
306
306
  }
307
307
 
@@ -311,9 +311,9 @@
311
311
  .cat-bg-danger-hover:hover {
312
312
  background-color: rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;
313
313
  color: rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;
314
- --cat-primary-text: cat-token("color.theme.danger.fill", $wrap: false);
315
- --cat-primary-text-hover: cat-token("color.theme.danger.fill-hover", $wrap: false);
316
- --cat-primary-text-active: cat-token("color.theme.danger.fill-active", $wrap: false);
314
+ --cat-primary-text: var(--cat-danger-fill, 255, 255, 255);
315
+ --cat-primary-text-hover: var(--cat-danger-fill-hover, 255, 255, 255);
316
+ --cat-primary-text-active: var(--cat-danger-fill-active, 255, 255, 255);
317
317
  --cat-link-decoration: underline;
318
318
  }
319
319
 
@@ -26,9 +26,9 @@
26
26
  .cat-bg-primary {
27
27
  background-color: rgb(var(--cat-primary-bg, 0, 129, 148)) !important;
28
28
  color: rgb(var(--cat-primary-fill, 255, 255, 255)) !important;
29
- --cat-primary-text: cat-token("color.theme.primary.fill", $wrap: false);
30
- --cat-primary-text-hover: cat-token("color.theme.primary.fill-hover", $wrap: false);
31
- --cat-primary-text-active: cat-token("color.theme.primary.fill-active", $wrap: false);
29
+ --cat-primary-text: var(--cat-primary-fill, 255, 255, 255);
30
+ --cat-primary-text-hover: var(--cat-primary-fill-hover, 255, 255, 255);
31
+ --cat-primary-text-active: var(--cat-primary-fill-active, 255, 255, 255);
32
32
  --cat-link-decoration: underline;
33
33
  }
34
34
 
@@ -38,9 +38,9 @@
38
38
  .cat-bg-primary-hover:hover {
39
39
  background-color: rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;
40
40
  color: rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important;
41
- --cat-primary-text: cat-token("color.theme.primary.fill", $wrap: false);
42
- --cat-primary-text-hover: cat-token("color.theme.primary.fill-hover", $wrap: false);
43
- --cat-primary-text-active: cat-token("color.theme.primary.fill-active", $wrap: false);
41
+ --cat-primary-text: var(--cat-primary-fill, 255, 255, 255);
42
+ --cat-primary-text-hover: var(--cat-primary-fill-hover, 255, 255, 255);
43
+ --cat-primary-text-active: var(--cat-primary-fill-active, 255, 255, 255);
44
44
  --cat-link-decoration: underline;
45
45
  }
46
46
 
@@ -65,9 +65,9 @@
65
65
  .cat-bg-primaryInverted {
66
66
  background-color: #93b4f2 !important;
67
67
  color: black !important;
68
- --cat-primary-text: cat-token("color.theme.primaryInverted.fill", $wrap: false);
69
- --cat-primary-text-hover: cat-token("color.theme.primaryInverted.fill-hover", $wrap: false);
70
- --cat-primary-text-active: cat-token("color.theme.primaryInverted.fill-active", $wrap: false);
68
+ --cat-primary-text: 0, 0, 0;
69
+ --cat-primary-text-hover: 0, 0, 0;
70
+ --cat-primary-text-active: 0, 0, 0;
71
71
  --cat-link-decoration: underline;
72
72
  }
73
73
 
@@ -77,9 +77,9 @@
77
77
  .cat-bg-primaryInverted-hover:hover {
78
78
  background-color: #93b4f2 !important;
79
79
  color: black !important;
80
- --cat-primary-text: cat-token("color.theme.primaryInverted.fill", $wrap: false);
81
- --cat-primary-text-hover: cat-token("color.theme.primaryInverted.fill-hover", $wrap: false);
82
- --cat-primary-text-active: cat-token("color.theme.primaryInverted.fill-active", $wrap: false);
80
+ --cat-primary-text: 0, 0, 0;
81
+ --cat-primary-text-hover: 0, 0, 0;
82
+ --cat-primary-text-active: 0, 0, 0;
83
83
  --cat-link-decoration: underline;
84
84
  }
85
85
 
@@ -104,9 +104,9 @@
104
104
  .cat-bg-secondary {
105
105
  background-color: rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;
106
106
  color: rgb(var(--cat-secondary-fill, 255, 255, 255)) !important;
107
- --cat-primary-text: cat-token("color.theme.secondary.fill", $wrap: false);
108
- --cat-primary-text-hover: cat-token("color.theme.secondary.fill-hover", $wrap: false);
109
- --cat-primary-text-active: cat-token("color.theme.secondary.fill-active", $wrap: false);
107
+ --cat-primary-text: var(--cat-secondary-fill, 255, 255, 255);
108
+ --cat-primary-text-hover: var(--cat-secondary-fill-hover, 255, 255, 255);
109
+ --cat-primary-text-active: var(--cat-secondary-fill-active, 255, 255, 255);
110
110
  --cat-link-decoration: underline;
111
111
  }
112
112
 
@@ -116,9 +116,9 @@
116
116
  .cat-bg-secondary-hover:hover {
117
117
  background-color: rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;
118
118
  color: rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important;
119
- --cat-primary-text: cat-token("color.theme.secondary.fill", $wrap: false);
120
- --cat-primary-text-hover: cat-token("color.theme.secondary.fill-hover", $wrap: false);
121
- --cat-primary-text-active: cat-token("color.theme.secondary.fill-active", $wrap: false);
119
+ --cat-primary-text: var(--cat-secondary-fill, 255, 255, 255);
120
+ --cat-primary-text-hover: var(--cat-secondary-fill-hover, 255, 255, 255);
121
+ --cat-primary-text-active: var(--cat-secondary-fill-active, 255, 255, 255);
122
122
  --cat-link-decoration: underline;
123
123
  }
124
124
 
@@ -143,9 +143,9 @@
143
143
  .cat-bg-secondaryInverted {
144
144
  background-color: #697687 !important;
145
145
  color: black !important;
146
- --cat-primary-text: cat-token("color.theme.secondaryInverted.fill", $wrap: false);
147
- --cat-primary-text-hover: cat-token("color.theme.secondaryInverted.fill-hover", $wrap: false);
148
- --cat-primary-text-active: cat-token("color.theme.secondaryInverted.fill-active", $wrap: false);
146
+ --cat-primary-text: 0, 0, 0;
147
+ --cat-primary-text-hover: 0, 0, 0;
148
+ --cat-primary-text-active: 0, 0, 0;
149
149
  --cat-link-decoration: underline;
150
150
  }
151
151
 
@@ -155,9 +155,9 @@
155
155
  .cat-bg-secondaryInverted-hover:hover {
156
156
  background-color: #697687 !important;
157
157
  color: black !important;
158
- --cat-primary-text: cat-token("color.theme.secondaryInverted.fill", $wrap: false);
159
- --cat-primary-text-hover: cat-token("color.theme.secondaryInverted.fill-hover", $wrap: false);
160
- --cat-primary-text-active: cat-token("color.theme.secondaryInverted.fill-active", $wrap: false);
158
+ --cat-primary-text: 0, 0, 0;
159
+ --cat-primary-text-hover: 0, 0, 0;
160
+ --cat-primary-text-active: 0, 0, 0;
161
161
  --cat-link-decoration: underline;
162
162
  }
163
163
 
@@ -182,9 +182,9 @@
182
182
  .cat-bg-info {
183
183
  background-color: rgb(var(--cat-success-bg, 0, 115, 230)) !important;
184
184
  color: rgb(var(--cat-success-fill, 255, 255, 255)) !important;
185
- --cat-primary-text: cat-token("color.theme.info.fill", $wrap: false);
186
- --cat-primary-text-hover: cat-token("color.theme.info.fill-hover", $wrap: false);
187
- --cat-primary-text-active: cat-token("color.theme.info.fill-active", $wrap: false);
185
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
186
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
187
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
188
188
  --cat-link-decoration: underline;
189
189
  }
190
190
 
@@ -194,9 +194,9 @@
194
194
  .cat-bg-info-hover:hover {
195
195
  background-color: rgb(var(--cat-success-bg-hover, 0, 107, 227)) !important;
196
196
  color: rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;
197
- --cat-primary-text: cat-token("color.theme.info.fill", $wrap: false);
198
- --cat-primary-text-hover: cat-token("color.theme.info.fill-hover", $wrap: false);
199
- --cat-primary-text-active: cat-token("color.theme.info.fill-active", $wrap: false);
197
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
198
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
199
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
200
200
  --cat-link-decoration: underline;
201
201
  }
202
202
 
@@ -221,9 +221,9 @@
221
221
  .cat-bg-success {
222
222
  background-color: rgb(var(--cat-success-bg, 0, 132, 88)) !important;
223
223
  color: rgb(var(--cat-success-fill, 255, 255, 255)) !important;
224
- --cat-primary-text: cat-token("color.theme.success.fill", $wrap: false);
225
- --cat-primary-text-hover: cat-token("color.theme.success.fill-hover", $wrap: false);
226
- --cat-primary-text-active: cat-token("color.theme.success.fill-active", $wrap: false);
224
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
225
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
226
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
227
227
  --cat-link-decoration: underline;
228
228
  }
229
229
 
@@ -233,9 +233,9 @@
233
233
  .cat-bg-success-hover:hover {
234
234
  background-color: rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;
235
235
  color: rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important;
236
- --cat-primary-text: cat-token("color.theme.success.fill", $wrap: false);
237
- --cat-primary-text-hover: cat-token("color.theme.success.fill-hover", $wrap: false);
238
- --cat-primary-text-active: cat-token("color.theme.success.fill-active", $wrap: false);
236
+ --cat-primary-text: var(--cat-success-fill, 255, 255, 255);
237
+ --cat-primary-text-hover: var(--cat-success-fill-hover, 255, 255, 255);
238
+ --cat-primary-text-active: var(--cat-success-fill-active, 255, 255, 255);
239
239
  --cat-link-decoration: underline;
240
240
  }
241
241
 
@@ -260,9 +260,9 @@
260
260
  .cat-bg-warning {
261
261
  background-color: rgb(var(--cat-warning-bg, 255, 206, 128)) !important;
262
262
  color: rgb(var(--cat-warning-fill, 0, 0, 0)) !important;
263
- --cat-primary-text: cat-token("color.theme.warning.fill", $wrap: false);
264
- --cat-primary-text-hover: cat-token("color.theme.warning.fill-hover", $wrap: false);
265
- --cat-primary-text-active: cat-token("color.theme.warning.fill-active", $wrap: false);
263
+ --cat-primary-text: var(--cat-warning-fill, 0, 0, 0);
264
+ --cat-primary-text-hover: var(--cat-warning-fill-hover, 0, 0, 0);
265
+ --cat-primary-text-active: var(--cat-warning-fill-active, 0, 0, 0);
266
266
  --cat-link-decoration: underline;
267
267
  }
268
268
 
@@ -272,9 +272,9 @@
272
272
  .cat-bg-warning-hover:hover {
273
273
  background-color: rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;
274
274
  color: rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important;
275
- --cat-primary-text: cat-token("color.theme.warning.fill", $wrap: false);
276
- --cat-primary-text-hover: cat-token("color.theme.warning.fill-hover", $wrap: false);
277
- --cat-primary-text-active: cat-token("color.theme.warning.fill-active", $wrap: false);
275
+ --cat-primary-text: var(--cat-warning-fill, 0, 0, 0);
276
+ --cat-primary-text-hover: var(--cat-warning-fill-hover, 0, 0, 0);
277
+ --cat-primary-text-active: var(--cat-warning-fill-active, 0, 0, 0);
278
278
  --cat-link-decoration: underline;
279
279
  }
280
280
 
@@ -299,9 +299,9 @@
299
299
  .cat-bg-danger {
300
300
  background-color: rgb(var(--cat-danger-bg, 217, 52, 13)) !important;
301
301
  color: rgb(var(--cat-danger-fill, 255, 255, 255)) !important;
302
- --cat-primary-text: cat-token("color.theme.danger.fill", $wrap: false);
303
- --cat-primary-text-hover: cat-token("color.theme.danger.fill-hover", $wrap: false);
304
- --cat-primary-text-active: cat-token("color.theme.danger.fill-active", $wrap: false);
302
+ --cat-primary-text: var(--cat-danger-fill, 255, 255, 255);
303
+ --cat-primary-text-hover: var(--cat-danger-fill-hover, 255, 255, 255);
304
+ --cat-primary-text-active: var(--cat-danger-fill-active, 255, 255, 255);
305
305
  --cat-link-decoration: underline;
306
306
  }
307
307
 
@@ -311,9 +311,9 @@
311
311
  .cat-bg-danger-hover:hover {
312
312
  background-color: rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;
313
313
  color: rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important;
314
- --cat-primary-text: cat-token("color.theme.danger.fill", $wrap: false);
315
- --cat-primary-text-hover: cat-token("color.theme.danger.fill-hover", $wrap: false);
316
- --cat-primary-text-active: cat-token("color.theme.danger.fill-active", $wrap: false);
314
+ --cat-primary-text: var(--cat-danger-fill, 255, 255, 255);
315
+ --cat-primary-text-hover: var(--cat-danger-fill-hover, 255, 255, 255);
316
+ --cat-primary-text-active: var(--cat-danger-fill-active, 255, 255, 255);
317
317
  --cat-link-decoration: underline;
318
318
  }
319
319
 
@@ -12,8 +12,8 @@
12
12
  }
13
13
 
14
14
  .tooltip {
15
- --cat-font-color-head: cat-token("color.ui.font.tooltip", $wrap: false);
16
- --cat-font-color-body: cat-token("color.ui.font.tooltip", $wrap: false);
15
+ --cat-font-color-head: var(--cat-font-color-tooltip, 255, 255, 255);
16
+ --cat-font-color-body: var(--cat-font-color-tooltip, 255, 255, 255);
17
17
  position: fixed;
18
18
  width: max-content;
19
19
  top: 0;
@@ -66,3 +66,41 @@ $-dialog-padding: 1.5rem;
66
66
  }
67
67
  }
68
68
  }
69
+
70
+ .cat-dialog-pull {
71
+ &.cat-dialog-header,
72
+ &.cat-dialog-actions {
73
+ margin: -#{$-dialog-padding};
74
+ }
75
+
76
+ .cat-dialog-content & {
77
+ margin-left: -#{$-dialog-padding};
78
+ margin-right: -#{$-dialog-padding};
79
+ }
80
+ }
81
+
82
+ .cat-dialog-pull-h {
83
+ margin-left: -#{$-dialog-padding};
84
+ margin-right: -#{$-dialog-padding};
85
+ }
86
+
87
+ .cat-dialog-pull-v {
88
+ margin-top: -#{$-dialog-padding};
89
+ margin-bottom: -#{$-dialog-padding};
90
+ }
91
+
92
+ .cat-dialog-pull-r {
93
+ margin-right: -#{$-dialog-padding};
94
+ }
95
+
96
+ .cat-dialog-pull-l {
97
+ margin-left: -#{$-dialog-padding};
98
+ }
99
+
100
+ .cat-dialog-pull-t {
101
+ margin-top: -#{$-dialog-padding};
102
+ }
103
+
104
+ .cat-dialog-pull-b {
105
+ margin-bottom: -#{$-dialog-padding};
106
+ }
@@ -5,9 +5,9 @@
5
5
  background-color: cat-token('color.theme.#{$name}.bg') !important;
6
6
  color: cat-token('color.theme.#{$name}.fill') !important;
7
7
  // adjust nested links
8
- --cat-primary-text: cat-token('color.theme.#{$name}.fill', $wrap: false);
9
- --cat-primary-text-hover: cat-token('color.theme.#{$name}.fill-hover', $wrap: false);
10
- --cat-primary-text-active: cat-token('color.theme.#{$name}.fill-active', $wrap: false);
8
+ --cat-primary-text: #{cat-token('color.theme.#{$name}.fill', $wrap: false)};
9
+ --cat-primary-text-hover: #{cat-token('color.theme.#{$name}.fillHover', $wrap: false)};
10
+ --cat-primary-text-active: #{cat-token('color.theme.#{$name}.fillActive', $wrap: false)};
11
11
  --cat-link-decoration: underline;
12
12
  }
13
13
 
@@ -20,9 +20,9 @@
20
20
  background-color: cat-token('color.theme.#{$name}.bgHover') !important;
21
21
  color: cat-token('color.theme.#{$name}.fillHover') !important;
22
22
  // adjust nested links
23
- --cat-primary-text: cat-token('color.theme.#{$name}.fill', $wrap: false);
24
- --cat-primary-text-hover: cat-token('color.theme.#{$name}.fill-hover', $wrap: false);
25
- --cat-primary-text-active: cat-token('color.theme.#{$name}.fill-active', $wrap: false);
23
+ --cat-primary-text: #{cat-token('color.theme.#{$name}.fill', $wrap: false)};
24
+ --cat-primary-text-hover: #{cat-token('color.theme.#{$name}.fillHover', $wrap: false)};
25
+ --cat-primary-text-active: #{cat-token('color.theme.#{$name}.fillActive', $wrap: false)};
26
26
  --cat-link-decoration: underline;
27
27
  }
28
28
  }
@@ -1 +1 @@
1
- {"version":3,"file":"coerce.js","sourceRoot":"","sources":["../../src/utils/coerce.ts"],"names":[],"mappings":"AAAA,uDAAuD;AAEvD,MAAM,UAAU,aAAa,CAAC,KAAU;IACtC,OAAO,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,EAAE,KAAK,OAAO,CAAC;AACjD,CAAC;AAID,MAAM,UAAU,YAAY,CAAC,KAAU,EAAE,aAAa,GAAG,CAAC;IACxD,OAAO,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;AAC9D,CAAC;AAED,SAAS,aAAa,CAAC,KAAU;IAC/B,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,KAAY,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AACnE,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport function coerceBoolean(value: any): boolean {\n return value != null && `${value}` !== 'false';\n}\n\nexport function coerceNumber(value: any): number;\nexport function coerceNumber<D>(value: any, fallback: D): number | D;\nexport function coerceNumber(value: any, fallbackValue = 0) {\n return isNumberValue(value) ? Number(value) : fallbackValue;\n}\n\nfunction isNumberValue(value: any): boolean {\n return !isNaN(parseFloat(value as any)) && !isNaN(Number(value));\n}\n"]}
1
+ {"version":3,"file":"coerce.js","sourceRoot":"","sources":["../../src/utils/coerce.ts"],"names":[],"mappings":"AAAA,uDAAuD;AAEvD,MAAM,UAAU,aAAa,CAAC,KAAU;IACtC,OAAO,KAAK,IAAI,IAAI,IAAI,GAAG,KAAK,EAAE,KAAK,OAAO,CAAC;AACjD,CAAC;AAID,MAAM,UAAU,YAAY,CAAC,KAAU,EAAE,aAAa,GAAG,CAAC;IACxD,OAAO,aAAa,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC;AAC9D,CAAC;AAED,SAAS,aAAa,CAAC,KAAU;IAC/B,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAC5D,CAAC","sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\n\nexport function coerceBoolean(value: any): boolean {\n return value != null && `${value}` !== 'false';\n}\n\nexport function coerceNumber(value: any): number;\nexport function coerceNumber<D>(value: any, fallback: D): number | D;\nexport function coerceNumber(value: any, fallbackValue = 0) {\n return isNumberValue(value) ? Number(value) : fallbackValue;\n}\n\nfunction isNumberValue(value: any): boolean {\n return !isNaN(parseFloat(value)) && !isNaN(Number(value));\n}\n"]}
@@ -7,7 +7,7 @@ function setAttributeDefault(host, attr, value) {
7
7
  }
8
8
  }
9
9
 
10
- const catAlertCss = ":host{display:flex;gap:0.5rem;padding:1.25rem;border-radius:var(--cat-border-radius-l, 0.5rem)}:host([hidden]){display:none}:host(:focus-visible){outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.content{align-self:center}::slotted(:last-child){margin-bottom:0 !important}:host([color=primary]){background-color:rgb(var(--cat-primary-bg, 0, 129, 148));color:rgb(var(--cat-primary-fill, 255, 255, 255));--cat-primary-text:cat-token(\"color.theme.primary.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.primary.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.primary.fill-active\", $wrap: false);--cat-link-decoration:underline}:host([color=secondary]){background-color:rgb(var(--cat-secondary-bg, 105, 118, 135));color:rgb(var(--cat-secondary-fill, 255, 255, 255));--cat-primary-text:cat-token(\"color.theme.secondary.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.secondary.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.secondary.fill-active\", $wrap: false);--cat-link-decoration:underline}:host([color=info]){background-color:rgb(var(--cat-success-bg, 0, 115, 230));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:cat-token(\"color.theme.info.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.info.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.info.fill-active\", $wrap: false);--cat-link-decoration:underline}:host([color=success]){background-color:rgb(var(--cat-success-bg, 0, 132, 88));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:cat-token(\"color.theme.success.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.success.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.success.fill-active\", $wrap: false);--cat-link-decoration:underline}:host([color=warning]){background-color:rgb(var(--cat-warning-bg, 255, 206, 128));color:rgb(var(--cat-warning-fill, 0, 0, 0));--cat-primary-text:cat-token(\"color.theme.warning.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.warning.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.warning.fill-active\", $wrap: false);--cat-link-decoration:underline}:host([color=danger]){background-color:rgb(var(--cat-danger-bg, 217, 52, 13));color:rgb(var(--cat-danger-fill, 255, 255, 255));--cat-primary-text:cat-token(\"color.theme.danger.fill\", $wrap: false);--cat-primary-text-hover:cat-token(\"color.theme.danger.fill-hover\", $wrap: false);--cat-primary-text-active:cat-token(\"color.theme.danger.fill-active\", $wrap: false);--cat-link-decoration:underline}";
10
+ const catAlertCss = ":host{display:flex;gap:0.5rem;padding:1.25rem;border-radius:var(--cat-border-radius-l, 0.5rem)}:host([hidden]){display:none}:host(:focus-visible){outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.content{align-self:center}::slotted(:last-child){margin-bottom:0 !important}:host([color=primary]){background-color:rgb(var(--cat-primary-bg, 0, 129, 148));color:rgb(var(--cat-primary-fill, 255, 255, 255));--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=secondary]){background-color:rgb(var(--cat-secondary-bg, 105, 118, 135));color:rgb(var(--cat-secondary-fill, 255, 255, 255));--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=info]){background-color:rgb(var(--cat-success-bg, 0, 115, 230));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=success]){background-color:rgb(var(--cat-success-bg, 0, 132, 88));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=warning]){background-color:rgb(var(--cat-warning-bg, 255, 206, 128));color:rgb(var(--cat-warning-fill, 0, 0, 0));--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}:host([color=danger]){background-color:rgb(var(--cat-danger-bg, 217, 52, 13));color:rgb(var(--cat-danger-fill, 255, 255, 255));--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}";
11
11
 
12
12
  const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class CatAlert extends HTMLElement {
13
13
  constructor() {
@@ -1 +1 @@
1
- {"file":"cat-alert.js","mappings":";;;SAAgB,mBAAmB,CACjC,IAAO,EACP,IAAY,EACZ,KAAc;IAEd,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,IAAI,EAAE;QACzD,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;KACpD;AACH;;ACRA,MAAM,WAAW,GAAG,urFAAurF;;MCY9rFA,UAAQ;;;;;QACF,YAAO,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,WAAW,EAAE,sBAAsB,CAAC;YACrC,CAAC,MAAM,EAAE,iBAAiB,CAAC;YAC3B,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,QAAQ,EAAE,mBAAmB,CAAC;SAChC,CAAC,CAAC;QACc,YAAO,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,WAAW,EAAE,QAAQ,CAAC;YACvB,CAAC,MAAM,EAAE,QAAQ,CAAC;YAClB,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,SAAS,EAAE,OAAO,CAAC;YACpB,CAAC,QAAQ,EAAE,OAAO,CAAC;SACpB,CAAC,CAAC;qBAO0F,SAAS;;sBAUrF,KAAK;;IAEtB,iBAAiB;QACf,mBAAmB,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;QACzC,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;KACjE;IAED,MAAM;QACJ,QACE,EAAC,IAAI,QACF,CAAC,IAAI,CAAC,MAAM,IAAI,gBAAU,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,GAAa,EAChG,WAAK,KAAK,EAAC,SAAS,IAClB,eAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatAlert"],"sources":["src/utils/setDefault.ts","src/components/cat-alert/cat-alert.scss?tag=cat-alert&encapsulation=shadow","src/components/cat-alert/cat-alert.tsx"],"sourcesContent":["export function setAttributeDefault<T extends { hostElement: HTMLElement }>(\n host: T,\n attr: string,\n value: unknown\n): void {\n if (!host.hostElement.hasAttribute(attr) && value != null) {\n host.hostElement.setAttribute(attr, String(value));\n }\n}\n\nexport function setAttribute<T extends { hostElement: HTMLElement }>(host: T, attr: string, value: unknown): void {\n host.hostElement.setAttribute(attr, String(value));\n}\n","@use 'variables' as *;\n@use 'mixins' as *;\n@use 'sass:map';\n\n:host {\n display: flex;\n gap: 0.5rem;\n padding: 1.25rem;\n border-radius: cat-border-radius('l');\n}\n\n:host([hidden]) {\n display: none;\n}\n\n:host(:focus-visible) {\n outline: 2px solid cat-token('color.ui.border.focus');\n outline-offset: 1px;\n}\n\n.content {\n align-self: center;\n}\n\n::slotted(:last-child) {\n margin-bottom: 0 !important;\n}\n\n// ----- theme\n\n@mixin theme($theme) {\n :host([color='#{$theme}']) {\n background-color: cat-token('color.theme.#{$theme}.bg');\n color: cat-token('color.theme.#{$theme}.fill');\n // adjust nested links\n --cat-primary-text: cat-token('color.theme.#{$theme}.fill', $wrap: false);\n --cat-primary-text-hover: cat-token('color.theme.#{$theme}.fill-hover', $wrap: false);\n --cat-primary-text-active: cat-token('color.theme.#{$theme}.fill-active', $wrap: false);\n --cat-link-decoration: underline;\n }\n}\n\n@include theme('primary');\n@include theme('secondary');\n@include theme('info');\n@include theme('success');\n@include theme('warning');\n@include theme('danger');\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport { setAttributeDefault } from '../../utils/setDefault';\n\n/**\n * Informs user about important changes or conditions in the interface. Use this\n * component if you need to capture user’s attention in a prominent way.\n */\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n private readonly mapIcon: Map<string, string> = new Map([\n ['primary', '$cat:alert-primary'],\n ['secondary', '$cat:alert-secondary'],\n ['info', '$cat:alert-info'],\n ['success', '$cat:alert-success'],\n ['warning', '$cat:alert-warning'],\n ['danger', '$cat:alert-danger']\n ]);\n private readonly mapRole: Map<string, string> = new Map([\n ['primary', 'status'],\n ['secondary', 'status'],\n ['info', 'status'],\n ['success', 'status'],\n ['warning', 'alert'],\n ['danger', 'alert']\n ]);\n\n @Element() hostElement!: HTMLElement;\n\n /**\n * The color palette of the alert.\n */\n @Prop({ reflect: true }) color: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' = 'primary';\n\n /**\n * The name of an icon to be displayed in the alert.\n */\n @Prop() icon?: string;\n\n /**\n * Whether the icon of the alert is deactivated.\n */\n @Prop() noIcon = false;\n\n connectedCallback() {\n setAttributeDefault(this, 'tabindex', 0);\n setAttributeDefault(this, 'role', this.mapRole.get(this.color));\n }\n\n render() {\n return (\n <Host>\n {!this.noIcon && <cat-icon size=\"l\" icon={this.icon || this.mapIcon.get(this.color)}></cat-icon>}\n <div class=\"content\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"cat-alert.js","mappings":";;;SAAgB,mBAAmB,CACjC,IAAO,EACP,IAAY,EACZ,KAAc;IAEd,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,IAAI,EAAE;QACzD,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;KACpD;AACH;;ACRA,MAAM,WAAW,GAAG,g6EAAg6E;;MCYv6EA,UAAQ;;;;;QACF,YAAO,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,WAAW,EAAE,sBAAsB,CAAC;YACrC,CAAC,MAAM,EAAE,iBAAiB,CAAC;YAC3B,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,QAAQ,EAAE,mBAAmB,CAAC;SAChC,CAAC,CAAC;QACc,YAAO,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,WAAW,EAAE,QAAQ,CAAC;YACvB,CAAC,MAAM,EAAE,QAAQ,CAAC;YAClB,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,SAAS,EAAE,OAAO,CAAC;YACpB,CAAC,QAAQ,EAAE,OAAO,CAAC;SACpB,CAAC,CAAC;qBAO0F,SAAS;;sBAUrF,KAAK;;IAEtB,iBAAiB;QACf,mBAAmB,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;QACzC,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;KACjE;IAED,MAAM;QACJ,QACE,EAAC,IAAI,QACF,CAAC,IAAI,CAAC,MAAM,IAAI,gBAAU,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,GAAa,EAChG,WAAK,KAAK,EAAC,SAAS,IAClB,eAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatAlert"],"sources":["src/utils/setDefault.ts","src/components/cat-alert/cat-alert.scss?tag=cat-alert&encapsulation=shadow","src/components/cat-alert/cat-alert.tsx"],"sourcesContent":["export function setAttributeDefault<T extends { hostElement: HTMLElement }>(\n host: T,\n attr: string,\n value: unknown\n): void {\n if (!host.hostElement.hasAttribute(attr) && value != null) {\n host.hostElement.setAttribute(attr, String(value));\n }\n}\n\nexport function setAttribute<T extends { hostElement: HTMLElement }>(host: T, attr: string, value: unknown): void {\n host.hostElement.setAttribute(attr, String(value));\n}\n","@use 'variables' as *;\n@use 'mixins' as *;\n@use 'sass:map';\n\n:host {\n display: flex;\n gap: 0.5rem;\n padding: 1.25rem;\n border-radius: cat-border-radius('l');\n}\n\n:host([hidden]) {\n display: none;\n}\n\n:host(:focus-visible) {\n outline: 2px solid cat-token('color.ui.border.focus');\n outline-offset: 1px;\n}\n\n.content {\n align-self: center;\n}\n\n::slotted(:last-child) {\n margin-bottom: 0 !important;\n}\n\n// ----- theme\n\n@mixin theme($theme) {\n :host([color='#{$theme}']) {\n background-color: cat-token('color.theme.#{$theme}.bg');\n color: cat-token('color.theme.#{$theme}.fill');\n // adjust nested links\n --cat-primary-text: #{cat-token('color.theme.#{$theme}.fill', $wrap: false)};\n --cat-primary-text-hover: #{cat-token('color.theme.#{$theme}.fillHover', $wrap: false)};\n --cat-primary-text-active: #{cat-token('color.theme.#{$theme}.fillActive', $wrap: false)};\n --cat-link-decoration: underline;\n }\n}\n\n@include theme('primary');\n@include theme('secondary');\n@include theme('info');\n@include theme('success');\n@include theme('warning');\n@include theme('danger');\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport { setAttributeDefault } from '../../utils/setDefault';\n\n/**\n * Informs user about important changes or conditions in the interface. Use this\n * component if you need to capture user’s attention in a prominent way.\n */\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n private readonly mapIcon: Map<string, string> = new Map([\n ['primary', '$cat:alert-primary'],\n ['secondary', '$cat:alert-secondary'],\n ['info', '$cat:alert-info'],\n ['success', '$cat:alert-success'],\n ['warning', '$cat:alert-warning'],\n ['danger', '$cat:alert-danger']\n ]);\n private readonly mapRole: Map<string, string> = new Map([\n ['primary', 'status'],\n ['secondary', 'status'],\n ['info', 'status'],\n ['success', 'status'],\n ['warning', 'alert'],\n ['danger', 'alert']\n ]);\n\n @Element() hostElement!: HTMLElement;\n\n /**\n * The color palette of the alert.\n */\n @Prop({ reflect: true }) color: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' = 'primary';\n\n /**\n * The name of an icon to be displayed in the alert.\n */\n @Prop() icon?: string;\n\n /**\n * Whether the icon of the alert is deactivated.\n */\n @Prop() noIcon = false;\n\n connectedCallback() {\n setAttributeDefault(this, 'tabindex', 0);\n setAttributeDefault(this, 'role', this.mapRole.get(this.color));\n }\n\n render() {\n return (\n <Host>\n {!this.noIcon && <cat-icon size=\"l\" icon={this.icon || this.mapIcon.get(this.color)}></cat-icon>}\n <div class=\"content\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -43,35 +43,35 @@ class CatI18nRegistry {
43
43
  setLocale(locale, silent = false) {
44
44
  try {
45
45
  this._locale = Intl.getCanonicalLocales(locale)[0];
46
- loglevel.info(`[CatI18nRegistry] Set locale: ${this._locale}`);
46
+ loglevel.info(`[CatI18nRegistry::${this.id}] Set locale: ${this._locale}`);
47
47
  !silent && window.dispatchEvent(this.buildEvent('cat-i18n-setLocale', { locale, id: this.id }));
48
48
  }
49
49
  catch (err) {
50
- loglevel.error(`[CatI18nRegistry] Invalid locale: ${locale}`);
50
+ loglevel.error(`[CatI18nRegistry::${this.id}] Invalid locale: ${locale}`);
51
51
  }
52
52
  }
53
53
  set(i18n, silent = false) {
54
54
  if (typeof i18n === 'function') {
55
55
  this._translator = i18n;
56
- loglevel.info(`[CatI18nRegistry] Registered translator`);
56
+ loglevel.info(`[CatI18nRegistry::${this.id}] Registered translator`);
57
57
  }
58
58
  else {
59
59
  const i18nEntries = Object.entries(i18n);
60
60
  i18nEntries.forEach(([key, message]) => this.i18n.set(key, message));
61
- loglevel.info(`[CatI18nRegistry] Registered ${i18nEntries.length !== 1 ? 'messages' : 'message'}`);
61
+ loglevel.info(`[CatI18nRegistry::${this.id}] Registered ${i18nEntries.length !== 1 ? 'messages' : 'message'}`);
62
62
  }
63
63
  !silent && window.dispatchEvent(this.buildEvent('cat-i18n-set', { i18n, id: this.id }));
64
64
  }
65
65
  clear(silent = false) {
66
66
  this.i18n.clear();
67
- loglevel.info(`[CatI18nRegistry] Cleared messages`);
67
+ loglevel.info(`[CatI18nRegistry::${this.id}] Cleared messages`);
68
68
  !silent && window.dispatchEvent(this.buildEvent('cat-i18n-clear'));
69
69
  }
70
70
  t(key, params) {
71
71
  const message = this._translator?.(key, params) ??
72
72
  this.i18n.get(key)?.replace(/{{\s*([-a-zA-Z._]+)\s*}}/g, (_match, key) => `${params?.[key] ?? ''}`);
73
73
  if (message === undefined) {
74
- loglevel.error(`[CatI18nRegistry] Unknown message key: ${key}`);
74
+ loglevel.error(`[CatI18nRegistry::${this.id}] Unknown message key: ${key}`);
75
75
  return key;
76
76
  }
77
77
  return message;