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;
							 |