@composy/kanban-core 0.0.1

package/lib/core/Renderer.cjs

@@ -0,0 +1,248 @@
+/*!
+* ***********************************
+* @composy/kanban-core v0.0.1     *
+* Built with rollup               *
+* Build time: 2024-08-17 11:33:25 *
+* Build mode: production          *
+* Minified: No                    *
+* ***********************************
+*/
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_dom = require("../utils/dom.cjs");
+//#region src/core/Renderer.ts
+var Renderer = class {
+	constructor(container, events, dragController, options) {
+		this.boardEl = null;
+		this.columnElements = /* @__PURE__ */ new Map();
+		this.columnBodyElements = /* @__PURE__ */ new Map();
+		this.cardElements = /* @__PURE__ */ 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 = require_dom.createElement("div", `${p}-board`);
+		this.boardEl.setAttribute("data-kanban-board", "");
+		const columnsContainer = require_dom.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 = require_dom.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 = require_dom.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 = require_dom.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 = require_dom.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 = require_dom.createElement("div", `${p}-column-header`);
+		if (this.options.columnHeaderRenderer) {
+			this.options.columnHeaderRenderer(column, header);
+			return header;
+		}
+		if (this.options.columnDraggable !== false) {
+			const handle = require_dom.createElement("span", `${p}-column-drag-handle`);
+			handle.innerHTML = "&#8942;&#8942;";
+			handle.title = "拖拽排序";
+			header.appendChild(handle);
+		}
+		if (column.color) {
+			const indicator = require_dom.createElement("span", `${p}-column-color`);
+			indicator.style.backgroundColor = column.color;
+			header.appendChild(indicator);
+		}
+		const titleEl = require_dom.createElement("span", `${p}-column-title`);
+		titleEl.textContent = column.title;
+		header.appendChild(titleEl);
+		if (this.options.showCardCount !== false) {
+			const count = require_dom.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 = require_dom.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 = require_dom.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 = require_dom.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 = require_dom.createElement("div", `${p}-card-priority ${p}-card-priority--${card.priority}`);
+			cardEl.appendChild(priorityEl);
+		}
+		if (card.labels?.length) {
+			const labelsEl = require_dom.createElement("div", `${p}-card-labels`);
+			for (const label of card.labels) {
+				const labelEl = require_dom.createElement("span", `${p}-card-label`);
+				labelEl.style.backgroundColor = label.color;
+				labelEl.textContent = label.name;
+				labelsEl.appendChild(labelEl);
+			}
+			cardEl.appendChild(labelsEl);
+		}
+		const titleEl = require_dom.createElement("div", `${p}-card-title`);
+		titleEl.textContent = card.title;
+		cardEl.appendChild(titleEl);
+		if (card.description) {
+			const descEl = require_dom.createElement("div", `${p}-card-desc`);
+			descEl.textContent = card.description;
+			cardEl.appendChild(descEl);
+		}
+		if (card.assignees?.length || card.dueDate) {
+			const footer = require_dom.createElement("div", `${p}-card-footer`);
+			if (card.assignees?.length) {
+				const assigneesEl = require_dom.createElement("div", `${p}-card-assignees`);
+				for (const assignee of card.assignees.slice(0, 3)) {
+					const avatar = require_dom.createElement("span", `${p}-card-avatar`);
+					avatar.textContent = assignee.charAt(0).toUpperCase();
+					avatar.title = assignee;
+					assigneesEl.appendChild(avatar);
+				}
+				if (card.assignees.length > 3) {
+					const more = require_dom.createElement("span", `${p}-card-avatar-more`);
+					more.textContent = `+${card.assignees.length - 3}`;
+					assigneesEl.appendChild(more);
+				}
+				footer.appendChild(assigneesEl);
+			}
+			if (card.dueDate) {
+				const dueEl = require_dom.createElement("span", `${p}-card-due`);
+				const date = new Date(card.dueDate);
+				dueEl.textContent = `${date.getMonth() + 1}/${date.getDate()}`;
+				if (date < /* @__PURE__ */ 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;
+	}
+	/**
+	* 清理 DOM
+	*/
+	cleanup() {
+		this.columnElements.clear();
+		this.columnBodyElements.clear();
+		this.cardElements.clear();
+		if (this.boardEl) {
+			this.boardEl.remove();
+			this.boardEl = null;
+		}
+	}
+	/**
+	* 销毁
+	*/
+	destroy() {
+		this.cleanup();
+	}
+};
+//#endregion
+exports.Renderer = Renderer;
+/*! End of @composy/kanban-core | Powered by @composy/builder */
+//# sourceMappingURL=Renderer.cjs.map

package/lib/core/Renderer.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Renderer.cjs","names":[],"sources":["../../src/core/Renderer.ts"],"sourcesContent":["import type { Column, Card, KanbanOptions } from '../types';\nimport { createElement } from '../utils/dom';\nimport { EventEmitter } from './EventEmitter';\nimport { DragController } from './DragController';\n\n/**\n * DOM 渲染器\n */\nexport class Renderer {\n  private container: HTMLElement;\n  private boardEl: HTMLElement | null = null;\n  private events: EventEmitter;\n  private dragController: DragController;\n  private options: KanbanOptions;\n  private prefix: string;\n  private columnElements = new Map<string, HTMLElement>();\n  private columnBodyElements = new Map<string, HTMLElement>();\n  private cardElements = new Map<string, HTMLElement>();\n\n  constructor(\n    container: HTMLElement,\n    events: EventEmitter,\n    dragController: DragController,\n    options: KanbanOptions,\n  ) {\n    this.container = container;\n    this.events = events;\n    this.dragController = dragController;\n    this.options = options;\n    this.prefix = options.classPrefix || 'kanban';\n  }\n\n  /**\n   * 渲染整个看板\n   */\n  render(columns: Column[], hiddenCardIds?: Set<string>): void {\n    this.cleanup();\n\n    // 清除容器中残留的旧看板元素（HMR / 重复渲染保护）\n    const staleBoards = this.container.querySelectorAll('[data-kanban-board]');\n    staleBoards.forEach(el => el.remove());\n\n    const p = this.prefix;\n    this.boardEl = createElement('div', `${p}-board`);\n    this.boardEl.setAttribute('data-kanban-board', '');\n\n    // 列容器\n    const columnsContainer = createElement('div', `${p}-columns`);\n\n    for (const column of columns) {\n      const colEl = this.renderColumn(column, hiddenCardIds);\n      columnsContainer.appendChild(colEl);\n    }\n\n    // 添加列按钮\n    if (this.options.showAddColumn !== false) {\n      const addColBtn = createElement('div', `${p}-add-column`);\n      addColBtn.innerHTML = `<button class=\"${p}-add-column-btn\">+ 添加列</button>`;\n      addColBtn.querySelector('button')!.addEventListener('click', () => {\n        this.events.emit('ui:add-column');\n      });\n      columnsContainer.appendChild(addColBtn);\n    }\n\n    this.boardEl.appendChild(columnsContainer);\n    this.container.appendChild(this.boardEl);\n  }\n\n  /**\n   * 渲染单个列\n   */\n  private renderColumn(column: Column, hiddenCardIds?: Set<string>): HTMLElement {\n    const p = this.prefix;\n    const colEl = createElement('div', `${p}-column`, { 'data-column-id': column.id });\n    if (column.collapsed) colEl.classList.add(`${p}-column--collapsed`);\n\n    // 列头部\n    const header = this.renderColumnHeader(column);\n    colEl.appendChild(header);\n\n    // 列内容\n    const body = createElement('div', `${p}-column-body`);\n    body.dataset.columnId = column.id;\n\n    if (!column.collapsed) {\n      const visibleCards = column.cards\n        .filter(card => !hiddenCardIds || !hiddenCardIds.has(card.id))\n        .sort((a, b) => a.order - b.order);\n\n      for (const card of visibleCards) {\n        const cardEl = this.renderCard(card, column.id);\n        body.appendChild(cardEl);\n      }\n\n      // 添加卡片按钮\n      if (this.options.showAddCard !== false) {\n        const addBtn = createElement('div', `${p}-add-card`);\n        addBtn.innerHTML = `<button class=\"${p}-add-card-btn\">+ 添加卡片</button>`;\n        addBtn.querySelector('button')!.addEventListener('click', () => {\n          this.events.emit('ui:add-card', { columnId: column.id });\n        });\n        body.appendChild(addBtn);\n      }\n\n      // 启用列内拖拽放置\n      if (this.options.draggable !== false) {\n        this.dragController.enableColumnDrop(body, column.id);\n      }\n    }\n\n    colEl.appendChild(body);\n\n    // 列拖拽\n    if (this.options.columnDraggable !== false && this.boardEl) {\n      const dragHandle = header.querySelector(`.${p}-column-drag-handle`) as HTMLElement;\n      if (dragHandle) {\n        this.dragController.enableColumnDrag(colEl, dragHandle, column.id, this.boardEl!);\n      }\n    }\n\n    this.columnElements.set(column.id, colEl);\n    this.columnBodyElements.set(column.id, body);\n\n    return colEl;\n  }\n\n  /**\n   * 渲染列头部\n   */\n  private renderColumnHeader(column: Column): HTMLElement {\n    const p = this.prefix;\n    const header = createElement('div', `${p}-column-header`);\n\n    if (this.options.columnHeaderRenderer) {\n      this.options.columnHeaderRenderer(column, header);\n      return header;\n    }\n\n    // 拖拽手柄\n    if (this.options.columnDraggable !== false) {\n      const handle = createElement('span', `${p}-column-drag-handle`);\n      handle.innerHTML = '&#8942;&#8942;';\n      handle.title = '拖拽排序';\n      header.appendChild(handle);\n    }\n\n    // 颜色指示器\n    if (column.color) {\n      const indicator = createElement('span', `${p}-column-color`);\n      indicator.style.backgroundColor = column.color;\n      header.appendChild(indicator);\n    }\n\n    // 标题\n    const titleEl = createElement('span', `${p}-column-title`);\n    titleEl.textContent = column.title;\n    header.appendChild(titleEl);\n\n    // 卡片计数\n    if (this.options.showCardCount !== false) {\n      const count = createElement('span', `${p}-column-count`);\n      const wipText = column.wipLimit ? `/${column.wipLimit}` : '';\n      count.textContent = `${column.cards.length}${wipText}`;\n      if (column.wipLimit && column.cards.length >= column.wipLimit) {\n        count.classList.add(`${p}-column-count--limit`);\n      }\n      header.appendChild(count);\n    }\n\n    // 折叠按钮\n    const collapseBtn = createElement('button', `${p}-column-collapse-btn`);\n    collapseBtn.innerHTML = column.collapsed ? '&#9654;' : '&#9660;';\n    collapseBtn.title = column.collapsed ? '展开' : '折叠';\n    collapseBtn.addEventListener('click', () => {\n      this.events.emit('ui:toggle-collapse', { columnId: column.id });\n    });\n    header.appendChild(collapseBtn);\n\n    // 操作菜单\n    if (this.options.showColumnActions !== false) {\n      const actions = createElement('button', `${p}-column-actions-btn`);\n      actions.innerHTML = '&#8943;';\n      actions.title = '更多操作';\n      actions.addEventListener('click', (e) => {\n        e.stopPropagation();\n        this.events.emit('ui:column-actions', { columnId: column.id, event: e });\n      });\n      header.appendChild(actions);\n    }\n\n    return header;\n  }\n\n  /**\n   * 渲染单张卡片\n   */\n  private renderCard(card: Card, columnId: string): HTMLElement {\n    const p = this.prefix;\n    const cardEl = createElement('div', `${p}-card`, { 'data-card-id': card.id });\n\n    if (this.options.cardRenderer) {\n      this.options.cardRenderer(card, cardEl);\n    } else {\n      this.renderDefaultCard(card, cardEl);\n    }\n\n    // 启用卡片拖拽\n    if (this.options.draggable !== false) {\n      this.dragController.enableCardDrag(cardEl, card.id, columnId);\n    }\n\n    // 点击事件\n    cardEl.addEventListener('click', () => {\n      this.events.emit('card:click', { card });\n    });\n\n    this.cardElements.set(card.id, cardEl);\n    return cardEl;\n  }\n\n  /**\n   * 默认卡片渲染\n   */\n  private renderDefaultCard(card: Card, cardEl: HTMLElement): void {\n    const p = this.prefix;\n\n    // 优先级指示器\n    if (card.priority) {\n      const priorityEl = createElement('div', `${p}-card-priority ${p}-card-priority--${card.priority}`);\n      cardEl.appendChild(priorityEl);\n    }\n\n    // 标签\n    if (card.labels?.length) {\n      const labelsEl = createElement('div', `${p}-card-labels`);\n      for (const label of card.labels) {\n        const labelEl = createElement('span', `${p}-card-label`);\n        labelEl.style.backgroundColor = label.color;\n        labelEl.textContent = label.name;\n        labelsEl.appendChild(labelEl);\n      }\n      cardEl.appendChild(labelsEl);\n    }\n\n    // 标题\n    const titleEl = createElement('div', `${p}-card-title`);\n    titleEl.textContent = card.title;\n    cardEl.appendChild(titleEl);\n\n    // 描述\n    if (card.description) {\n      const descEl = createElement('div', `${p}-card-desc`);\n      descEl.textContent = card.description;\n      cardEl.appendChild(descEl);\n    }\n\n    // 底部信息栏\n    const hasFooter = card.assignees?.length || card.dueDate;\n    if (hasFooter) {\n      const footer = createElement('div', `${p}-card-footer`);\n\n      if (card.assignees?.length) {\n        const assigneesEl = createElement('div', `${p}-card-assignees`);\n        for (const assignee of card.assignees.slice(0, 3)) {\n          const avatar = createElement('span', `${p}-card-avatar`);\n          avatar.textContent = assignee.charAt(0).toUpperCase();\n          avatar.title = assignee;\n          assigneesEl.appendChild(avatar);\n        }\n        if (card.assignees.length > 3) {\n          const more = createElement('span', `${p}-card-avatar-more`);\n          more.textContent = `+${card.assignees.length - 3}`;\n          assigneesEl.appendChild(more);\n        }\n        footer.appendChild(assigneesEl);\n      }\n\n      if (card.dueDate) {\n        const dueEl = createElement('span', `${p}-card-due`);\n        const date = new Date(card.dueDate);\n        dueEl.textContent = `${date.getMonth() + 1}/${date.getDate()}`;\n        const now = new Date();\n        if (date < now) dueEl.classList.add(`${p}-card-due--overdue`);\n        footer.appendChild(dueEl);\n      }\n\n      cardEl.appendChild(footer);\n    }\n  }\n\n  /**\n   * 获取列元素\n   */\n  getColumnElement(columnId: string): HTMLElement | undefined {\n    return this.columnElements.get(columnId);\n  }\n\n  /**\n   * 获取卡片元素\n   */\n  getCardElement(cardId: string): HTMLElement | undefined {\n    return this.cardElements.get(cardId);\n  }\n\n  /**\n   * 获取看板根元素\n   */\n  getBoardElement(): HTMLElement | null {\n    return this.boardEl;\n  }\n\n  /**\n   * 清理 DOM\n   */\n  private cleanup(): void {\n    this.columnElements.clear();\n    this.columnBodyElements.clear();\n    this.cardElements.clear();\n    if (this.boardEl) {\n      this.boardEl.remove();\n      this.boardEl = null;\n    }\n  }\n\n  /**\n   * 销毁\n   */\n  destroy(): void {\n    this.cleanup();\n  }\n}\n"],"mappings":"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"}

package/lib/core/Renderer.d.ts

@@ -0,0 +1,59 @@
+import type { Column, KanbanOptions } from '../types';
+import { EventEmitter } from './EventEmitter';
+import { DragController } from './DragController';
+/**
+ * DOM 渲染器
+ */
+export declare class Renderer {
+    private container;
+    private boardEl;
+    private events;
+    private dragController;
+    private options;
+    private prefix;
+    private columnElements;
+    private columnBodyElements;
+    private cardElements;
+    constructor(container: HTMLElement, events: EventEmitter, dragController: DragController, options: KanbanOptions);
+    /**
+     * 渲染整个看板
+     */
+    render(columns: Column[], hiddenCardIds?: Set<string>): void;
+    /**
+     * 渲染单个列
+     */
+    private renderColumn;
+    /**
+     * 渲染列头部
+     */
+    private renderColumnHeader;
+    /**
+     * 渲染单张卡片
+     */
+    private renderCard;
+    /**
+     * 默认卡片渲染
+     */
+    private renderDefaultCard;
+    /**
+     * 获取列元素
+     */
+    getColumnElement(columnId: string): HTMLElement | undefined;
+    /**
+     * 获取卡片元素
+     */
+    getCardElement(cardId: string): HTMLElement | undefined;
+    /**
+     * 获取看板根元素
+     */
+    getBoardElement(): HTMLElement | null;
+    /**
+     * 清理 DOM
+     */
+    private cleanup;
+    /**
+     * 销毁
+     */
+    destroy(): void;
+}
+//# sourceMappingURL=Renderer.d.ts.map

package/lib/core/index.cjs

@@ -0,0 +1,24 @@
+/*!
+* ***********************************
+* @composy/kanban-core v0.0.1     *
+* Built with rollup               *
+* Build time: 2024-08-17 11:33:25 *
+* Build mode: production          *
+* Minified: No                    *
+* ***********************************
+*/
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_ColumnManager = require("./ColumnManager.cjs");
+const require_DragController = require("./DragController.cjs");
+const require_EventEmitter = require("./EventEmitter.cjs");
+const require_FilterEngine = require("./FilterEngine.cjs");
+const require_Renderer = require("./Renderer.cjs");
+const require_KanbanBoard = require("./KanbanBoard.cjs");
+exports.ColumnManager = require_ColumnManager.ColumnManager;
+exports.DragController = require_DragController.DragController;
+exports.EventEmitter = require_EventEmitter.EventEmitter;
+exports.FilterEngine = require_FilterEngine.FilterEngine;
+exports.KanbanBoard = require_KanbanBoard.KanbanBoard;
+exports.Renderer = require_Renderer.Renderer;
+exports.createKanbanBoard = require_KanbanBoard.createKanbanBoard;
+/*! End of @composy/kanban-core | Powered by @composy/builder */

package/lib/core/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @file index.ts
+ * @description index 模块
+ */
+export { KanbanBoard, createKanbanBoard } from './KanbanBoard';
+export { EventEmitter, type EventHandler } from './EventEmitter';
+export { ColumnManager } from './ColumnManager';
+export { DragController, type DragState } from './DragController';
+export { FilterEngine } from './FilterEngine';
+export { Renderer } from './Renderer';
+//# sourceMappingURL=index.d.ts.map

package/lib/index.cjs

@@ -0,0 +1,37 @@
+/*!
+* ***********************************
+* @composy/kanban-core v0.0.1     *
+* Built with rollup               *
+* Build time: 2024-08-17 11:33:25 *
+* Build mode: production          *
+* Minified: No                    *
+* ***********************************
+*/
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_id = require("./utils/id.cjs");
+const require_ColumnManager = require("./core/ColumnManager.cjs");
+const require_DragController = require("./core/DragController.cjs");
+const require_EventEmitter = require("./core/EventEmitter.cjs");
+const require_FilterEngine = require("./core/FilterEngine.cjs");
+const require_dom = require("./utils/dom.cjs");
+const require_Renderer = require("./core/Renderer.cjs");
+const require_version = require("./version.cjs");
+const require_KanbanBoard = require("./core/KanbanBoard.cjs");
+const require_index = require("./utils/index.cjs");
+exports.ColumnManager = require_ColumnManager.ColumnManager;
+exports.DragController = require_DragController.DragController;
+exports.EventEmitter = require_EventEmitter.EventEmitter;
+exports.FilterEngine = require_FilterEngine.FilterEngine;
+exports.KanbanBoard = require_KanbanBoard.KanbanBoard;
+exports.Renderer = require_Renderer.Renderer;
+exports.VERSION = require_version.VERSION;
+exports.clearElement = require_dom.clearElement;
+exports.createElement = require_dom.createElement;
+exports.createKanbanBoard = require_KanbanBoard.createKanbanBoard;
+exports.generateId = require_id.generateId;
+exports.getElement = require_index.getElement;
+exports.insertAt = require_dom.insertAt;
+exports.removeElement = require_dom.removeElement;
+exports.resetIdCounter = require_id.resetIdCounter;
+exports.resolveElement = require_dom.resolveElement;
+/*! End of @composy/kanban-core | Powered by @composy/builder */

package/lib/index.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @composy/kanban-core
+ * 看板视图库，支持拖拽卡片与列管理
+ */
+import './styles/kanban.less';
+export type { Label, Card, Column, Board, KanbanOptions, KanbanEventMap, FilterCriteria, BoardData, } from './types';
+export { KanbanBoard, createKanbanBoard } from './core/KanbanBoard';
+export { EventEmitter, type EventHandler } from './core/EventEmitter';
+export { ColumnManager } from './core/ColumnManager';
+export { DragController, type DragState } from './core/DragController';
+export { FilterEngine } from './core/FilterEngine';
+export { Renderer } from './core/Renderer';
+export * from './utils';
+export { VERSION } from './version';
+//# sourceMappingURL=index.d.ts.map

package/lib/package.json

@@ -0,0 +1,3 @@
+{
+  "type": "commonjs"
+}