Narrating Prophetic Monks

    @cxstate/react
    TypeScript icon, indicating that this package has built-in type declarations

    0.6.3 • Public • Published

    CxState React Hook

    React integration for CxState.

    Quick start

    npm i -S @cxstate/cxstate @cxstate/react

    To use the react hook, additionally install @cxstate/react and use it as follows:

    import { useMachine } from '@cxstate/react';
    // Assuming a machine definition, context and event interfaces in ./machine.ts
    import { Context, machine, DoEvent } from './machine';
    
    const [current, send] = useMachine<Context>(machine);
    
    // Sending strong typed events to the machine
    send<DoEvent>('DO_SOMETHING', {value: 'a value'});
    
    // Conditional rendering if current state is '/state/path/a' or '/state/path/b'
    { current.matchesOne('/state/path/a', '/state/path/b')) && <h1>{{ current.context.headerAOrB }}</h1> }
    
    // Conditional rendering if current state is neither '/state/path/a' or '/state/path/b'
    { current.matchesNone('/state/path/a', '/state/path/b')) && <h1>{{ current.context.neitherHeaderAOrB }}</h1> }

    TOC

    1. API

    Install

    npm i @cxstate/react

    DownloadsWeekly Downloads

    0

    Version

    0.6.3

    License

    MIT

    Unpacked Size

    24.2 kB

    Total Files

    10

    Last publish

    Collaborators

    • jaqmol