@mountain-ui/react-hooks

Prerequisites

Before integrating the @mountain-ui/react-hooks library into your project, ensure that you have the following prerequisites:

• Node.js: Make sure Node.js is installed on your machine. You can download it from nodejs.org.

Installation

To install and leverage the power of the @mountain-ui/react-hooks library, follow these steps:

1. Open a terminal window in your project directory.

2. Run the following command to install the hooks library:

   npm install @mountain-ui/react-hooks

3. Once installed, you can import and use the hooks in your project.

Usage Example

Here's a simple example demonstrating how to use some of the custom hooks in your React application:

import React from 'react';
import { useBoolean, useDarkMode, useEventListener } from '@mountain-ui/react-hooks';

function App() {
  // Example usage of useBoolean
  const [value, { on, off, toggle }] = useBoolean(false);

  // Example usage of useDarkMode
  const isDarkMode = useDarkMode();

  // Example usage of useEventListener
  useEventListener('DOMContentLoaded', () => {
    console.log('Document Loaded!');
  });

  return (
    <div>
      <p>Boolean Value: {value.toString()}</p>
      <button onClick={toggle}>Toggle</button>
      <button onClick={on}>Set True</button>
      <button onClick={off}>Set False</button>

      <p>Dark Mode: {isDarkMode ? 'Enabled' : 'Disabled'}</p>
    </div>
  );
}

export default App;

Custom Hooks

For detailed information about each custom hook, refer to the sub-pages:

• useBoolean
• useDarkMode
• useEventListener
• useFontSize
• useLocalStorage
• useMediaQuery
• useOutsideClick
• usePrefersDarkMode
• useToggle
• useUpdateEffect