@composy/kanban-core 0.0.1 → 0.0.2

package/dist/index.min.js

@@ -1 +1,758 @@
-(function(global,factory){typeof exports==="object"&&typeof module!=="undefined"?factory(exports):typeof define==="function"&&define.amd?define(["exports"],factory):(global=typeof globalThis!=="undefined"?globalThis:global||self,factory(global.LDesignKanban={}));})(this,function(exports){Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});function createElement(tag,className,attributes){const el=document.createElement(tag);if(className)el.className=className;if(attributes)Object.entries(attributes).forEach(([key,value])=>{el.setAttribute(key,value);});return el;}function resolveElement(target){if(typeof target==="string")return document.querySelector(target);return target;}function clearElement(el){el.innerHTML="";}function removeElement(el){el?.parentNode?.removeChild(el);}function insertAt(parent,child,index){const ref=parent.children[index];if(ref)parent.insertBefore(child,ref);else parent.appendChild(child);}var EventEmitter=class{constructor(){this.listeners=new Map();}on(event,handler){if(!this.listeners.has(event))this.listeners.set(event,new Set());this.listeners.get(event).add(handler);return()=>this.off(event,handler);}once(event,handler){const wrapper=(...args)=>{this.off(event,wrapper);handler(...args);};return this.on(event,wrapper);}off(event,handler){this.listeners.get(event)?.delete(handler);}emit(event,payload){const handlers=this.listeners.get(event);if(handlers)handlers.forEach((handler)=>{try{handler(payload);}catch(err){console.error(`[KanbanBoard]Error in event handler for "${event}":`,err);}});}removeAll(){this.listeners.clear();}listenerCount(event){return this.listeners.get(event)?.size??0;}};let counter=0;function generateId(prefix="kb"){counter++;return `${prefix}_${Date.now().toString(36)}_${Math.random().toString(36).substring(2,6)}_${counter}`;}function resetIdCounter(){counter=0;}var ColumnManager=class{constructor(events){this.columns=[];this.events=events;}init(columns){this.columns=columns.map((col,index)=>this.normalizeColumn(col,index));}normalizeColumn(partial,index){return{id:partial.id||generateId("col"),title:partial.title||`Column ${index+1}`,cards:(partial.cards||[]).map((card,cardIndex)=>this.normalizeCard(card,partial.id||"",cardIndex)),wipLimit:partial.wipLimit,collapsed:partial.collapsed??false,color:partial.color,order:partial.order??index};}normalizeCard(partial,columnId,index){return{id:partial.id||generateId("card"),title:partial.title||"",description:partial.description,labels:partial.labels||[],assignees:partial.assignees||[],dueDate:partial.dueDate,priority:partial.priority,order:partial.order??index,columnId:partial.columnId||columnId,data:partial.data,createdAt:partial.createdAt||(new Date()).toISOString(),updatedAt:partial.updatedAt};}getColumns(){return[...this.columns].sort((a,b)=>a.order-b.order);}getColumn(id){return this.columns.find((c)=>c.id===id);}addColumn(partial){const column=this.normalizeColumn(partial,this.columns.length);column.cards=column.cards.map((card)=>({...card,columnId:column.id}));this.columns.push(column);this.events.emit("column:add",{column});return column;}removeColumn(id){const index=this.columns.findIndex((c)=>c.id===id);if(index===-1)return void 0;const[column]=this.columns.splice(index,1);this.reorderColumns();this.events.emit("column:remove",{column});return column;}updateColumn(id,changes){const column=this.columns.find((c)=>c.id===id);if(!column)return void 0;Object.assign(column,changes,{id});this.events.emit("column:update",{column,changes});return column;}moveColumn(id,toIndex){const fromIndex=this.columns.findIndex((c)=>c.id===id);if(fromIndex===-1)return;const[column]=this.columns.splice(fromIndex,1);this.columns.splice(toIndex,0,column);this.reorderColumns();this.events.emit("column:move",{column,fromIndex,toIndex});}toggleCollapse(id){const column=this.columns.find((c)=>c.id===id);if(!column)return;column.collapsed=!column.collapsed;this.events.emit("column:collapse",{column,collapsed:column.collapsed});}getCards(columnId){const column=this.columns.find((c)=>c.id===columnId);return column?[...column.cards].sort((a,b)=>a.order-b.order):[];}addCard(columnId,partial){const column=this.columns.find((c)=>c.id===columnId);if(!column)return void 0;if(column.wipLimit&&column.cards.length>=column.wipLimit){this.events.emit("error",{error:new Error(`Column "${column.title}" reached WIP limit(${column.wipLimit})`)});return;}const card=this.normalizeCard({...partial,columnId},columnId,column.cards.length);column.cards.push(card);this.events.emit("card:add",{card,columnId});return card;}removeCard(cardId){for(const column of this.columns){const index=column.cards.findIndex((c)=>c.id===cardId);if(index!==-1){const[card]=column.cards.splice(index,1);this.reorderCards(column);this.events.emit("card:remove",{card,columnId:column.id});return card;}}}updateCard(cardId,changes){for(const column of this.columns){const card=column.cards.find((c)=>c.id===cardId);if(card){Object.assign(card,changes,{id:cardId,columnId:column.id});card.updatedAt=(new Date()).toISOString();this.events.emit("card:update",{card,changes});return card;}}}getCard(cardId){for(const column of this.columns){const card=column.cards.find((c)=>c.id===cardId);if(card)return card;}}moveCard(cardId,toColumnId,toIndex){let fromColumn;let cardIndex=-1;for(const column of this.columns){const idx=column.cards.findIndex((c)=>c.id===cardId);if(idx!==-1){fromColumn=column;cardIndex=idx;break;}}if(!fromColumn||cardIndex===-1)return;const toColumn=this.columns.find((c)=>c.id===toColumnId);if(!toColumn)return;if(fromColumn.id!==toColumnId&&toColumn.wipLimit&&toColumn.cards.length>=toColumn.wipLimit){this.events.emit("error",{error:new Error(`Column "${toColumn.title}" reached WIP limit(${toColumn.wipLimit})`)});return;}const[card]=fromColumn.cards.splice(cardIndex,1);card.columnId=toColumnId;toColumn.cards.splice(toIndex,0,card);this.reorderCards(fromColumn);this.reorderCards(toColumn);this.events.emit("card:move",{card,fromColumnId:fromColumn.id,toColumnId,toIndex});}getAllCards(){const cards=[];for(const column of this.columns)cards.push(...column.cards);return cards;}getCardCount(){return this.columns.reduce((sum,col)=>sum+col.cards.length,0);}reorderColumns(){this.columns.forEach((col,index)=>{col.order=index;});}reorderCards(column){column.cards.forEach((card,index)=>{card.order=index;});}setColumns(columns){this.columns=columns;}clear(){this.columns=[];}};var DragController=class{constructor(events,prefix){this.state={dragging:false,cardId:null,sourceColumnId:null,targetColumnId:null,targetIndex:0,placeholder:null};this.cleanupFns=[];this.events=events;this.prefix=prefix;}enableCardDrag(cardEl,cardId,columnId){cardEl.setAttribute("draggable","true");cardEl.dataset.cardId=cardId;cardEl.dataset.columnId=columnId;const onDragStart=(e)=>{if(!e.dataTransfer)return;e.dataTransfer.effectAllowed="move";e.dataTransfer.setData("text/plain",cardId);this.state.dragging=true;this.state.cardId=cardId;this.state.sourceColumnId=columnId;cardEl.classList.add(`${this.prefix}-card--dragging`);this.events.emit("card:drag-start",{cardId,columnId});this.createPlaceholder(cardEl);};const onDragEnd=()=>{cardEl.classList.remove(`${this.prefix}-card--dragging`);this.removePlaceholder();this.state.dragging=false;this.state.cardId=null;this.state.sourceColumnId=null;this.events.emit("card:drag-end",{cardId});};cardEl.addEventListener("dragstart",onDragStart);cardEl.addEventListener("dragend",onDragEnd);this.cleanupFns.push(()=>{cardEl.removeEventListener("dragstart",onDragStart);cardEl.removeEventListener("dragend",onDragEnd);});}enableColumnDrop(columnBodyEl,columnId){const onDragOver=(e)=>{e.preventDefault();if(!e.dataTransfer)return;e.dataTransfer.dropEffect="move";this.state.targetColumnId=columnId;const afterElement=this.getDragAfterElement(columnBodyEl,e.clientY);const placeholder=this.state.placeholder;if(placeholder)if(afterElement)columnBodyEl.insertBefore(placeholder,afterElement);else{const addBtn=columnBodyEl.querySelector(`.${this.prefix}-add-card`);if(addBtn)columnBodyEl.insertBefore(placeholder,addBtn);else columnBodyEl.appendChild(placeholder);}};const onDragEnter=(e)=>{e.preventDefault();columnBodyEl.classList.add(`${this.prefix}-column-body--drag-over`);};const onDragLeave=(e)=>{const rect=columnBodyEl.getBoundingClientRect();if(e.clientX<rect.left||e.clientX>rect.right||e.clientY<rect.top||e.clientY>rect.bottom)columnBodyEl.classList.remove(`${this.prefix}-column-body--drag-over`);};const onDrop=(e)=>{e.preventDefault();columnBodyEl.classList.remove(`${this.prefix}-column-body--drag-over`);const cardId=this.state.cardId;if(!cardId)return;const placeholder=this.state.placeholder;let dropIndex=0;if(placeholder&&placeholder.parentNode===columnBodyEl){const children=[...columnBodyEl.children];for(const child of children){if(child===placeholder)break;if(child.hasAttribute("data-card-id")&&!child.classList.contains(`${this.prefix}-card--dragging`))dropIndex++;}}else dropIndex=columnBodyEl.querySelectorAll(`[data-card-id]:not(.${this.prefix}-card--dragging)`).length;this.events.emit("card:drop",{cardId,fromColumnId:this.state.sourceColumnId,toColumnId:columnId,toIndex:dropIndex});this.removePlaceholder();};columnBodyEl.addEventListener("dragover",onDragOver);columnBodyEl.addEventListener("dragenter",onDragEnter);columnBodyEl.addEventListener("dragleave",onDragLeave);columnBodyEl.addEventListener("drop",onDrop);this.cleanupFns.push(()=>{columnBodyEl.removeEventListener("dragover",onDragOver);columnBodyEl.removeEventListener("dragenter",onDragEnter);columnBodyEl.removeEventListener("dragleave",onDragLeave);columnBodyEl.removeEventListener("drop",onDrop);});}enableColumnDrag(columnEl,handleEl,columnId,boardEl){handleEl.setAttribute("draggable","true");const onDragStart=(e)=>{if(!e.dataTransfer)return;e.dataTransfer.effectAllowed="move";e.dataTransfer.setData("application/kanban-column",columnId);columnEl.classList.add(`${this.prefix}-column--dragging`);};const onDragEnd=()=>{columnEl.classList.remove(`${this.prefix}-column--dragging`);boardEl.querySelectorAll(`.${this.prefix}-column--drag-over`).forEach((el)=>{el.classList.remove(`${this.prefix}-column--drag-over`);});};const onDragOver=(e)=>{if(!e.dataTransfer?.types.includes("application/kanban-column"))return;e.preventDefault();e.dataTransfer.dropEffect="move";columnEl.classList.add(`${this.prefix}-column--drag-over`);};const onDragLeave=()=>{columnEl.classList.remove(`${this.prefix}-column--drag-over`);};const onDrop=(e)=>{e.preventDefault();columnEl.classList.remove(`${this.prefix}-column--drag-over`);const fromColumnId=e.dataTransfer?.getData("application/kanban-column");if(!fromColumnId||fromColumnId===columnId)return;const toIndex=[...boardEl.querySelectorAll(`[data-column-id]`)].indexOf(columnEl);this.events.emit("column:drop",{fromColumnId,toColumnId:columnId,toIndex});};handleEl.addEventListener("dragstart",onDragStart);handleEl.addEventListener("dragend",onDragEnd);columnEl.addEventListener("dragover",onDragOver);columnEl.addEventListener("dragleave",onDragLeave);columnEl.addEventListener("drop",onDrop);this.cleanupFns.push(()=>{handleEl.removeEventListener("dragstart",onDragStart);handleEl.removeEventListener("dragend",onDragEnd);columnEl.removeEventListener("dragover",onDragOver);columnEl.removeEventListener("dragleave",onDragLeave);columnEl.removeEventListener("drop",onDrop);});}getDragAfterElement(container,y){const draggableElements=[...container.querySelectorAll(`[data-card-id]:not(.${this.prefix}-card--dragging):not(.${this.prefix}-placeholder)`)];let closestOffset=Number.NEGATIVE_INFINITY;let closestElement=null;draggableElements.forEach((child)=>{const box=child.getBoundingClientRect();const offset=y-box.top-box.height/2;if(offset<0&&offset>closestOffset){closestOffset=offset;closestElement=child;}});return closestElement;}createPlaceholder(cardEl){this.removePlaceholder();const placeholder=document.createElement("div");placeholder.className=`${this.prefix}-placeholder`;placeholder.style.height=`${cardEl.offsetHeight}px`;this.state.placeholder=placeholder;}removePlaceholder(){if(this.state.placeholder){this.state.placeholder.parentNode?.removeChild(this.state.placeholder);this.state.placeholder=null;}}getState(){return{...this.state};}destroy(){this.cleanupFns.forEach((fn)=>fn());this.cleanupFns=[];this.removePlaceholder();}};var FilterEngine=class{constructor(events){this.currentCriteria=null;this.hiddenCardIds=new Set();this.events=events;}filter(criteria,columns){this.currentCriteria=criteria;this.hiddenCardIds.clear();const allCards=columns.flatMap((col)=>col.cards);for(const card of allCards)if(!this.matchCriteria(card,criteria))this.hiddenCardIds.add(card.id);this.events.emit("filter:change",{criteria});return new Set(this.hiddenCardIds);}search(keyword,columns){this.events.emit("search:change",{keyword});if(!keyword.trim()){this.clearFilter();return columns.flatMap((col)=>col.cards);}const lowerKeyword=keyword.toLowerCase();const allCards=columns.flatMap((col)=>col.cards);const matched=[];this.hiddenCardIds.clear();for(const card of allCards){const titleMatch=card.title.toLowerCase().includes(lowerKeyword);const descMatch=card.description?.toLowerCase().includes(lowerKeyword)??false;const labelMatch=card.labels?.some((l)=>l.name.toLowerCase().includes(lowerKeyword))??false;const assigneeMatch=card.assignees?.some((a)=>a.toLowerCase().includes(lowerKeyword))??false;if(titleMatch||descMatch||labelMatch||assigneeMatch)matched.push(card);else this.hiddenCardIds.add(card.id);}return matched;}clearFilter(){this.currentCriteria=null;this.hiddenCardIds.clear();this.events.emit("filter:clear",void 0);}isCardVisible(cardId){return!this.hiddenCardIds.has(cardId);}getHiddenCardIds(){return new Set(this.hiddenCardIds);}getCurrentCriteria(){return this.currentCriteria;}matchCriteria(card,criteria){if(criteria.keyword){const kw=criteria.keyword.toLowerCase();const titleMatch=card.title.toLowerCase().includes(kw);const descMatch=card.description?.toLowerCase().includes(kw)??false;if(!titleMatch&&!descMatch)return false;}if(criteria.labelIds?.length){const cardLabelIds=card.labels?.map((l)=>l.id)??[];if(!criteria.labelIds.some((id)=>cardLabelIds.includes(id)))return false;}if(criteria.assignees?.length){if(!criteria.assignees.some((a)=>card.assignees?.includes(a)))return false;}if(criteria.priorities?.length){if(!card.priority||!criteria.priorities.includes(card.priority))return false;}if(criteria.columnIds?.length){if(!criteria.columnIds.includes(card.columnId))return false;}if(criteria.dueDateRange){if(!card.dueDate)return false;const dueDate=new Date(card.dueDate).getTime();if(criteria.dueDateRange.start){if(dueDate<new Date(criteria.dueDateRange.start).getTime())return false;}if(criteria.dueDateRange.end){if(dueDate>new Date(criteria.dueDateRange.end).getTime())return false;}}if(criteria.custom){if(!criteria.custom(card))return false;}return true;}destroy(){this.hiddenCardIds.clear();this.currentCriteria=null;}};var Renderer=class{constructor(container,events,dragController,options){this.boardEl=null;this.columnElements=new Map();this.columnBodyElements=new Map();this.cardElements=new Map();this.container=container;this.events=events;this.dragController=dragController;this.options=options;this.prefix=options.classPrefix||"kanban";}render(columns,hiddenCardIds){this.cleanup();this.container.querySelectorAll("[data-kanban-board]").forEach((el)=>el.remove());const p=this.prefix;this.boardEl=createElement("div",`${p}-board`);this.boardEl.setAttribute("data-kanban-board","");const columnsContainer=createElement("div",`${p}-columns`);for(const column of columns){const colEl=this.renderColumn(column,hiddenCardIds);columnsContainer.appendChild(colEl);}if(this.options.showAddColumn!==false){const addColBtn=createElement("div",`${p}-add-column`);addColBtn.innerHTML=`<button class="${p}-add-column-btn">+\u6DFB\u52A0\u5217</button>`;addColBtn.querySelector("button").addEventListener("click",()=>{this.events.emit("ui:add-column");});columnsContainer.appendChild(addColBtn);}this.boardEl.appendChild(columnsContainer);this.container.appendChild(this.boardEl);}renderColumn(column,hiddenCardIds){const p=this.prefix;const colEl=createElement("div",`${p}-column`,{"data-column-id":column.id});if(column.collapsed)colEl.classList.add(`${p}-column--collapsed`);const header=this.renderColumnHeader(column);colEl.appendChild(header);const body=createElement("div",`${p}-column-body`);body.dataset.columnId=column.id;if(!column.collapsed){const visibleCards=column.cards.filter((card)=>!hiddenCardIds||!hiddenCardIds.has(card.id)).sort((a,b)=>a.order-b.order);for(const card of visibleCards){const cardEl=this.renderCard(card,column.id);body.appendChild(cardEl);}if(this.options.showAddCard!==false){const addBtn=createElement("div",`${p}-add-card`);addBtn.innerHTML=`<button class="${p}-add-card-btn">+\u6DFB\u52A0\u5361\u7247</button>`;addBtn.querySelector("button").addEventListener("click",()=>{this.events.emit("ui:add-card",{columnId:column.id});});body.appendChild(addBtn);}if(this.options.draggable!==false)this.dragController.enableColumnDrop(body,column.id);}colEl.appendChild(body);if(this.options.columnDraggable!==false&&this.boardEl){const dragHandle=header.querySelector(`.${p}-column-drag-handle`);if(dragHandle)this.dragController.enableColumnDrag(colEl,dragHandle,column.id,this.boardEl);}this.columnElements.set(column.id,colEl);this.columnBodyElements.set(column.id,body);return colEl;}renderColumnHeader(column){const p=this.prefix;const header=createElement("div",`${p}-column-header`);if(this.options.columnHeaderRenderer){this.options.columnHeaderRenderer(column,header);return header;}if(this.options.columnDraggable!==false){const handle=createElement("span",`${p}-column-drag-handle`);handle.innerHTML="&#8942;&#8942;";handle.title="拖拽排序";header.appendChild(handle);}if(column.color){const indicator=createElement("span",`${p}-column-color`);indicator.style.backgroundColor=column.color;header.appendChild(indicator);}const titleEl=createElement("span",`${p}-column-title`);titleEl.textContent=column.title;header.appendChild(titleEl);if(this.options.showCardCount!==false){const count=createElement("span",`${p}-column-count`);const wipText=column.wipLimit?`/${column.wipLimit}`:"";count.textContent=`${column.cards.length}${wipText}`;if(column.wipLimit&&column.cards.length>=column.wipLimit)count.classList.add(`${p}-column-count--limit`);header.appendChild(count);}const collapseBtn=createElement("button",`${p}-column-collapse-btn`);collapseBtn.innerHTML=column.collapsed?"&#9654;":"&#9660;";collapseBtn.title=column.collapsed?"展开":"折叠";collapseBtn.addEventListener("click",()=>{this.events.emit("ui:toggle-collapse",{columnId:column.id});});header.appendChild(collapseBtn);if(this.options.showColumnActions!==false){const actions=createElement("button",`${p}-column-actions-btn`);actions.innerHTML="&#8943;";actions.title="更多操作";actions.addEventListener("click",(e)=>{e.stopPropagation();this.events.emit("ui:column-actions",{columnId:column.id,event:e});});header.appendChild(actions);}return header;}renderCard(card,columnId){const p=this.prefix;const cardEl=createElement("div",`${p}-card`,{"data-card-id":card.id});if(this.options.cardRenderer)this.options.cardRenderer(card,cardEl);else this.renderDefaultCard(card,cardEl);if(this.options.draggable!==false)this.dragController.enableCardDrag(cardEl,card.id,columnId);cardEl.addEventListener("click",()=>{this.events.emit("card:click",{card});});this.cardElements.set(card.id,cardEl);return cardEl;}renderDefaultCard(card,cardEl){const p=this.prefix;if(card.priority){const priorityEl=createElement("div",`${p}-card-priority ${p}-card-priority--${card.priority}`);cardEl.appendChild(priorityEl);}if(card.labels?.length){const labelsEl=createElement("div",`${p}-card-labels`);for(const label of card.labels){const labelEl=createElement("span",`${p}-card-label`);labelEl.style.backgroundColor=label.color;labelEl.textContent=label.name;labelsEl.appendChild(labelEl);}cardEl.appendChild(labelsEl);}const titleEl=createElement("div",`${p}-card-title`);titleEl.textContent=card.title;cardEl.appendChild(titleEl);if(card.description){const descEl=createElement("div",`${p}-card-desc`);descEl.textContent=card.description;cardEl.appendChild(descEl);}if(card.assignees?.length||card.dueDate){const footer=createElement("div",`${p}-card-footer`);if(card.assignees?.length){const assigneesEl=createElement("div",`${p}-card-assignees`);for(const assignee of card.assignees.slice(0,3)){const avatar=createElement("span",`${p}-card-avatar`);avatar.textContent=assignee.charAt(0).toUpperCase();avatar.title=assignee;assigneesEl.appendChild(avatar);}if(card.assignees.length>3){const more=createElement("span",`${p}-card-avatar-more`);more.textContent=`+${card.assignees.length-3}`;assigneesEl.appendChild(more);}footer.appendChild(assigneesEl);}if(card.dueDate){const dueEl=createElement("span",`${p}-card-due`);const date=new Date(card.dueDate);dueEl.textContent=`${date.getMonth()+1}/${date.getDate()}`;if(date<new Date())dueEl.classList.add(`${p}-card-due--overdue`);footer.appendChild(dueEl);}cardEl.appendChild(footer);}}getColumnElement(columnId){return this.columnElements.get(columnId);}getCardElement(cardId){return this.cardElements.get(cardId);}getBoardElement(){return this.boardEl;}cleanup(){this.columnElements.clear();this.columnBodyElements.clear();this.cardElements.clear();if(this.boardEl){this.boardEl.remove();this.boardEl=null;}}destroy(){this.cleanup();}};const VERSION="0.1.0";var KanbanBoard=class{constructor(options){this.destroyed=false;this.labels=[];this.renderTimer=null;this.options={draggable:true,columnDraggable:true,crossColumnDrag:true,searchable:true,showAddCard:true,showAddColumn:true,showColumnActions:true,showCardCount:true,classPrefix:"kanban",...options};const el=resolveElement(options.container);if(!el)throw new Error("[KanbanBoard]Container element not found");this.container=el;this.events=new EventEmitter();this.columnManager=new ColumnManager(this.events);this.dragController=new DragController(this.events,this.options.classPrefix||"kanban");this.filterEngine=new FilterEngine(this.events);this.renderer=new Renderer(this.container,this.events,this.dragController,this.options);this.labels=options.labels||[];this.init();}init(){if(this.options.columns?.length)this.columnManager.init(this.options.columns);this.bindInternalEvents();this.render();this.events.emit("ready",{instance:this});this.options.onReady?.(this);if(this.options.debug)console.log("[KanbanBoard]Initialized",{columns:this.columnManager.getColumns().length,cards:this.columnManager.getCardCount()});}bindInternalEvents(){this.events.on("card:drop",(payload)=>{this.columnManager.moveCard(payload.cardId,payload.toColumnId,payload.toIndex);this.options.onCardMove?.(this.columnManager.getCard(payload.cardId),payload.fromColumnId,payload.toColumnId,payload.toIndex);this.scheduleRender();});this.events.on("column:drop",(payload)=>{const fromIndex=this.columnManager.getColumns().findIndex((c)=>c.id===payload.fromColumnId);this.columnManager.moveColumn(payload.fromColumnId,payload.toIndex);const col=this.columnManager.getColumn(payload.fromColumnId);if(col)this.options.onColumnMove?.(col,fromIndex,payload.toIndex);this.scheduleRender();});this.events.on("ui:toggle-collapse",(payload)=>{this.columnManager.toggleCollapse(payload.columnId);const col=this.columnManager.getColumn(payload.columnId);if(col)this.options.onColumnCollapse?.(col,col.collapsed??false);this.render();});this.events.on("card:add",(p)=>this.options.onCardAdd?.(p.card,p.columnId));this.events.on("card:remove",(p)=>this.options.onCardRemove?.(p.card,p.columnId));this.events.on("card:click",(p)=>this.options.onCardClick?.(p.card));this.events.on("card:update",(p)=>this.options.onCardUpdate?.(p.card));this.events.on("column:add",(p)=>this.options.onColumnAdd?.(p.column));this.events.on("column:remove",(p)=>this.options.onColumnRemove?.(p.column));this.events.on("error",(p)=>this.options.onError?.(p.error));}addColumn(partial){const column=this.columnManager.addColumn(partial);this.render();return column;}removeColumn(id){const column=this.columnManager.removeColumn(id);if(column)this.render();return column;}updateColumn(id,changes){const column=this.columnManager.updateColumn(id,changes);if(column)this.render();return column;}moveColumn(id,toIndex){this.columnManager.moveColumn(id,toIndex);this.render();}toggleColumnCollapse(id){this.columnManager.toggleCollapse(id);this.render();}getColumns(){return this.columnManager.getColumns();}getColumn(id){return this.columnManager.getColumn(id);}addCard(columnId,partial){const card=this.columnManager.addCard(columnId,partial);if(card)this.render();return card;}removeCard(cardId){const card=this.columnManager.removeCard(cardId);if(card)this.render();return card;}updateCard(cardId,changes){const card=this.columnManager.updateCard(cardId,changes);if(card)this.render();return card;}moveCard(cardId,toColumnId,toIndex){this.columnManager.moveCard(cardId,toColumnId,toIndex);this.render();}getCard(cardId){return this.columnManager.getCard(cardId);}getAllCards(){return this.columnManager.getAllCards();}getCardCount(){return this.columnManager.getCardCount();}filter(criteria){this.filterEngine.filter(criteria,this.columnManager.getColumns());this.render();}search(keyword){const result=this.filterEngine.search(keyword,this.columnManager.getColumns());this.render();return result;}clearFilter(){this.filterEngine.clearFilter();this.render();}exportData(){const data={version:VERSION,title:this.options.title||"Kanban Board",columns:this.columnManager.getColumns(),labels:this.labels,exportedAt:(new Date()).toISOString()};this.events.emit("data:export",{board:data});return data;}importData(data){this.columnManager.setColumns(data.columns);this.labels=data.labels||[];this.filterEngine.clearFilter();this.events.emit("data:import",{board:data});this.render();}on(event,handler){return this.events.on(event,handler);}once(event,handler){return this.events.once(event,handler);}off(event,handler){this.events.off(event,handler);}getLabels(){return[...this.labels];}addLabel(label){this.labels.push(label);}removeLabel(id){this.labels=this.labels.filter((l)=>l.id!==id);}scheduleRender(){if(this.renderTimer!==null)return;this.renderTimer=setTimeout(()=>{this.renderTimer=null;this.render();},0);}render(){if(this.destroyed)return;this.dragController.destroy();this.dragController=new DragController(this.events,this.options.classPrefix||"kanban");this.renderer=new Renderer(this.container,this.events,this.dragController,this.options);this.renderer.render(this.columnManager.getColumns(),this.filterEngine.getHiddenCardIds());}getBoardElement(){return this.renderer.getBoardElement();}getOptions(){return{...this.options};}destroy(){if(this.destroyed)return;this.destroyed=true;if(this.renderTimer!==null){clearTimeout(this.renderTimer);this.renderTimer=null;}this.dragController.destroy();this.filterEngine.destroy();this.renderer.destroy();this.columnManager.clear();this.events.emit("destroy",void 0);this.options.onDestroy?.();this.events.removeAll();if(this.options.debug)console.log("[KanbanBoard]Destroyed");}isDestroyed(){return this.destroyed;}};function createKanbanBoard(options){return new KanbanBoard(options);}function getElement(target){if(typeof target==="string")return document.querySelector(target);return target;}exports.ColumnManager=ColumnManager;exports.DragController=DragController;exports.EventEmitter=EventEmitter;exports.FilterEngine=FilterEngine;exports.KanbanBoard=KanbanBoard;exports.Renderer=Renderer;exports.VERSION=VERSION;exports.clearElement=clearElement;exports.createElement=createElement;exports.createKanbanBoard=createKanbanBoard;exports.generateId=generateId;exports.getElement=getElement;exports.insertAt=insertAt;exports.removeElement=removeElement;exports.resetIdCounter=resetIdCounter;exports.resolveElement=resolveElement;});
+/*!
+* ***********************************
+* @composy/kanban-core v0.0.1     *
+* Built with rollup               *
+* Build time: 2024-10-12 17:29:01 *
+* Build mode: production          *
+* Minified: No                    *
+* ***********************************
+*/
+(function(e, t) {
+	"object" == typeof exports && "undefined" != typeof module ? t(exports) : "function" == typeof define && define.amd ? define(["exports"], t) : t((e = "undefined" != typeof globalThis ? globalThis : e || self).LDesignKanbanCore = {});
+})(this, function(exports) {
+	Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+	let e = 0;
+	function t(t = "kb") {
+		return e++, `${t}_${Date.now().toString(36)}_${Math.random().toString(36).substring(2, 6)}_${e}`;
+	}
+	var n = class {
+		constructor(e) {
+			this.columns = [], this.events = e;
+		}
+		init(e) {
+			this.columns = e.map((e, t) => this.normalizeColumn(e, t)), this.sortColumns();
+		}
+		normalizeColumn(e, n) {
+			const r = e.id || t("col"), s = (e.cards ?? []).map((e, t) => this.normalizeCard({
+				...e,
+				columnId: r
+			}, r, t));
+			return s.sort((e, t) => e.order - t.order), s.forEach((e, t) => {
+				e.order = t;
+			}), {
+				id: r,
+				title: e.title ?? `Column ${n + 1}`,
+				cards: s,
+				wipLimit: e.wipLimit,
+				collapsed: e.collapsed ?? !1,
+				color: e.color,
+				order: e.order ?? n
+			};
+		}
+		normalizeCard(e, n, r) {
+			return {
+				id: e.id || t("card"),
+				title: e.title ?? "",
+				description: e.description,
+				labels: e.labels?.map((e) => ({ ...e })) ?? [],
+				assignees: e.assignees ? [...e.assignees] : [],
+				dueDate: e.dueDate,
+				priority: e.priority,
+				order: e.order ?? r,
+				columnId: e.columnId ?? n,
+				data: e.data,
+				createdAt: e.createdAt ?? (/* @__PURE__ */ new Date()).toISOString(),
+				updatedAt: e.updatedAt
+			};
+		}
+		getColumns() {
+			return [...this.columns].sort((e, t) => e.order - t.order);
+		}
+		getColumn(e) {
+			return this.columns.find((t) => t.id === e);
+		}
+		addColumn(e) {
+			const t = this.normalizeColumn(e, this.columns.length);
+			return this.columns.push(t), this.sortColumns(), this.events.emit("column:add", { column: t }), t;
+		}
+		removeColumn(e) {
+			const t = this.columns.findIndex((t) => t.id === e);
+			if (-1 === t) return;
+			const [n] = this.columns.splice(t, 1);
+			return this.reorderColumns(), this.events.emit("column:remove", { column: n }), n;
+		}
+		updateColumn(e, t) {
+			const n = this.columns.find((t) => t.id === e);
+			if (n) return Object.assign(n, t, { id: e }), t.cards && (n.cards = t.cards.map((t, n) => this.normalizeCard(t, e, n)), n.cards.sort((e, t) => e.order - t.order), this.reorderCards(n)), void 0 !== t.order && this.sortColumns(), this.events.emit("column:update", {
+				column: n,
+				changes: t
+			}), n;
+		}
+		moveColumn(e, t) {
+			this.sortColumns();
+			const n = this.columns.findIndex((t) => t.id === e);
+			if (-1 === n) return;
+			const [r] = this.columns.splice(n, 1), s = this.clampIndex(t, this.columns.length);
+			this.columns.splice(s, 0, r), this.reorderColumns(), this.events.emit("column:move", {
+				column: r,
+				fromIndex: n,
+				toIndex: s
+			});
+		}
+		toggleCollapse(e) {
+			const t = this.columns.find((t) => t.id === e);
+			t && (t.collapsed = !t.collapsed, this.events.emit("column:collapse", {
+				column: t,
+				collapsed: t.collapsed
+			}));
+		}
+		getCards(e) {
+			const t = this.columns.find((t) => t.id === e);
+			return t ? [...t.cards].sort((e, t) => e.order - t.order) : [];
+		}
+		addCard(e, t) {
+			const n = this.columns.find((t) => t.id === e);
+			if (!n) return;
+			if (n.wipLimit && n.cards.length >= n.wipLimit) return void this.events.emit("error", { error: /* @__PURE__ */ new Error(`Column "${n.title}" reached WIP limit (${n.wipLimit})`) });
+			const r = this.normalizeCard({
+				...t,
+				columnId: e
+			}, e, n.cards.length);
+			return n.cards.push(r), this.events.emit("card:add", {
+				card: r,
+				columnId: e
+			}), r;
+		}
+		removeCard(e) {
+			for (const t of this.columns) {
+				const n = t.cards.findIndex((t) => t.id === e);
+				if (-1 !== n) {
+					const [e] = t.cards.splice(n, 1);
+					return this.reorderCards(t), this.events.emit("card:remove", {
+						card: e,
+						columnId: t.id
+					}), e;
+				}
+			}
+		}
+		updateCard(e, t) {
+			for (const n of this.columns) {
+				const r = n.cards.find((t) => t.id === e);
+				if (r) return Object.assign(r, t, {
+					id: e,
+					columnId: n.id
+				}), r.updatedAt = (/* @__PURE__ */ new Date()).toISOString(), this.events.emit("card:update", {
+					card: r,
+					changes: t
+				}), r;
+			}
+		}
+		getCard(e) {
+			for (const t of this.columns) {
+				const n = t.cards.find((t) => t.id === e);
+				if (n) return n;
+			}
+		}
+		moveCard(e, t, n) {
+			let r, s = -1;
+			for (const t of this.columns) {
+				const n = t.cards.findIndex((t) => t.id === e);
+				if (-1 !== n) {
+					r = t, s = n;
+					break;
+				}
+			}
+			if (!r || -1 === s) return;
+			const o = this.columns.find((e) => e.id === t);
+			if (!o) return;
+			if (r.id !== t && o.wipLimit && o.cards.length >= o.wipLimit) return void this.events.emit("error", { error: /* @__PURE__ */ new Error(`Column "${o.title}" reached WIP limit (${o.wipLimit})`) });
+			const [i] = r.cards.splice(s, 1);
+			i.columnId = t;
+			const a = this.clampIndex(n, o.cards.length);
+			o.cards.splice(a, 0, i), this.reorderCards(r), this.reorderCards(o), this.events.emit("card:move", {
+				card: i,
+				fromColumnId: r.id,
+				toColumnId: t,
+				toIndex: a
+			});
+		}
+		getAllCards() {
+			const e = [];
+			for (const t of this.columns) e.push(...t.cards);
+			return e;
+		}
+		getCardCount() {
+			return this.columns.reduce((e, t) => e + t.cards.length, 0);
+		}
+		reorderColumns() {
+			this.columns.forEach((e, t) => {
+				e.order = t;
+			});
+		}
+		reorderCards(e) {
+			e.cards.forEach((e, t) => {
+				e.order = t;
+			});
+		}
+		setColumns(e) {
+			this.columns = e.map((e, t) => this.normalizeColumn(e, t)), this.sortColumns();
+		}
+		clear() {
+			this.columns = [];
+		}
+		clampIndex(e, t) {
+			return Number.isFinite(e) ? Math.min(Math.max(Math.trunc(e), 0), t) : t;
+		}
+		sortColumns() {
+			this.columns.sort((e, t) => e.order - t.order), this.reorderColumns();
+		}
+	}, r = class {
+		constructor(e, t) {
+			this.state = {
+				dragging: !1,
+				cardId: null,
+				sourceColumnId: null,
+				targetColumnId: null,
+				targetIndex: 0,
+				placeholder: null
+			}, this.cleanupFns = [], this.events = e, this.prefix = t;
+		}
+		enableCardDrag(e, t, n) {
+			e.setAttribute("draggable", "true"), e.dataset.cardId = t, e.dataset.columnId = n;
+			const r = (r) => {
+				r.dataTransfer && (r.dataTransfer.effectAllowed = "move", r.dataTransfer.setData("text/plain", t), this.state.dragging = !0, this.state.cardId = t, this.state.sourceColumnId = n, this.state.targetColumnId = n, this.state.targetIndex = 0, e.classList.add(`${this.prefix}-card--dragging`), this.events.emit("card:drag-start", {
+					cardId: t,
+					columnId: n
+				}), this.createPlaceholder(e));
+			}, s = () => {
+				e.classList.remove(`${this.prefix}-card--dragging`), this.removePlaceholder(), this.state.dragging = !1, this.state.cardId = null, this.state.sourceColumnId = null, this.state.targetColumnId = null, this.state.targetIndex = 0, this.events.emit("card:drag-end", { cardId: t });
+			};
+			e.addEventListener("dragstart", r), e.addEventListener("dragend", s), this.cleanupFns.push(() => {
+				e.removeEventListener("dragstart", r), e.removeEventListener("dragend", s);
+			});
+		}
+		enableColumnDrop(e, t) {
+			const n = (n) => {
+				if (n.preventDefault(), !n.dataTransfer) return;
+				n.dataTransfer.dropEffect = "move", this.state.targetColumnId = t;
+				const r = this.getDragAfterElement(e, n.clientY), s = this.state.placeholder;
+				if (s) if (r) e.insertBefore(s, r);
+				else {
+					const t = e.querySelector(`.${this.prefix}-add-card`);
+					t ? e.insertBefore(s, t) : e.appendChild(s);
+				}
+			}, r = (t) => {
+				t.preventDefault(), e.classList.add(`${this.prefix}-column-body--drag-over`);
+			}, s = (t) => {
+				const n = e.getBoundingClientRect();
+				(t.clientX < n.left || t.clientX > n.right || t.clientY < n.top || t.clientY > n.bottom) && e.classList.remove(`${this.prefix}-column-body--drag-over`);
+			}, o = (n) => {
+				n.preventDefault(), e.classList.remove(`${this.prefix}-column-body--drag-over`);
+				const r = this.state.cardId;
+				if (!r) return;
+				const s = this.state.placeholder;
+				let o = 0;
+				if (s && s.parentNode === e) {
+					const t = [...e.children];
+					for (const e of t) {
+						if (e === s) break;
+						e.hasAttribute("data-card-id") && !e.classList.contains(`${this.prefix}-card--dragging`) && o++;
+					}
+				} else o = e.querySelectorAll(`[data-card-id]:not(.${this.prefix}-card--dragging)`).length;
+				this.state.targetIndex = o, this.events.emit("card:drop", {
+					cardId: r,
+					fromColumnId: this.state.sourceColumnId,
+					toColumnId: t,
+					toIndex: o
+				}), this.removePlaceholder();
+			};
+			e.addEventListener("dragover", n), e.addEventListener("dragenter", r), e.addEventListener("dragleave", s), e.addEventListener("drop", o), this.cleanupFns.push(() => {
+				e.removeEventListener("dragover", n), e.removeEventListener("dragenter", r), e.removeEventListener("dragleave", s), e.removeEventListener("drop", o);
+			});
+		}
+		enableColumnDrag(e, t, n, r) {
+			t.setAttribute("draggable", "true");
+			const s = (t) => {
+				t.dataTransfer && (t.dataTransfer.effectAllowed = "move", t.dataTransfer.setData("application/kanban-column", n), e.classList.add(`${this.prefix}-column--dragging`));
+			}, o = () => {
+				e.classList.remove(`${this.prefix}-column--dragging`), r.querySelectorAll(`.${this.prefix}-column--drag-over`).forEach((e) => {
+					e.classList.remove(`${this.prefix}-column--drag-over`);
+				});
+			}, i = (t) => {
+				t.dataTransfer?.types.includes("application/kanban-column") && (t.preventDefault(), t.dataTransfer.dropEffect = "move", e.classList.add(`${this.prefix}-column--drag-over`));
+			}, a = () => {
+				e.classList.remove(`${this.prefix}-column--drag-over`);
+			}, d = (t) => {
+				t.preventDefault(), e.classList.remove(`${this.prefix}-column--drag-over`);
+				const s = t.dataTransfer?.getData("application/kanban-column");
+				if (!s || s === n) return;
+				const o = [...r.querySelectorAll("[data-column-id]")].indexOf(e);
+				this.events.emit("column:drop", {
+					fromColumnId: s,
+					toColumnId: n,
+					toIndex: o
+				});
+			};
+			t.addEventListener("dragstart", s), t.addEventListener("dragend", o), e.addEventListener("dragover", i), e.addEventListener("dragleave", a), e.addEventListener("drop", d), this.cleanupFns.push(() => {
+				t.removeEventListener("dragstart", s), t.removeEventListener("dragend", o), e.removeEventListener("dragover", i), e.removeEventListener("dragleave", a), e.removeEventListener("drop", d);
+			});
+		}
+		getDragAfterElement(e, t) {
+			const n = [...e.querySelectorAll(`[data-card-id]:not(.${this.prefix}-card--dragging):not(.${this.prefix}-placeholder)`)];
+			let r = Number.NEGATIVE_INFINITY, s = null;
+			return n.forEach((e) => {
+				const n = e.getBoundingClientRect(), o = t - n.top - n.height / 2;
+				o < 0 && o > r && (r = o, s = e);
+			}), s;
+		}
+		createPlaceholder(e) {
+			this.removePlaceholder();
+			const t = document.createElement("div");
+			t.className = `${this.prefix}-placeholder`, t.style.height = `${e.offsetHeight}px`, this.state.placeholder = t;
+		}
+		removePlaceholder() {
+			this.state.placeholder && (this.state.placeholder.parentNode?.removeChild(this.state.placeholder), this.state.placeholder = null);
+		}
+		getState() {
+			return { ...this.state };
+		}
+		destroy() {
+			this.cleanupFns.forEach((e) => e()), this.cleanupFns = [], this.removePlaceholder(), this.state.dragging = !1, this.state.cardId = null, this.state.sourceColumnId = null, this.state.targetColumnId = null, this.state.targetIndex = 0;
+		}
+	}, s = class {
+		constructor() {
+			this.listeners = /* @__PURE__ */ new Map();
+		}
+		on(e, t) {
+			this.listeners.has(e) || this.listeners.set(e, /* @__PURE__ */ new Set());
+			const n = this.listeners.get(e);
+			return n ? (n.add(t), () => this.off(e, t)) : () => this.off(e, t);
+		}
+		once(e, t) {
+			const n = (...r) => {
+				this.off(e, n), t(...r);
+			};
+			return this.on(e, n);
+		}
+		off(e, t) {
+			const n = this.listeners.get(e);
+			n && (n.delete(t), 0 === n.size && this.listeners.delete(e));
+		}
+		emit(e, t) {
+			const n = this.listeners.get(e);
+			n && n.forEach((n) => {
+				try {
+					n(t);
+				} catch (t) {
+					console.error(`[KanbanBoard] Error in event handler for "${e}":`, t);
+				}
+			});
+		}
+		removeAll() {
+			this.listeners.clear();
+		}
+		listenerCount(e) {
+			return this.listeners.get(e)?.size ?? 0;
+		}
+	}, o = class {
+		constructor(e) {
+			this.currentCriteria = null, this.hiddenCardIds = /* @__PURE__ */ new Set(), this.events = e;
+		}
+		filter(e, t) {
+			this.currentCriteria = e, this.hiddenCardIds.clear();
+			const n = t.flatMap((e) => e.cards);
+			for (const t of n) this.matchCriteria(t, e) || this.hiddenCardIds.add(t.id);
+			return this.events.emit("filter:change", { criteria: e }), new Set(this.hiddenCardIds);
+		}
+		search(e, t) {
+			this.events.emit("search:change", { keyword: e });
+			const n = e.trim();
+			if (this.currentCriteria = n ? { keyword: n } : null, !n) return this.clearFilter(), t.flatMap((e) => e.cards);
+			const r = n.toLowerCase(), s = t.flatMap((e) => e.cards), o = [];
+			this.hiddenCardIds.clear();
+			for (const e of s) {
+				const t = e.title.toLowerCase().includes(r), n = e.description?.toLowerCase().includes(r) ?? !1, s = e.labels?.some((e) => e.name.toLowerCase().includes(r)) ?? !1, i = e.assignees?.some((e) => e.toLowerCase().includes(r)) ?? !1;
+				t || n || s || i ? o.push(e) : this.hiddenCardIds.add(e.id);
+			}
+			return o;
+		}
+		clearFilter() {
+			this.currentCriteria = null, this.hiddenCardIds.clear(), this.events.emit("filter:clear", void 0);
+		}
+		isCardVisible(e) {
+			return !this.hiddenCardIds.has(e);
+		}
+		getHiddenCardIds() {
+			return new Set(this.hiddenCardIds);
+		}
+		getCurrentCriteria() {
+			return this.currentCriteria;
+		}
+		matchCriteria(e, t) {
+			if (t.keyword) {
+				const n = t.keyword.toLowerCase(), r = e.title.toLowerCase().includes(n), s = e.description?.toLowerCase().includes(n) ?? !1;
+				if (!r && !s) return !1;
+			}
+			if (t.labelIds?.length) {
+				const n = e.labels?.map((e) => e.id) ?? [];
+				if (!t.labelIds.some((e) => n.includes(e))) return !1;
+			}
+			if (t.assignees?.length && !t.assignees.some((t) => e.assignees?.includes(t))) return !1;
+			if (t.priorities?.length && (!e.priority || !t.priorities.includes(e.priority))) return !1;
+			if (t.columnIds?.length && !t.columnIds.includes(e.columnId)) return !1;
+			if (t.dueDateRange) {
+				if (!e.dueDate) return !1;
+				const n = new Date(e.dueDate).getTime();
+				if (Number.isNaN(n)) return !1;
+				if (t.dueDateRange.start) {
+					const e = new Date(t.dueDateRange.start).getTime();
+					if (Number.isNaN(e) || n < e) return !1;
+				}
+				if (t.dueDateRange.end) {
+					const e = new Date(t.dueDateRange.end).getTime();
+					if (Number.isNaN(e) || n > e) return !1;
+				}
+			}
+			return !(t.custom && !t.custom(e));
+		}
+		destroy() {
+			this.hiddenCardIds.clear(), this.currentCriteria = null;
+		}
+	};
+	function i(e, t, n) {
+		const r = document.createElement(e);
+		return t && (r.className = t), n && Object.entries(n).forEach(([e, t]) => {
+			r.setAttribute(e, t);
+		}), r;
+	}
+	function a(e) {
+		return "string" == typeof e ? document.querySelector(e) : e;
+	}
+	const d = "0.1.0";
+	var l = class {
+		constructor(e, t, n, r) {
+			this.boardEl = null, this.columnElements = /* @__PURE__ */ new Map(), this.columnBodyElements = /* @__PURE__ */ new Map(), this.cardElements = /* @__PURE__ */ new Map(), this.container = e, this.events = t, this.dragController = n, this.options = r, this.prefix = r.classPrefix || "kanban";
+		}
+		render(e, t) {
+			this.cleanup(), this.container.querySelectorAll("[data-kanban-board]").forEach((e) => e.remove());
+			const n = this.prefix;
+			this.boardEl = i("div", `${n}-board`), this.boardEl.setAttribute("data-kanban-board", "");
+			const r = i("div", `${n}-columns`);
+			for (const n of e) {
+				const e = this.renderColumn(n, t);
+				r.appendChild(e);
+			}
+			if (!1 !== this.options.showAddColumn) {
+				const e = i("div", `${n}-add-column`);
+				e.innerHTML = `<button class="${n}-add-column-btn">+ 添加列</button>`, e.querySelector("button")?.addEventListener("click", () => {
+					this.events.emit("ui:add-column");
+				}), r.appendChild(e);
+			}
+			this.boardEl.appendChild(r), this.container.appendChild(this.boardEl);
+		}
+		renderColumn(e, t) {
+			const n = this.prefix, r = i("div", `${n}-column`, { "data-column-id": e.id });
+			e.collapsed && r.classList.add(`${n}-column--collapsed`);
+			const s = this.renderColumnHeader(e);
+			r.appendChild(s);
+			const o = i("div", `${n}-column-body`);
+			if (o.dataset.columnId = e.id, !e.collapsed) {
+				const r = e.cards.filter((e) => !t || !t.has(e.id)).sort((e, t) => e.order - t.order);
+				for (const t of r) {
+					const n = this.renderCard(t, e.id);
+					o.appendChild(n);
+				}
+				if (!1 !== this.options.showAddCard) {
+					const t = i("div", `${n}-add-card`);
+					t.innerHTML = `<button class="${n}-add-card-btn">+ 添加卡片</button>`, t.querySelector("button")?.addEventListener("click", () => {
+						this.events.emit("ui:add-card", { columnId: e.id });
+					}), o.appendChild(t);
+				}
+				!1 !== this.options.draggable && this.dragController.enableColumnDrop(o, e.id);
+			}
+			r.appendChild(o);
+			const a = this.boardEl;
+			if (!1 !== this.options.columnDraggable && a) {
+				const t = s.querySelector(`.${n}-column-drag-handle`);
+				t && this.dragController.enableColumnDrag(r, t, e.id, a);
+			}
+			return this.columnElements.set(e.id, r), this.columnBodyElements.set(e.id, o), r;
+		}
+		renderColumnHeader(e) {
+			const t = this.prefix, n = i("div", `${t}-column-header`);
+			if (this.options.columnHeaderRenderer) return this.options.columnHeaderRenderer(e, n), n;
+			if (!1 !== this.options.columnDraggable) {
+				const e = i("span", `${t}-column-drag-handle`);
+				e.innerHTML = "&#8942;&#8942;", e.title = "拖拽排序", n.appendChild(e);
+			}
+			if (e.color) {
+				const r = i("span", `${t}-column-color`);
+				r.style.backgroundColor = e.color, n.appendChild(r);
+			}
+			const r = i("span", `${t}-column-title`);
+			if (r.textContent = e.title, n.appendChild(r), !1 !== this.options.showCardCount) {
+				const r = i("span", `${t}-column-count`), s = e.wipLimit ? `/${e.wipLimit}` : "";
+				r.textContent = `${e.cards.length}${s}`, e.wipLimit && e.cards.length >= e.wipLimit && r.classList.add(`${t}-column-count--limit`), n.appendChild(r);
+			}
+			const s = i("button", `${t}-column-collapse-btn`);
+			if (s.innerHTML = e.collapsed ? "&#9654;" : "&#9660;", s.title = e.collapsed ? "展开" : "折叠", s.addEventListener("click", () => {
+				this.events.emit("ui:toggle-collapse", { columnId: e.id });
+			}), n.appendChild(s), !1 !== this.options.showColumnActions) {
+				const r = i("button", `${t}-column-actions-btn`);
+				r.innerHTML = "&#8943;", r.title = "更多操作", r.addEventListener("click", (t) => {
+					t.stopPropagation(), this.events.emit("ui:column-actions", {
+						columnId: e.id,
+						event: t
+					});
+				}), n.appendChild(r);
+			}
+			return n;
+		}
+		renderCard(e, t) {
+			const n = i("div", `${this.prefix}-card`, { "data-card-id": e.id });
+			return this.options.cardRenderer ? this.options.cardRenderer(e, n) : this.renderDefaultCard(e, n), !1 !== this.options.draggable && this.dragController.enableCardDrag(n, e.id, t), n.addEventListener("click", () => {
+				this.events.emit("card:click", { card: e });
+			}), this.cardElements.set(e.id, n), n;
+		}
+		renderDefaultCard(e, t) {
+			const n = this.prefix;
+			if (e.priority) {
+				const r = i("div", `${n}-card-priority ${n}-card-priority--${e.priority}`);
+				t.appendChild(r);
+			}
+			if (e.labels?.length) {
+				const r = i("div", `${n}-card-labels`);
+				for (const t of e.labels) {
+					const e = i("span", `${n}-card-label`);
+					e.style.backgroundColor = t.color, e.textContent = t.name, r.appendChild(e);
+				}
+				t.appendChild(r);
+			}
+			const r = i("div", `${n}-card-title`);
+			if (r.textContent = e.title, t.appendChild(r), e.description) {
+				const r = i("div", `${n}-card-desc`);
+				r.textContent = e.description, t.appendChild(r);
+			}
+			if (e.assignees?.length || e.dueDate) {
+				const r = i("div", `${n}-card-footer`);
+				if (e.assignees?.length) {
+					const t = i("div", `${n}-card-assignees`);
+					for (const r of e.assignees.slice(0, 3)) {
+						const e = i("span", `${n}-card-avatar`);
+						e.textContent = r.charAt(0).toUpperCase(), e.title = r, t.appendChild(e);
+					}
+					if (e.assignees.length > 3) {
+						const r = i("span", `${n}-card-avatar-more`);
+						r.textContent = "+" + (e.assignees.length - 3), t.appendChild(r);
+					}
+					r.appendChild(t);
+				}
+				if (e.dueDate) {
+					const t = i("span", `${n}-card-due`), s = new Date(e.dueDate);
+					Number.isNaN(s.getTime()) ? t.textContent = "Invalid date" : (t.textContent = `${s.getMonth() + 1}/${s.getDate()}`, s < /* @__PURE__ */ new Date() && t.classList.add(`${n}-card-due--overdue`)), r.appendChild(t);
+				}
+				t.appendChild(r);
+			}
+		}
+		getColumnElement(e) {
+			return this.columnElements.get(e);
+		}
+		getCardElement(e) {
+			return this.cardElements.get(e);
+		}
+		getBoardElement() {
+			return this.boardEl;
+		}
+		cleanup() {
+			this.columnElements.clear(), this.columnBodyElements.clear(), this.cardElements.clear(), this.boardEl && (this.boardEl.remove(), this.boardEl = null);
+		}
+		destroy() {
+			this.cleanup();
+		}
+	};
+	function c(e) {
+		return "object" == typeof e && null !== e;
+	}
+	function u(e) {
+		return c(e) && "string" == typeof e.id && "string" == typeof e.title && "number" == typeof e.order && "string" == typeof e.columnId;
+	}
+	function h(e) {
+		return c(e) && "string" == typeof e.id && "string" == typeof e.title && Array.isArray(e.cards) && "number" == typeof e.order;
+	}
+	var m = class {
+		constructor(e) {
+			this.destroyed = !1, this.labels = [], this.renderTimer = null, this.options = {
+				draggable: !0,
+				columnDraggable: !0,
+				crossColumnDrag: !0,
+				searchable: !0,
+				showAddCard: !0,
+				showAddColumn: !0,
+				showColumnActions: !0,
+				showCardCount: !0,
+				classPrefix: "kanban",
+				...e
+			};
+			const t = a(e.container);
+			if (!t) throw new Error("[KanbanBoard] Container element not found");
+			this.container = t, this.events = new s(), this.columnManager = new n(this.events), this.dragController = new r(this.events, this.options.classPrefix || "kanban"), this.filterEngine = new o(this.events), this.renderer = new l(this.container, this.events, this.dragController, this.options), this.labels = e.labels || [], this.init();
+		}
+		init() {
+			this.options.columns?.length && this.columnManager.init(this.options.columns), this.bindInternalEvents(), this.render(), this.events.emit("ready", { instance: this }), this.options.onReady?.(this), this.options.debug && console.debug("[KanbanBoard] Initialized", {
+				columns: this.columnManager.getColumns().length,
+				cards: this.columnManager.getCardCount()
+			});
+		}
+		bindInternalEvents() {
+			this.events.on("card:drop", (e) => {
+				if (!c(t = e) || "string" != typeof t.cardId || null !== t.fromColumnId && "string" != typeof t.fromColumnId || "string" != typeof t.toColumnId || "number" != typeof t.toIndex) return;
+				var t;
+				const n = this.columnManager.getCard(e.cardId);
+				this.columnManager.moveCard(e.cardId, e.toColumnId, e.toIndex), n && n.columnId === e.toColumnId && this.options.onCardMove?.(n, e.fromColumnId ?? "", e.toColumnId, n.order), this.scheduleRender();
+			}), this.events.on("column:drop", (e) => {
+				if (!c(t = e) || "string" != typeof t.fromColumnId || "string" != typeof t.toColumnId || "number" != typeof t.toIndex) return;
+				var t;
+				const n = this.columnManager.getColumns();
+				if (e.fromColumnId === e.toColumnId || !n.some((t) => t.id === e.fromColumnId) || !n.some((t) => t.id === e.toColumnId)) return;
+				const r = n.findIndex((t) => t.id === e.fromColumnId);
+				this.columnManager.moveColumn(e.fromColumnId, e.toIndex);
+				const s = this.columnManager.getColumn(e.fromColumnId);
+				s && this.options.onColumnMove?.(s, r, s.order), this.scheduleRender();
+			}), this.events.on("ui:toggle-collapse", (e) => {
+				if (!c(e) || "string" != typeof e.columnId) return;
+				this.columnManager.toggleCollapse(e.columnId);
+				const t = this.columnManager.getColumn(e.columnId);
+				t && this.options.onColumnCollapse?.(t, t.collapsed ?? !1), this.render();
+			}), this.events.on("card:add", (e) => {
+				c(e) && u(e.card) && "string" == typeof e.columnId && this.options.onCardAdd?.(e.card, e.columnId);
+			}), this.events.on("card:remove", (e) => {
+				c(e) && u(e.card) && "string" == typeof e.columnId && this.options.onCardRemove?.(e.card, e.columnId);
+			}), this.events.on("card:click", (e) => {
+				c(e) && u(e.card) && this.options.onCardClick?.(e.card);
+			}), this.events.on("card:update", (e) => {
+				c(e) && u(e.card) && this.options.onCardUpdate?.(e.card);
+			}), this.events.on("column:add", (e) => {
+				c(e) && h(e.column) && this.options.onColumnAdd?.(e.column);
+			}), this.events.on("column:remove", (e) => {
+				c(e) && h(e.column) && this.options.onColumnRemove?.(e.column);
+			}), this.events.on("error", (e) => {
+				c(e) && e.error instanceof Error && this.options.onError?.(e.error);
+			});
+		}
+		addColumn(e) {
+			const t = this.columnManager.addColumn(e);
+			return this.render(), t;
+		}
+		removeColumn(e) {
+			const t = this.columnManager.removeColumn(e);
+			return t && this.render(), t;
+		}
+		updateColumn(e, t) {
+			const n = this.columnManager.updateColumn(e, t);
+			return n && this.render(), n;
+		}
+		moveColumn(e, t) {
+			this.columnManager.moveColumn(e, t), this.render();
+		}
+		toggleColumnCollapse(e) {
+			this.columnManager.toggleCollapse(e), this.render();
+		}
+		getColumns() {
+			return this.columnManager.getColumns();
+		}
+		getColumn(e) {
+			return this.columnManager.getColumn(e);
+		}
+		addCard(e, t) {
+			const n = this.columnManager.addCard(e, t);
+			return n && this.render(), n;
+		}
+		removeCard(e) {
+			const t = this.columnManager.removeCard(e);
+			return t && this.render(), t;
+		}
+		updateCard(e, t) {
+			const n = this.columnManager.updateCard(e, t);
+			return n && this.render(), n;
+		}
+		moveCard(e, t, n) {
+			this.columnManager.moveCard(e, t, n), this.render();
+		}
+		getCard(e) {
+			return this.columnManager.getCard(e);
+		}
+		getAllCards() {
+			return this.columnManager.getAllCards();
+		}
+		getCardCount() {
+			return this.columnManager.getCardCount();
+		}
+		filter(e) {
+			this.filterEngine.filter(e, this.columnManager.getColumns()), this.render();
+		}
+		search(e) {
+			const t = this.filterEngine.search(e, this.columnManager.getColumns());
+			return this.render(), t;
+		}
+		clearFilter() {
+			this.filterEngine.clearFilter(), this.render();
+		}
+		exportData() {
+			const e = {
+				version: d,
+				title: this.options.title || "Kanban Board",
+				columns: this.columnManager.getColumns(),
+				labels: this.labels,
+				exportedAt: (/* @__PURE__ */ new Date()).toISOString()
+			};
+			return this.events.emit("data:export", { board: e }), e;
+		}
+		importData(e) {
+			e && Array.isArray(e.columns) ? (this.columnManager.setColumns(e.columns), this.labels = Array.isArray(e.labels) ? [...e.labels] : [], this.filterEngine.clearFilter(), this.events.emit("data:import", { board: e }), this.render()) : this.events.emit("error", { error: /* @__PURE__ */ new Error("[KanbanBoard] Invalid board data: columns must be an array") });
+		}
+		on(e, t) {
+			return this.events.on(e, t);
+		}
+		once(e, t) {
+			return this.events.once(e, t);
+		}
+		off(e, t) {
+			this.events.off(e, t);
+		}
+		getLabels() {
+			return [...this.labels];
+		}
+		addLabel(e) {
+			this.labels.push(e);
+		}
+		removeLabel(e) {
+			this.labels = this.labels.filter((t) => t.id !== e);
+		}
+		scheduleRender() {
+			null === this.renderTimer && (this.renderTimer = setTimeout(() => {
+				this.renderTimer = null, this.render();
+			}, 0));
+		}
+		render() {
+			this.destroyed || (this.dragController.destroy(), this.dragController = new r(this.events, this.options.classPrefix || "kanban"), this.renderer = new l(this.container, this.events, this.dragController, this.options), this.renderer.render(this.columnManager.getColumns(), this.filterEngine.getHiddenCardIds()));
+		}
+		getBoardElement() {
+			return this.renderer.getBoardElement();
+		}
+		getOptions() {
+			return { ...this.options };
+		}
+		destroy() {
+			this.destroyed || (this.destroyed = !0, null !== this.renderTimer && (clearTimeout(this.renderTimer), this.renderTimer = null), this.dragController.destroy(), this.filterEngine.destroy(), this.renderer.destroy(), this.columnManager.clear(), this.events.emit("destroy", void 0), this.options.onDestroy?.(), this.events.removeAll(), this.options.debug && console.debug("[KanbanBoard] Destroyed"));
+		}
+		isDestroyed() {
+			return this.destroyed;
+		}
+	};
+	exports.ColumnManager = n, exports.DragController = r, exports.EventEmitter = s, exports.FilterEngine = o, exports.KanbanBoard = m, exports.Renderer = l, exports.VERSION = d, exports.clearElement = function(e) {
+		e.innerHTML = "";
+	}, exports.createElement = i, exports.createKanbanBoard = function(e) {
+		return new m(e);
+	}, exports.generateId = t, exports.getElement = function(e) {
+		return "string" == typeof e ? document.querySelector(e) : e;
+	}, exports.insertAt = function(e, t, n) {
+		const r = e.children[n];
+		r ? e.insertBefore(t, r) : e.appendChild(t);
+	}, exports.removeElement = function(e) {
+		e?.parentNode?.removeChild(e);
+	}, exports.resetIdCounter = function() {
+		e = 0;
+	}, exports.resolveElement = a;
+});
+/*! End of @composy/kanban-core | Powered by @composy/builder */
+//# sourceMappingURL=index.min.js.map