placeholder

CHANGELOG.md

@@ -6,6 +6,7 @@
 
 ### Fix
 - Keyboard listener on unmount
+- placeholder does not restore [issues 121](https://github.com/wxik/react-native-rich-editor/issues/121)
 
 ## 1.5.1
 #### Added

README.md

@@ -65,7 +65,7 @@ The editor component. Simply place this component in your view hierarchy to rece
 * `onMessage`
     Callback outside postMessage internal type processing
     ```
-    <img src="" ontouchstart="_.sendEvent('ImgClick')"/>
+    <img src="" onclick="_.sendEvent('ImgClick')" contenteditable="false"/>
     ```
 
 * `commandDOM`

examples/src/example.js

@@ -32,15 +32,15 @@ const imageList = [
     'https://img.lesmao.vip/k/h256/R/MeiTu/1292.jpg',
 ];
 const initHTML = `<br/>
-<center><b onclick="_.sendEvent('TitleClick')" id="title" >Rich Editor</b></center>
+<center><b onclick="_.sendEvent('TitleClick')" id="title" contenteditable="false">Rich Editor</b></center>
 <center>
 <a href="https://github.com/wxik/react-native-rich-editor">React Native</a>
 <span>And</span>
 <a href="https://github.com/wxik/flutter-rich-editor">Flutter</a>
 </center>
 <br/>
-<img src="${imageList[0]}" onclick="_.sendEvent('ImgClick')"/>
-<br/><br/>
+<img src="${imageList[0]}" onclick="_.sendEvent('ImgClick')" contenteditable="false"/>
+<br/>Click the picture to switch<br/>
 `;
 
 const phizIcon = require('./assets/phiz.png');
@@ -165,7 +165,6 @@ class Example extends React.Component {
         );
         // insert base64
         // this.richText.current?.insertImage(`data:${image.mime};base64,${image.data}`);
-        // this.richText.current?.blurContentEditor();
     }
 
     onInsertLink() {

index.d.ts

@@ -102,6 +102,8 @@ declare module 'react-native-pell-rich-editor' {
          */
         onHeightChange?: (height: number) => void;
 
+        onMessage?: (message: {type: string; id: string; data?: any}) => void;
+
         /**
          * Styling for container or for Rich Editor more dark or light settings
          */
@@ -161,6 +163,13 @@ declare module 'react-native-pell-rich-editor' {
 
         insertHTML: (html: string) => void;
 
+        /**
+         * $ = document.querySelector
+         * this.richText.current?.commandDOM(`$('#title').style.color='${color}'`);
+         * @param command
+         */
+        commandDOM: (command: string) => void;
+
         /**
          * Returns whether the keyboard is on
          */

src/editor.js

@@ -223,8 +223,10 @@ function createHTML(options = {}) {
             content.autocomplete = 'off';
             content.className = "pell-content";
             content.oninput = function (_ref) {
-                // var firstChild = _ref.target.firstChild;
-                // if (firstChild && firstChild.nodeType === 3) exec(formatBlock, '<' + defaultParagraphSeparator + '>');else if (content.innerHTML === '<br>') content.innerHTML = '';
+                //TODO placeholder https://github.com/wxik/react-native-rich-editor/issues/121
+                var firstChild = _ref.target.firstChild;
+                if (firstChild && firstChild.nodeType === 3) exec(formatBlock, '<' + defaultParagraphSeparator + '>');else if (content.innerHTML === '<br>') content.innerHTML = '';
+
                 settings.onChange(content.innerHTML);
                 saveSelection();
             };