Inspector
A floating developer tool that enters inspect mode on click, highlighting pura elements on hover and opening a panel to edit component attributes live with localStorage persistence.
Preview
Attributes
| Attribute | Type | Default | Description |
|---|---|---|---|
position | string | bottom-left | Corner of the trigger bubble: bottom-left, bottom-right, top-left, or top-right |
hidden-in-prod | boolean | — | Informational attribute; the host app decides whether to mount the inspector |
Installation
pura is copy-paste and dependency-free. Load the whole library, or just this component.
<link rel="stylesheet" href="/pura/tokens.css">
<script type="module" src="/pura/lib/inspector.js"></script>import "./pura/lib/inspector.js";