@xiriframework/xiri-ng 0.2.26 → 0.2.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xiriframework/xiri-ng",
-  "version": "0.2.26",
+  "version": "0.2.28",
   "description": "Angular UI component library for the Xiri Framework",
   "license": "Apache-2.0",
   "repository": {
@@ -54,5 +54,6 @@
       "types": "./types/xiriframework-xiri-ng.d.ts",
       "default": "./fesm2022/xiriframework-xiri-ng.mjs"
     }
-  }
+  },
+  "type": "module"
 }

package/skills/xiri-ng-expert/SKILL.md

@@ -0,0 +1,393 @@
+---
+name: xiri-ng-expert
+description: Experte für die xiri-ng Angular-Library. Verwende diesen Skill IMMER wenn Angular-Code geschrieben wird der @xiriframework/xiri-ng importiert, oder wenn der User nach xiri-Komponenten (xiri-dyncomponent, xiri-form-fields, xiri-table, xiri-card usw.), XiriDataService, XiriSnackbarService, provideXiriServices, Form-Feldern mit showWhen-Bedingungen, oder Server-Side-Tables fragt.
+---
+
+# xiri-ng Expert
+
+Du bist Experte für die **xiri-ng** Library (`@xiriframework/xiri-ng`) — eine Angular-21-Komponentenbibliothek, die vom Go-Backend (`xiri-go`) erzeugte JSON-Strukturen in Material-Design-3-UIs rendert.
+
+**Wichtig:** Diese Datei enthält die häufigsten API-Signaturen. Lies `references/*.md` **nur** wenn du eine Komponente oder ein Feature brauchst, das hier nicht dokumentiert ist.
+
+## Architektur
+
+Backend-JSON → `xiri-dyncomponent` → Standalone-Components → Material Design 3.
+
+- **Angular 21** mit Standalone-Components, Signals, OnPush, `input()`/`output()` API
+- **Angular Material 3** mit SCSS-Theming (`ThemeService` mit `mode`-Signal)
+- **Reactive Forms** (`UntypedFormGroup`) für `XiriFormFieldsComponent`
+- **JSON-Driven**: Backend schickt `XiriDynData[]` → Frontend rendert per `xiri-dyncomponent`
+- **Public API**: `projects/xiri-ng/src/public-api.ts` — jede Komponente, jedes Interface wird dort exportiert
+
+## Setup — provideXiriServices
+
+```typescript
+import { provideXiriServices } from '@xiriframework/xiri-ng';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideHttpClient(),
+    provideXiriServices({ api: '/api/' }),   // Default: '/api/'
+  ],
+};
+```
+
+Alle Services sind `providedIn: 'root'` (automatisch verfügbar nach Provider-Registrierung).
+
+## Services — Quick Reference
+
+```typescript
+import {
+  XiriDataService, XiriSnackbarService, XiriResponseHandlerService,
+  XiriFormService, XiriDownloadService, XiriDateService, XiriNumberService,
+  XiriLocalStorageService, XiriSessionStorageService, ThemeService,
+} from '@xiriframework/xiri-ng';
+
+// HTTP-Client mit Snackbar-Integration
+data.get(url): Observable<Object>
+data.post(url, payload): Observable<any>
+data.postFile(url, payload): Observable<any>                   // responseType blob
+data.postFileResponse(url, payload): Observable<HttpResponse>  // für download service
+data.getConfigApi(): string                                    // Base-URL
+
+// Toast-Notifications
+snackbar.success(msg, duration?, action?)
+snackbar.error(msg, duration?, action?)
+snackbar.info(msg, duration?, action?)
+snackbar.warning(msg, duration?, action?)
+snackbar.handleResponse(response): boolean   // parst response.message + response.messageType
+
+// Backend-Response-Handler (navigation / page-refresh / table-refresh)
+responseHandler.handle(result, { onTableRefresh?, onTableUpdate? })
+
+// File-Download
+download.download(httpResponse, filename, openInNewTab): boolean
+
+// Theme (Signal-basiert)
+theme.mode          // Signal<'light' | 'dark' | 'auto'>
+theme.isDark        // computed Signal<boolean>
+theme.setTheme('dark' | 'light' | 'auto')
+theme.toggle()
+theme.resetToAuto()
+
+// Storage — wrapper mit in-memory-Fallback
+localStorage.set(name, value)
+localStorage.get(name)
+localStorage.getTimeout(name, maxSeconds)   // null wenn älter
+localStorage.remove(name)
+localStorage.clear()
+// XiriSessionStorageService hat gleiche API
+```
+
+## xiri-dyncomponent — der JSON-Renderer
+
+```html
+<xiri-dyncomponent [data]="components" [filterData]="filter"></xiri-dyncomponent>
+```
+
+```typescript
+import { XiriDynData } from '@xiriframework/xiri-ng';
+
+components: XiriDynData[] = [
+  { type: 'card', data: { header: 'Titel', fields: [...], data: {...} } },
+  { type: 'table', data: { url: '/api/items', fields: [...] } },
+  { type: 'stat', data: { value: 42, label: 'Offen' } },
+];
+
+// type ist einer von:
+// card | buttonline | table | cardlink | links | form | query
+// stepper | header | list | spacer | container | infopoint | multiprogress
+// imagetext | tabs | expansion | infotext | html | stat | empty-state
+// timeline | page-header | section | divider | stat-grid | toolbar
+// description-list | barchart   (barchart benötigt zusätzlich `mode`)
+```
+
+## xiri-form-fields — Forms
+
+```html
+<xiri-form-fields
+  [form]="fields"
+  [display]="'full'"
+  [disabled]="submitting()"
+  (formChange)="onFormChange($event)">
+</xiri-form-fields>
+```
+
+```typescript
+import { XiriFormField } from '@xiriframework/xiri-ng';
+
+fields: XiriFormField[] = [
+  { id: 'name',  type: 'text',   name: 'Name',   required: true, validations: [...] },
+  { id: 'email', type: 'text',   subtype: 'email', name: 'E-Mail' },
+  { id: 'group', type: 'model',  name: 'Gruppe', url: '/api/groups' },
+  { id: 'active',type: 'bool',   name: 'Aktiv',  value: true },
+  { id: 'desc',  type: 'textarea', name: 'Beschreibung', rows: 4,
+    showWhen: { field: 'active', operator: 'equals', value: true } },
+];
+```
+
+Verfügbare `type`-Werte: `text`, `email`, `password`, `textarea`, `number`, `bool`, `select`, `object`, `model`, `multiselect`, `treeselect`, `date`, `datetime`, `daterange`, `datetimerange`, `file`, `volume`, `timelimit`, `chips`, `question`, `waiting`, `header`.
+
+`display` = `'full' | 'line' | 'small'` — Layout-Modus.
+
+**showWhen-Operators:** `equals`, `notEquals`, `contains`, `greaterThan`, `lessThan`, `in`, `notEmpty`.
+
+Zugriff auf die reactive Form:
+
+```typescript
+@ViewChild(XiriFormFieldsComponent) fieldsCmp!: XiriFormFieldsComponent;
+
+submit() {
+  const values = this.fieldsCmp.formGroup.value;
+  if (this.fieldsCmp.formGroup.valid) { ... }
+}
+```
+
+## xiri-form — Backend-integriertes Formular
+
+```html
+<xiri-form [settings]="{
+  url: '/api/users/add',
+  load: true,
+  header: 'Neuer User'
+}"></xiri-form>
+```
+
+Lädt Felder + Buttons vom Backend, submit → POST → response-handler navigiert/refresht.
+
+## xiri-table — volle Datentabelle
+
+```html
+<xiri-table [settings]="tableSettings" (clickedRow)="openEdit($event)"></xiri-table>
+```
+
+```typescript
+tableSettings = {
+  url: '/api/devices',
+  serverSide: true,
+  options: {
+    pagination: true, itemsPerPage: 50, sort: true, search: true,
+    saveState: true, saveStateId: 'devices-table',
+    select: true, selectButtons: [ ... ],
+    editUrl: '/api/devices/inline-edit',
+    buttons: { buttons: [...], class: 'small' },
+  },
+  fields: [
+    { id: 'id',     name: 'ID',     format: 'number' },
+    { id: 'name',   name: 'Name',   search: true, sort: true, sticky: true },
+    { id: 'status', name: 'Status', format: 'icon', icons: [...] },
+    { id: 'count',  name: 'Anzahl', format: 'number', webformat: 'integer', align: 'right', footer: 'sum' },
+    { id: 'note',   name: 'Notiz',  editable: true, inputType: 'text' },
+  ],
+};
+```
+
+Öffentliche Methoden: `reload()`, `searchDo(text)`, `startInlineEdit(row, column)`, `cancelInlineEdit()`, `saveInlineEdit(row, column)`, `selection` (SelectionModel), `isAllSelected()`, `masterToggle()`.
+
+## xiri-raw-table — minimale Tabelle
+
+```html
+<xiri-raw-table [settings]="{ data: rows, fields: cols, dense: 8 }"></xiri-raw-table>
+```
+
+Keine Pagination, kein Sort, keine API — nur Daten rendern.
+
+## xiri-query — Suchformular mit Live-Ergebnis
+
+```html
+<xiri-query [settings]="{
+  fields: filterFields,
+  url: '/api/search',
+  collapsed: false,
+  saveState: true, saveStateId: 'search-x',
+  buttonline: { ... }
+}" (change)="onFilterChange($event)"></xiri-query>
+```
+
+Debounce 300ms, ergebnis unter dem Filter als `XiriDynData[]`.
+
+## xiri-dialog — Modal-Dialog
+
+```typescript
+import { MatDialog } from '@angular/material/dialog';
+import { XiriDialogComponent } from '@xiriframework/xiri-ng';
+
+constructor(private dialog: MatDialog) {}
+
+open() {
+  this.dialog.open(XiriDialogComponent, {
+    data: { url: '/api/user/edit/42', type: 'form', size: '800px' },
+  });
+}
+```
+
+`type`: `'form' | 'data' | 'question' | 'waiting' | 'table'`.
+
+## xiri-button / xiri-buttonline
+
+```typescript
+import { XiriButton, XiriButtonResult } from '@xiriframework/xiri-ng';
+
+buttons: XiriButton[] = [
+  { text: 'Speichern', type: 'raised', color: 'primary', action: 'api',
+    url: '/api/save', default: true },
+  { text: 'Löschen',  type: 'flat', color: 'warn', action: 'dialog',
+    url: '/api/delete/confirm' },
+  { text: 'Zurück',   type: 'flat', action: 'back' },
+];
+```
+
+```html
+<xiri-buttonline [settings]="{ buttons, class: 'small' }"
+                 [filterData]="filter"
+                 (result)="onResult($event)"></xiri-buttonline>
+```
+
+`action`: `'api' | 'dialog' | 'download' | 'link' | 'back' | 'close' | 'return' | 'menu' | …`.
+
+`data?: Record<string, any>` — Custom-Payload, das beim Klick mit `filterData` gemerged in den POST-Body geht (für `action: 'api'` / `'download'`). Der Backend-Builder (`xiri-go`) setzt das via `button.WithData(...)`. Beispiel: CSV-Download-Button hat `data: { _csv: true }`, das Backend liest das Flag in `LoadFilterData` und schaltet auf CSV-Output.
+
+## xiri-stepper — Multi-Step Wizard
+
+```typescript
+stepperSettings = {
+  url: '/api/onboarding',
+  steps: [
+    { title: 'Daten',   fields: [...], buttons: [...] },
+    { title: 'Kontakt', fields: [...], buttons: [...] },
+    { title: 'Review',  fields: [...], buttons: [...], extra: { finalize: true } },
+  ],
+};
+```
+
+## Layout / Container
+
+```html
+<xiri-page-header [settings]="{ title: 'Users', subtitle: '42 aktiv',
+                                 icon: 'group', buttons: { buttons: [...] } }"/>
+<xiri-toolbar [settings]="{ title: 'Items', search: true, buttons: {...} }"
+              (searchChanged)="onSearch($event)"/>
+<xiri-section [settings]="{ title: 'Details', collapsible: true, components: [...] }"/>
+<xiri-divider [settings]="{ text: 'Weitere Optionen', spacing: 'normal' }"/>
+<xiri-tabs [settings]="{ tabs: [...], lazy: true }"/>
+<xiri-expansion [settings]="{ panels: [...], multi: false, lazy: true }"/>
+<xiri-sidenav [settings]="{ prefix: '/app/', fields: navItems }"/>
+<xiri-breadcrumb [settings]="breadcrumbItems"/>
+<xiri-skeleton type="table-row" [lines]="5" [columns]="4"/>
+<xiri-empty-state [settings]="{ icon: 'inbox', title: 'Leer', button: {...} }"/>
+```
+
+## Info / Display
+
+```html
+<xiri-stat [settings]="{ value: 1234, label: 'Umsatz', prefix: '€', color: 'primary',
+                         trend: { value: 12, direction: 'up' } }"/>
+<xiri-stat-grid [settings]="{ stats: [...], columns: 4, title: 'KPIs' }"/>
+<xiri-timeline [settings]="{ items: [...], orientation: 'vertical' }"/>
+<xiri-barchart mode="simple"  [settings]="{ title: 'Weekly', yMin: 0, yMax: 12, color: 'purple',
+                                            bars: [{ label: 'M', name: 'Monday', value: 3 }, ...] }"/>
+<xiri-barchart mode="stacked" [settings]="{ bars: [{ label: 'M', name: 'Monday',
+                                            segments: [{ value: 2, color: 'green', name: 'Low strain' }, ...] }] }"/>
+<xiri-barchart mode="heatmap" [settings]="{ points: [{ time: 1700000000000, value: 1, name: 'Repeat #1' }, ...] }"/>
+<!-- echarts ist optional peerDependency: nur installieren wenn xiri-barchart genutzt wird -->
+<xiri-description-list [settings]="{ items: [...], columns: 2, layout: 'horizontal' }"/>
+<xiri-list [settings]="{ sections: [...] }"/>
+<xiri-infopoint [settings]="{ text: 'Info', info: 'Detail', icon: 'info', iconColor: 'primary' }"/>
+<xiri-multiprogress [settings]="{ data: [...], show: 5, header: 'Top 5' }"/>
+<xiri-imagetext [settings]="{ url: '/img.png', info: '...', header: '...' }"/>
+<xiri-header [settings]="{ text: 'Abschnitt', color: 'primary', size: 'h2' }"/>
+<xiri-card [settings]="{ url: '/api/overview', header: 'Übersicht', collapsible: true }"/>
+<xiri-cardlink [settings]="{ link: '/app/users', icon: 'group', iconSet: '', text: 'Users' }"/>
+<xiri-links [settings]="{ data: [...], header: 'Schnellzugriff' }"/>
+<xiri-done/>
+<xiri-error text="Fehler beim Laden"/>
+```
+
+## Farben
+
+```typescript
+import { XiriColor } from '@xiriframework/xiri-ng';
+
+// Theme: 'primary' | 'secondary' | 'tertiary' | 'accent' | 'warn' | 'error' | 'success'
+// Extended: 'emerald' | 'red' | 'yellow' | 'green' | 'blue' | 'purple'
+//   'gray' | 'lightgray' | 'darkgray' | 'orange' | 'white' | 'black' | 'inherit'
+```
+
+## Pipes
+
+```html
+{{ htmlString | safeHtml }}   <!-- bypass DomSanitizer -->
+```
+
+## Typische Patterns
+
+### 1. Seite rendert Backend-JSON
+
+```typescript
+@Component({
+  selector: 'app-overview',
+  imports: [XiriDynComponentComponent],
+  template: `<xiri-dyncomponent [data]="components()"/>`,
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class OverviewComponent {
+  private data = inject(XiriDataService);
+  components = signal<XiriDynData[]>([]);
+
+  ngOnInit() {
+    this.data.get('/api/overview').subscribe((res: any) => this.components.set(res.data));
+  }
+}
+```
+
+### 2. Form mit showWhen + Submit
+
+```typescript
+onSubmit() {
+  if (this.fieldsCmp.formGroup.invalid) return;
+  this.data.post('/api/save', this.fieldsCmp.formGroup.value)
+    .subscribe(res => this.responseHandler.handle(res));
+}
+```
+
+### 3. Server-Side-Table mit Refresh nach Edit
+
+```typescript
+@ViewChild(XiriTableComponent) table!: XiriTableComponent;
+
+onEditSaved(res: any) {
+  this.responseHandler.handle(res, {
+    onTableRefresh: () => this.table.reload(),
+  });
+}
+```
+
+### 4. Dialog öffnen für Edit
+
+```typescript
+edit(row: any) {
+  this.dialog.open(XiriDialogComponent, {
+    data: { url: `/api/items/edit/${row.id}`, type: 'form', size: '700px' },
+  }).afterClosed().subscribe(() => this.table.reload());
+}
+```
+
+## Wann Reference-Dateien lesen
+
+| Datei                       | Wann                                                             |
+| --------------------------- | ---------------------------------------------------------------- |
+| `references/setup.md`       | Alle Services im Detail (Methoden-Signaturen, Rückgabe-Typen)    |
+| `references/dyncomponent.md`| Vollständige XiriDynData-Type-Liste + Custom-Rendering           |
+| `references/form-fields.md` | Jeder Feldtyp im Detail, alle Validator-Keys, select-Directive   |
+| `references/table.md`       | Table-Options-Felder, Inline-Edit, Selection, Footer-Aggregation |
+| `references/components.md`  | Kompakte Signatur-Liste aller 30+ Komponenten                    |
+| `references/theming-i18n.md`| ThemeService, Colors, Date/Number-Locale-Propagation             |
+
+## Was NICHT tun
+
+- Nicht `{ ... }`-Casts statt typisierter Interfaces (nutze `XiriDynData`, `XiriFormField`, `XiriTableField`)
+- Nicht `NgModule` — alle xiri-Komponenten sind **standalone**
+- Nicht `ChangeDetectionStrategy.Default` ohne Grund — `OnPush` ist Convention
+- Nicht `FormBuilder` direkt — `XiriFormFieldsComponent` baut die `UntypedFormGroup` selbst
+- Nicht API-Calls in Templates — in Component-Code via `XiriDataService`
+- Keine erfundenen Selectors / Inputs — wenn unsicher, `public-api.ts` lesen

package/skills/xiri-ng-expert/evals/evals.json

@@ -0,0 +1,64 @@
+{
+  "skill_name": "xiri-ng-expert",
+  "evals": [
+    {
+      "id": 0,
+      "prompt": "Erstelle eine Angular-Standalone-Komponente, die vom Backend ein JSON-Array von XiriDynData lädt (/api/dashboard) und per xiri-dyncomponent rendert. Nutze XiriDataService, OnPush und Signals.",
+      "expected_output": "Standalone component with @Component decorator, imports XiriDynComponentComponent, injects XiriDataService, uses signal<XiriDynData[]>, loads via data.get(), uses OnPush change detection.",
+      "assertions": [
+        {"name": "standalone_component", "type": "code_check", "description": "Component ist standalone: true (Default in Angular 21) oder imports[] ist gesetzt"},
+        {"name": "uses_xiri_dyncomponent", "type": "code_check", "description": "Template enthält <xiri-dyncomponent [data]=... und XiriDynComponentComponent ist in imports"},
+        {"name": "uses_data_service", "type": "code_check", "description": "Injects XiriDataService via inject() oder constructor und ruft .get('/api/dashboard') auf"},
+        {"name": "uses_signals", "type": "code_check", "description": "Nutzt signal<XiriDynData[]>([]) für Daten-State und .set() zum Aktualisieren"},
+        {"name": "onpush_strategy", "type": "code_check", "description": "changeDetection: ChangeDetectionStrategy.OnPush"},
+        {"name": "correct_types", "type": "code_check", "description": "Importiert XiriDynData und nutzt es als Typ, keine any-Flut"},
+        {"name": "no_invented_api", "type": "code_check", "description": "Nutzt nur public-api.ts-Exports, keine erfundenen Services/Methoden"}
+      ],
+      "files": []
+    },
+    {
+      "id": 1,
+      "prompt": "Baue ein Add-Formular mit XiriFormFieldsComponent für ein Fahrzeug: Felder name (text, required), group (model via /api/groups), active (bool, default true), note (textarea, nur sichtbar wenn active=false). Submit-Button postet an /api/vehicles/add und handled die Response.",
+      "expected_output": "Component with XiriFormFieldsComponent in template, defines XiriFormField[] with correct types and validations, showWhen for note, submit method uses fieldsCmp.formGroup.valid + fieldsCmp.formGroup.value, posts via XiriDataService, handles response via XiriResponseHandlerService.",
+      "assertions": [
+        {"name": "uses_form_fields_component", "type": "code_check", "description": "Template enthält <xiri-form-fields [form]=... (formChange)=..."},
+        {"name": "correct_field_types", "type": "code_check", "description": "name: type='text', group: type='model' mit url, active: type='bool', note: type='textarea'"},
+        {"name": "has_required_validation", "type": "code_check", "description": "name hat required: true oder validations mit type: 'required'"},
+        {"name": "uses_show_when", "type": "code_check", "description": "note-Feld hat showWhen mit field: 'active', operator: 'equals', value: false"},
+        {"name": "viewchild_form_group", "type": "code_check", "description": "@ViewChild auf XiriFormFieldsComponent und Zugriff auf .formGroup.valid / .formGroup.value beim Submit"},
+        {"name": "submits_via_data_service", "type": "code_check", "description": "XiriDataService.post('/api/vehicles/add', ...) wird im Submit-Handler aufgerufen"},
+        {"name": "handles_response", "type": "code_check", "description": "XiriResponseHandlerService.handle(res) wird nach erfolgreichem Submit aufgerufen"}
+      ],
+      "files": []
+    },
+    {
+      "id": 2,
+      "prompt": "Baue eine Device-Übersicht mit xiri-page-header, einem xiri-query als Filter, und darunter einer xiri-table mit Server-Side-Pagination. Bei Klick auf eine Row öffnet sich ein Edit-Dialog. Nach erfolgreichem Edit wird die Tabelle reloaded.",
+      "expected_output": "Component with XiriPageHeaderComponent, XiriQueryComponent and XiriTableComponent in template. Filter from query drives filterData on table. clickedRow output opens XiriDialogComponent via MatDialog. afterClosed reloads table.",
+      "assertions": [
+        {"name": "uses_page_header", "type": "code_check", "description": "xiri-page-header mit settings.title gesetzt"},
+        {"name": "uses_xiri_query", "type": "code_check", "description": "xiri-query mit XiriQuerySettings (fields, url, collapsed optional)"},
+        {"name": "server_side_table", "type": "code_check", "description": "xiri-table mit settings.options.serverSide: true, pagination aktiv, settings.url gesetzt"},
+        {"name": "filter_wiring", "type": "code_check", "description": "query (change)-Output wird an table [filterData] oder einer Signal/Property gebunden"},
+        {"name": "row_click_opens_dialog", "type": "code_check", "description": "(clickedRow) Event-Handler öffnet via MatDialog.open(XiriDialogComponent, { data: { type: 'form', url: ... } })"},
+        {"name": "reload_after_edit", "type": "code_check", "description": "dialogRef.afterClosed().subscribe ruft @ViewChild XiriTableComponent.reload() auf"},
+        {"name": "correct_imports", "type": "code_check", "description": "Alle benötigten Komponenten in imports[] deklariert"}
+      ],
+      "files": []
+    },
+    {
+      "id": 3,
+      "prompt": "Schreibe einen app.config.ts Eintrag, der xiri-ng korrekt initialisiert (api base '/api/v2/'), mit HttpClient, Router, und einem ThemeService-Toggle-Button in einer Header-Komponente die den aktuellen Theme-Mode-Signal anzeigt.",
+      "expected_output": "ApplicationConfig mit provideHttpClient, provideRouter, provideXiriServices({ api: '/api/v2/' }). Separate Header-Component injects ThemeService, uses theme.mode() signal in template for conditional display, calls theme.toggle() on button click.",
+      "assertions": [
+        {"name": "provide_xiri_services", "type": "code_check", "description": "appConfig.providers enthält provideXiriServices({ api: '/api/v2/' })"},
+        {"name": "provide_http_client", "type": "code_check", "description": "provideHttpClient() ist vor provideXiriServices registriert"},
+        {"name": "injects_theme_service", "type": "code_check", "description": "Header-Component nutzt inject(ThemeService)"},
+        {"name": "uses_mode_signal", "type": "code_check", "description": "Template liest theme.mode() oder theme.isDark() als Signal-Call"},
+        {"name": "toggle_method", "type": "code_check", "description": "Button ruft theme.toggle() auf"},
+        {"name": "correct_provider_import", "type": "code_check", "description": "provideXiriServices importiert aus '@xiriframework/xiri-ng'"}
+      ],
+      "files": []
+    }
+  ]
+}