# @askrjs/ui/hover-card

> Published API exports for @askrjs/ui/hover-card.

Source: [https://askrjs.com/docs/reference/api/ui/hover-card](https://askrjs.com/docs/reference/api/ui/hover-card)

Status: stable. Packages: @askrjs/ui/hover-card.

**Published packages are authoritative.** Examples may lag behind a published contract. When guidance differs, verify the exports and TypeScript declarations in your installed package, then file an issue.

## Exports

This entrypoint publishes 12 exports from the declarations shipped by @askrjs/ui.

### `HoverCard`

```ts
HoverCard: (props: HoverCardProps) => JSX.Element
```

Renders a part of `hover-card`.

### `HoverCardAsChildProps`

```ts
HoverCardAsChildProps: HoverCardOwnProps & {
  asChild: true;
  children: JSX.Element;
}
```

Props for the `asChild` (polymorphic) rendering of Hover Card.

- `asChild`: asChild: true;

- `children`: children: JSX.Element;

- `closeDelay`: closeDelay?: number | undefined;

- `defaultOpen`: defaultOpen?: boolean | undefined;

- `id`: id?: string | undefined;

- `onOpenChange`: onOpenChange?: ((open: boolean) => void) | undefined;

- `open`: open?: boolean | undefined;

- `openDelay`: openDelay?: number | undefined;

### `HoverCardContent`

```ts
HoverCardContent: { (props: HoverCardContentProps): JSX.Element | null; (props: HoverCardContentAsChildProps): JSX.Element | null; }
```

Renders the `hover-card-content` part of `hover-card` with `role="dialog"`.

Supports polymorphic rendering via `asChild`.

### `HoverCardContentAsChildProps`

```ts
HoverCardContentAsChildProps: BoxAsChildProps & HoverCardContentOwnProps
```

Props for the `asChild` (polymorphic) rendering of Hover Card Content.

- `align`: align?: OverlayAlign | undefined;

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `forceMount`: forceMount?: boolean | undefined;

- `ref`: ref?: Ref<Element>;

- `side`: side?: OverlaySide | undefined;

- `sideOffset`: sideOffset?: number | undefined;

### `HoverCardContentProps`

```ts
HoverCardContentProps: BoxProps<'div', HTMLDivElement> & HoverCardContentOwnProps
```

Props for Hover Card Content.

- `align`: align?: OverlayAlign | undefined;

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `forceMount`: forceMount?: boolean | undefined;

- `ref`: ref?: Ref<HTMLDivElement>;

- `side`: side?: OverlaySide | undefined;

- `sideOffset`: sideOffset?: number | undefined;

### `HoverCardOwnProps`

```ts
HoverCardOwnProps: {
  children?: unknown;
  id?: string;
  open?: boolean;
  defaultOpen?: boolean;
  onOpenChange?: (open: boolean) => void;
  openDelay?: number;
  closeDelay?: number;
}
```

Own props for Hover Card, before merging with native element attributes.

- `children`: children?: unknown;

- `closeDelay`: closeDelay?: number | undefined;

- `defaultOpen`: defaultOpen?: boolean | undefined;

- `id`: id?: string | undefined;

- `onOpenChange`: onOpenChange?: ((open: boolean) => void) | undefined;

- `open`: open?: boolean | undefined;

- `openDelay`: openDelay?: number | undefined;

### `HoverCardPortal`

```ts
HoverCardPortal: (props: HoverCardPortalProps) => JSX.Element | null
```

Renders a part of `hover-card`.

### `HoverCardPortalProps`

```ts
HoverCardPortalProps: {
  children?: unknown;
}
```

Props for Hover Card Portal.

- `children`: children?: unknown;

### `HoverCardProps`

```ts
HoverCardProps: HoverCardOwnProps
```

Props for Hover Card.

- `children`: children?: unknown;

- `closeDelay`: closeDelay?: number | undefined;

- `defaultOpen`: defaultOpen?: boolean | undefined;

- `id`: id?: string | undefined;

- `onOpenChange`: onOpenChange?: ((open: boolean) => void) | undefined;

- `open`: open?: boolean | undefined;

- `openDelay`: openDelay?: number | undefined;

### `HoverCardTrigger`

```ts
HoverCardTrigger: { (props: HoverCardTriggerProps): JSX.Element; (props: HoverCardTriggerAsChildProps): JSX.Element; }
```

Renders the `hover-card-trigger` part of `hover-card`.

Supports polymorphic rendering via `asChild`.

### `HoverCardTriggerAsChildProps`

```ts
HoverCardTriggerAsChildProps: ButtonLikeAsChildProps
```

Props for the `asChild` (polymorphic) rendering of Hover Card Trigger.

- `asChild`: asChild: true;

- `children`: children: JSXElement;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<Element>;

- `type`: type?: undefined;

### `HoverCardTriggerProps`

```ts
HoverCardTriggerProps: ButtonLikeProps<'button', HTMLButtonElement>
```

Props for Hover Card Trigger.

- `asChild`: asChild?: false | undefined;

- `children`: children?: unknown;

- `disabled`: disabled?: boolean | undefined;

- `onPress`: onPress?: ((event: PressEvent) => void) | undefined;

- `ref`: ref?: Ref<HTMLButtonElement>;

- `type`: type?: "button" | "submit" | "reset" | undefined;

## Documentation navigation

[Previous](https://askrjs.com/docs/reference/api/ui/focus-scope/index.md) | [Next](https://askrjs.com/docs/reference/api/ui/menu/index.md)