material-web-evo 10002.10001.10000

package/tokens/_md-ref-palette.scss

@@ -0,0 +1,112 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use './internal/validate';
+@use './v0_192/md-ref-palette';
+// go/keep-sorted end
+
+$supported-tokens: (
+  // go/keep-sorted start
+  'black',
+  'error0',
+  'error10',
+  'error100',
+  'error20',
+  'error30',
+  'error40',
+  'error50',
+  'error60',
+  'error70',
+  'error80',
+  'error90',
+  'error95',
+  'error99',
+  'neutral-variant0',
+  'neutral-variant10',
+  'neutral-variant100',
+  'neutral-variant20',
+  'neutral-variant30',
+  'neutral-variant40',
+  'neutral-variant50',
+  'neutral-variant60',
+  'neutral-variant70',
+  'neutral-variant80',
+  'neutral-variant90',
+  'neutral-variant95',
+  'neutral-variant99',
+  'neutral0',
+  'neutral10',
+  'neutral100',
+  'neutral12',
+  'neutral17',
+  'neutral20',
+  'neutral22',
+  'neutral24',
+  'neutral30',
+  'neutral4',
+  'neutral40',
+  'neutral50',
+  'neutral6',
+  'neutral60',
+  'neutral70',
+  'neutral80',
+  'neutral87',
+  'neutral90',
+  'neutral92',
+  'neutral94',
+  'neutral95',
+  'neutral96',
+  'neutral98',
+  'neutral99',
+  'primary0',
+  'primary10',
+  'primary100',
+  'primary20',
+  'primary30',
+  'primary40',
+  'primary50',
+  'primary60',
+  'primary70',
+  'primary80',
+  'primary90',
+  'primary95',
+  'primary99',
+  'secondary0',
+  'secondary10',
+  'secondary100',
+  'secondary20',
+  'secondary30',
+  'secondary40',
+  'secondary50',
+  'secondary60',
+  'secondary70',
+  'secondary80',
+  'secondary90',
+  'secondary95',
+  'secondary99',
+  'tertiary0',
+  'tertiary10',
+  'tertiary100',
+  'tertiary20',
+  'tertiary30',
+  'tertiary40',
+  'tertiary50',
+  'tertiary60',
+  'tertiary70',
+  'tertiary80',
+  'tertiary90',
+  'tertiary95',
+  'tertiary99',
+  'white',
+  // go/keep-sorted end
+);
+
+@function values($exclude-hardcoded-values: false) {
+  @return validate.values(
+    md-ref-palette.values($exclude-hardcoded-values),
+    $supported-tokens: $supported-tokens
+  );
+}

package/tokens/_md-ref-typeface.scss

@@ -0,0 +1,46 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
+// go/keep-sorted start
+@use './internal/validate';
+@use './v0_192/md-ref-typeface';
+// go/keep-sorted end
+
+$supported-tokens: (
+  // go/keep-sorted start
+  'brand',
+  'plain',
+  'weight-bold',
+  'weight-medium',
+  'weight-regular',
+  // go/keep-sorted end
+);
+
+@function values(
+  $exclude-hardcoded-values: false,
+  $exclude-custom-properties: false
+) {
+  $tokens: md-ref-typeface.values(
+    $exclude-hardcoded-values: $exclude-hardcoded-values,
+  );
+
+  @if not $exclude-custom-properties {
+    // Create --md-ref-typeface-* custom properties
+    @each $token, $value in $tokens {
+      @if $value != null {
+        $tokens: map.set(
+          $tokens,
+          $token,
+          var(--md-ref-typeface-#{$token}, #{$value})
+        );
+      }
+    }
+  }
+
+  @return validate.values($tokens, $supported-tokens: $supported-tokens);
+}

package/tokens/_md-sys-color.scss

@@ -0,0 +1,119 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
+// go/keep-sorted start
+@use './internal/validate';
+@use './md-ref-palette';
+@use './v0_192/md-sys-color';
+// go/keep-sorted end
+
+$supported-tokens: (
+  // go/keep-sorted start
+  'background',
+  'error',
+  'error-container',
+  'inverse-on-surface',
+  'inverse-primary',
+  'inverse-surface',
+  'on-background',
+  'on-error',
+  'on-error-container',
+  'on-primary',
+  'on-primary-container',
+  'on-primary-fixed',
+  'on-primary-fixed-variant',
+  'on-secondary',
+  'on-secondary-container',
+  'on-secondary-fixed',
+  'on-secondary-fixed-variant',
+  'on-surface',
+  'on-surface-variant',
+  'on-tertiary',
+  'on-tertiary-container',
+  'on-tertiary-fixed',
+  'on-tertiary-fixed-variant',
+  'outline',
+  'outline-variant',
+  'primary',
+  'primary-container',
+  'primary-fixed',
+  'primary-fixed-dim',
+  'scrim',
+  'secondary',
+  'secondary-container',
+  'secondary-fixed',
+  'secondary-fixed-dim',
+  'shadow',
+  'surface',
+  'surface-bright',
+  'surface-container',
+  'surface-container-high',
+  'surface-container-highest',
+  'surface-container-low',
+  'surface-container-lowest',
+  'surface-dim',
+  'surface-tint',
+  'surface-variant',
+  'tertiary',
+  'tertiary-container',
+  'tertiary-fixed',
+  'tertiary-fixed-dim',
+  // go/keep-sorted end
+);
+
+$_default-dark: (
+  'md-ref-palette': md-ref-palette.values(),
+);
+
+@function values-dark(
+  $deps: $_default-dark,
+  $exclude-custom-properties: false
+) {
+  $tokens: md-sys-color.values-dark($deps);
+
+  @if not $exclude-custom-properties {
+    // Create --md-sys-color-* custom properties
+    @each $token, $value in $tokens {
+      @if $value != null {
+        $tokens: map.set(
+          $tokens,
+          $token,
+          var(--md-sys-color-#{$token}, #{$value})
+        );
+      }
+    }
+  }
+
+  @return validate.values($tokens, $supported-tokens: $supported-tokens);
+}
+
+$_default-light: (
+  'md-ref-palette': md-ref-palette.values(),
+);
+
+@function values-light(
+  $deps: $_default-light,
+  $exclude-custom-properties: false
+) {
+  $tokens: md-sys-color.values-light($deps);
+
+  @if not $exclude-custom-properties {
+    // Create --md-sys-color-* custom properties
+    @each $token, $value in $tokens {
+      @if $value != null {
+        $tokens: map.set(
+          $tokens,
+          $token,
+          var(--md-sys-color-#{$token}, #{$value})
+        );
+      }
+    }
+  }
+
+  @return validate.values($tokens, $supported-tokens: $supported-tokens);
+}

package/tokens/_md-sys-elevation.scss

@@ -0,0 +1,31 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
+// go/keep-sorted start
+@use './v0_192/md-sys-elevation';
+// go/keep-sorted end
+
+@function values($exclude-hardcoded-values: false) {
+  $tokens: md-sys-elevation.values($exclude-hardcoded-values);
+  $tokens: map.merge(
+    $tokens,
+    (
+      // Elevation levels on web should use the level number, not the dp value.
+      // We can remove this if the generated tokens swap from dp to level. See
+      // b/261602454.
+      'level0': if($exclude-hardcoded-values, null, 0),
+      'level1': if($exclude-hardcoded-values, null, 1),
+      'level2': if($exclude-hardcoded-values, null, 2),
+      'level3': if($exclude-hardcoded-values, null, 3),
+      'level4': if($exclude-hardcoded-values, null, 4),
+      'level5': if($exclude-hardcoded-values, null, 5)
+    )
+  );
+
+  @return $tokens;
+}

package/tokens/_md-sys-motion.scss

@@ -0,0 +1,12 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use './v0_192/md-sys-motion';
+// go/keep-sorted end
+
+@function values($exclude-hardcoded-values: false) {
+  @return md-sys-motion.values($exclude-hardcoded-values);
+}

package/tokens/_md-sys-shape.scss

@@ -0,0 +1,102 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
+// go/keep-sorted start
+@use './internal/validate';
+@use './v0_192/md-sys-shape';
+// go/keep-sorted end
+
+$supported-tokens: (
+  // go/keep-sorted start
+  'corner-extra-large',
+  'corner-extra-small',
+  'corner-full',
+  'corner-large',
+  'corner-medium',
+  'corner-none',
+  'corner-small',
+  // go/keep-sorted end
+);
+
+$unsupported-tokens: (
+  // go/keep-sorted start
+  'corner-extra-large-top',
+  'corner-extra-small-top',
+  'corner-large-end',
+  'corner-large-start',
+  'corner-large-top',
+  // go/keep-sorted end
+);
+
+@function values(
+  $exclude-hardcoded-values: false,
+  $exclude-custom-properties: false
+) {
+  $original-tokens: md-sys-shape.values($exclude-hardcoded-values);
+  $tokens: validate.values(
+    $original-tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens
+  );
+
+  @if not $exclude-custom-properties {
+    // Create --md-sys-shape-* custom properties
+    @each $token, $value in $tokens {
+      @if $value != null {
+        $tokens: map.set(
+          $tokens,
+          $token,
+          var(--md-sys-shape-#{$token}, #{$value})
+        );
+      }
+    }
+  }
+
+  // Add multi-corner shape tokens purely for other Sass token APIs. These do
+  // not represent real token custom properties that can be set (there is no
+  // `--md-sys-shape-corner-extra-large-top` custom property).
+  // Instead, these are shorthand values that point to single-corner custom
+  // properties for usage in Sass component token mappings.
+  $tokens: map.merge(
+    $tokens,
+    (
+      'corner-extra-large-top': (
+        map.get($tokens, 'corner-extra-large'),
+        map.get($tokens, 'corner-extra-large'),
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-none'),
+      ),
+      'corner-extra-small-top': (
+        map.get($tokens, 'corner-extra-small'),
+        map.get($tokens, 'corner-extra-small'),
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-none'),
+      ),
+      'corner-large-end': (
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-large'),
+        map.get($tokens, 'corner-large'),
+        map.get($tokens, 'corner-none'),
+      ),
+      'corner-large-start': (
+        map.get($tokens, 'corner-large'),
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-large'),
+      ),
+      'corner-large-top': (
+        map.get($tokens, 'corner-large'),
+        map.get($tokens, 'corner-large'),
+        map.get($tokens, 'corner-none'),
+        map.get($tokens, 'corner-none'),
+      ),
+    )
+  );
+
+  @return $tokens;
+}

package/tokens/_md-sys-state.scss

@@ -0,0 +1,12 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use './v0_192/md-sys-state';
+// go/keep-sorted end
+
+@function values($exclude-hardcoded-values: false) {
+  @return md-sys-state.values($exclude-hardcoded-values);
+}

package/tokens/_md-sys-typescale.scss

@@ -0,0 +1,149 @@
+//
+// Copyright 2023 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:map';
+// go/keep-sorted end
+// go/keep-sorted start
+@use './internal/validate';
+@use './md-ref-typeface';
+@use './v0_192/md-sys-typescale';
+// go/keep-sorted end
+
+$supported-tokens: (
+  // go/keep-sorted start
+  'body-large-font',
+  'body-large-line-height',
+  'body-large-size',
+  'body-large-weight',
+  'body-medium-font',
+  'body-medium-line-height',
+  'body-medium-size',
+  'body-medium-weight',
+  'body-small-font',
+  'body-small-line-height',
+  'body-small-size',
+  'body-small-weight',
+  'display-large-font',
+  'display-large-line-height',
+  'display-large-size',
+  'display-large-weight',
+  'display-medium-font',
+  'display-medium-line-height',
+  'display-medium-size',
+  'display-medium-weight',
+  'display-small-font',
+  'display-small-line-height',
+  'display-small-size',
+  'display-small-weight',
+  'headline-large-font',
+  'headline-large-line-height',
+  'headline-large-size',
+  'headline-large-weight',
+  'headline-medium-font',
+  'headline-medium-line-height',
+  'headline-medium-size',
+  'headline-medium-weight',
+  'headline-small-font',
+  'headline-small-line-height',
+  'headline-small-size',
+  'headline-small-weight',
+  'label-large-font',
+  'label-large-line-height',
+  'label-large-size',
+  'label-large-weight',
+  'label-large-weight-prominent',
+  'label-medium-font',
+  'label-medium-line-height',
+  'label-medium-size',
+  'label-medium-weight',
+  'label-medium-weight-prominent',
+  'label-small-font',
+  'label-small-line-height',
+  'label-small-size',
+  'label-small-weight',
+  'title-large-font',
+  'title-large-line-height',
+  'title-large-size',
+  'title-large-weight',
+  'title-medium-font',
+  'title-medium-line-height',
+  'title-medium-size',
+  'title-medium-weight',
+  'title-small-font',
+  'title-small-line-height',
+  'title-small-size',
+  'title-small-weight',
+  // go/keep-sorted end
+);
+
+$unsupported-tokens: (
+  // go/keep-sorted start
+  'body-large',
+  'body-large-tracking',
+  'body-medium',
+  'body-medium-tracking',
+  'body-small',
+  'body-small-tracking',
+  'display-large',
+  'display-large-tracking',
+  'display-medium',
+  'display-medium-tracking',
+  'display-small',
+  'display-small-tracking',
+  'headline-large',
+  'headline-large-tracking',
+  'headline-medium',
+  'headline-medium-tracking',
+  'headline-small',
+  'headline-small-tracking',
+  'label-large',
+  'label-large-tracking',
+  'label-medium',
+  'label-medium-tracking',
+  'label-small',
+  'label-small-tracking',
+  'title-large',
+  'title-large-tracking',
+  'title-medium',
+  'title-medium-tracking',
+  'title-small',
+  'title-small-tracking',
+  // go/keep-sorted end
+);
+
+$_default: (
+  'md-ref-typeface': md-ref-typeface.values(),
+);
+
+@function values(
+  $deps: $_default,
+  $exclude-hardcoded-values: false,
+  $exclude-custom-properties: false
+) {
+  $tokens: md-sys-typescale.values(
+    $deps,
+    $exclude-hardcoded-values: $exclude-hardcoded-values
+  );
+
+  @if not $exclude-custom-properties {
+    // Create --md-sys-typescale-* custom properties
+    @each $token, $value in $tokens {
+      @if $value != null {
+        $tokens: map.set(
+          $tokens,
+          $token,
+          var(--md-sys-typescale-#{$token}, #{$value})
+        );
+      }
+    }
+  }
+
+  @return validate.values(
+    $tokens,
+    $supported-tokens: $supported-tokens,
+    $unsupported-tokens: $unsupported-tokens
+  );
+}

package/tokens/internal/_shape.scss

@@ -0,0 +1,93 @@
+//
+// Copyright 2024 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+
+// go/keep-sorted start
+@use 'sass:list';
+@use 'sass:map';
+@use 'sass:meta';
+// go/keep-sorted end
+
+/// Returns a map of 4 logical tokens (start-start, start-end, end-end,
+/// and end-start) for each of the given shape tokens in the provided token
+/// map.
+///
+/// @example scss
+///   $tokens: ('container-shape': 16px 16px 0px 0px);
+///   $new-tokens: shape.get-new-logical-shape-tokens(
+///     $tokens,
+///     'container-shape'
+///   );
+///   // (
+///   //   'container-shape-start-start': 16px,
+///   //   'container-shape-start-end': 16px,
+///   //   'container-shape-end-end': 0px,
+///   //   'container-shape-end-start': 0px,
+///   // )
+///
+/// @param $tokens A Map of tokens.
+/// @param $shape-tokens One or more shape tokens in the provided map. Each
+///     shape token will add 4 logical shape tokens to the returned map.
+/// @return A map with 4 logical tokens for each provided shape token.
+@function get-new-logical-shape-tokens($tokens, $shape-tokens...) {
+  $new-logical-tokens: ();
+  $logical-suffixes: (
+    // top-left
+    'start-start',
+    // top-right
+    'start-end',
+    // bottom-right
+    'end-end',
+    // bottom-left
+    'end-start'
+  );
+
+  @each $shape-token in $shape-tokens {
+    $shorthand-value: _expand-shorthand-to-list(map.get($tokens, $shape-token));
+
+    @each $logical-suffix in $logical-suffixes {
+      $logical-token: '#{$shape-token}-#{$logical-suffix}';
+      $logical-index: list.index($logical-suffixes, $logical-suffix);
+
+      $new-logical-tokens: map.set(
+        $new-logical-tokens,
+        $logical-token,
+        list.nth($shorthand-value, $logical-index)
+      );
+    }
+  }
+
+  @return $new-logical-tokens;
+}
+
+@function _expand-shorthand-to-list($shorthand) {
+  @if meta.type-of($shorthand) != 'list' or list.length($shorthand) == 1 {
+    @return ($shorthand, $shorthand, $shorthand, $shorthand);
+  }
+
+  @if list.length($shorthand) == 2 {
+    $top-left-and-bottom-right: list.nth($shorthand, 1);
+    $top-right-and-bottom-left: list.nth($shorthand, 2);
+    @return (
+      $top-left-and-bottom-right,
+      $top-right-and-bottom-left,
+      $top-left-and-bottom-right,
+      $top-right-and-bottom-left
+    );
+  }
+
+  @if list.length($shorthand) == 3 {
+    $top-left: list.nth($shorthand, 1);
+    $top-right-and-bottom-left: list.nth($shorthand, 2);
+    $bottom-right: list.nth($shorthand, 3);
+    @return (
+      $top-left,
+      $top-right-and-bottom-left,
+      $bottom-right,
+      $top-right-and-bottom-left
+    );
+  }
+
+  @return $shorthand;
+}