stellify/ui
Web Component primitives and design tokens for Stellify-rendered apps. Built on progressive enhancement.
Philosophy
The library follows the HTML Web Components pattern — components wrap existing markup and enhance it, rather than rendering Shadow DOM. The user authors regular HTML; Stellify adds custom-element wrappers; the bundle attaches behaviour at runtime.
If JavaScript fails to load, the underlying markup still works.
Quick Start
Install the package and import in your JavaScript entry point:
npm install @stellisoft/stellify-uiimport '@stellisoft/stellify-ui'Components
st-sidebar
Collapsible navigation rail with keyboard shortcut, persistent state, tooltips.
st-dialog
Modal and non-modal dialog built on native <dialog> with trigger integration.
st-menu
Dropdown/popup menu primitive with keyboard navigation.
st-frame
Independently-updating subview: links and forms fetch and swap content.
st-form
Form orchestrator: synchronous validation, focus management, alert state.
st-field
Input wrapper: validates on blur, drives existing error markup.
st-checkbox
Accessible checkbox primitive.
st-theme-switcher
Theme management with light, dark, and system preferences.
st-tooltip
Contextual information tooltips with keyboard shortcut support.
st-disclosure
Reveal hidden content for inline editing and progressive disclosure.
st-passkey-register
WebAuthn passkey registration with full credential flow.