Svelte

@atolljs/svelte — Svelte 5 runes adapter. Call the factories during component init; teardown happens in an $effect cleanup.

Install

frontend

npm install @atolljs/core @atolljs/svelte

Usage

App.sveltefrontend

<script lang="ts">
  import { sharedValue, taskState } from '@atolljs/svelte';
  import { counterMemory } from './counter.memory';
  import { counter } from './counter';

  const count = sharedValue(counterMemory, 'count');
  const increment = taskState(counter.increment);
</script>

<button onclick={() => increment.run(1)}>
  count: {count.value ?? '…'}
</button>

Binding API

Export	Signature	What it does
`observableValue`	`observableValue(source): { value: T }`	Subscribe to any observable snapshot as rune-backed state.
`sharedValue`	`sharedValue(memory, key, select?, options?): { value: T \| undefined }`	Bind one shared-memory field as rune state; optional selector + equality.
`taskState`	`taskState(task \| asyncFn): { data, pending, settled, elapsedMs, error, run, runOnce }`	Bind an AsyncTask — or any async fn — snapshot getters plus triggers.

Live demo

@atolljs/sveltesvelte/ ↗

If the frame is blank, the examples aren't up — run npm run dev:all (dev servers) or npm run serve:all (built apps) from the repository root.

Notes

Factories must run in a .svelte.ts module or during component init so runes compile correctly.
Worker-hosted Svelte trees (islands) live in the companion package @atolljs/svelte-island — see the Islands page under this section.