str 'svelte-inspect-value' 20 chars
str 'copy to clipboard 👉' 20 chars
str 'npm install svelte-inspect-value' 32 chars
str 'pnpm add svelte-inspect-value' 29 chars
str 'bun add svelte-inspect-value' 28 chars
str 'yarn add svelte-inspect-value' 29 chars
What it is
Svelte Inspect Value is a collection of "JSON tree"-like value inspector components.
The main purpose of the components is to be a developer utility. When developing apps it can be
useful to have a "live" preview of state like API data, form values, the state of a promise and so
on.
Features
The examples page is the quickest way to get an overview of what this component
can do, but here is a list of its key features:
- Display arrays & objects in a tree-like view
- Support for most JavaScript built-ins, including
Set
, Map
, Date
, URL
, promises etc. - Inspect current values of svelte stores or Observables
- Syntax highlighting for functions and html elements (outer selector) using
hljs
- Embed media if string ends with image / audio extension (optional)
- Customizable colors
- Configurable with global options utility as alternative to passing props
- Fixed position drawer / panel component