diff --git a/src/__tests__/CountUp.test.js b/src/__tests__/CountUp.test.js
index 3a660eb9..cfe6c393 100644
--- a/src/__tests__/CountUp.test.js
+++ b/src/__tests__/CountUp.test.js
@@ -225,6 +225,23 @@ describe('CountUp component', () => {
}, 1000);
});
+ it('applies default params for wrapped component', (done) => {
+ const WrappedCountUp = ({ prefix, suffix }) => (
+
+ );
+
+ const { container } = render(
+ ,
+ );
+
+ setTimeout(() => {
+ const span = container.firstChild;
+ expect(span.textContent).toEqual('100');
+ done();
+ }, 1000);
+
+ })
+
it('calls start correctly', () => {
const spy = {};
diff --git a/src/tsconfig.json b/src/tsconfig.json
index 5cca09a6..b7a18540 100644
--- a/src/tsconfig.json
+++ b/src/tsconfig.json
@@ -1,5 +1,6 @@
{
"compilerOptions": {
+ "lib": ["es2019", "dom"],
/* Basic Options */
"target": "es5" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */,
"module": "commonjs" /* Specify module code generation: 'commonjs', 'amd', 'system', 'umd' or 'es2015'. */,
diff --git a/src/useCountUp.ts b/src/useCountUp.ts
index 73207052..174662b3 100644
--- a/src/useCountUp.ts
+++ b/src/useCountUp.ts
@@ -1,10 +1,10 @@
-import { CallbackProps, CommonProps, CountUpApi, UpdateFn } from './types';
+import { CallbackProps, CommonProps, CountUpApi, CountUpInstanceProps, UpdateFn } from "./types";
import React, { useMemo, useRef, useEffect } from 'react';
import { createCountUpInstance } from './common';
import { useEventCallback } from './helpers/useEventCallback';
import { CountUp as CountUpJs } from 'countup.js';
-export interface useCountUpProps extends CommonProps, CallbackProps {
+export interface UseCountUpProps extends CommonProps, CallbackProps {
startOnMount?: boolean;
ref: string | React.RefObject;
enableReinitialize?: boolean;
@@ -26,7 +26,10 @@ const DEFAULTS = {
useIndianSeparators: false,
};
-const useCountUp = (props: useCountUpProps): CountUpApi => {
+const useCountUp = (props: UseCountUpProps): CountUpApi => {
+ const filteredProps: Partial = Object.fromEntries(
+ Object.entries(props).filter(([, value]) => value !== undefined)
+ );
const {
ref,
startOnMount,
@@ -38,7 +41,7 @@ const useCountUp = (props: useCountUpProps): CountUpApi => {
onReset,
onUpdate,
...instanceProps
- } = useMemo(() => ({ ...DEFAULTS, ...props }), [props]);
+ } = useMemo(() => ({ ...DEFAULTS, ...filteredProps }), [props]);
const countUpRef = useRef();
const timerRef = useRef>();
@@ -46,8 +49,9 @@ const useCountUp = (props: useCountUpProps): CountUpApi => {
const createInstance = useEventCallback(() => {
return createCountUpInstance(
- typeof ref === 'string' ? ref : ref.current!,
- instanceProps,
+ typeof ref === 'string' ? ref : ref!.current!,
+ instanceProps as CountUpInstanceProps
+ ,
);
});