@hitachivantara/uikit-react-core 6.8.1 → 6.9.0

package/dist/Accordion/Accordion.js

@@ -1,83 +1,72 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { forwardRef, useMemo } from "react";
-import { useEventCallback } from "@mui/material/utils";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { useExpandable } from "../hooks/useExpandable.js";
-import { HvIcon } from "../icons.js";
-import { useClasses } from "./Accordion.styles.js";
-import { staticClasses } from "./Accordion.styles.js";
 import { HvTypography } from "../Typography/Typography.js";
 import { HvButtonBase } from "../ButtonBase/ButtonBase.js";
-const HvAccordion = forwardRef(function HvAccordion2(props, ref) {
-  const {
-    className,
-    classes: classesProp,
-    disabled = false,
-    label,
-    onChange,
-    children,
-    expanded,
-    headingLevel,
-    defaultExpanded = false,
-    containerProps,
-    labelVariant = "label",
-    ...others
-  } = useDefaultProps("HvAccordion", props);
-  const { classes, cx } = useClasses(classesProp);
-  const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({
-    expanded,
-    disabled,
-    defaultExpanded
-  });
-  const handleClick = useEventCallback((event) => {
-    if (disabled) return;
-    onChange?.(event, isOpen);
-    toggleOpen();
-  });
-  const accordionHeader = useMemo(() => {
-    const accordionButton = /* @__PURE__ */ jsxs(
-      HvTypography,
-      {
-        ...buttonProps,
-        component: HvButtonBase,
-        className: cx(classes.label, { [classes.disabled]: disabled }),
-        disabled,
-        onClick: handleClick,
-        variant: labelVariant,
-        children: [
-          /* @__PURE__ */ jsx(HvIcon, { name: "CaretDown", rotate: isOpen, size: "xs" }),
-          label
-        ]
-      }
-    );
-    return headingLevel === void 0 ? accordionButton : /* @__PURE__ */ jsx(HvTypography, { component: `h${headingLevel}`, variant: labelVariant, children: accordionButton });
-  }, [
-    cx,
-    classes.label,
-    classes.disabled,
-    handleClick,
-    label,
-    buttonProps,
-    disabled,
-    headingLevel,
-    isOpen,
-    labelVariant
-  ]);
-  return /* @__PURE__ */ jsxs("div", { ref, className: cx(classes.root, className), ...others, children: [
-    accordionHeader,
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: cx(classes.container, { [classes.hidden]: !isOpen }),
-        hidden: !isOpen,
-        ...regionProps,
-        ...containerProps,
-        children
-      }
-    )
-  ] });
+import { HvIcon } from "../icons.js";
+import { useExpandable } from "../hooks/useExpandable.js";
+import { useClasses } from "./Accordion.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef, useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEventCallback } from "@mui/material/utils";
+//#region src/Accordion/Accordion.tsx
+/**
+* An accordion is a design element that expands in place to expose hidden information.
+*/
+var HvAccordion = forwardRef(function HvAccordion(props, ref) {
+	const { className, classes: classesProp, disabled = false, label, onChange, children, expanded, headingLevel, defaultExpanded = false, containerProps, labelVariant = "label", ...others } = useDefaultProps("HvAccordion", props);
+	const { classes, cx } = useClasses(classesProp);
+	const { isOpen, toggleOpen, buttonProps, regionProps } = useExpandable({
+		expanded,
+		disabled,
+		defaultExpanded
+	});
+	const handleClick = useEventCallback((event) => {
+		if (disabled) return;
+		onChange?.(event, isOpen);
+		toggleOpen();
+	});
+	const accordionHeader = useMemo(() => {
+		const accordionButton = /* @__PURE__ */ jsxs(HvTypography, {
+			...buttonProps,
+			component: HvButtonBase,
+			className: cx(classes.label, { [classes.disabled]: disabled }),
+			disabled,
+			onClick: handleClick,
+			variant: labelVariant,
+			children: [/* @__PURE__ */ jsx(HvIcon, {
+				name: "CaretDown",
+				rotate: isOpen,
+				size: "xs"
+			}), label]
+		});
+		return headingLevel === void 0 ? accordionButton : /* @__PURE__ */ jsx(HvTypography, {
+			component: `h${headingLevel}`,
+			variant: labelVariant,
+			children: accordionButton
+		});
+	}, [
+		cx,
+		classes.label,
+		classes.disabled,
+		handleClick,
+		label,
+		buttonProps,
+		disabled,
+		headingLevel,
+		isOpen,
+		labelVariant
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cx(classes.root, className),
+		...others,
+		children: [accordionHeader, /* @__PURE__ */ jsx("div", {
+			className: cx(classes.container, { [classes.hidden]: !isOpen }),
+			hidden: !isOpen,
+			...regionProps,
+			...containerProps,
+			children
+		})]
+	});
 });
-export {
-  HvAccordion,
-  staticClasses as accordionClasses
-};
+//#endregion
+export { HvAccordion };

package/dist/Accordion/Accordion.styles.js

@@ -1,18 +1,23 @@
 import { createClasses } from "@hitachivantara/uikit-react-utils";
-const { staticClasses, useClasses } = createClasses("HvAccordion", {
-  root: {},
-  hidden: { height: 0, display: "none" },
-  container: { paddingTop: 8, height: "auto" },
-  label: {
-    width: "100%",
-    display: "flex",
-    justifyContent: "flex-start",
-    alignItems: "center",
-    height: "32px"
-  },
-  disabled: {}
+//#region src/Accordion/Accordion.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvAccordion", {
+	root: {},
+	hidden: {
+		height: 0,
+		display: "none"
+	},
+	container: {
+		paddingTop: 8,
+		height: "auto"
+	},
+	label: {
+		width: "100%",
+		display: "flex",
+		justifyContent: "flex-start",
+		alignItems: "center",
+		height: "32px"
+	},
+	disabled: {}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/ActionBar/ActionBar.js

@@ -1,19 +1,20 @@
-import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { useClasses } from "./ActionBar.styles.js";
-import { staticClasses } from "./ActionBar.styles.js";
-const HvActionBar = forwardRef(function HvActionBar2(props, ref) {
-  const {
-    classes: classesProp,
-    className,
-    children,
-    ...others
-  } = useDefaultProps("HvActionBar", props);
-  const { classes, cx } = useClasses(classesProp);
-  return /* @__PURE__ */ jsx("div", { ref, className: cx(classes.root, className), ...others, children });
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/ActionBar/ActionBar.tsx
+/**
+* The Action Bar accommodates all the actions related to a specific task on a screen or pattern.
+*/
+var HvActionBar = forwardRef(function HvActionBar(props, ref) {
+	const { classes: classesProp, className, children, ...others } = useDefaultProps("HvActionBar", props);
+	const { classes, cx } = useClasses(classesProp);
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx(classes.root, className),
+		...others,
+		children
+	});
 });
-export {
-  HvActionBar,
-  staticClasses as actionBarClasses
-};
+//#endregion
+export { HvActionBar };

package/dist/ActionBar/ActionBar.styles.js

@@ -1,16 +1,13 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvActionBar", {
-  root: {
-    width: "100%",
-    padding: theme.space.sm,
-    borderTop: `1px solid ${theme.colors.borderSubtle}`,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "flex-end"
-  }
-});
-export {
-  staticClasses,
-  useClasses
-};
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/ActionBar/ActionBar.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvActionBar", { root: {
+	width: "100%",
+	padding: theme.space.sm,
+	borderTop: `1px solid ${theme.colors.borderSubtle}`,
+	display: "flex",
+	alignItems: "center",
+	justifyContent: "flex-end"
+} });
+//#endregion
+export { staticClasses, useClasses };

package/dist/ActionsGeneric/ActionsGeneric.js

@@ -1,102 +1,76 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { forwardRef, isValidElement } from "react";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
-import { HvIcon } from "../icons.js";
 import { setId } from "../utils/setId.js";
-import { useClasses } from "./ActionsGeneric.styles.js";
-import { staticClasses } from "./ActionsGeneric.styles.js";
+import { HvIcon } from "../icons.js";
+import { HvButton } from "../Button/Button.js";
 import { HvDropDownMenu } from "../DropDownMenu/DropDownMenu.js";
 import { HvIconButton } from "../IconButton/IconButton.js";
-import { HvButton } from "../Button/Button.js";
-const HvActionsGeneric = forwardRef(function HvActionsGeneric2(props, ref) {
-  const {
-    id: idProp,
-    classes: classesProp,
-    className,
-    variant = "secondaryGhost",
-    disabled = false,
-    actions = [],
-    onAction,
-    maxVisibleActions = Infinity,
-    iconOnly: iconOnlyProp,
-    dropdownMenuProps: dropdownMenuPropsProp,
-    ...others
-  } = useDefaultProps("HvActionsGeneric", props);
-  const { onClick: onClickDropdownMenu, ...dropdownMenuProps } = dropdownMenuPropsProp || {};
-  const { classes, cx } = useClasses(classesProp);
-  if (!Array.isArray(actions)) return isValidElement(actions) ? actions : null;
-  const renderButton = (action, idx) => {
-    const {
-      disabled: actDisabled,
-      id: actId,
-      icon,
-      label,
-      iconOnly,
-      ...other
-    } = action;
-    const actionId = setId(idProp, idx, "action", action.id);
-    const renderedIcon = isValidElement(icon) ? icon : icon?.({ isDisabled: disabled });
-    const commonButtonProps = {
-      id: actionId,
-      variant,
-      className: classes.button,
-      disabled: actDisabled ?? disabled,
-      onClick: (event) => onAction?.(event, action),
-      ...other
-    };
-    const key = actionId || idx;
-    const isIcon = iconOnly ?? iconOnlyProp;
-    if (isIcon) {
-      return /* @__PURE__ */ jsx(HvIconButton, { ...commonButtonProps, title: label, children: renderedIcon }, key);
-    }
-    return /* @__PURE__ */ jsx(HvButton, { ...commonButtonProps, startIcon: renderedIcon, children: label }, key);
-  };
-  const renderActionsGrid = () => {
-    const actsVisible = actions.slice(0, maxVisibleActions);
-    const actsDropdown = actions.slice(maxVisibleActions);
-    const iconColor = variant === "semantic" && "textDark" || void 0;
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      actsVisible.map((action, idx) => renderButton(action, idx)),
-      /* @__PURE__ */ jsx(
-        HvDropDownMenu,
-        {
-          id: setId(idProp, "menu"),
-          disabled,
-          variant,
-          classes: {
-            root: classes.dropDownMenu,
-            open: classes.dropDownMenuButtonSelected
-          },
-          icon: /* @__PURE__ */ jsx(HvIcon, { name: "DotsVertical", color: iconColor }),
-          placement: "left",
-          onClick: (event, action) => {
-            onAction?.(event, action);
-            onClickDropdownMenu?.(event, action);
-          },
-          dataList: actsDropdown,
-          keepOpened: false,
-          disablePortal: false,
-          ...dropdownMenuProps
-        }
-      )
-    ] });
-  };
-  const actionOverflow = actions.length > maxVisibleActions;
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: cx(
-        classes.root,
-        { [classes.actionContainer]: actionOverflow },
-        className
-      ),
-      ...others,
-      children: actionOverflow ? renderActionsGrid() : actions.map((action, idx) => renderButton(action, idx))
-    }
-  );
+import { useClasses } from "./ActionsGeneric.styles.js";
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { forwardRef, isValidElement } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+//#region src/ActionsGeneric/ActionsGeneric.tsx
+var HvActionsGeneric = forwardRef(function HvActionsGeneric(props, ref) {
+	const { id: idProp, classes: classesProp, className, variant = "secondaryGhost", disabled = false, actions = [], onAction, maxVisibleActions = Infinity, iconOnly: iconOnlyProp, dropdownMenuProps: dropdownMenuPropsProp, ...others } = useDefaultProps("HvActionsGeneric", props);
+	const { onClick: onClickDropdownMenu, ...dropdownMenuProps } = dropdownMenuPropsProp || {};
+	const { classes, cx } = useClasses(classesProp);
+	if (!Array.isArray(actions)) return isValidElement(actions) ? actions : null;
+	const renderButton = (action, idx) => {
+		const { disabled: actDisabled, id: actId, icon, label, iconOnly, ...other } = action;
+		const actionId = setId(idProp, idx, "action", action.id);
+		const renderedIcon = isValidElement(icon) ? icon : icon?.({ isDisabled: disabled });
+		const commonButtonProps = {
+			id: actionId,
+			variant,
+			className: classes.button,
+			disabled: actDisabled ?? disabled,
+			onClick: (event) => onAction?.(event, action),
+			...other
+		};
+		const key = actionId || idx;
+		if (iconOnly ?? iconOnlyProp) return /* @__PURE__ */ jsx(HvIconButton, {
+			...commonButtonProps,
+			title: label,
+			children: renderedIcon
+		}, key);
+		return /* @__PURE__ */ jsx(HvButton, {
+			...commonButtonProps,
+			startIcon: renderedIcon,
+			children: label
+		}, key);
+	};
+	const renderActionsGrid = () => {
+		const actsVisible = actions.slice(0, maxVisibleActions);
+		const actsDropdown = actions.slice(maxVisibleActions);
+		const iconColor = variant === "semantic" && "textDark" || void 0;
+		return /* @__PURE__ */ jsxs(Fragment$1, { children: [actsVisible.map((action, idx) => renderButton(action, idx)), /* @__PURE__ */ jsx(HvDropDownMenu, {
+			id: setId(idProp, "menu"),
+			disabled,
+			variant,
+			classes: {
+				root: classes.dropDownMenu,
+				open: classes.dropDownMenuButtonSelected
+			},
+			icon: /* @__PURE__ */ jsx(HvIcon, {
+				name: "DotsVertical",
+				color: iconColor
+			}),
+			placement: "left",
+			onClick: (event, action) => {
+				onAction?.(event, action);
+				onClickDropdownMenu?.(event, action);
+			},
+			dataList: actsDropdown,
+			keepOpened: false,
+			disablePortal: false,
+			...dropdownMenuProps
+		})] });
+	};
+	const actionOverflow = actions.length > maxVisibleActions;
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		className: cx(classes.root, { [classes.actionContainer]: actionOverflow }, className),
+		...others,
+		children: actionOverflow ? renderActionsGrid() : actions.map((action, idx) => renderButton(action, idx))
+	});
 });
-export {
-  HvActionsGeneric,
-  staticClasses as actionsGenericClasses
-};
+//#endregion
+export { HvActionsGeneric };

package/dist/ActionsGeneric/ActionsGeneric.styles.js

@@ -1,16 +1,19 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
 import { theme } from "@hitachivantara/uikit-styles";
-const { staticClasses, useClasses } = createClasses("HvActionsGeneric", {
-  root: {
-    display: "flex",
-    gap: theme.space.xs
-  },
-  button: {},
-  actionContainer: { display: "flex", alignItems: "center", float: "right" },
-  dropDownMenu: {},
-  dropDownMenuButtonSelected: {}
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/ActionsGeneric/ActionsGeneric.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvActionsGeneric", {
+	root: {
+		display: "flex",
+		gap: theme.space.xs
+	},
+	button: {},
+	actionContainer: {
+		display: "flex",
+		alignItems: "center",
+		float: "right"
+	},
+	dropDownMenu: {},
+	dropDownMenuButtonSelected: {}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };