Repository: h2oai/wave
File: ui/src/table.tsx (TypeScript)

Code before:
 * If `multiple` is set to True, each row in the table is selectable. A row can be selected by clicking on it.
 * Multiple rows can be selected either by shift+clicking or using marquee selection. When the form is submitted,
 * `q.args.table_name` is set to `[row1_name, row2_name, ...]` where `table_name` is the `name` of the table,
 * and `row1_name`, `row2_name` are the `name` of the rows that were selected. Note that if `multiple` is
 * set to True, the form is not submitted automatically, and one or more buttons are required in the form to trigger
 * submission.
 * 
 * If `pagination` is set, you have to handle search/filter/sort/download/page_change/reset events yourself since
 * none of these features will work automatically like in non-paginated table.
 */
export interface Table {
  /** An identifying name for this component. */
  name: Id
  /** The columns in this table. */
  columns: TableColumn[]
  /** The rows in this table. Mutually exclusive with `groups` attr. */
  rows?: TableRow[]
  /** True to allow multiple rows to be selected. Mutually exclusive with `single` attr. */
  multiple?: B
  /** True to allow group by feature. */
  groupable?: B
  /** Indicates whether the table rows can be downloaded as a CSV file. Defaults to False. */
  downloadable?: B
  /** Indicates whether a Reset button should be displayed to reset search / filter / group-by values to their defaults. Defaults to False. */
  resettable?: B
  /** Custom height of the table in px (e.g. '200px') or use '1' to fill the remaining card space. */
  height?: S
  /** The width of the table, e.g. '100px'. Defaults to '100%'. */
  width?: S
  /** The names of the selected rows. If this parameter is set, multiple selections will be allowed (`multiple` is assumed to be `True`). */
  values?: S[]
  /** Controls visibility of table rows when `multiple` is set to `True`. Defaults to 'on-hover'. */
  checkbox_visibility?: 'always' | 'on-hover' | 'hidden'
  /** True if the component should be visible. Defaults to True. */
  visible?: B
  /** An optional tooltip message displayed when a user clicks the help icon to the right of the component. */
  tooltip?: S
  /** Creates collapsible / expandable groups of data rows. Mutually exclusive with `rows` attr. */
  groups?: TableGroup[]
  /** Display a pagination control at the bottom of the table. Set this value using `ui.table_pagination()`. */
  pagination?: TablePagination
  /** The events to capture on this table when pagination is set. One of 'search' | 'sort' | 'filter' | 'download' | 'page_change' | 'reset' | 'select'. */
  events?: S[]
  /** True to allow only one row to be selected at time. Mutually exclusive with `multiple` attr. */
  single?: B
  /** The name of the selected row. If this parameter is set, single selection will be allowed (`single` is assumed to be `True`). */
  value?: S
}

type WaveColumn = Fluent.IColumn & {
  dataType?: 'string' | 'number' | 'time'

Review comment (suggestion):
```suggestion
  /** The height of the table in px (e.g. '200px') or '1' to fill the remaining card space. */
```

Code after:
 * If `multiple` is set to True, each row in the table is selectable. A row can be selected by clicking on it.
 * Multiple rows can be selected either by shift+clicking or using marquee selection. When the form is submitted,
 * `q.args.table_name` is set to `[row1_name, row2_name, ...]` where `table_name` is the `name` of the table,
 * and `row1_name`, `row2_name` are the `name` of the rows that were selected. Note that if `multiple` is
 * set to True, the form is not submitted automatically, and one or more buttons are required in the form to trigger
 * submission.
 * 
 * If `pagination` is set, you have to handle search/filter/sort/download/page_change/reset events yourself since
 * none of these features will work automatically like in non-paginated table.
 */
export interface Table {
  /** An identifying name for this component. */
  name: Id
  /** The columns in this table. */
  columns: TableColumn[]
  /** The rows in this table. Mutually exclusive with `groups` attr. */
  rows?: TableRow[]
  /** True to allow multiple rows to be selected. Mutually exclusive with `single` attr. */
  multiple?: B
  /** True to allow group by feature. */
  groupable?: B
  /** Indicates whether the table rows can be downloaded as a CSV file. Defaults to False. */
  downloadable?: B
  /** Indicates whether a Reset button should be displayed to reset search / filter / group-by values to their defaults. Defaults to False. */
  resettable?: B
  /** The height of the table in px (e.g. '200px') or '1' to fill the remaining card space. */
  height?: S
  /** The width of the table, e.g. '100px'. Defaults to '100%'. */
  width?: S
  /** The names of the selected rows. If this parameter is set, multiple selections will be allowed (`multiple` is assumed to be `True`). */
  values?: S[]
  /** Controls visibility of table rows when `multiple` is set to `True`. Defaults to 'on-hover'. */
  checkbox_visibility?: 'always' | 'on-hover' | 'hidden'
  /** True if the component should be visible. Defaults to True. */
  visible?: B
  /** An optional tooltip message displayed when a user clicks the help icon to the right of the component. */
  tooltip?: S
  /** Creates collapsible / expandable groups of data rows. Mutually exclusive with `rows` attr. */
  groups?: TableGroup[]
  /** Display a pagination control at the bottom of the table. Set this value using `ui.table_pagination()`. */
  pagination?: TablePagination
  /** The events to capture on this table when pagination is set. One of 'search' | 'sort' | 'filter' | 'download' | 'page_change' | 'reset' | 'select'. */
  events?: S[]
  /** True to allow only one row to be selected at time. Mutually exclusive with `multiple` attr. */
  single?: B
  /** The name of the selected row. If this parameter is set, single selection will be allowed (`single` is assumed to be `True`). */
  value?: S
}

type WaveColumn = Fluent.IColumn & {
  dataType?: 'string' | 'number' | 'time'