@micromag/core 0.3.74 → 0.3.80

package/es/components.js

@@ -2224,6 +2224,42 @@ var Empty = function Empty(_ref) {
 Empty.propTypes = propTypes$g;
 Empty.defaultProps = defaultProps$g;
 
+var getUrlsFromMedia = function getUrlsFromMedia(media, formats) {
+  var _ref = media || {},
+      _ref$files = _ref.files,
+      files = _ref$files === void 0 ? {} : _ref$files;
+
+  var _ref2 = files || {},
+      _ref2$original = _ref2.original,
+      originalFile = _ref2$original === void 0 ? null : _ref2$original;
+
+  var _ref3 = originalFile || {},
+      _ref3$name = _ref3.name,
+      originalName = _ref3$name === void 0 ? null : _ref3$name,
+      _ref3$mime = _ref3.mime,
+      originalMime = _ref3$mime === void 0 ? null : _ref3$mime;
+
+  var urls = formats.reduce(function (currentUrls, format) {
+    var finalFormat = isObject(format) ? format.format : format;
+    var formatExtension = isObject(format) ? format.name : format;
+    var file = files["webfonts.".concat(formatExtension)] || files[formatExtension] || null;
+
+    if (file !== null) {
+      return [].concat(_toConsumableArray(currentUrls), ["url(\"".concat(file.url, "?\") format(\"").concat(finalFormat, "\")")]);
+    }
+
+    var extensionRegExp = new RegExp(".".concat(formatExtension, "$"), 'i');
+    var mimeRegExp = new RegExp("".concat(finalFormat), 'i');
+
+    if (originalName !== null && originalName.match(extensionRegExp) !== null || originalMime !== null && originalMime.match(mimeRegExp) !== null) {
+      return [].concat(_toConsumableArray(currentUrls), ["url(\"".concat(originalFile.url, "?\") format(\"").concat(finalFormat, "\")")]);
+    }
+
+    return currentUrls;
+  }, []);
+  return urls;
+};
+
 var propTypes$f = {
   fonts: PropTypes.fonts,
   formats: PropTypes$1.arrayOf(PropTypes$1.oneOfType([PropTypes$1.string, PropTypes$1.shape({
@@ -2242,29 +2278,38 @@ var defaultProps$f = {
   }, 'svg']
 };
 
-var FontFaces = function FontFaces(_ref) {
-  var fonts = _ref.fonts,
-      formats = _ref.formats;
+var FontFaces = function FontFaces(_ref4) {
+  var fonts = _ref4.fonts,
+      formats = _ref4.formats;
   var fontFaces = (fonts || []).filter(function (it) {
     return isObject(it) && it.type === 'custom' && (it.media || null) !== null;
-  }).map(function (_ref2) {
-    var _ref2$name = _ref2.name,
-        name = _ref2$name === void 0 ? null : _ref2$name,
-        _ref2$media = _ref2.media,
-        media = _ref2$media === void 0 ? null : _ref2$media;
-
-    var _ref3 = media || {},
-        _ref3$files = _ref3.files,
-        files = _ref3$files === void 0 ? {} : _ref3$files;
-
-    var urls = formats.reduce(function (currentUrls, format) {
-      var finalFormat = isObject(format) ? format.format : format;
-      var formatExtension = isObject(format) ? format.name : format;
-      var file = files["webfonts.".concat(formatExtension)] || files[formatExtension] || null;
-      return file !== null ? [].concat(_toConsumableArray(currentUrls), ["url(\"".concat(file.url, "?\") format(\"").concat(finalFormat, "\")")]) : currentUrls;
-    }, []);
-    return urls.length > 0 && name !== null ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    src: ").concat(urls.join(','), ";\n                }\n            ") : null;
-  }).filter(function (it) {
+  }).reduce(function (fontFontFaces, _ref5) {
+    var _ref5$name = _ref5.name,
+        name = _ref5$name === void 0 ? null : _ref5$name,
+        _ref5$media = _ref5.media,
+        media = _ref5$media === void 0 ? null : _ref5$media,
+        _ref5$variants = _ref5.variants,
+        variants = _ref5$variants === void 0 ? [] : _ref5$variants;
+
+    if (name === null) {
+      return fontFontFaces;
+    }
+
+    var urls = media !== null ? getUrlsFromMedia(media, formats) : null;
+    return [].concat(_toConsumableArray(fontFontFaces), [urls !== null && urls.length > 0 ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    src: ").concat(urls.join(','), ";\n                }\n            ") : null], _toConsumableArray((variants || []).map(function (_ref6) {
+      var weight = _ref6.weight,
+          style = _ref6.style,
+          _ref6$media = _ref6.media,
+          variantMedia = _ref6$media === void 0 ? null : _ref6$media;
+
+      if (variantMedia == null) {
+        return null;
+      }
+
+      var variantUrls = getUrlsFromMedia(variantMedia, formats);
+      return variantUrls !== null && variantUrls.length > 0 ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    ").concat(weight !== null ? "font-weight: ".concat(weight, ";") : '', "\n                    ").concat(style !== null ? "font-style: ".concat(style, ";") : '', "\n                    src: ").concat(variantUrls.join(','), ";\n                }\n            ") : null;
+    })));
+  }, []).filter(function (it) {
     return it !== null;
   });
   return fontFaces.length > 0 ? /*#__PURE__*/React.createElement("style", {
@@ -3506,8 +3551,8 @@ var propTypes$9 = {
   className: PropTypes$1.string,
   onPrevious: PropTypes$1.func,
   onNext: PropTypes$1.func,
-  onEnableInteraction: PropTypes$1.func,
-  onDisableInteraction: PropTypes$1.func,
+  enableInteraction: PropTypes$1.func,
+  disableInteraction: PropTypes$1.func,
   getMediaRef: PropTypes$1.func
 };
 var defaultProps$9 = {
@@ -3520,8 +3565,8 @@ var defaultProps$9 = {
   className: null,
   onPrevious: null,
   onNext: null,
-  onEnableInteraction: null,
-  onDisableInteraction: null,
+  enableInteraction: null,
+  disableInteraction: null,
   getMediaRef: null
 };
 
@@ -3536,8 +3581,8 @@ var Screen = function Screen(_ref) {
       className = _ref.className,
       onPrevious = _ref.onPrevious,
       onNext = _ref.onNext,
-      onEnableInteraction = _ref.onEnableInteraction,
-      onDisableInteraction = _ref.onDisableInteraction,
+      enableInteraction = _ref.enableInteraction,
+      disableInteraction = _ref.disableInteraction,
       getMediaRef = _ref.getMediaRef;
 
   var _ref2 = screen || {},
@@ -3558,8 +3603,8 @@ var Screen = function Screen(_ref) {
     current: current,
     onPrevious: onPrevious,
     onNext: onNext,
-    onEnableInteraction: onEnableInteraction,
-    onDisableInteraction: onDisableInteraction,
+    enableInteraction: enableInteraction,
+    disableInteraction: disableInteraction,
     getMediaRef: getMediaRef
   }))) : /*#__PURE__*/React.createElement("div", {
     className: className

package/es/hooks.js

@@ -545,11 +545,35 @@ var useLoadedFonts = function useLoadedFonts(fonts) {
         name: font
       },
           type = _ref.type,
-          name = _ref.name;
+          name = _ref.name,
+          _ref$variants = _ref.variants,
+          variants = _ref$variants === void 0 ? [] : _ref$variants;
 
       if ((type === 'google' || type === 'custom') && !isFontLoading(name) && !isFontActive(name)) {
         return _objectSpread(_objectSpread({}, newConfig), {}, _defineProperty({}, type, {
-          families: [].concat(_toConsumableArray(newConfig !== null ? (newConfig[type] || {}).families || [] : []), [type === 'google' ? "".concat(name, ":400,700") : name])
+          families: [].concat(_toConsumableArray(newConfig !== null ? (newConfig[type] || {}).families || [] : []), [type === 'google' ? [name, (variants || []).filter(function (it) {
+            return it !== null;
+          }).join(',')].filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(':') : [name, (variants !== null ? [{
+            fvd: 'n4'
+          }].concat(_toConsumableArray(variants)) : []).map(function (_ref2) {
+            var _ref2$fvd = _ref2.fvd,
+                fvd = _ref2$fvd === void 0 ? null : _ref2$fvd,
+                _ref2$weight = _ref2.weight,
+                weight = _ref2$weight === void 0 ? null : _ref2$weight,
+                _ref2$style = _ref2.style,
+                style = _ref2$style === void 0 ? null : _ref2$style;
+            return fvd || [style, weight].filter(function (it) {
+              return it !== null;
+            }).map(function (it) {
+              return "".concat(it).substr(0, 1);
+            }).join('');
+          }).filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(',')].filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(':')])
         }));
       }
 
@@ -558,8 +582,8 @@ var useLoadedFonts = function useLoadedFonts(fonts) {
     var hasConfig = config !== null;
 
     if (hasConfig && typeof window !== 'undefined') {
-      import('webfontloader').then(function (_ref2) {
-        var WebFont = _ref2["default"];
+      import('webfontloader').then(function (_ref3) {
+        var WebFont = _ref3["default"];
         return WebFont.load(_objectSpread(_objectSpread({}, config), {}, {
           timeout: 3000,
           active: function active() {

package/lib/components.js

@@ -2247,6 +2247,42 @@ var Empty = function Empty(_ref) {
 Empty.propTypes = propTypes$g;
 Empty.defaultProps = defaultProps$g;
 
+var getUrlsFromMedia = function getUrlsFromMedia(media, formats) {
+  var _ref = media || {},
+      _ref$files = _ref.files,
+      files = _ref$files === void 0 ? {} : _ref$files;
+
+  var _ref2 = files || {},
+      _ref2$original = _ref2.original,
+      originalFile = _ref2$original === void 0 ? null : _ref2$original;
+
+  var _ref3 = originalFile || {},
+      _ref3$name = _ref3.name,
+      originalName = _ref3$name === void 0 ? null : _ref3$name,
+      _ref3$mime = _ref3.mime,
+      originalMime = _ref3$mime === void 0 ? null : _ref3$mime;
+
+  var urls = formats.reduce(function (currentUrls, format) {
+    var finalFormat = isObject__default["default"](format) ? format.format : format;
+    var formatExtension = isObject__default["default"](format) ? format.name : format;
+    var file = files["webfonts.".concat(formatExtension)] || files[formatExtension] || null;
+
+    if (file !== null) {
+      return [].concat(_toConsumableArray__default["default"](currentUrls), ["url(\"".concat(file.url, "?\") format(\"").concat(finalFormat, "\")")]);
+    }
+
+    var extensionRegExp = new RegExp(".".concat(formatExtension, "$"), 'i');
+    var mimeRegExp = new RegExp("".concat(finalFormat), 'i');
+
+    if (originalName !== null && originalName.match(extensionRegExp) !== null || originalMime !== null && originalMime.match(mimeRegExp) !== null) {
+      return [].concat(_toConsumableArray__default["default"](currentUrls), ["url(\"".concat(originalFile.url, "?\") format(\"").concat(finalFormat, "\")")]);
+    }
+
+    return currentUrls;
+  }, []);
+  return urls;
+};
+
 var propTypes$f = {
   fonts: core.PropTypes.fonts,
   formats: PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].shape({
@@ -2265,29 +2301,38 @@ var defaultProps$f = {
   }, 'svg']
 };
 
-var FontFaces = function FontFaces(_ref) {
-  var fonts = _ref.fonts,
-      formats = _ref.formats;
+var FontFaces = function FontFaces(_ref4) {
+  var fonts = _ref4.fonts,
+      formats = _ref4.formats;
   var fontFaces = (fonts || []).filter(function (it) {
     return isObject__default["default"](it) && it.type === 'custom' && (it.media || null) !== null;
-  }).map(function (_ref2) {
-    var _ref2$name = _ref2.name,
-        name = _ref2$name === void 0 ? null : _ref2$name,
-        _ref2$media = _ref2.media,
-        media = _ref2$media === void 0 ? null : _ref2$media;
-
-    var _ref3 = media || {},
-        _ref3$files = _ref3.files,
-        files = _ref3$files === void 0 ? {} : _ref3$files;
-
-    var urls = formats.reduce(function (currentUrls, format) {
-      var finalFormat = isObject__default["default"](format) ? format.format : format;
-      var formatExtension = isObject__default["default"](format) ? format.name : format;
-      var file = files["webfonts.".concat(formatExtension)] || files[formatExtension] || null;
-      return file !== null ? [].concat(_toConsumableArray__default["default"](currentUrls), ["url(\"".concat(file.url, "?\") format(\"").concat(finalFormat, "\")")]) : currentUrls;
-    }, []);
-    return urls.length > 0 && name !== null ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    src: ").concat(urls.join(','), ";\n                }\n            ") : null;
-  }).filter(function (it) {
+  }).reduce(function (fontFontFaces, _ref5) {
+    var _ref5$name = _ref5.name,
+        name = _ref5$name === void 0 ? null : _ref5$name,
+        _ref5$media = _ref5.media,
+        media = _ref5$media === void 0 ? null : _ref5$media,
+        _ref5$variants = _ref5.variants,
+        variants = _ref5$variants === void 0 ? [] : _ref5$variants;
+
+    if (name === null) {
+      return fontFontFaces;
+    }
+
+    var urls = media !== null ? getUrlsFromMedia(media, formats) : null;
+    return [].concat(_toConsumableArray__default["default"](fontFontFaces), [urls !== null && urls.length > 0 ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    src: ").concat(urls.join(','), ";\n                }\n            ") : null], _toConsumableArray__default["default"]((variants || []).map(function (_ref6) {
+      var weight = _ref6.weight,
+          style = _ref6.style,
+          _ref6$media = _ref6.media,
+          variantMedia = _ref6$media === void 0 ? null : _ref6$media;
+
+      if (variantMedia == null) {
+        return null;
+      }
+
+      var variantUrls = getUrlsFromMedia(variantMedia, formats);
+      return variantUrls !== null && variantUrls.length > 0 ? "\n                @font-face {\n                    font-family: \"".concat(name, "\";\n                    ").concat(weight !== null ? "font-weight: ".concat(weight, ";") : '', "\n                    ").concat(style !== null ? "font-style: ".concat(style, ";") : '', "\n                    src: ").concat(variantUrls.join(','), ";\n                }\n            ") : null;
+    })));
+  }, []).filter(function (it) {
     return it !== null;
   });
   return fontFaces.length > 0 ? /*#__PURE__*/React__default["default"].createElement("style", {
@@ -3529,8 +3574,8 @@ var propTypes$9 = {
   className: PropTypes__default["default"].string,
   onPrevious: PropTypes__default["default"].func,
   onNext: PropTypes__default["default"].func,
-  onEnableInteraction: PropTypes__default["default"].func,
-  onDisableInteraction: PropTypes__default["default"].func,
+  enableInteraction: PropTypes__default["default"].func,
+  disableInteraction: PropTypes__default["default"].func,
   getMediaRef: PropTypes__default["default"].func
 };
 var defaultProps$9 = {
@@ -3543,8 +3588,8 @@ var defaultProps$9 = {
   className: null,
   onPrevious: null,
   onNext: null,
-  onEnableInteraction: null,
-  onDisableInteraction: null,
+  enableInteraction: null,
+  disableInteraction: null,
   getMediaRef: null
 };
 
@@ -3559,8 +3604,8 @@ var Screen = function Screen(_ref) {
       className = _ref.className,
       onPrevious = _ref.onPrevious,
       onNext = _ref.onNext,
-      onEnableInteraction = _ref.onEnableInteraction,
-      onDisableInteraction = _ref.onDisableInteraction,
+      enableInteraction = _ref.enableInteraction,
+      disableInteraction = _ref.disableInteraction,
       getMediaRef = _ref.getMediaRef;
 
   var _ref2 = screen || {},
@@ -3581,8 +3626,8 @@ var Screen = function Screen(_ref) {
     current: current,
     onPrevious: onPrevious,
     onNext: onNext,
-    onEnableInteraction: onEnableInteraction,
-    onDisableInteraction: onDisableInteraction,
+    enableInteraction: enableInteraction,
+    disableInteraction: disableInteraction,
     getMediaRef: getMediaRef
   }))) : /*#__PURE__*/React__default["default"].createElement("div", {
     className: className

package/lib/hooks.js

@@ -581,11 +581,35 @@ var useLoadedFonts = function useLoadedFonts(fonts) {
         name: font
       },
           type = _ref.type,
-          name = _ref.name;
+          name = _ref.name,
+          _ref$variants = _ref.variants,
+          variants = _ref$variants === void 0 ? [] : _ref$variants;
 
       if ((type === 'google' || type === 'custom') && !isFontLoading(name) && !isFontActive(name)) {
         return _objectSpread__default["default"](_objectSpread__default["default"]({}, newConfig), {}, _defineProperty__default["default"]({}, type, {
-          families: [].concat(_toConsumableArray__default["default"](newConfig !== null ? (newConfig[type] || {}).families || [] : []), [type === 'google' ? "".concat(name, ":400,700") : name])
+          families: [].concat(_toConsumableArray__default["default"](newConfig !== null ? (newConfig[type] || {}).families || [] : []), [type === 'google' ? [name, (variants || []).filter(function (it) {
+            return it !== null;
+          }).join(',')].filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(':') : [name, (variants !== null ? [{
+            fvd: 'n4'
+          }].concat(_toConsumableArray__default["default"](variants)) : []).map(function (_ref2) {
+            var _ref2$fvd = _ref2.fvd,
+                fvd = _ref2$fvd === void 0 ? null : _ref2$fvd,
+                _ref2$weight = _ref2.weight,
+                weight = _ref2$weight === void 0 ? null : _ref2$weight,
+                _ref2$style = _ref2.style,
+                style = _ref2$style === void 0 ? null : _ref2$style;
+            return fvd || [style, weight].filter(function (it) {
+              return it !== null;
+            }).map(function (it) {
+              return "".concat(it).substr(0, 1);
+            }).join('');
+          }).filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(',')].filter(function (it) {
+            return it !== null && it.length > 0;
+          }).join(':')])
         }));
       }
 
@@ -594,8 +618,8 @@ var useLoadedFonts = function useLoadedFonts(fonts) {
     var hasConfig = config !== null;
 
     if (hasConfig && typeof window !== 'undefined') {
-      Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('webfontloader')); }).then(function (_ref2) {
-        var WebFont = _ref2["default"];
+      Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('webfontloader')); }).then(function (_ref3) {
+        var WebFont = _ref3["default"];
         return WebFont.load(_objectSpread__default["default"](_objectSpread__default["default"]({}, config), {}, {
           timeout: 3000,
           active: function active() {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/core",
-    "version": "0.3.74",
+    "version": "0.3.80",
     "description": "",
     "keywords": [
         "javascript"
@@ -132,5 +132,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "c85b6b4ca7ff2162222291ca6ccaae79789c8db6"
+    "gitHead": "3fdbc1c17e63df2cbe671bd08a19d21cd32754b9"
 }