@depup/angular__material 21.2.2-depup.19

package/core/tokens/m2/_md-sys-color-internal.scss

@@ -0,0 +1,11 @@
+// Dark system color values that are google3-internal and diverge from the
+// external Material Design spec.
+@function values-dark($palettes) {
+  @return ();
+}
+
+// Light system color values that are google3-internal and diverge from the
+// external Material Design spec.
+@function values-light($palettes) {
+  @return ();
+}

package/core/tokens/m2/_md-sys-color.scss

@@ -0,0 +1,123 @@
+@use '../../m2/palette';
+@use './md-sys-color-internal';
+@use 'sass:map';
+
+@function md-sys-color-values-dark($palettes) {
+  $values: (
+    primary: map.get($palettes, primary, default),
+    on-primary: map.get($palettes, primary, default-contrast),
+    inverse-primary: map.get($palettes, primary, 600),
+    secondary: map.get($palettes, accent, default),
+    on-secondary: map.get($palettes, accent, default-contrast),
+    inverse-secondary: map.get($palettes, accent, 600),
+    error: map.get($palettes, warn, default),
+    on-error: map.get($palettes, warn, default-contrast),
+    inverse-error: map.get($palettes, warn, 600),
+    shadow: black,
+    surface: map.get(palette.$grey-palette, 800),
+    on-surface: white,
+    surface-variant: #4a4a4a,
+    on-surface-variant: rgba(white, 0.7),
+    background: #303030,
+    inverse-surface: white,
+    inverse-on-surface: rgba(black, 0.87),
+    outline: rgba(white, 0.12),
+    outline-variant: rgba(white, 0.38),
+    error-container: map.get($palettes, warn, 900),
+    on-background: white,
+    on-error-container: map.get($palettes, warn, 50),
+    on-primary-container: map.get($palettes, primary, 50),
+    on-primary-fixed: map.get($palettes, primary, default-contrast),
+    on-primary-fixed-variant: map.get($palettes, primary, default-contrast),
+    on-secondary-container: map.get($palettes, accent, 50),
+    on-secondary-fixed: map.get($palettes, accent, default-contrast),
+    on-secondary-fixed-variant: map.get($palettes, accent, default-contrast),
+    on-tertiary: map.get($palettes, accent, default-contrast),
+    on-tertiary-container: map.get($palettes, accent, 50),
+    on-tertiary-fixed: map.get($palettes, accent, default-contrast),
+    on-tertiary-fixed-variant: map.get($palettes, accent, default-contrast),
+    primary-container: map.get($palettes, primary, 900),
+    primary-fixed: map.get($palettes, primary, default),
+    primary-fixed-dim: map.get($palettes, primary, default),
+    scrim: black,
+    secondary-container: map.get($palettes, accent, 900),
+    secondary-fixed: map.get($palettes, accent, default),
+    secondary-fixed-dim: map.get($palettes, accent, default),
+    surface-bright: map.get(palette.$grey-palette, 800),
+    surface-container: map.get(palette.$grey-palette, 800),
+    surface-container-high: map.get(palette.$grey-palette, 800),
+    surface-container-highest: map.get(palette.$grey-palette, 800),
+    surface-container-low: map.get(palette.$grey-palette, 800),
+    surface-container-lowest: map.get(palette.$grey-palette, 800),
+    surface-dim: map.get(palette.$grey-palette, 800),
+    surface-tint: map.get(palette.$grey-palette, 800),
+    tertiary: map.get($palettes, accent, default),
+    tertiary-container: map.get($palettes, accent, 900),
+    tertiary-fixed: map.get($palettes, accent, default),
+    tertiary-fixed-dim: map.get($palettes, accent, default),
+  );
+
+  $values: map.merge($values, md-sys-color-internal.values-dark($palettes));
+
+  @return $values;
+}
+
+@function md-sys-color-values-light($palettes) {
+  $values: (
+    primary: map.get($palettes, primary, default),
+    on-primary: map.get($palettes, primary, default-contrast),
+    inverse-primary: map.get($palettes, primary, 300),
+    secondary: map.get($palettes, accent, default),
+    on-secondary: map.get($palettes, accent, default-contrast),
+    inverse-secondary: map.get($palettes, accent, 300),
+    error: map.get($palettes, warn, default),
+    on-error: map.get($palettes, warn, default-contrast),
+    inverse-error: map.get($palettes, warn, 300),
+    shadow: black,
+    surface: white,
+    on-surface: rgba(black, 0.87),
+    surface-variant: #f6f6f6,
+    on-surface-variant: rgba(black, 0.54),
+    background: map.get(palette.$grey-palette, 50),
+    inverse-surface: map.get(palette.$grey-palette, 800),
+    inverse-on-surface: white,
+    outline: rgba(black, 0.12),
+    outline-variant: rgba(black, 0.38),
+    error-container: map.get($palettes, warn, 50),
+    on-background: rgba(black, 0.87),
+    on-error-container: map.get($palettes, warn, 700),
+    on-primary-container: map.get($palettes, primary, 700),
+    on-primary-fixed: map.get($palettes, primary, default-contrast),
+    on-primary-fixed-variant: map.get($palettes, primary, default-contrast),
+    on-secondary-container: map.get($palettes, accent, 700),
+    on-secondary-fixed: map.get($palettes, accent, default-contrast),
+    on-secondary-fixed-variant: map.get($palettes, accent, default-contrast),
+    on-tertiary: map.get($palettes, accent, default-contrast),
+    on-tertiary-container: map.get($palettes, accent, 700),
+    on-tertiary-fixed: map.get($palettes, accent, default-contrast),
+    on-tertiary-fixed-variant: map.get($palettes, accent, default-contrast),
+    primary-container: map.get($palettes, primary, 50),
+    primary-fixed: map.get($palettes, primary, default),
+    primary-fixed-dim: map.get($palettes, primary, default),
+    scrim: black,
+    secondary-container: map.get($palettes, accent, 50),
+    secondary-fixed: map.get($palettes, accent, default),
+    secondary-fixed-dim: map.get($palettes, accent, default),
+    surface-bright: white,
+    surface-container: white,
+    surface-container-high: white,
+    surface-container-highest: white,
+    surface-container-low: white,
+    surface-container-lowest: white,
+    surface-dim: white,
+    surface-tint: white,
+    tertiary: map.get($palettes, accent, default),
+    tertiary-container: map.get($palettes, accent, 50),
+    tertiary-fixed: map.get($palettes, accent, default),
+    tertiary-fixed-dim: map.get($palettes, accent, default),
+  );
+
+  $values: map.merge($values, md-sys-color-internal.values-light($palettes));
+
+  @return $values;
+}

package/core/tokens/m2/_md-sys-elevation.scss

@@ -0,0 +1,10 @@
+@function md-sys-elevation-values() {
+  @return (
+    level0: 0,
+    level1: 1,
+    level2: 3,
+    level3: 6,
+    level4: 8,
+    level5: 12
+  );
+}

package/core/tokens/m2/_md-sys-motion.scss

@@ -0,0 +1,30 @@
+@function md-sys-motion-values() {
+  @return (
+    duration-extra-long1: 700ms,
+    duration-extra-long2: 800ms,
+    duration-extra-long3: 900ms,
+    duration-extra-long4: 1000ms,
+    duration-long1: 450ms,
+    duration-long2: 500ms,
+    duration-long3: 550ms,
+    duration-long4: 600ms,
+    duration-medium1: 250ms,
+    duration-medium2: 300ms,
+    duration-medium3: 350ms,
+    duration-medium4: 400ms,
+    duration-short1: 50ms,
+    duration-short2: 100ms,
+    duration-short3: 150ms,
+    duration-short4: 200ms,
+    easing-emphasized: cubic-bezier(0.2, 0, 0, 1),
+    easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15),
+    easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1),
+    easing-legacy: cubic-bezier(0.4, 0, 0.2, 1),
+    easing-legacy-accelerate: cubic-bezier(0.4, 0, 1, 1),
+    easing-legacy-decelerate: cubic-bezier(0, 0, 0.2, 1),
+    easing-linear: cubic-bezier(0, 0, 1, 1),
+    easing-standard: cubic-bezier(0.2, 0, 0, 1),
+    easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1),
+    easing-standard-decelerate: cubic-bezier(0, 0, 0, 1)
+  );
+}

package/core/tokens/m2/_md-sys-shape.scss

@@ -0,0 +1,16 @@
+@function  md-sys-shape-values() {
+  @return (
+    corner-extra-large: 28px,
+    corner-extra-large-top: (28px 28px 0 0),
+    corner-extra-small: 4px,
+    corner-extra-small-top: (4px 4px 0 0),
+    corner-full: 9999px,
+    corner-large: 16px,
+    corner-large-end: (0 16px 16px 0),
+    corner-large-start: (16px 0 0 16px),
+    corner-large-top: (16px 16px 0 0),
+    corner-medium: 12px,
+    corner-none: 0,
+    corner-small: 8px
+  );
+}

package/core/tokens/m2/_md-sys-state.scss

@@ -0,0 +1,8 @@
+@function md-sys-state-values($exclude-hardcoded-values: false) {
+  @return (
+    dragged-state-layer-opacity: 0.16,
+    focus-state-layer-opacity: 0.12,
+    hover-state-layer-opacity: 0.04,
+    pressed-state-layer-opacity: 0.12,
+  );
+}

package/core/tokens/m2/_md-sys-typescale.scss

@@ -0,0 +1,68 @@
+@use 'sass:map';
+@use 'sass:string';
+@use 'sass:meta';
+
+@function md-sys-typescale-values($config) {
+  // Mapping is according to the old 2014 version of the typography spec.
+  $sys-to-config: (
+    body-large: subheading-1,
+    body-medium: body-1,
+    body-small: caption,
+    display-large: display-4,
+    display-medium: display-4,
+    display-small: display-4,
+    headline-large: display-3,
+    headline-medium: display-2,
+    headline-small: display-1,
+    label-large: subheading-2,
+    label-medium: body-2,
+    label-small: button,
+    title-large: headline,
+    title-medium: headline,
+    title-small: title,
+  );
+
+  // If the config is based on the updated 2018 version of the typography spec, then
+  // use the correct config keys mapping.
+  @if (map.get($config, headline-1) != null) {
+    $sys-to-config: (
+      body-large: body-1,
+      body-medium: body-2,
+      body-small: caption,
+      label-large: subtitle-1,
+      label-medium: subtitle-2,
+      label-small: button,
+      display-large: headline-1,
+      display-medium: headline-1,
+      display-small: headline-1,
+      headline-large: headline-2,
+      headline-medium: headline-3,
+      headline-small: headline-4,
+      title-large: headline-5,
+      title-medium: headline-5,
+      title-small: headline-6,
+    );
+  }
+
+  $typography: ();
+  @each $sys-key, $config-key in $sys-to-config {
+    $font: map.get($config, $config-key, font-family);
+    @if (meta.type-of($font) == 'string') {
+      $font: string.unquote($font);
+    }
+    $line-height: map.get($config, $config-key, line-height);
+    $size: map.get($config, $config-key, font-size);
+    $tracking: map.get($config, $config-key, letter-spacing);
+    $weight: map.get($config, $config-key, font-weight);
+    $typography: map.merge($typography, (
+      #{$sys-key}: $weight $size #{'/'} $line-height $font,
+      #{$sys-key}-font: $font,
+      #{$sys-key}-line-height: $line-height,
+      #{$sys-key}-size: $size,
+      #{$sys-key}-tracking: $tracking,
+      #{$sys-key}-weight: $weight,
+    ));
+  }
+
+  @return $typography;
+}

package/core/tokens/m3/_index.scss

@@ -0,0 +1,7 @@
+@forward './md-sys-color';
+@forward './md-sys-elevation';
+@forward './md-sys-motion';
+@forward './md-sys-shape';
+@forward './md-sys-state';
+@forward './md-sys-typescale';
+@forward './theme';

package/core/tokens/m3/_md-sys-color-internal.scss

@@ -0,0 +1,11 @@
+// Dark system color values that are internal-only and diverge from the
+// external Material Design spec.
+@function values-dark($palettes) {
+  @return ();
+}
+
+// Light system color values that are internal-only and diverge from the
+// external Material Design spec.
+@function values-light($palettes) {
+  @return ();
+}

package/core/tokens/m3/_md-sys-color.scss

@@ -0,0 +1,118 @@
+@use 'sass:map';
+@use './md-sys-color-internal';
+
+@function md-sys-color-values-dark($palettes: ()) {
+  $values: (
+    background: map.get($palettes, neutral, 6),
+    error: map.get($palettes, error, 80),
+    error-container: map.get($palettes, error, 30),
+    inverse-on-surface: map.get($palettes, neutral, 20),
+    inverse-primary: map.get($palettes, primary, 40),
+    inverse-surface: map.get($palettes, neutral, 90),
+    on-background: map.get($palettes, neutral, 90),
+    on-error: map.get($palettes, error, 20),
+    on-error-container: map.get($palettes, error, 90),
+    on-primary: map.get($palettes, primary, 20),
+    on-primary-container: map.get($palettes, primary, 90),
+    on-primary-fixed: map.get($palettes, primary, 10),
+    on-primary-fixed-variant: map.get($palettes, primary, 30),
+    on-secondary: map.get($palettes, secondary, 20),
+    on-secondary-container: map.get($palettes, secondary, 90),
+    on-secondary-fixed: map.get($palettes, secondary, 10),
+    on-secondary-fixed-variant: map.get($palettes, secondary, 30),
+    on-surface: map.get($palettes, neutral, 90),
+    on-surface-variant: map.get($palettes, neutral-variant, 90),
+    on-tertiary: map.get($palettes, tertiary, 20),
+    on-tertiary-container: map.get($palettes, tertiary, 90),
+    on-tertiary-fixed: map.get($palettes, tertiary, 10),
+    on-tertiary-fixed-variant: map.get($palettes, tertiary, 30),
+    outline: map.get($palettes, neutral-variant, 60),
+    outline-variant: map.get($palettes, neutral-variant, 30),
+    primary: map.get($palettes, primary, 80),
+    primary-container: map.get($palettes, primary, 30),
+    primary-fixed: map.get($palettes, primary, 90),
+    primary-fixed-dim: map.get($palettes, primary, 80),
+    scrim: map.get($palettes, neutral, 0),
+    secondary: map.get($palettes, secondary, 80),
+    secondary-container: map.get($palettes, secondary, 30),
+    secondary-fixed: map.get($palettes, secondary, 90),
+    secondary-fixed-dim: map.get($palettes, secondary, 80),
+    shadow: map.get($palettes, neutral, 0),
+    surface: map.get($palettes, neutral, 6),
+    surface-bright: map.get($palettes, neutral, 24),
+    surface-container: map.get($palettes, neutral, 12),
+    surface-container-high: map.get($palettes, neutral, 17),
+    surface-container-highest: map.get($palettes, neutral, 22),
+    surface-container-low: map.get($palettes, neutral, 10),
+    surface-container-lowest: map.get($palettes, neutral, 4),
+    surface-dim: map.get($palettes, neutral, 6),
+    surface-tint: map.get($palettes, primary, 80),
+    surface-variant: map.get($palettes, neutral-variant, 30),
+    tertiary: map.get($palettes, tertiary, 80),
+    tertiary-container: map.get($palettes, tertiary, 30),
+    tertiary-fixed: map.get($palettes, tertiary, 90),
+    tertiary-fixed-dim: map.get($palettes, tertiary, 80),
+  );
+
+  $values: map.merge($values, md-sys-color-internal.values-dark($palettes));
+
+  @return $values;
+}
+
+@function md-sys-color-values-light($palettes: ()) {
+  $values: (
+    background: map.get($palettes, neutral, 98),
+    error: map.get($palettes, error, 40),
+    error-container: map.get($palettes, error, 90),
+    inverse-on-surface: map.get($palettes, neutral, 95),
+    inverse-primary: map.get($palettes, primary, 80),
+    inverse-surface: map.get($palettes, neutral, 20),
+    on-background: map.get($palettes, neutral, 10),
+    on-error: map.get($palettes, error, 100),
+    on-error-container: map.get($palettes, error, 30),
+    on-primary: map.get($palettes, primary, 100),
+    on-primary-container: map.get($palettes, primary, 30),
+    on-primary-fixed: map.get($palettes, primary, 10),
+    on-primary-fixed-variant: map.get($palettes, primary, 30),
+    on-secondary: map.get($palettes, secondary, 100),
+    on-secondary-container: map.get($palettes, secondary, 30),
+    on-secondary-fixed: map.get($palettes, secondary, 10),
+    on-secondary-fixed-variant: map.get($palettes, secondary, 30),
+    on-surface: map.get($palettes, neutral, 10),
+    on-surface-variant: map.get($palettes, neutral-variant, 30),
+    on-tertiary: map.get($palettes, tertiary, 100),
+    on-tertiary-container: map.get($palettes, tertiary, 30),
+    on-tertiary-fixed: map.get($palettes, tertiary, 10),
+    on-tertiary-fixed-variant: map.get($palettes, tertiary, 30),
+    outline: map.get($palettes, neutral-variant, 50),
+    outline-variant: map.get($palettes, neutral-variant, 80),
+    primary: map.get($palettes, primary, 40),
+    primary-container: map.get($palettes, primary, 90),
+    primary-fixed: map.get($palettes, primary, 90),
+    primary-fixed-dim: map.get($palettes, primary, 80),
+    scrim: map.get($palettes, neutral, 0),
+    secondary: map.get($palettes, secondary, 40),
+    secondary-container: map.get($palettes, secondary, 90),
+    secondary-fixed: map.get($palettes, secondary, 90),
+    secondary-fixed-dim: map.get($palettes, secondary, 80),
+    shadow: map.get($palettes, neutral, 0),
+    surface: map.get($palettes, neutral, 98),
+    surface-bright: map.get($palettes, neutral, 98),
+    surface-container: map.get($palettes, neutral, 94),
+    surface-container-high: map.get($palettes, neutral, 92),
+    surface-container-highest: map.get($palettes, neutral, 90),
+    surface-container-low: map.get($palettes, neutral, 96),
+    surface-container-lowest: map.get($palettes, neutral, 100),
+    surface-dim: map.get($palettes, neutral, 87),
+    surface-tint: map.get($palettes, primary, 40),
+    surface-variant: map.get($palettes, neutral-variant, 90),
+    tertiary: map.get($palettes, tertiary, 40),
+    tertiary-container: map.get($palettes, tertiary, 90),
+    tertiary-fixed: map.get($palettes, tertiary, 90),
+    tertiary-fixed-dim: map.get($palettes, tertiary, 80),
+  );
+
+  $values: map.merge($values, md-sys-color-internal.values-light($palettes));
+
+  @return $values;
+}

package/core/tokens/m3/_md-sys-elevation.scss

@@ -0,0 +1,15 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-elevation-values() {
+  @return (
+    level0: 0,
+    level1: 1,
+    level2: 3,
+    level3: 6,
+    level4: 8,
+    level5: 12
+  );
+}

package/core/tokens/m3/_md-sys-motion.scss

@@ -0,0 +1,35 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-motion-values() {
+  @return (
+    duration-extra-long1: 700ms,
+    duration-extra-long2: 800ms,
+    duration-extra-long3: 900ms,
+    duration-extra-long4: 1000ms,
+    duration-long1: 450ms,
+    duration-long2: 500ms,
+    duration-long3: 550ms,
+    duration-long4: 600ms,
+    duration-medium1: 250ms,
+    duration-medium2: 300ms,
+    duration-medium3: 350ms,
+    duration-medium4: 400ms,
+    duration-short1: 50ms,
+    duration-short2: 100ms,
+    duration-short3: 150ms,
+    duration-short4: 200ms,
+    easing-emphasized: cubic-bezier(0.2, 0, 0, 1),
+    easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15),
+    easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1),
+    easing-legacy: cubic-bezier(0.4, 0, 0.2, 1),
+    easing-legacy-accelerate: cubic-bezier(0.4, 0, 1, 1),
+    easing-legacy-decelerate: cubic-bezier(0, 0, 0.2, 1),
+    easing-linear: cubic-bezier(0, 0, 1, 1),
+    easing-standard: cubic-bezier(0.2, 0, 0, 1),
+    easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1),
+    easing-standard-decelerate: cubic-bezier(0, 0, 0, 1)
+  );
+}

package/core/tokens/m3/_md-sys-shape.scss

@@ -0,0 +1,21 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function  md-sys-shape-values() {
+  @return (
+    corner-extra-large: 28px,
+    corner-extra-large-top: (28px 28px 0 0),
+    corner-extra-small: 4px,
+    corner-extra-small-top: (4px 4px 0 0),
+    corner-full: 9999px,
+    corner-large: 16px,
+    corner-large-end: (0 16px 16px 0),
+    corner-large-start: (16px 0 0 16px),
+    corner-large-top: (16px 16px 0 0),
+    corner-medium: 12px,
+    corner-none: 0,
+    corner-small: 8px
+  );
+}

package/core/tokens/m3/_md-sys-state.scss

@@ -0,0 +1,13 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@function md-sys-state-values($exclude-hardcoded-values: false) {
+  @return (
+    dragged-state-layer-opacity: 0.16,
+    focus-state-layer-opacity: 0.12,
+    hover-state-layer-opacity: 0.08,
+    pressed-state-layer-opacity: 0.12
+  );
+}

package/core/tokens/m3/_md-sys-typescale-internal.scss

@@ -0,0 +1,5 @@
+// System typescale values that are internal-only and diverge from the
+// external Material Design spec.
+@function values($typography) {
+  @return ();
+}

package/core/tokens/m3/_md-sys-typescale.scss

@@ -0,0 +1,114 @@
+//
+// Design system display name: Material 3
+// Design system version: v0.161
+//
+
+@use 'sass:map';
+@use './md-sys-typescale-internal';
+
+@function md-sys-typescale-values($typography: ()) {
+  $plain: map.get($typography, plain);
+  $brand: map.get($typography, brand);
+  $bold: map.get($typography, bold);
+  $medium: map.get($typography, medium);
+  $regular: map.get($typography, regular);
+
+  $values: (
+    body-large: $regular 1rem #{'/'} 1.5rem $plain,
+    body-large-font: $plain,
+    body-large-line-height: 1.5rem,
+    body-large-size: 1rem,
+    body-large-tracking: 0.031rem,
+    body-large-weight: $regular,
+    body-medium: $regular 0.875rem #{'/'} 1.25rem $plain,
+    body-medium-font: $plain,
+    body-medium-line-height: 1.25rem,
+    body-medium-size: 0.875rem,
+    body-medium-tracking: 0.016rem,
+    body-medium-weight: $regular,
+    body-small: $regular 0.75rem #{'/'} 1rem $plain,
+    body-small-font: $plain,
+    body-small-line-height: 1rem,
+    body-small-size: 0.75rem,
+    body-small-tracking: 0.025rem,
+    body-small-weight: $regular,
+    display-large: $regular 3.562rem #{'/'} 4rem $brand,
+    display-large-font: $brand,
+    display-large-line-height: 4rem,
+    display-large-size: 3.562rem,
+    display-large-tracking: -0.016rem,
+    display-large-weight: $regular,
+    display-medium: $regular 2.812rem #{'/'} 3.25rem $brand,
+    display-medium-font: $brand,
+    display-medium-line-height: 3.25rem,
+    display-medium-size: 2.812rem,
+    display-medium-tracking: 0,
+    display-medium-weight: $regular,
+    display-small: $regular 2.25rem #{'/'} 2.75rem $brand,
+    display-small-font: $brand,
+    display-small-line-height: 2.75rem,
+    display-small-size: 2.25rem,
+    display-small-tracking: 0,
+    display-small-weight: $regular,
+    headline-large: $regular 2rem #{'/'} 2.5rem $brand,
+    headline-large-font: $brand,
+    headline-large-line-height: 2.5rem,
+    headline-large-size: 2rem,
+    headline-large-tracking: 0,
+    headline-large-weight: $regular,
+    headline-medium: $regular 1.75rem #{'/'} 2.25rem $brand,
+    headline-medium-font: $brand,
+    headline-medium-line-height: 2.25rem,
+    headline-medium-size: 1.75rem,
+    headline-medium-tracking: 0,
+    headline-medium-weight: $regular,
+    headline-small: $regular 1.5rem #{'/'} 2rem $brand,
+    headline-small-font: $brand,
+    headline-small-line-height: 2rem,
+    headline-small-size: 1.5rem,
+    headline-small-tracking: 0,
+    headline-small-weight: $regular,
+    label-large: $medium 0.875rem #{'/'} 1.25rem $plain,
+    label-large-font: $plain,
+    label-large-line-height: 1.25rem,
+    label-large-size: 0.875rem,
+    label-large-tracking: 0.006rem,
+    label-large-weight: $medium,
+    label-large-weight-prominent: $bold,
+    label-medium: $medium 0.75rem #{'/'} 1rem $plain,
+    label-medium-font: $plain,
+    label-medium-line-height: 1rem,
+    label-medium-size: 0.75rem,
+    label-medium-tracking: 0.031rem,
+    label-medium-weight: $medium,
+    label-medium-weight-prominent: $bold,
+    label-small: $medium 0.688rem #{'/'} 1rem $plain,
+    label-small-font: $plain,
+    label-small-line-height: 1rem,
+    label-small-size: 0.688rem,
+    label-small-tracking: 0.031rem,
+    label-small-weight: $medium,
+    title-large: $regular 1.375rem #{'/'} 1.75rem $brand,
+    title-large-font: $brand,
+    title-large-line-height: 1.75rem,
+    title-large-size: 1.375rem,
+    title-large-tracking: 0,
+    title-large-weight: $regular,
+    title-medium: $medium 1rem #{'/'} 1.5rem $plain,
+    title-medium-font: $plain,
+    title-medium-line-height: 1.5rem,
+    title-medium-size: 1rem,
+    title-medium-tracking: 0.009rem,
+    title-medium-weight: $medium,
+    title-small: $medium 0.875rem #{'/'} 1.25rem $plain,
+    title-small-font: $plain,
+    title-small-line-height: 1.25rem,
+    title-small-size: 0.875rem,
+    title-small-tracking: 0.006rem,
+    title-small-weight: $medium
+  );
+
+  $values: map.merge($values, md-sys-typescale-internal.values($typography));
+
+  @return $values;
+}

package/core/tokens/m3/_theme.scss

@@ -0,0 +1,35 @@
+@use './md-sys-color';
+@use './md-sys-elevation';
+@use './md-sys-shape';
+@use './md-sys-state';
+@use './md-sys-typescale';
+@use 'sass:map';
+
+// Return a new map where the values are the same as the provided map's
+// keys, prefixed with "--mat-sys-". For example:
+// (key1: '', key2: '') --> (key1: --mat-sys-key1, key2: --mat-sys-key2)
+@function _create-system-app-vars-map($map) {
+  $new-map: ();
+  @each $key, $value in $map {
+    $new-map: map.set($new-map, $key, --mat-sys-#{$key});
+  }
+  @return $new-map;
+}
+
+$_sys-maps: (
+  md-sys-color.md-sys-color-values-light(),
+  md-sys-typescale.md-sys-typescale-values(),
+  md-sys-elevation.md-sys-elevation-values(),
+  md-sys-state.md-sys-state-values(),
+  md-sys-shape.md-sys-shape-values(),
+  (
+    neutral10: '', // Form field native select option text color
+    neutral-variant20: '', // Sidenav scrim (container background shadow when opened),
+  ),
+);
+
+$_system: (density-scale: 0);
+@each $sys-map in $_sys-maps {
+  $_system: map.merge($_system, _create-system-app-vars-map($sys-map));
+}
+$sys-theme: (_mat-system: $_system);