@livestore/livestore 0.4.0-dev.22 → 0.4.0-dev.23

package/docs/getting-started/vue/index.md

@@ -1,471 +0,0 @@
-# Getting started with LiveStore + Vue
-
-{/* We're adjusting the package to use the dev version on the dev branch */}
-export const manualInstallDepsStr = [
-  '@livestore/livestore' + versionNpmSuffix,
-  '@livestore/wa-sqlite' + versionNpmSuffix,
-  '@livestore/adapter-web' + versionNpmSuffix,
-  '@livestore/utils' + versionNpmSuffix,
-  '@livestore/peer-deps' + versionNpmSuffix,
-  '@livestore/devtools-vite' + versionNpmSuffix,
-  'slashv/vue-livestore' + versionNpmSuffix,
-  'vue',
-  '@vitejs/plugin-vue',
-  'vite-plugin-vue-devtools',
-].join(' ')
-
-## Prerequisites
-
-- Recommended: Bun 1.2 or higher
-- Node.js {MIN_NODE_VERSION} or higher
-
-## About Vue integration
-
-Vue integration is still in beta and being incubated as a separate repository. Please direct any issues or contributions to [Vue LiveStore](https://github.com/slashv/vue-livestore)
-
-## Option A: Quick start
-
-For a quick start, we recommend referencing the [playground](https://github.com/slashv/vue-livestore/tree/main/playground) folder in the Vue LiveStore repository.
-
-## Option B: Existing project setup \{#existing-project-setup\}
-
-<Steps>
-
-1. **Install dependencies**
-
-   It's strongly recommended to use `bun` or `pnpm` for the simplest and most reliable dependency setup (see [note on package management](/misc/package-management) for more details).
-
-   <Tabs syncKey="package-manager">
-     <TabItem label="bun">
-       <Code code={'bun install ' + manualInstallDepsStr} lang="sh" />
-     </TabItem>
-     <TabItem label="pnpm">
-       <Code code={'pnpm add ' + manualInstallDepsStr} lang="sh" />
-     </TabItem>
-     <TabItem label="npm">
-       <Code code={'npm install ' + manualInstallDepsStr} lang="sh" />
-     </TabItem>
-   </Tabs>
-
-2. **Update Vite config**
-
-   Add the following code to your `vite.config.js` file:
-
-## `getting-started/vue/vite-config.ts`
-
-```ts filename="getting-started/vue/vite-config.ts"
-
-export default defineConfig({
-  plugins: [vue(), vueDevTools(), livestoreDevtoolsPlugin({ schemaPath: './src/livestore/schema.ts' })],
-  worker: { format: 'es' },
-})
-```
-
-</Steps>
-
-### Define your schema
-
-Create a file named `schema.ts` inside the `src/livestore` folder. This file defines your LiveStore schema consisting of your app's event definitions (describing how data changes), derived state (i.e. SQLite tables), and materializers (how state is derived from events).
-
-Here's an example schema:
-
-## `getting-started/vue/livestore/schema.ts`
-
-```ts filename="getting-started/vue/livestore/schema.ts"
-
-export const tables = {
-  todos: State.SQLite.table({
-    name: 'todos',
-    columns: {
-      id: State.SQLite.text({ primaryKey: true }),
-      text: State.SQLite.text({ default: '' }),
-      completed: State.SQLite.boolean({ default: false }),
-      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
-    },
-  }),
-  uiState: State.SQLite.clientDocument({
-    name: 'uiState',
-    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
-    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
-  }),
-}
-
-export const events = {
-  todoCreated: Events.synced({
-    name: 'v1.TodoCreated',
-    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
-  }),
-  todoCompleted: Events.synced({
-    name: 'v1.TodoCompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoUncompleted: Events.synced({
-    name: 'v1.TodoUncompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoDeleted: Events.synced({
-    name: 'v1.TodoDeleted',
-    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
-  }),
-  todoClearedCompleted: Events.synced({
-    name: 'v1.TodoClearedCompleted',
-    schema: Schema.Struct({ deletedAt: Schema.Date }),
-  }),
-  uiStateSet: tables.uiState.set,
-}
-
-const materializers = State.SQLite.materializers(events, {
-  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
-  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
-  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
-  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
-  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
-})
-
-const state = State.SQLite.makeState({ tables, materializers })
-
-export const schema = makeSchema({ events, state })
-```
-
-### Create the LiveStore worker
-
-Create a file named `livestore.worker.ts` inside the `src/livestore` folder. This file will contain the LiveStore web worker. When importing this file, make sure to add the `?worker` extension to the import path to ensure that Vite treats it as a worker file.
-
-## `getting-started/vue/livestore/livestore.worker.ts`
-
-```ts filename="getting-started/vue/livestore/livestore.worker.ts"
-
-makeWorker({ schema })
-```
-
-### `getting-started/vue/livestore/schema.ts`
-
-```ts filename="getting-started/vue/livestore/schema.ts"
-
-export const tables = {
-  todos: State.SQLite.table({
-    name: 'todos',
-    columns: {
-      id: State.SQLite.text({ primaryKey: true }),
-      text: State.SQLite.text({ default: '' }),
-      completed: State.SQLite.boolean({ default: false }),
-      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
-    },
-  }),
-  uiState: State.SQLite.clientDocument({
-    name: 'uiState',
-    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
-    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
-  }),
-}
-
-export const events = {
-  todoCreated: Events.synced({
-    name: 'v1.TodoCreated',
-    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
-  }),
-  todoCompleted: Events.synced({
-    name: 'v1.TodoCompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoUncompleted: Events.synced({
-    name: 'v1.TodoUncompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoDeleted: Events.synced({
-    name: 'v1.TodoDeleted',
-    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
-  }),
-  todoClearedCompleted: Events.synced({
-    name: 'v1.TodoClearedCompleted',
-    schema: Schema.Struct({ deletedAt: Schema.Date }),
-  }),
-  uiStateSet: tables.uiState.set,
-}
-
-const materializers = State.SQLite.materializers(events, {
-  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
-  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
-  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
-  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
-  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
-})
-
-const state = State.SQLite.makeState({ tables, materializers })
-
-export const schema = makeSchema({ events, state })
-```
-
-### Add the LiveStore provider
-
-To make the LiveStore available throughout your app, wrap your app's root component with the `<LiveStoreProvider>` component from `vue-livestore`. This provider manages your app's data store, loading, and error states.
-
-Here's an example:
-
-## `getting-started/vue/app.vue`
-
-```vue filename="getting-started/vue/app.vue"
-<script setup lang="ts">
-
-const adapter = makePersistedAdapter({
-  storage: { type: 'opfs' },
-  worker: LiveStoreWorker,
-  sharedWorker: LiveStoreSharedWorker,
-})
-
-const storeOptions = {
-  schema,
-  adapter,
-  storeId: 'test_store',
-}
-
-void storeOptions
-</script>
-
-<template>
-  <LiveStoreProvider :options="storeOptions">
-    <template #loading>
-      <div>Loading LiveStore...</div>
-    </template>
-    <slot />
-  </LiveStoreProvider>
-</template>
-```
-
-### `getting-started/vue/livestore/schema.ts`
-
-```ts filename="getting-started/vue/livestore/schema.ts"
-
-export const tables = {
-  todos: State.SQLite.table({
-    name: 'todos',
-    columns: {
-      id: State.SQLite.text({ primaryKey: true }),
-      text: State.SQLite.text({ default: '' }),
-      completed: State.SQLite.boolean({ default: false }),
-      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
-    },
-  }),
-  uiState: State.SQLite.clientDocument({
-    name: 'uiState',
-    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
-    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
-  }),
-}
-
-export const events = {
-  todoCreated: Events.synced({
-    name: 'v1.TodoCreated',
-    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
-  }),
-  todoCompleted: Events.synced({
-    name: 'v1.TodoCompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoUncompleted: Events.synced({
-    name: 'v1.TodoUncompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoDeleted: Events.synced({
-    name: 'v1.TodoDeleted',
-    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
-  }),
-  todoClearedCompleted: Events.synced({
-    name: 'v1.TodoClearedCompleted',
-    schema: Schema.Struct({ deletedAt: Schema.Date }),
-  }),
-  uiStateSet: tables.uiState.set,
-}
-
-const materializers = State.SQLite.materializers(events, {
-  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
-  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
-  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
-  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
-  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
-})
-
-const state = State.SQLite.makeState({ tables, materializers })
-
-export const schema = makeSchema({ events, state })
-```
-
-### Commit events
-
-After wrapping your app with the `<LiveStoreProvider>`, you can use the `useStore()` hook from any component to commit events.
-
-Here's an example:
-
-## `getting-started/vue/commit-events.vue`
-
-```vue filename="getting-started/vue/commit-events.vue"
-<script setup lang="ts">
-
-// biome-ignore lint/correctness/useHookAtTopLevel: Vue composables run at script setup level
-const { store } = useStore()
-
-const newTodoText = ref('')
-
-const createTodo = () => {
-  store.commit(events.todoCreated({ id: crypto.randomUUID(), text: newTodoText.value }))
-  newTodoText.value = ''
-}
-
-void createTodo
-</script>
-
-<template>
-  <div>
-    <input v-model="newTodoText" />
-    <button @click="createTodo">Create</button>
-  </div>
-</template>
-```
-
-### `getting-started/vue/livestore/schema.ts`
-
-```ts filename="getting-started/vue/livestore/schema.ts"
-
-export const tables = {
-  todos: State.SQLite.table({
-    name: 'todos',
-    columns: {
-      id: State.SQLite.text({ primaryKey: true }),
-      text: State.SQLite.text({ default: '' }),
-      completed: State.SQLite.boolean({ default: false }),
-      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
-    },
-  }),
-  uiState: State.SQLite.clientDocument({
-    name: 'uiState',
-    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
-    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
-  }),
-}
-
-export const events = {
-  todoCreated: Events.synced({
-    name: 'v1.TodoCreated',
-    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
-  }),
-  todoCompleted: Events.synced({
-    name: 'v1.TodoCompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoUncompleted: Events.synced({
-    name: 'v1.TodoUncompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoDeleted: Events.synced({
-    name: 'v1.TodoDeleted',
-    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
-  }),
-  todoClearedCompleted: Events.synced({
-    name: 'v1.TodoClearedCompleted',
-    schema: Schema.Struct({ deletedAt: Schema.Date }),
-  }),
-  uiStateSet: tables.uiState.set,
-}
-
-const materializers = State.SQLite.materializers(events, {
-  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
-  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
-  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
-  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
-  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
-})
-
-const state = State.SQLite.makeState({ tables, materializers })
-
-export const schema = makeSchema({ events, state })
-```
-
-### Queries
-
-To retrieve data from the database, first define a query using `queryDb` from `@livestore/livestore`. Then, execute the query with the `useQuery()` hook from `vue-livestore`.
-
-Consider abstracting queries into a separate file to keep your code organized, though you can also define them directly within components if preferred.
-
-Here's an example:
-
-## `getting-started/vue/queries.vue`
-
-```vue filename="getting-started/vue/queries.vue"
-<script setup lang="ts">
-
-const visibleTodos$ = queryDb(() => tables.todos.where({ completed: false }), { label: 'visibleTodos' })
-
-// biome-ignore lint/correctness/useHookAtTopLevel: Vue composables run at script setup level
-const todos = useQuery(visibleTodos$)
-
-void todos
-</script>
-
-<template>
-  <div>
-    <ul>
-      <li v-for="todo in todos" :key="todo.id">
-        {{ todo.text }}
-      </li>
-    </ul>
-  </div>
-</template>
-```
-
-### `getting-started/vue/livestore/schema.ts`
-
-```ts filename="getting-started/vue/livestore/schema.ts"
-
-export const tables = {
-  todos: State.SQLite.table({
-    name: 'todos',
-    columns: {
-      id: State.SQLite.text({ primaryKey: true }),
-      text: State.SQLite.text({ default: '' }),
-      completed: State.SQLite.boolean({ default: false }),
-      deletedAt: State.SQLite.integer({ nullable: true, schema: Schema.DateFromNumber }),
-    },
-  }),
-  uiState: State.SQLite.clientDocument({
-    name: 'uiState',
-    schema: Schema.Struct({ newTodoText: Schema.String, filter: Schema.Literal('all', 'active', 'completed') }),
-    default: { id: SessionIdSymbol, value: { newTodoText: '', filter: 'all' } },
-  }),
-}
-
-export const events = {
-  todoCreated: Events.synced({
-    name: 'v1.TodoCreated',
-    schema: Schema.Struct({ id: Schema.String, text: Schema.String }),
-  }),
-  todoCompleted: Events.synced({
-    name: 'v1.TodoCompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoUncompleted: Events.synced({
-    name: 'v1.TodoUncompleted',
-    schema: Schema.Struct({ id: Schema.String }),
-  }),
-  todoDeleted: Events.synced({
-    name: 'v1.TodoDeleted',
-    schema: Schema.Struct({ id: Schema.String, deletedAt: Schema.Date }),
-  }),
-  todoClearedCompleted: Events.synced({
-    name: 'v1.TodoClearedCompleted',
-    schema: Schema.Struct({ deletedAt: Schema.Date }),
-  }),
-  uiStateSet: tables.uiState.set,
-}
-
-const materializers = State.SQLite.materializers(events, {
-  'v1.TodoCreated': ({ id, text }) => tables.todos.insert({ id, text, completed: false }),
-  'v1.TodoCompleted': ({ id }) => tables.todos.update({ completed: true }).where({ id }),
-  'v1.TodoUncompleted': ({ id }) => tables.todos.update({ completed: false }).where({ id }),
-  'v1.TodoDeleted': ({ id, deletedAt }) => tables.todos.update({ deletedAt }).where({ id }),
-  'v1.TodoClearedCompleted': ({ deletedAt }) => tables.todos.update({ deletedAt }).where({ completed: true }),
-})
-
-const state = State.SQLite.makeState({ tables, materializers })
-
-export const schema = makeSchema({ events, state })
-```

package/docs/index.md

@@ -1,208 +0,0 @@
-# Docs
-
-<CardGrid>
-  <LinkCard
-    title="Getting started"
-    description="Learn how to get started with LiveStore"
-    href="/getting-started/react-web"
-  />
-    <LinkCard
-    title="Introduction"
-    description="Introduction to LiveStore"
-    href="/overview/introduction"
-  />
-  <LinkCard
-    title="Evaluation"
-    description="Evaluate LiveStore for your use case"
-    href="/understanding-livestore/design-decisions"
-  />
-  <LinkCard
-    title="Patterns"
-    description="A collection of patterns for using LiveStore in different scenarios"
-    href="/patterns/anonymous-user-transition/"
-  />
-  <LinkCard
-    title="Community"
-    description="Community resources for LiveStore"
-    href="/misc/community"
-  />
-  <LinkCard
-    title="Contributing"
-    description="Contributing to LiveStore"
-    href="/sustainable-open-source/contributing/info"
-  />
-</CardGrid>
-
-## State of the documentation
-
-Please note that the documentation is still work in progress. Please [leave feedback](https://github.com/livestorejs/livestore/issues) if you didn't find the information you were looking for and [consider contributing](/sustainable-open-source/contributing/docs) yourself.
-
-### Docs for LLMs
-
-We support the [llms.txt](https://llmstxt.org/) convention for making documentation available to large language models and the applications that make use of them.
-
-Currently, we have the following root-level files:
-
-
-## Getting started
-
-- [Getting started with LiveStore + React](/getting-started/react-web): How to use LiveStore with React on the web.
-- [Expo](/getting-started/expo): Learn how to use LiveStore with Expo.
-- [Node](/getting-started/node): Learn how to use LiveStore with Node.
-- [Getting started with LiveStore + Vue](/getting-started/vue): How to use LiveStore with Vue.
-- [Solid](/getting-started/solid): Learn how to use LiveStore with Solid.
-
-## Tutorial
-
-- [Overview and prerequisites](/tutorial/0-welcome)
-- [1. Set up starter project with React, Vite & Tailwind](/tutorial/1-setup-starter-project)
-- [2. Deploy to Cloudflare Workers](/tutorial/2-deploy-to-cloudflare)
-- [3. Read and write todos via LiveStore](/tutorial/3-read-and-write-todos-via-livestore)
-- [4. Sync data to Cloudflare](/tutorial/4-sync-data-via-cloudflare)
-- [5. Expand business logic with more events](/tutorial/5-expand-business-logic)
-- [6. Persist UI state](/tutorial/6-persist-ui-state)
-- [Next steps](/tutorial/7-next-steps)
-
-## Overview
-
-- [Introduction](/overview/introduction)
-- [Why LiveStore?](/overview/why-livestore)
-- [How LiveStore works](/overview/how-livestore-works)
-- [Concepts](/overview/concepts): Concepts in LiveStore
-- [When to use LiveStore (and when not)](/overview/when-livestore): Considerations when deciding to use LiveStore.
-- [Technology comparison](/overview/technology-comparison): How LiveStore compares to other related technologies
-
-## Building with LiveStore
-
-- [Rules for AI agents](/building-with-livestore/rules-for-ai-agents)
-- [Events](/building-with-livestore/events)
-- [Data modeling](/building-with-livestore/data-modeling)
-- [CRUD](/building-with-livestore/crud): CRUD
-- [Store](/building-with-livestore/store)
-- [Complex UI state](/building-with-livestore/complex-ui-state): How to model complex UI state in LiveStore.
-- [Reactivity system](/building-with-livestore/reactivity-system)
-- [Syncing](/building-with-livestore/syncing): Syncing
-- [Debugging a LiveStore app](/building-with-livestore/debugging)
-- [Devtools](/building-with-livestore/devtools)
-- [OpenTelemetry](/building-with-livestore/opentelemetry)
-- [Production checklist](/building-with-livestore/production-checklist): Checklist for productionizing a LiveStore app
-
-### State
-
-- [SQLite state schema](/building-with-livestore/state/sqlite-schema)
-- [SQLite state schema (Effect schema)](/building-with-livestore/state/sqlite-schema-effect)
-- [SQL queries](/building-with-livestore/state/sql-queries)
-- [Materializers](/building-with-livestore/state/materializers)
-- [SQLite in LiveStore](/building-with-livestore/state/sqlite): Notes on how to use SQLite in LiveStore
-
-### Tools
-
-- [LiveStore CLI](/building-with-livestore/tools/cli): Command-line interface for LiveStore project scaffolding and development tools.
-- [MCP integration](/building-with-livestore/tools/mcp): Model Context Protocol integration for AI assistants like Claude.
-
-### Examples
-
-- [Todo app with shared workspaces](/building-with-livestore/examples/todo-workspaces): How to model a todo workspace app with shared workspaces in LiveStore.
-- [Turn-based game](/building-with-livestore/examples/turnbased-game): How to model a turn-based game in LiveStore.
-- [AI agent](/building-with-livestore/examples/ai-agent): How to model an AI agent in LiveStore.
-
-## Framework integrations
-
-- [React integration for LiveStore](/framework-integrations/react-integration): How to integrate LiveStore with React.
-- [Custom elements](/framework-integrations/custom-elements): How to integrate LiveStore with Custom Elements aka Web Components.
-- [Svelte integration](/framework-integrations/svelte-integration): How to integrate LiveStore with Svelte.
-- [Vue integration for LiveStore](/framework-integrations/vue-integration): How to integrate LiveStore with Vue.
-- [Solid integration](/framework-integrations/solid-integration): How to integrate LiveStore with Solid.
-
-## Platform adapters
-
-- [Web adapter](/platform-adapters/web-adapter): Information about LiveStore's web adapter
-- [Expo Adapter](/platform-adapters/expo-adapter): LiveStore adapter for React Native apps built with Expo
-- [Node adapter](/platform-adapters/node-adapter)
-- [Cloudflare Durable Object adapter](/platform-adapters/cloudflare-durable-object-adapter)
-- [Tauri adapter](/platform-adapters/tauri-adapter)
-- [Electron adapter](/platform-adapters/electron-adapter)
-
-## Sync providers
-
-- [Cloudflare Workers](/sync-providers/cloudflare)
-- [ElectricSQL](/sync-providers/electricsql)
-- [S2](/sync-providers/s2): Use the official S2 backend with LiveStore via @livestore/sync-s2
-- [Build your own sync provider](/sync-providers/custom)
-
-## Patterns
-
-- [Server-side clients](/patterns/server-side-clients)
-- [Encryption](/patterns/encryption)
-- [Effect](/patterns/effect)
-- [Rich Text Editing](/patterns/rich-text-editing)
-- [Auth](/patterns/auth)
-- [Rich text editing](/patterns/rich-text-editing)
-- [List Ordering](/patterns/list-ordering): Implement drag-and-drop list ordering with fractional indexing
-- [External data](/patterns/external-data)
-- [Offline support](/patterns/offline)
-- [Side effect](/patterns/side-effects): How to run side-effects for LiveStore events
-- [Version control](/patterns/version-control)
-- [Anonymous user transition](/patterns/anonymous-user-transition): How to transition an anonymous user to a logged in user
-- [File management](/patterns/file-management): How to manage files with LiveStore
-- [State machines](/patterns/state-machines): How to use state machines with LiveStore
-- [App evolution](/patterns/app-evolution): How to evolve your app and roll out new app versions
-- [Storybook testing (React)](/patterns/storybook): How to set up LiveStore with Storybook for component development and testing in React.
-- [Undo/Redo](/patterns/undo-redo): How to implement undo/redo functionality with LiveStore
-- [File structure](/patterns/file-structure)
-- [Presence](/patterns/presence): How to implement presence functionality with LiveStore
-- [ORM](/patterns/orm): How to use an ORM with LiveStore
-- [AI](/patterns/ai): How to use LiveStore to build AI applications
-
-## Understanding LiveStore
-
-- [Event sourcing](/understanding-livestore/event-sourcing): Why and how LiveStore uses event sourcing for data flow, syncing and migrations.
-- [Design decisions](/understanding-livestore/design-decisions): Design decisions and trade-offs made in the development of LiveStore
-
-## Sustainable open source
-
-- [Sponsoring LiveStore](/sustainable-open-source/sponsoring)
-
-### Contributing
-
-- [Info](/sustainable-open-source/contributing/info): Notes for developers interested in contributing to LiveStore.
-- [Monorepo](/sustainable-open-source/contributing/monorepo): Notes on the monorepo setup of LiveStore.
-- [Docs](/sustainable-open-source/contributing/docs): Notes on contributing to the LiveStore docs
-
-## Miscellaneous
-
-- [Frequently asked questions](/misc/FAQ): Frequently asked questions about LiveStore
-- [State of the project](/misc/state-of-the-project): A high-level overview of the current state of the project.
-- [Performance](/misc/performance)
-- [Community](/misc/community)
-- [Troubleshooting](/misc/troubleshooting): Common issues in apps using LiveStore and possible solutions.
-- [Credits](/misc/credits): Credits and acknowledgements
-- [Resources](/misc/resources): Resources, assets, logos, etc about LiveStore
-- [Design partners](/misc/design-partners)
-- [Code of conduct](/misc/CODE_OF_CONDUCT): Our code of conduct for the LiveStore community.
-- [Note on package management](/misc/package-management)
-
-
-### npm packages
-
-- Main package: <NpmLink packageName="livestore" />
-- Framework integrations:
-  - React: <NpmLink packageName="react" />
-  - Solid: <NpmLink packageName="solid" />
-- Platform adapters:
-  - Web: <NpmLink packageName="adapter-web" />
-  - Expo: <NpmLink packageName="adapter-expo" />
-  - Node: <NpmLink packageName="adapter-node" />
-- Sync provider:
-  - Cloudflare: <NpmLink packageName="sync-cf" />
-  - Electric: <NpmLink packageName="sync-electric" />
-- Devtools:
-  - Vite: <NpmLink packageName="devtools-vite" />
-  - Expo: <NpmLink packageName="devtools-expo" />
-- SQLite packages:
-  - sqlite-wasm (wrapper around wa-sqlite): <NpmLink packageName="sqlite-wasm" />
-  - wa-sqlite fork: <NpmLink packageName="wa-sqlite" />
-- Internal packages:
-  - <NpmLink packageName="peer-deps" />
-  - <NpmLink packageName="utils" />
-  - <NpmLink packageName="common" />