diff --git a/src/container/VueFlow/watch.ts b/src/container/VueFlow/watch.ts index 02308879..e2b4b7cd 100644 --- a/src/container/VueFlow/watch.ts +++ b/src/container/VueFlow/watch.ts @@ -61,160 +61,17 @@ export default ( (v) => isDef(v) && store.setMinZoom(v), { immediate: isDef(props.minZoom) }, ) - watch( - () => props.edgesUpdatable, - (v) => isDef(v) && (store.edgesUpdatable = v), - { immediate: isDef(props.edgesUpdatable) }, - ) - watch( - () => props.elementsSelectable, - (v) => isDef(v) && (store.elementsSelectable = v), - { immediate: isDef(props.elementsSelectable) }, - ) - watch( - () => props.nodesDraggable, - (v) => isDef(v) && (store.nodesDraggable = v), - { immediate: isDef(props.nodesDraggable) }, - ) - watch( - () => props.nodesConnectable, - (v) => isDef(v) && (store.nodesConnectable = v), - { immediate: isDef(props.nodesConnectable) }, - ) - watch( - () => props.onlyRenderVisibleElements, - (v) => isDef(v) && (store.onlyRenderVisibleElements = v), - { immediate: isDef(props.onlyRenderVisibleElements) }, - ) - watch( - () => props.snapToGrid, - (v) => isDef(v) && (store.snapToGrid = v), - { immediate: isDef(props.snapToGrid) }, - ) - watch( - () => props.snapGrid, - (v) => isDef(v) && (store.snapGrid = v), - { immediate: isDef(props.snapGrid) }, - ) - watch( - () => props.paneMovable, - (v) => isDef(v) && (store.paneMovable = v), - { immediate: isDef(props.paneMovable) }, - ) - watch( - () => props.panOnScroll, - (v) => isDef(v) && (store.panOnScroll = v), - { immediate: isDef(props.panOnScroll) }, - ) - watch( - () => props.panOnScrollMode, - (v) => isDef(v) && (store.panOnScrollMode = v), - { immediate: isDef(props.panOnScrollMode) }, - ) - watch( - () => props.panOnScrollSpeed, - (v) => isDef(v) && (store.panOnScrollSpeed = v), - { immediate: isDef(props.panOnScrollSpeed) }, - ) - watch( - () => props.zoomOnPinch, - (v) => isDef(v) && (store.zoomOnPinch = v), - { immediate: isDef(props.zoomOnPinch) }, - ) - watch( - () => props.zoomOnDoubleClick, - (v) => isDef(v) && (store.zoomOnDoubleClick = v), - { immediate: isDef(props.zoomOnDoubleClick) }, - ) - watch( - () => props.zoomOnScroll, - (v) => isDef(v) && (store.zoomOnScroll = v), - { immediate: isDef(props.zoomOnScroll) }, - ) - watch( - () => props.deleteKeyCode, - (v) => isDef(v) && (store.deleteKeyCode = v), - { immediate: isDef(props.deleteKeyCode) }, - ) - watch( - () => props.zoomActivationKeyCode, - (v) => isDef(v) && (store.zoomActivationKeyCode = v), - { immediate: isDef(props.zoomActivationKeyCode) }, - ) - watch( - () => props.selectionKeyCode, - (v) => isDef(v) && (store.selectionKeyCode = v), - { immediate: isDef(props.selectionKeyCode) }, - ) - watch( - () => props.multiSelectionKeyCode, - (v) => isDef(v) && (store.multiSelectionKeyCode = v), - { immediate: isDef(props.multiSelectionKeyCode) }, - ) - watch( - () => props.connectionLineStyle, - (v) => isDef(v) && (store.connectionLineStyle = v), - { immediate: isDef(props.connectionLineStyle) }, - ) - watch( - () => props.connectionMode, - (v) => isDef(v) && (store.connectionMode = v), - { immediate: isDef(props.connectionMode) }, - ) - watch( - () => props.connectionLineType, - (v) => isDef(v) && (store.connectionLineType = v), - { immediate: isDef(props.connectionLineType) }, - ) - watch( - () => props.defaultMarkerColor, - (v) => isDef(v) && (store.defaultMarkerColor = v), - { immediate: isDef(props.defaultMarkerColor) }, - ) - watch( - () => props.defaultPosition, - (v) => isDef(v) && (store.defaultPosition = v), - { immediate: isDef(props.defaultPosition) }, - ) - watch( - () => props.defaultZoom, - (v) => isDef(v) && (store.defaultZoom = v), - { immediate: isDef(props.defaultZoom) }, - ) - watch( - () => props.translateExtent, - (v) => isDef(v) && (store.translateExtent = v), - { immediate: isDef(props.translateExtent) }, - ) - watch( - () => props.nodeExtent, - (v) => isDef(v) && (store.nodeExtent = v), - { immediate: isDef(props.nodeExtent) }, - ) - watch( - () => props.selectNodesOnDrag, - (v) => isDef(v) && (store.selectNodesOnDrag = v), - { immediate: isDef(props.selectNodesOnDrag) }, - ) - watch( - () => props.edgeUpdaterRadius, - (v) => isDef(v) && (store.edgeUpdaterRadius = v), - { immediate: isDef(props.edgeUpdaterRadius) }, - ) - watch( - () => props.applyDefault, - (v) => isDef(v) && (store.applyDefault = v), - { immediate: isDef(props.applyDefault) }, - ) - watch( - () => props.nodeTypes, - (v) => isDef(v) && (store.nodeTypes = v), - { immediate: isDef(props.nodeTypes) }, - ) - watch( - () => props.edgeTypes, - (v) => isDef(v) && (store.edgeTypes = v), - { immediate: isDef(props.edgeTypes) }, - ) + + const skip = ['modelValue', 'edges', 'nodes', 'maxZoom', 'minZoom'] + Object.keys(props).forEach((p) => { + if (!skip.indexOf(p)) { + const prop = props[p as keyof typeof props] + watch( + () => prop, + (v) => isDef(v) && ((store as any)[p] = v), + { immediate: isDef(prop) }, + ) + } + }) }) }