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 🙏

© 2026 – Pkg Stats / Ryan Hefner

@opendatacapture/playground-url

v2.1.4

Published

Generate shareable [Open Data Capture playground](https://playground.opendatacapture.org) links from instrument source files.

Readme

@opendatacapture/playground-url

Generate shareable Open Data Capture playground links from instrument source files.

A playground link embeds a snapshot of an instrument's source files directly in the URL (lz-string compressed). Anyone who opens the link gets that instrument loaded into the playground — no server or account required.

Library

import { generatePlaygroundURL } from '@opendatacapture/playground-url';

const url = generatePlaygroundURL({
  files: [{ name: 'index.ts', content: 'export default { /* ... */ };' }],
  label: 'My Instrument'
});
// => https://playground.opendatacapture.org/?files=...&label=...

| Export | Description | | -------------------------------- | ----------------------------------------------------------- | | generatePlaygroundURL(options) | Returns the share link as a string. | | encodeShareURL(options) | Returns a URL annotated with the encoded size in bytes. | | decodeShareURL(url) | Decodes an instrument from a share URL (or null). | | isFullscreenShareURL(url) | Whether the link opens the read-only fullscreen preview. | | DEFAULT_PLAYGROUND_URL | Origin of the hosted playground. |

Options: files, label, optional fullscreen (read-only preview) and baseURL (defaults to the hosted playground).

CLI

Point it at a directory of instrument source files:

npx @opendatacapture/playground-url ./my-instrument

The status line is written to stderr and the link to stdout, so it pipes cleanly.

| Option | Description | | ---------------------- | ----------------------------------------------------------------- | | -l, --label <label> | Label for the shared instrument (defaults to the directory name). | | -f, --fullscreen | Share a read-only fullscreen preview instead of the editor. | | -b, --base-url <url> | Playground origin to link to (defaults to the hosted playground). | | -o, --open | Open the generated link in your default browser. |

Only text source files (.css, .html, .js, .jsx, .json, .ts, .tsx) are embedded; binary assets cannot be represented in a share URL and are skipped with a warning.