Tabs
Functions
- upperCaseString(string) ⇒
string - Upper case the first letter of a string
Typedefs
- props
- Props for [Tabs](#Tabs)
Page Builder Tabs component.
This component is part of the Page Builder / PWA integration. It can be consumed without Page Builder.
**Returns: **
React.Element
— A React component that displays a set of Tabs.
Parameters
| Name | Type | Description |
|---|---|---|
| props | props |
React component props |
Upper case the first letter of a string
Returns: ** **Parameters
| Name | Type |
|---|---|
| string | string |
Props for Tabs
Properties
| Name | Type | Description |
|---|---|---|
| classes | Object |
An object containing the class names for the Tabs |
| classes.header | String |
Class names for the tab header |
| classes.panelSelected | String |
Class names for the selected tab panel |
| classes.panel | String |
Class names for the tab panel |
| classes.contentLeft | String |
Class names for the tab content |
| classes.contentCenter | String |
Class names for the tab content |
| classes.contentRight | String |
Class names for the tab content |
| classes.navigationLeft | String |
Class names for the tab navigation |
| classes.navigationCenter | String |
Class names for the tab navigation |
| classes.navigationRight | String |
Class names for the tab navigation |
| classes.navigationGradientLeft | String |
Class names for the tab navigation gradient when scrolling |
| classes.navigationGradientRight | String |
Class names for the tab navigation gradient when scrolling |
| classes.navigationGradientBoth | String |
Class names for the tab navigation gradient when scrolling |
| classes.disabled | String |
Class names for the disabled tabs |
| classes.selected | String |
Class names for the selected tab |
| classes.item | String |
Class names for the tab item |
| tabNavigationAlignment | String |
Navigation alignment for tabs |
| minHeight | String |
Minimum height of the tabs |
| defaultIndex | Number |
Index of the tab to display by default |
| headers | Array |
Array of tab headers |
| textAlign | String |
Alignment of the Tabs within the parent container |
| border | String |
CSS border property |
| borderColor | String |
CSS border color property |
| borderWidth | String |
CSS border width property |
| borderRadius | String |
CSS border radius property |
| marginTop | String |
CSS margin top property |
| marginRight | String |
CSS margin right property |
| marginBottom | String |
CSS margin bottom property |
| marginLeft | String |
CSS margin left property |
| paddingTop | String |
CSS padding top property |
| paddingRight | String |
CSS padding right property |
| paddingBottom | String |
CSS padding bottom property |
| paddingLeft | String |
CSS padding left property |
| cssClasses | Array |
List of CSS classes to be applied to the component |
Source Code: pwa-studio/packages/pagebuilder/lib/ContentTypes/Tabs/tabs.js
Typedefs
- props
- Props for [TabItem](#TabItem)
Page Builder TabItem component.
This component is part of the Page Builder / PWA integration. It can be consumed without Page Builder.
**Returns: **
React.Element
— A React component that displays a TabItem.
Parameters
| Name | Type | Description |
|---|---|---|
| props | props |
React component props |
Props for TabItem
Properties
| Name | Type | Description |
|---|---|---|
| classes | Object |
An object containing the class names for the TabItem |
| classes.root | String |
CSS class for the tab item root element |
| tabName | String |
Name of the tab item |
| verticalAlignment | String |
Vertical alignment of content within tab item |
| minHeight | String |
CSS minimum height property |
| backgroundColor | String |
CSS background-color property |
| desktopImage | String |
Background image URL to be displayed on desktop devices |
| mobileImage | String |
Background image URL to be displayed on mobile devices |
| backgroundSize | String |
CSS background-size property |
| backgroundPosition | String |
CSS background-position property |
| backgroundAttachment | String |
CSS background-attachment property |
| backgroundRepeat | String |
CSS background-repeat property |
| textAlign | String |
Alignment of content within the tab item |
| border | String |
CSS border property |
| borderColor | String |
CSS border color property |
| borderWidth | String |
CSS border width property |
| borderRadius | String |
CSS border radius property |
| marginTop | String |
CSS margin top property |
| marginRight | String |
CSS margin right property |
| marginBottom | String |
CSS margin bottom property |
| marginLeft | String |
CSS margin left property |
| paddingTop | String |
CSS padding top property |
| paddingRight | String |
CSS padding right property |
| paddingBottom | String |
CSS padding bottom property |
| paddingLeft | String |
CSS padding left property |
| cssClasses | Array |
List of CSS classes to be applied to the component |
Source Code: pwa-studio/packages/pagebuilder/lib/ContentTypes/TabItem/tabItem.js