@masterteam/components 0.0.165 → 0.0.166

package/fesm2022/masterteam-components-entities.mjs

@@ -9,6 +9,7 @@ import { SecureImagePipe, UploadField } from '@masterteam/components/upload-fiel
 import { Progress } from '@masterteam/components/progress';
 import * as i1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
+import { TranslocoService } from '@jsverse/transloco';
 import { Button } from '@masterteam/components/button';
 import { forkJoin, finalize, of, take, switchMap, EMPTY, map, catchError } from 'rxjs';
 import * as i1$1 from 'primeng/tooltip';
@@ -434,6 +435,7 @@ class EntityAttachment {
     endPoint = input('uploader', ...(ngDevMode ? [{ debugName: "endPoint" }] : /* istanbul ignore next */ []));
     context = input(undefined, ...(ngDevMode ? [{ debugName: "context" }] : /* istanbul ignore next */ []));
     httpClient = inject(HttpClient);
+    transloco = inject(TranslocoService);
     displayName = computed(() => this.data()?.name ?? this.name() ?? '', ...(ngDevMode ? [{ debugName: "displayName" }] : /* istanbul ignore next */ []));
     loading = signal(false, ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
     attachments = signal([], ...(ngDevMode ? [{ debugName: "attachments" }] : /* istanbul ignore next */ []));
@@ -497,7 +499,10 @@ class EntityAttachment {
         return (attachment.id ?? attachment.fileName ?? attachment.name ?? String(index));
     }
     attachmentTooltip(attachment) {
-        return (attachment.name ?? attachment.fileName ?? attachment.id ?? 'Attachment');
+        return (attachment.name ??
+            attachment.fileName ??
+            attachment.id ??
+            this.transloco.translate('components.entitiesPreview.attachment'));
     }
     attachmentIcon(attachment) {
         const extension = this.resolveExtension(attachment);
@@ -941,21 +946,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
                     }, template: "@if (comparison(); as cmp) {\n  <div class=\"flex w-full min-w-0 items-stretch gap-3\">\n    <div\n      class=\"flex min-w-0 flex-1 flex-col gap-1 rounded-md border border-surface-200 bg-surface-50 px-3 py-2\"\n    >\n      <span class=\"text-xs font-medium uppercase tracking-wide text-muted-color\"\n        >Before</span\n      >\n      @if (oldEntity(); as old) {\n        <mt-entity-preview-body [data]=\"old\" />\n      } @else {\n        <span class=\"text-sm text-muted-color\">_</span>\n      }\n    </div>\n    <div class=\"flex shrink-0 items-center text-muted-color\" aria-hidden=\"true\">\n      &rarr;\n    </div>\n    <div\n      class=\"flex min-w-0 flex-1 flex-col gap-1 rounded-md border border-primary-200 bg-primary-50 px-3 py-2\"\n    >\n      <span class=\"text-xs font-medium uppercase tracking-wide text-primary-600\"\n        >After</span\n      >\n      @if (newEntity(); as next) {\n        <mt-entity-preview-body [data]=\"next\" />\n      } @else {\n        <span class=\"text-sm text-muted-color\">_</span>\n      }\n    </div>\n  </div>\n}\n" }]
         }], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: true }] }] } });
 
-const OPERATION_BADGES = {
+const OPERATION_BADGE_KEYS = {
     CreateRecord: {
-        label: 'Added',
+        key: 'components.comparisonEntities.added',
         classes: 'bg-emerald-50 text-emerald-700 ring-1 ring-inset ring-emerald-200',
     },
     UpdateRecord: {
-        label: 'Updated',
+        key: 'components.comparisonEntities.updated',
         classes: 'bg-amber-50 text-amber-700 ring-1 ring-inset ring-amber-200',
     },
     DeleteRecord: {
-        label: 'Removed',
+        key: 'components.comparisonEntities.removed',
         classes: 'bg-rose-50 text-rose-700 ring-1 ring-inset ring-rose-200',
     },
 };
 class ComparisonEntityList {
+    transloco = inject(TranslocoService);
     data = input.required(...(ngDevMode ? [{ debugName: "data" }] : /* istanbul ignore next */ []));
     comparison = computed(() => {
         const c = this.data().comparison;
@@ -965,7 +971,11 @@ class ComparisonEntityList {
     targetModuleKey = computed(() => this.comparison()?.targetModuleKey ?? '', ...(ngDevMode ? [{ debugName: "targetModuleKey" }] : /* istanbul ignore next */ []));
     label = computed(() => this.data().name ?? '', ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
     badgeFor(op) {
-        return OPERATION_BADGES[op];
+        const config = OPERATION_BADGE_KEYS[op];
+        return {
+            label: this.transloco.translate(config.key),
+            classes: config.classes,
+        };
     }
     displayField(value, display) {
         if (display && display.trim().length > 0)
@@ -1013,6 +1023,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
 
 const EMPTY_KEY_SET = new Set();
 class EntitiesPreview {
+    transloco = inject(TranslocoService);
     /** Array of entity data to display */
     entities = input.required(...(ngDevMode ? [{ debugName: "entities" }] : /* istanbul ignore next */ []));
     attachmentShape = input('default', ...(ngDevMode ? [{ debugName: "attachmentShape" }] : /* istanbul ignore next */ []));
@@ -1030,9 +1041,9 @@ class EntitiesPreview {
      */
     activeKeys = input(EMPTY_KEY_SET, ...(ngDevMode ? [{ debugName: "activeKeys" }] : /* istanbul ignore next */ []));
     /** Tooltip text shown on hover when an entity is clickable but not active. */
-    clickableTooltip = input('Click to filter by this value', ...(ngDevMode ? [{ debugName: "clickableTooltip" }] : /* istanbul ignore next */ []));
+    clickableTooltip = input(this.transloco.translate('components.entitiesPreview.filterByThis'), ...(ngDevMode ? [{ debugName: "clickableTooltip" }] : /* istanbul ignore next */ []));
     /** Tooltip text shown on hover when an entity is the current active filter. */
-    activeTooltip = input('Click to clear filter', ...(ngDevMode ? [{ debugName: "activeTooltip" }] : /* istanbul ignore next */ []));
+    activeTooltip = input(this.transloco.translate('components.entitiesPreview.clearFilter'), ...(ngDevMode ? [{ debugName: "activeTooltip" }] : /* istanbul ignore next */ []));
     /**
      * Emits when an individual entity slot is clicked. Only fires when the
      * entity's key is present in `clickableKeys`.