rn-rich-text-editor 0.0.4 → 0.0.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/RichEditor.js +10 -6
  2. package/dist/editor/createHTML.js +50 -46
  3. package/package.json +1 -1
package/dist/RichEditor.js CHANGED
@@ -98,25 +98,29 @@ exports.RichEditor = (0, react_1.forwardRef)((props, ref) => {
98
98
  // Non-JSON message, ignore
99
99
  }
100
100
  };
101
+ const sendToWebView = (type) => {
102
+ var _a;
103
+ const data = JSON.stringify({ type });
104
+ const script = `window.dispatchEvent(new MessageEvent('message', { data: ${JSON.stringify(data)} })); true;`;
105
+ (_a = webRef.current) === null || _a === void 0 ? void 0 : _a.injectJavaScript(script);
106
+ };
101
107
  (0, react_1.useImperativeHandle)(ref, () => ({
102
108
  sendAction(type) {
103
- var _a;
104
- (_a = webRef.current) === null || _a === void 0 ? void 0 : _a.postMessage(JSON.stringify({ type }));
109
+ sendToWebView(type);
105
110
  },
106
111
  registerToolbar(listener) {
107
112
  selectionChangeListeners.current.push(listener);
108
113
  },
109
114
  focusContentEditor() {
110
- var _a, _b, _c, _d;
115
+ var _a, _b, _c;
111
116
  if (react_native_1.Platform.OS === 'android') {
112
117
  !keyboardOpen && ((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus());
113
118
  (_c = (_b = webRef.current) === null || _b === void 0 ? void 0 : _b.requestFocus) === null || _c === void 0 ? void 0 : _c.call(_b);
114
119
  }
115
- (_d = webRef.current) === null || _d === void 0 ? void 0 : _d.postMessage(JSON.stringify({ type: 'focus' }));
120
+ sendToWebView('focus');
116
121
  },
117
122
  dismissKeyboard() {
118
- var _a;
119
- (_a = webRef.current) === null || _a === void 0 ? void 0 : _a.postMessage(JSON.stringify({ type: 'blur' }));
123
+ sendToWebView('blur');
120
124
  react_native_1.Keyboard.dismiss();
121
125
  },
122
126
  get isKeyboardOpen() {
package/dist/editor/createHTML.js CHANGED
@@ -72,52 +72,56 @@ ${(0, contentCSS_1.getContentCSS)()}
72
72
  editor.focus();
73
73
  } else if (type === 'blur') {
74
74
  editor.blur();
75
- } else if (type === 'bold') {
76
- document.execCommand('bold');
77
- } else if (type === 'italic') {
78
- document.execCommand('italic');
79
- } else if (type === 'underline') {
80
- document.execCommand('underline');
81
- } else if (type === 'strikethrough') {
82
- document.execCommand('strikeThrough');
83
- } else if (type === 'removeFormat') {
84
- document.execCommand('removeFormat');
85
- } else if (type === 'undo') {
86
- document.execCommand('undo');
87
- } else if (type === 'redo') {
88
- document.execCommand('redo');
89
- } else if (type === 'insertUnorderedList') {
90
- document.execCommand('insertUnorderedList');
91
- } else if (type === 'insertOrderedList') {
92
- document.execCommand('insertOrderedList');
93
- } else if (type === 'checkboxList') {
94
- document.execCommand('insertOrderedList');
95
- } else if (type === 'indent') {
96
- document.execCommand('indent');
97
- } else if (type === 'outdent') {
98
- document.execCommand('outdent');
99
- } else if (type === 'justifyLeft') {
100
- document.execCommand('justifyLeft');
101
- } else if (type === 'justifyCenter') {
102
- document.execCommand('justifyCenter');
103
- } else if (type === 'justifyRight') {
104
- document.execCommand('justifyRight');
105
- } else if (type === 'justifyFull') {
106
- document.execCommand('justifyFull');
107
- } else if (type === 'blockquote') {
108
- document.execCommand('formatBlock', false, 'blockquote');
109
- } else if (type === 'code') {
110
- document.execCommand('formatBlock', false, 'pre');
111
- } else if (type === 'link') {
112
- const url = prompt('Enter link URL:');
113
- if (url) {
114
- const sel = window.getSelection();
115
- const range = sel.getRangeAt(0);
116
- const link = document.createElement('a');
117
- link.href = url;
118
- link.textContent = sel.toString() || url;
119
- range.deleteContents();
120
- range.insertNode(link);
75
+ } else {
76
+ // Restore focus so format commands apply to the editor (important when toolbar tap steals focus)
77
+ editor.focus();
78
+ if (type === 'bold') {
79
+ document.execCommand('bold');
80
+ } else if (type === 'italic') {
81
+ document.execCommand('italic');
82
+ } else if (type === 'underline') {
83
+ document.execCommand('underline');
84
+ } else if (type === 'strikethrough') {
85
+ document.execCommand('strikeThrough');
86
+ } else if (type === 'removeFormat') {
87
+ document.execCommand('removeFormat');
88
+ } else if (type === 'undo') {
89
+ document.execCommand('undo');
90
+ } else if (type === 'redo') {
91
+ document.execCommand('redo');
92
+ } else if (type === 'insertUnorderedList') {
93
+ document.execCommand('insertUnorderedList');
94
+ } else if (type === 'insertOrderedList') {
95
+ document.execCommand('insertOrderedList');
96
+ } else if (type === 'checkboxList') {
97
+ document.execCommand('insertOrderedList');
98
+ } else if (type === 'indent') {
99
+ document.execCommand('indent');
100
+ } else if (type === 'outdent') {
101
+ document.execCommand('outdent');
102
+ } else if (type === 'justifyLeft') {
103
+ document.execCommand('justifyLeft');
104
+ } else if (type === 'justifyCenter') {
105
+ document.execCommand('justifyCenter');
106
+ } else if (type === 'justifyRight') {
107
+ document.execCommand('justifyRight');
108
+ } else if (type === 'justifyFull') {
109
+ document.execCommand('justifyFull');
110
+ } else if (type === 'blockquote') {
111
+ document.execCommand('formatBlock', false, 'blockquote');
112
+ } else if (type === 'code') {
113
+ document.execCommand('formatBlock', false, 'pre');
114
+ } else if (type === 'link') {
115
+ const url = prompt('Enter link URL:');
116
+ if (url) {
117
+ const sel = window.getSelection();
118
+ const range = sel.getRangeAt(0);
119
+ const link = document.createElement('a');
120
+ link.href = url;
121
+ link.textContent = sel.toString() || url;
122
+ range.deleteContents();
123
+ range.insertNode(link);
124
+ }
121
125
  }
122
126
  }
123
127
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rn-rich-text-editor",
3
- "version": "0.0.4",
3
+ "version": "0.0.5",
4
4
  "description": "A rich text editor component for React Native",
5
5
  "keywords": [
6
6
  "react-native",