### SCSS

#### Modifiers

Modifier classes for Data Tables are used with various classes.

| Selector                     | Description                                                                                                                                                                                                   |
|------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| `bx--responsive-table--tall` | Makes tables taller. Specifically, rendered height of a table row will be `44px` (by default, table rows are `32px` without this modifier). Apply this class to `div.bx--responsive-tabler-container` element |
| `bx--parent-row--even`       | The class for even parent rows                                                                                                                                                                                |
| `bx--expandable-row`         | The class for expandable rows                                                                                                                                                                                 |
| `bx--expandable-row--even`   | The class for even expandable rows                                                                                                                                                                            |
| `bx--expandable-row--hidden` | The class for hidden expandable rows                                                                                                                                                                          |
| `bx--table-sort--ascending`  | The class modifier for sorting columns in ascending order                                                                                                                                                     |

### JavaScript

#### Public Methods

| Name        | Params | Description                                                                       |
|-------------|--------|-----------------------------------------------------------------------------------|
| release     |        | Deletes the instance and removes document event listeners                         |
| refreshRows |        | When adding in new table rows, use this method to correctly re-apply stripes      |


#### Options

| Option                   | Default Selector                         | Description                                                                         |
|--------------------------|------------------------------------------|-------------------------------------------------------------------------------------|
| selectorInit             | `[data-responsive-table]`                | The selector to find instances of the component                                     |
| selectorExpandCells      | `.bx--table-expand`                      | The selector to find expanded cells                                                 |
| selectorExpandableRows   | `.bx--expandable-row`                    | The selector to find expandable rows                                                |
| selectorParentRows       | `.bx--parent-row`                        | The selector to find parent rows                                                    |
| selectorTableBody        | `.bx--table-body`                        | The selector to find table body                                                     |
| selectorCheckbox         | `.bx--checkbox`                          | The selector to find checkboxes                                                     |
| classParentRowEven       | `bx--parent-row--even`                   | The class for even parent rows                                                      |
| classExpandableRow       | `bx--expandable-row`                     | The class for expandable rows                                                       |
| classExpandableRowEven   | `bx--expandable-row--even`               | The class for even expandable rows                                                  |
| classExpandableRowHidden | `bx--expandable-row--hidden`             | The class for hidden expandable rows                                                |
| classTableSortAscending  | `bx--table-sort--ascending`              | The class modifier for sorting columns in ascending order                           |
| eventBeforeExpand        | `responsive-table-beforetoggleexpand`    | Event triggered before expanding a table row                                        |
| eventAfterExpand         | `responsive-table-aftertoggleexpand`     | Event triggered after expanding a table row                                         |
| eventBeforeSort          | `responsive-table-beforetogglesort`      | Event triggered before toggling a sort action                                       |
| eventAfterSort           | `responsive-table-aftertogglesort`       | Event triggered after toggling a sort action                                        |
| eventBeforeSelectAll     | `responsive-table-beforetoggleselectall` | Event triggered before selecting all rows with checkbox                             |
| eventAfterSelectAll      | `responsive-table-aftertoggleselectall`  | Event triggered after selecting all rows with checkbox                              |
| eventTrigger             | `[data-event]`                           | Used for listing describing the event type on HTML (`expand`, `sort`, `select-all`) |
| eventParentContainer     | `[data-parent-row]`                      | Indicates the parent row of an event target                                         |

#### Events

| Option               | Default Selector                         | Description                                                                         |
|----------------------|------------------------------------------|-------------------------------------------------------------------------------------|
| eventBeforeExpand    | `responsive-table-beforetoggleexpand`    | Event triggered before expanding a table row                                        |
| eventAfterExpand     | `responsive-table-aftertoggleexpand`     | Event triggered after expanding a table row                                         |
| eventBeforeSort      | `responsive-table-beforetogglesort`      | Event triggered before toggling a sort action                                       |
| eventAfterSort       | `responsive-table-aftertogglesort`       | Event triggered after toggling a sort action                                        |
| eventBeforeSelectAll | `responsive-table-beforetoggleselectall` | Event triggered before selecting all rows with checkbox                             |
| eventAfterSelectAll  | `responsive-table-aftertoggleselectall`  | Event triggered after selecting all rows with checkbox                              |
| eventTrigger         | `[data-event]`                           | Used for listing describing the event type on HTML (`expand`, `sort`, `select-all`) |
| eventParentContainer | `[data-parent-row]`                      | Indicates the parent row of an event target                                         |