nexa-devtools

Development tools for inspecting signals, components, and stores during development.

IMPORTANT

DevTools are automatically disabled in production when globalThis.__NEXA_PRODUCTION__ is set to true. Set this flag in your production build to prevent the DevTools API from being exposed.

devSignal

Wraps an existing signal for DevTools tracking.

import { devSignal } from 'nexa-devtools'

function devSignal(label: string, sig: Signal<any>): void

Parameter	Description
label	Display name shown in DevTools
sig	An existing signal to track

Example:

const count = signal(0)
devSignal('count', count)
count.value = 1 // reported to DevTools

registerComponent

Registers a component instance for DevTools inspection.

import { registerComponent } from 'nexa-devtools'

function registerComponent(instance: ComponentInstance): void

unregisterComponent

Removes a component from DevTools tracking (called automatically on unmount).

import { unregisterComponent } from 'nexa-devtools'

function unregisterComponent(instance: ComponentInstance): void

inspectSignals

Returns a key-value map of all registered DevTools signals.

import { inspectSignals } from 'nexa-devtools'

function inspectSignals(): Record<string, any>

Example:

const signals = inspectSignals()
// { count: 5, theme: 'dark' }

inspectComponents

Returns an array of all registered DevTools components with metadata.

import { inspectComponents } from 'nexa-devtools'

function inspectComponents(): Array<{
  id: number
  name: string
  mountedAt: number
  props: Record<string, any>
}>

inspectStore

Returns the full state snapshot of a store with DevTools tracking.

import { inspectStore } from 'nexa-devtools'

function inspectStore(store: Store<any>): Record<string, any>

clearDevTools

Clears all registered DevTools data and resets counters.

import { clearDevTools } from 'nexa-devtools'

function clearDevTools(): void

initDevTools

Initializes the DevTools bridge and exposes the API on window.__NEXA_DEVTOOLS__ for browser extension integration. Also mounts the visual DevTools panel.

import { initDevTools } from 'nexa-devtools'

function initDevTools(): void

Note: initDevTools() returns void. The API is exposed on window.__NEXA_DEVTOOLS__ as a side effect.

After calling initDevTools(), the following becomes available in the browser console:

window.__NEXA_DEVTOOLS__.inspectSignals()
window.__NEXA_DEVTOOLS__.inspectComponents()
window.__NEXA_DEVTOOLS__.clear()