Compiling Token Maps
Tools for compiling Accoutrement map tokens, useful for exporting versions of token maps with all of the Accoutrement syntax removed.
@function map-compile()
Allows for the compilation of each token in a map, or a map and an additional source.
Since 4.0.0
:
- NEW: Provides for compilation and exporting of static version of Accoutrement maps.
Parameters & Return
$map: (map)
The map to be compiled
$source: (map | null)
A map of reference tokens
@return (map)
The parsed value of keys in the original map
Examples
scss
Compile each token in a map
$sizes: (
'root': 16px,
'text-size': '#root',
);
/*! #{meta.inspect(tools.map-compile($sizes))} */
css
compiled
/*! ("root": 16px, "text-size": 16px) */
scss
Compile a map based on an additional source
$sizes: (
'root': 16px,
'text-size': '#root',
'display-text': '#spacer'
);
$spacing-sizes: (
'spacer': 2rem,
);
/*! #{meta.inspect(tools.map-compile($sizes, $spacing-sizes))} */
css
compiled
/*! ("root": 16px, "text-size": 16px, "display-text": 2rem) */
Requires
@function get() [private]
@function map-compile-with()
Allows for the compilation of each token in a map, with token values resolved based on a function applied on each key-value pair.
Since 4.0.0
:
- NEW: Provides for compilation and exporting of static version of Accoutrement maps with tokens resolved based on data type.
Parameters & Return
$map: (map)
The map to be compiled
$function: (string | function)
The function to apply on each key-value pair in the map
$args...: (arglist)
Any arguments required for the function call
@return (map)
The parsed value of keys in the original map
Example
scss
Compile a map using a particular function
@use 'color';
tools.$colors: (
'brand-blue': hsl(234, 85%, 35%),
'dark-blue': '#brand-blue' ('shade': 30%),
);
$fn: meta.get-function('color', $module: 'color');
/*! #{meta.inspect(tools.map-compile-with(tools.$colors, $fn))} */
css
compiled
/*! ("brand-blue": hsl(234, 85%, 35%), "dark-blue": rgb(9.37125, 19.992, 115.57875)) */