use-tgl

🎩 useTgl() is a React Hook toggle component visibility.

MIT License

Stars
9

Table of Contents

Motivation

  • Simplify the toggle action for components like Modals, Dialogs, Checkbox;

Usage

Install use-tgl in your project with the following:

yarn add use-tgl or npm install use-tgl

import useTgl from 'use-tgl';

export function App() {
  const { enabled, on, off, toggle } = useTgl(true); // => Optional start value

  useEffect(() => {
    toggle(); // => Disable toggle on render
  }, []);

  return enabled ? (
    <div>
      Enabled
      <button type="button" onClick={off}>
        Disable
      </button>
    </div>
  ) : (
    <div>
      Disabled
      <button type="button" onClick={on}>
        Enable
      </button>
    </div>
  );
}

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Bugs and Sugestions

Report bugs or do suggestions using the issues.

License

MIT License © helderberto

Badges
Extracted from project README
build version MIT License downloads