@hitachivantara/uikit-react-lab 3.38.0

package/dist/InlineEditor/InlineEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/InlineEditor/InlineEditor.js"],"names":["HvInlineEditor","props","className","classes","valueProp","value","defaultValue","showIcon","component","InputComponent","HvInput","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","KeyboardCodes","Esc","handleChange","val","root","inputRoot","inputBorderContainer","style","height","undefined","button","parseInt","largeText","text","textEmpty","icon","iconVisible","propTypes","PropTypes","string","shape","isRequired","bool","elementType","func","instanceOf","Object","styles","name"],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { withStyles, useTheme } from \"@material-ui/core\";\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"],"file":"InlineEditor.js"}

package/dist/InlineEditor/index.d.ts

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

package/dist/InlineEditor/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _InlineEditor.default;
+  }
+});
+
+var _InlineEditor = _interopRequireDefault(require("./InlineEditor"));
+//# sourceMappingURL=index.js.map

package/dist/InlineEditor/index.js.map

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

package/dist/InlineEditor/styles.js

@@ -0,0 +1,80 @@
+"use strict";
+
+require("core-js/modules/es.object.keys.js");
+
+require("core-js/modules/es.symbol.js");
+
+require("core-js/modules/es.array.filter.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+require("core-js/modules/web.dom-collections.for-each.js");
+
+require("core-js/modules/es.object.get-own-property-descriptors.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/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) { (0, _defineProperty2.default)(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; }
+
+var truncateStyles = {
+  overflow: "hidden",
+  textOverflow: "ellipsis",
+  whiteSpace: "nowrap"
+};
+
+var styles = function styles(theme) {
+  return {
+    root: {},
+    inputRoot: {},
+    inputBorderContainer: {
+      top: "unset",
+      bottom: 0
+    },
+    input: {
+      padding: theme.hvSpacing("8px", 0)
+    },
+    text: _objectSpread({}, truncateStyles),
+    textEmpty: {
+      color: theme.hv.typography.placeholderText.color
+    },
+    button: {
+      cursor: "text",
+      height: "100%",
+      width: "100%",
+      maxWidth: "100%",
+      justifyContent: "flex-start",
+      backgroundColor: "transparent",
+      "&:hover, &:active, &:focus": {
+        backgroundColor: "transparent",
+        "& $icon": {
+          visibility: "visible"
+        }
+      }
+    },
+    icon: {
+      cursor: "pointer",
+      visibility: "hidden"
+    },
+    iconVisible: {
+      visibility: "visible"
+    },
+    largeText: {
+      margin: theme.hvSpacing("8px", 0)
+    }
+  };
+};
+
+var _default = styles;
+exports.default = _default;
+//# sourceMappingURL=styles.js.map

package/dist/InlineEditor/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/InlineEditor/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"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAMA,cAAc,GAAG;AACrBC,EAAAA,QAAQ,EAAE,QADW;AAErBC,EAAAA,YAAY,EAAE,UAFO;AAGrBC,EAAAA,UAAU,EAAE;AAHS,CAAvB;;AAMA,IAAMC,MAAM,GAAG,SAATA,MAAS,CAACC,KAAD;AAAA,SAAY;AACzBC,IAAAA,IAAI,EAAE,EADmB;AAEzBC,IAAAA,SAAS,EAAE,EAFc;AAGzBC,IAAAA,oBAAoB,EAAE;AACpBC,MAAAA,GAAG,EAAE,OADe;AAEpBC,MAAAA,MAAM,EAAE;AAFY,KAHG;AAOzBC,IAAAA,KAAK,EAAE;AACLC,MAAAA,OAAO,EAAEP,KAAK,CAACQ,SAAN,CAAgB,KAAhB,EAAuB,CAAvB;AADJ,KAPkB;AAUzBC,IAAAA,IAAI,oBACCd,cADD,CAVqB;AAazBe,IAAAA,SAAS,EAAE;AACTC,MAAAA,KAAK,EAAEX,KAAK,CAACY,EAAN,CAASC,UAAT,CAAoBC,eAApB,CAAoCH;AADlC,KAbc;AAgBzBI,IAAAA,MAAM,EAAE;AACNC,MAAAA,MAAM,EAAE,MADF;AAENC,MAAAA,MAAM,EAAE,MAFF;AAGNC,MAAAA,KAAK,EAAE,MAHD;AAINC,MAAAA,QAAQ,EAAE,MAJJ;AAKNC,MAAAA,cAAc,EAAE,YALV;AAONC,MAAAA,eAAe,EAAE,aAPX;AAQN,oCAA8B;AAC5BA,QAAAA,eAAe,EAAE,aADW;AAE5B,mBAAW;AACTC,UAAAA,UAAU,EAAE;AADH;AAFiB;AARxB,KAhBiB;AA+BzBC,IAAAA,IAAI,EAAE;AACJP,MAAAA,MAAM,EAAE,SADJ;AAEJM,MAAAA,UAAU,EAAE;AAFR,KA/BmB;AAmCzBE,IAAAA,WAAW,EAAE;AACXF,MAAAA,UAAU,EAAE;AADD,KAnCY;AAsCzBG,IAAAA,SAAS,EAAE;AACTC,MAAAA,MAAM,EAAE1B,KAAK,CAACQ,SAAN,CAAgB,KAAhB,EAAuB,CAAvB;AADC;AAtCc,GAAZ;AAAA,CAAf;;eA2CeT,M","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"],"file":"styles.js"}

package/dist/NavigationAnchors/NavigationAnchors.d.ts

@@ -0,0 +1,49 @@
+import { StandardProps } from "@material-ui/core";
+import { HvListContainerProps } from "@hitachivantara/uikit-react-core";
+
+interface Option {
+  key?: string;
+  label: string;
+  value: string;
+  offset?: number;
+}
+
+export type HvNavigationAnchorsClassKey = "root" | "listItemGutters" | "listItemSelected";
+
+export interface HvNavigationAnchorsProps
+  extends StandardProps<HvListContainerProps, HvNavigationAnchorsClassKey> {
+  /**
+   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied
+   */
+  options: Option[];
+  /**
+   * True if the href location link should be applied. It will create an a element around every list item
+   */
+  href?: boolean;
+  /**
+   * Whether the anchors are always in a fixed position
+   *
+   * @deprecated Currently does nothing. Style the component instead.
+   */
+  floating?: boolean;
+  /**
+   * Currently selected index passed from the parent.
+   */
+  selectedIndex?: number;
+  /**
+   * The Id of the scrollable container containing displayed elements.
+   *
+   * Defaults to `window` if unspecified.
+   */
+  scrollElementId?: 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)
+   * or to put more breathing room between the targeted element and the edges of the container.
+   *
+   * Each element can alse have a specific offset via the options property.
+   */
+  offset?: number;
+}
+
+export default function HvNavigationAnchors(props: HvNavigationAnchorsProps): JSX.Element | null;

package/dist/NavigationAnchors/NavigationAnchors.js

@@ -0,0 +1,374 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("core-js/modules/es.regexp.exec.js");
+
+require("core-js/modules/es.string.split.js");
+
+require("core-js/modules/es.array.find.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.array.map.js");
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _core = require("@material-ui/core");
+
+var _uikitReactCore = require("@hitachivantara/uikit-react-core");
+
+var _styles = _interopRequireDefault(require("./styles"));
+
+var _NavigationOption = _interopRequireDefault(require("./NavigationOption"));
+
+var _excluded = ["selectedIndex", "scrollElementId", "href", "onClick", "className", "classes", "options", "floating", "offset"];
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var RETRY_MAX = 5;
+
+var getScrollTop = function getScrollTop() {
+  var c = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
+
+  if (c === window) {
+    return window.scrollY || window.pageYOffset || document.documentElement && document.documentElement.scrollTop || document.body.scrollTop;
+  }
+
+  return c.scrollTop;
+};
+
+var verticalScrollOffset = function verticalScrollOffset(t) {
+  var c = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 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;
+};
+
+var scrollElement = function scrollElement(element, container) {
+  var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
+  var elemTop = verticalScrollOffset(element, container);
+  container.scrollTo({
+    top: elemTop - offset,
+    behavior: "smooth"
+  });
+};
+
+var isScrolledToTheBottom = function isScrolledToTheBottom(container) {
+  var containerScrollTop = getScrollTop(container);
+
+  if (container === window) {
+    // accounting for cases where html/body are set to height:100%
+    var 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
+
+
+var findFirstVisibleElement = function findFirstVisibleElement(container, options, offset) {
+  var boundsTop = verticalScrollOffset(container);
+  var i = 0; // find index of first element whose top is still visible inside the container
+
+  for (; i < options.length; i += 1) {
+    var ele = document.getElementById(options[i].value);
+
+    if (ele) {
+      var elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);
+
+      if (elemTop > boundsTop) {
+        break;
+      }
+    }
+  } // 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
+ */
+
+
+var NavigationAnchors = function NavigationAnchors(_ref) {
+  var _ref$selectedIndex = _ref.selectedIndex,
+      selectedIndexProp = _ref$selectedIndex === void 0 ? 0 : _ref$selectedIndex,
+      scrollElementId = _ref.scrollElementId,
+      _ref$href = _ref.href,
+      href = _ref$href === void 0 ? true : _ref$href,
+      onClick = _ref.onClick,
+      className = _ref.className,
+      classes = _ref.classes,
+      options = _ref.options,
+      floating = _ref.floating,
+      _ref$offset = _ref.offset,
+      offset = _ref$offset === void 0 ? 0 : _ref$offset,
+      other = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(selectedIndexProp),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      selectedIndex = _useState2[0],
+      setSelectedIndex = _useState2[1];
+
+  var scrollEle = (0, _react.useRef)();
+  var requestedAnimationFrame = (0, _react.useRef)(0);
+  var lastContainerScrollTop = (0, _react.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
+
+  var selectedIndexRef = (0, _react.useRef)(selectedIndex);
+  (0, _react.useEffect)(function () {
+    selectedIndexRef.current = selectedIndex;
+  }, [selectedIndex]); // get and store the container's dom element
+
+  (0, _react.useEffect)(function () {
+    scrollEle.current = scrollElementId && document.getElementById(scrollElementId) || window;
+    lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);
+  }, [scrollElementId]);
+  var checkScroll = (0, _react.useCallback)(function () {
+    var _window;
+
+    if (requestedAnimationFrame.current === 0 && (_window = window) !== null && _window !== void 0 && _window.requestAnimationFrame) {
+      requestedAnimationFrame.current = window.requestAnimationFrame(function () {
+        requestedAnimationFrame.current = 0;
+        var firstVisibleElementIndex = findFirstVisibleElement(scrollEle.current, options, offset);
+        var 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
+        // (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;
+        }
+
+        var containerScrollTop = getScrollTop(scrollEle.current);
+        var isScrollingDown = containerScrollTop > lastContainerScrollTop.current;
+        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;
+          }
+        } else if (newSelectedIndex > selectedIndexRef.current) {
+          newSelectedIndex = selectedIndexRef.current;
+        }
+
+        setSelectedIndex(newSelectedIndex);
+      });
+    }
+  }, [offset, options]); // registers and unregisters the scroll listener
+
+  (0, _react.useEffect)(function () {
+    if (scrollEle.current) {
+      scrollEle.current.addEventListener("scroll", checkScroll, false);
+    }
+
+    return function () {
+      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
+
+  (0, _react.useEffect)(function () {
+    var checkRenderedInterval;
+
+    if (href) {
+      var hashValue = document.location.hash.split("#")[1] || "";
+      var option = options.find(function (o) {
+        return o.value === hashValue;
+      });
+
+      if (option) {
+        var retry = 0;
+        checkRenderedInterval = setInterval(function () {
+          var 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);
+            }
+          }
+        }, 1000);
+      }
+    }
+
+    return function () {
+      clearInterval(checkRenderedInterval);
+    }; // 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
+  }, []);
+
+  var handleListItemClick = function handleListItemClick(event, id, index) {
+    var option = options.find(function (o) {
+      return o.value === id;
+    });
+
+    if (option) {
+      var 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({}, "", "#".concat(options[index].value));
+      }
+
+      setSelectedIndex(index); // Safari scrolls immediately (no smooth scroll support),
+      // so this ref value must be updated asap
+
+      selectedIndexRef.current = index;
+    }
+  };
+
+  var navOptions = (0, _react.useMemo)(function () {
+    return options.map(function (option) {
+      return (0, _NavigationOption.default)(option.label);
+    });
+  }, [options]);
+  return /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvListContainer, (0, _extends2.default)({
+    interactive: true,
+    className: (0, _clsx.default)(className, classes.root)
+  }, other), options.map(function (option, index) {
+    var NavOpt = navOptions[index];
+    return /*#__PURE__*/_react.default.createElement(_uikitReactCore.HvListItem, {
+      classes: {
+        selected: classes.listItemSelected,
+        gutters: classes.listItemGutters
+      },
+      key: option.key || option.label,
+      onClick: function onClick(event) {
+        return handleListItemClick(event, option.value, index);
+      },
+      selected: selectedIndex === index
+    }, /*#__PURE__*/_react.default.createElement(NavOpt, null));
+  }));
+};
+
+NavigationAnchors.propTypes = {
+  /**
+   * Class names to be applied.
+   */
+  className: _propTypes.default.string,
+
+  /**
+   * A Jss Object used to override or extend the styles applied.
+   */
+  classes: _propTypes.default.shape({
+    root: _propTypes.default.string,
+    listItemGutters: _propTypes.default.string,
+    listItemSelected: _propTypes.default.string
+  }).isRequired,
+
+  /**
+   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied
+   */
+  options: _propTypes.default.arrayOf(_propTypes.default.shape({
+    key: _propTypes.default.string,
+    value: _propTypes.default.string.isRequired,
+    label: _propTypes.default.string.isRequired,
+    offset: _propTypes.default.number
+  })).isRequired,
+
+  /**
+   * True if the href location link should be applied. It will create an a element around every list item
+   */
+  href: _propTypes.default.bool,
+
+  /**
+   * A callback called on click of every list item, if the href is false
+   */
+  onClick: _propTypes.default.func,
+
+  /**
+   * Whether the anchors are always in a fixed position
+   *
+   * @deprecated Currently does nothing. Style the component instead.
+   */
+  floating: (0, _core.deprecatedPropType)(_propTypes.default.bool),
+
+  /**
+   * Currently selected index passed from the parent.
+   */
+  selectedIndex: _propTypes.default.number,
+
+  /**
+   * The Id of the scrollable container containing displayed elements.
+   *
+   * Defaults to `window` if unspecified.
+   */
+  scrollElementId: _propTypes.default.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)
+   * or to put more breathing room between the targeted element and the edges of the container.
+   *
+   * Each element can also have a specific offset via the options property.
+   */
+  offset: _propTypes.default.number
+};
+
+var _default = (0, _core.withStyles)(_styles.default, {
+  name: "HvNavigationAnchors"
+})(NavigationAnchors);
+
+exports.default = _default;
+//# sourceMappingURL=NavigationAnchors.js.map

package/dist/NavigationAnchors/NavigationAnchors.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/NavigationAnchors/NavigationAnchors.js"],"names":["RETRY_MAX","getScrollTop","c","window","scrollY","pageYOffset","document","documentElement","scrollTop","body","verticalScrollOffset","t","getBoundingClientRect","top","getComputedStyle","position","offsetTop","scrollElement","element","container","offset","elemTop","scrollTo","behavior","isScrolledToTheBottom","containerScrollTop","scrollHeight","innerHeight","offsetHeight","findFirstVisibleElement","options","boundsTop","i","length","ele","getElementById","value","NavigationAnchors","selectedIndex","selectedIndexProp","scrollElementId","href","onClick","className","classes","floating","other","setSelectedIndex","scrollEle","requestedAnimationFrame","lastContainerScrollTop","selectedIndexRef","current","checkScroll","requestAnimationFrame","firstVisibleElementIndex","newSelectedIndex","isScrollingDown","addEventListener","removeEventListener","cancelAnimationFrame","checkRenderedInterval","hashValue","location","hash","split","option","find","o","retry","setInterval","clearInterval","handleListItemClick","event","id","index","history","pushState","navOptions","map","label","root","NavOpt","selected","listItemSelected","gutters","listItemGutters","key","propTypes","PropTypes","string","shape","isRequired","arrayOf","number","bool","func","styles","name"],"mappings":"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","sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\nimport { deprecatedPropType, withStyles } from \"@material-ui/core\";\nimport { HvListContainer, HvListItem } from \"@hitachivantara/uikit-react-core\";\nimport styles from \"./styles\";\nimport navigationOption from \"./NavigationOption\";\n\nconst RETRY_MAX = 5;\n\nconst getScrollTop = (c = window) => {\n  if (c === window) {\n    return (\n      window.scrollY ||\n      window.pageYOffset ||\n      (document.documentElement && document.documentElement.scrollTop) ||\n      document.body.scrollTop\n    );\n  }\n\n  return c.scrollTop;\n};\n\nconst verticalScrollOffset = (t, c = window) => {\n  if (c === window) {\n    return (t?.getBoundingClientRect?.().top || 0) + (window.scrollY || window.pageYOffset);\n  }\n  if (getComputedStyle(c).position !== \"static\") {\n    return t.offsetTop;\n  }\n\n  return t.offsetTop - c.offsetTop;\n};\n\nconst scrollElement = (element, container, offset = 0) => {\n  const elemTop = verticalScrollOffset(element, container);\n  container.scrollTo({\n    top: elemTop - offset,\n    behavior: \"smooth\",\n  });\n};\n\nconst isScrolledToTheBottom = (container) => {\n  const containerScrollTop = getScrollTop(container);\n\n  if (container === window) {\n    // accounting for cases where html/body are set to height:100%\n    const scrollHeight =\n      (document.documentElement && document.documentElement.scrollHeight) ||\n      document.body.scrollHeight;\n\n    return containerScrollTop + window.innerHeight >= scrollHeight;\n  }\n\n  return containerScrollTop + container.offsetHeight >= container.scrollHeight;\n};\n\n// find the last nav item that whose top scrolled out of the container's visible area\nconst findFirstVisibleElement = (container, options, offset) => {\n  const boundsTop = verticalScrollOffset(container);\n\n  let i = 0;\n  // find index of first element whose top is still visible inside the container\n  for (; i < options.length; i += 1) {\n    const ele = document.getElementById(options[i].value);\n\n    if (ele) {\n      const elemTop = verticalScrollOffset(ele) - (options[i].offset || offset);\n\n      if (elemTop > boundsTop) {\n        break;\n      }\n    }\n  }\n\n  // return the previous index, the element that last scrolled past the top\n  return i - 1;\n};\n\n/**\n * A navigation component to help in changing views, still in development\n */\nconst NavigationAnchors = ({\n  selectedIndex: selectedIndexProp = 0,\n  scrollElementId,\n  href = true,\n  onClick,\n  className,\n  classes,\n  options,\n  floating,\n  offset = 0,\n  ...other\n}) => {\n  const [selectedIndex, setSelectedIndex] = useState(selectedIndexProp);\n\n  const scrollEle = useRef();\n  const requestedAnimationFrame = useRef(0);\n\n  const lastContainerScrollTop = useRef();\n\n  // ref to use a often-changing value in useCallback, has recommended in\n  // https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback\n  const selectedIndexRef = useRef(selectedIndex);\n  useEffect(() => {\n    selectedIndexRef.current = selectedIndex;\n  }, [selectedIndex]);\n\n  // get and store the container's dom element\n  useEffect(() => {\n    scrollEle.current = (scrollElementId && document.getElementById(scrollElementId)) || window;\n    lastContainerScrollTop.current = verticalScrollOffset(scrollEle.current);\n  }, [scrollElementId]);\n\n  const checkScroll = useCallback(() => {\n    if (requestedAnimationFrame.current === 0 && window?.requestAnimationFrame) {\n      requestedAnimationFrame.current = window.requestAnimationFrame(() => {\n        requestedAnimationFrame.current = 0;\n\n        const firstVisibleElementIndex = findFirstVisibleElement(\n          scrollEle.current,\n          options,\n          offset\n        );\n\n        let newSelectedIndex = firstVisibleElementIndex;\n\n        // select the first element when all elements are bellow the container's top\n        if (firstVisibleElementIndex < 0) {\n          newSelectedIndex = 0;\n        }\n\n        // if the user has reached the bottom of the container, select the first nav item still visible\n        // (usually this selects the last nav item, when it can't reach the top the container)\n        // in theory only needed when scrolling down, but no... because of the Safari bouncing behaviour\n        if (newSelectedIndex < options.length - 1 && isScrolledToTheBottom(scrollEle.current)) {\n          newSelectedIndex += 1;\n        }\n\n        const containerScrollTop = getScrollTop(scrollEle.current);\n        const isScrollingDown = containerScrollTop > lastContainerScrollTop.current;\n        lastContainerScrollTop.current = containerScrollTop;\n\n        // only update the selected item if the scroll direction is moving away from it\n        if (isScrollingDown) {\n          if (newSelectedIndex < selectedIndexRef.current) {\n            newSelectedIndex = selectedIndexRef.current;\n          }\n        } else if (newSelectedIndex > selectedIndexRef.current) {\n          newSelectedIndex = selectedIndexRef.current;\n        }\n\n        setSelectedIndex(newSelectedIndex);\n      });\n    }\n  }, [offset, options]);\n\n  // registers and unregisters the scroll listener\n  useEffect(() => {\n    if (scrollEle.current) {\n      scrollEle.current.addEventListener(\"scroll\", checkScroll, false);\n    }\n\n    return () => {\n      if (scrollEle.current) {\n        scrollEle.current.removeEventListener(\"scroll\", checkScroll);\n      }\n\n      if (requestedAnimationFrame.current !== 0) {\n        window.cancelAnimationFrame(requestedAnimationFrame.current);\n        requestedAnimationFrame.current = 0;\n      }\n    };\n  }, [checkScroll]);\n\n  // waits for the elements to be rendered and scrolls to the one referenced\n  // in the URL hash, if any\n  useEffect(() => {\n    let checkRenderedInterval;\n\n    if (href) {\n      const hashValue = document.location.hash.split(\"#\")[1] || \"\";\n\n      const option = options.find((o) => o.value === hashValue);\n\n      if (option) {\n        let retry = 0;\n        checkRenderedInterval = setInterval(() => {\n          const ele = document.getElementById(option.value);\n\n          if (ele) {\n            scrollElement(ele, scrollEle.current, option.offset || offset);\n            clearInterval(checkRenderedInterval);\n          } else {\n            retry += 1;\n            if (retry === RETRY_MAX) {\n              clearInterval(checkRenderedInterval);\n            }\n          }\n        }, 1000);\n      }\n    }\n\n    return () => {\n      clearInterval(checkRenderedInterval);\n    };\n\n    // we really want to run this just in the first load\n    // in fact this doesn't even belong here, the logic should be external\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  const handleListItemClick = (event, id, index) => {\n    const option = options.find((o) => o.value === id);\n\n    if (option) {\n      const ele = document.getElementById(id);\n      if (ele) {\n        scrollElement(ele, scrollEle.current, option.offset || offset);\n      }\n\n      if (!href && onClick) {\n        onClick(event, index, option);\n      } else if (href) {\n        window.history.pushState({}, \"\", `#${options[index].value}`);\n      }\n\n      setSelectedIndex(index);\n\n      // Safari scrolls immediately (no smooth scroll support),\n      // so this ref value must be updated asap\n      selectedIndexRef.current = index;\n    }\n  };\n\n  const navOptions = useMemo(() => {\n    return options.map((option) => {\n      return navigationOption(option.label);\n    });\n  }, [options]);\n\n  return (\n    <HvListContainer interactive className={clsx(className, classes.root)} {...other}>\n      {options.map((option, index) => {\n        const NavOpt = navOptions[index];\n\n        return (\n          <HvListItem\n            classes={{\n              selected: classes.listItemSelected,\n              gutters: classes.listItemGutters,\n            }}\n            key={option.key || option.label}\n            onClick={(event) => handleListItemClick(event, option.value, index)}\n            selected={selectedIndex === index}\n          >\n            <NavOpt />\n          </HvListItem>\n        );\n      })}\n    </HvListContainer>\n  );\n};\n\nNavigationAnchors.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    root: PropTypes.string,\n    listItemGutters: PropTypes.string,\n    listItemSelected: PropTypes.string,\n  }).isRequired,\n  /**\n   * An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied\n   */\n  options: PropTypes.arrayOf(\n    PropTypes.shape({\n      key: PropTypes.string,\n      value: PropTypes.string.isRequired,\n      label: PropTypes.string.isRequired,\n      offset: PropTypes.number,\n    })\n  ).isRequired,\n  /**\n   * True if the href location link should be applied. It will create an a element around every list item\n   */\n  href: PropTypes.bool,\n  /**\n   * A callback called on click of every list item, if the href is false\n   */\n  onClick: PropTypes.func,\n  /**\n   * Whether the anchors are always in a fixed position\n   *\n   * @deprecated Currently does nothing. Style the component instead.\n   */\n  floating: deprecatedPropType(PropTypes.bool),\n  /**\n   * Currently selected index passed from the parent.\n   */\n  selectedIndex: PropTypes.number,\n  /**\n   * The Id of the scrollable container containing displayed elements.\n   *\n   * Defaults to `window` if unspecified.\n   */\n  scrollElementId: PropTypes.string,\n  /**\n   * Defines the offset from the top of each element for getting an optimal viewing region in the container.\n   * This allows to exclude regions of the container that are obscured by other content (such as fixed-positioned toolbars or titles)\n   * or to put more breathing room between the targeted element and the edges of the container.\n   *\n   * Each element can also have a specific offset via the options property.\n   */\n  offset: PropTypes.number,\n};\n\nexport default withStyles(styles, { name: \"HvNavigationAnchors\" })(NavigationAnchors);\n"],"file":"NavigationAnchors.js"}

package/dist/NavigationAnchors/NavigationOption.js

@@ -0,0 +1,40 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.array.of.js");
+
+var _uikitReactCore = require("@hitachivantara/uikit-react-core");
+
+var hideTooltip = function hideTooltip(evt) {
+  var isOverFlow = evt.target.children.length > 1 ? Array.of.apply(Array, (0, _toConsumableArray2.default)(evt.target.children)).some(function (child) {
+    return child.scrollWidth > child.clientWidth;
+  }) : evt.target.scrollWidth > evt.target.clientWidth;
+  return !isOverFlow;
+};
+
+var wrapperTooltip = function wrapperTooltip(Component, label) {
+  var ComponentFunction = function ComponentFunction() {
+    return Component;
+  };
+
+  return (0, _uikitReactCore.withTooltip)(ComponentFunction, label, "top", hideTooltip);
+};
+
+var NavigationOption = function NavigationOption(label) {
+  var NavOpt = wrapperTooltip(label, label);
+  return NavOpt;
+};
+
+var _default = NavigationOption;
+exports.default = _default;
+//# sourceMappingURL=NavigationOption.js.map

package/dist/NavigationAnchors/NavigationOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/NavigationAnchors/NavigationOption.js"],"names":["hideTooltip","evt","isOverFlow","target","children","length","Array","of","some","child","scrollWidth","clientWidth","wrapperTooltip","Component","label","ComponentFunction","NavigationOption","NavOpt"],"mappings":";;;;;;;;;;;;;;;AAAA;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,GAAD,EAAS;AAC3B,MAAMC,UAAU,GACdD,GAAG,CAACE,MAAJ,CAAWC,QAAX,CAAoBC,MAApB,GAA6B,CAA7B,GACIC,KAAK,CAACC,EAAN,OAAAD,KAAK,mCAAOL,GAAG,CAACE,MAAJ,CAAWC,QAAlB,EAAL,CAAiCI,IAAjC,CAAsC,UAACC,KAAD;AAAA,WAAWA,KAAK,CAACC,WAAN,GAAoBD,KAAK,CAACE,WAArC;AAAA,GAAtC,CADJ,GAEIV,GAAG,CAACE,MAAJ,CAAWO,WAAX,GAAyBT,GAAG,CAACE,MAAJ,CAAWQ,WAH1C;AAIA,SAAO,CAACT,UAAR;AACD,CAND;;AAQA,IAAMU,cAAc,GAAG,SAAjBA,cAAiB,CAACC,SAAD,EAAYC,KAAZ,EAAsB;AAC3C,MAAMC,iBAAiB,GAAG,SAApBA,iBAAoB;AAAA,WAAMF,SAAN;AAAA,GAA1B;;AACA,SAAO,iCAAYE,iBAAZ,EAA+BD,KAA/B,EAAsC,KAAtC,EAA6Cd,WAA7C,CAAP;AACD,CAHD;;AAKA,IAAMgB,gBAAgB,GAAG,SAAnBA,gBAAmB,CAACF,KAAD,EAAW;AAClC,MAAMG,MAAM,GAAGL,cAAc,CAACE,KAAD,EAAQA,KAAR,CAA7B;AACA,SAAOG,MAAP;AACD,CAHD;;eAKeD,gB","sourcesContent":["import { withTooltip } from \"@hitachivantara/uikit-react-core\";\n\nconst hideTooltip = (evt) => {\n  const isOverFlow =\n    evt.target.children.length > 1\n      ? Array.of(...evt.target.children).some((child) => child.scrollWidth > child.clientWidth)\n      : evt.target.scrollWidth > evt.target.clientWidth;\n  return !isOverFlow;\n};\n\nconst wrapperTooltip = (Component, label) => {\n  const ComponentFunction = () => Component;\n  return withTooltip(ComponentFunction, label, \"top\", hideTooltip);\n};\n\nconst NavigationOption = (label) => {\n  const NavOpt = wrapperTooltip(label, label);\n  return NavOpt;\n};\n\nexport default NavigationOption;\n"],"file":"NavigationOption.js"}

package/dist/NavigationAnchors/index.d.ts

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