@uiw/react-codemirror 4.9.3 → 4.9.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +38 -16
- package/cjs/index.js +3 -8
- package/cjs/index.js.map +2 -4
- package/cjs/useCodeMirror.d.ts +2 -2
- package/cjs/useCodeMirror.js +6 -2
- package/cjs/useCodeMirror.js.map +2 -2
- package/dist/mdeditor.js +39 -21
- package/dist/mdeditor.min.js +1 -1
- package/esm/index.js +6 -9
- package/esm/index.js.map +3 -4
- package/esm/useCodeMirror.d.ts +2 -2
- package/esm/useCodeMirror.js +4 -2
- package/esm/useCodeMirror.js.map +2 -2
- package/package.json +1 -1
- package/src/index.tsx +9 -7
- package/src/useCodeMirror.ts +4 -2
package/README.md
CHANGED
|
@@ -23,7 +23,8 @@ CodeMirror component for React. Demo Preview: [@uiwjs.github.io/react-codemirror
|
|
|
23
23
|
⚛️ Support the features of React Hook(requires React 16.8+).
|
|
24
24
|
📚 Use Typescript to write, better code hints.
|
|
25
25
|
🌐 The bundled version supports use directly in the browser [#267](https://github.com/uiwjs/react-codemirror/issues/267#issuecomment-1041227592).
|
|
26
|
-
🌎 There are better [sample previews](https://uiwjs.github.io/react-codemirror).
|
|
26
|
+
🌎 There are better [sample previews](https://uiwjs.github.io/react-codemirror).
|
|
27
|
+
🎨 Support [theme](https://uiwjs.github.io/react-codemirror/#/theme/data/dracula) customization, provide theme [editor](https://uiwjs.github.io/react-codemirror/#/theme/editor).
|
|
27
28
|
|
|
28
29
|
## Install
|
|
29
30
|
|
|
@@ -75,13 +76,7 @@ func main() {
|
|
|
75
76
|
}`;
|
|
76
77
|
|
|
77
78
|
export default function App() {
|
|
78
|
-
return (
|
|
79
|
-
<CodeMirror
|
|
80
|
-
value={goLang}
|
|
81
|
-
height="200px"
|
|
82
|
-
extensions={[StreamLanguage.define(go)]}
|
|
83
|
-
/>
|
|
84
|
-
);
|
|
79
|
+
return <CodeMirror value={goLang} height="200px" extensions={[StreamLanguage.define(go)]} />;
|
|
85
80
|
}
|
|
86
81
|
```
|
|
87
82
|
|
|
@@ -168,6 +163,27 @@ export default function App() {
|
|
|
168
163
|
}
|
|
169
164
|
```
|
|
170
165
|
|
|
166
|
+
## Using Theme
|
|
167
|
+
|
|
168
|
+
We have created a [`theme editor`](https://uiwjs.github.io/react-codemirror/#/theme/editor) where you can define your own theme. We have also defined [some themes](https://uiwjs.github.io/react-codemirror/#/theme/data/okaidia) ourselves, which can be installed and used directly. Below is a usage example:
|
|
169
|
+
|
|
170
|
+
```jsx
|
|
171
|
+
import CodeMirror from '@uiw/react-codemirror';
|
|
172
|
+
import { javascript } from '@codemirror/lang-javascript';
|
|
173
|
+
import { okaidia } from '@uiw/codemirror-theme-okaidia';
|
|
174
|
+
|
|
175
|
+
export default function App() {
|
|
176
|
+
return (
|
|
177
|
+
<CodeMirror
|
|
178
|
+
value="console.log('hello world!');"
|
|
179
|
+
height="200px"
|
|
180
|
+
theme={okaidia}
|
|
181
|
+
extensions={[javascript({ jsx: true })]}
|
|
182
|
+
/>
|
|
183
|
+
);
|
|
184
|
+
}
|
|
185
|
+
```
|
|
186
|
+
|
|
171
187
|
## Using custom theme
|
|
172
188
|
|
|
173
189
|
```jsx
|
|
@@ -177,12 +193,13 @@ import { javascript } from '@codemirror/lang-javascript';
|
|
|
177
193
|
import { tags as t } from '@lezer/highlight';
|
|
178
194
|
|
|
179
195
|
const myTheme = createTheme({
|
|
180
|
-
|
|
196
|
+
theme: 'light',
|
|
181
197
|
settings: {
|
|
182
198
|
background: '#ffffff',
|
|
183
199
|
foreground: '#75baff',
|
|
184
200
|
caret: '#5d00ff',
|
|
185
201
|
selection: '#036dd626',
|
|
202
|
+
selectionMatch: '#036dd626',
|
|
186
203
|
lineHighlight: '#8a91991a',
|
|
187
204
|
gutterBackground: '#fff',
|
|
188
205
|
gutterForeground: '#8a919966',
|
|
@@ -344,13 +361,18 @@ export interface BasicSetupOptions {
|
|
|
344
361
|
|
|
345
362
|
## Packages
|
|
346
363
|
|
|
347
|
-
| Name
|
|
348
|
-
|
|
|
349
|
-
| `@uiw/react-codemirror`
|
|
350
|
-
| `@uiw/codemirror-themes`
|
|
351
|
-
| `@uiw/codemirror-
|
|
352
|
-
| `@uiw/codemirror-theme-
|
|
353
|
-
| `@uiw/codemirror-theme-
|
|
364
|
+
| Name | NPM Version | Website |
|
|
365
|
+
| ----------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------- |
|
|
366
|
+
| `@uiw/react-codemirror` | [](https://www.npmjs.com/package/@uiw/react-codemirror) | [Preview Website](https://uiwjs.github.io/react-codemirror/) |
|
|
367
|
+
| `@uiw/codemirror-themes` | [](https://www.npmjs.com/package/@uiw/codemirror-themes) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/doc) |
|
|
368
|
+
| `@uiw/codemirror-extensions-events` | [](https://www.npmjs.com/package/@uiw/codemirror-extensions-events) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/extensions/events) |
|
|
369
|
+
| `@uiw/codemirror-theme-abcdef` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-abcdef) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/abcdef) |
|
|
370
|
+
| `@uiw/codemirror-theme-okaidia` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-okaidia) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/okaidia) |
|
|
371
|
+
| `@uiw/codemirror-theme-bespin` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-bespin) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/bespin) |
|
|
372
|
+
| `@uiw/codemirror-theme-duotone` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-duotone) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/duotone/light) |
|
|
373
|
+
| `@uiw/codemirror-theme-dracula` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-dracula) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/dracula) |
|
|
374
|
+
| `@uiw/codemirror-theme-darcula` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-darcula) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/darcula) |
|
|
375
|
+
| `@uiw/codemirror-theme-eclipse` | [](https://www.npmjs.com/package/@uiw/codemirror-theme-eclipse) | [Preview Website](https://uiwjs.github.io/react-codemirror/#/theme/data/eclipse) |
|
|
354
376
|
|
|
355
377
|
<!--rehype:style=width: 100%; display: inline-table;-->
|
|
356
378
|
|
package/cjs/index.js
CHANGED
|
@@ -48,8 +48,7 @@ Object.keys(_basicSetup).forEach(function (key) {
|
|
|
48
48
|
});
|
|
49
49
|
});
|
|
50
50
|
var _excluded = ["className", "value", "selection", "extensions", "onChange", "onUpdate", "autoFocus", "theme", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "basicSetup", "placeholder", "indentWithTab", "editable", "readOnly", "root"];
|
|
51
|
-
|
|
52
|
-
var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) {
|
|
51
|
+
var ReactCodeMirror = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
53
52
|
var className = props.className,
|
|
54
53
|
_props$value = props.value,
|
|
55
54
|
value = _props$value === void 0 ? '' : _props$value,
|
|
@@ -105,14 +104,11 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
105
104
|
|
|
106
105
|
(0, _react.useImperativeHandle)(ref, function () {
|
|
107
106
|
return {
|
|
108
|
-
editor:
|
|
107
|
+
editor: editor.current,
|
|
109
108
|
state: state,
|
|
110
109
|
view: view
|
|
111
110
|
};
|
|
112
|
-
}, [container, state, view]);
|
|
113
|
-
(0, _react.useEffect)(function () {
|
|
114
|
-
setContainer(editor.current); // eslint-disable-next-line react-hooks/exhaustive-deps
|
|
115
|
-
}, []); // check type of value
|
|
111
|
+
}, [editor, container, state, view]); // check type of value
|
|
116
112
|
|
|
117
113
|
if (typeof value !== 'string') {
|
|
118
114
|
throw new Error("value must be typeof string but got ".concat((0, _typeof2["default"])(value)));
|
|
@@ -124,7 +120,6 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
124
120
|
className: "".concat(defaultClassNames).concat(className ? " ".concat(className) : '')
|
|
125
121
|
}, other));
|
|
126
122
|
});
|
|
127
|
-
|
|
128
123
|
ReactCodeMirror.displayName = 'CodeMirror';
|
|
129
124
|
var _default = ReactCodeMirror;
|
|
130
125
|
exports["default"] = _default;
|
package/cjs/index.js.map
CHANGED
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"names": [
|
|
4
4
|
"ReactCodeMirror",
|
|
5
|
-
"React",
|
|
6
5
|
"forwardRef",
|
|
7
6
|
"props",
|
|
8
7
|
"ref",
|
|
@@ -36,7 +35,6 @@
|
|
|
36
35
|
"view",
|
|
37
36
|
"setContainer",
|
|
38
37
|
"useImperativeHandle",
|
|
39
|
-
"useEffect",
|
|
40
38
|
"Error",
|
|
41
39
|
"defaultClassNames",
|
|
42
40
|
"displayName"
|
|
@@ -45,7 +43,7 @@
|
|
|
45
43
|
"../src/index.tsx"
|
|
46
44
|
],
|
|
47
45
|
"sourcesContent": [
|
|
48
|
-
"import React, {
|
|
46
|
+
"import React, { useRef, forwardRef, useImperativeHandle } from 'react';\nimport { EditorState, EditorStateConfig, Extension } from '@codemirror/state';\nimport { EditorView, ViewUpdate } from '@codemirror/view';\nimport { useCodeMirror } from './useCodeMirror';\nimport { BasicSetupOptions } from './basicSetup';\n\nexport * from './basicSetup';\nexport * from './useCodeMirror';\n\nexport interface ReactCodeMirrorProps\n extends Omit<EditorStateConfig, 'doc' | 'extensions'>,\n Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'placeholder'> {\n /** value of the auto created model in the editor. */\n value?: string;\n height?: string;\n minHeight?: string;\n maxHeight?: string;\n width?: string;\n minWidth?: string;\n maxWidth?: string;\n /** focus on the editor. */\n autoFocus?: boolean;\n /** Enables a placeholder—a piece of example content to show when the editor is empty. */\n placeholder?: string | HTMLElement;\n /**\n * `light` / `dark` / `Extension` Defaults to `light`.\n * @default light\n */\n theme?: 'light' | 'dark' | Extension;\n /**\n * Whether to optional basicSetup by default\n * @default true\n */\n basicSetup?: boolean | BasicSetupOptions;\n /**\n * This disables editing of the editor content by the user.\n * @default true\n */\n editable?: boolean;\n /**\n * This disables editing of the editor content by the user.\n * @default false\n */\n readOnly?: boolean;\n /**\n * Whether to optional basicSetup by default\n * @default true\n */\n indentWithTab?: boolean;\n /** Fired whenever a change occurs to the document. */\n onChange?(value: string, viewUpdate: ViewUpdate): void;\n /** Fired whenever any state change occurs within the editor, including non-document changes like lint results. */\n onUpdate?(viewUpdate: ViewUpdate): void;\n /**\n * Extension values can be [provided](https://codemirror.net/6/docs/ref/#state.EditorStateConfig.extensions) when creating a state to attach various kinds of configuration and behavior information.\n * They can either be built-in extension-providing objects,\n * such as [state fields](https://codemirror.net/6/docs/ref/#state.StateField) or [facet providers](https://codemirror.net/6/docs/ref/#state.Facet.of),\n * or objects with an extension in its `extension` property. Extensions can be nested in arrays arbitrarily deep—they will be flattened when processed.\n */\n extensions?: Extension[];\n /**\n * If the view is going to be mounted in a shadow root or document other than the one held by the global variable document (the default), you should pass it here.\n * Originally from the [config of EditorView](https://codemirror.net/6/docs/ref/#view.EditorView.constructor%5Econfig.root)\n */\n root?: ShadowRoot | Document;\n}\n\nexport interface ReactCodeMirrorRef {\n editor?: HTMLDivElement | null;\n state?: EditorState;\n view?: EditorView;\n}\n\nconst ReactCodeMirror = forwardRef<ReactCodeMirrorRef, ReactCodeMirrorProps>((props, ref) => {\n const {\n className,\n value = '',\n selection,\n extensions = [],\n onChange,\n onUpdate,\n autoFocus,\n theme = 'light',\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n basicSetup,\n placeholder,\n indentWithTab,\n editable,\n readOnly,\n root,\n ...other\n } = props;\n const editor = useRef<HTMLDivElement>(null);\n const { state, view, container, setContainer } = useCodeMirror({\n container: editor.current,\n root,\n value,\n autoFocus,\n theme,\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n basicSetup,\n placeholder,\n indentWithTab,\n editable,\n readOnly,\n selection,\n onChange,\n onUpdate,\n extensions,\n });\n\n useImperativeHandle(ref, () => ({ editor: editor.current, state: state, view: view }), [\n editor,\n container,\n state,\n view,\n ]);\n\n // check type of value\n if (typeof value !== 'string') {\n throw new Error(`value must be typeof string but got ${typeof value}`);\n }\n\n const defaultClassNames = typeof theme === 'string' ? `cm-theme-${theme}` : 'cm-theme';\n return <div ref={editor} className={`${defaultClassNames}${className ? ` ${className}` : ''}`} {...other}></div>;\n});\n\nReactCodeMirror.displayName = 'CodeMirror';\n\nexport default ReactCodeMirror;\n"
|
|
49
47
|
],
|
|
50
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;;AAGA;;AAIA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;;;AADA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA
|
|
48
|
+
"mappings": "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"
|
|
51
49
|
}
|
package/cjs/useCodeMirror.d.ts
CHANGED
|
@@ -9,6 +9,6 @@ export declare function useCodeMirror(props: UseCodeMirror): {
|
|
|
9
9
|
setState: import("react").Dispatch<import("react").SetStateAction<EditorState | undefined>>;
|
|
10
10
|
view: EditorView | undefined;
|
|
11
11
|
setView: import("react").Dispatch<import("react").SetStateAction<EditorView | undefined>>;
|
|
12
|
-
container: HTMLDivElement |
|
|
13
|
-
setContainer: import("react").Dispatch<import("react").SetStateAction<HTMLDivElement |
|
|
12
|
+
container: HTMLDivElement | undefined;
|
|
13
|
+
setContainer: import("react").Dispatch<import("react").SetStateAction<HTMLDivElement | undefined>>;
|
|
14
14
|
};
|
package/cjs/useCodeMirror.js
CHANGED
|
@@ -55,7 +55,7 @@ function useCodeMirror(props) {
|
|
|
55
55
|
defaultBasicSetup = _props$basicSetup === void 0 ? true : _props$basicSetup,
|
|
56
56
|
root = props.root;
|
|
57
57
|
|
|
58
|
-
var _useState = (0, _react.useState)(
|
|
58
|
+
var _useState = (0, _react.useState)(),
|
|
59
59
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
60
60
|
container = _useState2[0],
|
|
61
61
|
setContainer = _useState2[1];
|
|
@@ -166,10 +166,14 @@ function useCodeMirror(props) {
|
|
|
166
166
|
|
|
167
167
|
return function () {
|
|
168
168
|
if (view) {
|
|
169
|
+
setState(undefined);
|
|
169
170
|
setView(undefined);
|
|
170
171
|
}
|
|
171
|
-
};
|
|
172
|
+
};
|
|
172
173
|
}, [container, state]);
|
|
174
|
+
(0, _react.useEffect)(function () {
|
|
175
|
+
return setContainer(props.container);
|
|
176
|
+
}, [props.container]);
|
|
173
177
|
(0, _react.useEffect)(function () {
|
|
174
178
|
return function () {
|
|
175
179
|
if (view) {
|
package/cjs/useCodeMirror.js.map
CHANGED
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
"../src/useCodeMirror.ts"
|
|
74
74
|
],
|
|
75
75
|
"sourcesContent": [
|
|
76
|
-
"import { useEffect, useState } from 'react';\nimport { EditorState, StateEffect } from '@codemirror/state';\nimport { indentWithTab } from '@codemirror/commands';\nimport { EditorView, keymap, ViewUpdate, placeholder } from '@codemirror/view';\nimport { oneDark } from '@codemirror/theme-one-dark';\nimport { basicSetup } from './basicSetup';\nimport { ReactCodeMirrorProps } from '.';\n\nexport interface UseCodeMirror extends ReactCodeMirrorProps {\n container?: HTMLDivElement | null;\n}\n\nexport function useCodeMirror(props: UseCodeMirror) {\n const {\n value,\n selection,\n onChange,\n onUpdate,\n extensions = [],\n autoFocus,\n theme = 'light',\n height = '',\n minHeight = '',\n maxHeight = '',\n placeholder: placeholderStr = '',\n width = '',\n minWidth = '',\n maxWidth = '',\n editable = true,\n readOnly = false,\n indentWithTab: defaultIndentWithTab = true,\n basicSetup: defaultBasicSetup = true,\n root,\n } = props;\n const [container, setContainer] = useState(
|
|
76
|
+
"import { useEffect, useState } from 'react';\nimport { EditorState, StateEffect } from '@codemirror/state';\nimport { indentWithTab } from '@codemirror/commands';\nimport { EditorView, keymap, ViewUpdate, placeholder } from '@codemirror/view';\nimport { oneDark } from '@codemirror/theme-one-dark';\nimport { basicSetup } from './basicSetup';\nimport { ReactCodeMirrorProps } from '.';\n\nexport interface UseCodeMirror extends ReactCodeMirrorProps {\n container?: HTMLDivElement | null;\n}\n\nexport function useCodeMirror(props: UseCodeMirror) {\n const {\n value,\n selection,\n onChange,\n onUpdate,\n extensions = [],\n autoFocus,\n theme = 'light',\n height = '',\n minHeight = '',\n maxHeight = '',\n placeholder: placeholderStr = '',\n width = '',\n minWidth = '',\n maxWidth = '',\n editable = true,\n readOnly = false,\n indentWithTab: defaultIndentWithTab = true,\n basicSetup: defaultBasicSetup = true,\n root,\n } = props;\n const [container, setContainer] = useState<HTMLDivElement>();\n const [view, setView] = useState<EditorView>();\n const [state, setState] = useState<EditorState>();\n const defaultLightThemeOption = EditorView.theme(\n {\n '&': {\n backgroundColor: '#fff',\n },\n },\n {\n dark: false,\n },\n );\n const defaultThemeOption = EditorView.theme({\n '&': {\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n },\n });\n const updateListener = EditorView.updateListener.of((vu: ViewUpdate) => {\n if (vu.docChanged && typeof onChange === 'function') {\n const doc = vu.state.doc;\n const value = doc.toString();\n onChange(value, vu);\n }\n });\n\n let getExtensions = [updateListener, defaultThemeOption];\n if (defaultIndentWithTab) {\n getExtensions.unshift(keymap.of([indentWithTab]));\n }\n if (defaultBasicSetup) {\n if (typeof defaultBasicSetup === 'boolean') {\n getExtensions.unshift(basicSetup());\n } else {\n getExtensions.unshift(basicSetup(defaultBasicSetup));\n }\n }\n\n if (placeholderStr) {\n getExtensions.unshift(placeholder(placeholderStr));\n }\n\n switch (theme) {\n case 'light':\n getExtensions.push(defaultLightThemeOption);\n break;\n case 'dark':\n getExtensions.push(oneDark);\n break;\n default:\n getExtensions.push(theme);\n break;\n }\n\n if (editable === false) {\n getExtensions.push(EditorView.editable.of(false));\n }\n if (readOnly) {\n getExtensions.push(EditorState.readOnly.of(true));\n }\n\n if (onUpdate && typeof onUpdate === 'function') {\n getExtensions.push(EditorView.updateListener.of(onUpdate));\n }\n getExtensions = getExtensions.concat(extensions);\n\n useEffect(() => {\n if (container && !state) {\n const stateCurrent = EditorState.create({\n doc: value,\n selection,\n extensions: getExtensions,\n });\n setState(stateCurrent);\n if (!view) {\n const viewCurrent = new EditorView({\n state: stateCurrent,\n parent: container,\n root,\n });\n setView(viewCurrent);\n }\n }\n return () => {\n if (view) {\n setState(undefined);\n setView(undefined);\n }\n };\n }, [container, state]);\n\n useEffect(() => setContainer(props.container!), [props.container]);\n\n useEffect(\n () => () => {\n if (view) {\n view.destroy();\n setView(undefined);\n }\n },\n [view],\n );\n\n useEffect(() => {\n if (autoFocus && view) {\n view.focus();\n }\n }, [autoFocus, view]);\n\n useEffect(() => {\n if (view) {\n view.dispatch({ effects: StateEffect.reconfigure.of(getExtensions) });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [\n theme,\n extensions,\n height,\n minHeight,\n maxHeight,\n width,\n minWidth,\n maxWidth,\n placeholderStr,\n editable,\n readOnly,\n defaultIndentWithTab,\n defaultBasicSetup,\n onChange,\n onUpdate,\n ]);\n\n useEffect(() => {\n const currentValue = view ? view.state.doc.toString() : '';\n if (view && value !== currentValue) {\n view.dispatch({\n changes: { from: 0, to: currentValue.length, insert: value || '' },\n });\n }\n }, [value, view]);\n\n return { state, setState, view, setView, container, setContainer };\n}\n"
|
|
77
77
|
],
|
|
78
|
-
"mappings": ";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAOO,SAASA,aAAT,CAAuBC,KAAvB,EAA6C;EAClD,IACEC,KADF,GAoBID,KApBJ,CACEC,KADF;EAAA,IAEEC,SAFF,GAoBIF,KApBJ,CAEEE,SAFF;EAAA,IAGEC,QAHF,GAoBIH,KApBJ,CAGEG,QAHF;EAAA,IAIEC,QAJF,GAoBIJ,KApBJ,CAIEI,QAJF;EAAA,wBAoBIJ,KApBJ,CAKEK,UALF;EAAA,IAKEA,UALF,kCAKe,EALf;EAAA,IAMEC,SANF,GAoBIN,KApBJ,CAMEM,SANF;EAAA,mBAoBIN,KApBJ,CAOEO,KAPF;EAAA,IAOEA,KAPF,6BAOU,OAPV;EAAA,oBAoBIP,KApBJ,CAQEQ,MARF;EAAA,IAQEA,MARF,8BAQW,EARX;EAAA,uBAoBIR,KApBJ,CASES,SATF;EAAA,IASEA,SATF,iCASc,EATd;EAAA,uBAoBIT,KApBJ,CAUEU,SAVF;EAAA,IAUEA,SAVF,iCAUc,EAVd;EAAA,yBAoBIV,KApBJ,CAWEW,WAXF;EAAA,IAWeC,cAXf,mCAWgC,EAXhC;EAAA,mBAoBIZ,KApBJ,CAYEa,KAZF;EAAA,IAYEA,KAZF,6BAYU,EAZV;EAAA,sBAoBIb,KApBJ,CAaEc,QAbF;EAAA,IAaEA,QAbF,gCAaa,EAbb;EAAA,sBAoBId,KApBJ,CAcEe,QAdF;EAAA,IAcEA,QAdF,gCAca,EAdb;EAAA,sBAoBIf,KApBJ,CAeEgB,QAfF;EAAA,IAeEA,QAfF,gCAea,IAfb;EAAA,sBAoBIhB,KApBJ,CAgBEiB,QAhBF;EAAA,IAgBEA,QAhBF,gCAgBa,KAhBb;EAAA,2BAoBIjB,KApBJ,CAiBEkB,aAjBF;EAAA,IAiBiBC,oBAjBjB,qCAiBwC,IAjBxC;EAAA,wBAoBInB,KApBJ,CAkBEoB,UAlBF;EAAA,IAkBcC,iBAlBd,kCAkBkC,IAlBlC;EAAA,IAmBEC,IAnBF,GAoBItB,KApBJ,CAmBEsB,IAnBF;;EAqBA,gBAAkC,IAAAC,eAAA,
|
|
78
|
+
"mappings": "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"
|
|
79
79
|
}
|
package/dist/mdeditor.js
CHANGED
|
@@ -98,18 +98,6 @@ module.exports = __WEBPACK_EXTERNAL_MODULE__105__;
|
|
|
98
98
|
/******/ }
|
|
99
99
|
/******/
|
|
100
100
|
/************************************************************************/
|
|
101
|
-
/******/ /* webpack/runtime/compat get default export */
|
|
102
|
-
/******/ (() => {
|
|
103
|
-
/******/ // getDefaultExport function for compatibility with non-harmony modules
|
|
104
|
-
/******/ __webpack_require__.n = (module) => {
|
|
105
|
-
/******/ var getter = module && module.__esModule ?
|
|
106
|
-
/******/ () => (module['default']) :
|
|
107
|
-
/******/ () => (module);
|
|
108
|
-
/******/ __webpack_require__.d(getter, { a: getter });
|
|
109
|
-
/******/ return getter;
|
|
110
|
-
/******/ };
|
|
111
|
-
/******/ })();
|
|
112
|
-
/******/
|
|
113
101
|
/******/ /* webpack/runtime/define property getters */
|
|
114
102
|
/******/ (() => {
|
|
115
103
|
/******/ // define getter functions for harmony exports
|
|
@@ -232,7 +220,6 @@ function _objectWithoutProperties(source, excluded) {
|
|
|
232
220
|
}
|
|
233
221
|
// EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"}
|
|
234
222
|
var external_root_React_commonjs2_react_commonjs_react_amd_react_ = __webpack_require__(787);
|
|
235
|
-
var external_root_React_commonjs2_react_commonjs_react_amd_react_default = /*#__PURE__*/__webpack_require__.n(external_root_React_commonjs2_react_commonjs_react_amd_react_);
|
|
236
223
|
;// CONCATENATED MODULE: ../node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js
|
|
237
224
|
function _arrayWithHoles(arr) {
|
|
238
225
|
if (Array.isArray(arr)) return arr;
|
|
@@ -3748,6 +3735,31 @@ function getIndentation(context, pos) {
|
|
|
3748
3735
|
return tree ? syntaxIndentation(context, tree, pos) : null;
|
|
3749
3736
|
}
|
|
3750
3737
|
/**
|
|
3738
|
+
Create a change set that auto-indents all lines touched by the
|
|
3739
|
+
given document range.
|
|
3740
|
+
*/
|
|
3741
|
+
function indentRange(state, from, to) {
|
|
3742
|
+
let updated = Object.create(null);
|
|
3743
|
+
let context = new IndentContext(state, { overrideIndentation: start => { var _a; return (_a = updated[start]) !== null && _a !== void 0 ? _a : -1; } });
|
|
3744
|
+
let changes = [];
|
|
3745
|
+
for (let pos = from; pos <= to;) {
|
|
3746
|
+
let line = state.doc.lineAt(pos);
|
|
3747
|
+
let indent = getIndentation(context, line.from);
|
|
3748
|
+
if (indent == null)
|
|
3749
|
+
continue;
|
|
3750
|
+
if (!/\S/.test(line.text))
|
|
3751
|
+
indent = 0;
|
|
3752
|
+
let cur = /^\s*/.exec(line.text)[0];
|
|
3753
|
+
let norm = indentString(state, indent);
|
|
3754
|
+
if (cur != norm) {
|
|
3755
|
+
updated[line.from] = indent;
|
|
3756
|
+
changes.push({ from: line.from, to: line.from + cur.length, insert: norm });
|
|
3757
|
+
}
|
|
3758
|
+
pos = line.to + 1;
|
|
3759
|
+
}
|
|
3760
|
+
return state.changes(changes);
|
|
3761
|
+
}
|
|
3762
|
+
/**
|
|
3751
3763
|
Indentation contexts are used when calling [indentation
|
|
3752
3764
|
services](https://codemirror.net/6/docs/ref/#language.indentService). They provide helper utilities
|
|
3753
3765
|
useful in indentation logic, and can selectively override the
|
|
@@ -4729,7 +4741,7 @@ function matchPlainBrackets(state, pos, dir, tree, tokenType, maxScanDistance, b
|
|
|
4729
4741
|
let basePos = pos + distance * dir;
|
|
4730
4742
|
for (let pos = dir > 0 ? 0 : text.length - 1, end = dir > 0 ? text.length : -1; pos != end; pos += dir) {
|
|
4731
4743
|
let found = brackets.indexOf(text[pos]);
|
|
4732
|
-
if (found < 0 || tree.
|
|
4744
|
+
if (found < 0 || tree.resolveInner(basePos + pos, 1).type != tokenType)
|
|
4733
4745
|
continue;
|
|
4734
4746
|
if ((found % 2 == 0) == (dir > 0)) {
|
|
4735
4747
|
depth++;
|
|
@@ -5612,7 +5624,10 @@ class HistEvent {
|
|
|
5612
5624
|
// changes == startSelection == undefined
|
|
5613
5625
|
changes,
|
|
5614
5626
|
// The effects associated with this event
|
|
5615
|
-
effects,
|
|
5627
|
+
effects,
|
|
5628
|
+
// Accumulated mapping (from addToHistory==false) that should be
|
|
5629
|
+
// applied to events below this one.
|
|
5630
|
+
mapped,
|
|
5616
5631
|
// The selection before this event
|
|
5617
5632
|
startSelection,
|
|
5618
5633
|
// Stores selection changes after this event, to be used for
|
|
@@ -5811,13 +5826,14 @@ HistoryState.empty = /*@__PURE__*/new HistoryState(none, none);
|
|
|
5811
5826
|
Default key bindings for the undo history.
|
|
5812
5827
|
|
|
5813
5828
|
- Mod-z: [`undo`](https://codemirror.net/6/docs/ref/#commands.undo).
|
|
5814
|
-
- Mod-y (Mod-Shift-z on macOS): [`redo`](https://codemirror.net/6/docs/ref/#commands.redo).
|
|
5829
|
+
- Mod-y (Mod-Shift-z on macOS) + Ctrl-Shift-z on Linux: [`redo`](https://codemirror.net/6/docs/ref/#commands.redo).
|
|
5815
5830
|
- Mod-u: [`undoSelection`](https://codemirror.net/6/docs/ref/#commands.undoSelection).
|
|
5816
5831
|
- Alt-u (Mod-Shift-u on macOS): [`redoSelection`](https://codemirror.net/6/docs/ref/#commands.redoSelection).
|
|
5817
5832
|
*/
|
|
5818
5833
|
const historyKeymap = [
|
|
5819
5834
|
{ key: "Mod-z", run: undo, preventDefault: true },
|
|
5820
5835
|
{ key: "Mod-y", mac: "Mod-Shift-z", run: redo, preventDefault: true },
|
|
5836
|
+
{ linux: "Ctrl-Shift-z", run: redo, preventDefault: true },
|
|
5821
5837
|
{ key: "Mod-u", run: undoSelection, preventDefault: true },
|
|
5822
5838
|
{ key: "Alt-u", mac: "Mod-Shift-u", run: redoSelection, preventDefault: true }
|
|
5823
5839
|
];
|
|
@@ -6269,7 +6285,11 @@ function deleteBy({ state, dispatch }, by) {
|
|
|
6269
6285
|
});
|
|
6270
6286
|
if (changes.changes.empty)
|
|
6271
6287
|
return false;
|
|
6272
|
-
dispatch(state.update(changes, {
|
|
6288
|
+
dispatch(state.update(changes, {
|
|
6289
|
+
scrollIntoView: true,
|
|
6290
|
+
userEvent: event,
|
|
6291
|
+
effects: event == "delete.selection" ? view_.EditorView.announce.of(state.phrase("Selection deleted")) : undefined
|
|
6292
|
+
}));
|
|
6273
6293
|
return true;
|
|
6274
6294
|
}
|
|
6275
6295
|
function skipAtomic(target, pos, forward) {
|
|
@@ -10517,14 +10537,12 @@ and an array literal), copy it into your own code, and adjust it
|
|
|
10517
10537
|
as desired.
|
|
10518
10538
|
*/var basicSetup=function basicSetup(){var options=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};var keymaps=[];if(options.closeBracketsKeymap!==false){keymaps.push(_toConsumableArray(closeBracketsKeymap));}if(options.defaultKeymap!==false){keymaps.push(_toConsumableArray(defaultKeymap));}if(options.searchKeymap!==false){keymaps.push(_toConsumableArray(searchKeymap));}if(options.historyKeymap!==false){keymaps.push(_toConsumableArray(historyKeymap));}if(options.foldKeymap!==false){keymaps.push(_toConsumableArray(foldKeymap));}if(options.completionKeymap!==false){keymaps.push(_toConsumableArray(completionKeymap));}if(options.lintKeymap!==false){keymaps.push(_toConsumableArray(lintKeymap));}var extensions=[];if(options.lineNumbers!==false)extensions.push((0,view_.lineNumbers)());if(options.highlightActiveLineGutter!==false)extensions.push((0,view_.highlightActiveLineGutter)());if(options.highlightSpecialChars!==false)extensions.push((0,view_.highlightSpecialChars)());if(options.history!==false)extensions.push(dist_history());if(options.foldGutter!==false)extensions.push(foldGutter());if(options.drawSelection!==false)extensions.push((0,view_.drawSelection)());if(options.dropCursor!==false)extensions.push((0,view_.dropCursor)());if(options.allowMultipleSelections!==false)extensions.push(state_.EditorState.allowMultipleSelections.of(true));if(options.indentOnInput!==false)extensions.push(indentOnInput());if(options.syntaxHighlighting!==false)extensions.push(syntaxHighlighting(defaultHighlightStyle,{fallback:true}));if(options.bracketMatching!==false)extensions.push(bracketMatching());if(options.closeBrackets!==false)extensions.push(closeBrackets());if(options.autocompletion!==false)extensions.push(autocompletion());if(options.rectangularSelection!==false)extensions.push((0,view_.rectangularSelection)());if(options.crosshairCursor!==false)extensions.push((0,view_.crosshairCursor)());if(options.highlightActiveLine!==false)extensions.push((0,view_.highlightActiveLine)());if(options.highlightSelectionMatches!==false)extensions.push(highlightSelectionMatches());return[].concat(extensions,[view_.keymap.of(keymaps.flat())]).filter(Boolean);};
|
|
10519
10539
|
;// CONCATENATED MODULE: ./src/useCodeMirror.ts
|
|
10520
|
-
function useCodeMirror(props){var value=props.value,selection=props.selection,onChange=props.onChange,onUpdate=props.onUpdate,_props$extensions=props.extensions,extensions=_props$extensions===void 0?[]:_props$extensions,autoFocus=props.autoFocus,_props$theme=props.theme,theme=_props$theme===void 0?'light':_props$theme,_props$height=props.height,height=_props$height===void 0?'':_props$height,_props$minHeight=props.minHeight,minHeight=_props$minHeight===void 0?'':_props$minHeight,_props$maxHeight=props.maxHeight,maxHeight=_props$maxHeight===void 0?'':_props$maxHeight,_props$placeholder=props.placeholder,placeholderStr=_props$placeholder===void 0?'':_props$placeholder,_props$width=props.width,width=_props$width===void 0?'':_props$width,_props$minWidth=props.minWidth,minWidth=_props$minWidth===void 0?'':_props$minWidth,_props$maxWidth=props.maxWidth,maxWidth=_props$maxWidth===void 0?'':_props$maxWidth,_props$editable=props.editable,editable=_props$editable===void 0?true:_props$editable,_props$readOnly=props.readOnly,readOnly=_props$readOnly===void 0?false:_props$readOnly,_props$indentWithTab=props.indentWithTab,defaultIndentWithTab=_props$indentWithTab===void 0?true:_props$indentWithTab,_props$basicSetup=props.basicSetup,defaultBasicSetup=_props$basicSetup===void 0?true:_props$basicSetup,root=props.root;var _useState=(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(
|
|
10521
|
-
},[container,state]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){return function(){if(view){view.destroy();setView(undefined);}};},[view]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){if(autoFocus&&view){view.focus();}},[autoFocus,view]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){if(view){view.dispatch({effects:state_.StateEffect.reconfigure.of(getExtensions)});}// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
10540
|
+
function useCodeMirror(props){var value=props.value,selection=props.selection,onChange=props.onChange,onUpdate=props.onUpdate,_props$extensions=props.extensions,extensions=_props$extensions===void 0?[]:_props$extensions,autoFocus=props.autoFocus,_props$theme=props.theme,theme=_props$theme===void 0?'light':_props$theme,_props$height=props.height,height=_props$height===void 0?'':_props$height,_props$minHeight=props.minHeight,minHeight=_props$minHeight===void 0?'':_props$minHeight,_props$maxHeight=props.maxHeight,maxHeight=_props$maxHeight===void 0?'':_props$maxHeight,_props$placeholder=props.placeholder,placeholderStr=_props$placeholder===void 0?'':_props$placeholder,_props$width=props.width,width=_props$width===void 0?'':_props$width,_props$minWidth=props.minWidth,minWidth=_props$minWidth===void 0?'':_props$minWidth,_props$maxWidth=props.maxWidth,maxWidth=_props$maxWidth===void 0?'':_props$maxWidth,_props$editable=props.editable,editable=_props$editable===void 0?true:_props$editable,_props$readOnly=props.readOnly,readOnly=_props$readOnly===void 0?false:_props$readOnly,_props$indentWithTab=props.indentWithTab,defaultIndentWithTab=_props$indentWithTab===void 0?true:_props$indentWithTab,_props$basicSetup=props.basicSetup,defaultBasicSetup=_props$basicSetup===void 0?true:_props$basicSetup,root=props.root;var _useState=(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(),_useState2=_slicedToArray(_useState,2),container=_useState2[0],setContainer=_useState2[1];var _useState3=(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(),_useState4=_slicedToArray(_useState3,2),view=_useState4[0],setView=_useState4[1];var _useState5=(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useState)(),_useState6=_slicedToArray(_useState5,2),state=_useState6[0],setState=_useState6[1];var defaultLightThemeOption=view_.EditorView.theme({'&':{backgroundColor:'#fff'}},{dark:false});var defaultThemeOption=view_.EditorView.theme({'&':{height:height,minHeight:minHeight,maxHeight:maxHeight,width:width,minWidth:minWidth,maxWidth:maxWidth}});var updateListener=view_.EditorView.updateListener.of(function(vu){if(vu.docChanged&&typeof onChange==='function'){var doc=vu.state.doc;var _value=doc.toString();onChange(_value,vu);}});var getExtensions=[updateListener,defaultThemeOption];if(defaultIndentWithTab){getExtensions.unshift(view_.keymap.of([indentWithTab]));}if(defaultBasicSetup){if(typeof defaultBasicSetup==='boolean'){getExtensions.unshift(basicSetup());}else{getExtensions.unshift(basicSetup(defaultBasicSetup));}}if(placeholderStr){getExtensions.unshift((0,view_.placeholder)(placeholderStr));}switch(theme){case'light':getExtensions.push(defaultLightThemeOption);break;case'dark':getExtensions.push(theme_one_dark_.oneDark);break;default:getExtensions.push(theme);break;}if(editable===false){getExtensions.push(view_.EditorView.editable.of(false));}if(readOnly){getExtensions.push(state_.EditorState.readOnly.of(true));}if(onUpdate&&typeof onUpdate==='function'){getExtensions.push(view_.EditorView.updateListener.of(onUpdate));}getExtensions=getExtensions.concat(extensions);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){if(container&&!state){var stateCurrent=state_.EditorState.create({doc:value,selection:selection,extensions:getExtensions});setState(stateCurrent);if(!view){var viewCurrent=new view_.EditorView({state:stateCurrent,parent:container,root:root});setView(viewCurrent);}}return function(){if(view){setState(undefined);setView(undefined);}};},[container,state]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){return setContainer(props.container);},[props.container]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){return function(){if(view){view.destroy();setView(undefined);}};},[view]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){if(autoFocus&&view){view.focus();}},[autoFocus,view]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){if(view){view.dispatch({effects:state_.StateEffect.reconfigure.of(getExtensions)});}// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
10522
10541
|
},[theme,extensions,height,minHeight,maxHeight,width,minWidth,maxWidth,placeholderStr,editable,readOnly,defaultIndentWithTab,defaultBasicSetup,onChange,onUpdate]);(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useEffect)(function(){var currentValue=view?view.state.doc.toString():'';if(view&&value!==currentValue){view.dispatch({changes:{from:0,to:currentValue.length,insert:value||''}});}},[value,view]);return{state:state,setState:setState,view:view,setView:setView,container:container,setContainer:setContainer};}
|
|
10523
10542
|
// EXTERNAL MODULE: ../node_modules/react/jsx-runtime.js
|
|
10524
10543
|
var jsx_runtime = __webpack_require__(605);
|
|
10525
10544
|
;// CONCATENATED MODULE: ./src/index.tsx
|
|
10526
|
-
var _excluded=["className","value","selection","extensions","onChange","onUpdate","autoFocus","theme","height","minHeight","maxHeight","width","minWidth","maxWidth","basicSetup","placeholder","indentWithTab","editable","readOnly","root"];var ReactCodeMirror=/*#__PURE__*/
|
|
10527
|
-
},[]);// check type of value
|
|
10545
|
+
var _excluded=["className","value","selection","extensions","onChange","onUpdate","autoFocus","theme","height","minHeight","maxHeight","width","minWidth","maxWidth","basicSetup","placeholder","indentWithTab","editable","readOnly","root"];var ReactCodeMirror=/*#__PURE__*/(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.forwardRef)(function(props,ref){var className=props.className,_props$value=props.value,value=_props$value===void 0?'':_props$value,selection=props.selection,_props$extensions=props.extensions,extensions=_props$extensions===void 0?[]:_props$extensions,onChange=props.onChange,onUpdate=props.onUpdate,autoFocus=props.autoFocus,_props$theme=props.theme,theme=_props$theme===void 0?'light':_props$theme,height=props.height,minHeight=props.minHeight,maxHeight=props.maxHeight,width=props.width,minWidth=props.minWidth,maxWidth=props.maxWidth,basicSetup=props.basicSetup,placeholder=props.placeholder,indentWithTab=props.indentWithTab,editable=props.editable,readOnly=props.readOnly,root=props.root,other=_objectWithoutProperties(props,_excluded);var editor=(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useRef)(null);var _useCodeMirror=useCodeMirror({container:editor.current,root:root,value:value,autoFocus:autoFocus,theme:theme,height:height,minHeight:minHeight,maxHeight:maxHeight,width:width,minWidth:minWidth,maxWidth:maxWidth,basicSetup:basicSetup,placeholder:placeholder,indentWithTab:indentWithTab,editable:editable,readOnly:readOnly,selection:selection,onChange:onChange,onUpdate:onUpdate,extensions:extensions}),state=_useCodeMirror.state,view=_useCodeMirror.view,container=_useCodeMirror.container,setContainer=_useCodeMirror.setContainer;(0,external_root_React_commonjs2_react_commonjs_react_amd_react_.useImperativeHandle)(ref,function(){return{editor:editor.current,state:state,view:view};},[editor,container,state,view]);// check type of value
|
|
10528
10546
|
if(typeof value!=='string'){throw new Error("value must be typeof string but got ".concat(typeof value));}var defaultClassNames=typeof theme==='string'?"cm-theme-".concat(theme):'cm-theme';return/*#__PURE__*/(0,jsx_runtime.jsx)("div",_objectSpread2({ref:editor,className:"".concat(defaultClassNames).concat(className?" ".concat(className):'')},other));});ReactCodeMirror.displayName='CodeMirror';/* harmony default export */ const src = (ReactCodeMirror);
|
|
10529
10547
|
})();
|
|
10530
10548
|
|