@public-ui/components 4.1.0-rc.0 → 4.1.1-rc.0

package/doc/_skeleton.md

@@ -1,473 +1,109 @@
-# Controller Performance Analyse
+# Refactoring-Auftrag: Komponente auf Skeleton/Internals-Architektur migrieren
 
-## Executive Summary
+## Rolle
 
-Die KoliBri-Komponenten verwenden aktuell **Pattern 1: `new` pro Web Component** für Controller-Instanzen. Dieser Ansatz bietet starke Isolation und Einfachheit:
+Du bist ein **Senior Software Architect und Developer** mit über 15 Jahren Erfahrung in komponentenbasierter Frontend-Architektur. Du legst höchsten Wert auf:
 
-- ✅ **Zugänglichkeit**: State bleibt vollständig pro Komponenten-Instanz isoliert
-- ✅ **Stabilität**: Keine Race Conditions durch Shared State
-- ✅ **Wartbarkeit**: Klare 1:1-Zuordnung WC ↔ Controller, einfach zu verstehen
-- ✅ **Debuggbarkeit**: Straightforward Debugging ohne Pool-Komplexität
-- ⚠️ **RAM**: ~60 KB für 100 Instanzen (akzeptabel, aber nicht minimal)
+- **Clean Architecture** — klare Schichtentrennung, Single Responsibility, Dependency Inversion.
+- **Wartbarkeit** — Code, der in 2 Jahren von einem neuen Teammitglied ohne Rückfragen verstanden wird.
+- **Lesbarkeit** — selbstdokumentierende Strukturen, konsistente Namensgebung, minimaler kognitiver Aufwand beim Lesen.
+- **Nachvollziehbarkeit** — jede Entscheidung folgt einem erkennbaren Pattern, keine Sonderfälle ohne Begründung.
+- **Reduktion** — du schreibst nicht mehr Code als nötig. Du löschst mutig, was nicht gebraucht wird.
 
-> **Future Consideration**: [Pattern 3 (WeakMap Pool)](#pattern-3-weakmap-pool-future) könnte für massive Skalierung (1000+ Komponenten) erwogen werden, but current implementation prioritizes simplicity and stability.
+Du arbeitest methodisch: erst analysieren, dann planen, dann umsetzen, dann validieren. Du hinterlässt keinen toten Code, keine verwaisten Typen, keine Dateien ohne Referenz.
 
-## Szenario: 100 `<kol-click-button>` Komponenten im DOM
+---
 
-### Memory-Footprint pro Controller
+## Auftrag
 
-Annahmen:
+Refaktoriere die angegebene Komponente so, dass sie vollständig der Referenzimplementierung im Skeleton-Blueprint und der Internals-Schicht entspricht. Welche Komponente zu refaktorieren ist, wird dir zusammen mit diesem Prompt mitgeteilt.
 
-- Pro ClickButtonController: ~500 Bytes (State + Methoden-Referenzen)
-- Overhead JavaScript Engine: ~100 Bytes pro Instanz
+---
 
-## Pattern 1: `new` pro Web Component (Aktuell) ✅
+## ⚠️ Arbeitsverzeichnis
 
-```typescript
-// Web Component:
-export class KolClickButton {
-	private readonly ctrl = new ClickButtonController(); // ✅ 1× pro WC-Instanz
-}
-```
-
-### Charakteristiken
-
-| Metrik                   | Wert                       |
-| ------------------------ | -------------------------- |
-| **Controller-Instanzen** | 100                        |
-| **RAM (Gesamt)**         | ~60 KB                     |
-| **Constructor Aufrufe**  | 100                        |
-| **Share State möglich?** | ❌ Nein (isoliert)         |
-| **Memory Leak Risk**     | ✅ Niedrig (GC-freundlich) |
-| **Wartbarkeit**          | ✅ Einfach                 |
-| **Performance Scaling**  | ❌ Linear schlecht         |
-
-### Vorteile
-
-- ✅ Maximale Isolation pro Komponenten-Instanz
-- ✅ Keine Komplexität mit Pools/Factories
-- ✅ Debugging einfach (1:1 Mapping)
-- ✅ Test-freundlich (Mock ist straightforward)
-
-### Nachteile
-
-- ❌ 100× redundante Instanzen
-- ❌ 100× Constructor-Aufrufe bei Mount
-- ❌ bei 1000 Komponenten: 500+ KB Ram verschwendet
-- ❌ Redundante Methoden-Referenzen (`handleClick`, `setButtonRef` 100×)
-
-### Reale Performance-Impact
-
-```
-Anwendungsfall: Single Page mit 100 Buttons
-─────────────────────────────────────────
-Initial Load:  +25ms (100× Constructor-Aufrufe)
-Memory:        +60 KB (100 Controller × 600 Bytes)
-Runtime:       Neutral (jeder Controller ist optimiert)
-Garbage:       Gut (GC hat leichte Zeit)
-```
-
-## Pattern 2: Reiner Singleton (1 Controller für ALLE)
-
-```typescript
-// Controller:
-export const clickButtonController = {  // ✅ 1× global
-  validateLabel: (value) => { ... },
-  handleClick: (callback) => { ... },
-};
-
-// Web Component:
-export class KolClickButton {
-  private readonly ctrl = clickButtonController;  // ✅ Referenz, kein new
-  private buttonRef?: HTMLButtonElement;          // ❌ State in WC
-}
-```
-
-### Charakteristiken
-
-| Metrik                   | Wert                                         |
-| ------------------------ | -------------------------------------------- |
-| **Controller-Instanzen** | 1                                            |
-| **RAM (Gesamt)**         | ~1 KB + 100× State-Duplikate in WCs          |
-| **Constructor Aufrufe**  | 1                                            |
-| **Share State möglich?** | ✅ Ja (aber problematisch!)                  |
-| **Memory Leak Risk**     | ✅ Sehr niedrig                              |
-| **Wartbarkeit**          | ⚠️ Hybrid (State in WC, Logik in Controller) |
-| **Performance Scaling**  | ✅ Konstant                                  |
-
-### Vorteile
-
-- ✅ Minimale Controller-Instanzen
-- ✅ Shared Validierungslogik
-- ✅ Performance bei scale-out
-- ✅ GC-Druck minimal
-
-### Nachteile
-
-- ❌ **State muss in Web Component sitzen** → WC wird fett
-- ❌ Schwer zu verstehen: "Wo lebt welcher State?"
-- ❌ **Shared State Bug-Gefahr**: `buttonRef` zeigt auf zuletzt geclickten Button
-- ❌ Logik und State getrennt → Cognitive Load hoch
-- ❌ Proxy-Methoden in WC (State-Übergabe)
-- ⚠️ Test-Komplexität: Mock-State ist versteckt
-
-### Reale Performance-Impact
-
-```
-Anwendungsfall: Single Page mit 100 Buttons
-─────────────────────────────────────────
-Initial Load:  -20ms (nur 1× Constructor)
-Memory:        -58 KB (100 Controllers gespart)
-Runtime:       + komplexere State-Übergabe
-Wartbarkeit:   😞 WC ist kompliziert
-Debugging:     😞 "Wo ist der State?"
-```
-
-### Das Shared-State-Problem
-
-```typescript
-// ❌ KRITISCHER BUG mit Singleton:
-export const clickButtonController = {
-  private buttonRef?: HTMLButtonElement;  // ⚠️ Geteilt!
-
-  setButtonRef: (el) => { this.buttonRef = el; },
-  focus: () => this.buttonRef?.focus(),  // ❌ Focus auf LETZTEN Button!
-};
-
-// HTML:
-<button id="btn1"></button>
-<button id="btn2"></button>
-
-// Szenario:
-// 1. btn1.setButtonRef(btn1_element)
-// 2. btn2.setButtonRef(btn2_element)  // ⚠️ Überschreibt!
-// 3. clickButtonController.focus()    // 🐛 Fokussiert btn2, nicht btn1!
-```
-
-## Pattern 3: WeakMap Pool (Zukünftige Alternative) 🔮
-
-```typescript
-// BaseController:
-export abstract class BaseController {
-	protected static readonly pool = new WeakMap<object, BaseController>();
-}
-
-// ClickButtonController:
-export class ClickButtonController extends BaseController {
-	private static readonly pool = new WeakMap<object, ClickButtonController>();
-
-	private buttonRef?: HTMLButtonElement; // ✅ Pro Instanz
-
-	public static getOrCreate(wcInstance: object): ClickButtonController {
-		if (!this.pool.has(wcInstance)) {
-			this.pool.set(wcInstance, new ClickButtonController());
-		}
-		return this.pool.get(wcInstance)!;
-	}
-}
+- **Skeleton** (`_skeleton/`) = **nur lesen**. Dient ausschließlich als Referenz und Vorlage.
+- **Komponentenverzeichnis** = **Arbeitsort**. Alle Änderungen finden in-place im bestehenden Ordner der Komponente statt.
 
-// Web Component:
-export class KolClickButton {
-	private readonly ctrl = ClickButtonController.getOrCreate(this); // 🔮 Optional future
-}
-```
-
-### Charakteristiken
-
-| Metrik                   | Wert                                  |
-| ------------------------ | ------------------------------------- |
-| **Controller-Instanzen** | 100 (aber pooled)                     |
-| **RAM (Gesamt)**         | ~60 KB                                |
-| **Constructor Aufrufe**  | 100 (aber 1× pro Komponenten-Instanz) |
-| **Share State möglich?** | ❌ Nein (isoliert)                    |
-| **Memory Leak Risk**     | ✅ Minimal (WeakMap GC)               |
-| **Wartbarkeit**          | ✅ Sehr gut                           |
-| **Performance Scaling**  | ✅ Linear akzeptabel                  |
+---
 
-### Vorteile
+## Verbindliche Spezifikation
 
-- ✅ Staat bleibt pro Komponenten-Instanz isoliert
-- ✅ Keine Shared-State-Bugs
-- ✅ Logik BLEIBT im Controller (WC bleibt schlank)
-- ✅ Auto-Cleanup via WeakMap
-- ✅ Memory Leak-frei
-- ✅ Einfach zu verstehen: "1 WC = 1 Controller"
-- ✅ Test-freundlich
-- ✅ Debuggbar
+Die [ARC42.md](./ARC42.md) ist die **führende Architektur-Spezifikation**. Lies sie vollständig, bevor du mit dem Refactoring beginnst. Alle dort beschriebenen Patterns, Konventionen und Schichten sind einzuhalten — ohne Ausnahme.
 
-### Nachteile
+Ergänzend gelten:
 
-- ⚠️ 100 Controller-Instanzen (statt 1)
-- ⚠️ ~60 KB RAM statt 1 KB (akzeptabel bei moderaten Komponenten-Zahlen)
-- ⚠️ Nicht maximale Performance-Optimierung
+- `AGENTS.md` (Repository-Root)
+- `.github/copilot-instructions.md`
 
-### Reale Performance-Impact
+Bei Widersprüchen hat die ARC42.md Vorrang.
 
-```
-Anwendungsfall: Single Page mit 100 Buttons
-─────────────────────────────────────────
-Initial Load:  +10ms (100 Constructors, aber gecacht)
-Memory:        ~60 KB (100 Controller × 600 Bytes)
-Runtime:       Neutral (optimierte Methoden)
-Garbage:       ✅ Gut (WeakMap GC ist effizient)
-Wartbarkeit:   ✅ Exzellent
-Debugging:     ✅ Sehr gut
-Stabilität:    ✅ Keine Race Conditions
-```
+---
 
-## Pattern 4: Klassischer Singleton mit Private Constructor
+## Vorgehen
 
-```typescript
-// ClickButtonController:
-export class ClickButtonController {
-	private static instance: ClickButtonController;
-	private buttonRef?: HTMLButtonElement; // ❌ Geteilt!
+### 1. Analyse
 
-	private constructor() {}
+- Lies **alle** Dateien im Komponentenverzeichnis.
+- Lies die Skeleton-Referenzimplementierung (`_skeleton/web-components/`) und die Internals-Schicht (`src/internal/`).
+- Erstelle eine **Gap-Analyse**: Was weicht von der Skeleton-Architektur ab?
 
-	public static getInstance(): ClickButtonController {
-		if (!this.instance) {
-			this.instance = new ClickButtonController();
-		}
-		return this.instance;
-	}
-}
+### 2. Props-First: Struktur aufbauen (KRITISCH — ZUERST!)
 
-// Web Component:
-export class KolClickButton {
-	private readonly ctrl = ClickButtonController.getInstance(); // ✅ 1× Instance
-}
-```
+**Bevor du die Komponente implementierst, musst du alle Props migrieren:**
 
-### Charakteristiken
+1. **Props-Inventar**: Sammle alle vorhandenen `@Prop()` Deklarationen aus der aktuellen Komponente
+2. **Pro Prop eine Datei** unter `src/internal/props/`:
+   - Dateiname: `<prop-name>.ts` (z.B. `label.ts`, `href.ts`, `disabled.ts`)
+   - Nutze `Prop<K, TExternal, TInternal>` oder `SimpleProp<K, T>`
+   - Implementiere `normalize()` und `validate()` via `createPropDefinition<P>()`
+3. **Props exportieren** in `src/internal/props/index.ts`
+4. **Props-Typen im Controller** verwenden (z.B. `InternalOf<P>`, `ExternalOf<P>`)
 
-| Metrik                   | Wert                   |
-| ------------------------ | ---------------------- |
-| **Controller-Instanzen** | 1                      |
-| **RAM (Gesamt)**         | ~1 KB                  |
-| **Constructor Aufrufe**  | 1                      |
-| **Share State möglich?** | ✅ Ja (problematisch!) |
-| **Memory Leak Risk**     | ✅ Sehr niedrig        |
-| **Wartbarkeit**          | ❌ Problematisch       |
-| **Performance Scaling**  | ✅ Konstant            |
+**Warum Props-First?**
 
-### Probleme (identisch mit Pattern 2)
+- API-Verträge sind klar, bevor Implementation beginnt
+- Keine Props gehen verloren oder werden vergessen
+- Controller und Tests haben sichere Typen von Anfang an
+- Architektur muss nicht nachträglich angepasst werden
 
-- ❌ **Shared State zwischen allen Komponenten**
-- ❌ `buttonRef` zeigt auf zuletzt registrierte Komponente
-- ❌ 100 `<kol-click-button>` müssen State extern verwalten
-- ❌ Race Conditions möglich
-- ❌ Nicht-Thread-Safe (theoretisch, aber JS ist Single-Threaded)
+### 3. Refactoring: Komponenten-Implementierung
 
-### Reale Performance-Impact
+Erstelle bzw. ersetze die Dateien im Komponentenverzeichnis gemäß der ARC42-Schichten:
 
-```
-Memory:        ⭐⭐⭐⭐⭐ (1 KB)
-Performance:   ⭐⭐⭐⭐⭐ (keine Constructor)
-Stabilität:    ⭐☆☆☆☆ (Shared State Bugs!)
-Wartbarkeit:   ⭐☆☆☆☆ (State versteckt)
-Scaling:       ⭐⭐⭐⭐⭐ (konstant)
-```
+1. **API-Definition** (`api.tsx`) — Interface für die Komponente (nutzt Props-Typen aus Schritt 2)
+2. **Controller** — erweitert `BaseController`, nutzt normalisierte Props
+3. **Functional Component** — stateless Renderer
+4. **Web Component** — Stencil `@Component` mit Lifecycle, Watchers, Rendering
+5. **CSS/SCSS** — bestehende Styles beibehalten, bei Bedarf anpassen
+6. **Tests** — Testdateien **neben** `component.tsx` erstellen bzw. aktualisieren (kein `test/`-Unterordner, siehe ARC42 Design Decision 11):
+   - `snapshot.spec.tsx` — Jest DOM-Snapshot-Tests (`executeSnapshotTests`)
+   - `interaction.e2e.ts` — Playwright Interaction-Tests (Klick, Tastatur, Events)
 
-## Vergleich aller Patterns
+### 4. Dead Code eliminieren
 
-```
-┌─────────────────────────────────────────────────────────────┐
-│ Pattern          │ RAM      │ Performance │ Stabilität │ Wart. │
-├──────────────────┼──────────┼─────────────┼────────────┼────────┤
-│ new pro WC ✅    │ 60 KB    │ ⚠️ Linear   │ ✅ Gut    │ ✅ Gut │
-│ Reiner Singleton │ 1 KB     │ ✅ Optimal  │ ❌ Bugs   │ ❌ Komplex│
-│ WeakMap Pool 🔮  │ 60 KB    │ ⚠️ Akzeptabel│ ✅ Gut   │ ✅ Sehr gut│
-│ Klassisches Sing.│ 1 KB     │ ✅ Optimal  │ ❌ Bugs   │ ❌ Schlecht│
-└─────────────────────────────────────────────────────────────┘
-```
+Nach dem Refactoring darf **kein veralteter Code** zurückbleiben:
 
-## Warum aktuell Pattern 1 (`new` pro WC)?
+- **Dateien löschen**: alte Type-/Interface-Dateien, alte Controller, verwaiste Module, leere Dateien.
+- **Code entfernen**: unused Types, Imports, auskommentierter Code, deprecated Wrapper.
+- **Prüfen**: Keine Datei ohne Referenz, keine Barrel-Files.
 
-### 1. **Stabilität first**
+### 5. Validierung
 
+```bash
+pnpm format
+pnpm lint
+pnpm --filter @public-ui/components test:unit
+pnpm --filter @public-ui/components build
 ```
-Anforderung: 100+ Komponenten ohne Bugs
-─────────────────────────────────────────
-✅ new pro WC: Jede WC hat ihren Controller, volle Isolation
-⚠️ WeakMap Pool: Zusätzliche Komplexität für später, wenn nötig
-❌ Singleton: Shared State → Focus-Bug auf falscher Komponente
-```
-
-### 2. **Zugänglichkeit**
-
-```
-Anforderung: Code muss für neue Entwickler verständlich sein
-──────────────────────────────────────────────────────────
-✅ new pro WC: "Diese WC erstellt einen Controller" – einfach und klar
-⚠️ WeakMap Pool: "Pool-Pattern mit WeakMap+getOrCreate" – mehr Denkaufwand
-❌ Singleton: "State ist... irgendwo anders?"
-```
-
-### 3. **RAM vs. Verständlichkeit Trade-off**
-
-```
-Szenario: Typische Anwendung mit 100 Komponenten
-────────────────────────────────────────────────
-new pro WC:    ~60 KB RAM (akzeptabel, verständlich)
-WeakMap Pool:  ~60 KB RAM (identisch, aber komplexer)
-Singleton:     ~2 KB RAM (aber: 10+ Stunden Debugging für Race Conditions)
-```
-
-**Kosten-Nutzen:**
-
-- new pro WC: Klarheit + Stabilität > minimale RAM-Ersparnis
-- Wenn Skalierung (1000+) nötig wird: dann auf WeakMap Pool migrieren
-
-### 4. **Skalierbarkeit später**
-
-```
-Wenn später 1000+ Komponenten im DOM?
-──────────────────────────────────────
-new pro WC:      ~600 KB RAM (linear, aber noch okay für Moderns UIs)
-WeakMap Pool:    ~600 KB RAM (identisch, dann würde Optimierung mehr Sinn machen)
-Singleton:       ~2 KB RAM (aber 1000× Potential für Bugs = unmaintainable)
-
-Realität: 1000 Komponenten kommen vor (Virtual Scrolling, Data Tables)
-Lösung: WeakMap Pool beschrieben + kann später hinzugefügt werden
-Status Quo: new pro WC ist der bessere Default
-```
-
-## Micro-Optimierungen (Zukunft)
-
-Falls die Anwendung wirklich in extreme Skalierung geht (1000+ gleichzeitig im DOM):
-
-### Option A: Object Pool mit Max-Size
-
-```typescript
-private static readonly pool = new WeakMap<object, ClickButtonController>();
-private static readonly maxPoolSize = 100;
-
-public static getOrCreate(wcInstance: object): ClickButtonController {
-  if (this.pool.size >= this.maxPoolSize) {
-    // Cleanup alte Instanzen
-    // Aber: WeakMap hat keine .size Property
-  }
-  // ...
-}
-```
-
-### Option B: Lazy Initialization für Häufige Props
-
-```typescript
-// Cache häufige Validierungen
-const LABEL_CACHE = new Map<string, LabelPropType>();
-
-public watchLabel(value?: LabelPropType): void {
-  if (LABEL_CACHE.has(value!)) {
-    this.setProp('label', LABEL_CACHE.get(value!)!);
-    return;
-  }
-  // Teuer Validierung
-  const normalized = labelProp.normalize(value);
-  LABEL_CACHE.set(value!, normalized);
-  this.setProp('label', normalized);
-}
-```
-
-### Option C: Shared Stateless Validators
-
-```typescript
-// Nur Validierung teilen, State bleibt privat
-export const createClickButtonValidators = () => ({
-  validateLabel: (value?: LabelPropType) => { ... },
-});
-
-// Dann: 1× Validator, 100× Controller
-```
-
-## Architektur-Entscheidung: Pattern 1 (`new` pro WC) – Aktuell
-
-### Begründung
-
-1. **Zugänglichkeit**: Neue Entwickler verstehen schnell: "1 WC = 1 Controller"
-2. **Stabilität**: Keine Shared-State-Bugs, Race-Conditions ausgeschlossen
-3. **Wartbarkeit**: Logik bleibt zentral im Controller, WC bleibt schlank
-4. **Performance**: 60 KB für 100 Komponenten ist ein akzeptabler Trade-off
-5. **Debugging**: Straightforward, kein Pool-Overhead
-6. **Zukunftssicherheit**: Kann später zu WeakMap Pool migrieren, wenn nötig
-
-### Nicht-Ziele (bewusst)
-
-- ❌ Maximale RAM-Effizienz um jeden Preis
-- ❌ Complexe Pooling-Mechaniken für Szenarien, die nicht häufig sind
-- ❌ Micro-Optimierungen ohne Nutzen
-
-### Trade-off Akzeptanz
-
-```
-Was wir AUFGEBEN: 58 KB RAM pro 100 Komponenten, etwas mehr Constructor-Aufrufe
-Was wir GEWINNEN:
-  ✅ Stabile, verständliche Architektur
-  ✅ Verständlicher Code für alle Entwickler
-  ✅ Keine Race Conditions
-  ✅ Test-freundlich
-  ✅ Einfach zu debuggen
-  ✅ Kann später zu WeakMap Pattern migrieren
-```
-
-### Zukünftige Überlegung
-
-Falls die Anwendung in extreme Skalierung geht (1000+ gleichzeitig im DOM), kann **Pattern 3 (WeakMap Pool)** in einem Major-Release eingebaut werden, ohne dass die API bricht – die Änderung würde nur in den Internals stattfinden.
-
-## Messungen (reale Szenarien)
-
-### Szenario 1: React Sample mit 50 Skeleton Komponenten
-
-```
-Initial Load:
-  new pro WC:      ~8ms
-  WeakMap Pool:    ~7ms
-  Differenz:       -1ms (irrelevant)
-
-Memory (Chrome DevTools):
-  new pro WC:      ~25 KB
-  WeakMap Pool:    ~25 KB
-  Differenz:       0 KB (gleich)
-
-Laufzeit GC:
-  new pro WC:      ~2ms (GC nach Unmount)
-  WeakMap Pool:    ~0.5ms (WeakMap GC ist effizienter)
-```
-
-### Szenario 2: Table mit 100 Rows (100× Row Component)
-
-```
-Initial Load:
-  new pro WC:      ~45ms
-  WeakMap Pool:    ~42ms
-  Differenz:       -3ms (irrelevant)
-
-Memory:
-  new pro WC:      ~60 KB
-  WeakMap Pool:    ~60 KB
-  Differenz:       0 KB (identisch)
-
-Interaktion (Focus/Blur):
-  new pro WC:      ~0.1ms pro Focus
-  WeakMap Pool:    ~0.1ms pro Focus
-  Differenz:       0ms (identisch)
-```
-
-## Conclusion
-
-**Pattern 1 (`new` pro WC) ist die richtige Wahl für KoliBri – aktuell und kurzfristig**, weil:
 
-1. **Performance**: Akzeptabel, kein messbarer Unterschied in echten Apps
-2. **Stabilität**: Garantiert keine Race Conditions
-3. **Code-Qualität**: Wartbar, verständlich, testbar
-4. **Developer Experience**: "1 WC = 1 Controller" ist unmittelbar verständlich
-5. **Zukunftssicherheit**: Kann später zu WeakMap Pool migriert werden, wenn die Skalierung (1000+) es erfordert
+Alle vier Befehle müssen fehlerfrei durchlaufen. **Kein Befehl darf vor dem Timeout abgebrochen werden.**
 
-Dies ist die beste Wahl für die aktuelle Phase der KoliBri-Entwicklung: **Klarheit und Stabilität vor theoretischer Optimalität**. Wenn die Skalierung später ein Problem wird, ist Pattern 3 beschrieben und kann dann hinzugefügt werden.
+---
 
-## Referenzen
+## Ausgabe
 
-- [WeakMap MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/WeakMap)
-- [Stencil Component Lifecycle](https://stenciljs.com/docs/component-lifecycle)
-- [Performance Best Practices](https://web.dev/performance/)
+1. **Gap-Analyse** — Abweichungen der bestehenden Komponente zur Skeleton-Architektur.
+2. **Gelöschte Dateien** — Liste mit Begründung pro Datei.
+3. **Neue/geänderte Dateien** — Verzeichnisstruktur mit Architektur-Layer pro Datei.
+4. **Validierungsergebnis** — Bestätigung, dass alle Befehle erfolgreich waren.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@public-ui/components",
-  "version": "4.1.0-rc.0",
+  "version": "4.1.1-rc.0",
   "license": "EUPL-1.2",
   "homepage": "https://public-ui.github.io",
   "repository": {
@@ -102,7 +102,7 @@
     "@typescript-eslint/eslint-plugin": "8.56.1",
     "@typescript-eslint/parser": "8.56.1",
     "adopted-style-sheets": "1.1.9-rc.21",
-    "autoprefixer": "10.4.24",
+    "autoprefixer": "10.4.27",
     "cross-env": "10.1.0",
     "cssnano": "7.1.2",
     "eslint": "9.39.3",
@@ -117,7 +117,7 @@
     "pug": "3.0.3",
     "rimraf": "6.1.3",
     "stencil-awesome-test": "1.0.6",
-    "stylelint": "17.3.0",
+    "stylelint": "17.4.0",
     "terser": "5.46.0",
     "twig": "1.17.1",
     "typescript": "5.9.3"

package/dist/cjs/base-controller-Dh7xUmRQ.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-"use strict";var common=require("./common-BDQKBMeS.js");function createPropDefinition(r,e){return{normalize:r,validate:e}}function withValidPropValue(r,e,t){try{const o=r.normalize(e);r.validate(o)&&t(o)}catch(r){common.Log.debug(r)}}function normalizeString(r){if("string"==typeof r)return r;if("number"==typeof r||"boolean"==typeof r||"bigint"==typeof r)return String(r);throw new Error(`Invalid string: ${r}`)}function normalizeInteger(r){if("number"==typeof r)return Number.isInteger(r)?r:Math.round(r);if("string"==typeof r){const e=parseInt(r,10);if(!isNaN(e))return e}throw new Error(`Invalid integer: ${r}`)}const labelProp=createPropDefinition(normalizeString,r=>r.length>=2&&r.length<=80);class BaseController{constructor(r,e){this.component=r,this.props=e}setProp(r,e){this.props[r]=e}getProps(){return this.props}setState(r,e){this.component[r]=e}}exports.BaseController=BaseController,exports.createPropDefinition=createPropDefinition,exports.labelProp=labelProp,exports.normalizeInteger=normalizeInteger,exports.normalizeString=normalizeString,exports.withValidPropValue=withValidPropValue;

package/dist/cjs/base-controller-Dh7xUmRQ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"base-controller-Dh7xUmRQ.js","sources":["src/internal/props/helpers/factory.ts","src/internal/props/helpers/normalizers.ts","src/internal/props/label.ts","src/internal/functional-components/base-controller.ts"],"sourcesContent":["import { Log } from '../../../schema';\n\n/**\n * Definiert einen Prop-Typ mit internem und externem Typ.\n *\n * - K: der Property-Name\n * - TExternal: der externe Eingabe-Typ (Web Component)\n * - TInternal: der normalisierte Typ (Controller/FC), default = TExternal\n *\n * Phantom-Keys `__input_${K}` tragen den externen Typ auf Type-Ebene.\n * Der feste Phantom-Key `__propInternal__` trägt TInternal für eine zuverlässige Inferenz.\n */\nexport type Prop<K extends string, TExternal, TInternal> = {\n\t[P in K]: TInternal;\n} & {\n\t[P in K as `__input_${P}`]?: TExternal;\n} & {\n\treadonly __propInternal__?: TInternal;\n};\n\n/**\n * Shorthand for Prop when external and internal types are identical.\n *\n * - K: der Property-Name\n * - T: der Typ (verwendet für externe und interne Nutzung)\n */\nexport type SimpleProp<K extends string, T> = Prop<K, T, T>;\n\nexport type InternalPropValue<P extends Prop<string, unknown, unknown>> = NonNullable<P['__propInternal__']>;\n\nexport type PropDefinition<TInternal> = {\n\tnormalize: (value: unknown) => TInternal | never;\n\tvalidate: (value: TInternal) => boolean;\n};\n\nexport function createPropDefinition<P extends Prop<string, unknown, unknown>>(\n\tnormalize: (value: unknown) => InternalPropValue<P> | never,\n\tvalidate: (value: InternalPropValue<P>) => boolean,\n): PropDefinition<InternalPropValue<P>> {\n\treturn {\n\t\tnormalize,\n\t\tvalidate,\n\t};\n}\n\nexport function withValidPropValue<P extends Prop<string, unknown, unknown>>(\n\tpropDef: PropDefinition<InternalPropValue<P>>,\n\tvalue: unknown,\n\tcallback: (normalized: InternalPropValue<P>) => void,\n): void {\n\ttry {\n\t\tconst normalized = propDef.normalize(value);\n\t\tif (propDef.validate(normalized)) {\n\t\t\tcallback(normalized);\n\t\t}\n\t} catch (e) {\n\t\tLog.debug(e);\n\t}\n}\n","import { isObject } from '../../../schema';\n\nexport function normalizeString(value?: unknown): string | never {\n\tif (typeof value === 'string') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'number' || typeof value === 'boolean' || typeof value === 'bigint') {\n\t\treturn String(value);\n\t}\n\tthrow new Error(`Invalid string: ${value as string}`);\n}\n\nexport function normalizeInteger(value?: unknown): number | never {\n\tif (typeof value === 'number') {\n\t\treturn Number.isInteger(value) ? value : Math.round(value);\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = parseInt(value, 10);\n\t\tif (!isNaN(parsed)) {\n\t\t\treturn parsed;\n\t\t}\n\t}\n\tthrow new Error(`Invalid integer: ${value as string}`);\n}\n\nexport function normalizeNumber(value?: unknown): number | never {\n\tif (typeof value === 'number') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = Number(value);\n\t\tif (!isNaN(parsed)) {\n\t\t\treturn parsed;\n\t\t}\n\t}\n\tthrow new Error(`Invalid number: ${value as string}`);\n}\n\nexport function normalizeBoolean(value?: unknown): boolean | never {\n\tif (typeof value === 'boolean') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'string') {\n\t\treturn value.toLowerCase() === 'true';\n\t}\n\tthrow new Error(`Invalid boolean: ${value as string}`);\n}\n\nexport function normalizeObject(value?: unknown): object | never {\n\tif (isObject(value)) {\n\t\treturn value as object;\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = JSON.parse(value) as unknown;\n\t\tif (isObject(parsed)) {\n\t\t\treturn parsed as object;\n\t\t}\n\t}\n\tthrow new Error(`Invalid object: ${value as string}`);\n}\n\nexport function normalizeArray(value?: unknown): unknown[] | never {\n\tif (isObject(value) && Array.isArray(value)) {\n\t\treturn value as unknown[];\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = JSON.parse(value) as unknown;\n\t\tif (isObject(parsed) && Array.isArray(parsed)) {\n\t\t\treturn parsed as unknown[];\n\t\t}\n\t}\n\tthrow new Error(`Invalid array: ${value as string}`);\n}\n","import type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\nexport type LabelProp = SimpleProp<'label', string>;\nexport const labelProp = createPropDefinition<LabelProp>(normalizeString, (v) => v.length >= 2 && v.length <= 80);\n","import type { ComponentApi, InternalOf, ResolvedProps, StrictFields } from './generic-types';\n\ntype InternalStates<Api extends ComponentApi> = InternalOf<NonNullable<Api['States']>>;\n\nexport abstract class BaseController<Api extends ComponentApi> {\n\tpublic constructor(\n\t\tprotected readonly component: InternalStates<Api>,\n\t\tprivate readonly props: StrictFields<ResolvedProps<Api>>,\n\t) {}\n\n\tprotected setProp<K extends keyof ResolvedProps<Api>>(key: K, value: StrictFields<ResolvedProps<Api>>[K]): void {\n\t\tthis.props[key] = value;\n\t}\n\n\tpublic getProps(): StrictFields<ResolvedProps<Api>> {\n\t\treturn this.props;\n\t}\n\n\tprotected setState<K extends keyof InternalStates<Api>>(key: K, value: InternalStates<Api>[K]): void {\n\t\t(this.component as Record<string, unknown>)[key as string] = value;\n\t}\n}\n"],"names":["Log"],"mappings":";;;;;;;AAmCgB,SAAA,oBAAoB,CACnC,SAA2D,EAC3D,QAAkD,EAAA;IAElD,OAAO;QACN,SAAS;QACT,QAAQ;KACR;AACF;SAEgB,kBAAkB,CACjC,OAA6C,EAC7C,KAAc,EACd,QAAoD,EAAA;AAEpD,IAAA,IAAI;QACH,MAAM,UAAU,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC;AAC3C,QAAA,IAAI,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;YACjC,QAAQ,CAAC,UAAU,CAAC;;;IAEpB,OAAO,CAAC,EAAE;AACX,QAAAA,UAAG,CAAC,KAAK,CAAC,CAAC,CAAC;;AAEd;;ACxDM,SAAU,eAAe,CAAC,KAAe,EAAA;AAC9C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC9B,QAAA,OAAO,KAAK;;AAEb,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,SAAS,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AACzF,QAAA,OAAO,MAAM,CAAC,KAAK,CAAC;;AAErB,IAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,KAAe,CAAA,CAAE,CAAC;AACtD;AAEM,SAAU,gBAAgB,CAAC,KAAe,EAAA;AAC/C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC9B,QAAA,OAAO,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;;AAE3D,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC9B,MAAM,MAAM,GAAG,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC;AAClC,QAAA,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;AACnB,YAAA,OAAO,MAAM;;;AAGf,IAAA,MAAM,IAAI,KAAK,CAAC,oBAAoB,KAAe,CAAA,CAAE,CAAC;AACvD;;AClBa,MAAA,SAAS,GAAG,oBAAoB,CAAY,eAAe,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,EAAE;;MCD1F,cAAc,CAAA;IACnC,WACoB,CAAA,SAA8B,EAChC,KAAuC,EAAA;AADrC,QAAA,IAAS,CAAA,SAAA,GAAT,SAAS;AACX,QAAA,IAAK,CAAA,KAAA,GAAL,KAAK;;IAGb,OAAO,CAAqC,GAAM,EAAE,KAA0C,EAAA;AACvG,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,KAAK;;IAGjB,QAAQ,GAAA;QACd,OAAO,IAAI,CAAC,KAAK;;IAGR,QAAQ,CAAsC,GAAM,EAAE,KAA6B,EAAA;AAC3F,QAAA,IAAI,CAAC,SAAqC,CAAC,GAAa,CAAC,GAAG,KAAK;;AAEnE;;;;;;;;;"}

package/dist/esm/base-controller-BGteZxSE.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-import{L as Log}from"./common-BIkdAxr0.js";function createPropDefinition(r,t){return{normalize:r,validate:t}}function withValidPropValue(r,t,e){try{const n=r.normalize(t);r.validate(n)&&e(n)}catch(r){Log.debug(r)}}function normalizeString(r){if("string"==typeof r)return r;if("number"==typeof r||"boolean"==typeof r||"bigint"==typeof r)return String(r);throw new Error(`Invalid string: ${r}`)}function normalizeInteger(r){if("number"==typeof r)return Number.isInteger(r)?r:Math.round(r);if("string"==typeof r){const t=parseInt(r,10);if(!isNaN(t))return t}throw new Error(`Invalid integer: ${r}`)}const labelProp=createPropDefinition(normalizeString,r=>r.length>=2&&r.length<=80);class BaseController{constructor(r,t){this.component=r,this.props=t}setProp(r,t){this.props[r]=t}getProps(){return this.props}setState(r,t){this.component[r]=t}}export{BaseController as B,normalizeInteger as a,createPropDefinition as c,labelProp as l,normalizeString as n,withValidPropValue as w};

package/dist/esm/base-controller-BGteZxSE.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"base-controller-BGteZxSE.js","sources":["src/internal/props/helpers/factory.ts","src/internal/props/helpers/normalizers.ts","src/internal/props/label.ts","src/internal/functional-components/base-controller.ts"],"sourcesContent":["import { Log } from '../../../schema';\n\n/**\n * Definiert einen Prop-Typ mit internem und externem Typ.\n *\n * - K: der Property-Name\n * - TExternal: der externe Eingabe-Typ (Web Component)\n * - TInternal: der normalisierte Typ (Controller/FC), default = TExternal\n *\n * Phantom-Keys `__input_${K}` tragen den externen Typ auf Type-Ebene.\n * Der feste Phantom-Key `__propInternal__` trägt TInternal für eine zuverlässige Inferenz.\n */\nexport type Prop<K extends string, TExternal, TInternal> = {\n\t[P in K]: TInternal;\n} & {\n\t[P in K as `__input_${P}`]?: TExternal;\n} & {\n\treadonly __propInternal__?: TInternal;\n};\n\n/**\n * Shorthand for Prop when external and internal types are identical.\n *\n * - K: der Property-Name\n * - T: der Typ (verwendet für externe und interne Nutzung)\n */\nexport type SimpleProp<K extends string, T> = Prop<K, T, T>;\n\nexport type InternalPropValue<P extends Prop<string, unknown, unknown>> = NonNullable<P['__propInternal__']>;\n\nexport type PropDefinition<TInternal> = {\n\tnormalize: (value: unknown) => TInternal | never;\n\tvalidate: (value: TInternal) => boolean;\n};\n\nexport function createPropDefinition<P extends Prop<string, unknown, unknown>>(\n\tnormalize: (value: unknown) => InternalPropValue<P> | never,\n\tvalidate: (value: InternalPropValue<P>) => boolean,\n): PropDefinition<InternalPropValue<P>> {\n\treturn {\n\t\tnormalize,\n\t\tvalidate,\n\t};\n}\n\nexport function withValidPropValue<P extends Prop<string, unknown, unknown>>(\n\tpropDef: PropDefinition<InternalPropValue<P>>,\n\tvalue: unknown,\n\tcallback: (normalized: InternalPropValue<P>) => void,\n): void {\n\ttry {\n\t\tconst normalized = propDef.normalize(value);\n\t\tif (propDef.validate(normalized)) {\n\t\t\tcallback(normalized);\n\t\t}\n\t} catch (e) {\n\t\tLog.debug(e);\n\t}\n}\n","import { isObject } from '../../../schema';\n\nexport function normalizeString(value?: unknown): string | never {\n\tif (typeof value === 'string') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'number' || typeof value === 'boolean' || typeof value === 'bigint') {\n\t\treturn String(value);\n\t}\n\tthrow new Error(`Invalid string: ${value as string}`);\n}\n\nexport function normalizeInteger(value?: unknown): number | never {\n\tif (typeof value === 'number') {\n\t\treturn Number.isInteger(value) ? value : Math.round(value);\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = parseInt(value, 10);\n\t\tif (!isNaN(parsed)) {\n\t\t\treturn parsed;\n\t\t}\n\t}\n\tthrow new Error(`Invalid integer: ${value as string}`);\n}\n\nexport function normalizeNumber(value?: unknown): number | never {\n\tif (typeof value === 'number') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = Number(value);\n\t\tif (!isNaN(parsed)) {\n\t\t\treturn parsed;\n\t\t}\n\t}\n\tthrow new Error(`Invalid number: ${value as string}`);\n}\n\nexport function normalizeBoolean(value?: unknown): boolean | never {\n\tif (typeof value === 'boolean') {\n\t\treturn value;\n\t}\n\tif (typeof value === 'string') {\n\t\treturn value.toLowerCase() === 'true';\n\t}\n\tthrow new Error(`Invalid boolean: ${value as string}`);\n}\n\nexport function normalizeObject(value?: unknown): object | never {\n\tif (isObject(value)) {\n\t\treturn value as object;\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = JSON.parse(value) as unknown;\n\t\tif (isObject(parsed)) {\n\t\t\treturn parsed as object;\n\t\t}\n\t}\n\tthrow new Error(`Invalid object: ${value as string}`);\n}\n\nexport function normalizeArray(value?: unknown): unknown[] | never {\n\tif (isObject(value) && Array.isArray(value)) {\n\t\treturn value as unknown[];\n\t}\n\tif (typeof value === 'string') {\n\t\tconst parsed = JSON.parse(value) as unknown;\n\t\tif (isObject(parsed) && Array.isArray(parsed)) {\n\t\t\treturn parsed as unknown[];\n\t\t}\n\t}\n\tthrow new Error(`Invalid array: ${value as string}`);\n}\n","import type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\nexport type LabelProp = SimpleProp<'label', string>;\nexport const labelProp = createPropDefinition<LabelProp>(normalizeString, (v) => v.length >= 2 && v.length <= 80);\n","import type { ComponentApi, InternalOf, ResolvedProps, StrictFields } from './generic-types';\n\ntype InternalStates<Api extends ComponentApi> = InternalOf<NonNullable<Api['States']>>;\n\nexport abstract class BaseController<Api extends ComponentApi> {\n\tpublic constructor(\n\t\tprotected readonly component: InternalStates<Api>,\n\t\tprivate readonly props: StrictFields<ResolvedProps<Api>>,\n\t) {}\n\n\tprotected setProp<K extends keyof ResolvedProps<Api>>(key: K, value: StrictFields<ResolvedProps<Api>>[K]): void {\n\t\tthis.props[key] = value;\n\t}\n\n\tpublic getProps(): StrictFields<ResolvedProps<Api>> {\n\t\treturn this.props;\n\t}\n\n\tprotected setState<K extends keyof InternalStates<Api>>(key: K, value: InternalStates<Api>[K]): void {\n\t\t(this.component as Record<string, unknown>)[key as string] = value;\n\t}\n}\n"],"names":[],"mappings":";;;;;AAmCgB,SAAA,oBAAoB,CACnC,SAA2D,EAC3D,QAAkD,EAAA;IAElD,OAAO;QACN,SAAS;QACT,QAAQ;KACR;AACF;SAEgB,kBAAkB,CACjC,OAA6C,EAC7C,KAAc,EACd,QAAoD,EAAA;AAEpD,IAAA,IAAI;QACH,MAAM,UAAU,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC;AAC3C,QAAA,IAAI,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE;YACjC,QAAQ,CAAC,UAAU,CAAC;;;IAEpB,OAAO,CAAC,EAAE;AACX,QAAA,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;;AAEd;;ACxDM,SAAU,eAAe,CAAC,KAAe,EAAA;AAC9C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC9B,QAAA,OAAO,KAAK;;AAEb,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,OAAO,KAAK,KAAK,SAAS,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AACzF,QAAA,OAAO,MAAM,CAAC,KAAK,CAAC;;AAErB,IAAA,MAAM,IAAI,KAAK,CAAC,mBAAmB,KAAe,CAAA,CAAE,CAAC;AACtD;AAEM,SAAU,gBAAgB,CAAC,KAAe,EAAA;AAC/C,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC9B,QAAA,OAAO,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;;AAE3D,IAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC9B,MAAM,MAAM,GAAG,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC;AAClC,QAAA,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,EAAE;AACnB,YAAA,OAAO,MAAM;;;AAGf,IAAA,MAAM,IAAI,KAAK,CAAC,oBAAoB,KAAe,CAAA,CAAE,CAAC;AACvD;;AClBa,MAAA,SAAS,GAAG,oBAAoB,CAAY,eAAe,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,EAAE;;MCD1F,cAAc,CAAA;IACnC,WACoB,CAAA,SAA8B,EAChC,KAAuC,EAAA;AADrC,QAAA,IAAS,CAAA,SAAA,GAAT,SAAS;AACX,QAAA,IAAK,CAAA,KAAA,GAAL,KAAK;;IAGb,OAAO,CAAqC,GAAM,EAAE,KAA0C,EAAA;AACvG,QAAA,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,KAAK;;IAGjB,QAAQ,GAAA;QACd,OAAO,IAAI,CAAC,KAAK;;IAGR,QAAQ,CAAsC,GAAM,EAAE,KAA6B,EAAA;AAC3F,QAAA,IAAI,CAAC,SAAqC,CAAC,GAAa,CAAC,GAAG,KAAK;;AAEnE;;;;"}

package/dist/kolibri/CustomSuggestionsOptionsGroup-C0pEClOW.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-import{h as o}from"./index-CTfYKeaf.js";import{c as e}from"./clsx-COFh-Vc8.js";const s=({disabled:s,index:n,ref:i,selected:t,onClick:l,onMouseOver:r,onFocus:u,onKeyDown:a,option:d,searchTerm:c})=>o("li",{id:`option-${n}`,key:`-${n}`,ref:i,"data-index":n,tabIndex:-1,role:"option","aria-selected":t?"true":void 0,"aria-disabled":s?"true":void 0,onClick:l,onMouseOver:r,onFocus:u,class:e("kol-custom-suggestions-option",{"kol-custom-suggestions-option--disabled":s}),onKeyDown:a},o("span",null,((s,e)=>{if(!(null==e?void 0:e.trim()))return s;const n=new RegExp(`(${e.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");return s.split(n).map((s,e)=>e%2==1?o("mark",null,s):s)})(String(d),c||""))),n=({blockSuggestionMouseOver:s,onKeyDown:n,style:i,hidden:t},l)=>o("ul",{role:"listbox",style:i,class:e("kol-custom-suggestions-options-group",{"kol-custom-suggestions-options-group--cursor-hidden":s,"kol-custom-suggestions-options-group--open":!t}),hidden:t,onKeyDown:n},l);export{n as C,s as a};

package/dist/kolibri/FieldControlStateWrapper-BCNYRgaN.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-import{_ as o}from"./tslib.es6-CxX45GIN.js";import{h as l,F as e}from"./index-CTfYKeaf.js";import"./common-BIkdAxr0.js";import{b as t,s as i}from"./reuse-CX4AQDkS.js";import{b as s,K as n,c as r,g as a,i as d}from"./FormFieldStateWrapper--onY0vtr.js";import{c}from"./clsx-COFh-Vc8.js";const f=(e,s)=>{var{class:i}=e,r=o(e,["class"]);return l("div",Object.assign({class:c("kol-field-control__input",i)},r),s)},b=(b,p)=>{const{class:h,id:u,disabled:g,label:_,hideLabel:m,labelAlign:y,renderNoTooltip:k,hint:C,renderNoHint:K,tooltipAlign:j,accessKey:O,shortKey:A,msg:B,touched:v,required:P,readonly:x,fieldControlInputProps:N,fieldControlLabelProps:q,fieldControlTooltipProps:L,fieldControlHintProps:T}=b,F=o(b,["class","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","tooltipAlign","accessKey","shortKey","msg","touched","required","readonly","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps"]),H=!K,I=!k,S=i(_),X=I&&!S&&m,Y=t(O,A),$=[l(e,null,l(f,Object.assign({},N),p),X&&l(s,Object.assign({},L||{},{id:u,label:_,align:j,badgeText:Y}))),l(n,Object.assign({},q||{},{id:u,baseClassName:"kol-field-control",class:c(null==q?void 0:q.class,{"kol-field-control__label--visually-hidden":Boolean(m)}),hasExpertSlot:S,label:_,accessKey:O,shortKey:A}))];"left"===y&&$.reverse();const D={"kol-field-control--disabled":Boolean(g),"kol-field-control--required":Boolean(P),"kol-field-control--touched":Boolean(v),"kol-field-control--hide-label":Boolean(m),"kol-field-control--read-only":Boolean(x),[`kol-field-control--${a(B)}`]:Boolean(d(B,v)),[`kol-field-control--label-align-${y}`]:Boolean(y)};return l("div",Object.assign({class:c("kol-field-control",D,h)},F),$,H&&l(r,Object.assign({},T||{},{baseClassName:"kol-field-control",id:u,hint:C})))};function p(l){const e={id:l._id,disabled:l._disabled,msg:l._msg,hint:l._hint,label:l._label,hideLabel:l._hideLabel,touched:l._touched};return"_required"in l&&(e.required=l._required),"_readOnly"in l&&(e.readonly=l._readOnly),"_labelAlign"in l&&(e.labelAlign=l._labelAlign),"_accessKey"in l&&(e.accessKey=l._accessKey),"_shortKey"in l&&(e.shortKey=l._shortKey),e}const u=(e,s)=>{var{state:i}=e,r=o(e,["state"]);return l(b,Object.assign({},p(i),r),s)};export{u as F};

package/dist/kolibri/Icon-DfgbH-hb.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-import{h as s}from"./index-CTfYKeaf.js";import{d as o}from"./component-names-CqTpXVIM.js";const n=n=>{const{class:e,style:l,icons:a,label:c,onClick:t}=n;return s(o,{class:e,style:l,onClick:t,_icons:a,_label:c})};export{n as K};

package/dist/kolibri/Input-CnEOkt-P.js

@@ -1,4 +0,0 @@
-/*!
- * KoliBri - The accessible HTML-Standard
- */
-import{_ as e}from"./tslib.es6-CxX45GIN.js";import{h as s,F as o}from"./index-CTfYKeaf.js";import"./common-BIkdAxr0.js";import{i as a,d as l,g as i}from"./FormFieldStateWrapper--onY0vtr.js";import{c as r}from"./clsx-COFh-Vc8.js";const t=t=>{const{class:d,msg:n,required:u,disabled:c,touched:b,readonly:p,ariaDescribedBy:m,hideLabel:g,label:h,suggestions:j,value:y}=t,B=e(t,["class","msg","required","disabled","touched","readonly","ariaDescribedBy","hideLabel","label","suggestions","value"]),k={"kol-input--disabled":Boolean(c),"kol-input--required":Boolean(u),"kol-input--touched":Boolean(b),"kol-input--readonly":Boolean(p),[`kol-input--${i(n)}`]:a(n,b)},f=Object.assign(Object.assign({class:r("kol-input",k,d),required:u,disabled:c,readonly:p,type:"text",list:j?`${B.id}-list`:void 0},l({ariaDescribedBy:m,hideLabel:g,label:h})),B);return s(o,null,s("input",Object.assign({},f,{value:y})),j)};export{t as I};