@uiw/react-codemirror 4.9.5 → 4.10.1
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 +33 -0
- package/cjs/index.d.ts +4 -0
- package/cjs/index.js +19 -8
- package/cjs/index.js.map +3 -4
- package/cjs/useCodeMirror.d.ts +2 -2
- package/cjs/useCodeMirror.js +11 -2
- package/cjs/useCodeMirror.js.map +4 -2
- package/cjs/utils.d.ts +28 -0
- package/cjs/utils.js +28 -0
- package/cjs/utils.js.map +35 -0
- package/dist/mdeditor.js +42 -21
- package/dist/mdeditor.min.js +1 -1
- package/esm/index.d.ts +4 -0
- package/esm/index.js +10 -10
- package/esm/index.js.map +4 -4
- package/esm/useCodeMirror.d.ts +2 -2
- package/esm/useCodeMirror.js +8 -2
- package/esm/useCodeMirror.js.map +4 -2
- package/esm/utils.d.ts +28 -0
- package/esm/utils.js +13 -0
- package/esm/utils.js.map +35 -0
- package/package.json +1 -1
- package/src/index.tsx +15 -7
- package/src/useCodeMirror.ts +7 -2
- package/src/utils.ts +41 -0
package/README.md
CHANGED
|
@@ -307,6 +307,8 @@ export interface ReactCodeMirrorProps
|
|
|
307
307
|
indentWithTab?: boolean;
|
|
308
308
|
/** Fired whenever a change occurs to the document. */
|
|
309
309
|
onChange?(value: string, viewUpdate: ViewUpdate): void;
|
|
310
|
+
/** Some data on the statistics editor. */
|
|
311
|
+
onStatistics?(data: Statistics): void;
|
|
310
312
|
/** Fired whenever any state change occurs within the editor, including non-document changes like lint results. */
|
|
311
313
|
onUpdate?(viewUpdate: ViewUpdate): void;
|
|
312
314
|
/**
|
|
@@ -359,6 +361,37 @@ export interface BasicSetupOptions {
|
|
|
359
361
|
}
|
|
360
362
|
```
|
|
361
363
|
|
|
364
|
+
```ts
|
|
365
|
+
import { EditorSelection, SelectionRange } from '@codemirror/state';
|
|
366
|
+
import { ViewUpdate } from '@codemirror/view';
|
|
367
|
+
export interface Statistics {
|
|
368
|
+
/** Get the number of lines in the editor. */
|
|
369
|
+
lineCount: number;
|
|
370
|
+
/** total length of the document */
|
|
371
|
+
length: number;
|
|
372
|
+
/** Get the proper [line-break](https://codemirror.net/docs/ref/#state.EditorState^lineSeparator) string for this state. */
|
|
373
|
+
lineBreak: string;
|
|
374
|
+
/** Returns true when the editor is [configured](https://codemirror.net/6/docs/ref/#state.EditorState^readOnly) to be read-only. */
|
|
375
|
+
readOnly: boolean;
|
|
376
|
+
/** The size (in columns) of a tab in the document, determined by the [`tabSize`](https://codemirror.net/6/docs/ref/#state.EditorState^tabSize) facet. */
|
|
377
|
+
tabSize: number;
|
|
378
|
+
/** Cursor Position */
|
|
379
|
+
selection: EditorSelection;
|
|
380
|
+
/** Retrieves a list of all current selections. */
|
|
381
|
+
ranges: readonly SelectionRange[];
|
|
382
|
+
/** Get the currently selected code. */
|
|
383
|
+
selectionCode: string;
|
|
384
|
+
/**
|
|
385
|
+
* The length of the given array should be the same as the number of active selections.
|
|
386
|
+
* Replaces the content of the selections with the strings in the array.
|
|
387
|
+
*/
|
|
388
|
+
selections: string[];
|
|
389
|
+
/** Return true if any text is selected. */
|
|
390
|
+
selectedText: boolean;
|
|
391
|
+
}
|
|
392
|
+
export declare const getStatistics: (view: ViewUpdate) => Statistics;
|
|
393
|
+
```
|
|
394
|
+
|
|
362
395
|
## Packages
|
|
363
396
|
|
|
364
397
|
| Name | NPM Version | Website |
|
package/cjs/index.d.ts
CHANGED
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { EditorState, EditorStateConfig, Extension } from '@codemirror/state';
|
|
3
3
|
import { EditorView, ViewUpdate } from '@codemirror/view';
|
|
4
|
+
import { Statistics } from './utils';
|
|
4
5
|
import { BasicSetupOptions } from './basicSetup';
|
|
5
6
|
export * from './basicSetup';
|
|
6
7
|
export * from './useCodeMirror';
|
|
8
|
+
export * from './utils';
|
|
7
9
|
export interface ReactCodeMirrorProps extends Omit<EditorStateConfig, 'doc' | 'extensions'>, Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange' | 'placeholder'> {
|
|
8
10
|
/** value of the auto created model in the editor. */
|
|
9
11
|
value?: string;
|
|
@@ -44,6 +46,8 @@ export interface ReactCodeMirrorProps extends Omit<EditorStateConfig, 'doc' | 'e
|
|
|
44
46
|
indentWithTab?: boolean;
|
|
45
47
|
/** Fired whenever a change occurs to the document. */
|
|
46
48
|
onChange?(value: string, viewUpdate: ViewUpdate): void;
|
|
49
|
+
/** Some data on the statistics editor. */
|
|
50
|
+
onStatistics?(data: Statistics): void;
|
|
47
51
|
/** Fired whenever any state change occurs within the editor, including non-document changes like lint results. */
|
|
48
52
|
onUpdate?(viewUpdate: ViewUpdate): void;
|
|
49
53
|
/**
|
package/cjs/index.js
CHANGED
|
@@ -47,9 +47,22 @@ Object.keys(_basicSetup).forEach(function (key) {
|
|
|
47
47
|
}
|
|
48
48
|
});
|
|
49
49
|
});
|
|
50
|
-
var _excluded = ["className", "value", "selection", "extensions", "onChange", "onUpdate", "autoFocus", "theme", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "basicSetup", "placeholder", "indentWithTab", "editable", "readOnly", "root"];
|
|
51
50
|
|
|
52
|
-
var
|
|
51
|
+
var _utils = require("./utils");
|
|
52
|
+
|
|
53
|
+
Object.keys(_utils).forEach(function (key) {
|
|
54
|
+
if (key === "default" || key === "__esModule") return;
|
|
55
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
56
|
+
if (key in exports && exports[key] === _utils[key]) return;
|
|
57
|
+
Object.defineProperty(exports, key, {
|
|
58
|
+
enumerable: true,
|
|
59
|
+
get: function get() {
|
|
60
|
+
return _utils[key];
|
|
61
|
+
}
|
|
62
|
+
});
|
|
63
|
+
});
|
|
64
|
+
var _excluded = ["className", "value", "selection", "extensions", "onChange", "onStatistics", "onUpdate", "autoFocus", "theme", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "basicSetup", "placeholder", "indentWithTab", "editable", "readOnly", "root"];
|
|
65
|
+
var ReactCodeMirror = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
53
66
|
var className = props.className,
|
|
54
67
|
_props$value = props.value,
|
|
55
68
|
value = _props$value === void 0 ? '' : _props$value,
|
|
@@ -57,6 +70,7 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
57
70
|
_props$extensions = props.extensions,
|
|
58
71
|
extensions = _props$extensions === void 0 ? [] : _props$extensions,
|
|
59
72
|
onChange = props.onChange,
|
|
73
|
+
onStatistics = props.onStatistics,
|
|
60
74
|
onUpdate = props.onUpdate,
|
|
61
75
|
autoFocus = props.autoFocus,
|
|
62
76
|
_props$theme = props.theme,
|
|
@@ -95,6 +109,7 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
95
109
|
readOnly: readOnly,
|
|
96
110
|
selection: selection,
|
|
97
111
|
onChange: onChange,
|
|
112
|
+
onStatistics: onStatistics,
|
|
98
113
|
onUpdate: onUpdate,
|
|
99
114
|
extensions: extensions
|
|
100
115
|
}),
|
|
@@ -105,14 +120,11 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
105
120
|
|
|
106
121
|
(0, _react.useImperativeHandle)(ref, function () {
|
|
107
122
|
return {
|
|
108
|
-
editor:
|
|
123
|
+
editor: editor.current,
|
|
109
124
|
state: state,
|
|
110
125
|
view: view
|
|
111
126
|
};
|
|
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
|
|
127
|
+
}, [editor, container, state, view]); // check type of value
|
|
116
128
|
|
|
117
129
|
if (typeof value !== 'string') {
|
|
118
130
|
throw new Error("value must be typeof string but got ".concat((0, _typeof2["default"])(value)));
|
|
@@ -124,7 +136,6 @@ var ReactCodeMirror = /*#__PURE__*/_react["default"].forwardRef(function (props,
|
|
|
124
136
|
className: "".concat(defaultClassNames).concat(className ? " ".concat(className) : '')
|
|
125
137
|
}, other));
|
|
126
138
|
});
|
|
127
|
-
|
|
128
139
|
ReactCodeMirror.displayName = 'CodeMirror';
|
|
129
140
|
var _default = ReactCodeMirror;
|
|
130
141
|
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",
|
|
@@ -11,6 +10,7 @@
|
|
|
11
10
|
"selection",
|
|
12
11
|
"extensions",
|
|
13
12
|
"onChange",
|
|
13
|
+
"onStatistics",
|
|
14
14
|
"onUpdate",
|
|
15
15
|
"autoFocus",
|
|
16
16
|
"theme",
|
|
@@ -36,7 +36,6 @@
|
|
|
36
36
|
"view",
|
|
37
37
|
"setContainer",
|
|
38
38
|
"useImperativeHandle",
|
|
39
|
-
"useEffect",
|
|
40
39
|
"Error",
|
|
41
40
|
"defaultClassNames",
|
|
42
41
|
"displayName"
|
|
@@ -45,7 +44,7 @@
|
|
|
45
44
|
"../src/index.tsx"
|
|
46
45
|
],
|
|
47
46
|
"sourcesContent": [
|
|
48
|
-
"import React, {
|
|
47
|
+
"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 { Statistics } from './utils';\nimport { BasicSetupOptions } from './basicSetup';\n\nexport * from './basicSetup';\nexport * from './useCodeMirror';\nexport * from './utils';\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 /** Some data on the statistics editor. */\n onStatistics?(data: Statistics): 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 onStatistics,\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 onStatistics,\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
48
|
],
|
|
50
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;;AAGA;;
|
|
49
|
+
"mappings": "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"
|
|
51
50
|
}
|
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
|
@@ -21,10 +21,13 @@ var _themeOneDark = require("@codemirror/theme-one-dark");
|
|
|
21
21
|
|
|
22
22
|
var _basicSetup = require("./basicSetup");
|
|
23
23
|
|
|
24
|
+
var _utils = require("./utils");
|
|
25
|
+
|
|
24
26
|
function useCodeMirror(props) {
|
|
25
27
|
var value = props.value,
|
|
26
28
|
selection = props.selection,
|
|
27
29
|
onChange = props.onChange,
|
|
30
|
+
onStatistics = props.onStatistics,
|
|
28
31
|
onUpdate = props.onUpdate,
|
|
29
32
|
_props$extensions = props.extensions,
|
|
30
33
|
extensions = _props$extensions === void 0 ? [] : _props$extensions,
|
|
@@ -55,7 +58,7 @@ function useCodeMirror(props) {
|
|
|
55
58
|
defaultBasicSetup = _props$basicSetup === void 0 ? true : _props$basicSetup,
|
|
56
59
|
root = props.root;
|
|
57
60
|
|
|
58
|
-
var _useState = (0, _react.useState)(
|
|
61
|
+
var _useState = (0, _react.useState)(),
|
|
59
62
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
60
63
|
container = _useState2[0],
|
|
61
64
|
setContainer = _useState2[1];
|
|
@@ -97,6 +100,8 @@ function useCodeMirror(props) {
|
|
|
97
100
|
|
|
98
101
|
onChange(_value, vu);
|
|
99
102
|
}
|
|
103
|
+
|
|
104
|
+
onStatistics && onStatistics((0, _utils.getStatistics)(vu));
|
|
100
105
|
});
|
|
101
106
|
|
|
102
107
|
var getExtensions = [updateListener, defaultThemeOption];
|
|
@@ -166,10 +171,14 @@ function useCodeMirror(props) {
|
|
|
166
171
|
|
|
167
172
|
return function () {
|
|
168
173
|
if (view) {
|
|
174
|
+
setState(undefined);
|
|
169
175
|
setView(undefined);
|
|
170
176
|
}
|
|
171
|
-
};
|
|
177
|
+
};
|
|
172
178
|
}, [container, state]);
|
|
179
|
+
(0, _react.useEffect)(function () {
|
|
180
|
+
return setContainer(props.container);
|
|
181
|
+
}, [props.container]);
|
|
173
182
|
(0, _react.useEffect)(function () {
|
|
174
183
|
return function () {
|
|
175
184
|
if (view) {
|
package/cjs/useCodeMirror.js.map
CHANGED
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
"value",
|
|
7
7
|
"selection",
|
|
8
8
|
"onChange",
|
|
9
|
+
"onStatistics",
|
|
9
10
|
"onUpdate",
|
|
10
11
|
"extensions",
|
|
11
12
|
"autoFocus",
|
|
@@ -43,6 +44,7 @@
|
|
|
43
44
|
"docChanged",
|
|
44
45
|
"doc",
|
|
45
46
|
"toString",
|
|
47
|
+
"getStatistics",
|
|
46
48
|
"getExtensions",
|
|
47
49
|
"unshift",
|
|
48
50
|
"keymap",
|
|
@@ -73,7 +75,7 @@
|
|
|
73
75
|
"../src/useCodeMirror.ts"
|
|
74
76
|
],
|
|
75
77
|
"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(
|
|
78
|
+
"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 { getStatistics } from './utils';\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 onStatistics,\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 onStatistics && onStatistics(getStatistics(vu));\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
79
|
],
|
|
78
|
-
"mappings": ";;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAOO,SAASA,aAAT,CAAuBC,KAAvB,EAA6C;EAClD,IACEC,KADF,
|
|
80
|
+
"mappings": "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"
|
|
79
81
|
}
|
package/cjs/utils.d.ts
ADDED
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { EditorSelection, SelectionRange } from '@codemirror/state';
|
|
2
|
+
import { ViewUpdate } from '@codemirror/view';
|
|
3
|
+
export interface Statistics {
|
|
4
|
+
/** Get the number of lines in the editor. */
|
|
5
|
+
lineCount: number;
|
|
6
|
+
/** total length of the document */
|
|
7
|
+
length: number;
|
|
8
|
+
/** Get the proper [line-break](https://codemirror.net/docs/ref/#state.EditorState^lineSeparator) string for this state. */
|
|
9
|
+
lineBreak: string;
|
|
10
|
+
/** Returns true when the editor is [configured](https://codemirror.net/6/docs/ref/#state.EditorState^readOnly) to be read-only. */
|
|
11
|
+
readOnly: boolean;
|
|
12
|
+
/** The size (in columns) of a tab in the document, determined by the [`tabSize`](https://codemirror.net/6/docs/ref/#state.EditorState^tabSize) facet. */
|
|
13
|
+
tabSize: number;
|
|
14
|
+
/** Cursor Position */
|
|
15
|
+
selection: EditorSelection;
|
|
16
|
+
/** Retrieves a list of all current selections. */
|
|
17
|
+
ranges: readonly SelectionRange[];
|
|
18
|
+
/** Get the currently selected code. */
|
|
19
|
+
selectionCode: string;
|
|
20
|
+
/**
|
|
21
|
+
* The length of the given array should be the same as the number of active selections.
|
|
22
|
+
* Replaces the content of the selections with the strings in the array.
|
|
23
|
+
*/
|
|
24
|
+
selections: string[];
|
|
25
|
+
/** Return true if any text is selected. */
|
|
26
|
+
selectedText: boolean;
|
|
27
|
+
}
|
|
28
|
+
export declare const getStatistics: (view: ViewUpdate) => Statistics;
|
package/cjs/utils.js
ADDED
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.getStatistics = void 0;
|
|
7
|
+
|
|
8
|
+
var getStatistics = function getStatistics(view) {
|
|
9
|
+
return {
|
|
10
|
+
lineCount: view.state.doc.lines,
|
|
11
|
+
length: view.state.doc.length,
|
|
12
|
+
lineBreak: view.state.lineBreak,
|
|
13
|
+
readOnly: view.state.readOnly,
|
|
14
|
+
tabSize: view.state.tabSize,
|
|
15
|
+
selection: view.state.selection,
|
|
16
|
+
ranges: view.state.selection.ranges,
|
|
17
|
+
selectionCode: view.state.sliceDoc(view.state.selection.main.from, view.state.selection.main.to),
|
|
18
|
+
selections: view.state.selection.ranges.map(function (r) {
|
|
19
|
+
return view.state.sliceDoc(r.from, r.to);
|
|
20
|
+
}),
|
|
21
|
+
selectedText: view.state.selection.ranges.some(function (r) {
|
|
22
|
+
return !r.empty;
|
|
23
|
+
})
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
exports.getStatistics = getStatistics;
|
|
28
|
+
//# sourceMappingURL=utils.js.map
|
package/cjs/utils.js.map
ADDED
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"names": [
|
|
4
|
+
"getStatistics",
|
|
5
|
+
"view",
|
|
6
|
+
"lineCount",
|
|
7
|
+
"state",
|
|
8
|
+
"doc",
|
|
9
|
+
"lines",
|
|
10
|
+
"length",
|
|
11
|
+
"lineBreak",
|
|
12
|
+
"readOnly",
|
|
13
|
+
"tabSize",
|
|
14
|
+
"selection",
|
|
15
|
+
"ranges",
|
|
16
|
+
"selectionCode",
|
|
17
|
+
"sliceDoc",
|
|
18
|
+
"main",
|
|
19
|
+
"from",
|
|
20
|
+
"to",
|
|
21
|
+
"selections",
|
|
22
|
+
"map",
|
|
23
|
+
"r",
|
|
24
|
+
"selectedText",
|
|
25
|
+
"some",
|
|
26
|
+
"empty"
|
|
27
|
+
],
|
|
28
|
+
"sources": [
|
|
29
|
+
"../src/utils.ts"
|
|
30
|
+
],
|
|
31
|
+
"sourcesContent": [
|
|
32
|
+
"import { EditorSelection, SelectionRange } from '@codemirror/state';\nimport { ViewUpdate } from '@codemirror/view';\n\nexport interface Statistics {\n /** Get the number of lines in the editor. */\n lineCount: number;\n /** total length of the document */\n length: number;\n /** Get the proper [line-break](https://codemirror.net/docs/ref/#state.EditorState^lineSeparator) string for this state. */\n lineBreak: string;\n /** Returns true when the editor is [configured](https://codemirror.net/6/docs/ref/#state.EditorState^readOnly) to be read-only. */\n readOnly: boolean;\n /** The size (in columns) of a tab in the document, determined by the [`tabSize`](https://codemirror.net/6/docs/ref/#state.EditorState^tabSize) facet. */\n tabSize: number;\n /** Cursor Position */\n selection: EditorSelection;\n /** Retrieves a list of all current selections. */\n ranges: readonly SelectionRange[];\n /** Get the currently selected code. */\n selectionCode: string;\n /**\n * The length of the given array should be the same as the number of active selections.\n * Replaces the content of the selections with the strings in the array.\n */\n selections: string[];\n /** Return true if any text is selected. */\n selectedText: boolean;\n}\n\nexport const getStatistics = (view: ViewUpdate): Statistics => ({\n lineCount: view.state.doc.lines,\n length: view.state.doc.length,\n lineBreak: view.state.lineBreak,\n readOnly: view.state.readOnly,\n tabSize: view.state.tabSize,\n selection: view.state.selection,\n ranges: view.state.selection.ranges,\n selectionCode: view.state.sliceDoc(view.state.selection.main.from, view.state.selection.main.to),\n selections: view.state.selection.ranges.map((r) => view.state.sliceDoc(r.from, r.to)),\n selectedText: view.state.selection.ranges.some((r) => !r.empty),\n});\n"
|
|
33
|
+
],
|
|
34
|
+
"mappings": ";;;;;;;AA6BO,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CAACC,IAAD;EAAA,OAAmC;IAC9DC,SAAS,EAAED,IAAI,CAACE,KAAL,CAAWC,GAAX,CAAeC,KADoC;IAE9DC,MAAM,EAAEL,IAAI,CAACE,KAAL,CAAWC,GAAX,CAAeE,MAFuC;IAG9DC,SAAS,EAAEN,IAAI,CAACE,KAAL,CAAWI,SAHwC;IAI9DC,QAAQ,EAAEP,IAAI,CAACE,KAAL,CAAWK,QAJyC;IAK9DC,OAAO,EAAER,IAAI,CAACE,KAAL,CAAWM,OAL0C;IAM9DC,SAAS,EAAET,IAAI,CAACE,KAAL,CAAWO,SANwC;IAO9DC,MAAM,EAAEV,IAAI,CAACE,KAAL,CAAWO,SAAX,CAAqBC,MAPiC;IAQ9DC,aAAa,EAAEX,IAAI,CAACE,KAAL,CAAWU,QAAX,CAAoBZ,IAAI,CAACE,KAAL,CAAWO,SAAX,CAAqBI,IAArB,CAA0BC,IAA9C,EAAoDd,IAAI,CAACE,KAAL,CAAWO,SAAX,CAAqBI,IAArB,CAA0BE,EAA9E,CAR+C;IAS9DC,UAAU,EAAEhB,IAAI,CAACE,KAAL,CAAWO,SAAX,CAAqBC,MAArB,CAA4BO,GAA5B,CAAgC,UAACC,CAAD;MAAA,OAAOlB,IAAI,CAACE,KAAL,CAAWU,QAAX,CAAoBM,CAAC,CAACJ,IAAtB,EAA4BI,CAAC,CAACH,EAA9B,CAAP;IAAA,CAAhC,CATkD;IAU9DI,YAAY,EAAEnB,IAAI,CAACE,KAAL,CAAWO,SAAX,CAAqBC,MAArB,CAA4BU,IAA5B,CAAiC,UAACF,CAAD;MAAA,OAAO,CAACA,CAAC,CAACG,KAAV;IAAA,CAAjC;EAVgD,CAAnC;AAAA,CAAtB"
|
|
35
|
+
}
|
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
|
|
@@ -149,6 +137,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
149
137
|
__webpack_require__.d(__webpack_exports__, {
|
|
150
138
|
"basicSetup": () => (/* reexport */ basicSetup),
|
|
151
139
|
"default": () => (/* binding */ src),
|
|
140
|
+
"getStatistics": () => (/* reexport */ getStatistics),
|
|
152
141
|
"useCodeMirror": () => (/* reexport */ useCodeMirror)
|
|
153
142
|
});
|
|
154
143
|
|
|
@@ -232,7 +221,6 @@ function _objectWithoutProperties(source, excluded) {
|
|
|
232
221
|
}
|
|
233
222
|
// EXTERNAL MODULE: external {"root":"React","commonjs2":"react","commonjs":"react","amd":"react"}
|
|
234
223
|
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
224
|
;// CONCATENATED MODULE: ../node_modules/@babel/runtime/helpers/esm/arrayWithHoles.js
|
|
237
225
|
function _arrayWithHoles(arr) {
|
|
238
226
|
if (Array.isArray(arr)) return arr;
|
|
@@ -3748,6 +3736,31 @@ function getIndentation(context, pos) {
|
|
|
3748
3736
|
return tree ? syntaxIndentation(context, tree, pos) : null;
|
|
3749
3737
|
}
|
|
3750
3738
|
/**
|
|
3739
|
+
Create a change set that auto-indents all lines touched by the
|
|
3740
|
+
given document range.
|
|
3741
|
+
*/
|
|
3742
|
+
function indentRange(state, from, to) {
|
|
3743
|
+
let updated = Object.create(null);
|
|
3744
|
+
let context = new IndentContext(state, { overrideIndentation: start => { var _a; return (_a = updated[start]) !== null && _a !== void 0 ? _a : -1; } });
|
|
3745
|
+
let changes = [];
|
|
3746
|
+
for (let pos = from; pos <= to;) {
|
|
3747
|
+
let line = state.doc.lineAt(pos);
|
|
3748
|
+
let indent = getIndentation(context, line.from);
|
|
3749
|
+
if (indent == null)
|
|
3750
|
+
continue;
|
|
3751
|
+
if (!/\S/.test(line.text))
|
|
3752
|
+
indent = 0;
|
|
3753
|
+
let cur = /^\s*/.exec(line.text)[0];
|
|
3754
|
+
let norm = indentString(state, indent);
|
|
3755
|
+
if (cur != norm) {
|
|
3756
|
+
updated[line.from] = indent;
|
|
3757
|
+
changes.push({ from: line.from, to: line.from + cur.length, insert: norm });
|
|
3758
|
+
}
|
|
3759
|
+
pos = line.to + 1;
|
|
3760
|
+
}
|
|
3761
|
+
return state.changes(changes);
|
|
3762
|
+
}
|
|
3763
|
+
/**
|
|
3751
3764
|
Indentation contexts are used when calling [indentation
|
|
3752
3765
|
services](https://codemirror.net/6/docs/ref/#language.indentService). They provide helper utilities
|
|
3753
3766
|
useful in indentation logic, and can selectively override the
|
|
@@ -4729,7 +4742,7 @@ function matchPlainBrackets(state, pos, dir, tree, tokenType, maxScanDistance, b
|
|
|
4729
4742
|
let basePos = pos + distance * dir;
|
|
4730
4743
|
for (let pos = dir > 0 ? 0 : text.length - 1, end = dir > 0 ? text.length : -1; pos != end; pos += dir) {
|
|
4731
4744
|
let found = brackets.indexOf(text[pos]);
|
|
4732
|
-
if (found < 0 || tree.
|
|
4745
|
+
if (found < 0 || tree.resolveInner(basePos + pos, 1).type != tokenType)
|
|
4733
4746
|
continue;
|
|
4734
4747
|
if ((found % 2 == 0) == (dir > 0)) {
|
|
4735
4748
|
depth++;
|
|
@@ -5612,7 +5625,10 @@ class HistEvent {
|
|
|
5612
5625
|
// changes == startSelection == undefined
|
|
5613
5626
|
changes,
|
|
5614
5627
|
// The effects associated with this event
|
|
5615
|
-
effects,
|
|
5628
|
+
effects,
|
|
5629
|
+
// Accumulated mapping (from addToHistory==false) that should be
|
|
5630
|
+
// applied to events below this one.
|
|
5631
|
+
mapped,
|
|
5616
5632
|
// The selection before this event
|
|
5617
5633
|
startSelection,
|
|
5618
5634
|
// Stores selection changes after this event, to be used for
|
|
@@ -5811,13 +5827,14 @@ HistoryState.empty = /*@__PURE__*/new HistoryState(none, none);
|
|
|
5811
5827
|
Default key bindings for the undo history.
|
|
5812
5828
|
|
|
5813
5829
|
- 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).
|
|
5830
|
+
- Mod-y (Mod-Shift-z on macOS) + Ctrl-Shift-z on Linux: [`redo`](https://codemirror.net/6/docs/ref/#commands.redo).
|
|
5815
5831
|
- Mod-u: [`undoSelection`](https://codemirror.net/6/docs/ref/#commands.undoSelection).
|
|
5816
5832
|
- Alt-u (Mod-Shift-u on macOS): [`redoSelection`](https://codemirror.net/6/docs/ref/#commands.redoSelection).
|
|
5817
5833
|
*/
|
|
5818
5834
|
const historyKeymap = [
|
|
5819
5835
|
{ key: "Mod-z", run: undo, preventDefault: true },
|
|
5820
5836
|
{ key: "Mod-y", mac: "Mod-Shift-z", run: redo, preventDefault: true },
|
|
5837
|
+
{ linux: "Ctrl-Shift-z", run: redo, preventDefault: true },
|
|
5821
5838
|
{ key: "Mod-u", run: undoSelection, preventDefault: true },
|
|
5822
5839
|
{ key: "Alt-u", mac: "Mod-Shift-u", run: redoSelection, preventDefault: true }
|
|
5823
5840
|
];
|
|
@@ -6269,7 +6286,11 @@ function deleteBy({ state, dispatch }, by) {
|
|
|
6269
6286
|
});
|
|
6270
6287
|
if (changes.changes.empty)
|
|
6271
6288
|
return false;
|
|
6272
|
-
dispatch(state.update(changes, {
|
|
6289
|
+
dispatch(state.update(changes, {
|
|
6290
|
+
scrollIntoView: true,
|
|
6291
|
+
userEvent: event,
|
|
6292
|
+
effects: event == "delete.selection" ? view_.EditorView.announce.of(state.phrase("Selection deleted")) : undefined
|
|
6293
|
+
}));
|
|
6273
6294
|
return true;
|
|
6274
6295
|
}
|
|
6275
6296
|
function skipAtomic(target, pos, forward) {
|
|
@@ -10516,15 +10537,15 @@ you take this package's source (which is just a bunch of imports
|
|
|
10516
10537
|
and an array literal), copy it into your own code, and adjust it
|
|
10517
10538
|
as desired.
|
|
10518
10539
|
*/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);};
|
|
10540
|
+
;// CONCATENATED MODULE: ./src/utils.ts
|
|
10541
|
+
var getStatistics=function getStatistics(view){return{lineCount:view.state.doc.lines,length:view.state.doc.length,lineBreak:view.state.lineBreak,readOnly:view.state.readOnly,tabSize:view.state.tabSize,selection:view.state.selection,ranges:view.state.selection.ranges,selectionCode:view.state.sliceDoc(view.state.selection.main.from,view.state.selection.main.to),selections:view.state.selection.ranges.map(function(r){return view.state.sliceDoc(r.from,r.to);}),selectedText:view.state.selection.ranges.some(function(r){return!r.empty;})};};
|
|
10519
10542
|
;// 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
|
|
10543
|
+
function useCodeMirror(props){var value=props.value,selection=props.selection,onChange=props.onChange,onStatistics=props.onStatistics,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);}onStatistics&&onStatistics(getStatistics(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
10544
|
},[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
10545
|
// EXTERNAL MODULE: ../node_modules/react/jsx-runtime.js
|
|
10524
10546
|
var jsx_runtime = __webpack_require__(605);
|
|
10525
10547
|
;// 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
|
|
10548
|
+
var _excluded=["className","value","selection","extensions","onChange","onStatistics","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,onStatistics=props.onStatistics,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,onStatistics:onStatistics,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
10549
|
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
10550
|
})();
|
|
10530
10551
|
|