use-light-switch/README.md
2020-01-06 23:19:43 +01:00

1.1 KiB
Executable File

use-light-switch

Version Dependencies Size Badge

React hook for dark mode.

🌈 Features

  • Typescript compatible
  • 0 Dependencies
  • Tiny ~0.4kB
  • React Hooks
Installation
npm i use-light-switch

🤔 Motivation

There was no library with typings 🤕

🚀 Quickstart

import React from 'react'
import ReactDOM from 'react-dom'
import { useModeSelector } from 'use-light-switch'

const App: React.FC = () => {
    const selected = useModeSelector({
        light: { color: 'green', name: 'Light' },
        dark: { color: 'red', name: 'Dark' },
        unset: { color: 'blue', name: 'Unset' },
    })

    return <div>
        <h3>Selector</h3>
        <div style={{
            padding: '1em 2em',
            backgroundColor: selected.color
        }}>
            {selected.name}
        </div>
    </div>
}

ReactDOM.render(<App />, window.document.getElementById('root'))