@cognite/reveal-components 1.0.0

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

@@ -0,0 +1,55 @@
+import { useCommand as e } from "../hooks/useCommand.js";
+import { useCommandProps as t } from "../hooks/useCommandProps.js";
+import { LabelWithShortcut as n } from "../utils/LabelWithShortcut.js";
+import { CommandButtonInner as r } from "./CommandButtonInner.js";
+import { HelpCommand as i } from "../../../../foundation/concreteCommands/general/HelpCommand.js";
+import { KeyboardNavigation as a } from "../../RevealToolbar/Help/KeyboardNavigation.js";
+import { MouseNavigation as o } from "../../RevealToolbar/Help/MouseNavigation.js";
+import { TouchNavigation as s } from "../../RevealToolbar/Help/TouchNavigation.js";
+import { BaseTooltipTrigger as c, CommandTooltipPopup as l, useCommandTooltipHandle as u } from "./PopupTriggerButton.js";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { Popover as m, PopoverContent as h, PopoverTrigger as g } from "@cognite/aura/components/popover";
+import { useSignalValue as _ } from "@cognite/signal-utils/react";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/HelpButton.tsx
+function v(e, t) {
+	if (e instanceof i) return /* @__PURE__ */ f(y, {
+		inputCommand: e,
+		placement: t
+	}, e.uniqueId);
+}
+var y = ({ inputCommand: i, placement: v }) => {
+	let y = e(i), b = _(y.isOpen), { isVisible: x } = t(y), S = u();
+	return x ? /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ p(m, {
+		open: b,
+		onOpenChange: (e) => {
+			y.isOpen(e);
+		},
+		children: [/* @__PURE__ */ f(g, { render: /* @__PURE__ */ f(c, {
+			handle: S,
+			render: /* @__PURE__ */ f(r, { inputCommand: i })
+		}) }), /* @__PURE__ */ f(h, {
+			side: v,
+			align: "end",
+			sideOffset: 12,
+			className: "p-0 w-max overflow-hidden",
+			children: /* @__PURE__ */ p("div", {
+				className: "flex flex-col gap-6 p-4 max-h-[20vw] overflow-y-auto bg-[#516efa]",
+				children: [
+					/* @__PURE__ */ f(o, {}),
+					/* @__PURE__ */ f(a, {}),
+					/* @__PURE__ */ f(s, {})
+				]
+			})
+		})]
+	}), /* @__PURE__ */ f(l, {
+		handle: S,
+		side: v,
+		disabled: b,
+		children: /* @__PURE__ */ f(n, {
+			label: y.label,
+			command: y
+		})
+	})] }) : /* @__PURE__ */ f(d, {});
+};
+//#endregion
+export { v as createHelpButton };

package/dist/ui/components/commandBased/buttons/InputField.d.ts

@@ -0,0 +1,8 @@
+import { ReactElement, ReactNode } from 'react';
+import { BaseCommand } from '../../../../domains';
+import { BaseInputCommand } from '../../../../foundation/commands/BaseInputCommand';
+import { PlacementType } from '../utils/types';
+export declare function createInputField(command: BaseCommand, _: PlacementType): ReactElement | undefined;
+export declare const InputField: ({ inputCommand, }: {
+    inputCommand: BaseInputCommand;
+}) => ReactNode;

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

@@ -0,0 +1,30 @@
+import { translateIfExists as e } from "../../../../foundation/utilities/translation/translateUtils.js";
+import { useCommand as t } from "../hooks/useCommand.js";
+import { useCommandProperty as n } from "../hooks/useCommandProperty.js";
+import { useCommandProps as r } from "../hooks/useCommandProps.js";
+import { Comment as i } from "../main/Comment.js";
+import { BaseInputCommand as a } from "../../../../foundation/commands/BaseInputCommand.js";
+import { Fragment as o, jsx as s } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/InputField.tsx
+function c(e, t) {
+	if (e instanceof a) return /* @__PURE__ */ s(l, { inputCommand: e }, e.uniqueId);
+}
+var l = ({ inputCommand: a }) => {
+	let c = t(a), l = n(c, () => c.content), u = n(c, () => e(c.getPostButtonLabel())), d = n(c, () => e(c.getCancelButtonLabel())), f = n(c, () => e(c.getPlaceholder())), p = n(c, () => c.isPostButtonEnabled), { uniqueId: m, isVisible: h, isEnabled: g } = r(c);
+	return h ? /* @__PURE__ */ s(i, {
+		placeholder: f,
+		message: l,
+		setMessage: (e) => c.content = e,
+		onPostMessage: () => {
+			c.invoke(), c.content = "";
+		},
+		postButtonText: u,
+		postButtonDisabled: !(p && g),
+		cancelButtonText: d,
+		cancelButtonDisabled: !1,
+		onCancel: c.onCancel,
+		showButtons: !0
+	}, m) : /* @__PURE__ */ s(o, {});
+};
+//#endregion
+export { l as InputField, c as createInputField };

package/dist/ui/components/commandBased/buttons/PopupTriggerButton.d.ts

@@ -0,0 +1,25 @@
+import { ReactNode } from 'react';
+import { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';
+import { PlacementType } from '../utils/types';
+export type CommandTooltipHandle = ReturnType<typeof BaseTooltip.createHandle>;
+/**
+ * Re-exported so popup buttons can import the Base UI Trigger without knowing
+ * the internal module path.
+ */
+export declare const BaseTooltipTrigger: BaseTooltip.Trigger;
+/**
+ * Creates a Base UI tooltip handle for decoupled tooltip ↔ trigger wiring.
+ * Use with `BaseTooltipTrigger` in the trigger render prop and
+ * `CommandTooltipPopup` as a sibling.
+ */
+export declare function useCommandTooltipHandle(): CommandTooltipHandle;
+/**
+ * The decoupled tooltip popup, linked to its trigger purely by `handle`.
+ * Render as a sibling of the Popover/DropdownMenu, NOT inside the trigger.
+ */
+export declare const CommandTooltipPopup: ({ handle, side, disabled, children, }: {
+    handle: CommandTooltipHandle;
+    side: PlacementType;
+    disabled?: boolean;
+    children: ReactNode;
+}) => ReactNode;

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

@@ -0,0 +1,21 @@
+import { useMemo as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+import { Tooltip as n, TooltipContent as r, TooltipProvider as i } from "@cognite/aura/components/tooltip";
+import { Tooltip as a } from "@base-ui/react/tooltip";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/PopupTriggerButton.tsx
+var o = a.Trigger;
+function s() {
+	return e(() => a.createHandle(), []);
+}
+var c = ({ handle: e, side: a, disabled: o = !1, children: s }) => o ? null : /* @__PURE__ */ t(i, {
+	delayDuration: 500,
+	children: /* @__PURE__ */ t(n, {
+		handle: e,
+		children: /* @__PURE__ */ t(r, {
+			side: a,
+			children: s
+		})
+	})
+});
+//#endregion
+export { o as BaseTooltipTrigger, c as CommandTooltipPopup, s as useCommandTooltipHandle };

package/dist/ui/components/commandBased/buttons/SegmentedButtons.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement } from 'react';
+import { BaseCommand } from '../../../../domains';
+import { BaseOptionCommand } from '../../../../foundation/commands/BaseOptionCommand';
+import { PlacementType } from '../utils/types';
+export declare function createSegmentedButtons(command: BaseCommand, placement: PlacementType): ReactElement | undefined;
+export declare const SegmentedButtons: ({ inputCommand, placement, fullWidth, }: {
+    inputCommand: BaseOptionCommand;
+    placement: PlacementType;
+    fullWidth?: boolean;
+}) => ReactElement;

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

@@ -0,0 +1,67 @@
+import { useRenderTarget as e } from "../../RevealCanvas/ViewerContext.js";
+import { useCommand as t } from "../hooks/useCommand.js";
+import { useCommandProperty as n } from "../hooks/useCommandProperty.js";
+import { useCommandProps as r } from "../hooks/useCommandProps.js";
+import { LabelWithShortcut as i } from "../utils/LabelWithShortcut.js";
+import { IconComponent as a } from "../Factories/IconFactory.js";
+import { BaseOptionCommand as o, OptionType as s } from "../../../../foundation/commands/BaseOptionCommand.js";
+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 { SegmentedControl as h, SegmentedControlButton as g, SegmentedControlList as _ } from "@cognite/aura/components/segmented-control";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/SegmentedButtons.tsx
+function v(e, t) {
+	if (e instanceof o && e.optionType === s.Segmented) return /* @__PURE__ */ l(y, {
+		inputCommand: e,
+		placement: t
+	}, e.uniqueId);
+}
+var y = ({ inputCommand: o, placement: s, fullWidth: v = !1 }) => {
+	let y = e(), x = t(o), { uniqueId: S, isVisible: C, isEnabled: w } = r(x), T = n(x, () => b(x));
+	if (!C || x.children === void 0) return /* @__PURE__ */ l(c, {});
+	let E = x.label;
+	return /* @__PURE__ */ l(p, {
+		delayDuration: 500,
+		children: /* @__PURE__ */ u(d, {
+			open: E !== void 0 && void 0,
+			children: [/* @__PURE__ */ l(m, { render: /* @__PURE__ */ l(h, {
+				value: T,
+				onValueChange: (e) => {
+					if (x.children !== void 0) {
+						for (let t of x.children) if (t.uniqueId === e) {
+							t.invoke(), y.domElement.focus();
+							break;
+						}
+					}
+				},
+				className: v ? "w-full" : void 0,
+				children: /* @__PURE__ */ l(_, {
+					size: "small",
+					children: x.children.map((e) => /* @__PURE__ */ l(g, {
+						value: e.uniqueId,
+						disabled: !w,
+						"aria-label": e.label,
+						children: /* @__PURE__ */ u("span", {
+							className: "text-foreground flex items-center gap-1",
+							children: [/* @__PURE__ */ l(a, { iconName: e.icon }), /* @__PURE__ */ l("span", {
+								className: "font-medium text-sm",
+								children: e.label
+							})]
+						})
+					}, e.uniqueId))
+				})
+			}, S) }), /* @__PURE__ */ l(f, {
+				side: s,
+				children: /* @__PURE__ */ l(i, {
+					label: E,
+					command: x
+				})
+			})]
+		})
+	});
+};
+function b(e) {
+	let t = e.selectedChild;
+	return t === void 0 ? "undefined" : t.uniqueId;
+}
+//#endregion
+export { y as SegmentedButtons, v as createSegmentedButtons };

package/dist/ui/components/commandBased/buttons/SettingsButton.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement } from 'react';
+import { SettingsCommand } from '../../../../domains';
+import { BaseCommand } from '../../../../foundation/commands/BaseCommand';
+import { PlacementType } from '../utils/types';
+export declare function createSettingsButton(command: BaseCommand, placement: PlacementType): ReactElement | undefined;
+export declare const SettingsButton: ({ inputCommand, placement, }: {
+    inputCommand: SettingsCommand;
+    placement: PlacementType;
+}) => ReactElement;

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

@@ -0,0 +1,191 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { useCommand as t } from "../hooks/useCommand.js";
+import { useCommandProps as n, useCommandVisible as r, useSliderCommandValue as i } from "../hooks/useCommandProps.js";
+import { LabelWithShortcut as a } from "../utils/LabelWithShortcut.js";
+import { IconComponent as o } from "../Factories/IconFactory.js";
+import { CommandButtonInner as s } from "./CommandButtonInner.js";
+import { SectionCommand as c } from "../../../../foundation/commands/SectionCommand.js";
+import { BaseOptionCommand as l } from "../../../../foundation/commands/BaseOptionCommand.js";
+import { DropdownButton as u } from "./DropdownButton.js";
+import { BaseFilterCommand as d } from "../../../../foundation/commands/BaseFilterCommand.js";
+import { FilterButton as f } from "./FilterButton.js";
+import { BaseTooltipTrigger as p, CommandTooltipPopup as m, useCommandTooltipHandle as h } from "./PopupTriggerButton.js";
+import { SegmentedButtons as g } from "./SegmentedButtons.js";
+import { BaseSliderCommand as _ } from "../../../../foundation/commands/BaseSliderCommand.js";
+import { GroupCommand as v } from "../../../../foundation/commands/GroupCommand.js";
+import { BaseBannerCommand as y } from "../../../../foundation/commands/BaseBannerCommand.js";
+import { QualityWarningBannerCommand as b } from "../../../../foundation/concreteCommands/quality/QualityWarningBannerCommand.js";
+import { SetLengthUnitCommand as x } from "../../../../foundation/concreteCommands/units/SetLengthUnitCommand.js";
+import { SettingsCommand as S } from "../../../../foundation/concreteCommands/general/SettingsCommand.js";
+import "../../../../domains/index.js";
+import { BannerComponent as C } from "./BannerComponent.js";
+import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
+import { IconAlertTriangle as D, IconChevronDown as O } from "@tabler/icons-react";
+import { Popover as k, PopoverContent as A, PopoverTrigger as j } from "@cognite/aura/components/popover";
+import { useSignalValue as M } from "@cognite/signal-utils/react";
+import { Collapsible as N, CollapsibleContent as P, CollapsibleTrigger as F } from "@cognite/aura/components/collapsible";
+import { Slider as I } from "@cognite/aura/components/slider";
+import { Switch as L } from "@cognite/aura/components/switch";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/SettingsButton.tsx
+function R(e, t) {
+	if (e instanceof S) return /* @__PURE__ */ T(z, {
+		inputCommand: e,
+		placement: t
+	}, e.uniqueId);
+}
+var z = ({ inputCommand: e, placement: r }) => {
+	let i = t(e), o = M(i.isOpen), { isVisible: c, isEnabled: l } = n(i), u = h();
+	if (!c || !i.hasChildren) return /* @__PURE__ */ T(w, {});
+	let d = i.label;
+	return /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ E(k, {
+		open: o,
+		onOpenChange: (e) => {
+			i.isOpen(e);
+		},
+		children: [/* @__PURE__ */ T(j, {
+			disabled: !l,
+			render: /* @__PURE__ */ T(p, {
+				handle: u,
+				render: /* @__PURE__ */ T(s, { inputCommand: e })
+			})
+		}), /* @__PURE__ */ T(A, {
+			side: r,
+			align: "end",
+			sideOffset: 12,
+			className: "p-0 w-[350px]",
+			children: /* @__PURE__ */ T("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: i.children.map(B)
+			})
+		})]
+	}), /* @__PURE__ */ T(m, {
+		handle: u,
+		side: r,
+		disabled: o,
+		children: /* @__PURE__ */ T(a, {
+			label: d,
+			command: i
+		})
+	})] });
+};
+function B(e) {
+	return e instanceof y ? /* @__PURE__ */ T(C, { command: e }, e.uniqueId) : e instanceof v ? /* @__PURE__ */ T(U, { command: e }, e.uniqueId) : V(e);
+}
+function V(e) {
+	return e instanceof b ? /* @__PURE__ */ T(H, { command: e }, e.uniqueId) : e instanceof _ ? /* @__PURE__ */ T(q, { command: e }, e.uniqueId) : e instanceof x ? /* @__PURE__ */ T(g, {
+		inputCommand: e,
+		placement: "bottom",
+		fullWidth: !0
+	}, e.uniqueId) : e instanceof l ? /* @__PURE__ */ T(J, { command: e }, e.uniqueId) : e instanceof v ? /* @__PURE__ */ T(U, { command: e }, e.uniqueId) : e instanceof c ? /* @__PURE__ */ T(G, { command: e }, e.uniqueId) : e instanceof d ? /* @__PURE__ */ T(Y, { command: e }, e.uniqueId) : e.isToggle ? /* @__PURE__ */ T(W, { command: e }, e.uniqueId) : /* @__PURE__ */ T(K, { command: e }, e.uniqueId);
+}
+function H({ command: t }) {
+	let { t: n } = e();
+	return r(t) ? /* @__PURE__ */ E("div", {
+		className: "flex items-center gap-1.5 text-[#fb6c1d]",
+		title: t.tooltip === void 0 ? void 0 : n(t.tooltip),
+		children: [/* @__PURE__ */ T(D, {}), /* @__PURE__ */ T("p", {
+			className: "font-semibold text-xs",
+			children: n(t.content)
+		})]
+	}) : null;
+}
+function U({ command: t }) {
+	let { t: n } = e(), i = r(t), a = M(t.isOpen);
+	return i ? t.isAccordion ? /* @__PURE__ */ E(N, {
+		open: a,
+		onOpenChange: (e) => {
+			t.isOpen(e);
+		},
+		className: "w-full",
+		children: [/* @__PURE__ */ E(F, {
+			className: "group/collapsible-trigger w-full flex items-center justify-between px-2 py-1.5 hover:bg-accent-background rounded-md",
+			children: [/* @__PURE__ */ T("span", {
+				className: "text-sm font-medium text-foreground",
+				children: t.tooltip === void 0 ? null : n(t.tooltip)
+			}), /* @__PURE__ */ T(O, { className: "size-4 shrink-0 transition-transform duration-200 group-aria-expanded/collapsible-trigger:rotate-180" })]
+		}), /* @__PURE__ */ T(P, {
+			className: "px-1 pb-1 pt-0.5 w-full",
+			children: /* @__PURE__ */ T("div", {
+				className: "w-full flex flex-col gap-2 rounded-md bg-muted-background p-2",
+				children: t.commands.map(V)
+			})
+		})]
+	}) : /* @__PURE__ */ T("div", {
+		className: "flex gap-3",
+		children: t.commands.map(V)
+	}) : null;
+}
+function W({ command: e }) {
+	let { isVisible: t, isChecked: r, isEnabled: i } = n(e);
+	if (!t) return null;
+	let a = () => {
+		i && e.invoke();
+	};
+	return /* @__PURE__ */ E("div", {
+		className: "flex flex-row w-fit justify-start gap-2",
+		children: [/* @__PURE__ */ T(L, {
+			checked: r,
+			disabled: !i,
+			onCheckedChange: a
+		}), /* @__PURE__ */ T("p", {
+			className: "text-sm font-medium cursor-pointer",
+			onClick: a,
+			children: e.label
+		})]
+	});
+}
+function G({ command: e }) {
+	return r(e) ? /* @__PURE__ */ T("p", {
+		className: "text-sm font-medium",
+		children: e.label
+	}) : null;
+}
+function K({ command: e }) {
+	let { isVisible: t, isEnabled: r, icon: i } = n(e);
+	return t ? /* @__PURE__ */ E("div", {
+		role: "menuitem",
+		"aria-disabled": !r,
+		className: `flex items-center gap-2 px-2 py-1.5 text-sm font-medium rounded-sm cursor-pointer ${r ? "hover:bg-accent-background" : "opacity-50 pointer-events-none"}`,
+		onClick: () => {
+			r && e.invoke();
+		},
+		children: [/* @__PURE__ */ T(o, { iconName: i }), e.label]
+	}) : null;
+}
+function q({ command: e }) {
+	let { isVisible: t, isEnabled: r } = n(e), a = i(e);
+	if (!t) return null;
+	let o = e.label + ": " + e.getValueLabel();
+	return /* @__PURE__ */ E("div", {
+		className: "w-full flex flex-col items-start justify-between gap-1",
+		children: [/* @__PURE__ */ T("label", {
+			className: "text-sm font-medium",
+			children: o
+		}), /* @__PURE__ */ T(I, {
+			disabled: !r,
+			min: e.min,
+			max: e.max,
+			step: e.step,
+			onValueChange: ([t]) => {
+				e.value = t, e.update();
+			},
+			value: [a]
+		})]
+	});
+}
+function J({ command: e }) {
+	return r(e) ? /* @__PURE__ */ T(u, {
+		inputCommand: e,
+		placement: "bottom",
+		usedInSettings: !0
+	}) : null;
+}
+function Y({ command: e }) {
+	return e.initializeChildrenIfNeeded(), r(e) ? /* @__PURE__ */ T(f, {
+		inputCommand: e,
+		placement: "bottom",
+		usedInSettings: !0
+	}) : null;
+}
+//#endregion
+export { z as SettingsButton, R as createSettingsButton };

package/dist/ui/components/commandBased/buttons/ShowTreeViewButton.d.ts

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { BaseCommand } from '../../../../domains';
+import { PlacementType } from '../utils/types';
+export declare function createShowTreeViewButton(command: BaseCommand, placement: PlacementType): ReactElement | undefined;

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

@@ -0,0 +1,46 @@
+import { useCommand as e } from "../hooks/useCommand.js";
+import { useCommandProps as t } from "../hooks/useCommandProps.js";
+import { LabelWithShortcut as n } from "../utils/LabelWithShortcut.js";
+import { CommandButtonInner as r } from "./CommandButtonInner.js";
+import { BaseTooltipTrigger as i, CommandTooltipPopup as a, useCommandTooltipHandle as o } from "./PopupTriggerButton.js";
+import { ShowTreeViewCommand as s } from "../../../../foundation/concreteCommands/general/ShowTreeViewCommand.js";
+import { DomainObjectTreeView as c } from "../treeView/DomainObjectTreeView/DomainObjectTreeView.js";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Popover as f, PopoverContent as p, PopoverTrigger as m } from "@cognite/aura/components/popover";
+import { useSignalValue as h } from "@cognite/signal-utils/react";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/buttons/ShowTreeViewButton.tsx
+function g(e, t) {
+	if (e instanceof s) return /* @__PURE__ */ u(_, {
+		inputCommand: e,
+		placement: t
+	}, e.uniqueId);
+}
+var _ = ({ inputCommand: s, placement: g }) => {
+	let _ = e(s), v = h(_.isOpen), { isVisible: y } = t(_), b = o();
+	return y ? /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d(f, {
+		open: v,
+		onOpenChange: (e) => {
+			_.isOpen(e);
+		},
+		children: [/* @__PURE__ */ u(m, { render: /* @__PURE__ */ u(i, {
+			handle: b,
+			render: /* @__PURE__ */ u(r, { inputCommand: s })
+		}) }), /* @__PURE__ */ u(p, {
+			side: g,
+			align: "start",
+			sideOffset: 12,
+			className: "p-0 w-auto max-w-[400px] max-h-[40vw] overflow-auto",
+			children: /* @__PURE__ */ u(c, {})
+		})]
+	}), /* @__PURE__ */ u(a, {
+		handle: b,
+		side: g,
+		disabled: v,
+		children: /* @__PURE__ */ u(n, {
+			label: _.label,
+			command: _
+		})
+	})] }) : /* @__PURE__ */ u(l, {});
+};
+//#endregion
+export { g as createShowTreeViewButton };

package/dist/ui/components/commandBased/domainObjectPanel/DomainObjectPanel.d.ts

@@ -0,0 +1,2 @@
+import { ReactElement } from 'react';
+export declare const DomainObjectPanel: () => ReactElement;

package/dist/ui/components/commandBased/domainObjectPanel/DomainObjectPanel.js

@@ -0,0 +1,74 @@
+import { useRenderTarget as e } from "../../RevealCanvas/ViewerContext.js";
+import "../../RevealCanvas/index.js";
+import { IconComponent as t } from "../Factories/IconFactory.js";
+import { getRoot as n } from "../../../../foundation/domainObjects/getRoot.js";
+import { UNDEFINED_UNIT_SYSTEM as r } from "../../../../foundation/renderTarget/UnitSystem.js";
+import { CopyToClipboardCommand as i } from "../../../../foundation/concreteCommands/general/CopyToClipboardCommand.js";
+import { CommandButtons as a } from "../main/CommandButtons.js";
+import { withSuppressRevealEvents as o } from "../../../higher-order-components/withSuppressRevealEvents.js";
+import "../main/Toolbar.js";
+import { DomainObjectPanelInput as s } from "./DomainObjectPanelInput.js";
+import { useMemo as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+import { useSignalValue as f } from "@cognite/signal-utils/react";
+var p = o(({ className: e, style: t, children: n }) => /* @__PURE__ */ u("div", {
+	className: e,
+	style: t,
+	children: n
+})), m = () => {
+	let o = e().panelUpdater, m = f(o.selectedDomainObject);
+	f(o.domainObjectChanged);
+	let g = c(() => m?.getPanelToolbar(), [m]), _ = m === void 0 ? void 0 : n(m), v = _ === void 0 ? r : _.unitSystem;
+	if (m === void 0 || g === void 0 || _ === void 0) return /* @__PURE__ */ u(l, {});
+	let y = m.getPanelInfo(), b = m.getPanelInfoStyle();
+	if (b === void 0 || y === void 0) return /* @__PURE__ */ u(l, {});
+	for (let e of g) e instanceof i && (e.getString = () => h(m, y, v));
+	let x = m.icon, S = m.label;
+	return /* @__PURE__ */ d(p, {
+		className: "z-[1000] absolute block rounded-md overflow-hidden bg-white shadow-[0px_1px_8px_#4f52681a]",
+		style: {
+			left: b.leftPx,
+			right: b.rightPx,
+			top: b.topPx,
+			bottom: b.bottomPx,
+			margin: b.marginPx,
+			padding: b.paddingPx
+		},
+		children: [/* @__PURE__ */ d("div", {
+			className: "flex gap-1 justify-between items-center",
+			children: [/* @__PURE__ */ d("div", {
+				className: "flex gap-1",
+				children: [x !== void 0 && /* @__PURE__ */ u(t, { iconName: x }), S !== void 0 && /* @__PURE__ */ u("span", {
+					className: "text-sm font-semibold",
+					children: S
+				})]
+			}), /* @__PURE__ */ u("div", { children: /* @__PURE__ */ u(a, {
+				commands: g,
+				placement: "bottom"
+			}) })]
+		}), /* @__PURE__ */ u("table", {
+			className: "gap-2",
+			children: /* @__PURE__ */ u("tbody", { children: y.items.map((e, t) => C(e, v)) })
+		})]
+	});
+	function C(e, t) {
+		return /* @__PURE__ */ u("tr", { children: /* @__PURE__ */ u(s, {
+			item: e,
+			unitSystem: t
+		}) }, JSON.stringify(e));
+	}
+};
+function h(e, t, n) {
+	let r = "";
+	{
+		let t = e?.label;
+		t !== void 0 && (r += `${t}\n`);
+	}
+	for (let e of t.items) {
+		let t = e.label;
+		t !== void 0 && (r += `${t}: `), r += `${n.toStringWithUnit(e.value, e.quantity)}\n`;
+	}
+	return r;
+}
+//#endregion
+export { m as DomainObjectPanel };

package/dist/ui/components/commandBased/domainObjectPanel/DomainObjectPanelInput.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement } from 'react';
+import { NumberPanelItem } from '../../../../foundation/domainObjectsHelpers/PanelInfo';
+import { UnitSystem } from '../../../../foundation/renderTarget/UnitSystem';
+type Props = {
+    item: NumberPanelItem;
+    unitSystem: UnitSystem;
+};
+export declare function DomainObjectPanelInput({ item, unitSystem, }: Props): ReactElement;
+export {};

package/dist/ui/components/commandBased/domainObjectPanel/DomainObjectPanelInput.js

@@ -0,0 +1,57 @@
+import { useEffect as e, useState as t } from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Input as i } from "@cognite/aura/components/input";
+import { useSignalValue as a } from "@cognite/signal-utils/react";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/domainObjectPanel/DomainObjectPanelInput.tsx
+function o({ item: o, unitSystem: s }) {
+	let c = s.toString(o.value, o.quantity, !1), [l, u] = t(c), d = a(s.lengthUnit);
+	e(() => {
+		u(c);
+	}, [d, c]);
+	function f(e) {
+		if (e === "-") {
+			u(e);
+			return;
+		}
+		let t = parseFloat(e);
+		if (Number.isNaN(t)) {
+			u("");
+			return;
+		}
+		u(e);
+	}
+	function p() {
+		o.trySetValue(parseFloat(l), s) || u(c);
+	}
+	let m = s.getUnit(o.quantity);
+	return /* @__PURE__ */ r("div", {
+		className: "flex items-center gap-2 my-0.5",
+		children: [
+			o.label !== void 0 && /* @__PURE__ */ n("span", {
+				className: "text-xs text-muted-foreground",
+				children: o.label
+			}),
+			/* @__PURE__ */ n(i, {
+				className: "text-right flex-1",
+				onChange: (e) => {
+					f(e.target.value);
+				},
+				onBlur: () => {
+					p();
+				},
+				onKeyDownCapture: (e) => {
+					e.key === "Enter" && p();
+				},
+				type: "number",
+				value: l,
+				disabled: o.setValue === void 0
+			}),
+			/* @__PURE__ */ n("span", {
+				className: "text-xs text-muted-foreground",
+				children: m
+			})
+		]
+	});
+}
+//#endregion
+export { o as DomainObjectPanelInput };

package/dist/ui/components/commandBased/hooks/useCommand.d.ts

@@ -0,0 +1,2 @@
+import { BaseCommand } from '../../../../foundation/commands/BaseCommand';
+export declare function useCommand<T extends BaseCommand>(inputCommand: T): T;

package/dist/ui/components/commandBased/hooks/useCommand.js

@@ -0,0 +1,9 @@
+import { useRenderTarget as e } from "../../RevealCanvas/ViewerContext.js";
+import { useMemo as t } from "react";
+//#region libs/shared/reveal-components/src/ui/components/commandBased/hooks/useCommand.tsx
+function n(n) {
+	let r = e();
+	return t(() => r.getDefaultCommand(n), [n, r]);
+}
+//#endregion
+export { n as useCommand };

package/dist/ui/components/commandBased/hooks/useCommandProperty.d.ts

@@ -0,0 +1,3 @@
+import { BaseCommand } from '../../../../foundation/commands/BaseCommand';
+export declare function useNullableCommandProperty<T>(command: BaseCommand | undefined, getValue: () => T | undefined): T | undefined;
+export declare function useCommandProperty<T>(command: BaseCommand, getValue: () => T): T;