feat: add drag canvas behavior (#5475)

* refactor(types): rename loose to loosen

* feat(utils): add Shortcut util

* refactor(behaviors): refactor zoom canvas with shortcuts

* chore(test): update toBeCloseTo message style

* feat(behaviors): add drag-canvas behavior

* refactor(utils): abstract out module from behavior and widget

* feat(runtime): add widget controller

* refactor: fix cr issues

packages/g6/__tests__/demo/case/behavior-drag-canvas.ts

@@ -0,0 +1,36 @@
+import { Graph } from '@/src';
+import data from '@@/dataset/cluster.json';
+import type { STDTestCase } from '../types';
+
+export const behaviorDragCanvas: STDTestCase = async (context) => {
+  const { canvas, animation } = context;
+  const graph = new Graph({
+    animation,
+    container: canvas,
+    data,
+    layout: {
+      type: 'd3force',
+    },
+    node: {
+      style: {
+        size: 20,
+      },
+    },
+    behaviors: [
+      'drag-canvas',
+      {
+        type: 'drag-canvas',
+        trigger: {
+          up: ['ArrowUp'],
+          down: ['ArrowDown'],
+          right: ['ArrowRight'],
+          left: ['ArrowLeft'],
+        },
+      },
+    ],
+  });
+
+  await graph.render();
+
+  return graph;
+};

packages/g6/__tests__/demo/case/index.ts

@@ -1 +1,2 @@
+export * from './behavior-drag-canvas';
 export * from './behavior-zoom-canvas';