// Use root entry points to get configured values
@use "../variables" as *;
@use "../util/scss/calc.scss" as *;
@use "sass:map";
@use "sass:list";

@mixin cx-palette(
   $palette-colors: $cx-default-palette-colors,
   $palette-fill-whiten: $cx-default-palette-fill-whiten,
   $palette-fill-hover-whiten: $cx-default-palette-fill-hover-whiten,
   $palette-fill-selected-whiten: $cx-default-palette-fill-selected-whiten,
   $palette-fill-disabled-whiten: $cx-default-palette-fill-disabled-whiten,
   $palette-fill-blacken: $cx-default-palette-fill-blacken,
   $palette-fill-hover-blacken: $cx-default-palette-fill-hover-blacken,
   $palette-fill-selected-blacken: $cx-default-palette-fill-selected-blacken,
   $palette-fill-disabled-blacken: $cx-default-palette-fill-disabled-blacken,
   $palette-stroke-whiten: $cx-default-palette-stroke-whiten,
   $palette-stroke-blacken: $cx-default-palette-stroke-blacken,
   $besm: $cx-besm
) {
   $block: map.get($besm, block);
   $element: map.get($besm, element);
   $state: map.get($besm, state);

   @for $i from 1 through list.length($palette-colors) {
      $c: list.nth($palette-colors, 1 + (($i - 1) * 1) % list.length($palette-colors));

      .#{$state}color-#{$i - 1} {
         $fill: cx-darken(cx-lighten($c, $palette-fill-whiten), $palette-fill-blacken);
         $stroke: cx-darken(cx-lighten($fill, $palette-stroke-whiten), $palette-stroke-blacken);
         fill: $fill;
         stroke: $stroke;
         background: $fill;
         border-color: $stroke;

         &.#{$state}selectable:hover,
         &.#{$state}selectable.#{$state}hover,
         .#{$state}color-root:hover &,
         .#{$state}color-root.#{$state}hover & {
            $fill: cx-darken(cx-lighten($c, $palette-fill-hover-whiten), $palette-fill-hover-blacken);
            $stroke: cx-darken(cx-lighten($fill, $palette-stroke-whiten), $palette-stroke-blacken);
            fill: $fill;
            stroke: $stroke;
            background: $fill;
            border-color: $stroke;
         }

         &.#{$state}selected,
         &.#{$state}selected:hover,
         &.#{$state}selected.#{$state}hover,
         .#{$state}color-root.#{$state}selected &,
         .#{$state}color-root.#{$state}selected:hover &,
         .#{$state}color-root.#{$state}selected.#{$state}hover & {
            $fill: cx-darken(cx-lighten($c, $palette-fill-selected-whiten), $palette-fill-selected-blacken);
            $stroke: cx-darken(cx-lighten($fill, $palette-stroke-whiten), $palette-stroke-blacken);
            fill: $fill;
            stroke: $stroke;
            background: $fill;
            border-color: $stroke;
         }

         &.#{$state}disabled,
         .#{$state}color-root.#{$state}disabled & {
            $fill: cx-darken(cx-lighten($c, $palette-fill-disabled-whiten), $palette-fill-disabled-blacken);
            $stroke: cx-darken(cx-lighten($fill, $palette-stroke-whiten), $palette-stroke-blacken);
            fill: $fill;
            stroke: $stroke;
            background: $fill;
            border-color: $stroke;
         }
      }
   }
}

@if (cx-should-include("cx/charts/palette")) {
   @include cx-palette();
}