Separator

'use client';

import { Separator } from '@/registry/san-francisco/ui/separator';

export default function SeparatorDemo() {
  return (
    <div className="flex flex-col gap-2">
      <p className="text-sm">Content above</p>
      <Separator />
      <p className="text-sm">Content below</p>
    </div>
  );
}

'use client';

import { Separator } from '@/registry/san-francisco/ui/separator';

export default function SeparatorDemoVertical() {
  return (
    <div className="flex h-5 items-center gap-4">
      <span className="text-sm">Left</span>
      <Separator orientation="vertical" />
      <span className="text-sm">Right</span>
    </div>
  );
}