[ADF-2322] Card view datatable and documentlist (#2968)

* move table in style

* Enable the cardview mode

* add button in demo shell to change view
add missing translation terms toolbar

* missing comma

* add example in demo shell

* style loading and images

* border card container

* document list tests

* test check class and input

* test fix

* fix test process services

* more documentation

* rirpristinate base pacakge integgration

* remove test color

lib/content-services/document-list/components/document-list.component.spec.ts

@@ -181,7 +181,65 @@ describe('DocumentList', () => {
 
         fixture.whenStable().then(() => {
             fixture.detectChanges();
-            expect(element.querySelector('#adf-document-list-loading')).toBeDefined();
+            expect(element.querySelector('.adf-document-list-loading')).toBeDefined();
+            done();
+        });
+    });
+
+    it('should hide the header if showHeader is false', (done) => {
+        documentList.showHeader = false;
+
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(element.querySelector('.adf-datatable-header')).toBe(null);
+            done();
+        });
+    });
+
+    it('should show the header if showHeader is true', (done) => {
+        documentList.showHeader = true;
+
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(element.querySelector('.adf-datatable-header')).toBeDefined();
+            done();
+        });
+    });
+
+    it('should reset selection upon reload', () => {
+        spyOn(documentList, 'resetSelection').and.callThrough();
+
+        documentList.reload();
+        fixture.detectChanges();
+
+        expect(documentList.resetSelection).toHaveBeenCalled();
+    });
+
+    it('should use the cardview style if cardview is true', (done) => {
+        documentList.cardview = true;
+
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(element.querySelector('.adf-data-table-card')).toBeDefined();
+            done();
+        });
+    });
+
+    it('should use the base document list style if cardview is false', (done) => {
+        documentList.cardview = false;
+
+        fixture.detectChanges();
+
+        fixture.whenStable().then(() => {
+            fixture.detectChanges();
+            expect(element.querySelector('.adf-data-table-card')).toBe(null);
+            expect(element.querySelector('.adf-data-table')).toBeDefined();
             done();
         });
     });