@import '../jnt-variables';
@import '../jnt-hosts';
@import '../jnt-functions';

@mixin spinner-size($size) {
  width: $size;
  min-width: $size;
  height: $size;
  min-height: $size;
}
@keyframes spinner-dash1 {
  0% {
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dashoffset: 90;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes spinner-dash2 {
  0% {
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dashoffset: 90;
  }
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes spinner-rotate {
  0% {
    transform: rotate(0turn);
  }
  50% {
    transform: rotate(1.05turn);
  }
  100% {
    transform: rotate(2turn);
  }
}
@mixin jnt-spinner($passed: (), $context: null, $strategy: 'changes') {
  $defs: (
    color: $jnt-primary-color,
    size: null,
    sizes: (
      small: 1rem,
      normal: 2rem,
      large: 3rem
    )
  );
  $vars: $passed;
  $declare: false;
  $wrapper: null;
  @if $jnt-ng-deep {
    $wrapper: '::ng-deep';
  }
  @if $passed == () or $strategy == 'merge' {
    $vars: recursive-map-merge($defs, $passed);
    $declare: true;
  }
  #{if($context, $context, $jnt-spinner-host)} {
    display: block;
    @if map-has-key($vars, sizes) {
      $sizes: map-get($vars, sizes);
      @each $size, $map in $sizes {
        &[data-size = '#{$size}'] {
          @include spinner-size($map);
        }
      }
    }
    &[data-size] {
      width: map-get($vars, size);
      min-width: map-get($vars, size);
      height: map-get($vars, size);
      min-height: map-get($vars, size);
    }
  }
  svg[child-of=jnt-spinner-host] {
    animation: spinner-rotate 1.5s linear infinite;
    width: 100%;
    height: 100%;
    [data-stroke-spinner1][child-of=jnt-spinner-host] {
      stroke: map-get($vars, color);
      stroke-dasharray: 90;
      stroke-dashoffset: 0;
      stroke-linecap: round;
      animation: spinner-dash1 1.5s ease-in-out infinite;
    }
    [data-stroke-spinner2][child-of=jnt-spinner-host] {
      stroke: map-get($vars, color);
      stroke-dasharray: 90;
      stroke-dashoffset: 0;
      stroke-linecap: round;
      animation: spinner-dash2 1.5s ease-in-out infinite;
    }
  }
}
@if $jnt-debug {
  @debug 'spinner compiled';
}