@hitachivantara/uikit-react-core 6.8.1 → 6.9.0

package/dist/ScrollToHorizontal/ScrollToHorizontal.styles.js

@@ -1,33 +1,29 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses(
-  "HvScrollToHorizontal",
-  {
-    root: {
-      display: "flex",
-      padding: "0 30px",
-      listStyleType: "none",
-      flexWrap: "wrap",
-      backdropFilter: `blur(4px)`,
-      backgroundColor: theme.alpha("bgPage", 0.9)
-    },
-    positionSticky: {
-      position: "sticky",
-      zIndex: `calc(${theme.zIndices.banner} - 2)`,
-      top: 0,
-      left: 0
-    },
-    positionFixed: {
-      position: "fixed",
-      zIndex: `calc(${theme.zIndices.banner} - 2)`,
-      top: 0,
-      left: 0
-    },
-    item: {},
-    itemSelected: {}
-  }
-);
-export {
-  staticClasses,
-  useClasses
-};
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/ScrollToHorizontal/ScrollToHorizontal.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvScrollToHorizontal", {
+	root: {
+		display: "flex",
+		padding: "0 30px",
+		listStyleType: "none",
+		flexWrap: "wrap",
+		backdropFilter: `blur(4px)`,
+		backgroundColor: theme.alpha("bgPage", .9)
+	},
+	positionSticky: {
+		position: "sticky",
+		zIndex: `calc(${theme.zIndices.banner} - 2)`,
+		top: 0,
+		left: 0
+	},
+	positionFixed: {
+		position: "fixed",
+		zIndex: `calc(${theme.zIndices.banner} - 2)`,
+		top: 0,
+		left: 0
+	},
+	item: {},
+	itemSelected: {}
+});
+//#endregion
+export { staticClasses, useClasses };

package/dist/ScrollToVertical/ScrollToVertical.js

@@ -1,80 +1,48 @@
-import { jsx } from "react/jsx-runtime";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useScrollTo } from "../hooks/useScrollTo.js";
 import { isKey } from "../utils/keyboardUtils.js";
-import { useClasses, calculateOffset } from "./ScrollToVertical.styles.js";
-import { staticClasses } from "./ScrollToVertical.styles.js";
+import { useScrollTo } from "../hooks/useScrollTo.js";
+import { calculateOffset, useClasses } from "./ScrollToVertical.styles.js";
 import { HvVerticalScrollListItem } from "./VerticalScrollListItem/VerticalScrollListItem.js";
-const HvScrollToVertical = (props) => {
-  const {
-    id,
-    defaultSelectedIndex = 0,
-    scrollElementId,
-    navigationMode = "push",
-    relativeLinks = false,
-    onChange,
-    onClick,
-    onEnter,
-    className,
-    classes: classesProp,
-    options,
-    offset = 0,
-    position = "relative",
-    tooltipPosition = "left",
-    style,
-    ...others
-  } = useDefaultProps("HvScrollToVertical", props);
-  const { classes, cx } = useClasses(classesProp);
-  const [selectedIndex, setScrollTo, elements] = useScrollTo(
-    defaultSelectedIndex,
-    scrollElementId,
-    navigationMode,
-    relativeLinks,
-    offset,
-    options,
-    onChange
-  );
-  const tabs = elements.map((option, index) => /* @__PURE__ */ jsx(
-    HvVerticalScrollListItem,
-    {
-      onClick: (event) => {
-        event.preventDefault();
-        setScrollTo(event, option.value, index, () => onChange?.(event, index));
-        onClick?.(event, index);
-      },
-      onKeyDown: (event) => {
-        if (isKey(event, "Enter") !== true) return;
-        event.preventDefault();
-        setScrollTo(event, option.value, index, () => onChange?.(event, index));
-        onEnter?.(event, index);
-      },
-      href: navigationMode !== "none" ? option.href : void 0,
-      tooltipPlacement: tooltipPosition,
-      selected: selectedIndex === index,
-      label: option.label
-    },
-    option.key || option.label
-  ));
-  const positionOffset = calculateOffset(options.length);
-  return /* @__PURE__ */ jsx(
-    "ol",
-    {
-      className: cx(
-        classes.root,
-        {
-          [classes.positionFixed]: position === "fixed",
-          [classes.positionAbsolute]: position === "absolute"
-        },
-        className
-      ),
-      style: { top: `calc(50% - ${positionOffset}px)`, ...style },
-      id,
-      ...others,
-      children: tabs
-    }
-  );
-};
-export {
-  HvScrollToVertical,
-  staticClasses as scrollToVerticalClasses
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { jsx } from "react/jsx-runtime";
+//#region src/ScrollToVertical/ScrollToVertical.tsx
+/**
+* The vertical scroll to element can be used to quickly navigate in a page.
+*/
+var HvScrollToVertical = (props) => {
+	const { id, defaultSelectedIndex = 0, scrollElementId, navigationMode = "push", relativeLinks = false, onChange, onClick, onEnter, className, classes: classesProp, options, offset = 0, position = "relative", tooltipPosition = "left", style, ...others } = useDefaultProps("HvScrollToVertical", props);
+	const { classes, cx } = useClasses(classesProp);
+	const [selectedIndex, setScrollTo, elements] = useScrollTo(defaultSelectedIndex, scrollElementId, navigationMode, relativeLinks, offset, options, onChange);
+	const tabs = elements.map((option, index) => /* @__PURE__ */ jsx(HvVerticalScrollListItem, {
+		onClick: (event) => {
+			event.preventDefault();
+			setScrollTo(event, option.value, index, () => onChange?.(event, index));
+			onClick?.(event, index);
+		},
+		onKeyDown: (event) => {
+			if (isKey(event, "Enter") !== true) return;
+			event.preventDefault();
+			setScrollTo(event, option.value, index, () => onChange?.(event, index));
+			onEnter?.(event, index);
+		},
+		href: navigationMode !== "none" ? option.href : void 0,
+		tooltipPlacement: tooltipPosition,
+		selected: selectedIndex === index,
+		label: option.label
+	}, option.key || option.label));
+	const positionOffset = calculateOffset(options.length);
+	return /* @__PURE__ */ jsx("ol", {
+		className: cx(classes.root, {
+			[classes.positionFixed]: position === "fixed",
+			[classes.positionAbsolute]: position === "absolute"
+		}, className),
+		style: {
+			top: `calc(50% - ${positionOffset}px)`,
+			...style
+		},
+		id,
+		...others,
+		children: tabs
+	});
 };
+//#endregion
+export { HvScrollToVertical };

package/dist/ScrollToVertical/ScrollToVertical.styles.js

@@ -1,40 +1,33 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses(
-  "HvScrollToVertical",
-  {
-    root: {
-      display: "flex",
-      width: "32px",
-      padding: "0",
-      margin: 0,
-      listStyleType: "none",
-      flexWrap: "wrap",
-      flexDirection: "column",
-      backdropFilter: `blur(4px)`,
-      backgroundColor: theme.alpha("bgPage", 0.9)
-    },
-    positionAbsolute: {
-      width: "32px",
-      position: "absolute",
-      zIndex: `calc(${theme.zIndices.banner} - 2)`,
-      right: "0"
-    },
-    positionFixed: {
-      width: "32px",
-      position: "fixed",
-      zIndex: `calc(${theme.zIndices.banner} - 2)`,
-      right: "0"
-    }
-  }
-);
-const calculateOffset = (quantityOfOptions) => {
-  const itemSize = 32;
-  const halfOptions = Math.round(quantityOfOptions * 0.5);
-  return halfOptions * itemSize;
-};
-export {
-  calculateOffset,
-  staticClasses,
-  useClasses
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/ScrollToVertical/ScrollToVertical.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvScrollToVertical", {
+	root: {
+		display: "flex",
+		width: "32px",
+		padding: "0",
+		margin: 0,
+		listStyleType: "none",
+		flexWrap: "wrap",
+		flexDirection: "column",
+		backdropFilter: `blur(4px)`,
+		backgroundColor: theme.alpha("bgPage", .9)
+	},
+	positionAbsolute: {
+		width: "32px",
+		position: "absolute",
+		zIndex: `calc(${theme.zIndices.banner} - 2)`,
+		right: "0"
+	},
+	positionFixed: {
+		width: "32px",
+		position: "fixed",
+		zIndex: `calc(${theme.zIndices.banner} - 2)`,
+		right: "0"
+	}
+});
+var calculateOffset = (quantityOfOptions) => {
+	return Math.round(quantityOfOptions * .5) * 32;
 };
+//#endregion
+export { calculateOffset, staticClasses, useClasses };

package/dist/ScrollToVertical/VerticalScrollListItem/VerticalScrollListItem.js

@@ -1,41 +1,32 @@
-import { jsx } from "react/jsx-runtime";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useClasses } from "./VerticalScrollListItem.styles.js";
-import { staticClasses } from "./VerticalScrollListItem.styles.js";
 import { HvTooltip } from "../../Tooltip/Tooltip.js";
-const HvVerticalScrollListItem = (props) => {
-  const {
-    id,
-    className,
-    classes: classesProp,
-    selected,
-    label,
-    tooltipPlacement = "left",
-    href,
-    ...others
-  } = useDefaultProps("HvVerticalScrollListItem", props);
-  const { classes, cx } = useClasses(classesProp);
-  const Component = href != null ? "a" : "div";
-  return /* @__PURE__ */ jsx("li", { id, className: cx(classes.root, className), "aria-current": selected, children: /* @__PURE__ */ jsx(HvTooltip, { title: label, placement: tooltipPlacement, children: /* @__PURE__ */ jsx(
-    Component,
-    {
-      role: href == null ? "button" : void 0,
-      tabIndex: 0,
-      className: classes.button,
-      href,
-      ...others,
-      children: /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cx(classes.icon, {
-            [classes.notSelected]: !selected
-          })
-        }
-      )
-    }
-  ) }) });
-};
-export {
-  HvVerticalScrollListItem,
-  staticClasses as verticalScrollListItemClasses
+import { useClasses } from "./VerticalScrollListItem.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { jsx } from "react/jsx-runtime";
+//#region src/ScrollToVertical/VerticalScrollListItem/VerticalScrollListItem.tsx
+/**
+* HvVerticalScrollListItem a focusable item to be used as part of the vertical scroll
+*/
+var HvVerticalScrollListItem = (props) => {
+	const { id, className, classes: classesProp, selected, label, tooltipPlacement = "left", href, ...others } = useDefaultProps("HvVerticalScrollListItem", props);
+	const { classes, cx } = useClasses(classesProp);
+	const Component = href != null ? "a" : "div";
+	return /* @__PURE__ */ jsx("li", {
+		id,
+		className: cx(classes.root, className),
+		"aria-current": selected,
+		children: /* @__PURE__ */ jsx(HvTooltip, {
+			title: label,
+			placement: tooltipPlacement,
+			children: /* @__PURE__ */ jsx(Component, {
+				role: href == null ? "button" : void 0,
+				tabIndex: 0,
+				className: classes.button,
+				href,
+				...others,
+				children: /* @__PURE__ */ jsx("div", { className: cx(classes.icon, { [classes.notSelected]: !selected }) })
+			})
+		})
+	});
 };
+//#endregion
+export { HvVerticalScrollListItem };

package/dist/ScrollToVertical/VerticalScrollListItem/VerticalScrollListItem.styles.js

@@ -1,53 +1,46 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
-import { theme } from "@hitachivantara/uikit-styles";
 import { outlineStyles } from "../../utils/focusUtils.js";
-const name = "HvVerticalScrollListItem";
-const { staticClasses, useClasses } = createClasses(name, {
-  root: {
-    padding: "0",
-    height: "32px",
-    width: "32px",
-    display: "flex",
-    justifyContent: "center",
-    alignItems: "center"
-  },
-  icon: {
-    width: "1em",
-    height: "1em",
-    borderRadius: theme.radii.full,
-    fontSize: 6,
-    color: theme.colors.text,
-    display: "inline-block",
-    backgroundColor: "currentcolor"
-  },
-  notSelected: {
-    fontSize: 4,
-    color: theme.colors.textDisabled
-  },
-  button: {
-    display: "flex",
-    justifyContent: "center",
-    alignItems: "center",
-    height: "16px",
-    width: "16px",
-    borderRadius: theme.radii.full,
-    cursor: "pointer",
-    "&:hover": {
-      backgroundColor: theme.colors.bgHover,
-      "& $notSelected": {
-        fontSize: 6,
-        color: theme.colors.text
-      }
-    },
-    "&:focus": {
-      outline: "none"
-    },
-    "&:focus-visible": {
-      ...outlineStyles
-    }
-  }
+import { theme } from "@hitachivantara/uikit-styles";
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+var { staticClasses, useClasses } = createClasses("HvVerticalScrollListItem", {
+	root: {
+		padding: "0",
+		height: "32px",
+		width: "32px",
+		display: "flex",
+		justifyContent: "center",
+		alignItems: "center"
+	},
+	icon: {
+		width: "1em",
+		height: "1em",
+		borderRadius: theme.radii.full,
+		fontSize: 6,
+		color: theme.colors.text,
+		display: "inline-block",
+		backgroundColor: "currentcolor"
+	},
+	notSelected: {
+		fontSize: 4,
+		color: theme.colors.textDisabled
+	},
+	button: {
+		display: "flex",
+		justifyContent: "center",
+		alignItems: "center",
+		height: "16px",
+		width: "16px",
+		borderRadius: theme.radii.full,
+		cursor: "pointer",
+		"&:hover": {
+			backgroundColor: theme.colors.bgHover,
+			"& $notSelected": {
+				fontSize: 6,
+				color: theme.colors.text
+			}
+		},
+		"&:focus": { outline: "none" },
+		"&:focus-visible": { ...outlineStyles }
+	}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/SearchInput/SearchInput.js

@@ -1,28 +1,30 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { HvAdornment } from "../FormElement/Adornment/Adornment.js";
 import { HvIcon } from "../icons.js";
-import { useClasses } from "./SearchInput.styles.js";
 import { HvInput } from "../Input/Input.js";
-import { HvAdornment } from "../FormElement/Adornment/Adornment.js";
-const HvSearchInput = forwardRef(function HvSearchInput2(props, ref) {
-  const { classes: classesProp, ...others } = useDefaultProps(
-    "HvSearchInput",
-    props
-  );
-  const { classes } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx(
-    HvInput,
-    {
-      ref,
-      type: "search",
-      disableSearchButton: true,
-      startAdornment: /* @__PURE__ */ jsx(HvAdornment, { icon: /* @__PURE__ */ jsx(HvIcon, { compact: true, name: "Search" }) }),
-      classes,
-      ...others
-    }
-  );
+import { useClasses } from "./SearchInput.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/SearchInput/SearchInput.tsx
+/**
+* A Search Input allows users to enter and submit a search term.
+*
+* @extends HvInput
+*/
+var HvSearchInput = forwardRef(function HvSearchInput(props, ref) {
+	const { classes: classesProp, ...others } = useDefaultProps("HvSearchInput", props);
+	const { classes } = useClasses(classesProp);
+	return /* @__PURE__ */ jsx(HvInput, {
+		ref,
+		type: "search",
+		disableSearchButton: true,
+		startAdornment: /* @__PURE__ */ jsx(HvAdornment, { icon: /* @__PURE__ */ jsx(HvIcon, {
+			compact: true,
+			name: "Search"
+		}) }),
+		classes,
+		...others
+	});
 });
-export {
-  HvSearchInput
-};
+//#endregion
+export { HvSearchInput };

package/dist/SearchInput/SearchInput.styles.js

@@ -1,9 +1,8 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
-const { staticClasses, useClasses } = createClasses("HvSearchInput", {
-  root: {},
-  input: { marginLeft: 0 }
+//#region src/SearchInput/SearchInput.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvSearchInput", {
+	root: {},
+	input: { marginLeft: 0 }
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { useClasses };