@neynar/ui/llm-docs/breadcrumb-item.llm.md

React UI component library built on shadcn/ui and Tailwind CSS

# BreadcrumbItem

**Type**: component

Individual breadcrumb list item container Wraps breadcrumb content (links, pages, separators) in a semantic list item. Provides consistent alignment and spacing for breadcrumb elements with inline flex layout for proper icon and text alignment.

## JSX Usage

```jsx
import { BreadcrumbItem } from '@neynar/ui';

<BreadcrumbItem
  className="value"
>
  {/* Your content here */}
</BreadcrumbItem>
```

## Component Props

### className
- **Type**: `string`
- **Required**: No
- **Description**: Additional CSS classes to apply to the list item element

### children
- **Type**: `React.ReactNode`
- **Required**: No
- **Description**: Content to display within the item (links, pages, separators, ellipsis)

## Examples

### Example 1
```tsx
// With link
<BreadcrumbItem>
  <BreadcrumbLink href="/products">Products</BreadcrumbLink>
</BreadcrumbItem>
```
### Example 2
```tsx
// With current page
<BreadcrumbItem>
  <BreadcrumbPage>Current Page</BreadcrumbPage>
</BreadcrumbItem>
```
### Example 3
```tsx
// With separator
<BreadcrumbItem>
  <BreadcrumbSeparator />
</BreadcrumbItem>
```