import React, { useContext } from "react";
import { RicosContext } from "./../../ricos-context/index.js";
import { useBiNext } from "./../../_shared/bi-context-provider/bi-context-provider.js";
import { DropdownModal } from "./../../_shared/dropdown-modal/dropdown-modal.js";
import { ListItemDivider } from "./../../_shared/list-item-divider/list-item-divider.js";
import { ListItemSelect } from "./../../_shared/list-item-select/list-item-select.js";
import { LINE_SPACING_MODAL_ID } from "../consts.js";
const CUSTOM_SPACING_OPTION_ID = "custom-spacing";
const InsertDecorationModal = ({
  options: dropdownOptions,
  onSelect,
  selectedId,
  closeModal
}) => {
  const { t } = useContext(RicosContext);
  const logBi = useBiNext({ modalId: LINE_SPACING_MODAL_ID, pluginId: "lineSpacing" });
  const customOption = dropdownOptions.find((option) => option.id === CUSTOM_SPACING_OPTION_ID);
  return /* @__PURE__ */ React.createElement(
    DropdownModal,
    {
      onCloseButtonClick: closeModal,
      title: t("FormattingToolbar_LineSpacingPanelHeader"),
      options: [
        ...dropdownOptions.filter((option) => option.id !== CUSTOM_SPACING_OPTION_ID).map(({ id, dataHook, label }) => /* @__PURE__ */ React.createElement(
          ListItemSelect,
          {
            dataHook,
            key: id,
            title: label,
            selected: selectedId === id,
            onSelect: () => {
              onSelect(id);
              closeModal();
              logBi({ dataHook, value: id });
            }
          }
        )),
        /* @__PURE__ */ React.createElement(ListItemDivider, { key: "divider" }),
        customOption && /* @__PURE__ */ React.createElement(
          ListItemSelect,
          {
            key: "custom-spacing",
            dataHook: customOption.dataHook,
            title: customOption.label,
            onSelect: () => {
              onSelect(CUSTOM_SPACING_OPTION_ID);
              logBi({ dataHook: customOption.dataHook, value: CUSTOM_SPACING_OPTION_ID });
            }
          }
        )
      ]
    }
  );
};
export {
  CUSTOM_SPACING_OPTION_ID,
  InsertDecorationModal
};
//# sourceMappingURL=insert-decoration-modal.js.map
