@uiw/react-codemirror 4.3.0 → 4.4.0

package/README.md

@@ -164,6 +164,28 @@ export default function App() {
 }
 ```
 
+## Using custom theme
+
+```jsx
+import { oneDark } from '@codemirror/theme-one-dark';
+import CodeMirror from '@uiw/react-codemirror';
+import { javascript } from '@codemirror/lang-javascript';
+
+export default function App() {
+  return (
+    <CodeMirror
+      value="console.log('hello world!');"
+      height="100%"
+      theme={oneDark}
+      extensions={[javascript({ jsx: true })]}
+      onChange={(value, viewUpdate) => {
+        console.log('value:', value);
+      }}
+    />
+  );
+}
+```
+
 ## Props
 
 <!--rehype:style=background-color: #ffe564; display: inline-block; border-bottom: 0; padding: 3px 12px;-->
@@ -171,7 +193,7 @@ export default function App() {
 - `value?: string` value of the auto created model in the editor.
 - `width?: string` width of editor. Defaults to `auto`.
 - `height?: string` height of editor. Defaults to `auto`.
-- `theme?`: `light` / `dark` Defaults to `light`.
+- `theme?`: `'light'` / `'dark'` / `Extension` Defaults to `'light'`.
 
 ```ts
 import React from 'react';
@@ -261,6 +283,13 @@ export default ReactCodeMirror;
 - [@uiw/react-monacoeditor](https://github.com/jaywcjlove/react-monacoeditor): Monaco Editor component for React.
 - [@uiw/react-markdown-editor](https://github.com/uiwjs/react-markdown-editor): A markdown editor with preview, implemented with React.js and TypeScript.
 - [@uiw/react-markdown-preview](https://github.com/uiwjs/react-markdown-preview): React component preview markdown text in web browser.
+- [Online JSON Viewer](https://github.com/uiwjs/json-viewer) Online JSON Viewer, JSON Beautifier to beautify and tree view of JSON data - It works as JSON Pretty Print to pretty print JSON data.
+
+## Contributors
+
+<a href="https://github.com/uiwjs/react-codemirror/graphs/contributors">
+  <img src="https://uiwjs.github.io/react-codemirror/CONTRIBUTORS.svg" />
+</a>
 
 ## License
 

package/cjs/index.js

@@ -12,6 +12,8 @@ exports.default = void 0;
 
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
 var _react = _interopRequireWildcard(require("react"));
@@ -77,7 +79,8 @@ var _excluded = ["className", "value", "selection", "extensions", "onChange", "o
 
 var ReactCodeMirror = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
   var className = props.className,
-      value = props.value,
+      _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,
@@ -132,7 +135,7 @@ var ReactCodeMirror = /*#__PURE__*/_react.default.forwardRef(function (props, re
       state: state,
       view: view
     };
-  });
+  }, [container, state, view]);
   (0, _react.useEffect)(function () {
     setContainer(editor.current);
     return function () {
@@ -140,10 +143,16 @@ var ReactCodeMirror = /*#__PURE__*/_react.default.forwardRef(function (props, re
         view.destroy();
       }
     }; // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  }, []); // check type of value
+
+  if (typeof value !== 'string') {
+    throw new Error("value must be typeof string but got ".concat((0, _typeof2.default)(value)));
+  }
+
+  var defaultClassNames = typeof theme === 'string' ? "cm-theme-".concat(theme) : 'cm-theme';
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", (0, _objectSpread2.default)({
     ref: editor,
-    className: "cm-theme-".concat(theme).concat(className ? " ".concat(className) : '')
+    className: "".concat(defaultClassNames).concat(className ? " ".concat(className) : '')
   }, other));
 });
 

package/cjs/index.js.map

@@ -36,10 +36,12 @@
     "view",
     "setContainer",
     "destroy",
+    "Error",
+    "defaultClassNames",
     "displayName"
   ],
-  "mappings": "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",
+  "mappings": "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",
   "sourcesContent": [
-    "import React, { useEffect, useRef, useImperativeHandle } from 'react';\nimport { EditorState, EditorStateConfig, Extension } from '@codemirror/state';\nimport { EditorView, ViewUpdate } from '@codemirror/view';\nimport { useCodeMirror } from './useCodeMirror';\n\nexport * from '@codemirror/view';\nexport * from '@codemirror/basic-setup';\nexport * from '@codemirror/state';\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;\n  /**\n   * This disables editing of the editor content by the user.\n   * @default true\n   */\n  editable?: 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 a change occurs to the document. There is a certain difference with `onChange`. */\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 = React.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    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    selection,\n    onChange,\n    onUpdate,\n    extensions,\n  });\n  useImperativeHandle(ref, () => ({ editor: container, state, view }));\n  useEffect(() => {\n    setContainer(editor.current);\n    return () => {\n      if (view) {\n        view.destroy();\n      }\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return <div ref={editor} className={`cm-theme-${theme}${className ? ` ${className}` : ''}`} {...other}></div>;\n});\n\nReactCodeMirror.displayName = 'CodeMirror';\n\nexport default ReactCodeMirror;\n"
+    "import React, { useEffect, useRef, useImperativeHandle } from 'react';\nimport { EditorState, EditorStateConfig, Extension } from '@codemirror/state';\nimport { EditorView, ViewUpdate } from '@codemirror/view';\nimport { useCodeMirror } from './useCodeMirror';\n\nexport * from '@codemirror/view';\nexport * from '@codemirror/basic-setup';\nexport * from '@codemirror/state';\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;\n  /**\n   * This disables editing of the editor content by the user.\n   * @default true\n   */\n  editable?: 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 a change occurs to the document. There is a certain difference with `onChange`. */\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 = React.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    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    selection,\n    onChange,\n    onUpdate,\n    extensions,\n  });\n  useImperativeHandle(ref, () => ({ editor: container, state, view }), [container, state, view]);\n  useEffect(() => {\n    setContainer(editor.current);\n    return () => {\n      if (view) {\n        view.destroy();\n      }\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\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"
   ]
 }

package/cjs/useCodeMirror.js

@@ -111,7 +111,7 @@ function useCodeMirror(props) {
       break;
 
     case 'dark':
-      getExtensions.push(_themeOneDark.oneDarkTheme);
+      getExtensions.push(_themeOneDark.oneDark);
       break;
 
     default:

package/cjs/useCodeMirror.js.map

@@ -45,7 +45,7 @@
     "defaultBasicSetup",
     "push",
     "defaultLightThemeOption",
-    "oneDarkTheme",
+    "oneDark",
     "concat",
     "stateCurrent",
     "EditorState",
@@ -65,8 +65,8 @@
     "reconfigure",
     "focus"
   ],
-  "mappings": "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",
+  "mappings": "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",
   "sourcesContent": [
-    "import { useEffect, useState } from 'react';\nimport { basicSetup as defaultBasicSetup } from '@codemirror/basic-setup';\nimport { EditorState, StateEffect } from '@codemirror/state';\nimport { indentWithTab as defaultIndentWithTab } from '@codemirror/commands';\nimport { EditorView, keymap, ViewUpdate, placeholder as extendPlaceholder } from '@codemirror/view';\nimport { oneDarkTheme } from '@codemirror/theme-one-dark';\nimport { ReactCodeMirrorProps } from './';\nimport { defaultLightThemeOption } from './theme/light';\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 = '',\n    width = '',\n    minWidth = '',\n    maxWidth = '',\n    editable = true,\n    indentWithTab = true,\n    basicSetup = 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 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 (indentWithTab) {\n    getExtensions.unshift(keymap.of([defaultIndentWithTab]));\n  }\n  if (basicSetup) {\n    getExtensions.unshift(defaultBasicSetup);\n  }\n\n  if (placeholder) {\n    getExtensions.unshift(extendPlaceholder(placeholder));\n  }\n\n  switch (theme) {\n    case 'light':\n      getExtensions.push(defaultLightThemeOption);\n      break;\n    case 'dark':\n      getExtensions.push(oneDarkTheme);\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\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 as any,\n          root,\n        });\n        setView(viewCurrent);\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [container, state]);\n\n  useEffect(() => {\n    return () => {\n      if (view) {\n        view.destroy();\n      }\n    };\n  }, [view]);\n\n  useEffect(() => {\n    if (view) {\n      const currentValue = view.state.doc.toString();\n      if (value !== currentValue) {\n        view.dispatch({\n          changes: { from: 0, to: currentValue.length, insert: value || '' },\n        });\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    placeholder,\n    height,\n    minHeight,\n    maxHeight,\n    width,\n    minWidth,\n    maxWidth,\n    editable,\n    indentWithTab,\n    basicSetup,\n  ]);\n\n  useEffect(() => {\n    if (autoFocus && view) {\n      view.focus();\n    }\n  }, [autoFocus, view]);\n\n  return { state, setState, view, setView, container, setContainer };\n}\n"
+    "import { useEffect, useState } from 'react';\nimport { basicSetup as defaultBasicSetup } from '@codemirror/basic-setup';\nimport { EditorState, StateEffect } from '@codemirror/state';\nimport { indentWithTab as defaultIndentWithTab } from '@codemirror/commands';\nimport { EditorView, keymap, ViewUpdate, placeholder as extendPlaceholder } from '@codemirror/view';\nimport { oneDark } from '@codemirror/theme-one-dark';\nimport { ReactCodeMirrorProps } from './';\nimport { defaultLightThemeOption } from './theme/light';\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 = '',\n    width = '',\n    minWidth = '',\n    maxWidth = '',\n    editable = true,\n    indentWithTab = true,\n    basicSetup = 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 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 (indentWithTab) {\n    getExtensions.unshift(keymap.of([defaultIndentWithTab]));\n  }\n  if (basicSetup) {\n    getExtensions.unshift(defaultBasicSetup);\n  }\n\n  if (placeholder) {\n    getExtensions.unshift(extendPlaceholder(placeholder));\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\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 as any,\n          root,\n        });\n        setView(viewCurrent);\n      }\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [container, state]);\n\n  useEffect(() => {\n    return () => {\n      if (view) {\n        view.destroy();\n      }\n    };\n  }, [view]);\n\n  useEffect(() => {\n    if (view) {\n      const currentValue = view.state.doc.toString();\n      if (value !== currentValue) {\n        view.dispatch({\n          changes: { from: 0, to: currentValue.length, insert: value || '' },\n        });\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    placeholder,\n    height,\n    minHeight,\n    maxHeight,\n    width,\n    minWidth,\n    maxWidth,\n    editable,\n    indentWithTab,\n    basicSetup,\n  ]);\n\n  useEffect(() => {\n    if (autoFocus && view) {\n      view.focus();\n    }\n  }, [autoFocus, view]);\n\n  return { state, setState, view, setView, container, setContainer };\n}\n"
   ]
 }