Version 3.1.2

fix: added check for disabled session storage (#58)

Version 3.1.1

revert async store update

Version 3.1.0

• fix syncStorage doesn't work with react-native #48
  • now support aysnc store retrieve.

Version 3.0.3

fix Error on SSR projects with actions execution #45

Version 3.0.2

• include ie11 build

Version 3.0.1

• fix #38 middle not return value issue

Version 3.0.0

• remove Devtool from the library (new Devtool location: https://github.com/bluebill1049/little-state-machine-dev-tools)

Version 2.14.0

Middlewares all call same data object - would like it to act as a pipe. #31
Exported type for action expects store. #30

Version 2.13.0

• support multiple store sync

createStore({
  yourDetail, // it's an object of your state { firstName: '', lastName: '' }
}, {
  syncStores : [
     { 
       externalStoreName: 'externalStoreName',
       transform: ({ externalStoreData, currentStoreData }) => {
         return { ...externalStoreData, ...currentStoreData };
        },
     }
  ]
})

Version 2.12.0

🥂 compatible with React Native

Example code below:

import React from "react";
import { TextInput, Button, View, AsyncStorage } from "react-native";
import {
  StateMachineProvider,
  createStore,
  setStorageType,
  useStateMachine
} from "little-state-machine";
import { useForm, Controller } from "react-hook-form";
import * as yup from "yup";

setStorageType(AsyncStorage);

createStore({});

function update(state, payload) {
  return {
    ...state,
    ...payload
  };
}

let counter = 0;

const Form = () => {
  const { handleSubmit, control, errors } = useForm({
    validationSchema: yup.object().shape({
      firstName: yup
        .string()
        .label("Name")
        .required()
    })
  });
  const { action, state } = useStateMachine(update);

  const onSubmit = formData => {
    action(formData);
  };

  const onChange = args => {
    return {
      value: args[0].nativeEvent.text
    };
  };
  
  counter++;

  return (
    <View style={{ marginTop: 40 }}>
      <Controller
        as={
          <TextInput
            style={{ borderWidth: 1, height: 80 }}
            placeholder="your name"
          />
        }
        control={control}
        name="firstName"
        onChange={onChange}
        defaultValue={state.firstName}
      />
      <Controller
        as={<TextInput style={{ borderWidth: 1, height: 80 }} />}
        control={control}
        name="lastName"
        onChange={onChange}
        defaultValue={state.lastName}
      />
      <Button title="Submit" onPress={handleSubmit(onSubmit)} />
    </View>
  );
};

const App = () => (
  <StateMachineProvider>
    <Form />
  </StateMachineProvider>
);

export default App;