Release 0.0.18

CHANGELOG.md

@@ -6,6 +6,19 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/) and this p
 
 ---
 
+## [0.1.18](https://github.com/FortAwesome/react-fontawesome/releases/tag/0.1.18) - 2022-03-16
+
+### Added
+
+- Animations bounce, shake, fade, and beat-fade
+- Property maskId and titleId to allow consistent rendering on client and server
+
+### Changed
+
+- Peer dependencies now include major version 6
+
+---
+
 ## [0.1.17](https://github.com/FortAwesome/react-fontawesome/releases/tag/0.1.17) - 2022-01-28
 
 ### Added

DEVELOPMENT.md

@@ -20,7 +20,7 @@ The following commands are available through `npm run`
 1. Update the `CHANGELOG.md`
 1. Update the `README.md` contributors section
 1. `npm run build`
-1. `FONTAWESOME_NPM_AUTH_TOKEN=TOKEN npm run test` where `TOKEN` is a valid Pro registry token
+1. `npm run test`
 1. `npm publish`
 1. `npm publish --registry https://npm.fontawesome.com` (publish to Pro registry)
 1. `git add . && git commit -m 'Release VERSION'`

README.md

@@ -53,6 +53,7 @@ being awesome contributors to this project. **We'd like to take a moment to reco
 | Lukáš Rod         | [@rodlukas](https://github.com/rodlukas)                  |
 | Proudust          | [@proudust](https://github.com/proudust)                  |
 | Tiago Sousa       | [@TiagoPortfolio](https://github.com/TiagoPortfolio)      |
+| Alexey Victorov   | [@AliMamed](https://github.com/AliMamed)                  |
 | Font Awesome Team | [@FortAwesome](https://github.com/orgs/FortAwesome/people)|
 
 If we've missed someone (which is quite likely) submit a Pull Request to us and we'll get it resolved.

index.es.js

@@ -338,15 +338,17 @@ function FontAwesomeIcon(_ref) {
       symbol = props.symbol,
       className = props.className,
       title = props.title,
-      titleId = props.titleId;
+      titleId = props.titleId,
+      maskId = props.maskId;
   var iconLookup = normalizeIconArgs(iconArgs);
   var classes = objectWithKey('classes', [].concat(_toConsumableArray(classList(props)), _toConsumableArray(className.split(' '))));
   var transform = objectWithKey('transform', typeof props.transform === 'string' ? parse.transform(props.transform) : props.transform);
   var mask = objectWithKey('mask', normalizeIconArgs(maskArgs));
   var renderedIcon = icon(iconLookup, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, classes), transform), mask), {}, {
     symbol: symbol,
     title: title,
-    titleId: titleId
+    titleId: titleId,
+    maskId: maskId
   }));
 
   if (!renderedIcon) {
@@ -370,10 +372,12 @@ FontAwesomeIcon.displayName = 'FontAwesomeIcon';
 FontAwesomeIcon.propTypes = {
   beat: PropTypes.bool,
   border: PropTypes.bool,
+  bounce: PropTypes.bool,
   className: PropTypes.string,
   fade: PropTypes.bool,
   flash: PropTypes.bool,
   mask: PropTypes.oneOfType([PropTypes.object, PropTypes.array, PropTypes.string]),
+  maskId: PropTypes.string,
   fixedWidth: PropTypes.bool,
   inverse: PropTypes.bool,
   flip: PropTypes.oneOf(['horizontal', 'vertical', 'both']),
@@ -382,19 +386,22 @@ FontAwesomeIcon.propTypes = {
   pull: PropTypes.oneOf(['right', 'left']),
   pulse: PropTypes.bool,
   rotation: PropTypes.oneOf([0, 90, 180, 270]),
+  shake: PropTypes.bool,
   size: PropTypes.oneOf(['2xs', 'xs', 'sm', 'lg', 'xl', '2xl', '1x', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x']),
   spin: PropTypes.bool,
   spinPulse: PropTypes.bool,
   spinReverse: PropTypes.bool,
   symbol: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]),
   title: PropTypes.string,
+  titleId: PropTypes.string,
   transform: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
   swapOpacity: PropTypes.bool
 };
 FontAwesomeIcon.defaultProps = {
   border: false,
   className: '',
   mask: null,
+  maskId: null,
   fixedWidth: false,
   inverse: false,
   flip: null,
@@ -412,6 +419,7 @@ FontAwesomeIcon.defaultProps = {
   shake: false,
   symbol: false,
   title: '',
+  titleId: null,
   transform: null,
   swapOpacity: false
 };

index.js

@@ -345,15 +345,17 @@
         symbol = props.symbol,
         className = props.className,
         title = props.title,
-        titleId = props.titleId;
+        titleId = props.titleId,
+        maskId = props.maskId;
     var iconLookup = normalizeIconArgs(iconArgs);
     var classes = objectWithKey('classes', [].concat(_toConsumableArray(classList(props)), _toConsumableArray(className.split(' '))));
     var transform = objectWithKey('transform', typeof props.transform === 'string' ? fontawesomeSvgCore.parse.transform(props.transform) : props.transform);
     var mask = objectWithKey('mask', normalizeIconArgs(maskArgs));
     var renderedIcon = fontawesomeSvgCore.icon(iconLookup, _objectSpread2(_objectSpread2(_objectSpread2(_objectSpread2({}, classes), transform), mask), {}, {
       symbol: symbol,
       title: title,
-      titleId: titleId
+      titleId: titleId,
+      maskId: maskId
     }));
 
     if (!renderedIcon) {
@@ -377,10 +379,12 @@
   FontAwesomeIcon.propTypes = {
     beat: PropTypes__default["default"].bool,
     border: PropTypes__default["default"].bool,
+    bounce: PropTypes__default["default"].bool,
     className: PropTypes__default["default"].string,
     fade: PropTypes__default["default"].bool,
     flash: PropTypes__default["default"].bool,
     mask: PropTypes__default["default"].oneOfType([PropTypes__default["default"].object, PropTypes__default["default"].array, PropTypes__default["default"].string]),
+    maskId: PropTypes__default["default"].string,
     fixedWidth: PropTypes__default["default"].bool,
     inverse: PropTypes__default["default"].bool,
     flip: PropTypes__default["default"].oneOf(['horizontal', 'vertical', 'both']),
@@ -389,19 +393,22 @@
     pull: PropTypes__default["default"].oneOf(['right', 'left']),
     pulse: PropTypes__default["default"].bool,
     rotation: PropTypes__default["default"].oneOf([0, 90, 180, 270]),
+    shake: PropTypes__default["default"].bool,
     size: PropTypes__default["default"].oneOf(['2xs', 'xs', 'sm', 'lg', 'xl', '2xl', '1x', '2x', '3x', '4x', '5x', '6x', '7x', '8x', '9x', '10x']),
     spin: PropTypes__default["default"].bool,
     spinPulse: PropTypes__default["default"].bool,
     spinReverse: PropTypes__default["default"].bool,
     symbol: PropTypes__default["default"].oneOfType([PropTypes__default["default"].bool, PropTypes__default["default"].string]),
     title: PropTypes__default["default"].string,
+    titleId: PropTypes__default["default"].string,
     transform: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].object]),
     swapOpacity: PropTypes__default["default"].bool
   };
   FontAwesomeIcon.defaultProps = {
     border: false,
     className: '',
     mask: null,
+    maskId: null,
     fixedWidth: false,
     inverse: false,
     flip: null,
@@ -419,6 +426,7 @@
     shake: false,
     symbol: false,
     title: '',
+    titleId: null,
     transform: null,
     swapOpacity: false
   };

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fortawesome/react-fontawesome",
   "description": "Official React component for Font Awesome 5",
-  "version": "0.1.17",
+  "version": "0.1.18",
   "main": "index.js",
   "module": "index.es.js",
   "jsnext:main": "index.es.js",
@@ -25,7 +25,8 @@
     "Mike Lynch <github.com/baelec>",
     "Lukáš Rod <github.com/rodlukas>",
     "Proudust <github.com/proudust>",
-    "Tiago Sousa <github.com/TiagoPortfolio>"
+    "Tiago Sousa <github.com/TiagoPortfolio>",
+    "Alexey Victorov <github.com/AliMamed>"
   ],
   "license": "MIT",
   "scripts": {
@@ -36,7 +37,7 @@
     "prepack": "npm run dist",
     "test": "npm run test.5 && npm run test.6",
     "test.5": "npm --no-save install @fortawesome/fontawesome-svg-core@1.2.x @fortawesome/free-solid-svg-icons@5.x && jest --silent",
-    "test.6": "npm --no-save install @fortawesome/fontawesome-svg-core@1.3.x @fortawesome/free-solid-svg-icons@6.x && jest --silent",
+    "test.6": "npm --no-save install @fortawesome/fontawesome-svg-core@6.x @fortawesome/free-solid-svg-icons@6.x && jest --silent",
     "clean": "rm -f index.js && rm -f index.es.js"
   },
   "lint-staged": {