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

image-panel

v0.3.3-a

Published

Minimalist image viewer web component.

Readme

image-panel

Yes this is another image viewer / photoframe / thing. Here's a few reason's this one deserves to exist:

  • It's a custom web component (bespoke HTML element) so it's trivial to implement.
  • Uses a separate config file to update without having to republish your page (nested img support & folder loading are on roadmap).
  • Allows you to add custom style info on a per-image basis.
  • No dependencies.
  • Very compact (12Kb minified atm).

This isn't aiming to be another image gallery viewer - think of it more like a digital photo frame that is meant to sit on the coffee table and show images passively. It has no UI, though hooks are provided so you can add one. By default it expands to fill whatever container it's placed in, but you can always style it differently if you like.

This is alpha. It's a component-ised version of the slideshow viewer I've had on my own site for ages, and has plenty of shoddy code to prove it. Future versions will improve this and add some vital extra functionality, but don't expect an all-singing, all-dancing featureset, this isn't meant for that.

Usage

Embed the dist/ImagePanel.js file in your HTML (typically at the end of <body>):

<script src="pathto/ImagePanel.js"></script>

Add a <image-panel> element in the desired location. Set the data attribute to point to a JSON config file. Use the sample one in test as a guide until this README is improved.

<image-panel data="pathto/slideshow.json"></image-panel>