diff --git a/packages/utils/src/withDeviceRatio.tsx b/packages/utils/src/withDeviceRatio.tsx
index ce9205c63..fc16df110 100644
--- a/packages/utils/src/withDeviceRatio.tsx
+++ b/packages/utils/src/withDeviceRatio.tsx
@@ -9,7 +9,9 @@ export interface WithRatioState {
 }
 
 export const withDeviceRatio = () => {
-    return <TProps extends WithRatioProps>(OriginalComponent: React.ComponentClass<TProps>) => {
+    return <TProps extends WithRatioProps>(
+        OriginalComponent: React.ComponentClass<TProps> | React.FunctionComponent<TProps>,
+    ) => {
         return class WithRatio extends React.Component<Omit<TProps, "ratio">, WithRatioState> {
             public readonly ref = React.createRef<HTMLCanvasElement>();
 
diff --git a/packages/utils/src/withSize.tsx b/packages/utils/src/withSize.tsx
index 8f4c7ee4e..b355d5d5d 100644
--- a/packages/utils/src/withSize.tsx
+++ b/packages/utils/src/withSize.tsx
@@ -7,7 +7,9 @@ export interface WithSizeProps {
 }
 
 export const withSize = (props?: Omit<AutoSizerProps, "children">) => {
-    return <TProps extends WithSizeProps>(OriginalComponent: React.ComponentClass<TProps>) => {
+    return <TProps extends WithSizeProps>(
+        OriginalComponent: React.ComponentClass<TProps> | React.FunctionComponent<TProps>,
+    ) => {
         return class WithSize extends React.Component<Omit<TProps, "width" | "height">> {
             public render() {
                 return (