pick.key-type()

The pick.key-type() function returns a copy of $map with values of $types.

// Sass.
@use 'sass:list';
@use 'sass:map';

// The `pick.key-type()` or `map.pick-key-type()` function.
@function key-type($map, $types...) {
  $result: ();
  @each $type in $types {
    @if list.index(
      bool calculation color function list map null number string,
      $type
    )
    {
      @each $key, $value in $map {
        @if type-of($key) ==
          $type or
          (not $type and type-of($type) == type-of($key))
        {
          $result: map.deep-merge(
            $result,
            (
              $key: $value,
            )
          );
        }
      }
    }
  }
  @return $result;
}
https://github.com/angular-package/sass/blob/main/map/pick/_pick.key-type.function.scss
// Sass.
@use 'sass:list';
@use 'sass:map';

// Functions.
@use '../../list/list.append.function' as *;

// Status: DONE
// The `pick.key-type()` function returns a map with values of `$types`.
// @param `$map` A map from which keys of values of `$types` are picked.
// @param `$type` Required type of the value to pick from `$map`.
// @arbitrary `$types...` Types of the values to pick from `$map`.
// @return The return value is a copy of `$map` with a values of types associated with `$types`.
@function key-type($map, $type, $types...) {
  $result: ();
  @each $type in append((), $type, comma, $types...) {
    @if list.index(bool calculation color function list map null number string, $type) {
      @each $key, $value in $map {
        @if type-of($key) == $type or (not $type and type-of($type) == type-of($key)) {
          $result: map.deep-merge($result, ($key: $value));
        }
      }
    }
  }
  @return $result;
}

// Examples.
// $-theme: (
//   dark: (
//     'dark.palette': (),

//     basic large: (
//       '': border,
//       dark: border dark,
//       light: border light
//     ),
//   ),
//   basic: (
//     'default.palette': (),

//     'gray.palette': (
//       'gray': 'gray' color,
//       'gray' dark: 'gray' dark,
//       'gray' light: 'gray' light
//     ),

//     'bg.palette': (
//       bg: bg color,
//       bg dark: bg dark,
//       bg light: bg light
//     ),

//     basic large: (
//       '': border,
//       dark: border dark,
//       light: border light
//     ),

//     extended small: (
//       '': primary,
//       dark: primary dark,
//       light: primary light
//     ),

//     [primary]: (
//       primary dark: primary dark,
//     ),

//     (key1, key2): (
//       primary: primary1
//     ),

//     key1: primary,

//     // calculation
//     calc(400px + 10%): calculation,

//     // bool
//     false: bool,

//     // color
//     #fff: color,

//     // function
//     get-function(append): function,

//     // map
//     (a: 1, b: 2): map,

//     // null
//     null: null,

//     // number
//     15: number,

//     // string
//     firstname: string,
//   )
// );

// @debug key-type(map.get($-theme, basic), bool);
// @debug key-type(map.get($-theme, basic), calculation);
// @debug key-type(map.get($-theme, basic), color);
// @debug key-type(map.get($-theme, basic), function);
// @debug key-type(map.get($-theme, basic), list);
// @debug key-type(map.get($-theme, basic), map);
// @debug key-type(map.get($-theme, basic), null);
// @debug key-type(map.get($-theme, basic), number);
// @debug key-type(map.get($-theme, basic), string);

// multiple
// @debug key-type(map.get($-theme, basic), list, string);

Parameters

$map

A map from which keys of values of $types are picked.

$types...

Types of the values to pick from a $map.

Return

The return value is a copy of $map with a values of types associated with $types.

Examples

// Use.
@use '@angular-package/sass/map';

// Examples.

Last updated

Was this helpful?