@uiw/react-codemirror 4.6.0 → 4.8.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 +13 -5
- package/cjs/index.d.ts +0 -3
- package/cjs/index.js +0 -41
- package/cjs/index.js.map +10 -6
- package/cjs/theme/light.js.map +5 -5
- package/cjs/useCodeMirror.js +11 -5
- package/cjs/useCodeMirror.js.map +12 -8
- package/dist/codemirror.js +7620 -1998
- package/dist/codemirror.min.js +1 -1
- package/esm/index.d.ts +0 -3
- package/esm/index.js +0 -3
- package/esm/index.js.map +6 -6
- package/esm/theme/light.js.map +5 -5
- package/esm/useCodeMirror.js +8 -2
- package/esm/useCodeMirror.js.map +9 -7
- package/package.json +24 -25
- package/src/index.tsx +0 -3
- package/src/useCodeMirror.ts +11 -2
- package/cjs/theme/light.d.ts +0 -1
- package/esm/theme/light.d.ts +0 -1
package/esm/useCodeMirror.js.map
CHANGED
|
@@ -1,8 +1,5 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": [
|
|
4
|
-
"../src/useCodeMirror.ts"
|
|
5
|
-
],
|
|
6
3
|
"names": [
|
|
7
4
|
"useEffect",
|
|
8
5
|
"useState",
|
|
@@ -14,7 +11,6 @@
|
|
|
14
11
|
"keymap",
|
|
15
12
|
"placeholder",
|
|
16
13
|
"oneDark",
|
|
17
|
-
"defaultLightThemeOption",
|
|
18
14
|
"useCodeMirror",
|
|
19
15
|
"props",
|
|
20
16
|
"value",
|
|
@@ -42,6 +38,9 @@
|
|
|
42
38
|
"setView",
|
|
43
39
|
"state",
|
|
44
40
|
"setState",
|
|
41
|
+
"defaultLightThemeOption",
|
|
42
|
+
"backgroundColor",
|
|
43
|
+
"dark",
|
|
45
44
|
"defaultThemeOption",
|
|
46
45
|
"updateListener",
|
|
47
46
|
"of",
|
|
@@ -70,8 +69,11 @@
|
|
|
70
69
|
"effects",
|
|
71
70
|
"reconfigure"
|
|
72
71
|
],
|
|
73
|
-
"
|
|
72
|
+
"sources": [
|
|
73
|
+
"../src/useCodeMirror.ts"
|
|
74
|
+
],
|
|
74
75
|
"sourcesContent": [
|
|
75
|
-
"import { useEffect, useState } from 'react';\nimport { basicSetup } from '
|
|
76
|
-
]
|
|
76
|
+
"import { useEffect, useState } from 'react';\nimport { basicSetup } from 'codemirror';\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 { 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(props.container);\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 let getExtensions = [updateListener, defaultThemeOption];\n if (defaultIndentWithTab) {\n getExtensions.unshift(keymap.of([indentWithTab]));\n }\n if (defaultBasicSetup) {\n getExtensions.unshift(basicSetup);\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 setView(undefined);\n }\n };\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [container, state]);\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 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 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 placeholderStr,\n minWidth,\n maxWidth,\n editable,\n defaultIndentWithTab,\n defaultBasicSetup,\n ]);\n\n return { state, setState, view, setView, container, setContainer };\n}\n"
|
|
77
|
+
],
|
|
78
|
+
"mappings": "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"
|
|
77
79
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uiw/react-codemirror",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.8.1",
|
|
4
4
|
"description": "CodeMirror component for React.",
|
|
5
5
|
"homepage": "https://uiwjs.github.io/react-codemirror",
|
|
6
6
|
"main": "cjs/index.js",
|
|
@@ -62,26 +62,23 @@
|
|
|
62
62
|
},
|
|
63
63
|
"dependencies": {
|
|
64
64
|
"@babel/runtime": ">=7.11.0",
|
|
65
|
-
"@codemirror/
|
|
66
|
-
"
|
|
67
|
-
"@codemirror/theme-one-dark": "^0.19.1",
|
|
68
|
-
"@codemirror/view": "^0.19.45"
|
|
65
|
+
"@codemirror/theme-one-dark": "^6.0.0",
|
|
66
|
+
"codemirror": "^6.0.0"
|
|
69
67
|
},
|
|
70
68
|
"devDependencies": {
|
|
71
|
-
"@codemirror/lang-cpp": "~0.
|
|
72
|
-
"@codemirror/lang-html": "~0.
|
|
73
|
-
"@codemirror/lang-java": "~0.
|
|
74
|
-
"@codemirror/lang-javascript": "~0.
|
|
75
|
-
"@codemirror/lang-json": "~0.
|
|
76
|
-
"@codemirror/lang-lezer": "~0.
|
|
77
|
-
"@codemirror/lang-markdown": "~0.
|
|
78
|
-
"@codemirror/lang-php": "~0.
|
|
79
|
-
"@codemirror/lang-python": "~0.
|
|
80
|
-
"@codemirror/lang-rust": "~0.
|
|
81
|
-
"@codemirror/lang-sql": "~0.
|
|
82
|
-
"@codemirror/lang-xml": "~0.
|
|
83
|
-
"@codemirror/legacy-modes": "~0.
|
|
84
|
-
"@codemirror/stream-parser": "~0.19.6",
|
|
69
|
+
"@codemirror/lang-cpp": "~6.0.0",
|
|
70
|
+
"@codemirror/lang-html": "~6.0.0",
|
|
71
|
+
"@codemirror/lang-java": "~6.0.0",
|
|
72
|
+
"@codemirror/lang-javascript": "~6.0.0",
|
|
73
|
+
"@codemirror/lang-json": "~6.0.0",
|
|
74
|
+
"@codemirror/lang-lezer": "~6.0.0",
|
|
75
|
+
"@codemirror/lang-markdown": "~6.0.0",
|
|
76
|
+
"@codemirror/lang-php": "~6.0.0",
|
|
77
|
+
"@codemirror/lang-python": "~6.0.0",
|
|
78
|
+
"@codemirror/lang-rust": "~6.0.0",
|
|
79
|
+
"@codemirror/lang-sql": "~6.0.0",
|
|
80
|
+
"@codemirror/lang-xml": "~6.0.0",
|
|
81
|
+
"@codemirror/legacy-modes": "~6.0.0",
|
|
85
82
|
"@kkt/less-modules": "~7.1.1",
|
|
86
83
|
"@kkt/ncc": "~1.0.8",
|
|
87
84
|
"@kkt/raw-modules": "~7.1.1",
|
|
@@ -89,20 +86,22 @@
|
|
|
89
86
|
"@testing-library/react": "^13.0.0",
|
|
90
87
|
"@types/react": "~18.0.1",
|
|
91
88
|
"@types/react-dom": "~18.0.0",
|
|
92
|
-
"@types/react-test-renderer": "~
|
|
89
|
+
"@types/react-test-renderer": "~18.0.0",
|
|
93
90
|
"@uiw/react-github-corners": "~1.5.14",
|
|
94
91
|
"@uiw/react-markdown-preview": "~4.0.5",
|
|
95
92
|
"@uiw/react-shields": "~1.1.3",
|
|
96
93
|
"@uiw/reset.css": "~1.0.5",
|
|
97
94
|
"@wcj/dark-mode": "~1.0.12",
|
|
98
95
|
"code-example": "~3.3.1",
|
|
99
|
-
"husky": "~
|
|
96
|
+
"husky": "~8.0.0",
|
|
100
97
|
"kkt": "~7.1.5",
|
|
101
|
-
"lint-staged": "~
|
|
98
|
+
"lint-staged": "~13.0.0",
|
|
99
|
+
"markdown-react-code-preview-loader": "^2.1.2",
|
|
102
100
|
"prettier": "~2.6.0",
|
|
103
|
-
"react": "~18.
|
|
104
|
-
"react-
|
|
105
|
-
"react-
|
|
101
|
+
"react": "~18.1.0",
|
|
102
|
+
"react-code-preview-layout": "^2.0.2",
|
|
103
|
+
"react-dom": "~18.1.0",
|
|
104
|
+
"react-test-renderer": "~18.1.0",
|
|
106
105
|
"tsbb": "~3.7.0"
|
|
107
106
|
},
|
|
108
107
|
"browserslist": {
|
package/src/index.tsx
CHANGED
|
@@ -3,9 +3,6 @@ import { EditorState, EditorStateConfig, Extension } from '@codemirror/state';
|
|
|
3
3
|
import { EditorView, ViewUpdate } from '@codemirror/view';
|
|
4
4
|
import { useCodeMirror } from './useCodeMirror';
|
|
5
5
|
|
|
6
|
-
export * from '@codemirror/view';
|
|
7
|
-
export * from '@codemirror/basic-setup';
|
|
8
|
-
export * from '@codemirror/state';
|
|
9
6
|
export * from './useCodeMirror';
|
|
10
7
|
|
|
11
8
|
export interface ReactCodeMirrorProps
|
package/src/useCodeMirror.ts
CHANGED
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { useEffect, useState } from 'react';
|
|
2
|
-
import { basicSetup } from '
|
|
2
|
+
import { basicSetup } from 'codemirror';
|
|
3
3
|
import { EditorState, StateEffect } from '@codemirror/state';
|
|
4
4
|
import { indentWithTab } from '@codemirror/commands';
|
|
5
5
|
import { EditorView, keymap, ViewUpdate, placeholder } from '@codemirror/view';
|
|
6
6
|
import { oneDark } from '@codemirror/theme-one-dark';
|
|
7
7
|
import { ReactCodeMirrorProps } from './';
|
|
8
|
-
import { defaultLightThemeOption } from './theme/light';
|
|
9
8
|
|
|
10
9
|
export interface UseCodeMirror extends ReactCodeMirrorProps {
|
|
11
10
|
container?: HTMLDivElement | null;
|
|
@@ -36,6 +35,16 @@ export function useCodeMirror(props: UseCodeMirror) {
|
|
|
36
35
|
const [container, setContainer] = useState(props.container);
|
|
37
36
|
const [view, setView] = useState<EditorView>();
|
|
38
37
|
const [state, setState] = useState<EditorState>();
|
|
38
|
+
const defaultLightThemeOption = EditorView.theme(
|
|
39
|
+
{
|
|
40
|
+
'&': {
|
|
41
|
+
backgroundColor: '#fff',
|
|
42
|
+
},
|
|
43
|
+
},
|
|
44
|
+
{
|
|
45
|
+
dark: false,
|
|
46
|
+
},
|
|
47
|
+
);
|
|
39
48
|
const defaultThemeOption = EditorView.theme({
|
|
40
49
|
'&': {
|
|
41
50
|
height,
|
package/cjs/theme/light.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const defaultLightThemeOption: import("@codemirror/state").Extension;
|
package/esm/theme/light.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const defaultLightThemeOption: import("@codemirror/state").Extension;
|