4.0.3 • Published 6 months ago

@xstate/svelte v4.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
6 months ago

@xstate/svelte

This package contains utilities for using XState with Svelte.

Quick Start

  1. Install xstate and @xstate/svelte:
npm i xstate @xstate/svelte

Via CDN

<script src="https://unpkg.com/@xstate/svelte/dist/xstate-svelte.min.js"></script>

By using the global variable XStateSvelte

  1. Import useMachine
<script>
  import { useMachine } from '@xstate/svelte';
  import { createMachine } from 'xstate';

  const toggleMachine = createMachine({
    id: 'toggle',
    initial: 'inactive',
    states: {
      inactive: {
        on: { TOGGLE: 'active' }
      },
      active: {
        on: { TOGGLE: 'inactive' }
      }
    }
  });

  const { state, send } = useMachine(toggleMachine);
</script>

<button on:click={() => send('TOGGLE')}>
  {$state.value === 'inactive'
    ? 'Click to activate'
    : 'Active! Click to deactivate'}
</button>
4.0.3

6 months ago

4.0.2

6 months ago

4.0.1

6 months ago

4.0.0

8 months ago

3.0.4

10 months ago

3.0.5

9 months ago

3.0.3

1 year ago

3.0.2

2 years ago

3.0.1

2 years ago

3.0.0

2 years ago

2.1.0

2 years ago

1.0.0

3 years ago

2.0.1

3 years ago

2.0.0

3 years ago

0.2.1

3 years ago

0.2.0

4 years ago

0.1.1

4 years ago

0.1.0

4 years ago