// ============================================================================
// 02-TOOLS -> MIXINS -> #GENERATE-CUSTOM-PROPERTIES
// ============================================================================

/// Generate custom properties
///
/// Takes a map of values and converts them to CSS custom properties. 
///
/// @param $map - map of property values
/// @param $prefix - custom property prefix
/// 
/// @example scss
///   $border-radius: (
///     'xs': .125rem,
///     'sm': .25rem,
///     'md': .5rem,
///     'lg': .75rem,
///     'xl': 1rem
///   );
/// 
///   @include generate-custom-properties($border-radius, 'rounded');
///
/// @access public

@mixin generate-custom-properties($map, $prefix) {
    @if type-of($map) != 'map' {
        @error "The argument $map: `#{$map}` is of incorrect type: `#{type-of($map)}`. Type of `Map` is required.";
    }
    
    @each $key, $value in $map {
        @if type-of($value) == 'map' {
            @each $sub-key, $sub-value in $value {
                --#{$prefix}-#{$key}-#{$sub-key}: #{$sub-value};    
            }
        } @else {
            --#{$prefix}-#{$key}: #{$value};
        }
    }
}