npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@es-joy/jsoe

v0.24.3

Published

Editing of arbitrary JavaScript objects

Downloads

86

Readme

Licenses badge coverage badge

@es-joy/jsoe

JavaScript Object Editor.

Editing and viewing of arbitrary JavaScript objects.

See a demo of this tool or a demo of an app using this tool.

Formats

Formats are a collection of allowed types.

Supported formats include:

  • Schemas (using zodex serialization of Zod)
  • Structured Cloning (using typeson) (e.g., IndexedDB values)
  • JSON
  • IndexedDB keys

Fundamental types

These are generally atomic types which correlate to JavaScript language structures.

Supported types include:

  • Array reference (for cyclic arrays)
  • Array
  • BigInt
  • bigintObject
  • Blob
  • Boolean object
  • Date
  • DOMException,
  • Error
  • TypeError, RangeError, SyntaxError, ReferenceError, EvalError, URIError, AggregateError, InternalError
  • File
  • FileList
  • Map
  • Non-editable type (catch-all for not-yet-supported object types; allows for preexisting data to be passed on transparently)
  • null
  • Number object
  • number
  • Object reference (for cyclic objects)
  • Object
  • RegExp
  • Set
  • String object
  • string
  • undefined

There are also the following fundamental (structured-cloning capable Zodex) schema types:

  • boolean (using in place of true/false when schema specifies)
  • catch
  • enum
  • literal
  • nan (standalone in Zodex)
  • nativeEnum
  • record
  • tuple
  • void (preferred in Zodex when specified as such)

And there are the following non-structured-cloning Zodex schema types:

  • function
  • promise
  • symbol

Subtypes

These map to a subset of JavaScript language structures. Note that false and true were common and limited enough in number to justify their own subtype for the sake of having a quick pull-down entry.

Supported subtypes include:

  • Blob (text/html)
  • false
  • true

Supertypes

These are collections of individual types, justified by the subitems not being so frequent as to necessitate their own separate enumeration.

Supported supertypes include:

  • Special Real Number (Infinity, -Infinity, -0) - Used with IndexedDB keys (even though -0 apparently to be converted to 0)
  • Special Number (Infinity, -Infinity, -0, NaN) - Used with Structured Cloning values
  • DOMMatrix (also includes DOMMatrixReadOnly)
  • DOMPoint (also includes DOMPointReadOnly)
  • DOMRect (also includes DOMRectReadOnly)
  • buffersource includes ArrayBuffer, DataView, and TypedArrays (int8array, uint8array, uint8clampedarray, int16array, uint16array, int32array, uint32array, float32array, float64array, bigint64array, biguint64array)

Known issues

  • Cannot provide maps with object keys pointing to the same objects as used as map values; likewise with Sets?
  • Certain cyclical structures may have issues
  • typeson-registry's structured cloning should throw on more objects, so bad data doesn't end up stored
  • Currently requires SpecialRealNumber for Infinity/-Infinity despite Zodex number type supporting a finite schema property.
  • Currently doesn't support using isNullable; instead just use null with a union.
  • Lacks support for certain Structured Cloning types. See to-dos below.
  • Excessive use of reportValidity (e.g., in BufferSource, as seen by index-instrumented demo) causing focus of element; should only be triggered by event (and only if not auto-triggered event)

To-dos

  1. Expand fundamental types
    1. Not in typeson-registry
      1. Structured Cloning
        1. Web/API types (besides those listed below)
          1. See https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm#webapi_types
    2. Already in typeson-registry
      1. Structured Cloning
        1. (JavaScript types already complete)
        2. Web/API types
          1. imagedata, imagebitmap
          2. cryptokey
          3. domquad
        3. Our own custom derivative types? (e.g., MIDI using TypedArray)
  2. Expand subtypes
    1. String
      1. As supported by Zod, JSON Schema, etc. (e.g., email addresses as subtype of string, color as a subtype of string)
    2. File/Blob
      1. Drawing image for image/png, etc. File's
      2. Drawing SVG program for application/svg File
      3. JS/CSS/HTML/XML/Markdown/JSON/CSV/text text editor (including syntax highlighting in view mode); with text-to-speech
      4. OCR (TextDetector API if implemented) added as image pop-up utility
  3. Might put views and data into separate repos
  4. Implement as Custom Elements?
  5. Add drag-and-drop support for File type
  6. Import CSV as array
  7. Schema-driven search
    1. Objects: "Has property <property pull-down>" (avoid listing required)
    2. Arrays, Set, FileList, tuple with rest: "Has length/size of <number>"; arrays: "Is/Is not sparse"
    3. Union/Discriminated Union: "Has type <type pull-down>" (including when union is part of a key to records, maps, discriminator of discriminated union, etc.)
    4. undefined/void, null, NaN, Effect, Non-editable (no variants to allow for distinct search; if optional, would be in union); non-editable might allow arbitrary JS query against it, but...
    5. boolean, BooleanObject: true or false
    6. number, NumberObject: OR Ranges/Is Not Range, Is/Is Not Integer
    7. bigint, bigint object: OR Ranges/Is Not Range
    8. BufferSource: OR Range/IS Not Range
    9. string, StringObject, Blob, File, regexp (source), symbol (description): OR literal or regex search/Does Not contain search; regexp gets multiple select search of flags or regex search?
    10. Blob HTML:
      1. XPath (ideally JS like jtlt for XSLT-like JS or doc() and collection() as part of $for in FLWOR shorthand for XQuery-like JS)
      2. CSS selectors
      3. Full text search
      4. Regex search of raw HTML
    11. Special number: multiple select of "Infinity", "-Negativity", "NaN"
    12. date: OR date range, Is Not Range
    13. Enum, Native Enum: multiple select; native enum also can search key vs. value
    14. promise, Literal, catch: pass on children
    15. function; pass on args, return type
    16. Error, Special Errors, DOMException: Literal/Regex search of child string properties, numeric of number children; also pull-down of name for DOMException
    17. DOMRect, DOMPoint, DOMMatrix: numeric search ranges for children; "Is/Is not Readonly"; DOMMatrix: "Is/Is not 3d"
    18. Map, Record: string-type searches of keys, values; ideally would allow search to insist on match of key and value (e.g., has key 2-4 and value 7-9)
    19. Tuple (with rest has size search as with arrays): otherwise just passes on children