diff --git a/README.md b/README.md index 74448d3..b397e07 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ Monaco Editor for React · use the [monaco-editor](https://microsoft.githu
-:tada: version `v4` is here - to see what's new in the new version and how to migrate from `v3`, please read this [doc](./v4.md) +:tada: version `v4` is here - to see what's new in the new version and how to migrate from `v3`, please read this [doc](./v4.changes.md)
:tada: the new section [Development / Playground](#development-playground) has been created - now you can run the playground and play with the internals of the library
diff --git a/package.json b/package.json index 4b8595a..82d3ba4 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@monaco-editor/react", - "version": "4.0.0-rc.2", + "version": "4.0.0", "description": "Monaco editor wrapper for easy/one-line integration with React applications (e.g. powered by create-react-app) without need of webpack configuration files", "author": "Suren Atoyan ", "main": "lib/cjs/index.js", diff --git a/v4.changes.md b/v4.changes.md new file mode 100644 index 0000000..b62a68b --- /dev/null +++ b/v4.changes.md @@ -0,0 +1,46 @@ +## v4 changes + +See also the [CHANGELOG](https://github.com/suren-atoyan/monaco-react/blob/master/CHANGELOG.md) + +`v4` brings lots of new features and some breaking changes. First, let's see what's broken comparing with the `v3` + +1) `editorDidMount` - **removed** + +In the new version there is no `editorDidMount` property. Now it can be replaced by `onMount`. If you happen to remember, the signature of `editorDidMount` was `function(getEditorValue: () => string, monaco: Monaco) => void` + +The `onMount` prop is a little bit different, the signature is `function(editor: monaco.editor.IStandaloneCodeEditor, monaco: Monaco) => void`. As you can see it also exposes the `monaco` instance as a second parameter. There is no `getEditorValue`. To get the current model value you can use `editor` instance (`editor.getValue()`) or `onChange` prop. [Read more](https://github.com/suren-atoyan/monaco-react#get-value) + +2) `beforeMount` - **new** (`onMount` - **new**) + +In addition to `onMount` now there is also `beforeMount` that exposes the `monaco` instance as a first parameter. Here you can do something before the editor is mounted. [Read more](https://github.com/suren-atoyan/monaco-react#monaco-instance) + +3) `ControlledEditor` - **removed** + +`ControlledEditor` component is removed. Now there is one `Editor` component that behaves in `controlled` mode or `uncontrolled` mode based on the usage of `value` property. [Read more](https://github.com/suren-atoyan/monaco-react#uncontrolled-controlled-modes) + +4) `defaultModelPath ` - **new** + +Path for the default (auto created) model. Will be passed as the third argument to `.createModel` method - `monaco.editor.createModel(..., ..., monaco.Uri.parse(defaultModelPath))` + +For `DiffEditor` there are `originalModelPath` and `modifiedModelPath` + +5) `useMonaco` - **new** + +`useMonaco` is a `React` hook that returns the instance of the `monaco`. [Read more](https://github.com/suren-atoyan/monaco-react#usemonaco) + +6) `onValidate` - **new** + +`onValidate` is an additional property. An event is emitted when the length of the model markers of the current model isn't 0. [Read more](https://github.com/suren-atoyan/monaco-react#onvalidate) + +7) `defaultProp` - **new** + +The initial value of the default (auto created) model + +8) `monaco` utility - **renamed** + +now, it's called `loader`. [Read more](https://github.com/suren-atoyan/monaco-react#loader-config) + +9) `onChange` - **signature change** + +old - `function(ev: any, value: string | undefined) => string | undefined` +new - `function(value: string | undefined, ev: monaco.editor.IModelContentChangedEvent) => void`