@snappmarket/use-focusdeprecated

> 😵 focus on every thing you want ----

Usage no npm install needed!

<script type="module">
  import snappmarketUseFocus from 'https://cdn.skypack.dev/@snappmarket/use-focus';
</script>

README

useFocus

😵 focus on every thing you want


version downloads PRs Welcome MIT License

Watch on GitHub Star on GitHub

get started

We provide two way of using this package single or multi :

npm i @snappmarket/use-focus
OR
npm i @snappmarket/hooks

usage

import useFocus from '@snappmarket/use-focus';
// or 
// import { useFocus } from '@snappmarket/hooks';


const MyComponenet = props => {
  const focusRef = useFocus(null);

  return (<input type="text" ref={focusRef}/>)
};

source code

import { useEffect, useRef } from 'react';

/**
 * Focus on a ref after render
 * @param initialRef
 * @returns {React.MutableRefObject<*>}
 */
export default initialRef => {
  const ref = useRef(initialRef);
  useEffect(() => {
    setTimeout(() => {
      ref.current.focus();
    }, 100);
  }, []);

  return ref;
};