$unit: 4px;

$spacing-data: (
  none: 0,
  extra-tight: rem($unit),
  tight: rem($unit * 2),
  base: rem($unit * 4),
  loose: rem($unit * 5),
  extra-loose: rem($unit * 8)
);

/// Returns the spacing value for a given variant.
///
/// @param {String} $variant - The key for the given variant.
/// @return {Number} The spacing for the variant.

@function spacing($variant: base) {
  $fetched-value: map-get($spacing-data, $variant);

  @if type-of($fetched-value) == number {
    @return $fetched-value;
  } @else {
    @error 'Spacing variant `#{$variant}` not found. Available variants: #{available-names($spacing-data)}';
  }
}