chore: add generated AI component index for /next (#5079)

* chore: add generated AI component index for /next

Generates documentation/AI-COMPONENT-INDEX.md listing every /next
component with props, sub-components, and asChild support. Gives AI
coding assistants a stable ground-truth reference instead of
re-walking the source tree each session.

Wired into `prebuild` so `pnpm run build` keeps it fresh; ad-hoc
regeneration via `pnpm run generate:component-index`.

Closes #4890

* Fix incomplete string escaping or encoding

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

* chore: verify component index freshness in CI

* chore: reference component index from scaffolding entry points

---------

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

Author: pomfrida

.claude/commands/new-component.md

@@ -15,7 +15,7 @@ This command focuses on the per-component scaffolding flow. The patterns and cod
    - `figma_get_screenshot` — visual reference
    - `figma_get_variable_defs` — tokens **per state** (Default, Hover, Focus, Disabled, and any other state in the design). Use the EXACT variable names returned.
 
-2. **Check for existing components to reuse** in `packages/eds-core-react/src/components/next/index.ts`. Prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography` over reinventing.
+2. **Check the component index first** — [`documentation/AI-COMPONENT-INDEX.md`](../../documentation/AI-COMPONENT-INDEX.md) lists every existing `/next` component with its props and sub-components (generated, CI-verified). Confirm `$ARGUMENTS` doesn't already exist, and prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography` over reinventing. The underlying source of truth is `packages/eds-core-react/src/components/next/index.ts`.
 
 3. **If an old component exists** at `packages/eds-core-react/src/components/$ARGUMENTS/`, read it for behavioural awareness (keyboard nav, focus management) only — do not copy implementation. Use modern patterns: `:focus-visible`, CSS tokens, simple state.
 

.claude/rules/eds-component.md

@@ -11,6 +11,7 @@ paths:
 
 This file is intentionally short. It only highlights what's easy to forget when working in `/next`:
 
+- **Check [`documentation/AI-COMPONENT-INDEX.md`](../../documentation/AI-COMPONENT-INDEX.md) before creating a component** — a generated, CI-verified list of every `/next` component with props and sub-components; it may already exist
 - **No default exports** (except `.stories.tsx`)
 - **WCAG 2.1 AA** is non-negotiable — `jest-axe` test in every component
 - **Use `--eds-*` design tokens** — never hardcode hex values

.github/prompts/new-component.prompt.md

@@ -18,7 +18,7 @@ This prompt focuses on the per-component scaffolding flow. The patterns and code
    - `figma_get_screenshot` — visual reference
    - `figma_get_variable_defs` — tokens **per state** (Default, Hover, Focus, Disabled, and any other state in the design). Use the EXACT variable names returned.
 
-2. **Check for existing components to reuse** in `packages/eds-core-react/src/components/next/index.ts`. Prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography` over reinventing.
+2. **Check the component index first** — [`documentation/AI-COMPONENT-INDEX.md`](../../documentation/AI-COMPONENT-INDEX.md) lists every existing `/next` component with its props and sub-components (generated, CI-verified). Confirm `${input:componentName}` doesn't already exist, and prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography` over reinventing. The underlying source of truth is `packages/eds-core-react/src/components/next/index.ts`.
 
 3. **If an old component exists** at `packages/eds-core-react/src/components/${input:componentName}/`, read it for behavioural awareness (keyboard nav, focus management) only — do not copy implementation. Use modern patterns: `:focus-visible`, CSS tokens, simple state.
 

.github/workflows/checks.yaml

@@ -22,7 +22,7 @@ jobs:
     secrets: inherit
     with:
       cacheKey: ${{ github.sha }}
-      checkout_paths: packages apps scripts .github
+      checkout_paths: packages apps scripts .github documentation
   packages:
     name: Process packages
     runs-on: ubuntu-latest
@@ -48,6 +48,11 @@ jobs:
       - name: Fallback install (cache miss)
         if: steps.setup-cache.outputs.cache-hit != 'true'
         run: pnpm install
+      # Must run BEFORE the build: `prebuild` regenerates the index in the
+      # workspace, which would mask a stale committed file.
+      - name: Check AI component index freshness
+        id: check-component-index
+        run: pnpm run generate:component-index --check
       - name: Build packages
         id: build-packages
         run: pnpm run build

.opencode/agent/eds-component.md

@@ -15,7 +15,7 @@ When invoked to create a new component, follow this flow:
 
 1. **Ask for a Figma URL.** If provided, run `figma_get_design_context`, `figma_get_screenshot`, and `figma_get_variable_defs` **per state** (Default, Hover, Focus, Disabled, etc.). Use the EXACT variable names returned.
 
-2. **Check for existing components to reuse** in `packages/eds-core-react/src/components/next/index.ts` — prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography`.
+2. **Check the component index first** — [`documentation/AI-COMPONENT-INDEX.md`](../../documentation/AI-COMPONENT-INDEX.md) lists every existing `/next` component with its props and sub-components (generated, CI-verified). Confirm the component doesn't already exist, and prefer composing `Field`, `Icon`, `Input`, `Button`, `Typography`. The underlying source of truth is `packages/eds-core-react/src/components/next/index.ts`.
 
 3. **If an old component exists** at `packages/eds-core-react/src/components/<name>/`, read it for behavioural awareness only — do not copy implementation. Use modern patterns (`:focus-visible`, CSS tokens, simple state).
 

AGENTS.md

@@ -13,6 +13,10 @@ Equinor Design System (EDS) is a pnpm monorepo containing React component librar
 - `@equinor/eds-tokens` — Design tokens, CSS variables, and theming
 - `@equinor/eds-icons` — Icon library
 
+### Existing /next components
+
+Before scaffolding a new component, check [`documentation/AI-COMPONENT-INDEX.md`](./documentation/AI-COMPONENT-INDEX.md) — a generated list of every `/next` component with its props and sub-components. It is regenerated on `pnpm run build` (or run `pnpm run generate:component-index` ad-hoc). Don't edit it by hand.
+
 ## Secrets & Credentials
 
 Never read, search, copy, or print the contents of secret files. The rule applies to **every** harness (Claude Code, Copilot, OpenCode) regardless of whether the harness enforces it.

documentation/AI-COMPONENT-INDEX.md

@@ -0,0 +1,55 @@
+<!-- AUTOGENERATED by scripts/generate-component-index.js — do not edit by hand. -->
+<!-- Re-run: pnpm run generate:component-index -->
+
+# EDS 2.0 Component Index (`/next`)
+
+This file is the canonical "what already exists" reference for AI coding assistants working in this repo. It is regenerated from the source on every `pnpm run build`.
+
+**If you are an AI assistant about to scaffold a new component: check this file first.** The component you are about to build may already exist.
+
+- Source path: `packages/eds-core-react/src/components/next/<Component>/`
+- Top-level barrel: `packages/eds-core-react/src/components/next/index.ts`
+- Components: 23 • Props documented: 96 • With JSDoc description: 1
+
+## Components
+
+| Component | Description | Props | Sub-components | asChild | Status |
+| --- | --- | --- | --- | --- | --- |
+| Accordion | — | exclusive | Accordion.Item, Accordion.Header, Accordion.Panel | — | active |
+| Autocomplete | — | allowCustomValue, clearLabel, defaultInputValue, description, helperMessage, id, inputValue, label, loading, loadingText, noOptionsText, onClear, onCustomValueConfirm, onInputChange, onValueChange, optionsFilter, value | — | — | active |
+| Badge | — | emphasis, tone, variant | — | — | active |
+| Banner | — | onDismiss, role, tone | Banner.Icon, Banner.Message, Banner.Actions | — | active |
+| Button | — | asChild, icon, multiline, round, size, tone, variant | — | ✓ | active |
+| Checkbox | — | disabled, helperMessage, indeterminate, indicator, label | — | — | active |
+| Chip | — | dropdown, onDelete, selected, tone, variant | — | — | active |
+| Dialog | — | onOpenChange, open, scrim | Dialog.Header, Dialog.Title, Dialog.Content, Dialog.Actions | — | active |
+| Divider | — | — | — | — | active |
+| Field | — | disabled, position | Field.Label, Field.Description, Field.HelperMessage | — | active |
+| Icon | Icon component for EDS 2.0 | color, data, size, title | — | — | active |
+| Input | — | as, containerClassName, endAdornment, endText, hideErrorIcon, invalid, startAdornment, startText | — | — | active |
+| Link | — | asChild, variant | — | ✓ | active |
+| Menu | — | — | — | — | active |
+| MenuItem | — | active | — | — | active |
+| Radio | — | label | — | — | active |
+| Search | — | clearLabel, description, helperMessage, id, label, onClear | — | — | active |
+| Select | — | description, helperMessage, id, indicator, invalid, label, options, placeholder, readOnly | — | — | active |
+| Slot | — | — | — | — | active |
+| Switch | — | label | — | — | active |
+| TextArea | — | description, helperMessage, id, indicator, invalid, label, labelInfo, maxRows, showCharacterCount | — | — | active |
+| TextField | — | description, helperMessage, id, indicator, label, labelInfo | — | — | active |
+| Tooltip | — | disabled, placement, title | — | — | active |
+
+## Field reference
+
+- **Description** — first paragraph of the JSDoc above the component's `forwardRef` declaration (also tries `<Name>Component` / `<Name>Root` for compound components), with the `<Name>Props` type alias as fallback. `—` means no JSDoc is present yet; consider adding one.
+- **Props** — EDS-defined props only, from the `<Name>Props` type literal. Intersected HTML attributes (`HTMLAttributes<...>`, `InputHTMLAttributes<...>`, etc.) and React-conventional props (`children`, `className`, `style`, `ref`, `key`) are NOT listed — assume the standard DOM props for the underlying element are available. Known limitation: only inline type literals and intersections are walked — props coming from a referenced local type alias (`type FooProps = SharedBase & {...}`) or a union type are not expanded.
+- **Sub-components** — compound sub-components attached via the `Compound<Name>` type pattern (e.g. `Field.Label`, `Banner.Icon`). Standalone components exported from the same directory (e.g. `MenuItem` from `./Menu`) appear as their own rows.
+- **asChild** — `✓` if the component supports the `asChild` polymorphism pattern (see `Slot/README.md`).
+- **Status** — `active` unless the props type carries an `@deprecated` JSDoc tag.
+
+## Out of scope
+
+- Components outside `/next` (legacy `packages/eds-core-react/src/components/`)
+- Other packages (`eds-data-grid-react`, `eds-lab-react`)
+- Per-prop type signatures (names only)
+- Storybook links

documentation/agent-instructions/BUILDING_EDS_2_COMPONENTS.md

@@ -4,6 +4,8 @@ This is the canonical reference for the patterns that go into an EDS 2.0 compone
 
 For the project-wide conventions (file structure, code style, CSS layering, testing, accessibility, conventional commits), see [`AGENTS.md`](../../AGENTS.md). This guide adds the component-building specifics that are not covered there.
 
+**Before building anything, check [`documentation/AI-COMPONENT-INDEX.md`](../AI-COMPONENT-INDEX.md)** — a generated, CI-verified list of every existing `/next` component with its props and sub-components. The component you are about to build may already exist, or an existing one may compose into what you need. One file read replaces walking the whole `/next` tree.
+
 ## Table of Contents
 
 - [Foundation Data-Attribute Reference](#foundation-data-attribute-reference)

package.json

@@ -12,7 +12,8 @@
     "lint:css": "stylelint ./packages/eds-core-react/src/components/next/**/*.css",
     "init": "pnpm install --force && pnpm run build",
     "extract-prerequisites": "node scripts/extract-prerequisites.js",
-    "prebuild": "pnpm run extract-prerequisites",
+    "generate:component-index": "node scripts/generate-component-index.js",
+    "prebuild": "pnpm run extract-prerequisites && pnpm run generate:component-index",
     "build": "pnpm run build:token-sync && pnpm run build:tokens-build && pnpm run build:icons && pnpm run build:tokens && pnpm run build:utils && pnpm run build:core-react && pnpm run build:data-grid-react && pnpm run build:lab && pnpm run build:color-palette-generator:cli",
     "build:color-palette-generator:cli": "pnpm --filter @equinor/eds-color-palette-generator run build:cli",
     "build:core-react": "pnpm --filter @equinor/eds-core-react run build",
@@ -96,6 +97,7 @@
     "stylelint-config-standard": "^40.0.0",
     "stylelint-order": "^8.1.1",
     "prettier": "3.9.5",
+    "ts-morph": "^27.0.2",
     "typescript": "^5.9.3"
   },
   "browserslist": "last 2 Chrome versions, last 2 firefox versions, last 2 safari versions, last 2 edge versions, not dead",