@use 'sass:list';
@use 'sass:math';

/*
  @include layout(column, [
    ("m" "full" ((0 0) (0 0) (1 1) (0 0)))
  ]);

  @include layout($flex-direction, [
    ($bpMinWidth $bpMaxWidth ((flex:), ...)))
  ]);
*/
@mixin layout($direction, $bpColumns: [], $gap: (0 0)) {
  display: flex;
  justify-content: space-between;
  flex-direction: $direction;
  align-items: stretch;
  align-content: stretch;
  flex-wrap: wrap;

  $columnGap: list.nth($gap, 1);
  $rowGap: 0;
  @if list.length($gap) == 2 {
      $rowGap: list.nth($gap, 2);
  }
  column-gap: $columnGap;
  row-gap: $rowGap;

  & > * {
    flex: 1 0 auto;
  }

  @if list.length($bpColumns) > 0 {
    @for $bpIndex from 1 through list.length($bpColumns) {
      $bp: list.nth($bpColumns, $bpIndex);
      @include breakpoint('screen', list.nth($bp, 1), list.nth($bp, 2)) {
        $columns: list.nth($bp, 3);
        @for $i from 1 through list.length($columns) {

          $minmax: list.nth($columns, $i);
          $min: list.nth($minmax, 1);
          $max: $min;
          @if list.length($minmax) == 2 {
              $max: list.nth($minmax, 2);
          }
          $length: list.length($columns);
          $childs: $length + 'n+' + $i;

          @if math.unit($min) != "" {
            @if $direction == 'row' {
              @if $rowGap > 0 {
                $min: calc(#{$min} - #{math.div($rowGap, list.length($columns) - 1)});
              }
            }
            @if $direction == 'column' {
              @if $columnGap > 0 {
                $min: calc(#{$min} - #{math.div($columnGap, list.length($columns) - 1)});
              }
            }
          }

          @if math.unit($max) != "" {
            @if $direction == 'row' {
              @if $rowGap > 0 {
                $max: calc(#{$max} - #{math.div($rowGap, list.length($columns) - 1)});
              }
            }
            @if $direction == 'column' {
              @if $columnGap > 0 {
                $max: calc(#{$max} - #{math.div($columnGap, list.length($columns) - 1)});
              }
            }
          }

          & > *:nth-child(#{$childs}) {
            flex: $max $min auto;
            @if $direction == 'row' and $min != 0 {
              min-width: $min;
            } @else if $min > 0 {
              min-height: $min;
            }
            @if $direction == 'row' and $max != 0 {
              max-width: $max;
            } @else if $max > 0 {
              max-height: $max;
            }
          }
        }
      }
    }
  }
}
