"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.FloatingMenuControl = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const icons_1 = require("@gravity-ui/icons");
const uikit_1 = require("@gravity-ui/uikit");
const yfm_table_1 = require("../../../../../../../i18n/yfm-table/index.js");
const CellBgMenuItem_1 = require("../CellBgMenuItem/index.js");
const FloatingMenu_1 = require("../FloatingMenu/FloatingMenu.js");
const FloatingMenuControl = function YfmTableFloatingMenuControl({ type, multiple, dndHandler, cellElement, tableElement, onMenuOpenToggle, onClearCellsClick, onInsertBeforeClick, onInsertAfterClick, onRemoveRangeClick, onRemoveTableClick, isRowHeader = false, onRowHeaderChange, currentCellBg, onCellBgChange, }) {
    const dropdownContent = ((0, jsx_runtime_1.jsxs)(uikit_1.Menu, { qa: `g-md-yfm-table-${type}-menu`, children: [(onRowHeaderChange || onCellBgChange) && ((0, jsx_runtime_1.jsxs)(uikit_1.Menu.Group, { children: [onRowHeaderChange && ((0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: "g-md-yfm-table-row-header-toggle", iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.LayoutHeader }), text: (0, jsx_runtime_1.jsxs)(uikit_1.Flex, { gap: 4, alignItems: "center", justifyContent: "space-between", children: [(0, yfm_table_1.i18n)(`row.header${multiple ? '.multiple' : ''}`), (0, jsx_runtime_1.jsx)(uikit_1.Switch, { size: "m", checked: isRowHeader, 
                                    // pointerEvents:none prevents the Switch's label from generating
                                    // a synthetic click on its <input>, which would trigger action twice
                                    style: { pointerEvents: 'none' } })] }), action: () => onRowHeaderChange(!isRowHeader) })), onCellBgChange && ((0, jsx_runtime_1.jsx)(CellBgMenuItem_1.CellBgMenuItem, { qa: `g-md-yfm-table-${type}-cell-bg`, currentCellBg: currentCellBg, onCellBgChange: onCellBgChange }))] })), (0, jsx_runtime_1.jsxs)(uikit_1.Menu.Group, { children: [(0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: `g-md-yfm-table-action-add-${type}-before`, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: type === 'row' ? icons_1.ArrowShapeUpFromLine : icons_1.ArrowShapeLeftFromLine }), text: (0, yfm_table_1.i18n)(`${type}.add.before`), action: onInsertBeforeClick }), (0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: `g-md-yfm-table-action-add-${type}-after`, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: type === 'row' ? icons_1.ArrowShapeDownFromLine : icons_1.ArrowShapeRightFromLine }), text: (0, yfm_table_1.i18n)(`${type}.add.after`), action: onInsertAfterClick }), (0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: `g-md-yfm-table-${type}-clear-cells`, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.BroomMotion }), text: (0, yfm_table_1.i18n)('cells.clear'), action: onClearCellsClick })] }), (0, jsx_runtime_1.jsxs)(uikit_1.Menu.Group, { children: [(0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: `g-md-yfm-table-action-remove-${type}`, iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Xmark }), text: (0, yfm_table_1.i18n)(`${type}.remove${multiple ? '.multiple' : ''}`), action: onRemoveRangeClick }), (0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu.Item, { qa: "g-md-yfm-table-action-remove-table", theme: "danger", iconStart: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.TrashBin }), text: (0, yfm_table_1.i18n)('table.remove'), action: onRemoveTableClick })] })] }));
    const anchor = (0, react_1.useMemo)(() => getVirtualAnchor(type, tableElement, cellElement), [type, tableElement, cellElement]);
    return ((0, jsx_runtime_1.jsx)(FloatingMenu_1.FloatingMenu, { dirtype: type, canDrag: dndHandler ? dndHandler.canDrag() : false, onOpenToggle: onMenuOpenToggle, anchorElement: anchor, switcherMouseProps: dndHandler
            ? {
                onMouseLeave: dndHandler.control_handleMouseLeave,
                onMouseDown: dndHandler.control_handleMouseDown,
                onMouseMove: dndHandler.control_handleMouseMove,
                onMouseUp: dndHandler.control_handleMouseUp,
            }
            : undefined, children: dropdownContent }));
};
exports.FloatingMenuControl = FloatingMenuControl;
function getVirtualAnchor(type, tableElem, cellElem) {
    if (type === 'row') {
        return {
            contextElement: cellElem,
            getBoundingClientRect() {
                const cellRect = cellElem.getBoundingClientRect();
                const tableRect = tableElem.getBoundingClientRect().toJSON();
                {
                    // fix table rect
                    tableRect.x += 1;
                    tableRect.width -= 2;
                    tableRect.left += 1;
                    tableRect.right -= 1;
                }
                return {
                    // from table
                    x: tableRect.x,
                    width: tableRect.width,
                    left: tableRect.left,
                    right: tableRect.right,
                    // from cell
                    y: cellRect.y,
                    height: cellRect.height,
                    top: cellRect.top,
                    bottom: cellRect.top,
                };
            },
        };
    }
    if (type === 'column') {
        return {
            contextElement: cellElem,
            getBoundingClientRect() {
                const cellRect = cellElem.getBoundingClientRect().toJSON();
                const tableRect = tableElem.getBoundingClientRect();
                const EDGE_OFFSET = 16;
                const cellMiddle = cellRect.x + cellRect.width / 2;
                // left border of table
                if (cellMiddle - EDGE_OFFSET <= tableRect.left) {
                    const visible = cellRect.right - tableRect.left;
                    cellRect.width = (visible - EDGE_OFFSET) * 2;
                    cellRect.left = cellRect.right - cellRect.width;
                    cellRect.x = cellRect.left;
                }
                // right border of table
                if (cellMiddle + EDGE_OFFSET >= tableRect.right) {
                    const visible = tableRect.right - cellRect.left;
                    cellRect.width = (visible - EDGE_OFFSET) * 2;
                    cellRect.right = cellRect.left + cellRect.width;
                }
                return cellRect;
            },
        };
    }
    throw new Error(`Unknown control type: ${type}`);
}
//# sourceMappingURL=FloatingMenuControl.js.map
