import { cn } from "#lib/utils.ts";
import { separator as styles } from "./classes.ts";

export interface Input extends Marko.Input<"div"> {
  orientation?: "horizontal" | "vertical";
  decorative?: boolean;
}

<const/{ orientation = "horizontal", decorative = true, class: className, content, ...rest }=input/>

<div
  data-slot="separator"
  data-orientation=orientation
  role=(decorative ? "none" : "separator")
  aria-orientation=(decorative ? undefined : orientation)
  class=cn(styles.root, className)
  ...rest
>
  <${content}/>
</div>