@hitachivantara/uikit-react-core
Version:
UI Kit Core React components.
61 lines (60 loc) • 2.64 kB
JavaScript
import { HvButton } from "../Button/Button.js";
import { HvCheckBox } from "../CheckBox/CheckBox.js";
import { CounterLabel } from "../utils/CounterLabel.js";
import { HvActionsGeneric } from "../ActionsGeneric/ActionsGeneric.js";
import { useClasses } from "./BulkActions.styles.js";
import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { forwardRef } from "react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
//#region src/BulkActions/BulkActions.tsx
/**
* Bulk Actions let users apply an action to one or multiple items at once, streamlining repetitive tasks.
*/
var HvBulkActions = forwardRef(function HvBulkActions(props, ref) {
const { id, className, classes: classesProp, selectAllPagesLabel, disabled, actionsDisabled: actionsDisabledProp, maxVisibleActions, checkboxProps, actions, numTotal = 0, numSelected = 0, selectAllConjunctionLabel = "/", showSelectAllPages, semantic = true, onAction, onSelectAll, onSelectAllPages, ...others } = useDefaultProps("HvBulkActions", props);
const { classes, cx } = useClasses(classesProp);
const anySelected = numSelected > 0;
const isSemantic = semantic && anySelected;
const actionsDisabled = disabled || actionsDisabledProp;
return /* @__PURE__ */ jsxs("div", {
ref,
id,
className: cx(classes.root, className, {
[classes.semantic]: isSemantic,
[classes.disabled]: disabled
}),
...others,
children: [/* @__PURE__ */ jsxs("div", {
className: classes.selectAllContainer,
children: [/* @__PURE__ */ jsx(HvCheckBox, {
disabled,
className: classes.selectAll,
checked: numSelected > 0,
semantic: isSemantic,
onChange: onSelectAll,
indeterminate: numSelected > 0 && numSelected < numTotal,
label: /* @__PURE__ */ jsx(CounterLabel, {
selected: numSelected,
total: numTotal,
conjunctionLabel: selectAllConjunctionLabel
}),
...checkboxProps
}), showSelectAllPages && anySelected && numSelected < numTotal && /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", { className: classes.divider }), /* @__PURE__ */ jsx(HvButton, {
disabled,
className: classes.selectAllPages,
variant: isSemantic ? "primaryGhost" : "secondaryGhost",
onClick: onSelectAllPages,
children: selectAllPagesLabel ?? `Select all ${numTotal} items`
})] })]
}), /* @__PURE__ */ jsx(HvActionsGeneric, {
classes: { root: classes.actions },
variant: isSemantic ? "primaryGhost" : "secondaryGhost",
actions,
disabled: actionsDisabled ?? numSelected === 0,
onAction,
maxVisibleActions
})]
});
});
//#endregion
export { HvBulkActions };