@oliasoft-open-source/react-ui-library 5.11.0 → 5.11.1-beta-1

package/README.md

@@ -2526,6 +2526,7 @@ The `Tree` component represents a hierarchical structure of items in a tree form
 | `onChangeOpen`       | Callback function invoked when the open/close state of tree nodes changes.                     | -                      |
 | `testId`             | Optional test id for testing purposes.                                                         | -            |
 | `isInitialOpen`      | Determines which nodes should be initially open.                                               | `false`                |
+| `autoOpenActiveItems`      | Automatically open tree to active items.                                               | `false`                |
 | `treeRef`            | Reference to the tree component.                                                               | -                      |
 | `itemHasChild`       | Function to determine if a tree node has child nodes.                                          | -                      |
 | `onItemToggle`       | Callback function invoked when a tree node is toggled (opened/closed).                          | -                      |

package/dist/index.d.ts

@@ -1759,6 +1759,7 @@ export declare interface ITreeProps {
     onChangeOpen?: (id: TStringOrNumber[]) => void;
     testId?: string;
     isInitialOpen?: boolean | Array<string> | Array<number>;
+    autoOpenActiveItems?: boolean;
     treeRef?: RefObject<any>;
     itemHasChild?: (node: NodeModel<any>) => boolean;
     onItemToggle?: (node: NodeModel<any>, isOpen: boolean) => void;
@@ -2163,7 +2164,7 @@ declare const TRANSLATION_FALLBACK: {
     unknown: string;
 };
 
-export declare const Tree: ({ list, draggable, onListReorder, onChangeOpen, testId, isInitialOpen, treeRef, itemHasChild, onItemToggle, icons, allowParentReassignment, stickyHeader, height, }: ITreeProps) => JSX_2.Element;
+export declare const Tree: ({ list, draggable, onListReorder, onChangeOpen, testId, isInitialOpen, autoOpenActiveItems, treeRef: treeRefProp, itemHasChild, onItemToggle, icons, allowParentReassignment, stickyHeader, height, }: ITreeProps) => JSX_2.Element;
 
 export declare enum TriggerType {
     TEXT = "Text",

package/dist/index.js

@@ -6516,26 +6516,39 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 }, TreePlaceholder = ({ depth: e }) => /* @__PURE__ */ jsx("div", {
 	className: tree_module_default.placeholder,
 	style: { left: e * 24 }
-}), Tree = ({ list: e, draggable: t = !1, onListReorder: n, onChangeOpen: r, testId: i, isInitialOpen: a = !1, treeRef: o, itemHasChild: s, onItemToggle: c, icons: l, allowParentReassignment: u, stickyHeader: d, height: f }) => {
-	let p = (e) => {
+}), Tree = ({ list: e, draggable: t = !1, onListReorder: n, onChangeOpen: r, testId: i, isInitialOpen: a = !1, autoOpenActiveItems: o = !1, treeRef: s, itemHasChild: l, onItemToggle: u, icons: d, allowParentReassignment: f, stickyHeader: m, height: h }) => {
+	let g = s ?? useRef(null), _ = (e) => {
 		r && r(e);
-	}, m = (e, t) => e?.findIndex((e) => e?.id === t) ?? -1, h = (e, t) => {
-		let n = m(t, e?.parent);
+	}, v = (t) => {
+		let n = e.items.find((e) => e.id === t);
+		return n && n.parent ? [n.parent, ...v(n.parent)] : [];
+	};
+	useEffect(() => {
+		if (o) {
+			let t = e.items.find((e) => e.active);
+			if (t) {
+				let e = v(t.id);
+				g.current?.open(e);
+			}
+		}
+	}, [o, e.items]);
+	let y = (e, t) => e?.findIndex((e) => e?.id === t) ?? -1, b = (e, t) => {
+		let n = y(t, e?.parent);
 		if (n >= 0) {
 			let r = t?.find((e) => e?.id === t[n]?.parent);
 			e.parent = r ? r.id : 0;
 		}
-	}, g = (e, t) => t?.filter((t) => t?.id !== e?.id) ?? [], _ = (e, t, n) => (n?.splice(t, 0, e), n), v = (e) => e.map(({ id: e, parent: t, droppable: n, data: r }) => ({
+	}, x = (e, t) => t?.filter((t) => t?.id !== e?.id) ?? [], S = (e, t, n) => (n?.splice(t, 0, e), n), C = (e) => e.map(({ id: e, parent: t, droppable: n, data: r }) => ({
 		id: e,
 		parent: t,
 		droppable: n,
 		...r
-	})), y = (e, t) => {
+	})), w = (e, t) => {
 		let { dragSource: r, dropTarget: i } = t, a = [...e];
 		if (!n) return;
-		let o = m(a, r?.id), s = m(a, r?.parent), c = [];
-		r?.parent === i?.id && o === 0 && u && (h(r, a), a = g(r, a), a = _(r, s, a)), c = v(a), n(c);
-	}, b = e?.items?.map(({ id: e, droppable: t, parent: n, name: r, onDrop: i,...a }) => ({
+		let o = y(a, r?.id), s = y(a, r?.parent), c = [];
+		r?.parent === i?.id && o === 0 && f && (b(r, a), a = x(r, a), a = S(r, s, a)), c = C(a), n(c);
+	}, T = e?.items?.map(({ id: e, droppable: t, parent: n, name: r, onDrop: i,...a }) => ({
 		id: e,
 		text: r,
 		droppable: t,
@@ -6549,18 +6562,18 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 	return /* @__PURE__ */ jsxs("div", {
 		"data-testid": i,
 		className: list_module_default.list,
-		style: { height: f },
+		style: { height: h },
 		children: [e.name && !e.noHeader && /* @__PURE__ */ jsx(ListHeading, {
 			name: e.name,
 			actions: e.actions,
-			stickyHeader: d
+			stickyHeader: m
 		}), /* @__PURE__ */ jsx(DndProvider, {
 			backend: MultiBackend,
 			options: getBackendOptions(),
 			context: window,
 			children: /* @__PURE__ */ jsx(Tree$1, {
-				ref: o,
-				tree: b,
+				ref: g,
+				tree: T,
 				sort: !1,
 				insertDroppableFirst: !1,
 				canDrag: () => t,
@@ -6569,19 +6582,19 @@ const TreeItem = ({ node: t, depth: n, isOpen: r, onToggle: i, hasChild: a, drag
 				},
 				rootId: 0,
 				render: (e, { depth: n, isOpen: r, onToggle: i, hasChild: a }) => /* @__PURE__ */ jsx(TreeItem, {
-					hasChild: s ? s(e) : a,
+					hasChild: l ? l(e) : a,
 					node: e,
 					depth: n,
 					isOpen: r,
 					onToggle: () => {
-						c?.(e, !r), i();
+						u?.(e, !r), i();
 					},
 					draggable: t,
-					icons: l,
+					icons: d,
 					onDrop: e.data?.onDrop
 				}),
-				onDrop: y,
-				onChangeOpen: p,
+				onDrop: w,
+				onChangeOpen: _,
 				dropTargetOffset: 10,
 				placeholderRender: (e, { depth: t }) => /* @__PURE__ */ jsx(TreePlaceholder, { depth: t }),
 				placeholderComponent: "div",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oliasoft-open-source/react-ui-library",
-  "version": "5.11.0",
+  "version": "5.11.1-beta-1",
   "description": "Reusable UI components for React projects",
   "homepage": "https://oliasoft-open-source.gitlab.io/react-ui-library",
   "bugs": {