Skip to main content

add-card

Adds a new card to the board. If the card doesn't specify a column (via columnAccessor), it's placed in the first column. A temporary ID is assigned when neither id nor card.id is provided.

Usage​

type AddCardPayload = {
	card: Partial<KanbanCard>;
	edit?: boolean;
	id?: CardID;
	after?: CardID;
};
  • card - partial card object with the fields to set on the new card
  • edit - when true, opens the editor on the new card immediately
  • id - explicit ID for the new card (overrides card.id; defaults to a temporary ID)
  • after - ID of an existing card; the new card is inserted after it. Without after, the card is appended to the end of its column.

Trigger​

api.exec("add-card", {
	card: { label: "New task" },
	edit: true,
});

Observe​

api.on("add-card", ev => {
	console.log("Card added with id:", ev.id);
});

Intercept​

api.intercept("add-card", ev => {
	if (!ev.card.label) return false; // cancel if no label
});

Component handler​

<Kanban onaddcard={(ev) => console.log("added:", ev.id)} />