@hitachivantara/uikit-react-core 5.17.0 → 5.18.1

package/dist/cjs/components/BaseInput/BaseInput.cjs

@@ -4,7 +4,6 @@ const React = require("react");
 const material = require("@mui/material");
 const react = require("@emotion/react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const baseInputClasses = require("./baseInputClasses.cjs");
 const BaseInput_styles = require("./BaseInput.styles.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const FormUtils = require("../Forms/FormElement/utils/FormUtils.cjs");
@@ -31,9 +30,9 @@ const baseInputStyles = /* @__PURE__ */ react.css({
   "input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration": {
     display: "none"
   }
-}, process.env.NODE_ENV === "production" ? "" : ";label:baseInputStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBbUJ3QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0Jhc2VJbnB1dC9CYXNlSW5wdXQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgUmVmT2JqZWN0LCB1c2VDb250ZXh0IH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQge1xuICBJbnB1dEJhc2VDb21wb25lbnRQcm9wcyBhcyBNdWlJbnB1dEJhc2VDb21wb25lbnRQcm9wcyxcbiAgSW5wdXRQcm9wcyBhcyBNdWlJbnB1dFByb3BzLFxuICBJbnB1dCBhcyBNdWlJbnB1dCxcbn0gZnJvbSBcIkBtdWkvbWF0ZXJpYWxcIjtcbmltcG9ydCB7IEh2QmFzZVByb3BzIH0gZnJvbSBcIkBjb3JlL3R5cGVzXCI7XG5pbXBvcnQge1xuICBIdkZvcm1FbGVtZW50Q29udGV4dCxcbiAgSHZGb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dCxcbiAgYnVpbGRGb3JtRWxlbWVudFByb3BzRnJvbUNvbnRleHQsXG4gIGJ1aWxkQXJpYVByb3BzRnJvbUNvbnRleHQsXG59IGZyb20gXCJAY29yZS9jb21wb25lbnRzXCI7XG5pbXBvcnQgeyBDbGFzc05hbWVzLCBjc3MgYXMgZW1vdGlvbkNzcywgR2xvYmFsIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCI7XG5pbXBvcnQgeyB0aGVtZSB9IGZyb20gXCJAaGl0YWNoaXZhbnRhcmEvdWlraXQtc3R5bGVzXCI7XG5pbXBvcnQgYmFzZUlucHV0Q2xhc3NlcywgeyBIdkJhc2VJbnB1dENsYXNzZXMgfSBmcm9tIFwiLi9iYXNlSW5wdXRDbGFzc2VzXCI7XG5pbXBvcnQgeyBzdHlsZXMgfSBmcm9tIFwiLi9CYXNlSW5wdXQuc3R5bGVzXCI7XG5cbi8vIEdsb2JhbCBzdHlsZXMgZm9yIHRoZSBiYXNlIGlucHV0LlxuY29uc3QgYmFzZUlucHV0U3R5bGVzID0gZW1vdGlvbkNzcyh7XG4gIFwiaW5wdXQ6LXdlYmtpdC1hdXRvZmlsbFwiOiB7XG4gICAgV2Via2l0Qm94U2hhZG93OiBgMCAwIDBweCAxMDAwcHggJHt0aGVtZS5jb2xvcnMuYXRtbzF9IGluc2V0YCxcbiAgICBXZWJraXRUZXh0RmlsbENvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICB9LFxuXG4gIC8vIENsZWFycyBudW1iZXIgaW5wdXQgdXAvZG93biBhcnJvd3MgaW4gQ2hyb21lIGFuZCBGaXJlZm94XG4gIFwiaW5wdXQ6Oi13ZWJraXQtb3V0ZXItc3Bpbi1idXR0b24saW5wdXQ6Oi13ZWJraXQtaW5uZXItc3Bpbi1idXR0b25cIjoge1xuICAgIFdlYmtpdEFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICAgIG1hcmdpbjogMCxcbiAgfSxcbiAgXCJpbnB1dFt0eXBlPW51bWJlcl1cIjoge1xuICAgIE1vekFwcGVhcmFuY2U6IFwidGV4dGZpZWxkXCIsXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIHRpbWUgaW5wdXQgY2xvY2sgaW4gQ2hyb21lXG4gIFwiaW5wdXQ6Oi13ZWJraXQtY2FsZW5kYXItcGlja2VyLWluZGljYXRvclwiOiB7XG4gICAgZGlzcGxheTogXCJub25lXCIsXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIHNlYXJjaCBpbnB1dCBjbGVhciBidXR0b24gaW4gQ2hyb21lXG4gIFwiaW5wdXQ6Oi13ZWJraXQtc2VhcmNoLWRlY29yYXRpb24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLWNhbmNlbC1idXR0b24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtYnV0dG9uLGlucHV0Ojotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWRlY29yYXRpb25cIjpcbiAgICB7XG4gICAgICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgICB9LFxufSk7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSHZCYXNlSW5wdXRQcm9wc1xuICBleHRlbmRzIE9taXQ8TXVpSW5wdXRQcm9wcywgXCJvbkNoYW5nZVwiIHwgXCJjbGFzc2VzXCI+LFxuICAgIEh2QmFzZVByb3BzPFxuICAgICAgSFRNTERpdkVsZW1lbnQsXG4gICAgICB8IFwib25DaGFuZ2VcIlxuICAgICAgfCBcImNvbG9yXCJcbiAgICAgIHwgXCJvbkJsdXJcIlxuICAgICAgfCBcIm9uRm9jdXNcIlxuICAgICAgfCBcIm9uSW52YWxpZFwiXG4gICAgICB8IFwib25LZXlEb3duXCJcbiAgICAgIHwgXCJvbktleVVwXCJcbiAgICA+IHtcbiAgLyoqIFRoZSBpbnB1dCBuYW1lLiAqL1xuICBuYW1lPzogc3RyaW5nO1xuICAvKiogVGhlIHZhbHVlIG9mIHRoZSBpbnB1dCwgd2hlbiBjb250cm9sbGVkLiAqL1xuICB2YWx1ZT86IHN0cmluZztcbiAgLyoqIFRoZSBpbml0aWFsIHZhbHVlIG9mIHRoZSBpbnB1dCwgd2hlbiB1bmNvbnRyb2xsZWQuICovXG4gIGRlZmF1bHRWYWx1ZT86IHN0cmluZztcbiAgLyoqIElmIGB0cnVlYCB0aGUgaW5wdXQgaXMgZGlzYWJsZWQuICovXG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgLyoqIEluZGljYXRlcyB0aGF0IHRoZSBpbnB1dCBpcyBub3QgZWRpdGFibGUuICovXG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbiAgLyoqIElmIHRydWUsIHRoZSBpbnB1dCBlbGVtZW50IHdpbGwgYmUgcmVxdWlyZWQuICovXG4gIHJlcXVpcmVkPzogYm9vbGVhbjtcbiAgLyoqIFRoZSBmdW5jdGlvbiB0aGF0IHdpbGwgYmUgZXhlY3V0ZWQgb25DaGFuZ2UsIGFsbG93cyBtb2RpZmljYXRpb24gb2YgdGhlIGlucHV0LFxuICAgKiBpdCByZWNlaXZlcyB0aGUgdmFsdWUuIElmIGEgbmV3IHZhbHVlIHNob3VsZCBiZSBwcmVzZW50ZWQgaXQgbXVzdCByZXR1cm5lZCBpdC4gKi9cbiAgb25DaGFuZ2U/OiAoXG4gICAgZXZlbnQ6IFJlYWN0LkNoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQgfCBIVE1MVGV4dEFyZWFFbGVtZW50PixcbiAgICB2YWx1ZTogc3RyaW5nXG4gICkgPT4gdm9pZDtcbiAgLyoqIFRoZSBpbnB1dCB0eXBlLiAqL1xuICB0eXBlPzogc3RyaW5nO1xuICAvKiogTGFiZWwgaW5zaWRlIHRoZSBpbnB1dCB1c2VkIHRvIGhlbHAgdXNlci4gKi9cbiAgcGxhY2Vob2xkZXI/OiBzdHJpbmc7XG4gIC8qKiBJZiB0cnVlLCBhIHRleHRhcmVhIGVsZW1lbnQgd2lsbCBiZSByZW5kZXJlZC4gKi9cbiAgbXVsdGlsaW5lPzogYm9vbGVhbjtcbiAgLyoqIElmIHRydWUgYW5kIG11bHRpbGluZSBpcyBhbHNvIHRydWUgdGhlIHRleHRhcmVhIGVsZW1lbnQgd2lsbCBiZSByZXNpemFibGUuICovXG4gIHJlc2l6YWJsZT86IGJvb2xlYW47XG4gIC8qKiBEZW5vdGVzIGlmIHRoZSBpbnB1dCBpcyBpbiBhbiBpbnZhbGlkIHN0YXRlLiAqL1xuICBpbnZhbGlkPzogYm9vbGVhbjtcbiAgLyoqIEF0dHJpYnV0ZXMgYXBwbGllZCB0byB0aGUgaW5wdXQgZWxlbWVudC4gKi9cbiAgaW5wdXRQcm9wcz86IE11aUlucHV0QmFzZUNvbXBvbmVudFByb3BzO1xuICAvKiogQWxsb3dzIHBhc3NpbmcgYSByZWYgdG8gdGhlIHVuZGVybHlpbmcgaW5wdXQgKi9cbiAgaW5wdXRSZWY/OiBSZWZPYmplY3Q8SFRNTEVsZW1lbnQ+O1xuICAvKiogQSBKc3MgT2JqZWN0IHVzZWQgdG8gb3ZlcnJpZGUgb3IgZXh0ZW5kIHRoZSBzdHlsZXMgYXBwbGllZCB0byB0aGUgY29tcG9uZW50LiAqL1xuICBjbGFzc2VzPzogSHZCYXNlSW5wdXRDbGFzc2VzO1xufVxuXG4vKipcbiAqIEFuIElucHV0IGNvbXBvbmVudCB0aGF0IG9ubHkgcG9zc2VzIHRoZSBtb3N0IGJhc2ljIGZ1bmN0aW9uYWxpdGllcy5cbiAqIEl0IHNob3VsZCBiZSB1c2VkIGFsb25nc2lkZSB0aGUgb3RoZXIgZm9ybSBlbGVtZW50cyB0byBjb25zdHJ1Y3QgYSBwcm9wZXIgYWNjZXNzaWJsZSBmb3JtLlxuICovXG5leHBvcnQgY29uc3QgSHZCYXNlSW5wdXQgPSAoe1xuICBjbGFzc2VzLFxuICBjbGFzc05hbWUgPSBcIlwiLFxuICBpZCxcbiAgbmFtZSxcbiAgdmFsdWUsXG4gIGRlZmF1bHRWYWx1ZSxcbiAgcmVxdWlyZWQsXG4gIHJlYWRPbmx5LFxuICBkaXNhYmxlZCxcbiAgb25DaGFuZ2UsXG4gIHR5cGUgPSBcInRleHRcIixcbiAgcGxhY2Vob2xkZXIsXG4gIG11bHRpbGluZSA9IGZhbHNlLFxuICByZXNpemFibGUgPSBmYWxzZSxcbiAgaW52YWxpZCA9IGZhbHNlLFxuICBpbnB1dFJlZixcbiAgaW5wdXRQcm9wcyA9IHt9LFxuICAuLi5vdGhlcnNcbn06IEh2QmFzZUlucHV0UHJvcHMpID0+IHtcbiAgY29uc3QgZm9ybUVsZW1lbnRDb250ZXh0ID0gdXNlQ29udGV4dChIdkZvcm1FbGVtZW50Q29udGV4dCk7XG4gIGNvbnN0IGZvcm1FbGVtZW50UHJvcHMgPSBidWlsZEZvcm1FbGVtZW50UHJvcHNGcm9tQ29udGV4dChcbiAgICBuYW1lLFxuICAgIGRpc2FibGVkLFxuICAgIHJlYWRPbmx5LFxuICAgIHJlcXVpcmVkLFxuICAgIGZvcm1FbGVtZW50Q29udGV4dFxuICApO1xuXG4gIGNvbnN0IGxvY2FsSW52YWxpZCA9IGludmFsaWQgfHwgZm9ybUVsZW1lbnRQcm9wcy5zdGF0dXMgPT09IFwiaW52YWxpZFwiO1xuXG4gIGNvbnN0IGZvcm1FbGVtZW50RGVzY3JpcHRvcnNDb250ZXh0ID0gdXNlQ29udGV4dChcbiAgICBIdkZvcm1FbGVtZW50RGVzY3JpcHRvcnNDb250ZXh0XG4gICk7XG4gIGNvbnN0IGFyaWFQcm9wcyA9IGJ1aWxkQXJpYVByb3BzRnJvbUNvbnRleHQoXG4gICAgaW5wdXRQcm9wcyxcbiAgICBmb3JtRWxlbWVudERlc2NyaXB0b3JzQ29udGV4dCxcbiAgICBsb2NhbEludmFsaWQsXG4gICAgaWRcbiAgKTtcblxuICBjb25zdCBvbkNoYW5nZUhhbmRsZXIgPSAoXG4gICAgZXZlbnQ6IFJlYWN0LkNoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQgfCBIVE1MVGV4dEFyZWFFbGVtZW50PlxuICApID0+IHtcbiAgICBvbkNoYW5nZT8uKGV2ZW50LCBldmVudC50YXJnZXQudmFsdWUpO1xuICB9O1xuXG4gIHJldHVybiAoXG4gICAgPENsYXNzTmFtZXM+XG4gICAgICB7KHsgY3NzLCBjeCB9KSA9PiAoXG4gICAgICAgIDw+XG4gICAgICAgICAgPEdsb2JhbCBzdHlsZXM9e2Jhc2VJbnB1dFN0eWxlc30gLz5cbiAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICAgICAgICBiYXNlSW5wdXRDbGFzc2VzLnJvb3QsXG4gICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQgJiYgYmFzZUlucHV0Q2xhc3Nlcy5kaXNhYmxlZCxcbiAgICAgICAgICAgICAgbG9jYWxJbnZhbGlkICYmIGJhc2VJbnB1dENsYXNzZXMuaW52YWxpZCxcbiAgICAgICAgICAgICAgbXVsdGlsaW5lICYmIHJlc2l6YWJsZSAmJiBiYXNlSW5wdXRDbGFzc2VzLnJlc2l6YWJsZSxcbiAgICAgICAgICAgICAgZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSAmJiBiYXNlSW5wdXRDbGFzc2VzLnJlYWRPbmx5LFxuICAgICAgICAgICAgICBjc3Moc3R5bGVzLnJvb3QpLFxuICAgICAgICAgICAgICBmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkICYmIGNzcyhzdHlsZXMuZGlzYWJsZWQpLFxuICAgICAgICAgICAgICBsb2NhbEludmFsaWQgJiYgY3NzKHN0eWxlcy5pbnZhbGlkKSxcbiAgICAgICAgICAgICAgbXVsdGlsaW5lICYmIHJlc2l6YWJsZSAmJiBjc3Moc3R5bGVzLnJlc2l6YWJsZSksXG4gICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHkgJiYgY3NzKHN0eWxlcy5yZWFkT25seSksXG4gICAgICAgICAgICAgIGNsYXNzTmFtZSxcbiAgICAgICAgICAgICAgY2xhc3Nlcz8ucm9vdCxcbiAgICAgICAgICAgICAgZm9ybUVsZW1lbnRQcm9wcy5kaXNhYmxlZCAmJiBjbGFzc2VzPy5kaXNhYmxlZCxcbiAgICAgICAgICAgICAgbG9jYWxJbnZhbGlkICYmIGNsYXNzZXM/LmludmFsaWQsXG4gICAgICAgICAgICAgIG11bHRpbGluZSAmJiByZXNpemFibGUgJiYgY2xhc3Nlcz8ucmVzaXphYmxlLFxuICAgICAgICAgICAgICBmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5ICYmIGNsYXNzZXM/LnJlYWRPbmx5XG4gICAgICAgICAgICApfVxuICAgICAgICAgID5cbiAgICAgICAgICAgIDxNdWlJbnB1dFxuICAgICAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgICAgIG5hbWU9e2Zvcm1FbGVtZW50UHJvcHMubmFtZX1cbiAgICAgICAgICAgICAgdmFsdWU9e3ZhbHVlfVxuICAgICAgICAgICAgICBkZWZhdWx0VmFsdWU9e2RlZmF1bHRWYWx1ZX1cbiAgICAgICAgICAgICAgdHlwZT17dHlwZX1cbiAgICAgICAgICAgICAgcGxhY2Vob2xkZXI9e3BsYWNlaG9sZGVyfVxuICAgICAgICAgICAgICByZWFkT25seT17ISFmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5fVxuICAgICAgICAgICAgICBkaXNhYmxlZD17Zm9ybUVsZW1lbnRQcm9wcy5kaXNhYmxlZH1cbiAgICAgICAgICAgICAgb25DaGFuZ2U9e29uQ2hhbmdlSGFuZGxlcn1cbiAgICAgICAgICAgICAgY2xhc3NOYW1lPXtjeChcbiAgICAgICAgICAgICAgICBsb2NhbEludmFsaWQgJiYgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RJbnZhbGlkLFxuICAgICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHkgJiYgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RSZWFkT25seSxcbiAgICAgICAgICAgICAgICBsb2NhbEludmFsaWQgJiYgY3NzKHN0eWxlcy5pbnB1dFJvb3RJbnZhbGlkKSxcbiAgICAgICAgICAgICAgICBmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5ICYmIGNzcyhzdHlsZXMuaW5wdXRSb290UmVhZE9ubHkpLFxuICAgICAgICAgICAgICAgIGxvY2FsSW52YWxpZCAmJiBjbGFzc2VzPy5pbnB1dFJvb3RJbnZhbGlkLFxuICAgICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHkgJiYgY2xhc3Nlcz8uaW5wdXRSb290UmVhZE9ubHlcbiAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgICAgY2xhc3Nlcz17e1xuICAgICAgICAgICAgICAgIHJvb3Q6IGN4KFxuICAgICAgICAgICAgICAgICAgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3QsXG4gICAgICAgICAgICAgICAgICBjc3Moc3R5bGVzLmlucHV0Um9vdCksXG4gICAgICAgICAgICAgICAgICBjbGFzc2VzPy5pbnB1dFJvb3RcbiAgICAgICAgICAgICAgICApLFxuICAgICAgICAgICAgICAgIGZvY3VzZWQ6IGN4KFxuICAgICAgICAgICAgICAgICAgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RGb2N1c2VkLFxuICAgICAgICAgICAgICAgICAgY3NzKHN0eWxlcy5pbnB1dFJvb3RGb2N1c2VkKSxcbiAgICAgICAgICAgICAgICAgIGNsYXNzZXM/LmlucHV0Um9vdEZvY3VzZWRcbiAgICAgICAgICAgICAgICApLFxuICAgICAgICAgICAgICAgIGRpc2FibGVkOiBjeChcbiAgICAgICAgICAgICAgICAgIGJhc2VJbnB1dENsYXNzZXMuaW5wdXRSb290RGlzYWJsZWQsXG4gICAgICAgICAgICAgICAgICBjc3Moc3R5bGVzLmlucHV0Um9vdERpc2FibGVkKSxcbiAgICAgICAgICAgICAgICAgIGNsYXNzZXM/LmlucHV0Um9vdERpc2FibGVkXG4gICAgICAgICAgICAgICAgKSxcbiAgICAgICAgICAgICAgICBtdWx0aWxpbmU6IGN4KFxuICAgICAgICAgICAgICAgICAgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJvb3RNdWx0aWxpbmUsXG4gICAgICAgICAgICAgICAgICBjc3Moc3R5bGVzLmlucHV0Um9vdE11bHRpbGluZSksXG4gICAgICAgICAgICAgICAgICBjbGFzc2VzPy5pbnB1dFJvb3RNdWx0aWxpbmVcbiAgICAgICAgICAgICAgICApLFxuICAgICAgICAgICAgICAgIGlucHV0OiBjeChcbiAgICAgICAgICAgICAgICAgIGJhc2VJbnB1dENsYXNzZXMuaW5wdXQsXG4gICAgICAgICAgICAgICAgICAhZm9ybUVsZW1lbnRQcm9wcy5kaXNhYmxlZCAmJlxuICAgICAgICAgICAgICAgICAgICByZXNpemFibGUgJiZcbiAgICAgICAgICAgICAgICAgICAgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dFJlc2l6YWJsZSxcbiAgICAgICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQgJiYgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dERpc2FibGVkLFxuICAgICAgICAgICAgICAgICAgZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSAmJiBiYXNlSW5wdXRDbGFzc2VzLmlucHV0UmVhZE9ubHksXG4gICAgICAgICAgICAgICAgICBjc3Moc3R5bGVzLmlucHV0KSxcbiAgICAgICAgICAgICAgICAgICFmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkICYmXG4gICAgICAgICAgICAgICAgICAgIHJlc2l6YWJsZSAmJlxuICAgICAgICAgICAgICAgICAgICBjc3Moc3R5bGVzLmlucHV0UmVzaXphYmxlKSxcbiAgICAgICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQgJiYgY3NzKHN0eWxlcy5pbnB1dERpc2FibGVkKSxcbiAgICAgICAgICAgICAgICAgIGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHkgJiYgY3NzKHN0eWxlcy5pbnB1dFJlYWRPbmx5KSxcbiAgICAgICAgICAgICAgICAgIGNsYXNzZXM/LmlucHV0LFxuICAgICAgICAgICAgICAgICAgIWZvcm1FbGVtZW50UHJvcHMuZGlzYWJsZWQgJiZcbiAgICAgICAgICAgICAgICAgICAgcmVzaXphYmxlICYmXG4gICAgICAgICAgICAgICAgICAgIGNsYXNzZXM/LmlucHV0UmVzaXphYmxlLFxuICAgICAgICAgICAgICAgICAgZm9ybUVsZW1lbnRQcm9wcy5kaXNhYmxlZCAmJiBjbGFzc2VzPy5pbnB1dERpc2FibGVkLFxuICAgICAgICAgICAgICAgICAgZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSAmJiBjbGFzc2VzPy5pbnB1dFJlYWRPbmx5XG4gICAgICAgICAgICAgICAgKSxcbiAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgaW5wdXRQcm9wcz17e1xuICAgICAgICAgICAgICAgIC8vIEF2b2lkIHRoZSByZXF1aXJlZCBhdHRyaWJ1dGUgYXQgdGhlIHJvb3Qgbm9kZVxuICAgICAgICAgICAgICAgIHJlcXVpcmVkOiBmb3JtRWxlbWVudFByb3BzLnJlcXVpcmVkLFxuICAgICAgICAgICAgICAgIC4uLmlucHV0UHJvcHMsXG4gICAgICAgICAgICAgICAgLi4uYXJpYVByb3BzLFxuICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgICBpbnB1dFJlZj17aW5wdXRSZWZ9XG4gICAgICAgICAgICAgIG11bHRpbGluZT17bXVsdGlsaW5lfVxuICAgICAgICAgICAgICByb3dzPXsxMH1cbiAgICAgICAgICAgICAgey4uLm90aGVyc31cbiAgICAgICAgICAgIC8+XG4gICAgICAgICAgICB7IW11bHRpbGluZSAmJiAoXG4gICAgICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgICAgICByb2xlPVwicHJlc2VudGF0aW9uXCJcbiAgICAgICAgICAgICAgICBjbGFzc05hbWU9e2N4KFxuICAgICAgICAgICAgICAgICAgYmFzZUlucHV0Q2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcixcbiAgICAgICAgICAgICAgICAgIGNzcyhzdHlsZXMuaW5wdXRCb3JkZXJDb250YWluZXIpLFxuICAgICAgICAgICAgICAgICAgY2xhc3Nlcz8uaW5wdXRCb3JkZXJDb250YWluZXJcbiAgICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgICAvPlxuICAgICAgICAgICAgKX1cbiAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC8+XG4gICAgICApfVxuICAgIDwvQ2xhc3NOYW1lcz5cbiAgKTtcbn07XG4iXX0= */");
+}, process.env.NODE_ENV === "production" ? "" : ";label:baseInputStyles;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL2NvbXBvbmVudHMvQmFzZUlucHV0L0Jhc2VJbnB1dC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0J3QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9jb21wb25lbnRzL0Jhc2VJbnB1dC9CYXNlSW5wdXQudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHtcbiAgSW5wdXRCYXNlQ29tcG9uZW50UHJvcHMgYXMgTXVpSW5wdXRCYXNlQ29tcG9uZW50UHJvcHMsXG4gIElucHV0UHJvcHMgYXMgTXVpSW5wdXRQcm9wcyxcbiAgSW5wdXQgYXMgTXVpSW5wdXQsXG4gIElucHV0QmFzZVByb3BzLFxufSBmcm9tIFwiQG11aS9tYXRlcmlhbFwiO1xuaW1wb3J0IHsgSHZCYXNlUHJvcHMgfSBmcm9tIFwiQGNvcmUvdHlwZXNcIjtcbmltcG9ydCB7IEV4dHJhY3ROYW1lcyB9IGZyb20gXCJAY29yZS91dGlsc1wiO1xuaW1wb3J0IHtcbiAgSHZGb3JtRWxlbWVudENvbnRleHQsXG4gIEh2Rm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQsXG4gIGJ1aWxkRm9ybUVsZW1lbnRQcm9wc0Zyb21Db250ZXh0LFxuICBidWlsZEFyaWFQcm9wc0Zyb21Db250ZXh0LFxufSBmcm9tIFwiQGNvcmUvY29tcG9uZW50c1wiO1xuaW1wb3J0IHsgY3NzIGFzIGVtb3Rpb25Dc3MsIEdsb2JhbCB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHsgdGhlbWUgfSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgc3RhdGljQ2xhc3NlcywgdXNlQ2xhc3NlcyB9IGZyb20gXCIuL0Jhc2VJbnB1dC5zdHlsZXNcIjtcblxuZXhwb3J0IHsgc3RhdGljQ2xhc3NlcyBhcyBiYXNlSW5wdXRDbGFzc2VzIH07XG5cbmV4cG9ydCB0eXBlIEh2QmFzZUlucHV0Q2xhc3NlcyA9IEV4dHJhY3ROYW1lczx0eXBlb2YgdXNlQ2xhc3Nlcz47XG5cbi8vIEdsb2JhbCBzdHlsZXMgZm9yIHRoZSBiYXNlIGlucHV0LlxuY29uc3QgYmFzZUlucHV0U3R5bGVzID0gZW1vdGlvbkNzcyh7XG4gIFwiaW5wdXQ6LXdlYmtpdC1hdXRvZmlsbFwiOiB7XG4gICAgV2Via2l0Qm94U2hhZG93OiBgMCAwIDBweCAxMDAwcHggJHt0aGVtZS5jb2xvcnMuYXRtbzF9IGluc2V0YCxcbiAgICBXZWJraXRUZXh0RmlsbENvbG9yOiB0aGVtZS5jb2xvcnMuc2Vjb25kYXJ5LFxuICB9LFxuXG4gIC8vIENsZWFycyBudW1iZXIgaW5wdXQgdXAvZG93biBhcnJvd3MgaW4gQ2hyb21lIGFuZCBGaXJlZm94XG4gIFwiaW5wdXQ6Oi13ZWJraXQtb3V0ZXItc3Bpbi1idXR0b24saW5wdXQ6Oi13ZWJraXQtaW5uZXItc3Bpbi1idXR0b25cIjoge1xuICAgIFdlYmtpdEFwcGVhcmFuY2U6IFwibm9uZVwiLFxuICAgIG1hcmdpbjogMCxcbiAgfSxcbiAgXCJpbnB1dFt0eXBlPW51bWJlcl1cIjoge1xuICAgIE1vekFwcGVhcmFuY2U6IFwidGV4dGZpZWxkXCIsXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIHRpbWUgaW5wdXQgY2xvY2sgaW4gQ2hyb21lXG4gIFwiaW5wdXQ6Oi13ZWJraXQtY2FsZW5kYXItcGlja2VyLWluZGljYXRvclwiOiB7XG4gICAgZGlzcGxheTogXCJub25lXCIsXG4gIH0sXG5cbiAgLy8gQ2xlYXJzIHNlYXJjaCBpbnB1dCBjbGVhciBidXR0b24gaW4gQ2hyb21lXG4gIFwiaW5wdXQ6Oi13ZWJraXQtc2VhcmNoLWRlY29yYXRpb24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLWNhbmNlbC1idXR0b24saW5wdXQ6Oi13ZWJraXQtc2VhcmNoLXJlc3VsdHMtYnV0dG9uLGlucHV0Ojotd2Via2l0LXNlYXJjaC1yZXN1bHRzLWRlY29yYXRpb25cIjpcbiAgICB7XG4gICAgICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgICB9LFxufSk7XG5cbmV4cG9ydCBpbnRlcmZhY2UgSHZCYXNlSW5wdXRQcm9wc1xuICBleHRlbmRzIE9taXQ8TXVpSW5wdXRQcm9wcywgXCJvbkNoYW5nZVwiIHwgXCJjbGFzc2VzXCI+LFxuICAgIEh2QmFzZVByb3BzPFxuICAgICAgSFRNTERpdkVsZW1lbnQsXG4gICAgICB8IFwib25DaGFuZ2VcIlxuICAgICAgfCBcImNvbG9yXCJcbiAgICAgIHwgXCJvbkJsdXJcIlxuICAgICAgfCBcIm9uRm9jdXNcIlxuICAgICAgfCBcIm9uSW52YWxpZFwiXG4gICAgICB8IFwib25LZXlEb3duXCJcbiAgICAgIHwgXCJvbktleVVwXCJcbiAgICA+IHtcbiAgLyoqIFRoZSBpbnB1dCBuYW1lLiAqL1xuICBuYW1lPzogc3RyaW5nO1xuICAvKiogVGhlIHZhbHVlIG9mIHRoZSBpbnB1dCwgd2hlbiBjb250cm9sbGVkLiAqL1xuICB2YWx1ZT86IHN0cmluZztcbiAgLyoqIFRoZSBpbml0aWFsIHZhbHVlIG9mIHRoZSBpbnB1dCwgd2hlbiB1bmNvbnRyb2xsZWQuICovXG4gIGRlZmF1bHRWYWx1ZT86IHN0cmluZztcbiAgLyoqIElmIGB0cnVlYCB0aGUgaW5wdXQgaXMgZGlzYWJsZWQuICovXG4gIGRpc2FibGVkPzogYm9vbGVhbjtcbiAgLyoqIEluZGljYXRlcyB0aGF0IHRoZSBpbnB1dCBpcyBub3QgZWRpdGFibGUuICovXG4gIHJlYWRPbmx5PzogYm9vbGVhbjtcbiAgLyoqIElmIHRydWUsIHRoZSBpbnB1dCBlbGVtZW50IHdpbGwgYmUgcmVxdWlyZWQuICovXG4gIHJlcXVpcmVkPzogYm9vbGVhbjtcbiAgLyoqIFRoZSBmdW5jdGlvbiB0aGF0IHdpbGwgYmUgZXhlY3V0ZWQgb25DaGFuZ2UsIGFsbG93cyBtb2RpZmljYXRpb24gb2YgdGhlIGlucHV0LFxuICAgKiBpdCByZWNlaXZlcyB0aGUgdmFsdWUuIElmIGEgbmV3IHZhbHVlIHNob3VsZCBiZSBwcmVzZW50ZWQgaXQgbXVzdCByZXR1cm5lZCBpdC4gKi9cbiAgb25DaGFuZ2U/OiAoXG4gICAgZXZlbnQ6IFJlYWN0LkNoYW5nZUV2ZW50PEhUTUxJbnB1dEVsZW1lbnQgfCBIVE1MVGV4dEFyZWFFbGVtZW50PixcbiAgICB2YWx1ZTogc3RyaW5nXG4gICkgPT4gdm9pZDtcbiAgLyoqIFRoZSBpbnB1dCB0eXBlLiAqL1xuICB0eXBlPzogc3RyaW5nO1xuICAvKiogTGFiZWwgaW5zaWRlIHRoZSBpbnB1dCB1c2VkIHRvIGhlbHAgdXNlci4gKi9cbiAgcGxhY2Vob2xkZXI/OiBzdHJpbmc7XG4gIC8qKiBJZiB0cnVlLCBhIHRleHRhcmVhIGVsZW1lbnQgd2lsbCBiZSByZW5kZXJlZC4gKi9cbiAgbXVsdGlsaW5lPzogYm9vbGVhbjtcbiAgLyoqIElmIHRydWUgYW5kIG11bHRpbGluZSBpcyBhbHNvIHRydWUgdGhlIHRleHRhcmVhIGVsZW1lbnQgd2lsbCBiZSByZXNpemFibGUuICovXG4gIHJlc2l6YWJsZT86IGJvb2xlYW47XG4gIC8qKiBEZW5vdGVzIGlmIHRoZSBpbnB1dCBpcyBpbiBhbiBpbnZhbGlkIHN0YXRlLiAqL1xuICBpbnZhbGlkPzogYm9vbGVhbjtcbiAgLyoqIEF0dHJpYnV0ZXMgYXBwbGllZCB0byB0aGUgaW5wdXQgZWxlbWVudC4gKi9cbiAgaW5wdXRQcm9wcz86IE11aUlucHV0QmFzZUNvbXBvbmVudFByb3BzO1xuICAvKiogQWxsb3dzIHBhc3NpbmcgYSByZWYgdG8gdGhlIHVuZGVybHlpbmcgaW5wdXQgKi9cbiAgaW5wdXRSZWY/OiBJbnB1dEJhc2VQcm9wc1tcImlucHV0UmVmXCJdO1xuICAvKiogQSBKc3MgT2JqZWN0IHVzZWQgdG8gb3ZlcnJpZGUgb3IgZXh0ZW5kIHRoZSBzdHlsZXMgYXBwbGllZCB0byB0aGUgY29tcG9uZW50LiAqL1xuICBjbGFzc2VzPzogSHZCYXNlSW5wdXRDbGFzc2VzO1xufVxuXG4vKipcbiAqIEFuIElucHV0IGNvbXBvbmVudCB0aGF0IG9ubHkgcG9zc2VzIHRoZSBtb3N0IGJhc2ljIGZ1bmN0aW9uYWxpdGllcy5cbiAqIEl0IHNob3VsZCBiZSB1c2VkIGFsb25nc2lkZSB0aGUgb3RoZXIgZm9ybSBlbGVtZW50cyB0byBjb25zdHJ1Y3QgYSBwcm9wZXIgYWNjZXNzaWJsZSBmb3JtLlxuICovXG5leHBvcnQgY29uc3QgSHZCYXNlSW5wdXQgPSAoe1xuICBjbGFzc2VzOiBjbGFzc2VzUHJvcCxcbiAgY2xhc3NOYW1lID0gXCJcIixcbiAgaWQsXG4gIG5hbWUsXG4gIHZhbHVlLFxuICBkZWZhdWx0VmFsdWUsXG4gIHJlcXVpcmVkLFxuICByZWFkT25seSxcbiAgZGlzYWJsZWQsXG4gIG9uQ2hhbmdlLFxuICB0eXBlID0gXCJ0ZXh0XCIsXG4gIHBsYWNlaG9sZGVyLFxuICBtdWx0aWxpbmUgPSBmYWxzZSxcbiAgcmVzaXphYmxlID0gZmFsc2UsXG4gIGludmFsaWQgPSBmYWxzZSxcbiAgaW5wdXRSZWYsXG4gIGlucHV0UHJvcHMgPSB7fSxcbiAgLi4ub3RoZXJzXG59OiBIdkJhc2VJbnB1dFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgY2xhc3NlcywgY3ggfSA9IHVzZUNsYXNzZXMoY2xhc3Nlc1Byb3ApO1xuICBjb25zdCBmb3JtRWxlbWVudENvbnRleHQgPSB1c2VDb250ZXh0KEh2Rm9ybUVsZW1lbnRDb250ZXh0KTtcbiAgY29uc3QgZm9ybUVsZW1lbnRQcm9wcyA9IGJ1aWxkRm9ybUVsZW1lbnRQcm9wc0Zyb21Db250ZXh0KFxuICAgIG5hbWUsXG4gICAgZGlzYWJsZWQsXG4gICAgcmVhZE9ubHksXG4gICAgcmVxdWlyZWQsXG4gICAgZm9ybUVsZW1lbnRDb250ZXh0XG4gICk7XG5cbiAgY29uc3QgbG9jYWxJbnZhbGlkID0gaW52YWxpZCB8fCBmb3JtRWxlbWVudFByb3BzLnN0YXR1cyA9PT0gXCJpbnZhbGlkXCI7XG5cbiAgY29uc3QgZm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHQgPSB1c2VDb250ZXh0KFxuICAgIEh2Rm9ybUVsZW1lbnREZXNjcmlwdG9yc0NvbnRleHRcbiAgKTtcbiAgY29uc3QgYXJpYVByb3BzID0gYnVpbGRBcmlhUHJvcHNGcm9tQ29udGV4dChcbiAgICBpbnB1dFByb3BzLFxuICAgIGZvcm1FbGVtZW50RGVzY3JpcHRvcnNDb250ZXh0LFxuICAgIGxvY2FsSW52YWxpZCxcbiAgICBpZFxuICApO1xuXG4gIGNvbnN0IG9uQ2hhbmdlSGFuZGxlcjogTXVpSW5wdXRQcm9wc1tcIm9uQ2hhbmdlXCJdID0gKGV2ZW50KSA9PiB7XG4gICAgb25DaGFuZ2U/LihldmVudCwgZXZlbnQudGFyZ2V0LnZhbHVlKTtcbiAgfTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICA8R2xvYmFsIHN0eWxlcz17YmFzZUlucHV0U3R5bGVzfSAvPlxuICAgICAgPGRpdlxuICAgICAgICBjbGFzc05hbWU9e2N4KGNsYXNzZXMucm9vdCwgY2xhc3NOYW1lLCB7XG4gICAgICAgICAgW2NsYXNzZXMuZGlzYWJsZWRdOiBmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkLFxuICAgICAgICAgIFtjbGFzc2VzLmludmFsaWRdOiBsb2NhbEludmFsaWQsXG4gICAgICAgICAgW2NsYXNzZXMucmVzaXphYmxlXTogbXVsdGlsaW5lICYmIHJlc2l6YWJsZSxcbiAgICAgICAgICBbY2xhc3Nlcy5yZWFkT25seV06IGZvcm1FbGVtZW50UHJvcHMucmVhZE9ubHksXG4gICAgICAgIH0pfVxuICAgICAgPlxuICAgICAgICA8TXVpSW5wdXRcbiAgICAgICAgICBpZD17aWR9XG4gICAgICAgICAgbmFtZT17Zm9ybUVsZW1lbnRQcm9wcy5uYW1lfVxuICAgICAgICAgIHZhbHVlPXt2YWx1ZX1cbiAgICAgICAgICBkZWZhdWx0VmFsdWU9e2RlZmF1bHRWYWx1ZX1cbiAgICAgICAgICB0eXBlPXt0eXBlfVxuICAgICAgICAgIHBsYWNlaG9sZGVyPXtwbGFjZWhvbGRlcn1cbiAgICAgICAgICByZWFkT25seT17ISFmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5fVxuICAgICAgICAgIGRpc2FibGVkPXtmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkfVxuICAgICAgICAgIG9uQ2hhbmdlPXtvbkNoYW5nZUhhbmRsZXJ9XG4gICAgICAgICAgY2xhc3NOYW1lPXtjeCh7XG4gICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJvb3RJbnZhbGlkXTogbG9jYWxJbnZhbGlkLFxuICAgICAgICAgICAgW2NsYXNzZXMuaW5wdXRSb290UmVhZE9ubHldOiBmb3JtRWxlbWVudFByb3BzLnJlYWRPbmx5LFxuICAgICAgICAgIH0pfVxuICAgICAgICAgIGNsYXNzZXM9e3tcbiAgICAgICAgICAgIHJvb3Q6IGNsYXNzZXMuaW5wdXRSb290LFxuICAgICAgICAgICAgZm9jdXNlZDogY2xhc3Nlcy5pbnB1dFJvb3RGb2N1c2VkLFxuICAgICAgICAgICAgZGlzYWJsZWQ6IGNsYXNzZXMuaW5wdXRSb290RGlzYWJsZWQsXG4gICAgICAgICAgICBtdWx0aWxpbmU6IGNsYXNzZXMuaW5wdXRSb290TXVsdGlsaW5lLFxuICAgICAgICAgICAgaW5wdXQ6IGN4KGNsYXNzZXMuaW5wdXQsIHtcbiAgICAgICAgICAgICAgW2NsYXNzZXMuaW5wdXRSZXNpemFibGVdOiAhZm9ybUVsZW1lbnRQcm9wcy5kaXNhYmxlZCAmJiByZXNpemFibGUsXG4gICAgICAgICAgICAgIFtjbGFzc2VzLmlucHV0RGlzYWJsZWRdOiBmb3JtRWxlbWVudFByb3BzLmRpc2FibGVkLFxuICAgICAgICAgICAgICBbY2xhc3Nlcy5pbnB1dFJlYWRPbmx5XTogZm9ybUVsZW1lbnRQcm9wcy5yZWFkT25seSxcbiAgICAgICAgICAgIH0pLFxuICAgICAgICAgIH19XG4gICAgICAgICAgaW5wdXRQcm9wcz17e1xuICAgICAgICAgICAgLy8gQXZvaWQgdGhlIHJlcXVpcmVkIGF0dHJpYnV0ZSBhdCB0aGUgcm9vdCBub2RlXG4gICAgICAgICAgICByZXF1aXJlZDogZm9ybUVsZW1lbnRQcm9wcy5yZXF1aXJlZCxcbiAgICAgICAgICAgIC4uLmlucHV0UHJvcHMsXG4gICAgICAgICAgICAuLi5hcmlhUHJvcHMsXG4gICAgICAgICAgfX1cbiAgICAgICAgICBpbnB1dFJlZj17aW5wdXRSZWZ9XG4gICAgICAgICAgbXVsdGlsaW5lPXttdWx0aWxpbmV9XG4gICAgICAgICAgcm93cz17MTB9XG4gICAgICAgICAgey4uLm90aGVyc31cbiAgICAgICAgLz5cbiAgICAgICAgeyFtdWx0aWxpbmUgJiYgKFxuICAgICAgICAgIDxkaXYgcm9sZT1cInByZXNlbnRhdGlvblwiIGNsYXNzTmFtZT17Y2xhc3Nlcy5pbnB1dEJvcmRlckNvbnRhaW5lcn0gLz5cbiAgICAgICAgKX1cbiAgICAgIDwvZGl2PlxuICAgIDwvPlxuICApO1xufTtcbiJdfQ== */");
 const HvBaseInput = ({
-  classes,
+  classes: classesProp,
   className = "",
   id,
   name,
@@ -52,6 +51,10 @@ const HvBaseInput = ({
   inputProps = {},
   ...others
 }) => {
+  const {
+    classes,
+    cx
+  } = BaseInput_styles.useClasses(classesProp);
   const formElementContext = React.useContext(FormElementContext.HvFormElementContext);
   const formElementProps = FormUtils.buildFormElementPropsFromContext(name, disabled, readOnly, required, formElementContext);
   const localInvalid = invalid || formElementProps.status === "invalid";
@@ -60,50 +63,58 @@ const HvBaseInput = ({
   const onChangeHandler = (event) => {
     onChange == null ? void 0 : onChange(event, event.target.value);
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
-    children: ({
-      css,
-      cx
-    }) => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/* @__PURE__ */ jsxRuntime.jsx(react.Global, {
-        styles: baseInputStyles
-      }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        className: cx(baseInputClasses.default.root, formElementProps.disabled && baseInputClasses.default.disabled, localInvalid && baseInputClasses.default.invalid, multiline && resizable && baseInputClasses.default.resizable, formElementProps.readOnly && baseInputClasses.default.readOnly, css(BaseInput_styles.styles.root), formElementProps.disabled && css(BaseInput_styles.styles.disabled), localInvalid && css(BaseInput_styles.styles.invalid), multiline && resizable && css(BaseInput_styles.styles.resizable), formElementProps.readOnly && css(BaseInput_styles.styles.readOnly), className, classes == null ? void 0 : classes.root, formElementProps.disabled && (classes == null ? void 0 : classes.disabled), localInvalid && (classes == null ? void 0 : classes.invalid), multiline && resizable && (classes == null ? void 0 : classes.resizable), formElementProps.readOnly && (classes == null ? void 0 : classes.readOnly)),
-        children: [/* @__PURE__ */ jsxRuntime.jsx(material.Input, {
-          id,
-          name: formElementProps.name,
-          value,
-          defaultValue,
-          type,
-          placeholder,
-          readOnly: !!formElementProps.readOnly,
-          disabled: formElementProps.disabled,
-          onChange: onChangeHandler,
-          className: cx(localInvalid && baseInputClasses.default.inputRootInvalid, formElementProps.readOnly && baseInputClasses.default.inputRootReadOnly, localInvalid && css(BaseInput_styles.styles.inputRootInvalid), formElementProps.readOnly && css(BaseInput_styles.styles.inputRootReadOnly), localInvalid && (classes == null ? void 0 : classes.inputRootInvalid), formElementProps.readOnly && (classes == null ? void 0 : classes.inputRootReadOnly)),
-          classes: {
-            root: cx(baseInputClasses.default.inputRoot, css(BaseInput_styles.styles.inputRoot), classes == null ? void 0 : classes.inputRoot),
-            focused: cx(baseInputClasses.default.inputRootFocused, css(BaseInput_styles.styles.inputRootFocused), classes == null ? void 0 : classes.inputRootFocused),
-            disabled: cx(baseInputClasses.default.inputRootDisabled, css(BaseInput_styles.styles.inputRootDisabled), classes == null ? void 0 : classes.inputRootDisabled),
-            multiline: cx(baseInputClasses.default.inputRootMultiline, css(BaseInput_styles.styles.inputRootMultiline), classes == null ? void 0 : classes.inputRootMultiline),
-            input: cx(baseInputClasses.default.input, !formElementProps.disabled && resizable && baseInputClasses.default.inputResizable, formElementProps.disabled && baseInputClasses.default.inputDisabled, formElementProps.readOnly && baseInputClasses.default.inputReadOnly, css(BaseInput_styles.styles.input), !formElementProps.disabled && resizable && css(BaseInput_styles.styles.inputResizable), formElementProps.disabled && css(BaseInput_styles.styles.inputDisabled), formElementProps.readOnly && css(BaseInput_styles.styles.inputReadOnly), classes == null ? void 0 : classes.input, !formElementProps.disabled && resizable && (classes == null ? void 0 : classes.inputResizable), formElementProps.disabled && (classes == null ? void 0 : classes.inputDisabled), formElementProps.readOnly && (classes == null ? void 0 : classes.inputReadOnly))
-          },
-          inputProps: {
-            // Avoid the required attribute at the root node
-            required: formElementProps.required,
-            ...inputProps,
-            ...ariaProps
-          },
-          inputRef,
-          multiline,
-          rows: 10,
-          ...others
-        }), !multiline && /* @__PURE__ */ jsxRuntime.jsx("div", {
-          role: "presentation",
-          className: cx(baseInputClasses.default.inputBorderContainer, css(BaseInput_styles.styles.inputBorderContainer), classes == null ? void 0 : classes.inputBorderContainer)
-        })]
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsx(react.Global, {
+      styles: baseInputStyles
+    }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
+      className: cx(classes.root, className, {
+        [classes.disabled]: formElementProps.disabled,
+        [classes.invalid]: localInvalid,
+        [classes.resizable]: multiline && resizable,
+        [classes.readOnly]: formElementProps.readOnly
+      }),
+      children: [/* @__PURE__ */ jsxRuntime.jsx(material.Input, {
+        id,
+        name: formElementProps.name,
+        value,
+        defaultValue,
+        type,
+        placeholder,
+        readOnly: !!formElementProps.readOnly,
+        disabled: formElementProps.disabled,
+        onChange: onChangeHandler,
+        className: cx({
+          [classes.inputRootInvalid]: localInvalid,
+          [classes.inputRootReadOnly]: formElementProps.readOnly
+        }),
+        classes: {
+          root: classes.inputRoot,
+          focused: classes.inputRootFocused,
+          disabled: classes.inputRootDisabled,
+          multiline: classes.inputRootMultiline,
+          input: cx(classes.input, {
+            [classes.inputResizable]: !formElementProps.disabled && resizable,
+            [classes.inputDisabled]: formElementProps.disabled,
+            [classes.inputReadOnly]: formElementProps.readOnly
+          })
+        },
+        inputProps: {
+          // Avoid the required attribute at the root node
+          required: formElementProps.required,
+          ...inputProps,
+          ...ariaProps
+        },
+        inputRef,
+        multiline,
+        rows: 10,
+        ...others
+      }), !multiline && /* @__PURE__ */ jsxRuntime.jsx("div", {
+        role: "presentation",
+        className: classes.inputBorderContainer
       })]
-    })
+    })]
   });
 };
+exports.baseInputClasses = BaseInput_styles.staticClasses;
 exports.HvBaseInput = HvBaseInput;
 //# sourceMappingURL=BaseInput.cjs.map

package/dist/cjs/components/BaseInput/BaseInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"BaseInput.cjs","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { RefObject, useContext } from \"react\";\nimport {\n  InputBaseComponentProps as MuiInputBaseComponentProps,\n  InputProps as MuiInputProps,\n  Input as MuiInput,\n} from \"@mui/material\";\nimport { HvBaseProps } from \"@core/types\";\nimport {\n  HvFormElementContext,\n  HvFormElementDescriptorsContext,\n  buildFormElementPropsFromContext,\n  buildAriaPropsFromContext,\n} from \"@core/components\";\nimport { ClassNames, css as emotionCss, Global } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport baseInputClasses, { HvBaseInputClasses } from \"./baseInputClasses\";\nimport { styles } from \"./BaseInput.styles\";\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n  \"input:-webkit-autofill\": {\n    WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n    WebkitTextFillColor: theme.colors.secondary,\n  },\n\n  // Clears number input up/down arrows in Chrome and Firefox\n  \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n    WebkitAppearance: \"none\",\n    margin: 0,\n  },\n  \"input[type=number]\": {\n    MozAppearance: \"textfield\",\n  },\n\n  // Clears time input clock in Chrome\n  \"input::-webkit-calendar-picker-indicator\": {\n    display: \"none\",\n  },\n\n  // Clears search input clear button in Chrome\n  \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n    {\n      display: \"none\",\n    },\n});\n\nexport interface HvBaseInputProps\n  extends Omit<MuiInputProps, \"onChange\" | \"classes\">,\n    HvBaseProps<\n      HTMLDivElement,\n      | \"onChange\"\n      | \"color\"\n      | \"onBlur\"\n      | \"onFocus\"\n      | \"onInvalid\"\n      | \"onKeyDown\"\n      | \"onKeyUp\"\n    > {\n  /** The input name. */\n  name?: string;\n  /** The value of the input, when controlled. */\n  value?: string;\n  /** The initial value of the input, when uncontrolled. */\n  defaultValue?: string;\n  /** If `true` the input is disabled. */\n  disabled?: boolean;\n  /** Indicates that the input is not editable. */\n  readOnly?: boolean;\n  /** If true, the input element will be required. */\n  required?: boolean;\n  /** The function that will be executed onChange, allows modification of the input,\n   * it receives the value. If a new value should be presented it must returned it. */\n  onChange?: (\n    event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /** The input type. */\n  type?: string;\n  /** Label inside the input used to help user. */\n  placeholder?: string;\n  /** If true, a textarea element will be rendered. */\n  multiline?: boolean;\n  /** If true and multiline is also true the textarea element will be resizable. */\n  resizable?: boolean;\n  /** Denotes if the input is in an invalid state. */\n  invalid?: boolean;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /** Allows passing a ref to the underlying input */\n  inputRef?: RefObject<HTMLElement>;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBaseInputClasses;\n}\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = ({\n  classes,\n  className = \"\",\n  id,\n  name,\n  value,\n  defaultValue,\n  required,\n  readOnly,\n  disabled,\n  onChange,\n  type = \"text\",\n  placeholder,\n  multiline = false,\n  resizable = false,\n  invalid = false,\n  inputRef,\n  inputProps = {},\n  ...others\n}: HvBaseInputProps) => {\n  const formElementContext = useContext(HvFormElementContext);\n  const formElementProps = buildFormElementPropsFromContext(\n    name,\n    disabled,\n    readOnly,\n    required,\n    formElementContext\n  );\n\n  const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n  const formElementDescriptorsContext = useContext(\n    HvFormElementDescriptorsContext\n  );\n  const ariaProps = buildAriaPropsFromContext(\n    inputProps,\n    formElementDescriptorsContext,\n    localInvalid,\n    id\n  );\n\n  const onChangeHandler = (\n    event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>\n  ) => {\n    onChange?.(event, event.target.value);\n  };\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <>\n          <Global styles={baseInputStyles} />\n          <div\n            className={cx(\n              baseInputClasses.root,\n              formElementProps.disabled && baseInputClasses.disabled,\n              localInvalid && baseInputClasses.invalid,\n              multiline && resizable && baseInputClasses.resizable,\n              formElementProps.readOnly && baseInputClasses.readOnly,\n              css(styles.root),\n              formElementProps.disabled && css(styles.disabled),\n              localInvalid && css(styles.invalid),\n              multiline && resizable && css(styles.resizable),\n              formElementProps.readOnly && css(styles.readOnly),\n              className,\n              classes?.root,\n              formElementProps.disabled && classes?.disabled,\n              localInvalid && classes?.invalid,\n              multiline && resizable && classes?.resizable,\n              formElementProps.readOnly && classes?.readOnly\n            )}\n          >\n            <MuiInput\n              id={id}\n              name={formElementProps.name}\n              value={value}\n              defaultValue={defaultValue}\n              type={type}\n              placeholder={placeholder}\n              readOnly={!!formElementProps.readOnly}\n              disabled={formElementProps.disabled}\n              onChange={onChangeHandler}\n              className={cx(\n                localInvalid && baseInputClasses.inputRootInvalid,\n                formElementProps.readOnly && baseInputClasses.inputRootReadOnly,\n                localInvalid && css(styles.inputRootInvalid),\n                formElementProps.readOnly && css(styles.inputRootReadOnly),\n                localInvalid && classes?.inputRootInvalid,\n                formElementProps.readOnly && classes?.inputRootReadOnly\n              )}\n              classes={{\n                root: cx(\n                  baseInputClasses.inputRoot,\n                  css(styles.inputRoot),\n                  classes?.inputRoot\n                ),\n                focused: cx(\n                  baseInputClasses.inputRootFocused,\n                  css(styles.inputRootFocused),\n                  classes?.inputRootFocused\n                ),\n                disabled: cx(\n                  baseInputClasses.inputRootDisabled,\n                  css(styles.inputRootDisabled),\n                  classes?.inputRootDisabled\n                ),\n                multiline: cx(\n                  baseInputClasses.inputRootMultiline,\n                  css(styles.inputRootMultiline),\n                  classes?.inputRootMultiline\n                ),\n                input: cx(\n                  baseInputClasses.input,\n                  !formElementProps.disabled &&\n                    resizable &&\n                    baseInputClasses.inputResizable,\n                  formElementProps.disabled && baseInputClasses.inputDisabled,\n                  formElementProps.readOnly && baseInputClasses.inputReadOnly,\n                  css(styles.input),\n                  !formElementProps.disabled &&\n                    resizable &&\n                    css(styles.inputResizable),\n                  formElementProps.disabled && css(styles.inputDisabled),\n                  formElementProps.readOnly && css(styles.inputReadOnly),\n                  classes?.input,\n                  !formElementProps.disabled &&\n                    resizable &&\n                    classes?.inputResizable,\n                  formElementProps.disabled && classes?.inputDisabled,\n                  formElementProps.readOnly && classes?.inputReadOnly\n                ),\n              }}\n              inputProps={{\n                // Avoid the required attribute at the root node\n                required: formElementProps.required,\n                ...inputProps,\n                ...ariaProps,\n              }}\n              inputRef={inputRef}\n              multiline={multiline}\n              rows={10}\n              {...others}\n            />\n            {!multiline && (\n              <div\n                role=\"presentation\"\n                className={cx(\n                  baseInputClasses.inputBorderContainer,\n                  css(styles.inputBorderContainer),\n                  classes?.inputBorderContainer\n                )}\n              />\n            )}\n          </div>\n        </>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["baseInputStyles","emotionCss","WebkitBoxShadow","theme","colors","atmo1","WebkitTextFillColor","secondary","WebkitAppearance","margin","MozAppearance","display","process","env","NODE_ENV","HvBaseInput","classes","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","formElementContext","useContext","HvFormElementContext","formElementProps","buildFormElementPropsFromContext","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","buildAriaPropsFromContext","onChangeHandler","event","target","ClassNames","children","css","cx","_Fragment","_jsx","Global","styles","_jsxs","baseInputClasses","root","MuiInput","inputRootInvalid","inputRootReadOnly","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputReadOnly","rows","role","inputBorderContainer"],"mappings":"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"}
+{"version":3,"file":"BaseInput.cjs","sources":["../../../../src/components/BaseInput/BaseInput.tsx"],"sourcesContent":["import { useContext } from \"react\";\nimport {\n  InputBaseComponentProps as MuiInputBaseComponentProps,\n  InputProps as MuiInputProps,\n  Input as MuiInput,\n  InputBaseProps,\n} from \"@mui/material\";\nimport { HvBaseProps } from \"@core/types\";\nimport { ExtractNames } from \"@core/utils\";\nimport {\n  HvFormElementContext,\n  HvFormElementDescriptorsContext,\n  buildFormElementPropsFromContext,\n  buildAriaPropsFromContext,\n} from \"@core/components\";\nimport { css as emotionCss, Global } from \"@emotion/react\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { staticClasses, useClasses } from \"./BaseInput.styles\";\n\nexport { staticClasses as baseInputClasses };\n\nexport type HvBaseInputClasses = ExtractNames<typeof useClasses>;\n\n// Global styles for the base input.\nconst baseInputStyles = emotionCss({\n  \"input:-webkit-autofill\": {\n    WebkitBoxShadow: `0 0 0px 1000px ${theme.colors.atmo1} inset`,\n    WebkitTextFillColor: theme.colors.secondary,\n  },\n\n  // Clears number input up/down arrows in Chrome and Firefox\n  \"input::-webkit-outer-spin-button,input::-webkit-inner-spin-button\": {\n    WebkitAppearance: \"none\",\n    margin: 0,\n  },\n  \"input[type=number]\": {\n    MozAppearance: \"textfield\",\n  },\n\n  // Clears time input clock in Chrome\n  \"input::-webkit-calendar-picker-indicator\": {\n    display: \"none\",\n  },\n\n  // Clears search input clear button in Chrome\n  \"input::-webkit-search-decoration,input::-webkit-search-cancel-button,input::-webkit-search-results-button,input::-webkit-search-results-decoration\":\n    {\n      display: \"none\",\n    },\n});\n\nexport interface HvBaseInputProps\n  extends Omit<MuiInputProps, \"onChange\" | \"classes\">,\n    HvBaseProps<\n      HTMLDivElement,\n      | \"onChange\"\n      | \"color\"\n      | \"onBlur\"\n      | \"onFocus\"\n      | \"onInvalid\"\n      | \"onKeyDown\"\n      | \"onKeyUp\"\n    > {\n  /** The input name. */\n  name?: string;\n  /** The value of the input, when controlled. */\n  value?: string;\n  /** The initial value of the input, when uncontrolled. */\n  defaultValue?: string;\n  /** If `true` the input is disabled. */\n  disabled?: boolean;\n  /** Indicates that the input is not editable. */\n  readOnly?: boolean;\n  /** If true, the input element will be required. */\n  required?: boolean;\n  /** The function that will be executed onChange, allows modification of the input,\n   * it receives the value. If a new value should be presented it must returned it. */\n  onChange?: (\n    event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,\n    value: string\n  ) => void;\n  /** The input type. */\n  type?: string;\n  /** Label inside the input used to help user. */\n  placeholder?: string;\n  /** If true, a textarea element will be rendered. */\n  multiline?: boolean;\n  /** If true and multiline is also true the textarea element will be resizable. */\n  resizable?: boolean;\n  /** Denotes if the input is in an invalid state. */\n  invalid?: boolean;\n  /** Attributes applied to the input element. */\n  inputProps?: MuiInputBaseComponentProps;\n  /** Allows passing a ref to the underlying input */\n  inputRef?: InputBaseProps[\"inputRef\"];\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvBaseInputClasses;\n}\n\n/**\n * An Input component that only posses the most basic functionalities.\n * It should be used alongside the other form elements to construct a proper accessible form.\n */\nexport const HvBaseInput = ({\n  classes: classesProp,\n  className = \"\",\n  id,\n  name,\n  value,\n  defaultValue,\n  required,\n  readOnly,\n  disabled,\n  onChange,\n  type = \"text\",\n  placeholder,\n  multiline = false,\n  resizable = false,\n  invalid = false,\n  inputRef,\n  inputProps = {},\n  ...others\n}: HvBaseInputProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const formElementContext = useContext(HvFormElementContext);\n  const formElementProps = buildFormElementPropsFromContext(\n    name,\n    disabled,\n    readOnly,\n    required,\n    formElementContext\n  );\n\n  const localInvalid = invalid || formElementProps.status === \"invalid\";\n\n  const formElementDescriptorsContext = useContext(\n    HvFormElementDescriptorsContext\n  );\n  const ariaProps = buildAriaPropsFromContext(\n    inputProps,\n    formElementDescriptorsContext,\n    localInvalid,\n    id\n  );\n\n  const onChangeHandler: MuiInputProps[\"onChange\"] = (event) => {\n    onChange?.(event, event.target.value);\n  };\n\n  return (\n    <>\n      <Global styles={baseInputStyles} />\n      <div\n        className={cx(classes.root, className, {\n          [classes.disabled]: formElementProps.disabled,\n          [classes.invalid]: localInvalid,\n          [classes.resizable]: multiline && resizable,\n          [classes.readOnly]: formElementProps.readOnly,\n        })}\n      >\n        <MuiInput\n          id={id}\n          name={formElementProps.name}\n          value={value}\n          defaultValue={defaultValue}\n          type={type}\n          placeholder={placeholder}\n          readOnly={!!formElementProps.readOnly}\n          disabled={formElementProps.disabled}\n          onChange={onChangeHandler}\n          className={cx({\n            [classes.inputRootInvalid]: localInvalid,\n            [classes.inputRootReadOnly]: formElementProps.readOnly,\n          })}\n          classes={{\n            root: classes.inputRoot,\n            focused: classes.inputRootFocused,\n            disabled: classes.inputRootDisabled,\n            multiline: classes.inputRootMultiline,\n            input: cx(classes.input, {\n              [classes.inputResizable]: !formElementProps.disabled && resizable,\n              [classes.inputDisabled]: formElementProps.disabled,\n              [classes.inputReadOnly]: formElementProps.readOnly,\n            }),\n          }}\n          inputProps={{\n            // Avoid the required attribute at the root node\n            required: formElementProps.required,\n            ...inputProps,\n            ...ariaProps,\n          }}\n          inputRef={inputRef}\n          multiline={multiline}\n          rows={10}\n          {...others}\n        />\n        {!multiline && (\n          <div role=\"presentation\" className={classes.inputBorderContainer} />\n        )}\n      </div>\n    </>\n  );\n};\n"],"names":["baseInputStyles","emotionCss","WebkitBoxShadow","theme","colors","atmo1","WebkitTextFillColor","secondary","WebkitAppearance","margin","MozAppearance","display","process","env","NODE_ENV","HvBaseInput","classes","classesProp","className","id","name","value","defaultValue","required","readOnly","disabled","onChange","type","placeholder","multiline","resizable","invalid","inputRef","inputProps","others","cx","useClasses","formElementContext","useContext","HvFormElementContext","formElementProps","buildFormElementPropsFromContext","localInvalid","status","formElementDescriptorsContext","HvFormElementDescriptorsContext","ariaProps","buildAriaPropsFromContext","onChangeHandler","event","target","_Fragment","children","_jsx","Global","styles","_jsxs","root","MuiInput","inputRootInvalid","inputRootReadOnly","inputRoot","focused","inputRootFocused","inputRootDisabled","inputRootMultiline","input","inputResizable","inputDisabled","inputReadOnly","rows","role","inputBorderContainer"],"mappings":"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"}

package/dist/cjs/components/BaseInput/BaseInput.styles.cjs

@@ -1,35 +1,38 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const baseInputClasses = require("./baseInputClasses.cjs");
+const classes = require("../../utils/classes.cjs");
 const focusUtils = require("../../utils/focusUtils.cjs");
-const styles = {
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvBaseInput", {
   root: {
     display: "inline-block",
     width: "100%",
     position: "relative",
-    [`&:hover .${baseInputClasses.default.inputBorderContainer}`]: {
+    "&:hover $inputBorderContainer": {
       backgroundColor: uikitStyles.theme.baseInput.hoverColor
     },
-    [`&:focus-within .${baseInputClasses.default.inputBorderContainer}`]: {
+    "&:focus-within $inputBorderContainer": {
       backgroundColor: uikitStyles.theme.baseInput.hoverColor
     }
   },
   disabled: {
-    [`& .${baseInputClasses.default.inputBorderContainer}`]: {
+    "& $inputBorderContainer": {
       backgroundColor: uikitStyles.theme.colors.atmo4
     },
-    [`&:hover .${baseInputClasses.default.inputBorderContainer}`]: {
+    "&:hover $inputBorderContainer": {
       backgroundColor: uikitStyles.theme.colors.atmo4
     },
-    [`& .${baseInputClasses.default.inputRootMultiline}`]: {
-      [`& .${baseInputClasses.default.input}`]: {
+    "& $inputRootMultiline": {
+      "& $input": {
         backgroundColor: uikitStyles.theme.baseInput.disabledBackgroundColor,
         border: `1px solid ${uikitStyles.theme.baseInput.multilineDisabledBorderColor}`
       }
     },
-    [`&:hover .${baseInputClasses.default.inputRootMultiline}`]: {
-      [`& .${baseInputClasses.default.input}`]: {
+    "&:hover $inputRootMultiline": {
+      "& $input": {
         backgroundColor: uikitStyles.theme.baseInput.disabledBackgroundColor,
         border: `1px solid ${uikitStyles.theme.baseInput.multilineDisabledBorderColor}`
       }
@@ -37,24 +40,24 @@ const styles = {
   },
   invalid: {
     "&:not(.disabled)": {
-      [`& .${baseInputClasses.default.inputBorderContainer}`]: {
+      "& $inputBorderContainer": {
         backgroundColor: uikitStyles.theme.colors.negative
       },
-      [`&:hover .${baseInputClasses.default.inputBorderContainer}`]: {
+      "&:hover $inputBorderContainer": {
         backgroundColor: uikitStyles.theme.colors.negative
       },
-      [`& .${baseInputClasses.default.inputRootMultiline}`]: {
-        [`& .${baseInputClasses.default.input}`]: {
+      "& $inputRootMultiline": {
+        "& $input": {
           border: `1px solid ${uikitStyles.theme.colors.negative}`
         }
       },
-      [`&:hover .${baseInputClasses.default.inputRootMultiline}`]: {
-        [`& .${baseInputClasses.default.input}`]: {
+      "&:hover $inputRootMultiline": {
+        "& $input": {
           border: `1px solid ${uikitStyles.theme.colors.negative}`
         }
       },
-      [`&:focus-within .${baseInputClasses.default.inputRootMultiline}`]: {
-        [`& .${baseInputClasses.default.input}`]: {
+      "&:focus-within $inputRootMultiline": {
+        "& $input": {
           border: `1px solid ${uikitStyles.theme.colors.negative}`
         }
       }
@@ -64,29 +67,29 @@ const styles = {
     width: "auto"
   },
   readOnly: {
-    [`& .${baseInputClasses.default.inputBorderContainer}`]: {
+    "& $inputBorderContainer": {
       backgroundColor: "transparent"
     },
-    [`&:hover .${baseInputClasses.default.inputBorderContainer}`]: {
+    "&:hover $inputBorderContainer": {
       backgroundColor: "transparent"
     },
-    [`&:focus-within .${baseInputClasses.default.inputBorderContainer}`]: {
+    "&:focus-within $inputBorderContainer": {
       backgroundColor: "transparent"
     },
-    [`& .${baseInputClasses.default.inputRootMultiline}`]: {
-      [`& .${baseInputClasses.default.input}`]: {
+    "& $inputRootMultiline": {
+      "& $input": {
         border: `1px solid ${uikitStyles.theme.baseInput.readOnlyBorderColor}`,
         backgroundColor: uikitStyles.theme.baseInput.readOnlyBackgroundColor
       }
     },
-    [`&:hover .${baseInputClasses.default.inputRootMultiline}`]: {
-      [`& .${baseInputClasses.default.input}`]: {
+    "&:hover $inputRootMultiline": {
+      "& $input": {
         border: `1px solid ${uikitStyles.theme.baseInput.readOnlyBorderColor}`,
         backgroundColor: uikitStyles.theme.baseInput.readOnlyBackgroundColor
       }
     },
-    [`&:focus-within .${baseInputClasses.default.inputRootMultiline}`]: {
-      [`& .${baseInputClasses.default.input}`]: {
+    "&:focus-within $inputRootMultiline": {
+      "& $input": {
         border: `1px solid ${uikitStyles.theme.baseInput.readOnlyBorderColor}`,
         backgroundColor: uikitStyles.theme.baseInput.readOnlyBackgroundColor
       }
@@ -116,10 +119,10 @@ const styles = {
     boxSizing: "border-box",
     backgroundColor: uikitStyles.theme.colors.atmo1,
     fontFamily: uikitStyles.theme.fontFamily.body,
-    [`&:hover:not(.${baseInputClasses.default.inputRootDisabled}):not(.${baseInputClasses.default.inputRootInvalid}):not(.${baseInputClasses.default.inputRootReadOnly})`]: {
+    "&:hover:not($inputRootDisabled):not($inputRootInvalid):not($inputRootReadOnly)": {
       borderColor: uikitStyles.theme.baseInput.hoverColor
     },
-    [`&:hover:not(.${baseInputClasses.default.inputRootDisabled})::before`]: {
+    "&:hover:not($inputRootDisabled)::before": {
       borderBottom: "none"
     },
     "&::before": {
@@ -135,7 +138,7 @@ const styles = {
     "&:hover": {
       background: uikitStyles.theme.colors.atmo1
     },
-    [`&.${baseInputClasses.default.inputRootReadOnly}`]: {
+    "& $inputRootReadOnly": {
       backgroundColor: uikitStyles.theme.baseInput.readOnlyBackgroundColor
     }
   },
@@ -157,7 +160,7 @@ const styles = {
     overflow: "auto",
     border: "none",
     height: "auto",
-    [`& .${baseInputClasses.default.input}`]: {
+    "& $input": {
       border: `1px solid ${uikitStyles.theme.baseInput.multilineBorderColor}`,
       borderRadius: uikitStyles.theme.radii.base,
       backgroundColor: uikitStyles.theme.colors.atmo1,
@@ -201,6 +204,7 @@ const styles = {
     resize: "both",
     width: "100%"
   }
-};
-exports.styles = styles;
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=BaseInput.styles.cjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"BaseInput.styles.cjs","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { outlineStyles } from \"@core/utils\";\nimport { CSSProperties } from \"react\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\nimport baseInputClasses, { HvBaseInputClasses } from \"./baseInputClasses\";\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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"}
+{"version":3,"file":"BaseInput.styles.cjs","sources":["../../../../src/components/BaseInput/BaseInput.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { createClasses, outlineStyles } from \"@core/utils\";\nimport { CSSProperties } from \"react\";\n\nexport const { staticClasses, useClasses } = createClasses(\"HvBaseInput\", {\n  root: {\n    display: \"inline-block\",\n    width: \"100%\",\n    position: \"relative\",\n\n    \"&:hover $inputBorderContainer\": {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n\n    \"&:focus-within $inputBorderContainer\": {\n      backgroundColor: theme.baseInput.hoverColor,\n    },\n  },\n  disabled: {\n    \"& $inputBorderContainer\": {\n      backgroundColor: theme.colors.atmo4,\n    },\n\n    \"&:hover $inputBorderContainer\": {\n      backgroundColor: theme.colors.atmo4,\n    },\n\n    \"& $inputRootMultiline\": {\n      \"& $input\": {\n        backgroundColor: theme.baseInput.disabledBackgroundColor,\n        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n      },\n    },\n\n    \"&:hover $inputRootMultiline\": {\n      \"& $input\": {\n        backgroundColor: theme.baseInput.disabledBackgroundColor,\n        border: `1px solid ${theme.baseInput.multilineDisabledBorderColor}`,\n      },\n    },\n  },\n  invalid: {\n    \"&:not(.disabled)\": {\n      \"& $inputBorderContainer\": {\n        backgroundColor: theme.colors.negative,\n      },\n\n      \"&:hover $inputBorderContainer\": {\n        backgroundColor: theme.colors.negative,\n      },\n\n      \"& $inputRootMultiline\": {\n        \"& $input\": {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n\n      \"&:hover $inputRootMultiline\": {\n        \"& $input\": {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n\n      \"&:focus-within $inputRootMultiline\": {\n        \"& $input\": {\n          border: `1px solid ${theme.colors.negative}`,\n        },\n      },\n    },\n  },\n  resizable: { width: \"auto\" },\n  readOnly: {\n    \"& $inputBorderContainer\": {\n      backgroundColor: \"transparent\",\n    },\n\n    \"&:hover $inputBorderContainer\": {\n      backgroundColor: \"transparent\",\n    },\n\n    \"&:focus-within $inputBorderContainer\": {\n      backgroundColor: \"transparent\",\n    },\n\n    \"& $inputRootMultiline\": {\n      \"& $input\": {\n        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n\n    \"&:hover $inputRootMultiline\": {\n      \"& $input\": {\n        border: `1px solid ${theme.baseInput.readOnlyBorderColor}`,\n        backgroundColor: theme.baseInput.readOnlyBackgroundColor,\n      },\n    },\n\n    \"&:focus-within $inputRootMultiline\": {\n      \"& $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($inputRootDisabled):not($inputRootInvalid):not($inputRootReadOnly)\":\n      {\n        borderColor: theme.baseInput.hoverColor,\n      },\n\n    \"&:hover:not($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    \"& $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    \"& $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":["staticClasses","useClasses","createClasses","root","display","width","position","backgroundColor","theme","baseInput","hoverColor","disabled","colors","atmo4","disabledBackgroundColor","border","multilineDisabledBorderColor","invalid","negative","resizable","readOnly","readOnlyBorderColor","readOnlyBackgroundColor","inputBorderContainer","height","underlineHeight","top","left","inputRootInvalid","borderColor","inputRootReadOnly","inputRoot","margin","borderRadius","radii","base","boxSizing","atmo1","fontFamily","body","borderBottom","inputRootFocused","background","outlineStyles","inputRootDisabled","disabledBorderColor","cursor","borderBottomStyle","inputRootMultiline","padding","overflow","multilineBorderColor","minHeight","marginLeft","marginRight","input","space","xs","textOverflow","outline","flexGrow","typography","opacity","color","placeholderColor","inputDisabled","disabledTextColor","inputReadOnly","readOnlyTextColor","inputResizable","resize"],"mappings":"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"}

package/dist/cjs/components/Box/Box.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const React = require("react");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
-const useSx = (sx) => {
+const sxFn = (sx) => {
   return typeof sx === "function" ? sx(uikitStyles.theme) : sx;
 };
 const HvBox = React.forwardRef(({
@@ -15,7 +15,7 @@ const HvBox = React.forwardRef(({
 }, ref) => {
   const Component = component || "div";
   return /* @__PURE__ */ jsxRuntime.jsx(Component, {
-    style: sx ? useSx(sx) : style,
+    style: sx ? sxFn(sx) : style,
     ref,
     ...restProps,
     children

package/dist/cjs/components/Box/Box.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Box.cjs","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { forwardRef } from \"react\";\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types\";\n\ntype SxProps = React.CSSProperties | ((theme) => React.CSSProperties);\n\ntype HvBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n  C,\n  { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n  props: HvBaseProps<C>\n) => React.ReactElement | null;\n\nconst useSx = (sx: SxProps) => {\n  return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\nexport const HvBox: HvBoxProps = forwardRef(\n  <C extends React.ElementType = \"div\">(\n    { style, component, sx, children, ...restProps }: HvBaseProps<C>,\n    ref?: PolymorphicRef<C>\n  ) => {\n    const Component = component || \"div\";\n\n    return (\n      <Component style={sx ? useSx(sx) : style} ref={ref} {...restProps}>\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["useSx","sx","theme","HvBox","forwardRef","style","component","children","restProps","ref","Component"],"mappings":";;;;;AAeA,MAAMA,QAAQA,CAACC,OAAgB;AAC7B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,YAAK,KAAA,IAAID;AAChD;AAEaE,MAAAA,QAAoBC,iBAC/B,CACE;AAAA,EAAEC;AAAAA,EAAOC;AAAAA,EAAWL;AAAAA,EAAIM;AAAAA,EAAU,GAAGC;AAA0B,GAC/DC,QACG;AACH,QAAMC,YAAYJ,aAAa;AAE/B,wCACGI,WAAS;AAAA,IAACL,OAAOJ,KAAKD,MAAMC,EAAE,IAAII;AAAAA,IAAOI;AAAAA,IAAS,GAAKD;AAAAA,IAASD;AAAAA,EAAAA,CAEtD;AAEf,CACF;;"}
+{"version":3,"file":"Box.cjs","sources":["../../../../src/components/Box/Box.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { forwardRef } from \"react\";\nimport { PolymorphicComponentRef, PolymorphicRef } from \"@core/types\";\n\ntype SxProps = React.CSSProperties | ((theme) => React.CSSProperties);\n\ntype HvBoxBaseProps<C extends React.ElementType> = PolymorphicComponentRef<\n  C,\n  { style?: React.CSSProperties; sx?: SxProps }\n>;\n\nexport type HvBoxProps = <C extends React.ElementType = \"div\">(\n  props: HvBoxBaseProps<C>\n) => React.ReactElement | null;\n\nconst sxFn = (sx: SxProps) => {\n  return typeof sx === \"function\" ? sx(theme) : sx;\n};\n\n/**\n * Customizable layout component that can be used to wrap other components.\n * It can be used to add styles to the wrapped components.\n * It can also be used to create a layout using the flexbox properties.\n */\nexport const HvBox: HvBoxProps = forwardRef(\n  <C extends React.ElementType = \"div\">(\n    { style, component, sx, children, ...restProps }: HvBoxBaseProps<C>,\n    ref?: PolymorphicRef<C>\n  ) => {\n    const Component = component || \"div\";\n\n    return (\n      <Component style={sx ? sxFn(sx) : style} ref={ref} {...restProps}>\n        {children}\n      </Component>\n    );\n  }\n);\n"],"names":["sxFn","sx","theme","HvBox","forwardRef","style","component","children","restProps","ref","Component"],"mappings":";;;;;AAeA,MAAMA,OAAOA,CAACC,OAAgB;AAC5B,SAAO,OAAOA,OAAO,aAAaA,GAAGC,YAAK,KAAA,IAAID;AAChD;AAOaE,MAAAA,QAAoBC,iBAC/B,CACE;AAAA,EAAEC;AAAAA,EAAOC;AAAAA,EAAWL;AAAAA,EAAIM;AAAAA,EAAU,GAAGC;AAA6B,GAClEC,QACG;AACH,QAAMC,YAAYJ,aAAa;AAE/B,wCACGI,WAAS;AAAA,IAACL,OAAOJ,KAAKD,KAAKC,EAAE,IAAII;AAAAA,IAAOI;AAAAA,IAAS,GAAKD;AAAAA,IAASD;AAAAA,EAAAA,CAErD;AAEf,CACF;;"}

package/dist/cjs/components/BreadCrumb/Page/Page.cjs

@@ -1,8 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const react = require("@emotion/react");
 const startCase = require("lodash/startCase");
-const pageClasses = require("./pageClasses.cjs");
 const Page_styles = require("./Page.styles.cjs");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const OverflowTooltip = require("../../OverflowTooltip/OverflowTooltip.cjs");
@@ -13,8 +11,12 @@ const HvPage = ({
   component,
   onClick,
   elem,
-  classes
+  classes: classesProp
 }) => {
+  const {
+    classes,
+    cx
+  } = Page_styles.useClasses(classesProp);
   const {
     label,
     path,
@@ -24,23 +26,19 @@ const HvPage = ({
     event.preventDefault();
     onClick == null ? void 0 : onClick(event, elem);
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
-    children: ({
-      css,
-      cx
-    }) => /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      noWrap: true,
-      variant: "label",
-      component: component || "a",
-      href: elem.path,
-      onClick: onClick && handleClick,
-      className: cx(css(Page_styles.styles.link), pageClasses.default.link, classes == null ? void 0 : classes.link, pageClasses.default.label, classes == null ? void 0 : classes.label, pageClasses.default.a, classes == null ? void 0 : classes.a),
-      ...others,
-      children: /* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, {
-        data: startCase__default.default(elem.label)
-      })
+  return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
+    noWrap: true,
+    variant: "label",
+    component: component || "a",
+    href: elem.path,
+    onClick: onClick && handleClick,
+    className: cx(classes.link, classes.label, classes.a),
+    ...others,
+    children: /* @__PURE__ */ jsxRuntime.jsx(OverflowTooltip.HvOverflowTooltip, {
+      data: startCase__default.default(elem.label)
     })
   });
 };
+exports.pageClasses = Page_styles.staticClasses;
 exports.HvPage = HvPage;
 //# sourceMappingURL=Page.cjs.map

package/dist/cjs/components/BreadCrumb/Page/Page.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Page.cjs","sources":["../../../../../src/components/BreadCrumb/Page/Page.tsx"],"sourcesContent":["import { ClassNames } from \"@emotion/react\";\nimport {\n  HvBreadCrumbPathElement,\n  HvOverflowTooltip,\n  HvTypography,\n} from \"@core/components\";\nimport startCase from \"lodash/startCase\";\nimport { MouseEvent } from \"react\";\nimport pageClasses, { HvPageClasses } from \"./pageClasses\";\nimport { styles } from \"./Page.styles\";\n\nexport interface HvPageProps {\n  component?: React.ElementType;\n  onClick?: (event: MouseEvent<HTMLElement>, data: any) => void;\n  elem: HvBreadCrumbPathElement;\n  classes?: HvPageClasses;\n}\n\nexport const HvPage = ({ component, onClick, elem, classes }: HvPageProps) => {\n  const { label, path, ...others } = elem;\n  const handleClick = (event: MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    onClick?.(event, elem);\n  };\n\n  return (\n    <ClassNames>\n      {({ css, cx }) => (\n        <HvTypography\n          noWrap\n          variant=\"label\"\n          component={component || \"a\"}\n          href={elem.path}\n          onClick={onClick && handleClick}\n          className={cx(\n            css(styles.link),\n            pageClasses.link,\n            classes?.link,\n            pageClasses.label,\n            classes?.label,\n            pageClasses.a,\n            classes?.a\n          )}\n          {...others}\n        >\n          <HvOverflowTooltip data={startCase(elem.label)} />\n        </HvTypography>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvPage","component","onClick","elem","classes","label","path","others","handleClick","event","preventDefault","ClassNames","children","css","cx","HvTypography","noWrap","variant","href","className","styles","link","pageClasses","a","HvOverflowTooltip","data","startCase"],"mappings":";;;;;;;;;;;AAkBO,MAAMA,SAASA,CAAC;AAAA,EAAEC;AAAAA,EAAWC;AAAAA,EAASC;AAAAA,EAAMC;AAAqB,MAAM;AACtE,QAAA;AAAA,IAAEC;AAAAA,IAAOC;AAAAA,IAAM,GAAGC;AAAAA,EAAWJ,IAAAA;AAC7BK,QAAAA,cAAcA,CAACC,UAAmC;AACtDA,UAAMC,eAAe;AACrBR,uCAAUO,OAAON;AAAAA,EAAI;AAGvB,wCACGQ,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,MAAKC;AAAAA,IAAAA,qCACNC,WAAAA,cAAY;AAAA,MACXC,QAAM;AAAA,MACNC,SAAQ;AAAA,MACRhB,WAAWA,aAAa;AAAA,MACxBiB,MAAMf,KAAKG;AAAAA,MACXJ,SAASA,WAAWM;AAAAA,MACpBW,WAAWL,GACTD,IAAIO,YAAAA,OAAOC,IAAI,GACfC,YAAAA,QAAYD,MACZjB,mCAASiB,MACTC,oBAAYjB,OACZD,mCAASC,OACTiB,YAAAA,QAAYC,GACZnB,mCAASmB,CACX;AAAA,MAAE,GACEhB;AAAAA,MAAMK,yCAETY,mCAAiB;AAAA,QAACC,MAAMC,mBAAAA,QAAUvB,KAAKE,KAAK;AAAA,MAAA,CAAI;AAAA,IAAA,CACrC;AAAA,EAAA,CAEN;AAEhB;;"}
+{"version":3,"file":"Page.cjs","sources":["../../../../../src/components/BreadCrumb/Page/Page.tsx"],"sourcesContent":["import {\n  HvBreadCrumbPathElement,\n  HvOverflowTooltip,\n  HvTypography,\n} from \"@core/components\";\nimport { ExtractNames } from \"@core/utils\";\nimport startCase from \"lodash/startCase\";\nimport { MouseEvent } from \"react\";\nimport { staticClasses, useClasses } from \"./Page.styles\";\n\nexport { staticClasses as pageClasses };\n\nexport type HvPageClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvPageProps {\n  component?: React.ElementType;\n  onClick?: (event: MouseEvent<HTMLElement>, data: any) => void;\n  elem: HvBreadCrumbPathElement;\n  classes?: HvPageClasses;\n}\n\nexport const HvPage = ({\n  component,\n  onClick,\n  elem,\n  classes: classesProp,\n}: HvPageProps) => {\n  const { classes, cx } = useClasses(classesProp);\n  const { label, path, ...others } = elem;\n  const handleClick = (event: MouseEvent<HTMLElement>) => {\n    event.preventDefault();\n    onClick?.(event, elem);\n  };\n\n  return (\n    <HvTypography\n      noWrap\n      variant=\"label\"\n      component={component || \"a\"}\n      href={elem.path}\n      onClick={onClick && handleClick}\n      className={cx(classes.link, classes.label, classes.a)}\n      {...others}\n    >\n      <HvOverflowTooltip data={startCase(elem.label)} />\n    </HvTypography>\n  );\n};\n"],"names":["HvPage","component","onClick","elem","classes","classesProp","cx","useClasses","label","path","others","handleClick","event","preventDefault","HvTypography","noWrap","variant","href","className","link","a","children","HvOverflowTooltip","data","startCase"],"mappings":";;;;;;;;;AAqBO,MAAMA,SAASA,CAAC;AAAA,EACrBC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAASC;AACE,MAAM;AACX,QAAA;AAAA,IAAED;AAAAA,IAASE;AAAAA,EAAAA,IAAOC,YAAAA,WAAWF,WAAW;AACxC,QAAA;AAAA,IAAEG;AAAAA,IAAOC;AAAAA,IAAM,GAAGC;AAAAA,EAAWP,IAAAA;AAC7BQ,QAAAA,cAAcA,CAACC,UAAmC;AACtDA,UAAMC,eAAe;AACrBX,uCAAUU,OAAOT;AAAAA,EAAI;AAGvB,wCACGW,WAAAA,cAAY;AAAA,IACXC,QAAM;AAAA,IACNC,SAAQ;AAAA,IACRf,WAAWA,aAAa;AAAA,IACxBgB,MAAMd,KAAKM;AAAAA,IACXP,SAASA,WAAWS;AAAAA,IACpBO,WAAWZ,GAAGF,QAAQe,MAAMf,QAAQI,OAAOJ,QAAQgB,CAAC;AAAA,IAAE,GAClDV;AAAAA,IAAMW,yCAETC,mCAAiB;AAAA,MAACC,MAAMC,mBAAAA,QAAUrB,KAAKK,KAAK;AAAA,IAAA,CAAI;AAAA,EAAA,CACrC;AAElB;;;"}

package/dist/cjs/components/BreadCrumb/Page/Page.styles.cjs

@@ -2,7 +2,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactCore = require("@hitachivantara/uikit-react-core");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const styles = {
+const classes = require("../../../utils/classes.cjs");
+const {
+  staticClasses,
+  useClasses
+} = classes.createClasses("HvPage", {
   link: {
     padding: `8px ${uikitStyles.theme.space.xs}`,
     borderRadius: uikitStyles.theme.radii.base,
@@ -18,7 +22,10 @@ const styles = {
     "&:focus-visible": {
       ...uikitReactCore.outlineStyles
     }
-  }
-};
-exports.styles = styles;
+  },
+  label: {},
+  a: {}
+});
+exports.staticClasses = staticClasses;
+exports.useClasses = useClasses;
 //# sourceMappingURL=Page.styles.cjs.map