47 lines
1.0 KiB
TypeScript
47 lines
1.0 KiB
TypeScript
import { cn } from '@/utils/cn';
|
|
|
|
interface DotProps {
|
|
className?: string;
|
|
size?: number;
|
|
animated?: boolean;
|
|
}
|
|
|
|
function filterCn(filter: string[], className: string | undefined) {
|
|
const split: string[] = className?.split(' ') || [];
|
|
return split
|
|
.filter((item) => !filter.some((filterItem) => item.startsWith(filterItem)))
|
|
.join(' ');
|
|
}
|
|
|
|
export function Dot({ className, size = 8, animated }: DotProps) {
|
|
const style = {
|
|
width: size,
|
|
height: size,
|
|
};
|
|
return (
|
|
<div
|
|
className={cn(
|
|
'relative',
|
|
filterCn(['bg-', 'animate-', 'group-hover/row'], className),
|
|
)}
|
|
style={style}
|
|
>
|
|
<div
|
|
className={cn(
|
|
'absolute !m-0 rounded-full',
|
|
animated !== false && 'animate-ping',
|
|
className,
|
|
)}
|
|
style={style}
|
|
/>
|
|
<div
|
|
className={cn(
|
|
'absolute !m-0 rounded-full',
|
|
filterCn(['animate-', 'group-hover/row'], className),
|
|
)}
|
|
style={style}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|