diff --git a/README.md b/README.md index b57921a..a23051a 100644 --- 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 index d683644..0b0c51d 100644 --- 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 index f7dcb85..cbe69dc 100644 --- a/src/FontPicker.tsx +++ b/src/FontPicker.tsx @@ -119,11 +119,16 @@ export default class FontPicker extends PureComponent { * 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 index 8eef6fb..56684e3 100644 --- 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"