diff options
Diffstat (limited to 'src/utils')
| -rw-r--r-- | src/utils/hooks/use-input-autofocus.tsx | 39 |
1 files changed, 39 insertions, 0 deletions
diff --git a/src/utils/hooks/use-input-autofocus.tsx b/src/utils/hooks/use-input-autofocus.tsx new file mode 100644 index 0000000..c7700e9 --- /dev/null +++ b/src/utils/hooks/use-input-autofocus.tsx @@ -0,0 +1,39 @@ +import { RefObject, useEffect } from 'react'; + +export type UseInputAutofocusProps = { + /** + * The focus condition. True give focus to the input. + */ + condition: boolean; + /** + * An optional delay. Default: 0. + */ + delay?: number; + /** + * A reference to the input element. + */ + ref: RefObject<HTMLInputElement>; +}; + +/** + * Set focus on an input with an optional delay. + */ +const useInputAutofocus = ({ + condition, + delay = 0, + ref, +}: UseInputAutofocusProps) => { + useEffect(() => { + const timer = setTimeout(() => { + if (ref.current && condition) { + ref.current.focus(); + } + }, delay); + + return () => { + clearTimeout(timer); + }; + }, [condition, delay, ref]); +}; + +export default useInputAutofocus; |
