Settings for line break

[Tatalya]

Hello. I noticed that Codemirror forcibly replaces my line breaks (\r\n) with (\n). It does not depend on setting 'lineSeparator'. It replaces \r\n to \n always. Can I work with \r\n\ inside Codemirror?

[jaywcjlove]

Can you get the updated string for replacement? @Tatalya

'Hello \nWorld'.replace(/\n/g, '\r\n')

I think you can customize an Extension to handle your problem, but it is extremely difficult.

[jadran90]

Hi, is there any better solution to set 'lineSeparator'? I tried set initialState.json prop, but it did not work.

Currently I have to use \r\n separator, but CodeEditor replaces it with \n and calls onChange handler.

Could you add 'lineSeparator' to react-codemirror props?

[guillermoamaral]

@jaywcjlove I have the same issue, isn't is possible to configure the line separator in react-codemirror as documented here?

[jaywcjlove]

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

I tested this api and it doesn't work.

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

export default function App() {
  const onChange = React.useCallback((value, viewUpdate) => {
    console.log(JSON.stringify(value));
  }, []);
  const txt = "console.log('hello \r\nworld!');";
  return (
    <div>
      <CodeMirror
        value={txt}
        height="200px"
        theme="dark"
        extensions={[
          EditorState.lineSeparator.of("\r\n"),
          javascript({ jsx: true })
        ]}
        onChange={onChange}
      />
    </div>
  );
}

So I think value does the processing and may be the current solution

 'Hello \nWor \r\nld! \rtest'.replace(/(?<!\r)\n|\r(?!\n)/g, '\r\n')