# @askrjs/themes/separator

> Published API exports for @askrjs/themes/separator.

Source: [https://askrjs.com/docs/reference/api/themes/separator](https://askrjs.com/docs/reference/api/themes/separator)

Status: stable. Packages: @askrjs/themes/separator.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Exports

This entrypoint publishes 5 exports from the declarations shipped by @askrjs/themes.

### `Separator`

```ts
Separator: { (props: SeparatorNativeProps): JSX.Element; (props: SeparatorAsChildProps): JSX.Element; }
```

Visual divider, defaulting to horizontal `role="separator"`; pass
`decorative` to drop the semantic role, or `asChild` to merge onto a
single child element.

### `SeparatorAsChildProps`

```ts
SeparatorAsChildProps: SeparatorOwnProps & {
  asChild: true;
  children: JSXElement;
  ref?: Ref<unknown>;
}
```

Props for {@link Separator } rendered with `asChild`, merging its attributes onto a single child element.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `decorative`: decorative?: boolean | undefined;

- `orientation`: orientation?: "vertical" | "horizontal" | undefined;

- `ref`: ref?: Ref<unknown>;

### `SeparatorNativeProps`

```ts
SeparatorNativeProps: Omit<JSX.IntrinsicElements["div"], "children" | "ref"> & SeparatorOwnProps & {
  asChild?: false;
  ref?: Ref<HTMLDivElement>;
}
```

Props for {@link Separator } rendered as its default `<div>` element.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `decorative`: decorative?: boolean | undefined;

- `orientation`: orientation?: "vertical" | "horizontal" | undefined;

- `ref`: ref?: Ref<HTMLDivElement>;

### `SeparatorOwnProps`

```ts
SeparatorOwnProps: {
  decorative?: boolean;
  orientation?: "horizontal" | "vertical";
  children?: unknown;
}
```

Props shared by both {@link Separator } call signatures.

- `children`: children?: unknown;

- `decorative`: decorative?: boolean | undefined;

- `orientation`: orientation?: "vertical" | "horizontal" | undefined;

### `SeparatorProps`

```ts
SeparatorProps: SeparatorNativeProps | SeparatorAsChildProps
```

Union of all prop shapes accepted by {@link Separator }.

- `asChild`: asChild?: boolean | undefined;

- `children`: children?: unknown;

- `decorative`: decorative?: boolean | undefined;

- `orientation`: orientation?: "vertical" | "horizontal" | undefined;

- `ref`: ref?: ((value: unknown) => void) | { current: unknown; } | ((value: HTMLDivElement | null) => void) | { current: HTMLDivElement | null; } | null | undefined;

## Documentation navigation

[Previous](https://askrjs.com/docs/reference/api/themes/select/index.md) | [Next](https://askrjs.com/docs/reference/api/themes/sheet/index.md)