update: renaming stuff from react flow to revue flow
This commit is contained in:
@@ -16,7 +16,7 @@ import RevueFlow, {
|
|||||||
} from '../../src';
|
} from '../../src';
|
||||||
import ColorSelectorNode from './ColorSelectorNode';
|
import ColorSelectorNode from './ColorSelectorNode';
|
||||||
|
|
||||||
const onLoad = (reactFlowInstance: OnLoadParams) => console.log('flow loaded:', reactFlowInstance);
|
const onLoad = (revueFlowInstance: OnLoadParams) => console.log('flow loaded:', revueFlowInstance);
|
||||||
const onNodeDragStop = (_: MouseEvent, node: Node) => console.log('drag stop', node);
|
const onNodeDragStop = (_: MouseEvent, node: Node) => console.log('drag stop', node);
|
||||||
const onElementClick = (_: MouseEvent, element: FlowElement) => console.log('click', element);
|
const onElementClick = (_: MouseEvent, element: FlowElement) => console.log('click', element);
|
||||||
|
|
||||||
|
|||||||
+1
-1
@@ -12,7 +12,7 @@ const Header = defineComponent({
|
|||||||
|
|
||||||
return () => (
|
return () => (
|
||||||
<header>
|
<header>
|
||||||
<a class="logo" href="https://github.com/wbkd/react-flow">
|
<a class="logo" href="https://github.com/bcakmakoglu/revue-flow">
|
||||||
Revue Flow Dev
|
Revue Flow Dev
|
||||||
</a>
|
</a>
|
||||||
<select v-model={route.path} onChange={onChange}>
|
<select v-model={route.path} onChange={onChange}>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { setActivePinia, createPinia, defineStore, StoreDefinition, Pinia } from 'pinia';
|
import { setActivePinia, createPinia, defineStore, StoreDefinition, Pinia } from 'pinia';
|
||||||
import { inject } from 'vue';
|
import { inject } from 'vue';
|
||||||
import isEqual from 'fast-deep-equal';
|
import isEqual from 'fast-deep-equal';
|
||||||
import { Edge, Node, NodeDiffUpdate, ReactFlowState, RevueFlowActionsTree, XYPosition } from '../types';
|
import { Edge, Node, NodeDiffUpdate, RevueFlowState, RevueFlowActionsTree, XYPosition } from '../types';
|
||||||
import { getConnectedEdges, getNodesInside, getRectOfNodes, isEdge, isNode, parseEdge, parseNode } from '../utils/graph';
|
import { getConnectedEdges, getNodesInside, getRectOfNodes, isEdge, isNode, parseEdge, parseNode } from '../utils/graph';
|
||||||
import { clampPosition, getDimensions } from '../utils';
|
import { clampPosition, getDimensions } from '../utils';
|
||||||
import { getHandleBounds } from '../components/Nodes/utils';
|
import { getHandleBounds } from '../components/Nodes/utils';
|
||||||
@@ -12,8 +12,8 @@ type NextElements = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export default function configureStore(
|
export default function configureStore(
|
||||||
preloadedState: ReactFlowState
|
preloadedState: RevueFlowState
|
||||||
): StoreDefinition<any, ReactFlowState, any, RevueFlowActionsTree> {
|
): StoreDefinition<any, RevueFlowState, any, RevueFlowActionsTree> {
|
||||||
const pinia = inject<Pinia>(Symbol('pinia')) ?? createPinia();
|
const pinia = inject<Pinia>(Symbol('pinia')) ?? createPinia();
|
||||||
setActivePinia(pinia);
|
setActivePinia(pinia);
|
||||||
|
|
||||||
@@ -178,7 +178,7 @@ export default function configureStore(
|
|||||||
const startX = this.userSelectionRect.startX || 0;
|
const startX = this.userSelectionRect.startX || 0;
|
||||||
const startY = this.userSelectionRect.startY || 0;
|
const startY = this.userSelectionRect.startY || 0;
|
||||||
|
|
||||||
const nextUserSelectRect: ReactFlowState['userSelectionRect'] = {
|
const nextUserSelectRect: RevueFlowState['userSelectionRect'] = {
|
||||||
...this.userSelectionRect,
|
...this.userSelectionRect,
|
||||||
x: mousePos.x < startX ? mousePos.x : this.userSelectionRect.x,
|
x: mousePos.x < startX ? mousePos.x : this.userSelectionRect.x,
|
||||||
y: mousePos.y < startY ? mousePos.y : this.userSelectionRect.y,
|
y: mousePos.y < startY ? mousePos.y : this.userSelectionRect.y,
|
||||||
|
|||||||
+3
-3
@@ -1,8 +1,8 @@
|
|||||||
import configureStore from './configure-store';
|
import configureStore from './configure-store';
|
||||||
|
|
||||||
import { ReactFlowState, ConnectionMode } from '../types';
|
import { RevueFlowState, ConnectionMode } from '../types';
|
||||||
|
|
||||||
export const initialState: ReactFlowState = {
|
export const initialState: RevueFlowState = {
|
||||||
width: 0,
|
width: 0,
|
||||||
height: 0,
|
height: 0,
|
||||||
transform: [0, 0, 1],
|
transform: [0, 0, 1],
|
||||||
@@ -53,7 +53,7 @@ export const initialState: ReactFlowState = {
|
|||||||
|
|
||||||
multiSelectionActive: false,
|
multiSelectionActive: false,
|
||||||
|
|
||||||
reactFlowVersion: typeof __REVUE_FLOW_VERSION__ !== 'undefined' ? __REVUE_FLOW_VERSION__ : '-'
|
revueFlowVersion: typeof __REVUE_FLOW_VERSION__ !== 'undefined' ? __REVUE_FLOW_VERSION__ : '-'
|
||||||
};
|
};
|
||||||
|
|
||||||
const store = configureStore(initialState);
|
const store = configureStore(initialState);
|
||||||
|
|||||||
+2
-2
@@ -824,7 +824,7 @@ export type InitD3ZoomPayload = {
|
|||||||
transform: Transform;
|
transform: Transform;
|
||||||
};
|
};
|
||||||
|
|
||||||
export interface ReactFlowState {
|
export interface RevueFlowState {
|
||||||
width: number;
|
width: number;
|
||||||
height: number;
|
height: number;
|
||||||
transform: Transform;
|
transform: Transform;
|
||||||
@@ -861,7 +861,7 @@ export interface ReactFlowState {
|
|||||||
|
|
||||||
multiSelectionActive: boolean;
|
multiSelectionActive: boolean;
|
||||||
|
|
||||||
reactFlowVersion: string;
|
revueFlowVersion: string;
|
||||||
|
|
||||||
onConnect?: OnConnectFunc;
|
onConnect?: OnConnectFunc;
|
||||||
onConnectStart?: OnConnectStartFunc;
|
onConnectStart?: OnConnectStartFunc;
|
||||||
|
|||||||
+5
-5
@@ -13,7 +13,7 @@ import {
|
|||||||
Box,
|
Box,
|
||||||
Connection,
|
Connection,
|
||||||
FlowExportObject,
|
FlowExportObject,
|
||||||
ReactFlowState,
|
RevueFlowState,
|
||||||
NodeExtent
|
NodeExtent
|
||||||
} from '../types';
|
} from '../types';
|
||||||
|
|
||||||
@@ -55,7 +55,7 @@ export const removeElements = (elementsToRemove: Elements, elements: Elements):
|
|||||||
};
|
};
|
||||||
|
|
||||||
const getEdgeId = ({ source, sourceHandle, target, targetHandle }: Connection): ElementId =>
|
const getEdgeId = ({ source, sourceHandle, target, targetHandle }: Connection): ElementId =>
|
||||||
`reactflow__edge-${source}${sourceHandle}-${target}${targetHandle}`;
|
`revueflow__edge-${source}${sourceHandle}-${target}${targetHandle}`;
|
||||||
|
|
||||||
const connectionExists = (edge: Edge, elements: Elements) => {
|
const connectionExists = (edge: Edge, elements: Elements) => {
|
||||||
return elements.some(
|
return elements.some(
|
||||||
@@ -138,7 +138,7 @@ export const pointToRendererPoint = (
|
|||||||
return position;
|
return position;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const onLoadProject = (currentStore: Store<'revue-flow', ReactFlowState>) => {
|
export const onLoadProject = (currentStore: Store<'revue-flow', RevueFlowState>) => {
|
||||||
return (position: XYPosition): XYPosition => {
|
return (position: XYPosition): XYPosition => {
|
||||||
return pointToRendererPoint(position, currentStore.transform, currentStore.snapToGrid, currentStore.snapGrid);
|
return pointToRendererPoint(position, currentStore.transform, currentStore.snapToGrid, currentStore.snapGrid);
|
||||||
};
|
};
|
||||||
@@ -266,13 +266,13 @@ const parseElements = (nodes: Node[], edges: Edge[]): Elements => {
|
|||||||
];
|
];
|
||||||
};
|
};
|
||||||
|
|
||||||
export const onLoadGetElements = (currentStore: Store<'revue-flow', ReactFlowState>) => {
|
export const onLoadGetElements = (currentStore: Store<'revue-flow', RevueFlowState>) => {
|
||||||
return (): Elements => {
|
return (): Elements => {
|
||||||
return parseElements(currentStore.nodes || [], currentStore.edges || []);
|
return parseElements(currentStore.nodes || [], currentStore.edges || []);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
export const onLoadToObject = (currentStore: Store<'revue-flow', ReactFlowState>) => {
|
export const onLoadToObject = (currentStore: Store<'revue-flow', RevueFlowState>) => {
|
||||||
return (): FlowExportObject => {
|
return (): FlowExportObject => {
|
||||||
return {
|
return {
|
||||||
elements: parseElements(currentStore.nodes || [], currentStore.edges || []),
|
elements: parseElements(currentStore.nodes || [], currentStore.edges || []),
|
||||||
|
|||||||
Reference in New Issue
Block a user