QUESTION: Pressing Backspace or Delete key in traits panel removes element from canvas

I'm using grapesJS within a Polymer 3.x Element and everything is working beautifully, awesome project. However, I'm experiencing an issue:

When I select an element in the canvas, navigate to the traits panel, put my cursor in a trait field enter some text (or not) and then press the delete or backspace keys, it deletes the selected element from the canvas.

This happens in chrome for Mac OS and Windows (haven't tried other browsers yet).

My question: Is there a way to intercept the backspace/delete key in the traits manager or am I missing a configuration setting somewhere?

Here is my init:

const that = this;
this.editor = grapesjs.init({
	noticeOnUnload: false,
	container: this.$.gjs,
	fromElement: true,
	height: '594px',
	width: 'auto',
	storeManager: { type: null },
	layerManager: {
		appendTo: this.$.layersContainer
	},
	panels: {
		defaults: [{
			id: 'panel-top',
			el: this.$.panelTop,
		},{
			id: 'panel-switcher',
			el: this.$.panelSwitcher,
			buttons: [{
				id: 'show-blocks',
				label: 'Blocks',
				active: true,
				command: 'show-blocks',
				togglable: false
			},{
				id: 'show-style',
				label: 'Styles',
				command: 'show-styles',
				togglable: false
			},{
				id: 'show-traits',
				label: 'Traits',
				command: 'show-traits',
				togglable: false
			}]
		},{
			id: 'basic-actions',
			el: this.$.basicActions,
			buttons: [{
				id: 'visibility',
				active: true, // active by default
				className: 'btn-toggle-borders',
				label: '<u>B</u>',
				command: 'sw-visibility', // Built-in command
				title: 'Toggle container border visibility'
			},{
				id: 'export',
				className: 'btn-open-export',
				label: 'Exp',
				command: 'export-template',
				context: 'export-template', // For grouping context of buttons from the same panel
				title: 'Show HTML'
			},{
				id: 'save',
				active: false,
				className: 'btn-save',
				label: 'Save',
				title: 'Publish this HTML to the Card',
				command(editor: any) {
					that.set('card.html', editor.getHtml());
					that._patchCardHtml();
				}
			}]
		},{
			id: 'layers',
			el: this.$.panelRight
		}]
	},
	blockManager: {
		appendTo: this.$.blocksContainer
	},
	selectorManager: {
		appendTo: this.$.stylesContainer
	},
	styleManager: {
		appendTo: this.$.stylesContainer,
		sectors: [{
			name: 'General',
			open: false,
			buildProps: ['float', 'display', 'position', 'top', 'right', 'left', 'bottom']
		},{
			name: 'Dimension',
			open: false,
			buildProps: ['width', 'height', 'max-width', 'min-height', 'margin', 'padding']
		},{
			name: 'Typography',
			open: false,
			buildProps: ['font-family', 'font-size', 'font-weight', 'letter-spacing', 'color', 'line-height', 'text-align', 'text-shadow']
		},{
			name: 'Decorations',
			open: false,
			buildProps: [
				'border-radius-c',
				'background-color',
				'border-radius',
				'border',
				'box-shadow',
				'background'
			],
		},{
			name: 'Extra',
			open: false,
			buildProps: ['opacity', 'transition', 'perspective', 'transform'],
			properties: [{
				type: 'slider',
				property: 'opacity',
				defaults: 1,
				step: 0.01,
				max: 1,
				min: 0,
			}]
		}]
	},
	traitManager: {
		appendTo: this.$.traitsContainer,
	},
	storageManager: {type: null},
	plugins: [
		'gjs-blocks-basic',
		'dig-elements'
	],
	pluginsOpts: {
		'gjs-blocks-basic': {
			blocks: ['column1', 'column2', 'column3', 'column3-7', 'text']
		},
		'dig-elements': {
			fields: that.card.fields,
			doc: that.doc
		}
	}
});