use-stay-awake-nextjs

use-stay-awake-nextjs

Live Demo

React hook that make device stay awake while actively using your website.

:sparkles: Features

• Typescript support
• Best browser support
• Easy to implement
• CPU friendly
• Zero dependencies

:comet: Installation

1. Using PNPM

    pnpm add use-stay-awake-nextjs
   

2. Using Yarn

    yarn add use-stay-awake-nextjs
   

3. Using NPM

    npm install use-stay-awake-nextjs
   

:100: Usage

import React from "react";
import useStayAwake from "use-stay-awake";

function App() {
  const device = useStayAwake();

  return (
    <div>
      <p>
        Status:
        <span>
          {device.canSleep
            ? "Device is allowed to sleep"
            : "Device is not allowed to sleep"}
        </span>
      </p>
      <button
        onClick={() => {
          device.preventSleeping();
        }}
      >
        Prevent Sleeping
      </button>
      <button
        onClick={() => {
          device.allowSleeping();
        }}
      >
        Allow Sleeping
      </button>
    </div>
  );
}

export default App;

:spider_web: Properties

Prop Name	Type	Description
canSleep	boolean default: true	Indicator if the device allowed to sleep.
preventSleeping	function	Function that prevent the device from sleeping.
allowSleeping	function	Function that allow the device from sleeping.

:dizzy: Browser Support

• Internet Explorer v9-11
• Microsoft Edge v12-84
• Firefox v22-81
• Chrome v4-87
• Safari v4-14-TP
• Opera v16-69
• iOS Safari v3.2-14.0
• Android Browser v4.4-81
• Opera Mobile v12-46
• Chrome for Android v84
• Firefox for Android v68
• UC Browser for Android v12.12
• Samsung Internet v4-12.0
• QQ Browser v10.4
• Baidu Browser v7.12
• KaiOS Browser v2.5

🛠 Development

Thank you so much for contributing! :blue_heart:

⚡ Quick Setup

1. Clone the repository

    git clone https://github.com/roldanjr/use-stay-awake
   

2. Locate library folder

    cd use-stay-awake
   

3. Install library dependencies

    yarn install or npm install
   

4. Locate demo folder and install dependencies

    cd demo
    yarn install or npm install
   

5. Start development server under root folder

    yarn develop or npm run develop
   

:bookmark_tabs: License

MIT © Roldan Montilla Jr