@simple-state-machine/react

react

Installation

    npm i @simple-state-machine/core @simple-state-machine/react

Quick Glance

    import {useMachine} from '@simple-state-machine/react'
    import ThemeMachine from './theme-machine';

    function Theme({children}){
        const {state, send} = useMachine(ThemeMachine)
        const themeClassName = state.value === 'light' ? 'light-mode' : 'dark-mode'
        const toggleTheme = () => send('TOGGLE');

        return (
            <>
                <button onClick={toggleTheme}>Toggle Theme</button>
                <div className={themeClassName}>
                    {children}
                </div>
            </>
        )
    }

API

• If you are new to simple-state-machine, it is recommended to go through the core package
• In order to understand the API in depth, please go through the api-documentation

Examples

• Debounced Input
• Polling API

Tutorial

• Timer App