UNPKG

12.9 kBJavaScriptView Raw
1import { parse, icon } from '@fortawesome/fontawesome-svg-core';
2import PropTypes from 'prop-types';
3import React from 'react';
4
5function ownKeys(object, enumerableOnly) {
6 var keys = Object.keys(object);
7
8 if (Object.getOwnPropertySymbols) {
9 var symbols = Object.getOwnPropertySymbols(object);
10 enumerableOnly && (symbols = symbols.filter(function (sym) {
11 return Object.getOwnPropertyDescriptor(object, sym).enumerable;
12 })), keys.push.apply(keys, symbols);
13 }
14
15 return keys;
16}
17
18function _objectSpread2(target) {
19 for (var i = 1; i < arguments.length; i++) {
20 var source = null != arguments[i] ? arguments[i] : {};
21 i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
22 _defineProperty(target, key, source[key]);
23 }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
24 Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
25 });
26 }
27
28 return target;
29}
30
31function _typeof(obj) {
32 "@babel/helpers - typeof";
33
34 return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) {
35 return typeof obj;
36 } : function (obj) {
37 return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
38 }, _typeof(obj);
39}
40
41function _defineProperty(obj, key, value) {
42 if (key in obj) {
43 Object.defineProperty(obj, key, {
44 value: value,
45 enumerable: true,
46 configurable: true,
47 writable: true
48 });
49 } else {
50 obj[key] = value;
51 }
52
53 return obj;
54}
55
56function _objectWithoutPropertiesLoose(source, excluded) {
57 if (source == null) return {};
58 var target = {};
59 var sourceKeys = Object.keys(source);
60 var key, i;
61
62 for (i = 0; i < sourceKeys.length; i++) {
63 key = sourceKeys[i];
64 if (excluded.indexOf(key) >= 0) continue;
65 target[key] = source[key];
66 }
67
68 return target;
69}
70
71function _objectWithoutProperties(source, excluded) {
72 if (source == null) return {};
73
74 var target = _objectWithoutPropertiesLoose(source, excluded);
75
76 var key, i;
77
78 if (Object.getOwnPropertySymbols) {
79 var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
80
81 for (i = 0; i < sourceSymbolKeys.length; i++) {
82 key = sourceSymbolKeys[i];
83 if (excluded.indexOf(key) >= 0) continue;
84 if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
85 target[key] = source[key];
86 }
87 }
88
89 return target;
90}
91
92function _toConsumableArray(arr) {
93 return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
94}
95
96function _arrayWithoutHoles(arr) {
97 if (Array.isArray(arr)) return _arrayLikeToArray(arr);
98}
99
100function _iterableToArray(iter) {
101 if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
102}
103
104function _unsupportedIterableToArray(o, minLen) {
105 if (!o) return;
106 if (typeof o === "string") return _arrayLikeToArray(o, minLen);
107 var n = Object.prototype.toString.call(o).slice(8, -1);
108 if (n === "Object" && o.constructor) n = o.constructor.name;
109 if (n === "Map" || n === "Set") return Array.from(o);
110 if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
111}
112
113function _arrayLikeToArray(arr, len) {
114 if (len == null || len > arr.length) len = arr.length;
115
116 for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
117
118 return arr2;
119}
120
121function _nonIterableSpread() {
122 throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
123}
124
125// Get CSS class list from a props object
126function classList(props) {
127 var _classes;
128
129 var beat = props.beat,
130 fade = props.fade,
131 beatFade = props.beatFade,
132 bounce = props.bounce,
133 shake = props.shake,
134 flash = props.flash,
135 spin = props.spin,
136 spinPulse = props.spinPulse,
137 spinReverse = props.spinReverse,
138 pulse = props.pulse,
139 fixedWidth = props.fixedWidth,
140 inverse = props.inverse,
141 border = props.border,
142 listItem = props.listItem,
143 flip = props.flip,
144 size = props.size,
145 rotation = props.rotation,
146 pull = props.pull; // map of CSS class names to properties
147
148 var classes = (_classes = {
149 'fa-beat': beat,
150 'fa-fade': fade,
151 'fa-beat-fade': beatFade,
152 'fa-bounce': bounce,
153 'fa-shake': shake,
154 'fa-flash': flash,
155 'fa-spin': spin,
156 'fa-spin-reverse': spinReverse,
157 'fa-spin-pulse': spinPulse,
158 'fa-pulse': pulse,
159 'fa-fw': fixedWidth,
160 'fa-inverse': inverse,
161 'fa-border': border,
162 'fa-li': listItem,
163 'fa-flip-horizontal': flip === 'horizontal' || flip === 'both',
164 'fa-flip-vertical': flip === 'vertical' || flip === 'both'
165 }, _defineProperty(_classes, "fa-".concat(size), typeof size !== 'undefined' && size !== null), _defineProperty(_classes, "fa-rotate-".concat(rotation), typeof rotation !== 'undefined' && rotation !== null && rotation !== 0), _defineProperty(_classes, "fa-pull-".concat(pull), typeof pull !== 'undefined' && pull !== null), _defineProperty(_classes, 'fa-swap-opacity', props.swapOpacity), _classes); // map over all the keys in the classes object
166 // return an array of the keys where the value for the key is not null
167
168 return Object.keys(classes).map(function (key) {
169 return classes[key] ? key : null;
170 }).filter(function (key) {
171 return key;
172 });
173}
174
175// Camelize taken from humps
176// humps is copyright © 2012+ Dom Christie
177// Released under the MIT license.
178// Performant way to determine if object coerces to a number
179function _isNumerical(obj) {
180 obj = obj - 0; // eslint-disable-next-line no-self-compare
181
182 return obj === obj;
183}
184
185function camelize(string) {
186 if (_isNumerical(string)) {
187 return string;
188 } // eslint-disable-next-line no-useless-escape
189
190
191 string = string.replace(/[\-_\s]+(.)?/g, function (match, chr) {
192 return chr ? chr.toUpperCase() : '';
193 }); // Ensure 1st char is always lowercase
194
195 return string.substr(0, 1).toLowerCase() + string.substr(1);
196}
197
198var _excluded$1 = ["style"];
199
200function capitalize(val) {
201 return val.charAt(0).toUpperCase() + val.slice(1);
202}
203
204function styleToObject(style) {
205 return style.split(';').map(function (s) {
206 return s.trim();
207 }).filter(function (s) {
208 return s;
209 }).reduce(function (acc, pair) {
210 var i = pair.indexOf(':');
211 var prop = camelize(pair.slice(0, i));
212 var value = pair.slice(i + 1).trim();
213 prop.startsWith('webkit') ? acc[capitalize(prop)] = value : acc[prop] = value;
214 return acc;
215 }, {});
216}
217
218function convert(createElement, element) {
219 var extraProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
220
221 if (typeof element === 'string') {
222 return element;
223 }
224
225 var children = (element.children || []).map(function (child) {
226 return convert(createElement, child);
227 });
228 /* eslint-disable dot-notation */
229
230 var mixins = Object.keys(element.attributes || {}).reduce(function (acc, key) {
231 var val = element.attributes[key];
232
233 switch (key) {
234 case 'class':
235 acc.attrs['className'] = val;
236 delete element.attributes['class'];
237 break;
238
239 case 'style':
240 acc.attrs['style'] = styleToObject(val);
241 break;
242
243 default:
244 if (key.indexOf('aria-') === 0 || key.indexOf('data-') === 0) {
245 acc.attrs[key.toLowerCase()] = val;
246 } else {
247 acc.attrs[camelize(key)] = val;
248 }
249
250 }
251
252 return acc;
253 }, {
254 attrs: {}
255 });
256
257 var _extraProps$style = extraProps.style,
258 existingStyle = _extraProps$style === void 0 ? {} : _extraProps$style,
259 remaining = _objectWithoutProperties(extraProps, _excluded$1);
260
261 mixins.attrs['style'] = _objectSpread2(_objectSpread2({}, mixins.attrs['style']), existingStyle);
262 /* eslint-enable */
263
264 return createElement.apply(void 0, [element.tag, _objectSpread2(_objectSpread2({}, mixins.attrs), remaining)].concat(_toConsumableArray(children)));
265}
266
267var PRODUCTION = false;
268
269try {
270 PRODUCTION = process.env.NODE_ENV === 'production';
271} catch (e) {}
272
273function log () {
274 if (!PRODUCTION && console && typeof console.error === 'function') {
275 var _console;
276
277 (_console = console).error.apply(_console, arguments);
278 }
279}
280
281function normalizeIconArgs(icon) {
282 // this has everything that it needs to be rendered which means it was probably imported
283 // directly from an icon svg package
284 if (icon && _typeof(icon) === 'object' && icon.prefix && icon.iconName && icon.icon) {
285 return icon;
286 }
287
288 if (parse.icon) {
289 return parse.icon(icon);
290 } // if the icon is null, there's nothing to do
291
292
293 if (icon === null) {
294 return null;
295 } // if the icon is an object and has a prefix and an icon name, return it
296
297
298 if (icon && _typeof(icon) === 'object' && icon.prefix && icon.iconName) {
299 return icon;
300 } // if it's an array with length of two
301
302
303 if (Array.isArray(icon) && icon.length === 2) {
304 // use the first item as prefix, second as icon name
305 return {
306 prefix: icon[0],
307 iconName: icon[1]
308 };
309 } // if it's a string, use it as the icon name
310
311
312 if (typeof icon === 'string') {
313 return {
314 prefix: 'fas',
315 iconName: icon
316 };
317 }
318}
319
320// creates an object with a key of key
321// and a value of value
322// if certain conditions are met
323function objectWithKey(key, value) {
324 // if the value is a non-empty array
325 // or it's not an array but it is truthy
326 // then create the object with the key and the value
327 // if not, return an empty array
328 return Array.isArray(value) && value.length > 0 || !Array.isArray(value) && value ? _defineProperty({}, key, value) : {};
329}
330
331var _excluded = ["forwardedRef"];
332function FontAwesomeIcon(_ref) {
333 var forwardedRef = _ref.forwardedRef,
334 props = _objectWithoutProperties(_ref, _excluded);
335
336 var iconArgs = props.icon,
337 maskArgs = props.mask,
338 symbol = props.symbol,
339 className = props.className,
340 title = props.title,
341 titleId = props.titleId,
342 maskId = props.maskId;
343 var iconLookup = normalizeIconArgs(iconArgs);
344 var classes = objectWithKey('classes', [].concat(_toConsumableArray(classList(props)), _toConsumableArray(className.split(' '))));
345 var transform = objectWithKey('transform', typeof props.transform === 'string' ? parse.transform(props.transform) : props.transform);
346 var mask = objectWithKey('mask', normalizeIconArgs(maskArgs));
347 var renderedIcon = icon(iconLookup, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, classes), transform), mask), {}, {
348 symbol: symbol,
349 title: title,
350 titleId: titleId,
351 maskId: maskId
352 }));
353
354 if (!renderedIcon) {
355 log('Could not find icon', iconLookup);
356 return null;
357 }
358
359 var abstract = renderedIcon.abstract;
360 var extraProps = {
361 ref: forwardedRef
362 };
363 Object.keys(props).forEach(function (key) {
364 // eslint-disable-next-line no-prototype-builtins
365 if (!FontAwesomeIcon.defaultProps.hasOwnProperty(key)) {
366 extraProps[key] = props[key];
367 }
368 });
369 return convertCurry(abstract[0], extraProps);
370}
371FontAwesomeIcon.displayName = 'FontAwesomeIcon';
372FontAwesomeIcon.propTypes = {
373 beat: PropTypes.bool,
374 border: PropTypes.bool,
375 bounce: PropTypes.bool,
376 className: PropTypes.string,
377 fade: PropTypes.bool,
378 flash: PropTypes.bool,
379 mask: PropTypes.oneOfType([PropTypes.object, PropTypes.array, PropTypes.string]),
380 maskId: PropTypes.string,
381 fixedWidth: PropTypes.bool,
382 inverse: PropTypes.bool,
383 flip: PropTypes.oneOf(['horizontal', 'vertical', 'both']),
384 icon: PropTypes.oneOfType([PropTypes.object, PropTypes.array, PropTypes.string]),
385 listItem: PropTypes.bool,
386 pull: PropTypes.oneOf(['right', 'left']),
387 pulse: PropTypes.bool,
388 rotation: PropTypes.oneOf([0, 90, 180, 270]),
389 shake: PropTypes.bool,
390 size: PropTypes.oneOf(['2xs', 'xs', 'sm', 'lg', 'xl', '2xl', '1x', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x']),
391 spin: PropTypes.bool,
392 spinPulse: PropTypes.bool,
393 spinReverse: PropTypes.bool,
394 symbol: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
395 title: PropTypes.string,
396 titleId: PropTypes.string,
397 transform: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
398 swapOpacity: PropTypes.bool
399};
400FontAwesomeIcon.defaultProps = {
401 border: false,
402 className: '',
403 mask: null,
404 maskId: null,
405 fixedWidth: false,
406 inverse: false,
407 flip: null,
408 icon: null,
409 listItem: false,
410 pull: null,
411 pulse: false,
412 rotation: null,
413 size: null,
414 spin: false,
415 beat: false,
416 fade: false,
417 beatFade: false,
418 bounce: false,
419 shake: false,
420 symbol: false,
421 title: '',
422 titleId: null,
423 transform: null,
424 swapOpacity: false
425};
426var convertCurry = convert.bind(null, React.createElement);
427
428export { FontAwesomeIcon };