import { TextLineSpacing } from "@wix/wix-ui-icons-common";
import lodash from "lodash";
import React from "react";
import { RICOS_LINE_SPACING_TYPE } from "./../ricos-content/index.js";
import { createTextButton } from "./../_shared/create-text-button.js";
import { isAlwaysVisible } from "./../_shared/resolvers/is-always-visible.js";
import { isNodeSelected } from "./../_shared/resolvers/is-node-selected.js";
import { LineSpacingButton } from "./../toolbars-v3/components/buttons/LineSpacingButton/line-spacing-button.js";
import { getLineHeightStyleBySelectedNode } from "./../tiptap-extensions/ricos-styles.js";
import { LINE_SPACING_CUSTOM_SPACING_MODAL_ID, LINE_SPACING_MODAL_ID } from "./consts.js";
import { CustomSpacingEditorModal } from "./custom-spacing-editor-modal/custom-spacing-editor-modal.js";
import {
  PREDEFINED_SPACING_OPTION,
  SPACING_SELECTOR_BUTTON,
  TEXT_BUTTON_LINE_SPACING
} from "./data-hooks.js";
import { DEFAULT_LINE_SPACING } from "./defaults.js";
import { CUSTOM_SPACING_OPTION_ID } from "./insert-decoration-modal/insert-decoration-modal.js";
import { LineSpacingPanelComponent } from "./line-spacing-panel-component.js";
const PREDEFINED_LINE_HEIGHTS = [
  { text: "1", commandKey: "1" },
  { text: "1.5", commandKey: "1.5" },
  { text: "2", commandKey: "2" },
  { text: "2.5", commandKey: "2.5" },
  { text: "3", commandKey: "3" }
];
const getTextButtons = (config) => {
  return [
    createTextButton({
      id: "LINE_SPACING",
      type: "dropdown",
      presentation: {
        id: LINE_SPACING_MODAL_ID,
        dataHook: TEXT_BUTTON_LINE_SPACING,
        tooltip: "LineSpacingButton_Tooltip",
        icon: TextLineSpacing,
        renderer: (toolbarItem) => /* @__PURE__ */ React.createElement(LineSpacingButton, { toolbarItem }),
        Component: LineSpacingPanelComponent,
        getComponentProps: ({ publicCommands, modals, t, editor, styles }) => {
          const lineSpacing = {
            ...DEFAULT_LINE_SPACING,
            ...lodash.omitBy(config.defaultSpacing, lodash.isNil),
            ...lodash.omitBy(publicCommands.getBlockSpacing(), lodash.isNil)
          };
          const options = (() => {
            const current = lineSpacing["line-height"];
            const isCurrentInOptions = PREDEFINED_LINE_HEIGHTS.some(
              (lineHeight) => lineHeight.text === current
            );
            if (isCurrentInOptions || current === "") {
              return PREDEFINED_LINE_HEIGHTS;
            }
            const calculatedLineHeight = getLineHeightStyleBySelectedNode({
              tiptapEditor: editor,
              styles
            });
            const allSpacingOptions = [
              ...PREDEFINED_LINE_HEIGHTS,
              { text: calculatedLineHeight ?? current, commandKey: current }
            ];
            return removeDuplicateLineSpacingOptions(allSpacingOptions).sort(
              (a, b) => Number(a.text) - Number(b.text)
            );
          })();
          const insertDecoration = (data, options2) => {
            publicCommands.insertDecoration(
              RICOS_LINE_SPACING_TYPE,
              {
                data
              },
              options2 || {}
            );
          };
          return {
            options: [
              ...options.map(({ text, commandKey }) => ({
                id: commandKey,
                dataHook: PREDEFINED_SPACING_OPTION,
                label: t(text)
              })),
              {
                id: CUSTOM_SPACING_OPTION_ID,
                dataHook: SPACING_SELECTOR_BUTTON,
                label: t("LineSpacing_customSpacing")
              }
            ],
            onSelect: ({ referenceElement, isMobile }) => (value) => {
              if (value === CUSTOM_SPACING_OPTION_ID) {
                modals.closeModal(LINE_SPACING_MODAL_ID);
                modals.openModal({
                  id: LINE_SPACING_CUSTOM_SPACING_MODAL_ID,
                  Component: CustomSpacingEditorModal,
                  componentProps: {
                    initialLineSpacing: lineSpacing,
                    insertDecoration
                  },
                  layout: isMobile ? "fullscreen" : "floating",
                  withTransition: !isMobile,
                  positioning: {
                    referenceElement: referenceElement || null,
                    placement: "bottom"
                  },
                  enableDrag: !isMobile,
                  dragHandleSelector: "[data-drag-handler]",
                  onClickOutside: () => {
                  },
                  disableArrowNavigation: true,
                  returnFocusToEditor: true
                });
                return;
              }
              insertDecoration({ ...lineSpacing, "line-height": value });
            },
            selectedId: lineSpacing["line-height"],
            closeModal: () => {
              modals.closeModal(LINE_SPACING_MODAL_ID);
            }
          };
        }
      },
      attributes: {
        visible: isAlwaysVisible,
        disabled: isNodeSelected
      },
      command: ({ modalService: modals, referenceElement, isMobile, componentProps }) => () => {
        if (!componentProps) {
          return false;
        }
        modals.isModalOpen(LINE_SPACING_MODAL_ID) ? modals.closeModal(LINE_SPACING_MODAL_ID) : modals.openModal({
          id: LINE_SPACING_MODAL_ID,
          Component: LineSpacingPanelComponent,
          componentProps: {
            options: componentProps.options,
            onSelect: componentProps.onSelect({
              referenceElement: referenceElement || null,
              isMobile
            }),
            selectedId: componentProps.selectedId,
            closeModal: componentProps.closeModal
          },
          positioning: {
            placement: "bottom",
            referenceElement
          },
          layout: isMobile ? "drawer" : referenceElement ? "floating" : "dialog",
          returnFocusToEditor: true
        });
        return true;
      }
    })
  ];
};
const removeDuplicateLineSpacingOptions = (lineSpacingOptions) => {
  return Object.values(
    lineSpacingOptions.reduce((allOptions, option) => {
      allOptions[option.text] = option;
      return allOptions;
    }, {})
  );
};
export {
  getTextButtons
};
//# sourceMappingURL=get-text-buttons.js.map
