@cognite/reveal-components 1.0.0

package/dist/ui/components/RevealToolbar/Help/Graphics/Touch.js

@@ -0,0 +1,109 @@
+import { jsx as e, jsxs as t } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/Graphics/Touch.tsx
+var n = (n) => /* @__PURE__ */ t("svg", {
+	width: "100",
+	height: "100",
+	viewBox: "0 0 100 100",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...n,
+	children: [
+		/* @__PURE__ */ e("path", {
+			d: "M30 44C30 40.686 27.314 38 24 38C20.686 38 18 40.686 18 44V64C18 80.568 31.432 94 48 94C64.568 94 78 80.568 78 64V48C78 44.686 75.314 42 72 42C68.686 42 66 44.686 66 48V44C66 40.686 63.314 38 60 38C56.686 38 54 40.686 54 44V40C54 36.686 51.314 34 48 34C44.686 34 42 36.686 42 40V12C42 8.686 39.314 6 36 6C32.686 6 30 8.686 30 12V58V44Z",
+			stroke: "#ABB9FB",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M80 16H52",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M74 10L80 16L74 22",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M58 10L52 16L58 22",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	]
+}), r = (n) => /* @__PURE__ */ t("svg", {
+	width: "100",
+	height: "100",
+	viewBox: "0 0 100 100",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...n,
+	children: [
+		/* @__PURE__ */ e("path", {
+			d: "M53.98 36C53.98 32.686 56.666 30 59.98 30C63.294 30 65.98 32.686 65.98 36V40C65.98 36.686 68.666 34 71.98 34C75.294 34 77.98 36.686 77.98 40V46V43.876C77.98 40.562 80.666 37.876 83.98 37.876C87.294 37.876 89.98 40.562 89.98 43.876V64C89.98 80.568 76.548 94 59.98 94C51.696 94 44.1961 90.642 38.7661 85.214L17.2961 58.178C15.4061 55.798 15.6021 52.38 17.7501 50.23C20.0861 47.894 23.8721 47.894 26.2081 50.23L34.658 58.68C37.36 61.382 41.9781 59.468 41.9781 55.648V46V12C41.9781 8.686 44.6641 6 47.9781 6C51.2921 6 53.9781 8.686 53.9781 12V40",
+			stroke: "#ABB9FB",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M10 40L32 18",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M32 26V18H24",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		}),
+		/* @__PURE__ */ e("path", {
+			d: "M10 32V40H18",
+			stroke: "white",
+			strokeWidth: "2",
+			strokeMiterlimit: "10",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	]
+}), i = (n) => /* @__PURE__ */ t("svg", {
+	width: "100",
+	height: "100",
+	viewBox: "0 0 100 100",
+	fill: "none",
+	xmlns: "http://www.w3.org/2000/svg",
+	...n,
+	children: [/* @__PURE__ */ e("path", {
+		d: "M32.01 30.6575C27.2747 28.4126 24 23.5887 24 18C24 10.268 30.268 4 38 4C45.732 4 52 10.268 52 18C52 23.5887 48.7253 28.4126 43.99 30.6575",
+		stroke: "white",
+		strokeWidth: "2",
+		strokeMiterlimit: "10",
+		strokeLinecap: "round",
+		strokeLinejoin: "round"
+	}), /* @__PURE__ */ e("path", {
+		d: "M32 50C32 46.686 29.314 44 26 44C22.686 44 20 46.686 20 50V64C20 80.568 33.432 94 50 94C66.568 94 80 80.568 80 64V50C80 46.686 77.314 44 74 44C70.686 44 68 46.686 68 50V46C68 42.686 65.314 40 62 40C58.686 40 56 42.686 56 46V42C56 38.686 53.314 36 50 36C46.686 36 44 38.686 44 42V18C44 14.686 41.314 12 38 12C34.686 12 32 14.686 32 18V62V50Z",
+		stroke: "#ABB9FB",
+		strokeWidth: "2",
+		strokeMiterlimit: "10",
+		strokeLinecap: "round",
+		strokeLinejoin: "round"
+	})]
+});
+//#endregion
+export { n as TouchPan, i as TouchSelect, r as TouchZoom };

package/dist/ui/components/RevealToolbar/Help/KeyboardNavigation.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+export type KeyboardNavigationProps = {
+    fallbackLanguage?: string;
+};
+export declare const KeyboardNavigation: ({ fallbackLanguage, }: KeyboardNavigationProps) => ReactElement;

package/dist/ui/components/RevealToolbar/Help/KeyboardNavigation.js

@@ -0,0 +1,60 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { ArrowKeyboardNavigationInstructionGrid as t, InstructionText as n, KeyboardNavigationInstructionGrid as r } from "./elements.js";
+import { ArrowKeysNavigation as i, QWEASDKeysNavigation as a } from "./Graphics/Keyboard.js";
+import { Section as o } from "./Section.js";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/KeyboardNavigation.tsx
+var l = ({ fallbackLanguage: l }) => {
+	let { t: u } = e(l);
+	return /* @__PURE__ */ s(o, {
+		title: u({ key: "KEYBOARD_NAVIGATION_TITLE" }),
+		subTitle: u({ key: "KEYBOARD_NAVIGATION_SUBTITLE" }),
+		description: u({ key: "KEYBOARD_NAVIGATION_DESCRIPTION" }),
+		children: /* @__PURE__ */ c("div", {
+			className: "flex gap-2 pt-3",
+			children: [/* @__PURE__ */ c("div", {
+				className: "flex flex-col",
+				children: [/* @__PURE__ */ c(r, { children: [
+					/* @__PURE__ */ c(n, { children: [
+						" ",
+						u({ key: "KEYBOARD_DOWN" }),
+						" "
+					] }),
+					/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_FORWARD" }) }),
+					/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_UP" }) }),
+					/* @__PURE__ */ s(a.Q, {}),
+					/* @__PURE__ */ s(a.W, {}),
+					/* @__PURE__ */ s(a.E, {})
+				] }), /* @__PURE__ */ c(r, {
+					className: "pl-[15px] pt-2",
+					children: [
+						/* @__PURE__ */ s(a.A, {}),
+						/* @__PURE__ */ s(a.S, { className: "ml-1.5" }),
+						/* @__PURE__ */ s(a.D, { className: "ml-1.5" }),
+						/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_LEFT" }) }),
+						/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_BACK" }) }),
+						/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_RIGHT" }) })
+					]
+				})]
+			}), /* @__PURE__ */ c(t, { children: [
+				/* @__PURE__ */ s(n, {
+					className: "pl-[10px] col-span-full text-right",
+					children: u({ key: "KEYBOARD_LOOK_UP" })
+				}),
+				/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_LOOK_LEFT" }) }),
+				/* @__PURE__ */ s(i.Up, {}),
+				/* @__PURE__ */ s(n, { children: u({ key: "KEYBOARD_LOOK_RIGHT" }) }),
+				/* @__PURE__ */ s(i.Left, {}),
+				/* @__PURE__ */ s(i.Down, {}),
+				/* @__PURE__ */ s(i.Right, {}),
+				/* @__PURE__ */ s("br", {}),
+				/* @__PURE__ */ s(n, {
+					className: "text-center",
+					children: u({ key: "KEYBOARD_LOOK_DOWN" })
+				})
+			] })]
+		})
+	});
+};
+//#endregion
+export { l as KeyboardNavigation };

package/dist/ui/components/RevealToolbar/Help/MouseNavigation.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+export type MouseNavigationProps = {
+    fallbackLanguage?: string;
+};
+export declare const MouseNavigation: ({ fallbackLanguage, }: MouseNavigationProps) => ReactElement;

package/dist/ui/components/RevealToolbar/Help/MouseNavigation.js

@@ -0,0 +1,34 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { InstructionDetail as t, InstructionText as n, MouseNavigationCombinedGridItem as r, MouseNavigationInstructionGrid as i, StyledMouse as a } from "./elements.js";
+import { Section as o } from "./Section.js";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/MouseNavigation.tsx
+var l = ({ fallbackLanguage: l }) => {
+	let { t: u } = e(l);
+	return /* @__PURE__ */ s(o, {
+		title: u({ key: "MOUSE_NAVIGATION_TITLE" }),
+		subTitle: u({ key: "MOUSE_TOUCH_NAVIGATION_SUBTITLE" }),
+		description: u({ key: "MOUSE_NAVIGATION_DESCRIPTION" }),
+		children: /* @__PURE__ */ c(i, { children: [
+			/* @__PURE__ */ s(n, {
+				className: "pl-[10px] col-span-full text-right",
+				children: u({ key: "MOUSE_ZOOM" })
+			}),
+			/* @__PURE__ */ c(n, {
+				className: "mb-[30px] text-right w-max max-w-[100px]",
+				children: [u({ key: "MOUSE_ROTATE" }), /* @__PURE__ */ s(t, { children: u({ key: "MOUSE_INSTRUCTIONS" }) })]
+			}),
+			/* @__PURE__ */ s(r, { children: /* @__PURE__ */ s(a, {}) }),
+			/* @__PURE__ */ c(n, {
+				className: "mb-[30px] text-left w-max max-w-[100px]",
+				children: [u({ key: "PAN" }), /* @__PURE__ */ s(t, { children: u({ key: "MOUSE_INSTRUCTIONS" }) })]
+			}),
+			/* @__PURE__ */ c(n, {
+				className: "-mt-[50px] text-right w-max max-w-[100px]",
+				children: [u({ key: "MOUSE_SELECT" }), /* @__PURE__ */ s(t, { children: u({ key: "MOUSE_SELECT_INSTRUCTION" }) })]
+			})
+		] })
+	});
+};
+//#endregion
+export { l as MouseNavigation };

package/dist/ui/components/RevealToolbar/Help/Section.d.ts

@@ -0,0 +1,3 @@
+import { ReactElement } from 'react';
+import { HelpSectionProps } from './types';
+export declare const Section: ({ children, title, description, subTitle, }: HelpSectionProps) => ReactElement;

package/dist/ui/components/RevealToolbar/Help/Section.js

@@ -0,0 +1,11 @@
+import { InstructionDetail as e, SectionContainer as t, SectionContent as n, SectionSubTitle as r, SectionTitle as i } from "./elements.js";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/Section.tsx
+var s = ({ children: s, title: c, description: l, subTitle: u }) => /* @__PURE__ */ o(t, { children: [
+	/* @__PURE__ */ a(i, { children: c }),
+	/* @__PURE__ */ a(r, { children: u }),
+	/* @__PURE__ */ a(e, { children: l }),
+	/* @__PURE__ */ a(n, { children: s })
+] });
+//#endregion
+export { s as Section };

package/dist/ui/components/RevealToolbar/Help/TouchNavigation.d.ts

@@ -0,0 +1,5 @@
+import { ReactElement } from 'react';
+export type TouchNavigationProps = {
+    fallbackLanguage?: string;
+};
+export declare const TouchNavigation: ({ fallbackLanguage, }: TouchNavigationProps) => ReactElement;

package/dist/ui/components/RevealToolbar/Help/TouchNavigation.js

@@ -0,0 +1,21 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { InstructionText as t, TouchNavigationCombinedGridItem as n, TouchNavigationInstructionGrid as r } from "./elements.js";
+import { Section as i } from "./Section.js";
+import { TouchPan as a, TouchSelect as o, TouchZoom as s } from "./Graphics/Touch.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/TouchNavigation.tsx
+var u = ({ fallbackLanguage: u }) => {
+	let { t: d } = e(u);
+	return /* @__PURE__ */ c(i, {
+		title: d({ key: "TOUCH_NAVIGATION_TITLE" }),
+		subTitle: d({ key: "MOUSE_TOUCH_NAVIGATION_SUBTITLE" }),
+		description: d({ key: "TOUCH_NAVIGATION_DESCRIPTION" }),
+		children: /* @__PURE__ */ l(r, { children: [
+			/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c(a, {}), /* @__PURE__ */ c(t, { children: d({ key: "PAN" }) })] }),
+			/* @__PURE__ */ l(n, { children: [/* @__PURE__ */ c(o, {}), /* @__PURE__ */ c(t, { children: d({ key: "TOUCH_SELECT" }) })] }),
+			/* @__PURE__ */ l("div", { children: [/* @__PURE__ */ c(s, {}), /* @__PURE__ */ c(t, { children: d({ key: "TOUCH_ZOOM" }) })] })
+		] })
+	});
+};
+//#endregion
+export { u as TouchNavigation };

package/dist/ui/components/RevealToolbar/Help/elements.d.ts

@@ -0,0 +1,20 @@
+import { CSSProperties, ReactNode } from 'react';
+type ElementProps = {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+};
+export declare const SectionContainer: ({ children, style, }: ElementProps) => ReactNode;
+export declare const SectionTitle: ({ children }: ElementProps) => ReactNode;
+export declare const SectionSubTitle: ({ children }: ElementProps) => ReactNode;
+export declare const SectionContent: ({ children }: ElementProps) => ReactNode;
+export declare const InstructionText: ({ children, style, className, }: ElementProps) => ReactNode;
+export declare const InstructionDetail: ({ children }: ElementProps) => ReactNode;
+export declare const MouseNavigationInstructionGrid: ({ children, }: ElementProps) => ReactNode;
+export declare const MouseNavigationCombinedGridItem: ({ children, }: ElementProps) => ReactNode;
+export declare const KeyboardNavigationInstructionGrid: ({ children, className, }: ElementProps) => ReactNode;
+export declare const ArrowKeyboardNavigationInstructionGrid: ({ children, }: ElementProps) => ReactNode;
+export declare const TouchNavigationInstructionGrid: ({ children, }: ElementProps) => ReactNode;
+export declare const TouchNavigationCombinedGridItem: ({ children, }: ElementProps) => ReactNode;
+export declare const StyledMouse: () => ReactNode;
+export {};

package/dist/ui/components/RevealToolbar/Help/elements.js

@@ -0,0 +1,47 @@
+import { Mouse as e } from "./Graphics/Mouse.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/Help/elements.tsx
+var n = ({ children: e, style: n }) => /* @__PURE__ */ t("div", {
+	className: "flex flex-col gap-2 w-fit max-w-fit",
+	style: n,
+	children: e
+}), r = ({ children: e }) => /* @__PURE__ */ t("h3", {
+	className: "text-white text-lg font-semibold leading-7",
+	children: e
+}), i = ({ children: e }) => /* @__PURE__ */ t("h5", {
+	className: "text-white text-sm font-semibold leading-5",
+	children: e
+}), a = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "flex flex-row items-center h-full",
+	children: e
+}), o = ({ children: e, style: n, className: r }) => /* @__PURE__ */ t("span", {
+	className: `text-white/90 text-center text-sm font-normal leading-5${r === void 0 ? "" : ` ${r}`}`,
+	style: n,
+	children: e
+}), s = ({ children: e }) => /* @__PURE__ */ t("span", {
+	className: "block text-white/70 text-sm leading-5 tracking-[0.006em] whitespace-pre-line",
+	children: e
+}), c = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "grid grid-cols-[2fr_1fr_1.5fr] gap-2 w-fit justify-items-center items-center pt-3",
+	children: e
+}), l = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "col-start-2 row-start-2",
+	children: e
+}), u = ({ children: e, className: n }) => /* @__PURE__ */ t("div", {
+	className: `grid grid-cols-3 gap-2 w-fit justify-items-center items-center text-center${n === void 0 ? "" : ` ${n}`}`,
+	children: e
+}), d = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "grid grid-cols-3 gap-2 pl-3 w-fit justify-items-center items-center",
+	children: e
+}), f = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "grid grid-cols-[2fr_1fr_1.5fr] w-fit justify-items-center pt-3",
+	children: e
+}), p = ({ children: e }) => /* @__PURE__ */ t("div", {
+	className: "col-start-2 row-start-1 row-span-2 pt-10",
+	children: e
+}), m = () => /* @__PURE__ */ t("div", {
+	className: "flex justify-center",
+	children: /* @__PURE__ */ t(e, {})
+});
+//#endregion
+export { d as ArrowKeyboardNavigationInstructionGrid, s as InstructionDetail, o as InstructionText, u as KeyboardNavigationInstructionGrid, l as MouseNavigationCombinedGridItem, c as MouseNavigationInstructionGrid, n as SectionContainer, a as SectionContent, i as SectionSubTitle, r as SectionTitle, m as StyledMouse, p as TouchNavigationCombinedGridItem, f as TouchNavigationInstructionGrid };

package/dist/ui/components/RevealToolbar/Help/types.d.ts

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+export type HelpSectionProps = {
+    children: ReactElement;
+    title: string;
+    description?: string | undefined;
+    subTitle?: string | undefined;
+};

package/dist/ui/components/RevealToolbar/HelpButton/HelpButton.context.d.ts

@@ -0,0 +1,13 @@
+import { Context } from 'react';
+import { useTranslation } from '../../i18n/I18n';
+import { KeyboardNavigation } from '../Help/KeyboardNavigation';
+import { MouseNavigation } from '../Help/MouseNavigation';
+import { TouchNavigation } from '../Help/TouchNavigation';
+export type HelpButtonDependencies = {
+    useTranslation: typeof useTranslation;
+    MouseNavigation: typeof MouseNavigation;
+    TouchNavigation: typeof TouchNavigation;
+    KeyboardNavigation: typeof KeyboardNavigation;
+};
+export declare const defaultHelpButtonDependencies: HelpButtonDependencies;
+export declare const HelpButtonContext: Context<HelpButtonDependencies>;

package/dist/ui/components/RevealToolbar/HelpButton/HelpButton.context.js

@@ -0,0 +1,14 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { KeyboardNavigation as t } from "../Help/KeyboardNavigation.js";
+import { MouseNavigation as n } from "../Help/MouseNavigation.js";
+import { TouchNavigation as r } from "../Help/TouchNavigation.js";
+import { createContext as i } from "react";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/HelpButton/HelpButton.context.ts
+var a = {
+	useTranslation: e,
+	MouseNavigation: n,
+	TouchNavigation: r,
+	KeyboardNavigation: t
+}, o = i(a);
+//#endregion
+export { o as HelpButtonContext, a as defaultHelpButtonDependencies };

package/dist/ui/components/RevealToolbar/HelpButton/HelpButton.d.ts

@@ -0,0 +1,13 @@
+import { ReactElement } from 'react';
+import { PlacementType } from '../../commandBased';
+/**
+ * @deprecated
+ */
+export type HelpButtonProps = {
+    fallbackLanguage?: string;
+    placement?: PlacementType;
+};
+/**
+ * @deprecated
+ */
+export declare const HelpButton: ({ fallbackLanguage, placement, }: HelpButtonProps) => ReactElement;

package/dist/ui/components/RevealToolbar/HelpButton/HelpButton.js

@@ -0,0 +1,44 @@
+import { BaseTooltipTrigger as e, CommandTooltipPopup as t, useCommandTooltipHandle as n } from "../../commandBased/buttons/PopupTriggerButton.js";
+import { HelpButtonContext as r } from "./HelpButton.context.js";
+import { useContext as i, useState as a } from "react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Button as l } from "@cognite/aura/components/button";
+import { IconHelp as u } from "@tabler/icons-react";
+import { Popover as d, PopoverContent as f, PopoverTrigger as p } from "@cognite/aura/components/popover";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/HelpButton/HelpButton.tsx
+var m = ({ fallbackLanguage: m, placement: h }) => {
+	let { useTranslation: g, MouseNavigation: _, TouchNavigation: v, KeyboardNavigation: y } = i(r), { t: b } = g(m), [x, S] = a(!1), C = h ?? "right", w = n();
+	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ c(d, {
+		open: x,
+		onOpenChange: S,
+		children: [/* @__PURE__ */ s(p, { render: /* @__PURE__ */ s(e, {
+			handle: w,
+			children: /* @__PURE__ */ s(l, {
+				variant: "ghost",
+				size: "sm",
+				"aria-label": "help-button",
+				children: /* @__PURE__ */ s(u, {})
+			})
+		}) }), /* @__PURE__ */ s(f, {
+			side: C,
+			align: "end",
+			sideOffset: 12,
+			className: "p-0 w-max overflow-hidden",
+			children: /* @__PURE__ */ c("div", {
+				className: "flex flex-col gap-6 p-4 max-h-[20vw] overflow-y-auto bg-[#516efa]",
+				children: [
+					/* @__PURE__ */ s(_, { fallbackLanguage: m }),
+					/* @__PURE__ */ s(y, { fallbackLanguage: m }),
+					/* @__PURE__ */ s(v, { fallbackLanguage: m })
+				]
+			})
+		})]
+	}), /* @__PURE__ */ s(t, {
+		handle: w,
+		side: C,
+		disabled: x,
+		children: b({ key: "HELP_TOOLTIP" })
+	})] });
+};
+//#endregion
+export { m as HelpButton };

package/dist/ui/components/RevealToolbar/ResetCameraButton.d.ts

@@ -0,0 +1,7 @@
+import { ReactElement } from 'react';
+type ResetCameraButtonProps = {
+    sceneExternalId?: string;
+    sceneSpaceId?: string;
+};
+export declare const ResetCameraButton: ({ sceneExternalId, sceneSpaceId, }: ResetCameraButtonProps) => ReactElement;
+export {};

package/dist/ui/components/RevealToolbar/ResetCameraButton.js

@@ -0,0 +1,40 @@
+import { useReveal as e } from "../RevealCanvas/ViewerContext.js";
+import { useTranslation as t } from "../i18n/I18n.js";
+import { useCameraNavigation as n } from "../../hooks/useCameraNavigation.js";
+import { useSceneDefaultCamera as r } from "../../hooks/useSceneDefaultCamera.js";
+import { useCallback as i } from "react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Tooltip as s, TooltipContent as c, TooltipProvider as l, TooltipTrigger as u } from "@cognite/aura/components/tooltip";
+import { Button as d } from "@cognite/aura/components/button";
+import { IconHome as f } from "@tabler/icons-react";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/ResetCameraButton.tsx
+var p = ({ sceneExternalId: p, sceneSpaceId: m }) => {
+	let { t: h } = t(), g = e(), _ = n(), v = r(p, m), y = i(() => {
+		if (g.get360ImageCollections() !== void 0 && g.exit360Image(), p !== void 0 && m !== void 0 && v !== void 0) {
+			v.fitCameraToSceneDefault();
+			return;
+		}
+		_.fitCameraToAllModels();
+	}, [
+		p,
+		m,
+		_,
+		v,
+		g
+	]);
+	return /* @__PURE__ */ a(l, {
+		delayDuration: 500,
+		children: /* @__PURE__ */ o(s, { children: [/* @__PURE__ */ a(u, { render: /* @__PURE__ */ a(d, {
+			variant: "ghost",
+			size: "sm",
+			"aria-label": "Reset camera to home",
+			onClick: y,
+			children: /* @__PURE__ */ a(f, {})
+		}) }), /* @__PURE__ */ a(c, {
+			side: "top",
+			children: h({ key: "RESET_CAMERA_TO_HOME" })
+		})] })
+	});
+};
+//#endregion
+export { p as ResetCameraButton };

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

@@ -0,0 +1,19 @@
+import { ForwardRefExoticComponent, RefAttributes, ReactNode, HTMLAttributes } from 'react';
+import { AssetContextualizedButton } from './AssetContextualizedButton';
+import { FitModelsButton } from './FitModelsButton';
+import { HelpButton } from './HelpButton/HelpButton';
+import { ResetCameraButton } from './ResetCameraButton';
+import { RuleBasedOutputsButton } from './RuleBasedOutputsButton/RuleBasedOutputsButton';
+import { SlicerButton } from './SlicerButton/SlicerButton';
+declare const RevealToolbarContainer: ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & {
+    toolBarContent?: ReactNode;
+} & RefAttributes<HTMLDivElement>>;
+export declare const RevealToolbar: typeof RevealToolbarContainer & {
+    FitModelsButton: typeof FitModelsButton;
+    SlicerButton: typeof SlicerButton;
+    HelpButton: typeof HelpButton;
+    ResetCameraButton: typeof ResetCameraButton;
+    RuleBasedOutputsButton: typeof RuleBasedOutputsButton;
+    AssetContextualizedButton: typeof AssetContextualizedButton;
+};
+export {};

package/dist/ui/components/RevealToolbar/RevealToolbar.js

@@ -0,0 +1,32 @@
+import { RevealButtons as e } from "../commandBased/RevealButtons.js";
+import { withSuppressRevealEvents as t } from "../../higher-order-components/withSuppressRevealEvents.js";
+import { AssetContextualizedButton as n } from "./AssetContextualizedButton.js";
+import { FitModelsButton as r } from "./FitModelsButton.js";
+import { HelpButton as i } from "./HelpButton/HelpButton.js";
+import { ResetCameraButton as a } from "./ResetCameraButton.js";
+import { RuleBasedOutputsButton as o } from "./RuleBasedOutputsButton/RuleBasedOutputsButton.js";
+import { SlicerButton as s } from "./SlicerButton/SlicerButton.js";
+import { forwardRef as c } from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/RevealToolbar.tsx
+var f = () => /* @__PURE__ */ u("div", { className: "h-0.5 w-3/4 self-center bg-foreground/20 rounded-full" }), p = () => /* @__PURE__ */ d(l, { children: [
+	/* @__PURE__ */ u(e.ShowLayers, {}),
+	/* @__PURE__ */ u(r, {}),
+	/* @__PURE__ */ u(o, {}),
+	/* @__PURE__ */ u(f, {}),
+	/* @__PURE__ */ u(s, {}),
+	/* @__PURE__ */ u(f, {}),
+	/* @__PURE__ */ u(e.Share, {}),
+	/* @__PURE__ */ u(f, {}),
+	/* @__PURE__ */ u(i, {})
+] }), m = c(({ toolBarContent: e, className: t, ...n }, r) => /* @__PURE__ */ u("div", {
+	className: `!absolute left-5 top-[70px] p-1 gap-2 rounded-lg outline outline-1 outline-[rgba(83,88,127,0.24)] flex flex-col items-center bg-background shadow-sm${t === void 0 ? "" : ` ${t}`}`,
+	...n,
+	ref: r,
+	children: e ?? /* @__PURE__ */ u(p, {})
+}));
+m.displayName = "RevealToolbarContainer";
+var h = t(m);
+h.FitModelsButton = r, h.SlicerButton = s, h.HelpButton = i, h.ResetCameraButton = a, h.RuleBasedOutputsButton = o, h.AssetContextualizedButton = n;
+//#endregion
+export { h as RevealToolbar };

package/dist/ui/components/RevealToolbar/RuleBasedOutputsButton/RuleBasedOutputsButton.context.d.ts

@@ -0,0 +1,19 @@
+import { Context } from 'react';
+import { useAssetMappedNodesForRevisions } from '../../../hooks/cad';
+import { use3dModels } from '../../../hooks/use3dModels';
+import { useTranslation } from '../../i18n/I18n';
+import { useReveal3DResourcesStylingLoading } from '../../Reveal3DResources/Reveal3DResourcesInfoContext';
+import { RuleBasedSelectionItem } from '../../RuleBasedOutputs/components/RuleBasedSelectionItem';
+import { useFetchRuleInstances } from '../../RuleBasedOutputs/hooks/useFetchRuleInstances';
+import { RuleBasedOutputsSelector } from '../../RuleBasedOutputs/RuleBasedOutputsSelector';
+export type RuleBasedOutputsButtonDependencies = {
+    useTranslation: typeof useTranslation;
+    useFetchRuleInstances: typeof useFetchRuleInstances;
+    use3dModels: typeof use3dModels;
+    useAssetMappedNodesForRevisions: typeof useAssetMappedNodesForRevisions;
+    useReveal3DResourcesStylingLoading: typeof useReveal3DResourcesStylingLoading;
+    RuleBasedOutputsSelector: typeof RuleBasedOutputsSelector;
+    RuleBasedSelectionItem: typeof RuleBasedSelectionItem;
+};
+export declare const defaultRuleBasedOutputsButtonDependencies: RuleBasedOutputsButtonDependencies;
+export declare const RuleBasedOutputsButtonContext: Context<RuleBasedOutputsButtonDependencies>;

package/dist/ui/components/RevealToolbar/RuleBasedOutputsButton/RuleBasedOutputsButton.context.js

@@ -0,0 +1,21 @@
+import { useTranslation as e } from "../../i18n/I18n.js";
+import { useReveal3DResourcesStylingLoading as t } from "../../Reveal3DResources/Reveal3DResourcesInfoContext.js";
+import { use3dModels as n } from "../../../hooks/use3dModels.js";
+import { useAssetMappedNodesForRevisions as r } from "../../../hooks/cad/useAssetMappedNodesForRevisions.js";
+import "../../../hooks/cad/index.js";
+import { RuleBasedSelectionItem as i } from "../../RuleBasedOutputs/components/RuleBasedSelectionItem.js";
+import { useFetchRuleInstances as a } from "../../RuleBasedOutputs/hooks/useFetchRuleInstances.js";
+import { RuleBasedOutputsSelector as o } from "../../RuleBasedOutputs/RuleBasedOutputsSelector.js";
+import { createContext as s } from "react";
+//#region libs/shared/reveal-components/src/ui/components/RevealToolbar/RuleBasedOutputsButton/RuleBasedOutputsButton.context.ts
+var c = {
+	useTranslation: e,
+	useFetchRuleInstances: a,
+	use3dModels: n,
+	useAssetMappedNodesForRevisions: r,
+	useReveal3DResourcesStylingLoading: t,
+	RuleBasedOutputsSelector: o,
+	RuleBasedSelectionItem: i
+}, l = s(c);
+//#endregion
+export { l as RuleBasedOutputsButtonContext, c as defaultRuleBasedOutputsButtonDependencies };

package/dist/ui/components/RevealToolbar/RuleBasedOutputsButton/RuleBasedOutputsButton.d.ts

@@ -0,0 +1,9 @@
+import { ReactElement } from 'react';
+import { InstanceStylingGroup } from '../../../../utilities/modelIds/types';
+import { RuleAndEnabled } from '../../RuleBasedOutputs/types';
+type RuleBasedOutputsButtonProps = {
+    onRuleSetStylingChanged?: (stylings: InstanceStylingGroup[] | undefined) => void;
+    onRuleSetSelectedChanged?: (ruleSet: RuleAndEnabled | undefined) => void;
+};
+export declare const RuleBasedOutputsButton: ({ onRuleSetStylingChanged, onRuleSetSelectedChanged, }: RuleBasedOutputsButtonProps) => ReactElement;
+export {};