svelte

Convert JSON-Render specs into executable Svelte component trees.

Updated Apr 28, 2026
One-click install
npx skills add https://github.com/tututwo/heather-birthday-itenary --skill svelte-tututwo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: svelte
Source: https://github.com/tututwo/heather-birthday-itenary/tree/main/.agents/skills/svelte
Command: npx skills add https://github.com/tututwo/heather-birthday-itenary --skill svelte-tututwo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Converts json-render specs into executable Svelte component trees, enabling developers to render dynamic UIs from JSON-driven specifications with predictable structure and behavior.

Core Features & Use Cases

  • Renderer that converts specs into composable Svelte components at runtime.
  • JsonUIProvider context that exposes state, actions, and visibility for dynamic UI generation.
  • Catalog/Registry helpers to define and register reusable UI components and workflows.
  • Use Case: build dashboards or catalogs from AI-generated UI specs in a type-safe, frontend-agnostic way.

Quick Start

Install dependencies and integrate the provider and renderer in your Svelte app to render specs.

Frequently Asked Questions about svelte

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I render dynamic UIs from JSON specifications in a Svelte app?▼

To render dynamic UIs from JSON specifications in Svelte, you can use a renderer that converts JSON specs into executable component trees at runtime. This approach enables predictable structure and behavior for dynamic UI generation.

What is a JSON-driven UI rendering pipeline and when do I need it?▼

A JSON-driven UI rendering pipeline is a system that converts JSON specs into executable component trees at runtime. You need it when building dashboards or catalogs from AI-generated UI specs in a type-safe, frontend-agnostic way.

Does this Svelte renderer support type-safe component integration?▼

Yes, the Svelte renderer supports type-safe component integration by satisfying requirements for a stable UI pipeline. It uses TypeScript to ensure predictable structure and behavior when rendering dynamic UIs from JSON specifications.

How do I set up a catalog of reusable components for JSON rendering in Svelte?▼

To set up a catalog of reusable components for JSON rendering in Svelte, use the provided catalog and registry helpers. These allow you to define and register UI components and workflows for on-demand rendering within your application.

Can I expose state and actions dynamically when rendering Svelte components from JSON?▼

Yes, you can expose state and actions dynamically when rendering Svelte components from JSON. The JsonUIProvider context exposes state, actions, and visibility specifically for dynamic UI generation from specifications.