A full Oddkin application

An application root

createApp() runs your setup with a scope: everything registered there is disposed by stop(). Values provided as context reach the elements below the root.

import { createApp } from '@oddkin/app/app';
import { createContext } from '@oddkin/state/context';
import { createStore } from '@oddkin/state/store';

export const cartContext = createContext('cart');

const shop = createApp({
  name: 'shop',
  root: document.querySelector('#shop'),
  setup({ scope, provide }) {
    const cart = createStore({ items: [] });
    scope.add(() => cart.dispose());
    provide(cartContext, cart);
    return { cart };
  },
});

shop.start();

Routes, resources, and commands

• @oddkin/app/router: nested routes, each level owning a scope while it matches; links stay native <a href>.
• @oddkin/app/resource: a request follows its source, aborts when superseded or disconnected, and never renders a stale response.
• @oddkin/app/command: changes that run when asked, with explicit cancellation and retry.
• @oddkin/app/lifecycle: page suspension and restoration from the back/forward cache.

Components never need these packages: add them when your application does.