@use 'sass:map';
@use 'vars' as *;

// Бандлы вариантов кнопки: каждый вариант даёт полный набор цветов, чтобы
// место могло переключиться на любой из них целиком, а не по одному цвету.
$button-variants: (
  primary: (
    'bg': $button-primary-bg,
    'bg--hover': $button-primary-bg--hover,
    'bg--active': $button-primary-bg,
    'text': $button-primary-text,
    'text--active': $button-primary-text,
    'border': $button-primary-border,
    'border--hover': $button-primary-border,
    'border--active': $button-primary-border,
  ),
  secondary: (
    'bg': $button-secondary-bg,
    'bg--hover': $button-secondary-bg--hover,
    'bg--active': $button-secondary-bg--active,
    'text': $button-secondary-text,
    'text--active': $button-secondary-text--active,
    'border': $button-secondary-border,
    'border--hover': $button-secondary-border,
    'border--active': $button-secondary-border--active,
  ),
  muted: (
    'bg': $button-muted-bg,
    'bg--hover': $button-muted-bg--hover,
    'bg--active': $button-muted-bg,
    'text': $button-muted-text,
    'text--active': $button-muted-text,
    'border': $button-muted-border,
    'border--hover': $button-muted-border--hover,
    'border--active': $button-muted-border,
  ),
  warning: (
    'bg': $button-warning-bg,
    'bg--hover': $button-warning-bg--hover,
    'bg--active': $button-warning-bg,
    'text': $button-warning-text,
    'text--active': $button-warning-text,
    'border': $button-warning-border,
    'border--hover': $button-warning-border,
    'border--active': $button-warning-border,
  ),
);

// Вид кнопки в конкретном месте выбирает ТЕМА, а не компонент: место говорит
// «спроси у темы по этому ключу», тема отвечает именем варианта.
//
//   // в компоненте
//   .auth-login__cancel { @include button-variant(auth-login-cancel); }
//
//   // в теме
//   $button-variant-overrides: (auth-login-cancel: muted);
//
// Ключа в карте темы нет — не печатается ничего, работает вариант из пропа
// theme= на вызове. Так тема, которой тут нечего менять, не пишет ни строки.
//
// Класс на элементе при этом остаётся тем, что задан пропом: кнопка может
// висеть с `--muted`, а выглядеть как primary. Поэтому первой строкой
// печатается `--button-variant` — маркер для DevTools, который объясняет
// расхождение. Никем не читается, существует только как документация.
@mixin button-variant($key) {
  $name: map.get($button-variant-overrides, $key);

  @if $name {
    $variant: map.get($button-variants, $name);

    @if not $variant {
      @error 'button-variant(): неизвестный вариант `#{$name}` для ключа `#{$key}`. Допустимые: #{map.keys($button-variants)}';
    }

    --button-variant: #{$name};

    @each $prop, $value in $variant {
      --button-#{$prop}: #{$value};
    }
  }
}