fix: provide none option for theme. #431

Author: jaywcjlove

core/src/index.tsx

@@ -28,7 +28,7 @@ export interface ReactCodeMirrorProps
    * `light` / `dark` / `Extension` Defaults to `light`.
    * @default light
    */
-  theme?: 'light' | 'dark' | Extension;
+  theme?: 'light' | 'dark' | 'none' | Extension;
   /**
    * Whether to optional basicSetup by default
    * @default true

core/src/useCodeMirror.ts

@@ -91,6 +91,8 @@ export function useCodeMirror(props: UseCodeMirror) {
     case 'dark':
       getExtensions.push(oneDark);
       break;
+    case 'none':
+      break;
     default:
       getExtensions.push(theme);
       break;

www/src/index.tsx

@@ -18,6 +18,7 @@ import { ColorDoc } from './pages/extensions/color';
 import { MentionsDoc } from './pages/extensions/mentions';
 import { ThemesAllDoc } from './pages/extensions/themes';
 import { ZebraStripesDoc } from './pages/extensions/zebra-stripes';
+import { PageExample431 } from './pages/examples/Example431';
 
 export const GlobalStyle = createGlobalStyle`
   [data-color-mode*='dark'], [data-color-mode*='dark'] body {
@@ -93,6 +94,9 @@ root.render(
         <Route path="mentions" element={<MentionsDoc />} />
         <Route path="zebra-stripes" element={<ZebraStripesDoc />} />
       </Route>
+      <Route path="/examples/" element={<ExtensionsLayout />}>
+        <Route path="431" element={<PageExample431 />} />
+      </Route>
     </Routes>
   </HashRouter>,
 );

www/src/pages/examples/Example431.tsx

@@ -0,0 +1,21 @@
+import CodeMirror from '@uiw/react-codemirror';
+import { langs } from '@uiw/codemirror-extensions-langs';
+import { Fragment } from 'react';
+
+/**
+ * https://github.com/uiwjs/react-codemirror/issues/431
+ */
+export const PageExample431 = () => {
+  return (
+    <Fragment>
+      <h1>How to remove all syntax highlighting?</h1>
+      <CodeMirror
+        value={`console.log('hello')`}
+        theme="none"
+        height="400px"
+        style={{ margin: '0 0 23px 0' }}
+        extensions={[langs.markdown()]}
+      />
+    </Fragment>
+  );
+};