Updating Rich Text editor x 1

This commit is contained in:
mgabdev 2020-06-17 17:29:24 -04:00
parent f7e0528d3b
commit 2387c3314a
3 changed files with 33 additions and 50 deletions

View File

@ -85,22 +85,4 @@ export function normalizePoll(poll) {
}));
return normalPoll;
}
// <p><h1>attention!</h1></p>
// <p>#test @bob #nice https://bob.com http://techcrunch.com <del>strike it</del></p>
// <p><del>https://twitter.com</del></p>
// <p><em>@bobitalic</em></p>
// <p><pre><code>jonincode</code></pre></p>
// # attention!
// #test @bob #nice https://bob.com http://techcrunch.com ~~strike it~~
// ~~https://twitter.com~~
// _@bobitalic_
// ```
// jonincode
// ```
}

View File

@ -210,30 +210,6 @@ export default class AutosuggestTextbox extends ImmutablePureComponent {
} = this.props
const { suggestionsHidden } = this.state
const style = {
direction: isRtl(value) ? 'rtl' : 'ltr',
}
const textareaClasses = CX({
default: 1,
font: 1,
wrap: 1,
resizeNone: 1,
bgTransparent: 1,
outlineNone: 1,
lineHeight125: 1,
colorPrimary: 1,
width100PC: !small,
pt15: !small,
px15: !small,
px10: small,
pb10: !small,
fs16PX: !small,
fs14PX: small,
heightMax200PX: small,
heightMax80VH: !small,
heightMin80PX: !small,
})
const textareaContainerClasses = CX({
default: 1,
@ -254,7 +230,6 @@ export default class AutosuggestTextbox extends ImmutablePureComponent {
inputRef={this.setTextbox}
disabled={disabled}
placeholder={placeholder}
autoFocus={autoFocus}
value={value}
valueMarkdown={valueMarkdown}
onChange={this.onChange}

View File

@ -1,4 +1,5 @@
import {
getDefaultKeyBinding,
Editor,
EditorState,
CompositeDecorator,
@ -86,7 +87,6 @@ export default class Composer extends PureComponent {
valueMarkdown: PropTypes.string,
onChange: PropTypes.func,
onKeyDown: PropTypes.func,
onKeyUp: PropTypes.func,
onFocus: PropTypes.func,
onBlur: PropTypes.func,
onPaste: PropTypes.func,
@ -94,6 +94,7 @@ export default class Composer extends PureComponent {
}
state = {
active: false,
editorState: EditorState.createEmpty(compositeDecorator),
plainText: this.props.value,
}
@ -158,8 +159,34 @@ export default class Composer extends PureComponent {
this.props.onChange(null, plainText, markdownString, selectionStart)
}
handleOnFocus = () => {
document.addEventListener('paste', this.handleOnPaste)
this.setState({ active: true })
this.props.onFocus()
}
handleOnBlur = () => {
document.removeEventListener('paste', this.handleOnPaste, true)
this.setState({ active: false })
this.props.onBlur()
}
focus = () => {
this.textbox.editor.focus()
this.textbox.focus()
}
handleOnPaste = (e) => {
if (this.state.active) {
this.props.onPaste(e)
}
}
keyBindingFn = (e) => {
if (e.type === 'keydown') {
this.props.onKeyDown(e)
}
return getDefaultKeyBinding(e)
}
handleKeyCommand = (command) => {
@ -193,7 +220,6 @@ export default class Composer extends PureComponent {
disabled,
placeholder,
onKeyDown,
onKeyUp,
onFocus,
onBlur,
onPaste,
@ -231,7 +257,6 @@ export default class Composer extends PureComponent {
>
<Editor
blockStyleFn={getBlockStyle}
// customStyleMap={styleMap}
editorState={editorState}
handleKeyCommand={this.handleKeyCommand}
onChange={this.onChange}
@ -239,8 +264,9 @@ export default class Composer extends PureComponent {
placeholder={placeholder}
ref={this.setRef}
readOnly={disabled}
onBlur={onBlur}
onFocus={onFocus}
onBlur={this.handleOnBlur}
onFocus={this.handleOnFocus}
keyBindingFn={this.keyBindingFn}
stripPastedStyles
/>
</div>