API Reference

InspectUI works without required props. projectRoot is optional. Optional shortcut, ide, tooltip, and spotlight props seed the overlay settings panel. Update live in the Playground

Props

Props for the <InspectUI /> component.

projectRootstring

Optional. Explicit root for resolving relative paths and shortening labels. Basic setup needs no props.

shortcutstring

Optional seed for the toggle shortcut. Default `"Alt+X"`. Overridable in the settings panel.

ide"cursor" | "vscode" | "vscode-insiders" | "windsurf" | "zed"

Optional seed for open-in-source links. Default `"cursor"`. Overridable in the settings panel.

tooltipPropsPartial<TooltipProps>

Optional seed for tooltip appearance. Settings-panel edits override these for the session.

popoverProps{ defaultTab?: "component" | "element" }

Initial tree tab when Space opens the popover. Default "component".

devSpotlightPropsPartial<DevSpotlightProps>

Optional seed for spotlight appearance. Settings-panel edits override these for the session.

tooltipProps

Tooltip appearance from inspector settings (`setTooltipProps` / toolbar).

backgroundstring

Label background color. Default `"#006efe"`.

textstring

Label text color. Default `"#ffffff"`.

showTitleboolean

Show the component tag (e.g. `<Button/>`) in the label. Default `true`.

showFullUrlboolean

Show the current source path and line. Off shows only the filename and line. Default `true`.

side"top" | "right" | "bottom" | "left"

Preferred side of the spotlight for the label. Flips inside when clipped. Default `"top"`.

align"start" | "center" | "end"

Alignment along the chosen side. Default `"start"`.

sideOffsetnumber

Gap between the spotlight edge and the label, in px. Default `6`.

alignOffsetnumber

Shift along the alignment axis, in px. Default `0`.

paddingXnumber

Horizontal padding inside the label, in px. Default `8`.

paddingYnumber

Vertical padding inside the label, in px. Default `2`.

borderRadiusnumber

Label corner radius, in px. Default `8`.

devSpotlightProps

Spotlight appearance from inspector settings (`setDevSpotlightProps` / toolbar).

backgroundstring

Spotlight fill color. Default `"#006efe"`.

borderstring

Spotlight stroke color. Default `"#006efe"`.

bgOpacitynumber

Fill opacity from `0` to `1`. Default `0.1`.

strokeOpacitynumber

Stroke opacity from `0` to `1`. Default `1`.

strokeWidthnumber

Stroke width in px. Default `0.5`.

strokeStyle"solid" | "dashed" | "dotted"

Stroke style. Default `"solid"`.

animatedboolean

Animate spotlight and tooltip transitions on hover. Default `true`.