How to use react-codemirror2 - 6 common examples

To help you get started, we’ve selected a few react-codemirror2 examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github rebench / rebench.github.io / src / common / ffi / components / CodeMirror.bs.js View on Github external
function make(style, value, defaultValue, editorDidMount, onChange, options, children) {
  return ReasonReact.wrapJsForReason(ReactCodemirror2.Controlled, {
              style: Js_undefined.fromOption(style),
              value: Js_undefined.fromOption(value),
              defaultValue: Js_undefined.fromOption(defaultValue),
              editorDidMount: Js_undefined.fromOption(editorDidMount),
              onBeforeChange: Rebase.Option[/* mapOr */18]((function (f, _, _$1, value) {
                      return Curry._1(f, value);
                    }), (function (_, _$1, _$2) {
                      return /* () */0;
                    }), onChange),
              options: Js_undefined.fromOption(options)
            }, children);
}
github patternplate / patternplate / components / next-generation / themes / src / themes.demo.tsx View on Github external
import * as React from "react";
import { renderToString } from "react-dom/server";
import styled, { ThemeProvider } from "styled-components";
const CodeMirror = require("react-codemirror2").Controlled;
import { MarkdownDemo } from "@patternplate/component-markdown/demo";
import { FlagDemo } from "@patternplate/component-flag/demo";
import * as SVG from "@patternplate/component-svg";
import { getThemes } from "./themes";

// TODO: Remove after lift
const { MainNavigationDemo } = require("@patternplate/components/lib/main-navigation/demo");

if ((global as any).document) {
  require("codemirror/mode/javascript/javascript");
}

const DEFAULT_CONFIG = `
// patternplate.config.js
module.exports = {
  ui: {
github carbon-app / carbon / lib / react-codemirror.js View on Github external
// For SSR, CodeMirror will throw an error, so return a div instead
let CodeMirror = 'div'
if (typeof window !== 'undefined' && typeof window.navigator !== 'undefined') {
  CodeMirror = require('react-codemirror2').Controlled
}
export default CodeMirror
github mb21 / panwriter / src / React / Basic / CodeMirror.js View on Github external
"use strict";

var React        = require('react')
  , ReactCM2     = require('react-codemirror2')
  , Controlled   = ReactCM2.Controlled
  , UnControlled = ReactCM2.UnControlled
  , CodeMirror   = require('codemirror')
  , ipcRenderer  = require('electron').ipcRenderer
  ;

require('codemirror/addon/dialog/dialog');
require('codemirror/addon/search/search');
require('codemirror/addon/search/searchcursor');
require('codemirror/addon/search/jump-to-line');
require('codemirror/addon/mode/overlay');
require('codemirror/mode/markdown/markdown');
require('codemirror/mode/yaml/yaml');
require('codemirror/mode/yaml-frontmatter/yaml-frontmatter');
require('codemirror/addon/edit/continuelist');

var editor
github mb21 / panwriter / src / React / Basic / CodeMirror.js View on Github external
"use strict";

var React        = require('react')
  , ReactCM2     = require('react-codemirror2')
  , Controlled   = ReactCM2.Controlled
  , UnControlled = ReactCM2.UnControlled
  , CodeMirror   = require('codemirror')
  , ipcRenderer  = require('electron').ipcRenderer
  ;

require('codemirror/addon/dialog/dialog');
require('codemirror/addon/search/search');
require('codemirror/addon/search/searchcursor');
require('codemirror/addon/search/jump-to-line');
require('codemirror/addon/mode/overlay');
require('codemirror/mode/markdown/markdown');
require('codemirror/mode/yaml/yaml');
require('codemirror/mode/yaml-frontmatter/yaml-frontmatter');
require('codemirror/addon/edit/continuelist');

var editor
  , onEditorDidMount = function(props, ed) {

react-codemirror2

a tiny react codemirror component wrapper

MIT
Latest version published 14 days ago

Package Health Score

86 / 100
Full package analysis