refactor(zoom): Rename paneMovable to panOnDrag

src/container/VueFlow/VueFlow.vue

@@ -18,7 +18,7 @@ const props = withDefaults(defineProps<FlowProps>(), {
   zoomOnPinch: undefined,
   zoomOnDoubleClick: undefined,
   panOnScroll: undefined,
-  paneMovable: undefined,
+  panOnDrag: undefined,
   applyDefault: undefined,
   fitViewOnInit: undefined,
   zoomActivationKeyCode: () => null,

src/store/state.ts

@@ -60,7 +60,7 @@ export default (opts?: FlowOptions): State => {
     panOnScroll: false,
     panOnScrollSpeed: 0.5,
     panOnScrollMode: PanOnScrollMode.Free,
-    paneMovable: true,
+    panOnDrag: true,
     edgeUpdaterRadius: 10,
     onlyRenderVisibleElements: false,
     defaultZoom: 1,
@@ -92,7 +92,7 @@ export default (opts?: FlowOptions): State => {
     multiSelectionActive: false,
     selectionKeyCode: 'Shift',
     multiSelectionKeyCode: 'Meta',
-    zoomActivationKeyCode: null,
+    zoomActivationKeyCode: 'Meta',
     deleteKeyCode: 'Backspace',
 
     hooks: createHooks(),
@@ -100,9 +100,9 @@ export default (opts?: FlowOptions): State => {
     applyDefault: true,
 
     fitViewOnInit: false,
-    noDragClassName: undefined,
-    noWheelClassName: undefined,
-    noPanClassName: undefined,
+    noDragClassName: 'nodrag',
+    noWheelClassName: 'nowheel',
+    noPanClassName: 'nopan',
     defaultEdgeOptions: undefined,
 
     vueFlowVersion: typeof __VUE_FLOW_VERSION__ !== 'undefined' ? __VUE_FLOW_VERSION__ : '-',

src/types/flow.ts

@@ -106,7 +106,7 @@ export interface FlowProps<N = any, E = N> {
   nodesConnectable?: boolean
   elementsSelectable?: boolean
   selectNodesOnDrag?: boolean
-  paneMovable?: boolean
+  panOnDrag?: boolean
   minZoom?: number
   maxZoom?: number
   defaultZoom?: number
@@ -116,7 +116,6 @@ export interface FlowProps<N = any, E = N> {
   defaultMarkerColor?: string
   zoomOnScroll?: boolean
   zoomOnPinch?: boolean
-  panOnDrag?: boolean
   panOnScroll?: boolean
   panOnScrollSpeed?: number
   panOnScrollMode?: PanOnScrollMode