message: Refactor TabNav
diff: @@ -11,41 +11,30 @@ import * as History from 'history'
  const ITEM_CLASS = 'TabNav-item'
  const SELECTED_CLASS = 'selected'
  -const TabNavParent = styled.nav<SystemCommonProps & SxProp>`
  +const TabNavBase = styled.nav<SystemCommonProps & SxProp>`
  + display: flex;
  + border-bottom: 1px solid ${get('colors.border.gray')};
  +
  + .TabNav-body {
  + display: flex;
  + margin-bottom: -1px;
  + }
  +
  ${COMMON}
  ${sx}
  `
  -type TabNavBaseProps = {
  - actions?: Array<any>
  - full?: boolean
  - align?: string
  -} & ComponentProps<typeof TabNavParent> &
  - SystemCommonProps &
  - SxProp
  +export type TabNavProps = ComponentProps<typeof TabNavBase>
  -function TabNavBase({actions, className, align, children, full, theme, ...rest}: TabNavBaseProps) {
  +function TabNav({className, children, ...rest}: TabNavProps) {
  const classes = classnames(className, 'TabNav')
  return (
  - <TabNavParent className={classes} {...rest}>
  + <TabNavBase className={classes} {...rest}>
  <div className="TabNav-body">{children}</div>
  - </TabNavParent>
  + </TabNavBase>
  )
  }
  -const TabNav = styled(TabNavBase)`
  - display: flex;
  - border-bottom: 1px solid ${get('colors.border.gray')};
  -
  - .TabNav-body {
  - display: flex;
  - margin-bottom: -1px;
  - }
  -
  - ${COMMON};
  - ${sx};
  -`
  -
  type StyledTabNavLinkProps = {
  to?: History.LocationDescriptor
  selected?: boolean
  @@ -108,6 +97,5 @@ TabNavLink.propTypes = {
  TabNavLink.displayName = 'TabNav.Link'
  -export type TabNavProps = ComponentProps<typeof TabNav>
  export type TabNavLinkProps = ComponentProps<typeof TabNavLink>
  export default Object.assign(TabNav, {Link: TabNavLink})
  