Skip to content

Commit

Permalink
fix: add generic typing to createHTMLMediaHook. no typecheck problem …
Browse files Browse the repository at this point in the history
…with ref anymore.
  • Loading branch information
arminyahya committed Apr 6, 2021
1 parent ac4dd78 commit 1f547ef
Showing 1 changed file with 11 additions and 16 deletions.
27 changes: 11 additions & 16 deletions src/factory/createHTMLMediaHook.ts
Original file line number Diff line number Diff line change
Expand Up @@ -27,25 +27,20 @@ export interface HTMLMediaControls {
seek: (time: number) => void;
}

type createHTMLMediaHookReturn = [
React.ReactElement<HTMLMediaProps>,
HTMLMediaState,
HTMLMediaControls,
{ current: HTMLAudioElement | null }
];

export default function createHTMLMediaHook(tag: 'audio' | 'video') {
type MediaPropsWithRef<T> = HTMLMediaProps & { ref?: React.MutableRefObject<T | null> };

export default function createHTMLMediaHook<T extends HTMLAudioElement | HTMLVideoElement>(tag: 'audio' | 'video') {
return (
elOrProps: HTMLMediaProps | React.ReactElement<HTMLMediaProps>
): createHTMLMediaHookReturn => {
let element: React.ReactElement<any> | undefined;
let props: HTMLMediaProps;
) => {
let element: React.ReactElement<MediaPropsWithRef<T>> | undefined;
let props: MediaPropsWithRef<T>;

if (React.isValidElement(elOrProps)) {
element = elOrProps;
props = element.props;
} else {
props = elOrProps as HTMLMediaProps;
props = elOrProps;
}

const [state, setState] = useSetState<HTMLMediaState>({
Expand All @@ -56,7 +51,7 @@ export default function createHTMLMediaHook(tag: 'audio' | 'video') {
muted: false,
volume: 1,
});
const ref = useRef<HTMLAudioElement | null>(null);
const ref = useRef<T | null>(null);

const wrapEvent = (userEvent, proxyEvent?) => {
return (event) => {
Expand Down Expand Up @@ -234,6 +229,6 @@ export default function createHTMLMediaHook(tag: 'audio' | 'video') {
}
}, [props.src]);

return [element, state, controls, ref];
};
}
return [element, state, controls, ref] as const;
}
};

0 comments on commit 1f547ef

Please sign in to comment.