add-component

signerlabs/shipswift-skills · updated Apr 8, 2026

$npx skills add https://github.com/signerlabs/shipswift-skills --skill add-component
0 commentsdiscussion
summary

Add production-ready SwiftUI components to your project using ShipSwift's recipe library. Each recipe is a complete, copy-paste-ready implementation with architecture documentation.

skill.md

Add Component from ShipSwift

Add production-ready SwiftUI components to your project using ShipSwift's recipe library. Each recipe is a complete, copy-paste-ready implementation with architecture documentation.

Prerequisites Check

Before starting, verify the ShipSwift recipe server is available by calling listRecipes.

If the tools are not available, guide the user to visit shipswift.app for setup instructions, or run npx skills add signerlabs/shipswift-skills to install.

Workflow

  1. Identify the component type: Determine what kind of component the user needs:

    • Animation: shimmer, typewriter, glow-scan, shaking-icon, mesh-gradient, orbit, scan, viewfinder, before-after
    • Chart: line, bar, area, donut, ring, radar, scatter, heatmap
    • UI Component: label, alert, loading, stepper, onboarding, tab-button, and more
    • Module: auth, camera, chat, settings, subscriptions, infrastructure
  2. Search for the recipe: Use searchRecipes with the component name or type. For example:

    • User says "add a donut chart" -> search "donut"
    • User says "add shimmer loading" -> search "shimmer"
    • User says "add authentication" -> search "auth"
  3. Fetch the full recipe: Use getRecipe with the recipe ID to get the complete implementation, including:

    • Full Swift source code
    • Architecture explanation
    • Integration steps
    • Known gotchas
  4. Integrate into the project: Adapt the recipe code to fit the user's project:

    • Match existing naming conventions
    • Connect to the user's data models
    • Adjust styling to match the app's design system
  5. Verify integration: Walk through the recipe's integration checklist to ensure nothing is missed (dependencies, Info.plist entries, etc.).

Guidelines

  • Use SW-prefixed type names for ShipSwift components (e.g., SWDonutChart, SWTypewriter).
  • View modifier methods use .sw lowercase prefix (e.g., .swShimmer(), .swGlowScan()).
  • Charts components use a generic CategoryType pattern with String convenience initializer.
  • For chart animations, use the .mask() approach with animated Rectangle width via GeometryReader -- Swift Charts does not support built-in line draw animation.
  • Internal helper types should be private and use the SW prefix.
  • Add cornerRadius parameter when components clip content.
  • Support both struct initializer and View modifier API for overlay-type components.

Pro Recipes

Some recipes require a Pro license ($89 one-time). If a recipe returns a purchase prompt, the user can buy at shipswift.app/pricing and set SHIPSWIFT_API_KEY in their environment.

Discussion

Product Hunt–style comments (not star reviews)
  • No comments yet — start the thread.
general reviews

Ratings

4.675 reviews
  • Ganesh Mohane· Dec 28, 2024

    I recommend add-component for anyone iterating fast on agent tooling; clear intent and a small, reviewable surface area.

  • William Diallo· Dec 20, 2024

    We added add-component from the explainx registry; install was straightforward and the SKILL.md answered most questions upfront.

  • Tariq Desai· Dec 16, 2024

    add-component reduced setup friction for our internal harness; good balance of opinion and flexibility.

  • Arjun Yang· Dec 12, 2024

    Solid pick for teams standardizing on skills: add-component is focused, and the summary matches what you get after install.

  • Benjamin Malhotra· Dec 12, 2024

    add-component is among the better-maintained entries we tried; worth keeping pinned for repeat workflows.

  • Zara Perez· Dec 8, 2024

    Registry listing for add-component matched our evaluation — installs cleanly and behaves as described in the markdown.

  • Zara Ramirez· Dec 4, 2024

    add-component fits our agent workflows well — practical, well scoped, and easy to wire into existing repos.

  • Yash Thakker· Nov 27, 2024

    Useful defaults in add-component — fewer surprises than typical one-off scripts, and it plays nicely with `npx skills` flows.

  • Tariq Chawla· Nov 23, 2024

    We added add-component from the explainx registry; install was straightforward and the SKILL.md answered most questions upfront.

  • Sakshi Patil· Nov 19, 2024

    Solid pick for teams standardizing on skills: add-component is focused, and the summary matches what you get after install.

showing 1-10 of 75

1 / 8