commons-shared-web-ui 0.0.43 → 0.0.45

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 (29) hide show
  1. package/fesm2022/commons-shared-web-ui.mjs +1459 -1347
  2. package/fesm2022/commons-shared-web-ui.mjs.map +1 -1
  3. package/index.d.ts +49 -0
  4. package/package.json +1 -1
  5. package/src/lib/modules/alert/alert.theme.scss +84 -84
  6. package/src/lib/modules/button/button.theme.scss +120 -120
  7. package/src/lib/modules/configurable-form/configurable-form.theme.scss +77 -77
  8. package/src/lib/modules/confirmation-modal/confirmation-modal.theme.scss +86 -86
  9. package/src/lib/modules/filter/filter.theme.scss +91 -91
  10. package/src/lib/modules/filter-sidebar/filter-sidebar.theme.scss +37 -37
  11. package/src/lib/modules/filter-table-selector/filter-table-selector.theme.scss +36 -36
  12. package/src/lib/modules/form-builder/form-builder.theme.scss +212 -212
  13. package/src/lib/modules/form-components/components/checkbox/_theme.scss +62 -62
  14. package/src/lib/modules/form-components/components/datepicker/_theme.scss +81 -81
  15. package/src/lib/modules/form-components/components/dropdown/_theme.scss +90 -90
  16. package/src/lib/modules/form-components/components/input/_theme.scss +76 -76
  17. package/src/lib/modules/form-components/components/radio/_theme.scss +60 -60
  18. package/src/lib/modules/form-components/components/search/_theme.scss +72 -72
  19. package/src/lib/modules/form-components/components/toggle/_theme.scss +44 -44
  20. package/src/lib/modules/form-components/form-components.theme.scss +24 -24
  21. package/src/lib/modules/nav/nav.theme.scss +86 -86
  22. package/src/lib/modules/pagination/pagination.theme.scss +66 -66
  23. package/src/lib/modules/side-nav/side-nav.theme.scss +111 -111
  24. package/src/lib/modules/smart-form/smart-form.theme.scss +889 -889
  25. package/src/lib/modules/smart-table/smart-table.theme.scss +335 -335
  26. package/src/lib/modules/snackbar/snackbar.theme.scss +93 -93
  27. package/src/lib/modules/summary-card/summary-card.theme.scss +175 -175
  28. package/src/lib/styles/global.scss +151 -151
  29. package/src/lib/styles/utilities.scss +250 -250
package/src/lib/modules/confirmation-modal/confirmation-modal.theme.scss CHANGED
@@ -1,87 +1,87 @@
1
- @use 'sass:map';
2
-
3
- $default-confirmation-modal-config: (
4
- bg: #FFFFFF,
5
- radius: 0.75rem,
6
- // 12px
7
- shadow: 0 0.25rem 1.5rem rgba(0, 0, 0, 0.15),
8
- // 0 4px 24px
9
- border: none,
10
-
11
- // Header
12
- header-padding: 0.5rem 1rem,
13
- // 24px
14
- header-border-bottom: 0.0625rem solid #E5E7EB,
15
- // 1px
16
- title-font-size: 0.875rem,
17
- // 20px
18
- title-font-weight: 600,
19
- title-color: #111827,
20
- icon-size: 1.5rem,
21
- // 24px
22
- close-icon-size: 1.25rem,
23
- // 20px
24
-
25
- // Body
26
- body-padding: 1.5rem,
27
- // 24px
28
- body-text-color: #374151,
29
-
30
- // Inputs (Defaults)
31
- input-padding: 0.625rem 0.75rem,
32
- // 10px 12px
33
- input-radius: 0.375rem,
34
- // 6px
35
- input-font-size: 0.875rem,
36
- // 14px
37
- label-margin-bottom: 0.5rem,
38
- // 8px
39
- textarea-min-height: 6.25rem,
40
- // 100px
41
-
42
- // Footer
43
- footer-bg: #F9FAFB,
44
- footer-padding: 1rem 1.5rem,
45
- // 24px
46
- footer-border-top: 0.0625rem solid #E5E7EB,
47
- // 1px
48
-
49
- // Spinner
50
- spinner-size: 1rem // 16px
51
- );
52
-
53
- @mixin confirmation-modal-theme($user-config: ()) {
54
- $config: map.merge($default-confirmation-modal-config, $user-config);
55
-
56
- --cc-modal-bg: #{map.get($config, bg)};
57
- --cc-modal-radius: #{map.get($config, radius)};
58
- --cc-modal-shadow: #{map.get($config, shadow)};
59
- --cc-modal-border: #{map.get($config, border)};
60
-
61
- // Header Themes
62
- --cc-modal-header-bg-dark: #262125;
63
- --cc-modal-header-title-color-dark: #FFFFFF;
64
-
65
- --cc-modal-header-padding: #{map.get($config, header-padding)};
66
- --cc-modal-header-border-bottom: #{map.get($config, header-border-bottom)};
67
- --cc-modal-title-size: #{map.get($config, title-font-size)};
68
- --cc-modal-title-weight: #{map.get($config, title-font-weight)};
69
- --cc-modal-title-color: #{map.get($config, title-color)};
70
- --cc-modal-icon-size: #{map.get($config, icon-size)};
71
- --cc-modal-close-icon-size: #{map.get($config, close-icon-size)};
72
-
73
- --cc-modal-body-padding: #{map.get($config, body-padding)};
74
- --cc-modal-body-color: #{map.get($config, body-text-color)};
75
-
76
- --cc-modal-input-padding: #{map.get($config, input-padding)};
77
- --cc-modal-input-radius: #{map.get($config, input-radius)};
78
- --cc-modal-input-font-size: #{map.get($config, input-font-size)};
79
- --cc-modal-label-margin-bottom: #{map.get($config, label-margin-bottom)};
80
- --cc-modal-textarea-min-height: #{map.get($config, textarea-min-height)};
81
-
82
- --cc-modal-footer-bg: #{map.get($config, footer-bg)};
83
- --cc-modal-footer-padding: #{map.get($config, footer-padding)};
84
- --cc-modal-footer-border-top: #{map.get($config, footer-border-top)};
85
-
86
- --cc-modal-spinner-size: #{map.get($config, spinner-size)};
1
+ @use 'sass:map';
2
+
3
+ $default-confirmation-modal-config: (
4
+ bg: #FFFFFF,
5
+ radius: 0.75rem,
6
+ // 12px
7
+ shadow: 0 0.25rem 1.5rem rgba(0, 0, 0, 0.15),
8
+ // 0 4px 24px
9
+ border: none,
10
+
11
+ // Header
12
+ header-padding: 0.5rem 1rem,
13
+ // 24px
14
+ header-border-bottom: 0.0625rem solid #E5E7EB,
15
+ // 1px
16
+ title-font-size: 0.875rem,
17
+ // 20px
18
+ title-font-weight: 600,
19
+ title-color: #111827,
20
+ icon-size: 1.5rem,
21
+ // 24px
22
+ close-icon-size: 1.25rem,
23
+ // 20px
24
+
25
+ // Body
26
+ body-padding: 1.5rem,
27
+ // 24px
28
+ body-text-color: #374151,
29
+
30
+ // Inputs (Defaults)
31
+ input-padding: 0.625rem 0.75rem,
32
+ // 10px 12px
33
+ input-radius: 0.375rem,
34
+ // 6px
35
+ input-font-size: 0.875rem,
36
+ // 14px
37
+ label-margin-bottom: 0.5rem,
38
+ // 8px
39
+ textarea-min-height: 6.25rem,
40
+ // 100px
41
+
42
+ // Footer
43
+ footer-bg: #F9FAFB,
44
+ footer-padding: 1rem 1.5rem,
45
+ // 24px
46
+ footer-border-top: 0.0625rem solid #E5E7EB,
47
+ // 1px
48
+
49
+ // Spinner
50
+ spinner-size: 1rem // 16px
51
+ );
52
+
53
+ @mixin confirmation-modal-theme($user-config: ()) {
54
+ $config: map.merge($default-confirmation-modal-config, $user-config);
55
+
56
+ --cc-modal-bg: #{map.get($config, bg)};
57
+ --cc-modal-radius: #{map.get($config, radius)};
58
+ --cc-modal-shadow: #{map.get($config, shadow)};
59
+ --cc-modal-border: #{map.get($config, border)};
60
+
61
+ // Header Themes
62
+ --cc-modal-header-bg-dark: #262125;
63
+ --cc-modal-header-title-color-dark: #FFFFFF;
64
+
65
+ --cc-modal-header-padding: #{map.get($config, header-padding)};
66
+ --cc-modal-header-border-bottom: #{map.get($config, header-border-bottom)};
67
+ --cc-modal-title-size: #{map.get($config, title-font-size)};
68
+ --cc-modal-title-weight: #{map.get($config, title-font-weight)};
69
+ --cc-modal-title-color: #{map.get($config, title-color)};
70
+ --cc-modal-icon-size: #{map.get($config, icon-size)};
71
+ --cc-modal-close-icon-size: #{map.get($config, close-icon-size)};
72
+
73
+ --cc-modal-body-padding: #{map.get($config, body-padding)};
74
+ --cc-modal-body-color: #{map.get($config, body-text-color)};
75
+
76
+ --cc-modal-input-padding: #{map.get($config, input-padding)};
77
+ --cc-modal-input-radius: #{map.get($config, input-radius)};
78
+ --cc-modal-input-font-size: #{map.get($config, input-font-size)};
79
+ --cc-modal-label-margin-bottom: #{map.get($config, label-margin-bottom)};
80
+ --cc-modal-textarea-min-height: #{map.get($config, textarea-min-height)};
81
+
82
+ --cc-modal-footer-bg: #{map.get($config, footer-bg)};
83
+ --cc-modal-footer-padding: #{map.get($config, footer-padding)};
84
+ --cc-modal-footer-border-top: #{map.get($config, footer-border-top)};
85
+
86
+ --cc-modal-spinner-size: #{map.get($config, spinner-size)};
87
87
  }
package/src/lib/modules/filter/filter.theme.scss CHANGED
@@ -1,92 +1,92 @@
1
- @use 'sass:map';
2
-
3
- // Default configuration for the filter theme
4
- $default-filter-config: (
5
- // Button Trigger
6
- btn-bg: #ffffff,
7
- btn-border: 1px solid #e0e0e0,
8
- btn-radius: 4px,
9
- btn-text-color: #333,
10
- btn-hover-bg: #f5f5f5,
11
- btn-active-bg: #e3f2fd,
12
- btn-active-text: #1976d2,
13
- btn-badge-bg: #f44336,
14
- btn-badge-text: #fff,
15
-
16
- // Panel / Sidebar
17
- panel-bg: #ffffff,
18
- panel-border: 1px solid #e0e0e0,
19
- panel-shadow: 0 4px 12px rgba(0, 0, 0, 0.15),
20
- panel-width: 320px,
21
- panel-min-width: 480px,
22
- panel-header-bg: #fafafa,
23
- panel-header-text: #333,
24
- panel-padding: 1rem,
25
- panel-radius: 8px,
26
- panel-header-height: 48px,
27
-
28
- // Tabs
29
- tab-bg: transparent,
30
- tab-text: #666,
31
- tab-active-bg: #fff,
32
- tab-active-text: #1976d2,
33
- tab-border-bottom: 2px solid #1976d2,
34
-
35
- // Content
36
- section-title: #333,
37
- option-text: #555,
38
- option-hover-bg: #f9f9f9,
39
-
40
- // Footer actions
41
- footer-bg: #fff,
42
- footer-border-top: 1px solid #e0e0e0,
43
- action-primary-bg: #1976d2,
44
- action-primary-text: #fff,
45
- action-secondary-text: #666
46
- );
47
-
48
- @mixin filter-theme($user-config: ()) {
49
- $config: map.merge($default-filter-config, $user-config);
50
-
51
- // Button Trigger
52
- --cc-filter-btn-bg: #{map.get($config, btn-bg)};
53
- --cc-filter-btn-border: #{map.get($config, btn-border)};
54
- --cc-filter-btn-radius: #{map.get($config, btn-radius)};
55
- --cc-filter-btn-text-color: #{map.get($config, btn-text-color)};
56
- --cc-filter-btn-hover-bg: #{map.get($config, btn-hover-bg)};
57
- --cc-filter-btn-active-bg: #{map.get($config, btn-active-bg)};
58
- --cc-filter-btn-active-text: #{map.get($config, btn-active-text)};
59
- --cc-filter-btn-badge-bg: #{map.get($config, btn-badge-bg)};
60
- --cc-filter-btn-badge-text: #{map.get($config, btn-badge-text)};
61
-
62
- // Panel
63
- --cc-filter-panel-bg: #{map.get($config, panel-bg)};
64
- --cc-filter-panel-border: #{map.get($config, panel-border)};
65
- --cc-filter-panel-shadow: #{map.get($config, panel-shadow)};
66
- --cc-filter-panel-width: #{map.get($config, panel-width)};
67
- --cc-filter-panel-min-width: #{map.get($config, panel-min-width)};
68
- --cc-filter-panel-padding: #{map.get($config, panel-padding)};
69
- --cc-filter-panel-header-bg: #{map.get($config, panel-header-bg)};
70
- --cc-filter-panel-header-text: #{map.get($config, panel-header-text)};
71
- --cc-filter-panel-radius: #{map.get($config, panel-radius)};
72
- --cc-filter-panel-header-height: #{map.get($config, panel-header-height)};
73
-
74
- // Tabs
75
- --cc-filter-tab-bg: #{map.get($config, tab-bg)};
76
- --cc-filter-tab-text: #{map.get($config, tab-text)};
77
- --cc-filter-tab-active-bg: #{map.get($config, tab-active-bg)};
78
- --cc-filter-tab-active-text: #{map.get($config, tab-active-text)};
79
- --cc-filter-tab-border-bottom: #{map.get($config, tab-border-bottom)};
80
-
81
- // Content
82
- --cc-filter-section-title: #{map.get($config, section-title)};
83
- --cc-filter-option-text: #{map.get($config, option-text)};
84
- --cc-filter-option-hover-bg: #{map.get($config, option-hover-bg)};
85
-
86
- // Footer
87
- --cc-filter-footer-bg: #{map.get($config, footer-bg)};
88
- --cc-filter-footer-border-top: #{map.get($config, footer-border-top)};
89
- --cc-filter-action-primary-bg: #{map.get($config, action-primary-bg)};
90
- --cc-filter-action-primary-text: #{map.get($config, action-primary-text)};
91
- --cc-filter-action-secondary-text: #{map.get($config, action-secondary-text)};
1
+ @use 'sass:map';
2
+
3
+ // Default configuration for the filter theme
4
+ $default-filter-config: (
5
+ // Button Trigger
6
+ btn-bg: #ffffff,
7
+ btn-border: 1px solid #e0e0e0,
8
+ btn-radius: 4px,
9
+ btn-text-color: #333,
10
+ btn-hover-bg: #f5f5f5,
11
+ btn-active-bg: #e3f2fd,
12
+ btn-active-text: #1976d2,
13
+ btn-badge-bg: #f44336,
14
+ btn-badge-text: #fff,
15
+
16
+ // Panel / Sidebar
17
+ panel-bg: #ffffff,
18
+ panel-border: 1px solid #e0e0e0,
19
+ panel-shadow: 0 4px 12px rgba(0, 0, 0, 0.15),
20
+ panel-width: 320px,
21
+ panel-min-width: 480px,
22
+ panel-header-bg: #fafafa,
23
+ panel-header-text: #333,
24
+ panel-padding: 1rem,
25
+ panel-radius: 8px,
26
+ panel-header-height: 48px,
27
+
28
+ // Tabs
29
+ tab-bg: transparent,
30
+ tab-text: #666,
31
+ tab-active-bg: #fff,
32
+ tab-active-text: #1976d2,
33
+ tab-border-bottom: 2px solid #1976d2,
34
+
35
+ // Content
36
+ section-title: #333,
37
+ option-text: #555,
38
+ option-hover-bg: #f9f9f9,
39
+
40
+ // Footer actions
41
+ footer-bg: #fff,
42
+ footer-border-top: 1px solid #e0e0e0,
43
+ action-primary-bg: #1976d2,
44
+ action-primary-text: #fff,
45
+ action-secondary-text: #666
46
+ );
47
+
48
+ @mixin filter-theme($user-config: ()) {
49
+ $config: map.merge($default-filter-config, $user-config);
50
+
51
+ // Button Trigger
52
+ --cc-filter-btn-bg: #{map.get($config, btn-bg)};
53
+ --cc-filter-btn-border: #{map.get($config, btn-border)};
54
+ --cc-filter-btn-radius: #{map.get($config, btn-radius)};
55
+ --cc-filter-btn-text-color: #{map.get($config, btn-text-color)};
56
+ --cc-filter-btn-hover-bg: #{map.get($config, btn-hover-bg)};
57
+ --cc-filter-btn-active-bg: #{map.get($config, btn-active-bg)};
58
+ --cc-filter-btn-active-text: #{map.get($config, btn-active-text)};
59
+ --cc-filter-btn-badge-bg: #{map.get($config, btn-badge-bg)};
60
+ --cc-filter-btn-badge-text: #{map.get($config, btn-badge-text)};
61
+
62
+ // Panel
63
+ --cc-filter-panel-bg: #{map.get($config, panel-bg)};
64
+ --cc-filter-panel-border: #{map.get($config, panel-border)};
65
+ --cc-filter-panel-shadow: #{map.get($config, panel-shadow)};
66
+ --cc-filter-panel-width: #{map.get($config, panel-width)};
67
+ --cc-filter-panel-min-width: #{map.get($config, panel-min-width)};
68
+ --cc-filter-panel-padding: #{map.get($config, panel-padding)};
69
+ --cc-filter-panel-header-bg: #{map.get($config, panel-header-bg)};
70
+ --cc-filter-panel-header-text: #{map.get($config, panel-header-text)};
71
+ --cc-filter-panel-radius: #{map.get($config, panel-radius)};
72
+ --cc-filter-panel-header-height: #{map.get($config, panel-header-height)};
73
+
74
+ // Tabs
75
+ --cc-filter-tab-bg: #{map.get($config, tab-bg)};
76
+ --cc-filter-tab-text: #{map.get($config, tab-text)};
77
+ --cc-filter-tab-active-bg: #{map.get($config, tab-active-bg)};
78
+ --cc-filter-tab-active-text: #{map.get($config, tab-active-text)};
79
+ --cc-filter-tab-border-bottom: #{map.get($config, tab-border-bottom)};
80
+
81
+ // Content
82
+ --cc-filter-section-title: #{map.get($config, section-title)};
83
+ --cc-filter-option-text: #{map.get($config, option-text)};
84
+ --cc-filter-option-hover-bg: #{map.get($config, option-hover-bg)};
85
+
86
+ // Footer
87
+ --cc-filter-footer-bg: #{map.get($config, footer-bg)};
88
+ --cc-filter-footer-border-top: #{map.get($config, footer-border-top)};
89
+ --cc-filter-action-primary-bg: #{map.get($config, action-primary-bg)};
90
+ --cc-filter-action-primary-text: #{map.get($config, action-primary-text)};
91
+ --cc-filter-action-secondary-text: #{map.get($config, action-secondary-text)};
92
92
  }
package/src/lib/modules/filter-sidebar/filter-sidebar.theme.scss CHANGED
@@ -1,38 +1,38 @@
1
- @use 'sass:map';
2
-
3
- $default-filter-sidebar-config: (
4
- // Layout
5
- width: 100%,
6
- padding: 1.5rem,
7
- gap: 1.5rem,
8
- bg: #FEFEFE,
9
- border-radius: 0,
10
-
11
- // Header
12
- header-height: 3rem,
13
- header-title-size: 1.125rem,
14
- header-title-weight: 500,
15
- header-title-color: #202124,
16
-
17
- // Footer
18
- footer-padding: 1rem 0 0 0,
19
- footer-gap: 1rem,
20
- );
21
-
22
- @mixin filter-sidebar-theme($user-config: ()) {
23
- $config: map.merge($default-filter-sidebar-config, $user-config);
24
-
25
- --cc-filter-sidebar-width: #{map.get($config, width)};
26
- --cc-filter-sidebar-padding: #{map.get($config, padding)};
27
- --cc-filter-sidebar-gap: #{map.get($config, gap)};
28
- --cc-filter-sidebar-bg: #{map.get($config, bg)};
29
- --cc-filter-sidebar-border-radius: #{map.get($config, border-radius)};
30
-
31
- --cc-filter-header-height: #{map.get($config, header-height)};
32
- --cc-filter-header-title-size: #{map.get($config, header-title-size)};
33
- --cc-filter-header-title-weight: #{map.get($config, header-title-weight)};
34
- --cc-filter-header-title-color: #{map.get($config, header-title-color)};
35
-
36
- --cc-filter-footer-padding: #{map.get($config, footer-padding)};
37
- --cc-filter-footer-gap: #{map.get($config, footer-gap)};
1
+ @use 'sass:map';
2
+
3
+ $default-filter-sidebar-config: (
4
+ // Layout
5
+ width: 100%,
6
+ padding: 1.5rem,
7
+ gap: 1.5rem,
8
+ bg: #FEFEFE,
9
+ border-radius: 0,
10
+
11
+ // Header
12
+ header-height: 3rem,
13
+ header-title-size: 1.125rem,
14
+ header-title-weight: 500,
15
+ header-title-color: #202124,
16
+
17
+ // Footer
18
+ footer-padding: 1rem 0 0 0,
19
+ footer-gap: 1rem,
20
+ );
21
+
22
+ @mixin filter-sidebar-theme($user-config: ()) {
23
+ $config: map.merge($default-filter-sidebar-config, $user-config);
24
+
25
+ --cc-filter-sidebar-width: #{map.get($config, width)};
26
+ --cc-filter-sidebar-padding: #{map.get($config, padding)};
27
+ --cc-filter-sidebar-gap: #{map.get($config, gap)};
28
+ --cc-filter-sidebar-bg: #{map.get($config, bg)};
29
+ --cc-filter-sidebar-border-radius: #{map.get($config, border-radius)};
30
+
31
+ --cc-filter-header-height: #{map.get($config, header-height)};
32
+ --cc-filter-header-title-size: #{map.get($config, header-title-size)};
33
+ --cc-filter-header-title-weight: #{map.get($config, header-title-weight)};
34
+ --cc-filter-header-title-color: #{map.get($config, header-title-color)};
35
+
36
+ --cc-filter-footer-padding: #{map.get($config, footer-padding)};
37
+ --cc-filter-footer-gap: #{map.get($config, footer-gap)};
38
38
  }
package/src/lib/modules/filter-table-selector/filter-table-selector.theme.scss CHANGED
@@ -1,36 +1,36 @@
1
- @use 'sass:map';
2
-
3
- $filter-table-selector-config: (
4
- panel-bg: #ffffff,
5
- filter-panel-width: 220px,
6
- filter-panel-border: 1px solid #dee2e6,
7
- header-bg: #ffffff,
8
- header-border: 1px solid #dee2e6,
9
- header-height: 56px,
10
- header-padding: 0 24px,
11
- header-title-color: #333333,
12
- header-title-font-size: 18px,
13
- header-title-font-weight: 600,
14
- footer-bg: #ffffff,
15
- footer-border: 1px solid #dee2e6,
16
- footer-height: 64px,
17
- footer-padding: 0 24px,
18
- footer-gap: 12px,
19
- body-bg: #f8f9fb,
20
- filter-section-title-color: #666666,
21
- filter-section-title-font-size: 12px,
22
- filter-section-title-font-weight: 600,
23
- selection-count-color: #666666,
24
- selection-count-font-size: 14px,
25
- toolbar-border: 1px solid #dee2e6,
26
- );
27
-
28
- @mixin filter-table-selector-theme($user-config: ()) {
29
- $config: map.merge($filter-table-selector-config, $user-config);
30
-
31
- :root {
32
- @each $key, $value in $config {
33
- --fts-#{$key}: #{$value};
34
- }
35
- }
36
- }
1
+ @use 'sass:map';
2
+
3
+ $filter-table-selector-config: (
4
+ panel-bg: #ffffff,
5
+ filter-panel-width: 220px,
6
+ filter-panel-border: 1px solid #dee2e6,
7
+ header-bg: #ffffff,
8
+ header-border: 1px solid #dee2e6,
9
+ header-height: 56px,
10
+ header-padding: 0 24px,
11
+ header-title-color: #333333,
12
+ header-title-font-size: 18px,
13
+ header-title-font-weight: 600,
14
+ footer-bg: #ffffff,
15
+ footer-border: 1px solid #dee2e6,
16
+ footer-height: 64px,
17
+ footer-padding: 0 24px,
18
+ footer-gap: 12px,
19
+ body-bg: #f8f9fb,
20
+ filter-section-title-color: #666666,
21
+ filter-section-title-font-size: 12px,
22
+ filter-section-title-font-weight: 600,
23
+ selection-count-color: #666666,
24
+ selection-count-font-size: 14px,
25
+ toolbar-border: 1px solid #dee2e6,
26
+ );
27
+
28
+ @mixin filter-table-selector-theme($user-config: ()) {
29
+ $config: map.merge($filter-table-selector-config, $user-config);
30
+
31
+ :root {
32
+ @each $key, $value in $config {
33
+ --fts-#{$key}: #{$value};
34
+ }
35
+ }
36
+ }