@hitachivantara/uikit-react-core/dist/ActionsGeneric/ActionsGeneric.js

UI Kit Core React components.

import { setId } from "../utils/setId.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 { 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))
	});
});
//#endregion
export { HvActionsGeneric };