@cognite/reveal-components 1.0.1 → 1.0.2

package/dist/ui/components/commandBased/buttons/DropdownButton.js

@@ -1,75 +1,94 @@
 import { useCommand as e } from "../hooks/useCommand.js";
 import { useCommandProps as t, useCommandVisible as n } from "../hooks/useCommandProps.js";
-import { mapButtonType as r } from "../utils/utilities.js";
-import { BaseOptionCommand as i, OptionType as a } from "../../../../foundation/commands/BaseOptionCommand.js";
-import { useState as o } from "react";
-import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
-import { Button as u } from "@cognite/aura/components/button";
-import { IconChevronDown as d, IconChevronUp as f } from "@tabler/icons-react";
-import { DropdownMenu as p, DropdownMenuCheckboxItem as m, DropdownMenuContent as h, DropdownMenuTrigger as g } from "@cognite/aura/components/dropdown-menu";
+import { LabelWithShortcut as r } from "../utils/LabelWithShortcut.js";
+import { mapButtonType as i } from "../utils/utilities.js";
+import { BaseOptionCommand as a, OptionType as o } from "../../../../foundation/commands/BaseOptionCommand.js";
+import { useState as s } from "react";
+import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
+import { Tooltip as d, TooltipContent as f, TooltipProvider as p, TooltipTrigger as m } from "@cognite/aura/components/tooltip";
+import { Button as h } from "@cognite/aura/components/button";
+import { IconChevronDown as g, IconChevronUp as _ } from "@tabler/icons-react";
+import { DropdownMenu as v, DropdownMenuCheckboxItem as y, DropdownMenuContent as b, DropdownMenuTrigger as x } from "@cognite/aura/components/dropdown-menu";
 //#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/DropdownButton.tsx
-function _(e, t) {
-	if (e instanceof i && e.optionType === a.Dropdown) return /* @__PURE__ */ c(v, {
+function S(e, { reason: t, event: n }) {
+	return !e && t === "trigger-press" && n instanceof MouseEvent && n.type === "click" && n.detail > 0;
+}
+function C(e, t) {
+	if (e instanceof a && e.optionType === o.Dropdown) return /* @__PURE__ */ l(w, {
 		inputCommand: e,
 		placement: t
 	}, e.uniqueId);
 }
-var v = ({ inputCommand: t, placement: r, usedInSettings: i = !1 }) => {
+var w = ({ inputCommand: t, placement: r, usedInSettings: i = !1 }) => {
 	let a = e(t);
-	return n(a) ? i ? /* @__PURE__ */ c(b, { command: a }) : /* @__PURE__ */ c(y, {
+	return n(a) ? i ? /* @__PURE__ */ l(E, { command: a }) : /* @__PURE__ */ l(T, {
 		command: a,
 		placement: r
-	}) : /* @__PURE__ */ c(s, {});
-}, y = ({ command: e, placement: n }) => {
-	let { uniqueId: i, isEnabled: a } = t(e), [m, _] = o(!1);
-	if (!e.children?.length) return /* @__PURE__ */ c(s, {});
-	let v = e.selectedChild?.label, y = r(e.buttonType);
+	}) : /* @__PURE__ */ l(c, {});
+}, T = ({ command: e, placement: n }) => {
+	let { uniqueId: a, isEnabled: o } = t(e), [y, C] = s(!1);
+	if (!e.children?.length) return /* @__PURE__ */ l(c, {});
+	let w = e.selectedChild?.label, T = i(e.buttonType), E = e.label;
 	return /* @__PURE__ */ l(p, {
-		open: m,
-		onOpenChange: _,
-		children: [/* @__PURE__ */ c(g, { render: /* @__PURE__ */ l(u, {
-			variant: y,
-			size: "sm",
-			disabled: !a,
-			"aria-label": e.label,
-			className: `pl-1 pr-2 py-1 ${m ? "bg-accent-background" : ""}`,
-			children: [c(m ? f : d, {}), v]
-		}, i) }), /* @__PURE__ */ c(h, {
-			side: n,
-			align: "start",
-			children: e.children.map((e) => /* @__PURE__ */ c(x, {
-				command: e,
-				setOpen: _
-			}, e.uniqueId))
-		})]
+		delayDuration: 500,
+		children: /* @__PURE__ */ u(d, {
+			disabled: E === void 0 || y,
+			children: [/* @__PURE__ */ u(v, {
+				open: y,
+				onOpenChange: (e, t) => {
+					S(e, t) || C(e);
+				},
+				children: [/* @__PURE__ */ l(m, { render: /* @__PURE__ */ l(x, { render: /* @__PURE__ */ u(h, {
+					variant: T,
+					size: "sm",
+					disabled: !o,
+					"aria-label": E,
+					className: `pl-1 pr-2 py-1 ${y ? "bg-accent-background" : ""}`,
+					children: [l(y ? _ : g, {}), w]
+				}, a) }) }), /* @__PURE__ */ l(b, {
+					side: n,
+					align: "start",
+					children: e.children.map((e) => /* @__PURE__ */ l(D, {
+						command: e,
+						setOpen: C
+					}, e.uniqueId))
+				})]
+			}), /* @__PURE__ */ l(f, {
+				side: n,
+				children: /* @__PURE__ */ l(r, {
+					label: E,
+					command: e
+				})
+			})]
+		})
 	});
-}, b = ({ command: e }) => {
-	let [t, n] = o(!1);
-	if (!e.children?.length) return /* @__PURE__ */ c(s, {});
+}, E = ({ command: e }) => {
+	let [t, n] = s(!1);
+	if (!e.children?.length) return /* @__PURE__ */ l(c, {});
 	let r = e.label, i = e.selectedChild?.label;
-	return /* @__PURE__ */ l("div", {
+	return /* @__PURE__ */ u("div", {
 		className: "flex flex-row self-stretch items-center gap-3",
-		children: [/* @__PURE__ */ c("p", {
+		children: [/* @__PURE__ */ l("p", {
 			title: r,
 			className: "w-[80px] truncate text-sm",
 			children: r
-		}), /* @__PURE__ */ c("div", {
+		}), /* @__PURE__ */ l("div", {
 			className: "flex-1",
-			children: /* @__PURE__ */ l(p, {
+			children: /* @__PURE__ */ u(v, {
 				open: t,
 				onOpenChange: n,
-				children: [/* @__PURE__ */ c(g, { render: /* @__PURE__ */ l(u, {
+				children: [/* @__PURE__ */ l(x, { render: /* @__PURE__ */ u(h, {
 					variant: "ghost",
 					"aria-label": r,
 					className: `w-full justify-between border border-transparent rounded-lg bg-background py-2 pl-2 pr-1 text-sm hover:bg-accent-background hover:border-border-emphasized${t ? " bg-accent-background" : ""}`,
-					children: [/* @__PURE__ */ c("span", {
+					children: [/* @__PURE__ */ l("span", {
 						className: "font-normal",
 						children: i
-					}), c(t ? f : d, {})]
-				}) }), /* @__PURE__ */ c(h, {
+					}), l(t ? _ : g, {})]
+				}) }), /* @__PURE__ */ l(b, {
 					side: "bottom",
 					align: "start",
-					children: e.children.map((e) => /* @__PURE__ */ c(x, {
+					children: e.children.map((e) => /* @__PURE__ */ l(D, {
 						command: e,
 						setOpen: n
 					}, e.uniqueId))
@@ -77,9 +96,9 @@ var v = ({ inputCommand: t, placement: r, usedInSettings: i = !1 }) => {
 			})
 		})]
 	});
-}, x = ({ command: e, setOpen: n }) => {
+}, D = ({ command: e, setOpen: n }) => {
 	let { isEnabled: r, isChecked: i } = t(e);
-	return /* @__PURE__ */ c(m, {
+	return /* @__PURE__ */ l(y, {
 		disabled: !r,
 		checked: i,
 		onCheckedChange: () => {
@@ -89,4 +108,4 @@ var v = ({ inputCommand: t, placement: r, usedInSettings: i = !1 }) => {
 	});
 };
 //#endregion
-export { v as DropdownButton, _ as createDropdownButton };
+export { w as DropdownButton, C as createDropdownButton, S as isSpuriousTriggerClickClose };

package/dist/ui/components/commandBased/treeView/DomainObjectTreeView/DomainObjectTreeView.function.d.ts

@@ -1,9 +1,20 @@
-import { BaseCommand } from '../../../../../domains';
+import { BaseCommand, DomainObject } from '../../../../../domains';
 import { TreeNodeType } from '../../../../../foundation/treeNodes/tree-node-type/tree-node-type';
 /**
  * Handles the selection of a domain object node.
  * @param node - The tree node to be selected or deselected.
+ * @param root - The root of the domain object tree, used to clear other selections.
  */
-export declare function onSelectDomainObject(node: TreeNodeType): void;
+export declare function onSelectDomainObject(node: TreeNodeType, root: DomainObject): void;
+/**
+ * Clears the highlight/selection of the node currently selected in any CAD node hierarchy
+ * @param root - The root of the domain object tree to search for CAD models.
+ */
+export declare function clearAllCadNodeSelections(root: DomainObject): void;
 export declare function onToggleDomainObject(node: TreeNodeType): void;
+/**
+ * Clears all selection/highlight state in the tree
+ * @param root - The root of the domain object tree.
+ */
+export declare function onClickTreeViewBackground(root: DomainObject): void;
 export declare function getContextMenu(node: TreeNodeType): BaseCommand[] | undefined;

package/dist/ui/components/commandBased/treeView/DomainObjectTreeView/DomainObjectTreeView.function.js

@@ -1,21 +1,29 @@
 import { DomainObject as e } from "../../../../../foundation/domainObjects/DomainObject.js";
+import { CadDomainObject as t } from "../../../../../domains/reveal/cad/CadDomainObject.js";
 import "../../../../../domains/index.js";
 //#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/DomainObjectTreeView/DomainObjectTreeView.function.tsx
-function t(t) {
-	if (t.onSelect !== void 0) {
+function n(t, n) {
+	if (r(n), t.onSelect !== void 0) {
 		t.onSelect();
 		return;
 	}
-	if (!(t instanceof e)) return;
-	let n = t.root;
-	for (let e of n.getThisAndDescendants()) e !== t && e.setSelected(!1);
-	t.setSelected(!t.isSelected);
+	if (t instanceof e) {
+		for (let e of n.getThisAndDescendants()) e !== t && e.setSelected(!1);
+		t.setSelected(!t.isSelected);
+	}
+}
+function r(e) {
+	for (let n of e.getDescendantsByType(t)) n.clearNodeSelection();
 }
-function n(e) {
+function i(e) {
 	e.toggleVisible?.();
 }
-function r(t) {
+function a(e) {
+	r(e);
+	for (let t of e.getThisAndDescendants()) t.setSelected(!1);
+}
+function o(t) {
 	if (t instanceof e) return t.getContextMenu();
 }
 //#endregion
-export { r as getContextMenu, t as onSelectDomainObject, n as onToggleDomainObject };
+export { r as clearAllCadNodeSelections, o as getContextMenu, a as onClickTreeViewBackground, n as onSelectDomainObject, i as onToggleDomainObject };

package/dist/ui/components/commandBased/treeView/DomainObjectTreeView/DomainObjectTreeView.js

@@ -4,29 +4,30 @@ import { CadTreeNodeViewAdapter as n } from "../../../../../foundation/treeNodes
 import { useCadNode3DInfo as r } from "../../../../query/useCadNode3DInfo.js";
 import { TreeView as i } from "../TreeView/tree-view.js";
 import { CadNodeInfoDialog as a } from "./CadNodeInfoDialog.js";
-import { getContextMenu as o, onSelectDomainObject as s, onToggleDomainObject as c } from "./DomainObjectTreeView.function.js";
-import { useState as l } from "react";
-import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { getContextMenu as o, onClickTreeViewBackground as s, onSelectDomainObject as c, onToggleDomainObject as l } from "./DomainObjectTreeView.function.js";
+import { useState as u } from "react";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/DomainObjectTreeView/DomainObjectTreeView.tsx
-var p = 20, m = () => {
-	let m = e(), [h, g] = l(void 0), [_, v] = l(!1), y = (e) => {
-		e instanceof n && (g(e), v(!0));
-	}, { data: b, isLoading: x, isError: S } = r(m.root.sdk, h?.revisionId, h?.node.nodeId);
-	return /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d(i, {
-		maxLabelLength: p,
-		root: m.root,
-		onSelectNode: s,
-		onToggleNode: c,
-		onClickInfo: y,
+var m = 20, h = () => {
+	let h = e(), [g, _] = u(void 0), [v, y] = u(!1), b = (e) => {
+		e instanceof n && (_(e), y(!0));
+	}, { data: x, isLoading: S, isError: C } = r(h.root.sdk, g?.revisionId, g?.node.nodeId);
+	return /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(i, {
+		maxLabelLength: m,
+		root: h.root,
+		onSelectNode: (e) => c(e, h.root),
+		onToggleNode: l,
+		onClickInfo: b,
+		onClickBackground: () => s(h.root),
 		getContextMenu: o,
 		getIconFromIconName: t.getIcon
-	}), /* @__PURE__ */ d(a, {
-		open: _,
-		onOpenChange: v,
-		node: b,
-		isLoading: x,
-		isError: S
+	}), /* @__PURE__ */ f(a, {
+		open: v,
+		onOpenChange: y,
+		node: x,
+		isLoading: S,
+		isError: C
 	})] });
 };
 //#endregion
-export { m as DomainObjectTreeView };
+export { h as DomainObjectTreeView };

package/dist/ui/components/commandBased/treeView/TreeView/components/tree-view-info.js

@@ -14,8 +14,8 @@ var c = ({ node: c, onClick: l }) => {
 				size: "icon-sm",
 				"aria-label": "Info",
 				className: "tree-view-info text-medium-foreground",
-				onClick: () => {
-					d(c);
+				onClick: (e) => {
+					e.stopPropagation(), d(c);
 				},
 				children: /* @__PURE__ */ e(o, {})
 			}) }), /* @__PURE__ */ e(r, {

package/dist/ui/components/commandBased/treeView/TreeView/extraComponents/CadTreeAssetMappingDropdown.js

@@ -1,69 +1,70 @@
 import { createInstanceKey as e, instanceIdToInstanceReference as t } from "../../../../../../data-providers/cache/idAndKeyTranslation.js";
 import { createInstanceReferenceKey as n } from "../../../../../../utilities/instanceIds/toKey.js";
+import { useMemoWithUpdateSignal as r } from "../../../../../../utilities/signal/useMemoWithUpdateSignal.js";
 import "../../../../../../utilities/index.js";
-import { CadTreeAssetMappingDropdownContext as r } from "./CadTreeAssetMappingDropdown.context.js";
-import { useContext as i } from "react";
-import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Tooltip as c, TooltipContent as l, TooltipProvider as u, TooltipTrigger as d } from "@cognite/aura/components/tooltip";
-import { IconLink as f, IconTrash as p } from "@tabler/icons-react";
-import { Label as m } from "@cognite/aura/components/label";
-import { Popover as h, PopoverContent as g, PopoverTrigger as _ } from "@cognite/aura/components/popover";
-import { cn as v } from "@cognite/aura/utils";
+import { CadTreeAssetMappingDropdownContext as i } from "./CadTreeAssetMappingDropdown.context.js";
+import { useContext as a, useMemo as o } from "react";
+import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
+import { Tooltip as u, TooltipContent as d, TooltipProvider as f, TooltipTrigger as p } from "@cognite/aura/components/tooltip";
+import { IconLink as m, IconTrash as h } from "@tabler/icons-react";
+import { Label as g } from "@cognite/aura/components/label";
+import { Popover as _, PopoverContent as v, PopoverTrigger as y } from "@cognite/aura/components/popover";
+import { cn as b } from "@cognite/aura/utils";
 //#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/TreeView/extraComponents/CadTreeAssetMappingDropdown.tsx
-var y = 28;
-function b({ cadTreeNode: p }) {
-	let { useInstancesByIdsQuery: m } = i(r), y = p.getInstanceMappings(), { data: b } = m(y.map((e) => t(e.instance)));
-	if (y === void 0 || b === void 0 || b.size === 0) return /* @__PURE__ */ o(a, {});
-	let S = async (e) => {
+var x = 28;
+function S({ cadTreeNode: h }) {
+	let { useInstancesByIdsQuery: g } = a(i), x = r(() => h.getInstanceMappings(), h.updateSignal, [h]), { data: S } = g(o(() => x.map((e) => t(e.instance)), [x]));
+	if (S === void 0 || S.size === 0) return /* @__PURE__ */ c(s, {});
+	let w = async (e) => {
 		try {
-			await p.deleteInstanceMapping(e);
+			await h.deleteInstanceMapping(e);
 		} catch (e) {
 			console.error("CAD Instance mapping deletion failed: ", e);
 		}
 	};
-	return /* @__PURE__ */ o(a, { children: /* @__PURE__ */ o(u, {
+	return /* @__PURE__ */ c(s, { children: /* @__PURE__ */ c(f, {
 		delayDuration: 500,
-		children: /* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(d, { children: /* @__PURE__ */ s(h, { children: [/* @__PURE__ */ o(_, { render: /* @__PURE__ */ o("div", {
+		children: /* @__PURE__ */ l(u, { children: [/* @__PURE__ */ c(p, { children: /* @__PURE__ */ l(_, { children: [/* @__PURE__ */ c(y, { render: /* @__PURE__ */ c("div", {
 			role: "button",
 			tabIndex: 0,
-			className: v("flex shrink-0 items-center justify-center rounded-lg", "hover:bg-accent-background", "cursor-pointer transition-all"),
-			children: /* @__PURE__ */ o(f, { className: "size-4" })
-		}) }), /* @__PURE__ */ o(g, {
+			className: b("flex shrink-0 items-center justify-center rounded-lg", "hover:bg-accent-background", "cursor-pointer transition-all"),
+			children: /* @__PURE__ */ c(m, { className: "size-4" })
+		}) }), /* @__PURE__ */ c(v, {
 			side: "right",
 			align: "start",
 			sideOffset: 2,
 			className: "p-0 flex justify-between",
-			children: /* @__PURE__ */ o("div", {
+			children: /* @__PURE__ */ c("div", {
 				className: "max-h-[600px] w-full overflow-x-hidden overflow-y-auto flex p-1.5 flex-col gap-1.5 rounded-lg bg-white shadow-[0px_1px_16px_4px_rgba(79,82,104,0.1),0px_1px_8px_0px_rgba(79,82,104,0.08),0px_1px_2px_0px_rgba(79,82,104,0.24)]",
-				children: y.map((r) => {
-					let i = n(t(r.instance)), a = b.get(i);
-					return /* @__PURE__ */ o(x, {
+				children: x.map((r) => {
+					let i = n(t(r.instance)), a = S.get(i);
+					return /* @__PURE__ */ c(C, {
 						name: a?.name ?? `${i}`,
-						deleteDelegate: p.canDelete ? () => S(r) : void 0
+						deleteDelegate: h.canDelete ? () => w(r) : void 0
 					}, e(r.instance));
 				})
 			})
-		})] }) }), /* @__PURE__ */ o(l, {
+		})] }) }), /* @__PURE__ */ c(d, {
 			side: "right",
 			children: "Show asset mappings"
 		})] })
 	}) });
 }
-function x({ name: e, deleteDelegate: t }) {
-	let n = e.length !== void 0 && e.length > y ? `${e.slice(0, y)}...` : e;
-	return /* @__PURE__ */ s("div", {
+function C({ name: e, deleteDelegate: t }) {
+	let n = e.length !== void 0 && e.length > x ? `${e.slice(0, x)}...` : e;
+	return /* @__PURE__ */ l("div", {
 		className: "flex flex-row justify-between",
-		children: [/* @__PURE__ */ o(u, { children: /* @__PURE__ */ s(c, { children: [/* @__PURE__ */ o(d, { render: /* @__PURE__ */ o(m, {
+		children: [/* @__PURE__ */ c(f, { children: /* @__PURE__ */ l(u, { children: [/* @__PURE__ */ c(p, { render: /* @__PURE__ */ c(g, {
 			className: "p-0",
 			children: n
-		}) }), /* @__PURE__ */ o(l, { children: e })] }) }), t !== void 0 && /* @__PURE__ */ o("div", {
+		}) }), /* @__PURE__ */ c(d, { children: e })] }) }), t !== void 0 && /* @__PURE__ */ c("div", {
 			role: "button",
 			tabIndex: 0,
-			className: v("inline-flex size-5 shrink-0 items-center justify-center rounded-sm", "text-destructive-foreground-on-critical", "hover:bg-destructive-background-hover", "cursor-pointer transition-all"),
+			className: b("inline-flex size-5 shrink-0 items-center justify-center rounded-sm", "text-destructive-foreground-on-critical", "hover:bg-destructive-background-hover", "cursor-pointer transition-all"),
 			onClick: t,
-			children: /* @__PURE__ */ o(p, {})
+			children: /* @__PURE__ */ c(h, {})
 		})]
 	});
 }
 //#endregion
-export { b as CadTreeAssetMappingDropdown };
+export { S as CadTreeAssetMappingDropdown };

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-node.js

@@ -32,6 +32,7 @@ var u = ({ node: r, level: u, props: d, openContextMenu: p }) => {
 				/* @__PURE__ */ c("div", {
 					className: "flex flex-row items-center tree-view-node-row gap-1.5",
 					role: "row",
+					onClick: (e) => e.stopPropagation(),
 					children: [
 						/* @__PURE__ */ s(_, { node: r }),
 						E && /* @__PURE__ */ s(v, {

package/dist/ui/components/commandBased/treeView/TreeView/tree-view-props.d.ts

@@ -13,6 +13,7 @@ export type TreeViewProps = {
     maxLabelLength?: number;
     onSelectNode?: TreeNodeSelectAction;
     onToggleNode?: TreeNodeAction;
+    onClickBackground?: () => void;
     onClickInfo?: TreeNodeAction;
     getContextMenu?: GetTreeNodeContextMenu;
     onKeyDown?: (root: TreeNodeType, event: KeyboardEvent) => boolean;

package/dist/ui/components/commandBased/treeView/TreeView/tree-view.js

@@ -4,50 +4,52 @@ import { forwardRef as n, useCallback as r, useContext as i, useState as a } fro
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region libs/shared/reveal-components/src/ui/components/commandBased/treeView/TreeView/tree-view.tsx
 var l = n((n, l) => {
-	let { loader: u, onKeyDown: d, getContextMenu: f, showRoot: p, className: m } = n, h = u?.root ?? n.root, { Loader: g, TreeViewNode: _, TreeViewContextMenu: v } = i(t), [y, b] = a(0), [x, S] = a(void 0);
-	h === void 0 && u?.loadInitialRoot !== void 0 && u.loadInitialRoot().then(() => {
-		b((e) => e + 1);
+	let { loader: u, onKeyDown: d, onClickBackground: f, getContextMenu: p, showRoot: m, className: h } = n, g = u?.root ?? n.root, { Loader: _, TreeViewNode: v, TreeViewContextMenu: y } = i(t), [b, x] = a(0), [S, C] = a(void 0);
+	g === void 0 && u?.loadInitialRoot !== void 0 && u.loadInitialRoot().then(() => {
+		x((e) => e + 1);
 	});
-	let C = r((e, t) => {
-		if (f !== void 0) {
-			let n = f(e);
-			n !== void 0 && n.length > 0 && S({
+	let w = r((e, t) => {
+		if (p !== void 0) {
+			let n = p(e);
+			n !== void 0 && n.length > 0 && C({
 				commands: n,
 				position: t
 			});
 		}
-	}, [f]), w = r((e) => {
-		h !== void 0 && d !== void 0 && d(h, e.nativeEvent) && e.preventDefault();
-	}, [d, h]);
-	if (h === void 0) return /* @__PURE__ */ s(g, {});
-	let T = p === !1 ? /* @__PURE__ */ s("div", {
+	}, [p]), T = r((e) => {
+		g !== void 0 && d !== void 0 && d(g, e.nativeEvent) && e.preventDefault();
+	}, [d, g]);
+	if (g === void 0) return /* @__PURE__ */ s(_, {});
+	let E = m === !1 ? /* @__PURE__ */ s("div", {
 		ref: l,
-		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${m === void 0 ? "" : ` ${m}`}`,
-		onKeyDown: w,
+		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${h === void 0 ? "" : ` ${h}`}`,
+		onKeyDown: T,
+		onClick: f,
 		tabIndex: 0,
 		role: "tree",
-		children: e(h, u, !1)?.map((e) => /* @__PURE__ */ s(_, {
+		children: e(g, u, !1)?.map((e) => /* @__PURE__ */ s(v, {
 			node: e,
 			level: 0,
 			props: n,
-			openContextMenu: C
+			openContextMenu: w
 		}, e.id))
 	}) : /* @__PURE__ */ s("div", {
 		ref: l,
-		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${m === void 0 ? "" : ` ${m}`}`,
-		onKeyDown: w,
+		className: `overflow-auto m-2 outline-none w-auto h-auto whitespace-nowrap pb-1${h === void 0 ? "" : ` ${h}`}`,
+		onKeyDown: T,
+		onClick: f,
 		tabIndex: 0,
 		role: "tree",
-		children: /* @__PURE__ */ s(_, {
-			node: h,
+		children: /* @__PURE__ */ s(v, {
+			node: g,
 			level: 0,
 			props: n,
-			openContextMenu: C
-		}, h.id)
+			openContextMenu: w
+		}, g.id)
 	});
-	return /* @__PURE__ */ c(o, { children: [T, x !== void 0 && /* @__PURE__ */ s(v, {
-		state: x,
-		onClose: () => S(void 0)
+	return /* @__PURE__ */ c(o, { children: [E, S !== void 0 && /* @__PURE__ */ s(y, {
+		state: S,
+		onClose: () => C(void 0)
 	})] });
 });
 //#endregion

package/dist/ui/components/i18n/I18n.js

@@ -7,7 +7,7 @@ import { createContext as a, useContext as o, useEffect as s, useState as c } fr
 import { jsx as l } from "react/jsx-runtime";
 //#region libs/shared/reveal-components/src/ui/components/i18n/I18n.tsx
 var u = a(null), d = (i, a = !0) => {
-	let o = i ?? r() ?? "en", [l, u] = c(o), [d, f] = c({});
+	let o = i ?? r() ?? "en", [l, u] = c(o), [d, f] = c({}), p = l === "en" ? t : d;
 	return s(() => {
 		if (!a) return;
 		let e = () => {
@@ -18,7 +18,7 @@ var u = a(null), d = (i, a = !0) => {
 			window.removeEventListener("languagechange", e);
 		};
 	}, [a, l]), s(() => {
-		a && (async () => {
+		!a || l === "en" || (async () => {
 			try {
 				let t = await e(/* #__PURE__ */ Object.assign({
 					"../../../common/i18n/de/reveal-components.json": () => import("../../../common/i18n/de/reveal-components.js"),
@@ -44,7 +44,7 @@ var u = a(null), d = (i, a = !0) => {
 		});
 	}, [l, a]), {
 		currentLanguage: l,
-		t: (e) => n(e) ? d[e.key] === void 0 ? t[e.key] : d[e.key] : e.untranslated
+		t: (e) => n(e) ? p[e.key] === void 0 ? t[e.key] : p[e.key] : e.untranslated
 	};
 }, f = (e) => {
 	let t = o(u), n = r() ?? "en", i = d(e ?? n, t === null);

package/dist/ui/components/index.d.ts

@@ -15,4 +15,4 @@ export { RevealContext, type RevealContextProps } from './RevealContext';
 export { RevealToolbar } from './RevealToolbar';
 export { SceneContainer, type SceneContainerProps, type SceneIdentifiers, useLoadedScene, } from './SceneContainer';
 export { type BooleanCondition, type BooleanConditionTypes, type BooleanExpression, type ColorRuleOutput, type ConcreteExpression, type CriteriaTypes, type DatetimeBetweenConditionType, type DatetimeCondition, type DatetimeConditionTypes, type DatetimeExpression, type DatetimeUniqueConditionTypes, type Expression, type ExpressionOperator, type ExpressionOperatorsTypes, type FdmInstanceNodeDataKey, type FdmKeyRuleTriggerTyping, type FdmRuleTrigger, type FdmRuleTriggerTyping, getRuleTriggerTypes, type MetadataRuleTrigger, type NumericCondition, type NumericConditionTypes, type NumericExpression, type NumericOutsideConditionType, type NumericUniqueConditionTypes, type NumericWithinConditionType, type Rule, type RuleAndEnabled, RuleBasedOutputsPanel, type RuleOutput, type RuleOutputSet, type RuleWithOutputs, type StringCondition, type StringConditionTypes, type StringExpression, type TimeseriesRuleTrigger, type TriggerType, useCreateRuleInstance, useDeleteRuleInstance, useEditRuleInstance, useFetchRuleInstances, useSearchRuleInstance, } from './RuleBasedOutputs';
-export { RevealWidget, RevealWidgetCameraController, RevealWidgetController, type RevealWidgetProps, Default3DStyles, } from './Widget';
+export { RevealWidget, RevealWidgetCameraController, RevealWidgetController, type RevealWidgetProps, type RevealWidgetTrackingProps, Default3DStyles, } from './Widget';

package/dist/ui/hooks/network/fetchLinkFromRelationshipsByTimeseries.js

@@ -1,14 +1,14 @@
-import { executeParallel as e } from "../../../utilities/executeParallel.js";
-import { isDefined as t } from "../../../utilities/isDefined.js";
+import { isDefined as e } from "../../../utilities/isDefined.js";
+import { executeParallel as t } from "../../../utilities/executeParallel.js";
 import { getRelationships as n } from "./getRelationships.js";
 import { chunk as r } from "lodash-es";
 //#region libs/shared/reveal-components/src/ui/hooks/network/fetchLinkFromRelationshipsByTimeseries.ts
 var i = 1e3, a = async (a, o, s) => {
 	let c = r(o, i);
-	return (await e(c.map((e) => async () => await n(a, {
+	return (await t(c.map((e) => async () => await n(a, {
 		resourceExternalIds: e,
 		relationshipResourceTypes: s
-	})), 2)).filter(t).flat()?.map((e) => {
+	})), 2)).filter(e).flat()?.map((e) => {
 		let t = {
 			assetIds: { externalId: "" },
 			timeseriesIds: { externalId: "" }

package/dist/ui/hooks/network/getImage360CollectionsForDmInstance.js

@@ -1,11 +1,11 @@
 import { restrictToDmsId as e } from "../../../utilities/restrictToDmsId.js";
-import { createDmsQueryDataAccumulator as t } from "../../../utilities/dms-cursoring/dmsAccumulator.js";
-import { COGNITE_IMAGE_360_SOURCE as n, COGNITE_VISUALIZABLE_SOURCE as r } from "../../../data-providers/core-dm-provider/dataModels.js";
+import { COGNITE_IMAGE_360_SOURCE as t, COGNITE_VISUALIZABLE_SOURCE as n } from "../../../data-providers/core-dm-provider/dataModels.js";
+import { createDmsQueryDataAccumulator as r } from "../../../utilities/dms-cursoring/dmsAccumulator.js";
 import { hasDataImage360AnnotationContainerFilter as i, hasDataImage360ContainerFilter as a, hasDataObject3DContainerFilter as o, hasDataVisualizableContainerFilter as s, isCoreDmImage360CollectionFilter as c } from "../../../data-providers/core-dm-provider/utils/filters.js";
 //#region libs/shared/reveal-components/src/ui/hooks/network/getImage360CollectionsForDmInstance.ts
-async function l(n, r) {
-	let i = u(n);
-	return (await t(r, i, { serial: [
+async function l(t, n) {
+	let i = u(t);
+	return (await r(n, i, { serial: [
 		"image_360_annotations",
 		"image_360s",
 		"image_360_collections"
@@ -22,7 +22,7 @@ function u(e) {
 			object_3ds: { nodes: {
 				from: "asset",
 				through: {
-					view: r,
+					view: n,
 					identifier: "object3D"
 				},
 				direction: "outwards",
@@ -41,7 +41,7 @@ function u(e) {
 			image_360_collections: { nodes: {
 				from: "image_360s",
 				through: {
-					view: n,
+					view: t,
 					identifier: "collection360"
 				},
 				direction: "outwards",

package/dist/ui/hooks/network/getTimeseriesLatestDatapoints.js

@@ -1,10 +1,10 @@
-import { executeParallel as e } from "../../../utilities/executeParallel.js";
-import { isDefined as t } from "../../../utilities/isDefined.js";
+import { isDefined as e } from "../../../utilities/isDefined.js";
+import { executeParallel as t } from "../../../utilities/executeParallel.js";
 import { chunk as n } from "lodash-es";
 //#region libs/shared/reveal-components/src/ui/hooks/network/getTimeseriesLatestDatapoints.ts
 var r = 100, i = async (i, a) => {
 	let o = n(a, r);
-	return (await e(o.map((e) => async () => await i.datapoints.retrieveLatest(e)), 2)).filter(t).flat();
+	return (await t(o.map((e) => async () => await i.datapoints.retrieveLatest(e)), 2)).filter(e).flat();
 };
 //#endregion
 export { i as getTimeseriesLatestDatapoints };

package/dist/ui/hooks/pointClouds/fetchAnnotationsForModel.js

@@ -1,10 +1,10 @@
-import { isDefined as e } from "../../../utilities/isDefined.js";
-import { isDmAsset as t } from "../../../utilities/instances/typeGuards.js";
+import { isDmAsset as e } from "../../../utilities/instances/typeGuards.js";
 import "../../../utilities/instances/index.js";
+import { isDefined as t } from "../../../utilities/isDefined.js";
 //#region libs/shared/reveal-components/src/ui/hooks/pointClouds/fetchAnnotationsForModel.ts
 var n = async (n, r, i, a) => {
-	if (n !== void 0 && r !== void 0 && i !== void 0) return (await Promise.all(i.map(async (e) => await a.matchPointCloudAnnotationsForModel(n, r, e)))).filter(e).flatMap((e) => Array.from(e.entries()).flatMap(([e, n]) => n.map((n) => (t(n), {
-		annotationId: e,
+	if (n !== void 0 && r !== void 0 && i !== void 0) return (await Promise.all(i.map(async (e) => await a.matchPointCloudAnnotationsForModel(n, r, e)))).filter(t).flatMap((t) => Array.from(t.entries()).flatMap(([t, n]) => n.map((n) => (e(n), {
+		annotationId: t,
 		asset: n
 	}))));
 };