UNPKG

12.5 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 flash = props.flash,
132 spin = props.spin,
133 spinPulse = props.spinPulse,
134 spinReverse = props.spinReverse,
135 pulse = props.pulse,
136 fixedWidth = props.fixedWidth,
137 inverse = props.inverse,
138 border = props.border,
139 listItem = props.listItem,
140 flip = props.flip,
141 size = props.size,
142 rotation = props.rotation,
143 pull = props.pull; // map of CSS class names to properties
144
145 var classes = (_classes = {
146 'fa-beat': beat,
147 'fa-fade': fade,
148 'fa-flash': flash,
149 'fa-spin': spin,
150 'fa-spin-reverse': spinReverse,
151 'fa-spin-pulse': spinPulse,
152 'fa-pulse': pulse,
153 'fa-fw': fixedWidth,
154 'fa-inverse': inverse,
155 'fa-border': border,
156 'fa-li': listItem,
157 'fa-flip-horizontal': flip === 'horizontal' || flip === 'both',
158 'fa-flip-vertical': flip === 'vertical' || flip === 'both'
159 }, _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
160 // return an array of the keys where the value for the key is not null
161
162 return Object.keys(classes).map(function (key) {
163 return classes[key] ? key : null;
164 }).filter(function (key) {
165 return key;
166 });
167}
168
169// Camelize taken from humps
170// humps is copyright © 2012+ Dom Christie
171// Released under the MIT license.
172// Performant way to determine if object coerces to a number
173function _isNumerical(obj) {
174 obj = obj - 0; // eslint-disable-next-line no-self-compare
175
176 return obj === obj;
177}
178
179function camelize(string) {
180 if (_isNumerical(string)) {
181 return string;
182 } // eslint-disable-next-line no-useless-escape
183
184
185 string = string.replace(/[\-_\s]+(.)?/g, function (match, chr) {
186 return chr ? chr.toUpperCase() : '';
187 }); // Ensure 1st char is always lowercase
188
189 return string.substr(0, 1).toLowerCase() + string.substr(1);
190}
191
192var _excluded$1 = ["style"];
193
194function capitalize(val) {
195 return val.charAt(0).toUpperCase() + val.slice(1);
196}
197
198function styleToObject(style) {
199 return style.split(';').map(function (s) {
200 return s.trim();
201 }).filter(function (s) {
202 return s;
203 }).reduce(function (acc, pair) {
204 var i = pair.indexOf(':');
205 var prop = camelize(pair.slice(0, i));
206 var value = pair.slice(i + 1).trim();
207 prop.startsWith('webkit') ? acc[capitalize(prop)] = value : acc[prop] = value;
208 return acc;
209 }, {});
210}
211
212function convert(createElement, element) {
213 var extraProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
214
215 if (typeof element === 'string') {
216 return element;
217 }
218
219 var children = (element.children || []).map(function (child) {
220 return convert(createElement, child);
221 });
222 /* eslint-disable dot-notation */
223
224 var mixins = Object.keys(element.attributes || {}).reduce(function (acc, key) {
225 var val = element.attributes[key];
226
227 switch (key) {
228 case 'class':
229 acc.attrs['className'] = val;
230 delete element.attributes['class'];
231 break;
232
233 case 'style':
234 acc.attrs['style'] = styleToObject(val);
235 break;
236
237 default:
238 if (key.indexOf('aria-') === 0 || key.indexOf('data-') === 0) {
239 acc.attrs[key.toLowerCase()] = val;
240 } else {
241 acc.attrs[camelize(key)] = val;
242 }
243
244 }
245
246 return acc;
247 }, {
248 attrs: {}
249 });
250
251 var _extraProps$style = extraProps.style,
252 existingStyle = _extraProps$style === void 0 ? {} : _extraProps$style,
253 remaining = _objectWithoutProperties(extraProps, _excluded$1);
254
255 mixins.attrs['style'] = _objectSpread2(_objectSpread2({}, mixins.attrs['style']), existingStyle);
256 /* eslint-enable */
257
258 return createElement.apply(void 0, [element.tag, _objectSpread2(_objectSpread2({}, mixins.attrs), remaining)].concat(_toConsumableArray(children)));
259}
260
261var PRODUCTION = false;
262
263try {
264 PRODUCTION = process.env.NODE_ENV === 'production';
265} catch (e) {}
266
267function log () {
268 if (!PRODUCTION && console && typeof console.error === 'function') {
269 var _console;
270
271 (_console = console).error.apply(_console, arguments);
272 }
273}
274
275function normalizeIconArgs(icon) {
276 // this has everything that it needs to be rendered which means it was probably imported
277 // directly from an icon svg package
278 if (icon && _typeof(icon) === 'object' && icon.prefix && icon.iconName && icon.icon) {
279 return icon;
280 }
281
282 if (parse.icon) {
283 return parse.icon(icon);
284 } // if the icon is null, there's nothing to do
285
286
287 if (icon === null) {
288 return null;
289 } // if the icon is an object and has a prefix and an icon name, return it
290
291
292 if (icon && _typeof(icon) === 'object' && icon.prefix && icon.iconName) {
293 return icon;
294 } // if it's an array with length of two
295
296
297 if (Array.isArray(icon) && icon.length === 2) {
298 // use the first item as prefix, second as icon name
299 return {
300 prefix: icon[0],
301 iconName: icon[1]
302 };
303 } // if it's a string, use it as the icon name
304
305
306 if (typeof icon === 'string') {
307 return {
308 prefix: 'fas',
309 iconName: icon
310 };
311 }
312}
313
314// creates an object with a key of key
315// and a value of value
316// if certain conditions are met
317function objectWithKey(key, value) {
318 // if the value is a non-empty array
319 // or it's not an array but it is truthy
320 // then create the object with the key and the value
321 // if not, return an empty array
322 return Array.isArray(value) && value.length > 0 || !Array.isArray(value) && value ? _defineProperty({}, key, value) : {};
323}
324
325var _excluded = ["forwardedRef"];
326function FontAwesomeIcon(_ref) {
327 var forwardedRef = _ref.forwardedRef,
328 props = _objectWithoutProperties(_ref, _excluded);
329
330 var iconArgs = props.icon,
331 maskArgs = props.mask,
332 symbol = props.symbol,
333 className = props.className,
334 title = props.title,
335 titleId = props.titleId;
336 var iconLookup = normalizeIconArgs(iconArgs);
337 var classes = objectWithKey('classes', [].concat(_toConsumableArray(classList(props)), _toConsumableArray(className.split(' '))));
338 var transform = objectWithKey('transform', typeof props.transform === 'string' ? parse.transform(props.transform) : props.transform);
339 var mask = objectWithKey('mask', normalizeIconArgs(maskArgs));
340 var renderedIcon = icon(iconLookup, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, classes), transform), mask), {}, {
341 symbol: symbol,
342 title: title,
343 titleId: titleId
344 }));
345
346 if (!renderedIcon) {
347 log('Could not find icon', iconLookup);
348 return null;
349 }
350
351 var abstract = renderedIcon.abstract;
352 var extraProps = {
353 ref: forwardedRef
354 };
355 Object.keys(props).forEach(function (key) {
356 // eslint-disable-next-line no-prototype-builtins
357 if (!FontAwesomeIcon.defaultProps.hasOwnProperty(key)) {
358 extraProps[key] = props[key];
359 }
360 });
361 return convertCurry(abstract[0], extraProps);
362}
363FontAwesomeIcon.displayName = 'FontAwesomeIcon';
364FontAwesomeIcon.propTypes = {
365 beat: PropTypes.bool,
366 border: PropTypes.bool,
367 className: PropTypes.string,
368 fade: PropTypes.bool,
369 flash: PropTypes.bool,
370 mask: PropTypes.oneOfType([PropTypes.object, PropTypes.array, PropTypes.string]),
371 fixedWidth: PropTypes.bool,
372 inverse: PropTypes.bool,
373 flip: PropTypes.oneOf(['horizontal', 'vertical', 'both']),
374 icon: PropTypes.oneOfType([PropTypes.object, PropTypes.array, PropTypes.string]),
375 listItem: PropTypes.bool,
376 pull: PropTypes.oneOf(['right', 'left']),
377 pulse: PropTypes.bool,
378 rotation: PropTypes.oneOf([0, 90, 180, 270]),
379 size: PropTypes.oneOf(['2xs', 'xs', 'sm', 'lg', 'xl', '2xl', '1x', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x']),
380 spin: PropTypes.bool,
381 spinPulse: PropTypes.bool,
382 spinReverse: PropTypes.bool,
383 symbol: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
384 title: PropTypes.string,
385 transform: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
386 swapOpacity: PropTypes.bool
387};
388FontAwesomeIcon.defaultProps = {
389 border: false,
390 className: '',
391 mask: null,
392 fixedWidth: false,
393 inverse: false,
394 flip: null,
395 icon: null,
396 listItem: false,
397 pull: null,
398 pulse: false,
399 rotation: null,
400 size: null,
401 spin: false,
402 symbol: false,
403 title: '',
404 transform: null,
405 swapOpacity: false
406};
407var convertCurry = convert.bind(null, React.createElement);
408
409export { FontAwesomeIcon };