@thebuoyant-tsdev/mui-ts-library 3.15.0 → 3.17.0

package/dist/components/gantt-chart/GanttTaskDialog.js

@@ -1,24 +1,24 @@
 import { getDependencyCycleCandidates as e } from "./util/gantt-chart.util.js";
 import { useGanttChartStore as t, useGanttTranslations as n } from "./GanttChart.js";
 import { useEffect as r, useMemo as i, useRef as a, useState as o } from "react";
-import { Box as s, Button as c, Checkbox as l, Dialog as u, DialogActions as d, DialogContent as f, DialogTitle as p, FormControl as m, FormControlLabel as h, InputLabel as g, MenuItem as _, Select as v, TextField as y, Tooltip as b, Typography as x } from "@mui/material";
-import { jsx as S, jsxs as C } from "react/jsx-runtime";
+import { Box as s, Button as c, Checkbox as l, Dialog as u, DialogActions as d, DialogContent as f, DialogTitle as p, FormControl as m, FormControlLabel as h, InputLabel as g, MenuItem as _, Select as v, Slider as y, TextField as b, Tooltip as x, Typography as S } from "@mui/material";
+import { jsx as C, jsxs as w } from "react/jsx-runtime";
 //#region src/components/gantt-chart/GanttTaskDialog.tsx
-function w(e) {
+function T(e) {
 	return e.toISOString().slice(0, 10);
 }
-function T(e, t, n) {
+function E(e, t, n) {
 	return e < t ? t : e > n ? n : e;
 }
-function E(e) {
-	return e.flatMap((e) => [e, ...E(e.children)]);
+function D(e) {
+	return e.flatMap((e) => [e, ...D(e.children)]);
 }
-function D({ label: e }) {
+function O({ label: e }) {
 	let t = a(null), [n, r] = o(!1);
-	return /* @__PURE__ */ S(b, {
+	return /* @__PURE__ */ C(x, {
 		title: e,
 		disableHoverListener: !n,
-		children: /* @__PURE__ */ S(x, {
+		children: /* @__PURE__ */ C(S, {
 			ref: t,
 			component: "span",
 			variant: "body2",
@@ -36,106 +36,111 @@ function D({ label: e }) {
 		})
 	});
 }
-function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, onClose: j }) {
-	let M = n(), N = t((e) => e.taskTree), P = t((e) => e.timelineRange), F = i(() => E(N), [N]), I = i(() => {
-		if (b === "add" || !O) return /* @__PURE__ */ new Set();
-		let e = (t) => [t.id, ...t.children.flatMap(e)], t = F.find((e) => e.id === O.id);
-		return new Set(t ? e(t) : [O.id]);
+function k({ open: a, mode: x, initialTask: k, defaultParentId: A, onSave: j, onClose: M }) {
+	let N = n(), P = t((e) => e.taskTree), F = t((e) => e.timelineRange), I = i(() => D(P), [P]), L = i(() => {
+		if (x === "add" || !k) return /* @__PURE__ */ new Set();
+		let e = (t) => [t.id, ...t.children.flatMap(e)], t = I.find((e) => e.id === k.id);
+		return new Set(t ? e(t) : [k.id]);
 	}, [
-		b,
-		O,
-		F
-	]), L = F.filter((e) => !I.has(e.id)), R = i(() => b === "add" || !O ? /* @__PURE__ */ new Set() : e(F, O.id), [
-		b,
-		O,
-		F
-	]), z = L.filter((e) => !R.has(e.id)), B = w(T(/* @__PURE__ */ new Date(), P.start, P.end)), [V, H] = o({
+		x,
+		k,
+		I
+	]), R = I.filter((e) => !L.has(e.id)), z = i(() => x === "add" || !k ? /* @__PURE__ */ new Set() : e(I, k.id), [
+		x,
+		k,
+		I
+	]), B = R.filter((e) => !z.has(e.id)), V = T(E(/* @__PURE__ */ new Date(), F.start, F.end)), [H, U] = o({
 		name: "",
-		startDate: B,
-		endDate: B,
+		startDate: V,
+		endDate: V,
 		status: "planned",
 		isMilestone: !1,
+		progress: 0,
 		parentId: "",
 		dependencies: [],
 		assignee: ""
 	});
 	r(() => {
 		if (!a) return;
-		let e = w(T(/* @__PURE__ */ new Date(), P.start, P.end));
-		H(b === "edit" && O ? {
-			name: O.name,
-			startDate: w(O.startDate),
-			endDate: w(O.endDate),
-			status: O.status,
-			isMilestone: O.isMilestone ?? !1,
-			parentId: O.parentId ?? "",
-			dependencies: O.dependencies ?? [],
-			assignee: O.assignee ?? ""
+		let e = T(E(/* @__PURE__ */ new Date(), F.start, F.end));
+		U(x === "edit" && k ? {
+			name: k.name,
+			startDate: T(k.startDate),
+			endDate: T(k.endDate),
+			status: k.status,
+			isMilestone: k.isMilestone ?? !1,
+			progress: k.progress ?? 0,
+			parentId: k.parentId ?? "",
+			dependencies: k.dependencies ?? [],
+			assignee: k.assignee ?? ""
 		} : {
 			name: "",
 			startDate: e,
 			endDate: e,
 			status: "planned",
 			isMilestone: !1,
-			parentId: k ?? "",
+			progress: 0,
+			parentId: A ?? "",
 			dependencies: [],
 			assignee: ""
 		});
 	}, [
 		a,
-		b,
-		O,
+		x,
 		k,
-		P
+		A,
+		F
 	]);
-	let U = (e) => {
-		H((t) => ({
+	let W = (e) => {
+		U((t) => ({
 			...t,
 			startDate: e,
 			endDate: t.isMilestone || t.endDate < e ? e : t.endDate
 		}));
-	}, W = (e) => {
-		H((t) => ({
+	}, G = (e) => {
+		U((t) => ({
 			...t,
 			endDate: e < t.startDate ? t.startDate : e
 		}));
-	}, G = (e) => {
-		H((t) => ({
+	}, K = (e) => {
+		U((t) => ({
 			...t,
 			isMilestone: e,
-			endDate: e ? t.startDate : t.endDate
+			endDate: e ? t.startDate : t.endDate,
+			progress: e ? 0 : t.progress
 		}));
-	}, K = V.name.trim() !== "" && V.startDate !== "" && V.endDate !== "" && V.endDate >= V.startDate, q = () => {
-		K && A({
-			name: V.name.trim(),
-			startDate: new Date(V.startDate),
-			endDate: new Date(V.endDate),
-			status: V.status,
-			isMilestone: V.isMilestone || void 0,
-			parentId: V.parentId || void 0,
-			dependencies: V.dependencies.length > 0 ? V.dependencies : void 0,
-			assignee: V.assignee.trim() || void 0
+	}, q = H.name.trim() !== "" && H.startDate !== "" && H.endDate !== "" && H.endDate >= H.startDate, J = () => {
+		q && j({
+			name: H.name.trim(),
+			startDate: new Date(H.startDate),
+			endDate: new Date(H.endDate),
+			status: H.status,
+			isMilestone: H.isMilestone || void 0,
+			progress: H.progress > 0 ? H.progress : void 0,
+			parentId: H.parentId || void 0,
+			dependencies: H.dependencies.length > 0 ? H.dependencies : void 0,
+			assignee: H.assignee.trim() || void 0
 		});
-	}, J = [
+	}, Y = [
 		"planned",
 		"in-progress",
 		"done",
 		"blocked"
-	], Y = {
-		planned: M.statusPlanned,
-		"in-progress": M.statusInProgress,
-		done: M.statusDone,
-		blocked: M.statusBlocked
+	], X = {
+		planned: N.statusPlanned,
+		"in-progress": N.statusInProgress,
+		done: N.statusDone,
+		blocked: N.statusBlocked
 	};
-	return /* @__PURE__ */ C(u, {
+	return /* @__PURE__ */ w(u, {
 		open: a,
-		onClose: j,
+		onClose: M,
 		maxWidth: "xs",
 		fullWidth: !0,
 		"data-testid": "gantt-task-dialog",
 		children: [
-			/* @__PURE__ */ S(p, { children: b === "add" ? M.dialogAddTitle : M.dialogEditTitle }),
-			/* @__PURE__ */ C(f, {
+			/* @__PURE__ */ C(p, { children: x === "add" ? N.dialogAddTitle : N.dialogEditTitle }),
+			/* @__PURE__ */ w(f, {
 				sx: {
 					display: "flex",
 					flexDirection: "column",
@@ -143,10 +148,10 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 					pt: "16px !important"
 				},
 				children: [
-					/* @__PURE__ */ S(y, {
-						label: M.dialogFieldName,
-						value: V.name,
-						onChange: (e) => H((t) => ({
+					/* @__PURE__ */ C(b, {
+						label: N.dialogFieldName,
+						value: H.name,
+						onChange: (e) => U((t) => ({
 							...t,
 							name: e.target.value
 						})),
@@ -156,10 +161,10 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 						autoFocus: !0,
 						slotProps: { htmlInput: { "data-testid": "gantt-dialog-field-name" } }
 					}),
-					/* @__PURE__ */ S(y, {
-						label: M.columnAssignee,
-						value: V.assignee,
-						onChange: (e) => H((t) => ({
+					/* @__PURE__ */ C(b, {
+						label: N.columnAssignee,
+						value: H.assignee,
+						onChange: (e) => U((t) => ({
 							...t,
 							assignee: e.target.value
 						})),
@@ -168,11 +173,11 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 						placeholder: "e.g. Jane Smith",
 						slotProps: { htmlInput: { "data-testid": "gantt-dialog-field-assignee" } }
 					}),
-					/* @__PURE__ */ S(y, {
-						label: M.dialogFieldStartDate,
+					/* @__PURE__ */ C(b, {
+						label: N.dialogFieldStartDate,
 						type: "date",
-						value: V.startDate,
-						onChange: (e) => U(e.target.value),
+						value: H.startDate,
+						onChange: (e) => W(e.target.value),
 						required: !0,
 						fullWidth: !0,
 						size: "small",
@@ -181,68 +186,109 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 							htmlInput: { "data-testid": "gantt-dialog-field-start" }
 						}
 					}),
-					/* @__PURE__ */ S(y, {
-						label: M.dialogFieldEndDate,
+					/* @__PURE__ */ C(b, {
+						label: N.dialogFieldEndDate,
 						type: "date",
-						value: V.endDate,
-						onChange: (e) => W(e.target.value),
+						value: H.endDate,
+						onChange: (e) => G(e.target.value),
 						required: !0,
 						fullWidth: !0,
 						size: "small",
-						disabled: V.isMilestone,
+						disabled: H.isMilestone,
 						slotProps: {
 							inputLabel: { shrink: !0 },
 							htmlInput: {
 								"data-testid": "gantt-dialog-field-end",
-								min: V.startDate
+								min: H.startDate
 							}
 						}
 					}),
-					/* @__PURE__ */ C(m, {
+					/* @__PURE__ */ w(m, {
 						size: "small",
 						fullWidth: !0,
-						children: [/* @__PURE__ */ S(g, { children: M.dialogFieldStatus }), /* @__PURE__ */ S(v, {
-							value: V.status,
-							label: M.dialogFieldStatus,
-							onChange: (e) => H((t) => ({
+						children: [/* @__PURE__ */ C(g, { children: N.dialogFieldStatus }), /* @__PURE__ */ C(v, {
+							value: H.status,
+							label: N.dialogFieldStatus,
+							onChange: (e) => U((t) => ({
 								...t,
 								status: e.target.value
 							})),
 							inputProps: { "data-testid": "gantt-dialog-field-status" },
-							children: J.map((e) => /* @__PURE__ */ S(_, {
+							children: Y.map((e) => /* @__PURE__ */ C(_, {
 								value: e,
-								children: Y[e]
+								children: X[e]
 							}, e))
 						})]
 					}),
-					/* @__PURE__ */ S(h, {
-						control: /* @__PURE__ */ S(l, {
-							checked: V.isMilestone,
-							onChange: (e) => G(e.target.checked),
+					/* @__PURE__ */ w(s, {
+						"data-testid": "gantt-dialog-field-progress-wrapper",
+						children: [/* @__PURE__ */ w(s, {
+							sx: {
+								display: "flex",
+								justifyContent: "space-between",
+								alignItems: "baseline",
+								mb: .25
+							},
+							children: [/* @__PURE__ */ C(S, {
+								variant: "caption",
+								color: H.isMilestone ? "text.disabled" : "text.secondary",
+								children: N.dialogFieldProgress ?? "Fortschritt (%)"
+							}), /* @__PURE__ */ w(S, {
+								variant: "caption",
+								sx: { fontWeight: 600 },
+								color: H.isMilestone ? "text.disabled" : "text.primary",
+								children: [H.progress, " %"]
+							})]
+						}), /* @__PURE__ */ C(y, {
+							value: H.progress,
+							onChange: (e, t) => U((e) => ({
+								...e,
+								progress: t
+							})),
+							min: 0,
+							max: 100,
+							step: 1,
+							disabled: H.isMilestone,
+							size: "small",
+							marks: [
+								{ value: 0 },
+								{ value: 25 },
+								{ value: 50 },
+								{ value: 75 },
+								{ value: 100 }
+							],
+							"aria-label": N.dialogFieldProgress ?? "Fortschritt (%)",
+							"data-testid": "gantt-dialog-field-progress"
+						})]
+					}),
+					/* @__PURE__ */ C(h, {
+						control: /* @__PURE__ */ C(l, {
+							checked: H.isMilestone,
+							onChange: (e) => K(e.target.checked),
 							size: "small",
 							"data-testid": "gantt-dialog-field-milestone"
 						}),
-						label: M.dialogFieldMilestone
+						label: N.dialogFieldMilestone
 					}),
-					/* @__PURE__ */ C(m, {
+					/* @__PURE__ */ w(m, {
 						size: "small",
 						fullWidth: !0,
-						children: [/* @__PURE__ */ S(g, { children: M.dialogFieldParent }), /* @__PURE__ */ C(v, {
-							value: V.parentId,
-							label: M.dialogFieldParent,
-							onChange: (e) => H((t) => ({
+						children: [/* @__PURE__ */ C(g, { children: N.dialogFieldParent }), /* @__PURE__ */ w(v, {
+							value: H.parentId,
+							label: N.dialogFieldParent,
+							onChange: (e) => U((t) => ({
 								...t,
 								parentId: e.target.value
 							})),
 							inputProps: { "data-testid": "gantt-dialog-field-parent" },
 							MenuProps: { slotProps: { paper: { sx: { maxHeight: 280 } } } },
-							children: [/* @__PURE__ */ S(_, {
+							children: [/* @__PURE__ */ C(_, {
 								value: "",
-								children: M.dialogFieldParentNone
-							}), L.map((e) => /* @__PURE__ */ S(_, {
+								children: N.dialogFieldParentNone
+							}), R.map((e) => /* @__PURE__ */ C(_, {
 								value: e.id,
 								sx: { minWidth: 0 },
-								children: /* @__PURE__ */ C(s, {
+								children: /* @__PURE__ */ w(s, {
 									sx: {
 										display: "flex",
 										alignItems: "center",
@@ -252,7 +298,7 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 										width: "100%",
 										overflow: "hidden"
 									},
-									children: [e.depth > 0 && /* @__PURE__ */ S(x, {
+									children: [e.depth > 0 && /* @__PURE__ */ C(S, {
 										component: "span",
 										variant: "caption",
 										sx: {
@@ -261,32 +307,32 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 											flexShrink: 0
 										},
 										children: "└"
-									}), /* @__PURE__ */ S(D, { label: e.name })]
+									}), /* @__PURE__ */ C(O, { label: e.name })]
 								})
 							}, e.id))]
 						})]
 					}),
-					/* @__PURE__ */ C(m, {
+					/* @__PURE__ */ w(m, {
 						size: "small",
 						fullWidth: !0,
-						children: [/* @__PURE__ */ S(g, { children: M.dialogFieldDependencies }), /* @__PURE__ */ S(v, {
+						children: [/* @__PURE__ */ C(g, { children: N.dialogFieldDependencies }), /* @__PURE__ */ C(v, {
 							multiple: !0,
-							value: V.dependencies,
-							label: M.dialogFieldDependencies,
+							value: H.dependencies,
+							label: N.dialogFieldDependencies,
 							onChange: (e) => {
 								let t = e.target.value;
-								H((e) => ({
+								U((e) => ({
 									...e,
 									dependencies: typeof t == "string" ? t.split(",") : t
 								}));
 							},
 							inputProps: { "data-testid": "gantt-dialog-field-dependencies" },
-							renderValue: (e) => e.length === 0 ? M.dialogFieldDependenciesNone : e.map((e) => F.find((t) => t.id === e)?.name ?? e).join(", "),
+							renderValue: (e) => e.length === 0 ? N.dialogFieldDependenciesNone : e.map((e) => I.find((t) => t.id === e)?.name ?? e).join(", "),
 							MenuProps: { slotProps: { paper: { sx: { maxHeight: 280 } } } },
-							children: z.map((e) => /* @__PURE__ */ S(_, {
+							children: B.map((e) => /* @__PURE__ */ C(_, {
 								value: e.id,
 								sx: { minWidth: 0 },
-								children: /* @__PURE__ */ C(s, {
+								children: /* @__PURE__ */ w(s, {
 									sx: {
 										display: "flex",
 										alignItems: "center",
@@ -296,7 +342,7 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 										width: "100%",
 										overflow: "hidden"
 									},
-									children: [e.depth > 0 && /* @__PURE__ */ S(x, {
+									children: [e.depth > 0 && /* @__PURE__ */ C(S, {
 										component: "span",
 										variant: "caption",
 										sx: {
@@ -305,25 +351,25 @@ function O({ open: a, mode: b, initialTask: O, defaultParentId: k, onSave: A, on
 											flexShrink: 0
 										},
 										children: "└"
-									}), /* @__PURE__ */ S(D, { label: e.name })]
+									}), /* @__PURE__ */ C(O, { label: e.name })]
 								})
 							}, e.id))
 						})]
 					})
 				]
 			}),
-			/* @__PURE__ */ C(d, { children: [/* @__PURE__ */ S(c, {
-				onClick: j,
-				children: M.dialogCancel
-			}), /* @__PURE__ */ S(c, {
-				onClick: q,
+			/* @__PURE__ */ w(d, { children: [/* @__PURE__ */ C(c, {
+				onClick: M,
+				children: N.dialogCancel
+			}), /* @__PURE__ */ C(c, {
+				onClick: J,
 				variant: "contained",
-				disabled: !K,
+				disabled: !q,
 				"data-testid": "gantt-dialog-save",
-				children: M.dialogSave
+				children: N.dialogSave
 			})] })
 		]
 	});
 }
 //#endregion
-export { O as GanttTaskDialog };
+export { k as GanttTaskDialog };