The Generative Collection Display renders a collection’s data using a dynamic JSON specification powered by json-render-svelte. It enables AI-generated, interactive layouts that leverage existing widgets from the svelty component registry.

Props

Prop	Type	Default	Description
schema	Schema	required	Collection schema with optional displaySpec field
entries	CollectionEntry[]	required	Collection entries to display
context	Record<string, unknown>	{}	Additional context passed to the renderer

Architecture

The component works in three layers:

1. Schema Layer: The collection Schema may include a displaySpec field — a JSON object conforming to the json-render-svelte Spec interface
2. Registry Layer: sveltyRegistry from @src/services/json-render/catalog maps component names (e.g., "EntryList") to actual Svelte components
3. Renderer Layer: JSONUIProvider and Renderer from json-render-svelte consume the spec + registry to produce the UI

Fallback Behavior

If schema.displaySpec is not defined, the component falls back to a default render spec that wraps entries in a basic EntryList component, ensuring the display always works even without AI-generated layouts.

Usage

<GenerativeCollectionDisplay {schema} {entries} />

Related

• Entry List Component
• AI Integration Guide