[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6ENG9SVXFFWRMDNBGX083N7":3,"skill-same:01M6ENG9SVXFFWRMDNBGX083N7":64},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":17,"publishedAt":37,"linkOnly":38,"markdownContent":39,"markdownBody":40,"frontMatter":41,"refName":44,"commitSha":45,"skillDirectory":46,"forksCount":47,"repositoryHtmlUrl":48,"repositoryHomepageUrl":6,"ownerHtmlUrl":49,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":50,"install":51,"resources":63},"01M6ENG9SVXFFWRMDNBGX083N7","extract",null,"Extract and consolidate reusable components, design tokens, and patterns into your design system. Identifies opportunities for systematic reuse and enriches your component library. Use when the user asks to create components, refactor repeated UI patterns, build a design system, or extract tokens.","launchpathventures\u002Fditto-os","launchpathventures","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F248658966?v=4","01M6ENF40K8DMPD2Q4YBJX3EWK","01M6ENF4541FAB13MQFNS8RMK8",1,"AGPL-3.0","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fextract\u002FSKILL.md",[],[5,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36],"user","systematic","tokens","consolidate","patterns","build","reusable","design tokens","use","design","system","refactor","ui","library","component library","create","design system","component","components","2026-11-10 10:12:30",false,"---\nname: extract\ndescription: Extract and consolidate reusable components, design tokens, and patterns into your design system. Identifies opportunities for systematic reuse and enriches your component library. Use when the user asks to create components, refactor repeated UI patterns, build a design system, or extract tokens.\nuser-invocable: true\nargument-hint: \"[target]\"\n---\n\nIdentify reusable patterns, components, and design tokens, then extract and consolidate them into the design system for systematic reuse.\n\n## Discover\n\nAnalyze the target area to identify extraction opportunities:\n\n1. **Find the design system**: Locate your design system, component library, or shared UI directory (grep for \"design system\", \"ui\", \"components\", etc.). Understand its structure:\n   - Component organization and naming conventions\n   - Design token structure (if any)\n   - Documentation patterns\n   - Import\u002Fexport conventions\n   \n   **CRITICAL**: If no design system exists, ask before creating one. Understand the preferred location and structure first.\n\n2. **Identify patterns**: Look for:\n   - **Repeated components**: Similar UI patterns used multiple times (buttons, cards, inputs, etc.)\n   - **Hard-coded values**: Colors, spacing, typography, shadows that should be tokens\n   - **Inconsistent variations**: Multiple implementations of the same concept (3 different button styles)\n   - **Reusable patterns**: Layout patterns, composition patterns, interaction patterns worth systematizing\n\n3. **Assess value**: Not everything should be extracted. Consider:\n   - Is this used 3+ times, or likely to be reused?\n   - Would systematizing this improve consistency?\n   - Is this a general pattern or context-specific?\n   - What's the maintenance cost vs benefit?\n\n## Plan Extraction\n\nCreate a systematic extraction plan:\n\n- **Components to extract**: Which UI elements become reusable components?\n- **Tokens to create**: Which hard-coded values become design tokens?\n- **Variants to support**: What variations does each component need?\n- **Naming conventions**: Component names, token names, prop names that match existing patterns\n- **Migration path**: How to refactor existing uses to consume the new shared versions\n\n**IMPORTANT**: Design systems grow incrementally. Extract what's clearly reusable now, not everything that might someday be reusable.\n\n## Extract & Enrich\n\nBuild improved, reusable versions:\n\n- **Components**: Create well-designed components with:\n  - Clear props API with sensible defaults\n  - Proper variants for different use cases\n  - Accessibility built in (ARIA, keyboard navigation, focus management)\n  - Documentation and usage examples\n  \n- **Design tokens**: Create tokens with:\n  - Clear naming (primitive vs semantic)\n  - Proper hierarchy and organization\n  - Documentation of when to use each token\n  \n- **Patterns**: Document patterns with:\n  - When to use this pattern\n  - Code examples\n  - Variations and combinations\n\n**NEVER**:\n- Extract one-off, context-specific implementations without generalization\n- Create components so generic they're useless\n- Extract without considering existing design system conventions\n- Skip proper TypeScript types or prop documentation\n- Create tokens for every single value (tokens should have semantic meaning)\n\n## Migrate\n\nReplace existing uses with the new shared versions:\n\n- **Find all instances**: Search for the patterns you've extracted\n- **Replace systematically**: Update each use to consume the shared version\n- **Test thoroughly**: Ensure visual and functional parity\n- **Delete dead code**: Remove the old implementations\n\n## Document\n\nUpdate design system documentation:\n\n- Add new components to the component library\n- Document token usage and values\n- Add examples and guidelines\n- Update any Storybook or component catalog\n\nRemember: A good design system is a living system. Extract patterns as they emerge, enrich them thoughtfully, and maintain them consistently.","Identify reusable patterns, components, and design tokens, then extract and consolidate them into the design system for systematic reuse.\n\n## Discover\n\nAnalyze the target area to identify extraction opportunities:\n\n1. **Find the design system**: Locate your design system, component library, or shared UI directory (grep for \"design system\", \"ui\", \"components\", etc.). Understand its structure:\n   - Component organization and naming conventions\n   - Design token structure (if any)\n   - Documentation patterns\n   - Import\u002Fexport conventions\n   \n   **CRITICAL**: If no design system exists, ask before creating one. Understand the preferred location and structure first.\n\n2. **Identify patterns**: Look for:\n   - **Repeated components**: Similar UI patterns used multiple times (buttons, cards, inputs, etc.)\n   - **Hard-coded values**: Colors, spacing, typography, shadows that should be tokens\n   - **Inconsistent variations**: Multiple implementations of the same concept (3 different button styles)\n   - **Reusable patterns**: Layout patterns, composition patterns, interaction patterns worth systematizing\n\n3. **Assess value**: Not everything should be extracted. Consider:\n   - Is this used 3+ times, or likely to be reused?\n   - Would systematizing this improve consistency?\n   - Is this a general pattern or context-specific?\n   - What's the maintenance cost vs benefit?\n\n## Plan Extraction\n\nCreate a systematic extraction plan:\n\n- **Components to extract**: Which UI elements become reusable components?\n- **Tokens to create**: Which hard-coded values become design tokens?\n- **Variants to support**: What variations does each component need?\n- **Naming conventions**: Component names, token names, prop names that match existing patterns\n- **Migration path**: How to refactor existing uses to consume the new shared versions\n\n**IMPORTANT**: Design systems grow incrementally. Extract what's clearly reusable now, not everything that might someday be reusable.\n\n## Extract & Enrich\n\nBuild improved, reusable versions:\n\n- **Components**: Create well-designed components with:\n  - Clear props API with sensible defaults\n  - Proper variants for different use cases\n  - Accessibility built in (ARIA, keyboard navigation, focus management)\n  - Documentation and usage examples\n  \n- **Design tokens**: Create tokens with:\n  - Clear naming (primitive vs semantic)\n  - Proper hierarchy and organization\n  - Documentation of when to use each token\n  \n- **Patterns**: Document patterns with:\n  - When to use this pattern\n  - Code examples\n  - Variations and combinations\n\n**NEVER**:\n- Extract one-off, context-specific implementations without generalization\n- Create components so generic they're useless\n- Extract without considering existing design system conventions\n- Skip proper TypeScript types or prop documentation\n- Create tokens for every single value (tokens should have semantic meaning)\n\n## Migrate\n\nReplace existing uses with the new shared versions:\n\n- **Find all instances**: Search for the patterns you've extracted\n- **Replace systematically**: Update each use to consume the shared version\n- **Test thoroughly**: Ensure visual and functional parity\n- **Delete dead code**: Remove the old implementations\n\n## Document\n\nUpdate design system documentation:\n\n- Add new components to the component library\n- Document token usage and values\n- Add examples and guidelines\n- Update any Storybook or component catalog\n\nRemember: A good design system is a living system. Extract patterns as they emerge, enrich them thoughtfully, and maintain them consistently.",{"name":5,"description":7,"argument-hint":42,"user-invocable":43},"[target]",true,"main","b033b1a8919dbb7c98e97cf24547a2416f65b53e",".agents\u002Fskills\u002Fextract",0,"https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os","https:\u002F\u002Fgithub.com\u002Flaunchpathventures","2026-06-08 19:31:48",{"source":8,"skillName":5,"commands":52,"prompt":62,"zipAvailable":43},[53,56,59],{"tool":54,"command":55},"npx","npx skills add launchpathventures\u002Fditto-os --skill extract",{"tool":57,"command":58},"bunx","bunx skills add launchpathventures\u002Fditto-os --skill extract",{"tool":60,"command":61},"pnpm","pnpm dlx skills add launchpathventures\u002Fditto-os --skill extract","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.agents\u002Fskills\u002Fextract\u002FSKILL.md",[],[65,86,106,127,132,137],{"skillNo":66,"name":67,"nameZh":6,"description":68,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":69,"categories":70,"keywords":71,"publishedAt":37},"01M6ENJ12VWSMRZ4MW8550AG69","drain-queue","Cross-brief autopilot — claim the oldest ready brief whose Brief NNN deps are satisfied via atomic push, run \u002Fautobuild on each, stop when the queue is empty, blocked, or hits a failure.","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fdrain-queue\u002FSKILL.md",[],[72,73,74,75,76,77,78,79,80,81,82,83,84,85],"drain queue","queue","push","autobuild","via","autopilot","empty","claim","max","stop","ready","deps","brief","run",{"skillNo":87,"name":88,"nameZh":6,"description":89,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":90,"categories":91,"keywords":92,"publishedAt":37},"01M6ENHXG16WJ4PN8CJHZYNT5T","dev-review","Post-coding exhaustive review — catches integration bugs, runtime crashes, performance issues, and convention drift across all changed files","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fdev-review\u002FSKILL.md",[],[93,94,95,96,97,98,99,100,101,102,103,104,105],"dev","review","dev review","performance","issues","post","runtime","across","drift","files","fix","coding","integration",{"skillNo":107,"name":75,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":109,"categories":110,"keywords":111,"publishedAt":37},"01M6ENHSZBZFSB69TSV2TWGRJ1","End-to-end autopilot for a single brief — pre-flight, \u002Fdev-builder, fresh-subagent reviewers, push, open PR, mark **PR:** line on feature branch. Stops at the human merge gate.","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.claude\u002Fskills\u002Fautobuild\u002FSKILL.md",[],[75,112,113,84,114,115,116,117,118,77,119,120,121,122,123,124,125,93,126,74],"subagent","merge","open","line","name","merge gate","fresh","end","branch","open pr","feature","human","gate","builder","pr",{"skillNo":128,"name":67,"nameZh":6,"description":68,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":129,"categories":130,"keywords":131,"publishedAt":37},"01M6ENHPWYMN66EYQBV56HP9CW","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.catalyst\u002Fskills\u002Fdrain-queue\u002FSKILL.md",[],[73,72,82,75,76,77,78,79,80,81,83,84,74,85],{"skillNo":133,"name":88,"nameZh":6,"description":89,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":134,"categories":135,"keywords":136,"publishedAt":37},"01M6ENHM3W1A0MY44ZD8D4NWVF","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.catalyst\u002Fskills\u002Fdev-review\u002FSKILL.md",[],[95,93,94,105,97,96,104,98,99,100,101,102,103],{"skillNo":138,"name":75,"nameZh":6,"description":108,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":139,"categories":140,"keywords":141,"publishedAt":37},"01M6ENHF62C7G6BC4YG44RWFB0","https:\u002F\u002Fgithub.com\u002Flaunchpathventures\u002Fditto-os\u002Fblob\u002Fmain\u002F.catalyst\u002Fskills\u002Fautobuild\u002FSKILL.md",[],[75,124,115,116,118,77,119,122,123,125,120,112,117,114,84,121,74,93,126,113]]