@itwin/presentation-hierarchies-react 2.0.0-alpha.54 → 2.0.0-alpha.56

package/lib/{esm/presentation-hierarchies-react → presentation-hierarchies-react}/stratakit/TreeNodeRenderer.js

@@ -1,5 +1,5 @@
+import { useTranslation } from "./LocalizationContext.js";
 import { TreeActionBase } from "./TreeAction.js";
-import { useLocalizationContext } from "./LocalizationContext.js";
 import { useTreeNodeRenameContext } from "./TreeNodeRenameAction.js";
 import { c } from "react-compiler-runtime";
 import { cloneElement, forwardRef, isValidElement, memo, useEffect, useId, useRef, useState } from "react";
@@ -13,13 +13,12 @@ import refreshSvg from "@stratakit/icons/refresh.svg";
 
 //#region src/presentation-hierarchies-react/stratakit/TreeNodeRenderer.tsx
 /**
-* A component that renders given `FlatTreeNode` using the `Tree.Item` component from `@itwin/itwinui-react`. The
-* `FlatTreeNode` objects for this renderer are generally created using the `useFlatTreeNodeList` hook.
+* A component that renders a given `TreeNode` using the `Tree.Item` component from `@stratakit/structures`.
 *
 * @internal
 */
 const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props, forwardedRef) {
-	const $ = c(62);
+	const $ = c(64);
 	let contextMenuActions;
 	let decorations;
 	let expandNode;
@@ -49,7 +48,7 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 		reloadTree = $[7];
 		treeItemProps = $[8];
 	}
-	const { localizedStrings } = useLocalizationContext();
+	const translate = useTranslation();
 	const renameContext = useTreeNodeRenameContext();
 	const [contextMenuProps, setContextMenuProps] = useState(void 0);
 	const label = treeItemProps.label ?? node.label;
@@ -57,29 +56,35 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 	bb0: {
 		if (node.error !== void 0 && node.error.type === "ChildrenLoad") {
 			let t1;
-			if ($[9] !== node.id || $[10] !== reloadTree) {
-				t1 = () => reloadTree({
+			if ($[9] !== translate) {
+				t1 = translate("retry");
+				$[9] = translate;
+				$[10] = t1;
+			} else t1 = $[10];
+			let t2;
+			if ($[11] !== node.id || $[12] !== reloadTree) {
+				t2 = () => reloadTree({
 					parentNodeId: node.id,
 					state: "reset"
 				});
-				$[9] = node.id;
-				$[10] = reloadTree;
-				$[11] = t1;
-			} else t1 = $[11];
-			let t2;
-			if ($[12] !== localizedStrings.retry || $[13] !== t1) {
-				t2 = [/* @__PURE__ */ jsx(TreeActionBase, {
-					label: localizedStrings.retry,
-					onClick: t1,
+				$[11] = node.id;
+				$[12] = reloadTree;
+				$[13] = t2;
+			} else t2 = $[13];
+			let t3;
+			if ($[14] !== t1 || $[15] !== t2) {
+				t3 = [/* @__PURE__ */ jsx(TreeActionBase, {
+					label: t1,
+					onClick: t2,
 					visible: true,
 					icon: refreshSvg,
 					variant: "inline"
 				}, "retry")];
-				$[12] = localizedStrings.retry;
-				$[13] = t1;
-				$[14] = t2;
-			} else t2 = $[14];
-			t0 = t2;
+				$[14] = t1;
+				$[15] = t2;
+				$[16] = t3;
+			} else t3 = $[16];
+			t0 = t3;
 			break bb0;
 		}
 		if (!inlineActions) {
@@ -87,11 +92,11 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			break bb0;
 		}
 		let t1;
-		if ($[15] !== inlineActions) {
+		if ($[17] !== inlineActions) {
 			t1 = injectActionVariant(inlineActions, "inline");
-			$[15] = inlineActions;
-			$[16] = t1;
-		} else t1 = $[16];
+			$[17] = inlineActions;
+			$[18] = t1;
+		} else t1 = $[18];
 		t0 = t1;
 	}
 	const inlineActionItems = t0;
@@ -102,17 +107,17 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			break bb1;
 		}
 		let t2;
-		if ($[17] !== menuActions) {
+		if ($[19] !== menuActions) {
 			t2 = injectActionVariant(menuActions, "default");
-			$[17] = menuActions;
-			$[18] = t2;
-		} else t2 = $[18];
+			$[19] = menuActions;
+			$[20] = t2;
+		} else t2 = $[20];
 		t1 = t2;
 	}
 	const menuActionItems = t1;
 	let t2;
 	bb2: {
-		if (node.error) {
+		if (node.error && (node.error.type !== "Unknown" || !node.error.isNodeExpandable)) {
 			t2 = void 0;
 			break bb2;
 		}
@@ -124,17 +129,17 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 	}
 	const expanded = t2;
 	let t3;
-	if ($[19] !== renameContext) {
+	if ($[21] !== renameContext) {
 		t3 = renameContext ?? {};
-		$[19] = renameContext;
-		$[20] = t3;
-	} else t3 = $[20];
+		$[21] = renameContext;
+		$[22] = t3;
+	} else t3 = $[22];
 	const { renameParameters, cancelRename } = t3;
 	const t4 = renameParameters?.commit;
 	const t5 = renameParameters?.labelValidationHint;
 	const t6 = renameParameters?.validate;
 	let t7;
-	if ($[21] !== cancelRename || $[22] !== node.label || $[23] !== t4 || $[24] !== t5 || $[25] !== t6) {
+	if ($[23] !== cancelRename || $[24] !== node.label || $[25] !== t4 || $[26] !== t5 || $[27] !== t6) {
 		t7 = /* @__PURE__ */ jsx(LabelEditor, {
 			initialLabel: node.label,
 			onChange: t4,
@@ -142,28 +147,28 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			labelValidationHint: t5,
 			validate: t6
 		});
-		$[21] = cancelRename;
-		$[22] = node.label;
-		$[23] = t4;
-		$[24] = t5;
-		$[25] = t6;
-		$[26] = t7;
-	} else t7 = $[26];
+		$[23] = cancelRename;
+		$[24] = node.label;
+		$[25] = t4;
+		$[26] = t5;
+		$[27] = t6;
+		$[28] = t7;
+	} else t7 = $[28];
 	const labelEditor = t7;
 	const t8 = renameParameters?.nodeId === node.id;
 	let t9;
-	if ($[27] !== expandNode || $[28] !== node.id) {
+	if ($[29] !== expandNode || $[30] !== node.id) {
 		t9 = (isExpanded) => {
 			expandNode(node.id, isExpanded);
 		};
-		$[27] = expandNode;
-		$[28] = node.id;
-		$[29] = t9;
-	} else t9 = $[29];
+		$[29] = expandNode;
+		$[30] = node.id;
+		$[31] = t9;
+	} else t9 = $[31];
 	const t10 = t9;
 	const t11 = node.error ? node.error.id : void 0;
 	let t12;
-	if ($[30] !== contextMenuActions || $[31] !== treeItemProps) {
+	if ($[32] !== contextMenuActions || $[33] !== treeItemProps) {
 		t12 = (e) => {
 			if (treeItemProps.onContextMenu) treeItemProps.onContextMenu(e);
 			if (!contextMenuActions) return;
@@ -178,12 +183,12 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 				actions
 			});
 		};
-		$[30] = contextMenuActions;
-		$[31] = treeItemProps;
-		$[32] = t12;
-	} else t12 = $[32];
+		$[32] = contextMenuActions;
+		$[33] = treeItemProps;
+		$[34] = t12;
+	} else t12 = $[34];
 	let t13;
-	if ($[33] !== decorations || $[34] !== expanded || $[35] !== forwardedRef || $[36] !== inlineActionItems || $[37] !== label || $[38] !== menuActionItems || $[39] !== t10 || $[40] !== t11 || $[41] !== t12 || $[42] !== treeItemProps) {
+	if ($[35] !== decorations || $[36] !== expanded || $[37] !== forwardedRef || $[38] !== inlineActionItems || $[39] !== label || $[40] !== menuActionItems || $[41] !== t10 || $[42] !== t11 || $[43] !== t12 || $[44] !== treeItemProps) {
 		t13 = /* @__PURE__ */ jsx(Tree.Item, {
 			...treeItemProps,
 			ref: forwardedRef,
@@ -196,20 +201,20 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			error: t11,
 			onContextMenu: t12
 		});
-		$[33] = decorations;
-		$[34] = expanded;
-		$[35] = forwardedRef;
-		$[36] = inlineActionItems;
-		$[37] = label;
-		$[38] = menuActionItems;
-		$[39] = t10;
-		$[40] = t11;
-		$[41] = t12;
-		$[42] = treeItemProps;
-		$[43] = t13;
-	} else t13 = $[43];
+		$[35] = decorations;
+		$[36] = expanded;
+		$[37] = forwardedRef;
+		$[38] = inlineActionItems;
+		$[39] = label;
+		$[40] = menuActionItems;
+		$[41] = t10;
+		$[42] = t11;
+		$[43] = t12;
+		$[44] = treeItemProps;
+		$[45] = t13;
+	} else t13 = $[45];
 	let t14;
-	if ($[44] !== cancelRename || $[45] !== labelEditor || $[46] !== t13 || $[47] !== t8) {
+	if ($[46] !== cancelRename || $[47] !== labelEditor || $[48] !== t13 || $[49] !== t8) {
 		t14 = /* @__PURE__ */ jsx(unstable_Popover, {
 			content: labelEditor,
 			placement: "bottom",
@@ -218,23 +223,23 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			unmountOnHide: true,
 			children: t13
 		});
-		$[44] = cancelRename;
-		$[45] = labelEditor;
-		$[46] = t13;
-		$[47] = t8;
-		$[48] = t14;
-	} else t14 = $[48];
+		$[46] = cancelRename;
+		$[47] = labelEditor;
+		$[48] = t13;
+		$[49] = t8;
+		$[50] = t14;
+	} else t14 = $[50];
 	const t15 = contextMenuProps !== void 0;
 	let t16;
-	if ($[49] === Symbol.for("react.memo_cache_sentinel")) {
+	if ($[51] === Symbol.for("react.memo_cache_sentinel")) {
 		t16 = (open) => {
 			if (!open) setContextMenuProps(void 0);
 		};
-		$[49] = t16;
-	} else t16 = $[49];
+		$[51] = t16;
+	} else t16 = $[51];
 	const t17 = `${node.id}-${contextMenuProps?.position.x ?? ""}-${contextMenuProps?.position.y ?? ""}`;
 	let t18;
-	if ($[50] !== contextMenuProps) {
+	if ($[52] !== contextMenuProps) {
 		t18 = contextMenuProps ? /* @__PURE__ */ jsx(DropdownMenu.Button, {
 			style: {
 				position: "fixed",
@@ -243,80 +248,92 @@ const StrataKitTreeNodeRenderer = memo(forwardRef(function HierarchyNode(props,
 			},
 			render: /* @__PURE__ */ jsx("div", {})
 		}) : null;
-		$[50] = contextMenuProps;
-		$[51] = t18;
-	} else t18 = $[51];
+		$[52] = contextMenuProps;
+		$[53] = t18;
+	} else t18 = $[53];
 	const t19 = contextMenuProps?.actions;
 	let t20;
-	if ($[52] !== t19) {
+	if ($[54] !== t19) {
 		t20 = /* @__PURE__ */ jsx(DropdownMenu.Content, {
 			focusable: true,
 			autoFocus: true,
 			children: t19
 		});
-		$[52] = t19;
-		$[53] = t20;
-	} else t20 = $[53];
+		$[54] = t19;
+		$[55] = t20;
+	} else t20 = $[55];
 	let t21;
-	if ($[54] !== t15 || $[55] !== t17 || $[56] !== t18 || $[57] !== t20) {
+	if ($[56] !== t15 || $[57] !== t17 || $[58] !== t18 || $[59] !== t20) {
 		t21 = /* @__PURE__ */ jsxs(DropdownMenu.Provider, {
 			open: t15,
 			setOpen: t16,
 			children: [t18, t20]
 		}, t17);
-		$[54] = t15;
-		$[55] = t17;
-		$[56] = t18;
-		$[57] = t20;
-		$[58] = t21;
-	} else t21 = $[58];
+		$[56] = t15;
+		$[57] = t17;
+		$[58] = t18;
+		$[59] = t20;
+		$[60] = t21;
+	} else t21 = $[60];
 	let t22;
-	if ($[59] !== t14 || $[60] !== t21) {
+	if ($[61] !== t14 || $[62] !== t21) {
 		t22 = /* @__PURE__ */ jsxs(Fragment, { children: [t14, t21] });
-		$[59] = t14;
-		$[60] = t21;
-		$[61] = t22;
-	} else t22 = $[61];
+		$[61] = t14;
+		$[62] = t21;
+		$[63] = t22;
+	} else t22 = $[63];
 	return t22;
 }));
 const PlaceholderNode = memo(forwardRef(function PlaceholderNode(t0, forwardedRef) {
-	const $ = c(9);
+	const $ = c(13);
 	let props;
 	if ($[0] !== t0) {
 		({...props} = t0);
 		$[0] = t0;
 		$[1] = props;
 	} else props = $[1];
-	const { localizedStrings } = useLocalizationContext();
+	const translate = useTranslation();
 	let t1;
-	if ($[2] !== localizedStrings.loading) {
-		t1 = /* @__PURE__ */ jsx(Spinner, {
-			size: "small",
-			title: localizedStrings.loading
-		});
-		$[2] = localizedStrings.loading;
+	if ($[2] !== translate) {
+		t1 = translate("loading");
+		$[2] = translate;
 		$[3] = t1;
 	} else t1 = $[3];
 	let t2;
-	if ($[4] !== forwardedRef || $[5] !== localizedStrings.loading || $[6] !== props || $[7] !== t1) {
-		t2 = /* @__PURE__ */ jsx(Tree.Item, {
+	if ($[4] !== translate) {
+		t2 = translate("loading");
+		$[4] = translate;
+		$[5] = t2;
+	} else t2 = $[5];
+	let t3;
+	if ($[6] !== t2) {
+		t3 = /* @__PURE__ */ jsx(Spinner, {
+			size: "small",
+			title: t2
+		});
+		$[6] = t2;
+		$[7] = t3;
+	} else t3 = $[7];
+	let t4;
+	if ($[8] !== forwardedRef || $[9] !== props || $[10] !== t1 || $[11] !== t3) {
+		t4 = /* @__PURE__ */ jsx(Tree.Item, {
 			...props,
 			ref: forwardedRef,
-			label: localizedStrings.loading,
-			unstable_decorations: t1
+			label: t1,
+			unstable_decorations: t3
 		});
-		$[4] = forwardedRef;
-		$[5] = localizedStrings.loading;
-		$[6] = props;
-		$[7] = t1;
-		$[8] = t2;
-	} else t2 = $[8];
-	return t2;
+		$[8] = forwardedRef;
+		$[9] = props;
+		$[10] = t1;
+		$[11] = t3;
+		$[12] = t4;
+	} else t4 = $[12];
+	return t4;
 }));
 function LabelEditor(t0) {
-	const $ = c(43);
+	const $ = c(49);
 	const { initialLabel, labelValidationHint, onChange, onCancel, validate } = t0;
-	const { localizedStrings } = useLocalizationContext();
+	const translate = useTranslation();
 	const inputRef = useRef(null);
 	const [newLabelValue, setNewLabelValue] = useState(initialLabel);
 	const [hasError, setHasError] = useState(false);
@@ -378,93 +395,111 @@ function LabelEditor(t0) {
 	} else t5 = $[11];
 	const t6 = hasError ? "with-error" : void 0;
 	let t7;
-	if ($[12] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = (event) => {
+	if ($[12] !== translate) {
+		t7 = translate("newLabel");
+		$[12] = translate;
+		$[13] = t7;
+	} else t7 = $[13];
+	let t8;
+	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = (event) => {
 			setNewLabelValue(event.target.value);
 			setHasError(false);
 		};
-		$[12] = t7;
-	} else t7 = $[12];
-	let t8;
-	if ($[13] !== cancelLabelChange || $[14] !== handleLabelChange) {
-		t8 = (event_0) => {
+		$[14] = t8;
+	} else t8 = $[14];
+	let t9;
+	if ($[15] !== cancelLabelChange || $[16] !== handleLabelChange) {
+		t9 = (event_0) => {
 			if (event_0.key === "Enter") handleLabelChange();
 			else if (event_0.key === "Escape") cancelLabelChange();
 		};
-		$[13] = cancelLabelChange;
-		$[14] = handleLabelChange;
-		$[15] = t8;
-	} else t8 = $[15];
-	let t9;
-	if ($[16] !== inputId || $[17] !== localizedStrings.newLabel || $[18] !== newLabelValue || $[19] !== t8) {
-		t9 = /* @__PURE__ */ jsx(TextBox.Input, {
+		$[15] = cancelLabelChange;
+		$[16] = handleLabelChange;
+		$[17] = t9;
+	} else t9 = $[17];
+	let t10;
+	if ($[18] !== inputId || $[19] !== newLabelValue || $[20] !== t7 || $[21] !== t9) {
+		t10 = /* @__PURE__ */ jsx(TextBox.Input, {
 			id: inputId,
 			ref: inputRef,
-			"aria-label": localizedStrings.newLabel,
+			"aria-label": t7,
 			value: newLabelValue,
-			onChange: t7,
-			onKeyUp: t8
+			onChange: t8,
+			onKeyUp: t9
 		});
-		$[16] = inputId;
-		$[17] = localizedStrings.newLabel;
-		$[18] = newLabelValue;
-		$[19] = t8;
-		$[20] = t9;
-	} else t9 = $[20];
-	let t10;
-	if ($[21] !== t6 || $[22] !== t9) {
-		t10 = /* @__PURE__ */ jsx(TextBox.Root, {
+		$[18] = inputId;
+		$[19] = newLabelValue;
+		$[20] = t7;
+		$[21] = t9;
+		$[22] = t10;
+	} else t10 = $[22];
+	let t11;
+	if ($[23] !== t10 || $[24] !== t6) {
+		t11 = /* @__PURE__ */ jsx(TextBox.Root, {
 			style: t5,
 			className: t6,
-			children: t9
+			children: t10
 		});
-		$[21] = t6;
-		$[22] = t9;
 		$[23] = t10;
-	} else t10 = $[23];
-	let t11;
-	if ($[24] !== cancelLabelChange || $[25] !== localizedStrings.cancel) {
-		t11 = /* @__PURE__ */ jsx(IconButton, {
-			icon: dismissSvg,
-			label: localizedStrings.cancel,
-			onClick: cancelLabelChange
-		});
-		$[24] = cancelLabelChange;
-		$[25] = localizedStrings.cancel;
-		$[26] = t11;
-	} else t11 = $[26];
-	const t12 = !canRename;
+		$[24] = t6;
+		$[25] = t11;
+	} else t11 = $[25];
+	let t12;
+	if ($[26] !== translate) {
+		t12 = translate("cancel");
+		$[26] = translate;
+		$[27] = t12;
+	} else t12 = $[27];
 	let t13;
-	if ($[27] !== handleLabelChange || $[28] !== localizedStrings.confirm || $[29] !== t12) {
+	if ($[28] !== cancelLabelChange || $[29] !== t12) {
 		t13 = /* @__PURE__ */ jsx(IconButton, {
-			icon: checkmarkSvg,
-			label: localizedStrings.confirm,
-			onClick: handleLabelChange,
-			disabled: t12
+			icon: dismissSvg,
+			label: t12,
+			onClick: cancelLabelChange
 		});
-		$[27] = handleLabelChange;
-		$[28] = localizedStrings.confirm;
+		$[28] = cancelLabelChange;
 		$[29] = t12;
 		$[30] = t13;
 	} else t13 = $[30];
 	let t14;
-	if ($[31] !== t10 || $[32] !== t11 || $[33] !== t13) {
-		t14 = /* @__PURE__ */ jsxs("div", {
+	if ($[31] !== translate) {
+		t14 = translate("confirm");
+		$[31] = translate;
+		$[32] = t14;
+	} else t14 = $[32];
+	const t15 = !canRename;
+	let t16;
+	if ($[33] !== handleLabelChange || $[34] !== t14 || $[35] !== t15) {
+		t16 = /* @__PURE__ */ jsx(IconButton, {
+			icon: checkmarkSvg,
+			label: t14,
+			onClick: handleLabelChange,
+			disabled: t15
+		});
+		$[33] = handleLabelChange;
+		$[34] = t14;
+		$[35] = t15;
+		$[36] = t16;
+	} else t16 = $[36];
+	let t17;
+	if ($[37] !== t11 || $[38] !== t13 || $[39] !== t16) {
+		t17 = /* @__PURE__ */ jsxs("div", {
 			className: "phr-node-label-editor-input-row",
 			children: [
-				t10,
 				t11,
-				t13
+				t13,
+				t16
 			]
 		});
-		$[31] = t10;
-		$[32] = t11;
-		$[33] = t13;
-		$[34] = t14;
-	} else t14 = $[34];
-	let t15;
-	if ($[35] !== hasError || $[36] !== inputId || $[37] !== labelValidationHint) {
-		t15 = labelValidationHint !== void 0 ? /* @__PURE__ */ jsx(Description, {
+		$[37] = t11;
+		$[38] = t13;
+		$[39] = t16;
+		$[40] = t17;
+	} else t17 = $[40];
+	let t18;
+	if ($[41] !== hasError || $[42] !== inputId || $[43] !== labelValidationHint) {
+		t18 = labelValidationHint !== void 0 ? /* @__PURE__ */ jsx(Description, {
 			id: inputId,
 			tone: hasError ? "critical" : "neutral",
 			style: { display: "flex" },
@@ -473,23 +508,23 @@ function LabelEditor(t0) {
 				children: labelValidationHint
 			})
 		}) : void 0;
-		$[35] = hasError;
-		$[36] = inputId;
-		$[37] = labelValidationHint;
-		$[38] = t15;
-	} else t15 = $[38];
-	let t16;
-	if ($[39] !== initialLabel || $[40] !== t14 || $[41] !== t15) {
-		t16 = /* @__PURE__ */ jsxs("div", {
+		$[41] = hasError;
+		$[42] = inputId;
+		$[43] = labelValidationHint;
+		$[44] = t18;
+	} else t18 = $[44];
+	let t19;
+	if ($[45] !== initialLabel || $[46] !== t17 || $[47] !== t18) {
+		t19 = /* @__PURE__ */ jsxs("div", {
 			className: "phr-node-label-editor",
-			children: [t14, t15]
+			children: [t17, t18]
 		}, initialLabel);
-		$[39] = initialLabel;
-		$[40] = t14;
-		$[41] = t15;
-		$[42] = t16;
-	} else t16 = $[42];
-	return t16;
+		$[45] = initialLabel;
+		$[46] = t17;
+		$[47] = t18;
+		$[48] = t19;
+	} else t19 = $[48];
+	return t19;
 }
 function injectActionVariant(actions, variant) {
 	return actions.filter((action) => isValidElement(action)).map((action) => cloneElement(action, { variant }));