# Pattern library — surface classifier

When an agent receives a PRD or feature brief, it must read this file first
before reading any component or pattern documentation.

---

## Step 1 — Identify the surface

Determine which surface is being built by reading the PRD for these signals:

| Signal in PRD                                                    | Surface                           |
| ---------------------------------------------------------------- | --------------------------------- |
| "admin", "internal", "back office", "ops", "manage", "dashboard" | Internal admin                    |
| "customer", "portal", "my account", "self-service"               | Customer portal (not yet defined) |
| "website", "marketing", "landing page", "public"                 | Website (not yet defined)         |
| "mobile", "app", "iOS", "Android"                                | Mobile app (not yet defined)      |

If the surface cannot be determined from the PRD, ask for clarification before
proceeding. Do not assume.

---

## Step 2 — Read the rules for that surface

| Surface         | Rules location                                                            |
| --------------- | ------------------------------------------------------------------------- |
| Internal admin  | `node_modules/@spark-web/design-system/patterns/internal-admin/CLAUDE.md` |
| Customer portal | Not yet defined — flag to the team                                        |
| Website         | Not yet defined — flag to the team                                        |
| Mobile app      | Not yet defined — flag to the team                                        |

Read the surface rules file in full before reading any component documentation.
Surface rules take precedence over component rules.

---

## Step 3 — Read the pattern for the feature type

After reading surface rules, identify the feature type and read the
corresponding pattern file:

| Feature type                 | Pattern file                                                                                 |
| ---------------------------- | -------------------------------------------------------------------------------------------- |
| List of records with actions | `node_modules/@spark-web/design-system/patterns/internal-admin/list-page.md`                 |
| Create or edit a record      | `node_modules/@spark-web/design-system/patterns/internal-admin/form-page.md` (coming soon)   |
| Record detail view           | `node_modules/@spark-web/design-system/patterns/internal-admin/detail-page.md` (coming soon) |

If no pattern file exists yet for the feature type, use the surface rules and
component documentation to make the best decision, and flag that a pattern file
should be created for this feature type.

---

## Reading order for any build task

1. `node_modules/@spark-web/design-system/patterns/CLAUDE.md` ← this file
   (surface classifier)
2. `node_modules/@spark-web/design-system/patterns/[surface]/CLAUDE.md` ←
   surface interaction rules
3. `node_modules/@spark-web/design-system/patterns/[surface]/[pattern].md` ←
   feature pattern (if exists)
4. `node_modules/@spark-web/[component]/CLAUDE.md` ← component rules
5. `node_modules/@spark-web/[component]/src/[component].stories.tsx` ← usage
   examples

Never skip steps. Never read component documentation before surface rules.