@hitachivantara/uikit-react-core 3.52.5

package/dist/modern/Footer/Footer.js

@@ -0,0 +1,85 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["className", "classes", "name", "copyright", "links"];
+import React from "react";
+import clsx from "clsx";
+import PropTypes from "prop-types";
+import { withStyles } from "@material-ui/core";
+import { HvTypography } from "..";
+import styles from "./styles";
+/**
+ * A Footer is a way of providing extra information at the end of a page.
+ */
+
+const HvFooter = props => {
+  const {
+    className,
+    classes,
+    name = "Hitachi Vantara",
+    copyright = `© Hitachi Vantara Corporation ${new Date().getFullYear()}. All Rights Reserved.`,
+    links
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/React.createElement("footer", _extends({
+    className: clsx(className, classes.root)
+  }, others), /*#__PURE__*/React.createElement(HvTypography, {
+    variant: "highlightText",
+    className: classes.name
+  }, name), /*#__PURE__*/React.createElement("div", {
+    className: classes.rightContainer
+  }, /*#__PURE__*/React.createElement(HvTypography, {
+    className: classes.copyright
+  }, copyright), links && /*#__PURE__*/React.createElement("div", {
+    className: classes.separator
+  }), links));
+};
+
+HvFooter.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the component root class.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to name label on the left.
+     */
+    name: PropTypes.string,
+
+    /**
+     * Styles applied to right container, with copyright and links.
+     */
+    rightContainer: PropTypes.string,
+
+    /**
+     *  Styles applied to copyright label on the right.
+     */
+    copyright: PropTypes.string,
+
+    /**
+     * Styles applied to the links node on the right
+     */
+    links: PropTypes.string,
+
+    /**
+     * Styles applied to the separator between copyright and links
+     */
+    separator: PropTypes.string
+  }).isRequired,
+  name: PropTypes.node,
+  copyright: PropTypes.node,
+  links: PropTypes.node
+};
+export default withStyles(styles, {
+  name: "HvFooter"
+})(HvFooter);
+//# sourceMappingURL=Footer.js.map

package/dist/modern/Footer/Footer.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Footer/Footer.js"],"names":["React","clsx","PropTypes","withStyles","HvTypography","styles","HvFooter","props","className","classes","name","copyright","Date","getFullYear","links","others","root","rightContainer","separator","propTypes","string","shape","isRequired","node"],"mappings":";;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,IAAP,MAAiB,MAAjB;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,UAAT,QAA2B,mBAA3B;AACA,SAASC,YAAT,QAA6B,IAA7B;AACA,OAAOC,MAAP,MAAmB,UAAnB;AAEA;AACA;AACA;;AACA,MAAMC,QAAQ,GAAIC,KAAD,IAAW;AAC1B,QAAM;AACJC,IAAAA,SADI;AAEJC,IAAAA,OAFI;AAGJC,IAAAA,IAAI,GAAG,iBAHH;AAIJC,IAAAA,SAAS,GAAI,iCAAgC,IAAIC,IAAJ,GAAWC,WAAX,EAAyB,wBAJlE;AAKJC,IAAAA;AALI,MAOFP,KAPJ;AAAA,QAMKQ,MANL,4BAOIR,KAPJ;;AASA,sBACE;AAAQ,IAAA,SAAS,EAAEN,IAAI,CAACO,SAAD,EAAYC,OAAO,CAACO,IAApB;AAAvB,KAAsDD,MAAtD,gBACE,oBAAC,YAAD;AAAc,IAAA,OAAO,EAAC,eAAtB;AAAsC,IAAA,SAAS,EAAEN,OAAO,CAACC;AAAzD,KACGA,IADH,CADF,eAIE;AAAK,IAAA,SAAS,EAAED,OAAO,CAACQ;AAAxB,kBACE,oBAAC,YAAD;AAAc,IAAA,SAAS,EAAER,OAAO,CAACE;AAAjC,KAA6CA,SAA7C,CADF,EAEGG,KAAK,iBAAI;AAAK,IAAA,SAAS,EAAEL,OAAO,CAACS;AAAxB,IAFZ,EAGGJ,KAHH,CAJF,CADF;AAYD,CAtBD;;AAwBAR,QAAQ,CAACa,SAAT,GAAqB;AACnB;AACF;AACA;AACEX,EAAAA,SAAS,EAAEN,SAAS,CAACkB,MAJF;;AAKnB;AACF;AACA;AACEX,EAAAA,OAAO,EAAEP,SAAS,CAACmB,KAAV,CAAgB;AACvB;AACJ;AACA;AACIL,IAAAA,IAAI,EAAEd,SAAS,CAACkB,MAJO;;AAKvB;AACJ;AACA;AACIV,IAAAA,IAAI,EAAER,SAAS,CAACkB,MARO;;AASvB;AACJ;AACA;AACIH,IAAAA,cAAc,EAAEf,SAAS,CAACkB,MAZH;;AAavB;AACJ;AACA;AACIT,IAAAA,SAAS,EAAET,SAAS,CAACkB,MAhBE;;AAiBvB;AACJ;AACA;AACIN,IAAAA,KAAK,EAAEZ,SAAS,CAACkB,MApBM;;AAqBvB;AACJ;AACA;AACIF,IAAAA,SAAS,EAAEhB,SAAS,CAACkB;AAxBE,GAAhB,EAyBNE,UAjCgB;AAkCnBZ,EAAAA,IAAI,EAAER,SAAS,CAACqB,IAlCG;AAmCnBZ,EAAAA,SAAS,EAAET,SAAS,CAACqB,IAnCF;AAoCnBT,EAAAA,KAAK,EAAEZ,SAAS,CAACqB;AApCE,CAArB;AAuCA,eAAepB,UAAU,CAACE,MAAD,EAAS;AAAEK,EAAAA,IAAI,EAAE;AAAR,CAAT,CAAV,CAAyCJ,QAAzC,CAAf","sourcesContent":["import React from \"react\";\nimport clsx from \"clsx\";\nimport PropTypes from \"prop-types\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvTypography } from \"..\";\nimport styles from \"./styles\";\n\n/**\n * A Footer is a way of providing extra information at the end of a page.\n */\nconst HvFooter = (props) => {\n  const {\n    className,\n    classes,\n    name = \"Hitachi Vantara\",\n    copyright = `© Hitachi Vantara Corporation ${new Date().getFullYear()}. All Rights Reserved.`,\n    links,\n    ...others\n  } = props;\n\n  return (\n    <footer className={clsx(className, classes.root)} {...others}>\n      <HvTypography variant=\"highlightText\" className={classes.name}>\n        {name}\n      </HvTypography>\n      <div className={classes.rightContainer}>\n        <HvTypography className={classes.copyright}>{copyright}</HvTypography>\n        {links && <div className={classes.separator} />}\n        {links}\n      </div>\n    </footer>\n  );\n};\n\nHvFooter.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the component root class.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to name label on the left.\n     */\n    name: PropTypes.string,\n    /**\n     * Styles applied to right container, with copyright and links.\n     */\n    rightContainer: PropTypes.string,\n    /**\n     *  Styles applied to copyright label on the right.\n     */\n    copyright: PropTypes.string,\n    /**\n     * Styles applied to the links node on the right\n     */\n    links: PropTypes.string,\n    /**\n     * Styles applied to the separator between copyright and links\n     */\n    separator: PropTypes.string,\n  }).isRequired,\n  name: PropTypes.node,\n  copyright: PropTypes.node,\n  links: PropTypes.node,\n};\n\nexport default withStyles(styles, { name: \"HvFooter\" })(HvFooter);\n"],"file":"Footer.js"}

package/dist/modern/Footer/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Footer";
+export * from "./Footer";

package/dist/modern/Footer/index.js

@@ -0,0 +1,2 @@
+export { default } from "./Footer";
+//# sourceMappingURL=index.js.map

package/dist/modern/Footer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Footer/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,UAAxB","sourcesContent":["export { default } from \"./Footer\";\n"],"file":"index.js"}

package/dist/modern/Footer/styles.js

@@ -0,0 +1,53 @@
+const styles = theme => ({
+  root: {
+    display: "flex",
+    alignItems: "center",
+    flexDirection: "row",
+    padding: theme.hvSpacing(0, "sm"),
+    height: 40,
+    bottom: 0,
+    zIndex: theme.zIndex.appBar,
+    backgroundColor: theme.palette.atmo1,
+    boxShadow: `0 -1px 0 ${theme.palette.atmo4}`,
+    [theme.breakpoints.down("sm")]: {
+      height: "unset",
+      flexDirection: "column",
+      padding: theme.hvSpacing("sm")
+    }
+  },
+  name: {
+    [theme.breakpoints.down("sm")]: {
+      marginBottom: theme.hvSpacing("xs")
+    }
+  },
+  rightContainer: {
+    display: "flex",
+    alignItems: "center",
+    flexDirection: "row",
+    marginLeft: "auto",
+    [theme.breakpoints.down("sm")]: {
+      flexDirection: "column",
+      textAlign: "center",
+      marginLeft: "unset"
+    }
+  },
+  copyright: {
+    [theme.breakpoints.down("sm")]: {
+      flexDirection: "column",
+      marginBottom: theme.hvSpacing("xs")
+    }
+  },
+  separator: {
+    width: 1,
+    height: 16,
+    backgroundColor: theme.palette.acce1,
+    margin: theme.hvSpacing(0, "xs"),
+    [theme.breakpoints.down("sm")]: {
+      display: "none"
+    }
+  },
+  links: {}
+});
+
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/Footer/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Footer/styles.js"],"names":["styles","theme","root","display","alignItems","flexDirection","padding","hvSpacing","height","bottom","zIndex","appBar","backgroundColor","palette","atmo1","boxShadow","atmo4","breakpoints","down","name","marginBottom","rightContainer","marginLeft","textAlign","copyright","separator","width","acce1","margin","links"],"mappings":"AAAA,MAAMA,MAAM,GAAIC,KAAD,KAAY;AACzBC,EAAAA,IAAI,EAAE;AACJC,IAAAA,OAAO,EAAE,MADL;AAEJC,IAAAA,UAAU,EAAE,QAFR;AAGJC,IAAAA,aAAa,EAAE,KAHX;AAIJC,IAAAA,OAAO,EAAEL,KAAK,CAACM,SAAN,CAAgB,CAAhB,EAAmB,IAAnB,CAJL;AAKJC,IAAAA,MAAM,EAAE,EALJ;AAMJC,IAAAA,MAAM,EAAE,CANJ;AAOJC,IAAAA,MAAM,EAAET,KAAK,CAACS,MAAN,CAAaC,MAPjB;AAQJC,IAAAA,eAAe,EAAEX,KAAK,CAACY,OAAN,CAAcC,KAR3B;AASJC,IAAAA,SAAS,EAAG,YAAWd,KAAK,CAACY,OAAN,CAAcG,KAAM,EATvC;AAUJ,KAACf,KAAK,CAACgB,WAAN,CAAkBC,IAAlB,CAAuB,IAAvB,CAAD,GAAgC;AAC9BV,MAAAA,MAAM,EAAE,OADsB;AAE9BH,MAAAA,aAAa,EAAE,QAFe;AAG9BC,MAAAA,OAAO,EAAEL,KAAK,CAACM,SAAN,CAAgB,IAAhB;AAHqB;AAV5B,GADmB;AAiBzBY,EAAAA,IAAI,EAAE;AACJ,KAAClB,KAAK,CAACgB,WAAN,CAAkBC,IAAlB,CAAuB,IAAvB,CAAD,GAAgC;AAC9BE,MAAAA,YAAY,EAAEnB,KAAK,CAACM,SAAN,CAAgB,IAAhB;AADgB;AAD5B,GAjBmB;AAsBzBc,EAAAA,cAAc,EAAE;AACdlB,IAAAA,OAAO,EAAE,MADK;AAEdC,IAAAA,UAAU,EAAE,QAFE;AAGdC,IAAAA,aAAa,EAAE,KAHD;AAIdiB,IAAAA,UAAU,EAAE,MAJE;AAKd,KAACrB,KAAK,CAACgB,WAAN,CAAkBC,IAAlB,CAAuB,IAAvB,CAAD,GAAgC;AAC9Bb,MAAAA,aAAa,EAAE,QADe;AAE9BkB,MAAAA,SAAS,EAAE,QAFmB;AAG9BD,MAAAA,UAAU,EAAE;AAHkB;AALlB,GAtBS;AAiCzBE,EAAAA,SAAS,EAAE;AACT,KAACvB,KAAK,CAACgB,WAAN,CAAkBC,IAAlB,CAAuB,IAAvB,CAAD,GAAgC;AAC9Bb,MAAAA,aAAa,EAAE,QADe;AAE9Be,MAAAA,YAAY,EAAEnB,KAAK,CAACM,SAAN,CAAgB,IAAhB;AAFgB;AADvB,GAjCc;AAuCzBkB,EAAAA,SAAS,EAAE;AACTC,IAAAA,KAAK,EAAE,CADE;AAETlB,IAAAA,MAAM,EAAE,EAFC;AAGTI,IAAAA,eAAe,EAAEX,KAAK,CAACY,OAAN,CAAcc,KAHtB;AAITC,IAAAA,MAAM,EAAE3B,KAAK,CAACM,SAAN,CAAgB,CAAhB,EAAmB,IAAnB,CAJC;AAKT,KAACN,KAAK,CAACgB,WAAN,CAAkBC,IAAlB,CAAuB,IAAvB,CAAD,GAAgC;AAC9Bf,MAAAA,OAAO,EAAE;AADqB;AALvB,GAvCc;AAgDzB0B,EAAAA,KAAK,EAAE;AAhDkB,CAAZ,CAAf;;AAmDA,eAAe7B,MAAf","sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"flex\",\n    alignItems: \"center\",\n    flexDirection: \"row\",\n    padding: theme.hvSpacing(0, \"sm\"),\n    height: 40,\n    bottom: 0,\n    zIndex: theme.zIndex.appBar,\n    backgroundColor: theme.palette.atmo1,\n    boxShadow: `0 -1px 0 ${theme.palette.atmo4}`,\n    [theme.breakpoints.down(\"sm\")]: {\n      height: \"unset\",\n      flexDirection: \"column\",\n      padding: theme.hvSpacing(\"sm\"),\n    },\n  },\n  name: {\n    [theme.breakpoints.down(\"sm\")]: {\n      marginBottom: theme.hvSpacing(\"xs\"),\n    },\n  },\n  rightContainer: {\n    display: \"flex\",\n    alignItems: \"center\",\n    flexDirection: \"row\",\n    marginLeft: \"auto\",\n    [theme.breakpoints.down(\"sm\")]: {\n      flexDirection: \"column\",\n      textAlign: \"center\",\n      marginLeft: \"unset\",\n    },\n  },\n  copyright: {\n    [theme.breakpoints.down(\"sm\")]: {\n      flexDirection: \"column\",\n      marginBottom: theme.hvSpacing(\"xs\"),\n    },\n  },\n  separator: {\n    width: 1,\n    height: 16,\n    backgroundColor: theme.palette.acce1,\n    margin: theme.hvSpacing(0, \"xs\"),\n    [theme.breakpoints.down(\"sm\")]: {\n      display: \"none\",\n    },\n  },\n  links: {},\n});\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/modern/Forms/Adornment/Adornment.d.ts

@@ -0,0 +1,28 @@
+import { StandardProps } from "@material-ui/core";
+import { HvFormStatus } from "../FormElement";
+
+export type HvAdornmentClassKey =
+  | "root"
+  | "icon"
+  | "adornment"
+  | "adornmentIcon"
+  | "adornmentButton"
+  | "hideIcon"
+
+export interface HvAdornmentProps
+extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvAdornmentClassKey> {
+  /**
+   * The icon to be added into the input.
+   */
+  icon: React.ReactNode;
+  /**
+   * When the input aligment should be displayed
+   */
+  showWhen?: HvFormStatus;
+  /**
+   * If this property is defined the adornment visibility will be exclusively controlled by this value.
+   */
+  isVisible?: boolean;
+}
+
+export default function HvAdornment(props: HvAdornmentProps): JSX.Element | null;

package/dist/modern/Forms/Adornment/Adornment.js

@@ -0,0 +1,144 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["id", "classes", "className", "icon", "showWhen", "onClick", "isVisible"];
+import React, { useContext } from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import { withStyles } from "@material-ui/core";
+import { HvFormElementContext, HvFormElementDescriptorsContext } from "../FormElement";
+import styles from "./styles";
+
+const preventDefault = event => event.preventDefault();
+
+const noop = () => {};
+/**
+ * Allows to add a decorative icon or an action to a form element, usually on the right side of an input.
+ * E.g., the reveal password button.
+ *
+ * In addition to the showWhen feature, which uses the form element's context validation state to determine
+ * its visibility, this component also ensures that it does not steal focus from the input and that it is
+ * not accessible using the keyboard.
+ *
+ * As such, its functionality, if any, for accessibility purposes must be provided through an alternative mean,
+ * or by using a regular icon button or toggle button instead.
+ */
+
+
+const HvAdornment = /*#__PURE__*/React.forwardRef((props, ref) => {
+  var _input$;
+
+  const {
+    id,
+    classes,
+    className,
+    icon,
+    showWhen = "",
+    onClick,
+    isVisible = undefined
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  const {
+    elementStatus = ""
+  } = useContext(HvFormElementContext);
+  const {
+    input
+  } = useContext(HvFormElementDescriptorsContext);
+  const displayIcon = isVisible !== null && isVisible !== void 0 ? isVisible : showWhen === "" || elementStatus === showWhen;
+  const isClickable = !!onClick;
+  return isClickable ? /*#__PURE__*/React.createElement("button", _extends({
+    id: id,
+    ref: ref,
+    type: "button",
+    tabIndex: -1,
+    "aria-controls": input === null || input === void 0 ? void 0 : (_input$ = input[0]) === null || _input$ === void 0 ? void 0 : _input$.id,
+    className: clsx(className, classes.root, classes.adornment, classes.adornmentButton, !displayIcon && classes.hideIcon),
+    onClick: onClick,
+    onMouseDown: preventDefault,
+    onKeyDown: noop
+  }, others), /*#__PURE__*/React.createElement("div", {
+    className: classes.icon
+  }, icon)) : /*#__PURE__*/React.createElement("div", _extends({
+    id: id,
+    ref: ref,
+    className: clsx(className, classes.root, classes.adornment, classes.adornmentIcon, !displayIcon && classes.hideIcon),
+    role: "presentation"
+  }, others), /*#__PURE__*/React.createElement("div", {
+    className: classes.icon
+  }, icon));
+});
+HvAdornment.propTypes = {
+  /**
+   * Id to be applied to the root node.
+   */
+  id: PropTypes.string,
+
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the component styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the root container of the input.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to all adornments
+     */
+    adornment: PropTypes.string,
+
+    /**
+     * Styles applied to the adornment when acting as a button.
+     */
+    adornmentIcon: PropTypes.string,
+
+    /**
+     * Styles applied to the adornment when acting as a button.
+     */
+    adornmentButton: PropTypes.string,
+
+    /**
+     * Styles applied to icon on action.
+     */
+    iconAction: PropTypes.string,
+
+    /**
+     * Styles applied to the icon.
+     */
+    icon: PropTypes.string,
+
+    /**
+     * Styles applied to the icon when it's supposed to be hidden.
+     */
+    hideIcon: PropTypes.string
+  }),
+
+  /**
+   * The icon to be added into the input.
+   */
+  icon: PropTypes.node.isRequired,
+
+  /**
+   * When the adornment should be displayed.
+   */
+  showWhen: PropTypes.oneOf(["standBy", "valid", "invalid"]),
+
+  /**
+   * Function to be executed when this element is clicked.
+   */
+  onClick: PropTypes.func,
+
+  /**
+   * If this property is defined the adornment visibility will be exclusively controlled by this value.
+   */
+  isVisible: PropTypes.bool
+};
+export default withStyles(styles, {
+  name: "HvAdornment"
+})(HvAdornment);
+//# sourceMappingURL=Adornment.js.map

package/dist/modern/Forms/Adornment/Adornment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/Adornment/Adornment.js"],"names":["React","useContext","PropTypes","clsx","withStyles","HvFormElementContext","HvFormElementDescriptorsContext","styles","preventDefault","event","noop","HvAdornment","forwardRef","props","ref","id","classes","className","icon","showWhen","onClick","isVisible","undefined","others","elementStatus","input","displayIcon","isClickable","root","adornment","adornmentButton","hideIcon","adornmentIcon","propTypes","string","shape","iconAction","node","isRequired","oneOf","func","bool","name"],"mappings":"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","sourcesContent":["import React, { useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvFormElementContext, HvFormElementDescriptorsContext } from \"../FormElement\";\nimport styles from \"./styles\";\n\nconst preventDefault = (event) => event.preventDefault();\nconst noop = () => {};\n\n/**\n * Allows to add a decorative icon or an action to a form element, usually on the right side of an input.\n * E.g., the reveal password button.\n *\n * In addition to the showWhen feature, which uses the form element's context validation state to determine\n * its visibility, this component also ensures that it does not steal focus from the input and that it is\n * not accessible using the keyboard.\n *\n * As such, its functionality, if any, for accessibility purposes must be provided through an alternative mean,\n * or by using a regular icon button or toggle button instead.\n */\nconst HvAdornment = React.forwardRef((props, ref) => {\n  const {\n    id,\n    classes,\n    className,\n    icon,\n    showWhen = \"\",\n    onClick,\n    isVisible = undefined,\n    ...others\n  } = props;\n\n  const { elementStatus = \"\" } = useContext(HvFormElementContext);\n\n  const { input } = useContext(HvFormElementDescriptorsContext);\n\n  const displayIcon = isVisible ?? (showWhen === \"\" || elementStatus === showWhen);\n\n  const isClickable = !!onClick;\n\n  return isClickable ? (\n    <button\n      id={id}\n      ref={ref}\n      type=\"button\"\n      tabIndex={-1}\n      aria-controls={input?.[0]?.id}\n      className={clsx(className, classes.root, classes.adornment, classes.adornmentButton, {\n        [classes.hideIcon]: !displayIcon,\n      })}\n      onClick={onClick}\n      onMouseDown={preventDefault}\n      onKeyDown={noop}\n      {...others}\n    >\n      <div className={classes.icon}>{icon}</div>\n    </button>\n  ) : (\n    <div\n      id={id}\n      ref={ref}\n      className={clsx(className, classes.root, classes.adornment, classes.adornmentIcon, {\n        [classes.hideIcon]: !displayIcon,\n      })}\n      role=\"presentation\"\n      {...others}\n    >\n      <div className={classes.icon}>{icon}</div>\n    </div>\n  );\n});\n\nHvAdornment.propTypes = {\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root container of the input.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to all adornments\n     */\n    adornment: PropTypes.string,\n    /**\n     * Styles applied to the adornment when acting as a button.\n     */\n    adornmentIcon: PropTypes.string,\n    /**\n     * Styles applied to the adornment when acting as a button.\n     */\n    adornmentButton: PropTypes.string,\n    /**\n     * Styles applied to icon on action.\n     */\n    iconAction: PropTypes.string,\n    /**\n     * Styles applied to the icon.\n     */\n    icon: PropTypes.string,\n    /**\n     * Styles applied to the icon when it's supposed to be hidden.\n     */\n    hideIcon: PropTypes.string,\n  }),\n  /**\n   * The icon to be added into the input.\n   */\n  icon: PropTypes.node.isRequired,\n  /**\n   * When the adornment should be displayed.\n   */\n  showWhen: PropTypes.oneOf([\"standBy\", \"valid\", \"invalid\"]),\n  /**\n   * Function to be executed when this element is clicked.\n   */\n  onClick: PropTypes.func,\n  /**\n   * If this property is defined the adornment visibility will be exclusively controlled by this value.\n   */\n  isVisible: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvAdornment\" })(HvAdornment);\n"],"file":"Adornment.js"}

package/dist/modern/Forms/Adornment/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./Adornment";
+export * from "./Adornment";

package/dist/modern/Forms/Adornment/index.js

@@ -0,0 +1,2 @@
+export { default } from "./Adornment";
+//# sourceMappingURL=index.js.map

package/dist/modern/Forms/Adornment/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/Adornment/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,aAAxB","sourcesContent":["export { default } from \"./Adornment\";\n"],"file":"index.js"}

package/dist/modern/Forms/Adornment/styles.js

@@ -0,0 +1,34 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+import { outlineStyles } from "../../Focus/styles";
+const styles = {
+  root: {},
+  icon: {
+    width: 32,
+    height: 32
+  },
+  adornment: {
+    backgroundColor: "transparent",
+    border: "none",
+    padding: 0,
+    margin: 0,
+    cursor: "pointer"
+  },
+  adornmentButton: {
+    cursor: "pointer",
+    "&:focus": _objectSpread({}, outlineStyles)
+  },
+  adornmentIcon: {
+    cursor: "default",
+    pointerEvents: "none"
+  },
+  hideIcon: {
+    display: "none"
+  }
+};
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/Forms/Adornment/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/Adornment/styles.js"],"names":["outlineStyles","styles","root","icon","width","height","adornment","backgroundColor","border","padding","margin","cursor","adornmentButton","adornmentIcon","pointerEvents","hideIcon","display"],"mappings":";;;;;;AAAA,SAASA,aAAT,QAA8B,oBAA9B;AAEA,MAAMC,MAAM,GAAG;AACbC,EAAAA,IAAI,EAAE,EADO;AAEbC,EAAAA,IAAI,EAAE;AACJC,IAAAA,KAAK,EAAE,EADH;AAEJC,IAAAA,MAAM,EAAE;AAFJ,GAFO;AAMbC,EAAAA,SAAS,EAAE;AACTC,IAAAA,eAAe,EAAE,aADR;AAETC,IAAAA,MAAM,EAAE,MAFC;AAGTC,IAAAA,OAAO,EAAE,CAHA;AAITC,IAAAA,MAAM,EAAE,CAJC;AAKTC,IAAAA,MAAM,EAAE;AALC,GANE;AAabC,EAAAA,eAAe,EAAE;AACfD,IAAAA,MAAM,EAAE,SADO;AAEf,iCACKX,aADL;AAFe,GAbJ;AAmBba,EAAAA,aAAa,EAAE;AACbF,IAAAA,MAAM,EAAE,SADK;AAEbG,IAAAA,aAAa,EAAE;AAFF,GAnBF;AAuBbC,EAAAA,QAAQ,EAAE;AACRC,IAAAA,OAAO,EAAE;AADD;AAvBG,CAAf;AA4BA,eAAef,MAAf","sourcesContent":["import { outlineStyles } from \"../../Focus/styles\";\n\nconst styles = {\n  root: {},\n  icon: {\n    width: 32,\n    height: 32,\n  },\n  adornment: {\n    backgroundColor: \"transparent\",\n    border: \"none\",\n    padding: 0,\n    margin: 0,\n    cursor: \"pointer\",\n  },\n  adornmentButton: {\n    cursor: \"pointer\",\n    \"&:focus\": {\n      ...outlineStyles,\n    },\n  },\n  adornmentIcon: {\n    cursor: \"default\",\n    pointerEvents: \"none\",\n  },\n  hideIcon: {\n    display: \"none\",\n  },\n};\n\nexport default styles;\n"],"file":"styles.js"}

package/dist/modern/Forms/CharCounter/CharCounter.d.ts

@@ -0,0 +1,29 @@
+import { StandardProps } from "@material-ui/core";
+
+export type HvCharCounterClassKey = "root" | "counterDisabled" | "overloaded" | "gutter";
+
+export interface HvCharCounterProps
+  extends StandardProps<React.HTMLAttributes<HTMLDivElement>, HvCharCounterClassKey> {
+  /**
+   * The string that separtes the current char quantity from the max quantity.
+   */
+  separator: string;
+  /**
+   * The maximum allowed length of the characters.
+   */
+  maxCharQuantity: number;
+  /**
+   * The current char quantity to be rendered.
+   */
+  currentCharQuantity?: number;
+  /**
+   * If `true` the input is disabled.
+   */
+  disabled?: boolean;
+  /**
+   * If `true` the info message won't have margins.
+   */
+  disableGutter?: boolean;
+}
+
+export default function HvCharCounter(props: HvCharCounterProps): JSX.Element | null;

package/dist/modern/Forms/CharCounter/CharCounter.js

@@ -0,0 +1,124 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+const _excluded = ["separator", "maxCharQuantity", "currentCharQuantity", "classes", "className", "id", "disabled", "disableGutter"];
+import React, { useContext } from "react";
+import PropTypes from "prop-types";
+import clsx from "clsx";
+import { withStyles } from "@material-ui/core";
+import { HvFormElementContext } from "../FormElement";
+import { HvTypography } from "../..";
+import { setId } from "../../utils";
+import styles from "./styles";
+/**
+ * Displays the capacity and current usage of a text input box (character count by default).
+ *
+ * Use the character counter when there is a character or word limit.
+ * By itself it doesn't block the user from going above the limit.
+ */
+
+const HvCharCounter = props => {
+  const {
+    separator = "/",
+    maxCharQuantity,
+    currentCharQuantity = 0,
+    classes,
+    className,
+    id,
+    disabled,
+    disableGutter = false
+  } = props,
+        others = _objectWithoutProperties(props, _excluded);
+
+  const {
+    elementId,
+    elementDisabled
+  } = useContext(HvFormElementContext);
+  const localDisabled = disabled || elementDisabled;
+  const localId = id !== null && id !== void 0 ? id : setId(elementId, "counter");
+  const currentId = setId(localId, "currentQuantity");
+  const maxQuantityId = setId(localId, "maxQuantity");
+  const isOverloaded = currentCharQuantity > maxCharQuantity;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    id: localId,
+    className: clsx(className, classes.root, localDisabled && classes.counterDisabled, !disableGutter && classes.gutter),
+    "aria-live": "polite",
+    "aria-disabled": localDisabled
+  }, others), /*#__PURE__*/React.createElement(HvTypography, {
+    id: currentId,
+    className: clsx(localDisabled ? classes.counterDisabled : isOverloaded && classes.overloaded),
+    variant: "highlightText",
+    component: "label"
+  }, currentCharQuantity), /*#__PURE__*/React.createElement(HvTypography, {
+    id: maxQuantityId,
+    className: clsx(localDisabled ? classes.counterDisabled : isOverloaded && classes.overloaded),
+    variant: "normalText",
+    component: "label"
+  }, ` ${separator} ${maxCharQuantity}`));
+};
+
+HvCharCounter.formElementType = "controlled";
+HvCharCounter.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: PropTypes.string,
+
+  /**
+   * Id to be applied to the root node.
+   */
+  id: PropTypes.string,
+
+  /**
+   * A Jss Object used to override or extend the component styles applied.
+   */
+  classes: PropTypes.shape({
+    /**
+     * Styles applied to the char counter root container.
+     */
+    root: PropTypes.string,
+
+    /**
+     * Styles applied to the char counter root container when the current char counter higher than the max.
+     */
+    overloaded: PropTypes.string,
+
+    /**
+     * Styles applied when the char counter is disabled.
+     */
+    counterDisabled: PropTypes.string,
+
+    /**
+     * Separation for the counter.
+     */
+    gutter: PropTypes.string
+  }).isRequired,
+
+  /**
+   * The string that separtes the current char quantity from the max quantity.
+   */
+  separator: PropTypes.string,
+
+  /**
+   * The maximum allowed length of the characters.
+   */
+  maxCharQuantity: PropTypes.number.isRequired,
+
+  /**
+   * The current char quantity to be rendered.
+   */
+  currentCharQuantity: PropTypes.number,
+
+  /**
+   * If `true` the counter is disabled.
+   */
+  disabled: PropTypes.bool,
+
+  /**
+   * If `true` the info message won't have margins.
+   */
+  disableGutter: PropTypes.bool
+};
+export default withStyles(styles, {
+  name: "HvCharCounter"
+})(HvCharCounter);
+//# sourceMappingURL=CharCounter.js.map

package/dist/modern/Forms/CharCounter/CharCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/CharCounter/CharCounter.js"],"names":["React","useContext","PropTypes","clsx","withStyles","HvFormElementContext","HvTypography","setId","styles","HvCharCounter","props","separator","maxCharQuantity","currentCharQuantity","classes","className","id","disabled","disableGutter","others","elementId","elementDisabled","localDisabled","localId","currentId","maxQuantityId","isOverloaded","root","counterDisabled","gutter","overloaded","formElementType","propTypes","string","shape","isRequired","number","bool","name"],"mappings":"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","sourcesContent":["import React, { useContext } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles } from \"@material-ui/core\";\nimport { HvFormElementContext } from \"../FormElement\";\nimport { HvTypography } from \"../..\";\nimport { setId } from \"../../utils\";\nimport styles from \"./styles\";\n\n/**\n * Displays the capacity and current usage of a text input box (character count by default).\n *\n * Use the character counter when there is a character or word limit.\n * By itself it doesn't block the user from going above the limit.\n */\nconst HvCharCounter = (props) => {\n  const {\n    separator = \"/\",\n    maxCharQuantity,\n    currentCharQuantity = 0,\n    classes,\n    className,\n    id,\n    disabled,\n    disableGutter = false,\n    ...others\n  } = props;\n  const { elementId, elementDisabled } = useContext(HvFormElementContext);\n  const localDisabled = disabled || elementDisabled;\n  const localId = id ?? setId(elementId, \"counter\");\n  const currentId = setId(localId, \"currentQuantity\");\n  const maxQuantityId = setId(localId, \"maxQuantity\");\n  const isOverloaded = currentCharQuantity > maxCharQuantity;\n\n  return (\n    <div\n      id={localId}\n      className={clsx(className, classes.root, {\n        [classes.counterDisabled]: localDisabled,\n        [classes.gutter]: !disableGutter,\n      })}\n      aria-live=\"polite\"\n      aria-disabled={localDisabled}\n      {...others}\n    >\n      <HvTypography\n        id={currentId}\n        className={clsx({\n          [classes.overloaded]: isOverloaded && !localDisabled,\n          [classes.counterDisabled]: localDisabled,\n        })}\n        variant=\"highlightText\"\n        component=\"label\"\n      >\n        {currentCharQuantity}\n      </HvTypography>\n      <HvTypography\n        id={maxQuantityId}\n        className={clsx({\n          [classes.overloaded]: isOverloaded && !localDisabled,\n          [classes.counterDisabled]: localDisabled,\n        })}\n        variant=\"normalText\"\n        component=\"label\"\n      >\n        {` ${separator} ${maxCharQuantity}`}\n      </HvTypography>\n    </div>\n  );\n};\n\nHvCharCounter.formElementType = \"controlled\";\n\nHvCharCounter.propTypes = {\n  /**\n   * Class names to be applied.\n   */\n  className: PropTypes.string,\n  /**\n   * Id to be applied to the root node.\n   */\n  id: PropTypes.string,\n  /**\n   * A Jss Object used to override or extend the component styles applied.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the char counter root container.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the char counter root container when the current char counter higher than the max.\n     */\n    overloaded: PropTypes.string,\n    /**\n     * Styles applied when the char counter is disabled.\n     */\n    counterDisabled: PropTypes.string,\n    /**\n     * Separation for the counter.\n     */\n    gutter: PropTypes.string,\n  }).isRequired,\n  /**\n   * The string that separtes the current char quantity from the max quantity.\n   */\n  separator: PropTypes.string,\n  /**\n   * The maximum allowed length of the characters.\n   */\n  maxCharQuantity: PropTypes.number.isRequired,\n  /**\n   * The current char quantity to be rendered.\n   */\n  currentCharQuantity: PropTypes.number,\n  /**\n   * If `true` the counter is disabled.\n   */\n  disabled: PropTypes.bool,\n  /**\n   * If `true` the info message won't have margins.\n   */\n  disableGutter: PropTypes.bool,\n};\n\nexport default withStyles(styles, { name: \"HvCharCounter\" })(HvCharCounter);\n"],"file":"CharCounter.js"}

package/dist/modern/Forms/CharCounter/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./CharCounter";
+export * from "./CharCounter";

package/dist/modern/Forms/CharCounter/index.js

@@ -0,0 +1,2 @@
+export { default } from "./CharCounter";
+//# sourceMappingURL=index.js.map

package/dist/modern/Forms/CharCounter/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/CharCounter/index.js"],"names":["default"],"mappings":"AAAA,SAASA,OAAT,QAAwB,eAAxB","sourcesContent":["export { default } from \"./CharCounter\";\n"],"file":"index.js"}

package/dist/modern/Forms/CharCounter/styles.js

@@ -0,0 +1,18 @@
+const styles = theme => ({
+  root: {
+    display: "inline-block",
+    float: "right"
+  },
+  counterDisabled: {
+    color: theme.hv.palette.atmosphere.atmo5
+  },
+  overloaded: {
+    color: theme.hv.palette.semantic.sema4
+  },
+  gutter: {
+    paddingLeft: `6px`
+  }
+});
+
+export default styles;
+//# sourceMappingURL=styles.js.map

package/dist/modern/Forms/CharCounter/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/Forms/CharCounter/styles.js"],"names":["styles","theme","root","display","float","counterDisabled","color","hv","palette","atmosphere","atmo5","overloaded","semantic","sema4","gutter","paddingLeft"],"mappings":"AAAA,MAAMA,MAAM,GAAIC,KAAD,KAAY;AACzBC,EAAAA,IAAI,EAAE;AACJC,IAAAA,OAAO,EAAE,cADL;AAEJC,IAAAA,KAAK,EAAE;AAFH,GADmB;AAKzBC,EAAAA,eAAe,EAAE;AACfC,IAAAA,KAAK,EAAEL,KAAK,CAACM,EAAN,CAASC,OAAT,CAAiBC,UAAjB,CAA4BC;AADpB,GALQ;AAQzBC,EAAAA,UAAU,EAAE;AACVL,IAAAA,KAAK,EAAEL,KAAK,CAACM,EAAN,CAASC,OAAT,CAAiBI,QAAjB,CAA0BC;AADvB,GARa;AAWzBC,EAAAA,MAAM,EAAE;AACNC,IAAAA,WAAW,EAAG;AADR;AAXiB,CAAZ,CAAf;;AAgBA,eAAef,MAAf","sourcesContent":["const styles = (theme) => ({\n  root: {\n    display: \"inline-block\",\n    float: \"right\",\n  },\n  counterDisabled: {\n    color: theme.hv.palette.atmosphere.atmo5,\n  },\n  overloaded: {\n    color: theme.hv.palette.semantic.sema4,\n  },\n  gutter: {\n    paddingLeft: `6px`,\n  },\n});\n\nexport default styles;\n"],"file":"styles.js"}