diff --git a/.github/workflows/master-build.yml b/.github/workflows/master-build.yml
index cd6f94d9a6..380f56e919 100644
--- a/.github/workflows/master-build.yml
+++ b/.github/workflows/master-build.yml
@@ -12,23 +12,23 @@ jobs:
             -   uses: actions/checkout@v2
                 with:
                     fetch-depth: 0
-            -   name: Use Node.js 12
+            -   name: Use Node.js 16
                 uses: actions/setup-node@v2
                 with:
-                    node-version: 12
-            -   run: npm i
+                    node-version: 16
+            -   run: npm i --legacy-peer-deps
             -   name: Build & test components-core
                 run: |
                     npm run ncc:build
                     npm run ncc:full-test
                     npm run ncc:doc
-                    npm i ./dist/netgrif-components-core --save-optional
+                    npm i ./dist/netgrif-components-core --save-optional --legacy-peer-deps
             -   name: Build & test components
                 run: |
                     npm run nc:build
                     npm run nc:full-test
                     npm run nc:doc
-                    npm i ./dist/netgrif-components --save-optional
+                    npm i ./dist/netgrif-components --save-optional --legacy-peer-deps
             -   name: SonarCloud scan
                 uses: SonarSource/sonarcloud-github-action@master
                 env:
diff --git a/.github/workflows/pr-build.yml b/.github/workflows/pr-build.yml
index 4b91839251..48b499b310 100644
--- a/.github/workflows/pr-build.yml
+++ b/.github/workflows/pr-build.yml
@@ -13,18 +13,18 @@ jobs:
             -   uses: actions/setup-node@v2
                 name: Full Test
                 with:
-                    node-version: 12
-            -   run: npm i
+                    node-version: 16
+            -   run: npm i --legacy-peer-deps
             -   name: Build & test components-core
                 run: |
                     npm run ncc:build
                     npm run ncc:full-test
-                    npm i ./dist/netgrif-components-core --save-optional
+                    npm i ./dist/netgrif-components-core --save-optional --legacy-peer-deps
             -   name: Build & test components
                 run: |
                     npm run nc:build
                     npm run nc:full-test
-                    npm i ./dist/netgrif-components --save-optional
+                    npm i ./dist/netgrif-components --save-optional --legacy-peer-deps
             -   name: Edit Path
                 run: |
                     sed -i 's/SF:.*.projects/SF:projects/g' coverage/netgrif-components/lcov.info
diff --git a/.github/workflows/release-build.yml b/.github/workflows/release-build.yml
index bb757740dd..3841bcf886 100644
--- a/.github/workflows/release-build.yml
+++ b/.github/workflows/release-build.yml
@@ -9,15 +9,15 @@ jobs:
             -   uses: actions/checkout@v2
             -   uses: actions/setup-node@v2
                 with:
-                    node-version: 12
+                    node-version: 16
             -   run: |
-                    npm i
+                    npm i --legacy-peer-deps
                     npm run ncc:build
                     npm run ncc:full-test
-                    npm i ./dist/netgrif-components-core --save-optional
+                    npm i ./dist/netgrif-components-core --save-optional --legacy-peer-deps
                     npm run nc:build
                     npm run nc:full-test
-                    npm i ./dist/netgrif-components --save-optional
+                    npm i ./dist/netgrif-components --save-optional --legacy-peer-deps
                     npm run example:build
 
     publish-npm:
@@ -27,13 +27,13 @@ jobs:
             -   uses: actions/checkout@v2
             -   uses: actions/setup-node@v2
                 with:
-                    node-version: 12
+                    node-version: 16
                     registry-url: https://registry.npmjs.org/
-            -   run: npm i
+            -   run: npm i --legacy-peer-deps
             -   name: Publish components-core
                 run: |
                     npm run ncc:build
-                    npm i ./dist/netgrif-components-core --save-optional
+                    npm i ./dist/netgrif-components-core --save-optional --legacy-peer-deps
                     cd dist/netgrif-components-core
                     npm publish --access public
                 env:
@@ -57,13 +57,13 @@ jobs:
             -   uses: actions/checkout@v2
             -   uses: actions/setup-node@v2
                 with:
-                    node-version: 12
+                    node-version: 16
                     registry-url: https://npm.pkg.github.com
-            -   run: npm i
+            -   run: npm i --legacy-peer-deps
             -   name: Publish components-core
                 run: |
                     npm run ncc:build
-                    npm i ./dist/netgrif-components-core --save-optional
+                    npm i ./dist/netgrif-components-core --save-optional --legacy-peer-deps
                     cd dist/netgrif-components-core
                     npm publish --access public
                 env:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8b82527183..ecbe893ff7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,8 +5,15 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres
 to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-Full
-Changelog: [https://github.com/netgrif/components/commits/v6.0.0](https://github.com/netgrif/components/commits/v6.0.0)
+Full Changelog: [https://github.com/netgrif/components/commits/v6.0.0](https://github.com/netgrif/components/commits/v6.0.0)
+
+## [6.1.1](https://github.com/netgrif/components/releases/tag/v6.1.1) (2022-06-09)
+
+### Fixed
+
+- [NAE-1649] File field preview component bug
+- [NAE-1656] Export  nc-panel-item
+- [NAE-1653] Create view schematic not functional after angular 13 update
 
 ## [6.1.0](https://github.com/netgrif/components/releases/tag/v6.1.0) (2022-06-01)
 
diff --git a/docs/compodoc/components-core/classes/AbstractSaveFilterComponent.html b/docs/compodoc/components-core/classes/AbstractSaveFilterComponent.html
index 889b3c7261..e5e1e91ffb 100644
--- a/docs/compodoc/components-core/classes/AbstractSaveFilterComponent.html
+++ b/docs/compodoc/components-core/classes/AbstractSaveFilterComponent.html
@@ -169,51 +169,51 @@ <h3 id="constructor">Constructor</h3>
                                         <tbody>
                                                 <tr>
                                                         <td>_sideMenuControl</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../classess/SideMenuControl.html" target="_self" >SideMenuControl</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                                 <tr>
                                                         <td>_userFilterService</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../injectables/UserFiltersService.html" target="_self" >UserFiltersService</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                                 <tr>
                                                         <td>_log</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../injectables/LoggerService.html" target="_self" >LoggerService</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                                 <tr>
                                                         <td>taskViewService</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../injectables/TaskViewService.html" target="_self" >TaskViewService</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                         </tbody>
                                     </table>
@@ -225,7 +225,7 @@ <h3 id="constructor">Constructor</h3>
 </section>
 
             <section>
-    
+
     <h3 id="inputs">
         Properties
     </h3>
@@ -361,7 +361,7 @@ <h3 id="inputs">
 </section>
 
             <section>
-    
+
     <h3 id="methods">
         Methods
     </h3>
@@ -429,7 +429,7 @@ <h3 id="methods">
 
                     </div>
                     <div class="io-description">
-                        
+
                     </div>
                 </td>
             </tr>
@@ -548,7 +548,7 @@ <h3 id="methods">
 
                     </div>
                     <div class="io-description">
-                        
+
                     </div>
                 </td>
             </tr>
@@ -575,7 +575,7 @@ <h3 id="methods">
 import {LoggerService} from &#x27;../../../logger/services/logger.service&#x27;;
 import {UserFiltersService} from &#x27;../../../filter/user-filters.service&#x27;;
 
-export abstract class AbstractSaveFilterComponent extends AbstractTaskView {
+export abstract class AbstractSaveFilterComponent extends AbstractTaskViewComponent {
 
     protected _injectedData: SaveFilterInjectionData;
 
@@ -610,7 +610,7 @@ <h3 id="methods">
 
 
 
-                   
+
 
 
 
@@ -638,7 +638,7 @@ <h1 class="search-results-title">No results matching "<span class='search-query'
 
        <script src="../js/libs/custom-elements.min.js"></script>
        <script src="../js/libs/lit-html.js"></script>
-       
+
        <script type="module" src="../js/menu-wc.js" defer></script>
        <script nomodule src="../js/menu-wc_es5.js" defer></script>
 
diff --git a/docs/compodoc/components-core/classes/AbstractTaskView.html b/docs/compodoc/components-core/classes/AbstractTaskView.html
index 7132d2569e..c93e255508 100644
--- a/docs/compodoc/components-core/classes/AbstractTaskView.html
+++ b/docs/compodoc/components-core/classes/AbstractTaskView.html
@@ -167,15 +167,15 @@ <h3 id="constructor">Constructor</h3>
                                         <tbody>
                                                 <tr>
                                                         <td>taskViewService</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../injectables/TaskViewService.html" target="_self" >TaskViewService</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                         </tbody>
                                     </table>
@@ -187,7 +187,7 @@ <h3 id="constructor">Constructor</h3>
 </section>
 
             <section>
-    
+
     <h3 id="inputs">
         Properties
     </h3>
@@ -282,7 +282,7 @@ <h3 id="inputs">
 </section>
 
             <section>
-    
+
     <h3 id="methods">
         Methods
     </h3>
@@ -399,7 +399,7 @@ <h3 id="methods">
 
                     </div>
                     <div class="io-description">
-                        
+
                     </div>
                 </td>
             </tr>
@@ -422,7 +422,7 @@ <h3 id="methods">
 import {ViewWithHeaders} from &#x27;../abstract/view-with-headers&#x27;;
 
 
-export abstract class AbstractTaskView extends ViewWithHeaders implements OnDestroy {
+export abstract class AbstractTaskViewComponent extends ViewWithHeaders implements OnDestroy {
 
     public tasks$: Observable&lt;Array&lt;TaskPanelData&gt;&gt;;
     public loading$: Observable&lt;boolean&gt;;
@@ -443,7 +443,7 @@ <h3 id="methods">
 
 
 
-                   
+
 
 
 
@@ -471,7 +471,7 @@ <h1 class="search-results-title">No results matching "<span class='search-query'
 
        <script src="../js/libs/custom-elements.min.js"></script>
        <script src="../js/libs/lit-html.js"></script>
-       
+
        <script type="module" src="../js/menu-wc.js" defer></script>
        <script nomodule src="../js/menu-wc_es5.js" defer></script>
 
diff --git a/docs/compodoc/components-core/classes/TabbedTaskView.html b/docs/compodoc/components-core/classes/TabbedTaskView.html
index fea934eb18..eb049acdc0 100644
--- a/docs/compodoc/components-core/classes/TabbedTaskView.html
+++ b/docs/compodoc/components-core/classes/TabbedTaskView.html
@@ -171,27 +171,27 @@ <h3 id="constructor">Constructor</h3>
                                         <tbody>
                                                 <tr>
                                                         <td>taskViewService</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../injectables/TaskViewService.html" target="_self" >TaskViewService</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                                 <tr>
                                                         <td>_injectedTabData</td>
-                                                  
+
                                                         <td>
                                                                         <code><a href="../interfaces/InjectedTabbedTaskViewData.html" target="_self" >InjectedTabbedTaskViewData</a></code>
                                                         </td>
-                                                  
+
                                                     <td>
                                                             No
                                                     </td>
-                                                    
+
                                                 </tr>
                                         </tbody>
                                     </table>
@@ -203,7 +203,7 @@ <h3 id="constructor">Constructor</h3>
 </section>
 
             <section>
-    
+
     <h3 id="inputs">
         Properties
     </h3>
@@ -339,7 +339,7 @@ <h3 id="inputs">
 </section>
 
             <section>
-    
+
     <h3 id="methods">
         Methods
     </h3>
@@ -456,7 +456,7 @@ <h3 id="methods">
 
                     </div>
                     <div class="io-description">
-                        
+
                     </div>
                 </td>
             </tr>
@@ -479,7 +479,7 @@ <h3 id="methods">
 import {InjectedTabbedTaskViewData} from &#x27;./models/injected-tabbed-task-view-data&#x27;;
 import {Subscription} from &#x27;rxjs&#x27;;
 
-export abstract class TabbedTaskView extends AbstractTaskView implements OnDestroy {
+export abstract class AbstractTabbedTaskViewComponent extends AbstractTaskViewComponent implements OnDestroy {
     protected subTaskView: Subscription;
 
     protected constructor(taskViewService: TaskViewService,
@@ -501,7 +501,7 @@ <h3 id="methods">
 
 
 
-                   
+
 
 
 
@@ -529,7 +529,7 @@ <h1 class="search-results-title">No results matching "<span class='search-query'
 
        <script src="../js/libs/custom-elements.min.js"></script>
        <script src="../js/libs/lit-html.js"></script>
-       
+
        <script type="module" src="../js/menu-wc.js" defer></script>
        <script nomodule src="../js/menu-wc_es5.js" defer></script>
 
diff --git a/package.json b/package.json
index 45f0ca20cc..a087323030 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@netgrif/components-project",
-    "version": "6.1.0",
+    "version": "6.1.1-rc.1",
     "description": "Netgrif Application Engine Frontend project. Project includes angular libraries as base for NAE applications.",
     "homepage": "https://components.netgrif.com",
     "license": "SEE LICENSE IN LICENSE",
diff --git a/projects/nae-example-app/src/app/views/demo-title-config/content/0/demo-title-config-content0-task-view.component.ts b/projects/nae-example-app/src/app/views/demo-title-config/content/0/demo-title-config-content0-task-view.component.ts
index acc577652b..9640e4f900 100644
--- a/projects/nae-example-app/src/app/views/demo-title-config/content/0/demo-title-config-content0-task-view.component.ts
+++ b/projects/nae-example-app/src/app/views/demo-title-config/content/0/demo-title-config-content0-task-view.component.ts
@@ -49,7 +49,7 @@ const baseFilterFactory = (injectedTabData: InjectedTabbedTaskViewData) => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultTaskSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class DemoTitleConfigContent0TaskViewComponent extends TabbedTaskView implements AfterViewInit {
+export class DemoTitleConfigContent0TaskViewComponent extends AbstractTabbedTaskViewComponent implements AfterViewInit {
 
     @ViewChild('header') public taskHeaderComponent: HeaderComponent;
 
diff --git a/projects/nae-example-app/src/app/views/demo-title-config/content/1/demo-title-config-content1-case-view.component.ts b/projects/nae-example-app/src/app/views/demo-title-config/content/1/demo-title-config-content1-case-view.component.ts
index 61ebd9cf61..2f987ff98b 100644
--- a/projects/nae-example-app/src/app/views/demo-title-config/content/1/demo-title-config-content1-case-view.component.ts
+++ b/projects/nae-example-app/src/app/views/demo-title-config/content/1/demo-title-config-content1-case-view.component.ts
@@ -12,7 +12,7 @@ import {
     NAE_TAB_DATA,
     SearchService,
     SimpleFilter,
-    TabbedCaseView,
+    AbstractTabbedCaseViewComponent,
     ViewIdService,
 } from '@netgrif/components-core';
 import {HeaderComponent} from '@netgrif/components';
@@ -44,7 +44,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultCaseSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class DemoTitleConfigContent1CaseViewComponent extends TabbedCaseView implements AfterViewInit {
+export class DemoTitleConfigContent1CaseViewComponent extends AbstractTabbedCaseViewComponent implements AfterViewInit {
 
     @ViewChild('header') public caseHeaderComponent: HeaderComponent;
 
diff --git a/projects/nae-example-app/src/app/views/demo-title-config/content/2/demo-title-config-content2-case-view.component.ts b/projects/nae-example-app/src/app/views/demo-title-config/content/2/demo-title-config-content2-case-view.component.ts
index 9a13e49114..eceb424b73 100644
--- a/projects/nae-example-app/src/app/views/demo-title-config/content/2/demo-title-config-content2-case-view.component.ts
+++ b/projects/nae-example-app/src/app/views/demo-title-config/content/2/demo-title-config-content2-case-view.component.ts
@@ -1,5 +1,6 @@
 import {AfterViewInit, Component, Inject, ViewChild} from '@angular/core';
 import {
+    AbstractTabbedCaseViewComponent,
     AllowedNetsService,
     AllowedNetsServiceFactory,
     CaseViewService,
@@ -12,7 +13,6 @@ import {
     NAE_TAB_DATA,
     SearchService,
     SimpleFilter,
-    TabbedCaseView,
     ViewIdService,
 } from '@netgrif/components-core';
 import {HeaderComponent} from '@netgrif/components';
@@ -44,7 +44,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultCaseSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class DemoTitleConfigContent2CaseViewComponent extends TabbedCaseView implements AfterViewInit {
+export class DemoTitleConfigContent2CaseViewComponent extends AbstractTabbedCaseViewComponent implements AfterViewInit {
 
     @ViewChild('header') public caseHeaderComponent: HeaderComponent;
 
diff --git a/projects/nae-example-app/src/app/views/demo-title-config/content/3/demo-title-config-content3-case-view.component.ts b/projects/nae-example-app/src/app/views/demo-title-config/content/3/demo-title-config-content3-case-view.component.ts
index dbf1295cd5..e88a2efa20 100644
--- a/projects/nae-example-app/src/app/views/demo-title-config/content/3/demo-title-config-content3-case-view.component.ts
+++ b/projects/nae-example-app/src/app/views/demo-title-config/content/3/demo-title-config-content3-case-view.component.ts
@@ -12,7 +12,7 @@ import {
     NAE_TAB_DATA,
     SearchService,
     SimpleFilter,
-    TabbedCaseView,
+    AbstractTabbedCaseViewComponent,
     ViewIdService,
 } from '@netgrif/components-core';
 import {HeaderComponent} from '@netgrif/components';
@@ -44,7 +44,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultCaseSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class DemoTitleConfigContent3CaseViewComponent extends TabbedCaseView implements AfterViewInit {
+export class DemoTitleConfigContent3CaseViewComponent extends AbstractTabbedCaseViewComponent implements AfterViewInit {
 
     @ViewChild('header') public caseHeaderComponent: HeaderComponent;
 
diff --git a/projects/nae-example-app/src/index.html b/projects/nae-example-app/src/index.html
index 683d893482..16c4ea5860 100644
--- a/projects/nae-example-app/src/index.html
+++ b/projects/nae-example-app/src/index.html
@@ -1,15 +1,15 @@
 <!doctype html>
 <html lang="en">
 <head>
-  <meta charset="utf-8">
-  <title>NAE - Example - App</title>
-  <base href="/">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
-  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
-  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+    <meta charset="utf-8">
+    <title>NAE - Example - App</title>
+    <base href="/">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="icon" type="image/x-icon" href="favicon.ico">
+    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 </head>
 <body>
-  <nae-app-root></nae-app-root>
+<nae-app-root></nae-app-root>
 </body>
 </html>
diff --git a/projects/netgrif-components-core/package.json b/projects/netgrif-components-core/package.json
index a989a15bc8..448e688355 100644
--- a/projects/netgrif-components-core/package.json
+++ b/projects/netgrif-components-core/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@netgrif/components-core",
-    "version": "6.1.0",
+    "version": "6.1.1-rc.1",
     "description": "Netgrif Application engine frontend core Angular library",
     "homepage": "https://components.netgrif.com",
     "license": "SEE LICENSE IN LICENSE",
diff --git a/projects/netgrif-components-core/schematics/add/create-nae-files/schema.json b/projects/netgrif-components-core/schematics/add/create-nae-files/schema.json
index e76a68be07..4eb6d69fd6 100644
--- a/projects/netgrif-components-core/schematics/add/create-nae-files/schema.json
+++ b/projects/netgrif-components-core/schematics/add/create-nae-files/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateNaeFiles",
+    "$id": "SchematicsCreateNaeFiles",
     "title": "Create vital files for NAE project",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components-core/schematics/configuration-service/schema.json b/projects/netgrif-components-core/schematics/configuration-service/schema.json
index 4c8e7e548c..4ae28c60b9 100644
--- a/projects/netgrif-components-core/schematics/configuration-service/schema.json
+++ b/projects/netgrif-components-core/schematics/configuration-service/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateConfigurationService",
+    "$id": "SchematicsCreateConfigurationService",
     "title": "Create Configuration Service Schematic",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components-core/schematics/view-service/schema.json b/projects/netgrif-components-core/schematics/view-service/schema.json
index cdb3cbb4dd..cdaa943101 100644
--- a/projects/netgrif-components-core/schematics/view-service/schema.json
+++ b/projects/netgrif-components-core/schematics/view-service/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateViewService",
+    "$id": "SchematicsCreateViewService",
     "title": "Create View Service Schematic",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components-core/src/lib/data-fields/file-field/abstract-file-field.component.ts b/projects/netgrif-components-core/src/lib/data-fields/file-field/abstract-file-field.component.ts
index 3f4bf230c2..fd8b7bc497 100644
--- a/projects/netgrif-components-core/src/lib/data-fields/file-field/abstract-file-field.component.ts
+++ b/projects/netgrif-components-core/src/lib/data-fields/file-field/abstract-file-field.component.ts
@@ -18,7 +18,7 @@ import {SnackBarService} from '../../snack-bar/services/snack-bar.service';
 import {TranslateService} from '@ngx-translate/core';
 import {NAE_INFORM_ABOUT_INVALID_DATA} from '../models/invalid-data-policy-token';
 import {DomSanitizer, SafeUrl} from '@angular/platform-browser';
-import {BehaviorSubject} from 'rxjs';
+import { BehaviorSubject, Subscription } from 'rxjs';
 import {ResizedEvent} from 'angular-resize-event';
 import {take} from 'rxjs/operators';
 import {EventOutcomeMessageResource} from '../../resources/interface/message-resource';
@@ -113,6 +113,10 @@ export abstract class AbstractFileFieldComponent extends AbstractDataFieldCompon
      * Extension of file to preview
      */
     public previewExtension: FilePreviewType;
+    /**
+     * Form control subscription
+     */
+    private updatedFieldSubscription: Subscription;
 
     /**
      * Only inject services.
@@ -161,11 +165,19 @@ export abstract class AbstractFileFieldComponent extends AbstractDataFieldCompon
                 }
             }
         }
+        this.updatedFieldSubscription = this.dataField.updated.subscribe( () => {
+            if (!!this.filePreview
+                && !!this.dataField.value
+                && !!this.dataField.value.name) {
+                this.initializePreviewIfDisplayable();
+            }
+        })
     }
 
     ngOnDestroy(): void {
         super.ngOnDestroy();
         this.fullSource.complete();
+        this.updatedFieldSubscription.unsubscribe();
     }
 
     public chooseFile() {
diff --git a/projects/netgrif-components-core/src/lib/data-fields/file-field/models/file-field.ts b/projects/netgrif-components-core/src/lib/data-fields/file-field/models/file-field.ts
index 339cd8725f..3f15215f58 100644
--- a/projects/netgrif-components-core/src/lib/data-fields/file-field/models/file-field.ts
+++ b/projects/netgrif-components-core/src/lib/data-fields/file-field/models/file-field.ts
@@ -74,6 +74,10 @@ export class FileField extends DataField<FileFieldValue> {
         return this._value.getValue();
     }
 
+    get updated(): Observable<void> {
+        return this._update.asObservable();
+    }
+
     public valueWithoutChange(value: FileFieldValue) {
         this.changed = false;
         this._value.next(value ?? {});
diff --git a/projects/netgrif-components-core/src/lib/view/case-view/tabbed-case-view.ts b/projects/netgrif-components-core/src/lib/view/case-view/tabbed-case-view.ts
index 2ddcf91702..975245be60 100644
--- a/projects/netgrif-components-core/src/lib/view/case-view/tabbed-case-view.ts
+++ b/projects/netgrif-components-core/src/lib/view/case-view/tabbed-case-view.ts
@@ -43,7 +43,7 @@ export abstract class AbstractTabbedCaseViewComponent extends AbstractCaseViewCo
         super(caseViewService, _overflowService, undefined, _newCaseCreationConfig);
         this._correctlyInjected = !!this._injectedTabData.tabViewComponent && this._injectedTabData.tabViewOrder !== undefined;
         if (!this._correctlyInjected) {
-            this._loggerService.warn('TabbedCaseView must inject a filled object of type InjectedTabbedCaseViewData to work properly!');
+            this._loggerService.warn('AbstractTabbedCaseViewComponent must inject a filled object of type InjectedTabbedCaseViewData to work properly!');
         }
     }
 
diff --git a/projects/netgrif-components/package.json b/projects/netgrif-components/package.json
index 0e272af3d8..29fe07b49c 100644
--- a/projects/netgrif-components/package.json
+++ b/projects/netgrif-components/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@netgrif/components",
-    "version": "6.1.0",
+    "version": "6.1.1-rc.1",
     "description": "Netgrif Application Engine frontend Angular components",
     "homepage": "https://components.netgrif.com",
     "license": "SEE LICENSE IN LICENSE",
@@ -29,7 +29,7 @@
         "nae frontend"
     ],
     "peerDependencies": {
-        "@netgrif/components-core": "6.1.0-rc.1",
+        "@netgrif/components-core": "6.1.1-rc.1",
         "@angular-material-components/datetime-picker": "~7.0.1",
         "@angular-material-components/moment-adapter": "~7.0.0",
         "@angular/animations": "~13.3.1",
diff --git a/projects/netgrif-components/schematics/add/create-nc-files/schema.json b/projects/netgrif-components/schematics/add/create-nc-files/schema.json
index 94eb887f59..b0ad2ad535 100644
--- a/projects/netgrif-components/schematics/add/create-nc-files/schema.json
+++ b/projects/netgrif-components/schematics/add/create-nc-files/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateNcFiles",
+    "$id": "SchematicsCreateNcFiles",
     "title": "Create vital files for Nc project",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components/schematics/add/custom-themes/schema.json b/projects/netgrif-components/schematics/add/custom-themes/schema.json
index 5fac8515b2..13884d0c4f 100644
--- a/projects/netgrif-components/schematics/add/custom-themes/schema.json
+++ b/projects/netgrif-components/schematics/add/custom-themes/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCustomThemes",
+    "$id": "SchematicsCustomThemes",
     "title": "Project custom themes",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components/schematics/migrations/5.4/schema.json b/projects/netgrif-components/schematics/migrations/5.4/schema.json
index 72ca2c855a..ac33df4ba1 100644
--- a/projects/netgrif-components/schematics/migrations/5.4/schema.json
+++ b/projects/netgrif-components/schematics/migrations/5.4/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsMigration-5.4",
+    "$id": "SchematicsMigration-5.4",
     "title": "Migration 5.4",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-sidenav-prompt.json b/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-sidenav-prompt.json
index fbc4644ae6..66513e5eea 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-sidenav-prompt.json
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-sidenav-prompt.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateViewPromptAboutSidenav",
+    "$id": "SchematicsCreateViewPromptAboutSidenav",
     "title": "Prompt schematic for inputting sidenav options",
     "type": "object",
     "properties": {
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-view-prompt.json b/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-view-prompt.json
index e867ff02e5..12317ea3c3 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-view-prompt.json
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/schema-create-view-prompt.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateViewPrompt",
+    "$id": "SchematicsCreateViewPrompt",
     "title": "Create new View with prompt for settings",
     "type": "object",
     "properties": {
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/simple/__className@dasherize__.component.ts.template b/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/simple/__className@dasherize__.component.ts.template
index 25fc535d70..da3d48b06e 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/simple/__className@dasherize__.component.ts.template
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/simple/__className@dasherize__.component.ts.template
@@ -1,6 +1,6 @@
 import {AfterViewInit, Component, ViewChild} from '@angular/core';
 import {
-    AbstractCaseView,
+    AbstractCaseViewComponent,
     AllowedNetsService,
     AllowedNetsServiceFactory,
     Case,
@@ -47,7 +47,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultCaseSearchCategoriesFactory, deps: [CategoryFactory]},
     ],
 })
-export class <%= classify(className) %>Component extends AbstractCaseView implements AfterViewInit {
+export class <%= classify(className) %>Component extends AbstractCaseViewComponent implements AfterViewInit {
 
     @ViewChild('header') public caseHeaderComponent: HeaderComponent;
 
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/tabbed/__className@dasherize__.component.ts.template b/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/tabbed/__className@dasherize__.component.ts.template
index 9e4f2d2cc5..ff6d128463 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/tabbed/__className@dasherize__.component.ts.template
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/views/case-view/files/tabbed/__className@dasherize__.component.ts.template
@@ -12,7 +12,7 @@ import {
     NAE_TAB_DATA,
     SearchService,
     SimpleFilter,
-    TabbedCaseView,
+    AbstractTabbedCaseViewComponent,
     ViewIdService,
 } from '@netgrif/components-core';
 import {HeaderComponent} from '@netgrif/components';
@@ -44,7 +44,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultCaseSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class <%= classify(className) %>Component extends TabbedCaseView implements AfterViewInit {
+export class <%= classify(className) %>Component extends AbstractTabbedCaseViewComponent implements AfterViewInit {
 
     @ViewChild('header') public caseHeaderComponent: HeaderComponent;
 
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/views/group-view/files/__className@dasherize__.component.ts.template b/projects/netgrif-components/schematics/view/create-view-prompt/views/group-view/files/__className@dasherize__.component.ts.template
index ed815fb39f..e51928bc5b 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/views/group-view/files/__className@dasherize__.component.ts.template
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/views/group-view/files/__className@dasherize__.component.ts.template
@@ -1,6 +1,6 @@
 import {AfterViewInit, Component, ViewChild} from '@angular/core';
 import {
-    AbstractTaskView,
+    AbstractTaskViewComponent,
     AllowedNetsService,
     AllowedNetsServiceFactory,
     CategoryFactory,
@@ -54,7 +54,7 @@ const baseFilterFactory = (nextGroupService: NextGroupService) => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultTaskSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class <%= classify(className) %>Component extends AbstractTaskView implements AfterViewInit {
+export class <%= classify(className) %>Component extends AbstractTaskViewComponent implements AfterViewInit {
 
     @ViewChild('header') public taskHeaderComponent: HeaderComponent;
 
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/simple/__className@dasherize__.component.ts.template b/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/simple/__className@dasherize__.component.ts.template
index a5ea44744c..9d9c8bb5cd 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/simple/__className@dasherize__.component.ts.template
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/simple/__className@dasherize__.component.ts.template
@@ -1,6 +1,6 @@
 import {AfterViewInit, Component, ViewChild} from '@angular/core';
 import {
-    AbstractTaskView,
+    AbstractTaskViewComponent,
     AllowedNetsService,
     AllowedNetsServiceFactory,
     CategoryFactory,
@@ -48,7 +48,7 @@ const baseFilterFactory = () => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultTaskSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class <%= classify(className) %>Component extends AbstractTaskView implements AfterViewInit {
+export class <%= classify(className) %>Component extends AbstractTaskViewComponent implements AfterViewInit {
 
     @ViewChild('header') public taskHeaderComponent: HeaderComponent;
 
diff --git a/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/tabbed/__className@dasherize__.component.ts.template b/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/tabbed/__className@dasherize__.component.ts.template
index 45c71eb085..1d6bedfe16 100644
--- a/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/tabbed/__className@dasherize__.component.ts.template
+++ b/projects/netgrif-components/schematics/view/create-view-prompt/views/task-view/files/tabbed/__className@dasherize__.component.ts.template
@@ -10,7 +10,7 @@ import {
     NAE_TAB_DATA,
     NAE_TASK_VIEW_CONFIGURATION,
     SearchService,
-    TabbedTaskView,
+    AbstractTabbedTaskViewComponent,
     tabbedAllowedNetsServiceFactory,
     tabbedTaskViewConfigurationFactory,
     TaskViewService,
@@ -35,7 +35,7 @@ const baseFilterFactory = (injectedTabData: InjectedTabbedTaskViewData) => {
         CategoryFactory,
         TaskViewService,
         SearchService,
-        ChangedFieldsService
+        ChangedFieldsService,
         {   provide: NAE_BASE_FILTER,
             useFactory: baseFilterFactory,
             deps: [NAE_TAB_DATA]},
@@ -50,7 +50,7 @@ const baseFilterFactory = (injectedTabData: InjectedTabbedTaskViewData) => {
         {provide: NAE_SEARCH_CATEGORIES, useFactory: defaultTaskSearchCategoriesFactory, deps: [CategoryFactory]},
     ]
 })
-export class <%= classify(className) %>Component extends TabbedTaskView implements AfterViewInit {
+export class <%= classify(className) %>Component extends AbstractTabbedTaskViewComponent implements AfterViewInit {
 
     @ViewChild('header') public taskHeaderComponent: HeaderComponent;
 
diff --git a/projects/netgrif-components/schematics/view/create-view/schema.json b/projects/netgrif-components/schematics/view/create-view/schema.json
index 7acbdfb97e..ec41825e2d 100644
--- a/projects/netgrif-components/schematics/view/create-view/schema.json
+++ b/projects/netgrif-components/schematics/view/create-view/schema.json
@@ -1,6 +1,6 @@
 {
     "$schema": "http://json-schema.org/schema",
-    "id": "SchematicsCreateView",
+    "$id": "SchematicsCreateView",
     "title": "Create new View",
     "type": "object",
     "properties": {}
diff --git a/projects/netgrif-components/src/lib/panel/panel.module.ts b/projects/netgrif-components/src/lib/panel/panel.module.ts
index 73ccbf58e8..65a20f096c 100644
--- a/projects/netgrif-components/src/lib/panel/panel.module.ts
+++ b/projects/netgrif-components/src/lib/panel/panel.module.ts
@@ -42,6 +42,7 @@ import {TaskListPaginationComponent} from './task-panel-list-pagination/task-lis
     ],
     exports: [
         PanelComponent,
+        PanelItemComponent,
         TaskPanelComponent,
         CasePanelComponent,
         WorkflowPanelComponent,