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

package/README.de.md

@@ -475,6 +475,14 @@ Dieses Projekt folgt [Semantic Versioning](https://semver.org/). In der Praxis b
 
 ## Changelog
 
+### [3.17.0] — 2026-07-05
+
+**Hinzugefügt**
+- `GanttChart`: Assignee-Filter-Dropdown in der Toolbar — `toolbarConfig={{ showAssigneeFilter: true }}` fügt ein Select hinzu, das sichtbare Tasks nach Assignee filtert. Der Filter ist vorfahren-inklusiv (Parent-Tasks bleiben sichtbar wenn Nachkommen passen). Zwei neue optionale Übersetzungsschlüssel: `filterAssigneeAll`, `filterAssigneeLabel`.
+- `GanttChart`: `onDragStart(task, type)`-Callback — feuert sofort bei mousedown auf einem zieh-/skalierbaren Balken (vor dem ≥ 5 px-Schwellwert). `type` ist `"move"` oder `"resize"`. Gedacht für optimistisches UI, Analytics und Shadow-Elemente. Kein Debounce nötig — feuert höchstens einmal pro Geste. Siehe [Vollständiger Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.md) für Details.
+
+---
+
 ### [3.16.0] — 2026-07-03
 
 **Hinzugefügt**

package/README.md

@@ -475,6 +475,14 @@ This project follows [Semantic Versioning](https://semver.org/). In practice:
 
 ## Changelog
 
+### [3.17.0] — 2026-07-05
+
+**Added**
+- `GanttChart`: assignee filter dropdown in the toolbar — `toolbarConfig={{ showAssigneeFilter: true }}` adds a Select that filters visible tasks by assignee. The filter is ancestor-inclusive (parents are kept when descendants match). Two new optional translation keys: `filterAssigneeAll`, `filterAssigneeLabel`.
+- `GanttChart`: `onDragStart(task, type)` callback — fires immediately on mousedown on a draggable/resizable bar (before the ≥ 5 px movement threshold). `type` is `"move"` or `"resize"`. Intended for optimistic UI, analytics, and shadow elements. No debouncing needed — fires at most once per gesture. See [Full Changelog](https://github.com/thebuoyant/mui-ts-library/blob/main/CHANGELOG.md) for details.
+
+---
+
 ### [3.16.0] — 2026-07-03
 
 **Added**

package/dist/components/gantt-chart/GanttChart.d.ts

@@ -4,4 +4,4 @@ export declare function useGanttChartStore<T>(selector: (state: ReturnType<Gantt
 export declare function useRawGanttChartStore(): GanttChartStore;
 export declare function useGanttTranslations(): Required<GanttTranslations>;
 export declare function useGanttTheme(): GanttTheme;
-export declare function GanttChart({ tasks, timeScale, initialExpandAll, showToolbar, defaultRangeStart, defaultRangeEnd, translations, enableBuiltinDialogs, toolbarConfig, zoomable, draggable, resizable, inlineEdit, progressDraggable, showCriticalPath, virtualizeRows, showAssigneeColumn, cascadeDependencies, statusColors, ganttTheme, onExportCSV, onTaskClick, onMilestoneClick, onAddTask, onEditTask, onDeleteTask, onStatusChange, onTasksChange, onTaskMoved, onTaskResized, onTaskCreated, onTaskUpdated, onTaskDeleted, height, width, minPanelWidth, maxPanelWidth, }: GanttChartProps): import("react/jsx-runtime").JSX.Element;
+export declare function GanttChart({ tasks, timeScale, initialExpandAll, showToolbar, defaultRangeStart, defaultRangeEnd, translations, enableBuiltinDialogs, toolbarConfig, zoomable, draggable, resizable, inlineEdit, progressDraggable, showCriticalPath, virtualizeRows, showAssigneeColumn, cascadeDependencies, statusColors, ganttTheme, onExportCSV, onDragStart, onTaskClick, onMilestoneClick, onAddTask, onEditTask, onDeleteTask, onStatusChange, onTasksChange, onTaskMoved, onTaskResized, onTaskCreated, onTaskUpdated, onTaskDeleted, height, width, minPanelWidth, maxPanelWidth, }: GanttChartProps): import("react/jsx-runtime").JSX.Element;

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

@@ -46,14 +46,15 @@ var E = [
 	showDateRange: !0,
 	showRangeReset: !0,
 	showResetView: !0,
-	showExportCSV: !1
+	showExportCSV: !1,
+	showAssigneeFilter: !1
 };
-function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEditTask: l, onDeleteTask: _, onStatusChange: v, onTasksChange: x, enableBuiltinDialogs: S = !0, onTaskCreated: C, onTaskUpdated: w, onTaskDeleted: O, showToolbar: k = !0, toolbarConfig: A, height: j, width: ee, minPanelWidth: M = 200, maxPanelWidth: N = 600, zoomable: P = !1, draggable: F = !1, resizable: I = !1, inlineEdit: L = !1, progressDraggable: te = !1, showCriticalPath: ne = !1, virtualizeRows: R = !1, showAssigneeColumn: z = !1, onExportCSV: B, onTaskMoved: V, onTaskResized: H }) {
+function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEditTask: l, onDeleteTask: _, onStatusChange: v, onTasksChange: x, enableBuiltinDialogs: S = !0, onTaskCreated: C, onTaskUpdated: w, onTaskDeleted: O, showToolbar: k = !0, toolbarConfig: A, height: j, width: ee, minPanelWidth: M = 200, maxPanelWidth: N = 600, zoomable: P = !1, draggable: F = !1, resizable: I = !1, inlineEdit: te = !1, progressDraggable: ne = !1, showCriticalPath: re = !1, virtualizeRows: L = !1, showAssigneeColumn: R = !1, onExportCSV: z, onDragStart: B, onTaskMoved: V, onTaskResized: H }) {
 	let U = T(j, 400), W = d(() => ({
 		...D,
 		...A
-	}), [A]), G = T(ee, "100%"), K = y((e) => e.setTasks), q = y((e) => e.timeScale), J = y((e) => e.setTimeScale), Y = y((e) => e.timelineRange), X = f(null), Z = f(null), Q = f(!1), [$, re] = p(320), ie = b(), ae = c(() => {
-		let e = ie.getState().tasks, t = [[
+	}), [A]), G = T(ee, "100%"), K = y((e) => e.setTasks), q = y((e) => e.timeScale), J = y((e) => e.setTimeScale), Y = y((e) => e.timelineRange), X = f(null), Z = f(null), Q = f(!1), [$, ie] = p(320), ae = b(), oe = c(() => {
+		let e = ae.getState().tasks, t = [[
 			"id",
 			"name",
 			"status",
@@ -78,20 +79,20 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 			(e.dependencies ?? []).join(";"),
 			e.color ?? ""
 		].join(","))].join("\n");
-		if (B) B(t, e);
+		if (z) z(t, e);
 		else {
 			let e = new Blob([t], { type: "text/csv;charset=utf-8;" }), n = URL.createObjectURL(e), r = document.createElement("a");
 			r.href = n, r.download = "gantt-tasks.csv", r.click(), URL.revokeObjectURL(n);
 		}
-	}, [ie, B]);
+	}, [ae, z]);
 	u(() => {
 		K(t);
 	}, [t, K]);
-	let oe = () => {
+	let se = () => {
 		Q.current ||= (Q.current = !0, Z.current && X.current && (Z.current.scrollTop = X.current.scrollTop), !1);
-	}, se = () => {
+	}, ce = () => {
 		Q.current ||= (Q.current = !0, X.current && Z.current && (X.current.scrollTop = Z.current.scrollTop), !1);
-	}, ce = c(() => {
+	}, le = c(() => {
 		if (!Z.current) return;
 		let t = e(Y, q), n = Date.now(), r = t.start.getTime(), i = t.end.getTime(), a = (n - r) / (i - r) * Z.current.scrollWidth;
 		Z.current.scrollLeft = Math.max(0, a - Z.current.clientWidth / 2);
@@ -110,11 +111,11 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 		q,
 		J
 	]);
-	let le = c((e) => {
+	let ue = c((e) => {
 		e.preventDefault();
 		let t = e.clientX, n = $, r = (e) => {
 			let r = e.clientX - t;
-			re(Math.max(M, Math.min(N, n + r)));
+			ie(Math.max(M, Math.min(N, n + r)));
 		}, i = () => {
 			document.removeEventListener("mousemove", r), document.removeEventListener("mouseup", i);
 		};
@@ -136,9 +137,9 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 			overflow: "hidden"
 		},
 		children: [k && /* @__PURE__ */ h(o, {
-			onScrollToToday: ce,
+			onScrollToToday: le,
 			config: W,
-			onExportCSV: W.showExportCSV ? ae : void 0
+			onExportCSV: W.showExportCSV ? oe : void 0
 		}), /* @__PURE__ */ g(m, {
 			sx: {
 				display: "flex",
@@ -148,7 +149,7 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 			children: [
 				/* @__PURE__ */ h(i, {
 					scrollRef: X,
-					onScroll: oe,
+					onScroll: se,
 					panelWidth: $,
 					onTaskClick: n,
 					onAddTask: s,
@@ -160,9 +161,9 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 					onTaskCreated: C,
 					onTaskUpdated: w,
 					onTaskDeleted: O,
-					inlineEdit: L,
-					virtualizeRows: R,
-					showAssigneeColumn: z
+					inlineEdit: te,
+					virtualizeRows: L,
+					showAssigneeColumn: R
 				}),
 				/* @__PURE__ */ h(m, {
 					"data-testid": "gantt-panel-divider",
@@ -173,18 +174,19 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 						cursor: "col-resize",
 						"&:hover": { bgcolor: "action.hover" }
 					},
-					onMouseDown: le
+					onMouseDown: ue
 				}),
 				/* @__PURE__ */ h(a, {
 					scrollRef: Z,
-					onScroll: se,
+					onScroll: ce,
 					onTaskClick: n,
 					onMilestoneClick: r,
 					draggable: F,
 					resizable: I,
-					progressDraggable: te,
-					showCriticalPath: ne,
-					virtualizeRows: R,
+					progressDraggable: ne,
+					showCriticalPath: re,
+					virtualizeRows: L,
+					onDragStart: B,
 					onTaskMoved: V,
 					onTaskResized: H,
 					onTasksChange: x,
@@ -194,7 +196,7 @@ function O({ tasks: t, onTaskClick: n, onMilestoneClick: r, onAddTask: s, onEdit
 		})]
 	});
 }
-function k({ tasks: e, timeScale: i = "months", initialExpandAll: a = !1, showToolbar: o = !0, defaultRangeStart: s, defaultRangeEnd: c, translations: l, enableBuiltinDialogs: u = !0, toolbarConfig: f, zoomable: m = !1, draggable: g = !1, resizable: _ = !1, inlineEdit: y = !1, progressDraggable: b = !1, showCriticalPath: S = !1, virtualizeRows: w = !1, showAssigneeColumn: T = !1, cascadeDependencies: E = !1, statusColors: D, ganttTheme: k, onExportCSV: A, onTaskClick: j, onMilestoneClick: ee, onAddTask: M, onEditTask: N, onDeleteTask: P, onStatusChange: F, onTasksChange: I, onTaskMoved: L, onTaskResized: te, onTaskCreated: ne, onTaskUpdated: R, onTaskDeleted: z, height: B, width: V, minPanelWidth: H, maxPanelWidth: U }) {
+function k({ tasks: e, timeScale: i = "months", initialExpandAll: a = !1, showToolbar: o = !0, defaultRangeStart: s, defaultRangeEnd: c, translations: l, enableBuiltinDialogs: u = !0, toolbarConfig: f, zoomable: m = !1, draggable: g = !1, resizable: _ = !1, inlineEdit: y = !1, progressDraggable: b = !1, showCriticalPath: S = !1, virtualizeRows: w = !1, showAssigneeColumn: T = !1, cascadeDependencies: E = !1, statusColors: D, ganttTheme: k, onExportCSV: A, onDragStart: j, onTaskClick: ee, onMilestoneClick: M, onAddTask: N, onEditTask: P, onDeleteTask: F, onStatusChange: I, onTasksChange: te, onTaskMoved: ne, onTaskResized: re, onTaskCreated: L, onTaskUpdated: R, onTaskDeleted: z, height: B, width: V, minPanelWidth: H, maxPanelWidth: U }) {
 	let W = d(() => ({
 		...r,
 		...l
@@ -233,16 +235,17 @@ function k({ tasks: e, timeScale: i = "months", initialExpandAll: a = !1, showTo
 					virtualizeRows: w,
 					showAssigneeColumn: T,
 					onExportCSV: A,
-					onTaskClick: j,
-					onMilestoneClick: ee,
-					onAddTask: M,
-					onEditTask: N,
-					onDeleteTask: P,
-					onStatusChange: F,
-					onTasksChange: I,
-					onTaskMoved: L,
-					onTaskResized: te,
-					onTaskCreated: ne,
+					onDragStart: j,
+					onTaskClick: ee,
+					onMilestoneClick: M,
+					onAddTask: N,
+					onEditTask: P,
+					onDeleteTask: F,
+					onStatusChange: I,
+					onTasksChange: te,
+					onTaskMoved: ne,
+					onTaskResized: re,
+					onTaskCreated: L,
 					onTaskUpdated: R,
 					onTaskDeleted: z,
 					height: B,

package/dist/components/gantt-chart/GanttChart.store.d.ts

@@ -11,6 +11,8 @@ export type GanttChartStoreState = {
     defaultTimeScale: GanttTimeScale;
     initialExpandAll: boolean;
     isExpandedCustomized: boolean;
+    assigneeFilter: string;
+    setAssigneeFilter: (assignee: string) => void;
     setTasks: (tasks: GanttTask[]) => void;
     addTask: (task: GanttTask) => void;
     updateTask: (task: GanttTask) => void;

package/dist/components/gantt-chart/GanttChart.store.js

@@ -21,6 +21,8 @@ function l(e, r = "months", o = !1, l, u = !1) {
 		defaultTimeScale: r,
 		initialExpandAll: o,
 		isExpandedCustomized: !1,
+		assigneeFilter: "",
+		setAssigneeFilter: (e) => s({ assigneeFilter: e }),
 		setTasks: (e) => {
 			s((n) => ({
 				tasks: e,
@@ -106,6 +108,7 @@ function l(e, r = "months", o = !1, l, u = !1) {
 				timelineRange: i(e.tasks),
 				isRangeCustomized: !1,
 				isExpandedCustomized: !1,
+				assigneeFilter: "",
 				expandedIds: e.initialExpandAll ? new Set(e.tasks.map((e) => e.id)) : new Set(e.tasks.filter((e) => !e.parentId).map((e) => e.id))
 			}));
 		},

package/dist/components/gantt-chart/GanttChart.types.d.ts

@@ -54,6 +54,10 @@ export type GanttTranslations = {
     dialogFieldDependenciesNone: string;
     /** Label for the progress slider in the task dialog (0–100 %) @since 3.16.0 */
     dialogFieldProgress?: string;
+    /** "All" option label in the assignee filter dropdown @since 3.17.0 */
+    filterAssigneeAll?: string;
+    /** Assignee filter Select label in the toolbar @since 3.17.0 */
+    filterAssigneeLabel?: string;
     columnActions: string;
     /** Header label for the Assignee column — shown when showAssigneeColumn=true @since 2.7.0 */
     columnAssignee?: string;
@@ -89,6 +93,8 @@ export type GanttToolbarConfig = {
     showResetView?: boolean;
     /** Show CSV export button in the toolbar (default: false) */
     showExportCSV?: boolean;
+    /** Show assignee filter dropdown in toolbar (default: false) */
+    showAssigneeFilter?: boolean;
 };
 export type GanttChartProps = {
     cascadeDependencies?: boolean;
@@ -126,6 +132,13 @@ export type GanttChartProps = {
     onTaskClick?: (task: GanttTask) => void;
     onTaskCreated?: (task: GanttTask) => void;
     onTaskDeleted?: (taskId: string) => void;
+    /**
+     * Fired once when the user presses the mouse button on a draggable bar (before any movement).
+     * Use this for optimistic UI, analytics, or showing a shadow element during drag.
+     * `type` distinguishes between a move gesture and a resize gesture.
+     * @since 3.17.0
+     */
+    onDragStart?: (task: GanttTask, type: "move" | "resize") => void;
     onTaskMoved?: (task: GanttTask, newStart: Date, newEnd: Date) => void;
     onTaskResized?: (task: GanttTask, newEnd: Date) => void;
     onTasksChange?: (tasks: GanttTask[]) => void;

package/dist/components/gantt-chart/GanttChart.types.js

@@ -33,6 +33,8 @@ var e = {
 	dialogFieldDependencies: "Vorgänger",
 	dialogFieldDependenciesNone: "— Keine —",
 	dialogFieldProgress: "Fortschritt (%)",
+	filterAssigneeAll: "Alle",
+	filterAssigneeLabel: "Assignee",
 	scrollToTodayTooltip: "Zum heutigen Tag",
 	expandAllTooltip: "Alle aufklappen",
 	collapseAllTooltip: "Alle zuklappen",