import React from 'react';
import classNames from 'classnames';
import { ActionBarSection } from './action-bar-section';
import { jsx as _jsx } from "react/jsx-runtime";
export const ACTION_BAR_TRAY_ITEM_PLACEMENT = {
  LEFT: 'left',
  RIGHT: 'right'
};
/** ActionBar displays grouped lists of actions
 * [CAPITALIZATION] Use sentence case for items, unless referencing a proper noun (named tab, for example).
 * @midnight-gray-supported
 * @alpine-light-supported
 */
export function ActionBar({
  actionItemsList,
  isTray = false,
  className,
  testId
}) {
  const actionItemMap = actionItemsList.reduce((map, actionItem) => {
    const formattedActionItem = /*#__PURE__*/React.isValidElement(actionItem) ? {
      element: actionItem
    } : actionItem;
    try {
      map.get(formattedActionItem.placement || ACTION_BAR_TRAY_ITEM_PLACEMENT.LEFT)?.push(formattedActionItem);
    } catch (error) {
      throw Error(`Action item with incorrect placement detected in ActionBar: ${error}`);
    }
    return map;
  }, new Map([[ACTION_BAR_TRAY_ITEM_PLACEMENT.LEFT, []], [ACTION_BAR_TRAY_ITEM_PLACEMENT.RIGHT, []]]));
  return /*#__PURE__*/_jsx("div", {
    className: classNames(className, 'action-bar-component', {
      tray: isTray
    }),
    "test-id": testId,
    children: actionItemMap && Array.from(actionItemMap, ([key, actionsList]) => /*#__PURE__*/_jsx(ActionBarSection, {
      position: key,
      actionsList: actionsList
    }, key))
  });
}