Implement a widget

A typed reference

A reference identifies presentation and Page. It contains no script, access token, arbitrary URL or implicit permission grant. The current validator rejects extra fields, unknown types and unsupported versions.

const reference = {
  type: 'chatV1',
  version: 1,
  pageId: 'general'
};

Register trusted code

This example replaces the chatV1 registration in a fresh development registry; do not register a second implementation under the same type. Use textContent for document-supplied text. Always return a cleanup function.

registry.register('chatV1', (root, context) => {
  const title = document.createElement('h2');
  root.append(title);
  const stop = context.page.subscribe((page, error) => {
    title.textContent = page?.descriptor.title
      ?? (error ? 'Page unavailable' : 'Loading…');
  });
  return () => stop();
});

Open a child explicitly

A self-reference is allowed. Fold its presentation until the user opens it. The host enforces depth and instance budgets instead of rejecting all recursive references.

Global navigation and shell actions are explicit host-supplied functions. An embedded navigation widget does not receive authority to navigate its outer shell automatically.

const release = context.embed(childRoot, {
  type: 'chatV1', version: 1, pageId: 'general'
});
// When the child closes:
release();

Keep state at the correct level

• Occurrence: scroll, draft, expanded references, input admission.
• Page session: snapshot, pending read, observer, access-denial state.
• Provider: authoritative reads, idempotent commands, persistence and authorization.
• Host: visibility, parent activity, recursion admission and disposal.