/seed-component

$COMPONENT_ID $COMPONENT_NAME $WITH_HEADLESS

BOOST

daangn@daangn

GitHub

From plugin

seed-design

1.2k6 skills4 agents6 commands3 MCP

Install

$ npx -y skills add daangn/seed-design --agent claude-code

How it fires

How this command gets triggered: by you, by Claude, or both.

Fires itselfClaude auto-loads it when your prompt matches the work.
You can call itInvoke it directly when you want it.
Slash command/seed-component

Context preview

What this command does when you run it.

$COMPONENT_ID $COMPONENT_NAME $WITH_HEADLESS

Command definition

seed-component.md

description: $COMPONENT_ID $COMPONENT_NAME $WITH_HEADLESS
allowed-tools: Read, Edit, Write, Glob, Grep, Bash

컴포넌트 생성 흐름

`seed-component` Skill의「새 컴포넌트 또는 한 플랫폼이 없는 포팅」분기(`references/implementation-workflow.md#신규포팅`)로 SEED 컴포넌트를 처음부터 끝까지 구현한다.

인자

$COMPONENT_ID: Rootage와 문서 경로에 쓸 kebab-case 컴포넌트 id
$COMPONENT_NAME: PascalCase 컴포넌트 이름
$WITH_HEADLESS: 선택. `true|false`, 기본값 `false`. `true`면 `packages/react-headless/<id>/`도 만든다.

필수 결과

1. Rootage 명세, Recipe, React 구현, 문서, 예제를 `references/implementation-steps.md`의 순서대로 갱신한다. 2. 원천을 바꾼 뒤 루트 `AGENTS.md`「생성」의 해당 명령을 실행한다. Rootage 변경이면 `bun rootage:generate && bun qvism:generate`다. 3. 루트 `AGENTS.md`「검증」의 경로별 테스트, `bun packages:build`, 시각 검증 결과를 보고한다.

Read it on GitHub ↗

Ships withseed-design

SEED는 당근 제품을 위한 통합된 디자인 언어입니다. 하나의 토큰 소스에서 React, iOS, Android, Lynx까지 여러 플랫폼에 일관된 디자인을 전달하고, Figma와 연동됩니다.

Get the whole plugin

Stats

TypeScript React Tailwind CSS Playwright

+5 tags

MCP Figma iOS Android Vite

1,166

Stars

Forks

Active