"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ViewPanel = void 0;
var reactive_vue_1 = require("@formily/reactive-vue");
var hooks_1 = require("../hooks");
var containers_1 = require("../containers");
var vue_demi_1 = require("vue-demi");
// export interface IViewPanelProps {
//   type: WorkbenchTypes
//   children: (
//     tree: TreeNode,
//     onChange: (tree: ITreeNode) => void
//   ) => React.ReactElement
//   scrollable?: boolean
//   dragTipsDirection?: 'left' | 'right'
// }
var ViewPanelComponent = (0, vue_demi_1.defineComponent)({
    name: 'DnViewPanel',
    props: {
        type: String,
        scrollable: { type: Boolean, default: true },
        dragTipsDirection: { type: String },
    },
    setup: function (props, _a) {
        var slots = _a.slots;
        // const visible = ref(true)
        var workbenchRef = (0, hooks_1.useWorkbench)();
        var treeRef = (0, hooks_1.useTree)();
        // onMounted(() => {
        //   if (workbenchRef.value.type === props.type) {
        //     requestIdle(() => {
        //       requestAnimationFrame(() => {
        //         visible.value = true
        //       })
        //     })
        //   } else {
        //     visible.value = false
        //   }
        // })
        return function () {
            if (workbenchRef.value.type !== props.type)
                return null;
            var render = function () {
                var _a;
                return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots, treeRef.value, function (payload) {
                    treeRef.value.from(payload);
                    treeRef.value.takeSnapshot();
                });
            };
            if (workbenchRef.value.type === 'DESIGNABLE') {
                return (<containers_1.Viewport {...{ dragTipsDirection: props.dragTipsDirection }}>
            {render()}
          </containers_1.Viewport>);
            }
            return (<div style={{
                    overflow: props.scrollable ? 'overlay' : 'hidden',
                    height: '100%',
                    cursor: 'auto',
                    userSelect: 'text',
                }}>
          {render()}
        </div>);
        };
    },
});
exports.ViewPanel = (0, reactive_vue_1.observer)(ViewPanelComponent);
//# sourceMappingURL=ViewPanel.jsx.map