"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ToolbarSelect = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const uikit_1 = require("@gravity-ui/uikit");
const classname_1 = require("../../classname.js");
const lodash_1 = require("../../lodash.js");
const PreviewTooltip_1 = require("../../toolbar/PreviewTooltip.js");
require("./ToolbarSelect.css");
const b = (0, classname_1.cn)('toolbar-select');
const ToolbarSelect = ({ disablePortal, className, editor, focus, onClick, items, }) => {
    const activeItem = items.find((item) => item.isActive(editor));
    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "m", view: "clear", className: className, disablePortal: disablePortal, onOpenChange: focus, value: activeItem ? [activeItem.id] : undefined, options: items.map((item) => ({
                data: item,
                value: item.id,
                text: (0, lodash_1.isFunction)(item.title) ? item.title() : item.title,
            })), renderOption: ({ text, data }) => {
                const { icon, hotkey, hint, preview } = data;
                const hintText = (0, lodash_1.isFunction)(hint) ? hint() : hint;
                return ((0, jsx_runtime_1.jsx)(PreviewTooltip_1.PreviewTooltip, { preview: preview, children: (0, jsx_runtime_1.jsxs)("div", { "aria-label": text, className: b('item'), children: [(0, jsx_runtime_1.jsx)("div", { className: b('item-icon'), children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icon.data, size: Number(icon.size ?? 16) + 2 }) }), (0, jsx_runtime_1.jsxs)("div", { className: b('item-content'), children: [text, (0, jsx_runtime_1.jsxs)("div", { className: b('item-extra'), children: [hotkey && (0, jsx_runtime_1.jsx)(uikit_1.Hotkey, { value: hotkey }), hintText && ((0, jsx_runtime_1.jsx)(uikit_1.HelpMark, { popoverProps: { modal: false }, className: b('item-hint'), children: hintText }))] })] })] }) }));
            }, onUpdate: ([id]) => {
                items.find((item) => item.id === id)?.exec(editor);
                onClick?.(id);
                focus();
            } }) }));
};
exports.ToolbarSelect = ToolbarSelect;
//# sourceMappingURL=ToolbarSelect.js.map
