"use strict";
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var create_node_alignment_button_exports = {};
__export(create_node_alignment_button_exports, {
  createNodeAlignmentButton: () => createNodeAlignmentButton
});
module.exports = __toCommonJS(create_node_alignment_button_exports);
var import_react = __toESM(require("react"));
var import_ricos_content = require("./../../ricos-content/index.js");
var import_ricos_context = require("./../../ricos-context/index.js");
var import_modal_service_provider = require("./../../ricos-modals/modal-service-provider.js");
var import_create_plugin_toolbar_button = require("./../create-plugin-toolbar-button.js");
var import_data_hooks = require("./../data-hooks.js");
var import_dropdown_button = require("../dropdown-button.js");
var import_consts = require("../node-alignment-dropdown/consts.js");
var import_node_alignment_dropdown = require("../node-alignment-dropdown/node-alignment-dropdown.js");
var import_get_node_alignment = require("../resolvers/get-node-alignment.js");
var import_get_node_in_selection = require("../resolvers/get-node-in-selection.js");
var import_get_node_text_wrap = require("../resolvers/get-node-text-wrap.js");
var import_is_visible_only_on_desktop = require("../resolvers/is-visible-only-on-desktop.js");
var import_plugin_toolbar_buttons_ids = require("./plugin-toolbar-buttons-ids.js");
const createNodeAlignmentButton = ({
  services,
  modalId,
  attributes
}) => {
  const isMobile = services.context.isMobile;
  return (0, import_create_plugin_toolbar_button.createPluginToolbarButton)({
    id: import_plugin_toolbar_buttons_ids.PLUGIN_TOOLBAR_BUTTON_ID.ALIGNMENT,
    type: "dropdown",
    attributes: {
      nodeAlignment: import_get_node_alignment.getNodeAlignment,
      nodeTextWrap: import_get_node_text_wrap.getNodeTextWrap,
      visible: (0, import_is_visible_only_on_desktop.isVisibleOnlyOnDesktop)(isMobile),
      selectedNode: import_get_node_in_selection.getNodeInSelection,
      active: (_, { modals }) => Boolean(modals?.getModal(modalId)),
      ...attributes
    },
    renderer: (toolbarItem) => /* @__PURE__ */ import_react.default.createElement(NodeAlignmentButton, { toolbarItem, modalId }),
    dataHook: import_data_hooks.PLUGIN_TOOLBAR_ALIGNMENT_BUTTON,
    tooltip: "TextAlignmentButton_Tooltip",
    getIcon: ({ services: services2, attributes: attributes2 }) => {
      const selectedAlignment = attributes2.nodeAlignment || (services2.context.languageDir === "rtl" ? "RIGHT" : "LEFT");
      return import_consts.NODE_ALIGNMENT_BUTTONS[selectedAlignment].icon;
    },
    Component: import_node_alignment_dropdown.NodeAlignmentDropdown,
    getComponentProps: ({ tiptapEditor, modals, attributes: attributes2, t, languageDir }) => {
      const alignment = attributes2.nodeAlignment || getDefaultAlignment(languageDir);
      const getIsTextWrapDisabled = () => !tiptapEditor.can().toggleNodeTextWrap() || alignment === "CENTER";
      return {
        closeModal: () => modals.closeModal(modalId),
        onSelect: (alignment2) => {
          const selectedNode = attributes2.selectedNode;
          tiptapEditor.chain().focus().setNodeAlignment(alignment2).command(({ commands }) => {
            const isCustomWidthSpecified = selectedNode?.attrs.containerData?.width?.custom;
            const excludedNodeTypes = [import_ricos_content.TIPTAP_LINK_BUTTON_TYPE, import_ricos_content.TIPTAP_ACTION_BUTTON_TYPE];
            if (!isCustomWidthSpecified && !excludedNodeTypes.includes(selectedNode.type.name)) {
              commands.setNodeSize("SMALL");
            }
            return true;
          }).run();
        },
        onToggle: () => tiptapEditor.chain().focus().toggleNodeTextWrap().run(),
        selectedId: alignment,
        options: [
          ...Object.values(import_consts.NODE_ALIGNMENT_BUTTONS).map((option) => ({
            type: option.type,
            id: option.commandKey,
            dataHook: option.dataHook,
            label: t(option.text),
            icon: option.iconSmall,
            iconMobile: option.icon
          })),
          {
            type: "toggle",
            id: "TEXT_WRAP",
            dataHook: import_data_hooks.ALIGNMENT_DROPDOWN_OPTION_TEXT_WRAP,
            label: t("TextwrapObject_ToggleButton"),
            selected: getIsTextWrapDisabled() ? false : attributes2.nodeTextWrap ?? true,
            disabled: getIsTextWrapDisabled(),
            infoContent: getIsTextWrapDisabled() ? t(
              alignment === "CENTER" ? "TextwrapObject_ToggleButton_Info_AlignedCenter" : "TextwrapObject_ToggleButton_Info_UnsupportedContainer"
            ) : void 0
          }
        ]
      };
    },
    command: ({
      modals,
      referenceElement,
      tiptapEditor,
      attributes: attributes2,
      getComponentProps,
      publicCommands
    }) => {
      const componentProps = getComponentProps?.({
        tiptapEditor,
        attributes: attributes2,
        publicCommands,
        t: services.t,
        modals,
        languageDir: services.context.languageDir
      });
      if (!componentProps) {
        return;
      }
      modals.isModalOpen(modalId) ? modals.closeModal(modalId) : modals.openModal({
        id: modalId,
        Component: import_node_alignment_dropdown.NodeAlignmentDropdown,
        componentProps,
        layout: isMobile ? "drawer" : "floating",
        positioning: { referenceElement, placement: "bottom" },
        onClickOutside: {
          on: "pointerup",
          handler: (e) => {
            if (!referenceElement?.contains?.(e.target)) {
              modals.closeModal(modalId);
              return;
            }
          }
        }
      });
    }
  });
};
const NodeAlignmentButton = ({ toolbarItem, modalId }) => {
  const { t, languageDir } = (0, import_react.useContext)(import_ricos_context.RicosContext) || {};
  const isModalOpen = (0, import_modal_service_provider.useModalState)((0, import_modal_service_provider.getIsModalOpen)(modalId));
  const [referenceElement, setReferenceElement] = (0, import_react.useState)(null);
  const getSelectedAlignment = () => toolbarItem?.attributes.nodeAlignment || (languageDir === "rtl" ? "RIGHT" : "LEFT");
  const onClick = (e) => {
    toolbarItem.commands?.click({ referenceElement, e });
  };
  return /* @__PURE__ */ import_react.default.createElement(
    import_dropdown_button.DropdownButton,
    {
      dataHook: import_data_hooks.PLUGIN_TOOLBAR_ALIGNMENT_BUTTON,
      active: isModalOpen,
      onClick,
      ref: setReferenceElement,
      icon: import_consts.NODE_ALIGNMENT_BUTTONS[getSelectedAlignment()].icon,
      tooltip: t("TextAlignmentButton_Tooltip"),
      tabIndex: toolbarItem.presentation.tabIndex
    }
  );
};
const getDefaultAlignment = (langDir) => {
  return langDir === "rtl" ? "RIGHT" : "LEFT";
};
//# sourceMappingURL=create-node-alignment-button.js.map
