Use vim mode

[barreiros]

Hi!

Can I use keymap/vim? I've tried to pass the param keymap in multiples ways...

<CodeMirror 
  value={code} 
  onChange={setCode} 
  onViewChanged={setView} 
  options={{
    theme: 'monokai',
    keyMap: 'sublime',
    mode: 'jsx',
  }
}/>

<CodeMirror 
value={code} 
onChange={setCode} 
onViewChanged={setView} 
keymap="vim"
}/>

...but the browser returns

ReferenceError: CodeMirror is not defined`

Thanks!

[jaywcjlove]

You can provide an example using codesandbox.io.

@barreiros

[barreiros]

Here your are the example with the keymap folder in public folder.

Thanks!

[jaywcjlove]

@barreiros example: https://codesandbox.io/embed/react-codemirror-example-codemirror-6-forked-uby11k?fontsize=14&hidenavigation=1&theme=dark

import React from "react";
import CodeMirror from "@uiw/react-codemirror";
import { javascript } from "@codemirror/lang-javascript";

import { vim } from "@replit/codemirror-vim";

export default function App() {
  return (
    <div>
      <CodeMirror
        value="console.log('hello world!');"
        height="200px"
        theme="dark"
        extensions={[vim(), javascript({ jsx: true })]}
        onChange={(value, viewUpdate) => {
          console.log("value:", value);
        }}
      />
    </div>
  );
}

[barreiros]

Great!

Thanks, @jaywcjlove

[prmichaelsen]

is there anyway to disable 'esc' behavior blurring the editor. I know C-c works but a having to use two keys for a common use case is very "anti-vim"