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

package/tokens/versions/v30_0/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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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/v30_0/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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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/v30_0/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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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/v30_0/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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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/v30_0/sass/_md-comp-icon-button-tonal.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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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.tonal.disabled.container.opacity (Disabled)
+$disabled-container-opacity: 0.1;
+/// md.comp.icon-button.tonal.disabled.icon.opacity (Disabled)
+$disabled-icon-opacity: 0.38;
+/// md.comp.icon-button.tonal.container.color (Enabled)
+$container-color: md-sys-color.$secondary-container;
+/// md.comp.icon-button.tonal.disabled.container.color (Disabled)
+$disabled-container-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.tonal.disabled.icon.color (Disabled)
+$disabled-icon-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.tonal.focused.icon.color (Focused)
+$focused-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.focused.state-layer.color (Focused)
+$focused-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.focused.state-layer.opacity (Focused)
+$focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.tonal.hovered.icon.color (Hovered)
+$hovered-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.hovered.state-layer.color (Hovered)
+$hovered-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.hovered.state-layer.opacity (Hovered)
+$hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.tonal.icon.color (Enabled)
+$icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.pressed.icon.color (Pressed)
+$pressed-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.pressed.state-layer.color (Pressed)
+$pressed-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.pressed.state-layer.opacity (Pressed)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.tonal.selected.container.color (Enabled)
+$selected-container-color: md-sys-color.$secondary;
+/// md.comp.icon-button.tonal.selected.focused.icon.color (Focused)
+$selected-focused-icon-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.focused.state-layer.color (Focused)
+$selected-focused-state-layer-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.hovered.icon.color (Hovered)
+$selected-hovered-icon-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.hovered.state-layer.color (Hovered)
+$selected-hovered-state-layer-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.icon.color (Enabled)
+$selected-icon-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.pressed.icon.color (Pressed)
+$selected-pressed-icon-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.selected.pressed.state-layer.color (Pressed)
+$selected-pressed-state-layer-color: md-sys-color.$on-secondary;
+/// md.comp.icon-button.tonal.unselected.container.color (Enabled)
+$unselected-container-color: md-sys-color.$secondary-container;
+/// md.comp.icon-button.tonal.unselected.focused.icon.color (Focused)
+$unselected-focused-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.focused.state-layer.color (Focused)
+$unselected-focused-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.hovered.icon.color (Hovered)
+$unselected-hovered-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.hovered.state-layer.color (Hovered)
+$unselected-hovered-state-layer-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.icon.color (Enabled)
+$unselected-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.pressed.icon.color (Pressed)
+$unselected-pressed-icon-color: md-sys-color.$on-secondary-container;
+/// md.comp.icon-button.tonal.unselected.pressed.state-layer.color (Pressed)
+$unselected-pressed-state-layer-color: md-sys-color.$on-secondary-container;

package/tokens/versions/v30_0/sass/_md-comp-icon-button-xlarge.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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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.xlarge.container.height
+$container-height: 136px;
+/// md.comp.icon-button.xlarge.default.leading-space
+$default-leading-space: 48px;
+/// md.comp.icon-button.xlarge.default.trailing-space
+$default-trailing-space: 48px;
+/// md.comp.icon-button.xlarge.icon.size
+$icon-size: 40px;
+/// md.comp.icon-button.xlarge.narrow.leading-space
+$narrow-leading-space: 32px;
+/// md.comp.icon-button.xlarge.narrow.trailing-space
+$narrow-trailing-space: 32px;
+/// md.comp.icon-button.xlarge.outlined.outline.width
+$outlined-outline-width: 3px;
+/// md.comp.icon-button.xlarge.wide.leading-space
+$wide-leading-space: 72px;
+/// md.comp.icon-button.xlarge.wide.trailing-space
+$wide-trailing-space: 72px;
+/// md.comp.icon-button.xlarge.container.shape.round
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.xlarge.container.shape.square
+$container-shape-square: md-sys-shape.$corner-extra-large;
+/// md.comp.icon-button.xlarge.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.xlarge.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.xlarge.pressed.container.shape
+$pressed-container-shape: md-sys-shape.$corner-large;
+/// md.comp.icon-button.xlarge.selected.container.shape.round
+$selected-container-shape-round: md-sys-shape.$corner-extra-large;
+/// md.comp.icon-button.xlarge.selected.container.shape.square
+$selected-container-shape-square: md-sys-shape.$corner-full;

package/tokens/versions/v30_0/sass/_md-comp-icon-button-xsmall.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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// 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.xsmall.container.height
+$container-height: 32px;
+/// md.comp.icon-button.xsmall.default.leading-space
+$default-leading-space: 6px;
+/// md.comp.icon-button.xsmall.default.trailing-space
+$default-trailing-space: 6px;
+/// md.comp.icon-button.xsmall.icon.size
+$icon-size: 20px;
+/// md.comp.icon-button.xsmall.narrow.leading-space
+$narrow-leading-space: 4px;
+/// md.comp.icon-button.xsmall.narrow.trailing-space
+$narrow-trailing-space: 4px;
+/// md.comp.icon-button.xsmall.outlined.outline.width
+$outlined-outline-width: 1px;
+/// md.comp.icon-button.xsmall.wide.leading-space
+$wide-leading-space: 10px;
+/// md.comp.icon-button.xsmall.wide.trailing-space
+$wide-trailing-space: 10px;
+/// md.comp.icon-button.xsmall.container.shape.round
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.xsmall.container.shape.square
+$container-shape-square: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.xsmall.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.xsmall.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.xsmall.pressed.container.shape
+$pressed-container-shape: md-sys-shape.$corner-small;
+/// md.comp.icon-button.xsmall.selected.container.shape.round
+$selected-container-shape-round: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.xsmall.selected.container.shape.square
+$selected-container-shape-square: md-sys-shape.$corner-full;

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

@@ -0,0 +1,193 @@
+//
+// 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: sassvars/contextualtokenset.scss.tmpl
+
+// Design system: Google Material 3
+// Version: 30.0.14
+// Configured context tags:
+//   audience: 3p
+//   font: static
+//   platform: web
+// Output format: sass_vars
+
+@use 'md-sys-color';
+@use 'md-sys-motion';
+@use 'md-sys-shape';
+@use 'md-sys-state';
+@use 'md-sys-state-focus-indicator';
+
+/// md.comp.icon-button.container.height (Enabled)
+$container-height: 40px;
+/// md.comp.icon-button.default.leading-space (Enabled)
+$default-leading-space: 8px;
+/// md.comp.icon-button.default.trailing-space (Enabled)
+$default-trailing-space: 8px;
+/// md.comp.icon-button.disabled.container.opacity (Disabled)
+$disabled-container-opacity: 0.1;
+/// md.comp.icon-button.disabled.icon.opacity (Disabled)
+$disabled-icon-opacity: 0.38;
+/// md.comp.icon-button.icon.size (Enabled)
+$icon-size: 24px;
+/// md.comp.icon-button.narrow.leading-space (Enabled)
+$narrow-leading-space: 4px;
+/// md.comp.icon-button.narrow.trailing-space (Enabled)
+$narrow-trailing-space: 4px;
+/// md.comp.icon-button.state-layer.height ([Deprecated] Enabled / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$state-layer-height: 40px;
+/// md.comp.icon-button.state-layer.size ([Deprecated] Enabled / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$state-layer-size: 40px;
+/// md.comp.icon-button.state-layer.width ([Deprecated] Enabled / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$state-layer-width: 40px;
+/// md.comp.icon-button.wide.leading-space (Enabled)
+$wide-leading-space: 14px;
+/// md.comp.icon-button.wide.trailing-space (Enabled)
+$wide-trailing-space: 14px;
+/// md.comp.icon-button.container.color (Enabled)
+$container-color: md-sys-color.$primary;
+/// md.comp.icon-button.container.shape.round (Enabled)
+$container-shape-round: md-sys-shape.$corner-full;
+/// md.comp.icon-button.container.shape.square (Enabled)
+$container-shape-square: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.disabled.container.color (Disabled)
+$disabled-container-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.disabled.icon.color (Disabled)
+$disabled-icon-color: md-sys-color.$on-surface;
+/// md.comp.icon-button.focus.indicator.color (Enabled)
+$focus-indicator-color: md-sys-color.$secondary;
+/// md.comp.icon-button.focus.indicator.outline.offset (Enabled)
+$focus-indicator-outline-offset: md-sys-state-focus-indicator.$outer-offset;
+/// md.comp.icon-button.focus.indicator.thickness (Enabled)
+$focus-indicator-thickness: md-sys-state-focus-indicator.$thickness;
+/// md.comp.icon-button.focused.icon.color (Focused)
+$focused-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.focused.state-layer.color (Focused)
+$focused-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.focused.state-layer.opacity (Focused)
+$focused-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.hovered.icon.color (Hovered)
+$hovered-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.hovered.state-layer.color (Hovered)
+$hovered-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.hovered.state-layer.opacity (Hovered)
+$hovered-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.icon.color (Enabled)
+$icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.pressed.container.corner-size.motion.spring.damping (Enabled)
+$pressed-container-corner-size-motion-spring-damping: md-sys-motion.$spring-fast-spatial-damping;
+/// md.comp.icon-button.pressed.container.corner-size.motion.spring.stiffness (Enabled)
+$pressed-container-corner-size-motion-spring-stiffness: md-sys-motion.$spring-fast-spatial-stiffness;
+/// md.comp.icon-button.pressed.container.shape (Enabled)
+$pressed-container-shape: md-sys-shape.$corner-small;
+/// md.comp.icon-button.pressed.icon.color (Pressed)
+$pressed-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.pressed.state-layer.color (Pressed)
+$pressed-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.pressed.state-layer.opacity (Pressed)
+$pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.selected.container.color (Enabled)
+$selected-container-color: md-sys-color.$primary;
+/// md.comp.icon-button.selected.container.shape.round (Enabled)
+$selected-container-shape-round: md-sys-shape.$corner-medium;
+/// md.comp.icon-button.selected.container.shape.square (Enabled)
+$selected-container-shape-square: md-sys-shape.$corner-full;
+/// md.comp.icon-button.selected.focus.icon.color ([Deprecated] Focused / [Deprecated] Icon)
+///
+/// @deprecated Token is deprecated.
+$selected-focus-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.selected.focus.state-layer.color ([Deprecated] Focused / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$selected-focus-state-layer-color: md-sys-color.$primary;
+/// md.comp.icon-button.selected.focus.state-layer.opacity ([Deprecated] Focused / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$selected-focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.selected.focused.icon.color (Focused)
+$selected-focused-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.focused.state-layer.color (Focused)
+$selected-focused-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.hover.icon.color ([Deprecated] Hovered / [Deprecated] Icon)
+///
+/// @deprecated Token is deprecated.
+$selected-hover-icon-color: md-sys-color.$primary;
+/// md.comp.icon-button.selected.hover.state-layer.color ([Deprecated] Hovered / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$selected-hover-state-layer-color: md-sys-color.$primary;
+/// md.comp.icon-button.selected.hover.state-layer.opacity ([Deprecated] Hovered / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$selected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.selected.hovered.icon.color (Hovered)
+$selected-hovered-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.hovered.state-layer.color (Hovered)
+$selected-hovered-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.icon.color (Enabled)
+$selected-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.pressed.icon.color (Pressed)
+$selected-pressed-icon-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.pressed.state-layer.color (Pressed)
+$selected-pressed-state-layer-color: md-sys-color.$on-primary;
+/// md.comp.icon-button.selected.pressed.state-layer.opacity ([Deprecated] Pressed (ripple) / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$selected-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;
+/// md.comp.icon-button.state-layer.shape ([Deprecated] Enabled / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$state-layer-shape: md-sys-shape.$corner-full;
+/// md.comp.icon-button.unselected.container.color (Enabled)
+$unselected-container-color: md-sys-color.$surface-container;
+/// md.comp.icon-button.unselected.focus.icon.color ([Deprecated] Focused / [Deprecated] Icon)
+///
+/// @deprecated Token is deprecated.
+$unselected-focus-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.focus.state-layer.color ([Deprecated] Focused / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$unselected-focus-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.focus.state-layer.opacity ([Deprecated] Focused / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$unselected-focus-state-layer-opacity: md-sys-state.$focus-state-layer-opacity;
+/// md.comp.icon-button.unselected.focused.icon.color (Focused)
+$unselected-focused-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.focused.state-layer.color (Focused)
+$unselected-focused-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.hover.icon.color ([Deprecated] Hovered / [Deprecated] Icon)
+///
+/// @deprecated Token is deprecated.
+$unselected-hover-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.hover.state-layer.color ([Deprecated] Hovered / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$unselected-hover-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.hover.state-layer.opacity ([Deprecated] Hovered / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$unselected-hover-state-layer-opacity: md-sys-state.$hover-state-layer-opacity;
+/// md.comp.icon-button.unselected.hovered.icon.color (Hovered)
+$unselected-hovered-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.hovered.state-layer.color (Hovered)
+$unselected-hovered-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.icon.color (Enabled)
+$unselected-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.pressed.icon.color (Pressed)
+$unselected-pressed-icon-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.pressed.state-layer.color (Pressed)
+$unselected-pressed-state-layer-color: md-sys-color.$on-surface-variant;
+/// md.comp.icon-button.unselected.pressed.state-layer.opacity ([Deprecated] Pressed (ripple) / [Deprecated] State layer)
+///
+/// @deprecated Token is deprecated.
+$unselected-pressed-state-layer-opacity: md-sys-state.$pressed-state-layer-opacity;