merge queue: checking #1701 on main (af10ef0)

docs/PLAN.md

@@ -269,6 +269,7 @@ Größe vor dem Start messen: `store.mjs` (570), `app.js` (504/527) und `store.t
 | DS-X-08 | Bestätigungsdialog `ConfirmDialog` (`role="alertdialog"`, Fokus zuerst auf Abbrechen, Esc bricht ab, ein Klick auf den Hintergrund schließt nicht, Bestätigen löst nur einmal aus, Gefahr-Ton über `Button` „danger“) und `Sheet` mit Größe (`sm`/`md`/`lg`) sowie Beschriftungs- und Beschreibungs-Kennungen; bestehende `Sheet`-Aufrufer bleiben unverändert; noch an keine Ansicht angeschlossen (jedes Paket, das ihn an Löschen, Zusammenführen oder Überschreiben hängt, ist Stufe A) | Implementierer · Claude; Root nimmt ab | DS-X-07 (#1683); DS-Blueprint-Schnitt 16.10. (Zeile DS-X-08) | Server | B | Erledigt: #1700 gemergt 2026-10-20 (`a4ef7057`, Kopf `414001b4`); Reviews und Disposition im PR | red-first Vitest-Tests; `vitest run src/design`, typecheck, `contrast-check`, `plan-check --offline` und prepush Exit 0; Bildschirmfotos hell/dunkel; ein unabhängiger Stufe-B-Review einer Nicht-Anthropic-Familie (Root beauftragt) | – |
 | DS-X-09 | Tabelle v2 (Fabrik-Designsystem, Welle 1): `src/design/data/Table.tsx` bekommt sortierbare Spaltenköpfe (`aria-sort`, Enter und Leertaste), optionale Zeilenauswahl mit dem Ankreuzfeld (Kopf-Feld „teils“, Anzahl wird angesagt), eine feststehende Kopfzeile sowie Platzhalter für leer und lädt über `HonestState`; bestehende Aufrufer bleiben unverändert | Implementierer · Claude; Root nimmt ab | DS-X-05 (#1678); DS-Blueprint-Schnitt 16.10. (Zeile DS-X-09) | Server | B | Erledigt: #1692 (merged 2026-10-17); keine Ansicht umgestellt (KR-07*, 10e folgen) | Tests rot→grün (`red-first.sh` Exit 0); `vitest run src/design`, typecheck, `contrast-check`, `plan-check --offline` und prepush Exit 0; Bildschirmfotos hell/dunkel; ein Stufe-B-Review einer Nicht-Anthropic-Familie, Root kommissioniert | – |
 | DS-X-12 | Bewegungstoken angewendet: ein Druck-Token (`--g-press-scale`) für Knöpfe, Filterchips, Segmente und Tabs; der Füllbalken wächst per `transform: scaleX()` statt über die Breite, die Erlaubnisliste für Layout-Animation in `motion.test.ts` ist leer; der Lauf-Ring atmet nur unter `--g-ambient-play` (Lebendig), in Ruhig steht er still und ein Zustandswechsel gibt einen einmaligen Ping (`usePulseOnChange`); eine dokumentierte Regel für reduzierte Bewegung am Kopf von `motion.css`; das doppelte `g-enter` entfällt | Implementierer · Claude; Root nimmt ab | DS-X-03 (#1606), DS-X-07 (#1683); DS-Blueprint-Schnitt 16.10. (Zeile DS-X-12) | Server | B | Erledigt: #1693 (merged 2026-10-18) | red-first Vitest-Tests; `vitest run src/design`, typecheck, contrast-check, `plan-check --offline` und prepush Exit 0; ein unabhängiger Stufe-B-Review (Root beauftragt) | – |
+| DS-X-21 | Ein Symbolsatz auf 20-px-Raster: `Icon` in `src/design/icons/` (ohne Beschriftung für Hilfstechnik verborgen, mit `label` als `role="img"`, Farbe über `currentColor`) und 24 Lucide-Pfade als Daten (`glyphs.ts`), dazu Entsprechungen für die 14 klassischen Symbole, die Seitenleisten-Symbole und den Auswahl-Pfeil; Lizenztext `LUCIDE-LIZENZ.txt` neben den Symbolen und Eintrag in `docs/THIRD_PARTY_NOTICES.md` | Implementierer · Claude; Root nimmt ab | DS-Blueprint-Schnitt 16.10. (DS-X-21), Root-Entscheidung 17.10.: Pfade kopieren, kein Paket | Server | B + Lizenzprüfung | Entwurfs-PR offen (17.10.): kein Aufrufer umgestellt, `src/components/Icon.tsx` bleibt bis KR-15; Galerie zeigt den Satz unter „Symbole“ | Tests rot→grün; `vitest run src/design`, typecheck, `contrast-check`, `plan-check --offline` und prepush Exit 0; Bilder der Galerie hell und dunkel; ein Stufe-B-Review einer Nicht-Anthropic-Familie, Root prüft den Lizenzhinweis | – |
 | DS-X-32 | Datenfarben `--g-viz-1` bis `--g-viz-6` in `src/design/tokens.css` (hell und dunkel), eigene Farbtöne abseits der Zustandsfarben; `scripts/contrast-check.mjs` prüft jede Datenfarbe als Nicht-Text mit mindestens 3:1 auf Grund, Chrome und Glas (auch in allen Glas-Varianten), hält sie voneinander und von den Zustandsfarben auseinander und meldet „Token fehlt“; die Galerie-Seite Farben zeigt die sechs Farbfelder; keine Diagramm-Bausteine (das ist DS-X-33) | Implementierer · Claude; Root nimmt ab | DS-X-02; DS-Blueprint-Schnitt 16.10. (Zeile DS-X-32) | Server | B | Erledigt: #1702 (merged 2026-10-18), Branch `claude/ds-x-32`; die sechs Datenfarben stehen in `tokens.css`, `contrast-check` prüft sie und die Galerie-Seite Farben zeigt sie, Diagramm-Bausteine folgen mit DS-X-33 | red-first Gate-Tests in `scripts/lib/contrast-gate.test.mjs`; `contrast-check`, typecheck, `plan-check --offline` und prepush Exit 0; Bilder der Farben-Seite hell und dunkel; ein unabhängiger Stufe-B-Review (Root beauftragt) | – |
 | DS-X-26 | Popover (Fabrik-Designsystem, Welle 4): `src/design/layout/Popover.tsx` setzt `aria-expanded`/`aria-controls` am Auslöser, schließt bei einem Pointerdown außerhalb genau einmal, mit Esc (Fokus zurück zum Auslöser) und beim Verlassen per Tab, misst einmal beim Öffnen, ob es nach oben klappt (keine CSS-Anker-Positionierung), und geht über den Austrittsübergang aus DS-X-07 (bei reduzierter Bewegung sofort); `ProjectPicker` und das kompakte Darstellungsmenü nutzen es mit unverändertem Verhalten und Aussehen; Eintrag im Register; kein Menü-Baustein, kein Tooltip (DS-X-27) | Implementierer · Claude; Root nimmt ab | DS-X-07 (#1683); DS-Blueprint-Schnitt 16.10. (Zeile DS-X-26) | Server | B | Erledigt: #1705 (merged 2026-10-18); `ProjectPicker` und das kompakte Darstellungsmenü nutzen das Popover mit unverändertem Verhalten und Aussehen, kein Menü-Baustein und kein Tooltip (DS-X-27) | red-first Vitest-Tests (`popover.test.tsx`); die bestehenden Tests von `ProjectPicker` und Darstellungsmenü bleiben unverändert grün; `vitest run src/design src/shell`, typecheck, contrast-check, `plan-check --offline` und prepush Exit 0; Bildschirmfotos beider Menüs hell und dunkel; ein unabhängiger Stufe-B-Review (Root beauftragt) | – |
 | DS-X-28 | Toast-Warteschlange (Fabrik-Designsystem, Welle 4): `useToast()` in `src/design/layout/useToast.tsx` liefert `push` (gibt eine Kennung zurück), `dismiss(id)` und den einzubindenden `region`; höchstens drei Hinweise sind sichtbar, weitere warten; ein optionaler Aktionsknopf ruft seine Funktion genau einmal auf; Hinweise verlassen den Bildschirm über `useExitTransition` (bei reduzierter Bewegung sofort); `ToastRegion` bleibt abwärtskompatibel, Register-Eintrag angepasst; keine Bildschirmeinbindung | Implementierer · Claude; Root nimmt ab | DS-X-07; DS-Blueprint-Schnitt 16.10. (Zeile DS-X-28) | Server | B | Erledigt: #1704 (merged 2026-10-18), Branch `claude/ds-x-28`; keine Bildschirmeinbindung | red-first Vitest-Tests (`toast.queue.test.tsx`); `vitest run src/design`, typecheck, contrast-check, `plan-check --offline` und prepush Exit 0; ein unabhängiger Stufe-B-Review (Root beauftragt) | – |

docs/THIRD_PARTY_NOTICES.md

@@ -25,6 +25,12 @@ npx --yes license-checker-rseidelsohn@5.0.1 --production --json   # npm section
 - **Inter font** (`public/fonts/Inter-*.otf`): SIL Open Font License 1.1.
   The license text ships next to the fonts as `public/fonts/INTER-LIZENZ.txt`.
   Copyright 2016-2023 The Inter Project Authors.
+- **Lucide icons** (`src/design/icons/glyphs.ts`): about 24 icon paths copied as
+  data (no package installed). ISC License, Copyright (c) 2026 Lucide Icons and
+  Contributors; icons derived from Feather (check, chevrons, external-link, ...)
+  additionally carry the MIT notice, Copyright (c) 2013-present Cole Bemis.
+  License text, copied from https://github.com/lucide-icons/lucide/blob/main/LICENSE:
+  `src/design/icons/LUCIDE-LIZENZ.txt`.
 - **Recursive font** (`docs/dev-hq/fonts/recursive-latin-wght.woff2`): SIL
   Open Font License 1.1, license text next to it as `docs/dev-hq/fonts/OFL.txt`.
 - **prompt-master** (`src-tauri/resources/prompt-master/`): MIT License,

src/design/gallery/Gallery.tsx

@@ -2,6 +2,8 @@ import { useEffect, useState, type ReactNode } from "react";
 
 import { de, type MessageKey } from "../../i18n/de";
 import { Button } from "../controls/Button";
+import { Icon } from "../icons/Icon";
+import { GLYPHS } from "../icons/glyphs";
 import { Segmented } from "../controls/Segmented";
 import { Hall } from "../hall/Hall";
 import { EMPTY_HALL, SAMPLE_HALL, type HallScene } from "../hall/fixtures";
@@ -133,6 +135,9 @@ function Body({ page }: { page: Page }) {
       </Sample>
     );
     case "motion": return <MotionDemo />;
+    case "icons": return (
+      <ul className="g-gal-grid">{Object.keys(GLYPHS).map((n) => <li key={n} className="g-gal-icon"><Icon name={n as keyof typeof GLYPHS} /><code>{n}</code></li>)}</ul>
+    );
     case "hall": return <ProbeHall />;
     default: return (
       <>

src/design/gallery/gallery.css

@@ -20,3 +20,4 @@
 .g-gal-track { width: 320px; padding: var(--g-space-4); border-radius: var(--g-r-pill); background: var(--g-tint); }
 .g-gal-dot { display: block; width: 24px; height: 24px; border-radius: var(--g-r-pill); background: var(--g-accent); transition: transform var(--g-dur-5) var(--g-ease-move); }
 .g-gal-dot[data-moved="on"] { transform: translateX(280px); }
+.g-gal-icon { display: flex; flex-direction: column; align-items: center; gap: var(--g-space-2); inline-size: 8rem; color: var(--g-ink); }

src/design/gallery/gallery.test.tsx

@@ -4,6 +4,7 @@ import { cleanup, fireEvent, render, screen, within } from "@testing-library/rea
 import { afterEach, beforeAll, describe, expect, it, vi } from "vitest";
 
 import { de } from "../../i18n/de";
+import { GLYPHS } from "../icons/glyphs";
 import { COMPONENT_REGISTRY } from "../registry";
 import { Gallery } from "./Gallery";
 
@@ -41,6 +42,15 @@ describe("design gallery (DS-X-15)", () => {
     expect(screen.getByText(de["gallery.sample"])).toBeTruthy();
   });
 
+  it("the icons page lists every registered glyph", () => {
+    render(<Gallery />);
+    fireEvent.click(within(screen.getByRole("navigation", { name: de["gallery.nav"] })).getByRole("button", { name: de["gallery.family.icons"] }));
+    const cells = document.querySelectorAll(".g-gal-icon");
+    expect(cells.length).toBe(Object.keys(GLYPHS).length);
+    expect(cells.length).toBeGreaterThan(0);
+    for (const cell of cells) expect(cell.querySelector("svg")).not.toBeNull();
+  });
+
   it("reduced motion stops the motion demo", () => {
     reduce(true);
     render(<Gallery />);

src/design/icons/Icon.tsx

@@ -0,0 +1,31 @@
+import type { SVGProps } from "react";
+import { GLYPHS, type IconName } from "./glyphs";
+
+export interface IconProps extends Omit<SVGProps<SVGSVGElement>, "name" | "children" | "width" | "height"> {
+  name: IconName;
+  /** Accessible name. Without one the icon is hidden from assistive technology. */
+  label?: string;
+}
+
+/** Lucide's 24-unit artboard drawn at 20 px. Colour is `currentColor`; name the control, not the glyph, unless it stands alone. */
+export function Icon({ name, label, className, style, ...rest }: IconProps) {
+  return (
+    <svg
+      width={20}
+      height={20}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      focusable="false"
+      className={className}
+      style={{ display: "block", flexShrink: 0, ...style }}
+      {...rest}
+      {...(label ? { role: "img", "aria-label": label } : { "aria-hidden": true })}
+    >
+      {GLYPHS[name].map((d) => <path key={d} d={d} />)}
+    </svg>
+  );
+}

src/design/icons/LUCIDE-LIZENZ.txt

@@ -0,0 +1,43 @@
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+
+---
+
+The following Lucide icons are derived from the Feather project:
+
+airplay, alert-circle, alert-octagon, alert-triangle, aperture, arrow-down-circle, arrow-down-left, arrow-down-right, arrow-down, arrow-left-circle, arrow-left, arrow-right-circle, arrow-right, arrow-up-circle, arrow-up-left, arrow-up-right, arrow-up, at-sign, calendar, cast, check, chevron-down, chevron-left, chevron-right, chevron-up, chevrons-down, chevrons-left, chevrons-right, chevrons-up, circle, clipboard, clock, code, columns, command, compass, corner-down-left, corner-down-right, corner-left-down, corner-left-up, corner-right-down, corner-right-up, corner-up-left, corner-up-right, crosshair, database, divide-circle, divide-square, dollar-sign, download, external-link, feather, frown, hash, headphones, help-circle, info, italic, key, layout, life-buoy, link-2, link, loader, lock, log-in, log-out, maximize, meh, minimize, minimize-2, minus-circle, minus-square, minus, monitor, moon, more-horizontal, more-vertical, move, music, navigation-2, navigation, octagon, pause-circle, percent, plus-circle, plus-square, plus, power, radio, rss, search, server, share, shopping-bag, sidebar, smartphone, smile, square, table-2, tablet, target, terminal, trash-2, trash, triangle, tv, type, upload, x-circle, x-octagon, x-square, x, zoom-in, zoom-out
+
+The MIT License (MIT) (for the icons listed above)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.