From fd4580f60da3db4e847b711c5c1c4f388f26693a Mon Sep 17 00:00:00 2001
From: Valentin Mihai <Valentin-Gabriel.Mihai.ext@knecon.com>
Date: Mon, 27 May 2024 13:21:05 +0300
Subject: [PATCH] RED-8342 - Component Editor not showing all values for a
 multi-value-component

---
 .../editable-input/editable-input.component.html     |  7 ++++---
 .../editable-input/editable-input.component.scss     |  4 ++++
 .../editable-input/editable-input.component.ts       | 12 ++++++------
 3 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/src/lib/inputs/editable-input/editable-input.component.html b/src/lib/inputs/editable-input/editable-input.component.html
index fe31cc8..40d1a3f 100644
--- a/src/lib/inputs/editable-input/editable-input.component.html
+++ b/src/lib/inputs/editable-input/editable-input.component.html
@@ -1,6 +1,7 @@
 <ng-container *ngIf="!editing">
     <div *ngIf="showPreview">
-        {{ value }}
+        <li *ngIf="listValue; else simpleValue">{{ value }}</li>
+        <ng-template #simpleValue> {{ value }} </ng-template>
     </div>
 
     <div class="flex">
@@ -35,8 +36,8 @@
                     [placeholder]="placeholder"
                     [id]="id"
                     name="name"
-                    [style.width]="this.parentDimensions.width + 'px'"
-                    [style.height]="this.parentDimensions.height + 'px'"
+                    [style.width]="this.parentDimensions?.width + 'px'"
+                    [style.height]="this.parentDimensions?.height + 'px'"
                 ></textarea>
             </ng-template>
         </div>
diff --git a/src/lib/inputs/editable-input/editable-input.component.scss b/src/lib/inputs/editable-input/editable-input.component.scss
index 3e7a471..dd6e41a 100644
--- a/src/lib/inputs/editable-input/editable-input.component.scss
+++ b/src/lib/inputs/editable-input/editable-input.component.scss
@@ -18,3 +18,7 @@ textarea {
     margin: 0;
     min-height: 0;
 }
+
+form {
+    width: 100%;
+}
diff --git a/src/lib/inputs/editable-input/editable-input.component.ts b/src/lib/inputs/editable-input/editable-input.component.ts
index b7deeb9..4860fbc 100644
--- a/src/lib/inputs/editable-input/editable-input.component.ts
+++ b/src/lib/inputs/editable-input/editable-input.component.ts
@@ -24,6 +24,8 @@ export class EditableInputComponent implements OnChanges {
     @Input() canEdit = true;
     @Input() buttonsType: CircleButtonType = CircleButtonTypes.default;
     @Input() helpModeKey: string = '';
+    @Input() lastChild = false;
+    @Input() listValue = false;
     @Output() readonly save = new EventEmitter<string>();
     parentDimensions?: { width: number; height: number };
     newValue = '';
@@ -44,12 +46,10 @@ export class EditableInputComponent implements OnChanges {
         if (changes['value']) {
             this.editing = false;
         }
-        if (changes['parentId']?.currentValue) {
-            setTimeout(() => {
-                const parent = document.getElementById(this.parentId as string) as HTMLElement;
-                this.parentDimensions = { width: parent.offsetWidth - 98, height: parent.offsetHeight - 16 };
-            }, 20);
-        }
+        setTimeout(() => {
+            const parent = document.getElementById(this.parentId as string) as HTMLElement;
+            this.parentDimensions = { width: parent.offsetWidth - 98, height: parent.offsetHeight - 16 };
+        }, 20);
     }
 
     saveValue(): void {