doc(events): update README

README.md

@@ -32,9 +32,9 @@ https://github.com/tidbcloud/tisqleditor/assets/1284531/732b600f-5b4e-45d3-a3d2-
 | @tidbcloud/codemirror-extension-save-helper    | save the editor content if it changes                                     |
 | @tidbcloud/codemirror-extension-autocomplete   | SQL keyword and database schema autocomplete tips                         |
 | @tidbcloud/codemirror-extension-linters        | use db statement, full width chars, and regular expression linters        |
-| @tidbcloud/codemirror-extension-events         | 3 normal kinds of event listener                                          |
+| @tidbcloud/codemirror-extension-events         | 2 normal kinds of event listener: doc change, selection change            |
 | @tidbcloud/codemirror-extension-themes         | 2 simple builtin themes, `bbedit` for light mode, `oneDark` for dark mode |
-| @tidbcloud/codemirror-extension-basic-setup    | Basic configuration for the CodeMirror6 code editor                       |
+| @tidbcloud/codemirror-extension-basic-setup    | basic configuration for the CodeMirror6 code editor                       |
 
 ## Usage
 

packages/extensions/events/README.md

@@ -1,10 +1,9 @@
 # @tidbcloud/codemirror-extension-events
 
-Events extensions for CodeMirror6. This extension provides 3 events: onChange, onFocusChange and onSelectionChange.
+2 normal kinds of event listener: doc change, selection change
 
-- onChange: any doc change will trigger this event
-- onFocusChange: while the cursor change will trigger this event
-- onSelectionChange: while selection content change will trigger this event
+- onDocChange: triggered when doc changes
+- onSelectionChange: triggered when selection changes
 
 ## Installation
 
@@ -24,33 +23,25 @@ npm install @codemirror/view @codemirror/state
 import { EditorView } from '@codemirror/view'
 import { EditorState } from '@codemirror/state'
 import {
-  onChange,
-  onFocusChange,
-  onSelectionChange
+  onDocChange,
+  onSelectionChange,
+  SelectionRange
 } from '@tidbcloud/codemirror-extension-events'
 
-const onChangeHandler = (sql: string, view: EditorView) => {
-  console.log(sql, view)
+const docChangeHandler = (view: EditorView, doc: string) => {
+  console.log(doc)
 }
 
-const onFocusChangeHandler = (sql: string) => {
-  console.log(sql)
-}
-
-const onSelectionChangeHandler = (selectedRange: {
-  from: number
-  to: numer
-}) => {
-  console.log(selectedRange.from, selectedRange.to)
+const selectionChangeHandler = (view: EditorView, ranges: SelectionRange[]) => {
+  console.log(ranges)
 }
 
 const editorView = new EditorView({
   state: EditorState.create({
     doc,
     extensions: [
-      onChange(onChangeHandler),
-      focusChangeHelper(onFocusChangeHandler),
-      onSelectionChange(onSelectionChangeHandler)
+      onDocChange(docChangeHandler),
+      onSelectionChange(selectionChangeHandler)
     ]
   })
 })