Skip to main content

getEditorItems

Builds the default editor field array from a CardShape (or EditorShape). The result matches the sections visible on the card, so the editor form stays in sync with what users see on the board.

Usage​

import { getEditorItems } from "@svar-uisvelte-kanban";

getEditorItems(shape?: EditorShape | CardShape): EditorItem[];

The returned array always starts with label (text input, required). The remaining fields are appended based on the shape:

  • description - textarea
  • priority - richselect; options come from shape.priority.data or fall back to getPriorityOptions()
  • progress - slider, 0 to 1, step 0.1
  • deadline - datepicker, clearable
  • tags - multicombo; included only when shape.tags.data is provided
  • users - multicombo; included only when shape.users.data is provided

When called without arguments, the default shape is used (getCardShape()), which enables priority, progress, description, deadline, and tags.

Example​

Mirror the card shape in the editor:

<script>
  import { Kanban, Editor, getEditorItems, getCardShape } from "@svar-uisvelte-kanban";

  const card = {
    ...getCardShape(),
    users: { data: [{ id: 1, label: "Alex" }, { id: 2, label: "Sam" }] },
    menu: true,
  };

  let api;
</script>

<Kanban {cards} {columns} {card} bind:this={api} />
<Editor {api} items={getEditorItems(card)} />

Pluck a single default field and customize it:

import { getEditorItems } from "@svar-uisvelte-kanban";

const priorityItem = getEditorItems().find(it => it.key === "priority");

const items = [
	{ comp: "text", key: "label", label: "Title", required: true },
	{ ...priorityItem, column: "right", required: true },
];