@use "sass:list";
@use "sass:meta";
@use "sass:map" as sassmap;
@use "../tools/map";

$map: (
  xs: 0,
  sm: 480px,
  md: 768px,
  lg: 992px,
  xl: 1240px,
  xxl: 1380px,
);

@mixin get($breakpoint, $param: false) {
  @if (not sassmap.has-key($map, $breakpoint) and $breakpoint != "default") {
    @warn 'Breakpoint "#{$breakpoint}" is not defined.';

    @debug "Available breakpoints:"; // stylelint-disable-line at-rule-disallowed-list
    @debug $map; // stylelint-disable-line at-rule-disallowed-list
  }

  @if (
    ($breakpoint == list.nth(sassmap.keys($map), 1) and not $param) or
      (not $breakpoint) or
      ($breakpoint == "default")
  ) {
    @content;
  } @else if not $param {
    // no param, just a standard mobile first media query
    @if sassmap.has-key($map, $breakpoint) {
      // breakpoint is in breakpoint map, let's use stored value
      @media screen and (min-width: sassmap.get($map, $breakpoint)) {
        @content;
      }
    } @else {
      // breakpoint is not in breakpoint map, let's use custom value
      @media screen and (min-width: $breakpoint) {
        @content;
      }
    }
  } @else if ($param == "down" and map.next($map, $breakpoint)) {
    @media screen and (max-width: map.next($map, $breakpoint) - 0.02px) {
      @content;
    }
  } @else if ($param == "down" and not sassmap.has-key($map, $breakpoint)) {
    @media screen and (max-width: $breakpoint) {
      @content;
    }
  } @else if ($param == "only" and map.next($map, $breakpoint)) {
    @media screen and (min-width: sassmap.get($map, $breakpoint)) and (max-width: map.next($map, $breakpoint) - 0.02px) {
      @content;
    }
  } @else if
    (sassmap.has-key($map, $param) and sassmap.has-key($map, $breakpoint))
  {
    @media screen and (min-width: sassmap.get($map, $breakpoint)) and (max-width: sassmap.get($map, $param) - 0.02px) {
      @content;
    }
  } @else if
    (
      $param ==
        "downfrom" and
        sassmap.get($map, $breakpoint) >
        0 and
        $breakpoint !=
        "xs"
    )
  {
    @media screen and (max-width: sassmap.get($map, $breakpoint) - 0.02px) {
      @content;
    } // -1
  } @else if (meta.type-of($param) == "number") {
    @if sassmap.has-key($map, $breakpoint) {
      // breakpoint is in breakpoint map
      @media screen and (min-width: sassmap.get($map, $breakpoint)) and (max-width: $param) {
        @content;
      }
    } @else {
      // breakpoint is not in breakpoint map, let's use custom value
      @media screen and (min-width: $breakpoint) and (max-width: $param) {
        @content;
      }
    }
  } @else if
    (
      not
        (
          $breakpoint == list.nth(sassmap.keys($map), -1) and $param == "down"
        ) and not
        (
          $breakpoint == list.nth(sassmap.keys($map), -1) and $param == "only"
        ) and not
        (
          $breakpoint ==
            list.nth(sassmap.keys($map), 1) and
            $param ==
            "downfrom"
        )
    )
  {
    // do nothing on known edge cases. we just dont generate any code.
    @warn 'Breakpoint is not configured properly #{$breakpoint}, #{$param}';
  }
}

@mixin each() {
  @each $breakpoint, $size in $map {
    @include get($breakpoint) {
      @content ($breakpoint);
    }
  }
}