@use 'sass:map';
@use '@material/icon-button/icon-button-theme';
@use '@material/ripple/ripple-theme';
@use '@material/theme/shadow-dom';

// stylelint-disable selector-class-pattern --
// Selector '-mdc-*' should only be used in this project.

@mixin theme($theme) {
  @include icon-button-theme.theme($theme);

  @if shadow-dom.$css-selector-fallback-declarations {
    @include theme-styles($theme);
  }
}

@mixin theme-styles($theme) {
  .mdc-icon-button {
    @include icon-button-theme.theme-styles($theme);
  }

  @include ripple-theme.theme(
    (
      focus-state-layer-color: map.get($theme, focus-state-layer-color),
      focus-state-layer-opacity: map.get($theme, focus-state-layer-opacity),
      hover-state-layer-color: map.get($theme, hover-state-layer-color),
      hover-state-layer-opacity: map.get($theme, hover-state-layer-opacity),
      pressed-state-layer-color: map.get($theme, pressed-state-layer-color),
      pressed-state-layer-opacity: map.get($theme, pressed-state-layer-opacity),
    )
  );
}