DocsAPI referenceHeadlesskanban

kanban headless API

The core connector and vanilla mount are always visible. Use the framework choice to inspect native composition, props, outputs, context and hooks for the selected adapter.

@grassroot/ui-headless-core/kanban

Core connector and vanilla API

33 exports
View source packages/ui-headless/core/src/kanban/index.ts

connectKanban

function
DeclarationView source
connectKanbants
declare function connectKanban(service: KanbanService, scope: PartScope, options?: KanbanConnectOptions): KanbanApi;
Name
Kind
Type
Requirement
service
parameter
KanbanService
required
scope
parameter
PartScope
required
options
parameter
KanbanConnectOptions
optional
return
return value
KanbanApi
n/a
Name
service
Kind
parameter
Type
KanbanService
Requirement
required
Name
scope
Kind
parameter
Type
PartScope
Requirement
required
Name
options
Kind
parameter
Type
KanbanConnectOptions
Requirement
optional
Name
return
Kind
return value
Type
KanbanApi
Requirement
n/a

Duplicate of frozen `createKanbanDragState`.

DeclarationView source
createKanbanDragStatets
declare function createKanbanDragState(): KanbanDragState;
Name
Kind
Type
Requirement
return
return value
KanbanDragState
n/a
Name
return
Kind
return value
Type
KanbanDragState
Requirement
n/a
DeclarationView source
EMPTY_KANBAN_PLACEMENTSts
export declare const EMPTY_KANBAN_PLACEMENTS: readonly KanbanPlacement[];
DeclarationView source
kanbanAnatomyts
export declare const kanbanAnatomy: {
readonly scope: "kanban";
readonly parts: readonly ["root", "column", "header", "card", "live"];
};
Name
Kind
Type
Requirement
parts
property
readonly ["root", "column", "header", "card", "live"]
required
scope
property
"kanban"
required
Name
parts
Kind
property
Type
readonly ["root", "column", "header", "card", "live"]
Requirement
required
Name
scope
Kind
property
Type
"kanban"
Requirement
required
DeclarationView source
KanbanAnnounceDetailts
type KanbanAnnounceDetail = {
readonly key: KanbanAnnounceKey;
readonly cardId?: string;
readonly columnId?: string;
readonly fromColumnId?: string;
readonly toColumnId?: string;
};
Name
Kind
Type
Requirement
cardId
property
string
optional
columnId
property
string
optional
fromColumnId
property
string
optional
key
property
KanbanAnnounceKey
required
toColumnId
property
string
optional
Name
cardId
Kind
property
Type
string
Requirement
optional
Name
columnId
Kind
property
Type
string
Requirement
optional
Name
fromColumnId
Kind
property
Type
string
Requirement
optional
Name
key
Kind
property
Type
KanbanAnnounceKey
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
optional
DeclarationView source
KanbanAnnounceKeyts
type KanbanAnnounceKey = "kanban.grabbed" | "kanban.column" | "kanban.dropped" | "kanban.cancelled";

KanbanApi

interface
DeclarationView source
KanbanApits
interface KanbanApi {
rootProps(): PartProps;
columnProps(columnId: string, name?: string): PartProps;
headerProps(columnId: string): PartProps;
cardProps(cardId: string): PartProps;
liveProps(): PartProps;
move(cardId: string, toColumnId: string): void;
selectAll(selectableIds?: SelectionValue): void;
clear(): void;
readonly placements: readonly KanbanPlacement[];
readonly dragStatus: KanbanDragStatus;
readonly sourceCardId: string | null;
readonly targetColumnId: string | null;
readonly selectedIds: SelectionValue;
readonly selectionMode: SelectionMode;
readonly disableDrag: boolean;
cardsInColumn(columnId: string): readonly KanbanPlacement[];
isOver(columnId: string): boolean;
isDragging(cardId: string): boolean;
}
Name
Kind
Type
Requirement
cardProps
method
(cardId: string) => PartProps
required
cardsInColumn
method
(columnId: string) => readonly KanbanPlacement[]
required
clear
method
() => void
required
columnProps
method
(columnId: string, name?: string) => PartProps
required
disableDrag
property
boolean
required
dragStatus
property
KanbanDragStatus
required
headerProps
method
(columnId: string) => PartProps
required
isDragging
method
(cardId: string) => boolean
required
isOver
method
(columnId: string) => boolean
required
liveProps
method
() => PartProps
required
move
method
(cardId: string, toColumnId: string) => void
required
placements
property
readonly KanbanPlacement[]
required
rootProps
method
() => PartProps
required
selectAll
method
(selectableIds?: SelectionValue) => void
required
Name
cardProps
Kind
method
Type
(cardId: string) => PartProps
Requirement
required
Name
cardsInColumn
Kind
method
Type
(columnId: string) => readonly KanbanPlacement[]
Requirement
required
Name
clear
Kind
method
Type
() => void
Requirement
required
Name
columnProps
Kind
method
Type
(columnId: string, name?: string) => PartProps
Requirement
required
Name
disableDrag
Kind
property
Type
boolean
Requirement
required
Name
dragStatus
Kind
property
Type
KanbanDragStatus
Requirement
required
Name
headerProps
Kind
method
Type
(columnId: string) => PartProps
Requirement
required
Name
isDragging
Kind
method
Type
(cardId: string) => boolean
Requirement
required
Name
isOver
Kind
method
Type
(columnId: string) => boolean
Requirement
required
Name
liveProps
Kind
method
Type
() => PartProps
Requirement
required
Name
move
Kind
method
Type
(cardId: string, toColumnId: string) => void
Requirement
required
Name
placements
Kind
property
Type
readonly KanbanPlacement[]
Requirement
required
Name
rootProps
Kind
method
Type
() => PartProps
Requirement
required
Name
selectAll
Kind
method
Type
(selectableIds?: SelectionValue) => void
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required
Name
selectionMode
Kind
property
Type
SelectionMode
Requirement
required
Name
sourceCardId
Kind
property
Type
string | null
Requirement
required
Name
targetColumnId
Kind
property
Type
string | null
Requirement
required

KanbanCardSpec

interface
DeclarationView source
KanbanCardSpects
interface KanbanCardSpec extends KanbanPlacement {
readonly title?: string;
}
Name
Kind
Type
Requirement
title
property
string
optional
Name
title
Kind
property
Type
string
Requirement
optional

KanbanColumnSpec

interface
DeclarationView source
KanbanColumnSpects
interface KanbanColumnSpec {
readonly id: string;
readonly name: string;
}
Name
Kind
Type
Requirement
id
property
string
required
name
property
string
required
Name
id
Kind
property
Type
string
Requirement
required
Name
name
Kind
property
Type
string
Requirement
required
DeclarationView source
KanbanCommandts
type KanbanCommand = KanbanMoveCommand | KanbanAnnounceCommand | SelectionCommand;
DeclarationView source
KanbanConnectOptionsts
interface KanbanConnectOptions {
readonly onMove?: (detail: KanbanMoveDetail) => void;
readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
readonly onAnnounce?: (detail: KanbanAnnounceDetail) => void;
readonly columnNames?: Readonly<Record<string, string>>;
readonly selectableIds?: SelectionValue;
}
Name
Kind
Type
Requirement
columnNames
property
Readonly<Record<string, string>>
optional
onAnnounce
property
(detail: KanbanAnnounceDetail) => void
optional
onMove
property
(detail: KanbanMoveDetail) => void
optional
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
selectableIds
property
SelectionValue
optional
Name
columnNames
Kind
property
Type
Readonly<Record<string, string>>
Requirement
optional
Name
onAnnounce
Kind
property
Type
(detail: KanbanAnnounceDetail) => void
Requirement
optional
Name
onMove
Kind
property
Type
(detail: KanbanMoveDetail) => void
Requirement
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
selectableIds
Kind
property
Type
SelectionValue
Requirement
optional
DeclarationView source
KanbanContextts
type KanbanContext = {
readonly mode: BindingMode;
readonly placements: readonly KanbanPlacement[];
readonly dragStatus: KanbanDragStatus;
readonly sourceCardId: string | null;
readonly sourceColumnId: string | null;
readonly targetColumnId: string | null;
readonly selection: SelectionMachineState;
};
Name
Kind
Type
Requirement
dragStatus
property
KanbanDragStatus
required
mode
property
BindingMode
required
placements
property
readonly KanbanPlacement[]
required
selection
property
SelectionMachineState
required
sourceCardId
property
string | null
required
sourceColumnId
property
string | null
required
targetColumnId
property
string | null
required
Name
dragStatus
Kind
property
Type
KanbanDragStatus
Requirement
required
Name
mode
Kind
property
Type
BindingMode
Requirement
required
Name
placements
Kind
property
Type
readonly KanbanPlacement[]
Requirement
required
Name
selection
Kind
property
Type
SelectionMachineState
Requirement
required
Name
sourceCardId
Kind
property
Type
string | null
Requirement
required
Name
sourceColumnId
Kind
property
Type
string | null
Requirement
required
Name
targetColumnId
Kind
property
Type
string | null
Requirement
required
DeclarationView source
KanbanDragStatusts
type KanbanDragStatus = "idle" | "grabbed" | "dragging";
DeclarationView source
KanbanEventts
type KanbanEvent = {
readonly type: "POINTER_DRAG_START";
readonly cardId: string;
} | {
readonly type: "POINTER_DRAG_OVER";
readonly columnId: string;
} | {
readonly type: "POINTER_DRAG_LEAVE";
readonly columnId: string;
} | {
readonly type: "POINTER_DROP";
readonly columnId: string;
readonly reason: KanbanMoveReason;
} | {
readonly type: "POINTER_DRAG_END";
} | {
readonly type: "KEYBOARD_GRAB";
readonly cardId: string;
} | {
readonly type: "KEYBOARD_MOVE";
readonly toColumnId: string;
} | {
readonly type: "KEYBOARD_DROP";
readonly reason: "keyboard";
} | {
readonly type: "KEYBOARD_CANCEL";
} | {
readonly type: "MOVE";
readonly cardId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
} | SelectionEvent;
DeclarationView source
KanbanInputts
type KanbanInput = {
readonly cards?: readonly KanbanPlacement[];
readonly defaultCards?: readonly KanbanPlacement[];
readonly columnIds?: readonly string[];
readonly disableDrag?: boolean;
readonly selectionMode?: SelectionMode;
readonly selectedIds?: SelectionValue;
readonly defaultSelectedIds?: SelectionValue;
readonly orderedIds?: readonly string[];
readonly disabledIds?: readonly string[];
};
Name
Kind
Type
Requirement
cards
property
readonly KanbanPlacement[]
optional
columnIds
property
readonly string[]
optional
defaultCards
property
readonly KanbanPlacement[]
optional
defaultSelectedIds
property
SelectionValue
optional
disabledIds
property
readonly string[]
optional
disableDrag
property
boolean
optional
orderedIds
property
readonly string[]
optional
selectedIds
property
SelectionValue
optional
selectionMode
property
SelectionMode
optional
Name
cards
Kind
property
Type
readonly KanbanPlacement[]
Requirement
optional
Name
columnIds
Kind
property
Type
readonly string[]
Requirement
optional
Name
defaultCards
Kind
property
Type
readonly KanbanPlacement[]
Requirement
optional
Name
defaultSelectedIds
Kind
property
Type
SelectionValue
Requirement
optional
Name
disabledIds
Kind
property
Type
readonly string[]
Requirement
optional
Name
disableDrag
Kind
property
Type
boolean
Requirement
optional
Name
orderedIds
Kind
property
Type
readonly string[]
Requirement
optional
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
optional
Name
selectionMode
Kind
property
Type
SelectionMode
Requirement
optional
DeclarationView source
kanbanMachinets
export declare const kanbanMachine: KanbanMachine;

KanbanMount

interface
DeclarationView source
KanbanMountts
interface KanbanMount {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly root: HTMLElement;
destroy(): void;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
destroy
method
() => void
required
root
property
HTMLElement
required
service
property
KanbanService
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
destroy
Kind
method
Type
() => void
Requirement
required
Name
root
Kind
property
Type
HTMLElement
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required
DeclarationView source
KanbanMoveReasonts
type KanbanMoveReason = "pointer" | "keyboard" | "programmatic";

KanbanPart

type
DeclarationView source
KanbanPartts
type KanbanPart = (typeof kanbanAnatomy.parts)[number];
DeclarationView source
KanbanPlacementts
type KanbanPlacement = {
readonly cardId: string;
readonly columnId: string;
};
Name
Kind
Type
Requirement
cardId
property
string
required
columnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
columnId
Kind
property
Type
string
Requirement
required
DeclarationView source
kanbanSelectorsts
export declare const kanbanSelectors: {
mode: (snapshot: KanbanSnapshot) => BindingMode;
placements: (snapshot: KanbanSnapshot) => readonly KanbanPlacement[];
dragStatus: (snapshot: KanbanSnapshot) => KanbanDragStatus;
sourceCardId: (snapshot: KanbanSnapshot) => string | null;
sourceColumnId: (snapshot: KanbanSnapshot) => string | null;
targetColumnId: (snapshot: KanbanSnapshot) => string | null;
draggingId: (snapshot: KanbanSnapshot) => string | null;
overColumn: (snapshot: KanbanSnapshot) => string | null;
selectedIds: (snapshot: KanbanSnapshot) => SelectionValue;
selection: (snapshot: KanbanSnapshot) => SelectionMachineState;
cardsInColumn: (snapshot: KanbanSnapshot, columnId: string) => readonly KanbanPlacement[];
};
Name
Kind
Type
Requirement
cardsInColumn
property
(snapshot: KanbanSnapshot, columnId: string) => readonly KanbanPlacement[]
required
draggingId
property
(snapshot: KanbanSnapshot) => string | null
required
dragStatus
property
(snapshot: KanbanSnapshot) => KanbanDragStatus
required
mode
property
(snapshot: KanbanSnapshot) => BindingMode
required
overColumn
property
(snapshot: KanbanSnapshot) => string | null
required
placements
property
(snapshot: KanbanSnapshot) => readonly KanbanPlacement[]
required
selectedIds
property
(snapshot: KanbanSnapshot) => SelectionValue
required
selection
property
(snapshot: KanbanSnapshot) => SelectionMachineState
required
sourceCardId
property
(snapshot: KanbanSnapshot) => string | null
required
sourceColumnId
property
(snapshot: KanbanSnapshot) => string | null
required
targetColumnId
property
(snapshot: KanbanSnapshot) => string | null
required
Name
cardsInColumn
Kind
property
Type
(snapshot: KanbanSnapshot, columnId: string) => readonly KanbanPlacement[]
Requirement
required
Name
draggingId
Kind
property
Type
(snapshot: KanbanSnapshot) => string | null
Requirement
required
Name
dragStatus
Kind
property
Type
(snapshot: KanbanSnapshot) => KanbanDragStatus
Requirement
required
Name
mode
Kind
property
Type
(snapshot: KanbanSnapshot) => BindingMode
Requirement
required
Name
overColumn
Kind
property
Type
(snapshot: KanbanSnapshot) => string | null
Requirement
required
Name
placements
Kind
property
Type
(snapshot: KanbanSnapshot) => readonly KanbanPlacement[]
Requirement
required
Name
selectedIds
Kind
property
Type
(snapshot: KanbanSnapshot) => SelectionValue
Requirement
required
Name
selection
Kind
property
Type
(snapshot: KanbanSnapshot) => SelectionMachineState
Requirement
required
Name
sourceCardId
Kind
property
Type
(snapshot: KanbanSnapshot) => string | null
Requirement
required
Name
sourceColumnId
Kind
property
Type
(snapshot: KanbanSnapshot) => string | null
Requirement
required
Name
targetColumnId
Kind
property
Type
(snapshot: KanbanSnapshot) => string | null
Requirement
required
DeclarationView source
KanbanServicets
type KanbanService = Service<KanbanInput, KanbanStateValue, KanbanContext, KanbanEvent, KanbanCommand>;
DeclarationView source
KanbanSnapshotts
type KanbanSnapshot = Snapshot<KanbanStateValue, KanbanContext>;
DeclarationView source
KanbanStateValuets
type KanbanStateValue = "active";

mountKanban

function
DeclarationView source
mountKanbants
declare function mountKanban(container: HTMLElement, options: MountKanbanOptions): KanbanMount;
Name
Kind
Type
Requirement
container
parameter
HTMLElement
required
options
parameter
MountKanbanOptions
required
return
return value
KanbanMount
n/a
Name
container
Kind
parameter
Type
HTMLElement
Requirement
required
Name
options
Kind
parameter
Type
MountKanbanOptions
Requirement
required
Name
return
Kind
return value
Type
KanbanMount
Requirement
n/a

MountKanbanOptions

interface
DeclarationView source
MountKanbanOptionsts
interface MountKanbanOptions extends Omit<KanbanInput, "columnIds" | "cards" | "defaultCards"> {
readonly columns: readonly KanbanColumnSpec[];
readonly cards?: readonly KanbanCardSpec[];
readonly defaultCards?: readonly KanbanCardSpec[];
readonly onMove?: (detail: KanbanMoveDetail) => void;
readonly onAnnounce?: (detail: KanbanAnnounceDetail) => void;
readonly renderCard?: (card: HTMLElement, spec: KanbanCardSpec, placement: KanbanPlacement) => void;
}
Name
Kind
Type
Requirement
cards
property
readonly KanbanCardSpec[]
optional
columns
property
readonly KanbanColumnSpec[]
required
defaultCards
property
readonly KanbanCardSpec[]
optional
onAnnounce
property
(detail: KanbanAnnounceDetail) => void
optional
onMove
property
(detail: KanbanMoveDetail) => void
optional
renderCard
property
(card: HTMLElement, spec: KanbanCardSpec, placement: KanbanPlacement) => void
optional
Name
cards
Kind
property
Type
readonly KanbanCardSpec[]
Requirement
optional
Name
columns
Kind
property
Type
readonly KanbanColumnSpec[]
Requirement
required
Name
defaultCards
Kind
property
Type
readonly KanbanCardSpec[]
Requirement
optional
Name
onAnnounce
Kind
property
Type
(detail: KanbanAnnounceDetail) => void
Requirement
optional
Name
onMove
Kind
property
Type
(detail: KanbanMoveDetail) => void
Requirement
optional
Name
renderCard
Kind
property
Type
(card: HTMLElement, spec: KanbanCardSpec, placement: KanbanPlacement) => void
Requirement
optional

Duplicate of frozen `moveCard` over placements (cardId, not full card objects).

DeclarationView source
moveKanbanPlacementts
declare function moveKanbanPlacement(placements: readonly KanbanPlacement[], cardId: string, toColumnId: string): readonly KanbanPlacement[];
Name
Kind
Type
Requirement
placements
parameter
readonly KanbanPlacement[]
required
cardId
parameter
string
required
toColumnId
parameter
string
required
return
return value
readonly KanbanPlacement[]
n/a
Name
placements
Kind
parameter
Type
readonly KanbanPlacement[]
Requirement
required
Name
cardId
Kind
parameter
Type
string
Requirement
required
Name
toColumnId
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
readonly KanbanPlacement[]
Requirement
n/a

Duplicate of frozen `cardsByColumn`.

DeclarationView source
placementsByColumnts
declare function placementsByColumn(placements: readonly KanbanPlacement[], columnId: string): readonly KanbanPlacement[];
Name
Kind
Type
Requirement
placements
parameter
readonly KanbanPlacement[]
required
columnId
parameter
string
required
return
return value
readonly KanbanPlacement[]
n/a
Name
placements
Kind
parameter
Type
readonly KanbanPlacement[]
Requirement
required
Name
columnId
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
readonly KanbanPlacement[]
Requirement
n/a
DeclarationView source
projectKanbanPlacementsts
declare function projectKanbanPlacements(cards: readonly {
readonly id: string;
readonly columnId: string;
}[]): readonly KanbanPlacement[];
Name
Kind
Type
Requirement
cards
parameter
readonly { readonly id: string; readonly columnId: string; }[]
required
return
return value
readonly KanbanPlacement[]
n/a
Name
cards
Kind
parameter
Type
readonly { readonly id: string; readonly columnId: string; }[]
Requirement
required
Name
return
Kind
return value
Type
readonly KanbanPlacement[]
Requirement
n/a

reduceKanbanDrag

function

Duplicate of frozen `reduceKanbanDrag`.

DeclarationView source
reduceKanbanDragts
declare function reduceKanbanDrag(state: KanbanDragState, action: KanbanDragAction): KanbanDragState;
Name
Kind
Type
Requirement
state
parameter
KanbanDragState
required
action
parameter
KanbanDragAction
required
return
return value
KanbanDragState
n/a
Name
state
Kind
parameter
Type
KanbanDragState
Requirement
required
Name
action
Kind
parameter
Type
KanbanDragAction
Requirement
required
Name
return
Kind
return value
Type
KanbanDragState
Requirement
n/a

runKanbanCommand

function
DeclarationView source
runKanbanCommandts
declare function runKanbanCommand(command: KanbanCommand, scope: PartScope, options?: KanbanConnectOptions): void;
Name
Kind
Type
Requirement
command
parameter
KanbanCommand
required
scope
parameter
PartScope
required
options
parameter
KanbanConnectOptions
optional
return
return value
void
n/a
Name
command
Kind
parameter
Type
KanbanCommand
Requirement
required
Name
scope
Kind
parameter
Type
PartScope
Requirement
required
Name
options
Kind
parameter
Type
KanbanConnectOptions
Requirement
optional
Name
return
Kind
return value
Type
void
Requirement
n/a
DeclarationView source
selectionInputFromKanbants
declare function selectionInputFromKanban(input: KanbanInput): SelectionInput;
Name
Kind
Type
Requirement
input
parameter
KanbanInput
required
return
return value
SelectionInput
n/a
Name
input
Kind
parameter
Type
KanbanInput
Requirement
required
Name
return
Kind
return value
Type
SelectionInput
Requirement
n/a

Framework adapters

Each panel keeps its adapter's public vocabulary. React compound exports, Vue composables, standalone Angular declarations, Svelte components, and Solid hooks stay native to their framework.

React example follows below.

React imports

@grassroot/ui-headless-react/kanbants
import { Card, Column, Header, Kanban, Live, Root } from "@grassroot/ui-headless-react/kanban";

Vue imports

@grassroot/ui-headless-vue/kanbants
<script setup lang="ts">
import { KanbanCard, KanbanColumn, KanbanHeader, KanbanLive, KanbanRoot } from "@grassroot/ui-headless-vue/kanban";
</script>

Angular imports

@grassroot/ui-headless-angular/kanbants
import { Component } from "@angular/core";
import { GR_KANBAN_DECLARATIONS } from "@grassroot/ui-headless-angular/kanban";
@Component({ standalone: true, imports: [GR_KANBAN_DECLARATIONS], template: `<!-- compose the kanban parts here -->` })
export class Example {}

Svelte imports

@grassroot/ui-headless-svelte/kanbants
<script lang="ts">
import { KanbanCard, KanbanColumn, KanbanHeader, KanbanLive, KanbanRoot } from "@grassroot/ui-headless-svelte/kanban";
</script>

Solid imports

@grassroot/ui-headless-solid/kanbants
import { KanbanCard, KanbanColumn, KanbanHeader, KanbanLive, KanbanRoot } from "@grassroot/ui-headless-solid/kanban";

@grassroot/ui-headless-react/kanban

React adapter

19 exports
View source packages/ui-headless/react/src/kanban/index.ts

Card

value
DeclarationView source
Cardts
export declare const Card: import("react").ForwardRefExoticComponent<KanbanCardProps & import("react").RefAttributes<HTMLDivElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Column

value
DeclarationView source
Columnts
export declare const Column: import("react").ForwardRefExoticComponent<KanbanColumnProps & import("react").RefAttributes<HTMLDivElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Header

value
DeclarationView source
Headerts
export declare const Header: import("react").ForwardRefExoticComponent<KanbanHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Kanban

value
DeclarationView source
Kanbants
export declare const Kanban: {
Root: import("react").ForwardRefExoticComponent<KanbanRootProps & import("react").RefAttributes<HTMLDivElement>>;
Column: import("react").ForwardRefExoticComponent<KanbanColumnProps & import("react").RefAttributes<HTMLDivElement>>;
Header: import("react").ForwardRefExoticComponent<KanbanHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
Card: import("react").ForwardRefExoticComponent<KanbanCardProps & import("react").RefAttributes<HTMLDivElement>>;
Live: import("react").ForwardRefExoticComponent<KanbanLiveProps & import("react").RefAttributes<HTMLDivElement>>;
};
Name
Kind
Type
Requirement
Card
property
import("react").ForwardRefExoticComponent<KanbanCardProps & import("react").RefAttributes<HTMLDivElement>>
required
Column
property
import("react").ForwardRefExoticComponent<KanbanColumnProps & import("react").RefAttributes<HTMLDivElement>>
required
Header
property
import("react").ForwardRefExoticComponent<KanbanHeaderProps & import("react").RefAttributes<HTMLDivElement>>
required
Live
property
import("react").ForwardRefExoticComponent<KanbanLiveProps & import("react").RefAttributes<HTMLDivElement>>
required
Root
property
import("react").ForwardRefExoticComponent<KanbanRootProps & import("react").RefAttributes<HTMLDivElement>>
required
Name
Card
Kind
property
Type
import("react").ForwardRefExoticComponent<KanbanCardProps & import("react").RefAttributes<HTMLDivElement>>
Requirement
required
Name
Column
Kind
property
Type
import("react").ForwardRefExoticComponent<KanbanColumnProps & import("react").RefAttributes<HTMLDivElement>>
Requirement
required
Name
Header
Kind
property
Type
import("react").ForwardRefExoticComponent<KanbanHeaderProps & import("react").RefAttributes<HTMLDivElement>>
Requirement
required
Name
Live
Kind
property
Type
import("react").ForwardRefExoticComponent<KanbanLiveProps & import("react").RefAttributes<HTMLDivElement>>
Requirement
required
Name
Root
Kind
property
Type
import("react").ForwardRefExoticComponent<KanbanRootProps & import("react").RefAttributes<HTMLDivElement>>
Requirement
required

KanbanCardProps

interface
DeclarationView source
KanbanCardPropsts
interface KanbanCardProps extends ComponentPropsWithoutRef<"div"> {
readonly asChild?: boolean;
readonly cardId: string;
readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
cardId
property
string
required
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
cardId
Kind
property
Type
string
Requirement
required
Name
children
Kind
property
Type
ReactNode
Requirement
optional

KanbanColumnProps

interface
DeclarationView source
KanbanColumnPropsts
interface KanbanColumnProps extends ComponentPropsWithoutRef<"div"> {
readonly asChild?: boolean;
readonly columnId: string;
readonly name?: string;
readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
columnId
property
string
required
name
property
string
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnId
Kind
property
Type
string
Requirement
required
Name
name
Kind
property
Type
string
Requirement
optional
DeclarationView source
KanbanContextts
export declare const KanbanContext: import("react").Context<KanbanContextValue | null>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

KanbanContextValue

interface
DeclarationView source
KanbanContextValuets
interface KanbanContextValue {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required

KanbanHeaderProps

interface
DeclarationView source
KanbanHeaderPropsts
interface KanbanHeaderProps extends ComponentPropsWithoutRef<"div"> {
readonly asChild?: boolean;
readonly columnId: string;
readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
columnId
property
string
required
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnId
Kind
property
Type
string
Requirement
required

KanbanLiveProps

interface
DeclarationView source
KanbanLivePropsts
interface KanbanLiveProps extends ComponentPropsWithoutRef<"div"> {
readonly asChild?: boolean;
readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
children
property
ReactNode
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required

KanbanRootProps

interface
DeclarationView source
KanbanRootPropsts
interface KanbanRootProps extends Omit<ComponentPropsWithoutRef<"div">, "onChange"> {
readonly asChild?: boolean;
readonly cards?: KanbanInput["cards"];
readonly defaultCards?: KanbanInput["defaultCards"];
readonly columnIds?: KanbanInput["columnIds"];
readonly disableDrag?: KanbanInput["disableDrag"];
readonly selectionMode?: KanbanInput["selectionMode"];
readonly selectedIds?: KanbanInput["selectedIds"];
readonly defaultSelectedIds?: KanbanInput["defaultSelectedIds"];
readonly orderedIds?: KanbanInput["orderedIds"];
readonly disabledIds?: KanbanInput["disabledIds"];
readonly onMove?: (detail: KanbanMoveDetail) => void;
readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
readonly children?: ReactNode;
}
Name
Kind
Type
Requirement
asChild
property
boolean
optional
cards
property
KanbanInput["cards"]
optional
children
property
ReactNode
optional
columnIds
property
KanbanInput["columnIds"]
optional
defaultCards
property
KanbanInput["defaultCards"]
optional
defaultSelectedIds
property
KanbanInput["defaultSelectedIds"]
optional
disabledIds
property
KanbanInput["disabledIds"]
optional
disableDrag
property
KanbanInput["disableDrag"]
optional
onMove
property
(detail: KanbanMoveDetail) => void
optional
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
orderedIds
property
KanbanInput["orderedIds"]
optional
selectedIds
property
KanbanInput["selectedIds"]
optional
selectionMode
property
KanbanInput["selectionMode"]
optional
Name
asChild
Kind
property
Type
boolean
Requirement
optional
Name
cards
Kind
property
Type
KanbanInput["cards"]
Requirement
optional
Name
children
Kind
property
Type
ReactNode
Requirement
optional
Name
columnIds
Kind
property
Type
KanbanInput["columnIds"]
Requirement
optional
Name
defaultCards
Kind
property
Type
KanbanInput["defaultCards"]
Requirement
optional
Name
defaultSelectedIds
Kind
property
Type
KanbanInput["defaultSelectedIds"]
Requirement
optional
Name
disabledIds
Kind
property
Type
KanbanInput["disabledIds"]
Requirement
optional
Name
disableDrag
Kind
property
Type
KanbanInput["disableDrag"]
Requirement
optional
Name
onMove
Kind
property
Type
(detail: KanbanMoveDetail) => void
Requirement
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
orderedIds
Kind
property
Type
KanbanInput["orderedIds"]
Requirement
optional
Name
selectedIds
Kind
property
Type
KanbanInput["selectedIds"]
Requirement
optional
Name
selectionMode
Kind
property
Type
KanbanInput["selectionMode"]
Requirement
optional

Live

value
DeclarationView source
Livets
export declare const Live: import("react").ForwardRefExoticComponent<KanbanLiveProps & import("react").RefAttributes<HTMLDivElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a

Root

value
DeclarationView source
Rootts
export declare const Root: import("react").ForwardRefExoticComponent<KanbanRootProps & import("react").RefAttributes<HTMLDivElement>>;
Name
Kind
Type
Requirement
props
parameter
P
required
return
return value
ReactNode
n/a
Name
props
Kind
parameter
Type
P
Requirement
required
Name
return
Kind
return value
Type
ReactNode
Requirement
n/a
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
readonly selectedIds: SelectionValue;
readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

useKanban

function
DeclarationView source
useKanbants
declare function useKanban(input: KanbanInput, options?: UseKanbanOptions): UseKanbanResult;
Name
Kind
Type
Requirement
input
parameter
KanbanInput
required
options
parameter
UseKanbanOptions
optional
return
return value
UseKanbanResult
n/a
Name
input
Kind
parameter
Type
KanbanInput
Requirement
required
Name
options
Kind
parameter
Type
UseKanbanOptions
Requirement
optional
Name
return
Kind
return value
Type
UseKanbanResult
Requirement
n/a

useKanbanContext

function
DeclarationView source
useKanbanContextts
declare function useKanbanContext(partName: string): KanbanContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
KanbanContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
KanbanContextValue
Requirement
n/a

UseKanbanOptions

interface
DeclarationView source
UseKanbanOptionsts
interface UseKanbanOptions extends KanbanConnectOptions {}

UseKanbanResult

interface
DeclarationView source
UseKanbanResultts
interface UseKanbanResult {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly snapshot: KanbanSnapshot;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
snapshot
property
KanbanSnapshot
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
snapshot
Kind
property
Type
KanbanSnapshot
Requirement
required

@grassroot/ui-headless-vue/kanban

Vue adapter

13 exports
View source packages/ui-headless/vue/src/kanban/index.ts

KanbanCard

value
DeclarationView source
KanbanCardts
export declare const KanbanCard: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
cardId: {
type: StringConstructor;
required: true;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
cardId: {
type: StringConstructor;
required: true;
};
}>> & Readonly<{}>, {
asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

KanbanColumn

value
DeclarationView source
KanbanColumnts
export declare const KanbanColumn: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
columnId: {
type: StringConstructor;
required: true;
};
name: {
type: StringConstructor;
default: undefined;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
columnId: {
type: StringConstructor;
required: true;
};
name: {
type: StringConstructor;
default: undefined;
};
}>> & Readonly<{}>, {
asChild: boolean;
name: string;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
DeclarationView source
KanbanContextKeyts
export declare const KanbanContextKey: InjectionKey<KanbanContextValue>;

KanbanContextValue

interface
DeclarationView source
KanbanContextValuets
interface KanbanContextValue {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly snapshot: ShallowRef<KanbanSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
snapshot
property
ShallowRef<KanbanSnapshot>
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
snapshot
Kind
property
Type
ShallowRef<KanbanSnapshot>
Requirement
required

KanbanHeader

value
DeclarationView source
KanbanHeaderts
export declare const KanbanHeader: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
columnId: {
type: StringConstructor;
required: true;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
columnId: {
type: StringConstructor;
required: true;
};
}>> & Readonly<{}>, {
asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

KanbanLive

value
DeclarationView source
KanbanLivets
export declare const KanbanLive: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{}>, {
asChild: boolean;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required

KanbanRoot

value
DeclarationView source
KanbanRootts
export declare const KanbanRoot: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
cards: {
type: PropType<KanbanInput["cards"]>;
default: undefined;
};
defaultCards: {
type: PropType<KanbanInput["defaultCards"]>;
default: undefined;
};
columnIds: {
type: PropType<KanbanInput["columnIds"]>;
default: undefined;
};
disableDrag: {
type: PropType<boolean | undefined>;
default: undefined;
};
selectionMode: {
type: PropType<KanbanInput["selectionMode"]>;
default: undefined;
};
selectedIds: {
type: PropType<KanbanInput["selectedIds"]>;
default: undefined;
};
defaultSelectedIds: {
type: PropType<KanbanInput["defaultSelectedIds"]>;
default: undefined;
};
orderedIds: {
type: PropType<KanbanInput["orderedIds"]>;
default: undefined;
};
disabledIds: {
type: PropType<KanbanInput["disabledIds"]>;
default: undefined;
};
}>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
[key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
move: (_detail: KanbanMoveDetail) => true;
selectedIdsChange: (_detail: SelectionChangeDetail) => true;
}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
asChild: {
type: BooleanConstructor;
default: boolean;
};
cards: {
type: PropType<KanbanInput["cards"]>;
default: undefined;
};
defaultCards: {
type: PropType<KanbanInput["defaultCards"]>;
default: undefined;
};
columnIds: {
type: PropType<KanbanInput["columnIds"]>;
default: undefined;
};
disableDrag: {
type: PropType<boolean | undefined>;
default: undefined;
};
selectionMode: {
type: PropType<KanbanInput["selectionMode"]>;
default: undefined;
};
selectedIds: {
type: PropType<KanbanInput["selectedIds"]>;
default: undefined;
};
defaultSelectedIds: {
type: PropType<KanbanInput["defaultSelectedIds"]>;
default: undefined;
};
orderedIds: {
type: PropType<KanbanInput["orderedIds"]>;
default: undefined;
};
disabledIds: {
type: PropType<KanbanInput["disabledIds"]>;
default: undefined;
};
}>> & Readonly<{
onMove?: ((_detail: KanbanMoveDetail) => any) | undefined;
onSelectedIdsChange?: ((_detail: SelectionChangeDetail) => any) | undefined;
}>, {
asChild: boolean;
cards: readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined;
defaultCards: readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined;
columnIds: readonly string[] | undefined;
disableDrag: boolean | undefined;
selectionMode: import("@grassroot/ui-machines/selection").SelectionMode | undefined;
selectedIds: import("@grassroot/ui-machines/selection").SelectionValue | undefined;
defaultSelectedIds: import("@grassroot/ui-machines/selection").SelectionValue | undefined;
orderedIds: readonly string[] | undefined;
disabledIds: readonly string[] | undefined;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
readonly selectedIds: SelectionValue;
readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

useKanban

function
DeclarationView source
useKanbants
declare function useKanban(input: KanbanInput | (() => KanbanInput), options?: UseKanbanOptions): UseKanbanResult;
Name
Kind
Type
Requirement
input
parameter
KanbanInput | (() => KanbanInput)
required
options
parameter
UseKanbanOptions
optional
return
return value
UseKanbanResult
n/a
Name
input
Kind
parameter
Type
KanbanInput | (() => KanbanInput)
Requirement
required
Name
options
Kind
parameter
Type
UseKanbanOptions
Requirement
optional
Name
return
Kind
return value
Type
UseKanbanResult
Requirement
n/a

useKanbanContext

function
DeclarationView source
useKanbanContextts
declare function useKanbanContext(partName: string): KanbanContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
KanbanContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
KanbanContextValue
Requirement
n/a

UseKanbanOptions

interface
DeclarationView source
UseKanbanOptionsts
interface UseKanbanOptions extends KanbanConnectOptions {}

UseKanbanResult

interface
DeclarationView source
UseKanbanResultts
interface UseKanbanResult {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly snapshot: ShallowRef<KanbanSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
snapshot
property
ShallowRef<KanbanSnapshot>
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
snapshot
Kind
property
Type
ShallowRef<KanbanSnapshot>
Requirement
required

@grassroot/ui-headless-angular/kanban

Angular adapter

13 exports
View source packages/ui-headless/angular/src/kanban/index.ts
DeclarationView source
createKanbanStorets
export declare function createKanbanStore(initialInput: KanbanInput, options?: CreateKanbanStoreOptions): KanbanStore;
Name
Kind
Type
Requirement
initialInput
parameter
KanbanInput
required
options
parameter
CreateKanbanStoreOptions
optional
return
return value
KanbanStore
n/a
Name
initialInput
Kind
parameter
Type
KanbanInput
Requirement
required
Name
options
Kind
parameter
Type
CreateKanbanStoreOptions
Requirement
optional
Name
return
Kind
return value
Type
KanbanStore
Requirement
n/a
DeclarationView source
CreateKanbanStoreOptionsts
export interface CreateKanbanStoreOptions extends KanbanConnectOptions {
readonly onCommit?: () => void;
}
Name
Kind
Type
Requirement
onCommit
property
() => void
optional
Name
onCommit
Kind
property
Type
() => void
Requirement
optional
DeclarationView source
GR_KANBAN_DECLARATIONSts
export declare const GR_KANBAN_DECLARATIONS: readonly [typeof GrKanbanRoot, typeof GrKanbanColumn, typeof GrKanbanHeader, typeof GrKanbanCard, typeof GrKanbanLive];

GrKanbanCard

class
DeclarationView source
GrKanbanCardts
export declare class GrKanbanCard implements OnDestroy {
readonly cardId: import("@angular/core").InputSignal<string>;
private readonly store;
private readonly elementRef;
private readonly listeners;
private readonly consumerProps;
private registeredKey;
constructor();
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GrKanbanCard, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<GrKanbanCard, "[grKanbanCard]", never, { "cardId": { "alias": "cardId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
cardId
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrKanbanCard, "[grKanbanCard]", never, { "cardId": { "alias": "cardId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrKanbanCard, never>
required
registeredKey
property
any
required
store
property
any
required
Name
cardId
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrKanbanCard, "[grKanbanCard]", never, { "cardId": { "alias": "cardId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrKanbanCard, never>
Requirement
required
Name
registeredKey
Kind
property
Type
any
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required
DeclarationView source
GrKanbanColumnts
export declare class GrKanbanColumn implements OnDestroy {
readonly columnId: import("@angular/core").InputSignal<string>;
readonly name: import("@angular/core").InputSignal<string | undefined>;
private readonly store;
private readonly elementRef;
private readonly listeners;
private readonly consumerProps;
private registeredKey;
constructor();
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GrKanbanColumn, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<GrKanbanColumn, "[grKanbanColumn]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
columnId
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
name
property
import("@angular/core").InputSignal<string | undefined>
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrKanbanColumn, "[grKanbanColumn]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrKanbanColumn, never>
required
registeredKey
property
any
required
store
property
any
required
Name
columnId
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
name
Kind
property
Type
import("@angular/core").InputSignal<string | undefined>
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrKanbanColumn, "[grKanbanColumn]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrKanbanColumn, never>
Requirement
required
Name
registeredKey
Kind
property
Type
any
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required
DeclarationView source
GrKanbanHeaderts
export declare class GrKanbanHeader implements OnDestroy {
readonly columnId: import("@angular/core").InputSignal<string>;
private readonly store;
private readonly elementRef;
private readonly listeners;
private readonly consumerProps;
private registeredKey;
constructor();
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GrKanbanHeader, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<GrKanbanHeader, "[grKanbanHeader]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
columnId
property
import("@angular/core").InputSignal<string>
required
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrKanbanHeader, "[grKanbanHeader]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrKanbanHeader, never>
required
registeredKey
property
any
required
store
property
any
required
Name
columnId
Kind
property
Type
import("@angular/core").InputSignal<string>
Requirement
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrKanbanHeader, "[grKanbanHeader]", never, { "columnId": { "alias": "columnId"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrKanbanHeader, never>
Requirement
required
Name
registeredKey
Kind
property
Type
any
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrKanbanLive

class
DeclarationView source
GrKanbanLivets
export declare class GrKanbanLive implements OnDestroy {
private readonly store;
private readonly elementRef;
private readonly listeners;
private readonly consumerProps;
constructor();
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GrKanbanLive, never>;
static ɵdir: i0.ɵɵDirectiveDeclaration<GrKanbanLive, "[grKanbanLive]", never, {}, {}, never, never, true, never>;
}
Name
Kind
Type
Requirement
consumerProps
property
any
required
elementRef
property
any
required
listeners
property
any
required
ngOnDestroy
method
() => void
required
ɵdir
property
i0.ɵɵDirectiveDeclaration<GrKanbanLive, "[grKanbanLive]", never, {}, {}, never, never, true, never>
required
ɵfac
property
i0.ɵɵFactoryDeclaration<GrKanbanLive, never>
required
store
property
any
required
Name
consumerProps
Kind
property
Type
any
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
ɵdir
Kind
property
Type
i0.ɵɵDirectiveDeclaration<GrKanbanLive, "[grKanbanLive]", never, {}, {}, never, never, true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrKanbanLive, never>
Requirement
required
Name
store
Kind
property
Type
any
Requirement
required

GrKanbanRoot

class
DeclarationView source
GrKanbanRootts
export declare class GrKanbanRoot implements OnDestroy {
readonly cards: import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>;
readonly defaultCards: import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>;
readonly columnIds: import("@angular/core").InputSignal<readonly string[] | undefined>;
readonly disableDrag: import("@angular/core").InputSignal<boolean | undefined>;
readonly selectionMode: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionMode | undefined>;
readonly selectedIds: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>;
readonly defaultSelectedIds: import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>;
readonly orderedIds: import("@angular/core").InputSignal<readonly string[] | undefined>;
readonly disabledIds: import("@angular/core").InputSignal<readonly string[] | undefined>;
readonly move: import("@angular/core").OutputEmitterRef<KanbanMoveDetail>;
readonly selectedIdsChange: import("@angular/core").OutputEmitterRef<SelectionChangeDetail>;
private readonly elementRef;
private readonly injector;
private readonly listeners;
private lastSynced;
readonly store: KanbanStore;
constructor();
ngOnDestroy(): void;
static ɵfac: i0.ɵɵFactoryDeclaration<GrKanbanRoot, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<GrKanbanRoot, "gr-kanban-root", never, { "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "defaultCards": { "alias": "defaultCards"; "required": false; "isSignal": true; }; "columnIds": { "alias": "columnIds"; "required": false; "isSignal": true; }; "disableDrag": { "alias": "disableDrag"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; }, { "move": "move"; "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>;
}
Name
Kind
Type
Requirement
cards
property
import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>
required
columnIds
property
import("@angular/core").InputSignal<readonly string[] | undefined>
required
defaultCards
property
import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>
required
defaultSelectedIds
property
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
required
disabledIds
property
import("@angular/core").InputSignal<readonly string[] | undefined>
required
disableDrag
property
import("@angular/core").InputSignal<boolean | undefined>
required
elementRef
property
any
required
injector
property
any
required
lastSynced
property
any
required
listeners
property
any
required
move
property
import("@angular/core").OutputEmitterRef<KanbanMoveDetail>
required
ngOnDestroy
method
() => void
required
orderedIds
property
import("@angular/core").InputSignal<readonly string[] | undefined>
required
ɵcmp
property
i0.ɵɵComponentDeclaration<GrKanbanRoot, "gr-kanban-root", never, { "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "defaultCards": { "alias": "defaultCards"; "required": false; "isSignal": true; }; "columnIds": { "alias": "columnIds"; "required": false; "isSignal": true; }; "disableDrag": { "alias": "disableDrag"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; }, { "move": "move"; "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>
required
Name
cards
Kind
property
Type
import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>
Requirement
required
Name
columnIds
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
defaultCards
Kind
property
Type
import("@angular/core").InputSignal<readonly import("@grassroot/ui-machines/kanban").KanbanPlacement[] | undefined>
Requirement
required
Name
defaultSelectedIds
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
Requirement
required
Name
disabledIds
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
disableDrag
Kind
property
Type
import("@angular/core").InputSignal<boolean | undefined>
Requirement
required
Name
elementRef
Kind
property
Type
any
Requirement
required
Name
injector
Kind
property
Type
any
Requirement
required
Name
lastSynced
Kind
property
Type
any
Requirement
required
Name
listeners
Kind
property
Type
any
Requirement
required
Name
move
Kind
property
Type
import("@angular/core").OutputEmitterRef<KanbanMoveDetail>
Requirement
required
Name
ngOnDestroy
Kind
method
Type
() => void
Requirement
required
Name
orderedIds
Kind
property
Type
import("@angular/core").InputSignal<readonly string[] | undefined>
Requirement
required
Name
ɵcmp
Kind
property
Type
i0.ɵɵComponentDeclaration<GrKanbanRoot, "gr-kanban-root", never, { "cards": { "alias": "cards"; "required": false; "isSignal": true; }; "defaultCards": { "alias": "defaultCards"; "required": false; "isSignal": true; }; "columnIds": { "alias": "columnIds"; "required": false; "isSignal": true; }; "disableDrag": { "alias": "disableDrag"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "defaultSelectedIds": { "alias": "defaultSelectedIds"; "required": false; "isSignal": true; }; "orderedIds": { "alias": "orderedIds"; "required": false; "isSignal": true; }; "disabledIds": { "alias": "disabledIds"; "required": false; "isSignal": true; }; }, { "move": "move"; "selectedIdsChange": "selectedIdsChange"; }, never, ["*"], true, never>
Requirement
required
Name
ɵfac
Kind
property
Type
i0.ɵɵFactoryDeclaration<GrKanbanRoot, never>
Requirement
required
Name
selectedIds
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionValue | undefined>
Requirement
required
Name
selectedIdsChange
Kind
property
Type
import("@angular/core").OutputEmitterRef<SelectionChangeDetail>
Requirement
required
Name
selectionMode
Kind
property
Type
import("@angular/core").InputSignal<import("@grassroot/ui-machines/selection").SelectionMode | undefined>
Requirement
required
Name
store
Kind
property
Type
KanbanStore
Requirement
required

KANBAN_STORE

value
DeclarationView source
KANBAN_STOREts
export declare const KANBAN_STORE: InjectionToken<KanbanStore>;
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required

KanbanStore

interface
DeclarationView source
KanbanStorets
export interface KanbanStore {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly version: WritableSignal<number>;
start(): void;
stop(): void;
sync(input: KanbanInput): void;
bindMove(handler: (detail: KanbanMoveDetail) => void): void;
bindSelectedIdsChange(handler: (detail: SelectionChangeDetail) => void): void;
}
Name
Kind
Type
Requirement
bindMove
method
(handler: (detail: KanbanMoveDetail) => void) => void
required
bindSelectedIdsChange
method
(handler: (detail: SelectionChangeDetail) => void) => void
required
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
start
method
() => void
required
stop
method
() => void
required
sync
method
(input: KanbanInput) => void
required
version
property
WritableSignal<number>
required
Name
bindMove
Kind
method
Type
(handler: (detail: KanbanMoveDetail) => void) => void
Requirement
required
Name
bindSelectedIdsChange
Kind
method
Type
(handler: (detail: SelectionChangeDetail) => void) => void
Requirement
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
start
Kind
method
Type
() => void
Requirement
required
Name
stop
Kind
method
Type
() => void
Requirement
required
Name
sync
Kind
method
Type
(input: KanbanInput) => void
Requirement
required
Name
version
Kind
property
Type
WritableSignal<number>
Requirement
required
DeclarationView source
provideKanbanStorets
export declare function provideKanbanStore(): Provider;
Name
Kind
Type
Requirement
return
return value
Provider
n/a
Name
return
Kind
return value
Type
Provider
Requirement
n/a
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
readonly selectedIds: SelectionValue;
readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

@grassroot/ui-headless-svelte/kanban

Svelte adapter

12 exports
View source packages/ui-headless/svelte/src/kanban/index.ts

createKanban

function
DeclarationView source
createKanbants
export declare function createKanban(inputGetter: () => KanbanInput, options?: UseKanbanOptions): UseKanbanResult;
Name
Kind
Type
Requirement
inputGetter
parameter
() => KanbanInput
required
options
parameter
UseKanbanOptions
optional
return
return value
UseKanbanResult
n/a
Name
inputGetter
Kind
parameter
Type
() => KanbanInput
Requirement
required
Name
options
Kind
parameter
Type
UseKanbanOptions
Requirement
optional
Name
return
Kind
return value
Type
UseKanbanResult
Requirement
n/a

KanbanCard

value
DeclarationView source
KanbanCardts
export declare const KanbanCard: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

KanbanColumn

value
DeclarationView source
KanbanColumnts
export declare const KanbanColumn: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

KanbanContextValue

interface
DeclarationView source
KanbanContextValuets
export interface KanbanContextValue {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly version: () => number;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
version
property
() => number
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
version
Kind
property
Type
() => number
Requirement
required

KanbanHeader

value
DeclarationView source
KanbanHeaderts
export declare const KanbanHeader: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a

KanbanLive

value
DeclarationView source
KanbanLivets
export declare const KanbanLive: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required

KanbanRoot

value
DeclarationView source
KanbanRootts
export declare const KanbanRoot: LegacyComponentType;
Name
Kind
Type
Requirement
args
parameter
Parameters<Component<Record<string, any>>>
optional
return
return value
ReturnType<Component<Record<string, any>, Record<string, any>>>
n/a
Name
args
Kind
parameter
Type
Parameters<Component<Record<string, any>>>
Requirement
optional
Name
return
Kind
return value
Type
ReturnType<Component<Record<string, any>, Record<string, any>>>
Requirement
n/a
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
readonly selectedIds: SelectionValue;
readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

useKanbanContext

function
DeclarationView source
useKanbanContextts
export declare function useKanbanContext(partName: string): KanbanContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
KanbanContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
KanbanContextValue
Requirement
n/a

UseKanbanOptions

interface
DeclarationView source
UseKanbanOptionsts
export interface UseKanbanOptions extends KanbanConnectOptions {
}

UseKanbanResult

interface
DeclarationView source
UseKanbanResultts
export interface UseKanbanResult {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly version: () => number;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
version
property
() => number
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
version
Kind
property
Type
() => number
Requirement
required

@grassroot/ui-headless-solid/kanban

Solid adapter

18 exports
View source packages/ui-headless/solid/src/kanban/index.ts

KanbanCard

function
DeclarationView source
KanbanCardts
export declare function KanbanCard(props: KanbanCardProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
KanbanCardProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
KanbanCardProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

KanbanCardProps

interface
DeclarationView source
KanbanCardPropsts
export interface KanbanCardProps extends JSX.HTMLAttributes<HTMLDivElement> {
readonly as?: AsProp;
readonly cardId: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
cardId
property
string
required
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
cardId
Kind
property
Type
string
Requirement
required

KanbanColumn

function
DeclarationView source
KanbanColumnts
export declare function KanbanColumn(props: KanbanColumnProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
KanbanColumnProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
KanbanColumnProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

KanbanColumnProps

interface
DeclarationView source
KanbanColumnPropsts
export interface KanbanColumnProps extends JSX.HTMLAttributes<HTMLDivElement> {
readonly as?: AsProp;
readonly columnId: string;
readonly name?: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
columnId
property
string
required
name
property
string
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
columnId
Kind
property
Type
string
Requirement
required
Name
name
Kind
property
Type
string
Requirement
optional
DeclarationView source
KanbanContextts
export declare const KanbanContext: import("solid-js").Context<KanbanContextValue | undefined>;

KanbanContextValue

interface
DeclarationView source
KanbanContextValuets
export interface KanbanContextValue {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly snapshot: Accessor<KanbanSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
snapshot
property
Accessor<KanbanSnapshot>
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
snapshot
Kind
property
Type
Accessor<KanbanSnapshot>
Requirement
required

KanbanHeader

function
DeclarationView source
KanbanHeaderts
export declare function KanbanHeader(props: KanbanHeaderProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
KanbanHeaderProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
KanbanHeaderProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

KanbanHeaderProps

interface
DeclarationView source
KanbanHeaderPropsts
export interface KanbanHeaderProps extends JSX.HTMLAttributes<HTMLDivElement> {
readonly as?: AsProp;
readonly columnId: string;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
columnId
property
string
required
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
columnId
Kind
property
Type
string
Requirement
required

KanbanLive

function
DeclarationView source
KanbanLivets
export declare function KanbanLive(props: KanbanLiveProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
KanbanLiveProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
KanbanLiveProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

KanbanLiveProps

interface
DeclarationView source
KanbanLivePropsts
export interface KanbanLiveProps extends JSX.HTMLAttributes<HTMLDivElement> {
readonly as?: AsProp;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional
DeclarationView source
KanbanMoveDetailts
type KanbanMoveDetail = {
readonly cardId: string;
readonly fromColumnId: string;
readonly toColumnId: string;
readonly reason: KanbanMoveReason;
};
Name
Kind
Type
Requirement
cardId
property
string
required
fromColumnId
property
string
required
reason
property
KanbanMoveReason
required
toColumnId
property
string
required
Name
cardId
Kind
property
Type
string
Requirement
required
Name
fromColumnId
Kind
property
Type
string
Requirement
required
Name
reason
Kind
property
Type
KanbanMoveReason
Requirement
required
Name
toColumnId
Kind
property
Type
string
Requirement
required

KanbanRoot

function
DeclarationView source
KanbanRootts
export declare function KanbanRoot(props: KanbanRootProps): JSX.Element;
Name
Kind
Type
Requirement
props
parameter
KanbanRootProps
required
return
return value
JSX.Element
n/a
Name
props
Kind
parameter
Type
KanbanRootProps
Requirement
required
Name
return
Kind
return value
Type
JSX.Element
Requirement
n/a

KanbanRootProps

interface
DeclarationView source
KanbanRootPropsts
export interface KanbanRootProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "onChange"> {
readonly as?: AsProp;
readonly cards?: KanbanInput["cards"];
readonly defaultCards?: KanbanInput["defaultCards"];
readonly columnIds?: KanbanInput["columnIds"];
readonly disableDrag?: KanbanInput["disableDrag"];
readonly selectionMode?: KanbanInput["selectionMode"];
readonly selectedIds?: KanbanInput["selectedIds"];
readonly defaultSelectedIds?: KanbanInput["defaultSelectedIds"];
readonly orderedIds?: KanbanInput["orderedIds"];
readonly disabledIds?: KanbanInput["disabledIds"];
readonly onMove?: (detail: KanbanMoveDetail) => void;
readonly onSelectedIdsChange?: (detail: SelectionChangeDetail) => void;
}
Name
Kind
Type
Requirement
as
property
AsProp
optional
cards
property
KanbanInput["cards"]
optional
columnIds
property
KanbanInput["columnIds"]
optional
defaultCards
property
KanbanInput["defaultCards"]
optional
defaultSelectedIds
property
KanbanInput["defaultSelectedIds"]
optional
disabledIds
property
KanbanInput["disabledIds"]
optional
disableDrag
property
KanbanInput["disableDrag"]
optional
onMove
property
(detail: KanbanMoveDetail) => void
optional
onSelectedIdsChange
property
(detail: SelectionChangeDetail) => void
optional
orderedIds
property
KanbanInput["orderedIds"]
optional
selectedIds
property
KanbanInput["selectedIds"]
optional
selectionMode
property
KanbanInput["selectionMode"]
optional
Name
as
Kind
property
Type
AsProp
Requirement
optional
Name
cards
Kind
property
Type
KanbanInput["cards"]
Requirement
optional
Name
columnIds
Kind
property
Type
KanbanInput["columnIds"]
Requirement
optional
Name
defaultCards
Kind
property
Type
KanbanInput["defaultCards"]
Requirement
optional
Name
defaultSelectedIds
Kind
property
Type
KanbanInput["defaultSelectedIds"]
Requirement
optional
Name
disabledIds
Kind
property
Type
KanbanInput["disabledIds"]
Requirement
optional
Name
disableDrag
Kind
property
Type
KanbanInput["disableDrag"]
Requirement
optional
Name
onMove
Kind
property
Type
(detail: KanbanMoveDetail) => void
Requirement
optional
Name
onSelectedIdsChange
Kind
property
Type
(detail: SelectionChangeDetail) => void
Requirement
optional
Name
orderedIds
Kind
property
Type
KanbanInput["orderedIds"]
Requirement
optional
Name
selectedIds
Kind
property
Type
KanbanInput["selectedIds"]
Requirement
optional
Name
selectionMode
Kind
property
Type
KanbanInput["selectionMode"]
Requirement
optional
DeclarationView source
SelectionChangeDetailts
type SelectionChangeDetail = {
readonly selectedIds: SelectionValue;
readonly reason: SelectionChangeReason;
};
Name
Kind
Type
Requirement
reason
property
SelectionChangeReason
required
selectedIds
property
SelectionValue
required
Name
reason
Kind
property
Type
SelectionChangeReason
Requirement
required
Name
selectedIds
Kind
property
Type
SelectionValue
Requirement
required

useKanban

function
DeclarationView source
useKanbants
export declare function useKanban(input: Accessor<KanbanInput>, options?: UseKanbanOptions): UseKanbanResult;
Name
Kind
Type
Requirement
input
parameter
Accessor<KanbanInput>
required
options
parameter
UseKanbanOptions
optional
return
return value
UseKanbanResult
n/a
Name
input
Kind
parameter
Type
Accessor<KanbanInput>
Requirement
required
Name
options
Kind
parameter
Type
UseKanbanOptions
Requirement
optional
Name
return
Kind
return value
Type
UseKanbanResult
Requirement
n/a

useKanbanContext

function
DeclarationView source
useKanbanContextts
export declare function useKanbanContext(partName: string): KanbanContextValue;
Name
Kind
Type
Requirement
partName
parameter
string
required
return
return value
KanbanContextValue
n/a
Name
partName
Kind
parameter
Type
string
Requirement
required
Name
return
Kind
return value
Type
KanbanContextValue
Requirement
n/a

UseKanbanOptions

interface
DeclarationView source
UseKanbanOptionsts
export interface UseKanbanOptions extends KanbanConnectOptions {
}

UseKanbanResult

interface
DeclarationView source
UseKanbanResultts
export interface UseKanbanResult {
readonly service: KanbanService;
readonly connector: KanbanApi;
readonly scope: PartScope;
readonly snapshot: Accessor<KanbanSnapshot>;
}
Name
Kind
Type
Requirement
connector
property
KanbanApi
required
scope
property
PartScope
required
service
property
KanbanService
required
snapshot
property
Accessor<KanbanSnapshot>
required
Name
connector
Kind
property
Type
KanbanApi
Requirement
required
Name
scope
Kind
property
Type
PartScope
Requirement
required
Name
service
Kind
property
Type
KanbanService
Requirement
required
Name
snapshot
Kind
property
Type
Accessor<KanbanSnapshot>
Requirement
required