"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.EditBlockControls = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const icons_1 = require("@gravity-ui/icons");
const uikit_1 = require("@gravity-ui/uikit");
const utils_1 = require("../../../utils/index.js");
const b = (0, utils_1.block)('edit-block');
var EditBlockControls;
(function (EditBlockControls) {
    EditBlockControls["Up"] = "up";
    EditBlockControls["Down"] = "down";
    EditBlockControls["Copy"] = "copy";
    EditBlockControls["Delete"] = "delete";
})(EditBlockControls || (exports.EditBlockControls = EditBlockControls = {}));
const actionsOrder = [
    EditBlockControls.Up,
    EditBlockControls.Down,
    EditBlockControls.Copy,
    EditBlockControls.Delete,
];
const editBlockControlsIcons = {
    [EditBlockControls.Up]: icons_1.ChevronUp,
    [EditBlockControls.Down]: icons_1.ChevronDown,
    [EditBlockControls.Copy]: icons_1.Copy,
    [EditBlockControls.Delete]: icons_1.TrashBin,
};
const EditBlock = ({ actions, isActive, onSelect, isHeader, children }) => {
    const ref = React.useRef(null);
    const stopPropagationProps = React.useMemo(() => ({ onClick: (e) => e.stopPropagation() }), []);
    const { onKeyDown } = (0, uikit_1.useActionHandlers)(onSelect);
    React.useEffect(() => {
        if (isActive && ref.current) {
            //TODO: add behavior 'smooth' after addiiton of dynamic form layout open/close managing support
            ref.current.scrollIntoView({ block: 'center' });
        }
    }, [isActive]);
    return ((0, jsx_runtime_1.jsxs)("div", { className: b({ active: isActive }), onClick: onSelect, onKeyDown: onKeyDown, ref: ref, role: "button", "aria-current": isActive, tabIndex: 0, children: [(0, jsx_runtime_1.jsx)("div", { className: b('controls', {
                    active: isActive,
                    isHeader,
                }), children: isActive && ((0, jsx_runtime_1.jsx)("div", { className: b('controls-content'), ...stopPropagationProps, children: actionsOrder.map((action) => {
                        const Icon = editBlockControlsIcons[action];
                        return actions[action] ? ((0, jsx_runtime_1.jsx)("button", { className: b('control'), onClick: actions[action], children: (0, jsx_runtime_1.jsx)(Icon, {}) }, action)) : null;
                    }) })) }), children] }));
};
exports.default = React.memo(EditBlock);
//# sourceMappingURL=EditBlock.js.map
