import React, { useContext } from "react";
import { RicosContext } from "./../../ricos-context/index.js";
import { ModalServiceContext } from "./../../ricos-context/modal-context.js";
import { useBiNext } from "./../../_shared/bi-context-provider/bi-context-provider.js";
import {
  handleColorAdded,
  handleColorDeleted,
  resolveThemeColorsPalette,
  useResolvedCustomColors
} from "./../../_shared/color-manager-utils.js";
import { PmNodeType } from "./../../_shared/pm-node-types.js";
import { useNodeAttrs } from "./../../_shared/use-node-attrs.js";
import { NewColorPicker } from "./../../ui-components/color-picker/new-color-picker/index.js";
const BorderColorPicker = ({
  modalId,
  nodeId,
  referenceElement,
  config,
  defaultColor,
  onColorSelected,
  onColorAdded: onColorAddedProp
}) => {
  const modalService = useContext(ModalServiceContext);
  const { t, colorManager, theme } = useContext(RicosContext);
  const { pmNodeAttrs } = useNodeAttrs(nodeId, PmNodeType.IMAGE);
  const logBi = useBiNext({
    modalId,
    pluginId: "image",
    nodeId
  });
  const themeColors = resolveThemeColorsPalette(
    theme,
    config?.colors ? Object.values(config.colors) : []
  );
  const customColors = useResolvedCustomColors(colorManager, config.getBorderColors);
  const onColorAdded = (color) => {
    handleColorAdded(color, colorManager, onColorAddedProp);
    onColorSelected(color);
  };
  const onColorDeleted = (color) => {
    handleColorDeleted(color, colorManager);
  };
  const closeModal = () => modalService.closeModal(modalId);
  const onResetColor = () => onColorSelected(void 0);
  const currentColor = (pmNodeAttrs?.styles?.border?.color ?? defaultColor)?.toUpperCase();
  return /* @__PURE__ */ React.createElement(
    NewColorPicker,
    {
      themeColors,
      customColors,
      currentColor,
      title: t("Colours"),
      closeModal,
      onColorSelected,
      onColorAdded,
      onColorDeleted: colorManager || !config.getBorderColors ? onColorDeleted : void 0,
      onResetColor,
      referenceElement,
      logBi,
      allowTransparent: true
    }
  );
};
export {
  BorderColorPicker
};
//# sourceMappingURL=border-color-picker.js.map
