exec

Dispatches an action through the event bus. The action flows through interceptors first, then the store's default handler, then on handlers, and finally the component's on{action} prop callback.

Usage

exec<A extends keyof StoreActions>(
  action: A,
  data: StoreActions[A]
): Promise<StoreActions[A]>;

Parameter	Type	Description
action	keyof StoreActions	Action name (e.g. "add-card")
data	StoreActions[A]	Action payload matching the action

Returns a Promise that resolves with the (possibly mutated) payload after all handlers have run.

Example

import { useRef } from "react";
import { Kanban } from "@svar-ui/react-kanban";

function App() {
  const apiRef = useRef(null);

  return (
    <>
      <Kanban ref={apiRef} cards={cards} columns={columns} />

      <button onClick={() => apiRef.current.exec("add-card", {
        card: { label: "New task" },
        edit: true,
      })}>
        Add Card
      </button>
    </>
  );
}

Related

• Actions overview - all actions dispatchable through exec
• on - register a handler that fires after exec processes an action
• intercept - register a pre-handler that can cancel an action