UNPKG

@navinc/base-react-components

Version:
27 lines (21 loc) 771 B
Wraps and positions tabs created from child elements. Placed at the top of a card to allow users to change the state/view of the card. Create tabs by passing in child elements to a `TabGroup`. For each child use the `isActive` flag to control the conditions when active styling should be applied. #### Usage: For instance where the URL should not change in the case of a filter, you can use `isActive` and an `onClick` to change the content of the page. ``` <TabGroup> <FilterLink isActive={alertsListFilter === 'ALL_ALERTS'} onClick={this.setAlertsFilter('ALL_ALERTS')}> All Alerts </FilterLink> <FilterLink isActive={alertsListFilter === 'BUSINESS'} onClick={this.setAlertsFilter('BUSINESS')}> Business </FilterLink> <TabGroup> ```