@inchurch/matcha-theme 20.0.8 → 20.276.0

package/main.scss

@@ -1,262 +1,233 @@
-// TOKENS
-@import "./tokens/animations-tokens";
-@import "./tokens/breakpoints-tokens";
-@import "./tokens/color-tokens";
-@import "./tokens/elevation-tokens";
-@import "./tokens/spacing-tokens";
-@import "./tokens/typography-tokens";
-@import "./tokens/css-custom-properties";
-
-// FUNCTIONS
-@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()
-
-// MIXINS
-@import "./abstracts/colors"; // colors-classes-static() colors-classes-dynamic()
-@import "./abstracts/elevation"; // elevation() _matcha-theme-elevation() matcha-overridable-elevation() _matcha-theme-overridable-elevation() elevation-transition() elevation-theme()
-@import "./abstracts/media-breakpoint"; // media-breakpoint()
-
-// TYPOGRAPHY
-@import "./abstracts/typography"; // matcha-typography-font-shorthand() matcha-typography-level-to-styles() matcha-reset-typography()
-
-// BASE
-@import "./base/reset"; // base-body-reset-theme()
-
-// COMPONENTS
-@import "./components/matcha-audio-player.scss"; //matcha-audio-player-theme($theme)
-@import "./components/matcha-autocomplete.scss"; // matcha-autocomplete-theme($theme)
-@import "./components/matcha-option.scss"; // matcha-option-theme($theme)
-@import "./components/matcha-panel.scss"; // matcha-panel-theme($theme)
-@import "./components/matcha-select.scss"; // matcha-select-theme($theme)
-@import "./components/matcha-buttons.scss"; // matcha-button-theme($theme)
-@import "./components/matcha-button-toggle.scss"; // matcha-button-toggle-theme($theme)
-@import "./components/matcha-cards.scss"; // matcha-cards-theme($theme)
-@import "./components/matcha-color-pick.scss"; // matcha-color-pick-theme($theme)
-@import "./components/matcha-draggable.scss"; // matcha-draggable-theme($theme)
-@import "./components/matcha-drop-list.scss"; // matcha-drop-list-theme($theme)
-@import "./components/matcha-header.scss"; // matcha-header-theme($theme)
-@import "./components/matcha-horizontal-tree.scss"; // matcha-horizontal-tree-theme($theme)
-@import "./components/matcha-menu.scss"; // matcha-menu-theme($theme)
-@import "./components/matcha-progress-bar.scss"; // matcha-progress-bar-theme($theme)
-@import "./components/matcha-scrollbar.scss"; // matcha-scrollbar-theme($theme)
-@import "./components/matcha-scrollbox-shadow.scss"; // matcha-scrollbox-shadow-theme($theme)
-@import "./components/matcha-skeleton.scss"; // matcha-skeleton-theme($theme)
-@import "./components/matcha-table.scss"; // matcha-table-theme($theme)
-@import "./components/matcha-table-cell.scss"; // matcha-table-cell-theme($theme)
-@import "./components/matcha-tooltip.scss"; // matcha-tooltip-theme($theme)
-@import "./components/matcha-form-field.scss";
-@import "./components/matcha-checkbox.scss";
-@import "./components/matcha-accordion.scss";
-@import "./components/matcha-ripple.scss"; // matcha-ripple-theme($theme)
-@import "./components/matcha-spin.scss"; // matcha-spin-theme($theme)
-@import "./components/matcha-spinner.scss"; // matcha-spinner-theme($theme)
-@import "./components/matcha-hint-text.scss"; // matcha-hint-theme($theme)
-@import "./components/matcha-slide-toggle.scss"; // matcha-slide-toggle($theme)
-@import "./components/matcha-radio.scss"; // matcha-radio($theme)
-@import "./components/matcha-avatar.scss"; // matcha-avatar($theme)
-@import "./components/matcha-paginator.scss"; // matcha-paginator($theme)
-@import "./components/matcha-slider.scss"; // matcha-slider($theme)
-@import "./components/matcha-divider.scss"; // matcha-divider($theme)
-@import "./components/matcha-highlight.scss"; // matcha-highlight($theme)
-@import "./components/matcha-tabs.scss"; // matcha-tabs($theme)
-@import "./components/matcha-modal.scss"; // matcha-modal($theme)
-@import "./components/matcha-drawer.scss"; // matcha-drawer-theme($theme)
-@import "./components/matcha-chip.scss"; // matcha-chip($theme)
-@import "./components/matcha-date.scss"; // matcha-date-theme($theme)
-@import "./components/matcha-calendar.scss"; // matcha-calendar-theme($theme)
-@import "./components/matcha-page-builder.scss"; // matcha-page-builder($theme)
-@import "./components/matcha-snack-bar.scss"; // matcha-snack-bar-theme($theme)
-@import "./components/matcha-timepicker.scss"; // matcha-timepicker-theme($theme)
-@import "./components/matcha-badge.scss"; // matcha-badge-theme($theme)
-@import "./components/matcha-empty-state.scss"; // matcha-empty-state-theme($theme)
-@import "./components/matcha-nav.scss"; // matcha-nav-theme($theme)
-@import "./components/matcha-list.scss"; // matcha-list-theme($theme)
-@import "./components/matcha-icon.scss"; // matcha-icon-theme($theme)
-@import "./components/matcha-text-editor.scss"; // matcha-text-editor-theme($theme)
-@import "./components/matcha-chart-card.scss"; // matcha-chart-card-theme($theme)
-@import "./components/matcha-crop.scss"; // matcha-crop-theme($theme)
-@import "./components/matcha-footer.scss"; // matcha-footer-theme($theme)
-@import "./components/matcha-uploader.scss"; // matcha-uploader-theme($theme)
-@import "./components/matcha-notification.scss"; // matcha-notification-theme($theme)
-@import "./components/matcha-section.scss"; // matcha-section-theme($theme)
-@import "./components/matcha-form-section.scss"; // matcha-form-section-theme($theme)
-@import "./components/matcha-breadcrumb.scss"; // matcha-breadcrumb-theme($theme)
-@import "./components/matcha-image.scss"; // matcha-image-theme($theme)
-@import "./components/matcha-stepper.scss"; // matcha-stepper-theme($theme)
-@import "./components/matcha-toolbar.scss"; // matcha-toolbar-theme($theme)
-@import "./components/matcha-command-palette.scss"; // matcha-command-palette-theme($theme)
-@import "./components/matcha-profile-card.scss"; // matcha-profile-card-theme($theme)
-@import "./components/matcha-flag.scss"; // matcha-flag-theme($theme)
-@import "./components/matcha-emoji.scss"; // matcha-emoji-theme($theme)
-
-// VENDORS
-@import "./vendors/angular-editor.scss";
-@import "./vendors/angular-material-fixes.scss";
-@import "./vendors/calendar.scss";
-@import "./vendors/charts.scss";
-@import "./vendors/ng5-slider.scss";
-@import "./vendors/ngx-material-timepicker.scss";
-
-// ─── FONT LOADING ────────────────────────────────────────────────────────────
-// Manrope (Google Fonts, variable weight 200-800)
-//
-// RECOMMENDED (non-blocking): add these to your app's <head> BEFORE the CSS:
-//   <link rel="preconnect" href="https://fonts.googleapis.com">
-//   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-//   <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap">
-//
-// PRODUCTION: self-host for best performance — https://fonts.google.com/specimen/Manrope
-//
-// The @import below is a backwards-compatible fallback. It is render-blocking
-// and adds ~100-300ms to First Contentful Paint. Prefer <link> in your HTML.
-// ─────────────────────────────────────────────────────────────────────────────
-@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
-
-// Legacy fallback — keep CircularStd for existing consumers until fully migrated
-@font-face {
-    font-family: "CircularStd";
-    src: url("fonts/CircularStd-Regular.eot");
-    src:
-        local("☺"),
-        url("fonts/CircularStd-Regular.woff") format("woff"),
-        url("fonts/CircularStd-Regular.ttf") format("truetype"),
-        url("fonts/CircularStd-Regular.svg") format("svg");
-    font-weight: 400;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: "CircularStd";
-    src: url("fonts/CircularStd-Medium.eot");
-    src:
-        local("☺"),
-        url("fonts/CircularStd-Medium.woff") format("woff"),
-        url("fonts/CircularStd-Medium.ttf") format("truetype"),
-        url("fonts/CircularStd-Medium.svg") format("svg");
-    font-weight: 500;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: "CircularStd";
-    src: url("fonts/CircularStd-Bold.eot");
-    src:
-        local("☺"),
-        url("fonts/CircularStd-Bold.woff") format("woff"),
-        url("fonts/CircularStd-Bold.ttf") format("truetype"),
-        url("fonts/CircularStd-Bold.svg") format("svg");
-    font-weight: 700;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: "CircularStd";
-    src: url("fonts/CircularStd-Black.eot");
-    src:
-        local("☺"),
-        url("fonts/CircularStd-Black.woff") format("woff"),
-        url("fonts/CircularStd-Black.ttf") format("truetype"),
-        url("fonts/CircularStd-Black.svg") format("svg");
-    font-weight: 900;
-    font-style: normal;
-    font-display: swap;
-}
-
-// -------------------------------------------------------------------------------------------------------------------
-// @ CORE - Mixins and Includes
-// -------------------------------------------------------------------------------------------------------------------
-@mixin matcha-typography($config: null) {
-    @if $config ==null {
-        $config: matcha-typography-config();
-    }
-
-    @include matcha-reset-typography($config);
-}
-
-@mixin matcha-components($theme) {
-    @include matcha-css-custom-properties($theme);
-
-    @include colors-classes-dynamic($theme);
-    @include colors-classes-static($theme);
-
-    @include elevation-theme($theme);
-
-    @include vendor-angular-editor($theme);
-    @include vendor-angular-material-fixes($theme);
-    @include vendor-calendar-theme($theme);
-    @include vendor-chart($theme);
-    @include vendor-ng-5-theme($theme);
-    @include vendor-ngx-material-timepicker($theme);
-
-    @include base-typography-theme($theme);
-    @include base-body-reset-theme($theme);
-
-    @include matcha-cards-theme($theme);
-    @include matcha-horizontal-tree-theme($theme);
-    @include matcha-audio-player-theme($theme);
-    @include matcha-color-pick-theme($theme);
-    @include matcha-draggable-theme($theme);
-    @include matcha-scrollbox-shadow($theme);
-    @include matcha-scrollbar-theme($theme);
-
-    @include matcha-table-theme($theme);
-    @include matcha-table-cell-theme($theme);
-    @include matcha-button-toggle($theme);
-    @include matcha-button-theme($theme);
-    @include matcha-ripple-theme($theme);
-    @include matcha-tooltip-theme($theme);
-    @include matcha-header-theme($theme);
-    @include matcha-menu-theme($theme);
-    @include matcha-drop-list-theme($theme);
-    @include matcha-form-field($theme);
-    @include matcha-checkbox($theme);
-    @include matcha-spin($theme);
-    @include matcha-spinner-theme($theme);
-    @include matcha-hint-text($theme);
-    @include matcha-slide-toggle-theme($theme);
-    @include matcha-tabs($theme);
-    @include matcha-modal-theme($theme);
-    @include matcha-skeleton-theme($theme);
-    @include matcha-radio($theme);
-    @include matcha-avatar-theme($theme);
-    @include matcha-drawer-theme($theme);
-    @include matcha-autocomplete-theme($theme);
-    @include matcha-panel-theme($theme);
-    @include matcha-option-theme($theme);
-    @include matcha-select-theme($theme);
-    @include matcha-paginator-theme($theme);
-    @include matcha-slider-theme($theme);
-    @include matcha-highlight-theme($theme);
-    @include matcha-divider-theme($theme);
-    @include matcha-progress-bar-theme($theme);
-    @include matcha-page-builder-theme($theme);
-    @include matcha-snack-bar-theme($theme);
-    @include matcha-chip-theme($theme);
-    @include matcha-date-theme($theme);
-    @include matcha-calendar-theme($theme);
-    @include matcha-timepicker-theme($theme);
-    @include matcha-badge-theme($theme);
-    @include matcha-empty-state-theme($theme);
-    @include matcha-nav-theme($theme);
-    @include matcha-list-theme($theme);
-    @include matcha-icon-theme($theme);
-    @include matcha-text-editor-theme($theme);
-    @include matcha-chart-card-theme($theme);
-    @include matcha-crop-theme($theme);
-    @include matcha-footer-theme($theme);
-    @include matcha-uploader-theme($theme);
-    @include matcha-notification-theme($theme);
-    @include matcha-section-theme($theme);
-    @include matcha-form-section-theme($theme);
-    @include matcha-accordion-theme($theme);
-    @include matcha-breadcrumb-theme($theme);
-    @include matcha-image-theme($theme);
-    @include matcha-stepper-theme($theme);
-    @include matcha-toolbar-theme($theme);
-    @include matcha-command-palette-theme($theme);
-    @include matcha-profile-card-theme($theme);
-    @include matcha-flag-theme($theme);
-    @include matcha-emoji-theme($theme);
+// TOKENS
+@import "./tokens/animations-tokens";
+@import "./tokens/breakpoints-tokens";
+@import "./tokens/color-tokens";
+@import "./tokens/elevation-tokens";
+@import "./tokens/spacing-tokens";
+@import "./tokens/typography-tokens";
+@import "./tokens/css-custom-properties";
+
+// FUNCTIONS
+@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()
+
+// MIXINS
+@import "./abstracts/colors"; // colors-classes-static() colors-classes-dynamic()
+@import "./abstracts/elevation"; // elevation() _matcha-theme-elevation() matcha-overridable-elevation() _matcha-theme-overridable-elevation() elevation-transition() elevation-theme()
+@import "./abstracts/media-breakpoint"; // media-breakpoint()
+
+// TYPOGRAPHY
+@import "./abstracts/typography"; // matcha-typography-font-shorthand() matcha-typography-level-to-styles() matcha-reset-typography()
+
+// BASE
+@import "./base/reset"; // base-body-reset-theme()
+
+// COMPONENTS
+@import "./components/matcha-audio-player.scss"; //matcha-audio-player-theme($theme)
+@import "./components/matcha-autocomplete.scss"; // matcha-autocomplete-theme($theme)
+@import "./components/matcha-option.scss"; // matcha-option-theme($theme)
+@import "./components/matcha-panel.scss"; // matcha-panel-theme($theme)
+@import "./components/matcha-select.scss"; // matcha-select-theme($theme)
+@import "./components/matcha-buttons.scss"; // matcha-button-theme($theme)
+@import "./components/matcha-button-toggle.scss"; // matcha-button-toggle-theme($theme)
+@import "./components/matcha-cards.scss"; // matcha-cards-theme($theme)
+@import "./components/matcha-color-pick.scss"; // matcha-color-pick-theme($theme)
+@import "./components/matcha-draggable.scss"; // matcha-draggable-theme($theme)
+@import "./components/matcha-drop-list.scss"; // matcha-drop-list-theme($theme)
+@import "./components/matcha-header.scss"; // matcha-header-theme($theme) — lib component DSV3
+@import "./components/app-page-header.scss"; // app-page-header-theme($theme) — page-header LEGACY da app
+@import "./components/matcha-horizontal-tree.scss"; // matcha-horizontal-tree-theme($theme)
+@import "./components/matcha-menu.scss"; // matcha-menu-theme($theme)
+@import "./components/matcha-progress-bar.scss"; // matcha-progress-bar-theme($theme)
+@import "./components/matcha-scrollbar.scss"; // matcha-scrollbar-theme($theme)
+@import "./components/matcha-scrollbox-shadow.scss"; // matcha-scrollbox-shadow-theme($theme)
+@import "./components/matcha-skeleton.scss"; // matcha-skeleton-theme($theme)
+@import "./components/matcha-table.scss"; // matcha-table-modern (canon DSV3 1:1 Figma)
+@import "./components/matcha-table-cell.scss"; // matcha-table-cell-theme($theme)
+@import "./components/matcha-tooltip.scss"; // matcha-tooltip-theme($theme)
+@import "./components/matcha-form-field.scss";
+@import "./components/matcha-checkbox.scss";
+@import "./components/matcha-accordion.scss";
+@import "./components/matcha-ripple.scss"; // matcha-ripple-theme($theme)
+@import "./components/matcha-spin.scss"; // matcha-spin-theme($theme)
+@import "./components/matcha-spinner.scss"; // matcha-spinner-theme($theme)
+@import "./components/matcha-hint-text.scss"; // matcha-hint-theme($theme)
+@import "./components/matcha-slide-toggle.scss"; // matcha-slide-toggle($theme)
+@import "./components/matcha-radio.scss"; // matcha-radio($theme)
+@import "./components/matcha-avatar.scss"; // matcha-avatar($theme)
+@import "./components/matcha-paginator.scss"; // matcha-paginator($theme)
+@import "./components/matcha-slider.scss"; // matcha-slider($theme)
+@import "./components/matcha-divider.scss"; // matcha-divider($theme)
+@import "./components/matcha-highlight.scss"; // matcha-highlight($theme)
+@import "./components/matcha-tabs.scss"; // matcha-tabs($theme)
+@import "./components/matcha-modal.scss"; // matcha-modal($theme)
+@import "./components/matcha-drawer.scss"; // matcha-drawer-theme($theme)
+@import "./components/matcha-chip.scss"; // matcha-chip($theme)
+@import "./components/matcha-status-pill.scss"; // matcha-status-pill
+@import "./components/matcha-date.scss"; // matcha-date-theme($theme)
+@import "./components/matcha-calendar.scss"; // matcha-calendar-theme($theme)
+@import "./components/matcha-page-builder.scss"; // matcha-page-builder($theme)
+@import "./components/matcha-snack-bar.scss"; // matcha-snack-bar-theme($theme)
+@import "./components/matcha-timepicker.scss"; // matcha-timepicker-theme($theme)
+@import "./components/matcha-badge.scss"; // matcha-badge-theme($theme)
+@import "./components/matcha-empty-state.scss"; // matcha-empty-state-theme($theme)
+@import "./components/matcha-tree-view.scss"; // matcha-tree-view-theme($theme)
+@import "./components/matcha-nav.scss"; // matcha-nav-theme($theme)
+@import "./components/matcha-list.scss"; // matcha-list-theme($theme)
+@import "./components/matcha-icon.scss"; // matcha-icon-theme($theme)
+@import "./components/matcha-text-editor.scss"; // matcha-text-editor-theme($theme)
+@import "./components/matcha-chart-card.scss"; // matcha-chart-card-theme($theme)
+@import "./components/matcha-crop.scss"; // matcha-crop-theme($theme)
+@import "./components/matcha-footer.scss"; // matcha-footer-theme($theme)
+@import "./components/matcha-uploader.scss"; // matcha-uploader-theme($theme)
+@import "./components/matcha-drop-image.scss"; // matcha-drop-image-theme($theme)
+@import "./components/matcha-notification.scss"; // matcha-notification-theme($theme)
+@import "./components/matcha-section.scss"; // matcha-section-theme($theme)
+@import "./components/matcha-form-section.scss"; // matcha-form-section-theme($theme)
+@import "./components/matcha-breadcrumb.scss"; // matcha-breadcrumb-theme($theme)
+@import "./components/matcha-image.scss"; // matcha-image-theme($theme)
+@import "./components/matcha-stepper.scss"; // matcha-stepper-theme($theme)
+@import "./components/matcha-toolbar.scss"; // matcha-toolbar-modern (canon DSV3 1:1 Figma 15866:92)
+@import "./components/matcha-command-palette.scss"; // matcha-command-palette-theme($theme)
+@import "./components/matcha-profile-card.scss"; // matcha-profile-card-theme($theme)
+@import "./components/matcha-flag.scss"; // matcha-flag-theme($theme)
+@import "./components/matcha-emoji.scss"; // matcha-emoji-theme($theme)
+
+// LAYOUT
+@import "./layout/matcha-page-layout.scss"; // matcha-page-layout-theme($theme)
+
+// VENDORS
+@import "./vendors/angular-editor.scss";
+@import "./vendors/angular-material-fixes.scss";
+@import "./vendors/calendar.scss";
+@import "./vendors/charts.scss";
+@import "./vendors/ng5-slider.scss";
+@import "./vendors/ngx-material-timepicker.scss";
+
+// ─── FONT LOADING — Manrope (SELF-HOSTED · zero dependência externa) ─────────
+// REGRA DE OURO: fontes self-hosted, nunca @import/<link> do Google Fonts.
+// Variable font (weight 400–800), woff2 local em fonts/manrope/.
+// Atualizar: baixar de https://fonts.google.com/specimen/Manrope (licença OFL),
+// pegar os woff2 latin + latin-ext e substituir os arquivos abaixo.
+@font-face {
+    font-family: "Manrope";
+    font-style: normal;
+    font-weight: 400 800;
+    font-display: swap;
+    src: url("fonts/manrope/manrope-latin.woff2") format("woff2");
+    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;
+}
+@font-face {
+    font-family: "Manrope";
+    font-style: normal;
+    font-weight: 400 800;
+    font-display: swap;
+    src: url("fonts/manrope/manrope-latin-ext.woff2") format("woff2");
+    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;
+}
+
+// CircularStd removido (2026-06-03): fonte comercial licenciada + fora da regra de
+// ouro. Fonte canônica do DS é a Manrope (self-hosted acima). O token
+// --matcha-font-family já resolve para 'Manrope'.
+
+// -------------------------------------------------------------------------------------------------------------------
+// @ CORE - Mixins and Includes
+// -------------------------------------------------------------------------------------------------------------------
+@mixin matcha-typography($config: null) {
+    @if $config ==null {
+        $config: matcha-typography-config();
+    }
+
+    @include matcha-reset-typography($config);
+}
+
+@mixin matcha-components($theme) {
+    @include matcha-css-custom-properties($theme);
+
+    @include colors-classes-dynamic($theme);
+    @include colors-classes-static($theme);
+
+    @include elevation-theme($theme);
+
+    @include vendor-angular-editor($theme);
+    @include vendor-angular-material-fixes($theme);
+    @include vendor-calendar-theme($theme);
+    @include vendor-chart($theme);
+    @include vendor-ng-5-theme($theme);
+    @include vendor-ngx-material-timepicker($theme);
+
+    @include base-typography-theme($theme);
+    @include base-body-reset-theme($theme);
+
+    @include matcha-cards-theme($theme);
+    @include matcha-horizontal-tree-theme($theme);
+    @include matcha-audio-player-theme($theme);
+    @include matcha-color-pick-theme($theme);
+    @include matcha-draggable-theme($theme);
+    @include matcha-scrollbox-shadow($theme);
+    @include matcha-scrollbar-theme($theme);
+
+    @include matcha-table-cell-theme($theme);
+    @include matcha-table-modern($theme); // canon DSV3 1:1 Figma 15641:275
+    @include matcha-toolbar($theme); // canon DSV3 1:1 Figma 15866:92
+    @include matcha-button-toggle($theme);
+    @include matcha-button-theme($theme);
+    @include matcha-ripple-theme($theme);
+    @include matcha-tooltip-theme($theme);
+    @include matcha-header-theme($theme);
+    @include app-page-header-theme($theme);
+    @include matcha-menu-theme($theme);
+    @include matcha-drop-list-theme($theme);
+    @include matcha-form-field($theme);
+    @include matcha-checkbox($theme);
+    @include matcha-spin($theme);
+    @include matcha-spinner-theme($theme);
+    @include matcha-hint-text($theme);
+    @include matcha-slide-toggle-theme($theme);
+    @include matcha-tabs($theme);
+    @include matcha-tabs-modern($theme);
+    @include matcha-modal-theme($theme);
+    @include matcha-skeleton-theme($theme);
+    @include matcha-radio($theme);
+    @include matcha-avatar-theme($theme);
+    @include matcha-drawer-theme($theme);
+    @include matcha-autocomplete-theme($theme);
+    @include matcha-panel-theme($theme);
+    @include matcha-option-theme($theme);
+    @include matcha-select-theme($theme);
+    @include matcha-paginator-theme($theme);
+    @include matcha-slider-theme($theme);
+    @include matcha-highlight-theme($theme);
+    @include matcha-divider-theme($theme);
+    @include matcha-chip-theme($theme);
+    @include matcha-progress-bar-theme($theme);
+    @include matcha-page-builder-theme($theme);
+    @include matcha-snack-bar-theme($theme);
+    @include matcha-chip-theme($theme);
+    @include matcha-date-theme($theme);
+    @include matcha-calendar-theme($theme);
+    @include matcha-timepicker-theme($theme);
+    @include matcha-badge-theme($theme);
+    @include matcha-empty-state-theme($theme);
+    @include matcha-tree-view-theme($theme);
+    @include matcha-nav-theme($theme);
+    @include matcha-list-theme($theme);
+    @include matcha-icon-theme($theme);
+    @include matcha-text-editor-theme($theme);
+    @include matcha-chart-card-theme($theme);
+    @include matcha-crop-theme($theme);
+    @include matcha-footer-theme($theme);
+    @include matcha-uploader-theme($theme);
+    @include matcha-drop-image-theme($theme);
+    @include matcha-notification-theme($theme);
+    @include matcha-section-theme($theme);
+    @include matcha-form-section-theme($theme);
+    @include matcha-accordion-theme($theme);
+    @include matcha-breadcrumb-theme($theme);
+    @include matcha-image-theme($theme);
+    @include matcha-stepper-theme($theme);
+    @include matcha-command-palette-theme($theme);
+    @include matcha-profile-card-theme($theme);
+    @include matcha-flag($theme);
+    @include matcha-emoji-theme($theme);
+    @include matcha-page-layout-theme($theme);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inchurch/matcha-theme",
-  "version": "20.0.8",
+  "version": "20.276.0",
   "description": "Themes for matcha-design-system",
   "main": "main.scss",
   "scripts": {

package/tokens/_animations-tokens.scss

@@ -1,37 +1,37 @@
-// Easing Curves
-// TODO(jelbourn): all of these need to be revisited
-
-// The default animation curves used by material design.
-$time-transition-minimal: 80;
-$time-transition-short: 200;
-$time-transition-base: 400;
-$time-transition-long: 600;
-$time-transition-xl: 1000;
-$time-delay-short: 50;
-$time-delay-base: 100;
-$time-delay-long: 200;
-$time-duration-short: 2000;
-$time-duration-base: 4000;
-$time-duration-long: 6000;
-
-$matcha-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;
-$matcha-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;
-$matcha-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;
-
-$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;
-
-$swift-ease-out-duration: #{$time-transition-base}ms !default;
-$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
-$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;
-
-$swift-ease-in-duration: #{$time-transition-short}ms !default;
-$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;
-$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;
-
-$swift-ease-in-out-duration: #{$time-transition-long}ms !default;
-$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;
-$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;
-
-$swift-linear-duration: #{$time-transition-minimal}ms !default;
-$swift-linear-timing-function: linear !default;
-$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;
+// Easing Curves
+// TODO(jelbourn): all of these need to be revisited
+
+// The default animation curves used by material design.
+$time-transition-minimal: 80;
+$time-transition-short: 200;
+$time-transition-base: 400;
+$time-transition-long: 600;
+$time-transition-xl: 1000;
+$time-delay-short: 50;
+$time-delay-base: 100;
+$time-delay-long: 200;
+$time-duration-short: 2000;
+$time-duration-base: 4000;
+$time-duration-long: 6000;
+
+$matcha-linear-out-slow-in-timing-function: cubic-bezier(0, 0, 0.2, 0.1) !default;
+$matcha-fast-out-slow-in-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !default;
+$matcha-fast-out-linear-in-timing-function: cubic-bezier(0.4, 0, 1, 1) !default;
+
+$ease-in-out-curve-function: cubic-bezier(0.35, 0, 0.25, 1) !default;
+
+$swift-ease-out-duration: #{$time-transition-base}ms !default;
+$swift-ease-out-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1) !default;
+$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-timing-function !default;
+
+$swift-ease-in-duration: #{$time-transition-short}ms !default;
+$swift-ease-in-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2) !default;
+$swift-ease-in: all $swift-ease-in-duration $swift-ease-in-timing-function !default;
+
+$swift-ease-in-out-duration: #{$time-transition-long}ms !default;
+$swift-ease-in-out-timing-function: $ease-in-out-curve-function !default;
+$swift-ease-in-out: all $swift-ease-in-out-duration $swift-ease-in-out-timing-function !default;
+
+$swift-linear-duration: #{$time-transition-minimal}ms !default;
+$swift-linear-timing-function: linear !default;
+$swift-linear: all $swift-linear-duration $swift-linear-timing-function !default;