2 years ago

#57716

test-img

Saletra

Custom editor tag <hr /> is not showing standalone

I managed to add suport for <hr /> tag in react-draft-wysiwyg. It's working but requires something like a neighborhood of other tags to be shown:

addHr = () => {
let { editorState, onChange } = this.props;
let contentState;

// this should be const html = "<hr />";
const html = "<p>a</p><hr /><p>b</p>";

const blocksFromHTML = convertFromHTML(html, undefined, mapWithButton);
const { contentBlocks, entityMap } = blocksFromHTML;
contentState = ContentState.createFromBlockArray(contentBlocks, entityMap);

contentState = Modifier.replaceWithFragment(
  editorState.getCurrentContent(),
  editorState.getSelection(),
  contentState.getBlockMap()
);

onChange(EditorState.push(editorState, contentState, "insert-fragment"));
};

This works and is inserting like:

a
-----------
b

I want to have only a horizontal rule without other tags added (just <hr />). Here is my sandbox https://codesandbox.io/s/draft-js-wysywig-77db3?file=/src/CustomHr.jsx:343-934

reactjs

draftjs

react-draft-wysiwyg

0 Answers

Your Answer

Accepted video resources