useFlowContext.ts 1.34 KB
import type { Ref } from 'vue';
import { inject, provide } from 'vue';
import type { VueFlowStore } from '@vue-flow/core';
import type { CreateNodeModal } from '../src/components/CreateNodeModal';
import type { CreateEdgeModal } from '../src/components/CreateEdgeModal';
import { UpdateNodeDrawer } from '../src/components/UpdateNodeDrawer';
import { UpdateEdgeDrawer } from '../src/components/UpdateEdgeDrawer';

const SYMBOL = Symbol('flow-context');

interface FlowContextOptionsType {
  /**
   * @description 节点 actions
   */
  createNodeModalActionType: Ref<Nullable<InstanceType<typeof CreateNodeModal>>>;

  /**
   * @description 连接线 actions
   */
  createEdgeModalActionType: Ref<Nullable<InstanceType<typeof CreateEdgeModal>>>;

  /**
   * @description 节点更新 actions
   */
  updateNodeDrawerActionType: Ref<Nullable<InstanceType<typeof UpdateNodeDrawer>>>;

  /**
   * @description 连接线更新 actions
   */
  updateEdgeDrawerActionType: Ref<Nullable<InstanceType<typeof UpdateEdgeDrawer>>>;

  /**
   * @description vue flow store
   */
  flowActionType: VueFlowStore;

  /**
   * @description 更新变化
   */
  triggerChange: () => void;
}

export const createFlowContext = (options: FlowContextOptionsType) => {
  provide(SYMBOL, options);
};

export const useFlowContext = () => {
  return inject(SYMBOL) as FlowContextOptionsType;
};