diff --git a/components/doc/tabview/index.js b/components/doc/tabview/index.js index 0e871c0a95..2fa5653136 100644 --- a/components/doc/tabview/index.js +++ b/components/doc/tabview/index.js @@ -1086,6 +1086,18 @@ template: (options) => { false When enabled displays buttons at each side of the tab headers to scroll the tab list. + + panelContainerStyle + object + null + Inline style of the panels container of the tabview. + + + panelContainerClassName + string + null + Style class of the panels container of the tabview. + diff --git a/components/lib/tabview/TabView.d.ts b/components/lib/tabview/TabView.d.ts index 9a597dff36..4ac494f97f 100644 --- a/components/lib/tabview/TabView.d.ts +++ b/components/lib/tabview/TabView.d.ts @@ -50,6 +50,8 @@ export interface TabViewProps { className?: string; renderActiveOnly?: boolean; scrollable?: boolean; + panelContainerStyle?: object; + panelContainerClassName?: string; onTabChange?(e: TabViewTabChangeParams): void; onTabClose?(e: TabViewTabCloseParams): void; } diff --git a/components/lib/tabview/TabView.js b/components/lib/tabview/TabView.js index 19f125a1db..f282fb0da2 100644 --- a/components/lib/tabview/TabView.js +++ b/components/lib/tabview/TabView.js @@ -226,6 +226,7 @@ export const TabView = forwardRef((props, ref) => { } const createContent = () => { + const className = classNames('p-tabview-panels', props.panelContainerClassName); const contents = React.Children.map(props.children, (tab, index) => { if (shouldUseTab(tab, index) && (!props.renderActiveOnly || isSelected(index))) { const selected = isSelected(index); @@ -243,7 +244,7 @@ export const TabView = forwardRef((props, ref) => { }); return ( -
+
{contents}
) @@ -334,7 +335,9 @@ TabView.defaultProps = { renderActiveOnly: true, onTabChange: null, onTabClose: null, - scrollable: false + scrollable: false, + panelContainerStyle: null, + panelContainerClassName: null } TabView.propTypes /* remove-proptypes */ = { @@ -346,5 +349,7 @@ TabView.propTypes /* remove-proptypes */ = { renderActiveOnly: PropTypes.bool, onTabChange: PropTypes.func, onTabClose: PropTypes.func, - scrollable: PropTypes.bool + scrollable: PropTypes.bool, + panelContainerStyle: PropTypes.object, + panelContainerClassName: PropTypes.string }