How to increase gaps between stencil columns

  this.stencil = new joint.ui.Stencil({
    paper: this.paper,
    width: 240,
    height: 500,
    label: 'Components',
    layout: {
      columnWidth: 80,
      columns: 2,
      rowHeight: 130,
    },
  });

I'm using this code to create two column layout in stencil. Is there a way to add any padding or increase the gap between the two columns?

It could be done by setting dx and dy property for horizontal and vertical gap respectively in layout configuration -

this.stencil = new joint.ui.Stencil({
    paper: this.paper,
    width: 240,
    height: 500,
    label: 'Components',
    layout: {
      columnWidth: 80,
      columns: 2,
      rowHeight: 130,
      dy: 10,
      dx: 10,
      deep: true
    },
  });

You can vary the value of dx and dy to achieve the gap you would really want.

You can refer "layout" under ui.Stencil. Here is the link - https://resources.jointjs.com/docs/rappid/v2.3/ui.html#ui.Stencil

And the explanation for layout configuration is available at - https://resources.jointjs.com/docs/rappid/v2.3/layout.html#layout.GridLayout