dictionary.translation()

The dictionary.translation() function returns a translation of $search from $dictionaries....

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

// The `translator.dictionary-translation()` or `dictionary.translation()`
@function translation($search, $dictionaries...) {
  @each $dictionary in $dictionaries {
    @each $phrase, $translation in $dictionary {
      @if list.index($phrase, $search) and $translation {
        @return $translation;
      }
    }
  }
  @return null;
}

Not found

Parameters

$search

A word(string) or phrase(list space separated) to search for translation.

$dictionaries...

Dictionaries to look for $search translation.

Return

The return value is a translation of the $search.

Examples

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

// Examples.
$-nested-dictionary: (
  general: (word: słowo, (wrapper, wrap): owijka, (technology, technologia): tech, color: c),
  class: (prefix: class-prefix, separator: class-separator, suffix: class-suffix, calendars: (calendar: cal), labels: (label: lab)),
  var: (prefix: var-prefix, suffix: var-suffix),
);
$-flatten-dictionary: (
  'extra small': xs,
  (extra large, extra-large): xl,
  border: b,
  color: c,
  delimiter: '-',
  outline: o,
  prefix: spectre,
  separator: '-',
  suffix: end,
);

// single dictionary
@debug dictionary.translation(prefix, $-flatten-dictionary); // spectre
@debug dictionary.translation(extra large, $-flatten-dictionary); // xl

// multiple dictionaries
@debug dictionary.translation(extra-large, $-nested-dictionary, $-flatten-dictionary); // xl
@debug dictionary.translation('extra small', $-nested-dictionary, $-flatten-dictionary); // xs

@debug dictionary.translation(prefix, $-nested-dictionary, $-flatten-dictionary); // spectre
@debug dictionary.translation(outline, $-nested-dictionary, $-flatten-dictionary); // o
@debug dictionary.translation(delimiter, $-nested-dictionary, $-flatten-dictionary); // -