pick.value-type()

The pick.value-type() or map.pick-value-type() function picks the properties with values of $types.

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

// The `pick.value-type()` or `map.pick-value-type()` function.
@function value-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($value) ==
          $type or
          (not $type and type-of($type) == type-of($value))
        {
          $result: map.deep-merge(
            $result,
            (
              $key: $value,
            )
          );
        }
      }
    }
  }
  @return $result;
}
https://github.com/angular-package/sass/blob/main/map/pick/_pick.value-type.function.scss
// Sass.
@use 'sass:list';
@use 'sass:map';
@use 'sass:meta';

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

// Status: DONE
// The `pick.value-type()` function picks the properties with values of the specified `$types`.
// @param `$map` A map from which properties with values of a certain `$types` are picked.
// @param `$type` The required `bool`, `calculation`, `color`, `function`, `list`, `map`, `null`, `number` or `string` type
// of the property value to pick from `$map`.
// @arbitrary `$types...` Additional value types to pick from `$map`.
// @return The return value is a copy of `$map` with values associated with `$type`,  `$types`.
@function value-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 meta.type-of($value) == $type or (not $type and type-of($type) == type-of($value)) {
          $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,
//     calculation: calc(400px + 10%),

//     // bool
//     false: bool,
//     bool: false,

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

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

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

//     // null
//     'null': null,
//     null: 'null',

//     // number
//     15: number,
//     number: 15,

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

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

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

Parameters

$map

A map from which properties with values of a certain $types are picked.

$types...

The bool, calculation, color, function, list, map, null, number or string types of the property values to pick from $map.

Return

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

Examples

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

// Examples.

Last updated

Was this helpful?