@neo4j-cypher/react-codemirror 1.0.0 → 1.0.2

package/es/CypherEditor.js

@@ -39,6 +39,13 @@ class CypherEditor extends Component {
       } = this.props;
       onPositionChanged && onPositionChanged(positionObject);
     });
+    _defineProperty(this, "selectionChanged", selection => {
+      this.lastSelection = selection;
+      const {
+        onSelectionChanged
+      } = this.props;
+      onSelectionChanged && onSelectionChanged(selection);
+    });
     _defineProperty(this, "autocompleteChanged", (autocompleteOpen, options, option) => {
       const {
         onAutocompleteChanged
@@ -63,11 +70,18 @@ class CypherEditor extends Component {
       } = this.props;
       onKeyDown && onKeyDown(event);
     });
+    _defineProperty(this, "keyUp", event => {
+      const {
+        onKeyUp
+      } = this.props;
+      onKeyUp && onKeyUp(event);
+    });
     this.state = {
       focused: false
     };
     this.lastValue = null;
     this.lastPosition = null;
+    this.lastSelection = null;
   }
   componentDidMount() {
     const {
@@ -96,6 +110,7 @@ class CypherEditor extends Component {
       searchOpen,
       searchText,
       searchTop,
+      selection,
       tabKey,
       theme,
       tooltipAbsolute,
@@ -134,6 +149,7 @@ class CypherEditor extends Component {
       searchOpen,
       searchText,
       searchTop,
+      selection,
       tabKey,
       theme,
       tooltipAbsolute,
@@ -147,10 +163,12 @@ class CypherEditor extends Component {
     this.cypherEditor.onFocusChanged(this.focusChanged);
     this.cypherEditor.onScrollChanged(this.scrollChanged);
     this.cypherEditor.onPositionChanged(this.positionChanged);
+    this.cypherEditor.onSelectionChanged(this.selectionChanged);
     this.cypherEditor.onAutocompleteChanged(this.autocompleteChanged);
     this.cypherEditor.onSearchChanged(this.searchChanged);
     this.cypherEditor.onLineNumberClick(this.lineNumberClick);
     this.cypherEditor.onKeyDown(this.keyDown);
+    this.cypherEditor.onKeyUp(this.keyUp);
     onEditorCreated && onEditorCreated(this.cypherEditor);
   }
   componentWillUnmount() {
@@ -159,10 +177,12 @@ class CypherEditor extends Component {
       this.cypherEditor.offFocusChanged(this.focusChanged);
       this.cypherEditor.offScrollChanged(this.scrollChanged);
       this.cypherEditor.offPositionChanged(this.positionChanged);
+      this.cypherEditor.offSelectionChanged(this.selectionChanged);
       this.cypherEditor.offAutocompleteChanged(this.autocompleteChanged);
       this.cypherEditor.offSearchChanged(this.searchChanged);
       this.cypherEditor.offLineNumberClick(this.lineNumberClick);
       this.cypherEditor.offKeyDown(this.keyDown);
+      this.cypherEditor.offKeyUp(this.keyUp);
       this.cypherEditor.destroy();
     }
   }
@@ -202,6 +222,13 @@ class CypherEditor extends Component {
         this.lastPosition = position;
       }
     }
+    if (key === "selection") {
+      if (prop[key] === this.lastSelection) {
+        return;
+      } else {
+        this.lastSelection = prop[key];
+      }
+    }
     const methodName = "set" + key[0].toUpperCase() + key.slice(1);
     if (this.cypherEditor[methodName]) {
       this.cypherEditor[methodName](prop[key]);

package/lib/CypherEditor.js

@@ -48,6 +48,13 @@ class CypherEditor extends _react.Component {
       } = this.props;
       onPositionChanged && onPositionChanged(positionObject);
     });
+    (0, _defineProperty2.default)(this, "selectionChanged", selection => {
+      this.lastSelection = selection;
+      const {
+        onSelectionChanged
+      } = this.props;
+      onSelectionChanged && onSelectionChanged(selection);
+    });
     (0, _defineProperty2.default)(this, "autocompleteChanged", (autocompleteOpen, options, option) => {
       const {
         onAutocompleteChanged
@@ -72,11 +79,18 @@ class CypherEditor extends _react.Component {
       } = this.props;
       onKeyDown && onKeyDown(event);
     });
+    (0, _defineProperty2.default)(this, "keyUp", event => {
+      const {
+        onKeyUp
+      } = this.props;
+      onKeyUp && onKeyUp(event);
+    });
     this.state = {
       focused: false
     };
     this.lastValue = null;
     this.lastPosition = null;
+    this.lastSelection = null;
   }
   componentDidMount() {
     const {
@@ -105,6 +119,7 @@ class CypherEditor extends _react.Component {
       searchOpen,
       searchText,
       searchTop,
+      selection,
       tabKey,
       theme,
       tooltipAbsolute,
@@ -143,6 +158,7 @@ class CypherEditor extends _react.Component {
       searchOpen,
       searchText,
       searchTop,
+      selection,
       tabKey,
       theme,
       tooltipAbsolute,
@@ -156,10 +172,12 @@ class CypherEditor extends _react.Component {
     this.cypherEditor.onFocusChanged(this.focusChanged);
     this.cypherEditor.onScrollChanged(this.scrollChanged);
     this.cypherEditor.onPositionChanged(this.positionChanged);
+    this.cypherEditor.onSelectionChanged(this.selectionChanged);
     this.cypherEditor.onAutocompleteChanged(this.autocompleteChanged);
     this.cypherEditor.onSearchChanged(this.searchChanged);
     this.cypherEditor.onLineNumberClick(this.lineNumberClick);
     this.cypherEditor.onKeyDown(this.keyDown);
+    this.cypherEditor.onKeyUp(this.keyUp);
     onEditorCreated && onEditorCreated(this.cypherEditor);
   }
   componentWillUnmount() {
@@ -168,10 +186,12 @@ class CypherEditor extends _react.Component {
       this.cypherEditor.offFocusChanged(this.focusChanged);
       this.cypherEditor.offScrollChanged(this.scrollChanged);
       this.cypherEditor.offPositionChanged(this.positionChanged);
+      this.cypherEditor.offSelectionChanged(this.selectionChanged);
       this.cypherEditor.offAutocompleteChanged(this.autocompleteChanged);
       this.cypherEditor.offSearchChanged(this.searchChanged);
       this.cypherEditor.offLineNumberClick(this.lineNumberClick);
       this.cypherEditor.offKeyDown(this.keyDown);
+      this.cypherEditor.offKeyUp(this.keyUp);
       this.cypherEditor.destroy();
     }
   }
@@ -211,6 +231,13 @@ class CypherEditor extends _react.Component {
         this.lastPosition = position;
       }
     }
+    if (key === "selection") {
+      if (prop[key] === this.lastSelection) {
+        return;
+      } else {
+        this.lastSelection = prop[key];
+      }
+    }
     const methodName = "set" + key[0].toUpperCase() + key.slice(1);
     if (this.cypherEditor[methodName]) {
       this.cypherEditor[methodName](prop[key]);

package/package.json

@@ -7,7 +7,7 @@
     "codemirror",
     "codemirror 6"
   ],
-  "version": "1.0.0",
+  "version": "1.0.2",
   "author": "Neo4j Inc.",
   "license": "Apache-2.0",
   "main": "./lib/react-codemirror.js",
@@ -50,7 +50,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.20.13",
-    "@neo4j-cypher/codemirror": "1.0.0"
+    "@neo4j-cypher/codemirror": "1.0.2"
   },
   "peerDependencies": {
     "react": ">=16"

package/src/CypherEditor.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { Extension } from "@codemirror/state";
+import type { Extension, EditorSelection } from "@codemirror/state";
 import type { EditorSupportSchema } from "@neo4j-cypher/editor-support";
 import type {
   PositionAny,
@@ -12,9 +12,10 @@ import type {
   ScrollChangedListener,
   SearchChangedListener,
   ValueChangedListener,
-  KeyDownListener,
+  KeyListener,
   LineNumberClickListener,
-  LineNumberFormatter
+  LineNumberFormatter,
+  SelectionChangedListener
 } from "@neo4j-cypher/codemirror";
 
 /**
@@ -199,6 +200,12 @@ export interface CypherEditorProps {
    * @defaultValue false
    */
   searchTop?: boolean;
+  /**
+   * The editor text selection
+   *
+   * @defaultValue undefined
+   */
+  selection?: EditorSelection;
   /**
    * Whether the tab key is enabled
    *
@@ -260,14 +267,22 @@ export interface CypherEditorProps {
    * A listener for when the editor search state changes
    */
   onSearchChanged?: SearchChangedListener;
+  /**
+   * A listener for when the editor text selection changes
+   */
+  onSelectionChanged?: SelectionChangedListener;
   /**
    * A listener for when the user clicks an editor line number
    */
   onLineNumberClick?: LineNumberClickListener;
   /**
-   * A listener for when the user presses a key down in the editor
+   * A listener for when the user performs a key down in the editor
+   */
+  onKeyDown?: KeyListener;
+  /**
+   * A listener for when the user performs a key up in the editor
    */
-  onKeyDown?: KeyDownListener;
+  onKeyUp?: KeyListener;
 
   /**
    * The codemirror 6 extensions that should be added to the editor before the cypher language support extensions.