Changelog

0.2.0 · 2026-10-02#

Every component is now real, strict TypeScript.

• Interaction and Pixel UI are native React components. 41 components rewritten as React 19 function components styled with Tailwind CSS v4 and cn(), in the way of shadcn/ui: controlled and uncontrolled state (value / defaultValue / onValueChange, checked / onCheckedChange), typed callbacks instead of CustomEvents, ref handles for imperative actions, data-slot and data-state attributes, full server rendering. Pixel UI inputs submit with native forms.
• Pixel Lab, Pixel HD, Network and Service Map are typed custom elements. 170 elements and their three engines converted from JavaScript to strict TypeScript, with typed attributes, methods and event maps, and their tags registered in HTMLElementTagNameMap. The React wrappers are typed from the element classes.
• Your shadcn theme drives everything. Components read --background, --card, --foreground, --muted, --border and the other shadcn tokens directly, in any colour format including oklch(). The new lumesec-theme item adds the --lumesec accent tokens and their Tailwind colours. The --ui-* properties remain as optional overrides for the custom elements.
• Shared React modules in lib/lumesec: theme colour reading for canvas, motion hooks that pause off screen, sparks, rolling labels, the pixel font and controllable state. Each is its own registry item and installs once.
• No type escape hatches. The registry contains no any, @ts-ignore or @ts-nocheck, and every usage snippet in the docs type-checks.
• Docs: React API reference (props, ref handles, subcomponents) for the React components, a React playground, updated guides for React, plain HTML and theming.
• Breaking. React users of Interaction and Pixel UI move from event objects to callbacks (onChange={(e) => e.detail.value} becomes onValueChange={(value) => …}) and from attributes to props. The plain-HTML builds of Interaction and Pixel UI are retired; the other collections keep theirs.

0.1.0 · 2026-10-01#

The first public release of LumeSec Elements.

• 211 components in six collections: Interaction (11), Pixel Lab (50), Pixel UI (30), Pixel HD (60), Network (30) and Service Map (30).
• shadcn registry under @lumesec, with shared engines and React bindings as their own items so they install once.
• Typed React wrappers for every component: props from attributes, on handlers from events, refs with methods.
• Plain HTML modules on the CDN, one per component and one per collection.
• One theming contract. Every collection now reads the same --ui-* tokens with Screen Line fallbacks. The lumesec-theme item maps them onto shadcn themes.
• Server-safe modules. Importing a component on the server no longer touches the DOM.
• Documentation for every component: live preview, install, usage, API reference, keyboard and accessibility.
• Machine-readable docs: Markdown twins, llms.txt and llms-full.txt.

Collections by date#