rodemirror/dist/index.cjs

React component for CodeMirror 6

"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var __defProp = Object.defineProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
  for (var prop in b || (b = {}))
    if (__hasOwnProp.call(b, prop))
      __defNormalProp(a, prop, b[prop]);
  if (__getOwnPropSymbols)
    for (var prop of __getOwnPropSymbols(b)) {
      if (__propIsEnum.call(b, prop))
        __defNormalProp(a, prop, b[prop]);
    }
  return a;
};

// react-import.js
var _react = require('react'); var _react2 = _interopRequireDefault(_react);

// src/index.tsx
var _state = require('@codemirror/state');
var _view = require('@codemirror/view');


// src/merge-refs.ts

function setRefs(ref, value) {
  if (typeof ref === "function") {
    ref(value);
  } else if (ref) {
    ;
    ref.current = value;
  }
}
function useMergeRefs(forwardedRef, localRef) {
  return _react2.default.useCallback((value) => {
    setRefs(forwardedRef, value);
    setRefs(localRef, value);
  }, [forwardedRef, localRef]);
}

// src/use-first-render.ts

var useFirstRender = () => {
  const firstRender = _react.useRef.call(void 0, true);
  _react.useEffect.call(void 0, () => {
    firstRender.current = false;
  }, []);
  return firstRender.current;
};

// src/index.tsx
var CodeMirror = _react.forwardRef.call(void 0, ({
  value,
  selection,
  onEditorViewChange,
  onEditorStateChange,
  onUpdate,
  extensions: passedExtensions = [],
  elementProps
}, ref) => {
  const innerRef = _react.useRef.call(void 0, null);
  const mergedRef = useMergeRefs(ref, innerRef);
  const [editorView, setEditorView] = _react.useState.call(void 0, null);
  const updateExtension = _react.useMemo.call(void 0, () => onUpdate ? _view.EditorView.updateListener.of(onUpdate) : void 0, []);
  const extensions = _react.useMemo.call(void 0, () => updateExtension ? [updateExtension, ...passedExtensions] : passedExtensions, [updateExtension, passedExtensions]);
  const isFirstRender = useFirstRender();
  _react.useEffect.call(void 0, () => {
    const state = _state.EditorState.create({
      doc: value,
      selection,
      extensions
    });
    if (onEditorStateChange)
      onEditorStateChange(state);
    const view = new (0, _view.EditorView)({
      parent: innerRef.current,
      state
    });
    setEditorView(view);
    if (onEditorViewChange)
      onEditorViewChange(view);
    return () => view.destroy();
  }, [innerRef]);
  _react.useEffect.call(void 0, () => {
    if (isFirstRender || !editorView)
      return;
    editorView.dispatch({
      effects: _state.StateEffect.reconfigure.of(extensions)
    });
  }, [passedExtensions]);
  _react.useEffect.call(void 0, () => {
    if (isFirstRender || !editorView)
      return;
    const transaction = editorView.state.update({
      selection
    });
    editorView.dispatch(transaction);
  }, [selection, editorView]);
  _react.useEffect.call(void 0, () => {
    if (isFirstRender || !editorView)
      return;
    const transaction = editorView.state.update({
      changes: {
        from: 0,
        to: editorView.state.doc.length,
        insert: value
      },
      selection: editorView.state.selection
    });
    editorView.dispatch(transaction);
  }, [value, editorView]);
  return /* @__PURE__ */ _react2.default.createElement("div", __spreadValues({
    ref: mergedRef
  }, elementProps));
});
CodeMirror.displayName = "CodeMirror";
var src_default = CodeMirror;


exports.default = src_default;