@maicol07/material-web 2.3.0 → 2.5.0

package/tokens/versions/v0_192/_index.scss

@@ -0,0 +1,107 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+//
+
+@forward './md-comp-assist-chip' as md-comp-assist-chip-*;
+@forward './md-comp-badge' as md-comp-badge-*;
+@forward './md-comp-banner' as md-comp-banner-*;
+@forward './md-comp-bottom-app-bar' as md-comp-bottom-app-bar-*;
+@forward './md-comp-carousel-item' as md-comp-carousel-item-*;
+@forward './md-comp-checkbox' as md-comp-checkbox-*;
+@forward './md-comp-circular-progress-indicator' as
+  md-comp-circular-progress-indicator-*;
+@forward './md-comp-data-table' as md-comp-data-table-*;
+@forward './md-comp-date-input-modal' as md-comp-date-input-modal-*;
+@forward './md-comp-date-picker-docked' as md-comp-date-picker-docked-*;
+@forward './md-comp-date-picker-modal' as md-comp-date-picker-modal-*;
+@forward './md-comp-dialog' as md-comp-dialog-*;
+@forward './md-comp-divider' as md-comp-divider-*;
+@forward './md-comp-elevated-button' as md-comp-elevated-button-*;
+@forward './md-comp-elevated-card' as md-comp-elevated-card-*;
+@forward './md-comp-extended-fab-branded' as md-comp-extended-fab-branded-*;
+@forward './md-comp-extended-fab-primary' as md-comp-extended-fab-primary-*;
+@forward './md-comp-extended-fab-secondary' as md-comp-extended-fab-secondary-*;
+@forward './md-comp-extended-fab-surface' as md-comp-extended-fab-surface-*;
+@forward './md-comp-extended-fab-tertiary' as md-comp-extended-fab-tertiary-*;
+@forward './md-comp-fab-branded' as md-comp-fab-branded-*;
+@forward './md-comp-fab-branded-large' as md-comp-fab-branded-large-*;
+@forward './md-comp-fab-primary' as md-comp-fab-primary-*;
+@forward './md-comp-fab-primary-large' as md-comp-fab-primary-large-*;
+@forward './md-comp-fab-primary-small' as md-comp-fab-primary-small-*;
+@forward './md-comp-fab-secondary' as md-comp-fab-secondary-*;
+@forward './md-comp-fab-secondary-large' as md-comp-fab-secondary-large-*;
+@forward './md-comp-fab-secondary-small' as md-comp-fab-secondary-small-*;
+@forward './md-comp-fab-surface' as md-comp-fab-surface-*;
+@forward './md-comp-fab-surface-large' as md-comp-fab-surface-large-*;
+@forward './md-comp-fab-surface-small' as md-comp-fab-surface-small-*;
+@forward './md-comp-fab-tertiary' as md-comp-fab-tertiary-*;
+@forward './md-comp-fab-tertiary-large' as md-comp-fab-tertiary-large-*;
+@forward './md-comp-fab-tertiary-small' as md-comp-fab-tertiary-small-*;
+@forward './md-comp-filled-autocomplete' as md-comp-filled-autocomplete-*;
+@forward './md-comp-filled-button' as md-comp-filled-button-*;
+@forward './md-comp-filled-card' as md-comp-filled-card-*;
+@forward './md-comp-filled-icon-button' as md-comp-filled-icon-button-*;
+@forward './md-comp-filled-menu-button' as md-comp-filled-menu-button-*;
+@forward './md-comp-filled-select' as md-comp-filled-select-*;
+@forward './md-comp-filled-text-field' as md-comp-filled-text-field-*;
+@forward './md-comp-filled-tonal-button' as md-comp-filled-tonal-button-*;
+@forward './md-comp-filled-tonal-icon-button' as
+  md-comp-filled-tonal-icon-button-*;
+@forward './md-comp-filter-chip' as md-comp-filter-chip-*;
+@forward './md-comp-full-screen-dialog' as md-comp-full-screen-dialog-*;
+@forward './md-comp-icon-button' as md-comp-icon-button-*;
+@forward './md-comp-input-chip' as md-comp-input-chip-*;
+@forward './md-comp-linear-progress-indicator' as
+  md-comp-linear-progress-indicator-*;
+@forward './md-comp-list' as md-comp-list-*;
+@forward './md-comp-menu' as md-comp-menu-*;
+@forward './md-comp-navigation-bar' as md-comp-navigation-bar-*;
+@forward './md-comp-navigation-drawer' as md-comp-navigation-drawer-*;
+@forward './md-comp-navigation-rail' as md-comp-navigation-rail-*;
+@forward './md-comp-outlined-autocomplete' as md-comp-outlined-autocomplete-*;
+@forward './md-comp-outlined-button' as md-comp-outlined-button-*;
+@forward './md-comp-outlined-card' as md-comp-outlined-card-*;
+@forward './md-comp-outlined-icon-button' as md-comp-outlined-icon-button-*;
+@forward './md-comp-outlined-menu-button' as md-comp-outlined-menu-button-*;
+@forward './md-comp-outlined-segmented-button' as
+  md-comp-outlined-segmented-button-*;
+@forward './md-comp-outlined-select' as md-comp-outlined-select-*;
+@forward './md-comp-outlined-text-field' as md-comp-outlined-text-field-*;
+@forward './md-comp-plain-tooltip' as md-comp-plain-tooltip-*;
+@forward './md-comp-primary-navigation-tab' as md-comp-primary-navigation-tab-*;
+@forward './md-comp-radio-button' as md-comp-radio-button-*;
+@forward './md-comp-rich-tooltip' as md-comp-rich-tooltip-*;
+@forward './md-comp-scrim' as md-comp-scrim-*;
+@forward './md-comp-search-bar' as md-comp-search-bar-*;
+@forward './md-comp-search-view' as md-comp-search-view-*;
+@forward './md-comp-secondary-navigation-tab' as
+  md-comp-secondary-navigation-tab-*;
+@forward './md-comp-sheet-bottom' as md-comp-sheet-bottom-*;
+@forward './md-comp-sheet-floating' as md-comp-sheet-floating-*;
+@forward './md-comp-sheet-side' as md-comp-sheet-side-*;
+@forward './md-comp-slider' as md-comp-slider-*;
+@forward './md-comp-snackbar' as md-comp-snackbar-*;
+@forward './md-comp-standard-menu-button' as md-comp-standard-menu-button-*;
+@forward './md-comp-suggestion-chip' as md-comp-suggestion-chip-*;
+@forward './md-comp-switch' as md-comp-switch-*;
+@forward './md-comp-text-button' as md-comp-text-button-*;
+@forward './md-comp-time-input' as md-comp-time-input-*;
+@forward './md-comp-time-picker' as md-comp-time-picker-*;
+@forward './md-comp-top-app-bar-large' as md-comp-top-app-bar-large-*;
+@forward './md-comp-top-app-bar-medium' as md-comp-top-app-bar-medium-*;
+@forward './md-comp-top-app-bar-small' as md-comp-top-app-bar-small-*;
+@forward './md-comp-top-app-bar-small-centered' as
+  md-comp-top-app-bar-small-centered-*;
+@forward './md-ref-palette' as md-ref-palette-*;
+@forward './md-ref-typeface' as md-ref-typeface-*;
+@forward './md-sys-color' as md-sys-color-*;
+@forward './md-sys-elevation' as md-sys-elevation-*;
+@forward './md-sys-motion' as md-sys-motion-*;
+@forward './md-sys-shape' as md-sys-shape-*;
+@forward './md-sys-state' as md-sys-state-*;
+@forward './md-sys-typescale' as md-sys-typescale-*;

package/tokens/versions/v0_192/_md-comp-assist-chip.scss

@@ -0,0 +1,111 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-elevation';
+
+@use './md-sys-shape';
+
+@use './md-sys-state';
+
+@use './md-sys-typescale';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-elevation': md-sys-elevation.values(),
+  'md-sys-shape': md-sys-shape.values(),
+  'md-sys-state': md-sys-state.values(),
+  'md-sys-typescale': md-sys-typescale.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'container-height': if($exclude-hardcoded-values, null, 32px),
+    'container-shape': map.get($deps, 'md-sys-shape', 'corner-small'),
+    'disabled-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'disabled-label-text-opacity': if($exclude-hardcoded-values, null, 0.38),
+    'dragged-container-elevation': map.get($deps, 'md-sys-elevation', 'level4'),
+    'dragged-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'dragged-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'dragged-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'dragged-state-layer-opacity'),
+    'elevated-container-color':
+      map.get($deps, 'md-sys-color', 'surface-container-low'),
+    'elevated-container-elevation': map.get($deps, 'md-sys-elevation', 'level1'),
+    'elevated-container-shadow-color': map.get($deps, 'md-sys-color', 'shadow'),
+    'elevated-disabled-container-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'elevated-disabled-container-elevation':
+      map.get($deps, 'md-sys-elevation', 'level0'),
+    'elevated-disabled-container-opacity':
+      if($exclude-hardcoded-values, null, 0.12),
+    'elevated-focus-container-elevation':
+      map.get($deps, 'md-sys-elevation', 'level1'),
+    'elevated-hover-container-elevation':
+      map.get($deps, 'md-sys-elevation', 'level2'),
+    'elevated-pressed-container-elevation':
+      map.get($deps, 'md-sys-elevation', 'level1'),
+    'flat-container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
+    'flat-disabled-outline-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'flat-disabled-outline-opacity': if($exclude-hardcoded-values, null, 0.12),
+    'flat-focus-outline-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'flat-outline-color': map.get($deps, 'md-sys-color', 'outline'),
+    'flat-outline-width': if($exclude-hardcoded-values, null, 1px),
+    'focus-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'focus-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'focus-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
+    'hover-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'hover-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'hover-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
+    'label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'label-text-font': map.get($deps, 'md-sys-typescale', 'label-large-font'),
+    'label-text-line-height':
+      map.get($deps, 'md-sys-typescale', 'label-large-line-height'),
+    'label-text-size': map.get($deps, 'md-sys-typescale', 'label-large-size'),
+    'label-text-tracking':
+      map.get($deps, 'md-sys-typescale', 'label-large-tracking'),
+    'label-text-type':
+      if(
+        $exclude-hardcoded-values,
+        null,
+        /** Warning: risk of reduced fidelity from using this composite typography token. Tokens md.comp.assist-chip.label-text.tracking cannot be represented in the "font" property shorthand. Consider using the discrete properties instead. */
+          map.get($deps, 'md-sys-typescale', 'label-large-weight')
+          map.get($deps, 'md-sys-typescale', 'label-large-size') #{'/'} map.get(
+            $deps,
+            'md-sys-typescale',
+            'label-large-line-height'
+          ) map.get($deps, 'md-sys-typescale', 'label-large-font')
+      ),
+    'label-text-weight':
+      map.get($deps, 'md-sys-typescale', 'label-large-weight'),
+    'pressed-label-text-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'pressed-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'pressed-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
+    'with-icon-disabled-icon-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'with-icon-disabled-icon-opacity': if($exclude-hardcoded-values, null, 0.38),
+    'with-icon-dragged-icon-color': map.get($deps, 'md-sys-color', 'primary'),
+    'with-icon-focus-icon-color': map.get($deps, 'md-sys-color', 'primary'),
+    'with-icon-hover-icon-color': map.get($deps, 'md-sys-color', 'primary'),
+    'with-icon-icon-color': map.get($deps, 'md-sys-color', 'primary'),
+    'with-icon-icon-size': if($exclude-hardcoded-values, null, 18px),
+    'with-icon-pressed-icon-color': map.get($deps, 'md-sys-color', 'primary')
+  );
+}

package/tokens/versions/v0_192/_md-comp-badge.scss

@@ -0,0 +1,61 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-shape';
+
+@use './md-sys-typescale';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-shape': md-sys-shape.values(),
+  'md-sys-typescale': md-sys-typescale.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'color': map.get($deps, 'md-sys-color', 'error'),
+    'large-color': map.get($deps, 'md-sys-color', 'error'),
+    'large-label-text-color': map.get($deps, 'md-sys-color', 'on-error'),
+    'large-label-text-font':
+      map.get($deps, 'md-sys-typescale', 'label-small-font'),
+    'large-label-text-line-height':
+      map.get($deps, 'md-sys-typescale', 'label-small-line-height'),
+    'large-label-text-size':
+      map.get($deps, 'md-sys-typescale', 'label-small-size'),
+    'large-label-text-tracking':
+      map.get($deps, 'md-sys-typescale', 'label-small-tracking'),
+    'large-label-text-type':
+      if(
+        $exclude-hardcoded-values,
+        null,
+        /** Warning: risk of reduced fidelity from using this composite typography token. Tokens md.comp.badge.large.label-text.tracking cannot be represented in the "font" property shorthand. Consider using the discrete properties instead. */
+          map.get($deps, 'md-sys-typescale', 'label-small-weight')
+          map.get($deps, 'md-sys-typescale', 'label-small-size') #{'/'} map.get(
+            $deps,
+            'md-sys-typescale',
+            'label-small-line-height'
+          ) map.get($deps, 'md-sys-typescale', 'label-small-font')
+      ),
+    'large-label-text-weight':
+      map.get($deps, 'md-sys-typescale', 'label-small-weight'),
+    'large-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
+    'large-size': if($exclude-hardcoded-values, null, 16px),
+    'shape': map.get($deps, 'md-sys-shape', 'corner-full'),
+    'size': if($exclude-hardcoded-values, null, 6px)
+  );
+}

package/tokens/versions/v0_192/_md-comp-banner.scss

@@ -0,0 +1,76 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-elevation';
+
+@use './md-sys-shape';
+
+@use './md-sys-typescale';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-elevation': md-sys-elevation.values(),
+  'md-sys-shape': md-sys-shape.values(),
+  'md-sys-typescale': md-sys-typescale.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'container-color': map.get($deps, 'md-sys-color', 'surface-container-low'),
+    'container-elevation': map.get($deps, 'md-sys-elevation', 'level1'),
+    'container-shape': map.get($deps, 'md-sys-shape', 'corner-none'),
+    'desktop-with-single-line-container-height':
+      if($exclude-hardcoded-values, null, 52px),
+    'desktop-with-three-lines-container-height':
+      if($exclude-hardcoded-values, null, 90px),
+    'desktop-with-two-lines-with-image-container-height':
+      if($exclude-hardcoded-values, null, 72px),
+    'mobile-with-single-line-container-height':
+      if($exclude-hardcoded-values, null, 54px),
+    'mobile-with-two-lines-container-height':
+      if($exclude-hardcoded-values, null, 112px),
+    'mobile-with-two-lines-with-image-container-height':
+      if($exclude-hardcoded-values, null, 120px),
+    'supporting-text-color':
+      map.get($deps, 'md-sys-color', 'on-surface-variant'),
+    'supporting-text-font':
+      map.get($deps, 'md-sys-typescale', 'body-medium-font'),
+    'supporting-text-line-height':
+      map.get($deps, 'md-sys-typescale', 'body-medium-line-height'),
+    'supporting-text-size':
+      map.get($deps, 'md-sys-typescale', 'body-medium-size'),
+    'supporting-text-tracking':
+      map.get($deps, 'md-sys-typescale', 'body-medium-tracking'),
+    'supporting-text-type':
+      if(
+        $exclude-hardcoded-values,
+        null,
+        /** Warning: risk of reduced fidelity from using this composite typography token. Tokens md.comp.banner.supporting-text.tracking cannot be represented in the "font" property shorthand. Consider using the discrete properties instead. */
+          map.get($deps, 'md-sys-typescale', 'body-medium-weight')
+          map.get($deps, 'md-sys-typescale', 'body-medium-size') #{'/'} map.get(
+            $deps,
+            'md-sys-typescale',
+            'body-medium-line-height'
+          ) map.get($deps, 'md-sys-typescale', 'body-medium-font')
+      ),
+    'supporting-text-weight':
+      map.get($deps, 'md-sys-typescale', 'body-medium-weight'),
+    'with-image-image-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
+    'with-image-image-size': if($exclude-hardcoded-values, null, 40px)
+  );
+}

package/tokens/versions/v0_192/_md-comp-bottom-app-bar.scss

@@ -0,0 +1,36 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-elevation';
+
+@use './md-sys-shape';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-elevation': md-sys-elevation.values(),
+  'md-sys-shape': md-sys-shape.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'container-color': map.get($deps, 'md-sys-color', 'surface-container'),
+    'container-elevation': map.get($deps, 'md-sys-elevation', 'level2'),
+    'container-height': if($exclude-hardcoded-values, null, 80px),
+    'container-shape': map.get($deps, 'md-sys-shape', 'corner-none')
+  );
+}

package/tokens/versions/v0_192/_md-comp-carousel-item.scss

@@ -0,0 +1,66 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-elevation';
+
+@use './md-sys-shape';
+
+@use './md-sys-state';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-elevation': md-sys-elevation.values(),
+  'md-sys-shape': md-sys-shape.values(),
+  'md-sys-state': md-sys-state.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'container-color': map.get($deps, 'md-sys-color', 'surface'),
+    'container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
+    'container-shadow-color': map.get($deps, 'md-sys-color', 'shadow'),
+    'container-shape': map.get($deps, 'md-sys-shape', 'corner-extra-large'),
+    'disabled-container-color': map.get($deps, 'md-sys-color', 'surface'),
+    'disabled-container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
+    'disabled-container-opacity': if($exclude-hardcoded-values, null, 0.38),
+    'focus-container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
+    'focus-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'focus-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
+    'hover-container-elevation': map.get($deps, 'md-sys-elevation', 'level1'),
+    'hover-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'hover-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
+    'pressed-container-elevation': map.get($deps, 'md-sys-elevation', 'level0'),
+    'pressed-state-layer-color': map.get($deps, 'md-sys-color', 'on-surface'),
+    'pressed-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
+    'with-outline-disabled-outline-color':
+      map.get($deps, 'md-sys-color', 'outline'),
+    'with-outline-disabled-outline-opacity':
+      if($exclude-hardcoded-values, null, 0.12),
+    'with-outline-focus-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'with-outline-hover-outline-color':
+      map.get($deps, 'md-sys-color', 'outline'),
+    'with-outline-outline-color': map.get($deps, 'md-sys-color', 'outline'),
+    'with-outline-outline-width': if($exclude-hardcoded-values, null, 1),
+    'with-outline-pressed-outline-color':
+      map.get($deps, 'md-sys-color', 'outline')
+  );
+}

package/tokens/versions/v0_192/_md-comp-checkbox.scss

@@ -0,0 +1,129 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-shape';
+
+@use './md-sys-state';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-shape': md-sys-shape.values(),
+  'md-sys-state': md-sys-state.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'container-shape': if($exclude-hardcoded-values, null, 2px),
+    'container-size': if($exclude-hardcoded-values, null, 18px),
+    'error-focus-state-layer-color': map.get($deps, 'md-sys-color', 'error'),
+    'error-focus-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
+    'error-hover-state-layer-color': map.get($deps, 'md-sys-color', 'error'),
+    'error-hover-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
+    'error-pressed-state-layer-color': map.get($deps, 'md-sys-color', 'error'),
+    'error-pressed-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
+    'icon-size': if($exclude-hardcoded-values, null, 18px),
+    'selected-container-color': map.get($deps, 'md-sys-color', 'primary'),
+    'selected-disabled-container-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'selected-disabled-container-opacity':
+      if($exclude-hardcoded-values, null, 0.38),
+    'selected-disabled-container-outline-width':
+      if($exclude-hardcoded-values, null, 0px),
+    'selected-disabled-icon-color': map.get($deps, 'md-sys-color', 'surface'),
+    'selected-error-container-color': map.get($deps, 'md-sys-color', 'error'),
+    'selected-error-focus-container-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'selected-error-focus-icon-color':
+      map.get($deps, 'md-sys-color', 'on-error'),
+    'selected-error-hover-container-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'selected-error-hover-icon-color':
+      map.get($deps, 'md-sys-color', 'on-error'),
+    'selected-error-icon-color': map.get($deps, 'md-sys-color', 'on-error'),
+    'selected-error-pressed-container-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'selected-error-pressed-icon-color':
+      map.get($deps, 'md-sys-color', 'on-error'),
+    'selected-focus-container-color': map.get($deps, 'md-sys-color', 'primary'),
+    'selected-focus-icon-color': map.get($deps, 'md-sys-color', 'on-primary'),
+    'selected-focus-outline-width': if($exclude-hardcoded-values, null, 0px),
+    'selected-focus-state-layer-color':
+      map.get($deps, 'md-sys-color', 'primary'),
+    'selected-focus-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
+    'selected-hover-container-color': map.get($deps, 'md-sys-color', 'primary'),
+    'selected-hover-icon-color': map.get($deps, 'md-sys-color', 'on-primary'),
+    'selected-hover-outline-width': if($exclude-hardcoded-values, null, 0px),
+    'selected-hover-state-layer-color':
+      map.get($deps, 'md-sys-color', 'primary'),
+    'selected-hover-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
+    'selected-icon-color': map.get($deps, 'md-sys-color', 'on-primary'),
+    'selected-outline-width': if($exclude-hardcoded-values, null, 0px),
+    'selected-pressed-container-color':
+      map.get($deps, 'md-sys-color', 'primary'),
+    'selected-pressed-icon-color': map.get($deps, 'md-sys-color', 'on-primary'),
+    'selected-pressed-outline-width': if($exclude-hardcoded-values, null, 0px),
+    'selected-pressed-state-layer-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'selected-pressed-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity'),
+    'state-layer-shape': map.get($deps, 'md-sys-shape', 'corner-full'),
+    'state-layer-size': if($exclude-hardcoded-values, null, 40px),
+    'unselected-disabled-container-opacity':
+      if($exclude-hardcoded-values, null, 0.38),
+    'unselected-disabled-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-disabled-outline-width':
+      if($exclude-hardcoded-values, null, 2px),
+    'unselected-error-focus-outline-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'unselected-error-hover-outline-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'unselected-error-outline-color': map.get($deps, 'md-sys-color', 'error'),
+    'unselected-error-pressed-outline-color':
+      map.get($deps, 'md-sys-color', 'error'),
+    'unselected-focus-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-focus-outline-width': if($exclude-hardcoded-values, null, 2px),
+    'unselected-focus-state-layer-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-focus-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'focus-state-layer-opacity'),
+    'unselected-hover-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-hover-outline-width': if($exclude-hardcoded-values, null, 2px),
+    'unselected-hover-state-layer-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-hover-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'hover-state-layer-opacity'),
+    'unselected-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface-variant'),
+    'unselected-outline-width': if($exclude-hardcoded-values, null, 2px),
+    'unselected-pressed-outline-color':
+      map.get($deps, 'md-sys-color', 'on-surface'),
+    'unselected-pressed-outline-width': if($exclude-hardcoded-values, null, 2px),
+    'unselected-pressed-state-layer-color':
+      map.get($deps, 'md-sys-color', 'primary'),
+    'unselected-pressed-state-layer-opacity':
+      map.get($deps, 'md-sys-state', 'pressed-state-layer-opacity')
+  );
+}

package/tokens/versions/v0_192/_md-comp-circular-progress-indicator.scss

@@ -0,0 +1,41 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+//
+// !!! THIS FILE WAS AUTOMATICALLY GENERATED !!!
+// !!! DO NOT MODIFY IT BY HAND !!!
+// Design system display name: Google Material 3
+// Design system version: v0.192
+// User-configured context group "Audience": "3P"
+// User-configured context group "Platform": "Web"
+// User-configured context group "Scheme": "Dynamic"
+//
+
+@use 'sass:map';
+
+@use './md-sys-color';
+
+@use './md-sys-shape';
+
+$_default: (
+  'md-sys-color': md-sys-color.values-light(),
+  'md-sys-shape': md-sys-shape.values(),
+);
+
+@function values($deps: $_default, $exclude-hardcoded-values: false) {
+  @return (
+    'active-indicator-color': map.get($deps, 'md-sys-color', 'primary'),
+    'active-indicator-shape': map.get($deps, 'md-sys-shape', 'corner-none'),
+    'active-indicator-width': if($exclude-hardcoded-values, null, 4px),
+    'four-color-active-indicator-four-color':
+      map.get($deps, 'md-sys-color', 'tertiary-container'),
+    'four-color-active-indicator-one-color':
+      map.get($deps, 'md-sys-color', 'primary'),
+    'four-color-active-indicator-three-color':
+      map.get($deps, 'md-sys-color', 'tertiary'),
+    'four-color-active-indicator-two-color':
+      map.get($deps, 'md-sys-color', 'primary-container'),
+    'size': if($exclude-hardcoded-values, null, 48px)
+  );
+}