One behavior model for UI, forms, auth, HTTP, query, stores, and theme on every JavaScript stack.

Shared engines. Thin React, Vue, and Web Components adapters. Your design system stays yours.

Quick startArchitectureApp scaffolds
App spinecreateSometicAppAuth, HTTP, and query as one runtime. Session epoch clears query and stores.

Install the spine 

pnpm add @sometic/app-shell @sometic/auth @sometic/http @sometic/query @sometic/auth-local

How the system holds

Not another component kit. A portable application behavior system. Install the spine above, then read the contract below.

One engine, three surfaces
Write behavior once in a framework-agnostic controller. Bind it through React, Vue, or sometic-* elements without forking state, focus, or keyboard rules. Read the architecture.
App spine
When a request gets 401, Sometic coordinates refresh and retries. Session epoch clears query and bound stores together. Start with App shell and createSometicApp.
Same engine, your skin
Zero forced theme. Slots, data-state attributes, and tokens plug into Tailwind, Bootstrap, CSS Modules, or plain CSS. Styling contract.
Accessible by construction
Focus traps, dismiss layers, portals, and scroll locks live in the core and compose into overlays. They are not patched on after ship.

Built for production constraints

Most UI kits assume your design system or force heavy third-party SDKs into your runtime. Sometic stays out of your way.

Framework-agnostic controllers
State, focus, and interaction logic are decoupled from framework lifecycles. Swap the view layer without rewriting core behavior.
Zero CSS contamination
No stylesheets, no default themes, no runtime CSS injection. You own design tokens and DOM structure.
Zero-dependency HTTP core
Built on native fetch with an interceptor pipeline and token refresh queue. No mandatory Axios or networking SDK in core.
SSR-safe from day one
Core controllers guard environment globals at import time, so Next.js, Nuxt, and Remix avoid hydration mismatches and window errors.
Tree-shakable subpath exports
Import only what you use. Feature-isolated packages keep production JavaScript lean.
Declarative slot architecture
Layouts rely on native DOM slots and state attributes for control over rendered nodes and the accessibility tree.

Where the adapters live

The engine is shared. Adapters are how you mount it. Wave A is production-ready for React, Vue, and shipped sometic-* elements; B and C are experimental binds. Not every structure or data surface ships a custom element yet. See What’s included.

  1. A

    Production adapters

    Thin wrappers over shared engines for React, Vue, and Vanilla Web Components (shipped custom-element set plus DOM controllers).

  2. B

    Store bindings

    State-slice integrations for Angular, Svelte, Solid, and Preact. Experimental.

  3. C

    HTML-first enhancements

    Progressive hooks for Alpine.js, jQuery, and HTMX. Experimental.

Start where the system is

Enter through architecture and app services first. UI engines are included. They are not the product story.

Open App shell