@material/web 2.4.2-nightly.e5ed2fe.0 → 2.4.2-nightly.f57b157.0

package/tokens/versions/latest/sass/_md-comp-icon-button-filled.scss

@@ -0,0 +1,82 @@
+//
+// 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.icon-button.filled.disabled.container.opacity (Disabled)
+$disabled-container-opacity: 0.1;
+/// md.comp.icon-button.filled.disabled.icon.opacity (Disabled)
+$disabled-icon-opacity: 0.38;
+/// md.comp.icon-button.filled.container.color (Enabled)
+$container-color: md-sys-color.$primary;
+/// md.comp.icon-button.filled.disabled.container.color (Disabled)
+$disabled-container-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.filled.disabled.icon.color (Disabled)
+$disabled-icon-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.filled.focused.icon.color (Focused)
+$focused-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.focused.state-layer.color (Focused)
+$focused-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.focused.state-layer.opacity (Focused)
+$focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.filled.hovered.icon.color (Hovered)
+$hovered-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.hovered.state-layer.color (Hovered)
+$hovered-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.hovered.state-layer.opacity (Hovered)
+$hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.filled.icon.color (Enabled)
+$icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.pressed.icon.color (Pressed)
+$pressed-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.pressed.state-layer.color (Pressed)
+$pressed-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.pressed.state-layer.opacity (Pressed)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.filled.selected.container.color (Enabled)
+$selected-container-color: md-sys-color.$primary;
+/// md.comp.icon-button.filled.selected.focused.icon.color (Focused)
+$selected-focused-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.focused.state-layer.color (Focused)
+$selected-focused-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.hovered.icon.color (Hovered)
+$selected-hovered-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.hovered.state-layer.color (Hovered)
+$selected-hovered-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.icon.color (Enabled)
+$selected-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.pressed.icon.color (Pressed)
+$selected-pressed-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.selected.pressed.state-layer.color (Pressed)
+$selected-pressed-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.filled.unselected.container.color (Enabled)
+$unselected-container-color: md-sys-color.$surface-container;
+/// md.comp.icon-button.filled.unselected.focused.icon.color (Focused)
+$unselected-focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.focused.state-layer.color (Focused)
+$unselected-focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.hovered.icon.color (Hovered)
+$unselected-hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.hovered.state-layer.color (Hovered)
+$unselected-hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.icon.color (Enabled)
+$unselected-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.pressed.icon.color (Pressed)
+$unselected-pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.filled.unselected.pressed.state-layer.color (Pressed)
+$unselected-pressed-state-layer-color: md-sys-color.$on-surface-variant;

package/tokens/versions/latest/sass/_md-comp-icon-button-large-meta.scss

@@ -0,0 +1,21 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 96px;
+$default-leading-space--resolved: 32px;
+$default-trailing-space--resolved: 32px;
+$icon-size--resolved: 32px;
+$narrow-leading-space--resolved: 16px;
+$narrow-trailing-space--resolved: 16px;
+$outlined-outline-width--resolved: 2px;
+$wide-leading-space--resolved: 48px;
+$wide-trailing-space--resolved: 48px;
+$container-shape-round--resolved: var(--md-sys-shape-corner-full);
+$container-shape-square--resolved: var(--md-sys-shape-corner-extra-large);
+$pressed-container-corner-size-motion-spring-damping--resolved: var(--md-sys-motion-spring-fast-spatial-damping);
+$pressed-container-corner-size-motion-spring-stiffness--resolved: var(--md-sys-motion-spring-fast-spatial-stiffness);
+$pressed-container-shape--resolved: var(--md-sys-shape-corner-large);
+$selected-container-shape-round--resolved: var(--md-sys-shape-corner-extra-large);
+$selected-container-shape-square--resolved: var(--md-sys-shape-corner-full);

package/tokens/versions/latest/sass/_md-comp-icon-button-large.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-motion';
+@use 'md-sys-shape';
+
+/// md.comp.icon-button.large.container.height
+$container-height: 96px;
+/// md.comp.icon-button.large.default.leading-space
+$default-leading-space: 32px;
+/// md.comp.icon-button.large.default.trailing-space
+$default-trailing-space: 32px;
+/// md.comp.icon-button.large.icon.size
+$icon-size: 32px;
+/// md.comp.icon-button.large.narrow.leading-space
+$narrow-leading-space: 16px;
+/// md.comp.icon-button.large.narrow.trailing-space
+$narrow-trailing-space: 16px;
+/// md.comp.icon-button.large.outlined.outline.width
+$outlined-outline-width: 2px;
+/// md.comp.icon-button.large.wide.leading-space
+$wide-leading-space: 48px;
+/// md.comp.icon-button.large.wide.trailing-space
+$wide-trailing-space: 48px;
+/// md.comp.icon-button.large.container.shape.round
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.large.container.shape.square
+$container-shape-square: md-sys-shape.$corner-extra-large;
+/// md.comp.icon-button.large.pressed.container.corner-size.motion.spring.damping
+$pressed-container-corner-size-motion-spring-damping: md-sys-motion.$spring-fast-spatial-damping;
+/// md.comp.icon-button.large.pressed.container.corner-size.motion.spring.stiffness
+$pressed-container-corner-size-motion-spring-stiffness: md-sys-motion.$spring-fast-spatial-stiffness;
+/// md.comp.icon-button.large.pressed.container.shape
+$pressed-container-shape: md-sys-shape.$corner-large;
+/// md.comp.icon-button.large.selected.container.shape.round
+$selected-container-shape-round: md-sys-shape.$corner-extra-large;
+/// md.comp.icon-button.large.selected.container.shape.square
+$selected-container-shape-square: md-sys-shape.$corner-full;

package/tokens/versions/latest/sass/_md-comp-icon-button-medium-meta.scss

@@ -0,0 +1,21 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 56px;
+$default-leading-space--resolved: 16px;
+$default-trailing-space--resolved: 16px;
+$icon-size--resolved: 24px;
+$narrow-leading-space--resolved: 12px;
+$narrow-trailing-space--resolved: 12px;
+$outlined-outline-width--resolved: 1px;
+$wide-leading-space--resolved: 24px;
+$wide-trailing-space--resolved: 24px;
+$container-shape-round--resolved: var(--md-sys-shape-corner-full);
+$container-shape-square--resolved: var(--md-sys-shape-corner-large);
+$pressed-container-corner-size-motion-spring-damping--resolved: var(--md-sys-motion-spring-fast-spatial-damping);
+$pressed-container-corner-size-motion-spring-stiffness--resolved: var(--md-sys-motion-spring-fast-spatial-stiffness);
+$pressed-container-shape--resolved: var(--md-sys-shape-corner-medium);
+$selected-container-shape-round--resolved: var(--md-sys-shape-corner-large);
+$selected-container-shape-square--resolved: var(--md-sys-shape-corner-full);

package/tokens/versions/latest/sass/_md-comp-icon-button-medium.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-motion';
+@use 'md-sys-shape';
+
+/// md.comp.icon-button.medium.container.height
+$container-height: 56px;
+/// md.comp.icon-button.medium.default.leading-space
+$default-leading-space: 16px;
+/// md.comp.icon-button.medium.default.trailing-space
+$default-trailing-space: 16px;
+/// md.comp.icon-button.medium.icon.size
+$icon-size: 24px;
+/// md.comp.icon-button.medium.narrow.leading-space
+$narrow-leading-space: 12px;
+/// md.comp.icon-button.medium.narrow.trailing-space
+$narrow-trailing-space: 12px;
+/// md.comp.icon-button.medium.outlined.outline.width
+$outlined-outline-width: 1px;
+/// md.comp.icon-button.medium.wide.leading-space
+$wide-leading-space: 24px;
+/// md.comp.icon-button.medium.wide.trailing-space
+$wide-trailing-space: 24px;
+/// md.comp.icon-button.medium.container.shape.round
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.medium.container.shape.square
+$container-shape-square: md-sys-shape.$corner-large;
+/// md.comp.icon-button.medium.pressed.container.corner-size.motion.spring.damping
+$pressed-container-corner-size-motion-spring-damping: md-sys-motion.$spring-fast-spatial-damping;
+/// md.comp.icon-button.medium.pressed.container.corner-size.motion.spring.stiffness
+$pressed-container-corner-size-motion-spring-stiffness: md-sys-motion.$spring-fast-spatial-stiffness;
+/// md.comp.icon-button.medium.pressed.container.shape
+$pressed-container-shape: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.medium.selected.container.shape.round
+$selected-container-shape-round: md-sys-shape.$corner-large;
+/// md.comp.icon-button.medium.selected.container.shape.square
+$selected-container-shape-square: md-sys-shape.$corner-full;

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

@@ -0,0 +1,72 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 40px;
+$default-leading-space--resolved: 8px;
+$default-trailing-space--resolved: 8px;
+$disabled-container-opacity--resolved: 0.1;
+$disabled-icon-opacity--resolved: 0.38;
+$icon-size--resolved: 24px;
+$narrow-leading-space--resolved: 4px;
+$narrow-trailing-space--resolved: 4px;
+$state-layer-height--resolved: 40px;
+$state-layer-size--resolved: 40px;
+$state-layer-width--resolved: 40px;
+$wide-leading-space--resolved: 14px;
+$wide-trailing-space--resolved: 14px;
+$container-color--resolved: var(--md-sys-color-primary);
+$container-shape-round--resolved: var(--md-sys-shape-corner-full);
+$container-shape-square--resolved: var(--md-sys-shape-corner-medium);
+$disabled-container-color--resolved: var(--md-sys-color-on-surface);
+$disabled-icon-color--resolved: var(--md-sys-color-on-surface);
+$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);
+$focused-icon-color--resolved: var(--md-sys-color-on-primary);
+$focused-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$focused-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$hovered-icon-color--resolved: var(--md-sys-color-on-primary);
+$hovered-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$hovered-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$icon-color--resolved: var(--md-sys-color-on-primary);
+$pressed-container-corner-size-motion-spring-damping--resolved: var(--md-sys-motion-spring-fast-spatial-damping);
+$pressed-container-corner-size-motion-spring-stiffness--resolved: var(--md-sys-motion-spring-fast-spatial-stiffness);
+$pressed-container-shape--resolved: var(--md-sys-shape-corner-small);
+$pressed-icon-color--resolved: var(--md-sys-color-on-primary);
+$pressed-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$selected-container-color--resolved: var(--md-sys-color-primary);
+$selected-container-shape-round--resolved: var(--md-sys-shape-corner-medium);
+$selected-container-shape-square--resolved: var(--md-sys-shape-corner-full);
+$selected-focus-icon-color--resolved: var(--md-sys-color-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-focused-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-focused-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$selected-hover-icon-color--resolved: var(--md-sys-color-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-hovered-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-hovered-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$selected-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-pressed-icon-color--resolved: var(--md-sys-color-on-primary);
+$selected-pressed-state-layer-color--resolved: var(--md-sys-color-on-primary);
+$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-container-color--resolved: var(--md-sys-color-surface-container);
+$unselected-focus-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-focus-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-focus-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$unselected-focused-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-focused-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hover-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hover-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hover-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$unselected-hovered-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hovered-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);

package/tokens/versions/latest/sass/_md-comp-icon-button-outlined-meta.scss

@@ -0,0 +1,38 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$disabled-icon-opacity--resolved: 0.38;
+$selected-disabled-container-opacity--resolved: 0.1;
+$disabled-icon-color--resolved: var(--md-sys-color-on-surface);
+$disabled-outline-color--resolved: var(--md-sys-color-outline-variant);
+$focused-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$focused-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$focused-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$hovered-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$hovered-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$hovered-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$outline-color--resolved: var(--md-sys-color-outline-variant);
+$pressed-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$pressed-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$selected-container-color--resolved: var(--md-sys-color-inverse-surface);
+$selected-disabled-container-color--resolved: var(--md-sys-color-on-surface);
+$selected-focused-icon-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-focused-state-layer-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-hovered-icon-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-hovered-state-layer-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-icon-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-pressed-icon-color--resolved: var(--md-sys-color-inverse-on-surface);
+$selected-pressed-state-layer-color--resolved: var(--md-sys-color-inverse-on-surface);
+$unselected-disabled-outline-color--resolved: var(--md-sys-color-outline-variant);
+$unselected-focused-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-focused-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hovered-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hovered-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-outline-color--resolved: var(--md-sys-color-outline-variant);
+$unselected-pressed-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);

package/tokens/versions/latest/sass/_md-comp-icon-button-outlined.scss

@@ -0,0 +1,86 @@
+//
+// 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.icon-button.outlined.disabled.icon.opacity (Disabled)
+$disabled-icon-opacity: 0.38;
+/// md.comp.icon-button.outlined.selected.disabled.container.opacity (Disabled)
+$selected-disabled-container-opacity: 0.1;
+/// md.comp.icon-button.outlined.disabled.icon.color (Disabled)
+$disabled-icon-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.outlined.disabled.outline.color (Disabled)
+$disabled-outline-color: md-sys-color.$outline-variant;
+/// md.comp.icon-button.outlined.focused.icon.color (Focused)
+$focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.focused.state-layer.color (Focused)
+$focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.focused.state-layer.opacity (Focused)
+$focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.outlined.hovered.icon.color (Hovered)
+$hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.hovered.state-layer.color (Hovered)
+$hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.hovered.state-layer.opacity (Hovered)
+$hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.outlined.icon.color (Enabled)
+$icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.outline.color (Enabled)
+$outline-color: md-sys-color.$outline-variant;
+/// md.comp.icon-button.outlined.pressed.icon.color (Pressed)
+$pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.pressed.state-layer.color (Pressed)
+$pressed-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.pressed.state-layer.opacity (Pressed)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.outlined.selected.container.color (Enabled)
+$selected-container-color: md-sys-color.$inverse-surface;
+/// md.comp.icon-button.outlined.selected.disabled.container.color (Disabled)
+$selected-disabled-container-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.outlined.selected.focused.icon.color (Focused)
+$selected-focused-icon-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.focused.state-layer.color (Focused)
+$selected-focused-state-layer-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.hovered.icon.color (Hovered)
+$selected-hovered-icon-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.hovered.state-layer.color (Hovered)
+$selected-hovered-state-layer-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.icon.color (Enabled)
+$selected-icon-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.pressed.icon.color (Pressed)
+$selected-pressed-icon-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.selected.pressed.state-layer.color (Pressed)
+$selected-pressed-state-layer-color: md-sys-color.$inverse-on-surface;
+/// md.comp.icon-button.outlined.unselected.disabled.outline.color (Disabled)
+$unselected-disabled-outline-color: md-sys-color.$outline-variant;
+/// md.comp.icon-button.outlined.unselected.focused.icon.color (Focused)
+$unselected-focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.focused.state-layer.color (Focused)
+$unselected-focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.hovered.icon.color (Hovered)
+$unselected-hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.hovered.state-layer.color (Hovered)
+$unselected-hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.icon.color (Enabled)
+$unselected-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.outline.color (Enabled)
+$unselected-outline-color: md-sys-color.$outline-variant;
+/// md.comp.icon-button.outlined.unselected.pressed.icon.color (Pressed)
+$unselected-pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.outlined.unselected.pressed.state-layer.color (Pressed)
+$unselected-pressed-state-layer-color: md-sys-color.$on-surface-variant;

package/tokens/versions/latest/sass/_md-comp-icon-button-small-meta.scss

@@ -0,0 +1,21 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$container-height--resolved: 40px;
+$default-leading-space--resolved: 8px;
+$default-trailing-space--resolved: 8px;
+$icon-size--resolved: 24px;
+$narrow-leading-space--resolved: 4px;
+$narrow-trailing-space--resolved: 4px;
+$outlined-outline-width--resolved: 1px;
+$wide-leading-space--resolved: 14px;
+$wide-trailing-space--resolved: 14px;
+$container-shape-round--resolved: var(--md-sys-shape-corner-full);
+$container-shape-square--resolved: var(--md-sys-shape-corner-medium);
+$pressed-container-corner-size-motion-spring-damping--resolved: var(--md-sys-motion-spring-fast-spatial-damping);
+$pressed-container-corner-size-motion-spring-stiffness--resolved: var(--md-sys-motion-spring-fast-spatial-stiffness);
+$pressed-container-shape--resolved: var(--md-sys-shape-corner-small);
+$selected-container-shape-round--resolved: var(--md-sys-shape-corner-medium);
+$selected-container-shape-square--resolved: var(--md-sys-shape-corner-full);

package/tokens/versions/latest/sass/_md-comp-icon-button-small.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-motion';
+@use 'md-sys-shape';
+
+/// md.comp.icon-button.small.container.height
+$container-height: 40px;
+/// md.comp.icon-button.small.default.leading-space
+$default-leading-space: 8px;
+/// md.comp.icon-button.small.default.trailing-space
+$default-trailing-space: 8px;
+/// md.comp.icon-button.small.icon.size
+$icon-size: 24px;
+/// md.comp.icon-button.small.narrow.leading-space
+$narrow-leading-space: 4px;
+/// md.comp.icon-button.small.narrow.trailing-space
+$narrow-trailing-space: 4px;
+/// md.comp.icon-button.small.outlined.outline.width
+$outlined-outline-width: 1px;
+/// md.comp.icon-button.small.wide.leading-space
+$wide-leading-space: 14px;
+/// md.comp.icon-button.small.wide.trailing-space
+$wide-trailing-space: 14px;
+/// md.comp.icon-button.small.container.shape.round
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.small.container.shape.square
+$container-shape-square: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.small.pressed.container.corner-size.motion.spring.damping
+$pressed-container-corner-size-motion-spring-damping: md-sys-motion.$spring-fast-spatial-damping;
+/// md.comp.icon-button.small.pressed.container.corner-size.motion.spring.stiffness
+$pressed-container-corner-size-motion-spring-stiffness: md-sys-motion.$spring-fast-spatial-stiffness;
+/// md.comp.icon-button.small.pressed.container.shape
+$pressed-container-shape: md-sys-shape.$corner-small;
+/// md.comp.icon-button.small.selected.container.shape.round
+$selected-container-shape-round: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.small.selected.container.shape.square
+$selected-container-shape-square: md-sys-shape.$corner-full;

package/tokens/versions/latest/sass/_md-comp-icon-button-standard-meta.scss

@@ -0,0 +1,31 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$disabled-icon-opacity--resolved: 0.38;
+$disabled-icon-color--resolved: var(--md-sys-color-on-surface);
+$focused-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$focused-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$focused-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$hovered-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$hovered-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$hovered-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$pressed-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$pressed-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$selected-focused-icon-color--resolved: var(--md-sys-color-primary);
+$selected-focused-state-layer-color--resolved: var(--md-sys-color-primary);
+$selected-hovered-icon-color--resolved: var(--md-sys-color-primary);
+$selected-hovered-state-layer-color--resolved: var(--md-sys-color-primary);
+$selected-icon-color--resolved: var(--md-sys-color-primary);
+$selected-pressed-icon-color--resolved: var(--md-sys-color-primary);
+$selected-pressed-state-layer-color--resolved: var(--md-sys-color-primary);
+$unselected-focused-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-focused-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hovered-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-hovered-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-icon-color--resolved: var(--md-sys-color-on-surface-variant);
+$unselected-pressed-state-layer-color--resolved: var(--md-sys-color-on-surface-variant);

package/tokens/versions/latest/sass/_md-comp-icon-button-standard.scss

@@ -0,0 +1,72 @@
+//
+// 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.icon-button.standard.disabled.icon.opacity (Disabled)
+$disabled-icon-opacity: 0.38;
+/// md.comp.icon-button.standard.disabled.icon.color (Disabled)
+$disabled-icon-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.standard.focused.icon.color (Focused)
+$focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.focused.state-layer.color (Focused)
+$focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.focused.state-layer.opacity (Focused)
+$focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.standard.hovered.icon.color (Hovered)
+$hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.hovered.state-layer.color (Hovered)
+$hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.hovered.state-layer.opacity (Hovered)
+$hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.standard.icon.color (Enabled)
+$icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.pressed.icon.color (Pressed)
+$pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.pressed.state-layer.color (Pressed)
+$pressed-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.pressed.state-layer.opacity (Pressed)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.standard.selected.focused.icon.color (Focused)
+$selected-focused-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.focused.state-layer.color (Focused)
+$selected-focused-state-layer-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.hovered.icon.color (Hovered)
+$selected-hovered-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.hovered.state-layer.color (Hovered)
+$selected-hovered-state-layer-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.icon.color (Enabled)
+$selected-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.pressed.icon.color (Pressed)
+$selected-pressed-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.selected.pressed.state-layer.color (Pressed)
+$selected-pressed-state-layer-color: md-sys-color.$primary;
+/// md.comp.icon-button.standard.unselected.focused.icon.color (Focused)
+$unselected-focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.focused.state-layer.color (Focused)
+$unselected-focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.hovered.icon.color (Hovered)
+$unselected-hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.hovered.state-layer.color (Hovered)
+$unselected-hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.icon.color (Enabled)
+$unselected-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.pressed.icon.color (Pressed)
+$unselected-pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.standard.unselected.pressed.state-layer.color (Pressed)
+$unselected-pressed-state-layer-color: md-sys-color.$on-surface-variant;

package/tokens/versions/latest/sass/_md-comp-icon-button-tonal-meta.scss

@@ -0,0 +1,36 @@
+//
+// Copyright 2026 Google LLC
+// SPDX-License-Identifier: Apache-2.0
+//
+// Auto-generated token metadata.
+$disabled-container-opacity--resolved: 0.1;
+$disabled-icon-opacity--resolved: 0.38;
+$container-color--resolved: var(--md-sys-color-secondary-container);
+$disabled-container-color--resolved: var(--md-sys-color-on-surface);
+$disabled-icon-color--resolved: var(--md-sys-color-on-surface);
+$focused-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$focused-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$focused-state-layer-opacity--resolved: var(--md-sys-state-focus-state-layer-opacity);
+$hovered-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$hovered-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$hovered-state-layer-opacity--resolved: var(--md-sys-state-hover-state-layer-opacity);
+$icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$pressed-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$pressed-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$pressed-state-layer-opacity--resolved: var(--md-sys-state-pressed-state-layer-opacity);
+$selected-container-color--resolved: var(--md-sys-color-secondary);
+$selected-focused-icon-color--resolved: var(--md-sys-color-on-secondary);
+$selected-focused-state-layer-color--resolved: var(--md-sys-color-on-secondary);
+$selected-hovered-icon-color--resolved: var(--md-sys-color-on-secondary);
+$selected-hovered-state-layer-color--resolved: var(--md-sys-color-on-secondary);
+$selected-icon-color--resolved: var(--md-sys-color-on-secondary);
+$selected-pressed-icon-color--resolved: var(--md-sys-color-on-secondary);
+$selected-pressed-state-layer-color--resolved: var(--md-sys-color-on-secondary);
+$unselected-container-color--resolved: var(--md-sys-color-secondary-container);
+$unselected-focused-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-focused-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-hovered-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-hovered-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-pressed-icon-color--resolved: var(--md-sys-color-on-secondary-container);
+$unselected-pressed-state-layer-color--resolved: var(--md-sys-color-on-secondary-container);