@hitachivantara/uikit-react-core 5.23.0 → 5.24.1

package/dist/cjs/components/Forms/WarningText/WarningText.styles.cjs

@@ -1,64 +1,31 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
-const transientOptions = require("../../../utils/transientOptions.cjs");
-const Typography = require("../../Typography/Typography.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
+const classes = require("../../../utils/classes.cjs");
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvWarningText", {
+  root: {
+    display: "none"
+  },
+  defaultIcon: {
+    minWidth: "32px"
+  },
+  warningText: {
+    color: uikitStyles.theme.colors.negative,
+    paddingRight: uikitStyles.theme.space.xs,
+    "&:first-of-type": {
+      paddingLeft: uikitStyles.theme.space.xs
     }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-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 StyledRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "e1jkc0dp2"
-}, transientOptions.transientOptions) : _extends({}, {
-  target: "e1jkc0dp2",
-  label: "StyledRoot"
-}, transientOptions.transientOptions))(({
-  $show,
-  $topBorder
-}) => ({
-  display: "none",
-  ...$show && {
-    display: "flex"
   },
-  ...$topBorder && {
-    borderTop: `solid 1px ${uikitStyles.theme.colors.negative}`
-  }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvV2FybmluZ1RleHQvV2FybmluZ1RleHQuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRMEIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9Gb3Jtcy9XYXJuaW5nVGV4dC9XYXJuaW5nVGV4dC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IEZhaWwgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXJlYWN0LWljb25zXCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUm9vdCA9IHN0eWxlZChcbiAgXCJkaXZcIixcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkc2hvdywgJHRvcEJvcmRlciB9OiB7ICRzaG93OiBib29sZWFuOyAkdG9wQm9yZGVyOiBib29sZWFuIH0pID0+ICh7XG4gIGRpc3BsYXk6IFwibm9uZVwiLFxuICAuLi4oJHNob3cgJiYge1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICB9KSxcbiAgLi4uKCR0b3BCb3JkZXIgJiYge1xuICAgIGJvcmRlclRvcDogYHNvbGlkIDFweCAke3RoZW1lLmNvbG9ycy5uZWdhdGl2ZX1gLFxuICB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFR5cG9ncmFwaHkgPSBzdHlsZWQoXG4gIEh2VHlwb2dyYXBoeSxcbiAgdHJhbnNpZW50T3B0aW9uc1xuKSgoeyAkdG9wR3V0dGVyLCAkaGlkZVRleHQgfTogeyAkdG9wR3V0dGVyOiBib29sZWFuOyAkaGlkZVRleHQ6IGJvb2xlYW4gfSkgPT4gKHtcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbiAgcGFkZGluZ1JpZ2h0OiB0aGVtZS5zcGFjZS54cyxcbiAgXCImOmZpcnN0LW9mLXR5cGVcIjoge1xuICAgIHBhZGRpbmdMZWZ0OiB0aGVtZS5zcGFjZS54cyxcbiAgfSxcbiAgLi4uKCR0b3BHdXR0ZXIgJiYge1xuICAgIHBhZGRpbmdUb3A6IDYsXG4gIH0pLFxuICAuLi4oJGhpZGVUZXh0ICYmIHtcbiAgICAvLyBkaXNwbGF5IG5vbmUgb3IgdmlzaWJpbGl0eSBoaWRkZW4gcHJldmVudHNcbiAgICAvLyBicm93c2VyIHRvIHRyaWdnZXIgdGhlIGFyaWEtYWxlcnRcbiAgICB3aWR0aDogMCxcbiAgICBoZWlnaHQ6IDAsXG4gICAgcGFkZGluZzogMCxcbiAgICBtYXJnaW46IDAsXG4gICAgb3ZlcmZsb3c6IFwiaGlkZGVuXCIsXG4gIH0pLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSWNvbiA9IHN0eWxlZChGYWlsKSh7XG4gIG1pbldpZHRoOiBcIjMycHhcIixcbn0pO1xuIl19 */");
-const StyledTypography = /* @__PURE__ */ _styled__default.default(Typography.HvTypography, process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "e1jkc0dp1"
-}, transientOptions.transientOptions) : _extends({}, {
-  target: "e1jkc0dp1",
-  label: "StyledTypography"
-}, transientOptions.transientOptions))(({
-  $topGutter,
-  $hideText
-}) => ({
-  color: uikitStyles.theme.colors.negative,
-  paddingRight: uikitStyles.theme.space.xs,
-  "&:first-of-type": {
-    paddingLeft: uikitStyles.theme.space.xs
+  show: {
+    display: "flex"
   },
-  ...$topGutter && {
+  topGutter: {
     paddingTop: 6
   },
-  ...$hideText && {
+  hideText: {
     // display none or visibility hidden prevents
     // browser to trigger the aria-alert
     width: 0,
@@ -66,23 +33,11 @@ const StyledTypography = /* @__PURE__ */ _styled__default.default(Typography.HvT
     padding: 0,
     margin: 0,
     overflow: "hidden"
+  },
+  topBorder: {
+    borderTop: `solid 1px ${uikitStyles.theme.colors.negative}`
   }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvV2FybmluZ1RleHQvV2FybmluZ1RleHQuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFxQmdDIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvV2FybmluZ1RleHQvV2FybmluZ1RleHQuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBGYWlsIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1yZWFjdC1pY29uc1wiO1xuXG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyB0cmFuc2llbnRPcHRpb25zIH0gZnJvbSBcIkBjb3JlL3V0aWxzL3RyYW5zaWVudE9wdGlvbnNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHNob3csICR0b3BCb3JkZXIgfTogeyAkc2hvdzogYm9vbGVhbjsgJHRvcEJvcmRlcjogYm9vbGVhbiB9KSA9PiAoe1xuICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgLi4uKCRzaG93ICYmIHtcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgfSksXG4gIC4uLigkdG9wQm9yZGVyICYmIHtcbiAgICBib3JkZXJUb3A6IGBzb2xpZCAxcHggJHt0aGVtZS5jb2xvcnMubmVnYXRpdmV9YCxcbiAgfSksXG59KSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKFxuICBIdlR5cG9ncmFwaHksXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHRvcEd1dHRlciwgJGhpZGVUZXh0IH06IHsgJHRvcEd1dHRlcjogYm9vbGVhbjsgJGhpZGVUZXh0OiBib29sZWFuIH0pID0+ICh7XG4gIGNvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gIHBhZGRpbmdSaWdodDogdGhlbWUuc3BhY2UueHMsXG4gIFwiJjpmaXJzdC1vZi10eXBlXCI6IHtcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2UueHMsXG4gIH0sXG4gIC4uLigkdG9wR3V0dGVyICYmIHtcbiAgICBwYWRkaW5nVG9wOiA2LFxuICB9KSxcbiAgLi4uKCRoaWRlVGV4dCAmJiB7XG4gICAgLy8gZGlzcGxheSBub25lIG9yIHZpc2liaWxpdHkgaGlkZGVuIHByZXZlbnRzXG4gICAgLy8gYnJvd3NlciB0byB0cmlnZ2VyIHRoZSBhcmlhLWFsZXJ0XG4gICAgd2lkdGg6IDAsXG4gICAgaGVpZ2h0OiAwLFxuICAgIHBhZGRpbmc6IDAsXG4gICAgbWFyZ2luOiAwLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEljb24gPSBzdHlsZWQoRmFpbCkoe1xuICBtaW5XaWR0aDogXCIzMnB4XCIsXG59KTtcbiJdfQ== */");
-const StyledIcon = /* @__PURE__ */ _styled__default.default(uikitReactIcons.Fail, process.env.NODE_ENV === "production" ? {
-  target: "e1jkc0dp0"
-} : {
-  target: "e1jkc0dp0",
-  label: "StyledIcon"
-})(process.env.NODE_ENV === "production" ? {
-  name: "9q39xd",
-  styles: "min-width:32px"
-} : {
-  name: "9q39xd",
-  styles: "min-width:32px",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvV2FybmluZ1RleHQvV2FybmluZ1RleHQuc3R5bGVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE0QzBCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvRm9ybXMvV2FybmluZ1RleHQvV2FybmluZ1RleHQuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyBGYWlsIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1yZWFjdC1pY29uc1wiO1xuXG5pbXBvcnQgeyBIdlR5cG9ncmFwaHkgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5pbXBvcnQgeyB0cmFuc2llbnRPcHRpb25zIH0gZnJvbSBcIkBjb3JlL3V0aWxzL3RyYW5zaWVudE9wdGlvbnNcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHNob3csICR0b3BCb3JkZXIgfTogeyAkc2hvdzogYm9vbGVhbjsgJHRvcEJvcmRlcjogYm9vbGVhbiB9KSA9PiAoe1xuICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgLi4uKCRzaG93ICYmIHtcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgfSksXG4gIC4uLigkdG9wQm9yZGVyICYmIHtcbiAgICBib3JkZXJUb3A6IGBzb2xpZCAxcHggJHt0aGVtZS5jb2xvcnMubmVnYXRpdmV9YCxcbiAgfSksXG59KSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRUeXBvZ3JhcGh5ID0gc3R5bGVkKFxuICBIdlR5cG9ncmFwaHksXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHRvcEd1dHRlciwgJGhpZGVUZXh0IH06IHsgJHRvcEd1dHRlcjogYm9vbGVhbjsgJGhpZGVUZXh0OiBib29sZWFuIH0pID0+ICh7XG4gIGNvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gIHBhZGRpbmdSaWdodDogdGhlbWUuc3BhY2UueHMsXG4gIFwiJjpmaXJzdC1vZi10eXBlXCI6IHtcbiAgICBwYWRkaW5nTGVmdDogdGhlbWUuc3BhY2UueHMsXG4gIH0sXG4gIC4uLigkdG9wR3V0dGVyICYmIHtcbiAgICBwYWRkaW5nVG9wOiA2LFxuICB9KSxcbiAgLi4uKCRoaWRlVGV4dCAmJiB7XG4gICAgLy8gZGlzcGxheSBub25lIG9yIHZpc2liaWxpdHkgaGlkZGVuIHByZXZlbnRzXG4gICAgLy8gYnJvd3NlciB0byB0cmlnZ2VyIHRoZSBhcmlhLWFsZXJ0XG4gICAgd2lkdGg6IDAsXG4gICAgaGVpZ2h0OiAwLFxuICAgIHBhZGRpbmc6IDAsXG4gICAgbWFyZ2luOiAwLFxuICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEljb24gPSBzdHlsZWQoRmFpbCkoe1xuICBtaW5XaWR0aDogXCIzMnB4XCIsXG59KTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
-exports.StyledIcon = StyledIcon;
-exports.StyledRoot = StyledRoot;
-exports.StyledTypography = StyledTypography;
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=WarningText.styles.cjs.map

package/dist/cjs/components/Forms/WarningText/WarningText.styles.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"WarningText.styles.cjs","sources":["../../../../../src/components/Forms/WarningText/WarningText.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Fail } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\n\nexport const StyledRoot = styled(\n  \"div\",\n  transientOptions\n)(({ $show, $topBorder }: { $show: boolean; $topBorder: boolean }) => ({\n  display: \"none\",\n  ...($show && {\n    display: \"flex\",\n  }),\n  ...($topBorder && {\n    borderTop: `solid 1px ${theme.colors.negative}`,\n  }),\n}));\n\nexport const StyledTypography = styled(\n  HvTypography,\n  transientOptions\n)(({ $topGutter, $hideText }: { $topGutter: boolean; $hideText: boolean }) => ({\n  color: theme.colors.negative,\n  paddingRight: theme.space.xs,\n  \"&:first-of-type\": {\n    paddingLeft: theme.space.xs,\n  },\n  ...($topGutter && {\n    paddingTop: 6,\n  }),\n  ...($hideText && {\n    // display none or visibility hidden prevents\n    // browser to trigger the aria-alert\n    width: 0,\n    height: 0,\n    padding: 0,\n    margin: 0,\n    overflow: \"hidden\",\n  }),\n}));\n\nexport const StyledIcon = styled(Fail)({\n  minWidth: \"32px\",\n});\n"],"names":["StyledRoot","process","env","NODE_ENV","_extends","target","transientOptions","label","$show","$topBorder","display","borderTop","theme","colors","negative","StyledTypography","HvTypography","$topGutter","$hideText","color","paddingRight","space","xs","paddingLeft","paddingTop","width","height","padding","margin","overflow","StyledIcon","Fail","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAQaA,MAAAA,sDACX,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,CAClB,EAAE,CAAC;AAAA,EAAEE;AAAAA,EAAOC;AAAoD,OAAO;AAAA,EACrEC,SAAS;AAAA,EACT,GAAIF,SAAS;AAAA,IACXE,SAAS;AAAA,EACX;AAAA,EACA,GAAID,cAAc;AAAA,IAChBE,WAAY,aAAYC,YAAAA,MAAMC,OAAOC;AAAAA,EACvC;AACF,IAAEb,QAAAC,IAAAC,aAAC,eAAA,KAAA,imEAAA;AAEUY,MAAAA,4DACXC,WAAAA,cAAYf,QAAAC,IAAAC,4BAAAC,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,GACZC,iBAAgB,gBAAA,IAAAF,SAAA,IAAA;AAAA,EAAAC,QAAA;AAAA,EAAAE,OAAA;AAAA,GAAhBD,iBAAAA,gBAAgB,CAClB,EAAE,CAAC;AAAA,EAAEW;AAAAA,EAAYC;AAAuD,OAAO;AAAA,EAC7EC,OAAOP,YAAAA,MAAMC,OAAOC;AAAAA,EACpBM,cAAcR,YAAAA,MAAMS,MAAMC;AAAAA,EAC1B,mBAAmB;AAAA,IACjBC,aAAaX,YAAAA,MAAMS,MAAMC;AAAAA,EAC3B;AAAA,EACA,GAAIL,cAAc;AAAA,IAChBO,YAAY;AAAA,EACd;AAAA,EACA,GAAIN,aAAa;AAAA;AAAA;AAAA,IAGfO,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,UAAU;AAAA,EACZ;AACF,IAAE5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,qmEAAA;AAEI,MAAM2B,aAAoBC,iCAAAA,QAAAA,gBAAAA,MAAI9B,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAE,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAE,OAAA;AAAA,CAAA,EAACN,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAA6B,MAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAD,MAAA;AAAA,EAAAC,QAAA;AAAA,EAAAC,KAAA;AAAA,EAAAC,UAAAC;AAAA,CAErC;;;;"}
+{"version":3,"file":"WarningText.styles.cjs","sources":["../../../../../src/components/Forms/WarningText/WarningText.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvWarningText\", {\n  root: { display: \"none\" },\n  defaultIcon: { minWidth: \"32px\" },\n  warningText: {\n    color: theme.colors.negative,\n    paddingRight: theme.space.xs,\n    \"&:first-of-type\": {\n      paddingLeft: theme.space.xs,\n    },\n  },\n  show: { display: \"flex\" },\n  topGutter: { paddingTop: 6 },\n  hideText: {\n    // display none or visibility hidden prevents\n    // browser to trigger the aria-alert\n    width: 0,\n    height: 0,\n    padding: 0,\n    margin: 0,\n    overflow: \"hidden\",\n  },\n  topBorder: { borderTop: `solid 1px ${theme.colors.negative}` },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","defaultIcon","minWidth","warningText","color","theme","colors","negative","paddingRight","space","xs","paddingLeft","show","topGutter","paddingTop","hideText","width","height","padding","margin","overflow","topBorder","borderTop"],"mappings":";;;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,iBAAiB;AAAA,EAC1EC,MAAM;AAAA,IAAEC,SAAS;AAAA,EAAO;AAAA,EACxBC,aAAa;AAAA,IAAEC,UAAU;AAAA,EAAO;AAAA,EAChCC,aAAa;AAAA,IACXC,OAAOC,YAAAA,MAAMC,OAAOC;AAAAA,IACpBC,cAAcH,YAAAA,MAAMI,MAAMC;AAAAA,IAC1B,mBAAmB;AAAA,MACjBC,aAAaN,YAAAA,MAAMI,MAAMC;AAAAA,IAC3B;AAAA,EACF;AAAA,EACAE,MAAM;AAAA,IAAEZ,SAAS;AAAA,EAAO;AAAA,EACxBa,WAAW;AAAA,IAAEC,YAAY;AAAA,EAAE;AAAA,EAC3BC,UAAU;AAAA;AAAA;AAAA,IAGRC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,UAAU;AAAA,EACZ;AAAA,EACAC,WAAW;AAAA,IAAEC,WAAY,aAAYjB,YAAAA,MAAMC,OAAOC;AAAAA,EAAW;AAC/D,CAAC;;;"}

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

@@ -1,22 +1,25 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const clsx = require("clsx");
 const useDefaultProps = require("../../../hooks/useDefaultProps.cjs");
 const Actions_styles = require("./Actions.styles.cjs");
-const actionsClasses = require("./actionsClasses.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const HvHeaderActions = (props) => {
   const {
-    classes,
+    classes: classesProp,
     className,
     children,
     ...others
   } = useDefaultProps.useDefaultProps("HvHeaderActions", props);
-  return /* @__PURE__ */ jsxRuntime.jsx(Actions_styles.StyledDiv, {
-    className: clsx.clsx(className, actionsClasses.default.root, classes == null ? void 0 : classes.root),
+  const {
+    classes,
+    cx
+  } = Actions_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", {
+    className: cx(classes.root, className),
     ...others,
     children
   });
 };
+exports.headerActionsClasses = Actions_styles.staticClasses;
 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 { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { StyledDiv } from \"./Actions.styles\";\nimport headerActionsClasses, { HvHeaderActionsClasses } from \"./actionsClasses\";\n\nexport interface HvHeaderActionsProps extends HvBaseProps {\n  classes?: HvHeaderActionsClasses;\n}\n\nexport const HvHeaderActions = (props: HvHeaderActionsProps) => {\n  const { classes, className, children, ...others } = useDefaultProps(\n    \"HvHeaderActions\",\n    props\n  );\n\n  return (\n    <StyledDiv\n      className={clsx(className, headerActionsClasses.root, classes?.root)}\n      {...others}\n    >\n      {children}\n    </StyledDiv>\n  );\n};\n"],"names":["HvHeaderActions","props","classes","className","children","others","useDefaultProps","StyledDiv","clsx","headerActionsClasses","root"],"mappings":";;;;;;;AAYaA,MAAAA,kBAAkBA,CAACC,UAAgC;AACxD,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,IAAWC;AAAAA,IAAU,GAAGC;AAAAA,EAAAA,IAAWC,gBAClD,gBAAA,mBACAL,KACF;AAEA,wCACGM,eAAAA,WAAS;AAAA,IACRJ,WAAWK,KAAKL,KAAAA,WAAWM,eAAqBC,QAAAA,MAAMR,mCAASQ,IAAI;AAAA,IAAE,GACjEL;AAAAA,IAAMD;AAAAA,EAAAA,CAGD;AAEf;;"}
+{"version":3,"file":"Actions.cjs","sources":["../../../../../src/components/Header/Actions/Actions.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses, staticClasses } from \"./Actions.styles\";\n\nexport { staticClasses as headerActionsClasses };\n\nexport type HvHeaderActionsClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderActionsProps extends HvBaseProps {\n  classes?: HvHeaderActionsClasses;\n}\n\nexport const HvHeaderActions = (props: HvHeaderActionsProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    ...others\n  } = useDefaultProps(\"HvHeaderActions\", props);\n\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      {children}\n    </div>\n  );\n};\n"],"names":["HvHeaderActions","props","classes","classesProp","className","children","others","useDefaultProps","cx","useClasses","root"],"mappings":";;;;;AAcaA,MAAAA,kBAAkBA,CAACC,UAAgC;AACxD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBN,KAAK;AAEtC,QAAA;AAAA,IAAEC;AAAAA,IAASM;AAAAA,EAAAA,IAAOC,eAAAA,WAAWN,WAAW;AAE9C,wCACE,OAAA;AAAA,IAAKC,WAAWI,GAAGN,QAAQQ,MAAMN,SAAS;AAAA,IAAE,GAAKE;AAAAA,IAAMD;AAAAA,EAAAA,CAElD;AAET;;;"}

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

@@ -1,31 +1,27 @@
 "use strict";
 var _a;
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
+const classes = require("../../../utils/classes.cjs");
 const Button_styles = require("../../Button/Button.styles.cjs");
 require("../../Button/Button.cjs");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
-const StyledDiv = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yl6wvv0"
-} : {
-  target: "e1yl6wvv0",
-  label: "StyledDiv"
-})({
-  backgroundColor: "transparent",
-  display: "flex",
-  gap: uikitStyles.theme.space.xs,
-  alignItems: "center",
-  marginLeft: "auto",
-  "& > *": {
-    marginLeft: uikitStyles.theme.space.xs
-  },
-  [`& .${(_a = Button_styles.staticClasses) == null ? void 0 : _a.root}`]: {
-    "&:hover": {
-      backgroundColor: uikitStyles.theme.header.hoverColor
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvHeader-Actions", {
+  root: {
+    backgroundColor: "transparent",
+    display: "flex",
+    gap: uikitStyles.theme.space.xs,
+    alignItems: "center",
+    marginLeft: "auto",
+    [`& .${(_a = Button_styles.staticClasses) == null ? void 0 : _a.root}`]: {
+      "&:hover": {
+        backgroundColor: uikitStyles.theme.header.hoverColor
+      }
     }
   }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0FjdGlvbnMvQWN0aW9ucy5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU15QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9BY3Rpb25zL0FjdGlvbnMuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuXG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5cbmltcG9ydCB7IGJ1dHRvbkNsYXNzZXMgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9CdXR0b25cIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZERpdiA9IHN0eWxlZC5kaXYoe1xuICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGdhcDogdGhlbWUuc3BhY2UueHMsXG4gIGFsaWduSXRlbXM6IFwiY2VudGVyXCIsXG4gIG1hcmdpbkxlZnQ6IFwiYXV0b1wiLFxuICBcIiYgPiAqXCI6IHtcbiAgICBtYXJnaW5MZWZ0OiB0aGVtZS5zcGFjZS54cyxcbiAgfSxcbiAgW2AmIC4ke2J1dHRvbkNsYXNzZXM/LnJvb3R9YF06IHtcbiAgICBcIiY6aG92ZXJcIjogeyBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmhlYWRlci5ob3ZlckNvbG9yIH0sXG4gIH0sXG59KTtcbiJdfQ== */");
-exports.StyledDiv = StyledDiv;
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# 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\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { buttonClasses } from \"@core/components/Button\";\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":";;;;;;;;;AAMO,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,OAAKG,qCAAAA,mBAAeC,MAAM,GAAG;AAAA,IAC7B,WAAW;AAAA,MAAET,iBAAiBG,YAAAA,MAAMO,OAAOC;AAAAA,IAAW;AAAA,EACxD;AACF,GAAChB,QAAAC,IAAAC,aAAC,eAAA,KAAA,qoCAAA;;"}
+{"version":3,"file":"Actions.styles.cjs","sources":["../../../../../src/components/Header/Actions/Actions.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { buttonClasses } from \"@core/components/Button\";\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvHeader-Actions\", {\n  root: {\n    backgroundColor: \"transparent\",\n    display: \"flex\",\n    gap: theme.space.xs,\n    alignItems: \"center\",\n    marginLeft: \"auto\",\n    [`& .${buttonClasses?.root}`]: {\n      \"&:hover\": { backgroundColor: theme.header.hoverColor },\n    },\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","backgroundColor","display","gap","theme","space","xs","alignItems","marginLeft","buttonClasses","header","hoverColor"],"mappings":";;;;;;;AAKa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,oBAAoB;AAAA,EAC7EC,MAAM;AAAA,IACJC,iBAAiB;AAAA,IACjBC,SAAS;AAAA,IACTC,KAAKC,YAAAA,MAAMC,MAAMC;AAAAA,IACjBC,YAAY;AAAA,IACZC,YAAY;AAAA,IACZ,CAAE,OAAKC,qCAAAA,mBAAeT,MAAM,GAAG;AAAA,MAC7B,WAAW;AAAA,QAAEC,iBAAiBG,YAAAA,MAAMM,OAAOC;AAAAA,MAAW;AAAA,IACxD;AAAA,EACF;AACF,CAAC;;;"}

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

@@ -1,28 +1,37 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const clsx = require("clsx");
+const uikitStyles = require("@hitachivantara/uikit-styles");
 const useDefaultProps = require("../../../hooks/useDefaultProps.cjs");
 const Brand_styles = require("./Brand.styles.cjs");
-const brandClasses = require("./brandClasses.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const Typography = require("../../Typography/Typography.cjs");
 const HvHeaderBrand = (props) => {
   const {
-    classes,
+    classes: classesProp,
     logo,
     name,
     className,
     ...others
   } = useDefaultProps.useDefaultProps("HvHeaderBrand", props);
-  return /* @__PURE__ */ jsxRuntime.jsxs(Brand_styles.BrandRoot, {
-    className: clsx.clsx(classes == null ? void 0 : classes.root, brandClasses.default.root, className),
+  const {
+    classes,
+    cx,
+    css
+  } = Brand_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
+    className: cx(classes.root, className),
     ...others,
-    children: [logo, logo && name && /* @__PURE__ */ jsxRuntime.jsx(Brand_styles.BrandSeparator, {
-      className: clsx.clsx(classes == null ? void 0 : classes.separator, brandClasses.default.separator)
-    }), name && /* @__PURE__ */ jsxRuntime.jsx(Brand_styles.BrandName, {
+    children: [logo, logo && name && /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: classes.separator
+    }), name && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+      className: css({
+        color: uikitStyles.theme.header.brandColor
+      }),
       variant: "label",
       children: name
     })]
   });
 };
+exports.headerBrandClasses = Brand_styles.staticClasses;
 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 { clsx } from \"clsx\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { BrandRoot, BrandSeparator, BrandName } from \"./Brand.styles\";\nimport headerBrandClasses, { HvHeaderBrandClasses } from \"./brandClasses\";\n\nexport interface HvHeaderBrandProps extends 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 = (props: HvHeaderBrandProps) => {\n  const { classes, logo, name, className, ...others } = useDefaultProps(\n    \"HvHeaderBrand\",\n    props\n  );\n\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","props","classes","logo","name","className","others","useDefaultProps","BrandRoot","clsx","root","headerBrandClasses","children","BrandSeparator","separator","_jsx","BrandName","variant"],"mappings":";;;;;;;AAiBaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IAAEC;AAAAA,IAASC;AAAAA,IAAMC;AAAAA,IAAMC;AAAAA,IAAW,GAAGC;AAAAA,EAAAA,IAAWC,gBACpD,gBAAA,iBACAN,KACF;AAEA,yCACGO,aAAAA,WAAS;AAAA,IACRH,WAAWI,KAAKP,KAAAA,mCAASQ,MAAMC,aAAAA,QAAmBD,MAAML,SAAS;AAAA,IAAE,GAC/DC;AAAAA,IAAMM,UAAA,CAETT,MACAA,QAAQC,uCACNS,aAAAA,gBAAc;AAAA,MACbR,WAAWI,KAAAA,KAAKP,mCAASY,WAAWH,aAAAA,QAAmBG,SAAS;AAAA,IAAA,CACjE,GAEFV,QAAQW,2BAAAA,IAACC,wBAAS;AAAA,MAACC,SAAQ;AAAA,MAAOL,UAAER;AAAAA,IAAAA,CAAgB,CAAC;AAAA,EAAA,CAC7C;AAEf;;"}
+{"version":3,"file":"Brand.cjs","sources":["../../../../../src/components/Header/Brand/Brand.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography } from \"@core/components/Typography\";\n\nimport { staticClasses, useClasses } from \"./Brand.styles\";\n\nexport { staticClasses as headerBrandClasses };\n\nexport type HvHeaderBrandClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderBrandProps extends 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 = (props: HvHeaderBrandProps) => {\n  const {\n    classes: classesProp,\n    logo,\n    name,\n    className,\n    ...others\n  } = useDefaultProps(\"HvHeaderBrand\", props);\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      {logo}\n      {logo && name && <div className={classes.separator} />}\n      {name && (\n        <HvTypography\n          className={css({ color: theme.header.brandColor })}\n          variant=\"label\"\n        >\n          {name}\n        </HvTypography>\n      )}\n    </div>\n  );\n};\n"],"names":["HvHeaderBrand","props","classes","classesProp","logo","name","className","others","useDefaultProps","cx","css","useClasses","root","children","separator","_jsx","HvTypography","color","theme","header","brandColor","variant"],"mappings":";;;;;;;AAsBaA,MAAAA,gBAAgBA,CAACC,UAA8B;AACpD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,iBAAiBP,KAAK;AAEpC,QAAA;AAAA,IAAEC;AAAAA,IAASO;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,aAAAA,WAAWR,WAAW;AAEnD,yCACE,OAAA;AAAA,IAAKG,WAAWG,GAAGP,QAAQU,MAAMN,SAAS;AAAA,IAAE,GAAKC;AAAAA,IAAMM,WACpDT,MACAA,QAAQC,uCAAQ,OAAA;AAAA,MAAKC,WAAWJ,QAAQY;AAAAA,IAAAA,CAAY,GACpDT,QACCU,2BAAAA,IAACC,yBAAY;AAAA,MACXV,WAAWI,IAAI;AAAA,QAAEO,OAAOC,YAAAA,MAAMC,OAAOC;AAAAA,MAAAA,CAAY;AAAA,MACjDC,SAAQ;AAAA,MAAOR,UAEdR;AAAAA,IAAAA,CACW,CACf;AAAA,EAAA,CACE;AAET;;;"}

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

@@ -1,54 +1,22 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const _styled = require("@emotion/styled/base");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const React = require("react");
-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: "e1mg4lzk2"
-} : {
-  target: "e1mg4lzk2",
-  label: "BrandRoot"
-})(process.env.NODE_ENV === "production" ? {
-  name: "s5xdrg",
-  styles: "display:flex;align-items:center"
-} : {
-  name: "s5xdrg",
-  styles: "display:flex;align-items:center",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUXlCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHsgSHZUeXBvZ3JhcGh5LCBIdlR5cG9ncmFwaHlQcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcblxuZXhwb3J0IGNvbnN0IEJyYW5kUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFNlcGFyYXRvciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHdpZHRoOiAxLFxuICBoZWlnaHQ6IHRoZW1lLnNwYWNlLnNtLFxuICBtYXJnaW46IHRoZW1lLnNwYWNlLnhzLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG59KTtcblxuZXhwb3J0IGNvbnN0IEJyYW5kTmFtZSA9IHN0eWxlZChcbiAgZm9yd2FyZFJlZigocHJvcHM6IEh2VHlwb2dyYXBoeVByb3BzLCByZWY/OiBSZWY8SFRNTEVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdlR5cG9ncmFwaHkgey4uLnByb3BzfSByZWY9e3JlZn0gLz47XG4gIH0pXG4pKHtcbiAgY29sb3I6IHRoZW1lLmhlYWRlci5icmFuZENvbG9yLFxufSk7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+const classes = require("../../../utils/classes.cjs");
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvHeader-Brand", {
+  root: {
+    display: "flex",
+    alignItems: "center"
+  },
+  separator: {
+    width: 1,
+    height: uikitStyles.theme.space.sm,
+    margin: uikitStyles.theme.space.xs,
+    backgroundColor: uikitStyles.theme.colors.secondary
+  }
 });
-const BrandSeparator = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "e1mg4lzk1"
-} : {
-  target: "e1mg4lzk1",
-  label: "BrandSeparator"
-})({
-  width: 1,
-  height: uikitStyles.theme.space.sm,
-  margin: uikitStyles.theme.space.xs,
-  backgroundColor: uikitStyles.theme.colors.secondary
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBYThCIiwiZmlsZSI6Ii9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcblxuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuXG5pbXBvcnQgeyBmb3J3YXJkUmVmLCBSZWYgfSBmcm9tIFwicmVhY3RcIjtcblxuaW1wb3J0IHsgSHZUeXBvZ3JhcGh5LCBIdlR5cG9ncmFwaHlQcm9wcyB9IGZyb20gXCJAY29yZS9jb21wb25lbnRzL1R5cG9ncmFwaHlcIjtcblxuZXhwb3J0IGNvbnN0IEJyYW5kUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFNlcGFyYXRvciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHdpZHRoOiAxLFxuICBoZWlnaHQ6IHRoZW1lLnNwYWNlLnNtLFxuICBtYXJnaW46IHRoZW1lLnNwYWNlLnhzLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5zZWNvbmRhcnksXG59KTtcblxuZXhwb3J0IGNvbnN0IEJyYW5kTmFtZSA9IHN0eWxlZChcbiAgZm9yd2FyZFJlZigocHJvcHM6IEh2VHlwb2dyYXBoeVByb3BzLCByZWY/OiBSZWY8SFRNTEVsZW1lbnQ+KSA9PiB7XG4gICAgcmV0dXJuIDxIdlR5cG9ncmFwaHkgey4uLnByb3BzfSByZWY9e3JlZn0gLz47XG4gIH0pXG4pKHtcbiAgY29sb3I6IHRoZW1lLmhlYWRlci5icmFuZENvbG9yLFxufSk7XG4iXX0= */");
-const BrandName = /* @__PURE__ */ _styled__default.default(React.forwardRef((props, ref) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-    ...props,
-    ref
-  });
-}), 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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0JyYW5kL0JyYW5kLnN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0J5QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9CcmFuZC9CcmFuZC5zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5cbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcblxuaW1wb3J0IHsgZm9yd2FyZFJlZiwgUmVmIH0gZnJvbSBcInJlYWN0XCI7XG5cbmltcG9ydCB7IEh2VHlwb2dyYXBoeSwgSHZUeXBvZ3JhcGh5UHJvcHMgfSBmcm9tIFwiQGNvcmUvY29tcG9uZW50cy9UeXBvZ3JhcGh5XCI7XG5cbmV4cG9ydCBjb25zdCBCcmFuZFJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbn0pO1xuXG5leHBvcnQgY29uc3QgQnJhbmRTZXBhcmF0b3IgPSBzdHlsZWQoXCJkaXZcIikoe1xuICB3aWR0aDogMSxcbiAgaGVpZ2h0OiB0aGVtZS5zcGFjZS5zbSxcbiAgbWFyZ2luOiB0aGVtZS5zcGFjZS54cyxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxufSk7XG5cbmV4cG9ydCBjb25zdCBCcmFuZE5hbWUgPSBzdHlsZWQoXG4gIGZvcndhcmRSZWYoKHByb3BzOiBIdlR5cG9ncmFwaHlQcm9wcywgcmVmPzogUmVmPEhUTUxFbGVtZW50PikgPT4ge1xuICAgIHJldHVybiA8SHZUeXBvZ3JhcGh5IHsuLi5wcm9wc30gcmVmPXtyZWZ9IC8+O1xuICB9KVxuKSh7XG4gIGNvbG9yOiB0aGVtZS5oZWFkZXIuYnJhbmRDb2xvcixcbn0pO1xuIl19 */");
-exports.BrandName = BrandName;
-exports.BrandRoot = BrandRoot;
-exports.BrandSeparator = BrandSeparator;
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# 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\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { forwardRef, Ref } from \"react\";\n\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\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(\n  forwardRef((props: HvTypographyProps, ref?: Ref<HTMLElement>) => {\n    return <HvTypography {...props} ref={ref} />;\n  })\n)({\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","forwardRef","props","ref","HvTypography","color","header","brandColor"],"mappings":";;;;;;;;;;;;AAQO,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,CAGrC;AAEM,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,q4CAAA;AAEK,MAAMmB,YAAYtB,iCAAAA,QACvBuB,MAAAA,WAAW,CAACC,OAA0BC,QAA2B;AAC/D,wCAAQC,WAAAA,cAAY;AAAA,IAAA,GAAKF;AAAAA,IAAOC;AAAAA,EAAAA,CAAW;AAC7C,CAAC,GAACxB,QAAAC,IAAAC,aAAA,eAAA;AAAA,EAAAC,QAAA;AAAA,IAAA;AAAA,EAAAA,QAAA;AAAA,EAAAC,OAAA;AAAA,CACJ,EAAE;AAAA,EACAsB,OAAOb,YAAAA,MAAMc,OAAOC;AACtB,GAAC5B,QAAAC,IAAAC,aAAC,eAAA,KAAA,q4CAAA;;;;"}
+{"version":3,"file":"Brand.styles.cjs","sources":["../../../../../src/components/Header/Brand/Brand.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { createClasses } from \"@core/utils/classes\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvHeader-Brand\", {\n  root: { display: \"flex\", alignItems: \"center\" },\n  separator: {\n    width: 1,\n    height: theme.space.sm,\n    margin: theme.space.xs,\n    backgroundColor: theme.colors.secondary,\n  },\n});\n"],"names":["staticClasses","useClasses","createClasses","root","display","alignItems","separator","width","height","theme","space","sm","margin","xs","backgroundColor","colors","secondary"],"mappings":";;;;AAIa,MAAA;AAAA,EAAEA;AAAAA,EAAeC;AAAW,IAAIC,QAAAA,cAAc,kBAAkB;AAAA,EAC3EC,MAAM;AAAA,IAAEC,SAAS;AAAA,IAAQC,YAAY;AAAA,EAAS;AAAA,EAC9CC,WAAW;AAAA,IACTC,OAAO;AAAA,IACPC,QAAQC,YAAAA,MAAMC,MAAMC;AAAAA,IACpBC,QAAQH,YAAAA,MAAMC,MAAMG;AAAAA,IACpBC,iBAAiBL,YAAAA,MAAMM,OAAOC;AAAAA,EAChC;AACF,CAAC;;;"}

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

@@ -1,27 +1,37 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const clsx = require("clsx");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const Header_styles = require("./Header.styles.cjs");
-const headerClasses = require("./headerClasses.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const HvHeader = (props) => {
   const {
     className,
-    classes,
+    classes: classesProp,
     children,
     position = "fixed",
     ...others
   } = useDefaultProps.useDefaultProps("HvHeader", props);
-  return /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledAppBar, {
-    className: clsx.clsx(className, classes == null ? void 0 : classes.root, headerClasses.default.root, classes == null ? void 0 : classes.backgroundColor, headerClasses.default.backgroundColor),
-    $position: position,
+  const {
+    classes,
+    cx,
+    css
+  } = Header_styles.useClasses(classesProp);
+  return /* @__PURE__ */ jsxRuntime.jsx("header", {
+    className: cx(classes.root, classes.backgroundColor, css({
+      position,
+      ...position === "fixed" && {
+        top: 0,
+        left: "auto",
+        right: 0
+      }
+    }), className),
     ...others,
-    children: /* @__PURE__ */ jsxRuntime.jsx(Header_styles.StyledHeaderRoot, {
-      className: clsx.clsx(classes == null ? void 0 : classes.header, headerClasses.default.header),
+    children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+      className: classes.header,
       children
     })
   });
 };
+exports.headerClasses = Header_styles.staticClasses;
 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 { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\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 interface HvHeaderProps extends 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 {\n    className,\n    classes,\n    children,\n    position = \"fixed\",\n    ...others\n  } = useDefaultProps(\"HvHeader\", 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","useDefaultProps","StyledAppBar","clsx","root","headerClasses","backgroundColor","$position","StyledHeaderRoot","header"],"mappings":";;;;;;;AAyBaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,WAAW;AAAA,IACX,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,YAAYN,KAAK;AAErC,wCACGO,cAAAA,cAAY;AAAA,IACXN,WAAWO,KACTP,KAAAA,WACAC,mCAASO,MACTC,sBAAcD,MACdP,mCAASS,iBACTD,cAAAA,QAAcC,eAChB;AAAA,IACAC,WAAWR;AAAAA,IAAS,GAChBC;AAAAA,IAAMF,yCAETU,gCAAgB;AAAA,MAACZ,WAAWO,KAAAA,KAAKN,mCAASY,QAAQJ,cAAAA,QAAcI,MAAM;AAAA,MAAEX;AAAAA,IAAAA,CAEvD;AAAA,EAAA,CACN;AAElB;;"}
+{"version":3,"file":"Header.cjs","sources":["../../../../src/components/Header/Header.tsx"],"sourcesContent":["import { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses, staticClasses } from \"./Header.styles\";\n\nexport { staticClasses as headerClasses };\n\nexport type HvHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport type HvHeaderPosition =\n  | \"fixed\"\n  | \"absolute\"\n  | \"sticky\"\n  | \"static\"\n  | \"relative\";\n\nexport interface HvHeaderProps extends 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 {\n    className,\n    classes: classesProp,\n    children,\n    position = \"fixed\",\n    ...others\n  } = useDefaultProps(\"HvHeader\", props);\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  return (\n    <header\n      className={cx(\n        classes.root,\n        classes.backgroundColor,\n        css({\n          position,\n          ...(position === \"fixed\" && {\n            top: 0,\n            left: \"auto\",\n            right: 0,\n          }),\n        }),\n        className\n      )}\n      {...others}\n    >\n      <div className={classes.header}>{children}</div>\n    </header>\n  );\n};\n"],"names":["HvHeader","props","className","classes","classesProp","children","position","others","useDefaultProps","cx","css","useClasses","root","backgroundColor","top","left","right","header"],"mappings":";;;;;AA2BaA,MAAAA,WAAWA,CAACC,UAAyB;AAC1C,QAAA;AAAA,IACJC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACAC,WAAW;AAAA,IACX,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,YAAYP,KAAK;AAE/B,QAAA;AAAA,IAAEE;AAAAA,IAASM;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,cAAAA,WAAWP,WAAW;AAEnD,wCACE,UAAA;AAAA,IACEF,WAAWO,GACTN,QAAQS,MACRT,QAAQU,iBACRH,IAAI;AAAA,MACFJ;AAAAA,MACA,GAAIA,aAAa,WAAW;AAAA,QAC1BQ,KAAK;AAAA,QACLC,MAAM;AAAA,QACNC,OAAO;AAAA,MACT;AAAA,IACD,CAAA,GACDd,SACF;AAAA,IAAE,GACEK;AAAAA,IAAMF,yCAEV,OAAA;AAAA,MAAKH,WAAWC,QAAQc;AAAAA,MAAOZ;AAAAA,IAAAA,CAAgB;AAAA,EAAA,CACzC;AAEZ;;;"}

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

@@ -1,78 +1,37 @@
 "use strict";
 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");
-const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
-const _styled__default = /* @__PURE__ */ _interopDefault(_styled);
-function _extends() {
-  _extends = Object.assign ? Object.assign.bind() : function(target) {
-    for (var i = 1; i < arguments.length; i++) {
-      var source = arguments[i];
-      for (var key in source) {
-        if (Object.prototype.hasOwnProperty.call(source, key)) {
-          target[key] = source[key];
-        }
-      }
-    }
-    return target;
-  };
-  return _extends.apply(this, arguments);
-}
-const StyledAppBar = /* @__PURE__ */ _styled__default.default("header", process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "euwt7yw1"
-}, transientOptions.transientOptions) : _extends({}, {
-  target: "euwt7yw1",
-  label: "StyledAppBar"
-}, transientOptions.transientOptions))(({
-  $position
-}) => ({
-  height: uikitStyles.theme.header.height,
-  backgroundColor: uikitStyles.theme.header.backgroundColor,
-  display: "flex",
-  flexDirection: "column",
-  width: "100%",
-  boxSizing: "border-box",
-  flexShrink: 0,
-  zIndex: uikitStyles.theme.zIndices.banner,
-  color: uikitStyles.theme.colors.atmo1,
-  boxShadow: uikitStyles.theme.header.shadow,
-  borderTop: `${uikitStyles.theme.header.borderTopThickness} solid ${uikitStyles.theme.header.borderTopColor}`,
-  ...$position === "fixed" && {
-    position: "fixed",
-    top: 0,
-    left: "auto",
-    right: 0
-  },
-  ...$position === "relative" && {
-    position: "relative"
+const classes = require("../../utils/classes.cjs");
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvHeader", {
+  root: {
+    height: uikitStyles.theme.header.height,
+    backgroundColor: uikitStyles.theme.header.backgroundColor,
+    display: "flex",
+    flexDirection: "column",
+    width: "100%",
+    boxSizing: "border-box",
+    flexShrink: 0,
+    zIndex: uikitStyles.theme.zIndices.banner,
+    color: uikitStyles.theme.colors.atmo1,
+    boxShadow: uikitStyles.theme.header.shadow,
+    borderTop: `${uikitStyles.theme.header.borderTopThickness} solid ${uikitStyles.theme.header.borderTopColor}`
   },
-  ...$position === "absolute" && {
-    position: "absolute"
-  },
-  ...$position === "static" && {
-    position: "static"
+  header: {
+    display: "flex",
+    alignItems: "center",
+    width: "100%",
+    height: "100%",
+    padding: `0 ${uikitStyles.theme.space.sm}`,
+    boxShadow: uikitStyles.theme.header.shadow,
+    "& > *:not(nav)": {
+      zIndex: 2
+    }
   },
-  ...$position === "sticky" && {
-    position: "sticky"
-  }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUk0QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0hlYWRlci9IZWFkZXIuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRBcHBCYXIgPSBzdHlsZWQoXG4gIFwiaGVhZGVyXCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoKHsgJHBvc2l0aW9uIH06IHsgJHBvc2l0aW9uPzogc3RyaW5nIH0pID0+ICh7XG4gIGhlaWdodDogdGhlbWUuaGVhZGVyLmhlaWdodCxcbiAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5oZWFkZXIuYmFja2dyb3VuZENvbG9yLFxuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgZmxleERpcmVjdGlvbjogXCJjb2x1bW5cIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICBmbGV4U2hyaW5rOiAwLFxuICB6SW5kZXg6IHRoZW1lLnpJbmRpY2VzLmJhbm5lcixcbiAgY29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBib3JkZXJUb3A6IGAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BUaGlja25lc3N9IHNvbGlkICR7dGhlbWUuaGVhZGVyLmJvcmRlclRvcENvbG9yfWAsXG5cbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJmaXhlZFwiICYmIHtcbiAgICBwb3NpdGlvbjogXCJmaXhlZFwiLFxuICAgIHRvcDogMCxcbiAgICBsZWZ0OiBcImF1dG9cIixcbiAgICByaWdodDogMCxcbiAgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwicmVsYXRpdmVcIiAmJiB7IHBvc2l0aW9uOiBcInJlbGF0aXZlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwiYWJzb2x1dGVcIiAmJiB7IHBvc2l0aW9uOiBcImFic29sdXRlXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RhdGljXCIgJiYgeyBwb3NpdGlvbjogXCJzdGF0aWNcIiB9KSxcbiAgLi4uKCRwb3NpdGlvbiA9PT0gXCJzdGlja3lcIiAmJiB7IHBvc2l0aW9uOiBcInN0aWNreVwiIH0pLFxufSkpO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSGVhZGVyUm9vdCA9IHN0eWxlZChcImRpdlwiKSh7XG4gIGRpc3BsYXk6IFwiZmxleFwiLFxuICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICB3aWR0aDogXCIxMDAlXCIsXG4gIGhlaWdodDogXCIxMDAlXCIsXG4gIHBhZGRpbmc6IGAwICR7dGhlbWUuc3BhY2Uuc219YCxcbiAgYm94U2hhZG93OiB0aGVtZS5oZWFkZXIuc2hhZG93LFxuICBcIiYgPiAqOm5vdChuYXYpXCI6IHtcbiAgICB6SW5kZXg6IDIsXG4gIH0sXG59KTtcbiJdfQ== */");
-const StyledHeaderRoot = /* @__PURE__ */ _styled__default.default("div", process.env.NODE_ENV === "production" ? {
-  target: "euwt7yw0"
-} : {
-  target: "euwt7yw0",
-  label: "StyledHeaderRoot"
-})({
-  display: "flex",
-  alignItems: "center",
-  width: "100%",
-  height: "100%",
-  padding: `0 ${uikitStyles.theme.space.sm}`,
-  boxShadow: uikitStyles.theme.header.shadow,
-  "& > *:not(nav)": {
-    zIndex: 2
-  }
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvSGVhZGVyL0hlYWRlci5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdDZ0MiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9IZWFkZXIvSGVhZGVyLnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHRoZW1lIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IHRyYW5zaWVudE9wdGlvbnMgfSBmcm9tIFwiQGNvcmUvdXRpbHMvdHJhbnNpZW50T3B0aW9uc1wiO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkQXBwQmFyID0gc3R5bGVkKFxuICBcImhlYWRlclwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKCh7ICRwb3NpdGlvbiB9OiB7ICRwb3NpdGlvbj86IHN0cmluZyB9KSA9PiAoe1xuICBoZWlnaHQ6IHRoZW1lLmhlYWRlci5oZWlnaHQsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuaGVhZGVyLmJhY2tncm91bmRDb2xvcixcbiAgZGlzcGxheTogXCJmbGV4XCIsXG4gIGZsZXhEaXJlY3Rpb246IFwiY29sdW1uXCIsXG4gIHdpZHRoOiBcIjEwMCVcIixcbiAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgZmxleFNocmluazogMCxcbiAgekluZGV4OiB0aGVtZS56SW5kaWNlcy5iYW5uZXIsXG4gIGNvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgYm9yZGVyVG9wOiBgJHt0aGVtZS5oZWFkZXIuYm9yZGVyVG9wVGhpY2tuZXNzfSBzb2xpZCAke3RoZW1lLmhlYWRlci5ib3JkZXJUb3BDb2xvcn1gLFxuXG4gIC4uLigkcG9zaXRpb24gPT09IFwiZml4ZWRcIiAmJiB7XG4gICAgcG9zaXRpb246IFwiZml4ZWRcIixcbiAgICB0b3A6IDAsXG4gICAgbGVmdDogXCJhdXRvXCIsXG4gICAgcmlnaHQ6IDAsXG4gIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInJlbGF0aXZlXCIgJiYgeyBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcImFic29sdXRlXCIgJiYgeyBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiIH0pLFxuICAuLi4oJHBvc2l0aW9uID09PSBcInN0YXRpY1wiICYmIHsgcG9zaXRpb246IFwic3RhdGljXCIgfSksXG4gIC4uLigkcG9zaXRpb24gPT09IFwic3RpY2t5XCIgJiYgeyBwb3NpdGlvbjogXCJzdGlja3lcIiB9KSxcbn0pKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZEhlYWRlclJvb3QgPSBzdHlsZWQoXCJkaXZcIikoe1xuICBkaXNwbGF5OiBcImZsZXhcIixcbiAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgd2lkdGg6IFwiMTAwJVwiLFxuICBoZWlnaHQ6IFwiMTAwJVwiLFxuICBwYWRkaW5nOiBgMCAke3RoZW1lLnNwYWNlLnNtfWAsXG4gIGJveFNoYWRvdzogdGhlbWUuaGVhZGVyLnNoYWRvdyxcbiAgXCImID4gKjpub3QobmF2KVwiOiB7XG4gICAgekluZGV4OiAyLFxuICB9LFxufSk7XG4iXX0= */");
-exports.StyledAppBar = StyledAppBar;
-exports.StyledHeaderRoot = StyledHeaderRoot;
+  backgroundColor: {}
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=Header.styles.cjs.map