// --------------------------------------------
// API Map Retrieve --------------------------
// --------------------------------------------


// Returns the spacing value for a given variant.
// @example
//  padding: space(sm);
@function space($value: md) {
  $fetched-value: map-get($space, $value);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'Spacing variant `#{$space}` not found.';
  }
}


//
// Returns the core theme sizes.
// @example
//  {{any-attribute}}: theme-size(sm);
//
@function theme-size($value: sm) {
  $fetched-value: map-get($global-sizes, $value);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'theme-sizes variant `#{$value}` not found.';
  }
}


// Returns the radius value for a given variant.
// @example
//  radius: radius(sm);
@function radius($value: md) {
  $fetched-value: map-get($radius, $value);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'Radius variant `#{$radius}` not found.';
  }
}


// Returns the font weight for a given weight definition.
// @example
//  font-weight: font-weight(bold);
@function font-weight($value: normal) {
  $fetched-font-weight: map-get($font-weight, $value);

  @if type-of($fetched-font-weight) != null {
    @return $fetched-font-weight;
  } @else {
    @error 'Font weight `#{$value}` not found.';
  }
}


// Returns the line height for a given range.
// @example
//  line-height: line-height(header, sm);
@function line-height($map: body, $value: sm) {

  @if $map == body {
    @return config($font-body, $value, 'line-height');
  } @else if $map == header {
    @return config($font-header, $value, 'line-height');
  } @else {
    @error 'Line Height `#{value}` not found.';
  }
}

// Returns the font size for a given size definition.
// @example
//  font-size: font-size(header, xl);
@function font-size($map: body, $value: sm) {

  @if $map == body {
    @return config($font-body, $value, 'font-size');
  } @else if $map == header {
    @return config($font-header, $value, 'font-size');
  } @else {
    @error 'Font Size `#{value}` not found.';
  }
}

// Returns the theme value.
@function global($value: null) {
  $fetched-value: map-get($global-config, $value);

  @return $fetched-value;
}

// Returns the app-config value.
@function app-config($value: null) {
  $fetched-value: map-get($app-config, $value);

  @return $fetched-value;
}


// Returns the font family for a given definition.
// @example
//  font-family:  font(sans);
@function font($value: sans) {
  $fetched-font: theme($value);

  @if type-of($fetched-font) != null {
    @return $fetched-font;
  } @else {
    @error 'Font family `#{$value}` not found.';
  }
}


// Returns the shadow for the specified depth.
// @example
//  shadow:  shadow(md);
@function shadow($value: sm) {
  $fetched-value: map-get($shadow, $value);

  @if type-of($fetched-value) != null {
    @return $fetched-value;
  } @else {
    @error 'Shadow variant not found.';
  }
}


// Returns the z-index of the specified element.
// @example
//  z-index:  z();
@function z($value: null) {
  $fetched-value: map-get($z-index, $value);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'Z-Index `#{$value}` not found.';
  }
}

// Returns the color value for a given color name and group.
// @example
//  background: color(primary, 3);
@function color($value: primary, $range: 8) {

  @if $value == black {
    @return $color-black;
  } @else if $value == white {
    @return $color-white;
  } @else if $value == gray {
    @return config($color, 'gray', $range);
  } @else {
    @return config($color, $value, $range);
  }
}

@function color-extended($value: cyan, $range: 7) {

  @if $value == violet {
    @return config($color-extended, 'violet', $range);
  } @else if $value == lime {
    @return config($color-extended, 'lime', $range);
  } @else if $value == cyan {
    @return config($color-extended, 'cyan', $range);
  } @else if $value == grape {
    @return config($color-extended, 'grape', $range);
  } @else if $value == blue {
    @return config($color-extended, 'blue', $range);
  } @else if $value == indigo {
    @return config($color-extended, 'indigo', $range);
  } @else if $value == teal {
    @return config($color-extended, 'teal', $range);
  } @else if $value == pink {
    @return config($color-extended, 'pink', $range);
  } @else if $value == orange {
    @return config($color-extended, 'orange', $range);
  } @else {
    @error 'Color `#{$value} - #{$range}` not found.';
  }
}


// Returns the breakpoint size given its named size.
// @example
//  @media all and (min-width: breakpoint('small')) { }
@function breakpoint($value: sm) {
  $fetched-value: map-get($breakpoints, $value);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'Breakpoint `#{$value}` not found.';
  }
}


// Turn any value into pixels
// @example
//  font-size: convert-to-px(14); // 14px
@function convert-to-px($value) {
  @if (type-of($value) == number and $value != 0) {
    $value: if(unitless($value), $value * 1px, $value);
  }

  @return $value;
}