@hitachivantara/uikit-react-core 5.6.0 → 5.7.1

package/dist/esm/components/BaseInput/BaseInput.styles.js

@@ -1,101 +1,111 @@
-import _styled from "@emotion/styled/base";
-import { Input, inputClasses } from "@mui/material";
 import { theme } from "@hitachivantara/uikit-styles";
-import { transientOptions } from "../../utils/transientOptions.js";
 import baseInputClasses from "./baseInputClasses.js";
 import { outlineStyles } from "../../utils/focusUtils.js";
-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 StyledRoot = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "e8ibl7d2"
-}, transientOptions) : _extends({}, {
-  target: "e8ibl7d2",
-  label: "StyledRoot"
-}, transientOptions))(({
-  $disabled,
-  $invalid,
-  $resizable,
-  $readOnly
-}) => ({
-  display: "inline-block",
-  width: "100%",
-  position: "relative",
-  [`&:hover .${baseInputClasses.inputBorderContainer}`]: {
-    backgroundColor: theme.baseInput.hoverColor
-  },
-  [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {
-    backgroundColor: theme.baseInput.hoverColor
-  },
-  ...$resizable && {
-    width: "auto"
-  },
-  ...$readOnly && {
-    [`& .${baseInputClasses.inputBorderContainer}`]: {
-      backgroundColor: "transparent"
-    },
+const styles = {
+  root: {
+    display: "inline-block",
+    width: "100%",
+    position: "relative",
     [`&:hover .${baseInputClasses.inputBorderContainer}`]: {
-      backgroundColor: "transparent"
+      backgroundColor: theme.baseInput.hoverColor
     },
     [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {
-      backgroundColor: "transparent"
+      backgroundColor: theme.baseInput.hoverColor
     }
   },
-  ...$disabled && {
+  disabled: {
     [`& .${baseInputClasses.inputBorderContainer}`]: {
       backgroundColor: theme.colors.atmo4
     },
     [`&:hover .${baseInputClasses.inputBorderContainer}`]: {
       backgroundColor: theme.colors.atmo4
+    },
+    [`& .${baseInputClasses.inputRootMultiline}`]: {
+      [`& .${baseInputClasses.input}`]: {
+        backgroundColor: theme.baseInput.disabledBackgroundColor,
+        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`
+      }
+    },
+    [`&:hover .${baseInputClasses.inputRootMultiline}`]: {
+      [`& .${baseInputClasses.input}`]: {
+        backgroundColor: theme.baseInput.disabledBackgroundColor,
+        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`
+      }
     }
   },
-  ...$invalid && {
+  invalid: {
     "&:not(.disabled)": {
       [`& .${baseInputClasses.inputBorderContainer}`]: {
         backgroundColor: theme.colors.negative
       },
       [`&:hover .${baseInputClasses.inputBorderContainer}`]: {
         backgroundColor: theme.colors.negative
+      },
+      [`& .${baseInputClasses.inputRootMultiline}`]: {
+        [`& .${baseInputClasses.input}`]: {
+          border: `1px solid ${theme.colors.negative}`
+        }
+      },
+      [`&:hover .${baseInputClasses.inputRootMultiline}`]: {
+        [`& .${baseInputClasses.input}`]: {
+          border: `1px solid ${theme.colors.negative}`
+        }
+      },
+      [`&:focus-within .${baseInputClasses.inputRootMultiline}`]: {
+        [`& .${baseInputClasses.input}`]: {
+          border: `1px solid ${theme.colors.negative}`
+        }
       }
     }
-  }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVcwQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0Jhc2VJbnB1dC9CYXNlSW5wdXQuc3R5bGVzLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHtcbiAgSW5wdXQgYXMgTXVpSW5wdXQsXG4gIGlucHV0Q2xhc3NlcyBhcyBNdWlJbnB1dENsYXNzZXMsXG59IGZyb20gXCJAbXVpL21hdGVyaWFsXCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgeyB0cmFuc2llbnRPcHRpb25zIH0gZnJvbSBcIkBjb3JlL3V0aWxzL3RyYW5zaWVudE9wdGlvbnNcIjtcbmltcG9ydCB7IG91dGxpbmVTdHlsZXMgfSBmcm9tIFwiQGNvcmUvdXRpbHNcIjtcbmltcG9ydCBiYXNlSW5wdXRDbGFzc2VzIGZyb20gXCIuL2Jhc2VJbnB1dENsYXNzZXNcIjtcbmltcG9ydCB7IENTU1Byb3BlcnRpZXMgfSBmcm9tIFwicmVhY3RcIjtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZFJvb3QgPSBzdHlsZWQoXG4gIFwiZGl2XCIsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoXG4gICh7XG4gICAgJGRpc2FibGVkLFxuICAgICRpbnZhbGlkLFxuICAgICRyZXNpemFibGUsXG4gICAgJHJlYWRPbmx5LFxuICB9OiB7XG4gICAgJGRpc2FibGVkOiBib29sZWFuO1xuICAgICRpbnZhbGlkOiBib29sZWFuO1xuICAgICRyZXNpemFibGU6IGJvb2xlYW47XG4gICAgJHJlYWRPbmx5OiBib29sZWFuO1xuICB9KSA9PiAoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWJsb2NrXCIsXG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIHBvc2l0aW9uOiBcInJlbGF0aXZlXCIsXG5cbiAgICBbYCY6aG92ZXIgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcixcbiAgICB9LFxuXG4gICAgW2AmOmZvY3VzLXdpdGhpbiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5ob3ZlckNvbG9yLFxuICAgIH0sXG5cbiAgICAuLi4oJHJlc2l6YWJsZSAmJiB7XG4gICAgICB3aWR0aDogXCJhdXRvXCIsXG4gICAgfSksXG5cbiAgICAuLi4oJHJlYWRPbmx5ICYmIHtcbiAgICAgIFtgJiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgfSxcblxuICAgICAgW2AmOmhvdmVyIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gICAgICB9LFxuXG4gICAgICBbYCY6Zm9jdXMtd2l0aGluIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gICAgICB9LFxuICAgIH0pLFxuXG4gICAgLi4uKCRkaXNhYmxlZCAmJiB7XG4gICAgICBbYCYgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vNCxcbiAgICAgIH0sXG5cbiAgICAgIFtgJjpob3ZlciAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxuICAgICAgfSxcbiAgICB9KSxcblxuICAgIC4uLigkaW52YWxpZCAmJiB7XG4gICAgICBcIiY6bm90KC5kaXNhYmxlZClcIjoge1xuICAgICAgICBbYCYgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICAgICAgICB9LFxuXG4gICAgICAgIFtgJjpob3ZlciAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gICAgICAgIH0sXG4gICAgICB9LFxuICAgIH0pLFxuICB9KVxuKTtcblxuZXhwb3J0IGNvbnN0IFN0eWxlZElucHV0Qm9yZGVyQ29udGFpbmVyID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgd2lkdGg6IFwiY2FsYygxMDAlIC0gNHB4KVwiLFxuICBoZWlnaHQ6IHRoZW1lLmJhc2VJbnB1dC51bmRlcmxpbmVIZWlnaHQsXG4gIHRvcDogXCIzMXB4XCIsXG4gIGxlZnQ6IFwiMnB4XCIsXG4gIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW80LFxufSk7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dCA9IHN0eWxlZChcbiAgTXVpSW5wdXQsXG4gIHRyYW5zaWVudE9wdGlvbnNcbikoXG4gICh7XG4gICAgJHJlc2l6YWJsZSxcbiAgICAkZGlzYWJsZWQsXG4gICAgJHJlYWRPbmx5LFxuICAgICRpbnZhbGlkLFxuICB9OiB7XG4gICAgJHJlc2l6YWJsZTogYm9vbGVhbjtcbiAgICAkZGlzYWJsZWQ6IGJvb2xlYW47XG4gICAgJHJlYWRPbmx5OiBib29sZWFuO1xuICAgICRpbnZhbGlkOiBib29sZWFuO1xuICB9KSA9PiAoe1xuICAgIFtgJi4ke011aUlucHV0Q2xhc3Nlcy5yb290fWBdOiB7XG4gICAgICBtYXJnaW46IDAsXG4gICAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnJhZGlpLmJhc2UsXG4gICAgICBoZWlnaHQ6IFwiMzJweFwiLFxuICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0LmJvcmRlckNvbG9yfWAsXG4gICAgICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICBmb250RmFtaWx5OiB0aGVtZS5mb250RmFtaWx5LmJvZHksXG5cbiAgICAgIC4uLigkaW52YWxpZCAmJiB7XG4gICAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5jb2xvcnMubmVnYXRpdmUsXG4gICAgICB9KSxcblxuICAgICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCb3JkZXJDb2xvcixcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICB9KSxcblxuICAgICAgW2AmOmhvdmVyOm5vdCguJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Um9vdERpc2FibGVkfSk6bm90KC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRSb290SW52YWxpZH0pOm5vdCguJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Um9vdFJlYWRPbmx5fSlgXTpcbiAgICAgICAge1xuICAgICAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcixcbiAgICAgICAgfSxcblxuICAgICAgW2AmOmhvdmVyOm5vdCguJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Um9vdERpc2FibGVkfSk6OmJlZm9yZWBdOiB7XG4gICAgICAgIGJvcmRlckJvdHRvbTogXCJub25lXCIsXG4gICAgICB9LFxuXG4gICAgICBcIiY6OmJlZm9yZVwiOiB7XG4gICAgICAgIGJvcmRlckJvdHRvbTogXCJub25lXCIsXG4gICAgICB9LFxuXG4gICAgICBcIiY6OmFmdGVyXCI6IHtcbiAgICAgICAgYm9yZGVyQm90dG9tOiBcIm5vbmVcIixcbiAgICAgIH0sXG4gICAgfSxcblxuICAgIFtgJiAuJHtNdWlJbnB1dENsYXNzZXMuaW5wdXR9YF06IHtcbiAgICAgIG1hcmdpbkxlZnQ6IHRoZW1lLnNwYWNlLnhzLFxuICAgICAgbWFyZ2luUmlnaHQ6IHRoZW1lLnNwYWNlLnhzLFxuICAgICAgcGFkZGluZzogXCI2cHggMCA1cHhcIixcbiAgICAgIG92ZXJmbG93OiBcImhpZGRlblwiLFxuICAgICAgdGV4dE92ZXJmbG93OiBcImVsbGlwc2lzXCIsXG4gICAgICBvdXRsaW5lOiBcIm5vbmVcIixcbiAgICAgIHdpZHRoOiBcImluaXRpYWxcIixcbiAgICAgIGZsZXhHcm93OiAxLFxuICAgICAgLi4uKHRoZW1lLnR5cG9ncmFwaHkuYm9keSBhcyBDU1NQcm9wZXJ0aWVzKSxcblxuICAgICAgXCImOjpwbGFjZWhvbGRlclwiOiB7XG4gICAgICAgIG9wYWNpdHk6IDEsXG4gICAgICAgIGNvbG9yOiB0aGVtZS5iYXNlSW5wdXQucGxhY2Vob2xkZXJDb2xvcixcbiAgICAgIH0sXG5cbiAgICAgIFwiJjo6LW1zLWNsZWFyXCI6IHtcbiAgICAgICAgZGlzcGxheTogXCJub25lXCIsXG4gICAgICB9LFxuXG4gICAgICAuLi4oJHJlc2l6YWJsZSAmJiB7XG4gICAgICAgIHJlc2l6ZTogXCJib3RoXCIsXG4gICAgICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICAgIH0pLFxuXG4gICAgICAuLi4oJGRpc2FibGVkICYmIHtcbiAgICAgICAgY29sb3I6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZFRleHRDb2xvcixcbiAgICAgIH0pLFxuXG4gICAgICAuLi4oJHJlYWRPbmx5ICYmIHtcbiAgICAgICAgY29sb3I6IHRoZW1lLmJhc2VJbnB1dC5yZWFkT25seVRleHRDb2xvcixcbiAgICAgIH0pLFxuICAgIH0sXG5cbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMuZm9jdXNlZH1gXToge1xuICAgICAgYmFja2dyb3VuZDogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgLi4ub3V0bGluZVN0eWxlcyxcblxuICAgICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgYmFja2dyb3VuZDogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgfSxcblxuICAgICAgW2AmLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seX1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5yZWFkT25seUJhY2tncm91bmRDb2xvcixcbiAgICAgIH0sXG4gICAgfSxcblxuICAgIFtgJi4ke011aUlucHV0Q2xhc3Nlcy5kaXNhYmxlZH1gXToge1xuICAgICAgYmFja2dyb3VuZDogdGhlbWUuYmFzZUlucHV0LmRpc2FibGVkQmFja2dyb3VuZENvbG9yLFxuICAgICAgYm9yZGVyQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJvcmRlckNvbG9yLFxuICAgICAgY3Vyc29yOiBcIm5vdC1hbGxvd2VkXCIsXG5cbiAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJhY2tncm91bmRDb2xvcixcbiAgICAgICAgY3Vyc29yOiBcIm5vdC1hbGxvd2VkXCIsXG4gICAgICB9LFxuXG4gICAgICBcIiYmOjpiZWZvcmVcIjoge1xuICAgICAgICBib3JkZXJCb3R0b21TdHlsZTogXCJub25lXCIsXG4gICAgICB9LFxuICAgIH0sXG5cbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMubXVsdGlsaW5lfWBdOiB7XG4gICAgICBwYWRkaW5nOiAwLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCIsXG4gICAgICBvdmVyZmxvdzogXCJhdXRvXCIsXG4gICAgICBib3JkZXI6IFwibm9uZVwiLFxuICAgICAgaGVpZ2h0OiBcImF1dG9cIixcblxuICAgICAgW2AmIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXR9YF06IHtcbiAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0Lm11bHRpbGluZUJvcmRlckNvbG9yfWAsXG4gICAgICAgIGJvcmRlclJhZGl1czogdGhlbWUucmFkaWkuYmFzZSxcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzEsXG4gICAgICAgIGhlaWdodDogXCJhdXRvXCIsXG4gICAgICAgIG1pbkhlaWdodDogXCIyMXB4XCIsXG4gICAgICAgIHBhZGRpbmc6IFwiNXB4IDEwcHhcIixcbiAgICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgICBtYXJnaW5MZWZ0OiBcIjBweFwiLFxuICAgICAgICBtYXJnaW5SaWdodDogXCIwcHhcIixcblxuICAgICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5ob3ZlckNvbG9yfWAsXG4gICAgICAgIH0sXG5cbiAgICAgICAgLi4uKCRkaXNhYmxlZCAmJiB7XG4gICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0Lm11bHRpbGluZURpc2FibGVkQm9yZGVyQ29sb3J9YCxcblxuICAgICAgICAgIFwiOmhvdmVyXCI6IHtcbiAgICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LmRpc2FibGVkQmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0Lm11bHRpbGluZURpc2FibGVkQm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICB9LFxuICAgICAgICB9KSxcblxuICAgICAgICAuLi4oJHJlYWRPbmx5ICYmIHtcbiAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCb3JkZXJDb2xvcn1gLFxuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5QmFja2dyb3VuZENvbG9yLFxuXG4gICAgICAgICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5yZWFkT25seUJvcmRlckNvbG9yfWAsXG4gICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5yZWFkT25seUJhY2tncm91bmRDb2xvcixcbiAgICAgICAgICB9LFxuXG4gICAgICAgICAgXCImOmZvY3VzLXdpdGhpblwiOiB7XG4gICAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCb3JkZXJDb2xvcn1gLFxuICAgICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG5cbiAgICAgICAgLi4uKCRpbnZhbGlkICYmIHtcbiAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMubmVnYXRpdmV9YCxcblxuICAgICAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMubmVnYXRpdmV9YCxcbiAgICAgICAgICB9LFxuXG4gICAgICAgICAgXCImOmZvY3VzLXdpdGhpblwiOiB7XG4gICAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5jb2xvcnMubmVnYXRpdmV9YCxcbiAgICAgICAgICB9LFxuICAgICAgICB9KSxcbiAgICAgIH0sXG4gICAgfSxcbiAgfSlcbik7XG4iXX0= */");
-const StyledInputBorderContainer = /* @__PURE__ */ _styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e8ibl7d1"
-} : {
-  target: "e8ibl7d1",
-  label: "StyledInputBorderContainer"
-})({
-  position: "absolute",
-  width: "calc(100% - 4px)",
-  height: theme.baseInput.underlineHeight,
-  top: "31px",
-  left: "2px",
-  backgroundColor: theme.colors.atmo4
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWdGMEMiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9CYXNlSW5wdXQvQmFzZUlucHV0LnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIElucHV0IGFzIE11aUlucHV0LFxuICBpbnB1dENsYXNzZXMgYXMgTXVpSW5wdXRDbGFzc2VzLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzXCI7XG5pbXBvcnQgYmFzZUlucHV0Q2xhc3NlcyBmcm9tIFwiLi9iYXNlSW5wdXRDbGFzc2VzXCI7XG5pbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFxuICBcImRpdlwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKFxuICAoe1xuICAgICRkaXNhYmxlZCxcbiAgICAkaW52YWxpZCxcbiAgICAkcmVzaXphYmxlLFxuICAgICRyZWFkT25seSxcbiAgfToge1xuICAgICRkaXNhYmxlZDogYm9vbGVhbjtcbiAgICAkaW52YWxpZDogYm9vbGVhbjtcbiAgICAkcmVzaXphYmxlOiBib29sZWFuO1xuICAgICRyZWFkT25seTogYm9vbGVhbjtcbiAgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImlubGluZS1ibG9ja1wiLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuXG4gICAgW2AmOmhvdmVyIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LmhvdmVyQ29sb3IsXG4gICAgfSxcblxuICAgIFtgJjpmb2N1cy13aXRoaW4gLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcixcbiAgICB9LFxuXG4gICAgLi4uKCRyZXNpemFibGUgJiYge1xuICAgICAgd2lkdGg6IFwiYXV0b1wiLFxuICAgIH0pLFxuXG4gICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICBbYCYgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIixcbiAgICAgIH0sXG5cbiAgICAgIFtgJjpob3ZlciAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgfSxcblxuICAgICAgW2AmOmZvY3VzLXdpdGhpbiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgfSxcbiAgICB9KSxcblxuICAgIC4uLigkZGlzYWJsZWQgJiYge1xuICAgICAgW2AmIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzQsXG4gICAgICB9LFxuXG4gICAgICBbYCY6aG92ZXIgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vNCxcbiAgICAgIH0sXG4gICAgfSksXG5cbiAgICAuLi4oJGludmFsaWQgJiYge1xuICAgICAgXCImOm5vdCguZGlzYWJsZWQpXCI6IHtcbiAgICAgICAgW2AmIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbiAgICAgICAgfSxcblxuICAgICAgICBbYCY6aG92ZXIgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICAgICAgICB9LFxuICAgICAgfSxcbiAgICB9KSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHdpZHRoOiBcImNhbGMoMTAwJSAtIDRweClcIixcbiAgaGVpZ2h0OiB0aGVtZS5iYXNlSW5wdXQudW5kZXJsaW5lSGVpZ2h0LFxuICB0b3A6IFwiMzFweFwiLFxuICBsZWZ0OiBcIjJweFwiLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vNCxcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoXG4gIE11aUlucHV0LFxuICB0cmFuc2llbnRPcHRpb25zXG4pKFxuICAoe1xuICAgICRyZXNpemFibGUsXG4gICAgJGRpc2FibGVkLFxuICAgICRyZWFkT25seSxcbiAgICAkaW52YWxpZCxcbiAgfToge1xuICAgICRyZXNpemFibGU6IGJvb2xlYW47XG4gICAgJGRpc2FibGVkOiBib29sZWFuO1xuICAgICRyZWFkT25seTogYm9vbGVhbjtcbiAgICAkaW52YWxpZDogYm9vbGVhbjtcbiAgfSkgPT4gKHtcbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMucm9vdH1gXToge1xuICAgICAgbWFyZ2luOiAwLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5yYWRpaS5iYXNlLFxuICAgICAgaGVpZ2h0OiBcIjMycHhcIixcbiAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5ib3JkZXJDb2xvcn1gLFxuICAgICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gICAgICAuLi4oJGludmFsaWQgJiYge1xuICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICAgICAgfSksXG5cbiAgICAgIC4uLigkcmVhZE9ubHkgJiYge1xuICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3IsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5QmFja2dyb3VuZENvbG9yLFxuICAgICAgfSksXG5cbiAgICAgIFtgJjpob3Zlcjpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZH0pOm5vdCguJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Um9vdEludmFsaWR9KTpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seX0pYF06XG4gICAgICAgIHtcbiAgICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuYmFzZUlucHV0LmhvdmVyQ29sb3IsXG4gICAgICAgIH0sXG5cbiAgICAgIFtgJjpob3Zlcjpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZH0pOjpiZWZvcmVgXToge1xuICAgICAgICBib3JkZXJCb3R0b206IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgXCImOjpiZWZvcmVcIjoge1xuICAgICAgICBib3JkZXJCb3R0b206IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgIGJvcmRlckJvdHRvbTogXCJub25lXCIsXG4gICAgICB9LFxuICAgIH0sXG5cbiAgICBbYCYgLiR7TXVpSW5wdXRDbGFzc2VzLmlucHV0fWBdOiB7XG4gICAgICBtYXJnaW5MZWZ0OiB0aGVtZS5zcGFjZS54cyxcbiAgICAgIG1hcmdpblJpZ2h0OiB0aGVtZS5zcGFjZS54cyxcbiAgICAgIHBhZGRpbmc6IFwiNnB4IDAgNXB4XCIsXG4gICAgICBvdmVyZmxvdzogXCJoaWRkZW5cIixcbiAgICAgIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICAgICAgb3V0bGluZTogXCJub25lXCIsXG4gICAgICB3aWR0aDogXCJpbml0aWFsXCIsXG4gICAgICBmbGV4R3JvdzogMSxcbiAgICAgIC4uLih0aGVtZS50eXBvZ3JhcGh5LmJvZHkgYXMgQ1NTUHJvcGVydGllcyksXG5cbiAgICAgIFwiJjo6cGxhY2Vob2xkZXJcIjoge1xuICAgICAgICBvcGFjaXR5OiAxLFxuICAgICAgICBjb2xvcjogdGhlbWUuYmFzZUlucHV0LnBsYWNlaG9sZGVyQ29sb3IsXG4gICAgICB9LFxuXG4gICAgICBcIiY6Oi1tcy1jbGVhclwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgLi4uKCRyZXNpemFibGUgJiYge1xuICAgICAgICByZXNpemU6IFwiYm90aFwiLFxuICAgICAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgICB9KSxcblxuICAgICAgLi4uKCRkaXNhYmxlZCAmJiB7XG4gICAgICAgIGNvbG9yOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRUZXh0Q29sb3IsXG4gICAgICB9KSxcblxuICAgICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICAgIGNvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlUZXh0Q29sb3IsXG4gICAgICB9KSxcbiAgICB9LFxuXG4gICAgW2AmLiR7TXVpSW5wdXRDbGFzc2VzLmZvY3VzZWR9YF06IHtcbiAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgIC4uLm91dGxpbmVTdHlsZXMsXG5cbiAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgIH0sXG5cbiAgICAgIFtgJi4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRSb290UmVhZE9ubHl9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICB9LFxuICAgIH0sXG5cbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMuZGlzYWJsZWR9YF06IHtcbiAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJhY2tncm91bmRDb2xvcixcbiAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRCb3JkZXJDb2xvcixcbiAgICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuXG4gICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuICAgICAgfSxcblxuICAgICAgXCImJjo6YmVmb3JlXCI6IHtcbiAgICAgICAgYm9yZGVyQm90dG9tU3R5bGU6IFwibm9uZVwiLFxuICAgICAgfSxcbiAgICB9LFxuXG4gICAgW2AmLiR7TXVpSW5wdXRDbGFzc2VzLm11bHRpbGluZX1gXToge1xuICAgICAgcGFkZGluZzogMCxcbiAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICAgIGhlaWdodDogXCJhdXRvXCIsXG5cbiAgICAgIFtgJiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0fWBdOiB7XG4gICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVCb3JkZXJDb2xvcn1gLFxuICAgICAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnJhZGlpLmJhc2UsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgICBoZWlnaHQ6IFwiYXV0b1wiLFxuICAgICAgICBtaW5IZWlnaHQ6IFwiMjFweFwiLFxuICAgICAgICBwYWRkaW5nOiBcIjVweCAxMHB4XCIsXG4gICAgICAgIG92ZXJmbG93OiBcImF1dG9cIixcbiAgICAgICAgbWFyZ2luTGVmdDogXCIwcHhcIixcbiAgICAgICAgbWFyZ2luUmlnaHQ6IFwiMHB4XCIsXG5cbiAgICAgICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcn1gLFxuICAgICAgICB9LFxuXG4gICAgICAgIC4uLigkZGlzYWJsZWQgJiYge1xuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LmRpc2FibGVkQmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVEaXNhYmxlZEJvcmRlckNvbG9yfWAsXG5cbiAgICAgICAgICBcIjpob3ZlclwiOiB7XG4gICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJhY2tncm91bmRDb2xvcixcbiAgICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVEaXNhYmxlZEJvcmRlckNvbG9yfWAsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG5cbiAgICAgICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5yZWFkT25seUJhY2tncm91bmRDb2xvcixcblxuICAgICAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCb3JkZXJDb2xvcn1gLFxuICAgICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgfSxcblxuICAgICAgICAgIFwiJjpmb2N1cy13aXRoaW5cIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5QmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIH0sXG4gICAgICAgIH0pLFxuXG4gICAgICAgIC4uLigkaW52YWxpZCAmJiB7XG4gICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG5cbiAgICAgICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG4gICAgICAgICAgfSxcblxuICAgICAgICAgIFwiJjpmb2N1cy13aXRoaW5cIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuIl19 */");
-const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "production" ? _extends({}, {
-  target: "e8ibl7d0"
-}, transientOptions) : _extends({}, {
-  target: "e8ibl7d0",
-  label: "StyledInput"
-}, transientOptions))(({
-  $resizable,
-  $disabled,
-  $readOnly,
-  $invalid
-}) => ({
-  [`&.${inputClasses.root}`]: {
+  },
+  resizable: {
+    width: "auto"
+  },
+  readOnly: {
+    [`& .${baseInputClasses.inputBorderContainer}`]: {
+      backgroundColor: "transparent"
+    },
+    [`&:hover .${baseInputClasses.inputBorderContainer}`]: {
+      backgroundColor: "transparent"
+    },
+    [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {
+      backgroundColor: "transparent"
+    },
+    [`& .${baseInputClasses.inputRootMultiline}`]: {
+      [`& .${baseInputClasses.input}`]: {
+        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
+        backgroundColor: theme.baseInput.readOnlyBackgroundColor
+      }
+    },
+    [`&:hover .${baseInputClasses.inputRootMultiline}`]: {
+      [`& .${baseInputClasses.input}`]: {
+        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
+        backgroundColor: theme.baseInput.readOnlyBackgroundColor
+      }
+    },
+    [`&:focus-within .${baseInputClasses.inputRootMultiline}`]: {
+      [`& .${baseInputClasses.input}`]: {
+        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
+        backgroundColor: theme.baseInput.readOnlyBackgroundColor
+      }
+    }
+  },
+  inputBorderContainer: {
+    position: "absolute",
+    width: "calc(100% - 4px)",
+    height: theme.baseInput.underlineHeight,
+    top: "31px",
+    left: "2px",
+    backgroundColor: theme.colors.atmo4
+  },
+  inputRootInvalid: {
+    borderColor: theme.colors.negative
+  },
+  inputRootReadOnly: {
+    borderColor: theme.baseInput.readOnlyBorderColor,
+    backgroundColor: theme.baseInput.readOnlyBackgroundColor
+  },
+  inputRoot: {
     margin: 0,
     width: "100%",
     borderRadius: theme.radii.base,
@@ -104,13 +114,6 @@ const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "pro
     boxSizing: "border-box",
     backgroundColor: theme.colors.atmo1,
     fontFamily: theme.fontFamily.body,
-    ...$invalid && {
-      borderColor: theme.colors.negative
-    },
-    ...$readOnly && {
-      borderColor: theme.baseInput.readOnlyBorderColor,
-      backgroundColor: theme.baseInput.readOnlyBackgroundColor
-    },
     [`&:hover:not(.${baseInputClasses.inputRootDisabled}):not(.${baseInputClasses.inputRootInvalid}):not(.${baseInputClasses.inputRootReadOnly})`]: {
       borderColor: theme.baseInput.hoverColor
     },
@@ -124,35 +127,7 @@ const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "pro
       borderBottom: "none"
     }
   },
-  [`& .${inputClasses.input}`]: {
-    marginLeft: theme.space.xs,
-    marginRight: theme.space.xs,
-    padding: "6px 0 5px",
-    overflow: "hidden",
-    textOverflow: "ellipsis",
-    outline: "none",
-    width: "initial",
-    flexGrow: 1,
-    ...theme.typography.body,
-    "&::placeholder": {
-      opacity: 1,
-      color: theme.baseInput.placeholderColor
-    },
-    "&::-ms-clear": {
-      display: "none"
-    },
-    ...$resizable && {
-      resize: "both",
-      width: "100%"
-    },
-    ...$disabled && {
-      color: theme.baseInput.disabledTextColor
-    },
-    ...$readOnly && {
-      color: theme.baseInput.readOnlyTextColor
-    }
-  },
-  [`&.${inputClasses.focused}`]: {
+  inputRootFocused: {
     background: theme.colors.atmo1,
     ...outlineStyles,
     "&:hover": {
@@ -162,7 +137,7 @@ const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "pro
       backgroundColor: theme.baseInput.readOnlyBackgroundColor
     }
   },
-  [`&.${inputClasses.disabled}`]: {
+  inputRootDisabled: {
     background: theme.baseInput.disabledBackgroundColor,
     borderColor: theme.baseInput.disabledBorderColor,
     cursor: "not-allowed",
@@ -174,7 +149,7 @@ const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "pro
       borderBottomStyle: "none"
     }
   },
-  [`&.${inputClasses.multiline}`]: {
+  inputRootMultiline: {
     padding: 0,
     backgroundColor: "transparent",
     overflow: "auto",
@@ -192,42 +167,40 @@ const StyledInput = /* @__PURE__ */ _styled(Input, process.env.NODE_ENV === "pro
       marginRight: "0px",
       "&:hover": {
         border: `1px solid ${theme.baseInput.hoverColor}`
-      },
-      ...$disabled && {
-        backgroundColor: theme.baseInput.disabledBackgroundColor,
-        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,
-        ":hover": {
-          backgroundColor: theme.baseInput.disabledBackgroundColor,
-          border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`
-        }
-      },
-      ...$readOnly && {
-        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
-        backgroundColor: theme.baseInput.readOnlyBackgroundColor,
-        "&:hover": {
-          border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
-          backgroundColor: theme.baseInput.readOnlyBackgroundColor
-        },
-        "&:focus-within": {
-          border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,
-          backgroundColor: theme.baseInput.readOnlyBackgroundColor
-        }
-      },
-      ...$invalid && {
-        border: `1px solid ${theme.colors.negative}`,
-        "&:hover": {
-          border: `1px solid ${theme.colors.negative}`
-        },
-        "&:focus-within": {
-          border: `1px solid ${theme.colors.negative}`
-        }
       }
     }
+  },
+  input: {
+    height: "19px",
+    marginLeft: theme.space.xs,
+    marginRight: theme.space.xs,
+    padding: "6px 0 5px",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    outline: "none",
+    width: "initial",
+    flexGrow: 1,
+    ...theme.typography.body,
+    "&::placeholder": {
+      opacity: 1,
+      color: theme.baseInput.placeholderColor
+    },
+    "&::-ms-clear": {
+      display: "none"
+    }
+  },
+  inputDisabled: {
+    color: theme.baseInput.disabledTextColor
+  },
+  inputReadOnly: {
+    color: theme.baseInput.readOnlyTextColor
+  },
+  inputResizable: {
+    resize: "both",
+    width: "100%"
   }
-}), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC5zdHlsZXMudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlGMkIiLCJmaWxlIjoiL2hvbWUvcnVubmVyL3dvcmsvaHYtdWlraXQtcmVhY3QvaHYtdWlraXQtcmVhY3QvcGFja2FnZXMvY29yZS9zcmMvY29tcG9uZW50cy9CYXNlSW5wdXQvQmFzZUlucHV0LnN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7XG4gIElucHV0IGFzIE11aUlucHV0LFxuICBpbnB1dENsYXNzZXMgYXMgTXVpSW5wdXRDbGFzc2VzLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgdHJhbnNpZW50T3B0aW9ucyB9IGZyb20gXCJAY29yZS91dGlscy90cmFuc2llbnRPcHRpb25zXCI7XG5pbXBvcnQgeyBvdXRsaW5lU3R5bGVzIH0gZnJvbSBcIkBjb3JlL3V0aWxzXCI7XG5pbXBvcnQgYmFzZUlucHV0Q2xhc3NlcyBmcm9tIFwiLi9iYXNlSW5wdXRDbGFzc2VzXCI7XG5pbXBvcnQgeyBDU1NQcm9wZXJ0aWVzIH0gZnJvbSBcInJlYWN0XCI7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRSb290ID0gc3R5bGVkKFxuICBcImRpdlwiLFxuICB0cmFuc2llbnRPcHRpb25zXG4pKFxuICAoe1xuICAgICRkaXNhYmxlZCxcbiAgICAkaW52YWxpZCxcbiAgICAkcmVzaXphYmxlLFxuICAgICRyZWFkT25seSxcbiAgfToge1xuICAgICRkaXNhYmxlZDogYm9vbGVhbjtcbiAgICAkaW52YWxpZDogYm9vbGVhbjtcbiAgICAkcmVzaXphYmxlOiBib29sZWFuO1xuICAgICRyZWFkT25seTogYm9vbGVhbjtcbiAgfSkgPT4gKHtcbiAgICBkaXNwbGF5OiBcImlubGluZS1ibG9ja1wiLFxuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBwb3NpdGlvbjogXCJyZWxhdGl2ZVwiLFxuXG4gICAgW2AmOmhvdmVyIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LmhvdmVyQ29sb3IsXG4gICAgfSxcblxuICAgIFtgJjpmb2N1cy13aXRoaW4gLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcixcbiAgICB9LFxuXG4gICAgLi4uKCRyZXNpemFibGUgJiYge1xuICAgICAgd2lkdGg6IFwiYXV0b1wiLFxuICAgIH0pLFxuXG4gICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICBbYCYgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIixcbiAgICAgIH0sXG5cbiAgICAgIFtgJjpob3ZlciAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgfSxcblxuICAgICAgW2AmOmZvY3VzLXdpdGhpbiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Qm9yZGVyQ29udGFpbmVyfWBdOiB7XG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgfSxcbiAgICB9KSxcblxuICAgIC4uLigkZGlzYWJsZWQgJiYge1xuICAgICAgW2AmIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5jb2xvcnMuYXRtbzQsXG4gICAgICB9LFxuXG4gICAgICBbYCY6aG92ZXIgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vNCxcbiAgICAgIH0sXG4gICAgfSksXG5cbiAgICAuLi4oJGludmFsaWQgJiYge1xuICAgICAgXCImOm5vdCguZGlzYWJsZWQpXCI6IHtcbiAgICAgICAgW2AmIC4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRCb3JkZXJDb250YWluZXJ9YF06IHtcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5uZWdhdGl2ZSxcbiAgICAgICAgfSxcblxuICAgICAgICBbYCY6aG92ZXIgLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn1gXToge1xuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICAgICAgICB9LFxuICAgICAgfSxcbiAgICB9KSxcbiAgfSlcbik7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRJbnB1dEJvcmRlckNvbnRhaW5lciA9IHN0eWxlZChcImRpdlwiKSh7XG4gIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gIHdpZHRoOiBcImNhbGMoMTAwJSAtIDRweClcIixcbiAgaGVpZ2h0OiB0aGVtZS5iYXNlSW5wdXQudW5kZXJsaW5lSGVpZ2h0LFxuICB0b3A6IFwiMzFweFwiLFxuICBsZWZ0OiBcIjJweFwiLFxuICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmNvbG9ycy5hdG1vNCxcbn0pO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkSW5wdXQgPSBzdHlsZWQoXG4gIE11aUlucHV0LFxuICB0cmFuc2llbnRPcHRpb25zXG4pKFxuICAoe1xuICAgICRyZXNpemFibGUsXG4gICAgJGRpc2FibGVkLFxuICAgICRyZWFkT25seSxcbiAgICAkaW52YWxpZCxcbiAgfToge1xuICAgICRyZXNpemFibGU6IGJvb2xlYW47XG4gICAgJGRpc2FibGVkOiBib29sZWFuO1xuICAgICRyZWFkT25seTogYm9vbGVhbjtcbiAgICAkaW52YWxpZDogYm9vbGVhbjtcbiAgfSkgPT4gKHtcbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMucm9vdH1gXToge1xuICAgICAgbWFyZ2luOiAwLFxuICAgICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgICAgYm9yZGVyUmFkaXVzOiB0aGVtZS5yYWRpaS5iYXNlLFxuICAgICAgaGVpZ2h0OiBcIjMycHhcIixcbiAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5ib3JkZXJDb2xvcn1gLFxuICAgICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgZm9udEZhbWlseTogdGhlbWUuZm9udEZhbWlseS5ib2R5LFxuXG4gICAgICAuLi4oJGludmFsaWQgJiYge1xuICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuY29sb3JzLm5lZ2F0aXZlLFxuICAgICAgfSksXG5cbiAgICAgIC4uLigkcmVhZE9ubHkgJiYge1xuICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3IsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5QmFja2dyb3VuZENvbG9yLFxuICAgICAgfSksXG5cbiAgICAgIFtgJjpob3Zlcjpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZH0pOm5vdCguJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0Um9vdEludmFsaWR9KTpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seX0pYF06XG4gICAgICAgIHtcbiAgICAgICAgICBib3JkZXJDb2xvcjogdGhlbWUuYmFzZUlucHV0LmhvdmVyQ29sb3IsXG4gICAgICAgIH0sXG5cbiAgICAgIFtgJjpob3Zlcjpub3QoLiR7YmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3REaXNhYmxlZH0pOjpiZWZvcmVgXToge1xuICAgICAgICBib3JkZXJCb3R0b206IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgXCImOjpiZWZvcmVcIjoge1xuICAgICAgICBib3JkZXJCb3R0b206IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgXCImOjphZnRlclwiOiB7XG4gICAgICAgIGJvcmRlckJvdHRvbTogXCJub25lXCIsXG4gICAgICB9LFxuICAgIH0sXG5cbiAgICBbYCYgLiR7TXVpSW5wdXRDbGFzc2VzLmlucHV0fWBdOiB7XG4gICAgICBtYXJnaW5MZWZ0OiB0aGVtZS5zcGFjZS54cyxcbiAgICAgIG1hcmdpblJpZ2h0OiB0aGVtZS5zcGFjZS54cyxcbiAgICAgIHBhZGRpbmc6IFwiNnB4IDAgNXB4XCIsXG4gICAgICBvdmVyZmxvdzogXCJoaWRkZW5cIixcbiAgICAgIHRleHRPdmVyZmxvdzogXCJlbGxpcHNpc1wiLFxuICAgICAgb3V0bGluZTogXCJub25lXCIsXG4gICAgICB3aWR0aDogXCJpbml0aWFsXCIsXG4gICAgICBmbGV4R3JvdzogMSxcbiAgICAgIC4uLih0aGVtZS50eXBvZ3JhcGh5LmJvZHkgYXMgQ1NTUHJvcGVydGllcyksXG5cbiAgICAgIFwiJjo6cGxhY2Vob2xkZXJcIjoge1xuICAgICAgICBvcGFjaXR5OiAxLFxuICAgICAgICBjb2xvcjogdGhlbWUuYmFzZUlucHV0LnBsYWNlaG9sZGVyQ29sb3IsXG4gICAgICB9LFxuXG4gICAgICBcIiY6Oi1tcy1jbGVhclwiOiB7XG4gICAgICAgIGRpc3BsYXk6IFwibm9uZVwiLFxuICAgICAgfSxcblxuICAgICAgLi4uKCRyZXNpemFibGUgJiYge1xuICAgICAgICByZXNpemU6IFwiYm90aFwiLFxuICAgICAgICB3aWR0aDogXCIxMDAlXCIsXG4gICAgICB9KSxcblxuICAgICAgLi4uKCRkaXNhYmxlZCAmJiB7XG4gICAgICAgIGNvbG9yOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRUZXh0Q29sb3IsXG4gICAgICB9KSxcblxuICAgICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICAgIGNvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlUZXh0Q29sb3IsXG4gICAgICB9KSxcbiAgICB9LFxuXG4gICAgW2AmLiR7TXVpSW5wdXRDbGFzc2VzLmZvY3VzZWR9YF06IHtcbiAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgIC4uLm91dGxpbmVTdHlsZXMsXG5cbiAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmNvbG9ycy5hdG1vMSxcbiAgICAgIH0sXG5cbiAgICAgIFtgJi4ke2Jhc2VJbnB1dENsYXNzZXMuaW5wdXRSb290UmVhZE9ubHl9YF06IHtcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICB9LFxuICAgIH0sXG5cbiAgICBbYCYuJHtNdWlJbnB1dENsYXNzZXMuZGlzYWJsZWR9YF06IHtcbiAgICAgIGJhY2tncm91bmQ6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJhY2tncm91bmRDb2xvcixcbiAgICAgIGJvcmRlckNvbG9yOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRCb3JkZXJDb2xvcixcbiAgICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuXG4gICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICBiYWNrZ3JvdW5kOiB0aGVtZS5iYXNlSW5wdXQuZGlzYWJsZWRCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgIGN1cnNvcjogXCJub3QtYWxsb3dlZFwiLFxuICAgICAgfSxcblxuICAgICAgXCImJjo6YmVmb3JlXCI6IHtcbiAgICAgICAgYm9yZGVyQm90dG9tU3R5bGU6IFwibm9uZVwiLFxuICAgICAgfSxcbiAgICB9LFxuXG4gICAgW2AmLiR7TXVpSW5wdXRDbGFzc2VzLm11bHRpbGluZX1gXToge1xuICAgICAgcGFkZGluZzogMCxcbiAgICAgIGJhY2tncm91bmRDb2xvcjogXCJ0cmFuc3BhcmVudFwiLFxuICAgICAgb3ZlcmZsb3c6IFwiYXV0b1wiLFxuICAgICAgYm9yZGVyOiBcIm5vbmVcIixcbiAgICAgIGhlaWdodDogXCJhdXRvXCIsXG5cbiAgICAgIFtgJiAuJHtiYXNlSW5wdXRDbGFzc2VzLmlucHV0fWBdOiB7XG4gICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVCb3JkZXJDb2xvcn1gLFxuICAgICAgICBib3JkZXJSYWRpdXM6IHRoZW1lLnJhZGlpLmJhc2UsXG4gICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuY29sb3JzLmF0bW8xLFxuICAgICAgICBoZWlnaHQ6IFwiYXV0b1wiLFxuICAgICAgICBtaW5IZWlnaHQ6IFwiMjFweFwiLFxuICAgICAgICBwYWRkaW5nOiBcIjVweCAxMHB4XCIsXG4gICAgICAgIG92ZXJmbG93OiBcImF1dG9cIixcbiAgICAgICAgbWFyZ2luTGVmdDogXCIwcHhcIixcbiAgICAgICAgbWFyZ2luUmlnaHQ6IFwiMHB4XCIsXG5cbiAgICAgICAgXCImOmhvdmVyXCI6IHtcbiAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQuaG92ZXJDb2xvcn1gLFxuICAgICAgICB9LFxuXG4gICAgICAgIC4uLigkZGlzYWJsZWQgJiYge1xuICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LmRpc2FibGVkQmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVEaXNhYmxlZEJvcmRlckNvbG9yfWAsXG5cbiAgICAgICAgICBcIjpob3ZlclwiOiB7XG4gICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5kaXNhYmxlZEJhY2tncm91bmRDb2xvcixcbiAgICAgICAgICAgIGJvcmRlcjogYDFweCBzb2xpZCAke3RoZW1lLmJhc2VJbnB1dC5tdWx0aWxpbmVEaXNhYmxlZEJvcmRlckNvbG9yfWAsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG5cbiAgICAgICAgLi4uKCRyZWFkT25seSAmJiB7XG4gICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHRoZW1lLmJhc2VJbnB1dC5yZWFkT25seUJhY2tncm91bmRDb2xvcixcblxuICAgICAgICAgIFwiJjpob3ZlclwiOiB7XG4gICAgICAgICAgICBib3JkZXI6IGAxcHggc29saWQgJHt0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCb3JkZXJDb2xvcn1gLFxuICAgICAgICAgICAgYmFja2dyb3VuZENvbG9yOiB0aGVtZS5iYXNlSW5wdXQucmVhZE9ubHlCYWNrZ3JvdW5kQ29sb3IsXG4gICAgICAgICAgfSxcblxuICAgICAgICAgIFwiJjpmb2N1cy13aXRoaW5cIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5Qm9yZGVyQ29sb3J9YCxcbiAgICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogdGhlbWUuYmFzZUlucHV0LnJlYWRPbmx5QmFja2dyb3VuZENvbG9yLFxuICAgICAgICAgIH0sXG4gICAgICAgIH0pLFxuXG4gICAgICAgIC4uLigkaW52YWxpZCAmJiB7XG4gICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG5cbiAgICAgICAgICBcIiY6aG92ZXJcIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG4gICAgICAgICAgfSxcblxuICAgICAgICAgIFwiJjpmb2N1cy13aXRoaW5cIjoge1xuICAgICAgICAgICAgYm9yZGVyOiBgMXB4IHNvbGlkICR7dGhlbWUuY29sb3JzLm5lZ2F0aXZlfWAsXG4gICAgICAgICAgfSxcbiAgICAgICAgfSksXG4gICAgICB9LFxuICAgIH0sXG4gIH0pXG4pO1xuIl19 */");
+};
 export {
-  StyledInput,
-  StyledInputBorderContainer,
-  StyledRoot
+  styles
 };
 //# sourceMappingURL=BaseInput.styles.js.map

package/dist/esm/components/BaseInput/BaseInput.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseInput.styles.js","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport {\n  Input as MuiInput,\n  inputClasses as MuiInputClasses,\n} from \"@mui/material\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { transientOptions } from \"@core/utils/transientOptions\";\nimport { outlineStyles } from \"@core/utils\";\nimport baseInputClasses from \"./baseInputClasses\";\nimport { CSSProperties } from \"react\";\n\nexport const StyledRoot = styled(\n  \"div\",\n  transientOptions\n)(\n  ({\n    $disabled,\n    $invalid,\n    $resizable,\n    $readOnly,\n  }: {\n    $disabled: boolean;\n    $invalid: boolean;\n    $resizable: boolean;\n    $readOnly: boolean;\n  }) => ({\n    display: \"inline-block\",\n    width: \"100%\",\n    position: \"relative\",\n\n    [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n\n    [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n\n    ...($resizable && {\n      width: \"auto\",\n    }),\n\n    ...($readOnly && {\n      [`& .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: \"transparent\",\n      },\n\n      [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: \"transparent\",\n      },\n\n      [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: \"transparent\",\n      },\n    }),\n\n    ...($disabled && {\n      [`& .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: theme.colors.atmo4,\n      },\n\n      [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: theme.colors.atmo4,\n      },\n    }),\n\n    ...($invalid && {\n      \"&:not(.disabled)\": {\n        [`& .${baseInputClasses.inputBorderContainer}`]: {\n          backgroundColor: theme.colors.negative,\n        },\n\n        [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n          backgroundColor: theme.colors.negative,\n        },\n      },\n    }),\n  })\n);\n\nexport const StyledInputBorderContainer = styled(\"div\")({\n  position: \"absolute\",\n  width: \"calc(100% - 4px)\",\n  height: theme.baseInput.underlineHeight,\n  top: \"31px\",\n  left: \"2px\",\n  backgroundColor: theme.colors.atmo4,\n});\n\nexport const StyledInput = styled(\n  MuiInput,\n  transientOptions\n)(\n  ({\n    $resizable,\n    $disabled,\n    $readOnly,\n    $invalid,\n  }: {\n    $resizable: boolean;\n    $disabled: boolean;\n    $readOnly: boolean;\n    $invalid: boolean;\n  }) => ({\n    [`&.${MuiInputClasses.root}`]: {\n      margin: 0,\n      width: \"100%\",\n      borderRadius: theme.radii.base,\n      height: \"32px\",\n      border: `1px solid ${theme.baseInput.borderColor}`,\n      boxSizing: \"border-box\",\n      backgroundColor: theme.colors.atmo1,\n      fontFamily: theme.fontFamily.body,\n\n      ...($invalid && {\n        borderColor: theme.colors.negative,\n      }),\n\n      ...($readOnly && {\n        borderColor: theme.baseInput.readOnlyBorderColor,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      }),\n\n      [`&:hover:not(.${baseInputClasses.inputRootDisabled}):not(.${baseInputClasses.inputRootInvalid}):not(.${baseInputClasses.inputRootReadOnly})`]:\n        {\n          borderColor: theme.baseInput.hoverColor,\n        },\n\n      [`&:hover:not(.${baseInputClasses.inputRootDisabled})::before`]: {\n        borderBottom: \"none\",\n      },\n\n      \"&::before\": {\n        borderBottom: \"none\",\n      },\n\n      \"&::after\": {\n        borderBottom: \"none\",\n      },\n    },\n\n    [`& .${MuiInputClasses.input}`]: {\n      marginLeft: theme.space.xs,\n      marginRight: theme.space.xs,\n      padding: \"6px 0 5px\",\n      overflow: \"hidden\",\n      textOverflow: \"ellipsis\",\n      outline: \"none\",\n      width: \"initial\",\n      flexGrow: 1,\n      ...(theme.typography.body as CSSProperties),\n\n      \"&::placeholder\": {\n        opacity: 1,\n        color: theme.baseInput.placeholderColor,\n      },\n\n      \"&::-ms-clear\": {\n        display: \"none\",\n      },\n\n      ...($resizable && {\n        resize: \"both\",\n        width: \"100%\",\n      }),\n\n      ...($disabled && {\n        color: theme.baseInput.disabledTextColor,\n      }),\n\n      ...($readOnly && {\n        color: theme.baseInput.readOnlyTextColor,\n      }),\n    },\n\n    [`&.${MuiInputClasses.focused}`]: {\n      background: theme.colors.atmo1,\n      ...outlineStyles,\n\n      \"&:hover\": {\n        background: theme.colors.atmo1,\n      },\n\n      [`&.${baseInputClasses.inputRootReadOnly}`]: {\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n\n    [`&.${MuiInputClasses.disabled}`]: {\n      background: theme.baseInput.disabledBackgroundColor,\n      borderColor: theme.baseInput.disabledBorderColor,\n      cursor: \"not-allowed\",\n\n      \"&:hover\": {\n        background: theme.baseInput.disabledBackgroundColor,\n        cursor: \"not-allowed\",\n      },\n\n      \"&&::before\": {\n        borderBottomStyle: \"none\",\n      },\n    },\n\n    [`&.${MuiInputClasses.multiline}`]: {\n      padding: 0,\n      backgroundColor: \"transparent\",\n      overflow: \"auto\",\n      border: \"none\",\n      height: \"auto\",\n\n      [`& .${baseInputClasses.input}`]: {\n        border: `1px solid ${theme.baseInput.multilineBorderColor}`,\n        borderRadius: theme.radii.base,\n        backgroundColor: theme.colors.atmo1,\n        height: \"auto\",\n        minHeight: \"21px\",\n        padding: \"5px 10px\",\n        overflow: \"auto\",\n        marginLeft: \"0px\",\n        marginRight: \"0px\",\n\n        \"&:hover\": {\n          border: `1px solid ${theme.baseInput.hoverColor}`,\n        },\n\n        ...($disabled && {\n          backgroundColor: theme.baseInput.disabledBackgroundColor,\n          border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n\n          \":hover\": {\n            backgroundColor: theme.baseInput.disabledBackgroundColor,\n            border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n          },\n        }),\n\n        ...($readOnly && {\n          border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n          backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n\n          \"&:hover\": {\n            border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n            backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n          },\n\n          \"&:focus-within\": {\n            border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n            backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n          },\n        }),\n\n        ...($invalid && {\n          border: `1px solid ${theme.colors.negative}`,\n\n          \"&:hover\": {\n            border: `1px solid ${theme.colors.negative}`,\n          },\n\n          \"&:focus-within\": {\n            border: `1px solid ${theme.colors.negative}`,\n          },\n        }),\n      },\n    },\n  })\n);\n"],"names":["StyledRoot","process","env","NODE_ENV","_extends","target","transientOptions","label","$disabled","$invalid","$resizable","$readOnly","display","width","position","baseInputClasses","inputBorderContainer","backgroundColor","theme","baseInput","hoverColor","colors","atmo4","negative","StyledInputBorderContainer","height","underlineHeight","top","left","StyledInput","MuiInput","MuiInputClasses","root","margin","borderRadius","radii","base","border","borderColor","boxSizing","atmo1","fontFamily","body","readOnlyBorderColor","readOnlyBackgroundColor","inputRootDisabled","inputRootInvalid","inputRootReadOnly","borderBottom","input","marginLeft","space","xs","marginRight","padding","overflow","textOverflow","outline","flexGrow","typography","opacity","color","placeholderColor","resize","disabledTextColor","readOnlyTextColor","focused","background","outlineStyles","disabled","disabledBackgroundColor","disabledBorderColor","cursor","borderBottomStyle","multiline","multilineBorderColor","minHeight","multilineDisabledBorderColor"],"mappings":"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"}
+{"version":3,"file":"BaseInput.styles.js","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils\";\nimport baseInputClasses, { HvBaseInputClasses } from \"./baseInputClasses\";\nimport { CSSProperties } from \"react\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\n\nexport const styles: Partial<\n  Record<keyof HvBaseInputClasses, CSSInterpolation>\n> = {\n  root: {\n    display: \"inline-block\",\n    width: \"100%\",\n    position: \"relative\",\n\n    [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n\n    [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n  },\n  disabled: {\n    [`& .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.colors.atmo4,\n    },\n\n    [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: theme.colors.atmo4,\n    },\n\n    [`& .${baseInputClasses.inputRootMultiline}`]: {\n      [`& .${baseInputClasses.input}`]: {\n        backgroundColor: theme.baseInput.disabledBackgroundColor,\n        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n      },\n    },\n\n    [`&:hover .${baseInputClasses.inputRootMultiline}`]: {\n      [`& .${baseInputClasses.input}`]: {\n        backgroundColor: theme.baseInput.disabledBackgroundColor,\n        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n      },\n    },\n  },\n  invalid: {\n    \"&:not(.disabled)\": {\n      [`& .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: theme.colors.negative,\n      },\n\n      [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n        backgroundColor: theme.colors.negative,\n      },\n\n      [`& .${baseInputClasses.inputRootMultiline}`]: {\n        [`& .${baseInputClasses.input}`]: {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n\n      [`&:hover .${baseInputClasses.inputRootMultiline}`]: {\n        [`& .${baseInputClasses.input}`]: {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n\n      [`&:focus-within .${baseInputClasses.inputRootMultiline}`]: {\n        [`& .${baseInputClasses.input}`]: {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n    },\n  },\n  resizable: { width: \"auto\" },\n  readOnly: {\n    [`& .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: \"transparent\",\n    },\n\n    [`&:hover .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: \"transparent\",\n    },\n\n    [`&:focus-within .${baseInputClasses.inputBorderContainer}`]: {\n      backgroundColor: \"transparent\",\n    },\n\n    [`& .${baseInputClasses.inputRootMultiline}`]: {\n      [`& .${baseInputClasses.input}`]: {\n        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n\n    [`&:hover .${baseInputClasses.inputRootMultiline}`]: {\n      [`& .${baseInputClasses.input}`]: {\n        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n\n    [`&:focus-within .${baseInputClasses.inputRootMultiline}`]: {\n      [`& .${baseInputClasses.input}`]: {\n        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n  },\n  inputBorderContainer: {\n    position: \"absolute\",\n    width: \"calc(100% - 4px)\",\n    height: theme.baseInput.underlineHeight,\n    top: \"31px\",\n    left: \"2px\",\n    backgroundColor: theme.colors.atmo4,\n  },\n  inputRootInvalid: { borderColor: theme.colors.negative },\n  inputRootReadOnly: {\n    borderColor: theme.baseInput.readOnlyBorderColor,\n    backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n  },\n  inputRoot: {\n    margin: 0,\n    width: \"100%\",\n    borderRadius: theme.radii.base,\n    height: \"32px\",\n    border: `1px solid ${theme.baseInput.borderColor}`,\n    boxSizing: \"border-box\",\n    backgroundColor: theme.colors.atmo1,\n    fontFamily: theme.fontFamily.body,\n\n    [`&:hover:not(.${baseInputClasses.inputRootDisabled}):not(.${baseInputClasses.inputRootInvalid}):not(.${baseInputClasses.inputRootReadOnly})`]:\n      {\n        borderColor: theme.baseInput.hoverColor,\n      },\n\n    [`&:hover:not(.${baseInputClasses.inputRootDisabled})::before`]: {\n      borderBottom: \"none\",\n    },\n\n    \"&::before\": {\n      borderBottom: \"none\",\n    },\n\n    \"&::after\": {\n      borderBottom: \"none\",\n    },\n  },\n  inputRootFocused: {\n    background: theme.colors.atmo1,\n    ...outlineStyles,\n\n    \"&:hover\": {\n      background: theme.colors.atmo1,\n    },\n\n    [`&.${baseInputClasses.inputRootReadOnly}`]: {\n      backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n    },\n  },\n  inputRootDisabled: {\n    background: theme.baseInput.disabledBackgroundColor,\n    borderColor: theme.baseInput.disabledBorderColor,\n    cursor: \"not-allowed\",\n\n    \"&:hover\": {\n      background: theme.baseInput.disabledBackgroundColor,\n      cursor: \"not-allowed\",\n    },\n\n    \"&&::before\": {\n      borderBottomStyle: \"none\",\n    },\n  },\n  inputRootMultiline: {\n    padding: 0,\n    backgroundColor: \"transparent\",\n    overflow: \"auto\",\n    border: \"none\",\n    height: \"auto\",\n\n    [`& .${baseInputClasses.input}`]: {\n      border: `1px solid ${theme.baseInput.multilineBorderColor}`,\n      borderRadius: theme.radii.base,\n      backgroundColor: theme.colors.atmo1,\n      height: \"auto\",\n      minHeight: \"21px\",\n      padding: \"5px 10px\",\n      overflow: \"auto\",\n      marginLeft: \"0px\",\n      marginRight: \"0px\",\n\n      \"&:hover\": {\n        border: `1px solid ${theme.baseInput.hoverColor}`,\n      },\n    },\n  },\n  input: {\n    height: \"19px\",\n    marginLeft: theme.space.xs,\n    marginRight: theme.space.xs,\n    padding: \"6px 0 5px\",\n    overflow: \"hidden\",\n    textOverflow: \"ellipsis\",\n    outline: \"none\",\n    width: \"initial\",\n    flexGrow: 1,\n    ...(theme.typography.body as CSSProperties),\n\n    \"&::placeholder\": {\n      opacity: 1,\n      color: theme.baseInput.placeholderColor,\n    },\n\n    \"&::-ms-clear\": {\n      display: \"none\",\n    },\n  },\n  inputDisabled: {\n    color: theme.baseInput.disabledTextColor,\n  },\n  inputReadOnly: {\n    color: theme.baseInput.readOnlyTextColor,\n  },\n  inputResizable: { resize: \"both\", width: \"100%\" },\n};\n"],"names":["styles","root","display","width","position","baseInputClasses","inputBorderContainer","backgroundColor","theme","baseInput","hoverColor","disabled","colors","atmo4","inputRootMultiline","input","disabledBackgroundColor","border","multilineDisabledBorderColor","invalid","negative","resizable","readOnly","readOnlyBorderColor","readOnlyBackgroundColor","height","underlineHeight","top","left","inputRootInvalid","borderColor","inputRootReadOnly","inputRoot","margin","borderRadius","radii","base","boxSizing","atmo1","fontFamily","body","inputRootDisabled","borderBottom","inputRootFocused","background","outlineStyles","disabledBorderColor","cursor","borderBottomStyle","padding","overflow","multilineBorderColor","minHeight","marginLeft","marginRight","space","xs","textOverflow","outline","flexGrow","typography","opacity","color","placeholderColor","inputDisabled","disabledTextColor","inputReadOnly","readOnlyTextColor","inputResizable","resize"],"mappings":"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"}

package/dist/esm/components/Card/Card.js

@@ -1,4 +1,3 @@
-import { clsx } from "clsx";
 import { ClassNames } from "@emotion/react";
 import { theme } from "@hitachivantara/uikit-styles";
 import { styles } from "./Card.styles.js";
@@ -18,22 +17,23 @@ const HvCard = ({
 }) => {
   return /* @__PURE__ */ jsx(ClassNames, {
     children: ({
-      css
+      css,
+      cx
     }) => /* @__PURE__ */ jsxs(HvBox, {
       "aria-selected": selectable ? selected : void 0,
-      className: clsx(css(styles.root), css({
+      className: cx("HvIsCardGridElement", cardClasses.root, selectable && cardClasses.selectable, selected && cardClasses.selected, css(styles.root), css({
         backgroundColor: bgcolor && theme.colors[bgcolor] || theme.card.backgroundColor
-      }), "HvIsCardGridElement", cardClasses.root, classes == null ? void 0 : classes.root, className, selectable && clsx(css(styles.selectable), cardClasses.selectable, classes == null ? void 0 : classes.selectable), selected && clsx(css(styles.selected), cardClasses.selected, classes == null ? void 0 : classes.selected)),
+      }), selectable && css(styles.selectable), selected && css(styles.selected), className, classes == null ? void 0 : classes.root, selectable && css(styles.selectable), selected && css(styles.selected)),
       ...others,
       children: [/* @__PURE__ */ jsxs("div", {
-        className: clsx(css(styles.semanticContainer), cardClasses.semanticContainer, classes == null ? void 0 : classes.semanticContainer),
+        className: cx(cardClasses.semanticContainer, css(styles.semanticContainer), classes == null ? void 0 : classes.semanticContainer),
         children: [/* @__PURE__ */ jsx("div", {
-          className: clsx(css(styles.semanticBar), css({
+          className: cx(cardClasses.semanticBar, css(styles.semanticBar), css({
             height: selected ? 4 : 2,
             backgroundColor: statusColor === "sema0" ? selected ? theme.colors.secondary : theme.colors.atmo4 : theme.colors[statusColor]
-          }), cardClasses.semanticBar, classes == null ? void 0 : classes.semanticBar)
+          }), classes == null ? void 0 : classes.semanticBar)
         }), /* @__PURE__ */ jsx("div", {
-          className: clsx(css(styles.icon), cardClasses.icon, classes == null ? void 0 : classes.icon),
+          className: cx(cardClasses.icon, css(styles.icon), classes == null ? void 0 : classes.icon),
           children: icon
         })]
       }), children]

package/dist/esm/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvBox } from \"@core/components\";\nimport {\n  HvBaseProps,\n  HvAtmosphereColorKeys,\n  HvSemanticColorKeys,\n} from \"@core/types\";\nimport { styles } from \"./Card.styles\";\nimport cardClasses, { HvCardClasses } from \"./cardClasses\";\n\nexport interface HvCardProps extends HvBaseProps {\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** Whether the card is selectable. */\n  selectable?: boolean;\n  /** Whether the card is currently selected. */\n  selected?: boolean;\n  /** The background color of the card. */\n  bgcolor?:\n    | \"sema0\"\n    | HvSemanticColorKeys\n    | HvAtmosphereColorKeys\n    | \"transparent\";\n  /**\n   *  The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n   *  To set another color, the borderTop should be override.\n   */\n  statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = ({\n  classes,\n  className,\n  children,\n  icon,\n  selectable = false,\n  selected = false,\n  statusColor = \"sema0\",\n  bgcolor,\n  ...others\n}: HvCardProps) => {\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <HvBox\n          aria-selected={selectable ? selected : undefined}\n          className={clsx(\n            css(styles.root),\n            css({\n              backgroundColor:\n                (bgcolor && theme.colors[bgcolor]) ||\n                theme.card.backgroundColor,\n            }),\n            \"HvIsCardGridElement\",\n            cardClasses.root,\n            classes?.root,\n            className,\n            selectable &&\n              clsx(\n                css(styles.selectable),\n                cardClasses.selectable,\n                classes?.selectable\n              ),\n            selected &&\n              clsx(\n                css(styles.selected),\n                cardClasses.selected,\n                classes?.selected\n              )\n          )}\n          {...others}\n        >\n          <div\n            className={clsx(\n              css(styles.semanticContainer),\n              cardClasses.semanticContainer,\n              classes?.semanticContainer\n            )}\n          >\n            <div\n              className={clsx(\n                css(styles.semanticBar),\n                css({\n                  height: selected ? 4 : 2,\n                  backgroundColor:\n                    statusColor === \"sema0\"\n                      ? selected\n                        ? theme.colors.secondary\n                        : theme.colors.atmo4\n                      : theme.colors[statusColor],\n                }),\n                cardClasses.semanticBar,\n                classes?.semanticBar\n              )}\n            />\n            <div\n              className={clsx(\n                css(styles.icon),\n                cardClasses.icon,\n                classes?.icon\n              )}\n            >\n              {icon}\n            </div>\n          </div>\n          {children}\n        </HvBox>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvCard","classes","className","children","icon","selectable","selected","statusColor","bgcolor","others","ClassNames","css","HvBox","undefined","clsx","styles","root","backgroundColor","theme","colors","card","cardClasses","_jsxs","semanticContainer","_jsx","semanticBar","height","secondary","atmo4"],"mappings":";;;;;;;AAwCO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,aAAa;AAAA,EACbC,WAAW;AAAA,EACXC,cAAc;AAAA,EACdC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,6BACGC,YAAU;AAAA,IAAAP,UACRA,CAAC;AAAA,MAAEQ;AAAAA,IAAAA,2BACDC,OAAK;AAAA,MACJ,iBAAeP,aAAaC,WAAWO;AAAAA,MACvCX,WAAWY,KACTH,IAAII,OAAOC,IAAI,GACfL,IAAI;AAAA,QACFM,iBACGT,WAAWU,MAAMC,OAAOX,OAAO,KAChCU,MAAME,KAAKH;AAAAA,MACd,CAAA,GACD,uBACAI,YAAYL,MACZf,mCAASe,MACTd,WACAG,cACES,KACEH,IAAII,OAAOV,UAAU,GACrBgB,YAAYhB,YACZJ,mCAASI,UAAU,GAEvBC,YACEQ,KACEH,IAAII,OAAOT,QAAQ,GACnBe,YAAYf,UACZL,mCAASK,QAAQ,CAClB;AAAA,MACH,GACEG;AAAAA,MAAMN,WAEVmB,qBAAA,OAAA;AAAA,QACEpB,WAAWY,KACTH,IAAII,OAAOQ,iBAAiB,GAC5BF,YAAYE,mBACZtB,mCAASsB,iBAAiB;AAAA,QAC1BpB,WAEFqB,oBAAA,OAAA;AAAA,UACEtB,WAAWY,KACTH,IAAII,OAAOU,WAAW,GACtBd,IAAI;AAAA,YACFe,QAAQpB,WAAW,IAAI;AAAA,YACvBW,iBACEV,gBAAgB,UACZD,WACEY,MAAMC,OAAOQ,YACbT,MAAMC,OAAOS,QACfV,MAAMC,OAAOZ,WAAW;AAAA,UAC/B,CAAA,GACDc,YAAYI,aACZxB,mCAASwB,WAAW;AAAA,QAAA,CACpB,GAEJD,oBAAA,OAAA;AAAA,UACEtB,WAAWY,KACTH,IAAII,OAAOX,IAAI,GACfiB,YAAYjB,MACZH,mCAASG,IAAI;AAAA,UACbD,UAEDC;AAAAA,QAAAA,CACG,CAAA;AAAA,MAAA,CAAA,GAEPD,QAAQ;AAAA,IAAA,CAAA;AAAA,EAAA,CAGF;AAEjB;"}
+{"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvBox } from \"@core/components\";\nimport {\n  HvBaseProps,\n  HvAtmosphereColorKeys,\n  HvSemanticColorKeys,\n} from \"@core/types\";\nimport { styles } from \"./Card.styles\";\nimport cardClasses, { HvCardClasses } from \"./cardClasses\";\n\nexport interface HvCardProps extends HvBaseProps {\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** Whether the card is selectable. */\n  selectable?: boolean;\n  /** Whether the card is currently selected. */\n  selected?: boolean;\n  /** The background color of the card. */\n  bgcolor?:\n    | \"sema0\"\n    | HvSemanticColorKeys\n    | HvAtmosphereColorKeys\n    | \"transparent\";\n  /**\n   *  The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n   *  To set another color, the borderTop should be override.\n   */\n  statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = ({\n  classes,\n  className,\n  children,\n  icon,\n  selectable = false,\n  selected = false,\n  statusColor = \"sema0\",\n  bgcolor,\n  ...others\n}: HvCardProps) => {\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <HvBox\n          aria-selected={selectable ? selected : undefined}\n          className={cx(\n            \"HvIsCardGridElement\",\n            cardClasses.root,\n            selectable && cardClasses.selectable,\n            selected && cardClasses.selected,\n            css(styles.root),\n            css({\n              backgroundColor:\n                (bgcolor && theme.colors[bgcolor]) ||\n                theme.card.backgroundColor,\n            }),\n            selectable && css(styles.selectable),\n            selected && css(styles.selected),\n            className,\n            classes?.root,\n            selectable && css(styles.selectable),\n            selected && css(styles.selected)\n          )}\n          {...others}\n        >\n          <div\n            className={cx(\n              cardClasses.semanticContainer,\n              css(styles.semanticContainer),\n              classes?.semanticContainer\n            )}\n          >\n            <div\n              className={cx(\n                cardClasses.semanticBar,\n                css(styles.semanticBar),\n                css({\n                  height: selected ? 4 : 2,\n                  backgroundColor:\n                    statusColor === \"sema0\"\n                      ? selected\n                        ? theme.colors.secondary\n                        : theme.colors.atmo4\n                      : theme.colors[statusColor],\n                }),\n                classes?.semanticBar\n              )}\n            />\n            <div\n              className={cx(cardClasses.icon, css(styles.icon), classes?.icon)}\n            >\n              {icon}\n            </div>\n          </div>\n          {children}\n        </HvBox>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvCard","classes","className","children","icon","selectable","selected","statusColor","bgcolor","others","ClassNames","css","cx","HvBox","undefined","cardClasses","root","styles","backgroundColor","theme","colors","card","_jsxs","semanticContainer","_jsx","semanticBar","height","secondary","atmo4"],"mappings":";;;;;;AAuCO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,aAAa;AAAA,EACbC,WAAW;AAAA,EACXC,cAAc;AAAA,EACdC;AAAAA,EACA,GAAGC;AACQ,MAAM;AACjB,6BACGC,YAAU;AAAA,IAAAP,UACRA,CAAC;AAAA,MAAEQ;AAAAA,MAAKC;AAAAA,IAAAA,2BACNC,OAAK;AAAA,MACJ,iBAAeR,aAAaC,WAAWQ;AAAAA,MACvCZ,WAAWU,GACT,uBACAG,YAAYC,MACZX,cAAcU,YAAYV,YAC1BC,YAAYS,YAAYT,UACxBK,IAAIM,OAAOD,IAAI,GACfL,IAAI;AAAA,QACFO,iBACGV,WAAWW,MAAMC,OAAOZ,OAAO,KAChCW,MAAME,KAAKH;AAAAA,MAAAA,CACd,GACDb,cAAcM,IAAIM,OAAOZ,UAAU,GACnCC,YAAYK,IAAIM,OAAOX,QAAQ,GAC/BJ,WACAD,mCAASe,MACTX,cAAcM,IAAIM,OAAOZ,UAAU,GACnCC,YAAYK,IAAIM,OAAOX,QAAQ,CAAC;AAAA,MAChC,GACEG;AAAAA,MAAMN,WAEVmB,qBAAA,OAAA;AAAA,QACEpB,WAAWU,GACTG,YAAYQ,mBACZZ,IAAIM,OAAOM,iBAAiB,GAC5BtB,mCAASsB,iBAAiB;AAAA,QAC1BpB,WAEFqB,oBAAA,OAAA;AAAA,UACEtB,WAAWU,GACTG,YAAYU,aACZd,IAAIM,OAAOQ,WAAW,GACtBd,IAAI;AAAA,YACFe,QAAQpB,WAAW,IAAI;AAAA,YACvBY,iBACEX,gBAAgB,UACZD,WACEa,MAAMC,OAAOO,YACbR,MAAMC,OAAOQ,QACfT,MAAMC,OAAOb,WAAW;AAAA,UAAA,CAC/B,GACDN,mCAASwB,WAAW;AAAA,QAAA,CACpB,GAEJD,oBAAA,OAAA;AAAA,UACEtB,WAAWU,GAAGG,YAAYX,MAAMO,IAAIM,OAAOb,IAAI,GAAGH,mCAASG,IAAI;AAAA,UAAED,UAEhEC;AAAAA,QAAAA,CACG,CAAA;AAAA,MAAA,CAAA,GAEPD,QAAQ;AAAA,IAAA,CAAA;AAAA,EAAA,CAGF;AAEjB;"}

package/dist/esm/components/Card/Card.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.styles.js","sources":["../../../../src/components/Card/Card.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\n\nexport const styles: {\n  root: CSSInterpolation;\n  selected: CSSInterpolation;\n  selectable: CSSInterpolation;\n  semanticContainer: CSSInterpolation;\n  icon: CSSInterpolation;\n  semanticBar: CSSInterpolation;\n} = {\n  root: {\n    overflow: \"visible\",\n    position: \"relative\",\n    outline: theme.card.outline,\n    borderRadius: theme.card.borderRadius,\n    \"&.focus-visible\": {\n      ...outlineStyles,\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n  },\n  selected: {\n    outline: `1px solid ${theme.colors.secondary}`,\n    \"&:hover\": {\n      outline: `1px solid ${theme.colors.secondary}`,\n    },\n    \"&:focus\": {\n      outline: `1px solid ${theme.colors.secondary}`,\n    },\n  },\n  selectable: {\n    \"&:hover\": {\n      outline: `1px solid ${theme.card.hoverColor}`,\n    },\n  },\n  semanticContainer: {\n    position: \"relative\",\n    \"& > *\": {\n      position: \"absolute\",\n      zIndex: 1,\n    },\n  },\n  icon: {\n    top: `calc(${theme.card.iconMargin} + ${theme.space.xs})`,\n    right: `calc(${theme.card.iconMargin} + ${theme.space.xs})`,\n  },\n  semanticBar: {\n    width: \"100%\",\n    top: -1,\n    right: 0,\n  },\n};\n"],"names":["styles","root","overflow","position","outline","theme","card","borderRadius","outlineStyles","selected","colors","secondary","selectable","hoverColor","semanticContainer","zIndex","icon","top","iconMargin","space","xs","right","semanticBar","width"],"mappings":";;AAIO,MAAMA,SAOT;AAAA,EACFC,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,SAASC,MAAMC,KAAKF;AAAAA,IACpBG,cAAcF,MAAMC,KAAKC;AAAAA,IACzB,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,IACA,WAAW;AAAA,MACTJ,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACAK,UAAU;AAAA,IACRL,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACnC,WAAW;AAAA,MACTP,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACrC;AAAA,IACA,WAAW;AAAA,MACTP,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACrC;AAAA,EACF;AAAA,EACAC,YAAY;AAAA,IACV,WAAW;AAAA,MACTR,SAAU,aAAYC,MAAMC,KAAKO;AAAAA,IACnC;AAAA,EACF;AAAA,EACAC,mBAAmB;AAAA,IACjBX,UAAU;AAAA,IACV,SAAS;AAAA,MACPA,UAAU;AAAA,MACVY,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,MAAM;AAAA,IACJC,KAAM,QAAOZ,MAAMC,KAAKY,gBAAgBb,MAAMc,MAAMC;AAAAA,IACpDC,OAAQ,QAAOhB,MAAMC,KAAKY,gBAAgBb,MAAMc,MAAMC;AAAAA,EACxD;AAAA,EACAE,aAAa;AAAA,IACXC,OAAO;AAAA,IACPN,KAAK;AAAA,IACLI,OAAO;AAAA,EACT;AACF;"}
+{"version":3,"file":"Card.styles.js","sources":["../../../../src/components/Card/Card.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils/focusUtils\";\nimport { HvCardClasses } from \"./cardClasses\";\n\nexport const styles: Partial<Record<keyof HvCardClasses, CSSInterpolation>> = {\n  root: {\n    overflow: \"visible\",\n    position: \"relative\",\n    outline: theme.card.outline,\n    borderRadius: theme.card.borderRadius,\n    \"&.focus-visible\": {\n      ...outlineStyles,\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n  },\n  selected: {\n    outline: `1px solid ${theme.colors.secondary}`,\n    \"&:hover\": {\n      outline: `1px solid ${theme.colors.secondary}`,\n    },\n    \"&:focus\": {\n      outline: `1px solid ${theme.colors.secondary}`,\n    },\n  },\n  selectable: {\n    \"&:hover\": {\n      outline: `1px solid ${theme.card.hoverColor}`,\n    },\n  },\n  semanticContainer: {\n    position: \"relative\",\n    \"& > *\": {\n      position: \"absolute\",\n      zIndex: 1,\n    },\n  },\n  icon: {\n    top: `calc(${theme.card.iconMargin} + ${theme.space.xs})`,\n    right: `calc(${theme.card.iconMargin} + ${theme.space.xs})`,\n  },\n  semanticBar: {\n    width: \"100%\",\n    top: -1,\n    right: 0,\n  },\n};\n"],"names":["styles","root","overflow","position","outline","theme","card","borderRadius","outlineStyles","selected","colors","secondary","selectable","hoverColor","semanticContainer","zIndex","icon","top","iconMargin","space","xs","right","semanticBar","width"],"mappings":";;AAKO,MAAMA,SAAiE;AAAA,EAC5EC,MAAM;AAAA,IACJC,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,SAASC,MAAMC,KAAKF;AAAAA,IACpBG,cAAcF,MAAMC,KAAKC;AAAAA,IACzB,mBAAmB;AAAA,MACjB,GAAGC;AAAAA,IACL;AAAA,IACA,WAAW;AAAA,MACTJ,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACAK,UAAU;AAAA,IACRL,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACnC,WAAW;AAAA,MACTP,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACrC;AAAA,IACA,WAAW;AAAA,MACTP,SAAU,aAAYC,MAAMK,OAAOC;AAAAA,IACrC;AAAA,EACF;AAAA,EACAC,YAAY;AAAA,IACV,WAAW;AAAA,MACTR,SAAU,aAAYC,MAAMC,KAAKO;AAAAA,IACnC;AAAA,EACF;AAAA,EACAC,mBAAmB;AAAA,IACjBX,UAAU;AAAA,IACV,SAAS;AAAA,MACPA,UAAU;AAAA,MACVY,QAAQ;AAAA,IACV;AAAA,EACF;AAAA,EACAC,MAAM;AAAA,IACJC,KAAM,QAAOZ,MAAMC,KAAKY,gBAAgBb,MAAMc,MAAMC;AAAAA,IACpDC,OAAQ,QAAOhB,MAAMC,KAAKY,gBAAgBb,MAAMc,MAAMC;AAAAA,EACxD;AAAA,EACAE,aAAa;AAAA,IACXC,OAAO;AAAA,IACPN,KAAK;AAAA,IACLI,OAAO;AAAA,EACT;AACF;"}

package/dist/esm/components/Card/Content/Content.js

@@ -1,4 +1,3 @@
-import { clsx } from "clsx";
 import { styles } from "./Content.styles.js";
 import MuiCardContent from "@mui/material/CardContent";
 import cardContentClasses from "./contentClasses.js";
@@ -14,10 +13,11 @@ const HvCardContent = ({
 }) => {
   return /* @__PURE__ */ jsx(ClassNames, {
     children: ({
-      css
+      css,
+      cx
     }) => /* @__PURE__ */ jsx(MuiCardContent, {
       id,
-      className: clsx(css(styles.content), classes == null ? void 0 : classes.content, cardContentClasses.content, className),
+      className: cx(cardContentClasses.content, css(styles.content), className, classes == null ? void 0 : classes.content),
       onClick,
       ...others,
       children

package/dist/esm/components/Card/Content/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sources":["../../../../../src/components/Card/Content/Content.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { HvBaseProps } from \"@core/types\";\nimport { styles } from \"./Content.styles\";\nimport MuiCardContent, {\n  CardContentProps as MuiCardContentProps,\n} from \"@mui/material/CardContent\";\nimport cardContentClasses, { HvCardContentClasses } from \"./contentClasses\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvCardContentProps\n  extends Omit<MuiCardContentProps, \"classes\">,\n    HvBaseProps {\n  /** Id to be applied to the root node. */\n  id?: string;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: (event: React.SyntheticEvent) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardContentClasses;\n}\n\nexport const HvCardContent = ({\n  id,\n  classes,\n  className,\n  children,\n  onClick,\n  ...others\n}: HvCardContentProps) => {\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <MuiCardContent\n          id={id}\n          className={clsx(\n            css(styles.content),\n            classes?.content,\n            cardContentClasses.content,\n            className\n          )}\n          onClick={onClick}\n          {...others}\n        >\n          {children}\n        </MuiCardContent>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvCardContent","id","classes","className","children","onClick","others","ClassNames","css","MuiCardContent","clsx","styles","content","cardContentClasses"],"mappings":";;;;;;AAoBO,MAAMA,gBAAgBA,CAAC;AAAA,EAC5BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACe,MAAM;AACxB,6BACGC,YAAU;AAAA,IAAAH,UACRA,CAAC;AAAA,MAAEI;AAAAA,IAAAA,0BACDC,gBAAc;AAAA,MACbR;AAAAA,MACAE,WAAWO,KACTF,IAAIG,OAAOC,OAAO,GAClBV,mCAASU,SACTC,mBAAmBD,SACnBT,SAAS;AAAA,MAEXE;AAAAA,MAAiB,GACbC;AAAAA,MAAMF;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGF;AAEjB;"}
+{"version":3,"file":"Content.js","sources":["../../../../../src/components/Card/Content/Content.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types\";\nimport { styles } from \"./Content.styles\";\nimport MuiCardContent, {\n  CardContentProps as MuiCardContentProps,\n} from \"@mui/material/CardContent\";\nimport cardContentClasses, { HvCardContentClasses } from \"./contentClasses\";\nimport { ClassNames } from \"@emotion/react\";\n\nexport interface HvCardContentProps\n  extends Omit<MuiCardContentProps, \"classes\">,\n    HvBaseProps {\n  /** Id to be applied to the root node. */\n  id?: string;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: (event: React.SyntheticEvent) => void;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardContentClasses;\n}\n\nexport const HvCardContent = ({\n  id,\n  classes,\n  className,\n  children,\n  onClick,\n  ...others\n}: HvCardContentProps) => {\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <MuiCardContent\n          id={id}\n          className={cx(\n            cardContentClasses.content,\n            css(styles.content),\n            className,\n            classes?.content\n          )}\n          onClick={onClick}\n          {...others}\n        >\n          {children}\n        </MuiCardContent>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvCardContent","id","classes","className","children","onClick","others","ClassNames","css","cx","MuiCardContent","cardContentClasses","content","styles"],"mappings":";;;;;AAmBO,MAAMA,gBAAgBA,CAAC;AAAA,EAC5BC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACe,MAAM;AACxB,6BACGC,YAAU;AAAA,IAAAH,UACRA,CAAC;AAAA,MAAEI;AAAAA,MAAKC;AAAAA,IAAAA,0BACNC,gBAAc;AAAA,MACbT;AAAAA,MACAE,WAAWM,GACTE,mBAAmBC,SACnBJ,IAAIK,OAAOD,OAAO,GAClBT,WACAD,mCAASU,OAAO;AAAA,MAElBP;AAAAA,MAAiB,GACbC;AAAAA,MAAMF;AAAAA,IAAAA,CAED;AAAA,EAAA,CAGF;AAEjB;"}

package/dist/esm/components/Card/Content/Content.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.styles.js","sources":["../../../../../src/components/Card/Content/Content.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const styles: { content: CSSInterpolation } = {\n  content: {\n    padding: `0 ${theme.space.sm} 15px ${theme.space.sm}`,\n    \"&:last-child\": {\n      paddingBottom: theme.space.sm,\n    },\n  },\n};\n"],"names":["styles","content","padding","theme","space","sm","paddingBottom"],"mappings":";AAGO,MAAMA,SAAwC;AAAA,EACnDC,SAAS;AAAA,IACPC,SAAU,KAAIC,MAAMC,MAAMC,WAAWF,MAAMC,MAAMC;AAAAA,IACjD,gBAAgB;AAAA,MACdC,eAAeH,MAAMC,MAAMC;AAAAA,IAC7B;AAAA,EACF;AACF;"}
+{"version":3,"file":"Content.styles.js","sources":["../../../../../src/components/Card/Content/Content.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { HvCardContentClasses } from \"./contentClasses\";\n\nexport const styles: Partial<\n  Record<keyof HvCardContentClasses, CSSInterpolation>\n> = {\n  content: {\n    padding: `0 ${theme.space.sm} 15px ${theme.space.sm}`,\n    \"&:last-child\": {\n      paddingBottom: theme.space.sm,\n    },\n  },\n};\n"],"names":["styles","content","padding","theme","space","sm","paddingBottom"],"mappings":";AAIO,MAAMA,SAET;AAAA,EACFC,SAAS;AAAA,IACPC,SAAU,KAAIC,MAAMC,MAAMC,WAAWF,MAAMC,MAAMC;AAAAA,IACjD,gBAAgB;AAAA,MACdC,eAAeH,MAAMC,MAAMC;AAAAA,IAC7B;AAAA,EACF;AACF;"}

package/dist/esm/components/Card/Header/Header.js

@@ -1,4 +1,3 @@
-import { clsx } from "clsx";
 import MuiCardHeader from "@mui/material/CardHeader";
 import cardHeaderClasses from "./headerClasses.js";
 import { styles } from "./Header.styles.js";
@@ -19,25 +18,26 @@ const HvCardHeader = ({
   } = useTheme();
   return /* @__PURE__ */ jsx(ClassNames, {
     children: ({
-      css
+      css,
+      cx
     }) => /* @__PURE__ */ jsx(MuiCardHeader, {
       title,
       subheader,
       action: icon,
       onClick,
-      className: clsx(css(styles.root), classes == null ? void 0 : classes.root, cardHeaderClasses.root, className),
+      className: cx(cardHeaderClasses.root, css(styles.root), className, classes == null ? void 0 : classes.root),
       classes: {
-        title: icon ? clsx(css(styles.titleShort), cardHeaderClasses.titleShort, classes == null ? void 0 : classes.titleShort, css({
+        title: icon ? cx(cardHeaderClasses.titleShort, css(styles.titleShort), css({
           ...activeTheme == null ? void 0 : activeTheme.typography[activeTheme == null ? void 0 : activeTheme.card.titleVariant]
-        })) : clsx(css(styles.title), cardHeaderClasses.title, classes == null ? void 0 : classes.title, css({
+        }), classes == null ? void 0 : classes.titleShort) : cx(cardHeaderClasses.title, css(styles.title), css({
           ...activeTheme == null ? void 0 : activeTheme.typography[activeTheme == null ? void 0 : activeTheme.card.titleVariant]
-        })),
-        subheader: clsx(css(styles.subheader), cardHeaderClasses.subheader, classes == null ? void 0 : classes.subheader, css({
+        }), classes == null ? void 0 : classes.title),
+        subheader: cx(cardHeaderClasses.subheader, css(styles.subheader), css({
           ...activeTheme == null ? void 0 : activeTheme.typography[activeTheme == null ? void 0 : activeTheme.card.subheaderVariant],
           color: activeTheme == null ? void 0 : activeTheme.card.subheaderColor
-        })),
-        action: clsx(css(styles.action), cardHeaderClasses.action, classes == null ? void 0 : classes.action),
-        content: clsx(cardHeaderClasses.content, classes == null ? void 0 : classes.content)
+        }), classes == null ? void 0 : classes.subheader),
+        action: cx(cardHeaderClasses.action, css(styles.action), classes == null ? void 0 : classes.action),
+        content: cx(cardHeaderClasses.content, classes == null ? void 0 : classes.content)
       },
       ...others
     })