[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6FNTFXEPX40DSQJP49FNQ0Q":3,"skill-same:01M6FNTFXEPX40DSQJP49FNQ0Q":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":36,"linkOnly":37,"markdownContent":38,"markdownBody":39,"frontMatter":40,"refName":44,"commitSha":45,"skillDirectory":46,"forksCount":47,"repositoryHtmlUrl":48,"repositoryHomepageUrl":6,"ownerHtmlUrl":49,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":50,"install":51,"resources":63},"01M6FNTFXEPX40DSQJP49FNQ0Q","pp-prototype",null,"Use when UI DSL is ready and a clickable prototype is needed for stakeholder review before production implementation.","ohmyhotelco\u002Fhare-cc-plugins","ohmyhotelco","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F258133233?v=4","01M6CR4HP2N9F9ZWNX1KRHQ2W1","01M6CR4HSJC5J80RVQMD5K9QRN",2,"MIT","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fplanning-plugin\u002Fskills\u002Fpp-prototype\u002FSKILL.md",[],[18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35],"prototype","pp prototype","pp","true","for","clickable prototype","ui","Production","implementation","edit","write","read","name","review","Bash","use","feature","ready","2026-11-10 10:12:30",false,"---\nname: pp-prototype\ndescription: \"Use when UI DSL is ready and a clickable prototype is needed for stakeholder review before production implementation.\"\nargument-hint: \"[feature-name]\"\nuser-invocable: true\nallowed-tools: Read, Write, Edit, Glob, Bash, Agent\n---\n\n# Prototype Generation\n\nGenerate prototype for: **$ARGUMENTS**\n\n## Instructions\n\nFollow these steps in order.\n\n### Step 1: Read Configuration\n\n1. Read `.claude\u002Fplanning-plugin.json` from the current project directory\n2. If the file does not exist, stop with a guidance message:\n   > \"Planning Plugin is not configured for this project. Run `\u002Fplanning-plugin:pp-init` to set up.\"\n3. Extract `workingLanguage` (default: `\"en\"` if field is absent)\n4. Language name mapping: `en` = English, `ko` = Korean, `vi` = Vietnamese\n\n**Communication language**: All user-facing output in this skill (summaries, questions, feedback presentations, next-step guidance) must be in {workingLanguage_name}.\n\n### Step 2: Parse Arguments & Validate\n\n1. Parse `feature` from arguments (required, kebab-case)\n\n2. Read the progress file at `docs\u002Fspecs\u002F{feature}\u002F.progress\u002F{feature}.json`\n   - If it does not exist, stop with:\n     > \"No specification found for '{feature}'. Run `\u002Fplanning-plugin:pp-spec \"{feature}\"` first.\"\n   - Verify status is `reviewing` or `finalized`. If `drafting` or `analyzing`, stop with:\n     > \"The specification for '{feature}' is still in '{status}' status. Complete the spec review process first.\"\n\n3. Verify `docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002Fmanifest.json` exists. If not, stop with:\n   > \"UI DSL not found for '{feature}'. Run `\u002Fplanning-plugin:pp-design {feature} --stage=dsl` first.\"\n\n4. **Shared layout prerequisite check**: Read `docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002Fmanifest.json` and check if any screen or layout entry has `\"source\": \"_shared\"`:\n   - If found, verify `docs\u002Fspecs\u002F_shared\u002Fui-dsl\u002Fmanifest.json` exists. If not, stop with:\n     > \"Shared layout DSL not found. Run `\u002Fplanning-plugin:pp-design _shared` first.\"\n   - If found, also check if `docs\u002Fspecs\u002F_shared\u002Fstitch-wireframes\u002F` has wireframe outputs (optional — only a suggestion if missing):\n     > \"Shared layout wireframes not found. Consider running `\u002Fplanning-plugin:pp-design _shared` to generate them for better visual consistency.\"\n\n5. Check if Stitch wireframe outputs exist at `docs\u002Fspecs\u002F{feature}\u002Fstitch-wireframes\u002Fstitch-manifest.json`\n   - If not present → skip (no Stitch integration)\n   - If present → ask the user:\n     ```\n     Stitch wireframes detected for '{feature}'.\n     If you edited wireframes on the Stitch website,\n     run `\u002Fplanning-plugin:pp-sync-stitch {feature}` first.\n\n     Proceed without syncing? (y\u002Fn)\n     ```\n   - If user answers **no** → stop with message: \"Run `\u002Fplanning-plugin:pp-sync-stitch {feature}`, then re-run `\u002Fplanning-plugin:pp-prototype {feature}`.\"\n   - If user answers **yes** → continue (record Stitch wireframes as available for Step 4 prompt branching)\n\n### Step 3: Initialize Progress\n\nRead the progress file and initialize the `design.stages.prototype` field if not present:\n\n```json\n{\n  \"design\": {\n    \"stages\": {\n      \"prototype\": { \"status\": \"pending\" }\n    }\n  }\n}\n```\n\nIf `design.stages.prototype` already exists, preserve it (it will be overwritten in the next step).\n\n### Step 4: Launch Prototype Generator Agent\n\n1. Update progress: `design.stages.prototype.status = \"in_progress\"`\n2. Build the prototype prompt. If `design.stages.stitch.status` is `\"completed\"`, append Stitch reference instructions:\n\n```\nAgent(subagent_type: \"planning-plugin:prototype-generator\", prompt: \"Generate a React prototype for the feature '{feature}'. dslDir: docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002F. feature: {feature}. Read manifest.json and all screen-*.json files. Scaffold a Vite + React 19 + TypeScript + TailwindCSS + shadcn\u002Fui project at prototypes\u002F{feature}\u002F using React Router v7. Generate page components, mock data, and router setup with Lucide icons, then bundle into a single standalone HTML file using the bundle-artifact.sh script.{IF stitch completed: ' Also read Stitch wireframe outputs from docs\u002Fspecs\u002F{feature}\u002Fstitch-wireframes\u002F — use DESIGN.md YAML front-matter tokens for the Tailwind theme and its 8-section prose body for styling intent, shadcn-mapping.json for component hints, HTML files for visual layout reference.'}\")\n```\n\n### Step 5: Update Progress\n\n**On success**, update the progress file:\n```json\n{\n  \"design.stages.prototype\": {\n    \"status\": \"completed\",\n    \"path\": \"prototypes\u002F{feature}\u002F\",\n    \"artifact\": \"prototypes\u002F{feature}\u002Fbundle.html\",\n    \"bundleStatus\": \"current\",\n    \"generatedAt\": \"ISO-8601\"\n  }\n}\n```\n\nSet `design.status = \"completed\"` — prototype is the final stage of the design pipeline.\n\n**On failure**, update `design.stages.prototype.status = \"error\"`, report the error, and ask the user whether to retry or skip.\n\n### Step 6: Summary\n\nPresent a summary to the user:\n\n```\nPrototype Generation Results for '{feature}':\n\n  Prototype: completed — prototypes\u002F{feature}\u002Fbundle.html\n```\n\n**Next Steps:**\n```\nNext Steps:\n  - Open `prototypes\u002F{feature}\u002Fbundle.html` in a browser to preview the prototype\n  - Run `cd prototypes\u002F{feature} && npm run dev` for live development (Vite dev server)\n  - Edit prototype files directly to refine the UI\n  - Run `\u002Fplanning-plugin:pp-bundle {feature}` to rebuild bundle.html after edits\n  - Run `\u002Fplanning-plugin:pp-design {feature} --stage=dsl` to regenerate DSL from updated screens.md\n```\n\nIf `design-system\u002FMASTER.md` does not exist, prepend this to the Next Steps:\n```\n  - Run `\u002Fplanning-plugin:pp-design-system --domain={domain}` to generate a design system — this enhances DSL icon accuracy, pattern validation, and prototype theming\n```\n\n## Error Handling\n\n- If the agent fails, report the error and ask the user whether to retry\n- If a prerequisite check fails, stop with a clear message and suggested fix\n- Never leave the progress file in an inconsistent state — always update before stopping\n- If the user interrupts mid-flow, save current state to the progress file\n","# Prototype Generation\n\nGenerate prototype for: **$ARGUMENTS**\n\n## Instructions\n\nFollow these steps in order.\n\n### Step 1: Read Configuration\n\n1. Read `.claude\u002Fplanning-plugin.json` from the current project directory\n2. If the file does not exist, stop with a guidance message:\n   > \"Planning Plugin is not configured for this project. Run `\u002Fplanning-plugin:pp-init` to set up.\"\n3. Extract `workingLanguage` (default: `\"en\"` if field is absent)\n4. Language name mapping: `en` = English, `ko` = Korean, `vi` = Vietnamese\n\n**Communication language**: All user-facing output in this skill (summaries, questions, feedback presentations, next-step guidance) must be in {workingLanguage_name}.\n\n### Step 2: Parse Arguments & Validate\n\n1. Parse `feature` from arguments (required, kebab-case)\n\n2. Read the progress file at `docs\u002Fspecs\u002F{feature}\u002F.progress\u002F{feature}.json`\n   - If it does not exist, stop with:\n     > \"No specification found for '{feature}'. Run `\u002Fplanning-plugin:pp-spec \"{feature}\"` first.\"\n   - Verify status is `reviewing` or `finalized`. If `drafting` or `analyzing`, stop with:\n     > \"The specification for '{feature}' is still in '{status}' status. Complete the spec review process first.\"\n\n3. Verify `docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002Fmanifest.json` exists. If not, stop with:\n   > \"UI DSL not found for '{feature}'. Run `\u002Fplanning-plugin:pp-design {feature} --stage=dsl` first.\"\n\n4. **Shared layout prerequisite check**: Read `docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002Fmanifest.json` and check if any screen or layout entry has `\"source\": \"_shared\"`:\n   - If found, verify `docs\u002Fspecs\u002F_shared\u002Fui-dsl\u002Fmanifest.json` exists. If not, stop with:\n     > \"Shared layout DSL not found. Run `\u002Fplanning-plugin:pp-design _shared` first.\"\n   - If found, also check if `docs\u002Fspecs\u002F_shared\u002Fstitch-wireframes\u002F` has wireframe outputs (optional — only a suggestion if missing):\n     > \"Shared layout wireframes not found. Consider running `\u002Fplanning-plugin:pp-design _shared` to generate them for better visual consistency.\"\n\n5. Check if Stitch wireframe outputs exist at `docs\u002Fspecs\u002F{feature}\u002Fstitch-wireframes\u002Fstitch-manifest.json`\n   - If not present → skip (no Stitch integration)\n   - If present → ask the user:\n     ```\n     Stitch wireframes detected for '{feature}'.\n     If you edited wireframes on the Stitch website,\n     run `\u002Fplanning-plugin:pp-sync-stitch {feature}` first.\n\n     Proceed without syncing? (y\u002Fn)\n     ```\n   - If user answers **no** → stop with message: \"Run `\u002Fplanning-plugin:pp-sync-stitch {feature}`, then re-run `\u002Fplanning-plugin:pp-prototype {feature}`.\"\n   - If user answers **yes** → continue (record Stitch wireframes as available for Step 4 prompt branching)\n\n### Step 3: Initialize Progress\n\nRead the progress file and initialize the `design.stages.prototype` field if not present:\n\n```json\n{\n  \"design\": {\n    \"stages\": {\n      \"prototype\": { \"status\": \"pending\" }\n    }\n  }\n}\n```\n\nIf `design.stages.prototype` already exists, preserve it (it will be overwritten in the next step).\n\n### Step 4: Launch Prototype Generator Agent\n\n1. Update progress: `design.stages.prototype.status = \"in_progress\"`\n2. Build the prototype prompt. If `design.stages.stitch.status` is `\"completed\"`, append Stitch reference instructions:\n\n```\nAgent(subagent_type: \"planning-plugin:prototype-generator\", prompt: \"Generate a React prototype for the feature '{feature}'. dslDir: docs\u002Fspecs\u002F{feature}\u002Fui-dsl\u002F. feature: {feature}. Read manifest.json and all screen-*.json files. Scaffold a Vite + React 19 + TypeScript + TailwindCSS + shadcn\u002Fui project at prototypes\u002F{feature}\u002F using React Router v7. Generate page components, mock data, and router setup with Lucide icons, then bundle into a single standalone HTML file using the bundle-artifact.sh script.{IF stitch completed: ' Also read Stitch wireframe outputs from docs\u002Fspecs\u002F{feature}\u002Fstitch-wireframes\u002F — use DESIGN.md YAML front-matter tokens for the Tailwind theme and its 8-section prose body for styling intent, shadcn-mapping.json for component hints, HTML files for visual layout reference.'}\")\n```\n\n### Step 5: Update Progress\n\n**On success**, update the progress file:\n```json\n{\n  \"design.stages.prototype\": {\n    \"status\": \"completed\",\n    \"path\": \"prototypes\u002F{feature}\u002F\",\n    \"artifact\": \"prototypes\u002F{feature}\u002Fbundle.html\",\n    \"bundleStatus\": \"current\",\n    \"generatedAt\": \"ISO-8601\"\n  }\n}\n```\n\nSet `design.status = \"completed\"` — prototype is the final stage of the design pipeline.\n\n**On failure**, update `design.stages.prototype.status = \"error\"`, report the error, and ask the user whether to retry or skip.\n\n### Step 6: Summary\n\nPresent a summary to the user:\n\n```\nPrototype Generation Results for '{feature}':\n\n  Prototype: completed — prototypes\u002F{feature}\u002Fbundle.html\n```\n\n**Next Steps:**\n```\nNext Steps:\n  - Open `prototypes\u002F{feature}\u002Fbundle.html` in a browser to preview the prototype\n  - Run `cd prototypes\u002F{feature} && npm run dev` for live development (Vite dev server)\n  - Edit prototype files directly to refine the UI\n  - Run `\u002Fplanning-plugin:pp-bundle {feature}` to rebuild bundle.html after edits\n  - Run `\u002Fplanning-plugin:pp-design {feature} --stage=dsl` to regenerate DSL from updated screens.md\n```\n\nIf `design-system\u002FMASTER.md` does not exist, prepend this to the Next Steps:\n```\n  - Run `\u002Fplanning-plugin:pp-design-system --domain={domain}` to generate a design system — this enhances DSL icon accuracy, pattern validation, and prototype theming\n```\n\n## Error Handling\n\n- If the agent fails, report the error and ask the user whether to retry\n- If a prerequisite check fails, stop with a clear message and suggested fix\n- Never leave the progress file in an inconsistent state — always update before stopping\n- If the user interrupts mid-flow, save current state to the progress file\n",{"name":5,"description":7,"allowed-tools":41,"argument-hint":42,"user-invocable":43},"Read, Write, Edit, Glob, Bash, Agent","[feature-name]",true,"main","eaef2a5b6092b72972ff2f25ef79803753bc9bbf","planning-plugin\u002Fskills\u002Fpp-prototype",0,"https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins","https:\u002F\u002Fgithub.com\u002Fohmyhotelco","2026-11-11 08:26:27",{"source":8,"skillName":5,"commands":52,"prompt":62,"zipAvailable":43},[53,56,59],{"tool":54,"command":55},"npx","npx skills add ohmyhotelco\u002Fhare-cc-plugins --skill pp-prototype",{"tool":57,"command":58},"bunx","bunx skills add ohmyhotelco\u002Fhare-cc-plugins --skill pp-prototype",{"tool":60,"command":61},"pnpm","pnpm dlx skills add ohmyhotelco\u002Fhare-cc-plugins --skill pp-prototype","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fplanning-plugin\u002Fskills\u002Fpp-prototype\u002FSKILL.md",[],[65,89,115,139,153,173],{"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":36},"01M6M5QVXQNQMJBP1JZP9T440T","hp-shared","Shared conventions for every homepage-plugin agent and skill — stack, code conventions, state-file writes, check commands and how to report them. Preloaded into agents through their `skills:` frontmatter; not meant to be invoked by hand.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fhomepage-plugin\u002Fskills\u002Fhp-shared\u002FSKILL.md",[],[72,73,74,75,76,77,22,78,79,80,81,82,83,84,85,86,87,88],"shared","hp shared","state","stack","plugin","how","report","code conventions","commands","how to","conventions","false","frontmatter","file","code","hand","check",{"skillNo":90,"name":91,"nameZh":6,"description":92,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":93,"categories":94,"keywords":103,"publishedAt":36},"01M6M5PZTN1M0G4AHJV08VF1HV","fe-shared","Shared conventions for every frontend-react-plugin agent and skill — code conventions, state files and locks, accepted deviations, design principles, build working directory, router-mode command matrix, TypeScript check. Preloaded into agents through their `skills:` frontmatter; not meant to be invoked by hand.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Ffrontend-react-plugin\u002Fskills\u002Ffe-shared\u002FSKILL.md",[95,100],{"categoryNo":96,"categoryName":97,"taxonomyType":98,"taxonomyTypeDesc":99},"01JBSEEDCAT000000000000009","前端开发","SCENARIO","使用场景",{"categoryNo":101,"categoryName":102,"taxonomyType":98,"taxonomyTypeDesc":99},"01JBSEEDCAT000000000000015","视觉设计",[72,104,22,105,79,106,107,108,109,83,86,87,110,88,111,74,76,112,113,114],"fe shared","mode","frontend","design","design principles","files","react","router","principles","command","build",{"skillNo":116,"name":117,"nameZh":6,"description":118,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":119,"categories":120,"keywords":127,"publishedAt":36},"01M6M5GAW7ZZ3580DVCMH51SFQ","be-spring-shared","Shared conventions for every backend-springboot-plugin agent and skill — tech stack, CQRS architecture, naming, coding standards, TDD, commit and build rules, state files. Preloaded into agents through their `skills:` frontmatter; not meant to be invoked by hand.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fbackend-springboot-plugin\u002Fskills\u002Fbe-spring-shared\u002FSKILL.md",[121,124],{"categoryNo":122,"categoryName":123,"taxonomyType":98,"taxonomyTypeDesc":99},"01JBSEEDCAT000000000000010","后端与接口",{"categoryNo":125,"categoryName":126,"taxonomyType":98,"taxonomyTypeDesc":99},"01JBSEEDCAT000000000000023","Skill与智能体开发",[72,128,129,109,83,130,131,87,75,132,84,133,134,135,22,136,137,74,76,138],"spring","be spring shared","commit","architecture","coding standards","coding","standards","tech","Rules","cqrs","naming",{"skillNo":140,"name":141,"nameZh":6,"description":142,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":143,"categories":144,"keywords":145,"publishedAt":36},"01M6FNV58QMW8K71SA9FGTXMF4","pp-translate","Use after directly editing the working language spec to sync changes to other supported languages.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fplanning-plugin\u002Fskills\u002Fpp-translate\u002FSKILL.md",[],[20,146,147,34,30,148,29,149,28,27,150,33,85,151,21,152],"pp translate","translate","editing","spec","sync","language","changes",{"skillNo":154,"name":155,"nameZh":6,"description":156,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":157,"categories":158,"keywords":160,"publishedAt":36},"01M6FNV0PGRKR2MW0AEPS6XP0Q","pp-sync-stitch","Use when wireframes were manually edited on the Stitch website and need to be re-fetched to the local project.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fplanning-plugin\u002Fskills\u002Fpp-sync-stitch\u002FSKILL.md",[159],{"categoryNo":125,"categoryName":126,"taxonomyType":98,"taxonomyTypeDesc":99},[161,20,162,150,163,164,34,165,166,167,168,33,32,169,170,171,172,30,29,21],"pp sync stitch","stitch","projects","get","project","re","local","MCP","id","wireframes","website","screen",{"skillNo":174,"name":175,"nameZh":6,"description":176,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":177,"categories":178,"keywords":180,"publishedAt":36},"01M6FNTWW2KHS9XRAR72X33G0B","pp-sync-notion","Use when a specification needs to be published or re-synced to Notion after finalization or manual edits.","https:\u002F\u002Fgithub.com\u002Fohmyhotelco\u002Fhare-cc-plugins\u002Fblob\u002Fmain\u002Fplanning-plugin\u002Fskills\u002Fpp-sync-notion\u002FSKILL.md",[179],{"categoryNo":125,"categoryName":126,"taxonomyType":98,"taxonomyTypeDesc":99},[20,181,150,182,34,166,183,184,168,33,185,30,29,28,27,186,21],"notion","pp sync notion","search","manual","specification","grep"]