Skip to content
Svelte Inspect Value Svelte Inspect Value Svelte <Inspect {value} />

Changelog

v0.5.0

0.5.0 (2025-03-17)

Bug Fixes

  • also display name of object constructor as type when the constructor does not start with “class” (dfad305)
  • avoid passing non html elements to html view. inspecting document should now work. (a5b87e5)
  • don’t display name, length and prototype as “static” when inspecting class constructors (f7093b8)
  • enable undefined to be displayed when previewing single values (e.g. promise results, getters, stores) (ab4c000)

Features

  • support for stores and observables. enable/disable with stores prop. enabled by default. (10980ff)

v0.4.1

0.4.1 (2025-03-11)

Bug Fixes

  • Fixed caret button not displaying correctly in safari (fb7a9b8)
  • Handle --indent css var without calculations (7e9eeed)
    • Add --padding and --padding-compact css vars
    • Add --indent-compact css var
  • Make buttons not trigger expand/collapse doubleclick when clicking fast (5e4d1db)

v0.4.0

0.4.0 (2025-03-09)

Bug Fixes

Avoid any derived / effect using any option to be re-run when changing any (unrelated) option prop. This results in a big performance boost when changing options. (0b00ad3)

Features

Added new props onCopy, canCopy and onLog allowing implementing custom functionality for the “copy” and “log”-buttons. (875b1d3)

Example:

<Inspect
   onCopy={(value, type, path) => { /* custom copy function */ }}
   canCopy={(value, type, path) => { /* show / hide copy button if returns true */ }}
   onLog={(value, type, path) => { /* custom log function */ }}
/>

v0.3.1

0.3.1 (2025-03-04)

Bug Fixes

  • avoid nested hover effect in preview (ed84629)
  • ensure keys have no hover effect when in preview scope (92fc262)
  • indent border-color for string, error and function (broken in previous release) (b56df83)
  • update function syntax highlight to properly use new css-var name introduced in the previous release (0a635d4)

v0.3.0

0.3.0 (2025-02-28)

Features

Extended Theming

It is now possible to override a ton of different colors and properties of the Inspect component. The base16 system is kept intact, but the internal mapping of base16-colors to roles can be overridden with a custom css theme-class or by passing css-vars to the component directly like so:

<Inspect {value} --caret-color="white" --caret-focus-color="hotpink" />

📖 Docs 📋 Full list of overrideable CSS variables

v0.2.3

0.2.3 (2025-02-26)

Bug Fixes

  • setGlobalOptions should receive a function (814607d)
  • correct spelling for InspectOptionsProvider export
  • expandable: check options while checking initial expand state to avoid “intro” transition playing if it should be expanded (was collapsed by default)

v0.2.2

0.2.2 (2025-02-24)

Bug Fixes

  • disable button blur transition if noanimate is set (6cb487f)

v0.2.1

0.2.1 (2025-02-24)

Bug Fixes

  • add type="button" to Tools.svelte and Key.svelte to prevent closing dialogs (#20) (5615d32)

v0.2.0

0.2.0 (2025-02-24)

Features

  • Added new option / prop: parseJson (https://github.com/ampled/svelte-inspect-value/pull/19)
    • If true, string nodes will check if the string starts with '{' or '[' and attempt to parse it as JSON and display the parsed value.
    • A note will be shown to indicate that an object or array is parsed from a string
  • Add expandPath prop/option
    • Array of string path to initially expanded nodes
  • Use original inspect-theme theme as default
  • export InspectOptions type (d52649c)

Bug fixes

  • Disable key hover style/title if in preview scope

v0.1.4

0.1.4 (2025-02-22)

Performance Improvements