@maro-tech/card 0.1.14 → 0.1.16

package/fesm2022/maro-tech-card.mjs

@@ -9,7 +9,7 @@ import Panzoom from '@panzoom/panzoom';
 import * as i1 from 'lucide-angular';
 import { Download, LucideAngularModule, Eye, FileText, Plus, Sparkles, Trash } from 'lucide-angular';
 import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
-import { map, shareReplay, forkJoin, switchMap, timer, of } from 'rxjs';
+import { map, shareReplay, forkJoin, switchMap, timer, of, firstValueFrom } from 'rxjs';
 import { UiTableComponent } from '@maro-tech/table';
 import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { map as map$1, exhaustMap, catchError, takeWhile, takeUntil, finalize } from 'rxjs/operators';
@@ -126,11 +126,15 @@ class CardSectionHeaderComponent {
             <ui-button
               [variant]="i === 0 ? 'primary' : 'ghost'"
               [icon]="action.icon || ''"
+              [iconOnly]="!!action.iconOnly"
+              [ariaLabel]="action.ariaLabel || action.label"
               size="sm"
               [disabled]="isActionPending(action)"
               (click)="onActionClick(action)"
             >
-              {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+              @if (!action.iconOnly) {
+                {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+              }
             </ui-button>
           }
         </div>
@@ -149,11 +153,15 @@ class CardSectionHeaderComponent {
               <ui-button
                 [variant]="i === 0 ? 'primary' : 'ghost'"
                 [icon]="action.icon || ''"
+                [iconOnly]="!!action.iconOnly"
+                [ariaLabel]="action.ariaLabel || action.label"
                 size="sm"
                 [disabled]="isActionPending(action)"
                 (click)="onActionClick(action)"
               >
-                {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+                @if (!action.iconOnly) {
+                  {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+                }
               </ui-button>
             }
           </div>
@@ -176,11 +184,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
             <ui-button
               [variant]="i === 0 ? 'primary' : 'ghost'"
               [icon]="action.icon || ''"
+              [iconOnly]="!!action.iconOnly"
+              [ariaLabel]="action.ariaLabel || action.label"
               size="sm"
               [disabled]="isActionPending(action)"
               (click)="onActionClick(action)"
             >
-              {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+              @if (!action.iconOnly) {
+                {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+              }
             </ui-button>
           }
         </div>
@@ -199,11 +211,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
               <ui-button
                 [variant]="i === 0 ? 'primary' : 'ghost'"
                 [icon]="action.icon || ''"
+                [iconOnly]="!!action.iconOnly"
+                [ariaLabel]="action.ariaLabel || action.label"
                 size="sm"
                 [disabled]="isActionPending(action)"
                 (click)="onActionClick(action)"
               >
-                {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+                @if (!action.iconOnly) {
+                  {{ isActionPending(action) ? 'Зачекайте...' : action.label }}
+                }
               </ui-button>
             }
           </div>
@@ -1586,9 +1602,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImpo
 
 class HistoryTabComponent {
     entity = input('', ...(ngDevMode ? [{ debugName: "entity" }] : /* istanbul ignore next */ []));
-    primaryEntity = input('', ...(ngDevMode ? [{ debugName: "primaryEntity" }] : /* istanbul ignore next */ []));
     id = input('', ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
-    entityLabels = input({}, ...(ngDevMode ? [{ debugName: "entityLabels" }] : /* istanbul ignore next */ []));
+    config = input({}, ...(ngDevMode ? [{ debugName: "config" }] : /* istanbul ignore next */ []));
     operations = signal([], ...(ngDevMode ? [{ debugName: "operations" }] : /* istanbul ignore next */ []));
     isLoading = signal(false, ...(ngDevMode ? [{ debugName: "isLoading" }] : /* istanbul ignore next */ []));
     hasError = signal(false, ...(ngDevMode ? [{ debugName: "hasError" }] : /* istanbul ignore next */ []));
@@ -1602,6 +1617,7 @@ class HistoryTabComponent {
     destroyRef = inject(DestroyRef);
     refreshSequence = signal(0, ...(ngDevMode ? [{ debugName: "refreshSequence" }] : /* istanbul ignore next */ []));
     lastRequestKey = '';
+    dictionaryCache = new Map();
     constructor() {
         this.eventBus.on(ENTITY_UPDATED)
             .pipe(takeUntilDestroyed(this.destroyRef))
@@ -1650,8 +1666,10 @@ class HistoryTabComponent {
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe({
             next: (operations) => {
-                this.operations.set(operations || []);
-                this.isLoading.set(false);
+                void this.prepareOperations(operations || []).then((prepared) => {
+                    this.operations.set(prepared);
+                    this.isLoading.set(false);
+                });
             },
             error: () => {
                 this.operations.set([]);
@@ -1660,6 +1678,109 @@ class HistoryTabComponent {
             },
         });
     }, ...(ngDevMode ? [{ debugName: "loadEffect" }] : /* istanbul ignore next */ []));
+    async prepareOperations(operations) {
+        return Promise.all(operations.map(async (operation) => ({
+            ...operation,
+            changes: await Promise.all((operation.changes || []).map(async (change) => {
+                const raw = this.extractRawFields(change.changedFields);
+                const fields = this.config().fields || {};
+                const visible = Object.keys(fields).length
+                    ? Object.entries(raw).filter(([field]) => !!this.getFieldConfig(change.entityType, field))
+                    : Object.entries(raw);
+                const changedFields = {};
+                for (const [field, values] of visible) {
+                    const config = this.getFieldConfig(change.entityType, field) || {};
+                    changedFields[field] = {
+                        label: config.label || field,
+                        type: config.type || 'text',
+                        from: await this.toDisplayValue(values.from, config),
+                        to: await this.toDisplayValue(values.to, config),
+                    };
+                }
+                return { ...change, changedFields };
+            })),
+        })));
+    }
+    extractRawFields(fields) {
+        return Object.fromEntries(Object.entries(fields || {}).map(([key, field]) => {
+            const from = field?.from;
+            const to = field?.to;
+            return [key, {
+                    from: from && typeof from === 'object' && 'value' in from ? from.value : from,
+                    to: to && typeof to === 'object' && 'value' in to ? to.value : to,
+                }];
+        }));
+    }
+    getFieldConfig(entityType, field) {
+        const fields = this.config().fields || {};
+        const candidates = [field, field.replace(/[A-Z]/g, (letter) => `_${letter.toLowerCase()}`), field.replace(/_([a-z])/g, (_, letter) => letter.toUpperCase())];
+        for (const candidate of candidates) {
+            const config = fields[`${entityType}.${candidate}`];
+            if (config)
+                return config;
+        }
+        return undefined;
+    }
+    async toDisplayValue(value, config) {
+        const display = await this.resolveDisplay(value, config);
+        const result = {
+            value: value ?? null,
+            display,
+            ...(config.displayMode === 'structured' ? { structured: this.toStructuredItems(value, config.itemFields) } : {}),
+        };
+        if (config.link && value !== null && value !== undefined && value !== '')
+            result.url = config.link.replace('{value}', encodeURIComponent(String(value)));
+        if (config.type === 'file' && value)
+            result.url = `/api/files/${encodeURIComponent(String(value))}`;
+        return result;
+    }
+    async resolveDisplay(value, config) {
+        if (value === null || value === undefined || value === '')
+            return 'Не задано';
+        const values = Array.isArray(value) ? value : [value];
+        return (await Promise.all(values.map(async (item) => config.data && item !== null && item !== undefined && item !== ''
+            ? this.resolveDictionary(config.data, String(item))
+            : typeof item === 'object' ? JSON.stringify(item) : String(item)))).filter(Boolean).join(', ') || 'Не задано';
+    }
+    resolveDictionary(name, key) {
+        const cacheKey = `${name}:${key}`;
+        const cached = this.dictionaryCache.get(cacheKey);
+        if (cached)
+            return cached;
+        const request = firstValueFrom(this.http.get(cardApiResourceUrl(this.baseUrl, `/api/suggest/${encodeURIComponent(name)}/${encodeURIComponent(key)}`)))
+            .then((item) => item?.label || key).catch(() => key);
+        this.dictionaryCache.set(cacheKey, request);
+        return request;
+    }
+    toStructuredItems(value, itemFields) {
+        const values = Array.isArray(value) ? value : value && typeof value === 'object' ? [value] : [];
+        return values.map((item, index) => {
+            if (!item || typeof item !== 'object' || Array.isArray(item)) {
+                const display = String(item ?? 'Не задано');
+                return { key: `${index}:${display}`, fields: [{ key: 'value', label: 'Значение', value: item, display }] };
+            }
+            const record = item;
+            const entries = itemFields ? Object.entries(itemFields).filter(([key]) => key in record) : Object.entries(record);
+            const seenLabels = new Set();
+            return {
+                key: String(record['id'] || record['key'] || index),
+                fields: entries.flatMap(([key, rawFieldConfig]) => {
+                    const fieldConfig = rawFieldConfig;
+                    const value = record[key];
+                    const label = fieldConfig.label || key;
+                    if (value === null || value === undefined || value === '' || seenLabels.has(label))
+                        return [];
+                    seenLabels.add(label);
+                    return [{
+                            key,
+                            label,
+                            value,
+                            display: typeof value === 'object' ? JSON.stringify(value) : String(value),
+                        }];
+                }),
+            };
+        });
+    }
     toggleOperation(id) {
         const next = new Set(this.expandedOperationIds());
         if (next.has(id))
@@ -1676,7 +1797,7 @@ class HistoryTabComponent {
             entity_files: 'Документ',
             files: 'Файл',
         };
-        return this.entityLabels()[entityType] || labels[entityType] || entityType;
+        return this.config().entities?.[entityType] || labels[entityType] || entityType;
     }
     getActionLabel(action) {
         const labels = {
@@ -1689,6 +1810,12 @@ class HistoryTabComponent {
     isImageField(field) {
         return field.type === 'image';
     }
+    isStructuredField(field) {
+        return Array.isArray(field.from.structured) || Array.isArray(field.to.structured);
+    }
+    getStructuredItems(value) {
+        return value.structured || [];
+    }
     isHtmlField(field) {
         return field.type === 'html';
     }
@@ -1722,23 +1849,23 @@ class HistoryTabComponent {
             .join(' · ');
     }
     getPrimaryChanges(operation) {
-        const primaryTypes = new Set([this.entity(), this.primaryEntity()].filter(Boolean));
+        const primaryTypes = new Set([this.entity(), this.config().primaryEntity].filter(Boolean));
         return (operation.changes || []).filter((change) => primaryTypes.has(change.entityType));
     }
     getRelatedChanges(operation) {
         const primaryChanges = this.getPrimaryChanges(operation);
-        const primaryTypes = new Set([this.entity(), this.primaryEntity()].filter(Boolean));
+        const primaryTypes = new Set([this.entity(), this.config().primaryEntity].filter(Boolean));
         return primaryChanges.length
             ? (operation.changes || []).filter((change) => !primaryTypes.has(change.entityType))
             : operation.changes || [];
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: HistoryTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: HistoryTabComponent, isStandalone: true, selector: "app-history-tab", inputs: { entity: { classPropertyName: "entity", publicName: "entity", isSignal: true, isRequired: false, transformFunction: null }, primaryEntity: { classPropertyName: "primaryEntity", publicName: "primaryEntity", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, entityLabels: { classPropertyName: "entityLabels", publicName: "entityLabels", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section class=\"space-y-4\">\n  @if (isLoading()) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F \u0456\u0441\u0442\u043E\u0440\u0456\u0457\u2026\n    </div>\n  } @else if (hasError()) {\n    <div class=\"rounded-2xl border border-red-200 bg-red-50 p-6 text-sm text-red-700\">\n      \u041D\u0435 \u0432\u0434\u0430\u043B\u043E\u0441\u044F \u0437\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0456\u0441\u0442\u043E\u0440\u0456\u044E \u0437\u043C\u0456\u043D.\n    </div>\n  } @else if (!operations().length) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0406\u0441\u0442\u043E\u0440\u0456\u044F \u0437\u043C\u0456\u043D \u043F\u043E\u043A\u0438 \u043F\u043E\u0440\u043E\u0436\u043D\u044F.\n    </div>\n  } @else {\n    <div class=\"space-y-3\">\n      @for (operation of operations(); track operation.id) {\n        <article class=\"rounded-2xl border border-slate-200 bg-white p-5 shadow-sm\">\n          <div class=\"flex flex-wrap items-start justify-between gap-3\">\n            <div>\n              <h3 class=\"text-sm font-semibold text-slate-900\">{{ operation.description }}</h3>\n              @if (operation.actorName) {\n                <p class=\"mt-1 text-sm text-slate-500\">{{ operation.actorName }}</p>\n              }\n            </div>\n            <time class=\"text-xs text-slate-400\" [dateTime]=\"operation.createdAt\">\n              {{ operation.createdAt | date: 'dd.MM.yyyy HH:mm' }}\n            </time>\n          </div>\n\n          @if (getPrimaryChanges(operation).length) {\n            <div class=\"mt-4 space-y-2 border-t border-slate-100 pt-4\">\n              @for (change of getPrimaryChanges(operation); track change.entityId + change.entityType) {\n                @for (field of (change.changedFields | keyvalue); track field.key) {\n                  <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                    <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                    @if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.from.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.from.display }}</span>\n                      }\n                    }\n                    <span class=\"text-slate-400\">\u2192</span>\n                    @if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.to.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                      }\n                    }\n                  </div>\n                }\n              }\n            </div>\n          }\n\n          @if (getRelatedChanges(operation).length) {\n            <div class=\"mt-4 border-t border-slate-100 pt-4\">\n              <button\n                type=\"button\"\n                class=\"flex w-full items-center justify-between gap-3 text-left text-sm text-slate-600\"\n                [attr.aria-expanded]=\"isExpanded(operation.id)\"\n                (click)=\"toggleOperation(operation.id)\"\n              >\n                <span>\n                  \u0414\u0435\u0442\u0430\u043B\u0456 \u0437\u043C\u0456\u043D:\n                  <span class=\"font-medium text-slate-900\">{{ getAffectedSummary(operation) }}</span>\n                </span>\n                <span class=\"text-lg leading-none text-slate-400\">{{ isExpanded(operation.id) ? '\u2212' : '+' }}</span>\n              </button>\n\n              @if (isExpanded(operation.id)) {\n                <div class=\"mt-4 space-y-4\">\n                  @for (change of getRelatedChanges(operation); track change.entityId + change.entityType) {\n                    <div class=\"rounded-xl bg-slate-50 p-3\">\n                      <p class=\"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500\">\n                        {{ getEntityLabel(change.entityType) }} \u00B7 {{ getActionLabel(change.action) }}\n                      </p>\n                      @for (field of (change.changedFields | keyvalue); track field.key) {\n                        <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                          <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                          @if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.from.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                            } @else {\n                              <span class=\"text-slate-400\">{{ field.value.from.display }}</span>\n                            }\n                          }\n                          <span class=\"text-slate-400\">\u2192</span>\n                          @if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.to.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                            }\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </article>\n      }\n    </div>\n  }\n</section>\n\n@if (isViewerOpen()) {\n  <app-images-viewer [urls]=\"viewerUrls()\" (closed)=\"closeImageViewer()\" />\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagesViewerComponent, selector: "app-images-viewer", inputs: ["urls", "initialIndex"], outputs: ["closed"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: HistoryTabComponent, isStandalone: true, selector: "app-history-tab", inputs: { entity: { classPropertyName: "entity", publicName: "entity", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<section class=\"space-y-4\">\n  @if (isLoading()) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F \u0456\u0441\u0442\u043E\u0440\u0456\u0457\u2026\n    </div>\n  } @else if (hasError()) {\n    <div class=\"rounded-2xl border border-red-200 bg-red-50 p-6 text-sm text-red-700\">\n      \u041D\u0435 \u0432\u0434\u0430\u043B\u043E\u0441\u044F \u0437\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0456\u0441\u0442\u043E\u0440\u0456\u044E \u0437\u043C\u0456\u043D.\n    </div>\n  } @else if (!operations().length) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0406\u0441\u0442\u043E\u0440\u0456\u044F \u0437\u043C\u0456\u043D \u043F\u043E\u043A\u0438 \u043F\u043E\u0440\u043E\u0436\u043D\u044F.\n    </div>\n  } @else {\n    <div class=\"space-y-3\">\n      @for (operation of operations(); track operation.id) {\n        <article class=\"rounded-2xl border border-slate-200 bg-white p-5 shadow-sm\">\n          <div class=\"flex flex-wrap items-start justify-between gap-3\">\n            <div>\n              <h3 class=\"text-sm font-semibold text-slate-900\">{{ operation.description }}</h3>\n              @if (operation.actorName) {\n                <p class=\"mt-1 text-sm text-slate-500\">{{ operation.actorName }}</p>\n              }\n            </div>\n            <time class=\"text-xs text-slate-400\" [dateTime]=\"operation.createdAt\">\n              {{ operation.createdAt | date: 'dd.MM.yyyy HH:mm' }}\n            </time>\n          </div>\n\n          @if (getPrimaryChanges(operation).length) {\n            <div class=\"mt-4 space-y-2 border-t border-slate-100 pt-4\">\n              @for (change of getPrimaryChanges(operation); track change.entityId + change.entityType) {\n                @for (field of (change.changedFields | keyvalue); track field.key) {\n                  <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                    <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                    @if (isStructuredField(field.value)) {\n                      @if (getStructuredItems(field.value.from).length) {\n                        <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                          <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0411\u0443\u043B\u043E</div>\n                          @for (item of getStructuredItems(field.value.from); track item.key) {\n                            <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                              @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                            </div>\n                          }\n                        </div>\n                      } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                    } @else if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.from.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.from.display }}</span>\n                      }\n                    }\n                    <span class=\"mx-1 shrink-0 text-lg font-semibold text-slate-500\">\u2192</span>\n                    @if (isStructuredField(field.value)) {\n                      @if (getStructuredItems(field.value.to).length) {\n                        <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                          <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0421\u0442\u0430\u043B\u043E</div>\n                          @for (item of getStructuredItems(field.value.to); track item.key) {\n                            <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                              @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                            </div>\n                          }\n                        </div>\n                      } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                    } @else if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.to.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                      }\n                    }\n                  </div>\n                }\n              }\n            </div>\n          }\n\n          @if (getRelatedChanges(operation).length) {\n            <div class=\"mt-4 border-t border-slate-100 pt-4\">\n              <button\n                type=\"button\"\n                class=\"flex w-full items-center justify-between gap-3 text-left text-sm text-slate-600\"\n                [attr.aria-expanded]=\"isExpanded(operation.id)\"\n                (click)=\"toggleOperation(operation.id)\"\n              >\n                <span>\n                  \u0414\u0435\u0442\u0430\u043B\u0456 \u0437\u043C\u0456\u043D:\n                  <span class=\"font-medium text-slate-900\">{{ getAffectedSummary(operation) }}</span>\n                </span>\n                <span class=\"text-lg leading-none text-slate-400\">{{ isExpanded(operation.id) ? '\u2212' : '+' }}</span>\n              </button>\n\n              @if (isExpanded(operation.id)) {\n                <div class=\"mt-4 space-y-4\">\n                  @for (change of getRelatedChanges(operation); track change.entityId + change.entityType) {\n                    <div class=\"rounded-xl bg-slate-50 p-3\">\n                      <p class=\"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500\">\n                        {{ getEntityLabel(change.entityType) }} \u00B7 {{ getActionLabel(change.action) }}\n                      </p>\n                      @for (field of (change.changedFields | keyvalue); track field.key) {\n                        <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                          <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                          @if (isStructuredField(field.value)) {\n                            @if (getStructuredItems(field.value.from).length) {\n                              <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                                <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0411\u0443\u043B\u043E</div>\n                                @for (item of getStructuredItems(field.value.from); track item.key) {\n                                  <div class=\"rounded-lg border border-slate-200 bg-white px-2 py-1 text-xs text-slate-600\">\n                                    @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                                  </div>\n                                }\n                              </div>\n                            } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                          } @else if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.from.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                            } @else {\n                              <span class=\"text-slate-400\">{{ field.value.from.display }}</span>\n                            }\n                          }\n                          <span class=\"mx-1 shrink-0 text-lg font-semibold text-slate-500\">\u2192</span>\n                          @if (isStructuredField(field.value)) {\n                            @if (getStructuredItems(field.value.to).length) {\n                              <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                                <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0421\u0442\u0430\u043B\u043E</div>\n                                @for (item of getStructuredItems(field.value.to); track item.key) {\n                                  <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                                    @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                                  </div>\n                                }\n                              </div>\n                            } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                          } @else if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.to.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                            }\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </article>\n      }\n    </div>\n  }\n</section>\n\n@if (isViewerOpen()) {\n  <app-images-viewer [urls]=\"viewerUrls()\" (closed)=\"closeImageViewer()\" />\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ImagesViewerComponent, selector: "app-images-viewer", inputs: ["urls", "initialIndex"], outputs: ["closed"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: i1$1.KeyValuePipe, name: "keyvalue" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: HistoryTabComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-history-tab', standalone: true, imports: [CommonModule, ImagesViewerComponent, RouterLink], template: "<section class=\"space-y-4\">\n  @if (isLoading()) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F \u0456\u0441\u0442\u043E\u0440\u0456\u0457\u2026\n    </div>\n  } @else if (hasError()) {\n    <div class=\"rounded-2xl border border-red-200 bg-red-50 p-6 text-sm text-red-700\">\n      \u041D\u0435 \u0432\u0434\u0430\u043B\u043E\u0441\u044F \u0437\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0456\u0441\u0442\u043E\u0440\u0456\u044E \u0437\u043C\u0456\u043D.\n    </div>\n  } @else if (!operations().length) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0406\u0441\u0442\u043E\u0440\u0456\u044F \u0437\u043C\u0456\u043D \u043F\u043E\u043A\u0438 \u043F\u043E\u0440\u043E\u0436\u043D\u044F.\n    </div>\n  } @else {\n    <div class=\"space-y-3\">\n      @for (operation of operations(); track operation.id) {\n        <article class=\"rounded-2xl border border-slate-200 bg-white p-5 shadow-sm\">\n          <div class=\"flex flex-wrap items-start justify-between gap-3\">\n            <div>\n              <h3 class=\"text-sm font-semibold text-slate-900\">{{ operation.description }}</h3>\n              @if (operation.actorName) {\n                <p class=\"mt-1 text-sm text-slate-500\">{{ operation.actorName }}</p>\n              }\n            </div>\n            <time class=\"text-xs text-slate-400\" [dateTime]=\"operation.createdAt\">\n              {{ operation.createdAt | date: 'dd.MM.yyyy HH:mm' }}\n            </time>\n          </div>\n\n          @if (getPrimaryChanges(operation).length) {\n            <div class=\"mt-4 space-y-2 border-t border-slate-100 pt-4\">\n              @for (change of getPrimaryChanges(operation); track change.entityId + change.entityType) {\n                @for (field of (change.changedFields | keyvalue); track field.key) {\n                  <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                    <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                    @if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.from.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.from.display }}</span>\n                      }\n                    }\n                    <span class=\"text-slate-400\">\u2192</span>\n                    @if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.to.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                      }\n                    }\n                  </div>\n                }\n              }\n            </div>\n          }\n\n          @if (getRelatedChanges(operation).length) {\n            <div class=\"mt-4 border-t border-slate-100 pt-4\">\n              <button\n                type=\"button\"\n                class=\"flex w-full items-center justify-between gap-3 text-left text-sm text-slate-600\"\n                [attr.aria-expanded]=\"isExpanded(operation.id)\"\n                (click)=\"toggleOperation(operation.id)\"\n              >\n                <span>\n                  \u0414\u0435\u0442\u0430\u043B\u0456 \u0437\u043C\u0456\u043D:\n                  <span class=\"font-medium text-slate-900\">{{ getAffectedSummary(operation) }}</span>\n                </span>\n                <span class=\"text-lg leading-none text-slate-400\">{{ isExpanded(operation.id) ? '\u2212' : '+' }}</span>\n              </button>\n\n              @if (isExpanded(operation.id)) {\n                <div class=\"mt-4 space-y-4\">\n                  @for (change of getRelatedChanges(operation); track change.entityId + change.entityType) {\n                    <div class=\"rounded-xl bg-slate-50 p-3\">\n                      <p class=\"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500\">\n                        {{ getEntityLabel(change.entityType) }} \u00B7 {{ getActionLabel(change.action) }}\n                      </p>\n                      @for (field of (change.changedFields | keyvalue); track field.key) {\n                        <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                          <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                          @if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.from.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                            } @else {\n                              <span class=\"text-slate-400\">{{ field.value.from.display }}</span>\n                            }\n                          }\n                          <span class=\"text-slate-400\">\u2192</span>\n                          @if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.to.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                            }\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </article>\n      }\n    </div>\n  }\n</section>\n\n@if (isViewerOpen()) {\n  <app-images-viewer [urls]=\"viewerUrls()\" (closed)=\"closeImageViewer()\" />\n}\n" }]
-        }], ctorParameters: () => [], propDecorators: { entity: [{ type: i0.Input, args: [{ isSignal: true, alias: "entity", required: false }] }], primaryEntity: [{ type: i0.Input, args: [{ isSignal: true, alias: "primaryEntity", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], entityLabels: [{ type: i0.Input, args: [{ isSignal: true, alias: "entityLabels", required: false }] }] } });
+            args: [{ selector: 'app-history-tab', standalone: true, imports: [CommonModule, ImagesViewerComponent, RouterLink], template: "<section class=\"space-y-4\">\n  @if (isLoading()) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0435\u043D\u043D\u044F \u0456\u0441\u0442\u043E\u0440\u0456\u0457\u2026\n    </div>\n  } @else if (hasError()) {\n    <div class=\"rounded-2xl border border-red-200 bg-red-50 p-6 text-sm text-red-700\">\n      \u041D\u0435 \u0432\u0434\u0430\u043B\u043E\u0441\u044F \u0437\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0456\u0441\u0442\u043E\u0440\u0456\u044E \u0437\u043C\u0456\u043D.\n    </div>\n  } @else if (!operations().length) {\n    <div class=\"rounded-2xl border border-slate-200 bg-white p-6 text-sm text-slate-500\">\n      \u0406\u0441\u0442\u043E\u0440\u0456\u044F \u0437\u043C\u0456\u043D \u043F\u043E\u043A\u0438 \u043F\u043E\u0440\u043E\u0436\u043D\u044F.\n    </div>\n  } @else {\n    <div class=\"space-y-3\">\n      @for (operation of operations(); track operation.id) {\n        <article class=\"rounded-2xl border border-slate-200 bg-white p-5 shadow-sm\">\n          <div class=\"flex flex-wrap items-start justify-between gap-3\">\n            <div>\n              <h3 class=\"text-sm font-semibold text-slate-900\">{{ operation.description }}</h3>\n              @if (operation.actorName) {\n                <p class=\"mt-1 text-sm text-slate-500\">{{ operation.actorName }}</p>\n              }\n            </div>\n            <time class=\"text-xs text-slate-400\" [dateTime]=\"operation.createdAt\">\n              {{ operation.createdAt | date: 'dd.MM.yyyy HH:mm' }}\n            </time>\n          </div>\n\n          @if (getPrimaryChanges(operation).length) {\n            <div class=\"mt-4 space-y-2 border-t border-slate-100 pt-4\">\n              @for (change of getPrimaryChanges(operation); track change.entityId + change.entityType) {\n                @for (field of (change.changedFields | keyvalue); track field.key) {\n                  <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                    <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                    @if (isStructuredField(field.value)) {\n                      @if (getStructuredItems(field.value.from).length) {\n                        <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                          <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0411\u0443\u043B\u043E</div>\n                          @for (item of getStructuredItems(field.value.from); track item.key) {\n                            <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                              @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                            </div>\n                          }\n                        </div>\n                      } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                    } @else if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.from.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                      } @else {\n                        <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.from.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.from.display }}</span>\n                      }\n                    }\n                    <span class=\"mx-1 shrink-0 text-lg font-semibold text-slate-500\">\u2192</span>\n                    @if (isStructuredField(field.value)) {\n                      @if (getStructuredItems(field.value.to).length) {\n                        <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                          <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0421\u0442\u0430\u043B\u043E</div>\n                          @for (item of getStructuredItems(field.value.to); track item.key) {\n                            <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                              @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                            </div>\n                          }\n                        </div>\n                      } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                    } @else if (isImageField(field.value)) {\n                      @if (getImageUrls(field.value.to.value).length) {\n                        <div class=\"flex flex-wrap items-center gap-2\">\n                          @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                            <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-slate-100\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                              <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                            </button>\n                          }\n                        </div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isFileField(field.value)) {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else if (isHtmlField(field.value)) {\n                      @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                        <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                      }\n                    } @else {\n                      @if (field.value.to.url) {\n                        <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                      } @else {\n                        <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                      }\n                    }\n                  </div>\n                }\n              }\n            </div>\n          }\n\n          @if (getRelatedChanges(operation).length) {\n            <div class=\"mt-4 border-t border-slate-100 pt-4\">\n              <button\n                type=\"button\"\n                class=\"flex w-full items-center justify-between gap-3 text-left text-sm text-slate-600\"\n                [attr.aria-expanded]=\"isExpanded(operation.id)\"\n                (click)=\"toggleOperation(operation.id)\"\n              >\n                <span>\n                  \u0414\u0435\u0442\u0430\u043B\u0456 \u0437\u043C\u0456\u043D:\n                  <span class=\"font-medium text-slate-900\">{{ getAffectedSummary(operation) }}</span>\n                </span>\n                <span class=\"text-lg leading-none text-slate-400\">{{ isExpanded(operation.id) ? '\u2212' : '+' }}</span>\n              </button>\n\n              @if (isExpanded(operation.id)) {\n                <div class=\"mt-4 space-y-4\">\n                  @for (change of getRelatedChanges(operation); track change.entityId + change.entityType) {\n                    <div class=\"rounded-xl bg-slate-50 p-3\">\n                      <p class=\"mb-2 text-xs font-semibold uppercase tracking-[0.16em] text-slate-500\">\n                        {{ getEntityLabel(change.entityType) }} \u00B7 {{ getActionLabel(change.action) }}\n                      </p>\n                      @for (field of (change.changedFields | keyvalue); track field.key) {\n                        <div class=\"flex flex-wrap items-center gap-2 text-sm\">\n                          <span class=\"font-medium text-slate-700\">{{ field.value.label }}</span>\n                          @if (isStructuredField(field.value)) {\n                            @if (getStructuredItems(field.value.from).length) {\n                              <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                                <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0411\u0443\u043B\u043E</div>\n                                @for (item of getStructuredItems(field.value.from); track item.key) {\n                                  <div class=\"rounded-lg border border-slate-200 bg-white px-2 py-1 text-xs text-slate-600\">\n                                    @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                                  </div>\n                                }\n                              </div>\n                            } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                          } @else if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.from.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.from.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.from.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u0441\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u0421\u0442\u0430\u0440\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [href]=\"field.value.from.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.from.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-500\" [innerHTML]=\"field.value.from.display\"></div>\n                            } @else {\n                              <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.from.url) {\n                              <a class=\"text-sky-700 underline\" [routerLink]=\"field.value.from.url\">{{ field.value.from.display }}</a>\n                            } @else {\n                              <span class=\"text-slate-400\">{{ field.value.from.display }}</span>\n                            }\n                          }\n                          <span class=\"mx-1 shrink-0 text-lg font-semibold text-slate-500\">\u2192</span>\n                          @if (isStructuredField(field.value)) {\n                            @if (getStructuredItems(field.value.to).length) {\n                              <div class=\"min-w-[16rem] flex-1 space-y-1\">\n                                <div class=\"text-[10px] font-semibold uppercase tracking-[0.16em] text-slate-400\">\u0421\u0442\u0430\u043B\u043E</div>\n                                @for (item of getStructuredItems(field.value.to); track item.key) {\n                                  <div class=\"rounded-lg border border-slate-200 bg-slate-50 px-2 py-1 text-xs text-slate-600\">\n                                    @for (itemField of item.fields; track itemField.key) {<span class=\"mr-2\"><span class=\"font-medium\">{{ itemField.label }}:</span> {{ itemField.display }}</span>}\n                                  </div>\n                                }\n                              </div>\n                            } @else { <span class=\"text-slate-400\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span> }\n                          } @else if (isImageField(field.value)) {\n                            @if (getImageUrls(field.value.to.value).length) {\n                              <div class=\"flex flex-wrap items-center gap-2\">\n                                @for (url of getImageUrls(field.value.to.value); track url; let imageIndex = $index) {\n                                  <button type=\"button\" class=\"h-14 w-14 overflow-hidden rounded-lg border border-slate-200 bg-white\" (click)=\"openImageViewer(getImageUrls(field.value.to.value))\" [attr.aria-label]=\"'\u0412\u0456\u0434\u043A\u0440\u0438\u0442\u0438 \u043D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\">\n                                    <img [src]=\"url\" [alt]=\"'\u041D\u043E\u0432\u0435 \u0444\u043E\u0442\u043E ' + (imageIndex + 1)\" class=\"h-full w-full object-cover\" />\n                                  </button>\n                                }\n                              </div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isFileField(field.value)) {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [href]=\"field.value.to.url\" target=\"_blank\" rel=\"noopener noreferrer\">\u0417\u0430\u0432\u0430\u043D\u0442\u0430\u0436\u0438\u0442\u0438 \u0444\u0430\u0439\u043B</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else if (isHtmlField(field.value)) {\n                            @if (field.value.to.display !== '\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E') {\n                              <div class=\"prose prose-sm max-w-none text-slate-900\" [innerHTML]=\"field.value.to.display\"></div>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">\u041D\u0435 \u0437\u0430\u0434\u0430\u043D\u043E</span>\n                            }\n                          } @else {\n                            @if (field.value.to.url) {\n                              <a class=\"font-medium text-sky-700 underline\" [routerLink]=\"field.value.to.url\">{{ field.value.to.display }}</a>\n                            } @else {\n                              <span class=\"font-medium text-slate-900\">{{ field.value.to.display }}</span>\n                            }\n                          }\n                        </div>\n                      }\n                    </div>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </article>\n      }\n    </div>\n  }\n</section>\n\n@if (isViewerOpen()) {\n  <app-images-viewer [urls]=\"viewerUrls()\" (closed)=\"closeImageViewer()\" />\n}\n" }]
+        }], ctorParameters: () => [], propDecorators: { entity: [{ type: i0.Input, args: [{ isSignal: true, alias: "entity", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], config: [{ type: i0.Input, args: [{ isSignal: true, alias: "config", required: false }] }] } });
 
 /**
  * Generated bundle index. Do not edit.