diff --git a/lib/vcdrom.js b/lib/vcdrom.js
index 509a73e..cb73520 100644
--- a/lib/vcdrom.js
+++ b/lib/vcdrom.js
@@ -15,11 +15,12 @@ const {
   pluginRenderTimeGrid,
   keyBindo,
   mountTree,
-  renderMenu,
+  // renderMenu,
   // mountCodeMirror5,
   genKeyHandler,
   genOnWheel,
   themeAll,
+  helpPanel
 } = require('@wavedrom/doppler');
 
 const {mountCodeMirror6} = require('waveql');
@@ -34,7 +35,6 @@ const getJsonls = require('./get-jsonls.js');
 const getElement = require('./get-element.js');
 const pluginLocalStore = require('./plugin-local-store.js');
 
-
 const getHandler = (content, inst) => async readers => {
 
   const waveql = await getWaveql(readers);
@@ -57,14 +57,18 @@ const getHandler = (content, inst) => async readers => {
         pluginRenderTimeGrid,
         pluginRenderValues,
         pluginLocalStore
-      ]
+      ],
+      pluginRightPanel: (elo) => {
+        elo.rightPanel.innerHTML = stringify(helpPanel.mlPanel(keyBindo));
+      }
     });
 
     const {render} = container.start(content, deso);
 
-    container.elo.menu.innerHTML = renderMenu('https://github.com/wavedrom/vcdrom/blob/trunk/help.md');
+    container.elo.menu.innerHTML = stringify(helpPanel.mlIcon('https://github.com/wavedrom/vcdrom/blob/trunk/help.md'));
+    container.elo.menu.addEventListener('click', () => helpPanel.toggle(container.pstate));
 
-    // ['container', 'cursor', 'view0', 'values', 'sidebar', 'menu']
+    // ['container', 'cursor', 'view0', 'values', 'waveqlPanel', 'menu']
     //   .map(id => ({id, el: container.elo[id]}))
     //   .concat(
     //     {id: 'document', el: document}
@@ -77,7 +81,7 @@ const getHandler = (content, inst) => async readers => {
 
 
     const cm = mountCodeMirror6(
-      container.elo.sidebar,
+      container.elo.waveqlPanel,
       deso,
       container.pstate,
       render
@@ -85,13 +89,16 @@ const getHandler = (content, inst) => async readers => {
     container.elo.container.addEventListener('keydown', genKeyHandler.genKeyHandler(content, container.pstate, render, cm, keyBindo));
     container.elo.container.addEventListener('wheel', genOnWheel(content, container.pstate, render, cm, keyBindo));
     // console.log(cm);
+    cm.view.focus();
+
   });
 
   await getVcd(readers, content, inst);
+
 };
 
 global.VCDrom = async (divName, vcdPath) => {
-  console.log(pkg.name, pkg.version);
+  console.log(pkg.name, pkg.version, vcdPath);
   const content = getElement(divName);
 
   const themeAllMod = new StyleModule(themeAll);
@@ -102,6 +109,7 @@ global.VCDrom = async (divName, vcdPath) => {
   const inst = await webVcdParser(mod); // VCD parser instance
   const handler = getHandler(content, inst);
   await getReaders(handler, vcdPath);
+  // console.log(content);
 };
 
 /* eslint-env browser */
diff --git a/package.json b/package.json
index d8dd764..0d93e2d 100644
--- a/package.json
+++ b/package.json
@@ -28,25 +28,19 @@
   },
   "homepage": "https://github.com/wavedrom/vcdrom#readme",
   "devDependencies": {
-    "@drom/eslint-config": "^0.10.0",
-    "@wavedrom/doppler": "^1.7.0",
+    "@drom/eslint-config": "^0.12.0",
+    "@wavedrom/doppler": "^1.8.1",
     "browserify": "^17.0.0",
-    "eslint": "^8.37.0",
+    "eslint": "^8.44.0",
     "http-server": "^14.1.0",
     "onml": "^2.1.0",
-    "style-mod": "^4.0.2",
-    "terser": "^5.16.8",
+    "style-mod": "^4.0.3",
+    "terser": "^5.18.2",
     "vcd-stream": "^1.4.0",
     "watchify": "^4.0.0",
     "waveql": "^1.6.0"
   },
   "eslintConfig": {
-    "extends": "@drom/eslint-config/eslint4/node8",
-    "env": {
-      "es2020": true
-    },
-    "parserOptions": {
-      "ecmaVersion": 2020
-    }
+    "extends": "@drom/eslint-config/eslint8/node12"
   }
 }