"use strict";
var __webpack_require__ = {};
(()=>{
    __webpack_require__.d = (exports1, definition)=>{
        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
            enumerable: true,
            get: definition[key]
        });
    };
})();
(()=>{
    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
    __webpack_require__.r = (exports1)=>{
        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
            value: 'Module'
        });
        Object.defineProperty(exports1, '__esModule', {
            value: true
        });
    };
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
    BaseCanvas: ()=>BaseCanvas_BaseCanvas
});
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
const external_react_namespaceObject = require("react");
const ToolbarActionContext_cjs_namespaceObject = require("../../hooks/ToolbarActionContext.cjs");
const external_BaseCanvas_constants_cjs_namespaceObject = require("./BaseCanvas.constants.cjs");
const external_BaseCanvas_hooks_cjs_namespaceObject = require("./BaseCanvas.hooks.cjs");
const external_CanvasBackground_cjs_namespaceObject = require("./CanvasBackground.cjs");
const external_CanvasProviders_cjs_namespaceObject = require("./CanvasProviders.cjs");
const external_PanShortcutTeachingUI_cjs_namespaceObject = require("./PanShortcutTeachingUI.cjs");
const BaseCanvasInnerComponent = (props)=>{
    const { innerRef, fitViewOptions: fitViewOptionsProps, ...canvasProps } = props;
    const fitViewOptions = fitViewOptionsProps ?? external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.fitViewOptions;
    const { nodes = [], edges = [], nodeTypes, edgeTypes, children, mode = 'view', showBackground = true, backgroundColor = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.background.color, backgroundSecondaryColor = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.background.bgColor, backgroundVariant = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.background.variant, backgroundGap = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.background.gap, backgroundSize = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.background.size, isDarkMode, minZoom = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.zoom.min, maxZoom = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.zoom.max, defaultViewport = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.defaultViewport, defaultEdgeOptions = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.edge, onNodesChange, onEdgesChange, onConnect, onConnectStart, onConnectEnd, onNodeClick, onNodeDragStart, onNodeDrag, onNodeDragStop, onPaneClick, onInit, onSelectionChange, proOptions = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.pro, connectionMode = react_cjs_namespaceObject.ConnectionMode.Loose, connectionLineComponent, connectionLineStyle, deleteKeyCode = null, selectNodesOnDrag = true, nodesDraggable = true, nodesConnectable = true, elementsSelectable = true, onlyRenderVisibleElements = true, zoomOnDoubleClick = true, snapToGrid = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.snapToGrid, snapGrid = external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.snapGrid, initialAutoLayout, maintainNodesInView, onToolbarAction, breakpoints, panShortcutTeachingUIMessage = 'Hold Space and drag to pan around the canvas!', ...reactFlowProps } = canvasProps;
    const isInteractive = 'readonly' !== mode;
    const isDesignMode = 'design' === mode;
    const [reactFlowInstance, setReactFlowInstance] = (0, external_react_namespaceObject.useState)();
    const { isReady } = (0, external_BaseCanvas_hooks_cjs_namespaceObject.useAutoLayout)(nodes, initialAutoLayout, fitViewOptions);
    const { ensureNodesInView, ensureAllNodesInView, centerNode } = (0, external_BaseCanvas_hooks_cjs_namespaceObject.useEnsureNodesInView)();
    (0, external_BaseCanvas_hooks_cjs_namespaceObject.useMaintainNodesInView)(maintainNodesInView, fitViewOptions);
    (0, ToolbarActionContext_cjs_namespaceObject.useToolbarActionStore)(mode, onToolbarAction, breakpoints);
    const handleInit = (0, external_react_namespaceObject.useCallback)((instance)=>{
        setReactFlowInstance(instance);
        onInit?.(instance);
    }, [
        onInit
    ]);
    (0, external_react_namespaceObject.useImperativeHandle)(innerRef, ()=>({
            ensureNodesInView,
            ensureAllNodesInView,
            centerNode,
            reactFlow: reactFlowInstance
        }), [
        ensureNodesInView,
        ensureAllNodesInView,
        centerNode,
        reactFlowInstance
    ]);
    const reactFlowStyle = (0, external_react_namespaceObject.useMemo)(()=>({
            opacity: isReady ? 1 : 0,
            transition: external_BaseCanvas_constants_cjs_namespaceObject.BASE_CANVAS_DEFAULTS.transitions.opacity
        }), [
        isReady
    ]);
    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasProviders_cjs_namespaceObject.CanvasProviders, {
        nodes: nodes,
        edges: edges,
        mode: mode,
        isDarkMode: isDarkMode,
        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_cjs_namespaceObject.ReactFlow, {
            ...reactFlowProps,
            colorMode: '',
            nodes: nodes,
            edges: edges,
            nodeTypes: nodeTypes,
            edgeTypes: edgeTypes,
            fitViewOptions: fitViewOptions,
            defaultEdgeOptions: defaultEdgeOptions,
            defaultViewport: defaultViewport,
            proOptions: proOptions,
            connectionMode: connectionMode,
            connectionLineComponent: connectionLineComponent,
            connectionLineStyle: connectionLineStyle,
            deleteKeyCode: isDesignMode ? deleteKeyCode : null,
            selectNodesOnDrag: isInteractive && selectNodesOnDrag,
            nodesDraggable: isDesignMode && nodesDraggable,
            nodesConnectable: isDesignMode && nodesConnectable,
            elementsSelectable: isInteractive && elementsSelectable,
            onlyRenderVisibleElements: onlyRenderVisibleElements,
            snapToGrid: snapToGrid,
            snapGrid: snapGrid,
            minZoom: minZoom,
            maxZoom: maxZoom,
            panOnScroll: isInteractive,
            zoomOnScroll: isInteractive,
            zoomOnDoubleClick: isInteractive && zoomOnDoubleClick,
            panOnDrag: isInteractive ? external_BaseCanvas_constants_cjs_namespaceObject.PAN_ON_DRAG : false,
            onInit: handleInit,
            onNodesChange: isInteractive ? onNodesChange : void 0,
            onEdgesChange: isInteractive ? onEdgesChange : void 0,
            onConnect: isDesignMode ? onConnect : void 0,
            onConnectStart: isDesignMode ? onConnectStart : void 0,
            onConnectEnd: isDesignMode ? onConnectEnd : void 0,
            onNodeClick: isInteractive ? onNodeClick : void 0,
            onNodeDragStart: isDesignMode ? onNodeDragStart : void 0,
            onNodeDrag: isDesignMode ? onNodeDrag : void 0,
            onNodeDragStop: isDesignMode ? onNodeDragStop : void 0,
            onPaneClick: isInteractive ? onPaneClick : void 0,
            onSelectionChange: onSelectionChange,
            style: reactFlowStyle,
            elevateEdgesOnSelect: isDesignMode,
            children: [
                showBackground && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasBackground_cjs_namespaceObject.CanvasBackground, {
                    color: backgroundColor,
                    bgColor: backgroundSecondaryColor,
                    variant: backgroundVariant,
                    gap: backgroundGap,
                    size: backgroundSize
                }),
                'design' === mode && panShortcutTeachingUIMessage && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_PanShortcutTeachingUI_cjs_namespaceObject.PanShortcutTeachingUI, {
                    message: panShortcutTeachingUIMessage
                }),
                children
            ]
        })
    });
};
const BaseCanvasInner = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(BaseCanvasInnerComponent);
const BaseCanvas_BaseCanvas = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function(props, ref) {
    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(BaseCanvasInner, {
        ...props,
        innerRef: ref
    });
});
exports.BaseCanvas = __webpack_exports__.BaseCanvas;
for(var __rspack_i in __webpack_exports__)if (-1 === [
    "BaseCanvas"
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
Object.defineProperty(exports, '__esModule', {
    value: true
});
