longbridge

new-component

9,919
438
# Install this skill:
npx skills add longbridge/gpui-component --skill "new-component"

Install specific skill from multi-skill repository

# Description

Create new GPUI components. Use when building components, writing UI elements, or creating new component implementations.

# SKILL.md


name: new-component
description: Create new GPUI components. Use when building components, writing UI elements, or creating new component implementations.


Instructions

When creating new GPUI components:

  1. Follow existing patterns: Base implementation on components in crates/ui/src (examples: Button, Select)
  2. Style consistency: Follow existing component styles and Shadcn UI patterns
  3. Component type decision:
  4. Use stateless elements for simple components (like Button)
  5. Use stateful elements for complex components with data (like Select and SelectState)
  6. API consistency: Maintain the same API style as other elements
  7. Documentation: Create component documentation
  8. Stories: Write component stories in the story folder

Component Types

  • Stateless: Pure presentation components without internal state
  • Stateful: Components that manage their own state and data

# Supported AI Coding Agents

This skill is compatible with the SKILL.md standard and works with all major AI coding agents:

Learn more about the SKILL.md standard and how to use these skills with your preferred AI coding agent.