feat(docs): add expandable summaries to collections table

docs/docusaurus/src/components/CollectionsTable/collectionData.json

@@ -0,0 +1,58 @@
+[
+  {
+    "name": "ado",
+    "summary": "Manage Azure DevOps work items, monitor builds, create pull requests, and convert requirements documents into structured work item hierarchies — all from within VS Code."
+  },
+  {
+    "name": "coding-standards",
+    "summary": "Enforce language-specific coding conventions and best practices across your projects, with pre-PR code review agents for catching functional defects early. This collection provides instructions for bash, Bicep, C#, PowerShell, Python, Rust, and Terraform that are automatically applied based on file patterns, plus agents that review branch diffs before opening pull requests."
+  },
+  {
+    "name": "data-science",
+    "summary": "Generate data specifications, Jupyter notebooks, and Streamlit dashboards from natural language descriptions. Evaluate AI-powered data systems against Responsible AI standards. This collection includes specialized agents for data science workflows in Python and RAI assessment."
+  },
+  {
+    "name": "design-thinking",
+    "summary": "Coaching identity, quality constraints, and methodology instructions for AI-enhanced design thinking across nine methods. The collection supports the HVE Design Thinking pyramid structure spanning Problem, Solution, and Implementation spaces."
+  },
+  {
+    "name": "experimental",
+    "summary": "Experimental and preview artifacts not yet promoted to stable collections. Items in this collection may change or be removed without notice."
+  },
+  {
+    "name": "github",
+    "summary": "Manage GitHub issue backlogs with agents for discovery, triage, sprint planning, and execution. This collection brings structured backlog management workflows directly into VS Code."
+  },
+  {
+    "name": "gitlab",
+    "summary": "Use GitLab merge request and pipeline workflows from VS Code through a focused Python skill for inspecting merge requests, posting notes, triggering pipelines, and reading job logs."
+  },
+  {
+    "name": "hve-core-all",
+    "summary": "HVE Core provides the complete collection of AI chat agents, prompts, instructions, and skills for VS Code with GitHub Copilot. This edition includes every artifact across all domains: development workflows, architecture, Azure DevOps, GitHub and Jira backlog workflows, data science, design thinking, security, and more."
+  },
+  {
+    "name": "hve-core",
+    "summary": "HVE Core provides the flagship RPI (Research, Plan, Implement, Review) workflow for completing complex tasks through a structured four-phase process. The RPI workflow dispatches specialized agents that collaborate autonomously to deliver well-researched, planned, and validated implementations. This collection also includes Git workflow prompts for commit messages, merge operations, repository setup, and pull request management."
+  },
+  {
+    "name": "installer",
+    "summary": "Deploy HVE Core artifacts across workspace configurations with the hve-core-installer skill. This collection provides decision-driven setup for selecting and installing collections, agents, prompts, and instructions via the VS Code extension or clone-based methods."
+  },
+  {
+    "name": "jira",
+    "summary": "Manage Jira backlog workflows and PRD-driven issue planning from VS Code. This collection adds dedicated Jira agents, prompts, and instructions on top of the Jira skill so discovery, triage, execution, and planning workflows use the same tracking and handoff patterns as the rest of HVE Core."
+  },
+  {
+    "name": "project-planning",
+    "summary": "Create architecture decision records, requirements documents, and diagrams — all through guided AI workflows. Evaluate AI-powered systems against Responsible AI standards and conduct STRIDE-based security model analysis with automated backlog generation."
+  },
+  {
+    "name": "rai-planning",
+    "summary": "Assess AI systems for responsible AI risks using structured standards-aligned analysis, sensitive uses screening, and impact assessment."
+  },
+  {
+    "name": "security",
+    "summary": "Security review, planning, incident response, risk assessment, vulnerability analysis, supply chain security, and responsible AI assessment for cloud and hybrid environments."
+  }
+]

docs/docusaurus/src/components/CollectionsTable/index.tsx

@@ -0,0 +1,58 @@
+import React from 'react';
+import { collectionCards } from '../../data/collectionCards';
+import collectionData from './collectionData.json';
+import styles from './styles.module.css';
+
+export default function CollectionsTable(): React.ReactElement {
+  // Merge the collectionCards data with the deep summary from collectionData.json
+  const tableData = collectionCards.map(card => {
+    const extendedInfo = collectionData.find(c => c.name === card.name);
+    return {
+      ...card,
+      extendedDescription: extendedInfo?.summary || ''
+    };
+  });
+
+  return (
+    <div className={styles.tableWrapper}>
+      <table className={styles.collectionsTable}>
+        <thead>
+          <tr>
+            <th>Collection</th>
+            <th>Description</th>
+            <th>Artifacts</th>
+            <th>Maturity</th>
+          </tr>
+        </thead>
+        <tbody>
+          {tableData.map(row => (
+            <React.Fragment key={row.name}>
+              <tr className={styles.mainRow}>
+                <td><strong>{row.name}</strong></td>
+                <td>{row.description}</td>
+                <td className={styles.centerAlign}>{row.artifacts}</td>
+                <td>
+                  <span className={`${styles.badge} ${styles['badge' + row.maturity]}`}>
+                    {row.maturity}
+                  </span>
+                </td>
+              </tr>
+              {row.extendedDescription && (
+                <tr className={styles.detailsRow}>
+                  <td colSpan={4}>
+                    <details className={styles.details}>
+                      <summary>View details</summary>
+                      <div className={styles.detailsContent}>
+                        <p>{row.extendedDescription}</p>
+                      </div>
+                    </details>
+                  </td>
+                </tr>
+              )}
+            </React.Fragment>
+          ))}
+        </tbody>
+      </table>
+    </div>
+  );
+}

docs/docusaurus/src/components/CollectionsTable/styles.module.css

@@ -0,0 +1,93 @@
+.tableWrapper {
+  overflow-x: auto;
+  margin-bottom: 2rem;
+}
+
+.collectionsTable {
+  width: 100%;
+  border-collapse: collapse;
+  text-align: left;
+}
+
+.collectionsTable th,
+.collectionsTable td {
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid var(--ifm-color-emphasis-200);
+}
+
+.collectionsTable th {
+  background-color: var(--ifm-color-emphasis-100);
+  font-weight: bold;
+}
+
+.centerAlign {
+  text-align: center;
+}
+
+.badge {
+  display: inline-block;
+  font-size: 11px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  padding: 2px 8px;
+  border-radius: 2px;
+  line-height: 16px;
+}
+
+.badgeStable {
+  background: var(--ifm-color-success-contrast-background);
+  color: var(--ifm-color-success-dark);
+}
+
+.badgePreview {
+  background: var(--ifm-color-warning-contrast-background);
+  color: var(--ifm-color-warning-dark);
+}
+
+.badgeExperimental {
+  background: var(--ifm-color-info-contrast-background);
+  color: var(--ifm-color-info-dark);
+}
+
+.mainRow {
+  background-color: var(--ifm-background-color);
+}
+
+/* Make sure the bottom border of main row is gone when extended */
+.mainRow + .detailsRow td {
+  border-top: none;
+  padding-top: 0;
+  padding-bottom: 1rem;
+}
+
+.details {
+  margin: 0;
+  padding: 0;
+}
+
+.details summary {
+  cursor: pointer;
+  font-size: 0.85rem;
+  color: var(--ifm-link-color);
+  user-select: none;
+  font-weight: 500;
+}
+
+.details summary:hover {
+  text-decoration: underline;
+}
+
+.detailsContent {
+  margin-top: 0.5rem;
+  padding: 0.75rem;
+  background-color: var(--ifm-color-emphasis-100);
+  border-radius: 4px;
+  font-size: 0.9rem;
+  line-height: 1.5;
+  color: var(--ifm-font-color-base);
+}
+
+.detailsContent p {
+  margin: 0;
+}

docs/getting-started/collections.md

@@ -7,6 +7,8 @@ ms.date: 2026-03-22
 ms.topic: overview
 ---
 
+import CollectionsTable from '@site/src/components/CollectionsTable';
+
 ## How HVE Artifacts Are Organized
 
 HVE distributes agents, prompts, instructions, and skills through collections, which are curated bundles of related artifacts. Each collection targets a specific domain or workflow, so you can install exactly what you need.
@@ -31,22 +33,7 @@ The installer enables targeted deployment of specific collections into workspace
 
 ## Available Collections
 
-| Collection       | Description                                                                                                                                    | Artifacts | Maturity     |
-|------------------|------------------------------------------------------------------------------------------------------------------------------------------------|-----------|--------------|
-| ado              | Manage Azure DevOps work items, monitor builds, create pull requests, and convert requirements documents into structured work item hierarchies | 21        | Stable       |
-| coding-standards | Enforce language-specific coding conventions and best practices across your projects, with pre-PR code review agents                           | 14        | Stable       |
-| data-science     | Generate data specifications, Jupyter notebooks, and Streamlit dashboards from natural language descriptions                                   | 19        | Stable       |
-| design-thinking  | AI-enhanced design thinking coaching across nine methods                                                                                       | 58        | Preview      |
-| experimental     | Experimental and preview artifacts not yet promoted to stable collections                                                                      | 8         | Experimental |
-| github           | Manage GitHub issue backlogs with agents for discovery, triage, sprint planning, and execution                                                 | 13        | Stable       |
-| gitlab           | Run GitLab merge request and pipeline workflows through a focused skill package                                                                | 2         | Stable       |
-| hve-core         | Flagship collection: RPI (Research, Plan, Implement, Review) workflow for complex tasks with Git workflow prompts                              | 40        | Stable       |
-| hve-core-all     | Complete collection of all artifacts across all domains                                                                                        | 221       | Stable       |
-| installer        | Deploy HVE artifacts across workspace configurations with decision-driven setup                                                                | 2         | Stable       |
-| jira             | Manage Jira backlogs, plan PRD-driven issue hierarchies, and execute issue operations                                                          | 13        | Stable       |
-| project-planning | Create architecture decision records, requirements documents, and diagrams through guided AI workflows                                         | 49        | Stable       |
-| rai-planning     | Assess AI systems against Responsible AI standards and capture standards-aligned backlog work                                                  | 13        | Experimental |
-| security         | Security review, planning, incident response, risk assessment, and vulnerability analysis                                                      | 47        | Experimental |
+<CollectionsTable />
 
 ## How Collections Fit Together
 

scripts/extract-collection-summaries.js

@@ -0,0 +1,34 @@
+const fs = require('fs');
+const path = require('path');
+
+const collectionsDir = path.join(__dirname, '../collections');
+const outputFile = path.join(__dirname, '../docs/docusaurus/src/components/CollectionsTable/collectionData.json');
+
+const files = fs.readdirSync(collectionsDir).filter(f => f.endsWith('.collection.md'));
+
+const result = [];
+
+files.forEach(file => {
+  const content = fs.readFileSync(path.join(collectionsDir, file), 'utf8');
+  const lines = content.split('\n');
+
+  // Find first non-empty line that isn't a frontmatter dash, comment, heading, or blockquote
+  let summary = '';
+  for (let line of lines) {
+    line = line.trim();
+    if (line && !line.startsWith('---') && !line.startsWith('>') && !line.startsWith('#') && !line.startsWith('<!--')) {
+      summary = line;
+      break;
+    }
+  }
+
+  const name = file.replace('.collection.md', '');
+
+  result.push({
+    name,
+    summary,
+  });
+});
+
+fs.writeFileSync(outputFile, JSON.stringify(result, null, 2));
+console.log(`Extracted summaries to ${outputFile}`);