Separator

1"use client";
2 
3import * as React from "react";
4import * as SeparatorPrimitive from "@radix-ui/react-separator";
5 
6import { cn } from "@/lib/utils";
7 
8interface SeparatorProps extends React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root> {
9  variant?: "solid" | "dashed" | "dotted";
10}
11 
12const Separator = React.memo(
13  React.forwardRef<React.ElementRef<typeof SeparatorPrimitive.Root>, SeparatorProps>(
14    (
15      { className, orientation = "horizontal", decorative = true, variant = "solid", ...props },
16      ref,
17    ) => (
18      <SeparatorPrimitive.Root
19        ref={ref}
20        decorative={decorative}
21        orientation={orientation}
22        className={cn(
23          "shrink-0 bg-transparent",
24          orientation === "horizontal" ? "h-px w-full border-t" : "h-full w-px border-l",
25          variant === "solid" && "border-border border-solid",
26          variant === "dashed" && "border-border border-dashed",
27          variant === "dotted" && "border-border border-dotted",
28          className,
29        )}
30        {...props}
31      />
32    ),
33  ),
34);
35Separator.displayName = "Separator";
36 
37export { Separator };