react-custom-kanban-board/dist/index.d.ts

A customizable Kanban board component for React with advanced features like search, filtering, and WIP limits.

import React, { DragEvent, ReactNode } from "react";
import "./KanbanBoard.css";
export interface Card {
    id: string;
    title: string;
    status: string;
    avatarPath?: string;
    priority?: "Low" | "Medium" | "High";
    dueDate?: string;
    tags?: string[];
    description?: string;
    assignee?: string;
    [key: string]: any;
}
export interface Column {
    title: string;
    key: string;
    color: string;
    limit?: number;
}
export interface FilterOption {
    value: string;
    label: string;
}
export interface FilterConfig {
    field: string;
    label: string;
    options: FilterOption[];
}
interface KanbanBoardProps {
    columns: Column[];
    initialCards: Card[];
    columnForAddCard: string;
    onCardMove?: (cardId: string, newStatus: string) => void;
    onCardEdit?: (cardId: string, newTitle: string) => void;
    onCardDelete?: (cardId: string) => void;
    onTaskAddedCallback?: (title: string) => void;
    renderCard?: (card: Card, handleDragStart: (e: DragEvent<HTMLDivElement>, card: Card) => void, isExpanded?: boolean, toggleExpand?: (id: string) => void) => ReactNode;
    renderAvatar?: (avatarPath?: string) => ReactNode;
    renderAddCard?: (column: string, setCards: React.Dispatch<React.SetStateAction<Card[]>>) => ReactNode;
    isLoading?: boolean;
    loadingComponent?: ReactNode;
    emptyColumnMessage?: string;
    enableSearch?: boolean;
    enableFiltering?: boolean;
    filterConfigs?: FilterConfig[];
    onFilterChange?: (filters: Record<string, string | null>) => void;
    renderSearchInput?: (searchTerm: string, setSearchTerm: React.Dispatch<React.SetStateAction<string>>) => ReactNode;
    renderFilterMenu?: (config: FilterConfig, value: string | null, handleFilterChange: (field: string, value: string | null) => void) => ReactNode;
}
declare const KanbanBoard: ({ columns, columnForAddCard, initialCards, onCardMove, onCardEdit, onCardDelete, onTaskAddedCallback, renderCard, renderAvatar, renderAddCard, isLoading, loadingComponent, emptyColumnMessage, enableSearch, enableFiltering, filterConfigs, onFilterChange, renderSearchInput, renderFilterMenu, }: KanbanBoardProps) => import("react/jsx-runtime").JSX.Element;
export default KanbanBoard;