Kanban

shadow

The Kanban component is an element that displays a full-size Kanban table. It allows you to manage tasks and projects using a visual interface.

The Kanban board is divided into columns, with each column representing a specific process phase or task category. Tasks are displayed as tabs that can be moved between columns to set and track their current status.

Basic use

The demonstration represents kanban in its basic structure, i.e. with columns and cards without further extensions.

When to use

Use wje-kanban when you want to solve a given UI problem consistently within the WebJET design system.

When not to use

Do not use a component outside of its responsibility; in an atypical case, prefer to assemble multiple smaller components.

Accessibility

Check keyboard controls, focus states, contrast and clear naming of interactive elements.

Recommended practices

• Prefer API component over manual DOM interventions.
• Stick to design tokens and consistent naming conventions.
• Before deployment, test the component in real data scenarios.

Attributes and properties

Pre tento komponent nie sú dostupné žiadne vlastnosti.

Events

Pre tento komponent nie sú dostupné žiadne udalosti.

Methods

setupDragAndDropEvents

Popis	Inicializuje obsluhu ťahania a púšťania na presúvanie kariet medzi stĺpcami.
Signatúra	() => void

setupSelectAllCardsEvent

Popis	Inicializuje obsluhu, ktorá vyberá alebo ruší výber všetkých kariet v stĺpci.
Signatúra	() => void

setupMenuItemClickEvents

Popis	Inicializuje obsluhu kliknutí pre akcie položiek kanban menu.
Signatúra	() => void

updateSelectedCards

Popis	Aktualizuje vybrané karty podľa najnovších údajov komponentu.
Signatúra	(pool: HTMLElement, isChecked: boolean) => void

movePool

Popis	Presunie stĺpec na novú pozíciu v dátach komponentu.
Signatúra	(pool: HTMLElement, direction: string) => void

renamePool

Popis	Premenuje stĺpec a obnoví závislé referencie.
Signatúra	(pool: HTMLElement) => void

getCardPlaceholder

Popis	Vráti kartu zástupný prvok z aktuálneho stavu komponentu.
Signatúra	() => null｜*

live

Popis	Zaregistruje delegované poslucháče udalostí pre dynamický obsah komponentu.
Signatúra	(eventType: string, selector: string, callback: function) => void

setSelectedCards

Popis	Nastaví vybrané karty a aplikuje súvisiace zmeny stavu.
Signatúra	(isChecked: boolean, card: HTMLElement) => void

setSelectedItems

Popis	Nastaví vybrané položky a aplikuje súvisiace zmeny stavu.
Signatúra	() => void

getPages

Popis	Vráti stránky z aktuálneho stavu komponentu.
Signatúra	(page: any) => Promise<any>

dispatchEvent

Popis	Vyvolá vlastnú udalosť z kontextu komponentu.
Signatúra	(event: any) => void

CSS shadow parts

Názov	Popis
native-infinite-scroll	Štýluje shadow časť native-infinite-scroll.

CSS custom variables

Pre tento komponent nie sú dostupné žiadne vlastné CSS vlastnosti.

Slots

Názov	Popis
default	Predvolený slot pre hlavný obsah komponentu.