"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Selection = exports.SelectionBox = void 0;
var Helpers_1 = require("./Helpers");
var hooks_1 = require("../../hooks");
var ResizeHandler_1 = require("./ResizeHandler");
var reactive_vue_1 = require("@formily/reactive-vue");
var vue_demi_1 = require("vue-demi");
var __builtins__1 = require("@jeamn/formily-components/src/__builtins__");
var runtime_dom_1 = require("@vue/runtime-dom");
var shared_1 = require("@designable/shared");
var TranslateHandler_1 = require("./TranslateHandler");
exports.SelectionBox = (0, vue_demi_1.defineComponent)({
    name: 'SelectionBox',
    inheritAttrs: false,
    props: ['node', 'showHelpers'],
    setup: function (props, _a) {
        var attrs = _a.attrs;
        var designerRef = (0, hooks_1.useDesigner)();
        var prefixRef = (0, hooks_1.usePrefix)('aux-selection-box');
        var innerPrefixRef = (0, hooks_1.usePrefix)('aux-selection-box-inner');
        var nodeRectRef = (0, hooks_1.useValidNodeOffsetRect)((0, runtime_dom_1.toRef)(props, 'node'));
        return function () {
            var _a;
            var _b;
            var innerPrefix = innerPrefixRef.value;
            var designer = designerRef.value;
            var nodeRect = nodeRectRef.value;
            var createSelectionStyle = function () {
                var baseStyle = {
                    position: 'absolute',
                    top: 0,
                    left: 0,
                    boxSizing: 'border-box',
                    zIndex: 4,
                };
                if (nodeRect) {
                    baseStyle.transform = "perspective(1px) translate3d(".concat(nodeRect.x, "px,").concat(nodeRect.y, "px,0)");
                    baseStyle.height = (0, shared_1.isNum)(nodeRect.height)
                        ? nodeRect.height + 'px'
                        : nodeRect.height;
                    baseStyle.width = (0, shared_1.isNum)(nodeRect.width)
                        ? nodeRect.width + 'px'
                        : nodeRect.width;
                }
                return baseStyle;
            };
            if (!nodeRect)
                return null;
            if (!nodeRect.width || !nodeRect.height)
                return null;
            var selectionId = (_a = {},
                _a[(_b = designer.props) === null || _b === void 0 ? void 0 : _b.nodeSelectionIdAttrName] = props.node.id,
                _a);
            return (<div {...selectionId} class={prefixRef.value} style={createSelectionStyle()}>
          <div class={innerPrefix}></div>
          <ResizeHandler_1.ResizeHandler node={props.node}/>
          <TranslateHandler_1.TranslateHandler node={props.node}/>
          {props.showHelpers && (<Helpers_1.Helpers {...attrs} key={JSON.stringify(nodeRect.toJSON())} node={props.node} nodeRect={nodeRect}/>)}
        </div>);
        };
    },
});
var SelectionComponent = (0, reactive_vue_1.observer)((0, vue_demi_1.defineComponent)({
    name: 'Selection',
    setup: function () {
        var selectionRef = (0, hooks_1.useSelection)();
        var treeRef = (0, hooks_1.useTree)();
        var cursorRef = (0, hooks_1.useCursor)();
        var viewportDragonRef = (0, hooks_1.useDragon)();
        return function () {
            if (cursorRef.value.status !== 'NORMAL' &&
                viewportDragonRef.value.touchNode)
                return null;
            return (<>
            {selectionRef.value.selected.map(function (id) {
                    var node = treeRef.value.findById(id);
                    if (!node)
                        return;
                    if (node.hidden)
                        return;
                    return (<exports.SelectionBox {...{
                        key: id,
                        node: node,
                        showHelpers: selectionRef.value.selected.length === 1,
                    }} key={id}/>);
                })}
          </>);
        };
    },
}));
exports.Selection = (0, __builtins__1.composeExport)(SelectionComponent, {
    displayName: 'Selection',
});
//# sourceMappingURL=Selection.jsx.map