"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.Insertion = exports.InsertionComponent = void 0;
var hooks_1 = require("../../hooks");
var core_1 = require("@designable/core");
var reactive_vue_1 = require("@formily/reactive-vue");
var __builtins__1 = require("@jeamn/formily-components/src/__builtins__");
var vue_demi_1 = require("vue-demi");
var shared_1 = require("@designable/shared");
exports.InsertionComponent = (0, reactive_vue_1.observer)((0, vue_demi_1.defineComponent)({
    name: 'Insertion',
    props: [],
    setup: function () {
        var viewportDragon = (0, hooks_1.useDragon)();
        var prefix = (0, hooks_1.usePrefix)('aux-insertion');
        return function () {
            var createInsertionStyle = function () {
                var closestDirection = viewportDragon.value.closestDirection;
                var closestRect = viewportDragon.value.closestOffsetRect;
                var isInlineLayout = viewportDragon.value.getClosestLayout() === 'horizontal';
                var baseStyle = {
                    position: 'absolute',
                    transform: 'perspective(1px) translate3d(0,0,0)',
                    top: 0,
                    left: 0,
                };
                if (!closestRect)
                    return baseStyle;
                if (closestDirection === core_1.ClosestPosition.Before ||
                    closestDirection === core_1.ClosestPosition.ForbidBefore) {
                    baseStyle.width = 2;
                    baseStyle.height = closestRect.height;
                    baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x, "px,").concat(closestRect.y, "px,0)");
                }
                else if (closestDirection === core_1.ClosestPosition.After ||
                    closestDirection === core_1.ClosestPosition.ForbidAfter) {
                    baseStyle.width = 2;
                    baseStyle.height = closestRect.height;
                    baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x + closestRect.width - 2, "px,").concat(closestRect.y, "px,0)");
                }
                else if (closestDirection === core_1.ClosestPosition.InnerAfter ||
                    closestDirection === core_1.ClosestPosition.Under ||
                    closestDirection === core_1.ClosestPosition.ForbidInnerAfter ||
                    closestDirection === core_1.ClosestPosition.ForbidUnder) {
                    if (isInlineLayout) {
                        baseStyle.width = 2;
                        baseStyle.height = closestRect.height;
                        baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x + closestRect.width - 2, "px,").concat(closestRect.y, "px,0)");
                    }
                    else {
                        baseStyle.width = closestRect.width;
                        baseStyle.height = 2;
                        baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x, "px,").concat(closestRect.y + closestRect.height - 2, "px,0)");
                    }
                }
                else if (closestDirection === core_1.ClosestPosition.InnerBefore ||
                    closestDirection === core_1.ClosestPosition.Upper ||
                    closestDirection === core_1.ClosestPosition.ForbidInnerBefore ||
                    closestDirection === core_1.ClosestPosition.ForbidUpper) {
                    if (isInlineLayout) {
                        baseStyle.width = 2;
                        baseStyle.height = closestRect.height;
                        baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x, "px,").concat(closestRect.y, "px,0)");
                    }
                    else {
                        baseStyle.width = closestRect.width;
                        baseStyle.height = 2;
                        baseStyle.transform = "perspective(1px) translate3d(".concat(closestRect.x, "px,").concat(closestRect.y, "px,0)");
                    }
                }
                if (closestDirection.includes('FORBID')) {
                    baseStyle.backgroundColor = 'red';
                }
                Object.keys(baseStyle).forEach(function (key) {
                    var value = baseStyle[key];
                    (0, shared_1.isNum)(value) && (baseStyle[key] = value + 'px');
                });
                return baseStyle;
            };
            return <div class={prefix.value} style={createInsertionStyle()}></div>;
        };
    },
}));
exports.Insertion = (0, __builtins__1.composeExport)(exports.InsertionComponent, {
    displayName: 'Insertion',
});
//# sourceMappingURL=Insertion.jsx.map