@rxflow/base 0.0.1-alpha.0

package/README.md

@@ -0,0 +1,44 @@
+# @rxflow/base
+
+核心 Flow 组件库，提供基础的 Flow 组件、hooks 和工具函数。
+
+## 安装
+
+```bash
+npm install @rxflow/base
+# or
+pnpm add @rxflow/base
+```
+
+## 使用
+
+```tsx
+import BaseFlow from '@rxflow/base';
+import { useNodes, useEdges } from '@rxflow/base';
+
+function App() {
+  return (
+    <BaseFlow
+      nodes={nodes}
+      edges={edges}
+      // ... other props
+    />
+  );
+}
+```
+
+## 主要功能
+
+- 基础 Flow 组件
+- 节点和边的管理 hooks
+- 布局算法集成
+- 主题配置
+- 插件系统
+
+## API 文档
+
+访问 [完整文档](https://tree-graph.publib.cn/) 查看详细 API。
+
+## License
+
+MIT

package/cjs/Flow.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-27 16:33
+ * @modified：2025/7/27 16:33 by yanxianliang
+ * @desc: Flow
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+import '@xyflow/react/dist/style.css';
+import { IBaseFlowProps } from "./types";
+import { Edge, Node } from "@xyflow/react";
+import "./index.less";
+export declare function Flow<NodeType extends Node = Node, EdgeType extends Edge = Edge>(props: IBaseFlowProps<NodeType, EdgeType>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Flow.d.ts.map

package/cjs/Flow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Flow.d.ts","sourceRoot":"","sources":["Flow.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,OAAO,8BAA8B,CAAC;AACtC,OAAO,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAQvC,OAAO,EAGL,IAAI,EAGJ,IAAI,EAOL,MAAM,eAAe,CAAC;AAavB,OAAO,cAAc,CAAC;AAMtB,wBAAgB,IAAI,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,KAAK,EAAE,cAAc,CAAC,QAAQ,EAAE,QAAQ,CAAC,2CAoPzH"}

package/cjs/Flow.js

@@ -0,0 +1,236 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Flow = Flow;
+require("@xyflow/react/dist/style.css");
+var _components = require("./components");
+var _hooks = require("./hooks");
+var _react = require("@xyflow/react");
+var _ahooks = require("ahooks");
+var _lodash = require("lodash");
+var _react2 = _interopRequireWildcard(require("react"));
+var _Controls = _interopRequireDefault(require("./components/Controls"));
+var _DebugInfo = require("./components/DebugInfo");
+var _SmartEdge = require("./edges/SmartEdge");
+var _useGetEdgesChangeHandlers = require("./hooks/edges/useGetEdgesChangeHandlers");
+var _useSetNodeDragging = require("./hooks/node/useSetNodeDragging");
+var _useForceUpdateTimes = require("./hooks/render/useForceUpdateTimes");
+var _useListenRender = require("./hooks/useListenRender");
+var _scrollbar = require("./plugins/scrollbar");
+var _hasDimensionsChange = require("./utils/hasDimensionsChange");
+require("./index.less");
+var _base = require("./utils/layouts/base");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-07-27 16:33
+ * @modified：2025/7/27 16:33 by yanxianliang
+ * @desc: Flow
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const proOptions = {
+  hideAttribution: true
+}; // 默认隐藏水印
+
+function Flow(props) {
+  const {
+    width,
+    height,
+    showControls = true,
+    // 默认开启
+    controlsPosition = 'top-right',
+    showMiniMap,
+    showLegend,
+    background = '#F2F7FAFF',
+    // 默认背景色
+    showFullscreen,
+    showForceLayout,
+    showInteractive,
+    showFitView,
+    showZoom,
+    onlyRenderVisibleElements = true,
+    // 默认开启虚拟渲染
+    rootStyle: _rootStyle,
+    fitViewOptions,
+    nodes,
+    edges,
+    layout = _base.baseLayout,
+    autoCenter = false,
+    omitProps = [],
+    // 不向下透传的属性
+    forceLayout = !!props.layout,
+    // 是否强制布局，如果强制布局会监控节点的dimension改变事件，自动触发布局计算
+    getMiniMapNodeColor,
+    markers,
+    plugins,
+    readOnly,
+    onZoomOut,
+    onZoomIn,
+    onFitView,
+    onInteractiveChange,
+    customControls,
+    nodeTypes: _nodeTypes,
+    onEdgesChange,
+    children,
+    forceFitView
+  } = props;
+  (0, _useListenRender.useListenRender)(); // 性能监听 hook
+
+  const [minimapVisible, setMinimapVisible] = (0, _react2.useState)(!!(showMiniMap && !showControls)); // 不显示控制器是默认按照字段控制 miniMap显示状态
+
+  const storeApi = (0, _react.useStoreApi)();
+  const containerRef = (0, _react2.useRef)(null);
+  const theme = (0, _hooks.useTheme)();
+  const themeVars = (0, _hooks.useThemeVars)();
+  const nodeTypes = (0, _hooks.useNodeTypes)(_nodeTypes); // 获取注册的节点类型
+  const forceUpdateTimes = (0, _useForceUpdateTimes.useForceUpdateTimes)();
+  const triggerLayout = (0, _hooks.useForceUpdate)();
+  const setNodeDragging = (0, _useSetNodeDragging.useSetNodeDragging)();
+  const instance = (0, _react.useReactFlow)();
+  const getState = (0, _hooks.useGetState)();
+  const rootStyle = (0, _react2.useMemo)(() => {
+    return {
+      width: typeof width === 'number' ? `${width}px` : width,
+      height: typeof height === 'number' ? `${height}px` : height,
+      ..._rootStyle,
+      ...themeVars
+    };
+  }, [width, height, _rootStyle, themeVars]);
+  const {
+    nodes: _nodes,
+    edges: _edges
+  } = (0, _react2.useMemo)(() => {
+    const store = storeApi.getState();
+    return layout({
+      nodeTypes,
+      originNodes: nodes || [],
+      originEdges: edges || [],
+      theme,
+      onlyRenderVisibleElements,
+      // 不支持修改该参数
+      store,
+      state: getState(),
+      flowProps: props
+    });
+  }, [nodes, edges, forceUpdateTimes]);
+  const flowProps = (0, _react2.useMemo)(() => {
+    const options = {
+      selectNodesOnDrag: false,
+      preventScrolling: true,
+      panOnScroll: false,
+      zoomOnScroll: true,
+      nodesDraggable: false,
+      proOptions: proOptions,
+      fitViewOptions: {
+        nodes: _nodes?.length && autoCenter ? [_nodes[0]] : undefined,
+        ...props.fitViewOptions
+      },
+      fitView: true,
+      onlyRenderVisibleElements,
+      ...(0, _lodash.omit)(props, ['flowInstanceRef', 'width', 'height', 'nodes', 'edges', 'fitViewOptions', 'theme', 'background', 'nodeTypes', 'showControls', 'showMiniMap', 'autoCenter', 'rootStyle', 'layout', 'onNodesChange', 'omitProps', 'forceLayout', 'controlsPosition', 'getMiniMapNodeColor', 'markers', 'onBeforeLayout', 'onLayout', 'onAfterLayout', 'plugins', 'readOnly', 'showFitView', 'showFullscreen', 'showInteractive', 'showZoom', 'showForceLayout', 'onInteractiveChange', 'onZoomOut', 'onZoomIn', 'onFitView', 'customControls', ...omitProps]),
+      edgeTypes: {
+        smart: _SmartEdge.SmartEdge,
+        ...(props.edgeTypes || {})
+      }
+    };
+    if (plugins?.scroller) {
+      // 只读模式也需要
+      options.zoomOnScroll = false;
+      options.panOnScroll = true;
+      options.panOnDrag = options.panOnDrag ?? [1, 2];
+      options.selectionOnDrag = options.selectionOnDrag ?? true;
+      options.selectionMode = options.selectionMode ?? _react.SelectionMode.Partial;
+    }
+    if (readOnly) {
+      options.nodesDraggable = false;
+      options.nodesConnectable = false;
+      options.elementsSelectable = false;
+    }
+    return options;
+  }, [props, _nodes, readOnly, onlyRenderVisibleElements]);
+  const onNodesChange = (0, _ahooks.useMemoizedFn)(changes => {
+    if (forceLayout && (0, _hasDimensionsChange.hasDimensionsChange)(changes)) {
+      // 强制布局
+      triggerLayout();
+    }
+    props.onNodesChange?.(changes);
+  });
+  const onNodeDragStart = (0, _ahooks.useMemoizedFn)((event, node, nodes) => {
+    setNodeDragging(true);
+    flowProps.onNodeDragStart?.(event, node, nodes);
+  });
+  const onNodeDragStop = (0, _ahooks.useMemoizedFn)((event, node, nodes) => {
+    setNodeDragging(false);
+    flowProps.onNodeDragStop?.(event, node, nodes);
+  });
+  const getEdgesChangeHandlers = (0, _useGetEdgesChangeHandlers.useGetEdgesChangeHandlers)();
+  const _onEdgesChange = (0, _ahooks.useMemoizedFn)(changes => {
+    onEdgesChange?.(changes);
+    // 触发注册事件
+    getEdgesChangeHandlers()?.forEach(onEdgesChange => {
+      onEdgesChange?.(changes);
+    });
+  });
+  (0, _react2.useEffect)(() => {
+    if (forceFitView) {
+      instance.fitView(fitViewOptions);
+    }
+  }, [nodes]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    ref: containerRef,
+    style: rootStyle,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_DebugInfo.DebugInfo, {
+      debug: props.debug
+    }), markers ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MarkerDefinitions, {
+      marks: markers
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_react.ReactFlow, {
+      nodeTypes: nodeTypes,
+      ...flowProps,
+      nodes: _nodes,
+      edges: _edges,
+      onNodesChange: onNodesChange,
+      onNodeDragStart: onNodeDragStart,
+      onNodeDragStop: onNodeDragStop,
+      onEdgesChange: _onEdgesChange,
+      children: [plugins?.scroller ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_scrollbar.Scrollbar, {
+        ...plugins.scroller,
+        width: width,
+        height: height
+      }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Background, {
+        bgColor: background,
+        className: 'rxflow-bg-hide-pattern',
+        variant: _react.BackgroundVariant.Lines
+      }), minimapVisible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.MiniMap, {
+        zoomable: true,
+        pannable: true,
+        nodeColor: getMiniMapNodeColor
+      }), showControls && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Controls.default, {
+        showFullscreen: showFullscreen,
+        containerRef: containerRef,
+        fitViewOptions: fitViewOptions,
+        position: controlsPosition,
+        showInteractive: showInteractive,
+        showMiniMap: showMiniMap,
+        showFitView: showFitView,
+        showZoom: showZoom,
+        setMinimapVisible: setMinimapVisible,
+        minimapVisible: minimapVisible,
+        showForceLayout: showForceLayout,
+        onFitView: onFitView,
+        onZoomOut: onZoomOut,
+        onZoomIn: onZoomIn,
+        onInteractiveChange: onInteractiveChange,
+        children: customControls
+      }), showLegend && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.Legend, {
+        showLegend: showLegend
+      }), children]
+    })]
+  });
+}

package/cjs/components/CollapseButton/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @author: yanxianliang
+ * @date: 2025-06-21 13:53
+ * @desc: 折叠按钮
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+import { CollapseButtonProps } from "../../types";
+import './index.less';
+export declare function CollapseButton(props: CollapseButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/cjs/components/CollapseButton/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAQH,OAAO,EAAC,mBAAmB,EAAC,MAAM,aAAa,CAAC;AAChD,OAAO,cAAc,CAAC;AAItB,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CA4CxD"}

package/cjs/components/CollapseButton/index.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CollapseButton = CollapseButton;
+var _LoadingOutlined = _interopRequireDefault(require("@ant-design/icons/lib/icons/LoadingOutlined"));
+var _MinusOutlined = _interopRequireDefault(require("@ant-design/icons/MinusOutlined"));
+var _PlusOutlined = _interopRequireDefault(require("@ant-design/icons/PlusOutlined"));
+var _ahooks = require("ahooks");
+var _classcat = _interopRequireDefault(require("classcat"));
+var _hooks = require("../../hooks");
+require("./index.less");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * @author: yanxianliang
+ * @date: 2025-06-21 13:53
+ * @desc: 折叠按钮
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+const stopClickEvent = event => event.stopPropagation();
+function CollapseButton(props) {
+  const {
+    collapsed = true,
+    position = 'right',
+    count,
+    onCollapse,
+    loading,
+    direction = 'horizontal',
+    autoHideCountWhenExpanded: _autoHideCountWhenExpanded = false
+  } = props;
+  const theme = (0, _hooks.useTheme)();
+  const {
+    collapseButtonShape = 'rect',
+    autoHideCountWhenExpanded = false,
+    showCount = true
+  } = theme;
+  const onClick = (0, _ahooks.useMemoizedFn)(() => {
+    onCollapse?.(!collapsed);
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classcat.default)(['rxflow-collapse', `rxflow-collapse-${position}`]),
+    onClick: stopClickEvent,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classcat.default)([`rxflow-collapse-icon`, `rxflow-collapse-shape-${collapseButtonShape}`, {
+        ['rxflow-collapse-loading']: loading
+      }]),
+      onClick: loading ? undefined : onClick,
+      children: loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_LoadingOutlined.default, {}) : collapsed ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_PlusOutlined.default, {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_MinusOutlined.default, {})
+    }), (autoHideCountWhenExpanded || _autoHideCountWhenExpanded) && !collapsed || !showCount ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classcat.default)([`rxflow-collapse-count`, direction === 'vertical' ? 'rxflow-collapse-vertical' : null]),
+      children: count
+    })]
+  });
+}

package/cjs/components/CollapseButton/index.less

@@ -0,0 +1,68 @@
+.rxflow{
+  &-collapse {
+    position: absolute;
+    display: flex;
+    top: 50%;
+    align-items: center;
+    transform: translate3d(0, -50%, 0);
+
+    &-right {
+      left: 100%;
+      flex-direction: row;
+      margin-left: 2px;
+    }
+
+    &-right &-vertical {
+      left: 3px;
+    }
+
+    &-left {
+      right: 100%;
+      flex-direction: row-reverse;
+      margin-right: 2px;
+    }
+
+    &-left &-vertical {
+      right: 3px;
+    }
+
+    &-icon {
+      display: flex;
+      width: 16px;
+      height: 16px;
+      border: 1px solid rgba(5, 5, 5, 0.06);
+      background-color: #fff;
+      font-size: 12px;
+      align-items: center;
+      justify-content: center;
+      color: #1677ff;
+      cursor: pointer;
+    }
+
+
+    &-shape-rect {
+      border-radius: 2px;
+    }
+
+    &-shape-circle {
+      border-radius: 8px;
+    }
+
+    &-loading {
+      cursor: not-allowed;
+    }
+
+
+    &-count {
+      font-size: 10px;
+      color: #333;
+      cursor: grab;
+      margin-left: 2px;
+    }
+
+    &-vertical {
+      position: absolute;
+      top: -18px;
+    }
+  }
+}

package/cjs/components/Controls/icons.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare function FitViewIcon(): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export declare function LockIcon(): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export declare function UnlockIcon(): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+export declare function Minimap(): import("react/jsx-runtime").JSX.Element;
+export declare function UnMinimap(): import("react/jsx-runtime").JSX.Element;
+export declare function ForceLayout(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=icons.d.ts.map

package/cjs/components/Controls/icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["icons.tsx"],"names":[],"mappings":";AAWA,wBAAgB,WAAW,+FAM1B;AAED,wBAAgB,QAAQ,+FAMvB;AAED,wBAAgB,UAAU,+FAMzB;AAED,wBAAgB,OAAO,4CActB;AAED,wBAAgB,SAAS,4CAcxB;AAGD,wBAAgB,WAAW,4CAa1B"}

package/cjs/components/Controls/icons.js

@@ -0,0 +1,85 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FitViewIcon = FitViewIcon;
+exports.ForceLayout = ForceLayout;
+exports.LockIcon = LockIcon;
+exports.Minimap = Minimap;
+exports.UnMinimap = UnMinimap;
+exports.UnlockIcon = UnlockIcon;
+var _jsxRuntime = require("react/jsx-runtime");
+/*
+ * @author: yanxianliang
+ * @date: 2025-06-09 09:56
+ * @desc: icons
+ *
+ * Copyright (c) 2025 by yanxianliang, All Rights Reserved.
+ */
+
+function FitViewIcon() {
+  return (0, _jsxRuntime.jsx)("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 32 30",
+    children: (0, _jsxRuntime.jsx)("path", {
+      d: "M3.692 4.63c0-.53.4-.938.939-.938h5.215V0H4.708C2.13 0 0 2.054 0 4.63v5.216h3.692V4.631zM27.354 0h-5.2v3.692h5.17c.53 0 .984.4.984.939v5.215H32V4.631A4.624 4.624 0 0027.354 0zm.954 24.83c0 .532-.4.94-.939.94h-5.215v3.768h5.215c2.577 0 4.631-2.13 4.631-4.707v-5.139h-3.692v5.139zm-23.677.94c-.531 0-.939-.4-.939-.94v-5.138H0v5.139c0 2.577 2.13 4.707 4.708 4.707h5.138V25.77H4.631z"
+    })
+  });
+}
+function LockIcon() {
+  return (0, _jsxRuntime.jsx)("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 25 32",
+    children: (0, _jsxRuntime.jsx)("path", {
+      d: "M21.333 10.667H19.81V7.619C19.81 3.429 16.38 0 12.19 0 8 0 4.571 3.429 4.571 7.619v3.048H3.048A3.056 3.056 0 000 13.714v15.238A3.056 3.056 0 003.048 32h18.285a3.056 3.056 0 003.048-3.048V13.714a3.056 3.056 0 00-3.048-3.047zM12.19 24.533a3.056 3.056 0 01-3.047-3.047 3.056 3.056 0 013.047-3.048 3.056 3.056 0 013.048 3.048 3.056 3.056 0 01-3.048 3.047zm4.724-13.866H7.467V7.619c0-2.59 2.133-4.724 4.723-4.724 2.591 0 4.724 2.133 4.724 4.724v3.048z"
+    })
+  });
+}
+function UnlockIcon() {
+  return (0, _jsxRuntime.jsx)("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    viewBox: "0 0 25 32",
+    children: (0, _jsxRuntime.jsx)("path", {
+      d: "M21.333 10.667H19.81V7.619C19.81 3.429 16.38 0 12.19 0c-4.114 1.828-1.37 2.133.305 2.438 1.676.305 4.42 2.59 4.42 5.181v3.048H3.047A3.056 3.056 0 000 13.714v15.238A3.056 3.056 0 003.048 32h18.285a3.056 3.056 0 003.048-3.048V13.714a3.056 3.056 0 00-3.048-3.047zM12.19 24.533a3.056 3.056 0 01-3.047-3.047 3.056 3.056 0 013.047-3.048 3.056 3.056 0 013.048 3.048 3.056 3.056 0 01-3.048 3.047z"
+    })
+  });
+}
+function Minimap() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+    viewBox: "0 0 1024 1024",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "32",
+    height: "32",
+    fill: 'currentColor',
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+      d: "M960 495.424V128a32 32 0 0 0-32-32H96a32 32 0 0 0-32 32v768a32 32 0 0 0 32 32h433.68a30.32 30.32 0 1 0 0-60.64H127.824V157.968h768.688v337.44a31.744 31.744 0 1 0 63.488 0zM630.512 928c-5.968 0-11.696-2.448-15.92-6.8A23.568 23.568 0 0 1 608 904.8V583.216c0-6.16 2.368-12.064 6.592-16.416s9.952-6.8 15.936-6.8h311.84c5.984 0 11.712 2.448 15.936 6.8s6.592 10.24 6.592 16.416v321.376c0 6.16-2.368 12.064-6.592 16.432a22.176 22.176 0 0 1-15.936 6.784l-311.84 0.192zM672 624v240h224V624H672zM313.904 473.568l93.392-0.24L184.16 250.176l40.848-40.848 223.136 223.136 0.24-93.392 57.68-0.16-0.48 162.912a28.96 28.96 0 0 1-28.928 28.928l-162.928 0.48 0.16-57.664z"
+    })
+  });
+}
+function UnMinimap() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+    viewBox: "0 0 1024 1024",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "32",
+    height: "32",
+    fill: 'currentColor',
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+      d: "M64 528.576L64 896a32 32 0 0 0 32 32L928 928a32 32 0 0 0 32-32l0-768a32 32 0 0 0-32-32l-433.68 1e-8a30.32 30.32 0 1 0 0 60.63999999L896.176 156.64 896.176 866.032l-768.688 0 0-337.44a31.744 31.744 0 1 0-63.488 0zM393.488 96c5.968 0 11.696 2.448 15.92 6.8A23.568 23.568 0 0 1 416.00000001 119.2L416.00000001 440.784c0 6.16-2.368 12.064-6.59200001 16.41600001s-9.952 6.8-15.936 6.79999999l-311.84 0c-5.984 0-11.712-2.448-15.936-6.8s-6.592-10.24-6.592-16.416l0-321.376c0-6.16 2.368-12.064 6.592-16.432a22.176 22.176 0 0 1 15.936-6.784l311.84-0.19199999zM352 400l0-240-224 0L128 400 352 400zM710.096 550.432l-93.392 0.24L839.84 773.824l-40.848 40.848-223.136-223.136-0.24 93.392-57.68 0.16 0.48-162.912a28.96 28.96 0 0 1 28.928-28.92800001l162.928-0.48-0.16 57.66400001z"
+    })
+  });
+}
+function ForceLayout() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", {
+    viewBox: "0 0 1024 1024",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg",
+    width: "32",
+    height: "32",
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
+      d: "M600.795429 395.117714a23.04 23.04 0 0 1-23.04-23.04c0-63.268571-51.565714-114.907429-114.980572-114.907428a23.04 23.04 0 0 1 0-46.006857c63.414857 0 114.980571-51.565714 114.980572-114.980572a23.04 23.04 0 1 1 46.08 0c0 63.341714 51.565714 114.980571 114.834285 114.980572a23.04 23.04 0 0 1 0 46.006857c-63.268571 0-114.834286 51.565714-114.834285 114.907428 0 12.726857-10.313143 23.04-23.04 23.04zM545.645714 234.130286c22.528 13.677714 41.545143 32.621714 55.149715 55.149714 13.604571-22.528 32.621714-41.472 55.149714-55.149714a162.596571 162.596571 0 0 1-55.149714-55.149715 162.377143 162.377143 0 0 1-55.149715 55.149715zM140.873143 533.065143a23.04 23.04 0 0 1-22.893714-22.966857 23.04 23.04 0 0 0-23.04-23.04 23.04 23.04 0 0 1 0-45.933715c12.726857 0 23.04-10.24 23.04-22.966857a23.04 23.04 0 0 1 45.933714 0c0 12.653714 10.24 22.966857 22.966857 22.966857a23.04 23.04 0 0 1 0 45.933715 23.04 23.04 0 0 0-22.966857 23.04c0 12.726857-10.24 22.966857-23.04 22.966857z m765.586286 273.115428L419.693714 319.414857a68.461714 68.461714 0 0 0-48.859428-20.187428 68.754286 68.754286 0 0 0-48.786286 20.114285l-26.916571 26.916572a68.461714 68.461714 0 0 0-20.114286 48.859428c0 18.505143 7.094857 35.766857 20.114286 48.786286l486.838857 486.838857a68.461714 68.461714 0 0 0 48.786285 20.114286 68.534857 68.534857 0 0 0 48.713143-20.114286l27.062857-26.989714a68.388571 68.388571 0 0 0 20.041143-48.713143 68.754286 68.754286 0 0 0-20.114285-48.859429zM327.68 378.806857l26.989714-26.916571a23.04 23.04 0 0 1 32.548572 0l66.121143 66.194285-59.392 59.465143-66.267429-66.194285a23.04 23.04 0 0 1 0-32.548572z m546.230857 492.397714l-26.916571 27.062858a22.747429 22.747429 0 0 1-16.310857 6.582857 22.820571 22.820571 0 0 1-16.164572-6.582857L426.422857 510.098286l59.465143-59.538286 388.022857 388.096a23.04 23.04 0 0 1 0 32.548571zM232.886857 303.250286a23.04 23.04 0 0 1-23.04-23.113143 68.973714 68.973714 0 0 0-68.973714-68.973714 23.04 23.04 0 0 1 0-46.006858c38.034286 0 68.973714-30.939429 68.973714-68.900571a23.04 23.04 0 0 1 46.08 0c0 37.961143 30.939429 68.900571 68.900572 68.900571a23.04 23.04 0 0 1 0 46.08 69.046857 69.046857 0 0 0-68.973715 68.900572c0 12.726857-10.24 23.04-22.966857 23.04z m-23.04-114.980572c8.777143 6.582857 16.530286 14.336 23.113143 23.04 6.582857-8.777143 14.409143-16.457143 23.113143-23.04a116.809143 116.809143 0 0 1-23.113143-23.113143c-6.582857 8.777143-14.409143 16.530286-23.113143 23.113143z m23.04 574.756572a23.04 23.04 0 0 1-23.04-22.893715 68.973714 68.973714 0 0 0-68.973714-68.973714 23.04 23.04 0 0 1 0-46.08c38.034286 0 68.973714-30.939429 68.973714-68.900571a23.04 23.04 0 0 1 46.08 0c0 38.034286 30.939429 68.973714 68.900572 68.973714a23.04 23.04 0 0 1 0 45.933714 69.046857 69.046857 0 0 0-68.973715 68.973715c0 12.653714-10.24 22.966857-22.966857 22.966857z m-23.04-114.834286c8.777143 6.582857 16.530286 14.336 23.113143 23.113143 6.582857-8.777143 14.409143-16.603429 23.113143-23.186286a116.809143 116.809143 0 0 1-23.113143-23.04c-6.582857 8.777143-14.409143 16.530286-23.113143 23.04z"
+    })
+  });
+}

package/cjs/components/Controls/index.d.ts

@@ -0,0 +1,13 @@
+import { ControlProps } from "@xyflow/react";
+import React, { RefObject } from "react";
+declare function Controls({ style, showZoom, showFitView, showInteractive, showFullscreen, showMiniMap, containerRef, fitViewOptions, onZoomIn, onZoomOut, onFitView, onInteractiveChange, className, children, position, orientation, 'aria-label': ariaLabel, minimapVisible, setMinimapVisible, showForceLayout, }: ControlProps & {
+    showMiniMap?: boolean;
+    showFullscreen?: boolean;
+    showForceLayout?: boolean;
+    minimapVisible: boolean;
+    setMinimapVisible: (visible: boolean) => void;
+    containerRef?: RefObject<HTMLDivElement | null>;
+}): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Controls>;
+export default _default;
+//# sourceMappingURL=index.d.ts.map

package/cjs/components/Controls/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAYA,OAAO,EAAgB,YAAY,EAA6D,MAAM,eAAe,CAAC;AAItH,OAAO,KAAK,EAAE,EAAO,SAAS,EAAC,MAAM,OAAO,CAAC;AAY7C,iBAAS,QAAQ,CACf,EACE,KAAK,EACL,QAAe,EACf,WAAkB,EAClB,eAAuB,EACvB,cAAqB,EACrB,WAAW,EACX,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,SAAS,EACT,SAAS,EACT,mBAAmB,EACnB,SAAS,EACT,QAAQ,EACR,QAAwB,EACxB,WAAwB,EACxB,YAAY,EAAE,SAAiC,EAC/C,cAAc,EACd,iBAAiB,EACjB,eAAe,GAChB,EAAE,YAAY,GAAG;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,EAAE,OAAO,CAAC;IACxB,iBAAiB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC9C,YAAY,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;CACjD,2CAuKF;;AAED,wBAA8B"}