docs: AI Principles restructured + Compliance Matrix + Platform governance + RFC-001 Button

- AI_DESIGN_PRINCIPLES.md:
  - Restructured into 5 parts: A. Decision Process, B. Component Selection,
    C. Token Usage, D. Design Review, E. Escalation
  - All rules use RFC 2119 normative words (MUST/MUST NOT/SHOULD/MAY)
  - Clearer escalation path: when to create DDR, when to flag uncertainty

- COMPLIANCE_MATRIX.md:
  - Tracks readiness for all 29 components (Tier 1/2/3)
  - 6 dimensions: Governance, Tokens, Motion, Accessibility, AI, QA
  - Foundation documents tracked separately
  - Button at 82% (reference for others)

- docs/platform/README.md:
  - Reserved directory for cross-cutting governance
  - Future: AI Governance, Product Governance, Review Process,
    Quality Gates, Release Governance, Decision Frameworks
  - Separates platform governance from design system

- LANDVEX_DESIGN_SPECIFICATION.md:
  - Button renamed to RFC-001: Canonical Button Component
  - Structured with: Cognitive Purpose, When to Use/NOT Use,
    User Expectation, Interaction Contract, Failure Behaviour,
    Accessibility Contract, AI Contract
  - Sets standard for all future RFC component specs

Rationale: AI rules before components (AI writes components).
Compliance matrix makes progress visible. Platform governance
separates cross-cutting concerns from design system. RFC format
for components ensures production-ready specifications.
This commit is contained in:
Bernt
2026-07-02 09:06:08 +00:00
parent 2e62e5fb80
commit b0a1808b2b
4 changed files with 304 additions and 147 deletions
+43 -23
View File
@@ -772,56 +772,76 @@ Only then may a new component be defined.
> **Princip:** Varje komponent har en egen specifikation med states, ARIA, keyboard, touch, animation och acceptance criteria.
### 8.3.1 Button
### RFC-001: Canonical Button Component
**Cognitive Purpose:** Button exists to trigger actions that modify state or advance workflow. It is the primary interface between user intent and system response.
**Status:** ✅ Approved as reference implementation
**Tier:** 1 (Canonical)
**Inherits From:** — (root component)
---
#### Cognitive Purpose
Button exists to trigger actions that modify state or advance workflow. It is the primary interface between user intent and system response.
#### When to Use
**When to use:**
- Primary user action (submit, confirm, save)
- Form submission
- Dialog confirmation
- Action that requires explicit user commitment
**When NOT to use:**
#### When NOT to Use
- Navigation (use Link)
- Toggling state (use Switch)
- Selecting from options (use Select)
- Secondary information reveal (use Accordion)
**User Expectation:**
#### User Expectation
- Button is clickable
- Button responds immediately to press
- Button indicates if action is in progress
- Button indicates if action is unavailable
**Interaction Contract:**
- Click → Action executes
- Hover → Visual feedback (but action does not execute)
- Focus → Keyboard can activate
- Loading → Action is in progress, further clicks ignored
- Disabled → Action is unavailable, reason explained elsewhere
#### Interaction Contract
**Failure Behaviour:**
- If action fails: Button returns to default state, error shown elsewhere (not on button)
- If network fails: Button remains in loading state until timeout, then error
- If validation fails: Button remains enabled, form shows errors
| Event | Response |
|-------|----------|
| Click | Action executes |
| Hover | Visual feedback only |
| Focus | Keyboard can activate |
| Loading | Further clicks ignored |
| Disabled | Action unavailable |
#### Failure Behaviour
| Scenario | Response |
|----------|----------|
| Action fails | Button returns to default, error shown elsewhere |
| Network fails | Button remains loading until timeout, then error |
| Validation fails | Button remains enabled, form shows errors |
#### Accessibility Contract
**Accessibility Contract:**
- Screen reader announces button role and label
- Focus is visible and logical
- Disabled state is communicated
- Loading state is communicated
**AI Contract:**
- AI chooses Button for primary actions
- AI chooses Link for navigation
- AI chooses Icon Button for toolbar actions
- AI chooses Split Button for primary + secondary options
- AI never uses Button for navigation
#### AI Contract
| Scenario | AI Choice |
|----------|-----------|
| Primary action | Button |
| Navigation | Link |
| Toolbar action | Icon Button |
| Primary + secondary options | Split Button |
---
**Token Dependencies:**
#### Token Dependencies
- `button-primary-bg``brand-500`
- `button-primary-bg-hover``brand-600`
- `button-primary-text``text-inverse`