@hitachivantara/uikit-react-core 5.0.0-next.9 → 5.0.0

package/dist/cjs/components/Grid/Grid.cjs

@@ -1,10 +1,12 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const material = require("@mui/material");
-const lodash = require("lodash");
+const isString = require("lodash/isString");
 const React = require("react");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useWidth = require("../../hooks/useWidth.cjs");
+const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
+const isString__default = /* @__PURE__ */ _interopDefault(isString);
 const BREAKPOINT_GUTTERS = {
   xs: 2,
   sm: 2,
@@ -19,17 +21,21 @@ const HvGrid = React.forwardRef(({
 }, ref) => {
   const width = useWidth.useWidth();
   let gridSpacing = spacing;
-  if (lodash.isString(spacing)) {
+  if (isString__default.default(spacing)) {
     if (spacing === "auto") {
       gridSpacing = BREAKPOINT_GUTTERS[width];
     } else {
       gridSpacing = BREAKPOINT_GUTTERS[spacing];
     }
   }
-  return /* @__PURE__ */ jsxRuntime.jsx(material.Grid, { ref, ...container && {
-    container,
-    spacing: gridSpacing
-  }, ...others });
+  return /* @__PURE__ */ jsxRuntime.jsx(material.Grid, {
+    ref,
+    ...container && {
+      container,
+      spacing: gridSpacing
+    },
+    ...others
+  });
 });
 exports.HvGrid = HvGrid;
 //# sourceMappingURL=Grid.cjs.map

package/dist/cjs/components/Grid/Grid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.cjs","sources":["../../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import { Grid as MuiGrid, GridProps as MuiGridProps } from \"@mui/material\";\nimport { isString } from \"lodash\";\nimport { forwardRef } from \"react\";\nimport { useWidth } from \"hooks\";\nimport { HvBaseProps } from \"../../types\";\nimport { HvGridClasses } from \"./gridClasses\";\n\nconst BREAKPOINT_GUTTERS = {\n  xs: 2,\n  sm: 2,\n  md: 4,\n  lg: 4,\n  xl: 4,\n};\n\nexport type HvGridDirection =\n  | \"row\"\n  | \"row-reverse\"\n  | \"column\"\n  | \"column-reverse\";\n\nexport type HvGridSpacing =\n  | \"xs\"\n  | \"sm\"\n  | \"md\"\n  | \"lg\"\n  | \"xl\"\n  | \"auto\"\n  | 1\n  | 2\n  | 3\n  | 4\n  | 5\n  | 6\n  | 7\n  | 8\n  | 9\n  | 10;\n\nexport type HvGridProps = MuiGridProps &\n  HvBaseProps & {\n    /**\n     * If `true`, the component will have the flex *container* behavior.\n     * You should be wrapping *items* with a *container*.\n     */\n    container?: boolean;\n    /**\n     * If `true`, the component will have the flex *item* behavior.\n     * You should be wrapping *items* with a *container*.\n     */\n    item?: boolean;\n    /**\n     * Defines the space between the type item component. It can only be used on a type container component.\n     * Based in the 8x factor defined in the theme, it allows the definition of this factor based on the factor\n     * (number between 0 and 10), breakpoint or auto.\n     */\n    spacing?: HvGridSpacing | number;\n    /**\n     * Defines the `flex-direction` style property.\n     * It is applied for all screen sizes.\n     */\n    direction?: HvGridDirection;\n    /**\n     * Defines the `justify-content` style property.\n     * It is applied for all screen sizes.\n     */\n    justify?:\n      | \"flex-start\"\n      | \"center\"\n      | \"flex-end\"\n      | \"space-between\"\n      | \"space-around\"\n      | \"space-evenly\";\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for all the screen sizes with the lowest priority.\n     */\n    xs?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `sm` breakpoint and wider screens if not overridden.\n     */\n    sm?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `md` breakpoint and wider screens if not overridden.\n     */\n    md?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `lg` breakpoint and wider screens if not overridden.\n     */\n    lg?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `xl` breakpoint and wider screens.\n     */\n    xl?: number | boolean;\n    /**\n     * Defines the `flex-wrap` style property.\n     * It's applied for all screen sizes.\n     */\n    wrap?: \"nowrap\" | \"wrap\" | \"wrap-reverse\";\n    /**\n     * If `true`, it sets `min-width: 0` on the item.\n     * Refer to the limitations section of the documentation to better understand the use case.\n     */\n    zeroMinWidth?: boolean;\n    /** A Jss Object used to override or extend the styles applied to the component. */\n    classes?: HvGridClasses;\n  };\n\n/**\n * The grid creates visual consistency between layouts while allowing flexibility\n * across a wide variety of designs. This component is based in a 12-column grid layout.\n *\n * It is is based in the [Material UI Grid]https://mui.com/material-ui/react-grid/).\n *\n * The definitions were set following the Design System directives:\n *\n * | Breakpoint | Width (in px) | Gutters (in px) | Number of columns |\n * | ---------- | ------------- | --------------- | ----------------- |\n * | xs         | [0-575[       | 16              | 4                 |\n * | sm         | [576-767[     | 16              | 8                 |\n * | md         | [768-991[     | 32              | 12                |\n * | lg         | [992-1199[    | 32              | 12                |\n * | xl         | [1200-...[    | 32              | 12                |\n *\n */\nexport const HvGrid = forwardRef<HTMLDivElement, HvGridProps>(\n  ({ container, spacing = \"auto\", ...others }, ref) => {\n    const width = useWidth();\n    let gridSpacing = spacing;\n\n    if (isString(spacing)) {\n      if (spacing === \"auto\") {\n        gridSpacing = BREAKPOINT_GUTTERS[width];\n      } else {\n        gridSpacing = BREAKPOINT_GUTTERS[spacing];\n      }\n    }\n\n    return (\n      <MuiGrid\n        ref={ref}\n        {...(container && { container, spacing: gridSpacing })}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["BREAKPOINT_GUTTERS","xs","sm","md","lg","xl","HvGrid","forwardRef","container","spacing","others","ref","width","useWidth","gridSpacing","isString","jsx","MuiGrid"],"mappings":";;;;;;;AAOA,MAAMA,qBAAqB;AAAA,EACzBC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AACN;AAoHaC,MAAAA,SAASC,iBACpB,CAAC;AAAA,EAAEC;AAAAA,EAAWC,UAAU;AAAA,KAAWC;AAAO,GAAGC,QAAQ;AACnD,QAAMC,QAAQC,SAAAA;AACd,MAAIC,cAAcL;AAEdM,MAAAA,OAAAA,SAASN,OAAO,GAAG;AACrB,QAAIA,YAAY,QAAQ;AACtBK,oBAAcd,mBAAmBY;AAAAA,IAAAA,OAC5B;AACLE,oBAAcd,mBAAmBS;AAAAA,IACnC;AAAA,EACF;AAEA,SACGO,2BAAA,IAAAC,SAAA,MAAA,EACC,KACKT,GAAAA,aAAa;AAAA,IAAEA;AAAAA,IAAWC,SAASK;AAAAA,EAAAA,GACpCJ,GAAAA,OACJ,CAAA;AAEN,CAAC;;"}
+{"version":3,"file":"Grid.cjs","sources":["../../../../src/components/Grid/Grid.tsx"],"sourcesContent":["import { Grid as MuiGrid, GridProps as MuiGridProps } from \"@mui/material\";\nimport isString from \"lodash/isString\";\nimport { forwardRef } from \"react\";\nimport { useWidth } from \"hooks\";\nimport { HvBaseProps } from \"../../types\";\nimport { HvGridClasses } from \"./gridClasses\";\n\nconst BREAKPOINT_GUTTERS = {\n  xs: 2,\n  sm: 2,\n  md: 4,\n  lg: 4,\n  xl: 4,\n};\n\nexport type HvGridDirection =\n  | \"row\"\n  | \"row-reverse\"\n  | \"column\"\n  | \"column-reverse\";\n\nexport type HvGridSpacing =\n  | \"xs\"\n  | \"sm\"\n  | \"md\"\n  | \"lg\"\n  | \"xl\"\n  | \"auto\"\n  | 1\n  | 2\n  | 3\n  | 4\n  | 5\n  | 6\n  | 7\n  | 8\n  | 9\n  | 10;\n\nexport type HvGridProps = Omit<MuiGridProps, \"classes\"> &\n  HvBaseProps & {\n    /**\n     * If `true`, the component will have the flex *container* behavior.\n     * You should be wrapping *items* with a *container*.\n     */\n    container?: boolean;\n    /**\n     * If `true`, the component will have the flex *item* behavior.\n     * You should be wrapping *items* with a *container*.\n     */\n    item?: boolean;\n    /**\n     * Defines the space between the type item component. It can only be used on a type container component.\n     * Based in the 8x factor defined in the theme, it allows the definition of this factor based on the factor\n     * (number between 0 and 10), breakpoint or auto.\n     */\n    spacing?: HvGridSpacing | number;\n    /**\n     * Defines the `flex-direction` style property.\n     * It is applied for all screen sizes.\n     */\n    direction?: HvGridDirection;\n    /**\n     * Defines the `justify-content` style property.\n     * It is applied for all screen sizes.\n     */\n    justify?:\n      | \"flex-start\"\n      | \"center\"\n      | \"flex-end\"\n      | \"space-between\"\n      | \"space-around\"\n      | \"space-evenly\";\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for all the screen sizes with the lowest priority.\n     */\n    xs?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `sm` breakpoint and wider screens if not overridden.\n     */\n    sm?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `md` breakpoint and wider screens if not overridden.\n     */\n    md?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `lg` breakpoint and wider screens if not overridden.\n     */\n    lg?: number | boolean;\n    /**\n     * Defines the number of grids the component is going to use.\n     * It's applied for the `xl` breakpoint and wider screens.\n     */\n    xl?: number | boolean;\n    /**\n     * Defines the `flex-wrap` style property.\n     * It's applied for all screen sizes.\n     */\n    wrap?: \"nowrap\" | \"wrap\" | \"wrap-reverse\";\n    /**\n     * If `true`, it sets `min-width: 0` on the item.\n     * Refer to the limitations section of the documentation to better understand the use case.\n     */\n    zeroMinWidth?: boolean;\n    /** A Jss Object used to override or extend the styles applied to the component. */\n    classes?: HvGridClasses;\n  };\n\n/**\n * The grid creates visual consistency between layouts while allowing flexibility\n * across a wide variety of designs. This component is based in a 12-column grid layout.\n *\n * It is is based in the [Material UI Grid]https://mui.com/material-ui/react-grid/).\n *\n * The definitions were set following the Design System directives:\n *\n * | Breakpoint | Width (in px) | Gutters (in px) | Number of columns |\n * | ---------- | ------------- | --------------- | ----------------- |\n * | xs         | [0-575[       | 16              | 4                 |\n * | sm         | [576-767[     | 16              | 8                 |\n * | md         | [768-991[     | 32              | 12                |\n * | lg         | [992-1199[    | 32              | 12                |\n * | xl         | [1200-...[    | 32              | 12                |\n *\n */\nexport const HvGrid = forwardRef<HTMLDivElement, HvGridProps>(\n  ({ container, spacing = \"auto\", ...others }, ref) => {\n    const width = useWidth();\n    let gridSpacing = spacing;\n\n    if (isString(spacing)) {\n      if (spacing === \"auto\") {\n        gridSpacing = BREAKPOINT_GUTTERS[width];\n      } else {\n        gridSpacing = BREAKPOINT_GUTTERS[spacing];\n      }\n    }\n\n    return (\n      <MuiGrid\n        ref={ref}\n        {...(container && { container, spacing: gridSpacing })}\n        {...others}\n      />\n    );\n  }\n);\n"],"names":["BREAKPOINT_GUTTERS","xs","sm","md","lg","xl","HvGrid","forwardRef","container","spacing","others","ref","width","useWidth","gridSpacing","isString","MuiGrid"],"mappings":";;;;;;;;;AAOA,MAAMA,qBAAqB;AAAA,EACzBC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AAAA,EACJC,IAAI;AACN;AAoHaC,MAAAA,SAASC,iBACpB,CAAC;AAAA,EAAEC;AAAAA,EAAWC,UAAU;AAAA,EAAQ,GAAGC;AAAO,GAAGC,QAAQ;AACnD,QAAMC,QAAQC,SAAAA;AACd,MAAIC,cAAcL;AAEdM,MAAAA,kBAAAA,QAASN,OAAO,GAAG;AACrB,QAAIA,YAAY,QAAQ;AACtBK,oBAAcd,mBAAmBY,KAAK;AAAA,IAAA,OACjC;AACLE,oBAAcd,mBAAmBS,OAAO;AAAA,IAC1C;AAAA,EACF;AAEA,wCACGO,SAAAA,MAAO;AAAA,IACNL;AAAAA,IAAS,GACJH,aAAa;AAAA,MAAEA;AAAAA,MAAWC,SAASK;AAAAA,IAAY;AAAA,IAAC,GACjDJ;AAAAA,EAAAA,CACJ;AAEN,CAAC;;"}

package/dist/cjs/components/Header/Actions/Actions.cjs

@@ -1,18 +1,22 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const Actions_styles = require("./Actions.styles.cjs");
 const actionsClasses = require("./actionsClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
-const HvActions = ({
+const HvHeaderActions = ({
   classes,
   className,
   children,
   ...others
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(Actions_styles.StyledDiv, { className: clsx__default.default(className, actionsClasses.default.root, classes == null ? void 0 : classes.root), ...others, children });
+  return /* @__PURE__ */ jsxRuntime.jsx(Actions_styles.StyledDiv, {
+    className: clsx__default.default(className, actionsClasses.default.root, classes == null ? void 0 : classes.root),
+    ...others,
+    children
+  });
 };
-exports.HvActions = HvActions;
+exports.HvHeaderActions = HvHeaderActions;
 //# sourceMappingURL=Actions.cjs.map

package/dist/cjs/components/Header/Actions/Actions.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.cjs","sources":["../../../../../src/components/Header/Actions/Actions.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvBaseProps } from \"../../../types\";\nimport { StyledDiv } from \"./Actions.styles\";\nimport headerActionsClasses, { HvHeaderActionsClasses } from \"./actionsClasses\";\n\nexport type HvActionsProps = HvBaseProps & {\n  classes?: HvHeaderActionsClasses;\n};\n\nexport const HvActions = ({\n  classes,\n  className,\n  children,\n  ...others\n}: HvActionsProps) => {\n  return (\n    <StyledDiv\n      className={clsx(className, headerActionsClasses.root, classes?.root)}\n      {...others}\n    >\n      {children}\n    </StyledDiv>\n  );\n};\n"],"names":["HvActions","classes","className","children","others","jsx","StyledDiv","clsx","headerActionsClasses","root"],"mappings":";;;;;;;;AASO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,KACGC;AACW,MAAM;AACpB,SACGC,2BAAA,IAAAC,eAAA,WAAA,EACC,WAAWC,cAAAA,QAAKL,WAAWM,eAAAA,QAAqBC,MAAMR,mCAASQ,IAAI,GAC/DL,GAAAA,QAEHD,SACH,CAAA;AAEJ;;"}
+{"version":3,"file":"Actions.cjs","sources":["../../../../../src/components/Header/Actions/Actions.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvBaseProps } from \"../../../types\";\nimport { StyledDiv } from \"./Actions.styles\";\nimport headerActionsClasses, { HvHeaderActionsClasses } from \"./actionsClasses\";\n\nexport type HvHeaderActionsProps = HvBaseProps & {\n  classes?: HvHeaderActionsClasses;\n};\n\nexport const HvHeaderActions = ({\n  classes,\n  className,\n  children,\n  ...others\n}: HvHeaderActionsProps) => {\n  return (\n    <StyledDiv\n      className={clsx(className, headerActionsClasses.root, classes?.root)}\n      {...others}\n    >\n      {children}\n    </StyledDiv>\n  );\n};\n"],"names":["HvHeaderActions","classes","className","children","others","StyledDiv","clsx","headerActionsClasses","root"],"mappings":";;;;;;;;AASO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AAC1B,wCACGC,eAAAA,WAAS;AAAA,IACRH,WAAWI,cAAKJ,QAAAA,WAAWK,eAAqBC,QAAAA,MAAMP,mCAASO,IAAI;AAAA,IAAE,GACjEJ;AAAAA,IAAMD;AAAAA,EAAAA,CAGA;AAEhB;;"}

package/dist/cjs/components/Header/Actions/Actions.styles.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const buttonClasses = require("../../Button/buttonClasses.cjs");
@@ -13,6 +13,7 @@ const StyledDiv = /* @__PURE__ */ _styled__default.default("div", process.env.NO
 })({
   backgroundColor: "transparent",
   display: "flex",
+  gap: uikitStyles.theme.space.xs,
   alignItems: "center",
   marginLeft: "auto",
   "& > *": {
@@ -23,6 +24,6 @@ const StyledDiv = /* @__PURE__ */ _styled__default.default("div", process.env.NO
       backgroundColor: uikitStyles.theme.header.hoverColor
     }
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0FjdGlvbnMvQWN0aW9ucy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUl5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9BY3Rpb25zL0FjdGlvbnMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgYnV0dG9uQ2xhc3NlcyB9IGZyb20gXCJjb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWREaXYgPSBzdHlsZWQuZGl2KHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBtYXJnaW5MZWZ0OiBcImF1dG9cIixcbiAgXCImID4gKlwiOiB7XG4gICAgbWFyZ2luTGVmdDogdGhlbWUuc3BhY2UueHMsXG4gIH0sXG4gIFtgJiAuJHtidXR0b25DbGFzc2VzLnJvb3R9YF06IHtcbiAgICBcIiY6aG92ZXJcIjogeyBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5ob3ZlckNvbG9yIH0sXG4gIH0sXG59KTtcbiJdfQ== */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0FjdGlvbnMvQWN0aW9ucy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUl5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9BY3Rpb25zL0FjdGlvbnMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgYnV0dG9uQ2xhc3NlcyB9IGZyb20gXCJjb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWREaXYgPSBzdHlsZWQuZGl2KHtcbiAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBnYXA6IHRoZW1lLnNwYWNlLnhzLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBtYXJnaW5MZWZ0OiBcImF1dG9cIixcbiAgXCImID4gKlwiOiB7XG4gICAgbWFyZ2luTGVmdDogdGhlbWUuc3BhY2UueHMsXG4gIH0sXG4gIFtgJiAuJHtidXR0b25DbGFzc2VzLnJvb3R9YF06IHtcbiAgICBcIiY6aG92ZXJcIjogeyBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5ob3ZlckNvbG9yIH0sXG4gIH0sXG59KTtcbiJdfQ== */");
 exports.StyledDiv = StyledDiv;
 //# sourceMappingURL=Actions.styles.cjs.map

package/dist/cjs/components/Header/Actions/Actions.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.styles.cjs","sources":["../../../../../src/components/Header/Actions/Actions.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { buttonClasses } from \"components\";\n\nexport const StyledDiv = styled.div({\n  backgroundColor: \"transparent\",\n  display: \"flex\",\n  alignItems: \"center\",\n  marginLeft: \"auto\",\n  \"& > *\": {\n    marginLeft: theme.space.xs,\n  },\n  [`& .${buttonClasses.root}`]: {\n    \"&:hover\": { backgroundColor: theme.header.hoverColor },\n  },\n});\n"],"names":["StyledDiv","process","env","NODE_ENV","target","label","backgroundColor","display","alignItems","marginLeft","theme","space","xs","buttonClasses","root","header","hoverColor"],"mappings":";;;;;;;AAIO,MAAMA,4DAAYC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAW,EAAA;AAAA,EAClCC,iBAAiB;AAAA,EACjBC,SAAS;AAAA,EACTC,YAAY;AAAA,EACZC,YAAY;AAAA,EACZ,SAAS;AAAA,IACPA,YAAYC,YAAAA,MAAMC,MAAMC;AAAAA,EAC1B;AAAA,EACA,CAAE,MAAKC,sBAAcC,SAAS;AAAA,IAC5B,WAAW;AAAA,MAAER,iBAAiBI,YAAAA,MAAMK,OAAOC;AAAAA,IAAW;AAAA,EACxD;AACF,GAACf,QAAAC,IAAAC,aAAC,eAAA,KAAA,6kCAAA;;"}
+{"version":3,"file":"Actions.styles.cjs","sources":["../../../../../src/components/Header/Actions/Actions.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { buttonClasses } from \"components\";\n\nexport const StyledDiv = styled.div({\n  backgroundColor: \"transparent\",\n  display: \"flex\",\n  gap: theme.space.xs,\n  alignItems: \"center\",\n  marginLeft: \"auto\",\n  \"& > *\": {\n    marginLeft: theme.space.xs,\n  },\n  [`& .${buttonClasses.root}`]: {\n    \"&:hover\": { backgroundColor: theme.header.hoverColor },\n  },\n});\n"],"names":["StyledDiv","process","env","NODE_ENV","target","label","backgroundColor","display","gap","theme","space","xs","alignItems","marginLeft","buttonClasses","root","header","hoverColor"],"mappings":";;;;;;;AAIO,MAAMA,4DAAYC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAW,EAAA;AAAA,EAClCC,iBAAiB;AAAA,EACjBC,SAAS;AAAA,EACTC,KAAKC,YAAAA,MAAMC,MAAMC;AAAAA,EACjBC,YAAY;AAAA,EACZC,YAAY;AAAA,EACZ,SAAS;AAAA,IACPA,YAAYJ,YAAAA,MAAMC,MAAMC;AAAAA,EAC1B;AAAA,EACA,CAAE,MAAKG,sBAAcC,MAAM,GAAG;AAAA,IAC5B,WAAW;AAAA,MAAET,iBAAiBG,YAAAA,MAAMO,OAAOC;AAAAA,IAAW;AAAA,EACxD;AACF,GAAChB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6mCAAA;;"}

package/dist/cjs/components/Header/Brand/Brand.cjs

@@ -1,24 +1,28 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const Brand_styles = require("./Brand.styles.cjs");
 const brandClasses = require("./brandClasses.cjs");
 const clsx = require("clsx");
-const Typography = require("../../Typography/Typography.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
-const HvBrand = ({
+const HvHeaderBrand = ({
   classes,
   logo,
   name,
   className,
   ...others
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs(Brand_styles.BrandRoot, { className: clsx__default.default(classes == null ? void 0 : classes.root, brandClasses.default.root, className), ...others, children: [
-    logo,
-    logo && name && /* @__PURE__ */ jsxRuntime.jsx(Brand_styles.BrandSeparator, { className: clsx__default.default(classes == null ? void 0 : classes.separator, brandClasses.default.separator) }),
-    name && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "label", children: name })
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(Brand_styles.BrandRoot, {
+    className: clsx__default.default(classes == null ? void 0 : classes.root, brandClasses.default.root, className),
+    ...others,
+    children: [logo, logo && name && /* @__PURE__ */ jsxRuntime.jsx(Brand_styles.BrandSeparator, {
+      className: clsx__default.default(classes == null ? void 0 : classes.separator, brandClasses.default.separator)
+    }), name && /* @__PURE__ */ jsxRuntime.jsx(Brand_styles.BrandName, {
+      variant: "label",
+      children: name
+    })]
+  });
 };
-exports.HvBrand = HvBrand;
+exports.HvHeaderBrand = HvHeaderBrand;
 //# sourceMappingURL=Brand.cjs.map

package/dist/cjs/components/Header/Brand/Brand.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Brand.cjs","sources":["../../../../../src/components/Header/Brand/Brand.tsx"],"sourcesContent":["import { HvTypography as HvTypography } from \"components\";\nimport { HvBaseProps } from \"../../../types\";\nimport { BrandRoot, BrandSeparator } from \"./Brand.styles\";\nimport headerBrandClasses, { HvHeaderBrandClasses } from \"./brandClasses\";\nimport clsx from \"clsx\";\n\nexport type HvBrandProps = HvBaseProps & {\n  logo?: React.ReactNode;\n  name?: string;\n  classes?: HvHeaderBrandClasses;\n};\n\n/**\n * Header component is used to render a header bar with logo and brand name, navigation and actions.\n */\nexport const HvBrand = ({\n  classes,\n  logo,\n  name,\n  className,\n  ...others\n}: HvBrandProps) => {\n  return (\n    <BrandRoot\n      className={clsx(classes?.root, headerBrandClasses.root, className)}\n      {...others}\n    >\n      {logo}\n      {logo && name && (\n        <BrandSeparator\n          className={clsx(classes?.separator, headerBrandClasses.separator)}\n        />\n      )}\n      {name && <HvTypography variant=\"label\">{name}</HvTypography>}\n    </BrandRoot>\n  );\n};\n"],"names":["HvBrand","classes","logo","name","className","others","jsxs","BrandRoot","clsx","root","headerBrandClasses","jsx","BrandSeparator","separator","HvTypography"],"mappings":";;;;;;;;;AAeO,MAAMA,UAAUA,CAAC;AAAA,EACtBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,KACGC;AACS,MAAM;AAEhB,SAAAC,2BAAA,KAACC,aACC,WAAA,EAAA,WAAWC,cAAKP,QAAAA,mCAASQ,MAAMC,aAAAA,QAAmBD,MAAML,SAAS,GAC7DC,GAAAA,QAEHH,UAAAA;AAAAA,IAAAA;AAAAA,IACAA,QAAQC,QACPQ,+BAACC,aAAAA,gBACC,EAAA,WAAWJ,sBAAKP,mCAASY,WAAWH,qBAAmBG,SAAS,EAEnE,CAAA;AAAA,IACAV,QAAQQ,2BAAA,IAACG,yBAAa,EAAA,SAAQ,SAASX,UAAK,MAAA;AAAA,EAC/C,EAAA,CAAA;AAEJ;;"}
+{"version":3,"file":"Brand.cjs","sources":["../../../../../src/components/Header/Brand/Brand.tsx"],"sourcesContent":["import { HvBaseProps } from \"../../../types\";\nimport { BrandRoot, BrandSeparator, BrandName } from \"./Brand.styles\";\nimport headerBrandClasses, { HvHeaderBrandClasses } from \"./brandClasses\";\nimport clsx from \"clsx\";\n\nexport type HvHeaderBrandProps = HvBaseProps & {\n  logo?: React.ReactNode;\n  name?: string;\n  classes?: HvHeaderBrandClasses;\n};\n\n/**\n * Header component is used to render a header bar with logo and brand name, navigation and actions.\n */\nexport const HvHeaderBrand = ({\n  classes,\n  logo,\n  name,\n  className,\n  ...others\n}: HvHeaderBrandProps) => {\n  return (\n    <BrandRoot\n      className={clsx(classes?.root, headerBrandClasses.root, className)}\n      {...others}\n    >\n      {logo}\n      {logo && name && (\n        <BrandSeparator\n          className={clsx(classes?.separator, headerBrandClasses.separator)}\n        />\n      )}\n      {name && <BrandName variant=\"label\">{name}</BrandName>}\n    </BrandRoot>\n  );\n};\n"],"names":["HvHeaderBrand","classes","logo","name","className","others","BrandRoot","clsx","root","headerBrandClasses","children","BrandSeparator","separator","_jsx","BrandName","variant"],"mappings":";;;;;;;;AAcO,MAAMA,gBAAgBA,CAAC;AAAA,EAC5BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACe,MAAM;AACxB,yCACGC,aAAAA,WAAS;AAAA,IACRF,WAAWG,cAAKN,QAAAA,mCAASO,MAAMC,aAAAA,QAAmBD,MAAMJ,SAAS;AAAA,IAAE,GAC/DC;AAAAA,IAAMK,UAAA,CAETR,MACAA,QAAQC,uCACNQ,aAAAA,gBAAc;AAAA,MACbP,WAAWG,cAAAA,QAAKN,mCAASW,WAAWH,aAAAA,QAAmBG,SAAS;AAAA,IAAA,CAAE,GAGrET,QAAQU,2BAAAA,IAACC,wBAAS;AAAA,MAACC,SAAQ;AAAA,MAAOL,UAAEP;AAAAA,IAAAA,CAAiB,CAAA;AAAA,EAAA,CAC5C;AAEhB;;"}

package/dist/cjs/components/Header/Brand/Brand.styles.cjs

@@ -1,16 +1,18 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Typography = require("../../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }
 const BrandRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1mg4lzk1"
+  target: "e1mg4lzk2"
 } : {
-  target: "e1mg4lzk1",
+  target: "e1mg4lzk2",
   label: "BrandRoot"
 })(process.env.NODE_ENV === "production" ? {
   name: "s5xdrg",
@@ -18,20 +20,31 @@ const BrandRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NO
 } : {
   name: "s5xdrg",
   styles: "display:flex;align-items:center",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBR3lCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuZXhwb3J0IGNvbnN0IEJyYW5kUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFNlcGFyYXRvciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHdpZHRoOiAxLFxuICBoZWlnaHQ6IHRoZW1lLnNwYWNlLnNtLFxuICBtYXJnaW46IHRoZW1lLnNwYWNlLnhzLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hY2NlMSxcbn0pO1xuIl19 */",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBSXlCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJjb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgQnJhbmRTZXBhcmF0b3IgPSBzdHlsZWQoXCJkaXZcIikoe1xuICB3aWR0aDogMSxcbiAgaGVpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgbWFyZ2luOiB0aGVtZS5zcGFjZS54cyxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZE5hbWUgPSBzdHlsZWQoKHByb3BzKSA9PiA8SHZUeXBvZ3JhcGh5IHsuLi5wcm9wc30gLz4pKHtcbiAgY29sb3I6IHRoZW1lLmhlYWRlci5icmFuZENvbG9yLFxufSk7XG4iXX0= */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 const BrandSeparator = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1mg4lzk0"
+  target: "e1mg4lzk1"
 } : {
-  target: "e1mg4lzk0",
+  target: "e1mg4lzk1",
   label: "BrandSeparator"
 })({
   width: 1,
   height: uikitStyles.theme.space.sm,
   margin: uikitStyles.theme.space.xs,
-  backgroundColor: uikitStyles.theme.colors.acce1
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUThCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuZXhwb3J0IGNvbnN0IEJyYW5kUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFNlcGFyYXRvciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHdpZHRoOiAxLFxuICBoZWlnaHQ6IHRoZW1lLnNwYWNlLnNtLFxuICBtYXJnaW46IHRoZW1lLnNwYWNlLnhzLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hY2NlMSxcbn0pO1xuIl19 */");
+  backgroundColor: uikitStyles.theme.colors.secondary
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUzhCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJjb21wb25lbnRzXCI7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgQnJhbmRTZXBhcmF0b3IgPSBzdHlsZWQoXCJkaXZcIikoe1xuICB3aWR0aDogMSxcbiAgaGVpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgbWFyZ2luOiB0aGVtZS5zcGFjZS54cyxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZE5hbWUgPSBzdHlsZWQoKHByb3BzKSA9PiA8SHZUeXBvZ3JhcGh5IHsuLi5wcm9wc30gLz4pKHtcbiAgY29sb3I6IHRoZW1lLmhlYWRlci5icmFuZENvbG9yLFxufSk7XG4iXX0= */");
+const BrandName = /* @__PURE__ */ _styled__default.default((props) => /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+  ...props
+}), process.env.NODE_ENV === "production" ? {
+  target: "e1mg4lzk0"
+} : {
+  target: "e1mg4lzk0",
+  label: "BrandName"
+})({
+  color: uikitStyles.theme.header.brandColor
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0J5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9CcmFuZC9CcmFuZC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiY29tcG9uZW50c1wiO1xuXG5leHBvcnQgY29uc3QgQnJhbmRSb290ID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG59KTtcblxuZXhwb3J0IGNvbnN0IEJyYW5kU2VwYXJhdG9yID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgd2lkdGg6IDEsXG4gIGhlaWdodDogdGhlbWUuc3BhY2Uuc20sXG4gIG1hcmdpbjogdGhlbWUuc3BhY2UueHMsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLnNlY29uZGFyeSxcbn0pO1xuXG5leHBvcnQgY29uc3QgQnJhbmROYW1lID0gc3R5bGVkKChwcm9wcykgPT4gPEh2VHlwb2dyYXBoeSB7Li4ucHJvcHN9IC8+KSh7XG4gIGNvbG9yOiB0aGVtZS5oZWFkZXIuYnJhbmRDb2xvcixcbn0pO1xuIl19 */");
+exports.BrandName = BrandName;
 exports.BrandRoot = BrandRoot;
 exports.BrandSeparator = BrandSeparator;
 //# sourceMappingURL=Brand.styles.cjs.map

package/dist/cjs/components/Header/Brand/Brand.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Brand.styles.cjs","sources":["../../../../../src/components/Header/Brand/Brand.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const BrandRoot = styled(\"div\")({\n  display: \"flex\",\n  alignItems: \"center\",\n});\n\nexport const BrandSeparator = styled(\"div\")({\n  width: 1,\n  height: theme.space.sm,\n  margin: theme.space.xs,\n  backgroundColor: theme.colors.acce1,\n});\n"],"names":["BrandRoot","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","BrandSeparator","width","height","theme","space","sm","margin","xs","backgroundColor","colors","acce1"],"mappings":";;;;;;;;;AAGO,MAAMA,YAAmBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAGpC;AAEK,MAAMC,iBAAwBX,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAC1CO,OAAO;AAAA,EACPC,QAAQC,YAAAA,MAAMC,MAAMC;AAAAA,EACpBC,QAAQH,YAAAA,MAAMC,MAAMG;AAAAA,EACpBC,iBAAiBL,YAAAA,MAAMM,OAAOC;AAChC,GAACpB,QAAAC,IAAAC,aAAC,eAAA,KAAA,y7BAAA;;;"}
+{"version":3,"file":"Brand.styles.cjs","sources":["../../../../../src/components/Header/Brand/Brand.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvTypography } from \"components\";\n\nexport const BrandRoot = styled(\"div\")({\n  display: \"flex\",\n  alignItems: \"center\",\n});\n\nexport const BrandSeparator = styled(\"div\")({\n  width: 1,\n  height: theme.space.sm,\n  margin: theme.space.xs,\n  backgroundColor: theme.colors.secondary,\n});\n\nexport const BrandName = styled((props) => <HvTypography {...props} />)({\n  color: theme.header.brandColor,\n});\n"],"names":["BrandRoot","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","BrandSeparator","width","height","theme","space","sm","margin","xs","backgroundColor","colors","secondary","BrandName","props","_jsx","HvTypography","color","header","brandColor"],"mappings":";;;;;;;;;;;AAIO,MAAMA,YAAmBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAACJ,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAG,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAGpC;AAEK,MAAMC,iBAAwBX,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EAC1CO,OAAO;AAAA,EACPC,QAAQC,YAAAA,MAAMC,MAAMC;AAAAA,EACpBC,QAAQH,YAAAA,MAAMC,MAAMG;AAAAA,EACpBC,iBAAiBL,YAAAA,MAAMM,OAAOC;AAChC,GAACpB,QAAAC,IAAAC,aAAC,eAAA,KAAA,ypCAAA;AAEK,MAAMmB,YAAYtB,iCAAAA,QAAQuB,CAAUC,UAAAA,2BAAAA,IAACC,WAAAA,cAAY;AAAA,EAAA,GAAKF;AAAK,CAAA,GAAItB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACtEqB,OAAOZ,YAAAA,MAAMa,OAAOC;AACtB,GAAC3B,QAAAC,IAAAC,aAAC,eAAA,KAAA,ypCAAA;;;;"}

package/dist/cjs/components/Header/Header.cjs

@@ -1,9 +1,9 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const Header_styles = require("./Header.styles.cjs");
 const headerClasses = require("./headerClasses.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
 const HvHeader = (props) => {
@@ -14,7 +14,15 @@ const HvHeader = (props) => {
     position = "fixed",
     ...others
   } = props;
-  return /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledAppBar, { className: clsx__default.default(className, classes == null ? void 0 : classes.root, headerClasses.default.root, classes == null ? void 0 : classes.backgroundColor, headerClasses.default.backgroundColor), $position: position, ...others, children: /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledHeaderRoot, { className: clsx__default.default(classes == null ? void 0 : classes.header, headerClasses.default.header), children }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledAppBar, {
+    className: clsx__default.default(className, classes == null ? void 0 : classes.root, headerClasses.default.root, classes == null ? void 0 : classes.backgroundColor, headerClasses.default.backgroundColor),
+    $position: position,
+    ...others,
+    children: /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledHeaderRoot, {
+      className: clsx__default.default(classes == null ? void 0 : classes.header, headerClasses.default.header),
+      children
+    })
+  });
 };
 exports.HvHeader = HvHeader;
 //# sourceMappingURL=Header.cjs.map

package/dist/cjs/components/Header/Header.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Header.cjs","sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledHeaderRoot, StyledAppBar } from \"./Header.styles\";\nimport headerClasses, { HvHeaderClasses } from \"./headerClasses\";\n\nexport type HvHeaderPosition =\n  | \"fixed\"\n  | \"absolute\"\n  | \"sticky\"\n  | \"static\"\n  | \"relative\";\n\nexport type HvHeaderProps = HvBaseProps & {\n  /** The position of the header bar */\n  position?: HvHeaderPosition;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvHeaderClasses;\n};\n\n/**\n * Header component is used to render a header bar with logo and brand name, navigation and actions.\n */\nexport const HvHeader = (props: HvHeaderProps) => {\n  const { className, classes, children, position = \"fixed\", ...others } = props;\n\n  return (\n    <StyledAppBar\n      className={clsx(\n        className,\n        classes?.root,\n        headerClasses.root,\n        classes?.backgroundColor,\n        headerClasses.backgroundColor\n      )}\n      $position={position}\n      {...others}\n    >\n      <StyledHeaderRoot className={clsx(classes?.header, headerClasses.header)}>\n        {children}\n      </StyledHeaderRoot>\n    </StyledAppBar>\n  );\n};\n"],"names":["HvHeader","props","className","classes","children","position","others","jsx","StyledAppBar","clsx","root","headerClasses","backgroundColor","StyledHeaderRoot","header"],"mappings":";;;;;;;;AAsBaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IAAEC;AAAAA,IAAWC;AAAAA,IAASC;AAAAA,IAAUC,WAAW;AAAA,OAAYC;AAAAA,EAAWL,IAAAA;AAExE,SACGM,2BAAAA,IAAAC,cAAAA,cAAA,EACC,WAAWC,cAAAA,QACTP,WACAC,mCAASO,MACTC,cAAAA,QAAcD,MACdP,mCAASS,iBACTD,cAAAA,QAAcC,eAAe,GAE/B,WAAWP,UACX,GAAIC,QAEJ,UAACC,2BAAA,IAAAM,cAAA,kBAAA,EAAiB,WAAWJ,cAAAA,QAAKN,mCAASW,QAAQH,cAAAA,QAAcG,MAAM,GACpEV,SAAAA,CACH,EACF,CAAA;AAEJ;;"}
+{"version":3,"file":"Header.cjs","sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { HvBaseProps } from \"../../types\";\nimport { StyledHeaderRoot, StyledAppBar } from \"./Header.styles\";\nimport headerClasses, { HvHeaderClasses } from \"./headerClasses\";\n\nexport type HvHeaderPosition =\n  | \"fixed\"\n  | \"absolute\"\n  | \"sticky\"\n  | \"static\"\n  | \"relative\";\n\nexport type HvHeaderProps = HvBaseProps & {\n  /** The position of the header bar */\n  position?: HvHeaderPosition;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvHeaderClasses;\n};\n\n/**\n * Header component is used to render a header bar with logo and brand name, navigation and actions.\n */\nexport const HvHeader = (props: HvHeaderProps) => {\n  const { className, classes, children, position = \"fixed\", ...others } = props;\n\n  return (\n    <StyledAppBar\n      className={clsx(\n        className,\n        classes?.root,\n        headerClasses.root,\n        classes?.backgroundColor,\n        headerClasses.backgroundColor\n      )}\n      $position={position}\n      {...others}\n    >\n      <StyledHeaderRoot className={clsx(classes?.header, headerClasses.header)}>\n        {children}\n      </StyledHeaderRoot>\n    </StyledAppBar>\n  );\n};\n"],"names":["HvHeader","props","className","classes","children","position","others","StyledAppBar","clsx","root","headerClasses","backgroundColor","$position","StyledHeaderRoot","header"],"mappings":";;;;;;;;AAsBaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IAAEC;AAAAA,IAAWC;AAAAA,IAASC;AAAAA,IAAUC,WAAW;AAAA,IAAS,GAAGC;AAAAA,EAAWL,IAAAA;AAExE,wCACGM,cAAAA,cAAY;AAAA,IACXL,WAAWM,cACTN,QAAAA,WACAC,mCAASM,MACTC,sBAAcD,MACdN,mCAASQ,iBACTD,cAAAA,QAAcC,eAAe;AAAA,IAE/BC,WAAWP;AAAAA,IAAS,GAChBC;AAAAA,IAAMF,yCAETS,gCAAgB;AAAA,MAACX,WAAWM,cAAAA,QAAKL,mCAASW,QAAQJ,cAAAA,QAAcI,MAAM;AAAA,MAAEV;AAAAA,IAAAA,CAC9D;AAAA,EAAA,CAEE;AAEnB;;"}

package/dist/cjs/components/Header/Header.styles.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const transientOptions = require("../../utils/transientOptions.cjs");
@@ -19,7 +19,7 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
-const StyledAppBar = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? _extends({}, {
+const StyledAppBar = /* @__PURE__ */ _styled__default.default("header", process.env.NODE_ENV === "production" ? _extends({}, {
   target: "euwt7yw1"
 }, transientOptions.transientOptions) : _extends({}, {
   target: "euwt7yw1",
@@ -56,7 +56,7 @@ const StyledAppBar = /* @__PURE__ */ _styled__default.default("div", process.env
   ...$position === "sticky" && {
     position: "sticky"
   }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk0QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9IZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRBcHBCYXIgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHBvc2l0aW9uIH06IHsgJHBvc2l0aW9uPzogc3RyaW5nIH0pID0+ICh7XG4gIGhlaWdodDogdGhlbWUuaGVhZGVyLmhlaWdodCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5oZWFkZXIuYmFja2dyb3VuZENvbG9yLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICBmbGV4U2hyaW5rOiAwLFxuICB6SW5kZXg6IHRoZW1lLnpJbmRpY2VzLmJhbm5lcixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBib3JkZXJUb3A6IGAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BUaGlja25lc3N9IHNvbGlkICR7dGhlbWUuaGVhZGVyLmJvcmRlclRvcENvbG9yfWAsXG5cbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJmaXhlZFwiICYmIHtcbiAgICBwb3NpdGlvbjogXCJmaXhlZFwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiBcImF1dG9cIixcbiAgICByaWdodDogMCxcbiAgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwicmVsYXRpdmVcIiAmJiB7IHBvc2l0aW9uOiBcInJlbGF0aXZlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwiYWJzb2x1dGVcIiAmJiB7IHBvc2l0aW9uOiBcImFic29sdXRlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RhdGljXCIgJiYgeyBwb3NpdGlvbjogXCJzdGF0aWNcIiB9KSxcbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJzdGlja3lcIiAmJiB7IHBvc2l0aW9uOiBcInN0aWNreVwiIH0pLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSGVhZGVyUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIHBhZGRpbmc6IGAwICR7dGhlbWUuc3BhY2Uuc219YCxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBcIiYgPiAqOm5vdChuYXYpXCI6IHtcbiAgICB6SW5kZXg6IDIsXG4gIH0sXG59KTtcbiJdfQ== */");
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk0QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9IZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJ1dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRBcHBCYXIgPSBzdHlsZWQoXG4gIFwiaGVhZGVyXCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHBvc2l0aW9uIH06IHsgJHBvc2l0aW9uPzogc3RyaW5nIH0pID0+ICh7XG4gIGhlaWdodDogdGhlbWUuaGVhZGVyLmhlaWdodCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5oZWFkZXIuYmFja2dyb3VuZENvbG9yLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICBmbGV4U2hyaW5rOiAwLFxuICB6SW5kZXg6IHRoZW1lLnpJbmRpY2VzLmJhbm5lcixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBib3JkZXJUb3A6IGAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BUaGlja25lc3N9IHNvbGlkICR7dGhlbWUuaGVhZGVyLmJvcmRlclRvcENvbG9yfWAsXG5cbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJmaXhlZFwiICYmIHtcbiAgICBwb3NpdGlvbjogXCJmaXhlZFwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiBcImF1dG9cIixcbiAgICByaWdodDogMCxcbiAgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwicmVsYXRpdmVcIiAmJiB7IHBvc2l0aW9uOiBcInJlbGF0aXZlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwiYWJzb2x1dGVcIiAmJiB7IHBvc2l0aW9uOiBcImFic29sdXRlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RhdGljXCIgJiYgeyBwb3NpdGlvbjogXCJzdGF0aWNcIiB9KSxcbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJzdGlja3lcIiAmJiB7IHBvc2l0aW9uOiBcInN0aWNreVwiIH0pLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSGVhZGVyUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIHBhZGRpbmc6IGAwICR7dGhlbWUuc3BhY2Uuc219YCxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBcIiYgPiAqOm5vdChuYXYpXCI6IHtcbiAgICB6SW5kZXg6IDIsXG4gIH0sXG59KTtcbiJdfQ== */");
 const StyledHeaderRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
   target: "euwt7yw0"
 } : {
@@ -72,7 +72,7 @@ const StyledHeaderRoot = /* @__PURE__ */ _styled__default.default("div", process
   "& > *:not(nav)": {
     zIndex: 2
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9IZWFkZXIvSGVhZGVyLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwidXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQXBwQmFyID0gc3R5bGVkKFxuICBcImRpdlwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRwb3NpdGlvbiB9OiB7ICRwb3NpdGlvbj86IHN0cmluZyB9KSA9PiAoe1xuICBoZWlnaHQ6IHRoZW1lLmhlYWRlci5oZWlnaHQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLmJhY2tncm91bmRDb2xvcixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgZmxleFNocmluazogMCxcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy5iYW5uZXIsXG4gIGNvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgYm9yZGVyVG9wOiBgJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSBzb2xpZCAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BDb2xvcn1gLFxuXG4gIC4uLigkcG9zaXRpb24gPT09IFwiZml4ZWRcIiAmJiB7XG4gICAgcG9zaXRpb246IFwiZml4ZWRcIixcbiAgICB0b3A6IDAsXG4gICAgbGVmdDogXCJhdXRvXCIsXG4gICAgcmlnaHQ6IDAsXG4gIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInJlbGF0aXZlXCIgJiYgeyBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcImFic29sdXRlXCIgJiYgeyBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInN0YXRpY1wiICYmIHsgcG9zaXRpb246IFwic3RhdGljXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RpY2t5XCIgJiYgeyBwb3NpdGlvbjogXCJzdGlja3lcIiB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlclJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBwYWRkaW5nOiBgMCAke3RoZW1lLnNwYWNlLnNtfWAsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgXCImID4gKjpub3QobmF2KVwiOiB7XG4gICAgekluZGV4OiAyLFxuICB9LFxufSk7XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9IZWFkZXIvSGVhZGVyLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwidXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQXBwQmFyID0gc3R5bGVkKFxuICBcImhlYWRlclwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRwb3NpdGlvbiB9OiB7ICRwb3NpdGlvbj86IHN0cmluZyB9KSA9PiAoe1xuICBoZWlnaHQ6IHRoZW1lLmhlYWRlci5oZWlnaHQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLmJhY2tncm91bmRDb2xvcixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgZmxleFNocmluazogMCxcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy5iYW5uZXIsXG4gIGNvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgYm9yZGVyVG9wOiBgJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSBzb2xpZCAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BDb2xvcn1gLFxuXG4gIC4uLigkcG9zaXRpb24gPT09IFwiZml4ZWRcIiAmJiB7XG4gICAgcG9zaXRpb246IFwiZml4ZWRcIixcbiAgICB0b3A6IDAsXG4gICAgbGVmdDogXCJhdXRvXCIsXG4gICAgcmlnaHQ6IDAsXG4gIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInJlbGF0aXZlXCIgJiYgeyBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcImFic29sdXRlXCIgJiYgeyBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInN0YXRpY1wiICYmIHsgcG9zaXRpb246IFwic3RhdGljXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RpY2t5XCIgJiYgeyBwb3NpdGlvbjogXCJzdGlja3lcIiB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlclJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBwYWRkaW5nOiBgMCAke3RoZW1lLnNwYWNlLnNtfWAsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgXCImID4gKjpub3QobmF2KVwiOiB7XG4gICAgekluZGV4OiAyLFxuICB9LFxufSk7XG4iXX0= */");
 exports.StyledAppBar = StyledAppBar;
 exports.StyledHeaderRoot = StyledHeaderRoot;
 //# sourceMappingURL=Header.styles.cjs.map

package/dist/cjs/components/Header/Header.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Header.styles.cjs","sources":["../../../../src/components/Header/Header.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"utils/transientOptions\";\n\nexport const StyledAppBar = styled(\n  \"div\",\n  transientOptions\n)(({ $position }: { $position?: string }) => ({\n  height: theme.header.height,\n  backgroundColor: theme.header.backgroundColor,\n  display: \"flex\",\n  flexDirection: \"column\",\n  width: \"100%\",\n  boxSizing: \"border-box\",\n  flexShrink: 0,\n  zIndex: theme.zIndices.banner,\n  color: theme.colors.atmo1,\n  boxShadow: theme.header.shadow,\n  borderTop: `${theme.header.borderTopThickness} solid ${theme.header.borderTopColor}`,\n\n  ...($position === \"fixed\" && {\n    position: \"fixed\",\n    top: 0,\n    left: \"auto\",\n    right: 0,\n  }),\n  ...($position === \"relative\" && { position: \"relative\" }),\n  ...($position === \"absolute\" && { position: \"absolute\" }),\n  ...($position === \"static\" && { position: \"static\" }),\n  ...($position === \"sticky\" && { position: \"sticky\" }),\n}));\n\nexport const StyledHeaderRoot = styled(\"div\")({\n  display: \"flex\",\n  alignItems: \"center\",\n  width: \"100%\",\n  height: \"100%\",\n  padding: `0 ${theme.space.sm}`,\n  boxShadow: theme.header.shadow,\n  \"& > *:not(nav)\": {\n    zIndex: 2,\n  },\n});\n"],"names":["StyledAppBar","process","env","NODE_ENV","_extends","target","transientOptions","label","$position","height","theme","header","backgroundColor","display","flexDirection","width","boxSizing","flexShrink","zIndex","zIndices","banner","color","colors","atmo1","boxShadow","shadow","borderTop","borderTopThickness","borderTopColor","position","top","left","right","StyledHeaderRoot","_styled","alignItems","padding","space","sm"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAIaA,MAAAA,wDACX,OAAKC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACLC,iBAAgB,gBAAA,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,iBAAAA,gBAAgB,CACjB,EAAC,CAAC;AAAA,EAAEE;AAAkC,OAAO;AAAA,EAC5CC,QAAQC,YAAAA,MAAMC,OAAOF;AAAAA,EACrBG,iBAAiBF,YAAAA,MAAMC,OAAOC;AAAAA,EAC9BC,SAAS;AAAA,EACTC,eAAe;AAAA,EACfC,OAAO;AAAA,EACPC,WAAW;AAAA,EACXC,YAAY;AAAA,EACZC,QAAQR,YAAAA,MAAMS,SAASC;AAAAA,EACvBC,OAAOX,YAAAA,MAAMY,OAAOC;AAAAA,EACpBC,WAAWd,YAAAA,MAAMC,OAAOc;AAAAA,EACxBC,WAAY,GAAEhB,YAAAA,MAAMC,OAAOgB,4BAA4BjB,kBAAMC,OAAOiB;AAAAA,EAEpE,GAAIpB,cAAc,WAAW;AAAA,IAC3BqB,UAAU;AAAA,IACVC,KAAK;AAAA,IACLC,MAAM;AAAA,IACNC,OAAO;AAAA,EACT;AAAA,EACA,GAAIxB,cAAc,cAAc;AAAA,IAAEqB,UAAU;AAAA,EAAW;AAAA,EACvD,GAAIrB,cAAc,cAAc;AAAA,IAAEqB,UAAU;AAAA,EAAW;AAAA,EACvD,GAAIrB,cAAc,YAAY;AAAA,IAAEqB,UAAU;AAAA,EAAS;AAAA,EACnD,GAAIrB,cAAc,YAAY;AAAA,IAAEqB,UAAU;AAAA,EAAS;AACrD,IAAE5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,yqEAAA;AAEI,MAAM8B,mBAA0BC,iCAAA,QAAA,OAAKjC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAE,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAE,OAAA;AAAA,CAAA,EAAE;AAAA,EAC5CM,SAAS;AAAA,EACTsB,YAAY;AAAA,EACZpB,OAAO;AAAA,EACPN,QAAQ;AAAA,EACR2B,SAAU,KAAI1B,YAAAA,MAAM2B,MAAMC;AAAAA,EAC1Bd,WAAWd,YAAAA,MAAMC,OAAOc;AAAAA,EACxB,kBAAkB;AAAA,IAChBP,QAAQ;AAAA,EACV;AACF,GAACjB,QAAAC,IAAAC,aAAC,eAAA,KAAA,yqEAAA;;;"}
+{"version":3,"file":"Header.styles.cjs","sources":["../../../../src/components/Header/Header.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"utils/transientOptions\";\n\nexport const StyledAppBar = styled(\n  \"header\",\n  transientOptions\n)(({ $position }: { $position?: string }) => ({\n  height: theme.header.height,\n  backgroundColor: theme.header.backgroundColor,\n  display: \"flex\",\n  flexDirection: \"column\",\n  width: \"100%\",\n  boxSizing: \"border-box\",\n  flexShrink: 0,\n  zIndex: theme.zIndices.banner,\n  color: theme.colors.atmo1,\n  boxShadow: theme.header.shadow,\n  borderTop: `${theme.header.borderTopThickness} solid ${theme.header.borderTopColor}`,\n\n  ...($position === \"fixed\" && {\n    position: \"fixed\",\n    top: 0,\n    left: \"auto\",\n    right: 0,\n  }),\n  ...($position === \"relative\" && { position: \"relative\" }),\n  ...($position === \"absolute\" && { position: \"absolute\" }),\n  ...($position === \"static\" && { position: \"static\" }),\n  ...($position === \"sticky\" && { position: \"sticky\" }),\n}));\n\nexport const StyledHeaderRoot = styled(\"div\")({\n  display: \"flex\",\n  alignItems: \"center\",\n  width: \"100%\",\n  height: \"100%\",\n  padding: `0 ${theme.space.sm}`,\n  boxShadow: theme.header.shadow,\n  \"& > *:not(nav)\": {\n    zIndex: 2,\n  },\n});\n"],"names":["StyledAppBar","process","env","NODE_ENV","_extends","target","transientOptions","label","$position","height","theme","header","backgroundColor","display","flexDirection","width","boxSizing","flexShrink","zIndex","zIndices","banner","color","colors","atmo1","boxShadow","shadow","borderTop","borderTopThickness","borderTopColor","position","top","left","right","StyledHeaderRoot","_styled","alignItems","padding","space","sm"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAIaA,MAAAA,wDACX,UAAQC,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACRC,iBAAgB,gBAAA,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,iBAAAA,gBAAgB,CACjB,EAAC,CAAC;AAAA,EAAEE;AAAkC,OAAO;AAAA,EAC5CC,QAAQC,YAAAA,MAAMC,OAAOF;AAAAA,EACrBG,iBAAiBF,YAAAA,MAAMC,OAAOC;AAAAA,EAC9BC,SAAS;AAAA,EACTC,eAAe;AAAA,EACfC,OAAO;AAAA,EACPC,WAAW;AAAA,EACXC,YAAY;AAAA,EACZC,QAAQR,YAAAA,MAAMS,SAASC;AAAAA,EACvBC,OAAOX,YAAAA,MAAMY,OAAOC;AAAAA,EACpBC,WAAWd,YAAAA,MAAMC,OAAOc;AAAAA,EACxBC,WAAY,GAAEhB,YAAAA,MAAMC,OAAOgB,4BAA4BjB,kBAAMC,OAAOiB;AAAAA,EAEpE,GAAIpB,cAAc,WAAW;AAAA,IAC3BqB,UAAU;AAAA,IACVC,KAAK;AAAA,IACLC,MAAM;AAAA,IACNC,OAAO;AAAA,EACT;AAAA,EACA,GAAIxB,cAAc,cAAc;AAAA,IAAEqB,UAAU;AAAA,EAAW;AAAA,EACvD,GAAIrB,cAAc,cAAc;AAAA,IAAEqB,UAAU;AAAA,EAAW;AAAA,EACvD,GAAIrB,cAAc,YAAY;AAAA,IAAEqB,UAAU;AAAA,EAAS;AAAA,EACnD,GAAIrB,cAAc,YAAY;AAAA,IAAEqB,UAAU;AAAA,EAAS;AACrD,IAAE5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,6qEAAA;AAEI,MAAM8B,mBAA0BC,iCAAA,QAAA,OAAKjC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAE,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAE,OAAA;AAAA,CAAA,EAAE;AAAA,EAC5CM,SAAS;AAAA,EACTsB,YAAY;AAAA,EACZpB,OAAO;AAAA,EACPN,QAAQ;AAAA,EACR2B,SAAU,KAAI1B,YAAAA,MAAM2B,MAAMC;AAAAA,EAC1Bd,WAAWd,YAAAA,MAAMC,OAAOc;AAAAA,EACxB,kBAAkB;AAAA,IAChBP,QAAQ;AAAA,EACV;AACF,GAACjB,QAAAC,IAAAC,aAAC,eAAA,KAAA,6qEAAA;;;"}

package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.cjs

@@ -1,10 +1,10 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("@emotion/react/jsx-runtime");
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const clsx = require("clsx");
 const React = require("react");
 const SelectionContext = require("../utils/SelectionContext.cjs");
 const MenuBar_styles = require("./MenuBar.styles.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const MenuItem = require("../MenuItem/MenuItem.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const clsx__default = /* @__PURE__ */ _interopDefault(clsx);
@@ -18,8 +18,22 @@ const HvMenuBar = ({
   const selectionPath = React.useContext(SelectionContext.SelectionContext);
   const isMenu = type === "menu";
   const isActive = isMenu && data.filter((item) => item.id === (selectionPath == null ? void 0 : selectionPath[1])).length > 0;
-  return /* @__PURE__ */ jsxRuntime.jsx(MenuBar_styles.MenuBarRoot, { className: clsx__default.default(className, isMenu && "hidden", isActive && "active"), type, hidden: isMenu, active: isActive, children: /* @__PURE__ */ jsxRuntime.jsx(MenuBar_styles.MenuBarUl, { id, onFocus: () => {
-  }, children: data.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem.HvMenuItem, { item, type, onClick }, item.id)) }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(MenuBar_styles.MenuBarRoot, {
+    className: clsx__default.default(className, isMenu && "hidden", isActive && "active"),
+    type,
+    hidden: isMenu,
+    active: isActive,
+    children: /* @__PURE__ */ jsxRuntime.jsx(MenuBar_styles.MenuBarUl, {
+      id,
+      onFocus: () => {
+      },
+      children: data.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem.HvMenuItem, {
+        item,
+        type,
+        onClick
+      }, item.id))
+    })
+  });
 };
 exports.HvMenuBar = HvMenuBar;
 //# sourceMappingURL=MenuBar.cjs.map

package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { HvHeaderNavigationItemProp } from \"components\";\nimport { HvBaseProps } from \"../../../../types\";\nimport { HvMenuItem } from \"../MenuItem\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { MenuBarRoot, MenuBarUl } from \"./MenuBar.styles\";\n\nexport type HvMenuBarProps = HvBaseProps<\"div\", { onClick }> & {\n  data: HvHeaderNavigationItemProp[];\n  type: string;\n  onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n};\n\nexport const HvMenuBar = ({\n  id,\n  data = [],\n  onClick,\n  type = \"menubar\",\n  className,\n}: HvMenuBarProps) => {\n  const selectionPath = useContext(SelectionContext);\n\n  const isMenu = type === \"menu\";\n\n  const isActive =\n    isMenu && data.filter((item) => item.id === selectionPath?.[1]).length > 0;\n\n  return (\n    <MenuBarRoot\n      className={clsx(className, isMenu && \"hidden\", isActive && \"active\")}\n      type={type}\n      hidden={isMenu}\n      active={isActive}\n    >\n      <MenuBarUl id={id} onFocus={() => {}}>\n        {data.map((item: HvHeaderNavigationItemProp) => (\n          <HvMenuItem key={item.id} item={item} type={type} onClick={onClick} />\n        ))}\n      </MenuBarUl>\n    </MenuBarRoot>\n  );\n};\n"],"names":["HvMenuBar","id","data","onClick","type","className","selectionPath","useContext","SelectionContext","isMenu","isActive","filter","item","length","MenuBarRoot","clsx","MenuBarUl","map","jsx","HvMenuItem"],"mappings":";;;;;;;;;;AAcO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC,OAAO,CAAE;AAAA,EACTC;AAAAA,EACAC,OAAO;AAAA,EACPC;AACc,MAAM;AACdC,QAAAA,gBAAgBC,iBAAWC,iBAAAA,gBAAgB;AAEjD,QAAMC,SAASL,SAAS;AAElBM,QAAAA,WACJD,UAAUP,KAAKS,OAAQC,CAAAA,SAASA,KAAKX,QAAOK,+CAAgB,GAAE,EAAEO,SAAS;AAE3E,wCACGC,4BACC,EAAA,WAAWC,cAAAA,QAAKV,WAAWI,UAAU,UAAUC,YAAY,QAAQ,GACnE,MACA,QAAQD,QACR,QAAQC,UAER,yCAACM,0BAAU,EAAA,IAAQ,SAAS,MAAM;AAAA,EAAA,GAC/Bd,UAAAA,KAAKe,IAAI,CAACL,SACRM,2BAAA,IAAAC,qBAAA,EAAyB,MAAY,MAAY,QAAjCP,GAAAA,KAAKX,GACvB,GACH,EACF,CAAA;AAEJ;;"}
+{"version":3,"file":"MenuBar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { useContext } from \"react\";\nimport { HvHeaderNavigationItemProp } from \"components\";\nimport { HvBaseProps } from \"../../../../types\";\nimport { HvMenuItem } from \"../MenuItem\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { MenuBarRoot, MenuBarUl } from \"./MenuBar.styles\";\n\nexport type HvMenuBarProps = HvBaseProps<\"div\", { onClick }> & {\n  data: HvHeaderNavigationItemProp[];\n  type: string;\n  onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n};\n\nexport const HvMenuBar = ({\n  id,\n  data = [],\n  onClick,\n  type = \"menubar\",\n  className,\n}: HvMenuBarProps) => {\n  const selectionPath = useContext(SelectionContext);\n\n  const isMenu = type === \"menu\";\n\n  const isActive =\n    isMenu && data.filter((item) => item.id === selectionPath?.[1]).length > 0;\n\n  return (\n    <MenuBarRoot\n      className={clsx(className, isMenu && \"hidden\", isActive && \"active\")}\n      type={type}\n      hidden={isMenu}\n      active={isActive}\n    >\n      <MenuBarUl id={id} onFocus={() => {}}>\n        {data.map((item: HvHeaderNavigationItemProp) => (\n          <HvMenuItem key={item.id} item={item} type={type} onClick={onClick} />\n        ))}\n      </MenuBarUl>\n    </MenuBarRoot>\n  );\n};\n"],"names":["HvMenuBar","id","data","onClick","type","className","selectionPath","useContext","SelectionContext","isMenu","isActive","filter","item","length","MenuBarRoot","clsx","hidden","active","children","MenuBarUl","onFocus","map","HvMenuItem"],"mappings":";;;;;;;;;;AAcO,MAAMA,YAAYA,CAAC;AAAA,EACxBC;AAAAA,EACAC,OAAO,CAAE;AAAA,EACTC;AAAAA,EACAC,OAAO;AAAA,EACPC;AACc,MAAM;AACdC,QAAAA,gBAAgBC,iBAAWC,iBAAAA,gBAAgB;AAEjD,QAAMC,SAASL,SAAS;AAElBM,QAAAA,WACJD,UAAUP,KAAKS,OAAQC,CAAAA,SAASA,KAAKX,QAAOK,+CAAgB,GAAE,EAAEO,SAAS;AAE3E,wCACGC,eAAAA,aAAW;AAAA,IACVT,WAAWU,cAAKV,QAAAA,WAAWI,UAAU,UAAUC,YAAY,QAAQ;AAAA,IACnEN;AAAAA,IACAY,QAAQP;AAAAA,IACRQ,QAAQP;AAAAA,IAASQ,yCAEhBC,0BAAS;AAAA,MAAClB;AAAAA,MAAQmB,SAASA,MAAM;AAAA,MAAC;AAAA,MAAEF,UAClChB,KAAKmB,IAAI,CAACT,wCACRU,SAAAA,YAAU;AAAA,QAAeV;AAAAA,QAAYR;AAAAA,QAAYD;AAAAA,MAAAA,GAAjCS,KAAKX,EAAE,CACzB;AAAA,IAAA,CAAC;AAAA,EAAA,CAEQ;AAElB;;"}

package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.styles.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
@@ -24,7 +24,8 @@ const MenuBarRoot = /* @__PURE__ */ _styled__default.default("div", process.env.
   label: "MenuBarRoot"
 })(({
   type,
-  hidden
+  hidden,
+  active
 }) => ({
   left: 0,
   width: "100%",
@@ -47,8 +48,11 @@ const MenuBarRoot = /* @__PURE__ */ _styled__default.default("div", process.env.
   },
   ...hidden && {
     ...hide
+  },
+  ...active && {
+    ...show
   }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL05hdmlnYXRpb24vTWVudUJhci9NZW51QmFyLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0IyQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9OYXZpZ2F0aW9uL01lbnVCYXIvTWVudUJhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTWVudUJhclJvb3RQcm9wcyB7XG4gIHR5cGU6IHN0cmluZztcbiAgaGlkZGVuPzogYm9vbGVhbjtcbiAgYWN0aXZlPzogYm9vbGVhbjtcbn1cblxuY29uc3Qgc2hvdyA9IHtcbiAgdG9wOiBgY2FsYygke3RoZW1lLmhlYWRlci5oZWlnaHR9IC0gJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSlgLFxuICB0cmFuc2l0aW9uOiBbXCJ0b3BcIl0sXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgdHJhbnNpdGlvbkR1cmF0aW9uOiBcIjUwMG1zXCIsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxufTtcblxuZXhwb3J0IGNvbnN0IGhpZGUgPSB7XG4gIHRvcDogMCxcbiAgdHJhbnNpdGlvbjogW1widG9wXCJdLFxuICBib3hTaGFkb3c6IFwibm9uZVwiLFxuICB0cmFuc2l0aW9uRHVyYXRpb246IFwiMzAwbXNcIixcbn07XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyUm9vdCA9IHN0eWxlZChcImRpdlwiKShcbiAgKHsgdHlwZSwgaGlkZGVuIH06IE1lbnVCYXJSb290UHJvcHMpID0+ICh7XG4gICAgbGVmdDogMCxcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIC4uLih0eXBlID09PSBcIm1lbnViYXJcIiAmJiB7XG4gICAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5oZWFkZXIuYmFja2dyb3VuZENvbG9yLFxuICAgIH0pLFxuICAgIC4uLih0eXBlID09PSBcIm1lbnVcIiAmJiB7XG4gICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgcGFkZGluZ1RvcDogdGhlbWUuaGVhZGVyLnNlbGVjdGVkSXRlbUJvcmRlckJvdHRvbVRoaWNrbmVzcyxcbiAgICAgIHpJbmRleDogLTIsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5zZWNvbmRMZXZlbEJhY2tncm91bmRDb2xvcixcbiAgICAgIFwiJiBsaSA+IGRpdlwiOiB7XG4gICAgICAgIG1hcmdpblRvcDogMCxcbiAgICAgIH0sXG4gICAgfSksXG4gICAgLi4uKGhpZGRlbiAmJiB7IC4uLmhpZGUgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgTWVudUJhclVsID0gc3R5bGVkKFwidWxcIikoe1xuICBtYXJnaW46IDAsXG4gIHBhZGRpbmc6IDAsXG4gIGRpc3BsYXk6IFwiaW5oZXJpdFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBcIiY6aG92ZXIgLmFjdGl2ZVwiOiB7XG4gICAgLi4uaGlkZSxcbiAgfSxcbiAgXCImIGxpOmhvdmVyID4gLmhpZGRlblwiOiB7XG4gICAgLi4uc2hvdyxcbiAgfSxcblxuICBcIiY6Zm9jdXMtd2l0aGluIC5hY3RpdmVcIjoge1xuICAgIC4uLmhpZGUsXG4gICAgekluZGV4OiAtMixcbiAgfSxcbiAgXCImIGxpOmZvY3VzLXdpdGhpbiA+IC5oaWRkZW5cIjoge1xuICAgIC4uLnNob3csXG4gICAgekluZGV4OiAtMSxcbiAgfSxcbn0pO1xuIl19 */");
+}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL05hdmlnYXRpb24vTWVudUJhci9NZW51QmFyLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0IyQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9OYXZpZ2F0aW9uL01lbnVCYXIvTWVudUJhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTWVudUJhclJvb3RQcm9wcyB7XG4gIHR5cGU6IHN0cmluZztcbiAgaGlkZGVuPzogYm9vbGVhbjtcbiAgYWN0aXZlPzogYm9vbGVhbjtcbn1cblxuY29uc3Qgc2hvdyA9IHtcbiAgdG9wOiBgY2FsYygke3RoZW1lLmhlYWRlci5oZWlnaHR9IC0gJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSlgLFxuICB0cmFuc2l0aW9uOiBbXCJ0b3BcIl0sXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgdHJhbnNpdGlvbkR1cmF0aW9uOiBcIjUwMG1zXCIsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxufTtcblxuZXhwb3J0IGNvbnN0IGhpZGUgPSB7XG4gIHRvcDogMCxcbiAgdHJhbnNpdGlvbjogW1widG9wXCJdLFxuICBib3hTaGFkb3c6IFwibm9uZVwiLFxuICB0cmFuc2l0aW9uRHVyYXRpb246IFwiMzAwbXNcIixcbn07XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyUm9vdCA9IHN0eWxlZChcImRpdlwiKShcbiAgKHsgdHlwZSwgaGlkZGVuLCBhY3RpdmUgfTogTWVudUJhclJvb3RQcm9wcykgPT4gKHtcbiAgICBsZWZ0OiAwLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBoZWlnaHQ6IFwiMTAwJVwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGp1c3RpZnlDb250ZW50OiBcImNlbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgLi4uKHR5cGUgPT09IFwibWVudWJhclwiICYmIHtcbiAgICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5iYWNrZ3JvdW5kQ29sb3IsXG4gICAgfSksXG4gICAgLi4uKHR5cGUgPT09IFwibWVudVwiICYmIHtcbiAgICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgICBwYWRkaW5nVG9wOiB0aGVtZS5oZWFkZXIuc2VsZWN0ZWRJdGVtQm9yZGVyQm90dG9tVGhpY2tuZXNzLFxuICAgICAgekluZGV4OiAtMixcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxuICAgICAgXCImIGxpID4gZGl2XCI6IHtcbiAgICAgICAgbWFyZ2luVG9wOiAwLFxuICAgICAgfSxcbiAgICB9KSxcbiAgICAuLi4oaGlkZGVuICYmIHsgLi4uaGlkZSB9KSxcbiAgICAuLi4oYWN0aXZlICYmIHsgLi4uc2hvdyB9KSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyVWwgPSBzdHlsZWQoXCJ1bFwiKSh7XG4gIG1hcmdpbjogMCxcbiAgcGFkZGluZzogMCxcbiAgZGlzcGxheTogXCJpbmhlcml0XCIsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIFwiJjpob3ZlciAuYWN0aXZlXCI6IHtcbiAgICAuLi5oaWRlLFxuICB9LFxuICBcIiYgbGk6aG92ZXIgPiAuaGlkZGVuXCI6IHtcbiAgICAuLi5zaG93LFxuICB9LFxuXG4gIFwiJjpmb2N1cy13aXRoaW4gLmFjdGl2ZVwiOiB7XG4gICAgLi4uaGlkZSxcbiAgICB6SW5kZXg6IC0yLFxuICB9LFxuICBcIiYgbGk6Zm9jdXMtd2l0aGluID4gLmhpZGRlblwiOiB7XG4gICAgLi4uc2hvdyxcbiAgICB6SW5kZXg6IC0xLFxuICB9LFxufSk7XG4iXX0= */");
 const MenuBarUl = /* @__PURE__ */ _styled__default.default("ul", process.env.NODE_ENV === "production" ? {
   target: "etcfm7y0"
 } : {
@@ -74,7 +78,7 @@ const MenuBarUl = /* @__PURE__ */ _styled__default.default("ul", process.env.NOD
     ...show,
     zIndex: -1
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL05hdmlnYXRpb24vTWVudUJhci9NZW51QmFyLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUR5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9OYXZpZ2F0aW9uL01lbnVCYXIvTWVudUJhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTWVudUJhclJvb3RQcm9wcyB7XG4gIHR5cGU6IHN0cmluZztcbiAgaGlkZGVuPzogYm9vbGVhbjtcbiAgYWN0aXZlPzogYm9vbGVhbjtcbn1cblxuY29uc3Qgc2hvdyA9IHtcbiAgdG9wOiBgY2FsYygke3RoZW1lLmhlYWRlci5oZWlnaHR9IC0gJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSlgLFxuICB0cmFuc2l0aW9uOiBbXCJ0b3BcIl0sXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgdHJhbnNpdGlvbkR1cmF0aW9uOiBcIjUwMG1zXCIsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxufTtcblxuZXhwb3J0IGNvbnN0IGhpZGUgPSB7XG4gIHRvcDogMCxcbiAgdHJhbnNpdGlvbjogW1widG9wXCJdLFxuICBib3hTaGFkb3c6IFwibm9uZVwiLFxuICB0cmFuc2l0aW9uRHVyYXRpb246IFwiMzAwbXNcIixcbn07XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyUm9vdCA9IHN0eWxlZChcImRpdlwiKShcbiAgKHsgdHlwZSwgaGlkZGVuIH06IE1lbnVCYXJSb290UHJvcHMpID0+ICh7XG4gICAgbGVmdDogMCxcbiAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIC4uLih0eXBlID09PSBcIm1lbnViYXJcIiAmJiB7XG4gICAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5oZWFkZXIuYmFja2dyb3VuZENvbG9yLFxuICAgIH0pLFxuICAgIC4uLih0eXBlID09PSBcIm1lbnVcIiAmJiB7XG4gICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgcGFkZGluZ1RvcDogdGhlbWUuaGVhZGVyLnNlbGVjdGVkSXRlbUJvcmRlckJvdHRvbVRoaWNrbmVzcyxcbiAgICAgIHpJbmRleDogLTIsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5zZWNvbmRMZXZlbEJhY2tncm91bmRDb2xvcixcbiAgICAgIFwiJiBsaSA+IGRpdlwiOiB7XG4gICAgICAgIG1hcmdpblRvcDogMCxcbiAgICAgIH0sXG4gICAgfSksXG4gICAgLi4uKGhpZGRlbiAmJiB7IC4uLmhpZGUgfSksXG4gIH0pXG4pO1xuXG5leHBvcnQgY29uc3QgTWVudUJhclVsID0gc3R5bGVkKFwidWxcIikoe1xuICBtYXJnaW46IDAsXG4gIHBhZGRpbmc6IDAsXG4gIGRpc3BsYXk6IFwiaW5oZXJpdFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBcIiY6aG92ZXIgLmFjdGl2ZVwiOiB7XG4gICAgLi4uaGlkZSxcbiAgfSxcbiAgXCImIGxpOmhvdmVyID4gLmhpZGRlblwiOiB7XG4gICAgLi4uc2hvdyxcbiAgfSxcblxuICBcIiY6Zm9jdXMtd2l0aGluIC5hY3RpdmVcIjoge1xuICAgIC4uLmhpZGUsXG4gICAgekluZGV4OiAtMixcbiAgfSxcbiAgXCImIGxpOmZvY3VzLXdpdGhpbiA+IC5oaWRkZW5cIjoge1xuICAgIC4uLnNob3csXG4gICAgekluZGV4OiAtMSxcbiAgfSxcbn0pO1xuIl19 */");
+}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL05hdmlnYXRpb24vTWVudUJhci9NZW51QmFyLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0R5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9OYXZpZ2F0aW9uL01lbnVCYXIvTWVudUJhci5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmV4cG9ydCBpbnRlcmZhY2UgTWVudUJhclJvb3RQcm9wcyB7XG4gIHR5cGU6IHN0cmluZztcbiAgaGlkZGVuPzogYm9vbGVhbjtcbiAgYWN0aXZlPzogYm9vbGVhbjtcbn1cblxuY29uc3Qgc2hvdyA9IHtcbiAgdG9wOiBgY2FsYygke3RoZW1lLmhlYWRlci5oZWlnaHR9IC0gJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSlgLFxuICB0cmFuc2l0aW9uOiBbXCJ0b3BcIl0sXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgdHJhbnNpdGlvbkR1cmF0aW9uOiBcIjUwMG1zXCIsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxufTtcblxuZXhwb3J0IGNvbnN0IGhpZGUgPSB7XG4gIHRvcDogMCxcbiAgdHJhbnNpdGlvbjogW1widG9wXCJdLFxuICBib3hTaGFkb3c6IFwibm9uZVwiLFxuICB0cmFuc2l0aW9uRHVyYXRpb246IFwiMzAwbXNcIixcbn07XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyUm9vdCA9IHN0eWxlZChcImRpdlwiKShcbiAgKHsgdHlwZSwgaGlkZGVuLCBhY3RpdmUgfTogTWVudUJhclJvb3RQcm9wcykgPT4gKHtcbiAgICBsZWZ0OiAwLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBoZWlnaHQ6IFwiMTAwJVwiLFxuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGp1c3RpZnlDb250ZW50OiBcImNlbnRlclwiLFxuICAgIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gICAgLi4uKHR5cGUgPT09IFwibWVudWJhclwiICYmIHtcbiAgICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5iYWNrZ3JvdW5kQ29sb3IsXG4gICAgfSksXG4gICAgLi4uKHR5cGUgPT09IFwibWVudVwiICYmIHtcbiAgICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgICBwYWRkaW5nVG9wOiB0aGVtZS5oZWFkZXIuc2VsZWN0ZWRJdGVtQm9yZGVyQm90dG9tVGhpY2tuZXNzLFxuICAgICAgekluZGV4OiAtMixcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLnNlY29uZExldmVsQmFja2dyb3VuZENvbG9yLFxuICAgICAgXCImIGxpID4gZGl2XCI6IHtcbiAgICAgICAgbWFyZ2luVG9wOiAwLFxuICAgICAgfSxcbiAgICB9KSxcbiAgICAuLi4oaGlkZGVuICYmIHsgLi4uaGlkZSB9KSxcbiAgICAuLi4oYWN0aXZlICYmIHsgLi4uc2hvdyB9KSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBNZW51QmFyVWwgPSBzdHlsZWQoXCJ1bFwiKSh7XG4gIG1hcmdpbjogMCxcbiAgcGFkZGluZzogMCxcbiAgZGlzcGxheTogXCJpbmhlcml0XCIsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIFwiJjpob3ZlciAuYWN0aXZlXCI6IHtcbiAgICAuLi5oaWRlLFxuICB9LFxuICBcIiYgbGk6aG92ZXIgPiAuaGlkZGVuXCI6IHtcbiAgICAuLi5zaG93LFxuICB9LFxuXG4gIFwiJjpmb2N1cy13aXRoaW4gLmFjdGl2ZVwiOiB7XG4gICAgLi4uaGlkZSxcbiAgICB6SW5kZXg6IC0yLFxuICB9LFxuICBcIiYgbGk6Zm9jdXMtd2l0aGluID4gLmhpZGRlblwiOiB7XG4gICAgLi4uc2hvdyxcbiAgICB6SW5kZXg6IC0xLFxuICB9LFxufSk7XG4iXX0= */");
 exports.MenuBarRoot = MenuBarRoot;
 exports.MenuBarUl = MenuBarUl;
 exports.hide = hide;

package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MenuBar.styles.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport interface MenuBarRootProps {\n  type: string;\n  hidden?: boolean;\n  active?: boolean;\n}\n\nconst show = {\n  top: `calc(${theme.header.height} - ${theme.header.borderTopThickness})`,\n  transition: [\"top\"],\n  boxShadow: theme.header.shadow,\n  transitionDuration: \"500ms\",\n  backgroundColor: theme.header.secondLevelBackgroundColor,\n};\n\nexport const hide = {\n  top: 0,\n  transition: [\"top\"],\n  boxShadow: \"none\",\n  transitionDuration: \"300ms\",\n};\n\nexport const MenuBarRoot = styled(\"div\")(\n  ({ type, hidden }: MenuBarRootProps) => ({\n    left: 0,\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    ...(type === \"menubar\" && {\n      position: \"relative\",\n      backgroundColor: theme.header.backgroundColor,\n    }),\n    ...(type === \"menu\" && {\n      position: \"absolute\",\n      paddingTop: theme.header.selectedItemBorderBottomThickness,\n      zIndex: -2,\n      backgroundColor: theme.header.secondLevelBackgroundColor,\n      \"& li > div\": {\n        marginTop: 0,\n      },\n    }),\n    ...(hidden && { ...hide }),\n  })\n);\n\nexport const MenuBarUl = styled(\"ul\")({\n  margin: 0,\n  padding: 0,\n  display: \"inherit\",\n  alignItems: \"center\",\n  height: \"100%\",\n  \"&:hover .active\": {\n    ...hide,\n  },\n  \"& li:hover > .hidden\": {\n    ...show,\n  },\n\n  \"&:focus-within .active\": {\n    ...hide,\n    zIndex: -2,\n  },\n  \"& li:focus-within > .hidden\": {\n    ...show,\n    zIndex: -1,\n  },\n});\n"],"names":["show","top","theme","header","height","borderTopThickness","transition","boxShadow","shadow","transitionDuration","backgroundColor","secondLevelBackgroundColor","hide","MenuBarRoot","_styled","process","env","NODE_ENV","target","label","type","hidden","left","width","display","justifyContent","alignItems","position","paddingTop","selectedItemBorderBottomThickness","zIndex","marginTop","MenuBarUl","margin","padding"],"mappings":";;;;;;AASA,MAAMA,OAAO;AAAA,EACXC,KAAM,QAAOC,YAAAA,MAAMC,OAAOC,YAAYF,kBAAMC,OAAOE;AAAAA,EACnDC,YAAY,CAAC,KAAK;AAAA,EAClBC,WAAWL,YAAAA,MAAMC,OAAOK;AAAAA,EACxBC,oBAAoB;AAAA,EACpBC,iBAAiBR,YAAAA,MAAMC,OAAOQ;AAChC;AAEO,MAAMC,OAAO;AAAA,EAClBX,KAAK;AAAA,EACLK,YAAY,CAAC,KAAK;AAAA,EAClBC,WAAW;AAAA,EACXE,oBAAoB;AACtB;AAEO,MAAMI,cAAqBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACrC,CAAC;AAAA,EAAEC;AAAAA,EAAMC;AAAyB,OAAO;AAAA,EACvCC,MAAM;AAAA,EACNC,OAAO;AAAA,EACPnB,QAAQ;AAAA,EACRoB,SAAS;AAAA,EACTC,gBAAgB;AAAA,EAChBC,YAAY;AAAA,EACZ,GAAIN,SAAS,aAAa;AAAA,IACxBO,UAAU;AAAA,IACVjB,iBAAiBR,YAAAA,MAAMC,OAAOO;AAAAA,EAChC;AAAA,EACA,GAAIU,SAAS,UAAU;AAAA,IACrBO,UAAU;AAAA,IACVC,YAAY1B,YAAAA,MAAMC,OAAO0B;AAAAA,IACzBC,QAAQ;AAAA,IACRpB,iBAAiBR,YAAAA,MAAMC,OAAOQ;AAAAA,IAC9B,cAAc;AAAA,MACZoB,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,GAAIV,UAAU;AAAA,IAAE,GAAGT;AAAAA,EAAK;AAC1B,IAAEG,QAAAC,IAAAC,aACH,eAAA,KAAA,6qFAAA;AAEM,MAAMe,YAAmBlB,iCAAA,QAAA,MAAIC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACpCc,QAAQ;AAAA,EACRC,SAAS;AAAA,EACTV,SAAS;AAAA,EACTE,YAAY;AAAA,EACZtB,QAAQ;AAAA,EACR,mBAAmB;AAAA,IACjB,GAAGQ;AAAAA,EACL;AAAA,EACA,wBAAwB;AAAA,IACtB,GAAGZ;AAAAA,EACL;AAAA,EAEA,0BAA0B;AAAA,IACxB,GAAGY;AAAAA,IACHkB,QAAQ;AAAA,EACV;AAAA,EACA,+BAA+B;AAAA,IAC7B,GAAG9B;AAAAA,IACH8B,QAAQ;AAAA,EACV;AACF,GAACf,QAAAC,IAAAC,aAAC,eAAA,KAAA,6qFAAA;;;;"}
+{"version":3,"file":"MenuBar.styles.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport interface MenuBarRootProps {\n  type: string;\n  hidden?: boolean;\n  active?: boolean;\n}\n\nconst show = {\n  top: `calc(${theme.header.height} - ${theme.header.borderTopThickness})`,\n  transition: [\"top\"],\n  boxShadow: theme.header.shadow,\n  transitionDuration: \"500ms\",\n  backgroundColor: theme.header.secondLevelBackgroundColor,\n};\n\nexport const hide = {\n  top: 0,\n  transition: [\"top\"],\n  boxShadow: \"none\",\n  transitionDuration: \"300ms\",\n};\n\nexport const MenuBarRoot = styled(\"div\")(\n  ({ type, hidden, active }: MenuBarRootProps) => ({\n    left: 0,\n    width: \"100%\",\n    height: \"100%\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    ...(type === \"menubar\" && {\n      position: \"relative\",\n      backgroundColor: theme.header.backgroundColor,\n    }),\n    ...(type === \"menu\" && {\n      position: \"absolute\",\n      paddingTop: theme.header.selectedItemBorderBottomThickness,\n      zIndex: -2,\n      backgroundColor: theme.header.secondLevelBackgroundColor,\n      \"& li > div\": {\n        marginTop: 0,\n      },\n    }),\n    ...(hidden && { ...hide }),\n    ...(active && { ...show }),\n  })\n);\n\nexport const MenuBarUl = styled(\"ul\")({\n  margin: 0,\n  padding: 0,\n  display: \"inherit\",\n  alignItems: \"center\",\n  height: \"100%\",\n  \"&:hover .active\": {\n    ...hide,\n  },\n  \"& li:hover > .hidden\": {\n    ...show,\n  },\n\n  \"&:focus-within .active\": {\n    ...hide,\n    zIndex: -2,\n  },\n  \"& li:focus-within > .hidden\": {\n    ...show,\n    zIndex: -1,\n  },\n});\n"],"names":["show","top","theme","header","height","borderTopThickness","transition","boxShadow","shadow","transitionDuration","backgroundColor","secondLevelBackgroundColor","hide","MenuBarRoot","_styled","process","env","NODE_ENV","target","label","type","hidden","active","left","width","display","justifyContent","alignItems","position","paddingTop","selectedItemBorderBottomThickness","zIndex","marginTop","MenuBarUl","margin","padding"],"mappings":";;;;;;AASA,MAAMA,OAAO;AAAA,EACXC,KAAM,QAAOC,YAAAA,MAAMC,OAAOC,YAAYF,kBAAMC,OAAOE;AAAAA,EACnDC,YAAY,CAAC,KAAK;AAAA,EAClBC,WAAWL,YAAAA,MAAMC,OAAOK;AAAAA,EACxBC,oBAAoB;AAAA,EACpBC,iBAAiBR,YAAAA,MAAMC,OAAOQ;AAChC;AAEO,MAAMC,OAAO;AAAA,EAClBX,KAAK;AAAA,EACLK,YAAY,CAAC,KAAK;AAAA,EAClBC,WAAW;AAAA,EACXE,oBAAoB;AACtB;AAEO,MAAMI,cAAqBC,iCAAA,QAAA,OAAKC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EACrC,CAAC;AAAA,EAAEC;AAAAA,EAAMC;AAAAA,EAAQC;AAAyB,OAAO;AAAA,EAC/CC,MAAM;AAAA,EACNC,OAAO;AAAA,EACPpB,QAAQ;AAAA,EACRqB,SAAS;AAAA,EACTC,gBAAgB;AAAA,EAChBC,YAAY;AAAA,EACZ,GAAIP,SAAS,aAAa;AAAA,IACxBQ,UAAU;AAAA,IACVlB,iBAAiBR,YAAAA,MAAMC,OAAOO;AAAAA,EAChC;AAAA,EACA,GAAIU,SAAS,UAAU;AAAA,IACrBQ,UAAU;AAAA,IACVC,YAAY3B,YAAAA,MAAMC,OAAO2B;AAAAA,IACzBC,QAAQ;AAAA,IACRrB,iBAAiBR,YAAAA,MAAMC,OAAOQ;AAAAA,IAC9B,cAAc;AAAA,MACZqB,WAAW;AAAA,IACb;AAAA,EACF;AAAA,EACA,GAAIX,UAAU;AAAA,IAAE,GAAGT;AAAAA,EAAK;AAAA,EACxB,GAAIU,UAAU;AAAA,IAAE,GAAGtB;AAAAA,EAAK;AAC1B,IAAEe,QAAAC,IAAAC,aACH,eAAA,KAAA,quFAAA;AAEM,MAAMgB,YAAmBnB,iCAAA,QAAA,MAAIC,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CAAA,EAAE;AAAA,EACpCe,QAAQ;AAAA,EACRC,SAAS;AAAA,EACTV,SAAS;AAAA,EACTE,YAAY;AAAA,EACZvB,QAAQ;AAAA,EACR,mBAAmB;AAAA,IACjB,GAAGQ;AAAAA,EACL;AAAA,EACA,wBAAwB;AAAA,IACtB,GAAGZ;AAAAA,EACL;AAAA,EAEA,0BAA0B;AAAA,IACxB,GAAGY;AAAAA,IACHmB,QAAQ;AAAA,EACV;AAAA,EACA,+BAA+B;AAAA,IAC7B,GAAG/B;AAAAA,IACH+B,QAAQ;AAAA,EACV;AACF,GAAChB,QAAAC,IAAAC,aAAC,eAAA,KAAA,quFAAA;;;;"}