Documentation

SDK packages

Seven packages, one core. Every binding is a thin translation of the same framework-agnostic stores, so behaviour does not drift between frameworks.

All documentation
Getting started
Overview Quickstart SDK packages
Frontend
React Vue Svelte React Native Web Components Headless & theming Real-time
Backend API
Authentication Templates Trigger & status Contacts & preferences
More
Self-hosting Reference

Pick the package for your stack

Every package is a thin layer over a shared, framework-agnostic core, so behavior is identical across frameworks.

PackageForShips
@elaanio/reactReact (web)Components + hooks, SSE realtime
@elaanio/vueVue 3Components + composables, SSE realtime
@elaanio/svelteSvelteReactive stores (headless)
@elaanio/react-nativeReact NativeNative components, SSE via react-native-sse
@elaanio/elementsAny page / frameworkWeb Components (custom elements)
@elaanio/react-coreReact (custom UI)Provider + hooks, no components
@elaanio/coreAny JSClient + observable stores + realtime

The three components

All three are available everywhere, and behave the same in each framework:

  • Bell: an icon with an unread badge and a popover feed.
  • Inbox feed: the notification list, rendered inline.
  • Preferences: the per-type by per-channel opt-in matrix.

Auth (the tokenProvider), realtime, polling, and optimistic updates work identically across every binding, because they all sit on the same core.

Why the layering matters. A fix to reconnection or optimistic-update behaviour lands in @elaanio/core and every framework package inherits it. The bindings only translate the core's observable stores into that framework's idiom: hooks in React, composables in Vue, native stores in Svelte.

Versioning

The packages are versioned together and published to npm under the @elaanio scope. The framework bindings re-export their core's API and pin it exactly, so upgrading a binding pulls the matching core with it. Source and issues live at github.com/ThingsIDoForLove/elaan-js.