@archbase/kanban 4.0.37

package/dist/components/Column/Column.d.ts

@@ -0,0 +1,47 @@
+import { default as React } from 'react';
+import { BoardItem, BoardProps, ConfigMap, DndState, ScrollEvent } from '../types';
+interface Props {
+    index: number;
+    data: BoardItem;
+    items: BoardItem[];
+    configMap: ConfigMap;
+    allowColumnDrag?: boolean;
+    renderColumnHeader?: (column: BoardItem) => React.ReactNode;
+    renderColumnFooter?: (column: BoardItem) => React.ReactNode;
+    renderColumnWrapper: (column: BoardItem, props: {
+        children: React.ReactNode;
+        className?: string;
+        style?: React.CSSProperties;
+        ref?: React.RefObject<HTMLDivElement>;
+    }) => React.ReactNode;
+    renderSkeletonCard?: BoardProps["renderSkeletonCard"];
+    renderListFooter?: (column: BoardItem) => React.ReactNode;
+    renderColumnAdder?: (column: BoardItem) => React.ReactNode;
+    renderGap?: (column: BoardItem) => React.ReactNode;
+    renderCardDragIndicator?: (card: BoardItem, info: any) => React.ReactNode;
+    renderCardDragPreview?: (card: BoardItem, info: any) => React.ReactNode;
+    renderColumnDragIndicator?: (column: BoardItem, info: {
+        width: number;
+        height: number;
+        edge: "left" | "right";
+    }) => React.ReactNode;
+    renderColumnDragPreview?: (column: BoardItem, info: any) => React.ReactNode;
+    columnWrapperStyle?: (column: BoardItem) => React.CSSProperties;
+    columnWrapperClassName?: (column: BoardItem) => string;
+    columnHeaderStyle?: (column: BoardItem) => React.CSSProperties;
+    columnHeaderClassName?: (column: BoardItem) => string;
+    columnStyle?: (column: BoardItem) => React.CSSProperties;
+    columnClassName?: (column: BoardItem) => string;
+    columnListContentStyle?: (column: BoardItem) => React.CSSProperties;
+    columnListContentClassName?: (column: BoardItem) => string;
+    cardWrapperStyle?: (card: BoardItem, column: BoardItem) => React.CSSProperties;
+    cardWrapperClassName?: string;
+    onColumnClick?: (e: React.MouseEvent<HTMLDivElement>, column: BoardItem) => void;
+    onCardClick?: (e: React.MouseEvent<HTMLDivElement>, card: BoardItem) => void;
+    onCardDndStateChange?: (info: DndState) => void;
+    onColumnDndStateChange?: (info: DndState) => void;
+    onScroll?: (e: ScrollEvent, column: BoardItem) => void;
+    loadMore?: (columnId: string) => void;
+}
+declare const Column: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export default Column;

package/dist/components/Column/index.d.ts

@@ -0,0 +1 @@
+export { default as Column } from './Column';

package/dist/components/ColumnAdder/ColumnAdder.d.ts

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+interface Props {
+    renderColumnAdder: () => React.ReactNode;
+}
+declare const ColumnAdder: ({ renderColumnAdder }: Props) => import("react/jsx-runtime").JSX.Element;
+export default ColumnAdder;

package/dist/components/ColumnAdder/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ColumnAdder';

package/dist/components/ColumnContent/ColumnContent.d.ts

@@ -0,0 +1,24 @@
+import { default as React } from 'react';
+import { BoardItem, BoardProps, ConfigMap, DndState, ScrollEvent } from '../types';
+interface Props {
+    items: BoardItem[];
+    column: BoardItem;
+    columnListContentStyle?: (column: BoardItem) => React.CSSProperties;
+    columnListContentClassName?: string;
+    configMap: ConfigMap;
+    renderSkeletonCard?: BoardProps["renderSkeletonCard"];
+    cardWrapperStyle?: (card: BoardItem, column: BoardItem) => React.CSSProperties;
+    cardWrapperClassName?: string;
+    onScroll?: (e: ScrollEvent, column: BoardItem) => void;
+    onCardClick?: (e: React.MouseEvent<HTMLDivElement>, card: BoardItem) => void;
+    loadMore?: (columnId: string) => void;
+    cardOverShadowCount?: number;
+    cardOverHeight?: number;
+    onCardDndStateChange?: (info: DndState) => void;
+    renderCardDragIndicator?: (card: BoardItem, info: any) => React.ReactNode;
+    renderCardDragPreview?: (card: BoardItem, info: any) => React.ReactNode;
+    renderListFooter?: (column: BoardItem) => React.ReactNode;
+    renderGap?: (column: BoardItem) => React.ReactNode;
+}
+declare const ColumnContent: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+export default ColumnContent;

package/dist/components/ColumnContent/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ColumnContent';

package/dist/components/ColumnHeader/ColumnHeader.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { BoardItem } from '../types';
+interface Props {
+    renderColumnHeader?: (column: BoardItem) => React.ReactNode;
+    columnHeaderStyle?: (column: BoardItem) => React.CSSProperties;
+    columnHeaderClassName?: string;
+    data: BoardItem;
+}
+declare const ColumnHeader: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLDivElement>>;
+export default ColumnHeader;

package/dist/components/ColumnHeader/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ColumnHeader';

package/dist/components/DefaultCard/DefaultCard.d.ts

@@ -0,0 +1,3 @@
+import { CardRenderProps } from '../types';
+declare const DefaultCard: (props: CardRenderProps) => import("react/jsx-runtime").JSX.Element;
+export default DefaultCard;

package/dist/components/DefaultCard/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DefaultCard';

package/dist/components/GenericItem/GenericItem.d.ts

@@ -0,0 +1,26 @@
+import { default as React } from 'react';
+import { BoardItem, BoardProps, ConfigMap, DndState } from '../types';
+interface Props {
+    index: number;
+    options: {
+        data: BoardItem;
+        column: BoardItem;
+        configMap: ConfigMap;
+        isSkeleton: boolean;
+        isShadow: boolean;
+        isListFooter: boolean;
+        renderListFooter?: (column: BoardItem) => React.ReactNode;
+        cardWrapperStyle?: (card: BoardItem, column: BoardItem) => React.CSSProperties;
+        cardWrapperClassName?: string;
+        cardsGap?: number;
+        renderSkeletonCard?: BoardProps["renderSkeletonCard"];
+        onCardDndStateChange?: (info: DndState) => void;
+        onCardClick?: (e: React.MouseEvent<HTMLDivElement>, card: BoardItem) => void;
+        cardOverHeight?: number;
+        renderCardDragIndicator?: (card: BoardItem, info: any) => React.ReactNode;
+        renderCardDragPreview?: (card: BoardItem, info: any) => React.ReactNode;
+        renderGap?: (column: BoardItem) => React.ReactNode;
+    };
+}
+declare const GenericItem: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export default GenericItem;

package/dist/components/GenericItem/index.d.ts

@@ -0,0 +1 @@
+export { default } from './GenericItem';

package/dist/components/Kanban.d.ts

@@ -0,0 +1,3 @@
+import { BoardProps } from './types';
+declare const Kanban: import('react').ForwardRefExoticComponent<BoardProps & import('react').RefAttributes<HTMLDivElement>>;
+export default Kanban;

package/dist/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export { default as Kanban } from './Kanban';

package/dist/components/types.d.ts

@@ -0,0 +1,124 @@
+import { TaskCardState } from '../global/dnd/useCardDnd';
+import { TColumnState } from '../global/dnd/useColumnDnd';
+import { CSSProperties, ReactNode } from 'react';
+export interface DndState {
+    state: TaskCardState | TColumnState;
+    column?: BoardItem;
+    card?: BoardItem;
+}
+export interface ScrollEvent {
+    target: {
+        scrollTop: number;
+        scrollHeight: number;
+        clientHeight: number;
+    };
+}
+export type CardRenderProps = {
+    data: BoardItem;
+    column: BoardItem;
+    index: number;
+    isDraggable: boolean;
+};
+export type ConfigMap = {
+    [type: string]: {
+        render: (props: CardRenderProps) => React.ReactNode;
+        isDraggable?: boolean;
+    };
+};
+export interface BoardItem {
+    id: string;
+    title: string;
+    parentId: string | null;
+    children: string[];
+    content?: any;
+    type?: keyof ConfigMap;
+    totalItems?: number;
+    totalChildrenCount: number;
+    totalItemsCount?: number;
+    isDraggable?: boolean;
+}
+export interface BoardData {
+    root: BoardItem;
+    [key: string]: BoardItem;
+}
+export interface DropColumnParams {
+    columnId: string;
+    fromIndex: number;
+    toIndex: number;
+}
+export interface DropCardParams {
+    cardId: string;
+    fromColumnId: string;
+    toColumnId: string;
+    taskAbove: string | null;
+    taskBelow: string | null;
+    position: number;
+}
+export interface BoardProps {
+    dataSource: BoardData;
+    configMap: ConfigMap;
+    viewOnly?: boolean;
+    loadMore?: (groupsId: string) => void;
+    renderSkeletonCard?: ({ index, column, }: {
+        index: number;
+        column: BoardItem;
+    }) => ReactNode;
+    renderColumnHeader?: (column: BoardItem) => ReactNode;
+    renderCardDragIndicator?: (card: BoardItem, info: any) => ReactNode;
+    renderCardDragPreview?: (card: BoardItem, info: any) => ReactNode;
+    renderColumnDragIndicator?: (column: BoardItem, info: {
+        width: number;
+        height: number;
+        edge: "left" | "right";
+    }) => ReactNode;
+    renderColumnDragPreview?: (column: BoardItem, info: any) => ReactNode;
+    renderListFooter?: (column: BoardItem) => ReactNode;
+    allowListFooter?: (column: BoardItem) => boolean;
+    renderColumnAdder?: () => ReactNode;
+    allowColumnAdder?: boolean;
+    allowColumnDrag?: boolean;
+    renderColumnWrapper?: (column: BoardItem, { children, className, style, }: {
+        children: ReactNode;
+        className?: string;
+        style?: CSSProperties;
+    }) => ReactNode;
+    columnWrapperStyle?: (column: BoardItem) => CSSProperties;
+    columnHeaderStyle?: (column: BoardItem) => CSSProperties;
+    columnListContentStyle?: (column: BoardItem) => CSSProperties;
+    columnListContentClassName?: (column: BoardItem) => string;
+    columnWrapperClassName?: (column: BoardItem) => string;
+    columnHeaderClassName?: (column: BoardItem) => string;
+    columnClassName?: (column: BoardItem) => string;
+    columnStyle?: (column: BoardItem) => CSSProperties;
+    rootStyle?: CSSProperties;
+    rootClassName?: string;
+    cardWrapperStyle?: (card: BoardItem, column: BoardItem) => CSSProperties;
+    cardWrapperClassName?: string;
+    virtualization?: boolean;
+    cardsGap?: number;
+    onScroll?: (e: ScrollEvent, column: BoardItem) => void;
+    onColumnMove?: ({ columnId, fromIndex, toIndex }: DropColumnParams) => void;
+    onCardMove?: ({ cardId, fromColumnId, toColumnId, taskAbove, taskBelow, position, }: DropCardParams) => void;
+    renderColumnFooter?: (column: BoardItem) => ReactNode;
+    onColumnClick?: (e: React.MouseEvent<HTMLDivElement>, column: BoardItem) => void;
+    onCardClick?: (e: React.MouseEvent<HTMLDivElement>, card: BoardItem) => void;
+    onCardDndStateChange?: (info: DndState) => void;
+    onColumnDndStateChange?: (info: DndState) => void;
+}
+export interface DropParams {
+    source: {
+        id: string;
+        data: any;
+    };
+    location: {
+        current: {
+            dropTargets: Array<{
+                data: any;
+            }>;
+        };
+    };
+    columns: BoardItem[];
+    dataSource: BoardData;
+    onCardMove?: BoardProps["onCardMove"];
+    onColumnMove?: BoardProps["onColumnMove"];
+}

package/dist/context/KanbanContext.d.ts

@@ -0,0 +1,5 @@
+import { BoardProps } from '../components';
+export declare const useKanbanContext: () => Partial<BoardProps>;
+export declare const KanbanProvider: ({ children, ...props }: Partial<BoardProps> & {
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/global/dnd/dropManager.d.ts

@@ -0,0 +1,16 @@
+import { BoardData, BoardItem, DropColumnParams, DropParams } from '../../components';
+export declare const handleCardDrop: ({ source, location, columns, dataSource, onCardMove, onColumnMove, }: DropParams) => void;
+export declare const dropColumnHandler: (drop: DropColumnParams, dataSource: BoardData) => {
+    [x: string]: BoardItem;
+    root: BoardItem;
+};
+export declare const dropHandler: (drop: {
+    cardId: string;
+    fromColumnId: string;
+    toColumnId: string;
+    taskAbove: string | null;
+    taskBelow: string | null;
+}, dataSource: BoardData, updateDroppedItem?: (targetColumn: BoardItem, droppedItem: any) => any, updateDestinationColumn?: (targetColumn: BoardItem) => any, updateSourceColumn?: (sourceColumn: BoardItem) => any) => {
+    [x: string]: BoardItem;
+    root: BoardItem;
+};

package/dist/global/dnd/useCardDnd.d.ts

@@ -0,0 +1,22 @@
+import { BoardItem, DndState } from '../../components/types';
+import { Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
+export type TaskCardState = {
+    type: "idle";
+} | {
+    type: "is-dragging";
+} | {
+    type: "is-dragging-and-left-self";
+} | {
+    type: "is-over";
+    dragging: DOMRect;
+    closestEdge: Edge;
+} | {
+    type: "preview";
+    container: HTMLElement;
+    dragging: DOMRect;
+};
+export declare const useCardDnd: (data: BoardItem, column: BoardItem, index: number, isDraggable: boolean, onCardDndStateChange?: (info: DndState) => void) => {
+    outerRef: import('react').RefObject<HTMLDivElement>;
+    innerRef: import('react').RefObject<HTMLDivElement>;
+    state: TaskCardState;
+};

package/dist/global/dnd/useColumnDnd.d.ts

@@ -0,0 +1,29 @@
+import { BoardItem, DndState } from '../../components/types';
+import { Edge } from '@atlaskit/pragmatic-drag-and-drop-hitbox/closest-edge';
+export type TColumnState = {
+    type: "idle";
+} | {
+    type: "is-dragging";
+} | {
+    type: "is-dragging-and-left-self";
+} | {
+    type: "is-card-over";
+    isOverChildCard: boolean;
+    dragging: DOMRect;
+} | {
+    type: "is-column-over";
+    closestEdge: Edge;
+    rect: DOMRect;
+} | {
+    type: "preview";
+    container: HTMLElement;
+    dragging: DOMRect;
+};
+export declare const useColumnDnd: (data: BoardItem, index: number, items: BoardItem[], onColumnDndStateChange?: (info: DndState) => void, allowColumnDrag?: boolean, hasCustomPreview?: boolean) => {
+    headerRef: import('react').RefObject<HTMLDivElement>;
+    outerFullHeightRef: import('react').RefObject<HTMLDivElement>;
+    innerRef: import('react').RefObject<HTMLDivElement>;
+    state: TColumnState;
+    cardOverShadowCount: number;
+    totalTasksCount: number;
+};

package/dist/index.css

@@ -0,0 +1 @@
+.rkk-board{display:flex;overflow:auto;height:100%;gap:8px}.rkk-column-outer{min-width:264px;max-width:264px;height:100%;display:flex;flex-direction:column;transition:all .1s ease;-webkit-transition:all .1s ease;-moz-transition:all .1s ease;-ms-transition:all .1s ease;-o-transition:all .1s ease}.rkk-column-outer .rkk-column{display:flex;flex-direction:column;gap:10px;padding:10px;border-radius:10px;background-color:#f0f0f0;position:relative;overflow:hidden}.rkk-column-outer .rkk-column-wrapper{display:flex;flex-direction:column;flex:1;gap:16px;max-height:100%}.rkk-column-shadow-container{position:relative;flex-shrink:0}.rkk-column-shadow{border-radius:10px;background-color:#ffffffb7;border:1px solid var(--Schemes-Outline-Variant, #e8ecf5)}.rkk-column-header{display:flex;justify-content:space-between;align-items:center;border-radius:10px;height:24px;margin-bottom:10px;background-color:#f0f0f0}.rkk-column-header-left{font-size:18px;font-weight:600;color:#000}.rkk-column-header-right{font-size:15px;background-color:#37352f14;color:#37352f;padding:5px 10px;border-radius:5px;font-weight:500}.rkk-column-content{flex:1;position:relative;height:0;min-height:0}.rkk-column-content-list{height:100%;overflow-y:auto;overflow-x:hidden;contain:none!important;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.3) transparent;transition:scrollbar-color .3s ease}.rkk-column-content-list:hover{scrollbar-color:rgba(0,0,0,.3) transparent}@keyframes skeleton-shimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}@keyframes skeleton-wave{0%{transform:translate(-100%)}50%{transform:translate(100%)}to{transform:translate(100%)}}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.4}}.rkk-skeleton{border-radius:8px;border:1px solid #e8ecf5;background:#fff;padding:16px;margin-bottom:8px;box-shadow:0 1px 3px #0000001a;transition:box-shadow .2s ease;position:relative;overflow:hidden}.rkk-skeleton:hover{box-shadow:0 2px 8px #00000026}.rkk-skeleton-content{display:flex;flex-direction:column;gap:12px}.rkk-skeleton .rkk-skeleton-date,.rkk-skeleton .rkk-skeleton-assignee,.rkk-skeleton .rkk-skeleton-avatar,.rkk-skeleton .rkk-skeleton-tag,.rkk-skeleton .rkk-skeleton-priority,.rkk-skeleton .rkk-skeleton-line,.rkk-skeleton .rkk-skeleton-title{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200px 100%;animation:skeleton-shimmer 1.5s infinite ease-in-out;border-radius:4px;position:relative}.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-title,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-title,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-line,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-line,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-tag,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-tag,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-avatar,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-avatar,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-assignee,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-assignee,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-date,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-date,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-priority,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-priority{background:#f0f0f0;position:relative;overflow:hidden;border-radius:4px}.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-title:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-title:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-line:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-line:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-tag:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-tag:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-avatar:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-avatar:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-assignee:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-assignee:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-date:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-date:after,.rkk-skeleton .rkk-skeleton-wave .rkk-skeleton-priority:after,.rkk-skeleton-wave .rkk-skeleton .rkk-skeleton-priority:after{position:absolute;inset:0;transform:translate(-100%);background:linear-gradient(90deg,#fff0 0,#fff3 20%,#ffffff80 60%,#fff0);animation:skeleton-wave 2s infinite;content:""}.rkk-skeleton-title{height:20px;width:80%;border-radius:6px}.rkk-skeleton-description{display:flex;flex-direction:column;gap:8px}.rkk-skeleton-line{height:14px;width:100%}.rkk-skeleton-line-short{width:65%}.rkk-skeleton-priority{height:4px;width:40px;border-radius:2px;margin-bottom:4px}.rkk-skeleton-tags{display:flex;gap:8px;flex-wrap:wrap}.rkk-skeleton-tag{height:20px;width:60px;border-radius:12px}.rkk-skeleton-tag:nth-child(2){width:45px}.rkk-skeleton-tag:nth-child(3){width:55px}.rkk-skeleton-footer{display:flex;justify-content:space-between;align-items:center;margin-top:4px}.rkk-skeleton-footer-left{display:flex;align-items:center;gap:8px}.rkk-skeleton-avatar{width:24px;height:24px;border-radius:50%;flex-shrink:0}.rkk-skeleton-assignee{height:12px;width:60px;border-radius:3px}.rkk-skeleton-date{height:12px;width:80px;border-radius:3px}.rkk-skeleton-wave .rkk-skeleton-title,.rkk-skeleton-wave .rkk-skeleton-line,.rkk-skeleton-wave .rkk-skeleton-tag,.rkk-skeleton-wave .rkk-skeleton-avatar,.rkk-skeleton-wave .rkk-skeleton-assignee,.rkk-skeleton-wave .rkk-skeleton-date,.rkk-skeleton-wave .rkk-skeleton-priority{animation:none}.rkk-skeleton-pulse .rkk-skeleton-title,.rkk-skeleton-pulse .rkk-skeleton-line,.rkk-skeleton-pulse .rkk-skeleton-tag,.rkk-skeleton-pulse .rkk-skeleton-avatar,.rkk-skeleton-pulse .rkk-skeleton-assignee,.rkk-skeleton-pulse .rkk-skeleton-date,.rkk-skeleton-pulse .rkk-skeleton-priority{background:#f0f0f0;animation:skeleton-pulse 1.5s ease-in-out infinite}@media (max-width: 768px){.rkk-skeleton{padding:12px}.rkk-skeleton-content{gap:10px}.rkk-skeleton-title{height:18px}.rkk-skeleton-line{height:12px}.rkk-skeleton-tag{height:18px;width:50px}.rkk-skeleton-tag:nth-child(2){width:40px}.rkk-skeleton-avatar{width:20px;height:20px}}.rkk-card-shadow-container{position:relative}.rkk-card-shadow{border-radius:8px;background-color:#ffffffb7;border:1px solid var(--Schemes-Outline-Variant, #e8ecf5)}.rkk-default-card{background-color:#fff;padding:10px;border-radius:8px;border:1px solid #ccc;box-shadow:0 0 10px #0000001a;cursor:pointer;-webkit-border-radius:8px;-moz-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+import { dropHandler, dropColumnHandler } from './global/dnd/dropManager';
+export type { BoardProps, BoardItem, BoardData } from './components/types';
+export { default as Kanban } from './components/Kanban';
+export { dropHandler, dropColumnHandler };