refactor(form): replace matAutosize by cdkAutosize (DEV-968) (#754)

* refactor(form): replace matAutosize by cdkAutosize (DEV-968) * refactor(form): replace matAutosize by cdkAutosize (DEV-968)
dasch-swiss · May 31, 2022 · 449493b · 449493b
1 parent 694cb06
commit 449493b
Show file tree

Hide file tree

Showing 16 changed files with 121 additions and 114 deletions.
diff --git a/src/app/project/ontology/ontology-form/ontology-form.component.html b/src/app/project/ontology/ontology-form/ontology-form.component.html
@@ -22,8 +22,8 @@
 
         <mat-form-field class="large-field ontology-comment">
             <textarea matInput [formControl]="ontologyForm.controls['comment']"
-                [placeholder]="'Comment'" [value]="ontologyComment"
-                matTextareaAutosize matAutosizeMinRows="6" matAutosizeMaxRows="12">
+                placeholder="Comment" [value]="ontologyComment"
+                [cdkTextareaAutosize]="true" [cdkAutosizeMinRows]="6" [cdkAutosizeMaxRows]="12">
             </textarea>
         </mat-form-field>
 

diff --git a/src/app/project/ontology/property-form/property-form.component.html b/src/app/project/ontology/property-form/property-form.component.html
@@ -65,7 +65,7 @@
         <!-- comment/description -->
         <div class="large-field string-literal-container">
             <app-string-literal-input
-                [placeholder]="'Comment'"
+                placeholder="Comment"
                 [value]="comments"
                 [disabled]="(resClassIri && propertyInfo.propDef)"
                 [textarea]="true"

diff --git a/src/app/project/ontology/resource-class-form/resource-class-form.component.html b/src/app/project/ontology/resource-class-form/resource-class-form.component.html
@@ -34,7 +34,7 @@
             <!-- description -->
             <div class="large-field string-literal-container more-space-top">
                 <app-string-literal-input
-                    [placeholder]="'Comment'"
+                    placeholder="Comment"
                     [value]="resourceClassComments"
                     [textarea]="true"
                     (touched)="resourceClassCommentsTouched = $event"

diff --git a/src/app/project/project-form/project-form.component.html b/src/app/project/project-form/project-form.component.html
@@ -41,16 +41,6 @@
             {{ formErrors.description }}
         </mat-hint>
 
-        <!-- <mat-form-field class="large-field">
-            <textarea matInput matTextareaAutosize matAutosizeMinRows="6" matAutosizeMaxRows="12"
-                      [placeholder]=" 'appLabels.form.project.general.description' | translate "
-                      [formControl]="form.controls['description']">
-            </textarea>
-            <mat-hint *ngIf="formErrors.description">
-                {{ formErrors.description }}
-            </mat-hint>
-        </mat-form-field> -->
-
         <!-- institution -->
         <!--
         <mat-form-field class="large">

diff --git a/src/app/workspace/resource/resource-link-form/resource-link-form.component.html b/src/app/workspace/resource/resource-link-form/resource-link-form.component.html
@@ -19,9 +19,12 @@
         </mat-form-field>
 
         <mat-form-field class="large-field ontology-comment">
-            <textarea matInput [formControl]="form.controls['comment']"
-                [placeholder]="'Comment'"
-                matTextareaAutosize matAutosizeMinRows="6" matAutosizeMaxRows="12">
+            <textarea matInput
+                placeholder="Comment"
+                [formControl]="form.controls['comment']"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="6"
+                [cdkAutosizeMaxRows]="12">
             </textarea>
         </mat-form-field>
 

diff --git a/src/app/workspace/resource/values/boolean-value/boolean-value.component.html b/src/app/workspace/resource/values/boolean-value/boolean-value.component.html
@@ -14,15 +14,14 @@
         </mat-error>
         <mat-form-field class="large-field value-component-comment">
             <textarea
-                    matInput
-                    cdkTextareaAutosize
-                    cdkAutosizeMinRows="1"
-                    cdkAutosizeMaxRows="6"
-                    [formControlName]="'comment'"
-                    class="comment"
-                    placeholder="Comment"
-                    type="text"
-                    spellcheck="false">
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/color-value/color-value.component.html b/src/app/workspace/resource/values/color-value/color-value.component.html
@@ -29,14 +29,13 @@
         <mat-form-field class="large-field value-component-comment">
             <textarea
                 matInput
-                cdkTextareaAutosize
-                cdkAutosizeMinRows="1"
-                cdkAutosizeMaxRows="6"
-                [formControlName]="'comment'"
                 class="comment"
                 placeholder="Comment"
-                type="text"
-                spellcheck="false">
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/date-value/date-value.component.html b/src/app/workspace/resource/values/date-value/date-value.component.html
@@ -27,16 +27,16 @@
 
         <!-- Comment field -->
         <mat-form-field class="large-field value-component-comment">
-            <textarea matInput
-                      cdkTextareaAutosize
-                      cdkAutosizeMinRows="1"
-                      cdkAutosizeMaxRows="6"
-                      [formControlName]="'comment'"
-                      class="comment"
-                      placeholder="Comment"
-                      type="text"
-                      spellcheck="false">
-          </textarea>
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
+            </textarea>
         </mat-form-field>
     </span>
 </ng-template>
diff --git a/src/app/workspace/resource/values/decimal-value/decimal-value.component.html b/src/app/workspace/resource/values/decimal-value/decimal-value.component.html
@@ -21,15 +21,15 @@
             </mat-error>
         </mat-form-field>
         <mat-form-field class="large-field value-component-comment">
-            <textarea matInput
-                      cdkTextareaAutosize
-                      cdkAutosizeMinRows="1"
-                      cdkAutosizeMaxRows="6"
-                      [formControlName]="'comment'"
-                      class="comment"
-                      placeholder="Comment"
-                      type="text"
-                      spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/geoname-value/geoname-value.component.html b/src/app/workspace/resource/values/geoname-value/geoname-value.component.html
@@ -28,15 +28,15 @@
             </mat-error>
         </mat-form-field>
         <mat-form-field class="large-field value-component-comment">
-            <textarea matInput
-                      cdkTextareaAutosize
-                      cdkAutosizeMinRows="1"
-                      cdkAutosizeMaxRows="6"
-                      [formControlName]="'comment'"
-                      class="comment"
-                      placeholder="Comment"
-                      type="text"
-                      spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/int-value/int-value.component.html b/src/app/workspace/resource/values/int-value/int-value.component.html
@@ -21,15 +21,15 @@
             </mat-error>
         </mat-form-field>
         <mat-form-field class="large-field value-component-comment">
-            <textarea matInput
-                    cdkTextareaAutosize
-                    cdkAutosizeMinRows="1"
-                    cdkAutosizeMaxRows="6"
-                    [formControlName]="'comment'"
-                    class="comment"
-                    placeholder="Comment"
-                    type="text"
-                    spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/interval-value/interval-value.component.html b/src/app/workspace/resource/values/interval-value/interval-value.component.html
@@ -16,15 +16,15 @@
           </mat-error>
         </mat-form-field>
         <mat-form-field class="large-field value-component-comment">
-          <textarea matInput
-                    cdkTextareaAutosize
-                    cdkAutosizeMinRows="1"
-                    cdkAutosizeMaxRows="6"
-                    [formControlName]="'comment'"
-                    class="comment"
-                    placeholder="Comment"
-                    type="text"
-                    spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/src/app/workspace/resource/values/link-value/link-value.component.html b/src/app/workspace/resource/values/link-value/link-value.component.html
@@ -35,15 +35,15 @@
         </mat-error>
       </mat-form-field>
       <mat-form-field class="large-field value-component-comment">
-        <textarea matInput
-                  cdkTextareaAutosize
-                  cdkAutosizeMinRows="1"
-                  cdkAutosizeMaxRows="6"
-                  [formControlName]="'comment'"
-                  class="comment"
-                  placeholder="Comment"
-                  type="text"
-                  spellcheck="false">
+        <textarea
+            matInput
+            class="comment"
+            placeholder="Comment"
+            spellcheck="false"
+            [cdkTextareaAutosize]="true"
+            [cdkAutosizeMinRows]="1"
+            [cdkAutosizeMaxRows]="6"
+            [formControlName]="'comment'">
         </textarea>
       </mat-form-field>
   </span>

diff --git a/...space/resource/values/text-value/text-value-as-string/text-value-as-string.component.html b/...space/resource/values/text-value/text-value-as-string/text-value-as-string.component.html
@@ -9,14 +9,23 @@
             floatLabel="never">
 
             <!-- default gui-element: simple text -->
-            <input *ngIf="guiElement === 'simpleText'" matInput [formControlName]="'value'" class="value"
-                placeholder="Text value" type="text" [errorStateMatcher]="matcher">
+            <input *ngIf="guiElement === 'simpleText'" matInput
+                class="value"
+                placeholder="Text value"
+                type="text"
+                [formControlName]="'value'"
+                [errorStateMatcher]="matcher">
 
             <!-- gui-element: text area -->
-            <textarea *ngIf="guiElement === 'textArea'" matInput [formControlName]="'value'" class="value"
-                placeholder="Text value" type="text" [errorStateMatcher]="matcher"
-                matAutosizeMaxRows="12" matAutosizeMinRows="6"></textarea>
-            <!-- <textarea *ngSwitchCase="'richText'" matInput [formControlName]="'value'" MatTextareaAutosize [mat-autosize]="true" [matAutosizeMaxRows]="10" class="value" placeholder="Text value" type="text" [errorStateMatcher]="matcher"></textarea> -->
+            <textarea *ngIf="guiElement === 'textArea'" matInput
+                class="value"
+                placeholder="Text value"
+                [formControlName]="'value'"
+                [errorStateMatcher]="matcher"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="6"
+                [cdkAutosizeMaxRows]="12">
+            </textarea>
 
             <mat-error *ngIf="valueFormControl.hasError('valueNotChanged') &&
                 (valueFormControl.touched || valueFormControl.dirty)">
@@ -37,8 +46,15 @@
 
         <!-- comment -->
         <mat-form-field *ngIf="!commentDisabled" class="large-field value-component-comment">
-            <textarea matInput cdkTextareaAutosize cdkAutosizeMinRows="1" cdkAutosizeMaxRows="6"
-                [formControlName]="'comment'" class="comment" placeholder="Comment" type="text" spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>

diff --git a/...p/workspace/resource/values/text-value/text-value-as-xml/text-value-as-xml.component.html b/...p/workspace/resource/values/text-value/text-value-as-xml/text-value-as-xml.component.html
@@ -16,16 +16,16 @@
         <span [formGroup]="form">
             <ckeditor [formControlName]="'value'" [config]="editorConfig" [editor]="editor"></ckeditor>
             <mat-form-field class="large-field value-component-comment">
-                    <textarea matInput
-                            cdkTextareaAutosize
-                            cdkAutosizeMinRows="1"
-                            cdkAutosizeMaxRows="6"
-                            [formControlName]="'comment'"
-                            class="comment"
-                            placeholder="Comment"
-                            type="text"
-                            spellcheck="false">
-                    </textarea>
+                <textarea
+                    matInput
+                    class="comment"
+                    placeholder="Comment"
+                    spellcheck="false"
+                    [cdkTextareaAutosize]="true"
+                    [cdkAutosizeMinRows]="1"
+                    [cdkAutosizeMaxRows]="6"
+                    [formControlName]="'comment'">
+                </textarea>
             </mat-form-field>
         </span>
     </div>

diff --git a/src/app/workspace/resource/values/uri-value/uri-value.component.html b/src/app/workspace/resource/values/uri-value/uri-value.component.html
@@ -23,15 +23,15 @@
             </mat-error>
         </mat-form-field>
         <mat-form-field class="large-field value-component-comment">
-            <textarea matInput
-                      cdkTextareaAutosize
-                      cdkAutosizeMinRows="1"
-                      cdkAutosizeMaxRows="6"
-                      [formControlName]="'comment'"
-                      class="comment"
-                      placeholder="Comment"
-                      type="text"
-                      spellcheck="false">
+            <textarea
+                matInput
+                class="comment"
+                placeholder="Comment"
+                spellcheck="false"
+                [cdkTextareaAutosize]="true"
+                [cdkAutosizeMinRows]="1"
+                [cdkAutosizeMaxRows]="6"
+                [formControlName]="'comment'">
             </textarea>
         </mat-form-field>
     </span>