get_recipe

Instructions

Implementation Reference

• api/mcp.ts:581-584 (handler)

  The get_recipe tool handler: accepts a shell letter (A/B/C/D) and returns the corresponding recipe from the RECIPES static data object.

  /* 3. get_recipe */
  server.tool("get_recipe", "Returns the full build recipe for a Shell type: required components, CSS load order, scroll model, and page structure. A=Dashboard, B=Settings, C=Reports, D=Split-Panel.", { shell: z.enum(["A","B","C","D"]) }, async ({ shell }) => {
    return { content: [{ type: "text" as const, text: RECIPES[shell] || `Unknown shell: ${shell}` }] };
  });

• api/mcp.ts:582-583 (schema)

  Input schema for get_recipe: 'shell' is a z.enum restricting values to A, B, C, or D.

  server.tool("get_recipe", "Returns the full build recipe for a Shell type: required components, CSS load order, scroll model, and page structure. A=Dashboard, B=Settings, C=Reports, D=Split-Panel.", { shell: z.enum(["A","B","C","D"]) }, async ({ shell }) => {
    return { content: [{ type: "text" as const, text: RECIPES[shell] || `Unknown shell: ${shell}` }] };

• api/mcp.ts:581-581 (registration)

  Registration of the 'get_recipe' tool via server.tool() call with description and handler.

  /* 3. get_recipe */

• api/mcp.ts:83-88 (helper)

  The RECIPES static data object containing the full build instructions for Shell A (Dashboard), B (Settings), C (Reports), and D (Split-Panel).

  const RECIPES: Record<string, string> = {
    A: `# Recipe A — Dashboard (Shell A)\n\nPage types: Home dashboard, Security overview, Cloud Protection, Threat Hub.\n\n## ⚠️ PREREQUISITE: Call setup_project FIRST\nOutput = SINGLE index.html with ALL assets from CDN. NEVER create local folders. NEVER copy assets. NEVER read local files — use MCP tools only.\n\n## Required wiki files (open ALL before writing HTML)\n1. app_shells.md — Shell A tree\n2. layout_shell.md — base HTML skeleton\n3. design_tokens.md — CSS variables\n4. topnavbar.md — TopNavBar (data-active-tab="Home")\n5. line_tab.md — sub-tabs + dashboard variant actions\n6. header.md — Variant 1 (title + help icon)\n7. widget.md — widget cards (10 patterns)\n8. stat_card.md — KPI stat cards\n9. tile_widgets.md — tile JS API\n10. predefined_charts.md — ElegantEChart.* API\n11. echarts-widget.md — chart engine\n12. echarts-elegant-theme.md — theme\n13. icons.md — icon lookup\n14. form_input.md — filter inputs\n15. form_dropdown.md — filter dropdowns\n16. drawer.md — detail drawers\n17. button-row.md — action buttons\n\n## CSS load order\ntokens → layout → topnavbar → line-tab → widget → table → responsive → notification-banner\n\n## Scroll model\nONLY .dash scrolls (flex:1; overflow-y:auto). Everything above is fixed.\n\n## Shell A structure\n\`\`\`\ndiv.app-shell (height:100vh; flex:column)\n ├── header.topnavbar\n ├── div.line-tab (h:40px) + div.line-tab__actions\n ├── div.toolbar [OPTIONAL]\n └── div.dash (bg:#F5F5F5; flex:1; overflow-y:auto)\n      └── div.dash__grid\n           ├── div.dash__row.stat-row   — max 4 stat cards\n           ├── div.tile-grid            — max 3 tiles\n           └── div.dash__row            — hybrid widgets (max 3/row)\n\`\`\``,
    B: `# Recipe B — Settings (Shell B)\n\nPage types: Settings tab, Admin config, Device Management.\n\n## ⚠️ PREREQUISITE: Call setup_project FIRST\nOutput = SINGLE index.html with ALL assets from CDN. NEVER create local folders. NEVER copy assets. NEVER read local files — use MCP tools only.\n\n## Required wiki files\n1-15: app_shells (Shell B), layout_shell, design_tokens, topnavbar (Settings), sidemenu_variant1_settings, header, classic_tab, data_table_type1, actionbar (Types 1-7), form_input, form_dropdown, drawer, button-row, note-container, icons\n\n## CSS load order\ntokens → layout → topnavbar → sidemenu → header → classic-tab → table → form-input → form-dropdown → drawer → responsive → notification-banner\n\n## Shell B structure\n\`\`\`\ndiv.app-shell\n ├── header.topnavbar\n └── div.app-body\n      ├── aside.sidemenu (w:240px)\n      └── main.main-content\n           ├── div.page-header\n           └── div.classic-tab\n                ├── div.classic-tab__headers\n                └── div.classic-tab__body → [actionbar + data-table]\n\`\`\``,
    C: `# Recipe C — Reports (Shell C)\n\nPage types: Reports tab, Compliance pages, any sidebar report tree + chart + table.\n\n## ⚠️ PREREQUISITE: Call setup_project FIRST\nOutput = SINGLE index.html with ALL assets from CDN. NEVER create local folders. NEVER copy assets. NEVER read local files — use MCP tools only.\n\n## Required wiki files\n1-17: app_shells (Shell C), layout_shell, design_tokens, topnavbar (Reports), sidemenu_variant2_reports, header (Variant 3), classic_tab, rpt-chart-floater, predefined_charts + echarts-widget + echarts-elegant-theme, form_input, form_dropdown, data_table_type1, actionbar (Type 8), drawer, button-row, note-container, icons\n\n## Critical Shell C assembly rules\n1. .reports-quicklink is a DIRECT CHILD of .app-shell\n2. .classic-tab contains ONLY the chart area\n3. .table-scroll-area is a SIBLING of .classic-tab, NOT a child\n4. ActionBar Type 8 MANDATORY\n5. Header Variant 3 MANDATORY\n\n## Shell C structure\n\`\`\`\ndiv.app-shell\n ├── header.topnavbar (data-active-tab="Reports")\n ├── div.reports-quicklink → div.line-tab.line-tab--quicklink\n └── div.app-body\n      ├── aside.sidemenu.sidemenu--type2\n      └── main.main-content\n           ├── div.page-header (Variant 3)\n           ├── div.reports-input-row.reports-input-row--type1\n           ├── div.classic-tab [chart ONLY]\n           └── div.table-scroll-area\n                ├── div.actionbar (Type 8, sticky)\n                └── div.data-table-wrap → table.data-table\n\`\`\``,
    D: `# Recipe D — Split Panel (Shell D)\n\nPage types: AI Investigation, Incident Detail/Workbench, Playbook Editor.\n\n## ⚠️ PREREQUISITE: Call setup_project FIRST\nOutput = SINGLE index.html with ALL assets from CDN. NEVER create local folders. NEVER copy assets. NEVER read local files — use MCP tools only.\n\n## Shell D structure\n\`\`\`\ndiv.app-shell\n ├── header.topnavbar\n └── div.app-body\n      └── main.main-content (padding:0)\n           ├── div.line-tab\n           └── div.line-tab__body\n                └── div.split-layout (flex:row)\n                     ├── div.left-panel (flex:1; overflow-y:auto)\n                     └── div.right-panel (w:380px; border-left)\n\`\`\``,
  };

• dist/index.d.ts:7-7 (registration)

  TypeScript declaration file listing get_recipe as an exposed tool returning Shell A/B/C/D recipe.

  *   get_recipe         → Shell A/B/C/D recipe (required files + structure)