import { t as e } from "../../utils-B7XIe3qq.js";
import * as t from "react";
import { jsx as n, jsxs as r } from "react/jsx-runtime";
//#region src/react/primitives/kanban.tsx
var i = {
	critical: "border-l-accent-rose border-l-2",
	high: "border-l-accent-amber border-l-2",
	medium: "border-l-accent-cyan border-l-2",
	low: "border-l-accent-violet border-l-2"
};
function a({ card: a, columnId: o, isDraggable: s, descriptionMaxLength: c, maxLabels: l, onClick: u, onDragStart: d }) {
	let f = (e) => {
		e.dataTransfer.effectAllowed = "move", e.dataTransfer.setData("text/plain", a.id), d(a.id, o);
	}, p = a.description && a.description.length > c ? a.description.slice(0, c) + "..." : a.description, m = t.useMemo(() => a.completionPercentage === void 0 ? a.subtaskCount && a.subtaskCount > 0 ? (a.subtaskCompleted ?? 0) / a.subtaskCount * 100 : null : a.completionPercentage, [
		a.completionPercentage,
		a.subtaskCount,
		a.subtaskCompleted
	]);
	return /* @__PURE__ */ r("div", {
		className: e("bg-glass border-border-glass rounded-lg border p-3 backdrop-blur-[20px] transition-all", "hover:border-border-glass/80 cursor-pointer hover:shadow-sm", a.priority && i[a.priority]),
		draggable: s,
		onDragStart: s ? f : void 0,
		onClick: () => u?.(a),
		role: "listitem",
		tabIndex: 0,
		children: [
			(a.issueKey || a.issueType || a.storyPoints !== void 0) && /* @__PURE__ */ r("div", {
				className: "text-foreground-secondary mb-1.5 flex items-center gap-2 text-xs",
				children: [
					a.issueKey && /* @__PURE__ */ n("span", {
						className: "font-medium",
						children: a.issueKey
					}),
					a.issueType && /* @__PURE__ */ n("span", { children: a.issueType }),
					a.storyPoints !== void 0 && /* @__PURE__ */ n("span", {
						className: "bg-surface-secondary rounded-full px-1.5 py-0.5 text-[10px]",
						children: a.storyPoints
					})
				]
			}),
			/* @__PURE__ */ n("div", {
				className: "text-foreground text-sm font-medium",
				children: a.title
			}),
			p && /* @__PURE__ */ n("div", {
				className: "text-foreground-secondary mt-1 text-xs",
				children: p
			}),
			m !== null && /* @__PURE__ */ n("div", {
				className: "bg-surface-secondary mt-2 h-1 rounded-full",
				children: /* @__PURE__ */ n("div", {
					className: "bg-accent-cyan h-full rounded-full transition-all",
					style: { width: `${Math.round(m)}%` }
				})
			}),
			a.dueDate && /* @__PURE__ */ n("div", {
				className: "text-foreground-secondary mt-1.5 text-xs",
				children: a.dueDate instanceof Date ? a.dueDate.toLocaleDateString() : a.dueDate
			}),
			a.assignees && a.assignees.length > 0 && /* @__PURE__ */ r("div", {
				className: "mt-2 flex -space-x-1",
				children: [a.assignees.slice(0, 3).map((e) => /* @__PURE__ */ n("div", {
					title: e.name,
					className: "bg-surface-secondary text-foreground-secondary flex size-6 items-center justify-center rounded-full border border-white/10 text-[10px] font-medium",
					style: e.avatarUrl ? {
						backgroundImage: `url(${e.avatarUrl})`,
						backgroundSize: "cover"
					} : void 0,
					children: !e.avatarUrl && e.name.charAt(0).toUpperCase()
				}, e.id)), a.assignees.length > 3 && /* @__PURE__ */ r("span", {
					className: "text-foreground-secondary ml-1 text-xs",
					children: ["+", a.assignees.length - 3]
				})]
			}),
			a.labels && a.labels.length > 0 && /* @__PURE__ */ r("div", {
				className: "mt-2 flex flex-wrap gap-1",
				children: [a.labels.slice(0, l).map((e, t) => /* @__PURE__ */ n("span", {
					className: "rounded-full px-2 py-0.5 text-[10px] font-medium text-white",
					style: { backgroundColor: e.color },
					children: e.text
				}, t)), a.labels.length > l && /* @__PURE__ */ r("span", {
					className: "text-foreground-secondary text-[10px]",
					children: ["+", a.labels.length - l]
				})]
			}),
			!a.assignees?.length && a.assignee && /* @__PURE__ */ n("div", {
				className: "text-foreground-secondary mt-2 text-xs",
				children: a.assignee
			})
		]
	});
}
function o({ column: i, isDraggable: o, descriptionMaxLength: s, maxLabels: c, onCardClick: l, onAddCard: u, onDragStart: d, onDrop: f }) {
	let [p, m] = t.useState(i.collapsed ?? !1), [h, g] = t.useState(!1), _ = i.limit !== void 0 && i.cards.length >= i.limit;
	return /* @__PURE__ */ r("div", {
		className: e("bg-surface-secondary/50 flex min-w-[280px] shrink-0 flex-col rounded-lg", _ && "border-accent-amber/30 border"),
		children: [/* @__PURE__ */ r("div", {
			className: "flex items-center gap-2 px-3 py-2.5",
			style: i.color ? {
				borderTop: `3px solid ${i.color}`,
				borderRadius: "8px 8px 0 0"
			} : void 0,
			children: [
				/* @__PURE__ */ n("span", {
					className: "text-foreground text-sm font-semibold",
					children: i.title
				}),
				/* @__PURE__ */ r("span", {
					className: e("text-foreground-secondary text-xs", _ && "text-accent-amber"),
					children: [i.cards.length, i.limit !== void 0 && ` / ${i.limit}`]
				}),
				/* @__PURE__ */ r("div", {
					className: "ml-auto flex items-center gap-1",
					children: [i.collapsible && /* @__PURE__ */ n("button", {
						onClick: () => m(!p),
						className: "text-foreground-secondary hover:text-foreground text-xs",
						children: p ? "+" : "-"
					}), i.addButton && /* @__PURE__ */ n("button", {
						onClick: () => u?.(i.id),
						className: "text-foreground-secondary hover:text-foreground text-xs",
						children: "+"
					})]
				})
			]
		}), !p && /* @__PURE__ */ r("div", {
			className: e("flex flex-1 flex-col gap-2 px-2 pb-2", h && "bg-accent-cyan/5 rounded-b-lg"),
			onDragOver: o ? (e) => {
				e.preventDefault(), e.dataTransfer.dropEffect = "move", g(!0);
			} : void 0,
			onDragLeave: o ? (e) => {
				let t = e.relatedTarget;
				t instanceof Node && e.currentTarget.contains(t) || g(!1);
			} : void 0,
			onDrop: o ? (e) => {
				e.preventDefault(), g(!1);
				let t = e.currentTarget.querySelectorAll("[role=\"listitem\"]"), n = t.length;
				for (let r = 0; r < t.length; r++) {
					let i = t[r]?.getBoundingClientRect();
					if (i && e.clientY < i.top + i.height / 2) {
						n = r;
						break;
					}
				}
				f(i.id, n);
			} : void 0,
			children: [i.cards.length === 0 && i.emptyMessage && /* @__PURE__ */ n("div", {
				className: "text-foreground-secondary py-4 text-center text-xs",
				children: i.emptyMessage
			}), i.cards.map((e) => /* @__PURE__ */ n(a, {
				card: e,
				columnId: i.id,
				isDraggable: o,
				descriptionMaxLength: s,
				maxLabels: c,
				onClick: l,
				onDragStart: d
			}, e.id))]
		})]
	});
}
function s({ columns: r, draggable: i = !0, onCardMove: a, onCardClick: s, onAddCard: c, descriptionMaxLength: l = 100, maxLabels: u = 3, className: d, ...f }) {
	let [p, m] = t.useState(r), h = t.useRef(null);
	t.useEffect(() => {
		m(r);
	}, [r]);
	let g = t.useCallback((e, t) => {
		h.current = {
			cardId: e,
			fromColumnId: t
		};
	}, []), _ = t.useCallback((e, t) => {
		let n = h.current;
		if (!n) return;
		h.current = null;
		let { cardId: r, fromColumnId: i } = n;
		m((n) => {
			let a = n.map((e) => ({
				...e,
				cards: [...e.cards]
			})), o = a.find((e) => e.id === i), s = a.find((t) => t.id === e);
			if (!o || !s) return n;
			let c = o.cards.findIndex((e) => e.id === r);
			if (c < 0) return n;
			let [l] = o.cards.splice(c, 1);
			if (!l) return n;
			let u = Math.min(t, s.cards.length);
			return s.cards.splice(u, 0, l), a;
		}), a?.(r, i, e, t);
	}, [a]);
	return /* @__PURE__ */ n("div", {
		"data-slot": "kanban-board",
		className: e("flex gap-4 overflow-x-auto p-2", d),
		...f,
		children: p.map((e) => /* @__PURE__ */ n(o, {
			column: e,
			isDraggable: i,
			descriptionMaxLength: l,
			maxLabels: u,
			onCardClick: s,
			onAddCard: c,
			onDragStart: g,
			onDrop: _
		}, e.id))
	});
}
s.displayName = "KanbanBoard";
//#endregion
export { s as KanbanBoard, a as KanbanCard, o as KanbanColumn };

//# sourceMappingURL=kanban.js.map