# Overlay Components

> Generated reference (regen-owned; see [index.md](index.md)). Binds only under `primitives: nurix`.

## Dialog

Modal dialog with configurable size, position, and variant.

**Sub-components:** `DialogTrigger`, `DialogContent`, `DialogHeader`, `DialogBody`, `DialogFooter`, `DialogTitle`, `DialogDescription`, `DialogClose`

**Content props:** `size` [sm|md|default|lg|xl|full], `position` [center|top|bottom], `variant` [default|danger], `dismissible` (default true; false when variant is danger), `showDividers`, `scrollable` (pins header/footer, scrolls body), `title`, `description`, `icon` (render a built-in header)

**Header/Footer props:** `showDivider`

```tsx
<Dialog>
  <DialogTrigger asChild>
    <Button>Edit profile</Button>
  </DialogTrigger>
  <DialogContent size="lg">
    <DialogHeader showDivider>
      <DialogTitle>Edit Profile</DialogTitle>
    </DialogHeader>
    <DialogBody>
      <Input value={name} onChange={(e) => setName(e.target.value)} />
    </DialogBody>
    <DialogFooter showDivider>
      <Button onClick={handleSave}>Save</Button>
    </DialogFooter>
  </DialogContent>
</Dialog>
```

## Sheet

Side panel overlay with header/body/footer layout.

**Sub-components:** `SheetTrigger`, `SheetContent`, `SheetHeader`, `SheetBody`, `SheetFooter`, `SheetTitle`, `SheetDescription`, `SheetClose`

**Content props:** `side` [top|right|bottom|left], `size` [sm|md|default|lg|xl|full] (left/right only; top/bottom span full width), `showCloseButton`, `showOverlay`

**Header/Footer props:** `showDivider` **Body props:** `noPadding`

```tsx
<Sheet>
  <SheetTrigger asChild>
    <Button>Open</Button>
  </SheetTrigger>
  <SheetContent side="right" size="lg">
    <SheetHeader showDivider>
      <SheetTitle>Settings</SheetTitle>
    </SheetHeader>
    <SheetBody>
      <Input value={name} onChange={(e) => setName(e.target.value)} />
    </SheetBody>
    <SheetFooter showDivider>
      <Button onClick={handleSave}>Save</Button>
    </SheetFooter>
  </SheetContent>
</Sheet>
```

## Other Overlays

Standard compound components following the Trigger/Content pattern; import each from its kebab-case subpath (e.g. `@nurix/components/element/popover`):

- `Command` (`command`)
- `ContextMenu` (`context-menu`)
- `DropdownMenu` (`dropdown-menu`)
- `HoverCard` (`hover-card`)
- `Popover` (`popover`)
- `Tooltip` (`tooltip`)