react-darkmode-toggler

Made with create-react-library

Demo

Install

npm i react-darkmode-toggler

or

yarn add react-darkmode-toggler

Usage

import React, { useState } from 'react'
 
import { DarkModeToggler } from 'react-darkmode-toggler'
 
const App = () => {
  const [isDark, setIsDark] = useState<'light' | 'dark'>('light')
 
  // button toggler
  const darkModeHandler = () => {
    setIsDark(isDark === 'light' ? 'dark' : 'light')
  }
 
  return (
    <DarkModeToggler
      size='small'
      isDark={isDark}
      onClick={darkModeHandler}
      border='#000'
    />
  )
}

Props

| Props   | Types               | Default | Required |
| ------- | ------------------- | ------- | -------- |
| isDark  | `light` or `dark`   | 'light' | no       |
| onClick | func                | null    | yes      |
| size    | `middle` or `small` | no      | no       |
| border  | hex color           | #000    | no       |

License

MIT ©