@hitachivantara/app-shell-ui 1.13.6 → 2.0.0-next.1

package/dist/components/AppShellProvider/AppShellProvider.js

@@ -0,0 +1,105 @@
+import { jsx } from "react/jsx-runtime";
+import { useContext, useState, useEffect, useMemo } from "react";
+import { I18nContext } from "react-i18next";
+import { HvAppShellContext, HvAppShellRuntimeContext, HvAppShellCombinedProvidersContext, CONFIG_TRANSLATIONS_NAMESPACE } from "@hitachivantara/app-shell-shared";
+import { themes, HvProvider } from "@hitachivantara/uikit-react-core";
+import useLocalStorage from "../../hooks/useLocalStorage.js";
+import { addResourceBundles } from "../../i18n/index.js";
+const AppShellProvider = ({
+  children,
+  config: localConfig,
+  configUrl
+}) => {
+  const { i18n } = useContext(I18nContext);
+  const { value: storedColorModeValue } = useLocalStorage("COLOR_MODE");
+  const [loadedConfig, setLoadedConfig] = useState(void 0);
+  const [hasError, setHasError] = useState(false);
+  useEffect(() => {
+    if (localConfig || !configUrl) return;
+    fetch(new URL(configUrl)).then((result) => result.json()).then((data) => setLoadedConfig(data)).catch((e) => {
+      console.error(`Failed to obtain the context from: ${configUrl}`, e);
+      setLoadedConfig(void 0);
+      setHasError(true);
+    });
+  }, [localConfig, configUrl]);
+  const theConfig = useMemo(
+    () => localConfig ?? loadedConfig,
+    [localConfig, loadedConfig]
+  );
+  if (hasError) {
+    throw Error("Failed to obtain the configuration");
+  }
+  if (theConfig?.translations) {
+    addResourceBundles(
+      i18n,
+      theConfig.translations,
+      CONFIG_TRANSLATIONS_NAMESPACE
+    );
+  }
+  const [theme, setTheme] = useState();
+  const [providers, setProviders] = useState();
+  useEffect(() => {
+    const theme2 = theConfig?.theming?.theme;
+    if (!theme2) return;
+    if (themes[theme2]) {
+      setTheme(themes[theme2]);
+      return;
+    }
+    import(
+      /* @vite-ignore */
+      theme2
+    ).then((module) => {
+      setTheme(module.default);
+    }).catch((e) => {
+      console.error(`Import of theme bundle ${theme2} failed! ${e}`);
+    });
+  }, [theConfig?.theming?.theme]);
+  useEffect(() => {
+    if (!theConfig?.providers) return;
+    Promise.all(
+      theConfig.providers.map((provider) => {
+        return import(
+          /* @vite-ignore */
+          provider.bundle
+        ).then((module) => ({
+          component: module.default,
+          config: provider.config
+        })).catch((e) => {
+          console.error(
+            `Import of provider '${provider.bundle}' failed! ${e}`
+          );
+        });
+      })
+    ).then(
+      (loadedProviders) => setProviders(loadedProviders.filter((provider) => !!provider))
+    ).catch((e) => {
+      console.error(`Import of providers failed!`, e);
+    });
+  }, [theConfig?.providers]);
+  const runtimeContext = useMemo(
+    () => ({
+      i18n
+    }),
+    [i18n]
+  );
+  const providersContext = useMemo(
+    () => ({
+      providers
+    }),
+    [providers]
+  );
+  if (!theConfig || theConfig.theming?.theme && !theme || theConfig.providers != null && providers === void 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(HvAppShellContext.Provider, { value: theConfig, children: /* @__PURE__ */ jsx(HvAppShellRuntimeContext.Provider, { value: runtimeContext, children: /* @__PURE__ */ jsx(
+    HvProvider,
+    {
+      theme,
+      colorMode: storedColorModeValue ?? theConfig.theming?.colorMode,
+      children: /* @__PURE__ */ jsx(HvAppShellCombinedProvidersContext.Provider, { value: providersContext, children })
+    }
+  ) }) });
+};
+export {
+  AppShellProvider as default
+};

package/dist/{esm/hooks → hooks}/useNotificationsEventListener.js

@@ -4,12 +4,12 @@ const useNotificationsEventListener = () => {
   const { enqueueSnackbar } = useHvSnackbar();
   const { show } = useBannerContext();
   const handleCustomEventSnackbar = (notification) => {
-    const { message, variant, actions, actionsCallback } = notification;
+    const { message, variant, actions, onAction } = notification;
     let snackbarContentProps;
     if (actions) {
       snackbarContentProps = {
         action: Array.isArray(actions) ? actions[0] : actions,
-        actionCallback: actionsCallback
+        onAction
       };
     }
     if (message) {

package/dist/{esm/hooks → hooks}/useThemeEventListener.js

@@ -1,17 +1,16 @@
 import { useTheme } from "@hitachivantara/uikit-react-core";
 import useLocalStorage from "./useLocalStorage.js";
 const useThemeEventListener = () => {
-  const { selectedTheme, changeTheme, selectedMode, colorModes } = useTheme();
+  const { selectedMode, colorModes, changeMode } = useTheme();
   const { setStoredValue } = useLocalStorage("COLOR_MODE");
   const getNextColorMode = () => {
-    const index = colorModes.indexOf(selectedMode);
-    const nextIndex = (index + 1) % colorModes.length;
-    return colorModes[nextIndex];
+    const nextIndex = colorModes.indexOf(selectedMode) + 1;
+    return colorModes[nextIndex % colorModes.length];
   };
   const handleThemeEvent = (event) => {
     const { colorMode } = event.detail;
     const newColorMode = !colorMode || colorModes.indexOf(colorMode) === -1 ? getNextColorMode() : colorMode;
-    changeTheme(selectedTheme, newColorMode);
+    changeMode(newColorMode);
     setStoredValue(newColorMode);
   };
   return { handleThemeEvent };

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import { JSX as JSX_2 } from 'react/jsx-runtime';
+
+declare const _default: {
+    ({ ...wrappedProps }: any): JSX_2.Element;
+    displayName: string;
+};
+export default _default;
+
+export { }

package/dist/{esm/pages → pages}/ErrorPage/ErrorPage.js

@@ -21,7 +21,7 @@ const ErrorPage = ({
       children: [
         /* @__PURE__ */ jsxs(StyledTitleWrapper, { children: [
           code && /* @__PURE__ */ jsx(HvTypography, { variant: "title1", children: code }),
-          /* @__PURE__ */ jsx(HvTypography, { variant: isCompactMode ? "xsTitle" : "display", children: title })
+          /* @__PURE__ */ jsx(HvTypography, { variant: isCompactMode ? "title3" : "display", children: title })
         ] }),
         /* @__PURE__ */ jsx(
           StyledImageWrapper,

package/dist/{esm/providers → providers}/BannerProvider.js

@@ -100,7 +100,7 @@ const BannerProvider = ({ children }) => {
         label: banner.message,
         showIcon: true,
         actions: banner.actions,
-        actionsCallback: banner.actionsCallback,
+        onAction: banner.onAction,
         bannerContentProps: {
           actionProps: { "aria-label": t("close") }
         },

package/dist/types/index.d.ts

@@ -1,9 +1,4 @@
-import { JSX as JSX_2 } from 'react/jsx-runtime';
-
-declare const _default: {
-    ({ ...wrappedProps }: any): JSX_2.Element;
-    displayName: string;
-};
-export default _default;
-
-export { }
+export {}
+import hitachivantaraappShellUi from '../packages/app-shell-ui/src/index'
+export default hitachivantaraappShellUi
+export {}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/app-shell-ui",
-  "version": "1.13.6",
+  "version": "2.0.0-next.1",
   "type": "module",
   "private": false,
   "author": "Hitachi Vantara UI Kit Team",
@@ -18,13 +18,13 @@
     "@emotion/css": "^11.10.5",
     "@emotion/react": "^11.10.5",
     "@emotion/styled": "^11.10.5",
-    "@hitachivantara/app-shell-events": "^1.1.2",
-    "@hitachivantara/app-shell-navigation": "^1.4.16",
-    "@hitachivantara/app-shell-services": "^1.1.2",
-    "@hitachivantara/app-shell-shared": "^1.7.6",
-    "@hitachivantara/uikit-react-core": "^5.106.1",
-    "@hitachivantara/uikit-react-icons": "^5.16.6",
-    "@mui/material": "^5.16.14",
+    "@hitachivantara/app-shell-events": "^2.0.0-next.1",
+    "@hitachivantara/app-shell-navigation": "^2.0.0-next.1",
+    "@hitachivantara/app-shell-services": "^2.0.0-next.1",
+    "@hitachivantara/app-shell-shared": "^2.0.0-next.1",
+    "@hitachivantara/uikit-react-core": "^6.0.0-next.2",
+    "@hitachivantara/uikit-react-icons": "^6.0.0-next.2",
+    "@mui/material": "^7.0.2",
     "i18next": "^24.2.2",
     "i18next-browser-languagedetector": "^8.0.3",
     "react-error-boundary": "^4.0.10",
@@ -44,15 +44,15 @@
     "access": "public",
     "directory": "package"
   },
-  "gitHead": "7d60bff02f58ff47ae19146532553882c2e4b732",
+  "gitHead": "0b07240fb2ef75e046d8e6aaf0ff71bf2415c73f",
   "exports": {
     ".": {
-      "types": "./dist/types/index.d.ts",
-      "import": "./dist/esm/index.js",
-      "default": "./dist/esm/index.js"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
     "./package.json": "./package.json"
   },
   "types": "./dist/types/index.d.ts",
-  "module": "dist/esm/index.js"
+  "module": "dist/index.js"
 }

package/dist/esm/components/AppShellProvider/AppShellProvider.js

@@ -1,115 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { useContext, useState, useEffect, useMemo } from "react";
-import { I18nContext } from "react-i18next";
-import { HvAppShellContext, HvAppShellRuntimeContext, HvAppShellCombinedProvidersContext, CONFIG_TRANSLATIONS_NAMESPACE } from "@hitachivantara/app-shell-shared";
-import { themes, HvProvider } from "@hitachivantara/uikit-react-core";
-import useLocalStorage from "../../hooks/useLocalStorage.js";
-import { addResourceBundles } from "../../i18n/index.js";
-const AppShellProvider = ({
-  children,
-  config: localConfig,
-  configUrl
-}) => {
-  const { i18n } = useContext(I18nContext);
-  const { value: storedColorModeValue } = useLocalStorage("COLOR_MODE");
-  const [loadedConfig, setLoadedConfig] = useState(void 0);
-  const [hasError, setHasError] = useState(false);
-  useEffect(() => {
-    if (!localConfig && configUrl) {
-      fetch(new URL(configUrl)).then((result) => {
-        return result.json();
-      }).then((data) => setLoadedConfig(data)).catch((e) => {
-        console.error(
-          `It was not possible to obtain the context from: ${configUrl}`,
-          e
-        );
-        setLoadedConfig(void 0);
-        setHasError(true);
-      });
-    }
-  }, [localConfig, configUrl]);
-  const theConfig = useMemo(
-    () => localConfig ?? loadedConfig,
-    [localConfig, loadedConfig]
-  );
-  if (hasError) {
-    throw Error("It was not possible to obtain the configuration");
-  }
-  if (theConfig?.translations) {
-    addResourceBundles(
-      i18n,
-      theConfig.translations,
-      CONFIG_TRANSLATIONS_NAMESPACE
-    );
-  }
-  const [themes$1, setThemes] = useState(void 0);
-  const [providers, setProviders] = useState(void 0);
-  useEffect(() => {
-    if (theConfig?.theming?.themes) {
-      Promise.all(
-        theConfig.theming.themes?.map((bundle) => {
-          return themes[bundle] ?? import(
-            /* @vite-ignore */
-            bundle
-          ).then((module) => module.default).catch((e) => {
-            console.error(`Import of theme bundle ${bundle} failed! ${e}`);
-          });
-        })
-      ).then((loadedThemes) => {
-        setThemes(loadedThemes.filter((theme) => !!theme));
-      }).catch((e) => {
-        console.error(`Import of themes failed! ${e}`);
-      });
-    }
-  }, [theConfig?.theming?.themes]);
-  useEffect(() => {
-    if (theConfig?.providers) {
-      Promise.all(
-        theConfig.providers.map((provider) => {
-          return import(
-            /* @vite-ignore */
-            provider.bundle
-          ).then((module) => ({
-            component: module.default,
-            config: provider.config
-          })).catch((e) => {
-            console.error(
-              `Import of provider '${provider.bundle}' failed! ${e}`
-            );
-          });
-        })
-      ).then(
-        (loadedProviders) => setProviders(loadedProviders.filter((provider) => !!provider))
-      ).catch((e) => {
-        console.error(`Import of providers failed!`, e);
-      });
-    }
-  }, [theConfig?.providers]);
-  const runtimeContext = useMemo(
-    () => ({
-      i18n
-    }),
-    [i18n]
-  );
-  const providersContext = useMemo(
-    () => ({
-      providers
-    }),
-    [providers]
-  );
-  if (!theConfig || theConfig.theming?.themes && !themes$1 || theConfig.providers != null && providers === void 0) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx(HvAppShellContext.Provider, { value: theConfig, children: /* @__PURE__ */ jsx(HvAppShellRuntimeContext.Provider, { value: runtimeContext, children: /* @__PURE__ */ jsx(
-    HvProvider,
-    {
-      themes: themes$1,
-      theme: theConfig.theming?.theme,
-      colorMode: storedColorModeValue ?? theConfig.theming?.colorMode,
-      children: /* @__PURE__ */ jsx(HvAppShellCombinedProvidersContext.Provider, { value: providersContext, children })
-    }
-  ) }) });
-};
-export {
-  AppShellProvider as default
-};