Reputation: 1
I'm using react-summernote in my application with the following configuration. I want to implement table add, remove column and row feature through popover functionality. I have added popover settings as given in documentation but somehow it is not reflecting any popover for the table. The following image will show more details of the issue
Expectation:
Current table not showing any popovers which are marked in yellow in the above image.
I'm using react-summernote: 2.0.0 & I used popover configurations in react editor option
<ReactSummernote
className="rich_text_global"
value={this.props.value.toString()}
onChange={this.props.onChange}
options={{
lang: 'en-EN',
height: 350,
insertTableMaxSize: {
col: 20,
row: 20
},
popover: {
image: [
['image', ['resizeFull', 'resizeHalf', 'resizeQuarter', 'resizeNone']],
['float', ['floatLeft', 'floatRight', 'floatNone']],
['remove', ['removeMedia']]
],
link: [
['link', ['linkDialogShow', 'unlink']]
],
table: [
['add', ['addRowDown', 'addRowUp', 'addColLeft', 'addColRight']],
['delete', ['deleteRow', 'deleteCol', 'deleteTable']],
],
air: [
['color', ['color']],
['font', ['bold', 'underline', 'clear']],
['para', ['ul', 'paragraph']],
['table', ['table']],
['insert', ['link', 'picture']]
]
},
dialogsInBody: true,
toolbar: [
['style', ['style']],
['font', ['bold', 'underline', 'clear']],
['fontname', ['fontname']],
['para', ['ul', 'ol', 'paragraph']],
['table', ['table']],
['insert', ['link']]
]
}}
/>
Upvotes: 0
Views: 900
Reputation: 475
The table popover doesn't display simply because there is no such code to initialize and display it in the js file of react-summernote (The latest version of react-summernote still depends on summernote version 0.8.3 which doesn't support this feature at all)
In order to have the popover, you can checkout the source code of react-summernote and rebuild it with summernote version 0.8.12 or later versions
Upvotes: 0