@a-react-kit/controllers

BestDay Front-End system

Usage no npm install needed!

<script type="module">
  import aReactKitControllers from 'https://cdn.skypack.dev/@a-react-kit/controllers';
</script>

README

@a-react-kit/controllers

Hoc example

import { createStore, watcherEvent, withController, Controller } from '@a-react-kit/controllers';


class ExampleController extends Controller<ExampleData, ExampleData, ExampleEvents, any> {
  initialize = async () => {
    return { foo: 'bar' };
  };

  bootstrap = initialState => {
    const exampleEvent = (store, payload) => {
      const anotherPayload = this.getController(AnotherController);

      return {
        ...store,
        ...payload,
        ...anotherPayload
      };
    };

    this.store = createStore(initialState);
    this.events = {
      exampleEvent: watcherEvent(exampleEvent),
    };
  };
}

export default withController([ExampleController])(DumbComponent);

Hooks

import { useStoreAndEventsOf, useStoreOf, useEventsOf } = '@a-react-kit/controllers';

function DumbComponent() {
  const [store, events] = useStoreAndEventsOf(ExampleController);
  // Or
  const store = useStoreOf(ExampleController);
  const events = useEventsOf(ExampleController);
    
  return <>
    <div>{store.foo}</div>
    <button type="button" onClick={events.exampleEvent} />
  </>;
}