Options
All
  • Public
  • Public/Protected
  • All
Menu

Build Status Coverage Status GitHub license npm npm bundle size

Yet Another Redux-TypeScript Utilities Library (yartsul)

Simple and 100% type safe actions and reducers with no boilerplate code 🎉

The problem

  • Creating type safe actions and reducers using plain typescript involves a lot of boilerplate code.
  • Existing libriares that help reducing the boilerplate either sacrifice type safety or are rather complicated and verbose.

The solution

  • 100% type safe utils for creating simple actions and reducers
  • No boilerplate code
  • Minimal API surface and emphasis on simplicity
    • Just 2 exported functions
    • Actions are plain objects: { type: 'THE_ANSWER', payload: 42 }
    • No need to maintain RootAction type
  • Slightly opinionanted
    • Not fully FSA compilant (type and payload are all that you need)
    • Usage of immer.js for easy handling of immutable updates
    • Compatible with any redux stack (reselect / thunk-actions / sagas / epics)
  • Progerssively adoptable in existing projects

Usage

import { defineAction, createReducer } from 'yartsul';
import { createStore } from 'redux';

/* define actions */

const Increment = defineAction('Counter/Increment');
const Decrement = defineAction<void>('Counter/Decrement'); // same as above but more explicit

const Add = defineAction<number>('Counter/Add');

/* create reducer */

type State = {
    readonly counter: number;
    readonly otherStuff: string;
};

const initialState: State = {
    counter: 0,
    otherStuff: ''
};

const reducer = createReducer<State>(
    initialState,

    // you can just return the next state
    Increment.handler(state => ({ ...state, counter: state.counter + 1 })),

    // or mutate the provided state draft to create next state (see: immer.js)
    Add.handler((state, amount) => {
        state.counter = state.counter + amount;
    })
);

/* creating store and middlewares are not affected by this lib */
const store = createStore(reducer);

/* create and dispatch some actions! */

store.dispatch(Increment());
store.dispatch(Increment(1)); // Type error!

store.dispatch(Add(2));
store.dispatch(Add('2')); // Type error!
store.dispatch(Add()); // Type error!

see full API docs

Similiar packages

Index

Type aliases

ActionDefinition

Type parameters

  • P

DraftHandlerResult

DraftHandlerResult<T>: Draft<T> | T | void

Type parameters

  • T

Reducer

Reducer<S>: function

Type parameters

  • S

Type declaration

Functions

createReducer

  • Creates redux and useReducer compatible reducer function from given action handlers which are run thorught immer produce function to create next state.

    Type parameters

    • S

    Parameters

    • initialState: S
    • Rest ...handlers: Array<ActionHandler<S, any>>

      handlers created by ActionDefinition.handler function

    Returns Reducer<S>

defineAction

Legend

  • Module
  • Object literal
  • Variable
  • Function
  • Function with type parameter
  • Index signature
  • Type alias
  • Type alias with type parameter
  • Enumeration
  • Enumeration member
  • Property
  • Method
  • Interface
  • Interface with type parameter
  • Constructor
  • Property
  • Method
  • Index signature
  • Class
  • Class with type parameter
  • Constructor
  • Property
  • Method
  • Accessor
  • Index signature
  • Inherited constructor
  • Inherited property
  • Inherited method
  • Inherited accessor
  • Protected property
  • Protected method
  • Protected accessor
  • Private property
  • Private method
  • Private accessor
  • Static property
  • Static method

Generated using TypeDoc