fix(*): use unknown instead of any type for layout snapshots

Author: Jannick Garthen

examples/index.tsx

@@ -181,5 +181,5 @@ setInterval(() => {
       </main>
     </ViewportProvider>,
     document.getElementById('root'),
-  )
-}, 1000)
+  );
+}, 1000);

lib/ObserveViewport.tsx

@@ -28,8 +28,8 @@ interface IState extends IChildProps {}
 
 interface IProps {
   children?: (props: IChildProps) => React.ReactNode;
-  onUpdate?: (props: IChildProps, layoutSnapshot: any) => void;
-  recalculateLayoutBeforeUpdate?: (props: IChildProps) => any;
+  onUpdate?: (props: IChildProps, layoutSnapshot: unknown) => void;
+  recalculateLayoutBeforeUpdate?: (props: IChildProps) => unknown;
   disableScrollUpdates: boolean;
   disableDimensionsUpdates: boolean;
   deferUpdateUntilIdle: boolean;
@@ -98,7 +98,7 @@ export default class ObserveViewport extends React.Component<IProps, IState> {
     cancelAnimationFrame(this.tickId);
   }
 
-  handleViewportUpdate = (viewport: IViewport, layoutSnapshot: any) => {
+  handleViewportUpdate = (viewport: IViewport, layoutSnapshot: unknown) => {
     const scroll = this.props.disableScrollUpdates ? null : viewport.scroll;
     const dimensions = this.props.disableDimensionsUpdates
       ? null

lib/ViewportProvider.tsx

@@ -30,18 +30,18 @@ const getCurrentDefaultViewport = (() => {
       defaultValue = {
         scroll: getClientScroll(),
         dimensions: getClientDimensions(),
-      }
+      };
     }
-    return defaultValue
-  }
+    return defaultValue;
+  };
 })();
 
 export const ViewportContext = React.createContext({
-  removeViewportChangeListener: (handler: TViewportChangeHandler) => { },
+  removeViewportChangeListener: (handler: TViewportChangeHandler) => {},
   addViewportChangeListener: (
     handler: TViewportChangeHandler,
     options: IViewportChangeOptions,
-  ) => { },
+  ) => {},
   getCurrentViewport: getCurrentDefaultViewport,
   hasRootProviderAsParent: false,
   version: '__VERSION__',
@@ -84,7 +84,7 @@ const shouldSkipIteration = (
 export default class ViewportProvider extends React.PureComponent<
   IProps,
   { hasListeners: boolean }
-  > {
+> {
   static defaultProps: {
     experimentalSchedulerEnabled: false;
   };
@@ -145,7 +145,7 @@ export default class ViewportProvider extends React.PureComponent<
         if (recalculateLayoutBeforeUpdate) {
           const getDuration = createPerformanceMarker();
           const layoutState = recalculateLayoutBeforeUpdate(state);
-          return [layoutState, getDuration()];
+          return [layoutState, getDuration()] as const;
         }
         return null;
       },

lib/hooks.ts

@@ -21,10 +21,8 @@ interface IEffectOptions<T> extends IOptions {
   recalculateLayoutBeforeUpdate?: (viewport: IViewport) => T;
 }
 
-type HandleViewportChangeType = (viewport: IViewport, snapshot: any) => void;
-
-export const useViewportEffect = <T = any>(
-  handleViewportChange: HandleViewportChangeType,
+export const useViewportEffect = <T>(
+  handleViewportChange: (viewport: IViewport, snapshot: T) => void,
   options: IViewPortEffectOptions<T> = {},
 ) => {
   const {
@@ -58,7 +56,7 @@ export const useViewport = (options: IFullOptions = {}): IViewport => {
   return state;
 };
 
-export const useScrollEffect = <T = any>(
+export const useScrollEffect = <T = unknown>(
   effect: (scroll: IScroll, snapshot: T) => void,
   options: IEffectOptions<T> = {},
 ) => {
@@ -80,7 +78,7 @@ export const useScroll = (options: IOptions = {}): IScroll => {
   return scroll;
 };
 
-export const useDimensionsEffect = <T = any>(
+export const useDimensionsEffect = <T = unknown>(
   effect: (scroll: IDimensions, snapshot: T) => void,
   options: IEffectOptions<T> = {},
 ) => {
@@ -124,7 +122,7 @@ export const useRect = (
   );
 };
 
-export const useLayoutSnapshot = <T = any>(
+export const useLayoutSnapshot = <T = unknown>(
   recalculateLayoutBeforeUpdate: (viewport: IViewport) => T,
   options: IFullOptions = {},
 ): null | T => {

lib/modules.d.ts

@@ -66,4 +66,4 @@ interface DOMRectReadOnly {
   toJSON: () => any;
 }
 
-declare module "@testing-library/react"
+declare module '@testing-library/react';

lib/types.ts

@@ -46,7 +46,7 @@ export interface IViewportChangeOptions {
   notifyDimensions: () => boolean;
   notifyOnlyWhenIdle: () => boolean;
   priority: () => PriorityType;
-  recalculateLayoutBeforeUpdate?: (viewport: IViewport) => any;
+  recalculateLayoutBeforeUpdate?: (viewport: IViewport) => unknown;
 }
 
 export interface IViewportCollectorUpdateOptions {

lib/utils.ts

@@ -108,7 +108,7 @@ export const warnNoContextAvailable = (location: string) => {
   if (process.env.NODE_ENV === 'production') {
     return;
   }
-  const fromHook = location.startsWith('use')
+  const fromHook = location.startsWith('use');
   if (fromHook) {
     console.warn(
       `react-viewport-utils: ${location} hook is not able to connect to a <ViewportProvider>. Therefore it cannot detect updates from the viewport and will not work as expected. To resolve this issue please add a <ViewportProvider> as a parent of the component using the hook, e.g. directly in the ReactDOM.render call:
@@ -130,8 +130,7 @@ ReactDOM.render(
   document.getElementById('root')
 );`,
     );
-    return
-
+    return;
   }
   console.warn(
     `react-viewport-utils: ${location} component is not able to connect to a <ViewportProvider>. Therefore it cannot detect updates from the viewport and will not work as expected. To resolve this issue please add a <ViewportProvider> as a parent of the <ObserveViewport> component, e.g. directly in the ReactDOM.render call: