feat(blocks): Add onTextSelection event to Html.

This commit is contained in:
Johann Moller 2023-10-05 12:30:32 +02:00
parent ab633e6f59
commit 4f00d5e885
2 changed files with 17 additions and 1 deletions

View File

@ -17,9 +17,10 @@
import React from 'react';
import { blockDefaultProps, HtmlComponent } from '@lowdefy/block-utils';
const HtmlBlock = ({ blockId, properties, methods }) => (
const HtmlBlock = ({ blockId, events, properties, methods }) => (
<HtmlComponent
div={true}
events={events}
html={properties.html}
id={blockId}
methods={methods}

View File

@ -24,6 +24,7 @@ class HtmlComponent extends React.Component {
this.div = {
innerHTML: '',
};
this.onTextSelection = this.onTextSelection.bind(this);
}
componentDidMount() {
@ -36,6 +37,19 @@ class HtmlComponent extends React.Component {
this.div.innerHTML = DOMPurify.sanitize(htmlString);
}
onTextSelection() {
if (this.props.events.onTextSelection) {
const selection = window.getSelection().toString();
if (selection !== '') {
this.props.methods.triggerEvent({
name: 'onTextSelection',
event: {
selection: selection,
},
});
}
}
}
render() {
const { div, id, methods, style } = this.props;
if (div === true) {
@ -49,6 +63,7 @@ class HtmlComponent extends React.Component {
}
}}
className={methods.makeCssClass(style)}
onMouseUp={this.onTextSelection}
/>
);
}