@hitachivantara/uikit-react-lab 4.0.3 → 4.0.4

package/dist/modern/InlineEditor/InlineEditor.js

@@ -1,12 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["className", "classes", "value", "defaultValue", "showIcon", "component", "variant", "placeholder", "onBlur", "onChange", "onKeyDown", "buttonProps", "typographyProps"];
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-import "core-js/modules/web.dom-collections.iterator.js";
 import React, { useLayoutEffect, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import clsx from "clsx";
@@ -14,32 +10,30 @@ import { withStyles, useTheme } from "@mui/styles";
 import { HvButton, HvInput, HvTypography, isKeypress, KeyboardCodes, useControlled } from "@hitachivantara/uikit-react-core";
 import { Edit } from "@hitachivantara/uikit-react-icons";
 import styles from "./styles";
+
 /**
  * An Inline Editor allows the user to edit a record without making a major switch
  * between viewing and editing, making it an efficient method of updating a record.
  */
-
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-
 const HvInlineEditor = props => {
   const {
-    className,
-    classes,
-    value: valueProp,
-    defaultValue,
-    showIcon,
-    component: InputComponent = HvInput,
-    variant = "normalText",
-    placeholder = "Enter text",
-    onBlur,
-    onChange,
-    onKeyDown,
-    buttonProps,
-    typographyProps
-  } = props,
-        others = _objectWithoutProperties(props, _excluded);
-
+      className,
+      classes,
+      value: valueProp,
+      defaultValue,
+      showIcon,
+      component: InputComponent = HvInput,
+      variant = "normalText",
+      placeholder = "Enter text",
+      onBlur,
+      onChange,
+      onKeyDown,
+      buttonProps,
+      typographyProps
+    } = props,
+    others = _objectWithoutProperties(props, _excluded);
   const [value, setValue] = useControlled(valueProp, defaultValue);
   const [editMode, setEditMode] = useState(false);
   const [cachedValue, setCachedValue] = useState(value);
@@ -51,40 +45,32 @@ const HvInlineEditor = props => {
   } = typographyStyles;
   useLayoutEffect(() => {
     const input = inputRef.current;
-
     if (editMode && input) {
       input.focus();
       input.select();
     }
   }, [editMode]);
-
   const handleClick = () => {
     setEditMode(true);
     setCachedValue(value);
   };
-
   const handleBlur = event => {
     setEditMode(false);
     const newValue = value || cachedValue; // empty values should be ignored
-
     setValue(newValue);
     onBlur === null || onBlur === void 0 ? void 0 : onBlur(event, newValue);
   };
-
   const handleKeyDown = event => {
     if (isKeypress(event, KeyboardCodes.Esc)) {
       setEditMode(false);
       setValue(cachedValue);
     }
-
     onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
   };
-
   const handleChange = (event, val) => {
     setValue(val);
     onChange === null || onChange === void 0 ? void 0 : onChange(event, val);
   };
-
   return /*#__PURE__*/_jsx("div", {
     className: clsx(className, classes.root),
     children: editMode ? /*#__PURE__*/_jsx(InputComponent, _objectSpread({
@@ -122,13 +108,11 @@ const HvInlineEditor = props => {
     }))
   });
 };
-
 process.env.NODE_ENV !== "production" ? HvInlineEditor.propTypes = {
   /**
    * Class names to be applied.
    */
   className: PropTypes.string,
-
   /**
    * A Jss Object used to override or extend the component styles applied.
    */
@@ -144,57 +128,46 @@ process.env.NODE_ENV !== "production" ? HvInlineEditor.propTypes = {
     iconVisible: PropTypes.string,
     largeText: PropTypes.string
   }).isRequired,
-
   /**
    * The value of the input element, for controlled usage.
    */
   value: PropTypes.string,
-
   /**
    * The default value of the input element, for uncontrolled usage.
    */
   defaultValue: PropTypes.string,
-
   /**
    * Whether the Edit icon should always be visible
    */
   showIcon: PropTypes.bool,
-
   /**
    * Component to use as the input. The component "inherit" from `HvBaseInput` (such as `HvInput` or `HvTextArea`)
    */
   component: PropTypes.elementType,
-
   /**
    * Variant of the HvTypography to display
    */
   variant: PropTypes.string,
-
   /**
    * The placeholder value of the HvTypography.
    */
   placeholder: PropTypes.string,
-
   /**
    * Called when the input is blurred.
    */
   onBlur: PropTypes.func,
-
   /**
    * Called when the input value is changed.
    */
   onChange: PropTypes.func,
-
   /**
    * Called when a key is pressed on the input.
    */
   onKeyDown: PropTypes.func,
-
   /**
    * Props passed to the HvButton component
    */
   buttonProps: PropTypes.instanceOf(Object),
-
   /**
    * Props passed to the HvTypography text component
    */

package/dist/modern/InlineEditor/InlineEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineEditor.js","names":["React","useLayoutEffect","useRef","useState","PropTypes","clsx","withStyles","useTheme","HvButton","HvInput","HvTypography","isKeypress","KeyboardCodes","useControlled","Edit","styles","HvInlineEditor","props","className","classes","value","valueProp","defaultValue","showIcon","component","InputComponent","variant","placeholder","onBlur","onChange","onKeyDown","buttonProps","typographyProps","others","setValue","editMode","setEditMode","cachedValue","setCachedValue","inputRef","theme","typographyStyles","hv","typography","lineHeight","input","current","focus","select","handleClick","handleBlur","event","newValue","handleKeyDown","Esc","handleChange","val","root","inputRoot","inputBorderContainer","style","height","undefined","button","parseInt","largeText","text","textEmpty","icon","iconVisible","propTypes","string","shape","isRequired","bool","elementType","func","instanceOf","Object","name"],"sources":["../../../src/InlineEditor/InlineEditor.js"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles, useTheme } from \"@mui/styles\";\n\nimport {\n  HvButton,\n  HvInput,\n  HvTypography,\n  isKeypress,\n  KeyboardCodes,\n  useControlled,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nconst HvInlineEditor = (props) => {\n  const {\n    className,\n    classes,\n    value: valueProp,\n    defaultValue,\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"normalText\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    ...others\n  } = props;\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef();\n  const theme = useTheme();\n\n  const typographyStyles = theme.hv.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown = (event) => {\n    if (isKeypress(event, KeyboardCodes.Esc)) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event);\n  };\n\n  const handleChange = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={clsx(className, classes.root)}>\n      {editMode ? (\n        <InputComponent\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          category=\"ghost\"\n          overrideIconColors={false}\n          className={clsx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight, 10) >= 28,\n          })}\n          onClick={handleClick}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            className={clsx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n          <Edit\n            color=\"atmo5\"\n            role=\"presentation\"\n            className={clsx(classes.icon, {\n              [classes.iconVisible]: showIcon,\n            })}\n          />\n        </HvButton>\n      )}\n    </div>\n  );\n};\n\nHvInlineEditor.propTypes = {\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    root: PropTypes.string,\n    input: PropTypes.string,\n    inputRoot: PropTypes.string,\n    inputBorderContainer: PropTypes.string,\n    text: PropTypes.string,\n    textEmpty: PropTypes.string,\n    button: PropTypes.string,\n    icon: PropTypes.string,\n    iconVisible: PropTypes.string,\n    largeText: PropTypes.string,\n  }).isRequired,\n  /**\n   * The value of the input element, for controlled usage.\n   */\n  value: PropTypes.string,\n  /**\n   * The default value of the input element, for uncontrolled usage.\n   */\n  defaultValue: PropTypes.string,\n  /**\n   * Whether the Edit icon should always be visible\n   */\n  showIcon: PropTypes.bool,\n  /**\n   * Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`)\n   */\n  component: PropTypes.elementType,\n  /**\n   * Variant of the HvTypography to display\n   */\n  variant: PropTypes.string,\n  /**\n   * The placeholder value of the HvTypography.\n   */\n  placeholder: PropTypes.string,\n  /**\n   * Called when the input is blurred.\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Called when the input value is changed.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Called when a key is pressed on the input.\n   */\n  onKeyDown: PropTypes.func,\n  /**\n   * Props passed to the HvButton component\n   */\n  buttonProps: PropTypes.instanceOf(Object),\n  /**\n   * Props passed to the HvTypography text component\n   */\n  typographyProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvInlineEditor\" })(HvInlineEditor);\n"],"mappings":"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"}
+{"version":3,"file":"InlineEditor.js","names":["React","useLayoutEffect","useRef","useState","PropTypes","clsx","withStyles","useTheme","HvButton","HvInput","HvTypography","isKeypress","KeyboardCodes","useControlled","Edit","styles","HvInlineEditor","props","className","classes","value","valueProp","defaultValue","showIcon","component","InputComponent","variant","placeholder","onBlur","onChange","onKeyDown","buttonProps","typographyProps","others","setValue","editMode","setEditMode","cachedValue","setCachedValue","inputRef","theme","typographyStyles","hv","typography","lineHeight","input","current","focus","select","handleClick","handleBlur","event","newValue","handleKeyDown","Esc","handleChange","val","root","inputRoot","inputBorderContainer","style","height","undefined","button","parseInt","largeText","text","textEmpty","icon","iconVisible","propTypes","string","shape","isRequired","bool","elementType","func","instanceOf","Object","name"],"sources":["../../../src/InlineEditor/InlineEditor.js"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { withStyles, useTheme } from \"@mui/styles\";\n\nimport {\n  HvButton,\n  HvInput,\n  HvTypography,\n  isKeypress,\n  KeyboardCodes,\n  useControlled,\n} from \"@hitachivantara/uikit-react-core\";\nimport { Edit } from \"@hitachivantara/uikit-react-icons\";\n\nimport styles from \"./styles\";\n\n/**\n * An Inline Editor allows the user to edit a record without making a major switch\n * between viewing and editing, making it an efficient method of updating a record.\n */\nconst HvInlineEditor = (props) => {\n  const {\n    className,\n    classes,\n    value: valueProp,\n    defaultValue,\n    showIcon,\n    component: InputComponent = HvInput,\n    variant = \"normalText\",\n    placeholder = \"Enter text\",\n    onBlur,\n    onChange,\n    onKeyDown,\n    buttonProps,\n    typographyProps,\n    ...others\n  } = props;\n  const [value, setValue] = useControlled(valueProp, defaultValue);\n  const [editMode, setEditMode] = useState(false);\n  const [cachedValue, setCachedValue] = useState(value);\n  const inputRef = useRef();\n  const theme = useTheme();\n\n  const typographyStyles = theme.hv.typography[variant] || {};\n  const { lineHeight } = typographyStyles;\n\n  useLayoutEffect(() => {\n    const input = inputRef.current;\n    if (editMode && input) {\n      input.focus();\n      input.select();\n    }\n  }, [editMode]);\n\n  const handleClick = () => {\n    setEditMode(true);\n    setCachedValue(value);\n  };\n\n  const handleBlur = (event) => {\n    setEditMode(false);\n\n    const newValue = value || cachedValue; // empty values should be ignored\n    setValue(newValue);\n    onBlur?.(event, newValue);\n  };\n\n  const handleKeyDown = (event) => {\n    if (isKeypress(event, KeyboardCodes.Esc)) {\n      setEditMode(false);\n      setValue(cachedValue);\n    }\n    onKeyDown?.(event);\n  };\n\n  const handleChange = (event, val) => {\n    setValue(val);\n    onChange?.(event, val);\n  };\n\n  return (\n    <div className={clsx(className, classes.root)}>\n      {editMode ? (\n        <InputComponent\n          inputRef={inputRef}\n          classes={{\n            root: classes.inputRoot,\n            input: classes.input,\n            inputBorderContainer: classes.inputBorderContainer,\n          }}\n          inputProps={{\n            style: {\n              ...typographyStyles,\n              height: InputComponent === HvInput ? lineHeight : undefined,\n            },\n          }}\n          value={value}\n          onBlur={handleBlur}\n          onChange={handleChange}\n          onKeyDown={handleKeyDown}\n          {...others}\n        />\n      ) : (\n        <HvButton\n          category=\"ghost\"\n          overrideIconColors={false}\n          className={clsx(classes.button, {\n            [classes.largeText]: parseInt(lineHeight, 10) >= 28,\n          })}\n          onClick={handleClick}\n          {...buttonProps}\n        >\n          <HvTypography\n            variant={variant}\n            className={clsx(classes.text, { [classes.textEmpty]: !value })}\n            {...typographyProps}\n          >\n            {value || placeholder}\n          </HvTypography>\n          <Edit\n            color=\"atmo5\"\n            role=\"presentation\"\n            className={clsx(classes.icon, {\n              [classes.iconVisible]: showIcon,\n            })}\n          />\n        </HvButton>\n      )}\n    </div>\n  );\n};\n\nHvInlineEditor.propTypes = {\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    root: PropTypes.string,\n    input: PropTypes.string,\n    inputRoot: PropTypes.string,\n    inputBorderContainer: PropTypes.string,\n    text: PropTypes.string,\n    textEmpty: PropTypes.string,\n    button: PropTypes.string,\n    icon: PropTypes.string,\n    iconVisible: PropTypes.string,\n    largeText: PropTypes.string,\n  }).isRequired,\n  /**\n   * The value of the input element, for controlled usage.\n   */\n  value: PropTypes.string,\n  /**\n   * The default value of the input element, for uncontrolled usage.\n   */\n  defaultValue: PropTypes.string,\n  /**\n   * Whether the Edit icon should always be visible\n   */\n  showIcon: PropTypes.bool,\n  /**\n   * Component to use as the input. The component \"inherit\" from `HvBaseInput` (such as `HvInput` or `HvTextArea`)\n   */\n  component: PropTypes.elementType,\n  /**\n   * Variant of the HvTypography to display\n   */\n  variant: PropTypes.string,\n  /**\n   * The placeholder value of the HvTypography.\n   */\n  placeholder: PropTypes.string,\n  /**\n   * Called when the input is blurred.\n   */\n  onBlur: PropTypes.func,\n  /**\n   * Called when the input value is changed.\n   */\n  onChange: PropTypes.func,\n  /**\n   * Called when a key is pressed on the input.\n   */\n  onKeyDown: PropTypes.func,\n  /**\n   * Props passed to the HvButton component\n   */\n  buttonProps: PropTypes.instanceOf(Object),\n  /**\n   * Props passed to the HvTypography text component\n   */\n  typographyProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvInlineEditor\" })(HvInlineEditor);\n"],"mappings":"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"}

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

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

package/dist/modern/InlineEditor/styles.js

@@ -1,15 +1,11 @@
 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); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 const truncateStyles = {
   overflow: "hidden",
   textOverflow: "ellipsis",
   whiteSpace: "nowrap"
 };
-
 const styles = theme => ({
   root: {},
   inputRoot: {},
@@ -49,6 +45,5 @@ const styles = theme => ({
     margin: theme.hvSpacing("8px", 0)
   }
 });
-
 export default styles;
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","names":["truncateStyles","overflow","textOverflow","whiteSpace","styles","theme","root","inputRoot","inputBorderContainer","top","bottom","input","padding","hvSpacing","text","textEmpty","color","hv","typography","placeholderText","button","cursor","height","width","maxWidth","justifyContent","backgroundColor","visibility","icon","iconVisible","largeText","margin"],"sources":["../../../src/InlineEditor/styles.js"],"sourcesContent":["const truncateStyles = {\n  overflow: \"hidden\",\n  textOverflow: \"ellipsis\",\n  whiteSpace: \"nowrap\",\n};\n\nconst styles = (theme) => ({\n  root: {},\n  inputRoot: {},\n  inputBorderContainer: {\n    top: \"unset\",\n    bottom: 0,\n  },\n  input: {\n    padding: theme.hvSpacing(\"8px\", 0),\n  },\n  text: {\n    ...truncateStyles,\n  },\n  textEmpty: {\n    color: theme.hv.typography.placeholderText.color,\n  },\n  button: {\n    cursor: \"text\",\n    height: \"100%\",\n    width: \"100%\",\n    maxWidth: \"100%\",\n    justifyContent: \"flex-start\",\n\n    backgroundColor: \"transparent\",\n    \"&:hover, &:active, &:focus\": {\n      backgroundColor: \"transparent\",\n      \"& $icon\": {\n        visibility: \"visible\",\n      },\n    },\n  },\n  icon: {\n    cursor: \"pointer\",\n    visibility: \"hidden\",\n  },\n  iconVisible: {\n    visibility: \"visible\",\n  },\n  largeText: {\n    margin: theme.hvSpacing(\"8px\", 0),\n  },\n});\n\nexport default styles;\n"],"mappings":";;;;;;AAAA,MAAMA,cAAc,GAAG;EACrBC,QAAQ,EAAE,QADW;EAErBC,YAAY,EAAE,UAFO;EAGrBC,UAAU,EAAE;AAHS,CAAvB;;AAMA,MAAMC,MAAM,GAAIC,KAAD,KAAY;EACzBC,IAAI,EAAE,EADmB;EAEzBC,SAAS,EAAE,EAFc;EAGzBC,oBAAoB,EAAE;IACpBC,GAAG,EAAE,OADe;IAEpBC,MAAM,EAAE;EAFY,CAHG;EAOzBC,KAAK,EAAE;IACLC,OAAO,EAAEP,KAAK,CAACQ,SAAN,CAAgB,KAAhB,EAAuB,CAAvB;EADJ,CAPkB;EAUzBC,IAAI,oBACCd,cADD,CAVqB;EAazBe,SAAS,EAAE;IACTC,KAAK,EAAEX,KAAK,CAACY,EAAN,CAASC,UAAT,CAAoBC,eAApB,CAAoCH;EADlC,CAbc;EAgBzBI,MAAM,EAAE;IACNC,MAAM,EAAE,MADF;IAENC,MAAM,EAAE,MAFF;IAGNC,KAAK,EAAE,MAHD;IAINC,QAAQ,EAAE,MAJJ;IAKNC,cAAc,EAAE,YALV;IAONC,eAAe,EAAE,aAPX;IAQN,8BAA8B;MAC5BA,eAAe,EAAE,aADW;MAE5B,WAAW;QACTC,UAAU,EAAE;MADH;IAFiB;EARxB,CAhBiB;EA+BzBC,IAAI,EAAE;IACJP,MAAM,EAAE,SADJ;IAEJM,UAAU,EAAE;EAFR,CA/BmB;EAmCzBE,WAAW,EAAE;IACXF,UAAU,EAAE;EADD,CAnCY;EAsCzBG,SAAS,EAAE;IACTC,MAAM,EAAE1B,KAAK,CAACQ,SAAN,CAAgB,KAAhB,EAAuB,CAAvB;EADC;AAtCc,CAAZ,CAAf;;AA2CA,eAAeT,MAAf"}
+{"version":3,"file":"styles.js","names":["truncateStyles","overflow","textOverflow","whiteSpace","styles","theme","root","inputRoot","inputBorderContainer","top","bottom","input","padding","hvSpacing","text","textEmpty","color","hv","typography","placeholderText","button","cursor","height","width","maxWidth","justifyContent","backgroundColor","visibility","icon","iconVisible","largeText","margin"],"sources":["../../../src/InlineEditor/styles.js"],"sourcesContent":["const truncateStyles = {\n  overflow: \"hidden\",\n  textOverflow: \"ellipsis\",\n  whiteSpace: \"nowrap\",\n};\n\nconst styles = (theme) => ({\n  root: {},\n  inputRoot: {},\n  inputBorderContainer: {\n    top: \"unset\",\n    bottom: 0,\n  },\n  input: {\n    padding: theme.hvSpacing(\"8px\", 0),\n  },\n  text: {\n    ...truncateStyles,\n  },\n  textEmpty: {\n    color: theme.hv.typography.placeholderText.color,\n  },\n  button: {\n    cursor: \"text\",\n    height: \"100%\",\n    width: \"100%\",\n    maxWidth: \"100%\",\n    justifyContent: \"flex-start\",\n\n    backgroundColor: \"transparent\",\n    \"&:hover, &:active, &:focus\": {\n      backgroundColor: \"transparent\",\n      \"& $icon\": {\n        visibility: \"visible\",\n      },\n    },\n  },\n  icon: {\n    cursor: \"pointer\",\n    visibility: \"hidden\",\n  },\n  iconVisible: {\n    visibility: \"visible\",\n  },\n  largeText: {\n    margin: theme.hvSpacing(\"8px\", 0),\n  },\n});\n\nexport default styles;\n"],"mappings":";;;AAAA,MAAMA,cAAc,GAAG;EACrBC,QAAQ,EAAE,QAAQ;EAClBC,YAAY,EAAE,UAAU;EACxBC,UAAU,EAAE;AACd,CAAC;AAED,MAAMC,MAAM,GAAIC,KAAK,KAAM;EACzBC,IAAI,EAAE,CAAC,CAAC;EACRC,SAAS,EAAE,CAAC,CAAC;EACbC,oBAAoB,EAAE;IACpBC,GAAG,EAAE,OAAO;IACZC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLC,OAAO,EAAEP,KAAK,CAACQ,SAAS,CAAC,KAAK,EAAE,CAAC;EACnC,CAAC;EACDC,IAAI,oBACCd,cAAc,CAClB;EACDe,SAAS,EAAE;IACTC,KAAK,EAAEX,KAAK,CAACY,EAAE,CAACC,UAAU,CAACC,eAAe,CAACH;EAC7C,CAAC;EACDI,MAAM,EAAE;IACNC,MAAM,EAAE,MAAM;IACdC,MAAM,EAAE,MAAM;IACdC,KAAK,EAAE,MAAM;IACbC,QAAQ,EAAE,MAAM;IAChBC,cAAc,EAAE,YAAY;IAE5BC,eAAe,EAAE,aAAa;IAC9B,4BAA4B,EAAE;MAC5BA,eAAe,EAAE,aAAa;MAC9B,SAAS,EAAE;QACTC,UAAU,EAAE;MACd;IACF;EACF,CAAC;EACDC,IAAI,EAAE;IACJP,MAAM,EAAE,SAAS;IACjBM,UAAU,EAAE;EACd,CAAC;EACDE,WAAW,EAAE;IACXF,UAAU,EAAE;EACd,CAAC;EACDG,SAAS,EAAE;IACTC,MAAM,EAAE1B,KAAK,CAACQ,SAAS,CAAC,KAAK,EAAE,CAAC;EAClC;AACF,CAAC,CAAC;AAEF,eAAeT,MAAM"}

package/dist/modern/NavigationAnchors/NavigationAnchors.js

@@ -1,12 +1,8 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["selectedIndex", "scrollElementId", "href", "onClick", "className", "classes", "options", "floating", "offset"];
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); 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 = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-import "core-js/modules/web.dom-collections.iterator.js";
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import PropTypes from "prop-types";
 import clsx from "clsx";
@@ -17,29 +13,22 @@ import styles from "./styles";
 import navigationOption from "./NavigationOption";
 import { jsx as _jsx } from "react/jsx-runtime";
 const RETRY_MAX = 5;
-
 const getScrollTop = (c = window) => {
   if (c === window) {
     return window.scrollY || window.pageYOffset || document.documentElement && document.documentElement.scrollTop || document.body.scrollTop;
   }
-
   return c.scrollTop;
 };
-
 const verticalScrollOffset = (t, c = window) => {
   if (c === window) {
     var _t$getBoundingClientR;
-
     return ((t === null || t === void 0 ? void 0 : (_t$getBoundingClientR = t.getBoundingClientRect) === null || _t$getBoundingClientR === void 0 ? void 0 : _t$getBoundingClientR.call(t).top) || 0) + (window.scrollY || window.pageYOffset);
   }
-
   if (getComputedStyle(c).position !== "static") {
     return t.offsetTop;
   }
-
   return t.offsetTop - c.offsetTop;
 };
-
 const scrollElement = (element, container, offset = 0) => {
   const elemTop = verticalScrollOffset(element, container);
   container.scrollTo({
@@ -47,97 +36,92 @@ const scrollElement = (element, container, offset = 0) => {
     behavior: "smooth"
   });
 };
-
 const isScrolledToTheBottom = container => {
   const containerScrollTop = getScrollTop(container);
-
   if (container === window) {
     // accounting for cases where html/body are set to height:100%
     const scrollHeight = document.documentElement && document.documentElement.scrollHeight || document.body.scrollHeight;
     return containerScrollTop + window.innerHeight >= scrollHeight;
   }
-
   return containerScrollTop + container.offsetHeight >= container.scrollHeight;
-}; // find the last nav item that whose top scrolled out of the container's visible area
-
+};
 
+// find the last nav item that whose top scrolled out of the container's visible area
 const findFirstVisibleElement = (container, options, offset) => {
   const boundsTop = verticalScrollOffset(container);
-  let i = 0; // find index of first element whose top is still visible inside the container
-
+  let i = 0;
+  // find index of first element whose top is still visible inside the container
   for (; i < options.length; i += 1) {
     const ele = document.getElementById(options[i].value);
-
     if (ele) {
       const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);
-
       if (elemTop > boundsTop) {
         break;
       }
     }
-  } // return the previous index, the element that last scrolled past the top
-
+  }
 
+  // return the previous index, the element that last scrolled past the top
   return i - 1;
 };
+
 /**
  * A navigation component to help in changing views, still in development
  */
-
-
 const NavigationAnchors = _ref => {
   let {
-    selectedIndex: selectedIndexProp = 0,
-    scrollElementId,
-    href = true,
-    onClick,
-    className,
-    classes,
-    options,
-    floating,
-    offset = 0
-  } = _ref,
-      other = _objectWithoutProperties(_ref, _excluded);
-
+      selectedIndex: selectedIndexProp = 0,
+      scrollElementId,
+      href = true,
+      onClick,
+      className,
+      classes,
+      options,
+      floating,
+      offset = 0
+    } = _ref,
+    other = _objectWithoutProperties(_ref, _excluded);
   const [selectedIndex, setSelectedIndex] = useState(selectedIndexProp);
   const scrollEle = useRef();
   const requestedAnimationFrame = useRef(0);
-  const lastContainerScrollTop = useRef(); // ref to use a often-changing value in useCallback, has recommended in
-  // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
+  const lastContainerScrollTop = useRef();
 
+  // ref to use a often-changing value in useCallback, has recommended in
+  // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
   const selectedIndexRef = useRef(selectedIndex);
   useEffect(() => {
     selectedIndexRef.current = selectedIndex;
-  }, [selectedIndex]); // get and store the container's dom element
+  }, [selectedIndex]);
 
+  // get and store the container's dom element
   useEffect(() => {
     scrollEle.current = scrollElementId && document.getElementById(scrollElementId) || window;
     lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);
   }, [scrollElementId]);
   const checkScroll = useCallback(() => {
     var _window;
-
     if (requestedAnimationFrame.current === 0 && (_window = window) !== null && _window !== void 0 && _window.requestAnimationFrame) {
       requestedAnimationFrame.current = window.requestAnimationFrame(() => {
         requestedAnimationFrame.current = 0;
         const firstVisibleElementIndex = findFirstVisibleElement(scrollEle.current, options, offset);
-        let newSelectedIndex = firstVisibleElementIndex; // select the first element when all elements are bellow the container's top
+        let newSelectedIndex = firstVisibleElementIndex;
 
+        // select the first element when all elements are bellow the container's top
         if (firstVisibleElementIndex < 0) {
           newSelectedIndex = 0;
-        } // if the user has reached the bottom of the container, select the first nav item still visible
+        }
+
+        // if the user has reached the bottom of the container, select the first nav item still visible
         // (usually this selects the last nav item, when it can't reach the top the container)
         // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour
-
-
         if (newSelectedIndex < options.length - 1 && isScrolledToTheBottom(scrollEle.current)) {
           newSelectedIndex += 1;
         }
-
         const containerScrollTop = getScrollTop(scrollEle.current);
         const isScrollingDown = containerScrollTop > lastContainerScrollTop.current;
-        lastContainerScrollTop.current = containerScrollTop; // only update the selected item if the scroll direction is moving away from it
+        lastContainerScrollTop.current = containerScrollTop;
 
+        // only update the selected item if the scroll direction is moving away from it
         if (isScrollingDown) {
           if (newSelectedIndex < selectedIndexRef.current) {
             newSelectedIndex = selectedIndexRef.current;
@@ -145,48 +129,43 @@ const NavigationAnchors = _ref => {
         } else if (newSelectedIndex > selectedIndexRef.current) {
           newSelectedIndex = selectedIndexRef.current;
         }
-
         setSelectedIndex(newSelectedIndex);
       });
     }
-  }, [offset, options]); // registers and unregisters the scroll listener
+  }, [offset, options]);
 
+  // registers and unregisters the scroll listener
   useEffect(() => {
     if (scrollEle.current) {
       scrollEle.current.addEventListener("scroll", checkScroll, false);
     }
-
     return () => {
       if (scrollEle.current) {
         scrollEle.current.removeEventListener("scroll", checkScroll);
       }
-
       if (requestedAnimationFrame.current !== 0) {
         window.cancelAnimationFrame(requestedAnimationFrame.current);
         requestedAnimationFrame.current = 0;
       }
     };
-  }, [checkScroll]); // waits for the elements to be rendered and scrolls to the one referenced
-  // in the URL hash, if any
+  }, [checkScroll]);
 
+  // waits for the elements to be rendered and scrolls to the one referenced
+  // in the URL hash, if any
   useEffect(() => {
     let checkRenderedInterval;
-
     if (href) {
       const hashValue = document.location.hash.split("#")[1] || "";
       const option = options.find(o => o.value === hashValue);
-
       if (option) {
         let retry = 0;
         checkRenderedInterval = setInterval(() => {
           const ele = document.getElementById(option.value);
-
           if (ele) {
             scrollElement(ele, scrollEle.current, option.offset || offset);
             clearInterval(checkRenderedInterval);
           } else {
             retry += 1;
-
             if (retry === RETRY_MAX) {
               clearInterval(checkRenderedInterval);
             }
@@ -194,37 +173,33 @@ const NavigationAnchors = _ref => {
         }, 1000);
       }
     }
-
     return () => {
       clearInterval(checkRenderedInterval);
-    }; // we really want to run this just in the first load
+    };
+
+    // we really want to run this just in the first load
     // in fact this doesn't even belong here, the logic should be external
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-
   const handleListItemClick = (event, id, index) => {
     const option = options.find(o => o.value === id);
-
     if (option) {
       const ele = document.getElementById(id);
-
       if (ele) {
         scrollElement(ele, scrollEle.current, option.offset || offset);
       }
-
       if (!href && onClick) {
         onClick(event, index, option);
       } else if (href) {
         window.history.pushState({}, "", `#${options[index].value}`);
       }
+      setSelectedIndex(index);
 
-      setSelectedIndex(index); // Safari scrolls immediately (no smooth scroll support),
+      // Safari scrolls immediately (no smooth scroll support),
       // so this ref value must be updated asap
-
       selectedIndexRef.current = index;
     }
   };
-
   const navOptions = useMemo(() => {
     return options.map(option => {
       return navigationOption(option.label);
@@ -248,13 +223,11 @@ const NavigationAnchors = _ref => {
     })
   }));
 };
-
 process.env.NODE_ENV !== "production" ? NavigationAnchors.propTypes = {
   /**
    * Class names to be applied.
    */
   className: PropTypes.string,
-
   /**
    * A Jss Object used to override or extend the styles applied.
    */
@@ -263,7 +236,6 @@ process.env.NODE_ENV !== "production" ? NavigationAnchors.propTypes = {
     listItemGutters: PropTypes.string,
     listItemSelected: PropTypes.string
   }).isRequired,
-
   /**
    * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied
    */
@@ -273,36 +245,30 @@ process.env.NODE_ENV !== "production" ? NavigationAnchors.propTypes = {
     label: PropTypes.string.isRequired,
     offset: PropTypes.number
   })).isRequired,
-
   /**
    * True if the href location link should be applied. It will create an a element around every list item
    */
   href: PropTypes.bool,
-
   /**
    * A callback called on click of every list item, if the href is false
    */
   onClick: PropTypes.func,
-
   /**
    * Whether the anchors are always in a fixed position
    *
    * @deprecated Currently does nothing. Style the component instead.
    */
   floating: deprecatedPropType(PropTypes.bool),
-
   /**
    * Currently selected index passed from the parent.
    */
   selectedIndex: PropTypes.number,
-
   /**
    * The Id of the scrollable container containing displayed elements.
    *
    * Defaults to `window` if unspecified.
    */
   scrollElementId: PropTypes.string,
-
   /**
    * Defines the offset from the top of each element for getting an optimal viewing region in the container.
    * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)