@material/web 2.4.2-nightly.082faad.0 → 2.4.2-nightly.259fd71.0

package/tokens/versions/latest/sass/_md-comp-carousel-item-meta.scss

@@ -0,0 +1,32 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$disabled-container-opacity--resolved: 0.38;
+$with-outline-disabled-outline-opacity--resolved: 0.12;
+$with-outline-outline-width--resolved: 1px;
+$container-color--resolved: var(--md-sys-color-surface);
+$container-elevation--resolved: var(--md-sys-elevation-level0);
+$container-shadow-color--resolved: var(--md-sys-color-shadow);
+$container-shape--resolved: var(--md-sys-shape-corner-extra-large);
+$container-surface-tint-layer-color--resolved: var(--md-sys-color-surface-tint);
+$disabled-container-color--resolved: var(--md-sys-color-surface);
+$disabled-container-elevation--resolved: var(--md-sys-elevation-level0);
+$focus-container-elevation--resolved: var(--md-sys-elevation-level0);
+$focus-indicator-color--resolved: var(--md-sys-color-secondary);
+$focus-indicator-outline-offset--resolved: var(--md-sys-state-focus-indicator-outer-offset);
+$focus-indicator-thickness--resolved: var(--md-sys-state-focus-indicator-thickness);
+$focus-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$focus-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$hover-container-elevation--resolved: var(--md-sys-elevation-level1);
+$hover-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$pressed-container-elevation--resolved: var(--md-sys-elevation-level0);
+$pressed-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$with-outline-disabled-outline-color--resolved: var(--md-sys-color-outline);
+$with-outline-focus-outline-color--resolved: var(--md-sys-color-on-surface);
+$with-outline-hover-outline-color--resolved: var(--md-sys-color-outline);
+$with-outline-outline-color--resolved: var(--md-sys-color-outline);
+$with-outline-pressed-outline-color--resolved: var(--md-sys-color-outline);

package/tokens/versions/latest/sass/_md-comp-carousel-item.scss

@@ -0,0 +1,79 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// AUTOGENERATED. DO NOT MODIFY.
+// To modify this file, update the source template,
+// or run the compiler: go/carbon-service-code-gen-mwtc.
+// Source template: formats/sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 34.0.21
+// Configured context tags:
+//   audience: 3p
+//   font: static
+//   platform: web
+// Output format: sass_vars
+
+@use 'md-sys-color';
+@use 'md-sys-elevation';
+@use 'md-sys-shape';
+@use 'md-sys-state';
+@use 'md-sys-state-focus-indicator';
+
+/// md.comp.carousel-item.disabled.container.opacity (Disabled / Container)
+$disabled-container-opacity: 0.38;
+/// md.comp.carousel-item.with-outline.disabled.outline.opacity (Disabled / Outline)
+$with-outline-disabled-outline-opacity: 0.12;
+/// md.comp.carousel-item.with-outline.outline.width (Enabled / Outline)
+$with-outline-outline-width: 1px;
+/// md.comp.carousel-item.container.color (Enabled / Container)
+$container-color: md-sys-color.$surface;
+/// md.comp.carousel-item.container.elevation (Enabled / Container)
+$container-elevation: md-sys-elevation.$level0;
+/// md.comp.carousel-item.container.shadow-color (Enabled / Container)
+$container-shadow-color: md-sys-color.$shadow;
+/// md.comp.carousel-item.container.shape (Enabled / Container)
+$container-shape: md-sys-shape.$corner-extra-large;
+/// md.comp.carousel-item.container.surface-tint-layer.color (Enabled / Container)
+///
+/// @deprecated Deprecated as part of the update from opacity based surfaces to tonal surfaces. Surfaces no longer use surface-tint layers for tinting, please use the desired surface role directly as the container color.
+$container-surface-tint-layer-color: md-sys-color.$surface-tint;
+/// md.comp.carousel-item.disabled.container.color (Disabled / Container)
+$disabled-container-color: md-sys-color.$surface;
+/// md.comp.carousel-item.disabled.container.elevation (Disabled / Container)
+$disabled-container-elevation: md-sys-elevation.$level0;
+/// md.comp.carousel-item.focus.container.elevation (Focus / Container)
+$focus-container-elevation: md-sys-elevation.$level0;
+/// md.comp.carousel-item.focus.indicator.color (Focus / Focus indicator)
+$focus-indicator-color: md-sys-color.$secondary;
+/// md.comp.carousel-item.focus.indicator.outline.offset (Focus / Focus indicator)
+$focus-indicator-outline-offset: md-sys-state-focus-indicator.$outer-offset;
+/// md.comp.carousel-item.focus.indicator.thickness (Focus / Focus indicator)
+$focus-indicator-thickness: md-sys-state-focus-indicator.$thickness;
+/// md.comp.carousel-item.focus.state-layer.color (Focus / State layer)
+$focus-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.carousel-item.focus.state-layer.opacity (Focus / State layer)
+$focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.carousel-item.hover.container.elevation (Hover / Container)
+$hover-container-elevation: md-sys-elevation.$level1;
+/// md.comp.carousel-item.hover.state-layer.color (Hover / State layer)
+$hover-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.carousel-item.hover.state-layer.opacity (Hover / State layer)
+$hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.carousel-item.pressed.container.elevation (Pressed (ripple) / Container)
+$pressed-container-elevation: md-sys-elevation.$level0;
+/// md.comp.carousel-item.pressed.state-layer.color (Pressed (ripple) / State layer)
+$pressed-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.carousel-item.pressed.state-layer.opacity (Pressed (ripple) / State layer)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.carousel-item.with-outline.disabled.outline.color (Disabled / Outline)
+$with-outline-disabled-outline-color: md-sys-color.$outline;
+/// md.comp.carousel-item.with-outline.focus.outline.color (Focus / Outline)
+$with-outline-focus-outline-color: md-sys-color.$on-surface;
+/// md.comp.carousel-item.with-outline.hover.outline.color (Hover / Outline)
+$with-outline-hover-outline-color: md-sys-color.$outline;
+/// md.comp.carousel-item.with-outline.outline.color (Enabled / Outline)
+$with-outline-outline-color: md-sys-color.$outline;
+/// md.comp.carousel-item.with-outline.pressed.outline.color (Pressed (ripple) / Outline)
+$with-outline-pressed-outline-color: md-sys-color.$outline;

package/tokens/versions/latest/sass/_md-comp-checkbox-meta.scss

@@ -0,0 +1,86 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 18px;
+$container-shape--resolved: 2px;
+$container-size--resolved: 18px;
+$container-width--resolved: 18px;
+$disabled-selected-icon-opacity--resolved: 0.38;
+$disabled-unselected-icon-opacity--resolved: 0.38;
+$icon-size--resolved: 18px;
+$selected-disabled-container-opacity--resolved: 0.38;
+$selected-disabled-container-outline-width--resolved: 0px;
+$selected-error-focus-outline-width--resolved: 0px;
+$selected-error-hover-outline-width--resolved: 0px;
+$selected-error-pressed-outline-width--resolved: 0px;
+$selected-focus-outline-width--resolved: 0px;
+$selected-hover-outline-width--resolved: 0px;
+$selected-outline-width--resolved: 0px;
+$selected-pressed-outline-width--resolved: 0px;
+$state-layer-size--resolved: 40px;
+$unselected-disabled-container-opacity--resolved: 0.38;
+$unselected-disabled-outline-width--resolved: 2px;
+$unselected-error-focus-outline-width--resolved: 2px;
+$unselected-error-hover-outline-width--resolved: 2px;
+$unselected-error-pressed-outline-width--resolved: 2px;
+$unselected-focus-outline-width--resolved: 2px;
+$unselected-hover-outline-width--resolved: 2px;
+$unselected-outline-width--resolved: 2px;
+$unselected-pressed-outline-width--resolved: 2px;
+$disabled-selected-icon-color--resolved: var(--md-sys-color-primary);
+$disabled-unselected-icon-color--resolved: var(--md-sys-color-primary);
+$error-focus-state-layer-color--resolved: var(--md-sys-color-error);
+$error-focus-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$error-hover-state-layer-color--resolved: var(--md-sys-color-error);
+$error-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$error-pressed-state-layer-color--resolved: var(--md-sys-color-error);
+$error-pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$focus-indicator-color--resolved: var(--md-sys-color-secondary);
+$focus-indicator-outline-offset--resolved: var(--md-sys-state-focus-indicator-outer-offset);
+$focus-indicator-thickness--resolved: var(--md-sys-state-focus-indicator-thickness);
+$selected-container-color--resolved: var(--md-sys-color-primary);
+$selected-disabled-container-color--resolved: var(--md-sys-color-on-surface);
+$selected-disabled-icon-color--resolved: var(--md-sys-color-surface);
+$selected-error-container-color--resolved: var(--md-sys-color-error);
+$selected-error-focus-container-color--resolved: var(--md-sys-color-error);
+$selected-error-focus-icon-color--resolved: var(--md-sys-color-on-error);
+$selected-error-hover-container-color--resolved: var(--md-sys-color-error);
+$selected-error-hover-icon-color--resolved: var(--md-sys-color-on-error);
+$selected-error-icon-color--resolved: var(--md-sys-color-on-error);
+$selected-error-pressed-container-color--resolved: var(--md-sys-color-error);
+$selected-error-pressed-icon-color--resolved: var(--md-sys-color-on-error);
+$selected-focus-container-color--resolved: var(--md-sys-color-primary);
+$selected-focus-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-focus-state-layer-color--resolved: var(--md-sys-color-primary);
+$selected-focus-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$selected-hover-container-color--resolved: var(--md-sys-color-primary);
+$selected-hover-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-hover-state-layer-color--resolved: var(--md-sys-color-primary);
+$selected-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$selected-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-pressed-container-color--resolved: var(--md-sys-color-primary);
+$selected-pressed-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-pressed-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$selected-pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$state-layer-shape--resolved: var(--md-sys-shape-corner-full);
+$unselected-disabled-outline-color--resolved: var(--md-sys-color-on-surface);
+$unselected-error-focus-outline-color--resolved: var(--md-sys-color-error);
+$unselected-error-hover-outline-color--resolved: var(--md-sys-color-error);
+$unselected-error-outline-color--resolved: var(--md-sys-color-error);
+$unselected-error-pressed-outline-color--resolved: var(--md-sys-color-error);
+$unselected-focus-icon-color--resolved: var(--md-sys-color-on-surface);
+$unselected-focus-outline-color--resolved: var(--md-sys-color-on-surface);
+$unselected-focus-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$unselected-focus-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$unselected-hover-icon-color--resolved: var(--md-sys-color-on-surface);
+$unselected-hover-outline-color--resolved: var(--md-sys-color-on-surface);
+$unselected-hover-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$unselected-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$unselected-icon-color--resolved: var(--md-sys-color-on-surface);
+$unselected-outline-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-icon-color--resolved: var(--md-sys-color-on-surface);
+$unselected-pressed-outline-color--resolved: var(--md-sys-color-on-surface);
+$unselected-pressed-state-layer-color--resolved: var(--md-sys-color-primary);
+$unselected-pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);

package/tokens/versions/latest/sass/_md-comp-checkbox.scss

@@ -0,0 +1,216 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// AUTOGENERATED. DO NOT MODIFY.
+// To modify this file, update the source template,
+// or run the compiler: go/carbon-service-code-gen-mwtc.
+// Source template: formats/sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 34.0.21
+// Configured context tags:
+//   audience: 3p
+//   font: static
+//   platform: web
+// Output format: sass_vars
+
+@use 'md-sys-color';
+@use 'md-sys-shape';
+@use 'md-sys-state';
+@use 'md-sys-state-focus-indicator';
+
+/// md.comp.checkbox.container.height (Enabled / Container)
+///
+/// @deprecated Combining height and width into a single size token
+$container-height: 18px;
+/// md.comp.checkbox.container.shape (Enabled / Container)
+$container-shape: 2px;
+/// md.comp.checkbox.container.size (Enabled / Container)
+$container-size: 18px;
+/// md.comp.checkbox.container.width (Enabled / Container)
+///
+/// @deprecated Combining height and width into a single size token
+$container-width: 18px;
+/// md.comp.checkbox.disabled.selected.icon.opacity (Disabled / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$disabled-selected-icon-opacity: 0.38;
+/// md.comp.checkbox.disabled.unselected.icon.opacity (Disabled / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$disabled-unselected-icon-opacity: 0.38;
+/// md.comp.checkbox.icon.size (Enabled / Icon)
+$icon-size: 18px;
+/// md.comp.checkbox.selected.disabled.container.opacity (Disabled / Container)
+$selected-disabled-container-opacity: 0.38;
+/// md.comp.checkbox.selected.disabled.container.outline.width (Disabled / Container)
+$selected-disabled-container-outline-width: 0px;
+/// md.comp.checkbox.selected.error.focus.outline.width (Focused / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$selected-error-focus-outline-width: 0px;
+/// md.comp.checkbox.selected.error.hover.outline.width (Hovered / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$selected-error-hover-outline-width: 0px;
+/// md.comp.checkbox.selected.error.pressed.outline.width (Pressed (ripple) / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$selected-error-pressed-outline-width: 0px;
+/// md.comp.checkbox.selected.focus.outline.width (Focused / Container)
+$selected-focus-outline-width: 0px;
+/// md.comp.checkbox.selected.hover.outline.width (Hovered / Container)
+$selected-hover-outline-width: 0px;
+/// md.comp.checkbox.selected.outline.width (Enabled / Container)
+$selected-outline-width: 0px;
+/// md.comp.checkbox.selected.pressed.outline.width (Pressed (ripple) / Container)
+$selected-pressed-outline-width: 0px;
+/// md.comp.checkbox.state-layer.size (Enabled / State layer)
+$state-layer-size: 40px;
+/// md.comp.checkbox.unselected.disabled.container.opacity (Disabled / Container)
+$unselected-disabled-container-opacity: 0.38;
+/// md.comp.checkbox.unselected.disabled.outline.width (Disabled / Container)
+$unselected-disabled-outline-width: 2px;
+/// md.comp.checkbox.unselected.error.focus.outline.width (Focused / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$unselected-error-focus-outline-width: 2px;
+/// md.comp.checkbox.unselected.error.hover.outline.width (Hovered / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$unselected-error-hover-outline-width: 2px;
+/// md.comp.checkbox.unselected.error.pressed.outline.width (Pressed (ripple) / Container)
+///
+/// @deprecated Redundant values. Please use md.comp.checkbox.unselected.outline.width or md.comp.checkbox.selected.outline.width tokens instead.
+$unselected-error-pressed-outline-width: 2px;
+/// md.comp.checkbox.unselected.focus.outline.width (Focused / Container)
+$unselected-focus-outline-width: 2px;
+/// md.comp.checkbox.unselected.hover.outline.width (Hovered / Container)
+$unselected-hover-outline-width: 2px;
+/// md.comp.checkbox.unselected.outline.width (Enabled / Container)
+$unselected-outline-width: 2px;
+/// md.comp.checkbox.unselected.pressed.outline.width (Pressed (ripple) / Container)
+$unselected-pressed-outline-width: 2px;
+/// md.comp.checkbox.disabled.selected.icon.color (Disabled / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$disabled-selected-icon-color: md-sys-color.$primary;
+/// md.comp.checkbox.disabled.unselected.icon.color (Disabled / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$disabled-unselected-icon-color: md-sys-color.$primary;
+/// md.comp.checkbox.error.focus.state-layer.color (Focused / State layer)
+$error-focus-state-layer-color: md-sys-color.$error;
+/// md.comp.checkbox.error.focus.state-layer.opacity (Focused / State layer)
+$error-focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.checkbox.error.hover.state-layer.color (Hovered / State layer)
+$error-hover-state-layer-color: md-sys-color.$error;
+/// md.comp.checkbox.error.hover.state-layer.opacity (Hovered / State layer)
+$error-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.checkbox.error.pressed.state-layer.color (Pressed (ripple) / State layer)
+$error-pressed-state-layer-color: md-sys-color.$error;
+/// md.comp.checkbox.error.pressed.state-layer.opacity (Pressed (ripple) / State layer)
+$error-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.checkbox.focus.indicator.color (Focused / Focus indicator)
+$focus-indicator-color: md-sys-color.$secondary;
+/// md.comp.checkbox.focus.indicator.outline.offset (Focused / Focus indicator)
+$focus-indicator-outline-offset: md-sys-state-focus-indicator.$outer-offset;
+/// md.comp.checkbox.focus.indicator.thickness (Focused / Focus indicator)
+$focus-indicator-thickness: md-sys-state-focus-indicator.$thickness;
+/// md.comp.checkbox.selected.container.color (Enabled / Container)
+$selected-container-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.disabled.container.color (Disabled / Container)
+$selected-disabled-container-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.selected.disabled.icon.color (Disabled / Icon)
+$selected-disabled-icon-color: md-sys-color.$surface;
+/// md.comp.checkbox.selected.error.container.color (Enabled / Container)
+$selected-error-container-color: md-sys-color.$error;
+/// md.comp.checkbox.selected.error.focus.container.color (Focused / Container)
+$selected-error-focus-container-color: md-sys-color.$error;
+/// md.comp.checkbox.selected.error.focus.icon.color (Focused / Icon)
+$selected-error-focus-icon-color: md-sys-color.$on-error;
+/// md.comp.checkbox.selected.error.hover.container.color (Hovered / Container)
+$selected-error-hover-container-color: md-sys-color.$error;
+/// md.comp.checkbox.selected.error.hover.icon.color (Hovered / Icon)
+$selected-error-hover-icon-color: md-sys-color.$on-error;
+/// md.comp.checkbox.selected.error.icon.color (Enabled / Icon)
+$selected-error-icon-color: md-sys-color.$on-error;
+/// md.comp.checkbox.selected.error.pressed.container.color (Pressed (ripple) / Container)
+$selected-error-pressed-container-color: md-sys-color.$error;
+/// md.comp.checkbox.selected.error.pressed.icon.color (Pressed (ripple) / Icon)
+$selected-error-pressed-icon-color: md-sys-color.$on-error;
+/// md.comp.checkbox.selected.focus.container.color (Focused / Container)
+$selected-focus-container-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.focus.icon.color (Focused / Icon)
+$selected-focus-icon-color: md-sys-color.$on-primary;
+/// md.comp.checkbox.selected.focus.state-layer.color (Focused / State layer)
+$selected-focus-state-layer-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.focus.state-layer.opacity (Focused / State layer)
+$selected-focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.checkbox.selected.hover.container.color (Hovered / Container)
+$selected-hover-container-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.hover.icon.color (Hovered / Icon)
+$selected-hover-icon-color: md-sys-color.$on-primary;
+/// md.comp.checkbox.selected.hover.state-layer.color (Hovered / State layer)
+$selected-hover-state-layer-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.hover.state-layer.opacity (Hovered / State layer)
+$selected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.checkbox.selected.icon.color (Enabled / Icon)
+$selected-icon-color: md-sys-color.$on-primary;
+/// md.comp.checkbox.selected.pressed.container.color (Pressed (ripple) / Container)
+$selected-pressed-container-color: md-sys-color.$primary;
+/// md.comp.checkbox.selected.pressed.icon.color (Pressed (ripple) / Icon)
+$selected-pressed-icon-color: md-sys-color.$on-primary;
+/// md.comp.checkbox.selected.pressed.state-layer.color (Pressed (ripple) / State layer)
+$selected-pressed-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.selected.pressed.state-layer.opacity (Pressed (ripple) / State layer)
+$selected-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.checkbox.state-layer.shape (Enabled / State layer)
+$state-layer-shape: md-sys-shape.$corner-full;
+/// md.comp.checkbox.unselected.disabled.outline.color (Disabled / Container)
+$unselected-disabled-outline-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.error.focus.outline.color (Focused / Container)
+$unselected-error-focus-outline-color: md-sys-color.$error;
+/// md.comp.checkbox.unselected.error.hover.outline.color (Hovered / Container)
+$unselected-error-hover-outline-color: md-sys-color.$error;
+/// md.comp.checkbox.unselected.error.outline.color (Enabled / Container)
+$unselected-error-outline-color: md-sys-color.$error;
+/// md.comp.checkbox.unselected.error.pressed.outline.color (Pressed (ripple) / Container)
+$unselected-error-pressed-outline-color: md-sys-color.$error;
+/// md.comp.checkbox.unselected.focus.icon.color (Focused / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$unselected-focus-icon-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.focus.outline.color (Focused / Container)
+$unselected-focus-outline-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.focus.state-layer.color (Focused / State layer)
+$unselected-focus-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.focus.state-layer.opacity (Focused / State layer)
+$unselected-focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.checkbox.unselected.hover.icon.color (Hovered / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$unselected-hover-icon-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.hover.outline.color (Hovered / Container)
+$unselected-hover-outline-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.hover.state-layer.color (Hovered / State layer)
+$unselected-hover-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.hover.state-layer.opacity (Hovered / State layer)
+$unselected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.checkbox.unselected.icon.color (Enabled / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$unselected-icon-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.outline.color (Enabled / Container)
+$unselected-outline-color: md-sys-color.$on-surface-variant;
+/// md.comp.checkbox.unselected.pressed.icon.color (Pressed (ripple) / Icon)
+///
+/// @deprecated Checkbox changed how rendering was specified, if these are needed, copy to your own tokens.
+$unselected-pressed-icon-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.pressed.outline.color (Pressed (ripple) / Container)
+$unselected-pressed-outline-color: md-sys-color.$on-surface;
+/// md.comp.checkbox.unselected.pressed.state-layer.color (Pressed (ripple) / State layer)
+$unselected-pressed-state-layer-color: md-sys-color.$primary;
+/// md.comp.checkbox.unselected.pressed.state-layer.opacity (Pressed (ripple) / State layer)
+$unselected-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;

package/tokens/versions/latest/sass/_md-comp-circular-progress-indicator-meta.scss

@@ -0,0 +1,13 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$active-indicator-width--resolved: 4px;
+$size--resolved: 48px;
+$active-indicator-color--resolved: var(--md-sys-color-primary);
+$active-indicator-shape--resolved: var(--md-sys-shape-corner-none);
+$four-color-active-indicator-four-color--resolved: var(--md-sys-color-tertiary-container);
+$four-color-active-indicator-one-color--resolved: var(--md-sys-color-primary);
+$four-color-active-indicator-three-color--resolved: var(--md-sys-color-tertiary);
+$four-color-active-indicator-two-color--resolved: var(--md-sys-color-primary-container);

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

@@ -0,0 +1,52 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// AUTOGENERATED. DO NOT MODIFY.
+// To modify this file, update the source template,
+// or run the compiler: go/carbon-service-code-gen-mwtc.
+// Source template: formats/sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 34.0.21
+// Configured context tags:
+//   audience: 3p
+//   font: static
+//   platform: web
+// Output format: sass_vars
+
+@use 'md-sys-color';
+@use 'md-sys-shape';
+
+/// md.comp.circular-progress-indicator.active-indicator.width ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$active-indicator-width: 4px;
+/// md.comp.circular-progress-indicator.size ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$size: 48px;
+/// md.comp.circular-progress-indicator.active-indicator.color ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$active-indicator-color: md-sys-color.$primary;
+/// md.comp.circular-progress-indicator.active-indicator.shape ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$active-indicator-shape: md-sys-shape.$corner-none;
+/// md.comp.circular-progress-indicator.four-color.active-indicator.four.color ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$four-color-active-indicator-four-color: md-sys-color.$tertiary-container;
+/// md.comp.circular-progress-indicator.four-color.active-indicator.one.color ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$four-color-active-indicator-one-color: md-sys-color.$primary;
+/// md.comp.circular-progress-indicator.four-color.active-indicator.three.color ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$four-color-active-indicator-three-color: md-sys-color.$tertiary;
+/// md.comp.circular-progress-indicator.four-color.active-indicator.two.color ([Deprecated] Enabled / [Deprecated] Active indicator)
+///
+/// @deprecated Token set deprecated in favour of a merged token set which combines the circular and linear progress indicator. Please use "md.com.progress-indicator" tokens instead.
+$four-color-active-indicator-two-color: md-sys-color.$primary-container;

package/tokens/versions/latest/sass/_md-comp-data-table-meta.scss

@@ -0,0 +1,46 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$footer-container-height--resolved: 52px;
+$footer-outlined-select-text-field-container-height--resolved: 36px;
+$header-container-height--resolved: 56px;
+$outline-width--resolved: 1px;
+$row-item-container-height--resolved: 52px;
+$row-item-disabled-label-text-opacity--resolved: 0.38;
+$row-item-divider-thickness--resolved: 1px;
+$row-item-outline-width--resolved: 1px;
+$container-shape--resolved: var(--md-sys-shape-corner-extra-small);
+$footer-container-color--resolved: var(--md-sys-color-surface);
+$footer-supporting-text-color--resolved: var(--md-sys-color-on-surface-variant);
+$footer-supporting-text-font--resolved: var(--md-sys-typescale-body-medium-font);
+$footer-supporting-text-line-height--resolved: var(--md-sys-typescale-body-medium-line-height);
+$footer-supporting-text-size--resolved: var(--md-sys-typescale-body-medium-size);
+$footer-supporting-text-tracking--resolved: var(--md-sys-typescale-body-medium-tracking);
+$footer-supporting-text-weight--resolved: var(--md-sys-typescale-body-medium-weight);
+$header-container-color--resolved: var(--md-sys-color-surface);
+$header-headline-color--resolved: var(--md-sys-color-on-surface-variant);
+$header-headline-font--resolved: var(--md-sys-typescale-title-small-font);
+$header-headline-line-height--resolved: var(--md-sys-typescale-title-small-line-height);
+$header-headline-size--resolved: var(--md-sys-typescale-title-small-size);
+$header-headline-tracking--resolved: var(--md-sys-typescale-title-small-tracking);
+$header-headline-weight--resolved: var(--md-sys-typescale-title-small-weight);
+$header-hover-headline-color--resolved: var(--md-sys-color-on-surface);
+$header-hover-sorting-icon-button-color--resolved: var(--md-sys-color-on-surface);
+$outline-color--resolved: var(--md-sys-color-outline-variant);
+$row-item-disabled-label-text-color--resolved: var(--md-sys-color-on-surface);
+$row-item-divider-color--resolved: var(--md-sys-color-surface-variant);
+$row-item-label-text-color--resolved: var(--md-sys-color-on-surface);
+$row-item-label-text-font--resolved: var(--md-sys-typescale-body-medium-font);
+$row-item-label-text-line-height--resolved: var(--md-sys-typescale-body-medium-line-height);
+$row-item-label-text-size--resolved: var(--md-sys-typescale-body-medium-size);
+$row-item-label-text-tracking--resolved: var(--md-sys-typescale-body-medium-tracking);
+$row-item-label-text-weight--resolved: var(--md-sys-typescale-body-medium-weight);
+$row-item-outline-color--resolved: var(--md-sys-color-outline-variant);
+$row-item-selected-container-color--resolved: var(--md-sys-color-surface-container-highest);
+$row-item-selected-hover-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$row-item-selected-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$row-item-unselected-container-color--resolved: var(--md-sys-color-surface);
+$row-item-unselected-hover-state-layer-color--resolved: var(--md-sys-color-on-surface);
+$row-item-unselected-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);

package/tokens/versions/latest/sass/_md-comp-data-table.scss

@@ -0,0 +1,110 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// AUTOGENERATED. DO NOT MODIFY.
+// To modify this file, update the source template,
+// or run the compiler: go/carbon-service-code-gen-mwtc.
+// Source template: formats/sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 34.0.21
+// Configured context tags:
+//   audience: 3p
+//   font: static
+//   platform: web
+// Output format: sass_vars
+
+@use 'md-sys-color';
+@use 'md-sys-shape';
+@use 'md-sys-state';
+@use 'md-sys-typescale';
+
+/// md.comp.data-table.footer.container.height
+$footer-container-height: 52px;
+/// md.comp.data-table.footer.outlined-select.text-field.container.height
+///
+/// @deprecated Deprecating this token until we have density tokens that can support our outline-select component.
+$footer-outlined-select-text-field-container-height: 36px;
+/// md.comp.data-table.header.container.height
+$header-container-height: 56px;
+/// md.comp.data-table.outline.width
+$outline-width: 1px;
+/// md.comp.data-table.row-item.container.height
+$row-item-container-height: 52px;
+/// md.comp.data-table.row-item.disabled.label-text.opacity
+$row-item-disabled-label-text-opacity: 0.38;
+/// md.comp.data-table.row-item.divider.thickness
+///
+/// @deprecated Replacing divider with outline. Please use md.comp.data-table.row-item.outline.* instead.
+$row-item-divider-thickness: 1px;
+/// md.comp.data-table.row-item.outline.width
+$row-item-outline-width: 1px;
+/// md.comp.data-table.container.shape
+$container-shape: md-sys-shape.$corner-extra-small;
+/// md.comp.data-table.footer.container.color
+$footer-container-color: md-sys-color.$surface;
+/// md.comp.data-table.footer.supporting-text.color
+$footer-supporting-text-color: md-sys-color.$on-surface-variant;
+/// md.comp.data-table.footer.supporting-text.font
+$footer-supporting-text-font: md-sys-typescale.$body-medium-font;
+/// md.comp.data-table.footer.supporting-text.line-height
+$footer-supporting-text-line-height: md-sys-typescale.$body-medium-line-height;
+/// md.comp.data-table.footer.supporting-text.size
+$footer-supporting-text-size: md-sys-typescale.$body-medium-size;
+/// md.comp.data-table.footer.supporting-text.tracking
+$footer-supporting-text-tracking: md-sys-typescale.$body-medium-tracking;
+/// md.comp.data-table.footer.supporting-text.weight
+$footer-supporting-text-weight: md-sys-typescale.$body-medium-weight;
+/// md.comp.data-table.header.container.color
+$header-container-color: md-sys-color.$surface;
+/// md.comp.data-table.header.headline.color
+$header-headline-color: md-sys-color.$on-surface-variant;
+/// md.comp.data-table.header.headline.font
+$header-headline-font: md-sys-typescale.$title-small-font;
+/// md.comp.data-table.header.headline.line-height
+$header-headline-line-height: md-sys-typescale.$title-small-line-height;
+/// md.comp.data-table.header.headline.size
+$header-headline-size: md-sys-typescale.$title-small-size;
+/// md.comp.data-table.header.headline.tracking
+$header-headline-tracking: md-sys-typescale.$title-small-tracking;
+/// md.comp.data-table.header.headline.weight
+$header-headline-weight: md-sys-typescale.$title-small-weight;
+/// md.comp.data-table.header.hover.headline.color
+$header-hover-headline-color: md-sys-color.$on-surface;
+/// md.comp.data-table.header.hover.sorting.icon-button.color
+$header-hover-sorting-icon-button-color: md-sys-color.$on-surface;
+/// md.comp.data-table.outline.color
+$outline-color: md-sys-color.$outline-variant;
+/// md.comp.data-table.row-item.disabled.label-text.color
+$row-item-disabled-label-text-color: md-sys-color.$on-surface;
+/// md.comp.data-table.row-item.divider.color
+///
+/// @deprecated Replacing divider with outline. Please use md.comp.data-table.row-item.outline.* instead.
+$row-item-divider-color: md-sys-color.$surface-variant;
+/// md.comp.data-table.row-item.label-text.color
+$row-item-label-text-color: md-sys-color.$on-surface;
+/// md.comp.data-table.row-item.label-text.font
+$row-item-label-text-font: md-sys-typescale.$body-medium-font;
+/// md.comp.data-table.row-item.label-text.line-height
+$row-item-label-text-line-height: md-sys-typescale.$body-medium-line-height;
+/// md.comp.data-table.row-item.label-text.size
+$row-item-label-text-size: md-sys-typescale.$body-medium-size;
+/// md.comp.data-table.row-item.label-text.tracking
+$row-item-label-text-tracking: md-sys-typescale.$body-medium-tracking;
+/// md.comp.data-table.row-item.label-text.weight
+$row-item-label-text-weight: md-sys-typescale.$body-medium-weight;
+/// md.comp.data-table.row-item.outline.color
+$row-item-outline-color: md-sys-color.$outline-variant;
+/// md.comp.data-table.row-item.selected.container.color
+$row-item-selected-container-color: md-sys-color.$surface-container-highest;
+/// md.comp.data-table.row-item.selected.hover.state-layer.color
+$row-item-selected-hover-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.data-table.row-item.selected.hover.state-layer.opacity
+$row-item-selected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.data-table.row-item.unselected.container.color
+$row-item-unselected-container-color: md-sys-color.$surface;
+/// md.comp.data-table.row-item.unselected.hover.state-layer.color
+$row-item-unselected-hover-state-layer-color: md-sys-color.$on-surface;
+/// md.comp.data-table.row-item.unselected.hover.state-layer.opacity
+$row-item-unselected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;