"use client";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { Fragment as external_react_Fragment, useCallback, useEffect, useState } from "react";
import { $createCodeNode, $isCodeNode, CODE_LANGUAGE_FRIENDLY_NAME_MAP, CODE_LANGUAGE_MAP, getLanguageFriendlyName } from "@lexical/code";
import { $isListNode, INSERT_CHECK_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, ListNode, REMOVE_LIST_COMMAND } from "@lexical/list";
import { INSERT_EMBED_COMMAND } from "@lexical/react/LexicalAutoEmbedPlugin";
import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
import { $isDecoratorBlockNode } from "@lexical/react/LexicalDecoratorBlockNode";
import { INSERT_HORIZONTAL_RULE_COMMAND } from "@lexical/react/LexicalHorizontalRuleNode";
import { $createHeadingNode, $createQuoteNode, $isHeadingNode, $isQuoteNode } from "@lexical/rich-text";
import { $setBlocksType } from "@lexical/selection";
import { $isTableNode } from "@lexical/table";
import { $findMatchingParent, $getNearestBlockElementAncestorOrThrow, $getNearestNodeOfType, mergeRegister } from "@lexical/utils";
import { $createParagraphNode, $getNodeByKey, $getSelection, $isRangeSelection, $isRootOrShadowRoot, $isTextNode, CAN_REDO_COMMAND, CAN_UNDO_COMMAND, COMMAND_PRIORITY_CRITICAL, COMMAND_PRIORITY_NORMAL, FORMAT_ELEMENT_COMMAND, FORMAT_TEXT_COMMAND, INDENT_CONTENT_COMMAND, KEY_MODIFIER_COMMAND, OUTDENT_CONTENT_COMMAND, REDO_COMMAND, SELECTION_CHANGE_COMMAND, UNDO_COMMAND } from "lexical";
import { useEditorConfig } from "../../config/editor-config-context.js";
import { $isLinkNode, OPEN_LINK_MODAL_COMMAND, TOGGLE_LINK_COMMAND } from "../../nodes/link-nodes/index.js";
import { IS_APPLE } from "../../shared/environment.js";
import { useToolbarExtensions } from "../../toolbar-extensions.js";
import { DropDown, DropDownItem } from "../../ui/dropdown.js";
import { getSelectedNode } from "../../utils/getSelectedNode.js";
import { sanitizeUrl } from "../../utils/url.js";
import { OPEN_ADMONITION_MODAL_COMMAND } from "../admonition-plugin/index.js";
import { EmbedConfigs } from "../auto-embed-plugin/index.js";
import { OPEN_INLINE_IMAGE_MODAL_COMMAND } from "../inline-image-plugin/index.js";
import { OPEN_INSERT_LAYOUT_MODAL_COMMAND } from "../layout-plugin/layout-plugin.js";
import { OPEN_TABLE_MODAL_COMMAND } from "../table-plugin/index.js";
const blockTypeToBlockName = {
    bullet: 'Bulleted List',
    check: 'Check List',
    code: 'Code Block',
    h1: 'Heading 1',
    h2: 'Heading 2',
    h3: 'Heading 3',
    h4: 'Heading 4',
    h5: 'Heading 5',
    h6: 'Heading 6',
    number: 'Numbered List',
    paragraph: 'Normal',
    quote: 'Quote'
};
function getCodeLanguageOptions() {
    const options = [];
    for (const [lang, friendlyName] of Object.entries(CODE_LANGUAGE_FRIENDLY_NAME_MAP))options.push([
        lang,
        friendlyName
    ]);
    return options;
}
const CODE_LANGUAGE_OPTIONS = getCodeLanguageOptions();
function dropDownActiveClass(active) {
    if (active) return 'active dropdown-item-active';
    return '';
}
function BlockFormatDropDown({ editor, blockType, rootType, disabled = false }) {
    const { config: { options: { checkListPlugin, listPlugin, codeHighlightPlugin } } } = useEditorConfig();
    const formatParagraph = ()=>{
        editor.update(()=>{
            const selection = $getSelection();
            if ($isRangeSelection(selection)) $setBlocksType(selection, ()=>$createParagraphNode());
        });
    };
    const formatHeading = (headingSize)=>{
        if (blockType !== headingSize) editor.update(()=>{
            const selection = $getSelection();
            if ($isRangeSelection(selection)) $setBlocksType(selection, ()=>$createHeadingNode(headingSize));
        });
    };
    const formatBulletList = ()=>{
        if ('bullet' !== blockType) editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, void 0);
        else editor.dispatchCommand(REMOVE_LIST_COMMAND, void 0);
    };
    const formatCheckList = ()=>{
        if ('check' !== blockType) editor.dispatchCommand(INSERT_CHECK_LIST_COMMAND, void 0);
        else editor.dispatchCommand(REMOVE_LIST_COMMAND, void 0);
    };
    const formatNumberedList = ()=>{
        if ('number' !== blockType) editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, void 0);
        else editor.dispatchCommand(REMOVE_LIST_COMMAND, void 0);
    };
    const formatQuote = ()=>{
        if ('quote' !== blockType) editor.update(()=>{
            const selection = $getSelection();
            if ($isRangeSelection(selection)) $setBlocksType(selection, ()=>$createQuoteNode());
        });
    };
    const formatCode = ()=>{
        if ('code' !== blockType) editor.update(()=>{
            let selection = $getSelection();
            if ($isRangeSelection(selection)) if (selection.isCollapsed()) $setBlocksType(selection, ()=>$createCodeNode());
            else {
                const textContent = selection.getTextContent();
                const codeNode = $createCodeNode();
                selection.insertNodes([
                    codeNode
                ]);
                selection = $getSelection();
                if ($isRangeSelection(selection)) selection.insertRawText(textContent);
            }
        });
    };
    return /*#__PURE__*/ jsxs(DropDown, {
        disabled: disabled,
        buttonClassName: "toolbar-item block-controls",
        buttonIconClassName: `icon block-type ${blockType}`,
        buttonLabel: blockTypeToBlockName[blockType],
        buttonAriaLabel: "Formatting options for text style",
        children: [
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('paragraph' === blockType)}`,
                onClick: formatParagraph,
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon paragraph"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Normal"
                    })
                ]
            }),
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('h1' === blockType)}`,
                onClick: ()=>{
                    formatHeading('h1');
                },
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon h1"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Heading 1"
                    })
                ]
            }),
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('h2' === blockType)}`,
                onClick: ()=>{
                    formatHeading('h2');
                },
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon h2"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Heading 2"
                    })
                ]
            }),
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('h3' === blockType)}`,
                onClick: ()=>{
                    formatHeading('h3');
                },
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon h3"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Heading 3"
                    })
                ]
            }),
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('h4' === blockType)}`,
                onClick: ()=>{
                    formatHeading('h4');
                },
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon h4"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Heading 4"
                    })
                ]
            }),
            listPlugin && /*#__PURE__*/ jsxs(Fragment, {
                children: [
                    /*#__PURE__*/ jsxs(DropDownItem, {
                        className: `item ${dropDownActiveClass('bullet' === blockType)}`,
                        onClick: formatBulletList,
                        children: [
                            /*#__PURE__*/ jsx("i", {
                                className: "icon bullet-list"
                            }),
                            /*#__PURE__*/ jsx("span", {
                                className: "text",
                                children: "Bullet List"
                            })
                        ]
                    }),
                    /*#__PURE__*/ jsxs(DropDownItem, {
                        className: `item ${dropDownActiveClass('number' === blockType)}`,
                        onClick: formatNumberedList,
                        children: [
                            /*#__PURE__*/ jsx("i", {
                                className: "icon numbered-list"
                            }),
                            /*#__PURE__*/ jsx("span", {
                                className: "text",
                                children: "Numbered List"
                            })
                        ]
                    })
                ]
            }),
            checkListPlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('check' === blockType)}`,
                onClick: formatCheckList,
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon check-list"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Check List"
                    })
                ]
            }),
            /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('quote' === blockType)}`,
                onClick: formatQuote,
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon quote"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Quote"
                    })
                ]
            }),
            codeHighlightPlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                className: `item ${dropDownActiveClass('code' === blockType)}`,
                onClick: formatCode,
                children: [
                    /*#__PURE__*/ jsx("i", {
                        className: "icon code"
                    }),
                    /*#__PURE__*/ jsx("span", {
                        className: "text",
                        children: "Code Block"
                    })
                ]
            })
        ]
    });
}
function Divider() {
    return /*#__PURE__*/ jsx("div", {
        className: "divider"
    });
}
function ToolbarPlugin() {
    const [editor] = useLexicalComposerContext();
    const [activeEditor, setActiveEditor] = useState(editor);
    const [blockType, setBlockType] = useState('paragraph');
    const [rootType, setRootType] = useState('root');
    const [selectedElementKey, setSelectedElementKey] = useState(null);
    const [_toggleAiDrawerCommand, _setToggleAiDrawerCommand] = useState(null);
    const [isLink, setIsLink] = useState(false);
    const [isBold, setIsBold] = useState(false);
    const [isItalic, setIsItalic] = useState(false);
    const [isUnderline, setIsUnderline] = useState(false);
    const [isStrikethrough, setIsStrikethrough] = useState(false);
    const [isSubscript, setIsSubscript] = useState(false);
    const [isSuperscript, setIsSuperscript] = useState(false);
    const [isCode, setIsCode] = useState(false);
    const [canUndo, setCanUndo] = useState(false);
    const [canRedo, setCanRedo] = useState(false);
    const [isRTL, _setIsRTL] = useState(false);
    const [codeLanguage, setCodeLanguage] = useState('');
    const [isEditable, setIsEditable] = useState(()=>editor.isEditable());
    const { items: toolbarExtensionItems } = useToolbarExtensions();
    const { uuid, config: { options: { textAlignment, tablePlugin, inlineImagePlugin, admonitionPlugin, horizontalRulePlugin, layoutPlugin, autoEmbedPlugin, undoRedo, textStyle, inlineCode, links } } } = useEditorConfig();
    const $updateToolbar = useCallback(()=>{
        const selection = $getSelection();
        if ($isRangeSelection(selection)) {
            const anchorNode = selection.anchor.getNode();
            let element = 'root' === anchorNode.getKey() ? anchorNode : $findMatchingParent(anchorNode, (e)=>{
                const parent = e.getParent();
                return null !== parent && $isRootOrShadowRoot(parent);
            });
            if (null === element) element = anchorNode.getTopLevelElementOrThrow();
            const elementKey = element.getKey();
            const elementDOM = activeEditor.getElementByKey(elementKey);
            setIsBold(selection.hasFormat('bold'));
            setIsItalic(selection.hasFormat('italic'));
            setIsUnderline(selection.hasFormat('underline'));
            setIsStrikethrough(selection.hasFormat('strikethrough'));
            setIsSubscript(selection.hasFormat("subscript"));
            setIsSuperscript(selection.hasFormat("superscript"));
            setIsCode(selection.hasFormat('code'));
            const node = getSelectedNode(selection);
            const parent = node.getParent();
            $isLinkNode(parent) || $isLinkNode(node) ? setIsLink(true) : setIsLink(false);
            const tableNode = $findMatchingParent(node, $isTableNode);
            $isTableNode(tableNode) ? setRootType('table') : setRootType('root');
            if (null !== elementDOM) {
                setSelectedElementKey(elementKey);
                if ($isListNode(element)) {
                    const parentList = $getNearestNodeOfType(anchorNode, ListNode);
                    const type = null != parentList ? parentList.getListType() : element.getListType();
                    setBlockType(type);
                } else {
                    const type = $isHeadingNode(element) ? element.getTag() : element.getType();
                    if (type in blockTypeToBlockName) setBlockType(type);
                    if ($isCodeNode(element)) {
                        const language = element.getLanguage();
                        setCodeLanguage(null != language ? CODE_LANGUAGE_MAP[language] ?? language : '');
                    }
                }
            }
        }
    }, [
        activeEditor
    ]);
    useEffect(()=>editor.registerCommand(SELECTION_CHANGE_COMMAND, (_payload, newEditor)=>{
            $updateToolbar();
            setActiveEditor(newEditor);
            return false;
        }, COMMAND_PRIORITY_CRITICAL), [
        editor,
        $updateToolbar
    ]);
    useEffect(()=>mergeRegister(editor.registerEditableListener((editable)=>{
            setIsEditable(editable);
        }), activeEditor.registerUpdateListener(({ editorState })=>{
            editorState.read(()=>{
                $updateToolbar();
            });
        }), activeEditor.registerCommand(CAN_UNDO_COMMAND, (payload)=>{
            setCanUndo(payload);
            return false;
        }, COMMAND_PRIORITY_CRITICAL), activeEditor.registerCommand(CAN_REDO_COMMAND, (payload)=>{
            setCanRedo(payload);
            return false;
        }, COMMAND_PRIORITY_CRITICAL)), [
        $updateToolbar,
        activeEditor,
        editor
    ]);
    useEffect(()=>activeEditor.registerCommand(KEY_MODIFIER_COMMAND, (payload)=>{
            const event = payload;
            const { code, ctrlKey, metaKey } = event;
            if ('KeyK' === code && (ctrlKey || metaKey)) {
                event.preventDefault();
                return activeEditor.dispatchCommand(TOGGLE_LINK_COMMAND, sanitizeUrl('https://'));
            }
            return false;
        }, COMMAND_PRIORITY_NORMAL), [
        activeEditor
    ]);
    const clearFormatting = useCallback(()=>{
        activeEditor.update(()=>{
            const selection = $getSelection();
            if ($isRangeSelection(selection)) {
                const anchor = selection.anchor;
                const focus = selection.focus;
                const nodes = selection.getNodes();
                if (anchor.key === focus.key && anchor.offset === focus.offset) return;
                nodes.forEach((node, idx)=>{
                    if ($isTextNode(node)) {
                        let textNode = node;
                        if (0 === idx && 0 !== anchor.offset) textNode = textNode.splitText(anchor.offset)[1] ?? textNode;
                        if (idx === nodes.length - 1) textNode = textNode.splitText(focus.offset)[0] ?? textNode;
                        if ('' !== textNode.__style) textNode.setStyle('');
                        if (0 !== textNode.__format) {
                            textNode.setFormat(0);
                            $getNearestBlockElementAncestorOrThrow(textNode).setFormat('');
                        }
                    } else if ($isHeadingNode(node) || $isQuoteNode(node)) node.replace($createParagraphNode(), true);
                    else if ($isDecoratorBlockNode(node)) node.setFormat('');
                });
            }
        });
    }, [
        activeEditor
    ]);
    const insertLink = useCallback(()=>{
        if (isLink) editor.dispatchCommand(TOGGLE_LINK_COMMAND, null);
        else {
            const editorState = activeEditor.getEditorState();
            editorState.read(()=>{
                const selection = $getSelection();
                if ($isRangeSelection(selection)) {
                    if (selection.focus.offset !== selection.anchor.offset) {
                        const linkAttributes = {
                            linkType: 'custom',
                            url: 'https://'
                        };
                        editor.dispatchCommand(TOGGLE_LINK_COMMAND, linkAttributes);
                        editor.dispatchCommand(OPEN_LINK_MODAL_COMMAND, void 0);
                    }
                }
            });
        }
    }, [
        editor,
        isLink,
        activeEditor
    ]);
    const onCodeLanguageSelect = useCallback((value)=>{
        activeEditor.update(()=>{
            if (null !== selectedElementKey) {
                const node = $getNodeByKey(selectedElementKey);
                if ($isCodeNode(node)) node.setLanguage(value);
            }
        });
    }, [
        activeEditor,
        selectedElementKey
    ]);
    return /*#__PURE__*/ jsxs("div", {
        className: "toolbar",
        children: [
            undoRedo && /*#__PURE__*/ jsxs(Fragment, {
                children: [
                    /*#__PURE__*/ jsx("button", {
                        disabled: !canUndo || !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(UNDO_COMMAND, void 0);
                        },
                        title: IS_APPLE ? 'Undo (⌘Z)' : 'Undo (Ctrl+Z)',
                        type: "button",
                        className: "toolbar-item spaced",
                        "aria-label": "Undo",
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format undo"
                        })
                    }),
                    /*#__PURE__*/ jsx("button", {
                        disabled: !canRedo || !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(REDO_COMMAND, void 0);
                        },
                        title: IS_APPLE ? 'Redo (⌘Y)' : 'Redo (Ctrl+Y)',
                        type: "button",
                        className: "toolbar-item",
                        "aria-label": "Redo",
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format redo"
                        })
                    }),
                    /*#__PURE__*/ jsx(Divider, {})
                ]
            }),
            blockType in blockTypeToBlockName && activeEditor === editor && /*#__PURE__*/ jsxs(Fragment, {
                children: [
                    textStyle && /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsx(BlockFormatDropDown, {
                                disabled: !isEditable,
                                blockType: blockType,
                                rootType: rootType,
                                editor: editor
                            }),
                            /*#__PURE__*/ jsx(Divider, {})
                        ]
                    }),
                    textAlignment && /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsxs(DropDown, {
                                disabled: !isEditable,
                                buttonLabel: "Align",
                                buttonIconClassName: "icon left-align",
                                buttonClassName: "toolbar-item spaced alignment",
                                buttonAriaLabel: "Formatting options for text alignment",
                                children: [
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'left');
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon left-align"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Left Align"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'center');
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon center-align"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Center Align"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'right');
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon right-align"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Right Align"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(FORMAT_ELEMENT_COMMAND, 'justify');
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon justify-align"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Justify Align"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsx(Divider, {}),
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(OUTDENT_CONTENT_COMMAND, void 0);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: `icon ${isRTL ? 'indent' : 'outdent'}`
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Outdent"
                                            })
                                        ]
                                    }),
                                    /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(INDENT_CONTENT_COMMAND, void 0);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: `icon ${isRTL ? 'outdent' : 'indent'}`
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Indent"
                                            })
                                        ]
                                    })
                                ]
                            }),
                            /*#__PURE__*/ jsx(Divider, {})
                        ]
                    })
                ]
            }),
            'code' === blockType ? /*#__PURE__*/ jsx(DropDown, {
                disabled: !isEditable,
                buttonClassName: "toolbar-item code-language",
                buttonLabel: getLanguageFriendlyName(codeLanguage),
                buttonAriaLabel: "Select language",
                children: CODE_LANGUAGE_OPTIONS.map(([value, name])=>/*#__PURE__*/ jsx(DropDownItem, {
                        className: `item ${dropDownActiveClass(value === codeLanguage)}`,
                        onClick: ()=>{
                            onCodeLanguageSelect(value);
                        },
                        children: /*#__PURE__*/ jsx("span", {
                            className: "text",
                            children: name
                        })
                    }, value))
            }) : /*#__PURE__*/ jsxs(Fragment, {
                children: [
                    /*#__PURE__*/ jsx("button", {
                        disabled: !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, 'bold');
                        },
                        className: `toolbar-item spaced ${isBold ? 'active' : ''}`,
                        title: IS_APPLE ? 'Bold (⌘B)' : 'Bold (Ctrl+B)',
                        type: "button",
                        "aria-label": `Format text as bold. Shortcut: ${IS_APPLE ? '⌘B' : 'Ctrl+B'}`,
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format bold"
                        })
                    }),
                    /*#__PURE__*/ jsx("button", {
                        disabled: !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, 'italic');
                        },
                        className: `toolbar-item spaced ${isItalic ? 'active' : ''}`,
                        title: IS_APPLE ? 'Italic (⌘I)' : 'Italic (Ctrl+I)',
                        type: "button",
                        "aria-label": `Format text as italics. Shortcut: ${IS_APPLE ? '⌘I' : 'Ctrl+I'}`,
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format italic"
                        })
                    }),
                    /*#__PURE__*/ jsx("button", {
                        disabled: !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, 'underline');
                        },
                        className: `toolbar-item spaced ${isUnderline ? 'active' : ''}`,
                        title: IS_APPLE ? 'Underline (⌘U)' : 'Underline (Ctrl+U)',
                        type: "button",
                        "aria-label": `Format text to underlined. Shortcut: ${IS_APPLE ? '⌘U' : 'Ctrl+U'}`,
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format underline"
                        })
                    }),
                    inlineCode && /*#__PURE__*/ jsx("button", {
                        disabled: !isEditable,
                        onClick: ()=>{
                            activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, 'code');
                        },
                        className: `toolbar-item spaced ${isCode ? 'active' : ''}`,
                        title: "Insert code block",
                        type: "button",
                        "aria-label": "Insert code block",
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format code"
                        })
                    }),
                    links && /*#__PURE__*/ jsx("button", {
                        type: "button",
                        disabled: !isEditable,
                        onClick: insertLink,
                        className: `toolbar-item spaced ${isLink ? 'active' : ''}`,
                        "aria-label": "Insert link",
                        title: "Insert link",
                        children: /*#__PURE__*/ jsx("i", {
                            className: "format link"
                        })
                    }, "link"),
                    /*#__PURE__*/ jsxs(DropDown, {
                        disabled: !isEditable,
                        buttonClassName: "toolbar-item spaced",
                        buttonLabel: "",
                        buttonAriaLabel: "Formatting options for additional text styles",
                        buttonIconClassName: "icon dropdown-more",
                        children: [
                            /*#__PURE__*/ jsxs(DropDownItem, {
                                onClick: ()=>{
                                    activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, 'strikethrough');
                                },
                                className: `item ${dropDownActiveClass(isStrikethrough)}`,
                                title: "Strikethrough",
                                "aria-label": "Format text with a strikethrough",
                                children: [
                                    /*#__PURE__*/ jsx("i", {
                                        className: "icon strikethrough"
                                    }),
                                    /*#__PURE__*/ jsx("span", {
                                        className: "text",
                                        children: "Strikethrough"
                                    })
                                ]
                            }),
                            /*#__PURE__*/ jsxs(DropDownItem, {
                                onClick: ()=>{
                                    activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, "subscript");
                                },
                                className: `item ${dropDownActiveClass(isSubscript)}`,
                                title: "Subscript",
                                "aria-label": "Format text with a subscript",
                                children: [
                                    /*#__PURE__*/ jsx("i", {
                                        className: "icon subscript"
                                    }),
                                    /*#__PURE__*/ jsx("span", {
                                        className: "text",
                                        children: "Subscript"
                                    })
                                ]
                            }),
                            /*#__PURE__*/ jsxs(DropDownItem, {
                                onClick: ()=>{
                                    activeEditor.dispatchCommand(FORMAT_TEXT_COMMAND, "superscript");
                                },
                                className: `item ${dropDownActiveClass(isSuperscript)}`,
                                title: "Superscript",
                                "aria-label": "Format text with a superscript",
                                children: [
                                    /*#__PURE__*/ jsx("i", {
                                        className: "icon superscript"
                                    }),
                                    /*#__PURE__*/ jsx("span", {
                                        className: "text",
                                        children: "Superscript"
                                    })
                                ]
                            }),
                            /*#__PURE__*/ jsxs(DropDownItem, {
                                onClick: clearFormatting,
                                className: "item",
                                title: "Clear text formatting",
                                "aria-label": "Clear all text formatting",
                                children: [
                                    /*#__PURE__*/ jsx("i", {
                                        className: "icon clear"
                                    }),
                                    /*#__PURE__*/ jsx("span", {
                                        className: "text",
                                        children: "Clear Formatting"
                                    })
                                ]
                            })
                        ]
                    }),
                    activeEditor === editor && (horizontalRulePlugin || inlineImagePlugin || tablePlugin || admonitionPlugin) && /*#__PURE__*/ jsxs(Fragment, {
                        children: [
                            /*#__PURE__*/ jsx(Divider, {}),
                            /*#__PURE__*/ jsxs(DropDown, {
                                disabled: !isEditable,
                                buttonClassName: "toolbar-item spaced",
                                buttonLabel: "Insert",
                                buttonAriaLabel: "Insert specialized editor node",
                                buttonIconClassName: "icon plus",
                                children: [
                                    horizontalRulePlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(INSERT_HORIZONTAL_RULE_COMMAND, void 0);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon horizontal-rule"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Horizontal Rule"
                                            })
                                        ]
                                    }),
                                    layoutPlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(OPEN_INSERT_LAYOUT_MODAL_COMMAND, null);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon columns"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Columns Layout"
                                            })
                                        ]
                                    }),
                                    admonitionPlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(OPEN_ADMONITION_MODAL_COMMAND, null);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon admonition"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Admonition"
                                            })
                                        ]
                                    }),
                                    inlineImagePlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(OPEN_INLINE_IMAGE_MODAL_COMMAND, null);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon image"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Inline Image"
                                            })
                                        ]
                                    }),
                                    tablePlugin && /*#__PURE__*/ jsxs(DropDownItem, {
                                        onClick: ()=>{
                                            activeEditor.dispatchCommand(OPEN_TABLE_MODAL_COMMAND, null);
                                        },
                                        className: "item",
                                        children: [
                                            /*#__PURE__*/ jsx("i", {
                                                className: "icon table"
                                            }),
                                            /*#__PURE__*/ jsx("span", {
                                                className: "text",
                                                children: "Table"
                                            })
                                        ]
                                    }),
                                    autoEmbedPlugin && EmbedConfigs.map((embedConfig)=>/*#__PURE__*/ jsxs(DropDownItem, {
                                            onClick: ()=>{
                                                activeEditor.dispatchCommand(INSERT_EMBED_COMMAND, embedConfig.type);
                                            },
                                            className: "item",
                                            children: [
                                                embedConfig.icon,
                                                /*#__PURE__*/ jsx("span", {
                                                    className: "text",
                                                    children: embedConfig.contentName
                                                })
                                            ]
                                        }, embedConfig.type))
                                ]
                            })
                        ]
                    })
                ]
            }),
            toolbarExtensionItems.slice().sort((a, b)=>(a.order ?? 0) - (b.order ?? 0)).map((item)=>/*#__PURE__*/ jsx(external_react_Fragment, {
                    children: item.node
                }, item.id))
        ]
    });
}
export { ToolbarPlugin };
