From 337aad82e4dae98348bad1d029c5460a47f1c7b6 Mon Sep 17 00:00:00 2001 From: Dominik Schab Date: Fri, 13 Jan 2023 11:42:38 -0500 Subject: [PATCH 1/2] Adding optional props to Tabs component --- src/Tabs/Tabs.jsx | 11 ++++++++++- src/Tabs/Tabs.styles.js | 14 ++++++++++++++ 2 files changed, 24 insertions(+), 1 deletion(-) diff --git a/src/Tabs/Tabs.jsx b/src/Tabs/Tabs.jsx index 35d469a0..130ce9d6 100644 --- a/src/Tabs/Tabs.jsx +++ b/src/Tabs/Tabs.jsx @@ -7,9 +7,14 @@ import { StyledTabsWrapper } from './Tabs.styles'; const Tabs = ({ children, + flexWrapUnset, + navItemButtonFullHeight, ...props }) => ( - + {children} @@ -21,8 +26,10 @@ export default Tabs; Tabs.propTypes = { activeKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), defaultActiveKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + flexWrapUnset: PropTypes.bool, id: PropTypes.string.isRequired, mountOnEnter: PropTypes.bool, + navItemButtonFullHeight: PropTypes.bool, transition: PropTypes.oneOfType([ PropTypes.oneOf([false]), PropTypes.elementType, @@ -34,7 +41,9 @@ Tabs.propTypes = { Tabs.defaultProps = { activeKey: undefined, defaultActiveKey: 1, + flexWrapUnset: false, mountOnEnter: undefined, + navItemButtonFullHeight: false, transition: undefined, unmountOnExit: undefined, onSelect: undefined, diff --git a/src/Tabs/Tabs.styles.js b/src/Tabs/Tabs.styles.js index 2523e0a0..7f8acb33 100644 --- a/src/Tabs/Tabs.styles.js +++ b/src/Tabs/Tabs.styles.js @@ -6,6 +6,20 @@ const borderWidth = '0.125rem'; const fontType30 = '400 0.875rem/1.25rem DM Sans, sans-serif'; export const StyledTabsWrapper = styled.span` + ${({ flexWrapUnset }) => flexWrapUnset && ` + .nav { + flex-wrap: nowrap; + } + `} + + ${({ navItemButtonFullHeight }) => navItemButtonFullHeight && ` + .nav-item { + button { + height: calc(100% + ${borderWidth}); + } + } + `} + .nav-tabs { border-bottom: ${borderWidth} solid ${colors.UX_GRAY_400}; } From 63fb6fdd2596b6b204012841c36834179c8efc84 Mon Sep 17 00:00:00 2001 From: Dominik Schab Date: Fri, 13 Jan 2023 11:48:09 -0500 Subject: [PATCH 2/2] Update snapshots --- spec/__snapshots__/Storyshots.test.js.snap | 4 ++-- src/Tabs/__snapshots__/Tabs.test.jsx.snap | 8 ++++---- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/spec/__snapshots__/Storyshots.test.js.snap b/spec/__snapshots__/Storyshots.test.js.snap index f25d0eb4..4d389392 100644 --- a/spec/__snapshots__/Storyshots.test.js.snap +++ b/spec/__snapshots__/Storyshots.test.js.snap @@ -20626,7 +20626,7 @@ exports[`Storyshots Components/Tabs Controlled 1`] = ` >
        , "container":
            , "container":