A has one prop, selectedTab. The value of that prop should be the same as the tab prop of a and its paired .

_TabGroup_ and _Tab_

A contains components.

These are rendered as

and
• elements, respectively; there should be no elements between them.

  A has no props.

  Each component has one prop, tab. The value of that prop pairs with the tab prop of a component (such that when a is selected with a click, its paired is rendered).

  _TabPanel_

  A is a container for content.

  Content can be declared either as children or as the return of a function assigned to its prop render.

  If your component extends PureComponent or is presentational, you might prefer to declare content as children.

  Otherwise, you can assign a function to the render prop, so that rendering is deferred until the tab is selected.

  $3

  `jsx



  
Content

  

`

  $3

  `jsx
(


  
Content

  
)} />
`

  (Notice that in this case there is no closing tag; if there were, children would be ignored in favour of the return from the function, anyway.)

  $3

  A component can contain or be contained by an valid children or parent, just like a .

  `jsx

{ /*
Etc.
*/ }


  
  

  
  

  
  
  One
  
  

  
  

  
  
  
{
return 'Two'
}} />

`

  Similarly, they can be declared in any combination.

  Demonstrating _react-tab-set_

  Example Storybooks are available.

  Clone the repository, then:

  `bash
npm install
npm run storybook
`

  And with your preferred browser visit http://localhost:6006`.