Name: interactive-component-creator
Availability: InStock
Author: qodex-ai

System Documentation

What problem does it solve?

This Skill streamlines the creation of interactive web components and artifacts, allowing for the rapid development and deployment of dynamic user interfaces.

Core Features & Use Cases

Project Initialization: Quickly set up a new React project with a robust stack including TypeScript, Vite, Tailwind CSS, and shadcn/ui.
Bundling: Consolidate all project code and dependencies into a single, shareable HTML file for easy integration.
Use Case: Develop a custom interactive dashboard component for a web application, bundle it, and share it as a self-contained artifact.

Quick Start

Run the command bash scripts/init-artifact.sh my-new-component to initialize a new project.

Dependency Matrix

Required Modules

parcel@parcel/config-defaultparcel-resolver-tspathshtml-inline@radix-ui/react-accordion@radix-ui/react-aspect-ratio@radix-ui/react-avatar@radix-ui/react-checkbox@radix-ui/react-collapsible@radix-ui/react-context-menu@radix-ui/react-dialog@radix-ui/react-dropdown-menu@radix-ui/react-hover-card@radix-ui/react-label@radix-ui/react-menubar@radix-ui/react-navigation-menu@radix-ui/react-popover@radix-ui/react-progress@radix-ui/react-radio-group@radix-ui/react-scroll-area@radix-ui/react-select@radix-ui/react-separator@radix-ui/react-slider@radix-ui/react-slot@radix-ui/react-switch@radix-ui/react-tabs@radix-ui/react-toast@radix-ui/react-toggle@radix-ui/react-toggle-group@radix-ui/react-tooltipsonnercmdkvaulembla-carousel-reactreact-day-pickerreact-resizable-panelsdate-fnsreact-hook-form@hookform/resolvers/zod

Components

scripts

Please help me install this Skill: Name: interactive-component-creator Download link: https://github.com/qodex-ai/ai-agent-skills/archive/main.zip#interactive-component-creator Please download this .zip file, extract it, and install it in the .claude/skills/ directory.

interactive-component-creator