JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/css/dx.light.css">
<script src="https://unpkg.com/devextreme-quill/dist/dx-quill.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/js/dx.all.js"></script>
<div class="demo-container">
    <div id="editor"></div>
</div>

JavaScript

$(function() {
    $("#editor").dxHtmlEditor({
    		value,
        height: 350,
        tableResizing: {
            enabled: true,
            minColumnWidth: 50,
            minRowHeight: 14
        },
        toolbar: {
            items: [
                {
                    name: "header",
                    acceptedValues: [false, 1, 2, 3]
                },
                "separator", "bold", "color", "separator",
                "alignLeft", "alignCenter", "alignRight", "separator",
                "insertTable", "deleteTable",
                "insertRowAbove", "insertRowBelow", "deleteRow",
                "insertColumnLeft", "insertColumnRight", "deleteColumn"
            ]
        }
    });
});


var value = `

				<h2>
            Table resizing
        </h2>
        <br>
        <table style="text-align: center;">
            <tbody>
              <tr>
                  <td>1_1</td>
                  <td>1_2</td>
                  <td>1_3</td>
              </tr>
              <tr>
                  <td>2_1</td>
                  <td>2_2</td>
                  <td>2_3</td>
              </tr>
              <tr>
                  <td>3_1</td>
                  <td>3_2</td>
                  <td>3_3</td>
              </tr>
              <tr>
                  <td>4_1</td>
                  <td>4_2</td>
                  <td>4_3</td>
              </tr>
              <tr>
                  <td>5_1</td>
                  <td>5_2</td>
                  <td>5_3</td>
              </tr>
            </tbody>
        </table>`;