@material/web 2.4.2-nightly.082faad.0 → 2.4.2-nightly.2fe7e22.0

package/tokens/versions/latest/sass/_md-comp-menus-vibrant.scss

@@ -0,0 +1,160 @@
+//
+// 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-state';
+
+/// md.comp.menus.vibrant.menu-item.disabled.label-text.opacity (Disabled)
+$menu-item-disabled-label-text-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.disabled.leading-icon.opacity (Disabled)
+$menu-item-disabled-leading-icon-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.disabled.supporting-text.opacity (Disabled)
+$menu-item-disabled-supporting-text-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.disabled.trailing-icon.opacity (Disabled)
+$menu-item-disabled-trailing-icon-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.disabled.trailing-supporting-text.opacity (Disabled)
+$menu-item-disabled-trailing-supporting-text-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.selected.disabled.label-text.opacity (Disabled, Selected)
+$menu-item-selected-disabled-label-text-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.selected.disabled.leading-icon.opacity (Disabled, Selected)
+$menu-item-selected-disabled-leading-icon-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.selected.disabled.supporting-text.opacity (Disabled, Selected)
+$menu-item-selected-disabled-supporting-text-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.selected.disabled.trailing-icon.opacity (Disabled, Selected)
+$menu-item-selected-disabled-trailing-icon-opacity: 0.38;
+/// md.comp.menus.vibrant.menu-item.selected.disabled.trailing-supporting-text.opacity (Disabled, Selected)
+$menu-item-selected-disabled-trailing-supporting-text-opacity: 0.38;
+/// md.comp.menus.vibrant.container.color (Enabled)
+$container-color: md-sys-color.$tertiary-container;
+/// md.comp.menus.vibrant.icon-button.container.color (Enabled)
+$icon-button-container-color: md-sys-color.$tertiary-container;
+/// md.comp.menus.vibrant.icon-button.disabled.icon.color (Disabled)
+$icon-button-disabled-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.icon-button.focused.state-layer.color (Focused)
+$icon-button-focused-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.icon-button.hovered.state-layer.color (Hovered)
+$icon-button-hovered-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.icon-button.icon.color (Enabled)
+$icon-button-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.icon-button.pressed.state-layer.color (Pressed)
+$icon-button-pressed-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.icon-button.selected.container.color (Enabled, Selected)
+$icon-button-selected-container-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.icon-button.selected.disabled.icon.color (Disabled, Selected)
+$icon-button-selected-disabled-icon-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.icon-button.selected.icon.color (Enabled, Selected)
+$icon-button-selected-icon-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.active.state-layer.color (Enabled, Active)
+$menu-item-active-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.active.state-layer.opacity (Enabled, Active)
+$menu-item-active-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.color (Enabled)
+$menu-item-color: md-sys-color.$tertiary-container;
+/// md.comp.menus.vibrant.menu-item.disabled.label-text.color (Disabled)
+$menu-item-disabled-label-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.disabled.leading-icon.color (Disabled)
+$menu-item-disabled-leading-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.disabled.supporting-text.color (Disabled)
+$menu-item-disabled-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.disabled.trailing-icon.color (Disabled)
+$menu-item-disabled-trailing-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.disabled.trailing-supporting-text.color (Disabled)
+$menu-item-disabled-trailing-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.focused.label-text.color (Focused)
+$menu-item-focused-label-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.focused.leading-icon.color (Focused)
+$menu-item-focused-leading-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.focused.state-layer.color (Focused)
+$menu-item-focused-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.focused.state-layer.opacity (Focused)
+$menu-item-focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.focused.supporting-text.color (Focused)
+$menu-item-focused-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.focused.trailing-icon.color (Focused)
+$menu-item-focused-trailing-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.focused.trailing-supporting-text.color (Focused)
+$menu-item-focused-trailing-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.hovered.label-text.color (Hovered)
+$menu-item-hovered-label-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.hovered.leading-icon.color (Hovered)
+$menu-item-hovered-leading-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.hovered.state-layer.color (Hovered)
+$menu-item-hovered-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.hovered.state-layer.opacity (Hovered)
+$menu-item-hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.hovered.supporting-text.color (Hovered)
+$menu-item-hovered-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.hovered.trailing-icon.color (Hovered)
+$menu-item-hovered-trailing-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.hovered.trailing-supporting-text.color (Hovered)
+$menu-item-hovered-trailing-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.label-text.color (Enabled)
+$menu-item-label-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.leading-icon.color (Enabled)
+$menu-item-leading-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.pressed.label-text.color (Pressed)
+$menu-item-pressed-label-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.pressed.leading-icon.color (Pressed)
+$menu-item-pressed-leading-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.pressed.state-layer.color (Pressed)
+$menu-item-pressed-state-layer-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.pressed.state-layer.opacity (Pressed)
+$menu-item-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.pressed.supporting-text.color (Pressed)
+$menu-item-pressed-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.pressed.trailing-icon.color (Pressed)
+$menu-item-pressed-trailing-icon-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.pressed.trailing-supporting-text.color (Pressed)
+$menu-item-pressed-trailing-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.selected.container.color (Enabled, Selected)
+$menu-item-selected-container-color: md-sys-color.$tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.focused.label-text.color (Focused, Selected)
+$menu-item-selected-focused-label-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.focused.state-layer.color (Focused, Selected)
+$menu-item-selected-focused-state-layer-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.focused.state-layer.opacity (Focused, Selected)
+$menu-item-selected-focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.selected.hovered.label-text.color (Hovered, Selected)
+$menu-item-selected-hovered-label-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.hovered.state-layer.color (Hovered, Selected)
+$menu-item-selected-hovered-state-layer-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.hovered.state-layer.opacity (Hovered, Selected)
+$menu-item-selected-hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.selected.label-text.color (Enabled, Selected)
+$menu-item-selected-label-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.leading-icon.color (Enabled, Selected)
+$menu-item-selected-leading-icon-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.pressed.label-text.color (Pressed, Selected)
+$menu-item-selected-pressed-label-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.pressed.state-layer.color (Pressed, Selected)
+$menu-item-selected-pressed-state-layer-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.pressed.state-layer.opacity (Pressed, Selected)
+$menu-item-selected-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.menus.vibrant.menu-item.selected.supporting-text.color (Enabled, Selected)
+$menu-item-selected-supporting-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.trailing-icon.color (Enabled, Selected)
+$menu-item-selected-trailing-icon-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.selected.trailing-supporting-text.color (Enabled, Selected)
+$menu-item-selected-trailing-supporting-text-color: md-sys-color.$on-tertiary;
+/// md.comp.menus.vibrant.menu-item.supporting-text.color (Enabled)
+$menu-item-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.trailing-icon.color (Enabled)
+$menu-item-trailing-icon-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.menu-item.trailing-supporting-text.color (Enabled)
+$menu-item-trailing-supporting-text-color: md-sys-color.$on-tertiary-container;
+/// md.comp.menus.vibrant.section-label-text.color (Enabled)
+$section-label-text-color: md-sys-color.$on-tertiary-container;

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

@@ -0,0 +1,141 @@
+//
+// 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-focus-indicator';
+@use 'md-sys-typescale';
+
+/// md.comp.menus.gap (Layout / Default)
+$gap: 2px;
+/// md.comp.menus.group.padding (Layout / Default)
+$group-padding: 2px;
+/// md.comp.menus.horizontal.container.bottom-space (Layout / Horizontal)
+$horizontal-container-bottom-space: 8px;
+/// md.comp.menus.horizontal.container.top-space (Layout / Horizontal)
+$horizontal-container-top-space: 8px;
+/// md.comp.menus.horizontal.icon-only.gap (Layout / Horizontal icon-only)
+$horizontal-icon-only-gap: 4px;
+/// md.comp.menus.horizontal.icon-only.menu-item.bottom-space (Layout / Horizontal icon-only)
+$horizontal-icon-only-menu-item-bottom-space: 16px;
+/// md.comp.menus.horizontal.icon-only.menu-item.leading-space (Layout / Horizontal icon-only)
+$horizontal-icon-only-menu-item-leading-space: 16px;
+/// md.comp.menus.horizontal.icon-only.menu-item.top-space (Layout / Horizontal icon-only)
+$horizontal-icon-only-menu-item-top-space: 16px;
+/// md.comp.menus.horizontal.icon-only.menu-item.trailing-space (Layout / Horizontal icon-only)
+$horizontal-icon-only-menu-item-trailing-space: 16px;
+/// md.comp.menus.horizontal.menu-item.between-space (Layout / Horizontal)
+$horizontal-menu-item-between-space: 12px;
+/// md.comp.menus.horizontal.menu-item.bottom-space (Layout / Horizontal)
+$horizontal-menu-item-bottom-space: 6px;
+/// md.comp.menus.horizontal.menu-item.leading-space (Layout / Horizontal)
+$horizontal-menu-item-leading-space: 12px;
+/// md.comp.menus.horizontal.menu-item.top-space (Layout / Horizontal)
+$horizontal-menu-item-top-space: 6px;
+/// md.comp.menus.horizontal.menu-item.trailing-space (Layout / Horizontal)
+$horizontal-menu-item-trailing-space: 12px;
+/// md.comp.menus.menu-item.between-space (Layout / Default)
+$menu-item-between-space: 12px;
+/// md.comp.menus.menu-item.bottom-space (Layout / Default)
+$menu-item-bottom-space: 8px;
+/// md.comp.menus.menu-item.height (Layout / Default)
+$menu-item-height: 44px;
+/// md.comp.menus.menu-item.leading-icon.size (Layout / Default)
+$menu-item-leading-icon-size: 20px;
+/// md.comp.menus.menu-item.leading-space (Layout / Default)
+$menu-item-leading-space: 16px;
+/// md.comp.menus.menu-item.top-space (Layout / Default)
+$menu-item-top-space: 8px;
+/// md.comp.menus.menu-item.trailing-icon.size (Layout / Default)
+$menu-item-trailing-icon-size: 20px;
+/// md.comp.menus.menu-item.trailing-space (Layout / Default)
+$menu-item-trailing-space: 16px;
+/// md.comp.menus.active.container.shape (Shape / Default)
+$active-container-shape: md-sys-shape.$corner-large;
+/// md.comp.menus.container.elevation (Layout / Default)
+$container-elevation: md-sys-elevation.$level2;
+/// md.comp.menus.container.shape (Shape / Default)
+$container-shape: md-sys-shape.$corner-large;
+/// md.comp.menus.group.shape (Shape / Default)
+$group-shape: md-sys-shape.$corner-small;
+/// md.comp.menus.horizontal.container.shape (Shape / Horizontal, Default)
+$horizontal-container-shape: md-sys-shape.$corner-full;
+/// md.comp.menus.horizontal.icon-only.menu-item.selected.shape (Shape / Horizontal icon-only, selected)
+$horizontal-icon-only-menu-item-selected-shape: md-sys-shape.$corner-full;
+/// md.comp.menus.horizontal.menu-item.focused.shape (Shape / Horizontal, Default)
+$horizontal-menu-item-focused-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.horizontal.menu-item.hovered.shape (Shape / Horizontal, Default)
+$horizontal-menu-item-hovered-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.horizontal.menu-item.pressed.shape (Shape / Horizontal, Default)
+$horizontal-menu-item-pressed-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.horizontal.menu-item.selected.focused.shape (Shape / Horizontal, Selected)
+$horizontal-menu-item-selected-focused-shape: md-sys-shape.$corner-full;
+/// md.comp.menus.horizontal.menu-item.selected.hovered.shape (Shape / Horizontal, Selected)
+$horizontal-menu-item-selected-hovered-shape: md-sys-shape.$corner-full;
+/// md.comp.menus.horizontal.menu-item.selected.pressed.shape (Shape / Horizontal, Selected)
+$horizontal-menu-item-selected-pressed-shape: md-sys-shape.$corner-full;
+/// md.comp.menus.inactive.container.shape (Shape / Default)
+$inactive-container-shape: md-sys-shape.$corner-small;
+/// md.comp.menus.menu-item.first-child.inner-corner.corner-size (Shape / Default)
+$menu-item-first-child-inner-corner-corner-size: md-sys-shape.$corner-extra-small;
+/// md.comp.menus.menu-item.first-child.shape (Shape / Default)
+$menu-item-first-child-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.menu-item.focus.indicator.color (Focus ring)
+$menu-item-focus-indicator-color: md-sys-color.$secondary;
+/// md.comp.menus.menu-item.focus.indicator.outline.offset (Focus ring)
+$menu-item-focus-indicator-outline-offset: md-sys-state-focus-indicator.$inner-offset;
+/// md.comp.menus.menu-item.focus.indicator.thickness (Focus ring)
+$menu-item-focus-indicator-thickness: md-sys-state-focus-indicator.$thickness;
+/// md.comp.menus.menu-item.label-text.font (Typography)
+$menu-item-label-text-font: md-sys-typescale.$label-large-font;
+/// md.comp.menus.menu-item.label-text.line-height (Typography)
+$menu-item-label-text-line-height: md-sys-typescale.$label-large-line-height;
+/// md.comp.menus.menu-item.label-text.size (Typography)
+$menu-item-label-text-size: md-sys-typescale.$label-large-size;
+/// md.comp.menus.menu-item.label-text.tracking (Typography)
+$menu-item-label-text-tracking: md-sys-typescale.$label-large-tracking;
+/// md.comp.menus.menu-item.label-text.weight (Typography)
+$menu-item-label-text-weight: md-sys-typescale.$label-large-weight;
+/// md.comp.menus.menu-item.last-child.inner-corner.corner-size (Shape / Default)
+$menu-item-last-child-inner-corner-corner-size: md-sys-shape.$corner-extra-small;
+/// md.comp.menus.menu-item.last-child.shape (Shape / Default)
+$menu-item-last-child-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.menu-item.selected.shape (Shape / Selected)
+$menu-item-selected-shape: md-sys-shape.$corner-medium;
+/// md.comp.menus.menu-item.shape (Shape / Default)
+$menu-item-shape: md-sys-shape.$corner-extra-small;
+/// md.comp.menus.menu-item.supporting-text.font (Typography)
+$menu-item-supporting-text-font: md-sys-typescale.$body-small-font;
+/// md.comp.menus.menu-item.supporting-text.line-height (Typography)
+$menu-item-supporting-text-line-height: md-sys-typescale.$body-small-line-height;
+/// md.comp.menus.menu-item.supporting-text.size (Typography)
+$menu-item-supporting-text-size: md-sys-typescale.$body-small-size;
+/// md.comp.menus.menu-item.supporting-text.tracking (Typography)
+$menu-item-supporting-text-tracking: md-sys-typescale.$body-small-tracking;
+/// md.comp.menus.menu-item.supporting-text.weight (Typography)
+$menu-item-supporting-text-weight: md-sys-typescale.$body-small-weight;
+/// md.comp.menus.menu-item.trailing-supporting-text.font (Typography)
+$menu-item-trailing-supporting-text-font: md-sys-typescale.$label-large-font;
+/// md.comp.menus.menu-item.trailing-supporting-text.line-height (Typography)
+$menu-item-trailing-supporting-text-line-height: md-sys-typescale.$label-large-line-height;
+/// md.comp.menus.menu-item.trailing-supporting-text.size (Typography)
+$menu-item-trailing-supporting-text-size: md-sys-typescale.$label-large-size;
+/// md.comp.menus.menu-item.trailing-supporting-text.tracking (Typography)
+$menu-item-trailing-supporting-text-tracking: md-sys-typescale.$label-large-tracking;
+/// md.comp.menus.menu-item.trailing-supporting-text.weight (Typography)
+$menu-item-trailing-supporting-text-weight: md-sys-typescale.$label-large-weight;

package/tokens/versions/latest/sass/_md-comp-nav-bar-item-horizontal-meta.scss

@@ -0,0 +1,9 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$active-indicator-height--resolved: 40px;
+$active-indicator-icon-label-space--resolved: 4px;
+$active-indicator-leading-space--resolved: 16px;
+$active-indicator-trailing-space--resolved: 16px;

package/tokens/versions/latest/sass/_md-comp-nav-bar-item-horizontal.scss

@@ -0,0 +1,31 @@
+//
+// 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-typescale';
+
+/// md.comp.nav-bar.item.horizontal.active-indicator.height
+$active-indicator-height: 40px;
+/// md.comp.nav-bar.item.horizontal.active-indicator.icon-label-space
+$active-indicator-icon-label-space: 4px;
+/// md.comp.nav-bar.item.horizontal.active-indicator.leading-space
+$active-indicator-leading-space: 16px;
+/// md.comp.nav-bar.item.horizontal.active-indicator.trailing-space
+$active-indicator-trailing-space: 16px;
+/// md.comp.nav-bar.item.horizontal.label-text.font
+@mixin label-text-font {
+  @include md-sys-typescale.label-medium;
+}

package/tokens/versions/latest/sass/_md-comp-nav-bar-item-vertical-meta.scss

@@ -0,0 +1,9 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$active-indicator-height--resolved: 32px;
+$active-indicator-icon-label-space--resolved: 4px;
+$active-indicator-width--resolved: 56px;
+$container-between-space--resolved: 6px;

package/tokens/versions/latest/sass/_md-comp-nav-bar-item-vertical.scss

@@ -0,0 +1,31 @@
+//
+// 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-typescale';
+
+/// md.comp.nav-bar.item.vertical.active-indicator.height
+$active-indicator-height: 32px;
+/// md.comp.nav-bar.item.vertical.active-indicator.icon-label-space
+$active-indicator-icon-label-space: 4px;
+/// md.comp.nav-bar.item.vertical.active-indicator.width
+$active-indicator-width: 56px;
+/// md.comp.nav-bar.item.vertical.container.between-space
+$container-between-space: 6px;
+/// md.comp.nav-bar.item.vertical.label-text.font
+@mixin label-text-font {
+  @include md-sys-typescale.label-medium;
+}

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

@@ -0,0 +1,28 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 64px;
+$item-active-indicator-icon-label-space--resolved: 4px;
+$item-between-space--resolved: 0px;
+$item-icon-size--resolved: 24px;
+$container-color--resolved: var(--md-sys-color-surface-container);
+$container-elevation--resolved: var(--md-sys-elevation-level2);
+$container-shadow-color--resolved: var(--md-sys-color-shadow);
+$container-shape--resolved: var(--md-sys-shape-corner-none);
+$item-active-indicator-shape--resolved: var(--md-sys-shape-corner-full);
+$item-active-focused-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-active-focused-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$item-active-hovered-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-active-hovered-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$item-active-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-active-indicator-color--resolved: var(--md-sys-color-secondary-container);
+$item-active-label-text-color--resolved: var(--md-sys-color-secondary);
+$item-active-pressed-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-active-pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$item-inactive-focused-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-inactive-hovered-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$item-inactive-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$item-inactive-label-text-color--resolved: var(--md-sys-color-on-surface-variant);
+$item-inactive-pressed-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);

package/tokens/versions/latest/sass/_md-comp-nav-bar.scss

@@ -0,0 +1,68 @@
+//
+// 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';
+
+/// md.comp.nav-bar.container.height (Container)
+$container-height: 64px;
+/// md.comp.nav-bar.item.active-indicator.icon-label-space (Nav item)
+$item-active-indicator-icon-label-space: 4px;
+/// md.comp.nav-bar.item.between-space (Nav item)
+$item-between-space: 0px;
+/// md.comp.nav-bar.item.icon.size (Nav item)
+$item-icon-size: 24px;
+/// md.comp.nav-bar.container.color (Color / Enabled)
+$container-color: md-sys-color.$surface-container;
+/// md.comp.nav-bar.container.elevation (Color / Enabled)
+$container-elevation: md-sys-elevation.$level2;
+/// md.comp.nav-bar.container.shadow-color (Color / Enabled)
+$container-shadow-color: md-sys-color.$shadow;
+/// md.comp.nav-bar.container.shape (Container)
+$container-shape: md-sys-shape.$corner-none;
+/// md.comp.nav-bar.item.active-indicator.shape (Nav item)
+$item-active-indicator-shape: md-sys-shape.$corner-full;
+/// md.comp.nav-bar.item.active.focused.state-layer.color (Color / Focused)
+$item-active-focused-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.active.focused.state-layer.opacity (Color / Focused)
+$item-active-focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.nav-bar.item.active.hovered.state-layer.color (Color / Hovered)
+$item-active-hovered-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.active.hovered.state-layer.opacity (Color / Hovered)
+$item-active-hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.nav-bar.item.active.icon.color (Color / Enabled)
+$item-active-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.active.indicator.color (Color / Enabled)
+$item-active-indicator-color: md-sys-color.$secondary-container;
+/// md.comp.nav-bar.item.active.label-text.color (Color / Enabled)
+$item-active-label-text-color: md-sys-color.$secondary;
+/// md.comp.nav-bar.item.active.pressed.state-layer.color (Color / Pressed)
+$item-active-pressed-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.active.pressed.state-layer.opacity (Color / Pressed)
+$item-active-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.nav-bar.item.inactive.focused.state-layer.color (Color / Focused)
+$item-inactive-focused-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.inactive.hovered.state-layer.color (Color / Hovered)
+$item-inactive-hovered-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.nav-bar.item.inactive.icon.color (Color / Enabled)
+$item-inactive-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.nav-bar.item.inactive.label-text.color (Color / Enabled)
+$item-inactive-label-text-color: md-sys-color.$on-surface-variant;
+/// md.comp.nav-bar.item.inactive.pressed.state-layer.color (Color / Pressed)
+$item-inactive-pressed-state-layer-color: md-sys-color.$on-secondary-container;

package/tokens/versions/latest/sass/_md-comp-nav-rail-collapsed-meta.scss

@@ -0,0 +1,12 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-width--resolved: 96px;
+$item-vertical-space--resolved: 4px;
+$narrow-container-width--resolved: 80px;
+$top-space--resolved: 44px;
+$container-color--resolved: var(--md-sys-color-surface);
+$container-elevation--resolved: var(--md-sys-elevation-level0);
+$container-shape--resolved: var(--md-sys-shape-corner-none);

package/tokens/versions/latest/sass/_md-comp-nav-rail-collapsed.scss

@@ -0,0 +1,35 @@
+//
+// 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';
+
+/// md.comp.nav-rail.collapsed.container.width
+$container-width: 96px;
+/// md.comp.nav-rail.collapsed.item.vertical-space
+$item-vertical-space: 4px;
+/// md.comp.nav-rail.collapsed.narrow.container.width
+$narrow-container-width: 80px;
+/// md.comp.nav-rail.collapsed.top-space
+$top-space: 44px;
+/// md.comp.nav-rail.collapsed.container.color
+$container-color: md-sys-color.$surface;
+/// md.comp.nav-rail.collapsed.container.elevation
+$container-elevation: md-sys-elevation.$level0;
+/// md.comp.nav-rail.collapsed.container.shape
+$container-shape: md-sys-shape.$corner-none;

package/tokens/versions/latest/sass/_md-comp-nav-rail-expanded-meta.scss

@@ -0,0 +1,16 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$between-item-space--resolved: 0px;
+$container-width-maximum--resolved: 360px;
+$container-width-minimum--resolved: 220px;
+$top-space--resolved: 44px;
+$vertical-trailing-space--resolved: 20px;
+$container-color--resolved: var(--md-sys-color-surface);
+$container-elevation--resolved: var(--md-sys-elevation-level0);
+$container-shape--resolved: var(--md-sys-shape-corner-none);
+$modal-container-color--resolved: var(--md-sys-color-surface-container);
+$modal-container-elevation--resolved: var(--md-sys-elevation-level2);
+$modal-container-shape--resolved: var(--md-sys-shape-corner-large);

package/tokens/versions/latest/sass/_md-comp-nav-rail-expanded.scss

@@ -0,0 +1,47 @@
+//
+// 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';
+
+/// md.comp.nav-rail.expanded.between-item-space
+///
+/// @deprecated Token not needed as value is "0dp"
+$between-item-space: 0px;
+/// md.comp.nav-rail.expanded.container.width.maximum
+$container-width-maximum: 360px;
+/// md.comp.nav-rail.expanded.container.width.minimum
+$container-width-minimum: 220px;
+/// md.comp.nav-rail.expanded.top-space
+$top-space: 44px;
+/// md.comp.nav-rail.expanded.vertical.trailing-space
+///
+/// @deprecated Token moved to nav rail item horizontal set
+$vertical-trailing-space: 20px;
+/// md.comp.nav-rail.expanded.container.color
+$container-color: md-sys-color.$surface;
+/// md.comp.nav-rail.expanded.container.elevation
+$container-elevation: md-sys-elevation.$level0;
+/// md.comp.nav-rail.expanded.container.shape
+$container-shape: md-sys-shape.$corner-none;
+/// md.comp.nav-rail.expanded.modal.container.color
+$modal-container-color: md-sys-color.$surface-container;
+/// md.comp.nav-rail.expanded.modal.container.elevation
+$modal-container-elevation: md-sys-elevation.$level2;
+/// md.comp.nav-rail.expanded.modal.container.shape
+$modal-container-shape: md-sys-shape.$corner-large;

package/tokens/versions/latest/sass/_md-comp-nav-rail-item-horizontal-meta.scss

@@ -0,0 +1,9 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$active-indicator-height--resolved: 56px;
+$full-width-leading-space--resolved: 16px;
+$full-width-trailing-space--resolved: 16px;
+$icon-label-space--resolved: 8px;

package/tokens/versions/latest/sass/_md-comp-nav-rail-item-horizontal.scss

@@ -0,0 +1,31 @@
+//
+// 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-typescale';
+
+/// md.comp.nav-rail.item.horizontal.active-indicator.height
+$active-indicator-height: 56px;
+/// md.comp.nav-rail.item.horizontal.full-width.leading-space
+$full-width-leading-space: 16px;
+/// md.comp.nav-rail.item.horizontal.full-width.trailing-space
+$full-width-trailing-space: 16px;
+/// md.comp.nav-rail.item.horizontal.icon-label-space
+$icon-label-space: 8px;
+/// md.comp.nav-rail.item.horizontal.label-text.font
+@mixin label-text-font {
+  @include md-sys-typescale.label-large;
+}