How to make component resizable with 1 click directly from editor

[ghost]

If you want to change resize option directly from the editor use that

this.editor.on('component:selected', function(args) { // make components resizable by default with mouse (like already enable for images)
      args.set('resizable', true)
    })

this.editor.on(`component:mount`, model => {  // trigger on mount, when you drag a component
      const getResizableTrait = model.getTrait('resizable')
      if (getResizableTrait == null) { // avoid duplicate resizable checkbox for same component
        model.addTrait({ // add Resizable checkbox
          type: 'checkbox',
          name: 'resizable',
          label: 'resizable'

        })
      }
    }
    )

this.editor.on('component:update', comp => {
      if (comp.attributes.attributes.resizable != null) {
        comp.attributes.resizable = comp.attributes.attributes.resizable // update resizable attribute
      }
    })