@neynar/ui/llm-docs/pagination-previous.llm.md

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

# PaginationPrevious

**Type**: component

Previous page navigation button Navigates to the previous page in the pagination sequence. Built on PaginationLink with fixed "default" size and includes a chevron-left icon for visual direction. Features responsive design that shows only an icon on mobile devices and icon with "Previous" text on larger screens for optimal user experience. Uses buttonVariants with "ghost" variant by default, inheriting all focus management, hover states, and accessibility features from the Button component.

## JSX Usage

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

<PaginationPrevious
  href="value"
  className="value"
  onClick={handleClick}
  "aria-label"="value"
  "aria-disabled"={true}
  tabIndex={0}
  id="value"
  title="value"
  target={value}
  rel="value"
/>
```

## Component Props

### href
- **Type**: `string`
- **Required**: No
- **Description**: No description available

### className
- **Type**: `string`
- **Required**: No
- **Description**: No description available

### onClick
- **Type**: `React.MouseEventHandler<HTMLAnchorElement>`
- **Required**: No
- **Description**: No description available

### "aria-label"
- **Type**: `string`
- **Required**: No
- **Description**: No description available

### "aria-disabled"
- **Type**: `boolean`
- **Required**: No
- **Description**: No description available

### tabIndex
- **Type**: `number`
- **Required**: No
- **Description**: No description available

### id
- **Type**: `string`
- **Required**: No
- **Description**: No description available

### title
- **Type**: `string`
- **Required**: No
- **Description**: No description available

### target
- **Type**: `"_self" | "_blank" | "_parent" | "_top"`
- **Required**: No
- **Description**: No description available

### rel
- **Type**: `string`
- **Required**: No
- **Description**: No description available

## Examples

### Example 1
```tsx
// Basic previous button
<PaginationPrevious href="/products?page=1" />
```
### Example 2
```tsx
// With disabled state (typically for first page)
<PaginationPrevious
  href="#"
  className="pointer-events-none opacity-50"
  aria-disabled="true"
  tabIndex={-1}
/>
```
### Example 3
```tsx
// With click handler for client-side navigation
<PaginationPrevious
  href="#"
  onClick={(e) => {
    e.preventDefault();
    if (currentPage > 1) {
      onPageChange(currentPage - 1);
    }
  }}
/>
```
### Example 4
```tsx
// With custom aria-label for internationalization
<PaginationPrevious
  href="/page/4"
  aria-label="Ir a la página anterior"
/>
```