@import "./_colors-map";

@mixin semantic-color($category, $color, $property) {
  $semantic-colors-data: map-get($theme-colors-map, $category);
  $semantic-color: map-get($semantic-colors-data, $color);
  @if not $semantic-color {
    @error "Didn't found any match for: #{$color}, #{$category}, #{$property}";
  }
  @if type-of($semantic-color) == string {
    #{$property}: $semantic-color;
  } @else {
    #{$property}: map-get($semantic-color, DEFAULT);
    @if map-has-key($semantic-color, hover) {
      &:hover,
      &:focus {
        #{$property}: map-get($semantic-color, hover);
      }
    }
    @if map-has-key($semantic-color, press) {
      &:active {
        #{$property}: map-get($semantic-color, press);
      }
    }
  }
}

@function color-var($category, $color, $modifier: "") {
  $semantic-colors-data: map-get($theme-colors-map, $category);
  $semantic-color: map-get($semantic-colors-data, $color);
  @if not $semantic-color {
    @error "Didn't found any match for: #{$color}, #{$category}";
  }
  @if type-of($semantic-color) == string {
    @if $modifier != "" {
      @error "There is no modifier #{$modifier} for: #{$color}, #{$category}";
    }
    @return $semantic-color;
  } @else {
    @if not $modifier {
      @error "A modifier must be provied for: #{$color}, #{$category}.";
    }
    @if not map-has-key($semantic-color, $modifier) {
      @error "Didn't found any match for: #{$color}, #{$category} with modifier: #{$modifier}";
    }
    @return map-get($semantic-color, $modifier);
  }
}

@mixin bg-color($color) {
  @include semantic-color(background, $color, background-color);
}

@mixin fill-color($color) {
  @include semantic-color(fill, $color, fill);
}

@mixin fill-bg-color($color) {
  @include semantic-color(fill, $color, background-color);
}

@mixin border-color($color) {
  @include semantic-color(stroke, $color, border-color);
}

@mixin text-color($color) {
  @include semantic-color(text, $color, color);
}

// LEGACY
$color-data: (
  white: #fff,
  grey: (
    lighter: #f8f7f8,
    light: #edebed,
    base: #dbd8dc,
    dark: #a49da7
  ),
  indigo: (
    base: #61366b,
    dark: #390446
  ),
  purple: (
    light: #d076ca,
    base: #b01aa7
  ),
  graphite: (
    light: #757575,
    base: #333
  ),
  turquoise: #5ecbdd,
  coral: #ffa484,
  amber: #ffc25a,
  red: #ff7378,
  green: (
    light: #0fffb3,
    base: #00da94,
    dark: #00a873
  ),
  blue: #2ea2ea,
  transparent: transparent,
  current: currentColor
);

@function color($name, $variant: base) {
  $variants: map-get($color-data, $name);

  @if not $variants {
    @error "Color `#{$name}` not found.";
  }

  @if type-of($variants) == color {
    $variants: (
      base: $variants
    );
  }

  $value: map-get($variants, $variant);

  @if not $value {
    @error "Variant `#{$variant}` not found for color `#{$name}`.";
  }

  @return $value;
}
