Layout the columns

Columns sizes can flex relative to other columns. These last two columns are twice the width of the first column, which is assumed a flex value of 1.

```
ts.ui.get('#example4', table => {
	table.cols([
		{label: 'Level', type: 'ts-number'},
		{label: 'Character', flex: 2},
		{label: 'Alignment', flex: 2},
	]);
	table.rows([
		[21, 'Paladin Knight', 'Lawful Good'],
		[13, 'Barbarian Queen', 'Neutral Evil'],
		[11, 'Global Senior Vice President of Sales', 'Chaotic Evil']
	]);
});
```

If the Table is small, like in the example above, you can still run into truncated text. If this becomes a problem, you can either wrap the column (cells):

```
ts.ui.get('#example5', table => {
	table.cols([
		{label: 'Level', type: 'ts-number'},
		{label: 'Character', flex: 2, wrap: true},
		{label: 'Alignment', flex: 2},
	]);
	table.rows([
		[21, 'Paladin Knight', 'Lawful Good'],
		[13, 'Barbarian Queen', 'Neutral Evil'],
		[11, 'Global Senior Vice President of Sales', 'Chaotic Evil']
	]);
});
```

— or you can assign it a minwidth in pixels. If the table is big enough, the flex values still count, so we will leave them in, noting that the first column is still assumed flex:1.

```
ts.ui.get('#example6', table => {
	table.cols([
		{label: 'Level', type: 'ts-number', minwidth: 55},
		{label: 'Character', flex: 2, minwidth: 300},
		{label: 'Alignment', flex: 2},
	]);
	table.rows([
		[21, 'Paladin Knight', 'Lawful Good'],
		[13, 'Barbarian Queen', 'Neutral Evil'],
		[11, 'Global Senior Vice President of Sales', 'Chaotic Evil']
	]);
});
```

To ensure that the Table can work on a small screen, or even a mobile phone, you should strongly consider specifying a minwidth on all the columns. On small screens, this may result in a horizontal scrollbar, but we don't consider this a problem for the Table. A suggested feature creep would be to let the user control column visibility via the config button so that he can compare two columns without scrolling back and forth.

Finally there's an option to assign a fixed width to one or more columns. This will override any flex. It doesn't work if you assign it to all the columns, so please don't do that.

```
ts.ui.get('#example7', table => {
	table.cols([
		{label: 'Level', type: 'ts-number', width: 55},
		{label: 'Character', minwidth: 300},
		{label: 'Alignment'},
	]);
	table.rows([
		[21, 'Paladin Knight', 'Lawful Good'],
		[13, 'Barbarian Queen', 'Neutral Evil'],
		[11, 'Global Senior Vice President of Sales', 'Chaotic Evil']
	]);
});
```