fix: remove ref from HintProps and set default to any

gooftroop · Sep 20, 2021 · b8ce205 · b8ce205
1 parent 63bb543
commit b8ce205
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 13 deletions.
diff --git a/src/ReactImageMagnify.tsx b/src/ReactImageMagnify.tsx
@@ -216,14 +216,13 @@ export const ReactImageMagnify = (props: ReactImageMagnifyProps): JSX.Element =>
         activationInteractionHint === INTERACTIONS.click
         || activationInteractionHint === INTERACTIONS.hover
     ) ? (
-        // @ts-expect-error
         <HintComponent
+            {...hintProps}
             hintTextMouse={hintProps?.hintTextMouse || `${capitalize(activationInteractionHint)} to Zoom`}
             hintTextTouch={hintProps?.hintTextTouch || 'Long-Touch to Zoom'}
             isMouseDetected={isMouseDetected}
             isTouchDetected={isTouchDetected}
             style={generateHintStyle(hintProps?.style)}
-            {...hintProps}
             onClick={lockedByHintInteraction ? handleHintClick : undefined}
             onTouchEnd={lockedByHintInteraction ? handleHintTouchEnd : undefined}
         />

diff --git a/src/hint/DefaultHint.tsx b/src/hint/DefaultHint.tsx
@@ -1,8 +1,7 @@
-/* eslint-disable react/prop-types */
-import { forwardRef, memo, MutableRefObject } from 'react';
+import { memo } from 'react';
 import type { HintProps } from 'src/types';
 
-export const DefaultHint = memo(forwardRef<HTMLElement, HintProps<HTMLElement>>((props, ref): JSX.Element => {
+export const DefaultHint = memo((props: HintProps<HTMLDivElement>): JSX.Element => {
     const {
         isMouseDetected,
         isTouchDetected,
@@ -24,7 +23,6 @@ export const DefaultHint = memo(forwardRef<HTMLElement, HintProps<HTMLElement>>(
                 ...style,
             }}
             {...rest}
-            ref={ref as MutableRefObject<HTMLDivElement>}
         >
             <div
                 style={{
@@ -56,4 +54,4 @@ export const DefaultHint = memo(forwardRef<HTMLElement, HintProps<HTMLElement>>(
             </div>
         </div>
     );
-}));
+});
diff --git a/src/types.ts b/src/types.ts
@@ -5,7 +5,6 @@ import type {
     ForwardRefExoticComponent,
     HTMLProps,
     ImgHTMLAttributes,
-    MemoExoticComponent,
     TouchEvent as ReactTouchEvent,
 } from 'react';
 import type {
@@ -84,7 +83,7 @@ export interface LensProps extends HTMLProps<HTMLDivElement> {
     position: Point;
 }
 
-export interface HintProps<T extends HTMLElement = HTMLElement> extends HTMLProps<T> {
+export interface HintProps<T extends HTMLElement = any> extends Omit<HTMLProps<T>, 'ref'> {
     isMouseDetected?: boolean;
     isTouchDetected?: boolean;
     hintTextMouse: string;
@@ -136,10 +135,7 @@ CursorPositionProps,
     activationInteractionMouse?: Interactions['click'] | Interactions['hover'];
     activationInteractionTouch?: Interactions['press'] | Interactions['tap'] | Interactions['touch'];
     fadeDurationInMs?: number;
-    hintComponent?: ComponentType<HintProps>
-    | ForwardRefExoticComponent<HintProps>
-    | MemoExoticComponent<ComponentType<HintProps>
-    | ForwardRefExoticComponent<HintProps>>;
+    hintComponent?: ComponentType<HintProps>;
     hintProps?: HintProps;
     hoverDelayInMs?: number;
     hoverOffDelayInMs?: number;