@hitachivantara/uikit-react-core 5.3.0 → 5.5.0

package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs

@@ -0,0 +1,126 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const scrollToHorizontalClasses = require("./scrollToHorizontalClasses.cjs");
+const react = require("@emotion/react");
+const clsx = require("clsx");
+const ScrollToHorizontal_styles = require("./ScrollToHorizontal.styles.cjs");
+const useScrollTo = require("../useScrollTo.cjs");
+const React = require("react");
+const withTooltip = require("../withTooltip.cjs");
+const styles = require("@mui/material/styles");
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const hexToRgbA = require("../../../utils/hexToRgbA.cjs");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const material = require("@mui/material");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useUniqueId = require("../../../hooks/useUniqueId.cjs");
+const HorizontalScrollListItem = require("./HorizontalScrollListItem/HorizontalScrollListItem.cjs");
+const useTheme = require("../../../hooks/useTheme.cjs");
+const setId = require("../../../utils/setId.cjs");
+const keyCheck = require("../../../utils/keyboardUtils/keyCheck.cjs");
+const keyboardCodes = require("../../../utils/keyboardUtils/keyboardCodes.cjs");
+const {
+  Enter
+} = keyboardCodes.keyboardCodes;
+const HvScrollToHorizontal = ({
+  id,
+  defaultSelectedIndex = 0,
+  scrollElementId,
+  href = true,
+  onChange,
+  onClick,
+  onEnter,
+  className,
+  classes,
+  options,
+  offset = 0,
+  position = "relative",
+  tooltipPosition = "top",
+  ...others
+}) => {
+  const muiTheme = styles.useTheme();
+  const downSm = material.useMediaQuery(muiTheme.breakpoints.down("sm"));
+  const upMd = material.useMediaQuery(muiTheme.breakpoints.up("md"));
+  const {
+    activeTheme,
+    selectedMode
+  } = useTheme.useTheme();
+  const elementId = useUniqueId.default(id, "hvHorizontalScrollto");
+  const [selectedIndex, setScrollTo] = useScrollTo.useScrollTo(defaultSelectedIndex, scrollElementId, href, offset, options, onChange);
+  const handleSelection = (event, value, index) => {
+    event.preventDefault();
+    const wrappedOnChange = () => {
+      onChange == null ? void 0 : onChange(event, index);
+    };
+    setScrollTo(event, value, index, wrappedOnChange);
+  };
+  const tooltipWrappers = React.useMemo(() => {
+    return options.map((option) => {
+      return withTooltip.withTooltip(option.label, "div", tooltipPosition);
+    });
+  }, [options, tooltipPosition]);
+  const NotSelected = React.useCallback(() => {
+    return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+      children: ({
+        css
+      }) => /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: clsx.clsx(classes == null ? void 0 : classes.notSelectedRoot, scrollToHorizontalClasses.default.notSelectedRoot, css(ScrollToHorizontal_styles.styles.notSelectedRoot)),
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+          className: clsx.clsx(classes == null ? void 0 : classes.notSelected, scrollToHorizontalClasses.default.notSelected, css(ScrollToHorizontal_styles.styles.notSelected))
+        })
+      })
+    });
+  }, [classes == null ? void 0 : classes.notSelectedRoot, classes == null ? void 0 : classes.notSelected]);
+  const Selected = React.useCallback(() => {
+    return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+      children: ({
+        css
+      }) => /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.CurrentStep, {
+        height: activeTheme == null ? void 0 : activeTheme.scrollTo.dotSelectedSize,
+        width: activeTheme == null ? void 0 : activeTheme.scrollTo.dotSelectedSize,
+        className: clsx.clsx(classes == null ? void 0 : classes.selected, scrollToHorizontalClasses.default.selected, css(ScrollToHorizontal_styles.styles.selected))
+      })
+    });
+  }, [classes == null ? void 0 : classes.selected, activeTheme == null ? void 0 : activeTheme.scrollTo.dotSelectedSize]);
+  const tabs = options.map((option, index) => {
+    const selected = selectedIndex === index;
+    const tooltipWrapper = tooltipWrappers[index];
+    return /* @__PURE__ */ jsxRuntime.jsxs(HorizontalScrollListItem.HvHorizontalScrollListItem, {
+      id: setId.setId(elementId, `item-${index}`),
+      onClick: (event) => {
+        handleSelection(event, option.value, index);
+        onClick == null ? void 0 : onClick(event, index);
+      },
+      onKeyDown: (event) => {
+        if (keyCheck.isKeypress(event, Enter) === true) {
+          handleSelection(event, option.value, index);
+          onEnter == null ? void 0 : onEnter(event, index);
+        }
+      },
+      tooltipWrapper,
+      selected,
+      children: [/* @__PURE__ */ jsxRuntime.jsx("p", {
+        children: option.label
+      }), selected ? /* @__PURE__ */ jsxRuntime.jsx(Selected, {}) : /* @__PURE__ */ jsxRuntime.jsx(NotSelected, {})]
+    }, option.key || option.label);
+  });
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css
+    }) => /* @__PURE__ */ jsxRuntime.jsx("ol", {
+      className: clsx.clsx(className, classes == null ? void 0 : classes.root, scrollToHorizontalClasses.default.root, css(ScrollToHorizontal_styles.styles.root), css({
+        width: position === "fixed" && (upMd || downSm) ? `calc(100% - 2*${uikitStyles.theme.spacing(upMd ? 4 : 2)})` : "100%",
+        marginTop: 0,
+        marginBottom: 0,
+        marginRight: position === "fixed" && (upMd || downSm) ? uikitStyles.theme.spacing(upMd ? 4 : 2) : 0,
+        marginLeft: position === "fixed" && (upMd || downSm) ? uikitStyles.theme.spacing(upMd ? 4 : 2) : 0,
+        backgroundColor: hexToRgbA.default(activeTheme == null ? void 0 : activeTheme.colors.modes[selectedMode].atmo2, activeTheme == null ? void 0 : activeTheme.scrollTo.backgroundColorOpacity)
+      }), position === "sticky" && clsx.clsx(classes == null ? void 0 : classes.positionSticky, scrollToHorizontalClasses.default.positionSticky, css(ScrollToHorizontal_styles.styles.positionSticky)), position === "fixed" && clsx.clsx(classes == null ? void 0 : classes.positionFixed, scrollToHorizontalClasses.default.positionFixed, css(ScrollToHorizontal_styles.styles.positionFixed))),
+      id: elementId,
+      ...others,
+      children: tabs
+    })
+  });
+};
+exports.HvScrollToHorizontal = HvScrollToHorizontal;
+//# sourceMappingURL=ScrollToHorizontal.cjs.map

package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollToHorizontal.cjs","sources":["../../../../../src/components/ScrollTo/Horizontal/ScrollToHorizontal.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types\";\nimport scrollToHorizontalClasses, {\n  HvScrollToHorizontalClasses,\n} from \"./scrollToHorizontalClasses\";\nimport { ClassNames } from \"@emotion/react\";\nimport { clsx } from \"clsx\";\nimport { useTheme, useUniqueId } from \"@core/hooks\";\nimport { styles } from \"./ScrollToHorizontal.styles\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport { HvHorizontalScrollListItem } from \"./HorizontalScrollListItem\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { useCallback, useMemo } from \"react\";\nimport { withTooltip } from \"../withTooltip\";\nimport { useTheme as useMuiTheme } from \"@mui/material/styles\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport fade from \"@core/utils/hexToRgbA\";\nimport { HvScrollToTooltipPositions } from \"../types\";\nimport { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\nimport { useMediaQuery } from \"@mui/material\";\n\nconst { Enter } = keyboardCodes;\n\nexport interface HvScrollToHorizontalOption {\n  key?: string;\n  label: string;\n  value: string;\n  offset?: number;\n}\n\nexport type HvScrollToHorizontalPositions = \"sticky\" | \"fixed\" | \"relative\";\n\nexport interface HvScrollToHorizontalProps\n  extends HvBaseProps<HTMLOListElement, { onChange; onClick }> {\n  /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied */\n  options: HvScrollToHorizontalOption[];\n  /** True if the href location link should be applied. It will create an a element around every list item */\n  href?: boolean;\n  /** Default selected index passed from the parent. */\n  defaultSelectedIndex?: number;\n  /**\n   * The Id of the scrollable container containing displayed elements.\n   *\n   * Defaults to `window` if unspecified.\n   */\n  scrollElementId?: 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?: number;\n  /** Position of the Horizontal scroll to. */\n  position?: HvScrollToHorizontalPositions;\n  /** Position of tooltip identifying the current item. */\n  tooltipPosition?: HvScrollToTooltipPositions;\n  /** A function called each time the selected index changes. */\n  onChange?: (\n    event:\n      | Event\n      | React.MouseEvent<HTMLDivElement>\n      | React.KeyboardEvent<HTMLDivElement>,\n    index: number\n  ) => void;\n  /** A function called each time an user clicks on a tab element. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>, index: number) => void;\n  /** A function called each time an user press enter on a tab element. */\n  onEnter?: (event: React.KeyboardEvent<HTMLDivElement>, index: number) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvScrollToHorizontalClasses;\n}\n\n/**\n * The horizontal scroll to element can be used to quickly navigate in a page.\n */\nexport const HvScrollToHorizontal = ({\n  id,\n  defaultSelectedIndex = 0,\n  scrollElementId,\n  href = true,\n  onChange,\n  onClick,\n  onEnter,\n  className,\n  classes,\n  options,\n  offset = 0,\n  position = \"relative\",\n  tooltipPosition = \"top\",\n  ...others\n}: HvScrollToHorizontalProps) => {\n  const muiTheme = useMuiTheme();\n\n  const downSm = useMediaQuery(muiTheme.breakpoints.down(\"sm\"));\n  const upMd = useMediaQuery(muiTheme.breakpoints.up(\"md\"));\n\n  const { activeTheme, selectedMode } = useTheme();\n\n  const elementId = useUniqueId(id, \"hvHorizontalScrollto\");\n\n  const [selectedIndex, setScrollTo] = useScrollTo(\n    defaultSelectedIndex,\n    scrollElementId,\n    href,\n    offset,\n    options,\n    onChange\n  );\n\n  const handleSelection = (\n    event:\n      | React.MouseEvent<HTMLDivElement>\n      | React.KeyboardEvent<HTMLDivElement>,\n    value: string,\n    index: number\n  ) => {\n    event.preventDefault();\n\n    const wrappedOnChange = () => {\n      onChange?.(event, index);\n    };\n\n    setScrollTo(event, value, index, wrappedOnChange);\n  };\n\n  const tooltipWrappers = useMemo(() => {\n    return options.map((option) => {\n      return withTooltip(option.label, \"div\", tooltipPosition);\n    });\n  }, [options, tooltipPosition]);\n\n  const NotSelected = useCallback(() => {\n    return (\n      <ClassNames>\n        {({ css }) => (\n          <div\n            className={clsx(\n              classes?.notSelectedRoot,\n              scrollToHorizontalClasses.notSelectedRoot,\n              css(styles.notSelectedRoot)\n            )}\n          >\n            <div\n              className={clsx(\n                classes?.notSelected,\n                scrollToHorizontalClasses.notSelected,\n                css(styles.notSelected)\n              )}\n            />\n          </div>\n        )}\n      </ClassNames>\n    );\n  }, [classes?.notSelectedRoot, classes?.notSelected]);\n\n  const Selected = useCallback(() => {\n    return (\n      <ClassNames>\n        {({ css }) => (\n          <CurrentStep\n            height={activeTheme?.scrollTo.dotSelectedSize}\n            width={activeTheme?.scrollTo.dotSelectedSize}\n            className={clsx(\n              classes?.selected,\n              scrollToHorizontalClasses.selected,\n              css(styles.selected)\n            )}\n          />\n        )}\n      </ClassNames>\n    );\n  }, [classes?.selected, activeTheme?.scrollTo.dotSelectedSize]);\n\n  const tabs = options.map((option, index) => {\n    const selected = selectedIndex === index;\n    const tooltipWrapper = tooltipWrappers[index];\n\n    return (\n      <HvHorizontalScrollListItem\n        id={setId(elementId, `item-${index}`)}\n        onClick={(event) => {\n          handleSelection(event, option.value, index);\n          onClick?.(event, index);\n        }}\n        onKeyDown={(event) => {\n          if (isKeypress(event, Enter) === true) {\n            handleSelection(event, option.value, index);\n            onEnter?.(event, index);\n          }\n        }}\n        tooltipWrapper={tooltipWrapper}\n        selected={selected}\n        key={option.key || option.label}\n      >\n        <p>{option.label}</p>\n        {selected ? <Selected /> : <NotSelected />}\n      </HvHorizontalScrollListItem>\n    );\n  });\n\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <ol\n          className={clsx(\n            className,\n            classes?.root,\n            scrollToHorizontalClasses.root,\n            css(styles.root),\n            css({\n              width:\n                position === \"fixed\" && (upMd || downSm)\n                  ? `calc(100% - 2*${theme.spacing(upMd ? 4 : 2)})`\n                  : \"100%\",\n              marginTop: 0,\n              marginBottom: 0,\n              marginRight:\n                position === \"fixed\" && (upMd || downSm)\n                  ? theme.spacing(upMd ? 4 : 2)\n                  : 0,\n              marginLeft:\n                position === \"fixed\" && (upMd || downSm)\n                  ? theme.spacing(upMd ? 4 : 2)\n                  : 0,\n              backgroundColor: fade(\n                activeTheme?.colors.modes[selectedMode].atmo2,\n                activeTheme?.scrollTo.backgroundColorOpacity\n              ),\n            }),\n            position === \"sticky\" &&\n              clsx(\n                classes?.positionSticky,\n                scrollToHorizontalClasses.positionSticky,\n                css(styles.positionSticky)\n              ),\n            position === \"fixed\" &&\n              clsx(\n                classes?.positionFixed,\n                scrollToHorizontalClasses.positionFixed,\n                css(styles.positionFixed)\n              )\n          )}\n          id={elementId}\n          {...others}\n        >\n          {tabs}\n        </ol>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["Enter","keyboardCodes","HvScrollToHorizontal","id","defaultSelectedIndex","scrollElementId","href","onChange","onClick","onEnter","className","classes","options","offset","position","tooltipPosition","others","muiTheme","useMuiTheme","downSm","useMediaQuery","breakpoints","down","upMd","up","activeTheme","selectedMode","useTheme","elementId","useUniqueId","selectedIndex","setScrollTo","useScrollTo","handleSelection","event","value","index","preventDefault","wrappedOnChange","tooltipWrappers","useMemo","map","option","withTooltip","label","NotSelected","useCallback","ClassNames","children","css","clsx","notSelectedRoot","scrollToHorizontalClasses","styles","notSelected","Selected","CurrentStep","height","scrollTo","dotSelectedSize","width","selected","tabs","tooltipWrapper","HvHorizontalScrollListItem","setId","onKeyDown","isKeypress","_jsx","key","root","theme","spacing","marginTop","marginBottom","marginRight","marginLeft","backgroundColor","fade","colors","modes","atmo2","backgroundColorOpacity","positionSticky","positionFixed"],"mappings":"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"}

package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.cjs

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const styles = {
+  root: {
+    display: "flex",
+    padding: "0 30px",
+    listStyleType: "none",
+    flexWrap: "wrap",
+    backdropFilter: `blur(${uikitStyles.theme.scrollTo.backgroundColorBlur})`
+  },
+  positionSticky: {
+    position: "sticky",
+    zIndex: `calc(${uikitStyles.theme.zIndices.banner} - 2)`,
+    top: 0,
+    left: 0
+  },
+  positionFixed: {
+    position: "fixed",
+    zIndex: `calc(${uikitStyles.theme.zIndices.banner} - 2)`,
+    top: 0,
+    left: 0
+  },
+  notSelectedRoot: {
+    display: uikitStyles.theme.scrollTo.horizontal.dotDisplay,
+    justifyContent: "center",
+    alignItems: "center",
+    height: uikitStyles.theme.scrollTo.dotRootSize,
+    width: uikitStyles.theme.scrollTo.dotRootSize,
+    borderRadius: uikitStyles.theme.scrollTo.dotRootRadius
+  },
+  notSelected: {
+    height: uikitStyles.theme.scrollTo.dotNotSelectedSize,
+    width: uikitStyles.theme.scrollTo.dotNotSelectedSize,
+    borderRadius: "50%",
+    display: "inline-block",
+    backgroundColor: uikitStyles.theme.scrollTo.dotNotSelectedColor
+  },
+  selected: {
+    display: uikitStyles.theme.scrollTo.horizontal.dotDisplay,
+    height: uikitStyles.theme.scrollTo.dotRootSize,
+    width: uikitStyles.theme.scrollTo.dotRootSize
+  }
+};
+exports.styles = styles;
+//# sourceMappingURL=ScrollToHorizontal.styles.cjs.map

package/dist/cjs/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollToHorizontal.styles.cjs","sources":["../../../../../src/components/ScrollTo/Horizontal/ScrollToHorizontal.styles.tsx"],"sourcesContent":["import { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const styles: {\n  root: CSSInterpolation;\n  positionSticky: CSSInterpolation;\n  positionFixed: CSSInterpolation;\n  notSelectedRoot: CSSInterpolation;\n  notSelected: CSSInterpolation;\n  selected: CSSInterpolation;\n} = {\n  root: {\n    display: \"flex\",\n    padding: \"0 30px\",\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`,\n  },\n  positionSticky: {\n    position: \"sticky\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  positionFixed: {\n    position: \"fixed\",\n    zIndex: `calc(${theme.zIndices.banner} - 2)`,\n    top: 0,\n    left: 0,\n  },\n  notSelectedRoot: {\n    display: theme.scrollTo.horizontal.dotDisplay,\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    borderRadius: theme.scrollTo.dotRootRadius,\n  },\n  notSelected: {\n    height: theme.scrollTo.dotNotSelectedSize,\n    width: theme.scrollTo.dotNotSelectedSize,\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.scrollTo.dotNotSelectedColor,\n  },\n  selected: {\n    display: theme.scrollTo.horizontal.dotDisplay,\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n  },\n};\n"],"names":["styles","root","display","padding","listStyleType","flexWrap","backdropFilter","theme","scrollTo","backgroundColorBlur","positionSticky","position","zIndex","zIndices","banner","top","left","positionFixed","notSelectedRoot","horizontal","dotDisplay","justifyContent","alignItems","height","dotRootSize","width","borderRadius","dotRootRadius","notSelected","dotNotSelectedSize","backgroundColor","dotNotSelectedColor","selected"],"mappings":";;;AAGO,MAAMA,SAOT;AAAA,EACFC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,SAAS;AAAA,IACTC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,gBAAiB,QAAOC,YAAAA,MAAMC,SAASC;AAAAA,EACzC;AAAA,EACAC,gBAAgB;AAAA,IACdC,UAAU;AAAA,IACVC,QAAS,QAAOL,YAAAA,MAAMM,SAASC;AAAAA,IAC/BC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAC,eAAe;AAAA,IACbN,UAAU;AAAA,IACVC,QAAS,QAAOL,YAAAA,MAAMM,SAASC;AAAAA,IAC/BC,KAAK;AAAA,IACLC,MAAM;AAAA,EACR;AAAA,EACAE,iBAAiB;AAAA,IACfhB,SAASK,YAAMC,MAAAA,SAASW,WAAWC;AAAAA,IACnCC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZC,QAAQhB,YAAAA,MAAMC,SAASgB;AAAAA,IACvBC,OAAOlB,YAAAA,MAAMC,SAASgB;AAAAA,IACtBE,cAAcnB,YAAAA,MAAMC,SAASmB;AAAAA,EAC/B;AAAA,EACAC,aAAa;AAAA,IACXL,QAAQhB,YAAAA,MAAMC,SAASqB;AAAAA,IACvBJ,OAAOlB,YAAAA,MAAMC,SAASqB;AAAAA,IACtBH,cAAc;AAAA,IACdxB,SAAS;AAAA,IACT4B,iBAAiBvB,YAAAA,MAAMC,SAASuB;AAAAA,EAClC;AAAA,EACAC,UAAU;AAAA,IACR9B,SAASK,YAAMC,MAAAA,SAASW,WAAWC;AAAAA,IACnCG,QAAQhB,YAAAA,MAAMC,SAASgB;AAAAA,IACvBC,OAAOlB,YAAAA,MAAMC,SAASgB;AAAAA,EACxB;AACF;;"}

package/dist/cjs/components/ScrollTo/Horizontal/scrollToHorizontalClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["root", "positionSticky", "positionFixed", "notSelectedRoot", "notSelected", "selected"];
+const scrollToHorizontalClasses = classes.getClasses(classKeys, "HvScrollToHorizontal");
+const scrollToHorizontalClasses$1 = scrollToHorizontalClasses;
+exports.default = scrollToHorizontalClasses$1;
+//# sourceMappingURL=scrollToHorizontalClasses.cjs.map

package/dist/cjs/components/ScrollTo/Horizontal/scrollToHorizontalClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollToHorizontalClasses.cjs","sources":["../../../../../src/components/ScrollTo/Horizontal/scrollToHorizontalClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvScrollToHorizontalClasses {\n  root?: string;\n  positionSticky?: string;\n  positionFixed?: string;\n  notSelectedRoot?: string;\n  notSelected?: string;\n  selected?: string;\n}\n\nconst classKeys: string[] = [\n  \"root\",\n  \"positionSticky\",\n  \"positionFixed\",\n  \"notSelectedRoot\",\n  \"notSelected\",\n  \"selected\",\n];\n\nconst scrollToHorizontalClasses = getClasses<HvScrollToHorizontalClasses>(\n  classKeys,\n  \"HvScrollToHorizontal\"\n);\n\nexport default scrollToHorizontalClasses;\n"],"names":["classKeys","scrollToHorizontalClasses","getClasses"],"mappings":";;;AAWA,MAAMA,YAAsB,CAC1B,QACA,kBACA,iBACA,mBACA,eACA,UAAU;AAGZ,MAAMC,4BAA4BC,QAChCF,WAAAA,WACA,sBAAsB;AAGxB,MAAA,8BAAeC;;"}

package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const scrollToVerticalClasses = require("./scrollToVerticalClasses.cjs");
+const ScrollToVertical_styles = require("./ScrollToVertical.styles.cjs");
+const clsx = require("clsx");
+const useScrollTo = require("../useScrollTo.cjs");
+const React = require("react");
+const withTooltip = require("../withTooltip.cjs");
+const react = require("@emotion/react");
+const hexToRgbA = require("../../../utils/hexToRgbA.cjs");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useUniqueId = require("../../../hooks/useUniqueId.cjs");
+const VerticalScrollListItem = require("./VerticalScrollListItem/VerticalScrollListItem.cjs");
+const useTheme = require("../../../hooks/useTheme.cjs");
+const setId = require("../../../utils/setId.cjs");
+const keyCheck = require("../../../utils/keyboardUtils/keyCheck.cjs");
+const keyboardCodes = require("../../../utils/keyboardUtils/keyboardCodes.cjs");
+const {
+  Enter
+} = keyboardCodes.keyboardCodes;
+const HvScrollToVertical = ({
+  id,
+  defaultSelectedIndex = 0,
+  scrollElementId,
+  href = true,
+  onChange,
+  onClick,
+  onEnter,
+  className,
+  classes,
+  options,
+  offset = 0,
+  position = "relative",
+  tooltipPosition = "left",
+  ...others
+}) => {
+  const {
+    activeTheme,
+    selectedMode
+  } = useTheme.useTheme();
+  const elementId = useUniqueId.default(id, "hvVerticalScrollto");
+  const [selectedIndex, setScrollTo] = useScrollTo.useScrollTo(defaultSelectedIndex, scrollElementId, href, offset, options, onChange);
+  const handleSelection = (event, value, index) => {
+    event.preventDefault();
+    const wrappedOnChange = () => {
+      onChange == null ? void 0 : onChange(event, index);
+    };
+    setScrollTo(event, value, index, wrappedOnChange);
+  };
+  const tooltipWrappers = React.useMemo(() => {
+    return options.map((option) => {
+      return withTooltip.withTooltip(option.label, "div", tooltipPosition, false);
+    });
+  }, [options, tooltipPosition]);
+  const tabs = options.map((option, index) => {
+    const selected = selectedIndex === index;
+    const tooltipWrapper = tooltipWrappers[index];
+    return /* @__PURE__ */ jsxRuntime.jsx(VerticalScrollListItem.HvVerticalScrollListItem, {
+      id: setId.setId(elementId, `item-${index}`),
+      onClick: (event) => {
+        handleSelection(event, option.value, index);
+        onClick == null ? void 0 : onClick(event, index);
+      },
+      onKeyDown: (event) => {
+        if (keyCheck.isKeypress(event, Enter) === true) {
+          handleSelection(event, option.value, index);
+          onEnter == null ? void 0 : onEnter(event, index);
+        }
+      },
+      tooltipWrapper,
+      selected,
+      "aria-label": option.label
+    }, option.key || option.label);
+  });
+  const dynamicClasses = ScrollToVertical_styles.generateDynamicStyles(options.length);
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css
+    }) => /* @__PURE__ */ jsxRuntime.jsx("ol", {
+      className: clsx.clsx(className, classes == null ? void 0 : classes.root, scrollToVerticalClasses.default.root, css(ScrollToVertical_styles.styles.root), css({
+        backgroundColor: hexToRgbA.default(activeTheme == null ? void 0 : activeTheme.colors.modes[selectedMode].atmo2, activeTheme == null ? void 0 : activeTheme.scrollTo.backgroundColorOpacity)
+      }), position === "fixed" && clsx.clsx(classes == null ? void 0 : classes.positionFixed, scrollToVerticalClasses.default.positionFixed, css(dynamicClasses.positionFixed)), position === "absolute" && clsx.clsx(classes == null ? void 0 : classes.positionAbsolute, scrollToVerticalClasses.default.positionAbsolute, css(dynamicClasses.positionAbsolute))),
+      id: elementId,
+      ...others,
+      children: tabs
+    })
+  });
+};
+exports.HvScrollToVertical = HvScrollToVertical;
+//# sourceMappingURL=ScrollToVertical.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollToVertical.cjs","sources":["../../../../../src/components/ScrollTo/Vertical/ScrollToVertical.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types\";\nimport scrollToVerticalClasses, {\n  HvScrollToVerticalClasses,\n} from \"./scrollToVerticalClasses\";\nimport { generateDynamicStyles, styles } from \"./ScrollToVertical.styles\";\nimport { clsx } from \"clsx\";\nimport { useTheme, useUniqueId } from \"@core/hooks\";\nimport { HvVerticalScrollListItem } from \"./VerticalScrollListItem\";\nimport { isKeypress, keyboardCodes, setId } from \"@core/utils\";\nimport { useScrollTo } from \"../useScrollTo\";\nimport { useMemo } from \"react\";\nimport { withTooltip } from \"../withTooltip\";\nimport { ClassNames } from \"@emotion/react\";\nimport fade from \"@core/utils/hexToRgbA\";\nimport { HvScrollToTooltipPositions } from \"../types\";\n\nconst { Enter } = keyboardCodes;\n\nexport interface HvScrollToVerticalOption {\n  key?: string;\n  label: string;\n  value: string;\n  offset?: number;\n}\n\nexport type HvScrollToVerticalPositions = \"absolute\" | \"fixed\" | \"relative\";\n\nexport interface HvScrollToVerticalProps\n  extends HvBaseProps<HTMLOListElement, { onChange; onClick }> {\n  /** An Array of Objects with Label and Value. Label is the displayed Element and Value is the local navigation location applied */\n  options: HvScrollToVerticalOption[];\n  /** True if the href location link should be applied. It will create an a element around every list item */\n  href?: boolean;\n  /** Default selected index passed from the parent. */\n  defaultSelectedIndex?: number;\n  /**\n   * The Id of the scrollable container containing displayed elements.\n   *\n   * Defaults to `window` if unspecified.\n   */\n  scrollElementId?: 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?: number;\n  /** Position of the Vertical scroll to. */\n  position?: HvScrollToVerticalPositions;\n  /** Position of tooltip identifying the current item. */\n  tooltipPosition?: HvScrollToTooltipPositions;\n  /** A function called each time the selected index changes. */\n  onChange?: (\n    event:\n      | Event\n      | React.MouseEvent<HTMLDivElement>\n      | React.KeyboardEvent<HTMLDivElement>,\n    index: number\n  ) => void;\n  /** A function called each time an user clicks on a tab element. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>, index: number) => void;\n  /** A function called each time an user press enter on a tab element. */\n  onEnter?: (event: React.KeyboardEvent<HTMLDivElement>, index: number) => void;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvScrollToVerticalClasses;\n}\n\n/**\n * The vertical scroll to element can be used to quickly navigate in a page.\n */\nexport const HvScrollToVertical = ({\n  id,\n  defaultSelectedIndex = 0,\n  scrollElementId,\n  href = true,\n  onChange,\n  onClick,\n  onEnter,\n  className,\n  classes,\n  options,\n  offset = 0,\n  position = \"relative\",\n  tooltipPosition = \"left\",\n  ...others\n}: HvScrollToVerticalProps) => {\n  const { activeTheme, selectedMode } = useTheme();\n\n  const elementId = useUniqueId(id, \"hvVerticalScrollto\");\n\n  const [selectedIndex, setScrollTo] = useScrollTo(\n    defaultSelectedIndex,\n    scrollElementId,\n    href,\n    offset,\n    options,\n    onChange\n  );\n\n  const handleSelection = (\n    event:\n      | React.MouseEvent<HTMLDivElement>\n      | React.KeyboardEvent<HTMLDivElement>,\n    value: string,\n    index: number\n  ) => {\n    event.preventDefault();\n\n    const wrappedOnChange = () => {\n      onChange?.(event, index);\n    };\n\n    setScrollTo(event, value, index, wrappedOnChange);\n  };\n\n  const tooltipWrappers = useMemo(() => {\n    return options.map((option) => {\n      return withTooltip(option.label, \"div\", tooltipPosition, false);\n    });\n  }, [options, tooltipPosition]);\n\n  const tabs = options.map((option, index) => {\n    const selected = selectedIndex === index;\n    const tooltipWrapper = tooltipWrappers[index];\n\n    return (\n      <HvVerticalScrollListItem\n        id={setId(elementId, `item-${index}`)}\n        onClick={(event) => {\n          handleSelection(event, option.value, index);\n          onClick?.(event, index);\n        }}\n        onKeyDown={(event) => {\n          if (isKeypress(event, Enter) === true) {\n            handleSelection(event, option.value, index);\n            onEnter?.(event, index);\n          }\n        }}\n        tooltipWrapper={tooltipWrapper}\n        selected={selected}\n        key={option.key || option.label}\n        aria-label={option.label}\n      />\n    );\n  });\n\n  const dynamicClasses = generateDynamicStyles(options.length);\n\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <ol\n          className={clsx(\n            className,\n            classes?.root,\n            scrollToVerticalClasses.root,\n            css(styles.root),\n            css({\n              backgroundColor: fade(\n                activeTheme?.colors.modes[selectedMode].atmo2,\n                activeTheme?.scrollTo.backgroundColorOpacity\n              ),\n            }),\n            position === \"fixed\" &&\n              clsx(\n                classes?.positionFixed,\n                scrollToVerticalClasses.positionFixed,\n                css(dynamicClasses.positionFixed)\n              ),\n            position === \"absolute\" &&\n              clsx(\n                classes?.positionAbsolute,\n                scrollToVerticalClasses.positionAbsolute,\n                css(dynamicClasses.positionAbsolute)\n              )\n          )}\n          id={elementId}\n          {...others}\n        >\n          {tabs}\n        </ol>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["Enter","keyboardCodes","HvScrollToVertical","id","defaultSelectedIndex","scrollElementId","href","onChange","onClick","onEnter","className","classes","options","offset","position","tooltipPosition","others","activeTheme","selectedMode","useTheme","elementId","useUniqueId","selectedIndex","setScrollTo","useScrollTo","handleSelection","event","value","index","preventDefault","wrappedOnChange","tooltipWrappers","useMemo","map","option","withTooltip","label","tabs","selected","tooltipWrapper","HvVerticalScrollListItem","setId","onKeyDown","isKeypress","key","dynamicClasses","generateDynamicStyles","length","ClassNames","children","css","clsx","root","scrollToVerticalClasses","styles","backgroundColor","fade","colors","modes","atmo2","scrollTo","backgroundColorOpacity","positionFixed","positionAbsolute"],"mappings":";;;;;;;;;;;;;;;;;AAgBA,MAAM;AAAA,EAAEA;AAAM,IAAIC;AAwDX,MAAMC,qBAAqBA,CAAC;AAAA,EACjCC;AAAAA,EACAC,uBAAuB;AAAA,EACvBC;AAAAA,EACAC,OAAO;AAAA,EACPC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,SAAS;AAAA,EACTC,WAAW;AAAA,EACXC,kBAAkB;AAAA,EAClB,GAAGC;AACoB,MAAM;AACvB,QAAA;AAAA,IAAEC;AAAAA,IAAaC;AAAAA,MAAiBC,SAAU,SAAA;AAE1CC,QAAAA,YAAYC,YAAAA,QAAYlB,IAAI,oBAAoB;AAEhD,QAAA,CAACmB,eAAeC,WAAW,IAAIC,wBACnCpB,sBACAC,iBACAC,MACAO,QACAD,SACAL,QAAQ;AAGV,QAAMkB,kBAAkBA,CACtBC,OAGAC,OACAC,UACG;AACHF,UAAMG,eAAgB;AAEtB,UAAMC,kBAAkBA,MAAM;AAC5BvB,2CAAWmB,OAAOE;AAAAA,IAAK;AAGbF,gBAAAA,OAAOC,OAAOC,OAAOE,eAAe;AAAA,EAAA;AAG5CC,QAAAA,kBAAkBC,MAAAA,QAAQ,MAAM;AAC7BpB,WAAAA,QAAQqB,IAAKC,CAAW,WAAA;AAC7B,aAAOC,YAAAA,YAAYD,OAAOE,OAAO,OAAOrB,iBAAiB,KAAK;AAAA,IAAA,CAC/D;AAAA,EAAA,GACA,CAACH,SAASG,eAAe,CAAC;AAE7B,QAAMsB,OAAOzB,QAAQqB,IAAI,CAACC,QAAQN,UAAU;AAC1C,UAAMU,WAAWhB,kBAAkBM;AAC7BW,UAAAA,iBAAiBR,gBAAgBH,KAAK;AAE5C,0CACGY,uBAAAA,0BAAwB;AAAA,MACvBrC,IAAIsC,MAAAA,MAAMrB,WAAY,QAAOQ,OAAO;AAAA,MACpCpB,SAAUkB,CAAU,UAAA;AACFA,wBAAAA,OAAOQ,OAAOP,OAAOC,KAAK;AAC1CpB,2CAAUkB,OAAOE;AAAAA,MACnB;AAAA,MACAc,WAAYhB,CAAU,UAAA;AACpB,YAAIiB,oBAAWjB,OAAO1B,KAAK,MAAM,MAAM;AACrB0B,0BAAAA,OAAOQ,OAAOP,OAAOC,KAAK;AAC1CnB,6CAAUiB,OAAOE;AAAAA,QACnB;AAAA,MACF;AAAA,MACAW;AAAAA,MACAD;AAAAA,MAEA,cAAYJ,OAAOE;AAAAA,IADdF,GAAAA,OAAOU,OAAOV,OAAOE,KAAK;AAAA,EAAA,CAIpC;AAEKS,QAAAA,iBAAiBC,wBAAAA,sBAAsBlC,QAAQmC,MAAM;AAE3D,wCACGC,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,IAAAA,qCACF,MAAA;AAAA,MACExC,WAAWyC,KACTzC,KAAAA,WACAC,mCAASyC,MACTC,wBAAAA,QAAwBD,MACxBF,IAAII,wBAAAA,OAAOF,IAAI,GACfF,IAAI;AAAA,QACFK,iBAAiBC,UACfvC,QAAAA,2CAAawC,OAAOC,MAAMxC,cAAcyC,OACxC1C,2CAAa2C,SAASC,sBAAsB;AAAA,MAE/C,CAAA,GACD/C,aAAa,WACXqC,KAAAA,KACExC,mCAASmD,eACTT,wBAAAA,QAAwBS,eACxBZ,IAAIL,eAAeiB,aAAa,CAAC,GAErChD,aAAa,cACXqC,UACExC,mCAASoD,kBACTV,gCAAwBU,kBACxBb,IAAIL,eAAekB,gBAAgB,CAAC,CACrC;AAAA,MAEL5D,IAAIiB;AAAAA,MAAU,GACVJ;AAAAA,MAAMiC,UAETZ;AAAAA,IAAAA,CAAI;AAAA,EAAA,CAGE;AAEjB;;"}

package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.styles.cjs

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const styles = {
+  root: {
+    display: "flex",
+    width: "32px",
+    padding: "0",
+    margin: 0,
+    listStyleType: "none",
+    flexWrap: "wrap",
+    flexDirection: "column",
+    backdropFilter: `blur(${uikitStyles.theme.scrollTo.backgroundColorBlur})`
+  }
+};
+const calculateOffset = (quantityOfOptions) => {
+  const itemSize = 32;
+  const halfOptions = Math.round(quantityOfOptions * 0.5);
+  return halfOptions * itemSize;
+};
+const generateDynamicStyles = (quantityOfOptions) => {
+  const positionOffset = calculateOffset(quantityOfOptions);
+  const generatedStyles = {
+    positionAbsolute: {
+      width: "32px",
+      position: "absolute",
+      zIndex: `calc(${uikitStyles.theme.zIndices.banner} - 2)`,
+      right: "0",
+      top: `calc(50% - ${positionOffset}px)`
+    },
+    positionFixed: {
+      width: "32px",
+      position: "fixed",
+      zIndex: `calc(${uikitStyles.theme.zIndices.banner} - 2)`,
+      right: "0",
+      top: `calc(50% - ${positionOffset}px)`
+    }
+  };
+  return generatedStyles;
+};
+exports.generateDynamicStyles = generateDynamicStyles;
+exports.styles = styles;
+//# sourceMappingURL=ScrollToVertical.styles.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/ScrollToVertical.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScrollToVertical.styles.cjs","sources":["../../../../../src/components/ScrollTo/Vertical/ScrollToVertical.styles.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\n\nexport const styles: {\n  root: CSSInterpolation;\n} = {\n  root: {\n    display: \"flex\",\n    width: \"32px\",\n    padding: \"0\",\n    margin: 0,\n    listStyleType: \"none\",\n    flexWrap: \"wrap\",\n    flexDirection: \"column\",\n    backdropFilter: `blur(${theme.scrollTo.backgroundColorBlur})`,\n  },\n};\n\nconst calculateOffset = (quantityOfOptions: number) => {\n  const itemSize = 32;\n  const halfOptions = Math.round(quantityOfOptions * 0.5);\n\n  return halfOptions * itemSize;\n};\n\nexport const generateDynamicStyles = (quantityOfOptions: number) => {\n  const positionOffset = calculateOffset(quantityOfOptions);\n\n  const generatedStyles: {\n    positionAbsolute: CSSInterpolation;\n    positionFixed: CSSInterpolation;\n  } = {\n    positionAbsolute: {\n      width: \"32px\",\n      position: \"absolute\",\n      zIndex: `calc(${theme.zIndices.banner} - 2)`,\n      right: \"0\",\n      top: `calc(50% - ${positionOffset}px)`,\n    },\n    positionFixed: {\n      width: \"32px\",\n      position: \"fixed\",\n      zIndex: `calc(${theme.zIndices.banner} - 2)`,\n      right: \"0\",\n      top: `calc(50% - ${positionOffset}px)`,\n    },\n  };\n\n  return generatedStyles;\n};\n"],"names":["styles","root","display","width","padding","margin","listStyleType","flexWrap","flexDirection","backdropFilter","theme","scrollTo","backgroundColorBlur","calculateOffset","quantityOfOptions","itemSize","halfOptions","Math","round","generateDynamicStyles","positionOffset","generatedStyles","positionAbsolute","position","zIndex","zIndices","banner","right","top","positionFixed"],"mappings":";;;AAGO,MAAMA,SAET;AAAA,EACFC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,eAAe;AAAA,IACfC,UAAU;AAAA,IACVC,eAAe;AAAA,IACfC,gBAAiB,QAAOC,YAAAA,MAAMC,SAASC;AAAAA,EACzC;AACF;AAEA,MAAMC,kBAAkBA,CAACC,sBAA8B;AACrD,QAAMC,WAAW;AACjB,QAAMC,cAAcC,KAAKC,MAAMJ,oBAAoB,GAAG;AAEtD,SAAOE,cAAcD;AACvB;AAEaI,MAAAA,wBAAwBA,CAACL,sBAA8B;AAC5DM,QAAAA,iBAAiBP,gBAAgBC,iBAAiB;AAExD,QAAMO,kBAGF;AAAA,IACFC,kBAAkB;AAAA,MAChBnB,OAAO;AAAA,MACPoB,UAAU;AAAA,MACVC,QAAS,QAAOd,YAAAA,MAAMe,SAASC;AAAAA,MAC/BC,OAAO;AAAA,MACPC,KAAM,cAAaR;AAAAA,IACrB;AAAA,IACAS,eAAe;AAAA,MACb1B,OAAO;AAAA,MACPoB,UAAU;AAAA,MACVC,QAAS,QAAOd,YAAAA,MAAMe,SAASC;AAAAA,MAC/BC,OAAO;AAAA,MACPC,KAAM,cAAaR;AAAAA,IACrB;AAAA,EAAA;AAGKC,SAAAA;AACT;;;"}

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.cjs

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const verticalScrollListItemClasses = require("./verticalScrollListItemClasses.cjs");
+const react = require("@emotion/react");
+const clsx = require("clsx");
+const VerticalScrollListItem_styles = require("./VerticalScrollListItem.styles.cjs");
+const React = require("react");
+const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useTheme = require("../../../../hooks/useTheme.cjs");
+const setId = require("../../../../utils/setId.cjs");
+const HvVerticalScrollListItem = ({
+  id,
+  className,
+  classes,
+  selected,
+  "aria-label": ariaLabel,
+  onClick,
+  onKeyDown,
+  tooltipWrapper,
+  ...others
+}) => {
+  const {
+    activeTheme
+  } = useTheme.useTheme();
+  const variant = selected ? "label" : "body";
+  const labelId = setId.setId(id, "label");
+  const buttonId = setId.setId(id, "button");
+  const Tooltip = tooltipWrapper;
+  const NotSelected = React.useCallback(() => {
+    return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+      children: ({
+        css
+      }) => /* @__PURE__ */ jsxRuntime.jsx("div", {
+        className: clsx.clsx(classes == null ? void 0 : classes.notSelected, verticalScrollListItemClasses.default.notSelected, css(VerticalScrollListItem_styles.styles.notSelected))
+      })
+    });
+  }, [classes == null ? void 0 : classes.notSelected]);
+  const icon = selected ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.CurrentStep, {
+    height: activeTheme == null ? void 0 : activeTheme.scrollTo.dotSelectedSize,
+    width: activeTheme == null ? void 0 : activeTheme.scrollTo.dotSelectedSize
+  }) : /* @__PURE__ */ jsxRuntime.jsx(NotSelected, {});
+  return /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+    children: ({
+      css
+    }) => /* @__PURE__ */ jsxRuntime.jsx("li", {
+      id,
+      className: clsx.clsx(className, classes == null ? void 0 : classes.root, verticalScrollListItemClasses.default.root, css(VerticalScrollListItem_styles.styles.root)),
+      "aria-current": selected,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        id: buttonId,
+        role: "button",
+        tabIndex: 0,
+        onClick,
+        onKeyDown,
+        className: clsx.clsx(classes == null ? void 0 : classes.button, verticalScrollListItemClasses.default.button, css(VerticalScrollListItem_styles.styles.button)),
+        "aria-label": ariaLabel,
+        "aria-labelledby": labelId,
+        ...others,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, {
+          id: labelId,
+          className: clsx.clsx(classes == null ? void 0 : classes.text, verticalScrollListItemClasses.default.text, css(VerticalScrollListItem_styles.styles.text)),
+          variant,
+          children: icon
+        })
+      })
+    })
+  });
+};
+exports.HvVerticalScrollListItem = HvVerticalScrollListItem;
+//# sourceMappingURL=VerticalScrollListItem.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalScrollListItem.cjs","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.tsx"],"sourcesContent":["import { HvBaseProps } from \"@core/types\";\nimport verticalScrollListItemClasses, {\n  HvVerticalScrollListItemClasses,\n} from \"./verticalScrollListItemClasses\";\nimport { ClassNames } from \"@emotion/react\";\nimport { clsx } from \"clsx\";\nimport { styles } from \"./VerticalScrollListItem.styles\";\nimport { HvTypographyProps } from \"@core/components\";\nimport { setId } from \"@core/utils\";\nimport { useCallback } from \"react\";\nimport { CurrentStep } from \"@hitachivantara/uikit-react-icons\";\nimport { useTheme } from \"@core/hooks\";\n\nexport interface HvVerticalScrollListItemProps extends HvBaseProps {\n  /** A function component that renders a typography wrapped with a tooltip. */\n  tooltipWrapper: React.FunctionComponent<{\n    id?: string;\n    className?: string;\n    variant?: HvTypographyProps[\"variant\"];\n    children?: React.ReactNode;\n  }>;\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvVerticalScrollListItemClasses;\n  /** Whether the element is selected. */\n  selected?: boolean;\n  /** The function to be executed when the element is clicked. */\n  onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;\n  /** The function to be executed when the element is clicked. */\n  onKeyDown?: (event: React.KeyboardEvent<HTMLDivElement>) => void;\n}\n\n/**\n * HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll\n */\nexport const HvVerticalScrollListItem = ({\n  id,\n  className,\n  classes,\n  selected,\n  \"aria-label\": ariaLabel,\n  onClick,\n  onKeyDown,\n  tooltipWrapper,\n  ...others\n}: HvVerticalScrollListItemProps) => {\n  const { activeTheme } = useTheme();\n\n  const variant: HvTypographyProps[\"variant\"] = selected ? \"label\" : \"body\";\n\n  const labelId = setId(id, \"label\");\n\n  const buttonId = setId(id, \"button\");\n\n  const Tooltip = tooltipWrapper;\n\n  const NotSelected = useCallback(() => {\n    return (\n      <ClassNames>\n        {({ css }) => (\n          <div\n            className={clsx(\n              classes?.notSelected,\n              verticalScrollListItemClasses.notSelected,\n              css(styles.notSelected)\n            )}\n          />\n        )}\n      </ClassNames>\n    );\n  }, [classes?.notSelected]);\n\n  const icon = selected ? (\n    <CurrentStep\n      height={activeTheme?.scrollTo.dotSelectedSize}\n      width={activeTheme?.scrollTo.dotSelectedSize}\n    />\n  ) : (\n    <NotSelected />\n  );\n\n  return (\n    <ClassNames>\n      {({ css }) => (\n        <li\n          id={id}\n          className={clsx(\n            className,\n            classes?.root,\n            verticalScrollListItemClasses.root,\n            css(styles.root)\n          )}\n          aria-current={selected}\n        >\n          <div\n            id={buttonId}\n            role=\"button\"\n            tabIndex={0}\n            onClick={onClick}\n            onKeyDown={onKeyDown}\n            className={clsx(\n              classes?.button,\n              verticalScrollListItemClasses.button,\n              css(styles.button)\n            )}\n            aria-label={ariaLabel}\n            aria-labelledby={labelId}\n            {...others}\n          >\n            <Tooltip\n              id={labelId}\n              className={clsx(\n                classes?.text,\n                verticalScrollListItemClasses.text,\n                css(styles.text)\n              )}\n              variant={variant}\n            >\n              {icon}\n            </Tooltip>\n          </div>\n        </li>\n      )}\n    </ClassNames>\n  );\n};\n"],"names":["HvVerticalScrollListItem","id","className","classes","selected","ariaLabel","onClick","onKeyDown","tooltipWrapper","others","activeTheme","useTheme","variant","labelId","setId","buttonId","Tooltip","NotSelected","useCallback","ClassNames","children","css","clsx","notSelected","verticalScrollListItemClasses","styles","icon","_jsx","CurrentStep","height","scrollTo","dotSelectedSize","width","root","role","tabIndex","button","text"],"mappings":";;;;;;;;;;;AAkCO,MAAMA,2BAA2BA,CAAC;AAAA,EACvCC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,cAAcC;AAAAA,EACdC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AAC0B,MAAM;AAC7B,QAAA;AAAA,IAAEC;AAAAA,MAAgBC,SAAU,SAAA;AAE5BC,QAAAA,UAAwCR,WAAW,UAAU;AAE7DS,QAAAA,UAAUC,MAAAA,MAAMb,IAAI,OAAO;AAE3Bc,QAAAA,WAAWD,MAAAA,MAAMb,IAAI,QAAQ;AAEnC,QAAMe,UAAUR;AAEVS,QAAAA,cAAcC,MAAAA,YAAY,MAAM;AACpC,0CACGC,MAAAA,YAAU;AAAA,MAAAC,UACRA,CAAC;AAAA,QAAEC;AAAAA,MAAAA,qCACF,OAAA;AAAA,QACEnB,WAAWoB,KAAAA,KACTnB,mCAASoB,aACTC,8BAAAA,QAA8BD,aAC9BF,IAAII,qCAAOF,WAAW,CAAC;AAAA,MAAA,CACvB;AAAA,IAAA,CAGK;AAAA,EAAA,GAEd,CAACpB,mCAASoB,WAAW,CAAC;AAEnBG,QAAAA,OAAOtB,WACXuB,2BAAAA,IAACC,6BAAW;AAAA,IACVC,QAAQnB,2CAAaoB,SAASC;AAAAA,IAC9BC,OAAOtB,2CAAaoB,SAASC;AAAAA,EAAgB,CAAA,IAG9Cd,2BAAAA,IAAAA,aACF,CAAA,CAAA;AAED,wCACGE,MAAAA,YAAU;AAAA,IAAAC,UACRA,CAAC;AAAA,MAAEC;AAAAA,IAAAA,qCACF,MAAA;AAAA,MACEpB;AAAAA,MACAC,WAAWoB,KACTpB,KAAAA,WACAC,mCAAS8B,MACTT,sCAA8BS,MAC9BZ,IAAII,qCAAOQ,IAAI,CAAC;AAAA,MAElB,gBAAc7B;AAAAA,MAASgB,yCAEvB,OAAA;AAAA,QACEnB,IAAIc;AAAAA,QACJmB,MAAK;AAAA,QACLC,UAAU;AAAA,QACV7B;AAAAA,QACAC;AAAAA,QACAL,WAAWoB,KAAAA,KACTnB,mCAASiC,QACTZ,8BAAAA,QAA8BY,QAC9Bf,IAAII,qCAAOW,MAAM,CAAC;AAAA,QAEpB,cAAY/B;AAAAA,QACZ,mBAAiBQ;AAAAA,QAAQ,GACrBJ;AAAAA,QAAMW,yCAETJ,SAAO;AAAA,UACNf,IAAIY;AAAAA,UACJX,WAAWoB,KAAAA,KACTnB,mCAASkC,MACTb,8BAAAA,QAA8Ba,MAC9BhB,IAAII,qCAAOY,IAAI,CAAC;AAAA,UAElBzB;AAAAA,UAAiBQ,UAEhBM;AAAAA,QAAAA,CAAI;AAAA,MAAA,CACG;AAAA,IAAA,CACN;AAAA,EAAA,CAGC;AAEjB;;"}

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.cjs

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitStyles = require("@hitachivantara/uikit-styles");
+const verticalScrollListItemClasses = require("./verticalScrollListItemClasses.cjs");
+const focusUtils = require("../../../../utils/focusUtils.cjs");
+const styles = {
+  root: {
+    padding: "0",
+    height: "32px",
+    width: "32px",
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  notSelected: {
+    height: uikitStyles.theme.scrollTo.dotNotSelectedSize,
+    width: uikitStyles.theme.scrollTo.dotNotSelectedSize,
+    borderRadius: "50%",
+    display: "inline-block",
+    backgroundColor: uikitStyles.theme.scrollTo.dotNotSelectedColor
+  },
+  text: {
+    height: uikitStyles.theme.scrollTo.dotRootSize,
+    width: uikitStyles.theme.scrollTo.dotRootSize,
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center"
+  },
+  button: {
+    display: "flex",
+    justifyContent: "center",
+    alignItems: "center",
+    height: uikitStyles.theme.scrollTo.dotRootSize,
+    width: uikitStyles.theme.scrollTo.dotRootSize,
+    borderRadius: uikitStyles.theme.scrollTo.dotRootRadius,
+    cursor: "pointer",
+    "&:hover": {
+      backgroundColor: uikitStyles.theme.scrollTo.dotHoverBackgroundColor,
+      [`& .${verticalScrollListItemClasses.default.notSelected}`]: {
+        height: uikitStyles.theme.scrollTo.dotHoverSize,
+        width: uikitStyles.theme.scrollTo.dotHoverSize,
+        backgroundColor: uikitStyles.theme.scrollTo.dotHoverColor
+      }
+    },
+    "&:focus": {
+      outline: "none"
+    },
+    "&:focus-visible": {
+      ...focusUtils.outlineStyles
+    }
+  }
+};
+exports.styles = styles;
+//# sourceMappingURL=VerticalScrollListItem.styles.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"VerticalScrollListItem.styles.cjs","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.ts"],"sourcesContent":["import { outlineStyles } from \"@core/utils\";\nimport { CSSInterpolation } from \"@emotion/serialize\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport verticalScrollListItemClasses from \"./verticalScrollListItemClasses\";\n\nexport const styles: {\n  root: CSSInterpolation;\n  button: CSSInterpolation;\n  notSelected: CSSInterpolation;\n  text: CSSInterpolation;\n} = {\n  root: {\n    padding: \"0\",\n    height: \"32px\",\n    width: \"32px\",\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  notSelected: {\n    height: theme.scrollTo.dotNotSelectedSize,\n    width: theme.scrollTo.dotNotSelectedSize,\n    borderRadius: \"50%\",\n    display: \"inline-block\",\n    backgroundColor: theme.scrollTo.dotNotSelectedColor,\n  },\n  text: {\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n  },\n  button: {\n    display: \"flex\",\n    justifyContent: \"center\",\n    alignItems: \"center\",\n    height: theme.scrollTo.dotRootSize,\n    width: theme.scrollTo.dotRootSize,\n    borderRadius: theme.scrollTo.dotRootRadius,\n    cursor: \"pointer\",\n    \"&:hover\": {\n      backgroundColor: theme.scrollTo.dotHoverBackgroundColor,\n\n      [`& .${verticalScrollListItemClasses.notSelected}`]: {\n        height: theme.scrollTo.dotHoverSize,\n        width: theme.scrollTo.dotHoverSize,\n        backgroundColor: theme.scrollTo.dotHoverColor,\n      },\n    },\n    \"&:focus\": {\n      outline: \"none\",\n    },\n    \"&:focus-visible\": {\n      ...outlineStyles,\n    },\n  },\n};\n"],"names":["styles","root","padding","height","width","display","justifyContent","alignItems","notSelected","theme","scrollTo","dotNotSelectedSize","borderRadius","backgroundColor","dotNotSelectedColor","text","dotRootSize","button","dotRootRadius","cursor","dotHoverBackgroundColor","verticalScrollListItemClasses","dotHoverSize","dotHoverColor","outline","outlineStyles"],"mappings":";;;;;AAKO,MAAMA,SAKT;AAAA,EACFC,MAAM;AAAA,IACJC,SAAS;AAAA,IACTC,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAC,aAAa;AAAA,IACXL,QAAQM,YAAAA,MAAMC,SAASC;AAAAA,IACvBP,OAAOK,YAAAA,MAAMC,SAASC;AAAAA,IACtBC,cAAc;AAAA,IACdP,SAAS;AAAA,IACTQ,iBAAiBJ,YAAAA,MAAMC,SAASI;AAAAA,EAClC;AAAA,EACAC,MAAM;AAAA,IACJZ,QAAQM,YAAAA,MAAMC,SAASM;AAAAA,IACvBZ,OAAOK,YAAAA,MAAMC,SAASM;AAAAA,IACtBX,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,EACd;AAAA,EACAU,QAAQ;AAAA,IACNZ,SAAS;AAAA,IACTC,gBAAgB;AAAA,IAChBC,YAAY;AAAA,IACZJ,QAAQM,YAAAA,MAAMC,SAASM;AAAAA,IACvBZ,OAAOK,YAAAA,MAAMC,SAASM;AAAAA,IACtBJ,cAAcH,YAAAA,MAAMC,SAASQ;AAAAA,IAC7BC,QAAQ;AAAA,IACR,WAAW;AAAA,MACTN,iBAAiBJ,YAAAA,MAAMC,SAASU;AAAAA,MAEhC,CAAE,MAAKC,sCAA8Bb,aAAa,GAAG;AAAA,QACnDL,QAAQM,YAAAA,MAAMC,SAASY;AAAAA,QACvBlB,OAAOK,YAAAA,MAAMC,SAASY;AAAAA,QACtBT,iBAAiBJ,YAAAA,MAAMC,SAASa;AAAAA,MAClC;AAAA,IACF;AAAA,IACA,WAAW;AAAA,MACTC,SAAS;AAAA,IACX;AAAA,IACA,mBAAmB;AAAA,MACjB,GAAGC,WAAAA;AAAAA,IACL;AAAA,EACF;AACF;;"}

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../../utils/classes.cjs");
+const classKeys = ["root", "notSelected", "button", "text"];
+const verticalScrollListItemClasses = classes.getClasses(classKeys, "HvVerticalScrollListItem");
+const verticalScrollListItemClasses$1 = verticalScrollListItemClasses;
+exports.default = verticalScrollListItemClasses$1;
+//# sourceMappingURL=verticalScrollListItemClasses.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"verticalScrollListItemClasses.cjs","sources":["../../../../../../src/components/ScrollTo/Vertical/VerticalScrollListItem/verticalScrollListItemClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvVerticalScrollListItemClasses {\n  root?: string;\n  notSelected?: string;\n  button?: string;\n  text?: string;\n}\n\nconst classKeys: string[] = [\"root\", \"notSelected\", \"button\", \"text\"];\n\nconst verticalScrollListItemClasses =\n  getClasses<HvVerticalScrollListItemClasses>(\n    classKeys,\n    \"HvVerticalScrollListItem\"\n  );\n\nexport default verticalScrollListItemClasses;\n"],"names":["classKeys","verticalScrollListItemClasses","getClasses"],"mappings":";;;AASA,MAAMA,YAAsB,CAAC,QAAQ,eAAe,UAAU,MAAM;AAEpE,MAAMC,gCACJC,QACEF,WAAAA,WACA,0BAA0B;AAG9B,MAAA,kCAAeC;;"}

package/dist/cjs/components/ScrollTo/Vertical/scrollToVerticalClasses.cjs

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const classes = require("../../../utils/classes.cjs");
+const classKeys = ["root", "positionAbsolute", "positionFixed"];
+const scrollToVerticalClasses = classes.getClasses(classKeys, "HvScrollToVertical");
+const scrollToVerticalClasses$1 = scrollToVerticalClasses;
+exports.default = scrollToVerticalClasses$1;
+//# sourceMappingURL=scrollToVerticalClasses.cjs.map

package/dist/cjs/components/ScrollTo/Vertical/scrollToVerticalClasses.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollToVerticalClasses.cjs","sources":["../../../../../src/components/ScrollTo/Vertical/scrollToVerticalClasses.ts"],"sourcesContent":["import { getClasses } from \"@core/utils\";\n\nexport interface HvScrollToVerticalClasses {\n  root?: string;\n  positionAbsolute?: string;\n  positionFixed?: string;\n}\n\nconst classKeys: string[] = [\"root\", \"positionAbsolute\", \"positionFixed\"];\n\nconst scrollToVerticalClasses = getClasses<HvScrollToVerticalClasses>(\n  classKeys,\n  \"HvScrollToVertical\"\n);\n\nexport default scrollToVerticalClasses;\n"],"names":["classKeys","scrollToVerticalClasses","getClasses"],"mappings":";;;AAQA,MAAMA,YAAsB,CAAC,QAAQ,oBAAoB,eAAe;AAExE,MAAMC,0BAA0BC,QAC9BF,WAAAA,WACA,oBAAoB;AAGtB,MAAA,4BAAeC;;"}