diff --git a/package.json b/package.json
index 7023877..d72938e 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
"crdt"
],
"dependencies": {
- "collaborative-editor": "^2.2.0"
+ "collaborative-editor": "^2.4.0"
},
"peerDependencies": {
"json-joy": "*",
@@ -69,7 +69,7 @@
"eslint-plugin-react": "^7.33.2",
"eslint-plugin-storybook": "^0.6.15",
"jest": "^29.7.0",
- "json-joy": "^16.13.1",
+ "json-joy": "^16.18.0",
"prettier": "^3.1.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
diff --git a/src/InputEditor.ts b/src/InputEditor.ts
index dde94a6..3d3262f 100644
--- a/src/InputEditor.ts
+++ b/src/InputEditor.ts
@@ -26,6 +26,33 @@ export class InputEditor implements EditorFacade {
this.input.value = text;
}
+ public ins(position: number, text: string): void {
+ const selection = this.getSelection();
+ const value = this.get();
+ const next = value.slice(0, position) + text + value.slice(position);
+ this.set(next);
+ if (selection) {
+ let [start, end] = selection;
+ const length = text.length;
+ if (start >= position) start += length;
+ if (end > position) end += length;
+ this.setSelection(start, end, selection[2]);
+ }
+ }
+
+ public del(position: number, length: number): void {
+ const selection = this.getSelection();
+ const value = this.get();
+ const next = value.slice(0, position) + value.slice(position + length);
+ this.set(next);
+ if (selection) {
+ let [start, end] = selection;
+ if (start >= position) start = Math.max(position, start - length);
+ if (end >= position) end = Math.max(position, end - length);
+ this.setSelection(start, end, selection[2]);
+ }
+ }
+
public getSelection(): [number, number, -1 | 0 | 1] | null {
const input = this.input;
const {selectionStart, selectionEnd, selectionDirection} = input;
diff --git a/src/index.stories.tsx b/src/index.stories.tsx
index 1fa31b0..ee1152d 100644
--- a/src/index.stories.tsx
+++ b/src/index.stories.tsx
@@ -56,6 +56,42 @@ const Demo: React.FC<{textarea: boolean}> = ({textarea}) => {
Append "?" to model after 2s
+
+
+
+
+
+
+
+
+