You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					136 lines
				
				4.0 KiB
			
		
		
			
		
	
	
					136 lines
				
				4.0 KiB
			| 
											3 years ago
										 | "use strict"; | ||
|  | 
 | ||
|  | exports.__esModule = true; | ||
|  | exports["default"] = fontFace; | ||
|  | 
 | ||
|  | var _errors = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("../internalHelpers/_errors")); | ||
|  | 
 | ||
|  | function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
|  | 
 | ||
|  | var dataURIRegex = /^\s*data:([a-z]+\/[a-z-]+(;[a-z-]+=[a-z-]+)?)?(;charset=[a-z0-9-]+)?(;base64)?,[a-z0-9!$&',()*+,;=\-._~:@/?%\s]*\s*$/i; | ||
|  | var formatHintMap = { | ||
|  |   woff: 'woff', | ||
|  |   woff2: 'woff2', | ||
|  |   ttf: 'truetype', | ||
|  |   otf: 'opentype', | ||
|  |   eot: 'embedded-opentype', | ||
|  |   svg: 'svg', | ||
|  |   svgz: 'svg' | ||
|  | }; | ||
|  | 
 | ||
|  | function generateFormatHint(format, formatHint) { | ||
|  |   if (!formatHint) return ''; | ||
|  |   return " format(\"" + formatHintMap[format] + "\")"; | ||
|  | } | ||
|  | 
 | ||
|  | function isDataURI(fontFilePath) { | ||
|  |   return !!fontFilePath.replace(/\s+/g, ' ').match(dataURIRegex); | ||
|  | } | ||
|  | 
 | ||
|  | function generateFileReferences(fontFilePath, fileFormats, formatHint) { | ||
|  |   if (isDataURI(fontFilePath)) { | ||
|  |     return "url(\"" + fontFilePath + "\")" + generateFormatHint(fileFormats[0], formatHint); | ||
|  |   } | ||
|  | 
 | ||
|  |   var fileFontReferences = fileFormats.map(function (format) { | ||
|  |     return "url(\"" + fontFilePath + "." + format + "\")" + generateFormatHint(format, formatHint); | ||
|  |   }); | ||
|  |   return fileFontReferences.join(', '); | ||
|  | } | ||
|  | 
 | ||
|  | function generateLocalReferences(localFonts) { | ||
|  |   var localFontReferences = localFonts.map(function (font) { | ||
|  |     return "local(\"" + font + "\")"; | ||
|  |   }); | ||
|  |   return localFontReferences.join(', '); | ||
|  | } | ||
|  | 
 | ||
|  | function generateSources(fontFilePath, localFonts, fileFormats, formatHint) { | ||
|  |   var fontReferences = []; | ||
|  |   if (localFonts) fontReferences.push(generateLocalReferences(localFonts)); | ||
|  | 
 | ||
|  |   if (fontFilePath) { | ||
|  |     fontReferences.push(generateFileReferences(fontFilePath, fileFormats, formatHint)); | ||
|  |   } | ||
|  | 
 | ||
|  |   return fontReferences.join(', '); | ||
|  | } | ||
|  | /** | ||
|  |  * CSS for a @font-face declaration. | ||
|  |  * | ||
|  |  * @example | ||
|  |  * // Styles as object basic usage
 | ||
|  |  * const styles = { | ||
|  |  *    ...fontFace({ | ||
|  |  *      'fontFamily': 'Sans-Pro', | ||
|  |  *      'fontFilePath': 'path/to/file' | ||
|  |  *    }) | ||
|  |  * } | ||
|  |  * | ||
|  |  * // styled-components basic usage
 | ||
|  |  * const GlobalStyle = createGlobalStyle`${ | ||
|  |  *   fontFace({ | ||
|  |  *     'fontFamily': 'Sans-Pro', | ||
|  |  *     'fontFilePath': 'path/to/file' | ||
|  |  *   } | ||
|  |  * )}`
 | ||
|  |  * | ||
|  |  * // CSS as JS Output
 | ||
|  |  * | ||
|  |  * '@font-face': { | ||
|  |  *   'fontFamily': 'Sans-Pro', | ||
|  |  *   'src': 'url("path/to/file.eot"), url("path/to/file.woff2"), url("path/to/file.woff"), url("path/to/file.ttf"), url("path/to/file.svg")', | ||
|  |  * } | ||
|  |  */ | ||
|  | 
 | ||
|  | 
 | ||
|  | function fontFace(_ref) { | ||
|  |   var fontFamily = _ref.fontFamily, | ||
|  |       fontFilePath = _ref.fontFilePath, | ||
|  |       fontStretch = _ref.fontStretch, | ||
|  |       fontStyle = _ref.fontStyle, | ||
|  |       fontVariant = _ref.fontVariant, | ||
|  |       fontWeight = _ref.fontWeight, | ||
|  |       _ref$fileFormats = _ref.fileFormats, | ||
|  |       fileFormats = _ref$fileFormats === void 0 ? ['eot', 'woff2', 'woff', 'ttf', 'svg'] : _ref$fileFormats, | ||
|  |       _ref$formatHint = _ref.formatHint, | ||
|  |       formatHint = _ref$formatHint === void 0 ? false : _ref$formatHint, | ||
|  |       localFonts = _ref.localFonts, | ||
|  |       unicodeRange = _ref.unicodeRange, | ||
|  |       fontDisplay = _ref.fontDisplay, | ||
|  |       fontVariationSettings = _ref.fontVariationSettings, | ||
|  |       fontFeatureSettings = _ref.fontFeatureSettings; | ||
|  |   // Error Handling
 | ||
|  |   if (!fontFamily) throw new _errors["default"](55); | ||
|  | 
 | ||
|  |   if (!fontFilePath && !localFonts) { | ||
|  |     throw new _errors["default"](52); | ||
|  |   } | ||
|  | 
 | ||
|  |   if (localFonts && !Array.isArray(localFonts)) { | ||
|  |     throw new _errors["default"](53); | ||
|  |   } | ||
|  | 
 | ||
|  |   if (!Array.isArray(fileFormats)) { | ||
|  |     throw new _errors["default"](54); | ||
|  |   } | ||
|  | 
 | ||
|  |   var fontFaceDeclaration = { | ||
|  |     '@font-face': { | ||
|  |       fontFamily: fontFamily, | ||
|  |       src: generateSources(fontFilePath, localFonts, fileFormats, formatHint), | ||
|  |       unicodeRange: unicodeRange, | ||
|  |       fontStretch: fontStretch, | ||
|  |       fontStyle: fontStyle, | ||
|  |       fontVariant: fontVariant, | ||
|  |       fontWeight: fontWeight, | ||
|  |       fontDisplay: fontDisplay, | ||
|  |       fontVariationSettings: fontVariationSettings, | ||
|  |       fontFeatureSettings: fontFeatureSettings | ||
|  |     } | ||
|  |   }; // Removes undefined fields for cleaner css object.
 | ||
|  | 
 | ||
|  |   return JSON.parse(JSON.stringify(fontFaceDeclaration)); | ||
|  | } | ||
|  | 
 | ||
|  | module.exports = exports.default; |