Make onChange prop reactive (closes samuelmeuli#11)

prakis · May 29, 2019 · b20fab8 · b20fab8
1 parent 0e0b4e1
commit b20fab8
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 9 deletions.
diff --git a/README.md b/README.md
@@ -83,7 +83,7 @@ The following props can be passed to the `FontPicker` component:
 - **`limit`**: Maximum number of fonts to display in the list (the least popular fonts will be omitted). Default: `50`
 - **`sort`**: Sorting attribute for the font list. Possible values: `"alphabet", "popularity"`. Default: `"alphabet"`
 
-_Currently, only the `activeFontFamily` and `sort` props are reactive._
+_Currently, only the `activeFontFamily`, `onChange` and `sort` props are reactive._
 
 ## Development
 

diff --git a/package.json b/package.json
@@ -39,7 +39,7 @@
 		"release": "np"
 	},
 	"dependencies": {
-		"font-picker": "^3.0.3"
+		"font-picker": "^3.1.0"
 	},
 	"peerDependencies": {
 		"@types/react": "^16.8.10",

diff --git a/src/FontPicker.tsx b/src/FontPicker.tsx
@@ -119,11 +119,16 @@ export default class FontPicker extends PureComponent<Props, State> {
 	 * call this.setActiveFontFamily with the new font
 	 */
 	componentDidUpdate(prevProps: Props): void {
-		const { activeFontFamily: fontFamilyProps } = this.props;
+		const { activeFontFamily, onChange } = this.props;
 
 		// If active font prop has changed: Update font family in font manager and component state
-		if (fontFamilyProps !== prevProps.activeFontFamily) {
-			this.setActiveFontFamily(fontFamilyProps);
+		if (activeFontFamily !== prevProps.activeFontFamily) {
+			this.setActiveFontFamily(activeFontFamily);
+		}
+
+		// If onChange prop has changed: Update onChange function in font manager
+		if (onChange !== prevProps.onChange) {
+			this.fontManager.setOnChange(onChange);
 		}
 	}
 

diff --git a/yarn.lock b/yarn.lock
@@ -4491,10 +4491,10 @@ focus-lock@^0.6.3:
   resolved "https://registry.yarnpkg.com/focus-lock/-/focus-lock-0.6.4.tgz#066af3ed5875d85745ab45ef4fbbb43e8a73514a"
   integrity sha512-+waElh6m7dbNmEabXQIblZjJMIRQOoHMNqB8RZkyemK+vN1XQ9uHLi740DVwTcK5fzAq3g+tBglLjIqUDHX/Og==
 
-font-picker@^3.0.3:
-  version "3.0.3"
-  resolved "https://registry.yarnpkg.com/font-picker/-/font-picker-3.0.3.tgz#0eaa8b26f26ea1fdab4955c4fb476df56e27e680"
-  integrity sha512-j+Q8sz54yVHhdKfq8hAHec+Jdk+CMZZISPjal8G2MS3wXfb0+OrDTuA3X7N9J3TdPivsU3+xTar+/QbgCA2+NA==
+font-picker@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/font-picker/-/font-picker-3.1.0.tgz#587afeb46517d3788adbe538d3823c8c6bc2b5df"
+  integrity sha512-OB5gPtAoSY0CVfolwKd3PXaKl59F0QeP6+Ylt+4js0o1JkKGjvON5MO8lUlYq6VLPJlWx8l/ZmUrvHcAu94CJg==
 
 for-in@^0.1.3:
   version "0.1.8"