Awareness

Bring your components to life with loaded data, animations, and async actions.

Works with React, Preact & Redux.

Core is less than 1 KB gzipped.

Examples

• 💣 Minesweeper Clone

Installation

React:

yarn add react-organism
# or, if you're not using yarn
npm install -S react-organism

Preact:

yarn add preact-organism
# or, if you're not using yarn
npm install -S preact-organism

Redux:

yarn add redux-organism
# or, if you're not using yarn
npm install -S redux-organism

To Do List:

const initial = () => ({
  items: [
    { text: 'Make smoothie', done: false },
    { text: 'Dance in mirror', done: true }
  ]
})

const add = (props, text) => ({ items }) => ({
  items: items.concat({ text, done: false })
})

const removeAtIndex = (props, index) => ({ items }) => ({
  items: items.splice(index, 1)
})

const toggleAtIndex = (props, index) => ({ items }) => ({
  items: items.map((item, currentIndex) =>
    index === currentIndex ? { ...item, done: !item.done } : item
  )
})