how to implement two column insertion in canvas

[BilalMustafa-cs]

Hi I am just beginner in GrapesJS and working to insert two columns cell in canvas like

when click on this portion

i think there is some issue in my code. please help me for this code implementation.

here is my code snippet:

const domComponents = this._editor.DomComponents;

domComponents.addComponent({
  type: 'cell',
  tagName: 'td',
  removable: true, // Can't remove it
  draggable: ['tr'], // Can't move it
  copyable: true, // Disable copy/past
  dropable: true,
  // style: { background: 'red'},
  // attributes: { title: 'here' },
  content:
    '<div class="row mx-0" data-gjs-droppable=".row-cell" data-gjs-custom-name="Row">' +
    '<div class="row-cell" data-gjs-draggable=".row"></div>' +
    '<div class="row-cell" data-gjs-draggable=".row"></div>' +
    '</div>' +
    '<style>' +
    '.row {' +
    'display: table;' +
    'padding-top: 10px;' +
    'padding-right: 10px;' +
    'padding-bottom: 10px;' +
    'padding-left: 10px;' +
    'width: 100%;' +
    'outline: 1px dashed rgba(170,170,170,0.7);' +
    'outline-offset: -2px;' +
    '}' +
    '.row-cell {' +
    'outline: 1px dashed rgba(170,170,170,0.7);' +
    'outline-offset: -2px;' +

    'width: 8%;' +
    'display: table-cell;' +
    'height: 75px;' +
    '}' +
    '</style>'

});

[artf]

Closing the issue as it's not related to the plugin. You can use Github Discussions from the core repository to ask generic questions: https://github.com/artf/grapesjs/discussions