A React composition library for building item-oriented interfaces on top of Worlds. WorldsKit keeps the interaction model demonstrated in Alexander Obenauer's Lab Note 001—implicit item binding, datasets, sortable datasets, add actions, and Source/Detail composition—while using Worlds as the RDF-native persistence and query layer.

WorldsKit is an independent reimplementation inspired by the ideas and interaction demonstrated in Lab Note 001: “Composing application interfaces”. It is not Alexander Obenauer's original framework and does not claim source-level equivalence. The original demonstration video is available on YouTube.

• WorldsKitApp: provides a WorldsKit data source, world ID, and implicit selection context.
• Dataset: queries an ordered RDF collection and renders each result through a supplied React template.
• DatasetSortable: adds drag-and-drop ordering and persists the resulting order as RDF mutations.
• Source and Detail: provide master-detail composition without manually threading selected IDs through the tree.
• TextField, Checkbox, and Title: item-bound primitives backed by SPARQL query/mutation operations.
• Todo and SimpleRow: small templates used by the reference demo.
• createWorldsKitDataSource: a minimal HTTP data-source adapter for Worlds query and update operations. Inject a richer WorldsKit data source when you need subscriptions or application-specific transport.

import { createWorldsKitDataSource, DatasetSortable, Detail, SimpleRow, Source, Title, Todo, WorldsKitApp } from "@wazoo/worlds-kit";

const dataSource = createWorldsKitDataSource("https://your-worlds-endpoint.example");

export default function App() {
  return (
    <WorldsKitApp worldId="my-world" dataSource={dataSource}>
      <Source>
        <DatasetSortable itemId="lists" template={<SimpleRow editable />} addButton={<button>Add a list</button>} />
      </Source>
      <Detail>
        <Title />
        <DatasetSortable template={<Todo />} addButton={<button>Add a todo...</button>} />
      </Detail>
    </WorldsKitApp>
  );
}

The adapter uses RDF identifiers and predicates under the https://wazoo.dev/worlds-kit/ namespace. The list/detail demo models list records as members of the lists dataset under root; todo records use the selected list item as their parent. The exact Worlds endpoint and authentication mechanism are intentionally injected through WorldsKitDataSource so the UI library does not own deployment or credentials.

cd demo
npm install
npm run dev

The demo expects a Worlds-compatible HTTP endpoint in VITE_WORLDS_ENDPOINT and an optional VITE_WORLDS_TOKEN. It is deliberately a small composition example, not a hosted production app.

WorldsKitDataSource has three operations:

export type WorldsKitDataSource = {
  query: <T = unknown>(sparql: string, options?: { signal?: AbortSignal }) => Promise<T>;
  mutate: <T = unknown>(update: string, options?: { signal?: AbortSignal }) => Promise<T>;
  subscribe?: <T = unknown>(sparql: string, onData: (data: T) => void, onError: (error: Error) => void) => () => void;
};

subscribe is optional. Without it, WorldsKit performs an initial query; with it, datasets and bound items can receive live result updates. This keeps the React library independent of a particular Worlds transport while making SPARQL the durable source of truth.

This first Worlds-backed implementation mirrors the demonstrated interaction model, not undisclosed internals. It does not yet provide authentication, authorization policy, schema validation, deletion UI, offline conflict resolution, mutation history, or a public package release workflow. Production applications must supply a properly scoped WorldsKit data source and enforce authorization in the Worlds service.

The later item graph, references, views, actions, services, mutations, modules, and fluid interaction roadmap remains intentionally separate from this compatibility foundation. See ROADMAP.md for the proposed next steps and the corresponding Lab Note references.

• Alexander Obenauer, LN 001: Composing application interfaces, January 10, 2021.
• Worlds documentation.
• Worlds TypeScript SDK documentation.
• SPARQL 1.1 Query Language.
• SPARQL 1.1 Update.