Component
Separator
A hairline.
stablev0.2.0 Chromium 103 ui-scale safe
Install
Copies the file into
components/ds/, with its registry dependencies and npm packages. See Installation for the one-time setup.bunx shadcn@3 add @fastrp/separatorExamples
Default
Los Santos
Ana şehir
248 oyuncu32 msSezon 3
API
<Separator />Takes the props of what it wrapsA hairline in `line`. Decorative by default; pass `decorative={false}` for a real boundary.
Dependencies
npm
- @radix-ui/react-separator@^1.1.1
Registry
- @fastrp/utils
Source
components/ds/separator.tsxShowHide
'use client';
import * as SeparatorPrimitive from '@radix-ui/react-separator';
import type * as React from 'react';
import { cn } from '@/lib/utils';
// @fast-ds [email protected]
/** A hairline in `line`. Decorative by default; pass `decorative={false}` for a real boundary. */
function Separator({
className,
orientation = 'horizontal',
decorative = true,
...props
}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
return (
<SeparatorPrimitive.Root
data-slot="separator"
decorative={decorative}
orientation={orientation}
className={cn(
'shrink-0 bg-foreground/10',
orientation === 'horizontal' ? 'h-px w-full' : 'h-full w-px',
className,
)}
{...props}
/>
);
}
export { Separator };