react-native-rich-editor
react-native-rich-editor copied to clipboard
Why isn't "sendAction" available in public interface of RichEditor TS?
Hello I'm attempting to use this library to add a rich text editor to a React Native application using Typescript. We are trying to use the "renderAction" prop to render a custom toolbar. Currently, we cannot find a way to trigger the default actions in our custom UI without calling the "sendAction". Is there a reason this method is not available in the TS file?
Am I missing something in the documentation to trigger the default actions with a custom toolbar?
sendAction is a recently opened external method, which was previously private
Thank you for the quick response! Do you have an ETA of the next release?
I also had another unrelated question about the custom toolbar. Currently, we cannot access the selected text's format tag in the editor (h1, h2, h3, h4, p tag...). I took a look at the editor.js and found the state for those Actions were not mapped. Is there a reason you did not enable this state? I've provided a sample code below of the updated state that should return this info back to the component to render in the toolbar
var Actions = { bold: { state: function() { return queryCommandState('bold'); }, result: function() { return exec('bold'); }}, italic: { state: function() { return queryCommandState('italic'); }, result: function() { return exec('italic'); }}, underline: { state: function() { return queryCommandState('underline'); }, result: function() { return exec('underline'); }}, strikeThrough: { state: function() { return queryCommandState('strikeThrough'); }, result: function() { return exec('strikeThrough'); }}, heading1: { state: function() { return queryCommandValue(formatBlock) === 'h1'; }, result: function() { return exec(formatBlock, '<h1>'); }}, heading2: { state: function() { return queryCommandValue(formatBlock) === 'h2'; }, result: function() { return exec(formatBlock, '<h2>'); }}, heading3: { state: function() { return queryCommandValue(formatBlock) === 'h3'; }, result: function() { return exec(formatBlock, '<h3>'); }}, heading4: { state: function() { return queryCommandValue(formatBlock) === 'h4'; }, result: function() { return exec(formatBlock, '<h4>'); }}, heading5: { state: function() { return queryCommandValue(formatBlock) === 'h5'; }, result: function() { return exec(formatBlock, '<h5>'); }}, heading6: { state: function() { return queryCommandValue(formatBlock) === 'h6'; }, result: function() { return exec(formatBlock, '<h6>'); }}, paragraph: { state: function() { return queryCommandValue(formatBlock) === 'p'; }, result: function() { return exec(formatBlock, '<p>'); }}, quote: { result: function() { return exec(formatBlock, '<blockquote>'); }},
(mainly)
heading1: { state: function() { return queryCommandValue(formatBlock) === 'h1'; }, result: function() { return exec(formatBlock, '<h1>'); }}
Thanks for the relevant information, 1.7.0 has been added