@inchurch/matcha-theme 20.0.11 → 20.277.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 (116) hide show
  1. package/abstracts/_colors.scss +404 -404
  2. package/abstracts/_elevation.scss +102 -102
  3. package/abstracts/_functions.scss +1186 -1212
  4. package/abstracts/_media-breakpoint.scss +23 -23
  5. package/abstracts/_theme-api.scss +230 -0
  6. package/abstracts/_typography.scss +127 -127
  7. package/base/_reset.scss +438 -438
  8. package/components/app-page-header.scss +259 -0
  9. package/components/matcha-accordion.scss +293 -157
  10. package/components/matcha-audio-player.scss +1 -2
  11. package/components/matcha-autocomplete.scss +10 -11
  12. package/components/matcha-avatar.scss +173 -33
  13. package/components/matcha-badge.scss +15 -15
  14. package/components/matcha-breadcrumb.scss +231 -126
  15. package/components/matcha-button-toggle.scss +46 -2
  16. package/components/matcha-buttons.scss +908 -784
  17. package/components/matcha-calendar.scss +99 -35
  18. package/components/matcha-cards.scss +58 -33
  19. package/components/matcha-chart-card.scss +5 -12
  20. package/components/matcha-checkbox.scss +191 -490
  21. package/components/matcha-chip.scss +297 -212
  22. package/components/matcha-color-pick.scss +1 -2
  23. package/components/matcha-command-palette.scss +290 -63
  24. package/components/matcha-crop.scss +406 -172
  25. package/components/matcha-date.scss +81 -81
  26. package/components/matcha-divider.scss +86 -31
  27. package/components/matcha-draggable.scss +4 -5
  28. package/components/matcha-drawer.scss +207 -66
  29. package/components/matcha-drop-image.scss +14 -0
  30. package/components/matcha-drop-list.scss +87 -47
  31. package/components/matcha-emoji.scss +2 -2
  32. package/components/matcha-empty-state.scss +195 -83
  33. package/components/matcha-file-uploader.scss +462 -0
  34. package/components/matcha-flag.scss +93 -52
  35. package/components/matcha-footer.scss +67 -164
  36. package/components/matcha-form-field.scss +55 -3
  37. package/components/matcha-form-section.scss +100 -101
  38. package/components/matcha-header.scss +134 -325
  39. package/components/matcha-highlight.scss +65 -197
  40. package/components/matcha-hint-text.scss +25 -4
  41. package/components/matcha-horizontal-tree.scss +316 -317
  42. package/components/matcha-icon.scss +37 -45
  43. package/components/matcha-image.scss +2 -3
  44. package/components/matcha-list.scss +14 -15
  45. package/components/matcha-menu.scss +15 -2
  46. package/components/matcha-modal.scss +59 -86
  47. package/components/matcha-nav.scss +362 -231
  48. package/components/matcha-notification.scss +412 -197
  49. package/components/matcha-option.scss +98 -23
  50. package/components/matcha-page-builder.scss +16 -16
  51. package/components/matcha-paginator.scss +688 -235
  52. package/components/matcha-panel.scss +42 -27
  53. package/components/matcha-profile-card.scss +50 -50
  54. package/components/matcha-progress-bar.scss +257 -153
  55. package/components/matcha-radio.scss +244 -452
  56. package/components/matcha-scrollbar.scss +1 -2
  57. package/components/matcha-scrollbox-shadow.scss +120 -122
  58. package/components/matcha-section.scss +5 -9
  59. package/components/matcha-select-multiple.scss +56 -0
  60. package/components/matcha-select.scss +10 -10
  61. package/components/matcha-skeleton.scss +24 -7
  62. package/components/matcha-slide-toggle.scss +80 -301
  63. package/components/matcha-slider.scss +174 -77
  64. package/components/matcha-snack-bar.scss +123 -131
  65. package/components/matcha-spin.scss +12 -103
  66. package/components/matcha-spinner.scss +76 -57
  67. package/components/matcha-status-pill.scss +82 -0
  68. package/components/matcha-stepper.scss +376 -177
  69. package/components/matcha-table.scss +568 -785
  70. package/components/matcha-tabs.scss +622 -469
  71. package/components/matcha-text-editor.scss +78 -78
  72. package/components/matcha-time.scss +2 -2
  73. package/components/matcha-toolbar.scss +359 -206
  74. package/components/matcha-tooltip.scss +158 -62
  75. package/components/matcha-tree-view.scss +189 -0
  76. package/fonts/manrope/manrope-latin-ext.woff2 +0 -0
  77. package/fonts/manrope/manrope-latin.woff2 +0 -0
  78. package/layout/matcha-page-layout.scss +4 -4
  79. package/main.scss +237 -265
  80. package/package.json +1 -1
  81. package/tokens/_animations-tokens.scss +37 -37
  82. package/tokens/_breakpoints-tokens.scss +35 -26
  83. package/tokens/_color-tokens.scss +1149 -1152
  84. package/tokens/_css-custom-properties.scss +704 -568
  85. package/tokens/_primitives.scss +82 -0
  86. package/tokens/_semantic-aliases.scss +120 -0
  87. package/tokens/_spacing-tokens.scss +94 -94
  88. package/vendors/angular-editor.scss +56 -56
  89. package/vendors/angular-material-fixes.scss +297 -297
  90. package/vendors/charts.scss +92 -92
  91. package/vendors/ng5-slider.scss +56 -56
  92. package/vendors/ngx-material-timepicker.scss +50 -50
  93. package/components/matcha-uploader.scss +0 -215
  94. package/fonts/CircularStd-Black.eot +0 -0
  95. package/fonts/CircularStd-Black.svg +0 -3426
  96. package/fonts/CircularStd-Black.ttf +0 -0
  97. package/fonts/CircularStd-Black.woff +0 -0
  98. package/fonts/CircularStd-Black.woff2 +0 -0
  99. package/fonts/CircularStd-Bold.eot +0 -0
  100. package/fonts/CircularStd-Bold.otf +0 -0
  101. package/fonts/CircularStd-Bold.svg +0 -13532
  102. package/fonts/CircularStd-Bold.ttf +0 -0
  103. package/fonts/CircularStd-Bold.woff +0 -0
  104. package/fonts/CircularStd-Bold.woff2 +0 -0
  105. package/fonts/CircularStd-Medium.eot +0 -0
  106. package/fonts/CircularStd-Medium.otf +0 -0
  107. package/fonts/CircularStd-Medium.svg +0 -13511
  108. package/fonts/CircularStd-Medium.ttf +0 -0
  109. package/fonts/CircularStd-Medium.woff +0 -0
  110. package/fonts/CircularStd-Medium.woff2 +0 -0
  111. package/fonts/CircularStd-Regular.eot +0 -0
  112. package/fonts/CircularStd-Regular.otf +0 -0
  113. package/fonts/CircularStd-Regular.svg +0 -2378
  114. package/fonts/CircularStd-Regular.ttf +0 -0
  115. package/fonts/CircularStd-Regular.woff +0 -0
  116. package/fonts/CircularStd-Regular.woff2 +0 -0
package/main.scss CHANGED
@@ -1,266 +1,238 @@
1
- // TOKENS
2
- @import "./tokens/animations-tokens";
3
- @import "./tokens/breakpoints-tokens";
4
- @import "./tokens/color-tokens";
5
- @import "./tokens/elevation-tokens";
6
- @import "./tokens/spacing-tokens";
7
- @import "./tokens/typography-tokens";
8
- @import "./tokens/css-custom-properties";
9
-
10
- // FUNCTIONS
11
- @import "./abstracts/functions"; // map-contrast() palette() map-color() light-theme() dark-theme() matcha-typography-level() matcha-typography-config() _matcha-get-type-value() matcha-font-size() matcha-line-height() matcha-font-weight() matcha-letter-spacing() matcha-font-family() _get-umbra-map() _get-penumbra-map() _get-ambient-map() elevation-transition-property-value()
12
-
13
- // MIXINS
14
- @import "./abstracts/colors"; // colors-classes-static() colors-classes-dynamic()
15
- @import "./abstracts/elevation"; // elevation() _matcha-theme-elevation() matcha-overridable-elevation() _matcha-theme-overridable-elevation() elevation-transition() elevation-theme()
16
- @import "./abstracts/media-breakpoint"; // media-breakpoint()
17
-
18
- // TYPOGRAPHY
19
- @import "./abstracts/typography"; // matcha-typography-font-shorthand() matcha-typography-level-to-styles() matcha-reset-typography()
20
-
21
- // BASE
22
- @import "./base/reset"; // base-body-reset-theme()
23
-
24
- // COMPONENTS
25
- @import "./components/matcha-audio-player.scss"; //matcha-audio-player-theme($theme)
26
- @import "./components/matcha-autocomplete.scss"; // matcha-autocomplete-theme($theme)
27
- @import "./components/matcha-option.scss"; // matcha-option-theme($theme)
28
- @import "./components/matcha-panel.scss"; // matcha-panel-theme($theme)
29
- @import "./components/matcha-select.scss"; // matcha-select-theme($theme)
30
- @import "./components/matcha-buttons.scss"; // matcha-button-theme($theme)
31
- @import "./components/matcha-button-toggle.scss"; // matcha-button-toggle-theme($theme)
32
- @import "./components/matcha-cards.scss"; // matcha-cards-theme($theme)
33
- @import "./components/matcha-color-pick.scss"; // matcha-color-pick-theme($theme)
34
- @import "./components/matcha-draggable.scss"; // matcha-draggable-theme($theme)
35
- @import "./components/matcha-drop-list.scss"; // matcha-drop-list-theme($theme)
36
- @import "./components/matcha-header.scss"; // matcha-header-theme($theme)
37
- @import "./components/matcha-horizontal-tree.scss"; // matcha-horizontal-tree-theme($theme)
38
- @import "./components/matcha-menu.scss"; // matcha-menu-theme($theme)
39
- @import "./components/matcha-progress-bar.scss"; // matcha-progress-bar-theme($theme)
40
- @import "./components/matcha-scrollbar.scss"; // matcha-scrollbar-theme($theme)
41
- @import "./components/matcha-scrollbox-shadow.scss"; // matcha-scrollbox-shadow-theme($theme)
42
- @import "./components/matcha-skeleton.scss"; // matcha-skeleton-theme($theme)
43
- @import "./components/matcha-table.scss"; // matcha-table-theme($theme)
44
- @import "./components/matcha-table-cell.scss"; // matcha-table-cell-theme($theme)
45
- @import "./components/matcha-tooltip.scss"; // matcha-tooltip-theme($theme)
46
- @import "./components/matcha-form-field.scss";
47
- @import "./components/matcha-checkbox.scss";
48
- @import "./components/matcha-accordion.scss";
49
- @import "./components/matcha-ripple.scss"; // matcha-ripple-theme($theme)
50
- @import "./components/matcha-spin.scss"; // matcha-spin-theme($theme)
51
- @import "./components/matcha-spinner.scss"; // matcha-spinner-theme($theme)
52
- @import "./components/matcha-hint-text.scss"; // matcha-hint-theme($theme)
53
- @import "./components/matcha-slide-toggle.scss"; // matcha-slide-toggle($theme)
54
- @import "./components/matcha-radio.scss"; // matcha-radio($theme)
55
- @import "./components/matcha-avatar.scss"; // matcha-avatar($theme)
56
- @import "./components/matcha-paginator.scss"; // matcha-paginator($theme)
57
- @import "./components/matcha-slider.scss"; // matcha-slider($theme)
58
- @import "./components/matcha-divider.scss"; // matcha-divider($theme)
59
- @import "./components/matcha-highlight.scss"; // matcha-highlight($theme)
60
- @import "./components/matcha-tabs.scss"; // matcha-tabs($theme)
61
- @import "./components/matcha-modal.scss"; // matcha-modal($theme)
62
- @import "./components/matcha-drawer.scss"; // matcha-drawer-theme($theme)
63
- @import "./components/matcha-chip.scss"; // matcha-chip($theme)
64
- @import "./components/matcha-date.scss"; // matcha-date-theme($theme)
65
- @import "./components/matcha-calendar.scss"; // matcha-calendar-theme($theme)
66
- @import "./components/matcha-page-builder.scss"; // matcha-page-builder($theme)
67
- @import "./components/matcha-snack-bar.scss"; // matcha-snack-bar-theme($theme)
68
- @import "./components/matcha-timepicker.scss"; // matcha-timepicker-theme($theme)
69
- @import "./components/matcha-badge.scss"; // matcha-badge-theme($theme)
70
- @import "./components/matcha-empty-state.scss"; // matcha-empty-state-theme($theme)
71
- @import "./components/matcha-nav.scss"; // matcha-nav-theme($theme)
72
- @import "./components/matcha-list.scss"; // matcha-list-theme($theme)
73
- @import "./components/matcha-icon.scss"; // matcha-icon-theme($theme)
74
- @import "./components/matcha-text-editor.scss"; // matcha-text-editor-theme($theme)
75
- @import "./components/matcha-chart-card.scss"; // matcha-chart-card-theme($theme)
76
- @import "./components/matcha-crop.scss"; // matcha-crop-theme($theme)
77
- @import "./components/matcha-footer.scss"; // matcha-footer-theme($theme)
78
- @import "./components/matcha-uploader.scss"; // matcha-uploader-theme($theme)
79
- @import "./components/matcha-notification.scss"; // matcha-notification-theme($theme)
80
- @import "./components/matcha-section.scss"; // matcha-section-theme($theme)
81
- @import "./components/matcha-form-section.scss"; // matcha-form-section-theme($theme)
82
- @import "./components/matcha-breadcrumb.scss"; // matcha-breadcrumb-theme($theme)
83
- @import "./components/matcha-image.scss"; // matcha-image-theme($theme)
84
- @import "./components/matcha-stepper.scss"; // matcha-stepper-theme($theme)
85
- @import "./components/matcha-toolbar.scss"; // matcha-toolbar-theme($theme)
86
- @import "./components/matcha-command-palette.scss"; // matcha-command-palette-theme($theme)
87
- @import "./components/matcha-profile-card.scss"; // matcha-profile-card-theme($theme)
88
- @import "./components/matcha-flag.scss"; // matcha-flag-theme($theme)
89
- @import "./components/matcha-emoji.scss"; // matcha-emoji-theme($theme)
90
-
91
- // LAYOUT
92
- @import "./layout/matcha-page-layout.scss"; // matcha-page-layout-theme($theme)
93
-
94
- // VENDORS
95
- @import "./vendors/angular-editor.scss";
96
- @import "./vendors/angular-material-fixes.scss";
97
- @import "./vendors/calendar.scss";
98
- @import "./vendors/charts.scss";
99
- @import "./vendors/ng5-slider.scss";
100
- @import "./vendors/ngx-material-timepicker.scss";
101
-
102
- // ─── FONT LOADING ────────────────────────────────────────────────────────────
103
- // Manrope (Google Fonts, variable weight 200-800)
104
- //
105
- // RECOMMENDED (non-blocking): add these to your app's <head> BEFORE the CSS:
106
- // <link rel="preconnect" href="https://fonts.googleapis.com">
107
- // <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
108
- // <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap">
109
- //
110
- // PRODUCTION: self-host for best performance https://fonts.google.com/specimen/Manrope
111
- //
112
- // The @import below is a backwards-compatible fallback. It is render-blocking
113
- // and adds ~100-300ms to First Contentful Paint. Prefer <link> in your HTML.
114
- // ─────────────────────────────────────────────────────────────────────────────
115
- @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
116
-
117
- // Legacy fallback — keep CircularStd for existing consumers until fully migrated
118
- @font-face {
119
- font-family: "CircularStd";
120
- src: url("fonts/CircularStd-Regular.eot");
121
- src:
122
- local("☺"),
123
- url("fonts/CircularStd-Regular.woff") format("woff"),
124
- url("fonts/CircularStd-Regular.ttf") format("truetype"),
125
- url("fonts/CircularStd-Regular.svg") format("svg");
126
- font-weight: 400;
127
- font-style: normal;
128
- font-display: swap;
129
- }
130
-
131
- @font-face {
132
- font-family: "CircularStd";
133
- src: url("fonts/CircularStd-Medium.eot");
134
- src:
135
- local("☺"),
136
- url("fonts/CircularStd-Medium.woff") format("woff"),
137
- url("fonts/CircularStd-Medium.ttf") format("truetype"),
138
- url("fonts/CircularStd-Medium.svg") format("svg");
139
- font-weight: 500;
140
- font-style: normal;
141
- font-display: swap;
142
- }
143
-
144
- @font-face {
145
- font-family: "CircularStd";
146
- src: url("fonts/CircularStd-Bold.eot");
147
- src:
148
- local("☺"),
149
- url("fonts/CircularStd-Bold.woff") format("woff"),
150
- url("fonts/CircularStd-Bold.ttf") format("truetype"),
151
- url("fonts/CircularStd-Bold.svg") format("svg");
152
- font-weight: 700;
153
- font-style: normal;
154
- font-display: swap;
155
- }
156
-
157
- @font-face {
158
- font-family: "CircularStd";
159
- src: url("fonts/CircularStd-Black.eot");
160
- src:
161
- local("☺"),
162
- url("fonts/CircularStd-Black.woff") format("woff"),
163
- url("fonts/CircularStd-Black.ttf") format("truetype"),
164
- url("fonts/CircularStd-Black.svg") format("svg");
165
- font-weight: 900;
166
- font-style: normal;
167
- font-display: swap;
168
- }
169
-
170
- // -------------------------------------------------------------------------------------------------------------------
171
- // @ CORE - Mixins and Includes
172
- // -------------------------------------------------------------------------------------------------------------------
173
- @mixin matcha-typography($config: null) {
174
- @if $config ==null {
175
- $config: matcha-typography-config();
176
- }
177
-
178
- @include matcha-reset-typography($config);
179
- }
180
-
181
- @mixin matcha-components($theme) {
182
- @include matcha-css-custom-properties($theme);
183
-
184
- @include colors-classes-dynamic($theme);
185
- @include colors-classes-static($theme);
186
-
187
- @include elevation-theme($theme);
188
-
189
- @include vendor-angular-editor($theme);
190
- @include vendor-angular-material-fixes($theme);
191
- @include vendor-calendar-theme($theme);
192
- @include vendor-chart($theme);
193
- @include vendor-ng-5-theme($theme);
194
- @include vendor-ngx-material-timepicker($theme);
195
-
196
- @include base-typography-theme($theme);
197
- @include base-body-reset-theme($theme);
198
-
199
- @include matcha-cards-theme($theme);
200
- @include matcha-horizontal-tree-theme($theme);
201
- @include matcha-audio-player-theme($theme);
202
- @include matcha-color-pick-theme($theme);
203
- @include matcha-draggable-theme($theme);
204
- @include matcha-scrollbox-shadow($theme);
205
- @include matcha-scrollbar-theme($theme);
206
-
207
- @include matcha-table-theme($theme);
208
- @include matcha-table-cell-theme($theme);
209
- @include matcha-button-toggle($theme);
210
- @include matcha-button-theme($theme);
211
- @include matcha-ripple-theme($theme);
212
- @include matcha-tooltip-theme($theme);
213
- @include matcha-header-theme($theme);
214
- @include matcha-menu-theme($theme);
215
- @include matcha-drop-list-theme($theme);
216
- @include matcha-form-field($theme);
217
- @include matcha-checkbox($theme);
218
- @include matcha-spin($theme);
219
- @include matcha-spinner-theme($theme);
220
- @include matcha-hint-text($theme);
221
- @include matcha-slide-toggle-theme($theme);
222
- @include matcha-tabs($theme);
223
- @include matcha-modal-theme($theme);
224
- @include matcha-skeleton-theme($theme);
225
- @include matcha-radio($theme);
226
- @include matcha-avatar-theme($theme);
227
- @include matcha-drawer-theme($theme);
228
- @include matcha-autocomplete-theme($theme);
229
- @include matcha-panel-theme($theme);
230
- @include matcha-option-theme($theme);
231
- @include matcha-select-theme($theme);
232
- @include matcha-paginator-theme($theme);
233
- @include matcha-slider-theme($theme);
234
- @include matcha-highlight-theme($theme);
235
- @include matcha-divider-theme($theme);
236
- @include matcha-progress-bar-theme($theme);
237
- @include matcha-page-builder-theme($theme);
238
- @include matcha-snack-bar-theme($theme);
239
- @include matcha-chip-theme($theme);
240
- @include matcha-date-theme($theme);
241
- @include matcha-calendar-theme($theme);
242
- @include matcha-timepicker-theme($theme);
243
- @include matcha-badge-theme($theme);
244
- @include matcha-empty-state-theme($theme);
245
- @include matcha-nav-theme($theme);
246
- @include matcha-list-theme($theme);
247
- @include matcha-icon-theme($theme);
248
- @include matcha-text-editor-theme($theme);
249
- @include matcha-chart-card-theme($theme);
250
- @include matcha-crop-theme($theme);
251
- @include matcha-footer-theme($theme);
252
- @include matcha-uploader-theme($theme);
253
- @include matcha-notification-theme($theme);
254
- @include matcha-section-theme($theme);
255
- @include matcha-form-section-theme($theme);
256
- @include matcha-accordion-theme($theme);
257
- @include matcha-breadcrumb-theme($theme);
258
- @include matcha-image-theme($theme);
259
- @include matcha-stepper-theme($theme);
260
- @include matcha-toolbar-theme($theme);
261
- @include matcha-command-palette-theme($theme);
262
- @include matcha-profile-card-theme($theme);
263
- @include matcha-flag-theme($theme);
264
- @include matcha-emoji-theme($theme);
265
- @include matcha-page-layout-theme($theme);
1
+ // TOKENS
2
+ @import "./tokens/animations-tokens";
3
+ @import "./tokens/breakpoints-tokens";
4
+ @import "./tokens/color-tokens";
5
+ @import "./tokens/elevation-tokens";
6
+ @import "./tokens/spacing-tokens";
7
+ @import "./tokens/typography-tokens";
8
+ @import "./tokens/css-custom-properties";
9
+ @import "./tokens/primitives"; // matcha-primitives() — Camada 1: CSS vars de primitivas (--matcha-prim-*) em :root
10
+ @import "./tokens/semantic-aliases"; // $matcha-prim-aliases-{light,dark} — Camada 2: token semântico → primitiva (rota clássica emite var)
11
+
12
+ // FUNCTIONS
13
+ @import "./abstracts/functions"; // map-contrast() palette() map-color() light-theme() dark-theme() matcha-typography-level() matcha-typography-config() _matcha-get-type-value() matcha-font-size() matcha-line-height() matcha-font-weight() matcha-letter-spacing() matcha-font-family() _get-umbra-map() _get-penumbra-map() _get-ambient-map() elevation-transition-property-value()
14
+
15
+ // MIXINS
16
+ @import "./abstracts/theme-api"; // matcha-define-theme() matcha-build-color-map() matcha-role-tokens() matcha-text-on() matcha-contrast-on()
17
+ @import "./abstracts/colors"; // colors-classes-static() colors-classes-dynamic()
18
+ @import "./abstracts/elevation"; // elevation() _matcha-theme-elevation() matcha-overridable-elevation() _matcha-theme-overridable-elevation() elevation-transition() elevation-theme()
19
+ @import "./abstracts/media-breakpoint"; // media-breakpoint()
20
+
21
+ // TYPOGRAPHY
22
+ @import "./abstracts/typography"; // matcha-typography-font-shorthand() matcha-typography-level-to-styles() matcha-reset-typography()
23
+
24
+ // BASE
25
+ @import "./base/reset"; // base-body-reset-theme()
26
+
27
+ // COMPONENTS
28
+ @import "./components/matcha-audio-player.scss"; //matcha-audio-player-theme($theme)
29
+ @import "./components/matcha-autocomplete.scss"; // matcha-autocomplete-theme($theme)
30
+ @import "./components/matcha-option.scss"; // matcha-option-theme($theme)
31
+ @import "./components/matcha-panel.scss"; // matcha-panel-theme($theme)
32
+ @import "./components/matcha-select.scss"; // matcha-select-theme($theme)
33
+ @import "./components/matcha-select-multiple.scss"; // matcha-select-multiple-theme($theme)
34
+ @import "./components/matcha-buttons.scss"; // matcha-button-theme($theme)
35
+ @import "./components/matcha-button-toggle.scss"; // matcha-button-toggle-theme($theme)
36
+ @import "./components/matcha-cards.scss"; // matcha-cards-theme($theme)
37
+ @import "./components/matcha-color-pick.scss"; // matcha-color-pick-theme($theme)
38
+ @import "./components/matcha-draggable.scss"; // matcha-draggable-theme($theme)
39
+ @import "./components/matcha-drop-list.scss"; // matcha-drop-list-theme($theme)
40
+ @import "./components/matcha-header.scss"; // matcha-header-theme($theme) — lib component DSV3
41
+ @import "./components/app-page-header.scss"; // app-page-header-theme($theme) — page-header LEGACY da app
42
+ @import "./components/matcha-horizontal-tree.scss"; // matcha-horizontal-tree-theme($theme)
43
+ @import "./components/matcha-menu.scss"; // matcha-menu-theme($theme)
44
+ @import "./components/matcha-progress-bar.scss"; // matcha-progress-bar-theme($theme)
45
+ @import "./components/matcha-scrollbar.scss"; // matcha-scrollbar-theme($theme)
46
+ @import "./components/matcha-scrollbox-shadow.scss"; // matcha-scrollbox-shadow-theme($theme)
47
+ @import "./components/matcha-skeleton.scss"; // matcha-skeleton-theme($theme)
48
+ @import "./components/matcha-table.scss"; // matcha-table-modern (canon DSV3 1:1 Figma)
49
+ @import "./components/matcha-table-cell.scss"; // matcha-table-cell-theme($theme)
50
+ @import "./components/matcha-tooltip.scss"; // matcha-tooltip-theme($theme)
51
+ @import "./components/matcha-form-field.scss";
52
+ @import "./components/matcha-checkbox.scss";
53
+ @import "./components/matcha-accordion.scss";
54
+ @import "./components/matcha-ripple.scss"; // matcha-ripple-theme($theme)
55
+ @import "./components/matcha-spin.scss"; // matcha-spin-theme($theme)
56
+ @import "./components/matcha-spinner.scss"; // matcha-spinner-theme($theme)
57
+ @import "./components/matcha-hint-text.scss"; // matcha-hint-theme($theme)
58
+ @import "./components/matcha-slide-toggle.scss"; // matcha-slide-toggle($theme)
59
+ @import "./components/matcha-radio.scss"; // matcha-radio($theme)
60
+ @import "./components/matcha-avatar.scss"; // matcha-avatar($theme)
61
+ @import "./components/matcha-paginator.scss"; // matcha-paginator($theme)
62
+ @import "./components/matcha-slider.scss"; // matcha-slider($theme)
63
+ @import "./components/matcha-divider.scss"; // matcha-divider($theme)
64
+ @import "./components/matcha-highlight.scss"; // matcha-highlight($theme)
65
+ @import "./components/matcha-tabs.scss"; // matcha-tabs($theme)
66
+ @import "./components/matcha-modal.scss"; // matcha-modal($theme)
67
+ @import "./components/matcha-drawer.scss"; // matcha-drawer-theme($theme)
68
+ @import "./components/matcha-chip.scss"; // matcha-chip($theme)
69
+ @import "./components/matcha-status-pill.scss"; // matcha-status-pill
70
+ @import "./components/matcha-date.scss"; // matcha-date-theme($theme)
71
+ @import "./components/matcha-calendar.scss"; // matcha-calendar-theme($theme)
72
+ @import "./components/matcha-page-builder.scss"; // matcha-page-builder($theme)
73
+ @import "./components/matcha-snack-bar.scss"; // matcha-snack-bar-theme($theme)
74
+ @import "./components/matcha-timepicker.scss"; // matcha-timepicker-theme($theme)
75
+ @import "./components/matcha-badge.scss"; // matcha-badge-theme($theme)
76
+ @import "./components/matcha-empty-state.scss"; // matcha-empty-state-theme($theme)
77
+ @import "./components/matcha-tree-view.scss"; // matcha-tree-view-theme($theme)
78
+ @import "./components/matcha-nav.scss"; // matcha-nav-theme($theme)
79
+ @import "./components/matcha-list.scss"; // matcha-list-theme($theme)
80
+ @import "./components/matcha-icon.scss"; // matcha-icon-theme($theme)
81
+ @import "./components/matcha-text-editor.scss"; // matcha-text-editor-theme($theme)
82
+ @import "./components/matcha-chart-card.scss"; // matcha-chart-card-theme($theme)
83
+ @import "./components/matcha-crop.scss"; // matcha-crop-theme($theme)
84
+ @import "./components/matcha-footer.scss"; // matcha-footer-theme($theme)
85
+ @import "./components/matcha-file-uploader.scss"; // matcha-file-uploader-theme($theme)
86
+ @import "./components/matcha-drop-image.scss"; // matcha-drop-image-theme($theme)
87
+ @import "./components/matcha-notification.scss"; // matcha-notification-theme($theme)
88
+ @import "./components/matcha-section.scss"; // matcha-section-theme($theme)
89
+ @import "./components/matcha-form-section.scss"; // matcha-form-section-theme($theme)
90
+ @import "./components/matcha-breadcrumb.scss"; // matcha-breadcrumb-theme($theme)
91
+ @import "./components/matcha-image.scss"; // matcha-image-theme($theme)
92
+ @import "./components/matcha-stepper.scss"; // matcha-stepper-theme($theme)
93
+ @import "./components/matcha-toolbar.scss"; // matcha-toolbar-modern (canon DSV3 1:1 Figma 15866:92)
94
+ @import "./components/matcha-command-palette.scss"; // matcha-command-palette-theme($theme)
95
+ @import "./components/matcha-profile-card.scss"; // matcha-profile-card-theme($theme)
96
+ @import "./components/matcha-flag.scss"; // matcha-flag-theme($theme)
97
+ @import "./components/matcha-emoji.scss"; // matcha-emoji-theme($theme)
98
+
99
+ // LAYOUT
100
+ @import "./layout/matcha-page-layout.scss"; // matcha-page-layout-theme($theme)
101
+
102
+ // VENDORS
103
+ @import "./vendors/angular-editor.scss";
104
+ @import "./vendors/angular-material-fixes.scss";
105
+ @import "./vendors/calendar.scss";
106
+ @import "./vendors/charts.scss";
107
+ @import "./vendors/ng5-slider.scss";
108
+ @import "./vendors/ngx-material-timepicker.scss";
109
+
110
+ // ─── FONT LOADING — Manrope (SELF-HOSTED · zero dependência externa) ─────────
111
+ // REGRA DE OURO: fontes self-hosted, nunca @import/<link> do Google Fonts.
112
+ // Variable font (weight 400–800), woff2 local em fonts/manrope/.
113
+ // Atualizar: baixar de https://fonts.google.com/specimen/Manrope (licença OFL),
114
+ // pegar os woff2 latin + latin-ext e substituir os arquivos abaixo.
115
+ @font-face {
116
+ font-family: "Manrope";
117
+ font-style: normal;
118
+ font-weight: 400 800;
119
+ font-display: swap;
120
+ src: url("fonts/manrope/manrope-latin.woff2") format("woff2");
121
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
122
+ }
123
+ @font-face {
124
+ font-family: "Manrope";
125
+ font-style: normal;
126
+ font-weight: 400 800;
127
+ font-display: swap;
128
+ src: url("fonts/manrope/manrope-latin-ext.woff2") format("woff2");
129
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
130
+ }
131
+
132
+ // CircularStd removido (2026-06-03): fonte comercial licenciada + fora da regra de
133
+ // ouro. Fonte canônica do DS é a Manrope (self-hosted acima). O token
134
+ // --matcha-font-family já resolve para 'Manrope'.
135
+
136
+ // -------------------------------------------------------------------------------------------------------------------
137
+ // @ CORE - Mixins and Includes
138
+ // -------------------------------------------------------------------------------------------------------------------
139
+ @mixin matcha-typography($config: null) {
140
+ @if $config ==null {
141
+ $config: matcha-typography-config();
142
+ }
143
+
144
+ @include matcha-reset-typography($config);
145
+ }
146
+
147
+ @mixin matcha-components($theme) {
148
+ @include matcha-css-custom-properties($theme);
149
+
150
+ @include colors-classes-dynamic($theme);
151
+ @include colors-classes-static($theme);
152
+
153
+ @include elevation-theme($theme);
154
+
155
+ @include vendor-angular-editor($theme);
156
+ @include vendor-angular-material-fixes($theme);
157
+ @include vendor-calendar-theme($theme);
158
+ @include vendor-chart($theme);
159
+ @include vendor-ng-5-theme($theme);
160
+ @include vendor-ngx-material-timepicker($theme);
161
+
162
+ @include base-typography-theme($theme);
163
+ @include base-body-reset-theme($theme);
164
+
165
+ @include matcha-cards-theme($theme);
166
+ @include matcha-horizontal-tree-theme($theme);
167
+ @include matcha-audio-player-theme($theme);
168
+ @include matcha-color-pick-theme($theme);
169
+ @include matcha-draggable-theme($theme);
170
+ @include matcha-scrollbox-shadow($theme);
171
+ @include matcha-scrollbar-theme($theme);
172
+
173
+ @include matcha-table-cell-theme($theme);
174
+ @include matcha-table-modern($theme); // canon DSV3 1:1 Figma 15641:275
175
+ @include matcha-toolbar($theme); // canon DSV3 1:1 Figma 15866:92
176
+ @include matcha-button-toggle($theme);
177
+ @include matcha-button-theme($theme);
178
+ @include matcha-ripple-theme($theme);
179
+ @include matcha-tooltip-theme($theme);
180
+ @include matcha-header-theme($theme);
181
+ @include app-page-header-theme($theme);
182
+ @include matcha-menu-theme($theme);
183
+ @include matcha-drop-list-theme($theme);
184
+ @include matcha-form-field($theme);
185
+ @include matcha-checkbox($theme);
186
+ @include matcha-spin($theme);
187
+ @include matcha-spinner-theme($theme);
188
+ @include matcha-hint-text($theme);
189
+ @include matcha-slide-toggle-theme($theme);
190
+ @include matcha-tabs($theme);
191
+ @include matcha-tabs-modern($theme);
192
+ @include matcha-modal-theme($theme);
193
+ @include matcha-skeleton-theme($theme);
194
+ @include matcha-radio($theme);
195
+ @include matcha-avatar-theme($theme);
196
+ @include matcha-drawer-theme($theme);
197
+ @include matcha-autocomplete-theme($theme);
198
+ @include matcha-panel-theme($theme);
199
+ @include matcha-option-theme($theme);
200
+ @include matcha-select-theme($theme);
201
+ @include matcha-select-multiple-theme($theme);
202
+ @include matcha-paginator-theme($theme);
203
+ @include matcha-slider-theme($theme);
204
+ @include matcha-highlight-theme($theme);
205
+ @include matcha-divider-theme($theme);
206
+ @include matcha-chip-theme($theme);
207
+ @include matcha-progress-bar-theme($theme);
208
+ @include matcha-page-builder-theme($theme);
209
+ @include matcha-snack-bar-theme($theme);
210
+ @include matcha-chip-theme($theme);
211
+ @include matcha-date-theme($theme);
212
+ @include matcha-calendar-theme($theme);
213
+ @include matcha-timepicker-theme($theme);
214
+ @include matcha-badge-theme($theme);
215
+ @include matcha-empty-state-theme($theme);
216
+ @include matcha-tree-view-theme($theme);
217
+ @include matcha-nav-theme($theme);
218
+ @include matcha-list-theme($theme);
219
+ @include matcha-icon-theme($theme);
220
+ @include matcha-text-editor-theme($theme);
221
+ @include matcha-chart-card-theme($theme);
222
+ @include matcha-crop-theme($theme);
223
+ @include matcha-footer-theme($theme);
224
+ @include matcha-file-uploader-theme($theme);
225
+ @include matcha-drop-image-theme($theme);
226
+ @include matcha-notification-theme($theme);
227
+ @include matcha-section-theme($theme);
228
+ @include matcha-form-section-theme($theme);
229
+ @include matcha-accordion-theme($theme);
230
+ @include matcha-breadcrumb-theme($theme);
231
+ @include matcha-image-theme($theme);
232
+ @include matcha-stepper-theme($theme);
233
+ @include matcha-command-palette-theme($theme);
234
+ @include matcha-profile-card-theme($theme);
235
+ @include matcha-flag($theme);
236
+ @include matcha-emoji-theme($theme);
237
+ @include matcha-page-layout-theme($theme);
266
238
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@inchurch/matcha-theme",
3
- "version": "20.0.11",
3
+ "version": "20.277.0",
4
4
  "description": "Themes for matcha-design-system",
5
5
  "main": "main.scss",
6
6
  "scripts": {
@@ -1,37 +1,37 @@
1
- // Easing Curves
2
- // TODO(jelbourn): all of these need to be revisited
3
-
4
- // The default animation curves used by material design.
5
- $time-transition-minimal: 80;
6
- $time-transition-short: 200;
7
- $time-transition-base: 400;
8
- $time-transition-long: 600;
9
- $time-transition-xl: 1000;
10
- $time-delay-short: 50;
11
- $time-delay-base: 100;
12
- $time-delay-long: 200;
13
- $time-duration-short: 2000;
14
- $time-duration-base: 4000;
15
- $time-duration-long: 6000;
16
-
17
- $matcha-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;
18
- $matcha-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;
19
- $matcha-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;
20
-
21
- $ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;
22
-
23
- $swift-ease-out-duration: #{$time-transition-base}ms !default;
24
- $swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
25
- $swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;
26
-
27
- $swift-ease-in-duration: #{$time-transition-short}ms !default;
28
- $swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;
29
- $swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;
30
-
31
- $swift-ease-in-out-duration: #{$time-transition-long}ms !default;
32
- $swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;
33
- $swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;
34
-
35
- $swift-linear-duration: #{$time-transition-minimal}ms !default;
36
- $swift-linear-timing-function: linear !default;
37
- $swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;
1
+ // Easing Curves
2
+ // TODO(jelbourn): all of these need to be revisited
3
+
4
+ // The default animation curves used by material design.
5
+ $time-transition-minimal: 80;
6
+ $time-transition-short: 200;
7
+ $time-transition-base: 400;
8
+ $time-transition-long: 600;
9
+ $time-transition-xl: 1000;
10
+ $time-delay-short: 50;
11
+ $time-delay-base: 100;
12
+ $time-delay-long: 200;
13
+ $time-duration-short: 2000;
14
+ $time-duration-base: 4000;
15
+ $time-duration-long: 6000;
16
+
17
+ $matcha-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;
18
+ $matcha-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;
19
+ $matcha-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;
20
+
21
+ $ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;
22
+
23
+ $swift-ease-out-duration: #{$time-transition-base}ms !default;
24
+ $swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
25
+ $swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;
26
+
27
+ $swift-ease-in-duration: #{$time-transition-short}ms !default;
28
+ $swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;
29
+ $swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;
30
+
31
+ $swift-ease-in-out-duration: #{$time-transition-long}ms !default;
32
+ $swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;
33
+ $swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;
34
+
35
+ $swift-linear-duration: #{$time-transition-minimal}ms !default;
36
+ $swift-linear-timing-function: linear !default;
37
+ $swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;