28 lines
908 B
TypeScript
28 lines
908 B
TypeScript
import * as React from 'react';
|
|
import { cn } from '@/lib/utils';
|
|
import { TabsTrigger } from './TabsTrigger';
|
|
import type { TabsListProps } from './types';
|
|
|
|
export const TabsList = React.forwardRef<HTMLDivElement, TabsListProps>(
|
|
({ className, children, activeValue, onValueChange, ...props }, ref) => (
|
|
<div
|
|
ref={ref}
|
|
className={cn(
|
|
'inline-flex h-10 items-center justify-center rounded-md bg-kodo-graphite p-1 text-kodo-content-dim border border-kodo-steel/30',
|
|
className,
|
|
)}
|
|
{...props}
|
|
>
|
|
{React.Children.map(children, (child) => {
|
|
if (React.isValidElement(child) && child.type === TabsTrigger) {
|
|
return React.cloneElement(child, {
|
|
activeValue,
|
|
onValueChange,
|
|
} as React.HTMLAttributes<HTMLElement>);
|
|
}
|
|
return child;
|
|
})}
|
|
</div>
|
|
),
|
|
);
|
|
TabsList.displayName = 'TabsList';
|