var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
/*
This file is part of the Notesnook project (https://notesnook.com/)

Copyright (C) 2023 Streetwriters (Private) Limited

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/
import { Flex } from "@theme-ui/components";
import { getDefaultPresets, STATIC_TOOLBAR_GROUPS, MOBILE_STATIC_TOOLBAR_GROUPS, READONLY_MOBILE_STATIC_TOOLBAR_GROUPS } from "./tool-definitions";
import { useEffect, useMemo } from "react";
import { ToolbarGroup } from "./components/toolbar-group";
import { EditorFloatingMenus } from "./floating-menus";
import { useIsMobile, useToolbarStore } from "./stores/toolbar-store";
export function Toolbar(props) {
    const { editor, location, tools = getDefaultPresets().default, defaultFontFamily, defaultFontSize, sx, className = "" } = props, flexProps = __rest(props, ["editor", "location", "tools", "defaultFontFamily", "defaultFontSize", "sx", "className"]);
    const isMobile = useIsMobile();
    const toolbarTools = useMemo(() => isMobile
        ? editor.isEditable
            ? [...MOBILE_STATIC_TOOLBAR_GROUPS, ...tools]
            : READONLY_MOBILE_STATIC_TOOLBAR_GROUPS
        : editor.isEditable
            ? [...STATIC_TOOLBAR_GROUPS, ...tools]
            : [], [tools, editor.isEditable, isMobile]);
    const setToolbarLocation = useToolbarStore((store) => store.setToolbarLocation);
    const setDefaultFontFamily = useToolbarStore((store) => store.setFontFamily);
    const setDefaultFontSize = useToolbarStore((store) => store.setFontSize);
    useEffect(() => {
        setToolbarLocation(location);
    }, [location, setToolbarLocation]);
    useEffect(() => {
        setDefaultFontFamily(defaultFontFamily);
        setDefaultFontSize(defaultFontSize);
    }, [
        defaultFontFamily,
        defaultFontSize,
        setDefaultFontFamily,
        setDefaultFontSize
    ]);
    return (_jsxs(_Fragment, { children: [_jsx(Flex, Object.assign({ className: ["editor-toolbar", className].join(" "), sx: Object.assign({ flexWrap: isMobile ? "nowrap" : "wrap", overflowX: isMobile ? "auto" : "hidden", bg: "background", borderRadius: isMobile ? "0px" : "default" }, sx) }, flexProps, { children: toolbarTools.map((tools) => {
                    return (_jsx(ToolbarGroup, { tools: tools, editor: editor, sx: {
                            borderRight: "1px solid var(--separator)",
                            ":last-of-type": { borderRight: "none" },
                            alignItems: "center"
                        } }, tools.join("")));
                }) })), _jsx(EditorFloatingMenus, { editor: editor })] }));
}
