@neynar/ui/llm-docs/sheet-close.llm.md

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

# SheetClose

**Type**: component

SheetClose - Button that closes the sheet A button that closes the sheet when clicked. Can be placed anywhere within the sheet content. Use the `asChild` prop to render as a different element while maintaining the close functionality. Multiple close buttons can be used throughout the sheet content.

## JSX Usage

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

<SheetClose
  asChild={true}
>
  {/* Your content here */}
</SheetClose>
```

## Component Props

### asChild
- **Type**: `boolean`
- **Required**: No
- **Description**: When true, merges props with child element instead of rendering a button

### children
- **Type**: `React.ReactNode`
- **Required**: No
- **Description**: Child element to render as the close button. Required when asChild is true

## Examples

```tsx
// In footer with styled button
<SheetFooter>
  <SheetClose asChild>
    <Button variant="outline">Cancel</Button>
  </SheetClose>
  <Button type="submit">Save</Button>
</SheetFooter>
// As simple text button
<SheetClose>Close</SheetClose>
// Custom close button in content
<SheetClose asChild>
  <Button variant="ghost" size="sm" className="ml-auto">
    <XIcon className="h-4 w-4" />
  </Button>
</SheetClose>
```