@progress/kendo-react-taskboard 6.1.1 → 7.0.0-develop.10

package/{dist/npm/hooks → hooks}/taskEditing.d.ts

@@ -1,3 +1,7 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
 import * as React from 'react';
 import { DropDownListChangeEvent } from '@progress/kendo-react-dropdowns';
 import { InputChangeEvent } from '@progress/kendo-react-inputs';

package/index.d.ts

@@ -0,0 +1,18 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+export { TaskBoard, type TaskBoardProps, type TaskBoardHandle, type TaskBoardChangeEvent, type TaskBoardColumnModel, type TaskBoardTaskModel, type TaskBoardPriority } from './TaskBoard';
+export { TaskBoardToolbar, type TaskBoardToolbarProps } from './TaskBoardToolbar';
+export { TaskBoardCard, type TaskBoardCardProps } from './card/Card';
+export { TaskBoardCardHeader, type TaskBoardCardHeaderProps } from './card/CardHeader';
+export { TaskBoardCardBody, type TaskBoardCardBodyProps } from './card/CardBody';
+export { TaskBoardColumn, type TaskBoardColumnProps } from './column/Column';
+export { TaskBoardColumnHeader, type TaskBoardColumnHeaderProps } from './column/ColumnHeader';
+export { TaskBoardColumnBody, type TaskBoardColumnBodyProps } from './column/ColumnBody';
+export { TaskBoardConfirmDialog, type TaskBoardConfirmDialogProps } from './TaskBoardConfirmDialog';
+export { TaskBoardPreviewDialog, type TaskBoardPreviewDialogProps } from './card/PreviewDialog';
+export { TaskBoardAddCard, type TaskBoardAddCardProps } from './TaskBoardAddCard';
+export { TaskBoardEditCard, type TaskBoardEditCardProps } from './TaskBoardEditCard';
+export { TaskBoardTaskEditPane, type TaskBoardTaskEditPaneProps } from './TaskBoardTaskEditPane';
+export { useTaskEditing, type TaskEditingProps, type TaskEditingResult } from './hooks/taskEditing';

package/index.js

@@ -0,0 +1,5 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const at=require("react"),nt=require("prop-types"),ot=require("@progress/kendo-licensing"),x=require("@progress/kendo-react-common"),Ce=require("@progress/kendo-react-intl"),w=require("@progress/kendo-react-buttons"),be=require("@progress/kendo-react-inputs"),_=require("@progress/kendo-svg-icons"),Ze=require("@progress/kendo-react-dialogs"),ke=require("@progress/kendo-react-layout"),it=require("@progress/kendo-react-popup"),lt=require("@progress/kendo-react-dropdowns"),Ee=require("@progress/kendo-react-labels"),De=require("@progress/kendo-react-form");function tt(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const o in e)if(o!=="default"){const r=Object.getOwnPropertyDescriptor(e,o);Object.defineProperty(a,o,r.get?r:{enumerable:!0,get:()=>e[o]})}}return a.default=e,Object.freeze(a)}const t=tt(at),S=tt(nt),rt={name:"@progress/kendo-react-taskboard",productName:"KendoReact",productCodes:["KENDOUIREACT","KENDOUICOMPLETE"],publishDate:0,version:"",licensingDocsUrl:"https://www.telerik.com/kendo-react-ui/components/my-license/"},st="taskBoard.toolbarAddColumnButton",dt="taskBoard.toolbarSearchField",he="taskBoard.editColumnButton",ye="taskBoard.addCardButton",ve="taskBoard.deleteColumnButton",Se="taskBoard.editCardButton",we="taskBoard.deleteCardButton",Pe="taskBoard.deleteTaskDialogMessage",Ie="taskBoard.deleteTaskDialogTitle",Re="taskBoard.deleteTaskConfirmButton",Le="taskBoard.deleteTaskCancelButton",Ne="taskBoard.addCardTitle",Q="taskBoard.addCardTitleLabel",Z="taskBoard.addCardDescriptionLabel",ee="taskBoard.addCardPriorityLabel",xe="taskBoard.addCardCreateButton",Me="taskBoard.deleteColumnDialogMessage",Ae="taskBoard.deleteColumnDialogTitle",Ke="taskBoard.deleteColumnConfirmButton",qe="taskBoard.deleteColumnCancelButton",Oe="taskBoard.editCardPaneTitle",He="taskBoard.editCardPaneSaveButton",te="taskBoard.editPaneTitleLabel",ae="taskBoard.editPaneDescriptionLabel",ne="taskBoard.editPanePriorityLabel",oe="taskBoard.editPaneCancelButton",Fe="taskBoard.previewPanePriorityLabel",_e="taskBoard.previewPaneDeleteButton",ze="taskBoard.previewPaneEditButton",i={[st]:"Add column",[dt]:"Search",[he]:"Edit column",[ye]:"Add card",[ve]:"Delete column",[Se]:"Edit card",[we]:"Delete card",[Pe]:"Are you sure you want to delete this card?",[Ie]:"Delete Card",[Re]:"Delete",[Le]:"Cancel",[Me]:"Are you sure you want to delete this column?",[Ae]:"Delete column?",[Ke]:"Delete",[qe]:"Cancel",[Ne]:"Create new card",[xe]:"Create",[oe]:"Cancel",[Oe]:"Edit",[He]:"Save changes",[te]:"Title:",[ae]:"Description:",[ne]:"Priority:",[Q]:"Title",[Z]:"Description",[ee]:"Priority",[Fe]:"Priority:",[_e]:"Delete",[ze]:"Edit"},je="data-taskboard-type",Ve="data-taskboard-id",pe="data-taskboard-placeholder",W="column",G="task",Ye=e=>{const{edit:a,title:o}=e.column;return t.createElement("div",{className:"k-taskboard-column-header"},t.createElement("div",{className:"k-taskboard-column-header-text k-text-ellipsis"},a?t.createElement(be.Input,{value:o,onChange:e.onTitleChange,onBlur:e.onColumnExitEdit,autoFocus:!0}):o),t.createElement("span",{className:"k-spacer"}),t.createElement("div",{className:x.classNames("k-taskboard-column-header-actions",{"k-disabled":a})},t.createElement(w.Button,{fillMode:"flat",icon:"pencil",svgIcon:_.pencilIcon,title:e.editButtonTitle,onClick:e.onColumnEnterEdit}),t.createElement(w.Button,{fillMode:"flat",icon:"plus",svgIcon:_.plusIcon,title:e.addButtonTitle,onClick:e.onShowAddCardDialog}),t.createElement(w.Button,{fillMode:"flat",icon:"x",svgIcon:_.xIcon,title:e.closeButtonTitle,onClick:e.onColumnDelete})))};Ye.displayName="KendoReactTaskBoardColumnHeader";const Ue=e=>t.createElement("div",{className:"k-taskboard-column-cards-container"},t.createElement("div",{className:"k-taskboard-column-cards"},e.children));Ue.displayName="KendoReactTaskBoardColumnBody";const re=e=>{const{onClose:a,onConfirm:o,dialogMessage:r,dialogTitle:f,dialogConfirmButton:c,dialogCancelButton:d}=e;return t.createElement(Ze.Dialog,{title:f,closeIcon:!1},r,t.createElement(Ze.DialogActionsBar,{layout:"end"},t.createElement(w.Button,{themeColor:"primary",onClick:o},c),t.createElement(w.Button,{onClick:a},d)))};re.propTypes={onClose:S.func.isRequired,onConfirm:S.func.isRequired,dialogMessage:S.string.isRequired,dialogTitle:S.string.isRequired,dialogConfirmButton:S.string.isRequired,dialogCancelButton:S.string.isRequired};re.displayName="KendoReactTaskBoardConfirmDialog";const Xe=({onSave:e,task:a,priorities:o})=>{const[r,f]=t.useState(a?a.title:""),[c,d]=t.useState(a?a.description:""),[u,l]=t.useState(a?a.priority:o[0]),D=t.useCallback(g=>{f(g.value)},[]),B=t.useCallback(g=>{d(g.value)},[]),b=t.useCallback(g=>{l(g.target.value)},[]),P=t.useCallback(g=>{const C={id:void 0,status:"",...a||{},title:r,description:c,priority:u};e.call(void 0,C,a)},[e,a,r,c,u]);return{onTitleChange:D,title:r,onDescriptionChange:B,description:c,onPriorityChange:b,priority:u,onSave:P}},Be=e=>{const{onTitleChange:a,title:o,onDescriptionChange:r,description:f,onPriorityChange:c,priority:d,onSave:u}=Xe(e),l=Ce.useLocalization();return t.createElement(e.editPane,{header:l.toLanguageString(Oe,i[Oe])+e.task.title,titleInputTitle:l.toLanguageString(Q,i[Q]),descriptionInputTitle:l.toLanguageString(Z,i[Z]),priorityDropDownTitle:l.toLanguageString(ee,i[ee]),task:e.task,saveButton:l.toLanguageString(He,i[He]),cancelButton:l.toLanguageString(oe,i[oe]),priorities:e.priorities,titleLabel:l.toLanguageString(te,i[te]),descriptionLabel:l.toLanguageString(ae,i[ae]),priorityLabel:l.toLanguageString(ne,i[ne]),onSave:u,onClose:e.onClose,onTitleChange:a,title:o,onDescriptionChange:r,description:f,onPriorityChange:c,priority:d})};Be.propTypes={};Be.displayName="KendoReactTaskBoardEditCard";const fe=e=>{const{onTitleChange:a,title:o,onDescriptionChange:r,description:f,onPriorityChange:c,priority:d,onSave:u}=Xe(e),l=Ce.useLocalization();return t.createElement(e.editPane,{header:l.toLanguageString(Ne,i[Ne]),titleInputTitle:l.toLanguageString(Q,i[Q]),descriptionInputTitle:l.toLanguageString(Z,i[Z]),priorityDropDownTitle:l.toLanguageString(ee,i[ee]),titleLabel:l.toLanguageString(te,i[te]),descriptionLabel:l.toLanguageString(ae,i[ae]),priorityLabel:l.toLanguageString(ne,i[ne]),saveButton:l.toLanguageString(xe,i[xe]),cancelButton:l.toLanguageString(oe,i[oe]),priorities:e.priorities,onSave:u,onClose:e.onClose,onTitleChange:a,title:o,onDescriptionChange:r,description:f,onPriorityChange:c,priority:d})};fe.propTypes={};fe.displayName="KendoReactTaskBoardAddCard";const We=e=>{const a=t.useRef();return t.createElement(ke.CardHeader,{className:"k-hbox"},t.createElement("span",{className:"k-card-title k-link",onClick:e.onShowPreviewPane},e.title),t.createElement("span",{className:"k-spacer"}),t.createElement("div",{className:"k-card-header-actions"},t.createElement(w.Button,{fillMode:"flat",icon:"more-vertical",svgIcon:_.moreVerticalIcon,ref:a,onClick:e.showMenu?e.onHideMenu:e.onShowMenu,onBlur:e.onMenuButtonBlur}),t.createElement(it.Popup,{anchor:a.current&&a.current.element,show:e.showMenu,ref:e.popupRef},t.createElement(ke.Menu,{vertical:!0,onSelect:e.onMenuItemSelect,items:e.menuItems,className:"k-context-menu"}))))};We.displayName="KendoReactTaskBoardCardHeader";const $e=e=>t.createElement(ke.CardBody,null,e.children);$e.displayName="KendoReactTaskBoardCardBody";const Ge=e=>t.createElement("div",{className:"k-taskboard-pane k-taskboard-preview-pane"},t.createElement("div",{className:"k-taskboard-pane-header"},t.createElement("div",{className:"k-taskboard-pane-header-text"},e.title),t.createElement("span",{className:"k-spacer"}),t.createElement("div",{className:"k-taskboard-pane-header-actions"},t.createElement(w.Button,{icon:"x",svgIcon:_.xIcon,fillMode:"flat",onClick:e.onClosePreviewPane}))),t.createElement("div",{className:"k-taskboard-pane-content"},t.createElement("p",null,e.description),t.createElement("p",null,e.priorityLabel," ",t.createElement("span",{style:{backgroundColor:e.priority.color}}," ")," ",e.priority.priority)),t.createElement("div",{className:"k-taskboard-pane-actions k-actions k-hstack k-justify-content-end"},t.createElement(w.Button,{onClick:e.onTaskDelete},e.delete),t.createElement(w.Button,{themeColor:"primary",onClick:e.onTaskEdit},e.edit)));Ge.displayName="KendoReactTaskBoardPreviewDialog";const se=e=>{const{onDeleteTask:a,showEditPane:o,task:r,style:f,dragTargetRef:c,elementRef:d}=e,[u,l]=t.useState(!1),[D,B]=t.useState(!1),[b,P]=t.useState(!1),g=t.useRef(null),C=Ce.useLocalization(),I=[{text:C.toLanguageString(Se,i[Se]),icon:"pencil",svgIcon:_.pencilIcon,data:()=>{o(r),l(!u)}},{text:C.toLanguageString(we,i[we]),icon:"trash",svgIcon:_.trashIcon,data:()=>{B(!D),l(!u)}}],M=j=>{j.item.data()},L=()=>{l(!0)},y=()=>{l(!1)},A=j=>{const V=g.current&&g.current.element;V&&V.contains(j.relatedTarget)||l(!1)},z=()=>{B(!D)},K=()=>{P(!0)},U=()=>{P(!1)},q=()=>{o(r),K()};return r.isPlaceholder&&c&&c.current?t.createElement("div",{style:{width:c.current.width,height:c.current.height},className:"k-taskboard-drag-placeholder",[pe]:!0}):t.createElement(e.cardComponent,{task:r,style:f,tabIndex:e.tabIndex,disabled:e.disabled,elementRef:d,showMenu:u,showDeleteConfirm:D,showTaskPreviewPane:b,menuItems:I,popupRef:g,confirmDialogMessage:C.toLanguageString(Pe,i[Pe]),confirmDialogTitle:C.toLanguageString(Ie,i[Ie]),confirmDialogConfirmButton:C.toLanguageString(Re,i[Re]),confirmDialogCancelButton:C.toLanguageString(Le,i[Le]),previewDialogPriorityLabel:C.toLanguageString(Fe,i[Fe]),previewDialogDelete:C.toLanguageString(_e,i[_e]),previewDialogEdit:C.toLanguageString(ze,i[ze]),onShowPreviewPane:K,onClosePreviewPane:U,onMenuItemSelect:M,onShowMenu:L,onHideMenu:y,onMenuButtonBlur:A,onTaskDelete:a,onTaskEdit:q,onCloseConfirmDialog:z,card:ke.Card,cardHeader:We,cardBody:$e,confirmDialog:re,previewDialog:Ge})},ct={};se.propTypes={task:S.object.isRequired};se.defaultProps=ct;se.displayName="KendoReactTaskBoardCardBase";const ie=e=>{const[a,o]=t.useState(!1),[r,f]=t.useState(!1),[c,d]=t.useState(!1),[u,l]=t.useState(),{dragTargetRef:D,column:B,onColumnChange:b,tasks:P,elementRef:g,style:C,onTaskCreate:I,onTaskEdit:M,onTaskDelete:L}=e,y=Ce.useLocalization(),A=t.useCallback(m=>{const O={...B,title:m.value};b.call(void 0,O,B)},[B,b]),z=t.useCallback(()=>{const m={...B,edit:!0};b.call(void 0,m,B)},[B,b]),K=t.useCallback(()=>{const m={...B,edit:!1};b.call(void 0,m,B)},[B,b]),U=t.useCallback(()=>{b.call(void 0,null,B)},[B,b]),q=()=>{d(!c)},j=()=>{o(!0)},V=m=>{f(!0),l(m)},Te=()=>{o(!1),f(!1)},E=t.useCallback(m=>{o(!1),I.call(void 0,{...m,status:B.status})},[I,B]),de=t.useCallback((m,O)=>{f(!1),M.call(void 0,m,O)},[M]),$=t.useCallback(m=>{L.call(void 0,m)},[L]);if(B.isPlaceholder&&D&&D.current){const m=D.current?D.current.width:0,O=D.current?D.current.height:0;return t.createElement("div",{style:{width:m,height:O},className:"k-taskboard-column k-taskboard-drag-placeholder",[pe]:!0})}return t.createElement(e.columnComponent,{column:e.column,tasks:P,priorities:e.priorities,style:D?{overflow:"visible",...C}:C,tabIndex:e.tabIndex,elementRef:g,onTaskCreate:E,onTaskEdit:de,onTaskDelete:$,card:e.cardComponent,header:Ye,body:Ue,confirmDialog:re,editCardDialog:Be,addCardDialog:fe,onTitleChange:A,onColumnEnterEdit:z,onColumnExitEdit:K,onColumnConfirmDelete:U,onShowAddCardDialog:j,onShowEditCardPane:V,onColumnDelete:q,onCloseDialog:Te,showAddCard:a,showEditCard:r,showColumnConfirmDelete:c,editedTask:u,confirmDialogMessage:y.toLanguageString(Me,i[Me]),confirmDialogTitle:y.toLanguageString(Ae,i[Ae]),confirmDialogConfirmButton:y.toLanguageString(Ke,i[Ke]),confirmDialogCancelButton:y.toLanguageString(qe,i[qe]),editButtonTitle:y.toLanguageString(he,i[he]),addButtonTitle:y.toLanguageString(ye,i[ye]),closeButtonTitle:y.toLanguageString(ve,i[ve])},P&&P.map(m=>t.createElement(se,{key:m.id,tabIndex:e.tabIndex,task:m,disabled:!!e.column.edit,onDeleteTask:()=>$(m),showEditPane:()=>V(m),dragTargetRef:e.dragTargetRef,style:{borderLeftColor:m.priority.color},cardComponent:e.cardComponent})))},ut={};ie.propTypes={column:S.object.isRequired,taskMap:S.object};ie.defaultProps=ut;ie.displayName="KendoReactTaskBoardColumn";const mt=(e,a,o)=>{let r=-1,f=-1;for(let c=0;c<o.length;c++){const d=String(o[c].id);if(d===e&&(f=c),d===a&&(r=c),r!==-1&&f!==-1)return{dragIndex:f,dropIndex:r}}return null},et=e=>{for(;e;){if(!e.getAttribute)return null;const a=e.getAttribute(Ve);if(a)return{id:a,type:e.getAttribute(je)||"",element:e};e=e.parentNode}return null},kt=(e,a)=>{const o=a.dataItem.color,r=t.createElement(t.Fragment,null,t.createElement("span",{style:{backgroundColor:o}}," "),e.props.children);return t.cloneElement(e,e.props,r)},gt=(e,a)=>{if(!a)return e;const o=t.createElement(t.Fragment,null,t.createElement("span",{style:{backgroundColor:a.color}}," "),t.createElement("span",null,"  ",e.props.children));return t.cloneElement(e,{...e.props},o)},J=e=>t.createElement(t.Fragment,null,t.createElement(e.card,{key:String(e.task.id),ref:e.elementRef,style:e.style,className:x.classNames("k-taskboard-card k-cursor-move k-taskboard-card-category",{"k-disabled":e.disabled}),[je]:G,[Ve]:e.task.id,tabIndex:e.tabIndex},t.createElement(e.cardHeader,{showMenu:e.showMenu,menuItems:e.menuItems,popupRef:e.popupRef,title:e.task.title,task:e.task,onShowPreviewPane:e.onShowPreviewPane,onShowMenu:e.onShowMenu,onHideMenu:e.onHideMenu,onMenuButtonBlur:e.onMenuButtonBlur,onMenuItemSelect:e.onMenuItemSelect}),t.createElement(e.cardBody,{task:e.task},e.task.description)),e.showDeleteConfirm&&t.createElement(e.confirmDialog,{onConfirm:e.onTaskDelete,onClose:e.onCloseConfirmDialog,dialogMessage:e.confirmDialogMessage,dialogTitle:e.confirmDialogTitle,dialogConfirmButton:e.confirmDialogConfirmButton,dialogCancelButton:e.confirmDialogCancelButton}),e.showTaskPreviewPane&&t.createElement(e.previewDialog,{title:e.task.title,description:e.task.description,priorityLabel:e.previewDialogPriorityLabel,delete:e.previewDialogDelete,edit:e.previewDialogEdit,onClosePreviewPane:e.onClosePreviewPane,onTaskDelete:e.onTaskDelete,onTaskEdit:e.onTaskEdit,priority:e.task.priority}));J.displayName="KendoReactTaskBoardCard";const le=e=>t.createElement("div",{className:"k-taskboard-pane k-taskboard-edit-pane"},t.createElement("div",{className:"k-taskboard-pane-header"},t.createElement("div",{className:"k-taskboard-pane-header-text"},e.header),t.createElement("span",{className:"k-spacer"}),t.createElement("div",{className:"k-taskboard-pane-header-actions"},t.createElement(w.Button,{icon:"x",svgIcon:_.xIcon,fillMode:"flat",onClick:e.onClose}))),t.createElement("div",{className:"k-taskboard-pane-content"},t.createElement("div",{role:"form","data-role":"form",className:"k-form"},t.createElement(De.FieldWrapper,null,t.createElement(Ee.Label,{editorId:"title"},e.titleLabel),t.createElement(be.Input,{id:"title",onChange:e.onTitleChange,value:e.title,title:e.titleInputTitle})),t.createElement(De.FieldWrapper,null,t.createElement(Ee.Label,{editorId:"description"},e.descriptionLabel),t.createElement(be.Input,{id:"description",onChange:e.onDescriptionChange,value:e.description,title:e.descriptionInputTitle})),t.createElement(De.FieldWrapper,null,t.createElement(Ee.Label,{editorId:"priority"},e.priorityLabel),t.createElement(lt.DropDownList,{id:"priority",data:e.priorities,value:e.priority,onChange:e.onPriorityChange,itemRender:kt,valueRender:gt,textField:"priority",dataItemKey:"priority",title:e.priorityDropDownTitle})))),t.createElement("div",{className:"k-taskboard-pane-actions k-actions k-hstack k-justify-content-end"},t.createElement(w.Button,{onClick:e.onClose},e.cancelButton),t.createElement(w.Button,{themeColor:"primary",onClick:e.onSave,disabled:!e.title||!e.description},e.saveButton)));le.propTypes={};le.displayName="KendoReactTaskBoardEditPane";const ge=e=>t.createElement(t.Fragment,null,t.createElement("div",{ref:e.elementRef,style:e.style,className:x.classNames("k-taskboard-column",{"k-taskboard-column-edit":e.column.edit}),tabIndex:e.tabIndex,[je]:W,[Ve]:e.column.id},t.createElement(e.header,{column:e.column,tasks:e.tasks,onTitleChange:e.onTitleChange,onColumnExitEdit:e.onColumnExitEdit,editButtonTitle:e.editButtonTitle,onColumnEnterEdit:e.onColumnEnterEdit,addButtonTitle:e.addButtonTitle,onShowAddCardDialog:e.onShowAddCardDialog,closeButtonTitle:e.closeButtonTitle,onColumnDelete:e.onColumnDelete}),t.createElement(e.body,null,e.children)),e.showAddCard&&t.createElement(e.addCardDialog,{onClose:e.onCloseDialog,onSave:e.onTaskCreate,priorities:e.priorities,editPane:le}),e.showEditCard&&e.editedTask&&t.createElement(e.editCardDialog,{onClose:e.onCloseDialog,onSave:e.onTaskEdit,task:e.editedTask,priorities:e.priorities,editPane:le}),e.showColumnConfirmDelete&&t.createElement(e.confirmDialog,{onClose:e.onColumnDelete,onConfirm:e.onColumnConfirmDelete,dialogMessage:e.confirmDialogMessage,dialogTitle:e.confirmDialogTitle,dialogConfirmButton:e.confirmDialogConfirmButton,dialogCancelButton:e.confirmDialogCancelButton}));ge.displayName="KendoReactTaskBoardColumn";const Je=t.forwardRef((e,a)=>{ot.validatePackage(rt);const{columnData:o=[],className:r,style:f,id:c,taskData:d=[],onChange:u}=e,l=t.useRef(null),D=t.useRef(null);t.useImperativeHandle(l,()=>({props:e})),t.useImperativeHandle(a,()=>l.current);const b=t.Children.toArray(e.children).filter(n=>n&&n.type&&n.type.displayName==="KendoReactTaskBoardToolbar"),P=t.useRef(null),g=t.useRef(null),C=t.useRef(null),[I,M]=t.useState(null),[L,y]=t.useState(null),[A,z]=t.useState({top:0,left:0}),K=t.useRef(null),U=t.useRef(null),q=t.useMemo(()=>{const n={};return(I||d).forEach(k=>{const s=k.status;n[s]||(n[s]=[]),n[s].push(k)}),n},[d,I]),j=t.useCallback(n=>{const k=n.originalEvent.target;if(k.closest("button,input,.k-link,.k-taskboard-preview-pane"))return;const s=et(k),T=D.current;if(s&&T){const h=s.type===W;if(h&&!k.closest(".k-taskboard-column-header"))return;const X=s.element.getBoundingClientRect(),p=T.getBoundingClientRect();C.current={x:n.clientX-X.left+p.left,y:n.clientY-X.top+p.top};const R=h?o:d,ce=h?y:M,N=R.findIndex(ue=>String(ue.id)===s.id),F=R[N];if(N===-1||F.edit)return;const v=x.clone(F);v.isPlaceholder=!0;const Y=[...R];Y[N]=v,g.current={...s,index:N,item:F,width:X.width,height:X.height},z({top:n.clientY-C.current.y,left:n.clientX-C.current.x}),ce(Y)}},[o,d]),V=t.useCallback(n=>{const k=g.current,s=K.current&&K.current.element||U.current;if(k&&s){z({top:n.clientY-C.current.y,left:n.clientX-C.current.x}),s.style.visibility="hidden";const T=document.elementFromPoint(n.clientX,n.clientY);if(s.style.visibility="",T&&T.getAttribute(pe))return;const h=T&&et(T);if(h){let H;const X=h.type===k.type,p=k.type===W,R=(p?L:I)||[],ce=p?y:M;if(p||X){if(H=mt(k.id,h.id,R),H){const N=R[H.dragIndex],F=R[H.dropIndex],v=x.clone(N);p||(v.status=F.status);const Y=[...R];Y.splice(H.dragIndex,1),Y.splice(H.dropIndex,0,v),k.index=H.dropIndex,ce(Y)}}else{const N=R.findIndex(v=>String(v.id)===k.id),F=o.findIndex(v=>String(v.id)===h.id);if(N!==-1&&F!==-1){const v=R[N],ue=o[F].status;if(q[ue])return;v.status=ue;const me=[...R];me.splice(N,1),me.push(v),k.index=me.length-1,ce(me)}}}}},[L,I,o,q]),Te=t.useCallback(()=>{const n=g.current;if(u&&n){const s=(n.type===W?L:I)||[],T=s[n.index];delete T.isPlaceholder;const h={data:s,type:n.type,previousItem:n.item,item:T};u.call(void 0,h)}g.current=null,C.current=null,M(null),y(null),z({top:0,left:0})},[L,I,u]);x.useDraggable(P,{onDragStart:j,onDrag:V,onDragEnd:Te});const E=g.current,de=t.useCallback(n=>{const s={data:[...d,n],type:G,previousItem:null,item:n};u.call(void 0,s)},[u,d]),$=t.useCallback((n,k)=>{const s=d.slice(),T=d.indexOf(k);T!==-1&&s.splice(T,1,n);const h={data:s,type:G,previousItem:k,item:n};u.call(void 0,h)},[u,d]),m=t.useCallback(n=>{const s={data:d.filter(T=>T!==n),type:G,previousItem:n,item:null};u.call(void 0,s)},[u,d]),O=t.useCallback((n,k)=>{const s=o.slice(),T=s.indexOf(k);T!==-1&&(n?s.splice(T,1,n):s.splice(T,1));const h={data:s,type:W,previousItem:k,item:n};u.call(void 0,h)},[u,o]);return t.createElement("div",{id:c,style:f,ref:D,className:x.classNames("k-widget k-taskboard",r)},b,t.createElement("div",{className:"k-taskboard-content",style:E?{userSelect:"none"}:void 0},t.createElement("div",{className:"k-taskboard-columns-container",ref:P},(L||o).map(n=>t.createElement(ie,{key:n.id,tabIndex:e.tabIndex,column:n,tasks:q[n.status]||[],dragTargetRef:g,onTaskCreate:de,onTaskEdit:$,onTaskDelete:m,onColumnChange:O,columnComponent:e.column||ge,cardComponent:e.card||J,priorities:e.priorities})))),E&&E.type===G&&t.createElement(se,{elementRef:K,style:{position:"absolute",width:E.width,height:E.height,top:A.top,left:A.left,zIndex:10,borderLeftColor:E.item.priority?E.item.priority.color:E.item.color},task:E.item,dragTargetRef:g,cardComponent:e.card||J,onDeleteTask:x.noop,showEditPane:x.noop}),E&&E.type===W&&t.createElement(ie,{elementRef:U,style:{position:"absolute",width:E.width,height:E.height,top:A.top,left:A.left,zIndex:10},cardComponent:e.card||J,columnComponent:e.column||ge,column:E.item,tasks:q[E.item.status],priorities:e.priorities,dragTargetRef:g,onTaskDelete:m,onColumnChange:O,onTaskEdit:$,onTaskCreate:de}))});Je.propTypes={columnData:S.array.isRequired,taskData:S.array.isRequired};Je.displayName="KendoReactTaskBoard";const Qe=e=>{const{className:a,style:o,children:r}=e;return t.createElement("div",{style:o,className:x.classNames("k-taskboard-header",a)},t.createElement("div",{className:"k-taskboard-toolbar k-toolbar"},r))};Qe.propTypes={children:S.node};Qe.displayName="KendoReactTaskBoardToolbar";exports.TaskBoard=Je;exports.TaskBoardAddCard=fe;exports.TaskBoardCard=J;exports.TaskBoardCardBody=$e;exports.TaskBoardCardHeader=We;exports.TaskBoardColumn=ge;exports.TaskBoardColumnBody=Ue;exports.TaskBoardColumnHeader=Ye;exports.TaskBoardConfirmDialog=re;exports.TaskBoardEditCard=Be;exports.TaskBoardPreviewDialog=Ge;exports.TaskBoardTaskEditPane=le;exports.TaskBoardToolbar=Qe;exports.useTaskEditing=Xe;