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

@webx-ui/module-inbox

v0.6.4

Published

Forms and submissions for the WebX UI admin panel: the forms of a site, their fields, their statuses, and what has come in through them.

Readme

@webx-ui/module-inbox

Forms and submissions as a section of the WebX UI admin panel: the forms of a site on the left, what came in through one of them on the right.

The other half is webx-ui/module-inbox on the server, which holds the forms, takes the submissions and sends the notifications. Neither is useful alone.

Install

pnpm add @webx-ui/module-inbox
import { createAdmin } from '@webx-ui/module-admin'
import { inbox } from '@webx-ui/module-inbox'
import '@webx-ui/module-inbox/style.css'

createAdmin({
  modules: [inbox()],
})

The section claims the panel's front page: a panel with an inbox is one somebody opens in the morning to see what came in overnight. A panel whose front page is something else says inbox({ landing: false }).

What is here

  • The section — the forms in a column that can be dragged into order, each with what is waiting in it, and the submissions of the chosen one beside them.
  • The form editor — what the form is called and where it answers, its questions, who is written to, the antispam, and the one line that puts it on a page.
  • The questions — a field is a row with an identity, not a value of the form: it is saved in its own dialog, dragged into its own order, and deleted softly so that answers already given keep reading under the label they were asked with.
  • The statuses — the states a submission can be in, as rows with their own words and colours.

Permissions

inbox.view opens the section and the submissions; inbox.manage changes what the forms ask and what the statuses are. The panel draws only what the reader may do, and the server refuses the rest either way.

Words

The English here is a floor, so nothing shows a key while the dictionary is on its way. The translations live in the Composer package — one set of files for both halves.

Licence

MIT