import React, { useContext } from "react";
import { RicosContext } from "./../../../ricos-context/index.js";
import { DropdownModal } from "./../../../_shared/dropdown-modal/dropdown-modal.js";
import { ListItemSelect } from "./../../../_shared/list-item-select/list-item-select.js";
const TextAlignmentDropdown = ({
  dropdownOptions,
  onSelect,
  selectedId,
  closeModal
}) => {
  const { t, isMobile } = useContext(RicosContext);
  return /* @__PURE__ */ React.createElement(
    DropdownModal,
    {
      onCloseButtonClick: closeModal,
      options: dropdownOptions.map(
        ({ id: commandKey, dataHook, label, icon: Icon, iconMobile: IconMobile }) => /* @__PURE__ */ React.createElement(
          ListItemSelect,
          {
            key: commandKey,
            dataHook,
            prefix: isMobile && IconMobile ? /* @__PURE__ */ React.createElement(IconMobile, null) : Icon ? /* @__PURE__ */ React.createElement(Icon, null) : null,
            title: label,
            selected: commandKey === selectedId,
            onSelect: () => {
              onSelect(commandKey);
              closeModal();
            }
          }
        )
      ),
      title: t("AlignTextDropdownButton_Tooltip")
    }
  );
};
var text_alignment_dropdown_default = TextAlignmentDropdown;
export {
  text_alignment_dropdown_default as default
};
//# sourceMappingURL=text-alignment-dropdown.js.map
