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

@pyreon/ui-core

v0.2.0

Published

Core utilities, config, and context for Pyreon UI System

Downloads

963

Readme

@pyreon/ui-core

Shared foundation for the Pyreon UI System ecosystem.

Provides utility functions, a styling engine bridge, theme context, and HTML tag definitions used across all @pyreon packages. No external utility dependencies — all implementations are built-in with prototype pollution protection where applicable.

Installation

bun add @pyreon/ui-core

API

Provider & Context

import { Provider, context, config, init } from '@pyreon/ui-core'

Provider wraps your app with a theme context. It bridges @pyreon/styler's theming with the internal context system.

import { Provider } from '@pyreon/ui-core'

Provider({
  theme: { rootSize: 16, breakpoints: { xs: 0, md: 768 } },
  children: [/* your app */],
})

config — the styling engine singleton. Pyreon uses @pyreon/styler directly — no connector abstraction needed.

import { config } from '@pyreon/ui-core'

// Access the engine from anywhere
const { styled, css, keyframes } = config

Utilities

compose

Right-to-left function composition.

import { compose } from '@pyreon/ui-core'

const transform = compose(toUpperCase, trim, normalize)
transform('  hello  ') // => 'HELLO'

render

Flexible element renderer. Handles components, elements, primitives, and arrays.

import { render } from '@pyreon/ui-core'

render('hello')           // => 'hello'
render(MyComponent)       // => MyComponent({})
render(null)              // => null

isEmpty

Type-safe emptiness check. Returns true for null, undefined, {}, [], and non-object primitives.

import { isEmpty } from '@pyreon/ui-core'

isEmpty({})        // => true
isEmpty([])        // => true
isEmpty(null)      // => true
isEmpty({ a: 1 }) // => false

omit / pick

Create objects without or with only specified keys. Accept nullable inputs.

import { omit, pick } from '@pyreon/ui-core'

omit({ a: 1, b: 2, c: 3 }, ['b'])    // => { a: 1, c: 3 }
pick({ a: 1, b: 2, c: 3 }, ['a', 'b']) // => { a: 1, b: 2 }

set / get

Nested property access and mutation by dot/bracket path. set has built-in prototype pollution protection — keys like __proto__, constructor, and prototype are blocked.

import { set, get } from '@pyreon/ui-core'

const obj = {}
set(obj, 'a.b.c', 42)    // => { a: { b: { c: 42 } } }
get(obj, 'a.b.c')         // => 42
get(obj, 'a.x', 'default') // => 'default'

merge

Deep merge objects left-to-right. Only plain objects are recursed into; arrays are replaced wholesale. Prototype pollution keys are blocked.

import { merge } from '@pyreon/ui-core'

merge({ a: { x: 1 } }, { a: { y: 2 } }) // => { a: { x: 1, y: 2 } }

throttle

Limits function execution to at most once per wait period. Returns a throttled function with a .cancel() method.

import { throttle } from '@pyreon/ui-core'

const throttled = throttle(handleResize, 200)
window.addEventListener('resize', throttled)
// cleanup: throttled.cancel()

HTML Constants

import { HTML_TAGS, HTML_TEXT_TAGS } from '@pyreon/ui-core'
  • HTML_TAGS — array of 100+ valid HTML tag names
  • HTML_TEXT_TAGS — array of text-content tags (h1–h6, p, span, strong, em, etc.)

Both have corresponding TypeScript union types: HTMLTags and HTMLTextTags.

Peer Dependencies

| Package | Version | | ------- | ------- | | @pyreon/core | >= 0.0.1 | | @pyreon/styler | >= 0.0.1 |

License

MIT