skills.rest
inpiniti
inpinitiCOMMUNITY
Explore all skills by this author →
GitHub

svelte

Convert json-render specs into Svelte component trees with catalogs and registries.

Updated Dec 30, 2025
Search Tags:#typescript#ui#catalog#json#svelte#registry#render
One-click install
npx skills add https://github.com/inpiniti/bitcoin-simulation --skill svelte-inpiniti
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: svelte
Source: https://github.com/inpiniti/bitcoin-simulation/tree/main/.agents/skills/svelte
Command: npx skills add https://github.com/inpiniti/bitcoin-simulation --skill svelte-inpiniti

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Converts JSON-based UI specifications into working Svelte component trees, enabling rapid UI composition from declarative specs.

Core Features & Use Cases

  • Converts json-render specs into a runnable Svelte UI tree that can be mounted in any app.
  • Supports catalogs and registries to map spec elements to Svelte components.
  • Useful for rendering AI-generated UI specs or building component libraries from JSON.

Quick Start

Create a Renderer for a given JSON spec and render it inside a Svelte app.

Frequently Asked Questions about svelte

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

FAQPage Schema
How do I render JSON specs as Svelte UI components?▼

You render JSON specs as Svelte UI components by using a Renderer to convert json-render specifications into a runnable Svelte component tree that mounts directly inside any modern web application.

What is a component catalog or registry for JSON UI rendering?▼

A component catalog or registry maps JSON spec elements to specific Svelte components, enabling the renderer to dynamically resolve and assemble declarative JSON specifications into working UI component trees.

Can I use TypeScript with Svelte JSON UI rendering?▼

Yes, TypeScript is fully supported. The Skill operates within modern web apps and provides a frontmatter-driven Skill interface alongside JsonUIProvider contexts for type-safe UI composition.

How do I render AI-generated UI specs in a Svelte application?▼

You render AI-generated UI specs by passing the declarative JSON output into the Renderer, which maps the specifications through component registries to mount a responsive Svelte UI tree.

How do I set up a Svelte component registry for JSON rendering?▼

You set up a Svelte component registry by defining mappings between JSON spec elements and your Svelte components, then providing this catalog to the Renderer via the JsonUIProvider context.

What is the best way to build a Svelte component library from JSON?▼

The best way to build a Svelte component library from JSON is using a registry to map spec elements to components, allowing rapid UI composition from declarative json-render specifications.

Related Skills

Explore More Software Engineering Skills→
xztxyxztxy

svelte

Convert JSON UI specs into runnable Svelte component trees.

Community
Intermediate
SensLiaoSensLiao

qa-component-behavior

Automate UI component testing for React, Vue, Svelte, and Angular with Testing Library and Storybook.

Community
Intermediate
nholder88nholder88
2

test-e2e-ui

Write Playwright BDD end-to-end UI tests with Gherkin and visual regression.

Community
Advanced
supersterlingsupersterling
1

json-render-react

Render JSON specifications as React component trees via a type-safe registry.

Community
Advanced