separator

1---
2// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/separator/Separator.astro directly.
3/**
4 * @component Separator
5 * @title Separator
6 * @description Visual separator for grouping content, supporting horizontal and vertical orientation.
7 * @status stable
8 * @figmaUrl https://www.figma.com/design/koxai7zw5vIuBzuVxe5T2l/bejamas-ui?node-id=2511-5829&t=YFStJ3V8fXEO8QD8-4
9 *
10 * @preview
11 * <div>
12 *   <div class="space-y-1">
13 *     <h4 class="text-sm leading-none font-medium">bejamas/ui</h4>
14 *     <p class="text-muted-foreground text-sm">
15 *       An open-source UI component library.
16 *     </p>
17 *   </div>
18 *   <Separator class="my-4" />
19 *   <div class="flex h-5 items-center space-x-4 text-sm">
20 *     <div>Blog</div>
21 *     <Separator orientation="vertical" />
22 *     <div>Docs</div>
23 *     <Separator orientation="vertical" />
24 *     <div>Source</div>
25 *   </div>
26 * </div>
27 *
28 * @usage
29 *
30 * ```astro nocollapse
31 * ---
32 * import { Separator } from '@bejamas/ui/components/separator';
33 * ---
34 *
35 * <Separator />
36 * <Separator orientation="vertical" />
37 * ```
38 */
39 
40import { cn } from "@/lib/utils";
41 
42const {
43  class: className = "",
44  orientation = "horizontal",
45  decorative = true,
46  ...props
47} = Astro.props;
48---
49 
50<div
51  aria-orientation={orientation}
52  aria-hidden={decorative ? "true" : undefined}
53  class={cn(
54    "bg-border shrink-0",
55    orientation === "vertical" ? "h-full w-px" : "h-px w-full",
56    "shrink-0",
57    className,
58  )}
59  {...props}
60>
61</div>