vcc-ui/es/load-fonts.js

VCC UI is a collection of React UI Components that can be used for developing front-end applications at Volvo Car Corporation.

import { FONTS } from "./constants/fonts";

var prefixWithPath = function prefixWithPath(fonts, path) {
  return fonts.map(function (font) {
    return path + font;
  });
};

export var loadFonts = function loadFonts(_ref, renderer) {
  var fonts = _ref.fonts,
      _ref$pathPrefix = _ref.pathPrefix,
      pathPrefix = _ref$pathPrefix === void 0 ? "/" : _ref$pathPrefix,
      fontDisplay = _ref.fontDisplay;
  fonts.forEach(function (font) {
    renderer.renderFont(font, prefixWithPath(FONTS[font], pathPrefix), {
      fontDisplay: fontDisplay || "swap"
    });
  });
};
/**
 *
 * @param renderer styleRenderer to have fonts
 * @param fontsConfig {array} configuration array to add different fonts
 * to be used by vcc-ui.
 * The configuration array, is an array of objects with the following props:
 * family: {string} A font family reference which is later required to use this font face.
 * files: {array} An array (of strings) of valid source paths. It may either be relative
 * (within your project) or absolute (hosted on an external server).
 * It must have one of the following file extensions:
 * .woff, .woff2, .eof, .ttf or .svg
 * config: Additional font properties which are fontVariant, fontWeight,
 * fontStretch, fontStyle and unicodeRange.
 */

export var loadThemeFonts = function loadThemeFonts(_ref2) {
  var renderer = _ref2.renderer,
      fontsConfig = _ref2.fontsConfig;
  fontsConfig.forEach(function (_ref3) {
    var family = _ref3.family,
        files = _ref3.files,
        config = _ref3.config;
    renderer.renderFont(family, files, config);
  });
};