@sig-ui/components

Framework-agnostic SigUI Web Components (light DOM).

What this package is for

Use @sig-ui/components for:

• accessible, token-driven UI components
• consistent design-language behavior through --sg-* tokens
• optional machine-backed interactive components
• optional HTMX rehydration support

How it fits in SigUI

core -> theme -> (dom + components)

• Depends on @sig-ui/core, @sig-ui/theme, and @sig-ui/dom.
• Consumes CSS/token outputs generated from SigUI config.
• Can be replaced by project-owned components installed via sigui add.

Install

bun add @sig-ui/components

Quick examples

import { defineSiguiComponents } from "@sig-ui/components";
import "@sig-ui/components/styles/sigui.css";

defineSiguiComponents(); // registers sg-* tags

<sg-card>
  <h2>Hello</h2>
  <sg-button color="primary">Save</sg-button>
</sg-card>

Optional HTMX integration

import { installSiguiHtmx } from "@sig-ui/components/lib/htmx";
import "@sig-ui/components/styles/htmx.css";

installSiguiHtmx();

Main API

• defineSiguiComponents(options?)
• registry
• SiguiElement, rehydrateSubtree
• utilities: useMachine, useId, useReducedMotion, enableKeyboardNavigation
• feature flags: configureSiguiFeatures, getSiguiFeatureFlags, isSiguiFeatureEnabled

Full docs

• docs/ARCHITECTURE_OVERVIEW.md
• docs/COMPONENTS.md
• docs/DOM.md (peer runtime)
• docs/THEME.md (token source)