wmq
af49d22ca7
Add Telegram, WhatsApp and email account management, realtime messaging, contextual multilingual AI, customer intelligence, knowledge workflows, enterprise controls, a unified design system and complete repository documentation.
36 lines
1.4 KiB
TypeScript
36 lines
1.4 KiB
TypeScript
import type { HTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react'
|
|
import { cn } from '@/utils/cn'
|
|
|
|
export function Table({ className, ...props }: HTMLAttributes<HTMLTableElement>) {
|
|
return (
|
|
<div className="w-full overflow-x-auto scrollbar-thin">
|
|
<table className={cn('w-full text-sm', className)} {...props} />
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export function THead({ className, ...props }: HTMLAttributes<HTMLTableSectionElement>) {
|
|
return <thead className={cn('border-b border-slate-200 bg-slate-50/80', className)} {...props} />
|
|
}
|
|
|
|
export function TBody({ className, ...props }: HTMLAttributes<HTMLTableSectionElement>) {
|
|
return <tbody className={cn('divide-y divide-slate-100', className)} {...props} />
|
|
}
|
|
|
|
export function Tr({ className, ...props }: HTMLAttributes<HTMLTableRowElement>) {
|
|
return <tr className={cn('transition-colors hover:bg-primary-50/35', className)} {...props} />
|
|
}
|
|
|
|
export function Th({ className, ...props }: ThHTMLAttributes<HTMLTableCellElement>) {
|
|
return (
|
|
<th
|
|
className={cn('whitespace-nowrap px-4 py-3 text-start text-[11px] font-semibold uppercase tracking-[0.04em] text-slate-500', className)}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export function Td({ className, colSpan, ...props }: TdHTMLAttributes<HTMLTableCellElement>) {
|
|
return <td className={cn('px-4 py-3 align-middle text-slate-700', className)} colSpan={colSpan} {...props} />
|
|
}
|