@@ -2,30 +2,34 @@ import React, { forwardRef } from 'react'
22import clsx from 'clsx'
33import { twMerge } from 'tailwind-merge'
44
5- import { IComponentBaseProps , ComponentSize } from '../types'
5+ import { IComponentBaseProps , ComponentSize , ComponentPosition } from '../types'
66
77import Tab from './Tab'
88import RadioTab from './RadioTab'
99
1010export type TabsProps = React . HTMLAttributes < HTMLDivElement > &
1111 IComponentBaseProps & {
12- variant ?: 'bordered' | 'lifted ' | 'boxed'
12+ variant ?: 'bordered' | 'lift ' | 'boxed'
1313 size ?: ComponentSize
14+ position ?: Extract < ComponentPosition , 'top' | 'bottom' >
1415 }
1516
1617const Tabs = forwardRef < HTMLDivElement , TabsProps > (
17- ( { children, className, variant, size } , ref ) : JSX . Element => {
18+ ( { children, className, variant, size, position } , ref ) : JSX . Element => {
1819 const classes = twMerge (
1920 'tabs' ,
2021 className ,
2122 clsx ( {
2223 'tabs-boxed' : variant === 'boxed' ,
2324 'tabs-bordered' : variant === 'bordered' ,
24- 'tabs-lifted' : variant === 'lifted' ,
25+ 'tabs-lift' : variant === 'lift' ,
26+ 'tabs-xl' : size === 'xl' ,
2527 'tabs-lg' : size === 'lg' ,
2628 'tabs-md' : size === 'md' ,
2729 'tabs-sm' : size === 'sm' ,
2830 'tabs-xs' : size === 'xs' ,
31+ 'tabs-top' : position === 'top' ,
32+ 'tabs-bottom' : position === 'bottom' ,
2933 } )
3034 )
3135
0 commit comments