diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html
index 57f6e2e62d..91cdcf87e5 100644
--- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html
+++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.html
@@ -56,26 +56,18 @@
         </adf-card-view>
     </mat-expansion-panel>
 
-    <ng-container *ngIf="displayTags">
-        <mat-expansion-panel
-            hideToggle
-            [expanded]="currentPanel.panelTitle === DefaultPanels.TAGS && currentPanel.expanded"
-            (opened)="expandPanel(DefaultPanels.TAGS)"
-            (closed)="closePanel(DefaultPanels.TAGS)"
-            class="adf-content-metadata-panel"
-            data-automation-id="adf-content-metadata-tags-panel">
-            <mat-expansion-panel-header
-                class="adf-metadata-properties-header"
-                [class.adf-metadata-properties-header-expanded]="currentPanel.panelTitle === DefaultPanels.TAGS && currentPanel.expanded">
-                <adf-content-metadata-header [title]="'METADATA.BASIC.TAGS'" [expanded]="currentPanel.panelTitle === DefaultPanels.TAGS && currentPanel.expanded">
-                    <button
-                        *ngIf="!readOnly && !isPanelEditing(DefaultPanels.TAGS)"
-                        mat-icon-button
-                        (click)="toggleGroupEditing(DefaultPanels.TAGS, $event)"
-                        [attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
-                        [attr.aria-label]="'CORE.METADATA.ACCESSIBILITY.EDIT' | translate"
-                        data-automation-id="showing-tag-input-button"
-                        class="adf-edit-icon-buttons">
+  <ng-container *ngIf="displayTags">
+        <mat-expansion-panel hideToggle [(expanded)]="isTagPanelExpanded" class="adf-content-metadata-panel">
+            <mat-expansion-panel-header class="adf-metadata-properties-header"
+                                        [class.adf-metadata-properties-header-expanded]='isTagPanelExpanded'>
+                <adf-content-metadata-header [title]="'METADATA.BASIC.TAGS'" [expanded]="isTagPanelExpanded">
+                    <button *ngIf="canEditTags"
+                            mat-icon-button
+                            (click)="onToggleTagsEdit($event)"
+                            [attr.title]="'CORE.METADATA.ACTIONS.EDIT' | translate"
+                            [attr.aria-label]="'CORE.METADATA.ACCESSIBILITY.EDIT' | translate"
+                            data-automation-id="showing-tag-input-button"
+                            class="adf-edit-icon-buttons">
                         <mat-icon>mode_edit</mat-icon>
                     </button>
                     <div *ngIf="isPanelEditing(DefaultPanels.TAGS)" class="adf-metadata-action-buttons">
diff --git a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts
index 8e61045428..5f9ce98c74 100644
--- a/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts
+++ b/lib/content-services/src/lib/content-metadata/components/content-metadata/content-metadata.component.spec.ts
@@ -41,6 +41,7 @@ import { MatDialogModule } from '@angular/material/dialog';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { MatTooltipModule } from '@angular/material/tooltip';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
 
 describe('ContentMetadataComponent', () => {
     let component: ContentMetadataComponent;
@@ -54,6 +55,7 @@ describe('ContentMetadataComponent', () => {
     let categoryService: CategoryService;
     let getClassSpy: jasmine.Spy;
     let notificationService: NotificationService;
+    let getGroupedPropertiesSpy: jasmine.Spy;
 
     const preset = 'custom-preset';
 
@@ -168,6 +170,7 @@ describe('ContentMetadataComponent', () => {
                       HttpClientModule,
                       MatDialogModule,
                       MatSnackBarModule,
+                      MatProgressBarModule,
                       MatTooltipModule,
                       PipeModule],
             providers: [
@@ -222,6 +225,7 @@ describe('ContentMetadataComponent', () => {
         component.node = node;
         component.preset = preset;
         spyOn(contentMetadataService, 'getContentTypeProperty').and.returnValue(of([]));
+        getGroupedPropertiesSpy = spyOn(contentMetadataService, 'getGroupedProperties');
         getClassSpy = spyOn(classesApi, 'getClass');
         fixture.detectChanges();
     });
@@ -243,6 +247,7 @@ describe('ContentMetadataComponent', () => {
     describe('Folder', () => {
         it('should show the folder node', (done) => {
             component.expanded = false;
+            getGroupedPropertiesSpy.and.returnValue(of([]));
             fixture.detectChanges();
 
             component.basicProperties$.subscribe(() => {
@@ -270,7 +275,7 @@ describe('ContentMetadataComponent', () => {
 
         it('nodeAspectUpdate', fakeAsync(() => {
             const fakeNode = { id: 'fake-minimal-node', aspectNames: ['ft:a', 'ft:b', 'ft:c'], name: 'fake-node' } as Node;
-            spyOn(contentMetadataService, 'getGroupedProperties').and.stub();
+            getGroupedPropertiesSpy.and.stub();
             spyOn(contentMetadataService, 'getBasicProperties').and.stub();
             updateService.updateNodeAspect(fakeNode);
 
@@ -697,7 +702,7 @@ describe('ContentMetadataComponent', () => {
         });
 
         it('should load the group properties on node change', () => {
-            spyOn(contentMetadataService, 'getGroupedProperties');
+            getGroupedPropertiesSpy;
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
 
@@ -721,7 +726,7 @@ describe('ContentMetadataComponent', () => {
                 }
             ];
             component.preset = presetConfig;
-            spyOn(contentMetadataService, 'getGroupedProperties');
+            getGroupedPropertiesSpy;
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
 
@@ -732,7 +737,7 @@ describe('ContentMetadataComponent', () => {
             const expectedProperties = [];
             component.expanded = true;
 
-            spyOn(contentMetadataService, 'getGroupedProperties').and.returnValue(of([{ properties: expectedProperties } as any]));
+            getGroupedPropertiesSpy.and.returnValue(of([{ properties: expectedProperties } as any]));
             spyOn(component, 'showGroup').and.returnValue(true);
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
@@ -746,7 +751,7 @@ describe('ContentMetadataComponent', () => {
             component.expanded = true;
             component.displayEmpty = false;
 
-            spyOn(contentMetadataService, 'getGroupedProperties').and.returnValue(of([{ properties: [] } as any]));
+            getGroupedPropertiesSpy.and.returnValue(of([{ properties: [] } as any]));
             spyOn(component, 'showGroup').and.returnValue(true);
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
@@ -757,7 +762,7 @@ describe('ContentMetadataComponent', () => {
         });
 
         it('should hide card views group when the grouped properties are empty', async () => {
-            spyOn(contentMetadataService, 'getGroupedProperties').and.stub();
+            getGroupedPropertiesSpy.and.stub();
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
 
@@ -770,7 +775,7 @@ describe('ContentMetadataComponent', () => {
 
         it('should display card views group when there is at least one property that is not empty', async () => {
             component.expanded = true;
-            spyOn(contentMetadataService, 'getGroupedProperties').and.stub();
+            getGroupedPropertiesSpy.and.stub();
 
             component.ngOnChanges({ node: new SimpleChange(node, expectedNode, false) });
 
@@ -960,6 +965,7 @@ describe('ContentMetadataComponent', () => {
 
             component.expanded = true;
             component.preset = 'default';
+            getGroupedPropertiesSpy.and.callThrough();
         });
 
         it('should show Versionable with given content-metadata config', async () => {
diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html
index 299249993a..71677b55d7 100644
--- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html
+++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html
@@ -76,15 +76,15 @@
 
     <div *ngIf="property.multivalued"
          class="adf-property-field adf-dateitem-chip-list-container adf-dateitem-editable">
-        <mat-chip-list #chipList class="adf-textitem-chip-list">
-            <mat-chip
+        <mat-chip-listbox #chipList class="adf-textitem-chip-list">
+            <mat-chip-option
                 *ngFor="let propertyValue of property.displayValue; let idx = index"
                 [removable]="isEditable"
                 (removed)="removeValueFromList(idx)">
                 {{ propertyValue }}
                 <mat-icon *ngIf="isEditable" matChipRemove>cancel</mat-icon>
-            </mat-chip>
-        </mat-chip-list>
+            </mat-chip-option>
+        </mat-chip-listbox>
 
         <div
             *ngIf="isEditable"
diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html
index fc556582d8..2f23da490d 100644
--- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html
+++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html
@@ -2,7 +2,7 @@
     <div *ngSwitchDefault>
         <mat-form-field class="adf-property-field adf-card-textitem-field"
             [ngClass]="{'adf-property-read-only': !isEditable }"
-            [floatLabel]="'never'">
+            [floatLabel]="'always'">
             <mat-label *ngIf="showProperty || isEditable" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
                 [ngClass]="{
                     'adf-property-value-editable': editable,