@hitachivantara/app-shell-ui 2.3.2 → 2.3.3

package/dist/components/layout/VerticalNavigation/NavigationCollapse.js

@@ -1,38 +1,33 @@
-import { jsxs, jsx } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
-import { css } from "@emotion/css";
-import { useHvAppShellRuntimeContext } from "@hitachivantara/app-shell-shared";
 import { HvVerticalNavigationAction } from "@hitachivantara/uikit-react-core";
-import { Start, End } from "@hitachivantara/uikit-react-icons";
-const classes = {
-  root: css({
-    position: "relative"
-  }),
-  icon: css({
-    position: "absolute",
-    pointerEvents: "none",
-    right: 0
-  })
-};
-const NavigationCollapse = ({ onClick, isOpen }) => {
-  const { i18n } = useHvAppShellRuntimeContext();
-  const { t } = useTranslation(void 0, {
-    i18n,
-    keyPrefix: "verticalNavigation"
-  });
-  return /* @__PURE__ */ jsxs("div", { className: classes.root, children: [
-    isOpen && /* @__PURE__ */ jsx(Start, { className: classes.icon }),
-    /* @__PURE__ */ jsx(
-      HvVerticalNavigationAction,
-      {
-        label: t("collapseAction"),
-        icon: isOpen ? void 0 : /* @__PURE__ */ jsx(End, {}),
-        "aria-label": isOpen ? t("ariaLabelCollapse") : t("ariaLabelExpand"),
-        onClick
-      }
-    )
-  ] });
+import { useHvAppShellRuntimeContext } from "@hitachivantara/app-shell-shared";
+import { End, Start } from "@hitachivantara/uikit-react-icons";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { css } from "@emotion/css";
+//#region src/components/layout/VerticalNavigation/NavigationCollapse.tsx
+var classes = {
+	root: css({ position: "relative" }),
+	icon: css({
+		position: "absolute",
+		pointerEvents: "none",
+		right: 0
+	})
 };
-export {
-  NavigationCollapse
+var NavigationCollapse = ({ onClick, isOpen }) => {
+	const { i18n } = useHvAppShellRuntimeContext();
+	const { t } = useTranslation(void 0, {
+		i18n,
+		keyPrefix: "verticalNavigation"
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: classes.root,
+		children: [isOpen && /* @__PURE__ */ jsx(Start, { className: classes.icon }), /* @__PURE__ */ jsx(HvVerticalNavigationAction, {
+			label: t("collapseAction"),
+			icon: isOpen ? void 0 : /* @__PURE__ */ jsx(End, {}),
+			"aria-label": isOpen ? t("ariaLabelCollapse") : t("ariaLabelExpand"),
+			onClick
+		})]
+	});
 };
+//#endregion
+export { NavigationCollapse };

package/dist/components/layout/VerticalNavigation/NavigationHeader.js

@@ -1,23 +1,21 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { css } from "@emotion/css";
-import { useHvAppShellModel } from "@hitachivantara/app-shell-shared";
+import { BrandLogo } from "../BrandLogo/BrandLogo.js";
 import { theme } from "@hitachivantara/uikit-react-core";
+import { useHvAppShellModel } from "@hitachivantara/app-shell-shared";
 import { AppSwitcher } from "@hitachivantara/uikit-react-icons";
-import { BrandLogo } from "../BrandLogo/BrandLogo.js";
-const classes = {
-  root: css({
-    display: "flex",
-    alignItems: "center",
-    gap: theme.space.xxs
-  })
-};
-const NavigationHeader = ({ isOpen }) => {
-  const { logo } = useHvAppShellModel();
-  return /* @__PURE__ */ jsxs("div", { className: classes.root, children: [
-    /* @__PURE__ */ jsx(AppSwitcher, {}),
-    isOpen && /* @__PURE__ */ jsx(BrandLogo, { logo })
-  ] });
-};
-export {
-  NavigationHeader
+import { jsx, jsxs } from "react/jsx-runtime";
+import { css } from "@emotion/css";
+//#region src/components/layout/VerticalNavigation/NavigationHeader.tsx
+var classes = { root: css({
+	display: "flex",
+	alignItems: "center",
+	gap: theme.space.xxs
+}) };
+var NavigationHeader = ({ isOpen }) => {
+	const { logo } = useHvAppShellModel();
+	return /* @__PURE__ */ jsxs("div", {
+		className: classes.root,
+		children: [/* @__PURE__ */ jsx(AppSwitcher, {}), isOpen && /* @__PURE__ */ jsx(BrandLogo, { logo })]
+	});
 };
+//#endregion
+export { NavigationHeader };

package/dist/components/layout/VerticalNavigation/VerticalNavigation.js

@@ -1,135 +1,101 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useRef } from "react";
-import { useTranslation } from "react-i18next";
-import { cx, css } from "@emotion/css";
-import ClickAwayListener from "@mui/material/ClickAwayListener";
-import { useHvNavigation } from "@hitachivantara/app-shell-navigation";
-import { useHvAppShellRuntimeContext } from "@hitachivantara/app-shell-shared";
-import { useTheme, HvVerticalNavigation, HvVerticalNavigationHeader, HvVerticalNavigationTree, HvVerticalNavigationActions, theme, verticalNavigationTreeClasses } from "@hitachivantara/uikit-react-core";
-import { useResizeObserver } from "../../../hooks/useResizeObserver.js";
-import { useLayoutContext } from "../../../providers/LayoutProvider.js";
 import { useNavigationContext } from "../../../providers/NavigationProvider.js";
+import { useLayoutContext } from "../../../providers/LayoutProvider.js";
+import { useResizeObserver } from "../../../hooks/useResizeObserver.js";
 import { NavigationCollapse } from "./NavigationCollapse.js";
 import { NavigationHeader } from "./NavigationHeader.js";
-const classes = {
-  root: css({
-    gridArea: "vnav",
-    overflowY: "auto",
-    position: "relative",
-    zIndex: theme.zIndices.overlay
-  }),
-  pentaho: css({
-    maxHeight: "100vh"
-  }),
-  floating: css({
-    position: "absolute",
-    top: theme.header.height,
-    bottom: 0
-  }),
-  popup: css({
-    maxHeight: `calc(100vh - ${theme.header.height})`,
-    overflowY: "auto",
-    boxShadow: theme.colors.shadow,
-    [`& .${verticalNavigationTreeClasses.popup}`]: { boxShadow: "none" }
-  })
-};
-const VerticalNavigation = () => {
-  const { i18n } = useHvAppShellRuntimeContext();
-  const { t } = useTranslation(void 0, {
-    i18n,
-    keyPrefix: "verticalNavigation"
-  });
-  const {
-    selectedMenuItemId,
-    rootMenuItemId,
-    verticalNavigationItems,
-    isCompactMode,
-    verticalNavigationMode,
-    switchVerticalNavigationMode
-  } = useNavigationContext();
-  const { setVerticalNavigationWidth } = useLayoutContext();
-  const { navigate } = useHvNavigation();
-  const { activeTheme } = useTheme();
-  const ref = useRef(null);
-  const open = verticalNavigationMode === "EXPANDED";
-  const isPentahoTheme = activeTheme?.name === "pentahoPlus";
-  const changeHandler = (event, selectedItem) => {
-    event.preventDefault();
-    if (selectedItem.href) {
-      navigate(selectedItem.href, {
-        state: { selectedItemId: selectedItem.id }
-      });
-      if (isCompactMode) {
-        switchVerticalNavigationMode();
-      }
-    }
-  };
-  useResizeObserver(ref, (width) => {
-    setVerticalNavigationWidth(isCompactMode ? 0 : width);
-  });
-  return /* @__PURE__ */ jsx(
-    ClickAwayListener,
-    {
-      onClickAway: () => {
-        if (!isCompactMode) return;
-        switchVerticalNavigationMode();
-      },
-      children: /* @__PURE__ */ jsxs(
-        HvVerticalNavigation,
-        {
-          ref,
-          className: cx(classes.root, {
-            [classes.pentaho]: isPentahoTheme,
-            [classes.floating]: open && isCompactMode
-          }),
-          open,
-          useIcons: true,
-          slider: isCompactMode,
-          children: [
-            /* @__PURE__ */ jsxs("div", { children: [
-              isPentahoTheme && /* @__PURE__ */ jsx(NavigationHeader, { isOpen: open }),
-              (!isPentahoTheme || isCompactMode) && /* @__PURE__ */ jsx(
-                HvVerticalNavigationHeader,
-                {
-                  title: t("title"),
-                  onCollapseButtonClick: !isCompactMode ? switchVerticalNavigationMode : void 0,
-                  collapseButtonProps: {
-                    "aria-label": t(open ? "ariaLabelCollapse" : "ariaLabelExpand"),
-                    "aria-expanded": open
-                  },
-                  backButtonProps: {
-                    "aria-label": t("ariaLabelHeaderBackButton")
-                  }
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx(
-              HvVerticalNavigationTree,
-              {
-                mode: "navigation",
-                collapsible: true,
-                "aria-label": t("ariaLabelNavigationTree"),
-                selected: selectedMenuItemId,
-                onChange: changeHandler,
-                data: verticalNavigationItems,
-                classes: { navigationPopup: classes.popup },
-                sliderForwardButtonAriaLabel: t("ariaLabelSliderForwardButton")
-              },
-              rootMenuItemId
-            ),
-            /* @__PURE__ */ jsx(HvVerticalNavigationActions, { children: isPentahoTheme && /* @__PURE__ */ jsx(
-              NavigationCollapse,
-              {
-                onClick: switchVerticalNavigationMode,
-                isOpen: open
-              }
-            ) })
-          ]
-        }
-      )
-    }
-  );
+import { useRef } from "react";
+import { useTranslation } from "react-i18next";
+import { HvVerticalNavigation, HvVerticalNavigationActions, HvVerticalNavigationHeader, HvVerticalNavigationTree, theme, useTheme, verticalNavigationTreeClasses } from "@hitachivantara/uikit-react-core";
+import { useHvAppShellRuntimeContext } from "@hitachivantara/app-shell-shared";
+import { useHvNavigation } from "@hitachivantara/app-shell-navigation";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { css, cx } from "@emotion/css";
+import ClickAwayListener from "@mui/material/ClickAwayListener";
+//#region src/components/layout/VerticalNavigation/VerticalNavigation.tsx
+var classes = {
+	root: css({
+		gridArea: "vnav",
+		overflowY: "auto",
+		position: "relative",
+		zIndex: theme.zIndices.overlay
+	}),
+	pentaho: css({ maxHeight: "100vh" }),
+	floating: css({
+		position: "absolute",
+		top: theme.header.height,
+		bottom: 0
+	}),
+	popup: css({
+		maxHeight: `calc(100vh - ${theme.header.height})`,
+		overflowY: "auto",
+		boxShadow: theme.colors.shadow,
+		[`& .${verticalNavigationTreeClasses.popup}`]: { boxShadow: "none" }
+	})
 };
-export {
-  VerticalNavigation
+var VerticalNavigation = () => {
+	const { i18n } = useHvAppShellRuntimeContext();
+	const { t } = useTranslation(void 0, {
+		i18n,
+		keyPrefix: "verticalNavigation"
+	});
+	const { selectedMenuItemId, rootMenuItemId, verticalNavigationItems, isCompactMode, verticalNavigationMode, switchVerticalNavigationMode } = useNavigationContext();
+	const { setVerticalNavigationWidth } = useLayoutContext();
+	const { navigate } = useHvNavigation();
+	const { activeTheme } = useTheme();
+	const ref = useRef(null);
+	const open = verticalNavigationMode === "EXPANDED";
+	const isPentahoTheme = activeTheme?.name === "pentahoPlus";
+	const changeHandler = (event, selectedItem) => {
+		event.preventDefault();
+		if (selectedItem.href) {
+			navigate(selectedItem.href, { state: { selectedItemId: selectedItem.id } });
+			if (isCompactMode) switchVerticalNavigationMode();
+		}
+	};
+	useResizeObserver(ref, (width) => {
+		setVerticalNavigationWidth(isCompactMode ? 0 : width);
+	});
+	return /* @__PURE__ */ jsx(ClickAwayListener, {
+		onClickAway: () => {
+			if (!isCompactMode) return;
+			switchVerticalNavigationMode();
+		},
+		children: /* @__PURE__ */ jsxs(HvVerticalNavigation, {
+			ref,
+			className: cx(classes.root, {
+				[classes.pentaho]: isPentahoTheme,
+				[classes.floating]: open && isCompactMode
+			}),
+			open,
+			useIcons: true,
+			slider: isCompactMode,
+			children: [
+				/* @__PURE__ */ jsxs("div", { children: [isPentahoTheme && /* @__PURE__ */ jsx(NavigationHeader, { isOpen: open }), (!isPentahoTheme || isCompactMode) && /* @__PURE__ */ jsx(HvVerticalNavigationHeader, {
+					title: t("title"),
+					onCollapseButtonClick: !isCompactMode ? switchVerticalNavigationMode : void 0,
+					collapseButtonProps: {
+						"aria-label": t(open ? "ariaLabelCollapse" : "ariaLabelExpand"),
+						"aria-expanded": open
+					},
+					backButtonProps: { "aria-label": t("ariaLabelHeaderBackButton") }
+				})] }),
+				/* @__PURE__ */ jsx(HvVerticalNavigationTree, {
+					mode: "navigation",
+					collapsible: true,
+					"aria-label": t("ariaLabelNavigationTree"),
+					selected: selectedMenuItemId,
+					onChange: changeHandler,
+					data: verticalNavigationItems,
+					classes: { navigationPopup: classes.popup },
+					sliderForwardButtonAriaLabel: t("ariaLabelSliderForwardButton")
+				}, rootMenuItemId),
+				/* @__PURE__ */ jsx(HvVerticalNavigationActions, { children: isPentahoTheme && /* @__PURE__ */ jsx(NavigationCollapse, {
+					onClick: switchVerticalNavigationMode,
+					isOpen: open
+				}) })
+			]
+		})
+	});
 };
+//#endregion
+export { VerticalNavigation };

package/dist/hooks/useClearLocationState.js

@@ -1,15 +1,13 @@
 import { useCallback } from "react";
-import { useLocation, useBeforeUnload } from "react-router-dom";
+import { useBeforeUnload, useLocation } from "react-router-dom";
 import { useHvNavigation } from "@hitachivantara/app-shell-navigation";
-const useClearLocationState = () => {
-  const location = useLocation();
-  const { navigate } = useHvNavigation();
-  useBeforeUnload(
-    useCallback(() => {
-      navigate({ ...location }, { replace: true });
-    }, [location, navigate])
-  );
-};
-export {
-  useClearLocationState as default
+//#region src/hooks/useClearLocationState.tsx
+var useClearLocationState = () => {
+	const location = useLocation();
+	const { navigate } = useHvNavigation();
+	useBeforeUnload(useCallback(() => {
+		navigate({ ...location }, { replace: true });
+	}, [location, navigate]));
 };
+//#endregion
+export { useClearLocationState as default };

package/dist/hooks/useConditionsEvaluator.js

@@ -1,87 +1,73 @@
 import { useRef } from "react";
+//#region src/hooks/useConditionsEvaluator.ts
 function assert(condition, message) {
-  if (!condition) {
-    throw new Error(message || "Assertion failed");
-  }
+	if (!condition) throw new Error(message || "Assertion failed");
 }
 function areArraysEqual(a, b) {
-  if (a.length !== b.length) {
-    return false;
-  }
-  for (let i = 0; i < a.length; i++) {
-    if (a[i] !== b[i]) {
-      return false;
-    }
-  }
-  return true;
+	if (a.length !== b.length) return false;
+	for (let i = 0; i < a.length; i++) if (a[i] !== b[i]) return false;
+	return true;
 }
-const useConditionsEvaluator = (allConditions, preloadedBundles) => {
-  const previousResultsRef = useRef([]);
-  if (preloadedBundles.size === 0) {
-    return {
-      isPending: false,
-      error: null,
-      result: previousResultsRef.current
-    };
-  }
-  const hookResults = [];
-  for (const { bundle, config } of allConditions) {
-    const module = preloadedBundles.get(bundle);
-    if (!module) {
-      hookResults.push({
-        isPending: false,
-        error: new Error(`Bundle '${bundle}' not loaded`),
-        result: void 0
-      });
-      continue;
-    }
-    try {
-      const result2 = module(config);
-      hookResults.push(result2);
-    } catch (error) {
-      hookResults.push({
-        isPending: false,
-        error,
-        result: void 0
-      });
-    }
-  }
-  const isAnyPending = hookResults.some((result2) => result2.isPending);
-  const currentResults = [];
-  for (let i = 0; i < allConditions.length; i++) {
-    const condition = allConditions[i];
-    const asyncResult = hookResults[i];
-    if (asyncResult.error) {
-      console.error(
-        `Failed to execute ${condition.bundle} with: ${asyncResult.error}`
-      );
-    }
-    const boolResult = asyncResult.isPending || asyncResult.error ? false : asyncResult.result;
-    assert(
-      i === condition.globalIndex,
-      `Index mismatch: expected ${i} to equal globalIndex ${condition.globalIndex}`
-    );
-    currentResults[condition.globalIndex] = boolResult;
-  }
-  const previousResults = previousResultsRef.current;
-  const hasChanged = !areArraysEqual(previousResults, currentResults);
-  const result = hasChanged ? currentResults : previousResults;
-  if (hasChanged) {
-    previousResultsRef.current = currentResults;
-  }
-  if (isAnyPending) {
-    return {
-      isPending: true,
-      error: null,
-      result: void 0
-    };
-  }
-  return {
-    error: null,
-    result,
-    isPending: false
-  };
-};
-export {
-  useConditionsEvaluator
+/**
+* Hook to execute all loaded condition hooks and return results
+*
+* @param allConditions - Array of conditions with globalIndex from processed config
+* @param preloadedBundles - Array of all the preloaded bundles
+* @returns Object with isPending flag, error and results map
+*/
+var useConditionsEvaluator = (allConditions, preloadedBundles) => {
+	const previousResultsRef = useRef([]);
+	if (preloadedBundles.size === 0) return {
+		isPending: false,
+		error: null,
+		result: previousResultsRef.current
+	};
+	const hookResults = [];
+	for (const { bundle, config } of allConditions) {
+		const module = preloadedBundles.get(bundle);
+		if (!module) {
+			hookResults.push({
+				isPending: false,
+				error: /* @__PURE__ */ new Error(`Bundle '${bundle}' not loaded`),
+				result: void 0
+			});
+			continue;
+		}
+		try {
+			const result = module(config);
+			hookResults.push(result);
+		} catch (error) {
+			hookResults.push({
+				isPending: false,
+				error,
+				result: void 0
+			});
+		}
+	}
+	const isAnyPending = hookResults.some((result) => result.isPending);
+	const currentResults = [];
+	for (let i = 0; i < allConditions.length; i++) {
+		const condition = allConditions[i];
+		const asyncResult = hookResults[i];
+		if (asyncResult.error) console.error(`Failed to execute ${condition.bundle} with: ${asyncResult.error}`);
+		const boolResult = asyncResult.isPending || asyncResult.error ? false : asyncResult.result;
+		assert(i === condition.globalIndex, `Index mismatch: expected ${i} to equal globalIndex ${condition.globalIndex}`);
+		currentResults[condition.globalIndex] = boolResult;
+	}
+	const previousResults = previousResultsRef.current;
+	const hasChanged = !areArraysEqual(previousResults, currentResults);
+	const result = hasChanged ? currentResults : previousResults;
+	if (hasChanged) previousResultsRef.current = currentResults;
+	if (isAnyPending) return {
+		isPending: true,
+		error: null,
+		result: void 0
+	};
+	return {
+		error: null,
+		result,
+		isPending: false
+	};
 };
+//#endregion
+export { useConditionsEvaluator };

package/dist/hooks/useCustomEventListener.js

@@ -1,31 +1,19 @@
-import { useEffect } from "react";
-import { HvAppShellEventNotificationTrigger, HvAppShellEventThemeTrigger } from "@hitachivantara/app-shell-events";
 import useNotificationsEventListener from "./useNotificationsEventListener.js";
 import useThemeEventListener from "./useThemeEventListener.js";
-const useCustomEventListener = () => {
-  const { handleNotificationEvent } = useNotificationsEventListener();
-  const { handleThemeEvent } = useThemeEventListener();
-  useEffect(() => {
-    globalThis.addEventListener(
-      HvAppShellEventNotificationTrigger,
-      handleNotificationEvent
-    );
-    globalThis.addEventListener(
-      HvAppShellEventThemeTrigger,
-      handleThemeEvent
-    );
-    return () => {
-      globalThis.removeEventListener(
-        HvAppShellEventNotificationTrigger,
-        handleNotificationEvent
-      );
-      globalThis.removeEventListener(
-        HvAppShellEventThemeTrigger,
-        handleThemeEvent
-      );
-    };
-  }, [handleNotificationEvent, handleThemeEvent]);
-};
-export {
-  useCustomEventListener as default
+import { useEffect } from "react";
+import { HvAppShellEventNotificationTrigger, HvAppShellEventThemeTrigger } from "@hitachivantara/app-shell-events";
+//#region src/hooks/useCustomEventListener.ts
+var useCustomEventListener = () => {
+	const { handleNotificationEvent } = useNotificationsEventListener();
+	const { handleThemeEvent } = useThemeEventListener();
+	useEffect(() => {
+		globalThis.addEventListener(HvAppShellEventNotificationTrigger, handleNotificationEvent);
+		globalThis.addEventListener(HvAppShellEventThemeTrigger, handleThemeEvent);
+		return () => {
+			globalThis.removeEventListener(HvAppShellEventNotificationTrigger, handleNotificationEvent);
+			globalThis.removeEventListener(HvAppShellEventThemeTrigger, handleThemeEvent);
+		};
+	}, [handleNotificationEvent, handleThemeEvent]);
 };
+//#endregion
+export { useCustomEventListener as default };

package/dist/hooks/useFilteredModel.js

@@ -1,30 +1,33 @@
-import { useMemo } from "react";
 import filterModel from "../utils/filterModel.js";
 import { useConditionsEvaluator } from "./useConditionsEvaluator.js";
-const useFilteredModel = (model) => {
-  const { isPending: isModelPending, result } = useConditionsEvaluator(
-    model.allConditions,
-    model.preloadedBundles
-  );
-  const resolvedModel = useMemo(() => {
-    if (isModelPending) {
-      return void 0;
-    }
-    return filterModel(model, result);
-  }, [isModelPending, model, result]);
-  if (isModelPending) {
-    return {
-      error: null,
-      isPending: true,
-      model: void 0
-    };
-  }
-  return {
-    error: null,
-    isPending: false,
-    model: resolvedModel
-  };
-};
-export {
-  useFilteredModel
+import { useMemo } from "react";
+//#region src/hooks/useFilteredModel.ts
+/**
+* Hook to evaluate conditions and filter configuration
+*
+* @param model - The app shell model with config and preloaded bundles
+* @returns Object with isPending flag and the filtered model
+*/
+var useFilteredModel = (model) => {
+	const { isPending: isModelPending, result } = useConditionsEvaluator(model.allConditions, model.preloadedBundles);
+	const resolvedModel = useMemo(() => {
+		if (isModelPending) return;
+		return filterModel(model, result);
+	}, [
+		isModelPending,
+		model,
+		result
+	]);
+	if (isModelPending) return {
+		error: null,
+		isPending: true,
+		model: void 0
+	};
+	return {
+		error: null,
+		isPending: false,
+		model: resolvedModel
+	};
 };
+//#endregion
+export { useFilteredModel };