@middag-io/react 0.12.0 → 0.13.0

package/dist-lib/KanbanBoardBlock-rySahBrC.js

@@ -0,0 +1,399 @@
+import { t as e } from "./utils-DS8lnGJS.js";
+import { t } from "./dist-BVqmxsUH.js";
+import { t as n } from "./badge-CEJlJgBY.js";
+import { _ as r, a as i, c as a, d as o, f as s, g as c, i as l, l as u, m as d, n as f, o as p, r as m, s as h, t as g, u as _, v, y } from "./sortable.esm-0nILrm98.js";
+import { createContext as b, useCallback as x, useContext as S, useLayoutEffect as C, useMemo as w, useState as T } from "react";
+import { router as E } from "@inertiajs/core";
+import { jsx as D, jsxs as O } from "react/jsx-runtime";
+import { createPortal as k } from "react-dom";
+//#region src/components/reui/kanban.tsx
+var A = b({
+	columns: {},
+	setColumns: () => {},
+	getItemId: () => "",
+	columnIds: [],
+	activeId: null,
+	setActiveId: () => {},
+	findContainer: () => void 0,
+	isColumn: () => !1,
+	modifiers: void 0
+}), j = b({
+	attributes: {},
+	listeners: void 0,
+	isDragging: !1,
+	disabled: !1
+}), M = b({
+	listeners: void 0,
+	isDragging: !1,
+	disabled: !1
+}), N = b(!1), P = (e) => m({
+	...e,
+	wasDragging: !0
+}), F = { sideEffects: c({ styles: { active: { opacity: "0.4" } } }) };
+function I({ value: n, onValueChange: c, getItemValue: l, children: u, className: p, asChild: m = !1, onMove: h, modifiers: g, ...y }) {
+	let b = n, S = c, [C, E] = T(null), O = v(r(s, { activationConstraint: { distance: 10 } }), r(d, { activationConstraint: {
+		delay: 250,
+		tolerance: 5
+	} }), r(_, { coordinateGetter: i })), k = w(() => Object.keys(b), [b]), j = x((e) => k.includes(e), [k]), M = x((e) => j(e) ? e : k.find((t) => b[t].some((t) => l(t) === e)), [
+		b,
+		k,
+		l,
+		j
+	]), N = x((e) => {
+		E(e.active.id);
+	}, []), P = x((e) => {
+		if (h) return;
+		let { active: t, over: n } = e;
+		if (!n || j(t.id)) return;
+		let r = M(t.id), i = M(n.id);
+		if (!(!r || !i)) if (r !== i) {
+			let e = b[r], a = b[i], o = e.findIndex((e) => l(e) === t.id), s = a.findIndex((e) => l(e) === n.id);
+			j(n.id) && (s = a.length);
+			let c = [...e], u = [...a], [d] = c.splice(o, 1);
+			u.splice(s, 0, d), S({
+				...b,
+				[r]: c,
+				[i]: u
+			});
+		} else {
+			let e = r, i = b[e].findIndex((e) => l(e) === t.id), a = b[e].findIndex((e) => l(e) === n.id);
+			i !== a && S({
+				...b,
+				[e]: f(b[e], i, a)
+			});
+		}
+	}, [
+		M,
+		l,
+		j,
+		S,
+		b,
+		h
+	]), F = x(() => {
+		E(null);
+	}, []), I = x((e) => {
+		let { active: t, over: n } = e;
+		if (E(null), !n) return;
+		if (h && !j(t.id)) {
+			let r = M(t.id), i = M(n.id);
+			r && i && h({
+				event: e,
+				activeContainer: r,
+				activeIndex: b[r].findIndex((e) => l(e) === t.id),
+				overContainer: i,
+				overIndex: j(n.id) ? b[i].length : b[i].findIndex((e) => l(e) === n.id)
+			});
+			return;
+		}
+		if (j(t.id) && j(n.id)) {
+			let e = k.indexOf(t.id), r = k.indexOf(n.id);
+			if (e !== r) {
+				let t = f(Object.keys(b), e, r), n = {};
+				t.forEach((e) => {
+					n[e] = b[e];
+				}), S(n);
+			}
+			return;
+		}
+		let r = M(t.id), i = M(n.id);
+		if (r && i && r === i) {
+			let e = r, i = b[e].findIndex((e) => l(e) === t.id), a = b[e].findIndex((e) => l(e) === n.id);
+			i !== a && S({
+				...b,
+				[e]: f(b[e], i, a)
+			});
+		}
+	}, [
+		k,
+		b,
+		M,
+		l,
+		j,
+		S,
+		h
+	]), L = w(() => ({
+		columns: b,
+		setColumns: S,
+		getItemId: l,
+		columnIds: k,
+		activeId: C,
+		setActiveId: E,
+		findContainer: M,
+		isColumn: j,
+		modifiers: g
+	}), [
+		b,
+		S,
+		l,
+		k,
+		C,
+		M,
+		j,
+		g
+	]), R = m ? t : "div";
+	return /* @__PURE__ */ D(A.Provider, {
+		value: L,
+		children: /* @__PURE__ */ D(a, {
+			sensors: O,
+			modifiers: g,
+			measuring: { droppable: { strategy: o.Always } },
+			onDragStart: N,
+			onDragOver: P,
+			onDragEnd: I,
+			onDragCancel: F,
+			children: /* @__PURE__ */ D(R, {
+				"data-slot": "kanban",
+				"data-dragging": C !== null,
+				className: e(C !== null && "cursor-grabbing!", p),
+				...y,
+				children: u
+			})
+		})
+	});
+}
+function L({ className: n, asChild: r = !1, children: i, ...a }) {
+	let { columnIds: o } = S(A);
+	return /* @__PURE__ */ D(g, {
+		items: o,
+		strategy: l,
+		children: /* @__PURE__ */ D(r ? t : "div", {
+			"data-slot": "kanban-board",
+			className: e("grid auto-rows-fr gap-4 sm:grid-cols-3", n),
+			...a,
+			children: i
+		})
+	});
+}
+function R({ value: n, className: r, asChild: i = !1, disabled: a, children: o, ...s }) {
+	let c = S(N), { setNodeRef: l, transform: u, transition: d, attributes: f, listeners: m, isDragging: h } = p({
+		id: n,
+		disabled: a || c,
+		animateLayoutChanges: P
+	}), { activeId: g, isColumn: _ } = S(A), v = g ? _(g) : !1, b = {
+		transition: d,
+		transform: y.Transform.toString(u)
+	}, x = i ? t : "div";
+	return c ? /* @__PURE__ */ D(j.Provider, {
+		value: {
+			attributes: {},
+			listeners: void 0,
+			isDragging: !0,
+			disabled: !1
+		},
+		children: /* @__PURE__ */ D(x, {
+			"data-slot": "kanban-column",
+			"data-value": n,
+			"data-dragging": !0,
+			className: e("group/kanban-column flex flex-col", r),
+			...s,
+			children: o
+		})
+	}) : /* @__PURE__ */ D(j.Provider, {
+		value: {
+			attributes: f,
+			listeners: m,
+			isDragging: v,
+			disabled: a
+		},
+		children: /* @__PURE__ */ D(x, {
+			"data-slot": "kanban-column",
+			"data-value": n,
+			"data-dragging": h,
+			"data-disabled": a,
+			ref: l,
+			style: b,
+			className: e("group/kanban-column flex flex-col", h && "z-50 opacity-50", a && "opacity-50", r),
+			...s,
+			children: o
+		})
+	});
+}
+function z({ value: n, className: r, asChild: i = !1, disabled: a, children: o, ...s }) {
+	let c = S(N), { setNodeRef: l, transform: u, transition: d, attributes: f, listeners: m, isDragging: h } = p({
+		id: n,
+		disabled: a || c,
+		animateLayoutChanges: P
+	}), { activeId: g, isColumn: _ } = S(A), v = g ? !_(g) : !1, b = {
+		transition: d,
+		transform: y.Transform.toString(u)
+	}, x = i ? t : "div";
+	return c ? /* @__PURE__ */ D(M.Provider, {
+		value: {
+			listeners: void 0,
+			isDragging: !0,
+			disabled: !1
+		},
+		children: /* @__PURE__ */ D(x, {
+			"data-slot": "kanban-item",
+			"data-value": n,
+			"data-dragging": !0,
+			className: e(r),
+			...s,
+			children: o
+		})
+	}) : /* @__PURE__ */ D(M.Provider, {
+		value: {
+			listeners: m,
+			isDragging: v,
+			disabled: a
+		},
+		children: /* @__PURE__ */ D(x, {
+			"data-slot": "kanban-item",
+			"data-value": n,
+			"data-dragging": h,
+			"data-disabled": a,
+			ref: l,
+			style: b,
+			...f,
+			className: e(h && "z-50 opacity-50", a && "opacity-50", r),
+			...s,
+			children: o
+		})
+	});
+}
+function B({ value: n, className: r, asChild: i = !1, children: a, ...o }) {
+	let { columns: s, getItemId: c } = S(A);
+	return /* @__PURE__ */ D(g, {
+		items: w(() => s[n].map(c), [
+			s,
+			c,
+			n
+		]),
+		strategy: h,
+		children: /* @__PURE__ */ D(i ? t : "div", {
+			"data-slot": "kanban-column-content",
+			className: e("flex flex-col gap-2", r),
+			...o,
+			children: a
+		})
+	});
+}
+function V({ children: t, className: n, ...r }) {
+	let { activeId: i, isColumn: a, modifiers: o } = S(A), [s, c] = T(!1);
+	C(() => c(!0), []);
+	let l = i && a(i) ? "column" : "item", d = i && t ? typeof t == "function" ? t({
+		value: i,
+		variant: l
+	}) : t : null;
+	return s ? k(/* @__PURE__ */ D(u, {
+		dropAnimation: F,
+		modifiers: o,
+		className: e("z-50", i && "cursor-grabbing", n),
+		...r,
+		children: /* @__PURE__ */ D(N.Provider, {
+			value: !0,
+			children: d
+		})
+	}), document.body) : null;
+}
+//#endregion
+//#region src/base/blocks/KanbanBoardBlock.tsx
+var H = {
+	success: "success-light",
+	warning: "warning-light",
+	destructive: "destructive-light",
+	info: "info-light"
+};
+function U({ card: e }) {
+	return /* @__PURE__ */ O("div", {
+		className: "bg-card rounded-lg border p-3 shadow-sm",
+		children: [
+			/* @__PURE__ */ O("div", {
+				className: "flex items-start justify-between gap-2",
+				children: [/* @__PURE__ */ D("p", {
+					className: "text-sm font-medium",
+					children: e.title
+				}), e.status && /* @__PURE__ */ D(n, {
+					variant: H[e.statusIntent ?? ""] ?? "invert-light",
+					size: "sm",
+					children: e.status
+				})]
+			}),
+			e.description && /* @__PURE__ */ D("p", {
+				className: "text-muted-foreground mt-1 line-clamp-2 text-xs",
+				children: e.description
+			}),
+			/* @__PURE__ */ O("div", {
+				className: "mt-2 flex items-center gap-2",
+				children: [e.assignee && /* @__PURE__ */ D("div", {
+					className: "bg-muted text-muted-foreground flex size-5 items-center justify-center rounded-full text-[10px] font-medium",
+					children: e.assignee.charAt(0).toUpperCase()
+				}), e.dueDate && /* @__PURE__ */ D("span", {
+					className: "text-muted-foreground text-[11px]",
+					children: new Date(e.dueDate).toLocaleDateString()
+				})]
+			})
+		]
+	});
+}
+function W({ block: t }) {
+	let { columns: n, moveEndpoint: r } = t.data, [i, a] = T(w(() => {
+		let e = {};
+		for (let t of n) e[t.id] = t.cards;
+		return e;
+	}, [n])), o = w(() => {
+		let e = {};
+		for (let t of n) e[t.id] = t.title;
+		return e;
+	}, [n]), s = x((e) => e.id, []), c = x((e) => {
+		let { activeContainer: t, activeIndex: n, overContainer: o, overIndex: s } = e;
+		a((e) => {
+			let r = { ...e }, i = [...r[t] ?? []], [a] = i.splice(n, 1);
+			if (!a) return e;
+			if (t === o) i.splice(s, 0, a), r[t] = i;
+			else {
+				let e = [...r[o] ?? []];
+				e.splice(s, 0, a), r[t] = i, r[o] = e;
+			}
+			return r;
+		}), r && E.post(r, {
+			cardId: i[t]?.[n]?.id,
+			fromColumn: t,
+			toColumn: o,
+			position: s
+		}, {
+			preserveState: !0,
+			preserveScroll: !0
+		});
+	}, [r, i]), l = x((e) => {
+		for (let t of Object.values(i)) {
+			let n = t.find((t) => t.id === e);
+			if (n) return n;
+		}
+	}, [i]);
+	return /* @__PURE__ */ O(I, {
+		value: i,
+		onValueChange: a,
+		getItemValue: s,
+		onMove: c,
+		children: [/* @__PURE__ */ D(L, {
+			className: e("grid gap-4", `sm:grid-cols-${Math.min(n.length, 4)}`),
+			children: Object.keys(i).map((e) => /* @__PURE__ */ O(R, {
+				value: e,
+				className: "bg-muted/30 rounded-lg p-2",
+				children: [/* @__PURE__ */ O("div", {
+					className: "mb-2 flex items-center justify-between px-1",
+					children: [/* @__PURE__ */ D("h3", {
+						className: "text-sm font-semibold",
+						children: o[e] ?? e
+					}), /* @__PURE__ */ D("span", {
+						className: "text-muted-foreground text-xs",
+						children: i[e]?.length ?? 0
+					})]
+				}), /* @__PURE__ */ D(B, {
+					value: e,
+					className: "min-h-[100px]",
+					children: i[e]?.map((e) => /* @__PURE__ */ D(z, {
+						value: e.id,
+						children: /* @__PURE__ */ D(U, { card: e })
+					}, e.id))
+				})]
+			}, e))
+		}), /* @__PURE__ */ D(V, { children: ({ value: e }) => {
+			let t = l(String(e));
+			return t ? /* @__PURE__ */ D(U, { card: t }) : null;
+		} })]
+	});
+}
+//#endregion
+export { W as KanbanBoardBlock };

package/dist-lib/{MarkdownContent-gyfg0PWC.js → MarkdownContent-DVCptbxx.js}

@@ -1,6 +1,8 @@
 import { i as e, n as t, t as n } from "./chunk-DeC0fbbY.js";
-import { n as r } from "./i18n-BUNFYM_z.js";
-import { _t as i, gt as a, j as o, pt as s, vt as c } from "./index.min-BoVYs6GD.js";
+import { n as r } from "./i18n-CP5eDOjK.js";
+import { P as i, t as a, vt as o } from "./HugeiconsIcon-C_2Bj2NI.js";
+import { t as s } from "./utils-DS8lnGJS.js";
+import { t as c } from "./skeleton-UFUcHob_.js";
 import { useCallback as l, useState as u } from "react";
 import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
 import { router as m } from "@inertiajs/react";
@@ -13328,18 +13330,18 @@ var cl = {
 	}
 };
 function ll({ code: e }) {
-	let { t } = r(), [n, i] = u(!1);
+	let { t } = r(), [n, c] = u(!1);
 	return /* @__PURE__ */ f("button", {
 		type: "button",
 		onClick: l(async () => {
-			await sl(e) && (i(!0), setTimeout(() => i(!1), 2e3));
+			await sl(e) && (c(!0), setTimeout(() => c(!1), 2e3));
 		}, [e]),
 		className: "bg-background/80 absolute top-2 right-2 rounded p-1 opacity-0 transition-opacity group-hover/codeblock:opacity-100 focus:opacity-100",
 		"aria-label": t("middag.ui.markdown.copy_code"),
 		children: /* @__PURE__ */ f(a, {
-			icon: n ? s : o,
+			icon: n ? o : i,
 			size: 14,
-			className: c("transition-colors", n ? "text-success" : "text-muted-foreground hover:text-foreground")
+			className: s("transition-colors", n ? "text-success" : "text-muted-foreground hover:text-foreground")
 		})
 	});
 }
@@ -13434,7 +13436,7 @@ var fl = {
 		});
 	},
 	code: ({ className: e, children: t, ...n }) => e ? /* @__PURE__ */ f("code", {
-		className: c("font-mono text-sm", e),
+		className: s("font-mono text-sm", e),
 		...n,
 		children: t
 	}) : /* @__PURE__ */ f("code", {
@@ -13477,10 +13479,10 @@ function pl() {
 	return /* @__PURE__ */ p("div", {
 		className: "max-w-[720px] space-y-3",
 		children: [
-			/* @__PURE__ */ f(i, { className: "h-4 w-full" }),
-			/* @__PURE__ */ f(i, { className: "h-4 w-5/6" }),
-			/* @__PURE__ */ f(i, { className: "h-4 w-4/6" }),
-			/* @__PURE__ */ f(i, { className: "h-4 w-3/4" })
+			/* @__PURE__ */ f(c, { className: "h-4 w-full" }),
+			/* @__PURE__ */ f(c, { className: "h-4 w-5/6" }),
+			/* @__PURE__ */ f(c, { className: "h-4 w-4/6" }),
+			/* @__PURE__ */ f(c, { className: "h-4 w-3/4" })
 		]
 	});
 }
@@ -13493,7 +13495,7 @@ function ml({ content: e, maxHeight: t, isLoading: n }) {
 			children: i("middag.ui.markdown.no_content")
 		})
 	}) : /* @__PURE__ */ f("div", {
-		className: c("prose-reset max-w-[720px]", t && "overflow-y-auto"),
+		className: s("prose-reset max-w-[720px]", t && "overflow-y-auto"),
 		style: t ? { maxHeight: `${t}px` } : void 0,
 		children: /* @__PURE__ */ f(to, {
 			rehypePlugins: [Bc, [ol, cl]],