@use 'sass:map' as map;
@use 'sass:list' as list;
@use 'sass:string' as str;
@use '../layout/breakpoints' as breakpoints;
@use '../configs' as configs;
@use 'utilities' as *;

// Utility generator
// Used to generate utilities & print utilities
@mixin generate-utility($utility, $infix) {
  $values: map.get($utility, values);

  // If the values are a list or string, convert it into a map
  @if type-of($values) == 'string' or type-of(nth($values, 1)) != 'list' {
    $values: list.zip($values, $values);
  }

  @each $key, $value in $values {
    $properties: map.get($utility, property);

    // Multiple properties are possible, for example with vertical or horizontal margins or paddings
    @if type-of($properties) == 'string' {
      $properties: list.append((), $properties);
    }

    // Use custom class if present
    $property-class: if(
      map.has-key($utility, class),
      map.get($utility, class),
      list.nth($properties, 1)
    );
    $property-class: if($property-class == null, '', $property-class);

    // State params to generate pseudo-classes
    $state: if(map.has-key($utility, state), map.get($utility, state), ());

    $infix: if(
      $property-class == '' and str.slice($infix, 1, 1) == '-',
      str.slice($infix, 2),
      $infix
    );

    // Don't prefix if value key is null (eg. with shadow class)
    $property-class-modifier: if(
      $key,
      if($property-class == '' and $infix == '', '', '-') + $key,
      ''
    );

    $is-css-var: map.get($utility, css-var);
    $is-local-vars: map.get($utility, local-vars);

    @if $value {
      @if $is-css-var {
        .#{$property-class + $infix + $property-class-modifier} {
          --#{$property-class}: #{$value};
        }

        @each $pseudo in $state {
          .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
            --#{$property-class}: #{$value};
          }
        }
      } @else {
        .#{$property-class + $infix + $property-class-modifier} {
          @each $property in $properties {
            @if $is-local-vars {
              @each $local-var, $value in $is-local-vars {
                --#{$local-var}: #{$value};
              }
            }
            #{$property}: $value !important;
          }
        }

        @each $pseudo in $state {
          .#{$property-class + $infix + $property-class-modifier}-#{$pseudo}:#{$pseudo} {
            @each $property in $properties {
              #{$property}: $value !important;
            }
          }
        }
      }
    }
  }
}

// Loop over each breakpoint
@each $breakpoint in map.keys(configs.$grid-breakpoints) {
  // Generate media query if needed
  @include breakpoints.media-breakpoint-up($breakpoint) {
    $infix: breakpoints.breakpoint-infix($breakpoint, configs.$grid-breakpoints);

    // Loop over each utility property
    @each $key, $utility in $utilities {
      // The utility can be disabled with `false`, thus check if the utility is a map first
      // Only proceed if responsive media queries are enabled or if it's the base media query
      @if type-of($utility) == 'map' and (map.get($utility, responsive) or $infix == '') {
        @include generate-utility($utility, $infix);
      }
    }
  }
}

// Print utilities
@media print {
  @each $key, $utility in $utilities {
    // The utility can be disabled with `false`, thus check if the utility is a map first
    // Then check if the utility needs print styles
    @if type-of($utility) == 'map' and map.get($utility, print) == true {
      @include generate-utility($utility, '-print');
    }
  }
}