docs(ms-ai-architect): add v1.11.0 sections to README + CHANGELOG

- README.md: new "v1.11.0 — Design-system 100%-adoption" section under
  Playground (v3), parallel to existing v1.10.0 Foundation refactor
  section. Documents hoisted DS components, PARALLEL CSS migration,
  inline style trim, visual upgrade benchmarks, and intentional
  plugin-local survivors.
- CHANGELOG.md: new [1.11.0] entry with Added subsection, plugin-local
  survivors note, and 3-session rollout note. Tests baseline 278 PASS.

Follow-up to release commit 7ffaa82 — release was pushed without these
deeper doc sections.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Kjell Tore Guttormsen 2026-05-04 17:52:28 +02:00
commit 1d8c2aa9ce
2 changed files with 41 additions and 0 deletions

View file

@ -5,6 +5,37 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
## [1.11.0] - 2026-05-04
### Added — Design-system 100%-adoption + visual upgrade
The playground now consumes the shared `playground-design-system` v0.3.0 end-to-end. Plugin contract (24 commands, 12 agents, 5 skills, 2 hooks, MCP) is unchanged — playground-internal release.
- **Hoisted to shared DS (v0.3.0)** — 13 generic components moved from inline `<style>` to `shared/playground-design-system/components-tier3-supplement.css`: `.eyebrow`, `.page__*`, `.key-stats`/`.key-stat`, `.verdict-pill-lg` (5-band), `.tab-list`/`.tab`/`.tab-panel`, `.top-risks`/`.top-risk[data-severity]`, `.recommendation-card`, `.card__*` subcomponents, `.card--severity-{level}`, form-patterns (`.field-row`, `.field-label`, `.field-help`, `.multi-select`, `.checkbox-row`, `.required-mark`), `.stack-lg/-md/-sm`, `.pyramide-tier-detail`, `.scenario-card-grid`/`.scenario-card[data-status="winner"]`, `.app-shell` variants. 567 new lines, 107 new selectors. Re-synced to vendored DS via `scripts/sync-design-system.mjs ms-ai-architect`.
- **PARALLEL CSS migration** — all 6 plugin-local naming groups renamed to DS conventions: `.topbar* → .app-header*`, `.residual-pair* → .pair-before-after*`, `.command-card* / .catalog-card* → .card + .card__*`, `.screen-tabs/-tab/screen → .tab-list/.tab/.tab-panel`, `.pyramide-desc* → .pyramide-tier-detail*`. Includes markup restructure for tab-component (`data-active="..."``[hidden]`-attr) and pair-before-after (`data-severity` → BEM modifier). ~50 markup occurrences updated.
- **Inline `<style>` trim** — block reduced 202 → 127 lines (~37%). `renderPageShell` + `renderKeyStatsGrid` refactored to DS markup (`.page__header-main` + `.page__header-aside` + `h1.page__title`; `.key-stat--{level}` BEM modifier).
- **Visual upgrade (benchmarked against showcase)** — AI Act pyramid width fix (min-width 480px, font-size-md, responsive @media), severity-coded left-border on report-cards in project surface based on `parsed.verdict`, app-header restructure (brand + breadcrumb + spacer + actions), eyebrow-label "PROSJEKTER · X av X" on home, `.stack-lg` vertical rhythm on home/project/catalog body.
- **Demo state rename**`Acme AS``Acme Kommune` and `Demosystem``Acme Kunde-chatbot` consistently across all 17 fixtures (39 Acme occurrences). `build-demo-state.mjs` updated: `organization.name` = "Acme Kommune", `projects[0].id` = "acme-kunde-chatbot", `projects[0].name` = "Acme: Kunde-chatbot".
- **`playground/screenshots/v1.11.0/`** — 24 regenerated PNGs (~27 MB total) reflecting the visual upgrade. v1.10.0 set preserved as historical reference.
- **`tests/screenshot/run.mjs`** — `OUT_DIR` + comments bumped to v1.11.0.
### Plugin-local survivors (intentional)
Components kept inline because they are semantically distinct from DS counterparts:
- `.verdict-pill` (domain go/block semantics, distinct from DS `.verdict-pill-lg` severity bands)
- `.scenario-card[data-status="met/partial/missing"]` (DS only ships "winner")
- `.read-more-block` + `.suppressed-panel` (native `<details>`; DS uses JS-toggled `aria-expanded`)
- Surface-specific layouts: `.onboarding-*`, `.home-*`, `.project-*`, `.modal*`, `.command-form*`, `.catalog-cards`-container
### Notes on 1.11.0
- 3-session rollout (commits `40631c0` Fase 1-3 + `31aed40` Fase 4-6 + `7ffaa82` Fase 7-9). Session 1+2 committed with `[skip-docs]` because user-facing docs are bundled with the release commit.
- Tests: 201 static + 70 parser-fixture + 7 migration = 278 PASS playground-suite, 0 FAIL. Pre-existing `tests/test-ros-output.sh` fixture-missing failure is unchanged.
- DS bump is purely additive — other vendor consumers (okr, llm-security, ultraplan-local, config-audit) do not need to re-sync to remain green.
---
## [1.10.1] - 2026-05-04
### Added — Demo system + screenshot gallery

View file

@ -375,6 +375,16 @@ All 17 report renderers now wrap output through `renderPageShell()` for a consis
open plugins/ms-ai-architect/playground/ms-ai-architect-playground.html
```
### v1.11.0 — Design-system 100%-adoption
The playground now consumes the shared `playground-design-system` v0.3.0 end-to-end — no parallel CSS, minimal inline overrides, visual upgrade benchmarked against the showcase scenarios:
- **Hoisted to shared DS (v0.3.0)** — 13 generic components moved from inline `<style>` to `shared/playground-design-system/components-tier3-supplement.css`: `.eyebrow`, `.page__*`, `.key-stats`/`.key-stat`, `.verdict-pill-lg`, `.tab-list`/`.tab`/`.tab-panel`, `.top-risks`/`.top-risk[data-severity]`, `.recommendation-card`, `.card__*` subcomponents, `.card--severity-{level}`, form-patterns, `.stack-lg/-md/-sm`, `.pyramide-tier-detail`, `.scenario-card-grid`/`.scenario-card[data-status="winner"]`, `.app-shell` variants. Re-synced to vendored DS via `scripts/sync-design-system.mjs ms-ai-architect`.
- **PARALLEL CSS migration** — all 6 plugin-local naming groups renamed to DS conventions: `.topbar* → .app-header*`, `.residual-pair* → .pair-before-after*`, `.command-card*` / `.catalog-card* → .card + .card__*`, `.screen-tabs/-tab/screen → .tab-list/.tab/.tab-panel`, `.pyramide-desc* → .pyramide-tier-detail*`. ~50 markup occurrences updated across CSS + JS strings.
- **Inline `<style>` trim** — block reduced 202 → 127 lines (~37%). `renderPageShell` + `renderKeyStatsGrid` refactored to DS markup (`.page__header-main` + `.page__header-aside`, `.key-stat--{level}` BEM modifiers).
- **Visual upgrade (benchmarked against showcase)** — AI Act pyramid width fix (min-width 480px, font-size-md, responsive breakpoint), severity-coded left border on report cards in project surface based on `parsed.verdict`, app-header restructure (brand + breadcrumb + spacer + actions), eyebrow-label "PROSJEKTER · X av X" on home, `.stack-lg` vertical rhythm on home/project/catalog body.
- **Plugin-local survivors (intentional)**`.verdict-pill` (domain go/block semantics, distinct from DS `.verdict-pill-lg` severity bands), `.scenario-card[data-status="met/partial/missing"]` (DS only ships "winner"), `.read-more-block` + `.suppressed-panel` (native `<details>`; DS uses JS-toggled `aria-expanded`), surface-specific layouts (`.onboarding-*`, `.home-*`, `.project-*`, `.modal*`, `.command-form*`).
### Demo data (one-click)
Click **"Last inn demo-data"** on the onboarding screen to bootstrap a complete demo: