# Load More Button

A full-width button used to append more items to a paginated list, with loading and styling variants.

---

## Default

```tsx
import { LoadMoreButton } from '@vercel/geistcn/components';
import type { JSX } from 'react';

export function Component(): JSX.Element {
  return <LoadMoreButton>Load More</LoadMoreButton>;
}
```

## Loading

```tsx
import { LoadMoreButton } from '@vercel/geistcn/components';
import type { JSX } from 'react';

export function Component(): JSX.Element {
  return <LoadMoreButton loading>Loading...</LoadMoreButton>;
}
```

## No Gap

```tsx
import { LoadMoreButton } from '@vercel/geistcn/components';
import type { JSX } from 'react';

export function Component(): JSX.Element {
  return <LoadMoreButton noGap>Load More</LoadMoreButton>;
}
```

## No Border Radius

```tsx
import { LoadMoreButton } from '@vercel/geistcn/components';
import type { JSX } from 'react';

export function Component(): JSX.Element {
  return <LoadMoreButton noBorderRadius>Load More</LoadMoreButton>;
}
```

## Custom Text

```tsx
import { LoadMoreButton } from '@vercel/geistcn/components';
import type { JSX } from 'react';

export function Component(): JSX.Element {
  return <LoadMoreButton>Show More Results</LoadMoreButton>;
}
```