focus effects doesn't work on table

[hariseldon78]

I'm trying to enable focus effects on the boxes. The Log widget works, for example:

const log = grid.set(0, 4, 2, 2, contrib.log, {
	fg:          'green',
	selectedFg:  'green',
	label:       'Log',
	interactive: true,
	keys:        true,
	style:         {
		focus: {
			border: {
				fg: 'white'
			}
		}
	}
});

when i focus it it changes from greren border to white border, and when i change the focus to something else it goes back to green border. However if I try the same "style" property on a contrib.table it doesn't work: when i focus it i don't see any change. It doesn't even emit the event 'focus', while the log does, maybe that's the source of the problem.

[matthisk]

Running into the same issue. I think it has to do with the fact that Table renders a Blessed.list as a child of a Box. The list receives the focus, not the box, however the box is responsible for rendering the border.

[konsumer]

This works for me:

var blessed = require('blessed')
var contrib = require('blessed-contrib')
var screen = blessed.screen()

var table = contrib.table({
  keys: true,
  vi: true,
  fg: 'white',
  selectedFg: 'white',
  selectedBg: 'blue',
  interactive: true,
  label: 'Active Processes',
  width: '30%',
  height: '30%',
  border: { type: 'line', fg: 'cyan' },
  columnSpacing: 10,
  columnWidth: [16, 12]
})

table.focus()
screen.append(table)

table.setData({
  headers: ['col1', 'col2'],
  data: [
    [1, 2],
    [3, 4],
    [5, 6],
    [7, 8]
  ]
})

screen.key(['escape', 'q', 'C-c'], (ch, key) => process.exit(0))

screen.render()

// do whatever you like here
table.rows.on('select', console.log)