"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { memo, useCallback, useEffect, useMemo, useState } from "react";
import { TRANSFORMERS } from "@lexical/markdown";
import { AutoFocusPlugin } from "@lexical/react/LexicalAutoFocusPlugin";
import { CheckListPlugin } from "@lexical/react/LexicalCheckListPlugin";
import { ClearEditorPlugin } from "@lexical/react/LexicalClearEditorPlugin";
import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
import { HorizontalRulePlugin } from "@lexical/react/LexicalHorizontalRulePlugin";
import { ListPlugin } from "@lexical/react/LexicalListPlugin";
import { MarkdownShortcutPlugin } from "@lexical/react/LexicalMarkdownShortcutPlugin";
import { OnChangePlugin } from "@lexical/react/LexicalOnChangePlugin";
import { PlainTextPlugin } from "@lexical/react/LexicalPlainTextPlugin";
import { RichTextPlugin } from "@lexical/react/LexicalRichTextPlugin";
import { TabIndentationPlugin } from "@lexical/react/LexicalTabIndentationPlugin";
import { TablePlugin } from "@lexical/react/LexicalTablePlugin";
import { useEditorConfig } from "./config/editor-config-context.js";
import { ContentEditable } from "./content-editable.js";
import { useSharedHistoryContext } from "./context/shared-history-context.js";
import { useSharedOnChange } from "./context/shared-on-change-context.js";
import { Debug } from "./debug.js";
import { AdmonitionPlugin } from "./plugins/admonition-plugin/index.js";
import { AutoEmbedPlugin } from "./plugins/auto-embed-plugin/index.js";
import { CodeHighlightPlugin } from "./plugins/code-highlight-plugin/index.js";
import { FloatingTextFormatToolbarPlugin } from "./plugins/floating-text-format-toolbar-plugin/index.js";
import { InlineImagePlugin } from "./plugins/inline-image-plugin/index.js";
import { LayoutPlugin } from "./plugins/layout-plugin/layout-plugin.js";
import { AutoLinkPlugin } from "./plugins/link-plugin/auto-link/index.js";
import { LinkPlugin } from "./plugins/link-plugin/link/index.js";
import { FloatingLinkEditorPlugin } from "./plugins/link-plugin/link/floating-link-editor.js";
import { TableActionMenuPlugin } from "./plugins/table-action-menu-plugin/index.js";
import { TablePlugin as index_js_TablePlugin } from "./plugins/table-plugin/index.js";
import { ToolbarPlugin } from "./plugins/toolbar-plugin/index.js";
import { TreeViewPlugin } from "./plugins/treeview-plugin/index.js";
import { VimeoPlugin } from "./plugins/vimeo-plugin/index.js";
import { YouTubePlugin } from "./plugins/youtube-plugin/index.js";
import { CAN_USE_DOM } from "./shared/canUseDOM.js";
import { Placeholder } from "./ui/placeholder.js";
import "./editor.css";
import { APPLY_VALUE_TAG } from "./constants.js";
const editor_Editor = /*#__PURE__*/ memo(function({ minHeight, maxHeight }) {
    const [floatingAnchorElem, setFloatingAnchorElem] = useState(null);
    const [isSmallWidthViewport, setIsSmallWidthViewport] = useState(false);
    useState(()=>({
            count: 0
        }))[0];
    const { onChange } = useSharedOnChange();
    const { historyState } = useSharedHistoryContext();
    const { config: { options: { debug, richText, showTreeView, autoFocusPlugin, tablePlugin, tableActionMenuPlugin, layoutPlugin, inlineImagePlugin, admonitionPlugin, links, autoLinkPlugin, checkListPlugin, listPlugin, codeHighlightPlugin, horizontalRulePlugin, markdownShortcutPlugin, floatingLinkEditorPlugin, floatingTextFormatToolbarPlugin, autoEmbedPlugin }, placeholderText, inlineImageUploadCollection } } = useEditorConfig();
    const onRef = useCallback((_floatingAnchorElem)=>{
        if (null != _floatingAnchorElem) setFloatingAnchorElem(_floatingAnchorElem);
    }, []);
    const richTextContentEditable = useMemo(()=>/*#__PURE__*/ jsx("div", {
            className: "editor-scroller",
            style: {
                minHeight: minHeight ?? '150px',
                maxHeight: maxHeight ?? void 0
            },
            children: /*#__PURE__*/ jsx("div", {
                className: "editor",
                ref: onRef,
                children: /*#__PURE__*/ jsx(ContentEditable, {})
            })
        }), [
        onRef,
        minHeight,
        maxHeight
    ]);
    const plainTextContentEditable = useMemo(()=>/*#__PURE__*/ jsx("div", {
            className: "editor-scroller",
            style: {
                minHeight: minHeight ?? '150px',
                maxHeight: maxHeight ?? void 0
            },
            children: /*#__PURE__*/ jsx("div", {
                className: "editor",
                children: /*#__PURE__*/ jsx(ContentEditable, {})
            })
        }), [
        minHeight,
        maxHeight
    ]);
    useEffect(()=>{
        const updateViewPortWidth = ()=>{
            const isNextSmallWidthViewport = CAN_USE_DOM && window.matchMedia('(max-width: 1025px)').matches;
            if (isNextSmallWidthViewport !== isSmallWidthViewport) setIsSmallWidthViewport(isNextSmallWidthViewport);
        };
        updateViewPortWidth();
        window.addEventListener('resize', updateViewPortWidth);
        return ()=>{
            window.removeEventListener('resize', updateViewPortWidth);
        };
    }, [
        isSmallWidthViewport
    ]);
    const content = /*#__PURE__*/ jsxs(Fragment, {
        children: [
            tablePlugin && /*#__PURE__*/ jsx(index_js_TablePlugin, {}),
            richText && /*#__PURE__*/ jsx(ToolbarPlugin, {}),
            /*#__PURE__*/ jsxs("div", {
                className: `editor-container ${showTreeView ? 'tree-view' : ''} ${!richText ? 'plain-text' : ''}`,
                children: [
                    autoFocusPlugin && /*#__PURE__*/ jsx(AutoFocusPlugin, {}),
                    links && /*#__PURE__*/ jsx(LinkPlugin, {}),
                    autoEmbedPlugin && /*#__PURE__*/ jsx(AutoEmbedPlugin, {}),
                    /*#__PURE__*/ jsx(TabIndentationPlugin, {}),
                    autoLinkPlugin && /*#__PURE__*/ jsx(AutoLinkPlugin, {}),
                    /*#__PURE__*/ jsx(OnChangePlugin, {
                        ignoreSelectionChange: true,
                        onChange: (editorState, editor, tags)=>{
                            if (tags.has(APPLY_VALUE_TAG)) return;
                            if (!tags.has('focus') || tags.size > 1) {
                                if (null != onChange) onChange(editorState, editor, tags);
                            }
                        }
                    }),
                    richText ? /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsx(RichTextPlugin, {
                                contentEditable: richTextContentEditable,
                                placeholder: /*#__PURE__*/ jsx(Placeholder, {
                                    children: placeholderText
                                }),
                                ErrorBoundary: LexicalErrorBoundary
                            }),
                            /*#__PURE__*/ jsx(HistoryPlugin, {
                                externalHistoryState: historyState
                            }),
                            inlineImagePlugin && /*#__PURE__*/ jsx(InlineImagePlugin, {
                                collection: inlineImageUploadCollection
                            }),
                            admonitionPlugin && /*#__PURE__*/ jsx(AdmonitionPlugin, {}),
                            checkListPlugin && /*#__PURE__*/ jsx(CheckListPlugin, {}),
                            listPlugin && /*#__PURE__*/ jsx(ListPlugin, {}),
                            codeHighlightPlugin && /*#__PURE__*/ jsx(CodeHighlightPlugin, {}),
                            horizontalRulePlugin && /*#__PURE__*/ jsx(HorizontalRulePlugin, {}),
                            layoutPlugin && /*#__PURE__*/ jsx(LayoutPlugin, {}),
                            autoEmbedPlugin && /*#__PURE__*/ jsx(YouTubePlugin, {}),
                            autoEmbedPlugin && /*#__PURE__*/ jsx(VimeoPlugin, {}),
                            markdownShortcutPlugin && /*#__PURE__*/ jsx(MarkdownShortcutPlugin, {
                                transformers: TRANSFORMERS
                            }),
                            tablePlugin && /*#__PURE__*/ jsx(TablePlugin, {
                                hasCellMerge: true,
                                hasCellBackgroundColor: true
                            }),
                            null != floatingAnchorElem && !isSmallWidthViewport && /*#__PURE__*/ jsxs(Fragment, {
                                children: [
                                    floatingLinkEditorPlugin && /*#__PURE__*/ jsx(FloatingLinkEditorPlugin, {
                                        anchorElem: floatingAnchorElem
                                    }),
                                    tableActionMenuPlugin && /*#__PURE__*/ jsx(TableActionMenuPlugin, {
                                        anchorElem: floatingAnchorElem,
                                        cellMerge: false
                                    }),
                                    floatingTextFormatToolbarPlugin && /*#__PURE__*/ jsx(FloatingTextFormatToolbarPlugin, {
                                        anchorElem: floatingAnchorElem
                                    })
                                ]
                            })
                        ]
                    }) : /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsx(PlainTextPlugin, {
                                contentEditable: plainTextContentEditable,
                                placeholder: /*#__PURE__*/ jsx(Placeholder, {
                                    children: placeholderText
                                }),
                                ErrorBoundary: LexicalErrorBoundary
                            }),
                            /*#__PURE__*/ jsx(HistoryPlugin, {
                                externalHistoryState: historyState
                            })
                        ]
                    }),
                    /*#__PURE__*/ jsx(ClearEditorPlugin, {}),
                    debug && /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsx(Debug, {}),
                            /*#__PURE__*/ jsx(TreeViewPlugin, {})
                        ]
                    })
                ]
            })
        ]
    });
    return content;
});
export { editor_Editor as Editor };
