diff --git a/.eslintrc.json b/.eslintrc.json
index d7977878e89..e4ec1d73d9b 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -231,7 +231,8 @@
           {
             "ignoredTypeNames": [
               "ResourceType",
-              "Error"
+              "Error",
+              "RegExp"
             ]
           }
         ],
@@ -382,6 +383,13 @@
           }
         ]
       }
+    },
+    {
+      "files": ["src/external-libraries/ng-dynamic-forms/**/*.ts"],
+      "rules": {
+        "@angular-eslint/directive-selector": "off",
+        "@angular-eslint/component-selector": "off"
+      }
     }
   ]
 }
diff --git a/package-lock.json b/package-lock.json
index 67686290421..0998aaaf427 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -22,9 +22,7 @@
         "@angular/router": "^20.3.12",
         "@angular/ssr": "^20.3.10",
         "@kolkov/ngx-gallery": "^2.0.1",
-        "@ng-bootstrap/ng-bootstrap": "^12.1.2",
-        "@ng-dynamic-forms/core": "^16.0.0",
-        "@ng-dynamic-forms/ui-ng-bootstrap": "^16.0.0",
+        "@ng-bootstrap/ng-bootstrap": "^15.1.2",
         "@ngrx/effects": "^20.1.0",
         "@ngrx/router-store": "^20.1.0",
         "@ngrx/store": "^20.1.0",
@@ -7528,50 +7526,22 @@
       }
     },
     "node_modules/@ng-bootstrap/ng-bootstrap": {
-      "version": "12.1.2",
-      "resolved": "https://registry.npmjs.org/@ng-bootstrap/ng-bootstrap/-/ng-bootstrap-12.1.2.tgz",
-      "integrity": "sha512-p27c+mYVdHiJMYrj5hwClVJxLdiZxafAqlbw1sdJh2xJ1rGOe+H/kCf5YDRbhlHqRN+34Gr0RQqIUeD1I2V8hg==",
+      "version": "15.1.2",
+      "resolved": "https://registry.npmjs.org/@ng-bootstrap/ng-bootstrap/-/ng-bootstrap-15.1.2.tgz",
+      "integrity": "sha512-mM2yiGnt9o7KZLIFp8K1vjfmVfu7HR3d8dhH5SszfArbgn9DvvQ4P5D5TDGygzyBSzeyZe18p7I8rX8vgA6DKw==",
+      "license": "MIT",
       "dependencies": {
         "tslib": "^2.3.0"
       },
       "peerDependencies": {
-        "@angular/common": "^13.0.0",
-        "@angular/core": "^13.0.0",
-        "@angular/forms": "^13.0.0",
-        "@angular/localize": "^13.0.0",
-        "@popperjs/core": "^2.10.2",
+        "@angular/common": "^16.0.0",
+        "@angular/core": "^16.0.0",
+        "@angular/forms": "^16.0.0",
+        "@angular/localize": "^16.0.0",
+        "@popperjs/core": "^2.11.6",
         "rxjs": "^6.5.3 || ^7.4.0"
       }
     },
-    "node_modules/@ng-dynamic-forms/core": {
-      "version": "16.0.0",
-      "resolved": "https://registry.npmjs.org/@ng-dynamic-forms/core/-/core-16.0.0.tgz",
-      "integrity": "sha512-fH0OIgFs/bWkVnnOtDoAAXHXb3K2UOQXm7qEgO9hg86keE2x3Tu/G/Ma6tRVi5+RfKRgvI2Q6JlMLHIQHYFAgA==",
-      "dependencies": {
-        "tslib": "^2.0.0"
-      },
-      "peerDependencies": {
-        "@angular/common": "^15.0.0",
-        "@angular/core": "^15.0.0",
-        "@angular/forms": "^15.0.0",
-        "core-js": "^3.8.1",
-        "rxjs": "^7.5.5"
-      }
-    },
-    "node_modules/@ng-dynamic-forms/ui-ng-bootstrap": {
-      "version": "16.0.0",
-      "resolved": "https://registry.npmjs.org/@ng-dynamic-forms/ui-ng-bootstrap/-/ui-ng-bootstrap-16.0.0.tgz",
-      "integrity": "sha512-qopjC+j1wfOaB6a/xSUKEpl5vohEospvhLqPl33BgNH557DQg3x3oI/oPo3caLRhIo2vpKGIeuEN5Itok0B3vg==",
-      "dependencies": {
-        "tslib": "^2.0.0"
-      },
-      "peerDependencies": {
-        "@ng-bootstrap/ng-bootstrap": "^11.0.0",
-        "@ng-dynamic-forms/core": "^16.0.0",
-        "bootstrap": "^4.0.0",
-        "ngx-mask": "^13.0.0"
-      }
-    },
     "node_modules/@ngrx/effects": {
       "version": "20.1.0",
       "resolved": "https://registry.npmjs.org/@ngrx/effects/-/effects-20.1.0.tgz",
@@ -19106,6 +19076,7 @@
       "version": "14.2.4",
       "resolved": "https://registry.npmjs.org/ngx-mask/-/ngx-mask-14.2.4.tgz",
       "integrity": "sha512-158nAe2tyiZa2T8COoI6SvJCQHqpJ4+JW0amGcvVEYUBF6FIoYK66BlnOJURAOy5qry0d0N45w7J/LGsCBgZcg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
         "tslib": "^2.3.0"
diff --git a/package.json b/package.json
index 7afdcb913be..aaa91568ea8 100644
--- a/package.json
+++ b/package.json
@@ -66,16 +66,6 @@
       "@angular/forms": "^20.3.12",
       "@angular/localize": "^20.3.12"
     },
-    "@ng-dynamic-forms/core": {
-      "@angular/common": "^20.3.12",
-      "@angular/core": "^20.3.12",
-      "@angular/forms": "^20.3.12"
-    },
-    "@ng-dynamic-forms/ui-ng-bootstrap": {
-      "ngx-mask": "14.2.4",
-      "@ng-bootstrap/ng-bootstrap": "^12.1.2",
-      "bootstrap": "^5.3"
-    },
     "@nicky-lenaers/ngx-scroll-to": {
       "@angular/common": "^20.3.12",
       "@angular/core": "^20.3.12"
@@ -95,9 +85,7 @@
     "@angular/router": "^20.3.12",
     "@angular/ssr": "^20.3.10",
     "@kolkov/ngx-gallery": "^2.0.1",
-    "@ng-bootstrap/ng-bootstrap": "^12.1.2",
-    "@ng-dynamic-forms/core": "^16.0.0",
-    "@ng-dynamic-forms/ui-ng-bootstrap": "^16.0.0",
+    "@ng-bootstrap/ng-bootstrap": "^15.1.2",
     "@ngrx/effects": "^20.1.0",
     "@ngrx/router-store": "^20.1.0",
     "@ngrx/store": "^20.1.0",
diff --git a/src/app/access-control/access-control-routes.ts b/src/app/access-control/access-control-routes.ts
index 9252c075ec7..1c7fd20625d 100644
--- a/src/app/access-control/access-control-routes.ts
+++ b/src/app/access-control/access-control-routes.ts
@@ -6,7 +6,7 @@ import { siteAdministratorGuard } from '@dspace/core/data/feature-authorization/
 import {
   DYNAMIC_ERROR_MESSAGES_MATCHER,
   DynamicErrorMessagesMatcher,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-validation-matchers';
 
 import {
   EPERSON_PATH,
diff --git a/src/app/access-control/bulk-access/browse/bulk-access-browse.component.spec.ts b/src/app/access-control/bulk-access/browse/bulk-access-browse.component.spec.ts
index d3ce4e7541f..3bffd36089a 100644
--- a/src/app/access-control/bulk-access/browse/bulk-access-browse.component.spec.ts
+++ b/src/app/access-control/bulk-access/browse/bulk-access-browse.component.spec.ts
@@ -9,7 +9,11 @@ import { PageInfo } from '@dspace/core/shared/page-info.model';
 import { createSuccessfulRemoteDataObject } from '@dspace/core/utilities/remote-data.utils';
 import {
   NgbAccordionModule,
-  NgbNavModule,
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
 } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
@@ -42,7 +46,11 @@ describe('BulkAccessBrowseComponent', () => {
     TestBed.configureTestingModule({
       imports: [
         NgbAccordionModule,
-        NgbNavModule,
+        NgbNavLink,
+        NgbNavItem,
+        NgbNavContent,
+        NgbNavOutlet,
+        NgbNav,
         TranslateModule.forRoot(),
         BulkAccessBrowseComponent,
       ],
diff --git a/src/app/access-control/bulk-access/browse/bulk-access-browse.component.ts b/src/app/access-control/bulk-access/browse/bulk-access-browse.component.ts
index 97f625f7c69..e2ca2037b1e 100644
--- a/src/app/access-control/bulk-access/browse/bulk-access-browse.component.ts
+++ b/src/app/access-control/bulk-access/browse/bulk-access-browse.component.ts
@@ -17,7 +17,11 @@ import { createSuccessfulRemoteDataObject } from '@dspace/core/utilities/remote-
 import { hasValue } from '@dspace/shared/utils/empty.util';
 import {
   NgbAccordionModule,
-  NgbNavModule,
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
 } from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
 import { NgxPaginationModule } from 'ngx-pagination';
@@ -55,7 +59,11 @@ import { BrowserOnlyPipe } from '../../../shared/utils/browser-only.pipe';
     BrowserOnlyPipe,
     ListableObjectComponentLoaderComponent,
     NgbAccordionModule,
-    NgbNavModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     NgxPaginationModule,
     PaginationComponent,
     SelectableListItemControlComponent,
diff --git a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
index dde99b9ab7d..8f2fc9272d5 100644
--- a/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
+++ b/src/app/access-control/epeople-registry/eperson-form/eperson-form.component.ts
@@ -39,12 +39,10 @@ import { PageInfo } from '@dspace/core/shared/page-info.model';
 import { Registration } from '@dspace/core/shared/registration.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicCheckboxModel,
-  DynamicFormControlModel,
-  DynamicFormLayout,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/access-control/group-registry/group-form/group-form.component.ts b/src/app/access-control/group-registry/group-form/group-form.component.ts
index 54ea6d77fcc..f66c84cd25f 100644
--- a/src/app/access-control/group-registry/group-form/group-form.component.ts
+++ b/src/app/access-control/group-registry/group-form/group-form.component.ts
@@ -43,12 +43,10 @@ import {
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlModel,
-  DynamicFormLayout,
-  DynamicInputModel,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.spec.ts b/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.spec.ts
index ce367e8862f..5e99f6b869e 100644
--- a/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.spec.ts
+++ b/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.spec.ts
@@ -16,11 +16,9 @@ import { BitstreamFormatSupportLevel } from '@dspace/core/shared/bitstream-forma
 import { RouterStub } from '@dspace/core/testing/router.stub';
 import { isEmpty } from '@dspace/shared/utils/empty.util';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicCheckboxModel,
-  DynamicFormArrayModel,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { FormComponent } from '../../../../shared/form/form.component';
diff --git a/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.ts b/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.ts
index 78d9bf7ff78..0f0d5e8d4f8 100644
--- a/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.ts
+++ b/src/app/admin/admin-registries/bitstream-formats/format-form/format-form.component.ts
@@ -13,15 +13,13 @@ import {
   hasValue,
   isEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicCheckboxModel,
-  DynamicFormArrayModel,
-  DynamicFormControlLayout,
-  DynamicFormControlModel,
-  DynamicInputModel,
-  DynamicSelectModel,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
 
 import { environment } from '../../../../../environments/environment';
 import { FormComponent } from '../../../../shared/form/form.component';
diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
index 8f456dd0b16..9525175a0b1 100644
--- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
+++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts
@@ -8,12 +8,10 @@ import {
 } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
 import { MetadataSchema } from '@dspace/core/metadata/metadata-schema.model';
-import {
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayout,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.ts b/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.ts
index 887ec2ab56c..65dd37d6335 100644
--- a/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.ts
+++ b/src/app/admin/admin-registries/metadata-schema/metadata-field-form/metadata-field-form.component.ts
@@ -10,13 +10,11 @@ import {
 import { UntypedFormGroup } from '@angular/forms';
 import { MetadataField } from '@dspace/core/metadata/metadata-field.model';
 import { MetadataSchema } from '@dspace/core/metadata/metadata-schema.model';
-import {
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayout,
-  DynamicInputModel,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/app.config.ts b/src/app/app.config.ts
index 9a799147fdb..65da60e8f0f 100644
--- a/src/app/app.config.ts
+++ b/src/app/app.config.ts
@@ -31,7 +31,7 @@ import {
 } from '@dspace/core/provide-core';
 import { XsrfInterceptor } from '@dspace/core/xsrf/xsrf.interceptor';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { DYNAMIC_MATCHER_PROVIDERS } from '@ng-dynamic-forms/core';
+import { DYNAMIC_MATCHER_PROVIDERS } from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
 import { EffectsModule } from '@ngrx/effects';
 import {
   RouterStateSerializer,
diff --git a/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.spec.ts b/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.spec.ts
index c090197a8f2..e497f7f2ef8 100644
--- a/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.spec.ts
+++ b/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.spec.ts
@@ -37,10 +37,8 @@ import {
   createSuccessfulRemoteDataObject$,
 } from '@dspace/core/utilities/remote-data.utils';
 import { hasValue } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
 
diff --git a/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.ts b/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.ts
index 21cce391bbc..6d05b39d83a 100644
--- a/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.ts
+++ b/src/app/bitstream-page/edit-bitstream-page/edit-bitstream-page.component.ts
@@ -38,13 +38,11 @@ import {
   isEmpty,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayout,
-  DynamicFormService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/collection-page/collection-form/collection-form.component.ts b/src/app/collection-page/collection-form/collection-form.component.ts
index bc049aa6b5b..f3b045291cc 100644
--- a/src/app/collection-page/collection-form/collection-form.component.ts
+++ b/src/app/collection-page/collection-form/collection-form.component.ts
@@ -24,12 +24,10 @@ import {
   isNotNull,
 } from '@dspace/shared/utils/empty.util';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlModel,
-  DynamicFormOptionConfig,
-  DynamicFormService,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormOptionConfig } from '@ng-dynamic-forms/core/model/dynamic-option-control.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/collection-page/collection-form/collection-form.models.ts b/src/app/collection-page/collection-form/collection-form.models.ts
index 90204c246f6..2e8c4c95f40 100644
--- a/src/app/collection-page/collection-form/collection-form.models.ts
+++ b/src/app/collection-page/collection-form/collection-form.models.ts
@@ -1,9 +1,7 @@
-import {
-  DynamicFormControlModel,
-  DynamicInputModel,
-  DynamicSelectModelConfig,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicSelectModelConfig } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
 
 import { environment } from '../../../environments/environment';
 
diff --git a/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.spec.ts b/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.spec.ts
index 95f2e413d9c..ade5cb0fffd 100644
--- a/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.spec.ts
+++ b/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.spec.ts
@@ -40,7 +40,13 @@ import {
   createSuccessfulRemoteDataObject,
   createSuccessfulRemoteDataObject$,
 } from '@dspace/core/utilities/remote-data.utils';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateModule,
   TranslateService,
@@ -183,7 +189,25 @@ describe('CollectionItemMapperComponent', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CommonModule, FormsModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule, CollectionItemMapperComponent, ItemSelectComponent, SearchFormComponent, PaginationComponent, EnumKeysPipe, VarDirective, ErrorComponent, LoadingComponent],
+      imports: [
+        CommonModule,
+        FormsModule,
+        RouterTestingModule.withRoutes([]),
+        TranslateModule.forRoot(),
+        NgbNavLink,
+        NgbNavItem,
+        NgbNavContent,
+        NgbNavOutlet,
+        NgbNav,
+        CollectionItemMapperComponent,
+        ItemSelectComponent,
+        SearchFormComponent,
+        PaginationComponent,
+        EnumKeysPipe,
+        VarDirective,
+        ErrorComponent,
+        LoadingComponent,
+      ],
       providers: [
         { provide: ActivatedRoute, useValue: activatedRouteStub },
         { provide: Router, useValue: routerStub },
diff --git a/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.ts b/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.ts
index e4010b271be..4ed8143b0c0 100644
--- a/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.ts
+++ b/src/app/collection-page/collection-item-mapper/collection-item-mapper.component.ts
@@ -34,7 +34,13 @@ import {
 } from '@dspace/core/shared/operators';
 import { PaginatedSearchOptions } from '@dspace/core/shared/search/models/paginated-search-options.model';
 import { isNotEmpty } from '@dspace/shared/utils/empty.util';
-import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateModule,
   TranslateService,
@@ -81,7 +87,11 @@ import { BrowserOnlyPipe } from '../../shared/utils/browser-only.pipe';
     AsyncPipe,
     BrowserOnlyPipe,
     ItemSelectComponent,
-    NgbNavModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     ThemedSearchFormComponent,
     TranslateModule,
   ],
diff --git a/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.spec.ts b/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.spec.ts
index 03f945eb831..7eadf1e095a 100644
--- a/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.spec.ts
+++ b/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.spec.ts
@@ -35,10 +35,8 @@ import {
   createSuccessfulRemoteDataObject$,
 } from '@dspace/core/utilities/remote-data.utils';
 import { hasValue } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
 
diff --git a/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.ts b/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.ts
index df87e2b12e5..539f7229a34 100644
--- a/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.ts
+++ b/src/app/collection-page/edit-collection-page/collection-source/collection-source.component.ts
@@ -35,16 +35,14 @@ import {
   hasValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayout,
-  DynamicFormService,
-  DynamicInputModel,
-  DynamicOptionControlModel,
-  DynamicRadioGroupModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicOptionControlModel } from '@ng-dynamic-forms/core/model/dynamic-option-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicRadioGroupModel } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/community-page/community-form/community-form.component.ts b/src/app/community-page/community-form/community-form.component.ts
index 8b7bd36b4c9..098a9ac090c 100644
--- a/src/app/community-page/community-form/community-form.component.ts
+++ b/src/app/community-page/community-form/community-form.component.ts
@@ -13,12 +13,10 @@ import { RequestService } from '@dspace/core/data/request.service';
 import { NotificationsService } from '@dspace/core/notification-system/notifications.service';
 import { Community } from '@dspace/core/shared/community.model';
 import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-  DynamicInputModel,
-  DynamicTextAreaModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.spec.ts b/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.spec.ts
index 3483cbab753..f8179bf96d5 100644
--- a/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.spec.ts
+++ b/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.spec.ts
@@ -12,7 +12,10 @@ import { RouterLink } from '@angular/router';
 import { Item } from '@dspace/core/shared/item.model';
 import { MetadataValue } from '@dspace/core/shared/metadata.models';
 import { ItemMetadataRepresentation } from '@dspace/core/shared/metadata-representation/item/item-metadata-representation.model';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbTooltip,
+  NgbTooltipModule,
+} from '@ng-bootstrap/ng-bootstrap';
 
 import { TruncatableComponent } from '../../../../shared/truncatable/truncatable.component';
 import { OrgUnitItemMetadataListElementComponent } from './org-unit-item-metadata-list-element.component';
@@ -30,7 +33,7 @@ describe('OrgUnitItemMetadataListElementComponent', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [
-        NgbModule,
+        NgbTooltipModule,
         OrgUnitItemMetadataListElementComponent,
       ],
       schemas: [NO_ERRORS_SCHEMA],
@@ -56,9 +59,8 @@ describe('OrgUnitItemMetadataListElementComponent', () => {
 
   it('should show the description on hover over the link in a tooltip', () => {
     const link = fixture.debugElement.query(By.css('a'));
-    link.triggerEventHandler('mouseenter', null);
-    fixture.detectChanges();
-    const tooltip = fixture.debugElement.query(By.css('.item-list-job-title')).nativeElement.textContent;
-    expect(tooltip).toBe(description);
+    const tooltipDir = link.injector.get(NgbTooltip);
+    expect(tooltipDir).toBeTruthy();
+    expect(tooltipDir.ngbTooltip).toEqual(comp.descTemplate);
   });
 });
diff --git a/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.ts b/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.ts
index aa1372ccd42..88a65fb6f50 100644
--- a/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.ts
+++ b/src/app/entity-groups/research-entities/metadata-representations/org-unit/org-unit-item-metadata-list-element.component.ts
@@ -1,4 +1,8 @@
-import { Component } from '@angular/core';
+import {
+  Component,
+  TemplateRef,
+  ViewChild,
+} from '@angular/core';
 import { RouterLink } from '@angular/router';
 import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
 
@@ -18,4 +22,5 @@ import { TruncatableComponent } from '../../../../shared/truncatable/truncatable
  * The component for displaying an item of the type OrgUnit as a metadata field
  */
 export class OrgUnitItemMetadataListElementComponent extends ItemMetadataRepresentationListElementComponent {
+  @ViewChild('descTemplate', { static: true }) descTemplate: TemplateRef<any>;
 }
diff --git a/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.spec.ts b/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.spec.ts
index 0a15667f291..8afc3973716 100644
--- a/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.spec.ts
+++ b/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.spec.ts
@@ -12,7 +12,10 @@ import { RouterLink } from '@angular/router';
 import { Item } from '@dspace/core/shared/item.model';
 import { MetadataValue } from '@dspace/core/shared/metadata.models';
 import { ItemMetadataRepresentation } from '@dspace/core/shared/metadata-representation/item/item-metadata-representation.model';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbModule,
+  NgbTooltip,
+} from '@ng-bootstrap/ng-bootstrap';
 
 import { TruncatableComponent } from '../../../../shared/truncatable/truncatable.component';
 import { PersonItemMetadataListElementComponent } from './person-item-metadata-list-element.component';
@@ -58,9 +61,8 @@ describe('PersonItemMetadataListElementComponent', () => {
 
   it('should show the description on hover over the link in a tooltip', () => {
     const link = fixture.debugElement.query(By.css('a'));
-    link.triggerEventHandler('mouseenter', null);
-    fixture.detectChanges();
-    const tooltip = fixture.debugElement.query(By.css('.item-list-job-title')).nativeElement.textContent;
-    expect(tooltip).toBe(jobTitle);
+    const tooltipDir = link.injector.get(NgbTooltip);
+    expect(tooltipDir).toBeTruthy();
+    expect(tooltipDir.ngbTooltip).toEqual(comp.descTemplate);
   });
 });
diff --git a/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.ts b/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.ts
index 737d63475b4..0499490e5b7 100644
--- a/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.ts
+++ b/src/app/entity-groups/research-entities/metadata-representations/person/person-item-metadata-list-element.component.ts
@@ -1,5 +1,9 @@
 
-import { Component } from '@angular/core';
+import {
+  Component,
+  TemplateRef,
+  ViewChild,
+} from '@angular/core';
 import { RouterLink } from '@angular/router';
 import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
 
@@ -21,4 +25,5 @@ import { TruncatableComponent } from '../../../../shared/truncatable/truncatable
  * The component for displaying an item of the type Person as a metadata field
  */
 export class PersonItemMetadataListElementComponent extends ItemMetadataRepresentationListElementComponent {
+  @ViewChild('descTemplate', { static: true }) descTemplate: TemplateRef<any>;
 }
diff --git a/src/app/health-page/health-page.component.spec.ts b/src/app/health-page/health-page.component.spec.ts
index 19b10b3930b..f2dd0b9393b 100644
--- a/src/app/health-page/health-page.component.spec.ts
+++ b/src/app/health-page/health-page.component.spec.ts
@@ -10,7 +10,13 @@ import {
   HealthResponseObj,
 } from '@dspace/core/testing/health-endpoint.mocks';
 import { TranslateLoaderMock } from '@dspace/core/testing/translate-loader.mock';
-import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateLoader,
   TranslateModule,
@@ -45,7 +51,11 @@ describe('HealthPageComponent', () => {
     await TestBed.configureTestingModule({
       imports: [
         CommonModule,
-        NgbNavModule,
+        NgbNavLink,
+        NgbNavItem,
+        NgbNavContent,
+        NgbNavOutlet,
+        NgbNav,
         TranslateModule.forRoot({
           loader: {
             provide: TranslateLoader,
diff --git a/src/app/health-page/health-page.component.ts b/src/app/health-page/health-page.component.ts
index ede8f8bc213..be5229b09f7 100644
--- a/src/app/health-page/health-page.component.ts
+++ b/src/app/health-page/health-page.component.ts
@@ -7,7 +7,13 @@ import {
   HealthInfoResponse,
   HealthResponse,
 } from '@dspace/core/shared/health-component.model';
-import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import { TranslateModule } from '@ngx-translate/core';
 import { BehaviorSubject } from 'rxjs';
 import { take } from 'rxjs/operators';
@@ -27,7 +33,11 @@ import { HealthPanelComponent } from './health-panel/health-panel.component';
     AsyncPipe,
     HealthInfoComponent,
     HealthPanelComponent,
-    NgbNavModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     TranslateModule,
   ],
 })
diff --git a/src/app/init.service.ts b/src/app/init.service.ts
index 7838a21706d..3690f331160 100644
--- a/src/app/init.service.ts
+++ b/src/app/init.service.ts
@@ -26,7 +26,7 @@ import { LAZY_DATA_SERVICES } from '@dspace/core/data-services-map';
 import { APP_DATA_SERVICES_MAP } from '@dspace/core/data-services-map-type';
 import { LocaleService } from '@dspace/core/locale/locale.service';
 import { HeadTagService } from '@dspace/core/metadata/head-tag.service';
-import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
 import {
   select,
   Store,
diff --git a/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.spec.ts b/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.spec.ts
index daa8ab535b2..b6358841036 100644
--- a/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.spec.ts
+++ b/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.spec.ts
@@ -36,7 +36,12 @@ import {
   createSuccessfulRemoteDataObject,
   createSuccessfulRemoteDataObject$,
 } from '@dspace/core/utilities/remote-data.utils';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateModule,
   TranslateService,
@@ -131,7 +136,24 @@ describe('ItemCollectionMapperComponent', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      imports: [CommonModule, FormsModule, RouterTestingModule.withRoutes([]), TranslateModule.forRoot(), NgbModule, ItemCollectionMapperComponent, CollectionSelectComponent, SearchFormComponent, PaginationComponent, EnumKeysPipe, VarDirective, ErrorComponent, LoadingComponent],
+      imports: [
+        CommonModule,
+        FormsModule,
+        RouterTestingModule.withRoutes([]),
+        TranslateModule.forRoot(),
+        NgbNavLink,
+        NgbNavItem,
+        NgbNavContent,
+        NgbNavOutlet,
+        ItemCollectionMapperComponent,
+        CollectionSelectComponent,
+        SearchFormComponent,
+        PaginationComponent,
+        EnumKeysPipe,
+        VarDirective,
+        ErrorComponent,
+        LoadingComponent,
+      ],
       providers: [
         { provide: ActivatedRoute, useValue: activatedRouteStub },
         { provide: Router, useValue: routerStub },
diff --git a/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.ts b/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.ts
index df0898efb01..b740b5df6b0 100644
--- a/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.ts
+++ b/src/app/item-page/edit-item-page/item-collection-mapper/item-collection-mapper.component.ts
@@ -33,7 +33,13 @@ import {
   hasValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateModule,
   TranslateService,
@@ -74,7 +80,11 @@ import { BrowserOnlyPipe } from '../../../shared/utils/browser-only.pipe';
     AsyncPipe,
     BrowserOnlyPipe,
     CollectionSelectComponent,
-    NgbNavModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     ThemedSearchFormComponent,
     TranslateModule,
   ],
diff --git a/src/app/process-page/overview/table/process-overview-table.component.html b/src/app/process-page/overview/table/process-overview-table.component.html
index a9aa922977a..a061fba0536 100644
--- a/src/app/process-page/overview/table/process-overview-table.component.html
+++ b/src/app/process-page/overview/table/process-overview-table.component.html
@@ -14,7 +14,7 @@ <h2 class="flex-grow-1">
     </h2>
   </div>
 
-  <div ngbCollapse #collapse="ngbCollapse" [ngbCollapse]="isCollapsed">
+  <div #collapse="ngbCollapse" [ngbCollapse]="isCollapsed">
 
     <ng-container *ngVar="(processesRD$ | async) as processesRD">
       @if (!processesRD || processesRD.isLoading) {
diff --git a/src/app/process-page/overview/table/process-overview-table.component.spec.ts b/src/app/process-page/overview/table/process-overview-table.component.spec.ts
index dca49769442..883e0cfd302 100644
--- a/src/app/process-page/overview/table/process-overview-table.component.spec.ts
+++ b/src/app/process-page/overview/table/process-overview-table.component.spec.ts
@@ -146,8 +146,7 @@ describe('ProcessOverviewTableComponent', () => {
     translateServiceSpy = jasmine.createSpyObj('TranslateService', ['get']);
 
     void TestBed.configureTestingModule({
-      declarations: [NgbCollapse],
-      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([]), VarDirective, ProcessOverviewTableComponent],
+      imports: [TranslateModule.forRoot(), RouterTestingModule.withRoutes([]), VarDirective, ProcessOverviewTableComponent, NgbCollapse],
       providers: [
         { provide: ProcessOverviewService, useValue: processOverviewService },
         { provide: ProcessDataService, useValue: processService },
diff --git a/src/app/process-page/overview/table/process-overview-table.component.ts b/src/app/process-page/overview/table/process-overview-table.component.ts
index 02b9488dee2..e96bb617526 100644
--- a/src/app/process-page/overview/table/process-overview-table.component.ts
+++ b/src/app/process-page/overview/table/process-overview-table.component.ts
@@ -36,7 +36,7 @@ import {
   hasValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import { NgbCollapseModule } from '@ng-bootstrap/ng-bootstrap';
+import { NgbCollapse } from '@ng-bootstrap/ng-bootstrap';
 import {
   TranslateModule,
   TranslateService,
@@ -83,7 +83,7 @@ export interface ProcessOverviewTableEntry {
   templateUrl: './process-overview-table.component.html',
   imports: [
     AsyncPipe,
-    NgbCollapseModule,
+    NgbCollapse,
     NgClass,
     PaginationComponent,
     RouterLink,
diff --git a/src/app/profile-page/profile-page-metadata-form/profile-page-metadata-form.component.ts b/src/app/profile-page/profile-page-metadata-form/profile-page-metadata-form.component.ts
index 114c221609c..1332f959bc5 100644
--- a/src/app/profile-page/profile-page-metadata-form/profile-page-metadata-form.component.ts
+++ b/src/app/profile-page/profile-page-metadata-form/profile-page-metadata-form.component.ts
@@ -17,12 +17,10 @@ import {
   hasValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormValueControlModel,
-  DynamicInputModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormValueControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-value-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 import { TranslateService } from '@ngx-translate/core';
 import cloneDeep from 'lodash/cloneDeep';
 
diff --git a/src/app/profile-page/profile-page-security-form/profile-page-security-form.component.ts b/src/app/profile-page/profile-page-security-form/profile-page-security-form.component.ts
index 189a7b020f4..c594fab5215 100644
--- a/src/app/profile-page/profile-page-security-form/profile-page-security-form.component.ts
+++ b/src/app/profile-page/profile-page-security-form/profile-page-security-form.component.ts
@@ -14,11 +14,9 @@ import {
   hasValue,
   isEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
index d7f8961fde2..fa8b41fa0ab 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.spec.ts
@@ -21,11 +21,9 @@ import { AuthServiceMock } from '@dspace/core/testing/auth.service.mock';
 import { NotificationsServiceStub } from '@dspace/core/testing/notifications-service.stub';
 import { createSuccessfulRemoteDataObject$ } from '@dspace/core/utilities/remote-data.utils';
 import { hasValue } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { Operation } from 'fast-json-patch';
 import { of } from 'rxjs';
diff --git a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
index db9ac721301..24f2d0387e6 100644
--- a/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
+++ b/src/app/shared/comcol/comcol-forms/comcol-form/comcol-form.component.ts
@@ -34,11 +34,9 @@ import {
   NgbModal,
   NgbModalRef,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlModel,
-  DynamicFormService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.spec.ts
index 2721374f4e4..705993cd8d0 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.spec.ts
@@ -24,41 +24,40 @@ import { Item } from '@dspace/core/shared/item.model';
 import { WorkspaceItem } from '@dspace/core/submission/models/workspaceitem.model';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
 import { createSuccessfulRemoteDataObject } from '@dspace/core/utilities/remote-data.utils';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
+import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicCheckboxGroupModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicColorPickerModel } from '@ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicEditorModel } from '@ng-dynamic-forms/core/model/editor/dynamic-editor.model';
+import { DynamicFileUploadModel } from '@ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicRadioGroupModel } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DynamicRatingModel } from '@ng-dynamic-forms/core/model/rating/dynamic-rating.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicSliderModel } from '@ng-dynamic-forms/core/model/slider/dynamic-slider.model';
+import { DynamicSwitchModel } from '@ng-dynamic-forms/core/model/switch/dynamic-switch.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicTimePickerModel } from '@ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
 import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DynamicCheckboxGroupModel,
-  DynamicCheckboxModel,
-  DynamicColorPickerModel,
-  DynamicDatePickerModel,
-  DynamicEditorModel,
-  DynamicFileUploadModel,
-  DynamicFormArrayModel,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormsCoreModule,
-  DynamicFormService,
-  DynamicInputModel,
-  DynamicRadioGroupModel,
-  DynamicRatingModel,
-  DynamicSelectModel,
-  DynamicSliderModel,
-  DynamicSwitchModel,
-  DynamicTextAreaModel,
-  DynamicTimePickerModel,
   MATCH_VISIBLE,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
-import {
-  DynamicNGBootstrapCalendarComponent,
-  DynamicNGBootstrapCheckboxComponent,
-  DynamicNGBootstrapCheckboxGroupComponent,
-  DynamicNGBootstrapInputComponent,
-  DynamicNGBootstrapRadioGroupComponent,
-  DynamicNGBootstrapSelectComponent,
-  DynamicNGBootstrapTextAreaComponent,
-  DynamicNGBootstrapTimePickerComponent,
-} from '@ng-dynamic-forms/ui-ng-bootstrap';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
+import { DynamicNGBootstrapCalendarComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component';
+import { DynamicNGBootstrapCheckboxComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component';
+import { DynamicNGBootstrapCheckboxGroupComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component';
+import { DynamicNGBootstrapInputComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component';
+import { DynamicNGBootstrapRadioGroupComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component';
+import { DynamicNGBootstrapSelectComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component';
+import { DynamicNGBootstrapTextAreaComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component';
+import { DynamicNGBootstrapTimePickerComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component';
 import { Store } from '@ngrx/store';
 import { TranslateModule } from '@ngx-translate/core';
 import { NgxMaskModule } from 'ngx-mask';
@@ -213,8 +212,9 @@ describe('DsDynamicFormControlContainerComponent test suite', () => {
       imports: [
         FormsModule,
         ReactiveFormsModule,
-        NgbModule,
-        DynamicFormsCoreModule.forRoot(),
+        NgbTooltip,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         TranslateModule.forRoot(),
         NgxMaskModule.forRoot(),
       ],
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts
index 5a7ebcd34d6..2a48003e7fd 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts
@@ -72,26 +72,32 @@ import {
 import {
   NgbModal,
   NgbModalRef,
-  NgbTooltipModule,
+  NgbTooltip,
 } from '@ng-bootstrap/ng-bootstrap';
+import { DynamicFormControlContainerComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control-container.component';
+import {
+  DynamicFormControlEvent,
+  DynamicFormControlEventType,
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormControl } from '@ng-dynamic-forms/core/component/dynamic-form-control-interface';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
 import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,
   DynamicFormArrayGroupModel,
   DynamicFormArrayModel,
+} from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import {
+  DYNAMIC_FORM_CONTROL_MAP_FN,
   DynamicFormComponentService,
-  DynamicFormControl,
-  DynamicFormControlContainerComponent,
-  DynamicFormControlEvent,
-  DynamicFormControlEventType,
   DynamicFormControlMapFn,
-  DynamicFormControlModel,
+} from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
+import {
   DynamicFormLayout,
   DynamicFormLayoutService,
-  DynamicFormRelationService,
-  DynamicFormValidationService,
-  DynamicTemplateDirective,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormRelationService } from '@ng-dynamic-forms/core/service/dynamic-form-relation.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { Store } from '@ngrx/store';
 import {
   TranslateModule,
@@ -133,7 +139,7 @@ import { NameVariantService } from './relation-lookup-modal/name-variant.service
     ExistingMetadataListElementComponent,
     ExistingRelationListElementComponent,
     FormsModule,
-    NgbTooltipModule,
+    NgbTooltip,
     NgClass,
     NgTemplateOutlet,
     ReactiveFormsModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-map-fn.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-map-fn.ts
index 5f3ce659fcd..63f49e33cb6 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-map-fn.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-map-fn.ts
@@ -1,30 +1,28 @@
 import { Type } from '@angular/core';
 import { DYNAMIC_FORM_CONTROL_TYPE_RELATION_GROUP } from '@dspace/core/shared/form/ds-dynamic-form-constants';
+import { DynamicFormControl } from '@ng-dynamic-forms/core/component/dynamic-form-control-interface';
+import { DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
 import {
-  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
-  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,
-  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP,
   DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
-  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
-  DYNAMIC_FORM_CONTROL_TYPE_INPUT,
-  DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP,
-  DYNAMIC_FORM_CONTROL_TYPE_SELECT,
-  DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA,
-  DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER,
   DynamicDatePickerModel,
-  DynamicFormControl,
-  DynamicFormControlModel,
-} from '@ng-dynamic-forms/core';
-import {
-  DynamicNGBootstrapCalendarComponent,
-  DynamicNGBootstrapCheckboxComponent,
-  DynamicNGBootstrapCheckboxGroupComponent,
-  DynamicNGBootstrapInputComponent,
-  DynamicNGBootstrapRadioGroupComponent,
-  DynamicNGBootstrapSelectComponent,
-  DynamicNGBootstrapTextAreaComponent,
-  DynamicNGBootstrapTimePickerComponent,
-} from '@ng-dynamic-forms/ui-ng-bootstrap';
+} from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_ARRAY } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_GROUP } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_INPUT } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_SELECT } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER } from '@ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model';
+import { DynamicNGBootstrapCalendarComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component';
+import { DynamicNGBootstrapCheckboxComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component';
+import { DynamicNGBootstrapCheckboxGroupComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component';
+import { DynamicNGBootstrapInputComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component';
+import { DynamicNGBootstrapRadioGroupComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component';
+import { DynamicNGBootstrapSelectComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component';
+import { DynamicNGBootstrapTextAreaComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component';
+import { DynamicNGBootstrapTimePickerComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component';
 
 import { DsDynamicFormArrayComponent } from './models/array-group/dynamic-form-array.component';
 import { CustomSwitchComponent } from './models/custom-switch/custom-switch.component';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.ts
index 2eb43b34829..09932f58485 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.ts
@@ -11,15 +11,13 @@ import {
   ViewChildren,
 } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
-import {
-  DynamicFormComponent,
-  DynamicFormComponentService,
-  DynamicFormControlContainerComponent,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormLayout,
-  DynamicTemplateDirective,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormComponent } from '@ng-dynamic-forms/core/component/dynamic-form.component';
+import { DynamicFormControlContainerComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control-container.component';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormComponentService } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 
 import { DsDynamicFormControlContainerComponent } from './ds-dynamic-form-control-container.component';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.spec.ts
index 7ef578e7aa5..320398bc245 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.spec.ts
@@ -8,13 +8,13 @@ import {
   UntypedFormControl,
 } from '@angular/forms';
 import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/form-field-metadata-value.model';
+import { DynamicFormRelationService } from '@ng-dynamic-forms/core/service/dynamic-form-relation.service';
 import {
   DISABLED_MATCHER_PROVIDER,
-  DynamicFormRelationService,
   HIDDEN_MATCHER,
   HIDDEN_MATCHER_PROVIDER,
   REQUIRED_MATCHER_PROVIDER,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
 
 import { getMockFormBuilderService } from '../../testing/form-builder-service.mock';
 import {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.ts
index 68a77c8f9ad..3b72843e557 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-type-bind-relation.service.ts
@@ -11,16 +11,18 @@ import {
   hasNoValue,
   hasValue,
 } from '@dspace/shared/utils/empty.util';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import {
+  DynamicFormControlCondition,
+  DynamicFormControlRelation,
+} from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
+import { DynamicFormRelationService } from '@ng-dynamic-forms/core/service/dynamic-form-relation.service';
 import {
   AND_OPERATOR,
   DYNAMIC_MATCHERS,
-  DynamicFormControlCondition,
   DynamicFormControlMatcher,
-  DynamicFormControlModel,
-  DynamicFormControlRelation,
-  DynamicFormRelationService,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
 import { Subscription } from 'rxjs';
 import { startWith } from 'rxjs/operators';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.spec.ts
index 576fa609e95..ef99c72d41e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.spec.ts
@@ -9,13 +9,11 @@ import { ReactiveFormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 import { APP_CONFIG } from '@dspace/config/app-config.interface';
 import { APP_DATA_SERVICES_MAP } from '@dspace/core/data-services-map-type';
-import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DynamicFormLayoutService,
-  DynamicFormService,
-  DynamicFormValidationService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { provideMockStore } from '@ngrx/store/testing';
 import {
   TranslateModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts
index ceab82bf6f0..249bdd20bd8 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/array-group/dynamic-form-array.component.ts
@@ -22,17 +22,19 @@ import {
 } from '@angular/forms';
 import { Relationship } from '@dspace/core/shared/item-relationships/relationship.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
+import { DynamicFormArrayComponent } from '@ng-dynamic-forms/core/component/dynamic-form-array.component';
 import {
-  DynamicFormArrayComponent,
   DynamicFormControlCustomEvent,
   DynamicFormControlEvent,
-  DynamicFormControlLayout,
-  DynamicFormControlModel,
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
   DynamicFormLayout,
   DynamicFormLayoutService,
-  DynamicFormValidationService,
-  DynamicTemplateDirective,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.spec.ts
index 342e36d7186..8936471d6fe 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.spec.ts
@@ -11,10 +11,9 @@ import {
 } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import {
-  DynamicFormsCoreModule,
-  DynamicFormService,
-} from '@ng-dynamic-forms/core';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { CustomSwitchComponent } from './custom-switch.component';
@@ -36,7 +35,8 @@ describe('CustomSwitchComponent', () => {
         TranslateModule.forRoot(),
         ReactiveFormsModule,
         NoopAnimationsModule,
-        DynamicFormsCoreModule.forRoot(),
+        DynamicListDirective,
+        DynamicTemplateDirective,
         CustomSwitchComponent,
       ],
     }).compileComponents().then(() => {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.ts
index e99b53a99ce..c90c7f6aaf1 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.component.ts
@@ -9,11 +9,9 @@ import {
   ReactiveFormsModule,
   UntypedFormGroup,
 } from '@angular/forms';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicNGBootstrapCheckboxComponent } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+import { DynamicNGBootstrapCheckboxComponent } from '@ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { DynamicCustomSwitchModel } from './custom-switch.model';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.model.ts
index 4a7e7a22bed..f9ca9cc15f2 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/custom-switch/custom-switch.model.ts
@@ -1,9 +1,10 @@
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
 import {
   DynamicCheckboxModel,
   DynamicCheckboxModelConfig,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+
 
 export const DYNAMIC_FORM_CONTROL_TYPE_CUSTOM_SWITCH = 'CUSTOM_SWITCH';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.spec.ts
index c3b488ef76c..2bba8ee6ceb 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.spec.ts
@@ -13,11 +13,10 @@ import {
 import { By } from '@angular/platform-browser';
 import { NoopAnimationsModule } from '@angular/platform-browser/animations';
 import { NgbDatepickerModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicDatePickerModel,
-  DynamicFormsCoreModule,
-  DynamicFormService,
-} from '@ng-dynamic-forms/core';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
 
 import { DsDatePickerInlineComponent } from './dynamic-date-picker-inline.component';
 
@@ -38,7 +37,8 @@ describe('DsDatePickerInlineComponent test suite', () => {
         ReactiveFormsModule,
         NoopAnimationsModule,
         NgbDatepickerModule,
-        DynamicFormsCoreModule.forRoot(),
+        DynamicListDirective,
+        DynamicTemplateDirective,
         DsDatePickerInlineComponent,
       ],
     }).compileComponents().then(() => {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.ts
index 5c4fe42a91f..dcc4f43ca09 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker-inline/dynamic-date-picker-inline.component.ts
@@ -15,13 +15,11 @@ import {
   NgbDatepickerConfig,
   NgbDatepickerModule,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicDatePickerModel,
-  DynamicFormControlComponent,
-  DynamicFormControlLayout,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 
 import { BtnDisabledDirective } from '../../../../../btn-disabled.directive';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.spec.ts
index 7af8b36b65b..b80d53f3c00 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.spec.ts
@@ -25,10 +25,8 @@ import {
 } from '@dspace/core/testing/dynamic-form-mock-services';
 import { createTestComponent } from '@dspace/core/testing/utils.test';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.ts
index f0475fdf61a..e900d75e91b 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component.ts
@@ -15,11 +15,9 @@ import {
   UntypedFormGroup,
 } from '@angular/forms';
 import { hasValue } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlComponent,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import isEqual from 'lodash/isEqual';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.model.ts
index 33e0ee9ca48..0c62a83e0c4 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.model.ts
@@ -3,14 +3,12 @@ import {
   isEmpty,
   isNotUndefined,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicDateControlModel,
-  DynamicDatePickerModelConfig,
-  DynamicFormControlLayout,
-  DynamicFormControlModel,
-  DynamicFormControlRelation,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicDatePickerModelConfig } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicDateControlModel } from '@ng-dynamic-forms/core/model/dynamic-date-control.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import {
   BehaviorSubject,
   Subject,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.spec.ts
index 26d3f51ac7d..a27e2abd6af 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.spec.ts
@@ -17,10 +17,8 @@ import {
   mockDynamicFormLayoutService,
   mockDynamicFormValidationService,
 } from '@dspace/core/testing/dynamic-form-mock-services';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { DsDynamicDisabledComponent } from './dynamic-disabled.component';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.ts
index dfdfeb960e9..392b31a82af 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.component.ts
@@ -5,11 +5,9 @@ import {
   Output,
 } from '@angular/core';
 import { UntypedFormGroup } from '@angular/forms';
-import {
-  DynamicFormControlComponent,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 
 import { DynamicDisabledModel } from './dynamic-disabled.model';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.model.ts
index 5902a7cc3d0..36595eb9939 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/disabled/dynamic-disabled.model.ts
@@ -1,7 +1,5 @@
-import {
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-concat.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-concat.model.ts
index 374d046b318..35a3dbb275b 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-concat.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-concat.model.ts
@@ -5,13 +5,13 @@ import {
   hasNoValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
 import {
-  DynamicFormControlLayout,
-  DynamicFormControlRelation,
   DynamicFormGroupModel,
   DynamicFormGroupModelConfig,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import { Subject } from 'rxjs';
 
 import { DsDynamicInputModel } from './ds-dynamic-input.model';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model.ts
index 8d1edcc27f3..caf3ed47a4b 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model.ts
@@ -3,13 +3,13 @@ import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/fo
 import { RelationshipOptions } from '@dspace/core/shared/relationship-options.model';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
 import {
-  DynamicFormControlLayout,
-  DynamicFormControlRelation,
   DynamicInputModel,
   DynamicInputModelConfig,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import { Subject } from 'rxjs';
 
 export interface DsDynamicInputModelConfig extends DynamicInputModelConfig {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-qualdrop.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-qualdrop.model.ts
index 16d52a7330b..d5b35bde65d 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-qualdrop.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-qualdrop.model.ts
@@ -1,10 +1,10 @@
 import { LanguageCode } from '@dspace/core/shared/form/models/form-field-language-value.model';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
 import {
-  DynamicFormControlLayout,
   DynamicFormGroupModel,
   DynamicFormGroupModelConfig,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 import { Subject } from 'rxjs';
 
 import { DsDynamicInputModel } from './ds-dynamic-input.model';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-array-model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-array-model.ts
index 2761f365a09..48270a4d5f3 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-array-model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-array-model.ts
@@ -1,12 +1,12 @@
 import { RelationshipOptions } from '@dspace/core/shared/relationship-options.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
 import {
   DynamicFormArrayModel,
   DynamicFormArrayModelConfig,
-  DynamicFormControlLayout,
-  DynamicFormControlRelation,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 
 export interface DynamicRowArrayModelConfig extends DynamicFormArrayModelConfig {
   notRepeatable: boolean;
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-group-model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-group-model.ts
index b6d76b4c55b..f555dea5371 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-group-model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-row-group-model.ts
@@ -1,4 +1,4 @@
-import { DynamicFormGroupModel } from '@ng-dynamic-forms/core';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
 
 export class DynamicRowGroupModel extends DynamicFormGroupModel {
   isRowGroup = true;
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-textarea.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-textarea.model.ts
index 532acf720a0..a83472c2e10 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-textarea.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/ds-dynamic-textarea.model.ts
@@ -1,8 +1,6 @@
-import {
-  DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
index f249016c022..03bbb191bd7 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/dynamic-vocabulary.component.ts
@@ -10,11 +10,9 @@ import { PageInfo } from '@dspace/core/shared/page-info.model';
 import { VocabularyEntry } from '@dspace/core/submission/vocabularies/models/vocabulary-entry.model';
 import { VocabularyService } from '@dspace/core/submission/vocabularies/vocabulary.service';
 import { isNotEmpty } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlComponent,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import {
   Observable,
   of,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/form-group/dynamic-form-group.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/form-group/dynamic-form-group.component.ts
index 561132893cc..fbfad520929 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/form-group/dynamic-form-group.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/form-group/dynamic-form-group.component.ts
@@ -12,18 +12,20 @@ import {
   ReactiveFormsModule,
   UntypedFormGroup,
 } from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
 import {
-  DynamicFormControlComponent,
   DynamicFormControlCustomEvent,
   DynamicFormControlEvent,
-  DynamicFormControlLayout,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
   DynamicFormLayout,
   DynamicFormLayoutService,
-  DynamicFormValidationService,
-  DynamicTemplateDirective,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 
 import { DsDynamicFormControlContainerComponent } from '../../ds-dynamic-form-control-container.component';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-checkbox-group.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-checkbox-group.model.ts
index 05ef4cb1015..2a679b0a93b 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-checkbox-group.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-checkbox-group.model.ts
@@ -1,13 +1,11 @@
 import { VocabularyEntry } from '@dspace/core/submission/vocabularies/models/vocabulary-entry.model';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicCheckboxGroupModel,
-  DynamicFormControlLayout,
-  DynamicFormControlRelation,
-  DynamicFormGroupModelConfig,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicCheckboxGroupModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicFormGroupModelConfig } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import { Subject } from 'rxjs';
 
 export interface DynamicListCheckboxGroupModelConfig extends DynamicFormGroupModelConfig {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-radio-group.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-radio-group.model.ts
index 5b9c6801823..461e694549e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-radio-group.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list-radio-group.model.ts
@@ -1,13 +1,14 @@
 import { VocabularyEntry } from '@dspace/core/submission/vocabularies/models/vocabulary-entry.model';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
 import { hasValue } from '@dspace/shared/utils/empty.util';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import {
-  DynamicFormControlLayout,
-  DynamicFormControlRelation,
   DynamicRadioGroupModel,
   DynamicRadioGroupModelConfig,
-  serializable,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+
 
 export interface DynamicListModelConfig extends DynamicRadioGroupModelConfig<any> {
   vocabularyOptions: VocabularyOptions;
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html
index 3c58f495321..5e21353d364 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.html
@@ -37,11 +37,9 @@
   @if (!model.repeatable) {
     <div
       class="row"
-      ngbRadioGroup
       [attr.tabindex]="model.tabIndex"
       [id]="id"
-      [ngClass]="model.layout.element?.control"
-      (change)="onChange($event)">
+      [ngClass]="model.layout.element?.control">
       @for (columnItems of items; track columnItems) {
         <div class="col-sm">
           @for (item of columnItems; track item) {
@@ -52,6 +50,7 @@
                 [name]="model.id"
                 [required]="model.required"
                 [value]="item.index"
+                (change)="onChange($event)"
                 (blur)="onBlur($event)"
                 (focus)="onFocus($event)"/>
               <label class="form-check-label"
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts
index b54909b040e..ef1f4ba9271 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.spec.ts
@@ -29,13 +29,11 @@ import { createTestComponent } from '@dspace/core/testing/utils.test';
 import { VocabularyServiceStub } from '@dspace/core/testing/vocabulary-service.stub';
 import { createSuccessfulRemoteDataObject$ } from '@dspace/core/utilities/remote-data.utils';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlLayout,
-  DynamicFormLayoutService,
-  DynamicFormsCoreModule,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 
 import { FormBuilderService } from '../../../form-builder.service';
 import { DsDynamicListComponent } from './dynamic-list.component';
@@ -103,8 +101,8 @@ describe('DsDynamicListComponent test suite', () => {
 
     TestBed.configureTestingModule({
       imports: [
-        DynamicFormsCoreModule,
-        DynamicFormsNGBootstrapUIModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         FormsModule,
         ReactiveFormsModule,
         NgbModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.ts
index a356656c9cc..a03eed80057 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/list/dynamic-list.component.ts
@@ -27,13 +27,10 @@ import {
   hasValue,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import { NgbButtonsModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicCheckboxModel,
-  DynamicFormControlComponent,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import findKey from 'lodash/findKey';
 import {
@@ -66,7 +63,6 @@ export interface ListItem {
   templateUrl: './dynamic-list.component.html',
   imports: [
     AsyncPipe,
-    NgbButtonsModule,
     NgClass,
     ReactiveFormsModule,
     ThemedLoadingComponent,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup-name.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup-name.model.ts
index a9fc6fc4291..7c1bee2399e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup-name.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup-name.model.ts
@@ -1,7 +1,5 @@
-import {
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 
 import {
   DynamicLookupModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.spec.ts
index cf9b10ea946..8bc021e2957 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.spec.ts
@@ -30,12 +30,10 @@ import {
 import { createTestComponent } from '@dspace/core/testing/utils.test';
 import { VocabularyServiceStub } from '@dspace/core/testing/vocabulary-service.stub';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormsCoreModule,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 import { of } from 'rxjs';
@@ -164,8 +162,8 @@ describe('Dynamic Lookup component', () => {
     vocabularyServiceStub = new VocabularyServiceStub();
     TestBed.configureTestingModule({
       imports: [
-        DynamicFormsCoreModule,
-        DynamicFormsNGBootstrapUIModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         FormsModule,
         InfiniteScrollModule,
         ReactiveFormsModule,
@@ -596,8 +594,8 @@ describe('Dynamic Lookup component', () => {
   selector: 'ds-test-cmp',
   template: ``,
   imports: [
-    DynamicFormsCoreModule,
-    DynamicFormsNGBootstrapUIModule,
+    DynamicListDirective,
+    DynamicTemplateDirective,
     FormsModule,
     InfiniteScrollModule,
     NgbModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.ts
index 2758b2d5ff8..c75681bc32c 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component.ts
@@ -35,10 +35,8 @@ import {
   NgbDropdownModule,
   NgbTooltipModule,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 import {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.model.ts
index bc8d2e96305..4ea71445564 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.model.ts
@@ -1,8 +1,6 @@
-import {
-  AUTOCOMPLETE_OFF,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { AUTOCOMPLETE_OFF } from '@ng-dynamic-forms/core/utils/autofill.utils';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.spec.ts
index 97fbaf03686..a8e04ec7758 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.spec.ts
@@ -35,12 +35,10 @@ import {
   NgbModal,
   NgbModule,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormsCoreModule,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { getTestScheduler } from 'jasmine-marbles';
 import { of } from 'rxjs';
@@ -149,8 +147,8 @@ describe('DsDynamicOneboxComponent test suite', () => {
     init();
     TestBed.configureTestingModule({
       imports: [
-        DynamicFormsCoreModule,
-        DynamicFormsNGBootstrapUIModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         FormsModule,
         NgbModule,
         ReactiveFormsModule,
@@ -475,8 +473,8 @@ describe('DsDynamicOneboxComponent test suite', () => {
   template: ``,
   imports: [
     CdkTreeModule,
-    DynamicFormsCoreModule,
-    DynamicFormsNGBootstrapUIModule,
+    DynamicListDirective,
+    DynamicTemplateDirective,
     FormsModule,
     NgbModule,
     ReactiveFormsModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
index 8b3901106e7..200120a4a9e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.component.ts
@@ -41,10 +41,8 @@ import {
   NgbTypeaheadModule,
   NgbTypeaheadSelectItemEvent,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import {
   Observable,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model.ts
index bce1dc5f19d..909dda5bee4 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/onebox/dynamic-onebox.model.ts
@@ -1,8 +1,6 @@
-import {
-  AUTOCOMPLETE_OFF,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { AUTOCOMPLETE_OFF } from '@ng-dynamic-forms/core/utils/autofill.utils';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.component.spec.ts
index 42f8b0c3b2a..e02aa502ce4 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.component.spec.ts
@@ -30,11 +30,9 @@ import {
   NgbModule,
   NgbTooltipModule,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { provideMockStore } from '@ngrx/store/testing';
 import { TranslateModule } from '@ngx-translate/core';
 
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.components.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.components.ts
index b77b6d92343..a80c229f7f6 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.components.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.components.ts
@@ -28,14 +28,12 @@ import {
 } from '@dspace/shared/utils/empty.util';
 import { hasOnlyEmptyProperties } from '@dspace/shared/utils/object.util';
 import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormControlComponent,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import isEqual from 'lodash/isEqual';
 import isObject from 'lodash/isObject';
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.model.ts
index a61c27f5405..a8c1d40e82b 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/relation-group/dynamic-relation-group.model.ts
@@ -4,10 +4,8 @@ import {
   isEmpty,
   isNull,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.spec.ts
index c5cf464d273..61565e09e3f 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.spec.ts
@@ -34,12 +34,10 @@ import {
 } from '@dspace/core/testing/utils.test';
 import { VocabularyServiceStub } from '@dspace/core/testing/vocabulary-service.stub';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormsCoreModule,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
 
@@ -87,8 +85,8 @@ describe('Dynamic Dynamic Scrollable Dropdown component', () => {
 
     TestBed.configureTestingModule({
       imports: [
-        DynamicFormsCoreModule,
-        DynamicFormsNGBootstrapUIModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         FormsModule,
         InfiniteScrollModule,
         ReactiveFormsModule,
@@ -243,8 +241,8 @@ describe('Dynamic Dynamic Scrollable Dropdown component', () => {
   selector: 'ds-test-cmp',
   template: ``,
   imports: [
-    DynamicFormsCoreModule,
-    DynamicFormsNGBootstrapUIModule,
+    DynamicListDirective,
+    DynamicTemplateDirective,
     FormsModule,
     InfiniteScrollModule,
     NgbModule,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.ts
index 11894f8420c..94b659f80e9 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.component.ts
@@ -36,10 +36,8 @@ import {
   NgbDropdown,
   NgbDropdownModule,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { InfiniteScrollDirective } from 'ngx-infinite-scroll';
 import {
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model.ts
index a771b8619e1..bcbdf893073 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/scrollable-dropdown/dynamic-scrollable-dropdown.model.ts
@@ -1,10 +1,8 @@
 import { ResourceType } from '@dspace/core/shared/resource-type';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
-import {
-  AUTOCOMPLETE_OFF,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { AUTOCOMPLETE_OFF } from '@ng-dynamic-forms/core/utils/autofill.utils';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.spec.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.spec.ts
index 5c33467444e..3cac7e6e8b0 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.spec.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.spec.ts
@@ -32,12 +32,10 @@ import {
   NgbModule,
   NgbTypeaheadSelectItemEvent,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormsCoreModule,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
-import { DynamicFormsNGBootstrapUIModule } from '@ng-dynamic-forms/ui-ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateModule } from '@ngx-translate/core';
 import { of } from 'rxjs';
 
@@ -100,8 +98,8 @@ describe('DsDynamicTagComponent test suite', () => {
     TestBed.configureTestingModule({
       imports: [
         TranslateModule.forRoot(),
-        DynamicFormsCoreModule,
-        DynamicFormsNGBootstrapUIModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
         FormsModule,
         NgbModule,
         ReactiveFormsModule,
@@ -310,8 +308,9 @@ describe('DsDynamicTagComponent test suite', () => {
 @Component({
   selector: 'ds-test-cmp',
   template: ``,
-  imports: [DynamicFormsCoreModule,
-    DynamicFormsNGBootstrapUIModule,
+  imports: [
+    DynamicListDirective,
+    DynamicTemplateDirective,
     FormsModule,
     NgbModule,
     ReactiveFormsModule],
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.ts
index 9270ca61ed9..ad9a30a0e82 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.component.ts
@@ -29,10 +29,8 @@ import {
   NgbTypeaheadModule,
   NgbTypeaheadSelectItemEvent,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormLayoutService,
-  DynamicFormValidationService,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormLayoutService } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import isEqual from 'lodash/isEqual';
 import {
   Observable,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.model.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.model.ts
index 2c7e2c5670b..1b2f5300e68 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.model.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/models/tag/dynamic-tag.model.ts
@@ -1,8 +1,6 @@
-import {
-  AUTOCOMPLETE_OFF,
-  DynamicFormControlLayout,
-  serializable,
-} from '@ng-dynamic-forms/core';
+import { serializable } from '@ng-dynamic-forms/core/decorator/serializable.decorator';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { AUTOCOMPLETE_OFF } from '@ng-dynamic-forms/core/utils/autofill.utils';
 
 import {
   DsDynamicInputModel,
diff --git a/src/app/shared/form/builder/ds-dynamic-form-ui/type-bind.utils.ts b/src/app/shared/form/builder/ds-dynamic-form-ui/type-bind.utils.ts
index 1d09e9fafbe..dca883e939e 100644
--- a/src/app/shared/form/builder/ds-dynamic-form-ui/type-bind.utils.ts
+++ b/src/app/shared/form/builder/ds-dynamic-form-ui/type-bind.utils.ts
@@ -1,9 +1,10 @@
+import { DynamicFormControlRelation } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
 import {
-  DynamicFormControlRelation,
   MATCH_ENABLED,
   MATCH_VISIBLE,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
+
 
 /**
  * Get the type bind values from the REST data for a specific field
diff --git a/src/app/shared/form/builder/form-builder.service.spec.ts b/src/app/shared/form/builder/form-builder.service.spec.ts
index 7645e329c5f..9a2d519f1a6 100644
--- a/src/app/shared/form/builder/form-builder.service.spec.ts
+++ b/src/app/shared/form/builder/form-builder.service.spec.ts
@@ -19,27 +19,21 @@ import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/fo
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
 import { getMockTranslateService } from '@dspace/core/testing/translate.service.mock';
 import { createSuccessfulRemoteDataObject$ } from '@dspace/core/utilities/remote-data.utils';
-import {
-  DynamicCheckboxGroupModel,
-  DynamicCheckboxModel,
-  DynamicColorPickerModel,
-  DynamicDatePickerModel,
-  DynamicEditorModel,
-  DynamicFileUploadModel,
-  DynamicFormArrayModel,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormValidationService,
-  DynamicFormValueControlModel,
-  DynamicInputModel,
-  DynamicRadioGroupModel,
-  DynamicRatingModel,
-  DynamicSelectModel,
-  DynamicSliderModel,
-  DynamicSwitchModel,
-  DynamicTextAreaModel,
-  DynamicTimePickerModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicCheckboxGroupModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormValueControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-value-control.model';
+import { DynamicFileUploadModel } from '@ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicRadioGroupModel } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicSwitchModel } from '@ng-dynamic-forms/core/model/switch/dynamic-switch.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicTimePickerModel } from '@ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
 import { TranslateService } from '@ngx-translate/core';
 
 import { DynamicDsDatePickerModel } from './ds-dynamic-form-ui/models/date-picker/date-picker.model';
@@ -199,22 +193,14 @@ describe('FormBuilderService test suite', () => {
         },
       ),
 
-      new DynamicSliderModel({ id: 'testSlider' }),
-
       new DynamicSwitchModel({ id: 'testSwitch' }),
 
       new DynamicDatePickerModel({ id: 'testDatepicker', value: new Date() }),
 
       new DynamicFileUploadModel({ id: 'testFileUpload' }),
 
-      new DynamicEditorModel({ id: 'testEditor' }),
-
       new DynamicTimePickerModel({ id: 'testTimePicker' }),
 
-      new DynamicRatingModel({ id: 'testRating' }),
-
-      new DynamicColorPickerModel({ id: 'testColorPicker' }),
-
       new DynamicOneboxModel({
         id: 'testOnebox',
         repeatable: false,
@@ -477,14 +463,10 @@ describe('FormBuilderService test suite', () => {
     expect(service.findById('testInput', testModel) instanceof DynamicFormControlModel).toBe(true);
     expect(service.findById('testRadioGroup', testModel) instanceof DynamicFormControlModel).toBe(true);
     expect(service.findById('testSelect', testModel) instanceof DynamicFormControlModel).toBe(true);
-    expect(service.findById('testSlider', testModel) instanceof DynamicFormControlModel).toBe(true);
     expect(service.findById('testSwitch', testModel) instanceof DynamicFormControlModel).toBe(true);
     expect(service.findById('testTextArea', testModel) instanceof DynamicFormControlModel).toBe(true);
     expect(service.findById('testFileUpload', testModel) instanceof DynamicFormControlModel).toBe(true);
-    expect(service.findById('testEditor', testModel) instanceof DynamicEditorModel).toBe(true);
     expect(service.findById('testTimePicker', testModel) instanceof DynamicTimePickerModel).toBe(true);
-    expect(service.findById('testRating', testModel) instanceof DynamicRatingModel).toBe(true);
-    expect(service.findById('testColorPicker', testModel) instanceof DynamicColorPickerModel).toBe(true);
     expect(service.findById('testConcatGroup', testModel) instanceof DynamicConcatModel).toBe(true);
   });
 
@@ -702,10 +684,7 @@ describe('FormBuilderService test suite', () => {
     expect(formGroup.get('testSelect') instanceof UntypedFormControl).toBe(true);
     expect(formGroup.get('testTextArea') instanceof UntypedFormControl).toBe(true);
     expect(formGroup.get('testFileUpload') instanceof UntypedFormControl).toBe(true);
-    expect(formGroup.get('testEditor') instanceof UntypedFormControl).toBe(true);
     expect(formGroup.get('testTimePicker') instanceof UntypedFormControl).toBe(true);
-    expect(formGroup.get('testRating') instanceof UntypedFormControl).toBe(true);
-    expect(formGroup.get('testColorPicker') instanceof UntypedFormControl).toBe(true);
   });
 
   it('should throw when unknown DynamicFormControlModel id is specified in JSON', () => {
diff --git a/src/app/shared/form/builder/form-builder.service.ts b/src/app/shared/form/builder/form-builder.service.ts
index b7829896cfa..b35186a533b 100644
--- a/src/app/shared/form/builder/form-builder.service.ts
+++ b/src/app/shared/form/builder/form-builder.service.ts
@@ -26,23 +26,25 @@ import {
   isNotUndefined,
   isNull,
 } from '@dspace/shared/utils/empty.util';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
 import {
   DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
-  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP,
-  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
-  DYNAMIC_FORM_CONTROL_TYPE_INPUT,
-  DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP,
   DynamicFormArrayGroupModel,
   DynamicFormArrayModel,
-  DynamicFormComponentService,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
+} from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
   DynamicFormGroupModel,
-  DynamicFormService,
-  DynamicFormValidationService,
-  DynamicPathable,
-  parseReviver,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_INPUT } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicPathable } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-path.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { DynamicFormComponentService } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+import { parseReviver } from '@ng-dynamic-forms/core/utils/json.utils';
 import isObject from 'lodash/isObject';
 import isString from 'lodash/isString';
 import mergeWith from 'lodash/mergeWith';
diff --git a/src/app/shared/form/builder/parsers/dropdown-field-parser.ts b/src/app/shared/form/builder/parsers/dropdown-field-parser.ts
index 815fefe2afd..4d491a4212b 100644
--- a/src/app/shared/form/builder/parsers/dropdown-field-parser.ts
+++ b/src/app/shared/form/builder/parsers/dropdown-field-parser.ts
@@ -2,7 +2,7 @@ import { Inject } from '@angular/core';
 import { FormFieldModel } from '@dspace/core/shared/form/models/form-field.model';
 import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/form-field-metadata-value.model';
 import { isNotEmpty } from '@dspace/shared/utils/empty.util';
-import { DynamicFormControlLayout } from '@ng-dynamic-forms/core';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 import { TranslateService } from '@ngx-translate/core';
 
 import {
diff --git a/src/app/shared/form/builder/parsers/field-parser.ts b/src/app/shared/form/builder/parsers/field-parser.ts
index be849852e50..cfa9bcf6fc8 100644
--- a/src/app/shared/form/builder/parsers/field-parser.ts
+++ b/src/app/shared/form/builder/parsers/field-parser.ts
@@ -16,7 +16,7 @@ import {
   isNotNull,
   isNotUndefined,
 } from '@dspace/shared/utils/empty.util';
-import { DynamicFormControlLayout } from '@ng-dynamic-forms/core';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
 import { TranslateService } from '@ngx-translate/core';
 import uniqueId from 'lodash/uniqueId';
 
diff --git a/src/app/shared/form/builder/parsers/onebox-field-parser.ts b/src/app/shared/form/builder/parsers/onebox-field-parser.ts
index 16e0b30b44a..9d37e5a6a04 100644
--- a/src/app/shared/form/builder/parsers/onebox-field-parser.ts
+++ b/src/app/shared/form/builder/parsers/onebox-field-parser.ts
@@ -3,7 +3,7 @@ import { isNotEmpty } from '@dspace/shared/utils/empty.util';
 import {
   DynamicSelectModel,
   DynamicSelectModelConfig,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 
 import { environment } from '../../../../../environments/environment';
 import {
diff --git a/src/app/shared/form/builder/parsers/parser.utils.ts b/src/app/shared/form/builder/parsers/parser.utils.ts
index 7d8aa20ae87..efe7afd3cda 100644
--- a/src/app/shared/form/builder/parsers/parser.utils.ts
+++ b/src/app/shared/form/builder/parsers/parser.utils.ts
@@ -5,7 +5,8 @@ import {
 import {
   DynamicFormControlLayout,
   DynamicFormControlLayoutConfig,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+
 
 export function setLayout(model: any, controlLayout: string, controlLayoutConfig: string, style: string) {
   if (isNull(model.layout)) {
diff --git a/src/app/shared/form/builder/parsers/row-parser.ts b/src/app/shared/form/builder/parsers/row-parser.ts
index 3bc73caa2d2..cec92d819a2 100644
--- a/src/app/shared/form/builder/parsers/row-parser.ts
+++ b/src/app/shared/form/builder/parsers/row-parser.ts
@@ -11,10 +11,8 @@ import {
   isEmpty,
   isNotEmpty,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
-  DynamicFormGroupModelConfig,
-} from '@ng-dynamic-forms/core';
+import { DYNAMIC_FORM_CONTROL_TYPE_ARRAY } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModelConfig } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
 import uniqueId from 'lodash/uniqueId';
 
 import { DynamicRowGroupModel } from '../ds-dynamic-form-ui/models/ds-dynamic-row-group-model';
diff --git a/src/app/shared/form/form.component.spec.ts b/src/app/shared/form/form.component.spec.ts
index 14446fd4ab3..4bf17ff4ff9 100644
--- a/src/app/shared/form/form.component.spec.ts
+++ b/src/app/shared/form/form.component.spec.ts
@@ -19,13 +19,12 @@ import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/fo
 import { StoreMock } from '@dspace/core/testing/store.mock';
 import { createTestComponent } from '@dspace/core/testing/utils.test';
 import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormArrayModel,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormsCoreModule,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
 import {
   Store,
   StoreModule,
@@ -460,7 +459,8 @@ describe('FormComponent', () => {
   `,
   imports: [
     DsDynamicFormComponent,
-    DynamicFormsCoreModule,
+    DynamicListDirective,
+    DynamicTemplateDirective,
     FormComponent,
     FormsModule,
     NgbModule,
diff --git a/src/app/shared/form/form.component.ts b/src/app/shared/form/form.component.ts
index 0ec572a6f98..9cebc5c8808 100644
--- a/src/app/shared/form/form.component.ts
+++ b/src/app/shared/form/form.component.ts
@@ -23,14 +23,12 @@ import {
   isNull,
 } from '@dspace/shared/utils/empty.util';
 import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormArrayModel,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicFormLayout,
-  DynamicFormsCoreModule,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import { TranslateModule } from '@ngx-translate/core';
 import findIndex from 'lodash/findIndex';
 import {
@@ -64,7 +62,7 @@ import { FormService } from './form.service';
     AsyncPipe,
     BtnDisabledDirective,
     DsDynamicFormComponent,
-    DynamicFormsCoreModule,
+    DynamicTemplateDirective,
     ReactiveFormsModule,
     TranslateModule,
   ],
diff --git a/src/app/shared/form/form.service.spec.ts b/src/app/shared/form/form.service.spec.ts
index 81ca2ba074e..470c723884e 100644
--- a/src/app/shared/form/form.service.spec.ts
+++ b/src/app/shared/form/form.service.spec.ts
@@ -9,11 +9,9 @@ import {
   UntypedFormGroup,
   Validators,
 } from '@angular/forms';
-import {
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
 import {
   Store,
   StoreModule,
diff --git a/src/app/shared/form/form.service.ts b/src/app/shared/form/form.service.ts
index 2878bafc59b..d1f2a984d43 100644
--- a/src/app/shared/form/form.service.ts
+++ b/src/app/shared/form/form.service.ts
@@ -9,11 +9,9 @@ import {
   isEmpty,
   isNotUndefined,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
 import {
   select,
   Store,
diff --git a/src/app/shared/form/testing/form-event.stub.ts b/src/app/shared/form/testing/form-event.stub.ts
index 6380a4b2ff9..86398536411 100644
--- a/src/app/shared/form/testing/form-event.stub.ts
+++ b/src/app/shared/form/testing/form-event.stub.ts
@@ -2,10 +2,9 @@ import {
   UntypedFormControl,
   UntypedFormGroup,
 } from '@angular/forms';
-import {
-  DynamicCheckboxModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+
 
 export const accessConditionChangeEvent = {
   $event: {
diff --git a/src/app/shared/form/testing/form-models.mock.ts b/src/app/shared/form/testing/form-models.mock.ts
index 087cff1a55f..e405d76a1f6 100644
--- a/src/app/shared/form/testing/form-models.mock.ts
+++ b/src/app/shared/form/testing/form-models.mock.ts
@@ -4,7 +4,7 @@ import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/fo
 import { SubmissionScopeType } from '@dspace/core/submission/submission-scope-type';
 import { VocabularyEntry } from '@dspace/core/submission/vocabularies/models/vocabulary-entry.model';
 import { VocabularyOptions } from '@dspace/core/submission/vocabularies/models/vocabulary-options.model';
-import { DynamicSelectModel } from '@ng-dynamic-forms/core';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 
 import { DsDynamicInputModel } from '../builder/ds-dynamic-form-ui/models/ds-dynamic-input.model';
 import { DynamicQualdropModel } from '../builder/ds-dynamic-form-ui/models/ds-dynamic-qualdrop.model';
diff --git a/src/app/shared/resource-policies/form/resource-policy-form.component.spec.ts b/src/app/shared/resource-policies/form/resource-policy-form.component.spec.ts
index 3bdc92a7458..8808af80020 100644
--- a/src/app/shared/resource-policies/form/resource-policy-form.component.spec.ts
+++ b/src/app/shared/resource-policies/form/resource-policy-form.component.spec.ts
@@ -42,8 +42,14 @@ import {
   stringToNgbDateStruct,
 } from '@dspace/shared/utils/date.util';
 import { isNotEmptyOperator } from '@dspace/shared/utils/empty.util';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core';
+import {
+  NgbNav,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
+} from '@ng-bootstrap/ng-bootstrap';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
 import { provideMockStore } from '@ngrx/store/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { getTestScheduler } from 'jasmine-marbles';
@@ -207,7 +213,11 @@ describe('ResourcePolicyFormComponent test suite', () => {
       imports: [
         CommonModule,
         FormsModule,
-        NgbModule,
+        NgbNavLink,
+        NgbNavItem,
+        NgbNavContent,
+        NgbNavOutlet,
+        NgbNav,
         NoopAnimationsModule,
         ReactiveFormsModule,
         TranslateModule.forRoot(),
@@ -494,7 +504,11 @@ describe('ResourcePolicyFormComponent test suite', () => {
   template: ``,
   imports: [
     FormsModule,
-    NgbModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     ReactiveFormsModule,
   ],
 })
diff --git a/src/app/shared/resource-policies/form/resource-policy-form.component.ts b/src/app/shared/resource-policies/form/resource-policy-form.component.ts
index 44f81c1db79..c32cfc2a90b 100644
--- a/src/app/shared/resource-policies/form/resource-policy-form.component.ts
+++ b/src/app/shared/resource-policies/form/resource-policy-form.component.ts
@@ -30,15 +30,17 @@ import {
 } from '@dspace/shared/utils/empty.util';
 import {
   NgbModal,
+  NgbNav,
   NgbNavChangeEvent,
-  NgbNavModule,
+  NgbNavContent,
+  NgbNavItem,
+  NgbNavLink,
+  NgbNavOutlet,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicDatePickerModel,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 import { TranslateModule } from '@ngx-translate/core';
 import {
   BehaviorSubject,
@@ -89,7 +91,11 @@ export interface ResourcePolicyEvent {
     BtnDisabledDirective,
     EpersonGroupListComponent,
     FormComponent,
-    NgbNavModule,
+    NgbNav,
+    NgbNavContent,
+    NgbNavItem,
+    NgbNavLink,
+    NgbNavOutlet,
     TranslateModule,
   ],
 })
diff --git a/src/app/shared/resource-policies/form/resource-policy-form.model.ts b/src/app/shared/resource-policies/form/resource-policy-form.model.ts
index 8b458019d17..cf6cb85fbc5 100644
--- a/src/app/shared/resource-policies/form/resource-policy-form.model.ts
+++ b/src/app/shared/resource-policies/form/resource-policy-form.model.ts
@@ -1,12 +1,10 @@
 import { ActionType } from '@dspace/core/resource-policy/models/action-type.model';
 import { PolicyType } from '@dspace/core/resource-policy/models/policy-type.model';
-import {
-  DynamicDatePickerModelConfig,
-  DynamicFormControlLayout,
-  DynamicFormGroupModelConfig,
-  DynamicFormOptionConfig,
-  DynamicSelectModelConfig,
-} from '@ng-dynamic-forms/core';
+import { DynamicDatePickerModelConfig } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormOptionConfig } from '@ng-dynamic-forms/core/model/dynamic-option-control.model';
+import { DynamicFormGroupModelConfig } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicSelectModelConfig } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 
 import { DsDynamicInputModelConfig } from '../../form/builder/ds-dynamic-form-ui/models/ds-dynamic-input.model';
 import { DsDynamicTextAreaModelConfig } from '../../form/builder/ds-dynamic-form-ui/models/ds-dynamic-textarea.model';
diff --git a/src/app/submission/sections/accesses/section-accesses.component.spec.ts b/src/app/submission/sections/accesses/section-accesses.component.spec.ts
index 05f3f87d2de..0686a6670f5 100644
--- a/src/app/submission/sections/accesses/section-accesses.component.spec.ts
+++ b/src/app/submission/sections/accesses/section-accesses.component.spec.ts
@@ -16,13 +16,11 @@ import {
 import { SectionsServiceStub } from '@dspace/core/testing/sections-service.stub';
 import { SubmissionJsonPatchOperationsServiceStub } from '@dspace/core/testing/submission-json-patch-operations-service.stub';
 import { XSRFService } from '@dspace/core/xsrf/xsrf.service';
-import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DynamicCheckboxModel,
-  DynamicDatePickerModel,
-  DynamicFormArrayModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
 import { Store } from '@ngrx/store';
 import { provideMockStore } from '@ngrx/store/testing';
 import { TranslateModule } from '@ngx-translate/core';
diff --git a/src/app/submission/sections/accesses/section-accesses.component.ts b/src/app/submission/sections/accesses/section-accesses.component.ts
index a33ce71a820..ce603fb6f0f 100644
--- a/src/app/submission/sections/accesses/section-accesses.component.ts
+++ b/src/app/submission/sections/accesses/section-accesses.component.ts
@@ -17,21 +17,25 @@ import {
   isNotEmpty,
   isNotNull,
 } from '@dspace/shared/utils/empty.util';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
 import {
   DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,
-  DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
   DynamicCheckboxModel,
-  DynamicDateControlValue,
+} from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
   DynamicDatePickerModel,
-  DynamicFormArrayModel,
-  DynamicFormControlCondition,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicSelectModel,
+} from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicDateControlValue } from '@ng-dynamic-forms/core/model/dynamic-date-control.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlCondition } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import {
   MATCH_ENABLED,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
 import { TranslateService } from '@ngx-translate/core';
 import {
   combineLatest,
diff --git a/src/app/submission/sections/accesses/section-accesses.model.ts b/src/app/submission/sections/accesses/section-accesses.model.ts
index f07884225d6..72647f76332 100644
--- a/src/app/submission/sections/accesses/section-accesses.model.ts
+++ b/src/app/submission/sections/accesses/section-accesses.model.ts
@@ -1,13 +1,14 @@
+import { DynamicCheckboxModelConfig } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicDatePickerModelConfig } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormArrayModelConfig } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModelConfig } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicSelectModelConfig } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 import {
-  DynamicCheckboxModelConfig,
-  DynamicDatePickerModelConfig,
-  DynamicFormArrayModelConfig,
-  DynamicFormControlLayout,
-  DynamicFormGroupModelConfig,
-  DynamicSelectModelConfig,
   MATCH_ENABLED,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
+
 
 export const ACCESS_FORM_CHECKBOX_CONFIG: DynamicCheckboxModelConfig = {
   id: 'discoverable',
diff --git a/src/app/submission/sections/form/section-form-operations.service.spec.ts b/src/app/submission/sections/form/section-form-operations.service.spec.ts
index e5feed170ca..678b2c59b1c 100644
--- a/src/app/submission/sections/form/section-form-operations.service.spec.ts
+++ b/src/app/submission/sections/form/section-form-operations.service.spec.ts
@@ -9,12 +9,10 @@ import { FormFieldMetadataValueObject } from '@dspace/core/shared/form/models/fo
 import { FormFieldPreviousValueObject } from '@dspace/core/shared/form/models/form-field-previous-value-object';
 import { VocabularyEntry } from '@dspace/core/submission/vocabularies/models/vocabulary-entry.model';
 import { TranslateLoaderMock } from '@dspace/core/testing/translate-loader.mock';
-import {
-  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
-  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
-  DynamicFormControlEvent,
-  DynamicInputModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DYNAMIC_FORM_CONTROL_TYPE_ARRAY } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_GROUP } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
 import {
   TranslateLoader,
   TranslateModule,
diff --git a/src/app/submission/sections/form/section-form-operations.service.ts b/src/app/submission/sections/form/section-form-operations.service.ts
index b209f719786..7e21651c4d0 100644
--- a/src/app/submission/sections/form/section-form-operations.service.ts
+++ b/src/app/submission/sections/form/section-form-operations.service.ts
@@ -19,13 +19,15 @@ import {
   isUndefined,
 } from '@dspace/shared/utils/empty.util';
 import {
-  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
-  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
-  DynamicFormArrayGroupModel,
   DynamicFormControlEvent,
-  DynamicFormControlModel,
   isDynamicFormControlEvent,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
+  DynamicFormArrayGroupModel,
+} from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DYNAMIC_FORM_CONTROL_TYPE_GROUP } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
 import { deepClone } from 'fast-json-patch';
 import isEqual from 'lodash/isEqual';
 import isObject from 'lodash/isObject';
diff --git a/src/app/submission/sections/form/section-form.component.spec.ts b/src/app/submission/sections/form/section-form.component.spec.ts
index cf32f179add..7b735256cb4 100644
--- a/src/app/submission/sections/form/section-form.component.spec.ts
+++ b/src/app/submission/sections/form/section-form.component.spec.ts
@@ -35,7 +35,7 @@ import { createSuccessfulRemoteDataObject$ } from '@dspace/core/utilities/remote
 import {
   DynamicFormControlEvent,
   DynamicFormControlEventType,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
 import {
   TranslateModule,
   TranslateService,
diff --git a/src/app/submission/sections/form/section-form.component.ts b/src/app/submission/sections/form/section-form.component.ts
index f953c3020af..da99902988f 100644
--- a/src/app/submission/sections/form/section-form.component.ts
+++ b/src/app/submission/sections/form/section-form.component.ts
@@ -34,10 +34,8 @@ import {
   isUndefined,
 } from '@dspace/shared/utils/empty.util';
 import { difference } from '@dspace/shared/utils/object.util';
-import {
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
 import { TranslateService } from '@ngx-translate/core';
 import findIndex from 'lodash/findIndex';
 import isEqual from 'lodash/isEqual';
diff --git a/src/app/submission/sections/license/section-license.component.spec.ts b/src/app/submission/sections/license/section-license.component.spec.ts
index daa584b71d3..91a5253edc4 100644
--- a/src/app/submission/sections/license/section-license.component.spec.ts
+++ b/src/app/submission/sections/license/section-license.component.spec.ts
@@ -35,11 +35,11 @@ import {
 } from '@dspace/core/utilities/remote-data.utils';
 import { XSRFService } from '@dspace/core/xsrf/xsrf.service';
 import {
-  DYNAMIC_FORM_CONTROL_MAP_FN,
-  DynamicCheckboxModel,
   DynamicFormControlEvent,
   DynamicFormControlEventType,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DYNAMIC_FORM_CONTROL_MAP_FN } from '@ng-dynamic-forms/core/service/dynamic-form-component.service';
 import { provideMockStore } from '@ngrx/store/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { cold } from 'jasmine-marbles';
diff --git a/src/app/submission/sections/license/section-license.component.ts b/src/app/submission/sections/license/section-license.component.ts
index ccca4c4f99a..35cc28802cd 100644
--- a/src/app/submission/sections/license/section-license.component.ts
+++ b/src/app/submission/sections/license/section-license.component.ts
@@ -20,12 +20,10 @@ import {
   isNotNull,
   isNotUndefined,
 } from '@dspace/shared/utils/empty.util';
-import {
-  DynamicCheckboxModel,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormLayout,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormLayout } from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
 import { TranslateService } from '@ngx-translate/core';
 import {
   Observable,
diff --git a/src/app/submission/sections/sections.service.ts b/src/app/submission/sections/sections.service.ts
index 3774f7e89ea..e1f7ec3dd54 100644
--- a/src/app/submission/sections/sections.service.ts
+++ b/src/app/submission/sections/sections.service.ts
@@ -15,7 +15,7 @@ import {
   isNotEmpty,
   isNotUndefined,
 } from '@dspace/shared/utils/empty.util';
-import { parseReviver } from '@ng-dynamic-forms/core';
+import { parseReviver } from '@ng-dynamic-forms/core/utils/json.utils';
 import { Store } from '@ngrx/store';
 import { TranslateService } from '@ngx-translate/core';
 import {
diff --git a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.spec.ts b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.spec.ts
index ba7f22cf18f..5bbc419f9c0 100644
--- a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.spec.ts
+++ b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.spec.ts
@@ -31,12 +31,10 @@ import {
   NgbActiveModal,
   NgbModal,
 } from '@ng-bootstrap/ng-bootstrap';
-import {
-  DynamicFormArrayModel,
-  DynamicFormControlEvent,
-  DynamicFormGroupModel,
-  DynamicSelectModel,
-} from '@ng-dynamic-forms/core';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
 import { provideMockStore } from '@ngrx/store/testing';
 import { TranslateModule } from '@ngx-translate/core';
 import { NgxMaskModule } from 'ngx-mask';
diff --git a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.ts b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.ts
index 85fd7444529..fbffba4d695 100644
--- a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.ts
+++ b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.component.ts
@@ -23,19 +23,21 @@ import {
   isNotNull,
 } from '@dspace/shared/utils/empty.util';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { DynamicFormControlEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
 import {
   DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
-  DynamicDateControlValue,
   DynamicDatePickerModel,
-  DynamicFormArrayModel,
-  DynamicFormControlCondition,
-  DynamicFormControlEvent,
-  DynamicFormControlModel,
-  DynamicFormGroupModel,
-  DynamicSelectModel,
+} from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicDateControlValue } from '@ng-dynamic-forms/core/model/dynamic-date-control.model';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
+import { DynamicFormArrayModel } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModel } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlCondition } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import {
   MATCH_ENABLED,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
 import { TranslateModule } from '@ngx-translate/core';
 import { Subscription } from 'rxjs';
 import {
diff --git a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.model.ts b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.model.ts
index 65d233081ca..5cee00bca43 100644
--- a/src/app/submission/sections/upload/file/edit/section-upload-file-edit.model.ts
+++ b/src/app/submission/sections/upload/file/edit/section-upload-file-edit.model.ts
@@ -1,13 +1,14 @@
+import { DynamicDatePickerModelConfig } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormArrayModelConfig } from '@ng-dynamic-forms/core/model/form-array/dynamic-form-array.model';
+import { DynamicFormGroupModelConfig } from '@ng-dynamic-forms/core/model/form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicSelectModelConfig } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicSwitchModelConfig } from '@ng-dynamic-forms/core/model/switch/dynamic-switch.model';
 import {
-  DynamicDatePickerModelConfig,
-  DynamicFormArrayModelConfig,
-  DynamicFormControlLayout,
-  DynamicFormGroupModelConfig,
-  DynamicSelectModelConfig,
-  DynamicSwitchModelConfig,
   MATCH_ENABLED,
   OR_OPERATOR,
-} from '@ng-dynamic-forms/core';
+} from '@ng-dynamic-forms/core/service/dynamic-form-relation-matchers';
+
 
 export const BITSTREAM_METADATA_FORM_GROUP_CONFIG: DynamicFormGroupModelConfig = {
   id: 'metadata',
diff --git a/src/app/submission/sections/upload/file/section-upload-file.component.ts b/src/app/submission/sections/upload/file/section-upload-file.component.ts
index c6949bd3828..1a1acf34960 100644
--- a/src/app/submission/sections/upload/file/section-upload-file.component.ts
+++ b/src/app/submission/sections/upload/file/section-upload-file.component.ts
@@ -22,7 +22,7 @@ import {
   NgbModal,
   NgbModalOptions,
 } from '@ng-bootstrap/ng-bootstrap';
-import { DynamicFormControlModel } from '@ng-dynamic-forms/core';
+import { DynamicFormControlModel } from '@ng-dynamic-forms/core/model/dynamic-form-control.model';
 import { TranslateModule } from '@ngx-translate/core';
 import {
   BehaviorSubject,
diff --git a/src/external-libraries/ng-dynamic-forms/LICENSE b/src/external-libraries/ng-dynamic-forms/LICENSE
new file mode 100644
index 00000000000..2273c1e84cb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/LICENSE
@@ -0,0 +1,13 @@
+Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
diff --git a/src/external-libraries/ng-dynamic-forms/core/LICENSE b/src/external-libraries/ng-dynamic-forms/core/LICENSE
new file mode 100644
index 00000000000..2273c1e84cb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/LICENSE
@@ -0,0 +1,13 @@
+Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-array.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-array.component.ts
new file mode 100644
index 00000000000..94fa25c7b1a
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-array.component.ts
@@ -0,0 +1,31 @@
+import { QueryList } from '@angular/core';
+import { UntypedFormArray } from '@angular/forms';
+
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DynamicFormArrayModel } from '../model/form-array/dynamic-form-array.model';
+import { DynamicFormControlComponent } from './dynamic-form-control.component';
+import { DynamicFormControlContainerComponent } from './dynamic-form-control-container.component';
+
+export abstract class DynamicFormArrayComponent extends DynamicFormControlComponent {
+  components!: QueryList<DynamicFormControlContainerComponent>;
+  model!: DynamicFormArrayModel;
+  templates?: QueryList<DynamicTemplateDirective>;
+
+  get array(): UntypedFormArray {
+    return this.control as UntypedFormArray;
+  }
+
+  get startTemplate(): DynamicTemplateDirective | undefined {
+    return this.layoutService.getStartTemplate(this.model, this.templates);
+  }
+
+  get endTemplate(): DynamicTemplateDirective | undefined {
+    return this.layoutService.getEndTemplate(this.model, this.templates);
+  }
+
+  markForCheck() {
+    if (this.components instanceof QueryList) {
+      this.components.forEach(component => component.markForCheck());
+    }
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-container.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-container.component.ts
new file mode 100644
index 00000000000..67c3ff16139
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-container.component.ts
@@ -0,0 +1,377 @@
+import {
+  ChangeDetectorRef,
+  ComponentFactoryResolver,
+  ComponentRef,
+  Directive,
+  EventEmitter,
+  OnChanges,
+  OnDestroy,
+  OnInit,
+  QueryList,
+  SimpleChanges,
+  Type,
+  ViewContainerRef,
+} from '@angular/core';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { Subscription } from 'rxjs';
+import {
+  bufferCount,
+  filter,
+  map,
+} from 'rxjs/operators';
+
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX } from '../model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormValueControlModel } from '../model/dynamic-form-value-control.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
+  DynamicFormArrayGroupModel,
+} from '../model/form-array/dynamic-form-array.model';
+import {
+  DYNAMIC_FORM_CONTROL_INPUT_TYPE_FILE,
+  DYNAMIC_FORM_CONTROL_TYPE_INPUT,
+  DynamicInputModel,
+} from '../model/input/dynamic-input.model';
+import {
+  DynamicFormControlLayout,
+  DynamicFormControlLayoutContext,
+  DynamicFormControlLayoutPlace,
+} from '../model/misc/dynamic-form-control-layout.model';
+import { DynamicFormComponentService } from '../service/dynamic-form-component.service';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '../service/dynamic-form-layout.service';
+import { DynamicFormRelationService } from '../service/dynamic-form-relation.service';
+import { DynamicFormValidationService } from '../service/dynamic-form-validation.service';
+import { isString } from '../utils/core.utils';
+import {
+  DynamicFormControlCustomEvent,
+  DynamicFormControlEvent,
+  DynamicFormControlEventType,
+  isDynamicFormControlEvent,
+} from './dynamic-form-control-event';
+import { DynamicFormControl } from './dynamic-form-control-interface';
+
+@Directive({
+  standalone: true,
+})
+// tslint:disable-next-line:directive-class-suffix
+export abstract class DynamicFormControlContainerComponent implements OnChanges, OnInit, OnDestroy {
+  private _hasFocus = false;
+
+  context: DynamicFormArrayGroupModel | null = null;
+  control!: UntypedFormControl;
+  group!: UntypedFormGroup;
+  hostClass?: string[];
+  klass?: string;
+  layout?: DynamicFormLayout;
+  model!: DynamicFormControlModel;
+
+  contentTemplateList?: QueryList<DynamicTemplateDirective>;
+  inputTemplateList?: QueryList<DynamicTemplateDirective>;
+
+  blur!: EventEmitter<DynamicFormControlEvent>;
+  change!: EventEmitter<DynamicFormControlEvent>;
+  customEvent?: EventEmitter<DynamicFormControlEvent>;
+  focus!: EventEmitter<DynamicFormControlEvent>;
+
+  componentViewContainerRef!: ViewContainerRef;
+
+  protected componentRef!: ComponentRef<DynamicFormControl>;
+  protected componentSubscriptions: Subscription[] = [];
+  protected controlLayout?: DynamicFormControlLayout;
+  protected subscriptions: Subscription[] = [];
+
+  protected constructor(protected changeDetectorRef: ChangeDetectorRef,
+                          protected componentFactoryResolver: ComponentFactoryResolver,
+                          protected layoutService: DynamicFormLayoutService,
+                          protected validationService: DynamicFormValidationService,
+                          protected componentService: DynamicFormComponentService,
+                          protected relationService: DynamicFormRelationService) {
+  }
+
+  ngOnChanges(changes: SimpleChanges): void {
+    const groupChange = (changes as Pick<SimpleChanges, 'group'>).group;
+    const layoutChange = (changes as Pick<SimpleChanges, 'layout'>).layout;
+    const modelChange = (changes as Pick<SimpleChanges, 'model'>).model;
+
+    if (layoutChange || modelChange) {
+      this.onLayoutOrModelChange();
+    }
+
+    if (modelChange) {
+      this.onModelChange();
+    }
+
+    if (groupChange || modelChange) {
+      this.onGroupOrModelChange();
+    }
+  }
+
+  ngOnInit(): void {
+    this.subscriptions.push(this.control.statusChanges.pipe(
+      bufferCount(2, 1),
+      map(states => states[0]),
+      filter(previousState => previousState === 'PENDING'),
+    ).subscribe(_status => this.markForCheck()));
+  }
+
+  ngOnDestroy(): void {
+    this.destroyFormControlComponent();
+    this.unsubscribe();
+  }
+
+    abstract get componentType(): Type<DynamicFormControl> | null;
+
+    get id(): string {
+      return this.layoutService.getElementId(this.model);
+    }
+
+    get hasFocus(): boolean {
+      return this._hasFocus;
+    }
+
+    get isInvalid(): boolean {
+      return this.control.invalid;
+    }
+
+    get isValid(): boolean {
+      return this.control.valid;
+    }
+
+    get errorMessages(): string[] {
+      return this.validationService.createErrorMessages(this.control, this.model);
+    }
+
+    get showErrorMessages(): boolean {
+      return this.validationService.showErrorMessages(this.control, this.model, this.hasFocus);
+    }
+
+    get hasLabel(): boolean {
+      return isString(this.model.label);
+    }
+
+    get hasHint(): boolean {
+      return isString((this.model as DynamicFormValueControlModel<any>).hint);
+    }
+
+    get hint(): string | null {
+      return (this.model as DynamicFormValueControlModel<any>).hint ?? null;
+    }
+
+    get isCheckbox(): boolean {
+      return this.model.type === DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX;
+    }
+
+    get templates(): QueryList<DynamicTemplateDirective> | undefined {
+      return this.inputTemplateList !== undefined ? this.inputTemplateList : this.contentTemplateList;
+    }
+
+    get startTemplate(): DynamicTemplateDirective | undefined {
+      return this.model.type !== DYNAMIC_FORM_CONTROL_TYPE_ARRAY ?
+        this.layoutService.getStartTemplate(this.model, this.templates) : undefined;
+    }
+
+    get endTemplate(): DynamicTemplateDirective | undefined {
+      return this.model.type !== DYNAMIC_FORM_CONTROL_TYPE_ARRAY ?
+        this.layoutService.getEndTemplate(this.model, this.templates) : undefined;
+    }
+
+    getClass(context: DynamicFormControlLayoutContext, place: DynamicFormControlLayoutPlace): string {
+      return this.layoutService.getClass(this.controlLayout, context, place);
+    }
+
+    markForCheck(): void {
+      this.changeDetectorRef.markForCheck();
+
+      const component = this.componentRef && this.componentRef.instance;
+
+      if (component && 'markForCheck' in component && typeof component.markForCheck === 'function') {
+        component.markForCheck();
+      }
+    }
+
+    protected createFormControlComponent(): void {
+      const componentType = this.componentType;
+
+      if (componentType !== null) {
+        const componentFactory = this.componentFactoryResolver.resolveComponentFactory(componentType);
+
+        this.componentViewContainerRef.clear();
+        this.componentRef = this.componentViewContainerRef.createComponent(componentFactory);
+
+        const component = this.componentRef.instance;
+
+        component.formLayout = this.layout;
+        component.group = this.group;
+        component.layout = this.controlLayout;
+        component.model = this.model;
+
+        if (this.templates) {
+          component.templates = this.templates;
+        }
+
+        this.componentSubscriptions.push(component.blur.subscribe(($event: any) => this.onBlur($event)));
+        this.componentSubscriptions.push(component.change.subscribe(($event: any) => this.onChange($event)));
+        this.componentSubscriptions.push(component.focus.subscribe(($event: any) => this.onFocus($event)));
+
+        if (component.customEvent !== undefined) {
+          this.componentSubscriptions.push(
+            component.customEvent.subscribe(($event: any) => this.onCustomEvent($event)));
+        }
+
+        this.registerFormControlComponentRef(this.componentRef);
+      }
+    }
+
+    protected destroyFormControlComponent(): void {
+      if (this.componentRef) {
+        this.componentSubscriptions.forEach(subscription => subscription.unsubscribe());
+        this.componentSubscriptions = [];
+
+        this.unregisterFormControlComponentRef();
+        this.componentRef.destroy();
+      }
+    }
+
+    protected createDynamicFormControlEvent($event: any, type: string): DynamicFormControlEvent {
+      return { $event, context: this.context, control: this.control, group: this.group, model: this.model, type };
+    }
+
+    unsubscribe(): void {
+      // this.componentSubscriptions.forEach(subscription => subscription.unsubscribe());
+      // this.componentSubscriptions = [];
+
+      this.subscriptions.forEach(subscription => subscription.unsubscribe());
+      this.subscriptions = [];
+    }
+
+    onControlValueChanges(value: any): void {
+      if (this.model instanceof DynamicFormValueControlModel && this.model.value !== value) {
+        this.model.value = value;
+      }
+    }
+
+    onModelValueUpdates(value: any): void {
+      if (this.control.value !== value) {
+        this.control.setValue(value);
+      }
+    }
+
+    onModelDisabledUpdates(disabled: boolean): void {
+      if (disabled) {
+        this.control.disable();
+      } else {
+        this.control.enable();
+      }
+    }
+
+    onLayoutOrModelChange(): void {
+      this.controlLayout = this.layoutService.findByModel(this.model, this.layout) ?? this.model.layout as DynamicFormControlLayout;
+      this.klass = `${Array.isArray(this.hostClass) ? this.hostClass.join(' ') : ''} ${this.layoutService.getHostClass(this.controlLayout)}`;
+    }
+
+    onModelChange(): void {
+      this.destroyFormControlComponent();
+      this.createFormControlComponent();
+    }
+
+    onGroupOrModelChange(): void {
+      if (this.model) {
+        this.unsubscribe();
+
+        if (this.group) {
+          this.control = this.group.get(this.model.id) as UntypedFormControl;
+          this.subscriptions.push(this.control.valueChanges.subscribe(value => this.onControlValueChanges(value)));
+        }
+
+        this.subscriptions.push(this.model.disabledChanges.subscribe(value => this.onModelDisabledUpdates(value)));
+
+        if (this.model instanceof DynamicFormValueControlModel) {
+          const model = this.model as DynamicFormValueControlModel<any>;
+
+          this.subscriptions.push(model.valueChanges.subscribe(value => this.onModelValueUpdates(value)));
+        }
+
+        if (this.model.relations.length > 0) {
+          this.subscriptions.push(...this.relationService.subscribeRelations(this.model, this.group, this.control));
+        }
+      }
+    }
+    // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+    onChange($event: Event | DynamicFormControlEvent | any): void {
+      if ($event instanceof Event) { // native HTML5 change event
+        if (this.model.type === DYNAMIC_FORM_CONTROL_TYPE_INPUT) {
+          const model = this.model as DynamicInputModel;
+
+          if (model.inputType === DYNAMIC_FORM_CONTROL_INPUT_TYPE_FILE) {
+            const inputElement: any = $event.target;
+
+            model.files = inputElement.files as FileList;
+          }
+        }
+
+        this.change.emit(this.createDynamicFormControlEvent($event, DynamicFormControlEventType.Change));
+
+      } else if (isDynamicFormControlEvent($event)) { // event bypass
+        this.change.emit($event);
+
+      } else { // custom library value change event
+        this.change.emit(this.createDynamicFormControlEvent($event, DynamicFormControlEventType.Change));
+      }
+    }
+    // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+    onBlur($event: FocusEvent | DynamicFormControlEvent | any): void {
+      if (isDynamicFormControlEvent($event)) { // event bypass
+        this.blur.emit($event);
+
+      } else { // native HTML 5 or UI library blur event
+        this._hasFocus = false;
+        this.blur.emit(this.createDynamicFormControlEvent($event, DynamicFormControlEventType.Blur));
+      }
+    }
+    // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+    onFocus($event: FocusEvent | DynamicFormControlEvent | any): void {
+      if (isDynamicFormControlEvent($event)) { // event bypass
+        this.focus.emit($event);
+
+      } else { // native HTML 5 or UI library focus event
+        this._hasFocus = true;
+        this.focus.emit(this.createDynamicFormControlEvent($event, DynamicFormControlEventType.Focus));
+      }
+    }
+
+    onCustomEvent($event: DynamicFormControlEvent | DynamicFormControlCustomEvent): void {
+      const emitter = this.customEvent as EventEmitter<DynamicFormControlEvent>;
+
+      if (isDynamicFormControlEvent($event)) { // child event bypass
+        emitter.emit($event);
+
+      } else { // native UI library custom event
+        emitter.emit(this.createDynamicFormControlEvent($event.customEvent, $event.customEventType));
+      }
+    }
+
+    private registerFormControlComponentRef(ref: ComponentRef<DynamicFormControl>): void {
+      if (this.context instanceof DynamicFormArrayGroupModel) {
+        this.componentService.registerFormControl(this.model, ref, this.context.index);
+
+      } else {
+        this.componentService.registerFormControl(this.model, ref);
+      }
+    }
+
+    private unregisterFormControlComponentRef(): void {
+      if (this.context instanceof DynamicFormArrayGroupModel) {
+        this.componentService.unregisterFormControl(this.model.id, this.context.index);
+
+      } else {
+        this.componentService.unregisterFormControl(this.model.id);
+      }
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-event.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-event.ts
new file mode 100644
index 00000000000..4d5157ddbd1
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-event.ts
@@ -0,0 +1,33 @@
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormArrayGroupModel } from '../model/form-array/dynamic-form-array.model';
+import { isObject } from '../utils/core.utils';
+
+export enum DynamicFormControlEventType {
+    Blur = 'blur',
+    Change = 'change',
+    Focus = 'focus'
+}
+
+export interface DynamicFormControlEvent {
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+  $event: Event | FocusEvent | DynamicFormControlEvent | any;
+    context: DynamicFormArrayGroupModel | null;
+    control: UntypedFormControl;
+    group: UntypedFormGroup;
+    model: DynamicFormControlModel;
+    type: string;
+}
+
+export interface DynamicFormControlCustomEvent {
+    customEvent: any;
+    customEventType: string;
+}
+
+export function isDynamicFormControlEvent($event: any): $event is DynamicFormControlEvent {
+  return isObject($event) && $event.hasOwnProperty('$event');
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-interface.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-interface.ts
new file mode 100644
index 00000000000..7a59f7af919
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-interface.ts
@@ -0,0 +1,24 @@
+import {
+  EventEmitter,
+  QueryList,
+} from '@angular/core';
+import { UntypedFormGroup } from '@angular/forms';
+
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormControlLayout } from '../model/misc/dynamic-form-control-layout.model';
+import { DynamicFormLayout } from '../service/dynamic-form-layout.service';
+import { DynamicFormControlCustomEvent } from './dynamic-form-control-event';
+
+export interface DynamicFormControl {
+    formLayout?: DynamicFormLayout;
+    group: UntypedFormGroup;
+    layout?: DynamicFormControlLayout;
+    model: DynamicFormControlModel;
+    templates?: QueryList<DynamicTemplateDirective> | DynamicTemplateDirective[];
+
+    blur: EventEmitter<any>;
+    change: EventEmitter<any>;
+    customEvent?: EventEmitter<DynamicFormControlCustomEvent> | undefined;
+    focus: EventEmitter<any>;
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template-interface.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template-interface.ts
new file mode 100644
index 00000000000..7d85ab40544
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template-interface.ts
@@ -0,0 +1,7 @@
+import { DynamicFormControl } from './dynamic-form-control-interface';
+
+export interface DynamicFormControlWithTemplate extends DynamicFormControl {
+    readonly templateDirectives: Map<string, string>;
+
+    viewChild: any;
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template.component.ts
new file mode 100644
index 00000000000..05f7a9b4444
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control-with-template.component.ts
@@ -0,0 +1,47 @@
+import {
+  AfterViewInit,
+  Directive,
+  QueryList,
+  TemplateRef,
+} from '@angular/core';
+
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DynamicFormLayoutService } from '../service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '../service/dynamic-form-validation.service';
+import { isString } from '../utils/core.utils';
+import { DynamicFormControlComponent } from './dynamic-form-control.component';
+import { DynamicFormControlWithTemplate } from './dynamic-form-control-with-template-interface';
+
+@Directive({
+  standalone: true,
+})// tslint:disable-next-line:directive-class-suffix
+export abstract class DynamicFormControlWithTemplateComponent extends DynamicFormControlComponent
+  implements DynamicFormControlWithTemplate, AfterViewInit {
+
+  readonly templateDirectives!: Map<string, string>;
+
+  templates?: QueryList<DynamicTemplateDirective> | DynamicTemplateDirective[];
+
+  protected constructor(protected layoutService: DynamicFormLayoutService,
+                          protected validationService: DynamicFormValidationService) {
+    super(layoutService, validationService);
+  }
+
+  ngAfterViewInit() {
+    this.layoutService
+      .filterTemplatesByModel(this.model, this.templates)
+      .forEach(template => this.bindTemplate(template));
+  }
+
+    abstract get viewChild(): any;
+
+    abstract mapTemplate(template: DynamicTemplateDirective): DynamicTemplateDirective | TemplateRef<any>;
+
+    bindTemplate(template: DynamicTemplateDirective) {
+      if (isString(template.as) && this.templateDirectives.has(template.as)) {
+        const property = this.templateDirectives.get(template.as) as string;
+
+        this.viewChild[property] = this.mapTemplate(template);
+      }
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control.component.ts
new file mode 100644
index 00000000000..2b9025b29d5
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-control.component.ts
@@ -0,0 +1,116 @@
+import { EventEmitter } from '@angular/core';
+import {
+  AbstractControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import {
+  DynamicFormControlLayout,
+  DynamicFormControlLayoutContext,
+  DynamicFormControlLayoutPlace,
+} from '../model/misc/dynamic-form-control-layout.model';
+import {
+  DynamicFormControlTemplates,
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '../service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '../service/dynamic-form-validation.service';
+import { isString } from '../utils/core.utils';
+import { DynamicFormControlCustomEvent } from './dynamic-form-control-event';
+import { DynamicFormControl } from './dynamic-form-control-interface';
+
+export abstract class DynamicFormControlComponent implements DynamicFormControl {
+  formLayout?: DynamicFormLayout;
+  group!: UntypedFormGroup;
+  layout?: DynamicFormControlLayout;
+  model!: DynamicFormControlModel;
+  templates?: DynamicFormControlTemplates;
+
+  blur!: EventEmitter<any>;
+  change!: EventEmitter<any>;
+  customEvent?: EventEmitter<DynamicFormControlCustomEvent>;
+  focus!: EventEmitter<any>;
+
+  private _hasFocus = false;
+
+  protected constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+  }
+
+  get control(): AbstractControl | never {
+    const control = this.group.get(this.model.id);
+
+    if (control === null) {
+      throw new Error(`form group does not contain an abstract control with id ${this.model.id}`);
+    }
+
+    return control;
+  }
+
+  get id(): string {
+    return this.layoutService.getElementId(this.model);
+  }
+
+  get hasFocus(): boolean {
+    return this._hasFocus;
+  }
+
+  get isInvalid(): boolean {
+    return this.control.invalid;
+  }
+
+  get isValid(): boolean {
+    return this.control.valid;
+  }
+
+  get errorMessages(): string[] {
+    return this.validationService.createErrorMessages(this.control, this.model);
+  }
+
+  get showErrorMessages(): boolean {
+    return this.validationService.showErrorMessages(this.control, this.model, this.hasFocus);
+  }
+
+  getClass(context: DynamicFormControlLayoutContext, place: DynamicFormControlLayoutPlace,
+    model: DynamicFormControlModel = this.model): string {
+    const controlLayout = model === this.model ? this.layout :
+      this.layoutService.findByModel(model, this.formLayout) ?? model.layout as DynamicFormControlLayout;
+
+    return this.layoutService.getClass(controlLayout, context, place);
+  }
+
+  onBlur($event: any) {
+    if ($event instanceof Event) {
+      $event.stopPropagation();
+    }
+
+    this._hasFocus = false;
+    this.blur.emit($event);
+  }
+
+  onChange($event: any) {
+    if ($event instanceof Event) {
+      $event.stopPropagation();
+    }
+
+    this.change.emit($event);
+  }
+
+  onCustomEvent($event: any, type: string | null = null, bypass: boolean = false) {
+    if (bypass) {
+      this.customEvent?.emit($event);
+
+    } else if (isString(type)) {
+      this.customEvent?.emit({ customEvent: $event, customEventType: type });
+    }
+  }
+
+  onFocus($event: any) {
+    if ($event instanceof Event) {
+      $event.stopPropagation();
+    }
+
+    this._hasFocus = true;
+    this.focus.emit($event);
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-group.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-group.component.ts
new file mode 100644
index 00000000000..aec2daf2922
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form-group.component.ts
@@ -0,0 +1,16 @@
+import { QueryList } from '@angular/core';
+
+import { DynamicFormGroupModel } from '../model/form-group/dynamic-form-group.model';
+import { DynamicFormControlComponent } from './dynamic-form-control.component';
+import { DynamicFormControlContainerComponent } from './dynamic-form-control-container.component';
+
+export abstract class DynamicFormGroupComponent extends DynamicFormControlComponent {
+  components!: QueryList<DynamicFormControlContainerComponent>;
+  model!: DynamicFormGroupModel;
+
+  markForCheck() {
+    if (this.components instanceof QueryList) {
+      this.components.forEach(component => component.markForCheck());
+    }
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form.component.ts b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form.component.ts
new file mode 100644
index 00000000000..42f8c602723
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/component/dynamic-form.component.ts
@@ -0,0 +1,80 @@
+import {
+  ChangeDetectorRef,
+  Directive,
+  EventEmitter,
+  OnDestroy,
+  OnInit,
+  QueryList,
+} from '@angular/core';
+import { UntypedFormGroup } from '@angular/forms';
+
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormModel } from '../model/form-group/dynamic-form-group.model';
+import {
+  DynamicFormComponentService,
+  IDynamicFormControlContainer,
+} from '../service/dynamic-form-component.service';
+import { DynamicFormLayout } from '../service/dynamic-form-layout.service';
+import { DynamicFormControlEvent } from './dynamic-form-control-event';
+
+
+
+@Directive({
+  standalone: true,
+})// tslint:disable-next-line:directive-class-suffix
+export abstract class DynamicFormComponent implements OnInit, OnDestroy {
+  group!: UntypedFormGroup;
+  model!: DynamicFormModel;
+  layout?: DynamicFormLayout;
+
+  components!: QueryList<IDynamicFormControlContainer>;
+  templates!: QueryList<DynamicTemplateDirective>;
+
+  blur?: EventEmitter<DynamicFormControlEvent>;
+  change?: EventEmitter<DynamicFormControlEvent>;
+  focus?: EventEmitter<DynamicFormControlEvent>;
+
+  protected constructor(protected changeDetectorRef: ChangeDetectorRef, protected componentService: DynamicFormComponentService) {
+  }
+
+  ngOnInit(): void {
+    this.componentService.registerForm(this);
+  }
+
+  ngOnDestroy(): void {
+    this.componentService.unregisterForm(this);
+  }
+
+  trackByFn(_index: number, model: DynamicFormControlModel): string {
+    return model.id;
+  }
+
+  markForCheck(): void {
+    this.changeDetectorRef.markForCheck();
+
+    if (this.components instanceof QueryList) {
+      this.components.forEach(component => component.markForCheck());
+    }
+  }
+
+  detectChanges(): void {
+    this.changeDetectorRef.detectChanges();
+  }
+
+  onBlur($event: DynamicFormControlEvent) {
+    this.blur?.emit($event);
+  }
+
+  onChange($event: DynamicFormControlEvent) {
+    this.change?.emit($event);
+  }
+
+  onFocus($event: DynamicFormControlEvent) {
+    this.focus?.emit($event);
+  }
+
+  onCustomEvent($event: DynamicFormControlEvent, customEventEmitter: EventEmitter<DynamicFormControlEvent>) {
+    customEventEmitter.emit($event);
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/decorator/serializable.decorator.ts b/src/external-libraries/ng-dynamic-forms/core/decorator/serializable.decorator.ts
new file mode 100644
index 00000000000..e2b1686be5a
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/decorator/serializable.decorator.ts
@@ -0,0 +1,41 @@
+import 'reflect-metadata';
+
+declare let Reflect: any;
+
+export const METADATA_KEY_SERIALIZABLE = 'SERIALIZABLE';
+
+export interface SerializableProperty {
+    key: string;
+    name: string;
+}
+
+export function serializable(name?: string): (target: any, key: string) => void {
+  return (target, key) => {
+    Reflect.defineMetadata(METADATA_KEY_SERIALIZABLE, { key, name: name || key }, target, key);
+  };
+}
+
+export function getSerializables(target: any): SerializableProperty[] {
+  const serializables = [];
+
+  // eslint-disable-next-line guard-for-in
+  for (const key in target) {
+    const metadata = Reflect.getMetadata(METADATA_KEY_SERIALIZABLE, target, key);
+
+    if (metadata) {
+      serializables.push(metadata);
+    }
+  }
+
+  return serializables;
+}
+
+export function serialize(target: any, prototype?: any): object {
+  return getSerializables(prototype || target).reduce((prev: any, prop: SerializableProperty) => {
+
+    prev[prop.name] = target[prop.key];
+
+    return prev;
+
+  }, {});
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.spec.ts b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.spec.ts
new file mode 100644
index 00000000000..8ea90c35a90
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.spec.ts
@@ -0,0 +1,50 @@
+import {
+  Component,
+  DebugElement,
+} from '@angular/core';
+import {
+  ComponentFixture,
+  TestBed,
+} from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
+
+import { DynamicListDirective } from './dynamic-list.directive';
+
+@Component({
+  template: `
+        <div [dynamicList]="testList1"></div>
+        <div [dynamicList]="testList2"></div>
+    `,
+  imports: [
+    DynamicListDirective,
+  ],
+})
+class TestComponent {
+  testList1 = null;
+  testList2 = 'list';
+}
+
+describe('DynamicListDirective test suite', () => {
+  let fixture: ComponentFixture<TestComponent>;
+  let directives: DebugElement[];
+
+  beforeEach(() => {
+    fixture = TestBed.configureTestingModule({
+      imports: [TestComponent],
+    }).createComponent(TestComponent);
+
+    fixture.detectChanges();
+
+    directives = fixture.debugElement.queryAll(By.directive(DynamicListDirective));
+  });
+
+
+  it('should have two directives', () => {
+    expect(directives.length).toBe(2);
+  });
+
+  it('should have one set list', () => {
+    expect(directives[0].attributes.list).toBeUndefined();
+    expect(directives[1].attributes.list).toEqual(fixture.componentInstance.testList2);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.ts b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.ts
new file mode 100644
index 00000000000..1d4d22b3118
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-list.directive.ts
@@ -0,0 +1,26 @@
+import {
+  AfterViewInit,
+  Directive,
+  ElementRef,
+  Input,
+  Renderer2,
+} from '@angular/core';
+
+import { isString } from '../utils/core.utils';
+
+@Directive({
+  selector: '[dynamicList]',
+  standalone: true,
+})
+export class DynamicListDirective implements AfterViewInit {
+    @Input('dynamicList') listId?: string;
+
+    constructor(private elementRef: ElementRef, private renderer: Renderer2) {
+    }
+
+    ngAfterViewInit() {
+      if (isString(this.listId)) {
+        this.renderer.setAttribute(this.elementRef.nativeElement, 'list', this.listId as string);
+      }
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.spec.ts b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.spec.ts
new file mode 100644
index 00000000000..3a45842dff4
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.spec.ts
@@ -0,0 +1,45 @@
+import {
+  Component,
+  TemplateRef,
+} from '@angular/core';
+import {
+  ComponentFixture,
+  TestBed,
+} from '@angular/core/testing';
+
+import {
+  DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT,
+  DynamicTemplateDirective,
+} from './dynamic-template.directive';
+
+@Component({
+  template: `
+        <ng-template modelId="test1"></ng-template>
+        <ng-template modelId="test2" as="test"></ng-template>
+    `,
+})
+class TestComponent {
+}
+
+describe('DynamicTemplateDirective test suite', () => {
+  let directive: DynamicTemplateDirective;
+  let fixture: ComponentFixture<TestComponent>;
+
+  beforeEach(() => {
+    directive = new DynamicTemplateDirective({} as TemplateRef<any>);
+
+    fixture = TestBed.configureTestingModule({
+      imports: [DynamicTemplateDirective, TestComponent],
+    }).createComponent(TestComponent);
+
+    fixture.detectChanges();
+  });
+
+  it('should be initialized correctly', () => {
+    // eslint:disable@typescript-eslint/no-unsafe-enum-comparison
+    expect(directive.align === DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.End).toBe(true);
+    expect(directive.as).toBeNull();
+    expect(directive.modelId).toBeUndefined();
+    expect(directive.modelType).toBeUndefined();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.ts b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.ts
new file mode 100644
index 00000000000..ea9f3337ae7
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/directive/dynamic-template.directive.ts
@@ -0,0 +1,25 @@
+import {
+  Directive,
+  Input,
+  TemplateRef,
+} from '@angular/core';
+
+export enum DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT {
+    Start = 'START',
+    End = 'END'
+}
+
+@Directive({
+  selector: 'ng-template[modelId],ng-template[modelType]',
+  standalone: true,
+})
+export class DynamicTemplateDirective {
+    @Input() align: DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT = DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.End;
+    @Input() as: string | null = null;
+    @Input() index?: number;
+    @Input() modelId?: string;
+    @Input() modelType?: string;
+
+    constructor(public templateRef: TemplateRef<any>) {
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.spec.ts
new file mode 100644
index 00000000000..dc93d9e83a1
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.spec.ts
@@ -0,0 +1,90 @@
+import { DynamicCheckboxModel } from './dynamic-checkbox.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP,
+  DynamicCheckboxGroupModel,
+} from './dynamic-checkbox-group.model';
+
+
+describe('DynamicCheckboxGroupModel test suite', () => {
+  let model: DynamicCheckboxGroupModel;
+  const config = {
+    id: 'checkboxGroup',
+    group: [
+      new DynamicCheckboxModel(
+        {
+          id: 'checkbox1',
+          label: 'Checkbox 1',
+          value: true,
+        },
+      ),
+      new DynamicCheckboxModel(
+        {
+          id: 'checkbox2',
+          label: 'Checkbox 2',
+          value: false,
+        },
+      ),
+      new DynamicCheckboxModel(
+        {
+          id: 'checkbox3',
+          label: 'Checkbox 3',
+          value: false,
+        },
+      ),
+    ],
+  };
+
+  beforeEach(() => model = new DynamicCheckboxGroupModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.id).toEqual(config.id);
+    expect(model.group.length).toBe(config.group.length);
+    expect(model.legend).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP);
+    expect(model.disabledChanges).toBeDefined();
+  });
+
+  it('should check checkboxes correctly', () => {
+    model.check(0, 2);
+
+    expect(model.group[0].value).toBe(true);
+    expect(model.group[2].value).toBe(true);
+  });
+
+  it('should check all checkboxes correctly', () => {
+    model.checkAll();
+
+    expect(model.group[0].value).toBe(true);
+    expect(model.group[1].value).toBe(true);
+    expect(model.group[2].value).toBe(true);
+  });
+
+  it('should uncheck checkboxes correctly', () => {
+    model.uncheck(0, 2);
+
+    expect(model.group[0].value).toBe(false);
+    expect(model.group[2].value).toBe(false);
+  });
+
+  it('should uncheck all checkboxes correctly', () => {
+    model.uncheckAll();
+
+    expect(model.group[0].value).toBe(false);
+    expect(model.group[1].value).toBe(false);
+    expect(model.group[2].value).toBe(false);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.ts
new file mode 100644
index 00000000000..795a0babdf5
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model.ts
@@ -0,0 +1,35 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  DynamicFormGroupModel,
+  DynamicFormGroupModelConfig,
+} from '../form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+import { DynamicCheckboxModel } from './dynamic-checkbox.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP = 'CHECKBOX_GROUP';
+
+export class DynamicCheckboxGroupModel extends DynamicFormGroupModel {
+    @serializable() group!: DynamicCheckboxModel[];
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP;
+
+    constructor(config: DynamicFormGroupModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+    }
+
+    check(...indices: number[]): void {
+      indices.forEach(index => this.group[index].checked = true);
+    }
+
+    uncheck(...indices: number[]): void {
+      indices.forEach(index => this.group[index].checked = false);
+    }
+
+    checkAll(): void {
+      this.group.forEach(model => model.checked = true);
+    }
+
+    uncheckAll(): void {
+      this.group.forEach(model => model.checked = false);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.spec.ts
new file mode 100644
index 00000000000..6df4bcd4f67
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.spec.ts
@@ -0,0 +1,53 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,
+  DynamicCheckboxModel,
+} from './dynamic-checkbox.model';
+
+describe('DynamicCheckboxModel test suite', () => {
+  let model: DynamicCheckboxModel;
+  const config = {
+    id: 'checkbox',
+    value: true,
+  };
+
+  beforeEach(() => model = new DynamicCheckboxModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.asyncValidators).toBeNull();
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.indeterminate).toBe(false);
+    expect(model.label).toBeNull();
+    expect(model.labelPosition).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX);
+    expect(model.validators).toBeNull();
+    expect(model.value).toBe(config.value);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should get and set checked property correctly', () => {
+    expect(model.checked).toBe(config.value);
+
+    model.checked = false;
+
+    expect(model.checked).toBe(false);
+    expect(model.value).toBe(false);
+  });
+
+  it('should toggle correctly', () => {
+    model.toggle();
+
+    expect(model.checked).toBe(!config.value);
+    expect(model.value).toBe(!config.value);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.ts
new file mode 100644
index 00000000000..c44615681eb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model.ts
@@ -0,0 +1,25 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import { isBoolean } from '../../utils/core.utils';
+import {
+  DynamicCheckControlModel,
+  DynamicCheckControlModelConfig,
+} from '../dynamic-check-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX = 'CHECKBOX';
+
+export interface DynamicCheckboxModelConfig extends DynamicCheckControlModelConfig {
+    indeterminate?: boolean;
+}
+
+export class DynamicCheckboxModel extends DynamicCheckControlModel {
+    @serializable() indeterminate: boolean;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX;
+
+    constructor(config: DynamicCheckboxModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.indeterminate = isBoolean(config.indeterminate) ? config.indeterminate : false;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.spec.ts
new file mode 100644
index 00000000000..ddd60ddbd41
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.spec.ts
@@ -0,0 +1,35 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER,
+  DynamicColorPickerModel,
+} from './dynamic-colorpicker.model';
+
+describe('DynamicColorPickerModel test suite', () => {
+  let model: DynamicColorPickerModel;
+  const config = {
+    id: 'colorpicker',
+    value: '#ffffff',
+  };
+
+  beforeEach(() => model = new DynamicColorPickerModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.format).toBeNull();
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.inline).toBe(false);
+    expect(model.label).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER);
+    expect(model.value).toBe(config.value);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.ts
new file mode 100644
index 00000000000..cd8916b1fee
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/colorpicker/dynamic-colorpicker.model.ts
@@ -0,0 +1,31 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isString,
+} from '../../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from '../dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER = 'COLORPICKER';
+
+export interface DynamicColorPickerModelConfig extends DynamicFormValueControlModelConfig<string | object> {
+    format?: string;
+    inline?: boolean;
+}
+
+export class DynamicColorPickerModel extends DynamicFormValueControlModel<string | object> {
+    @serializable() format: string | null;
+    @serializable() inline: boolean;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER;
+
+    constructor(config: DynamicColorPickerModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.format = isString(config.format) ? config.format : null;
+      this.inline = isBoolean(config.inline) ? config.inline : false;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.spec.ts
new file mode 100644
index 00000000000..7383109da6c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.spec.ts
@@ -0,0 +1,40 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
+  DynamicDatePickerModel,
+} from './dynamic-datepicker.model';
+
+describe('DynamicDatepickerModel test suite', () => {
+  let model: DynamicDatePickerModel;
+  const config = {
+    id: 'datepicker',
+    value: new Date(),
+  };
+
+  beforeEach(() => model = new DynamicDatePickerModel(config));
+
+  it('should initialize correctly', () => {
+
+    expect(model.disabled).toBe(false);
+    expect(model.focusedDate).toBeNull();
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.format).toBeNull();
+    expect(model.max).toBeNull();
+    expect(model.min).toBeNull();
+    expect(model.toggleIcon).toBeNull();
+    expect(model.toggleLabel).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER);
+    expect(model.value).toBe(config.value);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER);
+    expect(json.value).toBe((model.value as Date).toJSON());
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.ts
new file mode 100644
index 00000000000..9e72729d60a
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model.ts
@@ -0,0 +1,50 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isString,
+} from '../../utils/core.utils';
+import {
+  DynamicDateControlModel,
+  DynamicDateControlModelConfig,
+  DynamicDateControlValue,
+} from '../dynamic-date-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER = 'DATEPICKER';
+
+export interface DynamicDatePickerModelConfig extends DynamicDateControlModelConfig {
+    autoFocus?: boolean;
+    focusedDate?: DynamicDateControlValue;
+    inline?: boolean;
+    prefix?: string;
+    readOnly?: boolean;
+    suffix?: string;
+    toggleIcon?: string;
+    toggleLabel?: string;
+}
+
+export class DynamicDatePickerModel extends DynamicDateControlModel {
+    @serializable() autoFocus: boolean;
+    @serializable() focusedDate: DynamicDateControlValue | null;
+    @serializable() inline: boolean;
+    @serializable() prefix: string | null;
+    @serializable() readOnly: boolean;
+    @serializable() suffix: string | null;
+    @serializable() toggleIcon: string | null;
+    @serializable() toggleLabel: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER;
+
+    constructor(config: DynamicDatePickerModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.autoFocus = isBoolean(config.autoFocus) ? config.autoFocus : false;
+      this.focusedDate = config.focusedDate ?? null;
+      this.inline = isBoolean(config.inline) ? config.inline : false;
+      this.prefix = config.prefix ?? null;
+      this.readOnly = isBoolean(config.readOnly) ? config.readOnly : false;
+      this.toggleIcon = isString(config.toggleIcon) ? config.toggleIcon : null;
+      this.toggleLabel = isString(config.toggleLabel) ? config.toggleLabel : null;
+      this.suffix = config.suffix ?? null;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-check-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-check-control.model.ts
new file mode 100644
index 00000000000..04a8e46a5f4
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-check-control.model.ts
@@ -0,0 +1,34 @@
+import { serializable } from '../decorator/serializable.decorator';
+import { isBoolean } from '../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from './dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export interface DynamicCheckControlModelConfig extends DynamicFormValueControlModelConfig<boolean> {
+    labelPosition?: string;
+}
+
+export abstract class DynamicCheckControlModel extends DynamicFormValueControlModel<boolean> {
+    @serializable() labelPosition: string | null;
+
+    protected constructor(config: DynamicCheckControlModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.labelPosition = config.labelPosition ?? null;
+      this.checked = isBoolean(this.value) ? this.value : false;
+    }
+
+    get checked(): boolean {
+      return this.value ?? false;
+    }
+
+    set checked(checked: boolean) {
+      this.value = checked;
+    }
+
+    toggle(): void {
+      this.checked = !this.checked;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-date-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-date-control.model.ts
new file mode 100644
index 00000000000..9906dd6348f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-date-control.model.ts
@@ -0,0 +1,31 @@
+import { serializable } from '../decorator/serializable.decorator';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from './dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export type DynamicDateControlValue = string | object | Date;
+
+export interface DynamicDateControlModelConfig extends DynamicFormValueControlModelConfig<DynamicDateControlValue> {
+    format?: string;
+    max?: DynamicDateControlValue;
+    min?: DynamicDateControlValue;
+    placeholder?: string;
+}
+
+export abstract class DynamicDateControlModel extends DynamicFormValueControlModel<DynamicDateControlValue> {
+    @serializable() format: string | null;
+    @serializable() max: DynamicDateControlValue | null;
+    @serializable() min: DynamicDateControlValue | null;
+    @serializable() placeholder: string | null;
+
+    protected constructor(config: DynamicDateControlModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.format = config.format ?? null;
+      this.max = config.max ?? null;
+      this.min = config.min ?? null;
+      this.placeholder = config.placeholder ?? null;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-file-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-file-control.model.ts
new file mode 100644
index 00000000000..04554d09d16
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-file-control.model.ts
@@ -0,0 +1,21 @@
+import { serializable } from '../decorator/serializable.decorator';
+import { isBoolean } from '../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from './dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export interface DynamicFileControlModelConfig extends DynamicFormValueControlModelConfig<File | File[]> {
+    multiple?: boolean;
+}
+
+export abstract class DynamicFileControlModel extends DynamicFormValueControlModel<File | File[]> {
+    @serializable() multiple: boolean;
+
+    protected constructor(config: DynamicFileControlModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.multiple = isBoolean(config.multiple) ? config.multiple : false;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-control.model.ts
new file mode 100644
index 00000000000..cddef22e906
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-control.model.ts
@@ -0,0 +1,95 @@
+import {
+  BehaviorSubject,
+  Observable,
+} from 'rxjs';
+
+import {
+  serializable,
+  serialize,
+} from '../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isObject,
+  isString,
+} from '../utils/core.utils';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+import { DynamicPathable } from './misc/dynamic-form-control-path.model';
+import { DynamicFormControlRelation } from './misc/dynamic-form-control-relation.model';
+import {
+  DynamicFormHook,
+  DynamicValidatorsConfig,
+} from './misc/dynamic-form-control-validation.model';
+
+export interface DynamicFormControlModelConfig {
+    asyncValidators?: DynamicValidatorsConfig;
+    disabled?: boolean;
+    errorMessages?: DynamicValidatorsConfig;
+    hidden?: boolean;
+    id: string;
+    label?: string;
+    labelTooltip?: string;
+    controlTooltip?: string;
+    name?: string;
+    relations?: DynamicFormControlRelation[];
+    updateOn?: DynamicFormHook;
+    validators?: DynamicValidatorsConfig;
+}
+
+export abstract class DynamicFormControlModel implements DynamicPathable {
+    @serializable() asyncValidators: DynamicValidatorsConfig | null;
+    @serializable('disabled') _disabled: boolean;
+    @serializable() errorMessages: DynamicValidatorsConfig | null;
+    @serializable() hidden: boolean;
+    @serializable() id: string;
+    @serializable() label: string | null;
+    @serializable() labelTooltip: string | null;
+    @serializable() controlTooltip: string | null;
+    @serializable() layout: DynamicFormControlLayout | null;
+    @serializable() name: string;
+    parent: DynamicPathable | null = null;
+    @serializable() relations: DynamicFormControlRelation[];
+    @serializable() updateOn: DynamicFormHook | null;
+    @serializable() validators: DynamicValidatorsConfig | null;
+
+    private readonly disabled$: BehaviorSubject<boolean>;
+
+    readonly disabledChanges: Observable<boolean>;
+
+    abstract readonly type: string;
+
+    protected constructor(config: DynamicFormControlModelConfig, layout: DynamicFormControlLayout | null = null) {
+      this.asyncValidators = config.asyncValidators ?? null;
+      this.errorMessages = config.errorMessages ?? null;
+      this.hidden = isBoolean(config.hidden) ? config.hidden : false;
+      this.id = config.id;
+      this.label = config.label ?? null;
+      this.labelTooltip = config.labelTooltip ?? null;
+      this.controlTooltip = config.controlTooltip ?? null;
+      this.layout = layout;
+      this.name = config.name ?? config.id;
+      this.relations = Array.isArray(config.relations) ? config.relations : [];
+      this.updateOn = isString(config.updateOn) ? config.updateOn : null;
+      this.validators = config.validators ?? null;
+
+      this._disabled = isBoolean(config.disabled) ? config.disabled : false;
+      this.disabled$ = new BehaviorSubject(this._disabled);
+      this.disabled$.subscribe(disabled => this._disabled = disabled);
+      this.disabledChanges = this.disabled$.asObservable();
+    }
+
+    get disabled(): boolean {
+      return this.disabled$.getValue();
+    }
+
+    set disabled(disabled: boolean) {
+      this.disabled$.next(disabled);
+    }
+
+    get hasErrorMessages(): boolean {
+      return isObject(this.errorMessages);
+    }
+
+    toJSON() {
+      return serialize(this);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-value-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-value-control.model.ts
new file mode 100644
index 00000000000..1948bcac81d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-form-value-control.model.ts
@@ -0,0 +1,61 @@
+import {
+  BehaviorSubject,
+  Observable,
+} from 'rxjs';
+
+import { serializable } from '../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isObject,
+} from '../utils/core.utils';
+import {
+  DynamicFormControlModel,
+  DynamicFormControlModelConfig,
+} from './dynamic-form-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export interface DynamicFormValueControlModelConfig<T> extends DynamicFormControlModelConfig {
+    additional?: { [key: string]: any };
+    hint?: string;
+    required?: boolean;
+    tabIndex?: number;
+    value?: T;
+}
+
+export abstract class DynamicFormValueControlModel<T> extends DynamicFormControlModel {
+    @serializable() additional: { [key: string]: any } | null;
+    @serializable() hint: string | null;
+    @serializable() required: boolean;
+    @serializable() tabIndex: number | null;
+    @serializable('value') private _value: T | null;
+
+    private readonly value$: BehaviorSubject<T | null>;
+
+    readonly valueChanges: Observable<T | null>;
+
+    protected constructor(config: DynamicFormValueControlModelConfig<T>, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.additional = isObject(config.additional) ? config.additional : null;
+      this.hint = config.hint ?? null;
+      this.required = isBoolean(config.required) ? config.required : false;
+      this.tabIndex = config.tabIndex ?? null;
+
+      this._value = config.value ?? null;
+      this.value$ = new BehaviorSubject(this._value);
+      this.value$.subscribe(value => this._value = value);
+      this.valueChanges = this.value$.asObservable();
+    }
+
+    get value(): T | null {
+      return this.value$.getValue();
+    }
+
+    set value(value: T | null) {
+      this.value$.next(value);
+    }
+
+    getAdditional(key: string, defaultValue?: any): any {
+      return this.additional !== null && this.additional.hasOwnProperty(key) ? this.additional[key] : defaultValue;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-input-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-input-control.model.ts
new file mode 100644
index 00000000000..4252713247a
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-input-control.model.ts
@@ -0,0 +1,48 @@
+import { serializable } from '../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isNumber,
+} from '../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from './dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export interface DynamicInputControlModelConfig<T> extends DynamicFormValueControlModelConfig<T> {
+    autoComplete?: string;
+    autoFocus?: boolean;
+    maxLength?: number;
+    minLength?: number;
+    placeholder?: string;
+    prefix?: string;
+    readOnly?: boolean;
+    spellCheck?: boolean;
+    suffix?: string;
+}
+
+export abstract class DynamicInputControlModel<T> extends DynamicFormValueControlModel<T> {
+    @serializable() autoComplete: string;
+    @serializable() autoFocus: boolean;
+    @serializable() maxLength: number | null;
+    @serializable() minLength: number | null;
+    @serializable() placeholder: string;
+    @serializable() prefix: string | null;
+    @serializable() readOnly: boolean;
+    @serializable() spellCheck: boolean;
+    @serializable() suffix: string | null;
+
+    protected constructor(config: DynamicInputControlModelConfig<T>, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.autoComplete = config.autoComplete ?? 'on';
+      this.autoFocus = isBoolean(config.autoFocus) ? config.autoFocus : false;
+      this.maxLength = isNumber(config.maxLength) ? config.maxLength : null;
+      this.minLength = isNumber(config.minLength) ? config.minLength : null;
+      this.placeholder = config.placeholder ?? '';
+      this.prefix = config.prefix ?? null;
+      this.readOnly = isBoolean(config.readOnly) ? config.readOnly : false;
+      this.spellCheck = isBoolean(config.spellCheck) ? config.spellCheck : false;
+      this.suffix = config.suffix ?? null;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/dynamic-option-control.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-option-control.model.ts
new file mode 100644
index 00000000000..7730224fa82
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/dynamic-option-control.model.ts
@@ -0,0 +1,112 @@
+/* eslint-disable max-classes-per-file */
+import {
+  isObservable,
+  Observable,
+  of,
+} from 'rxjs';
+import { map } from 'rxjs/operators';
+
+import {
+  serializable,
+  serialize,
+} from '../decorator/serializable.decorator';
+import { isBoolean } from '../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from './dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from './misc/dynamic-form-control-layout.model';
+
+export interface DynamicFormOptionConfig<T> {
+    disabled?: boolean;
+    label?: string;
+    value: T;
+}
+
+export class DynamicFormOption<T> {
+    @serializable() disabled: boolean;
+    @serializable() label: string | null;
+    @serializable() value: T;
+
+    constructor(config: DynamicFormOptionConfig<T>) {
+      this.disabled = isBoolean(config.disabled) ? config.disabled : false;
+      this.label = config.label ?? null;
+      this.value = config.value;
+    }
+
+    get text() {
+      return this.label;
+    }
+
+    set text(text: string | null) {
+      this.label = text;
+    }
+
+    toJSON() {
+      return serialize(this);
+    }
+}
+
+export interface DynamicOptionControlModelConfig<T> extends DynamicFormValueControlModelConfig<T | T[]> {
+    options?: DynamicFormOptionConfig<T>[] | Observable<DynamicFormOptionConfig<T>[]>;
+}
+
+export abstract class DynamicOptionControlModel<T> extends DynamicFormValueControlModel<T | T[]> {
+    @serializable('options') private _options: DynamicFormOption<T>[] = [];
+    options$!: Observable<DynamicFormOption<T>[]>;
+
+    protected constructor(config: DynamicOptionControlModelConfig<T>, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.options = config.options;
+    }
+
+    private updateOptions$(): void {
+      this.options$ = of(this.options);
+    }
+
+    set options(options: any) {
+      if (Array.isArray(options)) {
+        this._options = (options as DynamicFormOptionConfig<T>[]).map(optionConfig => new DynamicFormOption<T>(optionConfig));
+        this.updateOptions$();
+
+      } else if (isObservable(options)) {
+        this.options$ = (options as Observable<DynamicFormOptionConfig<T>[]>).pipe(
+          map(optionsConfig => {
+            this._options = optionsConfig.map(optionConfig => new DynamicFormOption<T>(optionConfig));
+            return this._options;
+          }));
+
+      } else {
+        this.updateOptions$();
+      }
+    }
+
+    get options(): any {
+      return this._options;
+    }
+
+    add(optionConfig: DynamicFormOptionConfig<T>): DynamicFormOption<T> {
+      return this.insert(this.options.length, optionConfig);
+    }
+
+    get(index: number): DynamicFormOption<T> {
+      return this.options[index];
+    }
+
+    insert(index: number, optionConfig: DynamicFormOptionConfig<T>): DynamicFormOption<T> {
+      const option = new DynamicFormOption(optionConfig);
+
+      this.options.splice(index, 0, option);
+      this.updateOptions$();
+
+      return option;
+    }
+
+    remove(...indices: number[]): void {
+      indices.forEach(index => this.options.splice(index, 1));
+      this.updateOptions$();
+    }
+
+    abstract select(...indices: number[]): void;
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.spec.ts
new file mode 100644
index 00000000000..3e9c0371bb2
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.spec.ts
@@ -0,0 +1,42 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_EDITOR,
+  DynamicEditorModel,
+} from './dynamic-editor.model';
+
+describe('DynamicEditorModel test suite', () => {
+  let model: DynamicEditorModel;
+  const config: any = {
+    id: 'editor',
+    validators: { required: null, minLength: 5 },
+  };
+
+  beforeEach(() => model = new DynamicEditorModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.errorMessages).toBeNull();
+    expect(model.hasErrorMessages).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_EDITOR);
+    expect(model.value).toBeNull();
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should set disabled property correctly', () => {
+    model.disabled = true;
+
+    expect(model.disabled).toBe(true);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(Object.keys(json.validators).length).toBe(Object.keys(model.validators as any).length);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_EDITOR);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.ts
new file mode 100644
index 00000000000..5109dfb6c92
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/editor/dynamic-editor.model.ts
@@ -0,0 +1,19 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  DynamicInputControlModel,
+  DynamicInputControlModelConfig,
+} from '../dynamic-input-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_EDITOR = 'EDITOR';
+// eslint-disable-next-line  @typescript-eslint/no-empty-object-type
+export interface DynamicEditorModelConfig extends DynamicInputControlModelConfig<string> {
+}
+
+export class DynamicEditorModel extends DynamicInputControlModel<string> {
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_EDITOR;
+
+    constructor(config: DynamicEditorModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.spec.ts
new file mode 100644
index 00000000000..268b8ae367d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.spec.ts
@@ -0,0 +1,37 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD,
+  DynamicFileUploadModel,
+} from './dynamic-file-upload.model';
+
+describe('DynamicFileUploadModel test suite', () => {
+  let model: DynamicFileUploadModel;
+  const config: any = {
+    id: 'upload',
+  };
+
+  beforeEach(() => model = new DynamicFileUploadModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.autoUpload).toBe(true);
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.multiple).toBe(false);
+    expect(model.removeUrl).toBeNull();
+    expect(model.showFileList).toBe(true);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD);
+    expect(model.url).toBeNull();
+    expect(model.value).toBeNull();
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD);
+    expect(json.value).toBeNull();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.ts
new file mode 100644
index 00000000000..670056f3be1
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/file-upload/dynamic-file-upload.model.ts
@@ -0,0 +1,46 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isNumber,
+} from '../../utils/core.utils';
+import {
+  DynamicFileControlModel,
+  DynamicFileControlModelConfig,
+} from '../dynamic-file-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD = 'FILE_UPLOAD';
+
+export interface DynamicFileUploadModelConfig extends DynamicFileControlModelConfig {
+    accept?: string[];
+    autoUpload?: boolean;
+    maxSize?: number;
+    minSize?: number;
+    removeUrl?: string;
+    showFileList?: boolean;
+    url?: string;
+}
+
+export class DynamicFileUploadModel extends DynamicFileControlModel {
+    @serializable() accept: string[] | null;
+    @serializable() autoUpload: boolean;
+    @serializable() maxSize: number | null;
+    @serializable() minSize: number | null;
+    @serializable() removeUrl: string | null;
+    @serializable() showFileList: boolean;
+    @serializable() url: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD;
+
+    constructor(config: DynamicFileUploadModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.accept = Array.isArray(config.accept) ? config.accept : null;
+      this.autoUpload = isBoolean(config.autoUpload) ? config.autoUpload : true;
+      this.maxSize = isNumber(config.maxSize) ? config.maxSize : null;
+      this.minSize = isNumber(config.minSize) ? config.minSize : null;
+      this.removeUrl = config.removeUrl ?? null;
+      this.showFileList = isBoolean(config.showFileList) ? config.showFileList : true;
+      this.url = config.url ?? null;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.spec.ts
new file mode 100644
index 00000000000..bb34f5f57a3
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.spec.ts
@@ -0,0 +1,69 @@
+import { DynamicInputModel } from '../input/dynamic-input.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
+  DynamicFormArrayGroupModel,
+  DynamicFormArrayModel,
+} from './dynamic-form-array.model';
+
+
+describe('DynamicFormArrayModel test suite', () => {
+  let model: DynamicFormArrayModel;
+  const config: any = {
+    id: 'formArray',
+    initialCount: 3,
+    groupFactory: () => [
+      new DynamicInputModel({
+        id: 'input',
+      }),
+      new DynamicFormArrayModel({
+        id: 'nestedFormArray',
+        groupFactory: () => [
+          new DynamicInputModel({
+            id: 'nestedInput',
+          }),
+        ],
+      }),
+    ],
+    validators: {
+      required: null,
+    },
+  };
+
+  beforeEach(() => model = new DynamicFormArrayModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.initialCount).toBe(config.initialCount);
+    expect(model.size).toBe(model.initialCount);
+    expect(model.id).toEqual(config.id);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_ARRAY);
+    expect(model.groupFactory().length).toEqual(2);
+    expect(model.removeGroup).toBeDefined();
+    expect(model.disabledChanges).toBeDefined();
+  });
+
+  it('should throw when no createGroup function is specified', () => {
+    expect(() => new DynamicFormArrayModel({ id: 'test' }))
+      .toThrow(new Error('group factory function must be specified for DynamicFormArrayModel'));
+  });
+
+  it('should get the correct group model', () => {
+    expect(model.get(0) instanceof DynamicFormArrayGroupModel).toBe(true);
+    expect(model.get(1) instanceof DynamicFormArrayGroupModel).toBe(true);
+  });
+
+  it('should add another form array group', () => {
+    model.addGroup();
+
+    expect(model.size).toBe(config.initialCount + 1);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.asyncValidators).toBeNull();
+    expect(json.id).toEqual(model.id);
+    expect(json.groups.length).toEqual(model.size);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_ARRAY);
+    expect(Object.keys(json.validators)[0]).toEqual('required');
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.ts
new file mode 100644
index 00000000000..83b43d30e38
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/form-array/dynamic-form-array.model.ts
@@ -0,0 +1,130 @@
+/* eslint-disable max-classes-per-file */
+import {
+  serializable,
+  serialize,
+} from '../../decorator/serializable.decorator';
+import {
+  isFunction,
+  isNumber,
+} from '../../utils/core.utils';
+import {
+  DynamicFormControlModel,
+  DynamicFormControlModelConfig,
+} from '../dynamic-form-control.model';
+import { DynamicFormModel } from '../form-group/dynamic-form-group.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+import { DynamicPathable } from '../misc/dynamic-form-control-path.model';
+import { DynamicValidatorsConfig } from '../misc/dynamic-form-control-validation.model';
+
+export class DynamicFormArrayGroupModel implements DynamicPathable {
+  $implicit: DynamicFormArrayGroupModel;
+  context: DynamicFormArrayModel;
+    @serializable() group: DynamicFormModel;
+    @serializable() index: number;
+
+    constructor(context: DynamicFormArrayModel, group: DynamicFormModel = [], index: number = -1) {
+      this.$implicit = this;
+      this.context = context;
+      this.group = group;
+      this.index = index;
+    }
+
+    get parent(): DynamicFormArrayModel {
+      return this.context;
+    }
+
+    get(index: number): DynamicFormControlModel {
+      return this.group[index];
+    }
+
+    toJSON() {
+      return serialize(this);
+    }
+}
+
+export const DYNAMIC_FORM_CONTROL_TYPE_ARRAY = 'ARRAY';
+
+export interface DynamicFormArrayModelConfig extends DynamicFormControlModelConfig {
+    groupAsyncValidators?: DynamicValidatorsConfig;
+    groupFactory?: () => DynamicFormModel;
+    groupValidators?: DynamicValidatorsConfig;
+    groups?: DynamicFormArrayGroupModel[] | null;
+    initialCount?: number;
+}
+
+export class DynamicFormArrayModel extends DynamicFormControlModel {
+    @serializable() groupAsyncValidators: DynamicValidatorsConfig | null;
+    groupFactory: () => DynamicFormModel;
+    @serializable() groupValidators: DynamicValidatorsConfig | null;
+    @serializable() groups: DynamicFormArrayGroupModel[] = [];
+    @serializable() initialCount: number;
+
+    @serializable() readonly groupPrototype: DynamicFormModel; // only to recreate model from JSON
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_ARRAY;
+
+    constructor(config: DynamicFormArrayModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      if (isFunction(config.groupFactory)) {
+        this.groupFactory = config.groupFactory;
+      } else {
+        throw new Error('group factory function must be specified for DynamicFormArrayModel');
+      }
+
+      this.groupAsyncValidators = config.groupAsyncValidators ?? null;
+      this.groupPrototype = this.groupFactory();
+      this.groupValidators = config.groupValidators ?? null;
+      this.initialCount = isNumber(config.initialCount) ? config.initialCount : 1;
+
+      if (Array.isArray(config.groups)) {
+        config.groups.forEach((arrayGroup, index) => {
+          this.groups.push(new DynamicFormArrayGroupModel(this, arrayGroup.group, arrayGroup.index ?? index));
+        });
+
+      } else {
+        for (let index = 0; index < this.initialCount; index++) {
+          this.addGroup();
+        }
+      }
+    }
+
+    private updateGroupIndex(): void {
+      this.groups.forEach((group, index) => group.index = index);
+    }
+
+    get size(): number {
+      return this.groups.length;
+    }
+
+    get(index: number): DynamicFormArrayGroupModel {
+      return this.groups[index];
+    }
+
+    addGroup(): DynamicFormArrayGroupModel {
+      return this.insertGroup(this.groups.length);
+    }
+
+    insertGroup(index: number): DynamicFormArrayGroupModel {
+      const group = new DynamicFormArrayGroupModel(this, this.groupFactory());
+
+      this.groups.splice(index, 0, group);
+      this.updateGroupIndex();
+
+      return group;
+    }
+
+    moveGroup(index: number, step: number): void {
+      this.groups.splice(index + step, 0, ...this.groups.splice(index, 1));
+      this.updateGroupIndex();
+    }
+
+    removeGroup(index: number): void {
+      this.groups.splice(index, 1);
+      this.updateGroupIndex();
+    }
+
+    clear(): void {
+      this.groups.splice(0);
+      this.updateGroupIndex();
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.spec.ts
new file mode 100644
index 00000000000..d1a3d940759
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.spec.ts
@@ -0,0 +1,60 @@
+import { DynamicInputModel } from '../input/dynamic-input.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
+  DynamicFormGroupModel,
+} from './dynamic-form-group.model';
+
+
+describe('DynamicFormGroupModel test suite', () => {
+  let model: DynamicFormGroupModel;
+  const config: any = {
+    id: 'formGroup',
+    group: [
+      new DynamicInputModel({
+        id: 'input',
+      }),
+    ],
+    validators: {
+      required: null,
+    },
+  };
+
+  beforeEach(() => model = new DynamicFormGroupModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.id).toEqual(config.id);
+    expect(model.group.length).toBe(config.group.length);
+    expect(model.size()).toBe(model.group.length);
+    expect(model.legend).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_GROUP);
+    expect(model.disabledChanges).toBeDefined();
+  });
+
+  it('should get the correct DynamicFormControlModel of group', () => {
+    expect(model.get(0) === model.group[0]).toBe(true);
+  });
+
+  it('should correctly set a DynamicFormControlModel', () => {
+    const newModel = new DynamicInputModel({ id: 'setInput' });
+
+    model.set(0, newModel);
+
+    expect(model.get(0) === newModel).toBe(true);
+  });
+
+  it('should correctly add a DynamicFormControlModel', () => {
+    const newModel = new DynamicInputModel({ id: 'addInput' });
+
+    model.add(newModel);
+
+    expect(model.get(model.size() - 1) === newModel).toBe(true);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_GROUP);
+    expect(Object.keys(json.validators)[0]).toEqual('required');
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.ts
new file mode 100644
index 00000000000..1340e654ef5
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/form-group/dynamic-form-group.model.ts
@@ -0,0 +1,59 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  DynamicFormControlModel,
+  DynamicFormControlModelConfig,
+} from '../dynamic-form-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_GROUP = 'GROUP';
+
+export interface DynamicFormGroupModelConfig extends DynamicFormControlModelConfig {
+    group?: DynamicFormModel;
+    legend?: string;
+}
+
+export type DynamicFormModel = DynamicFormControlModel[];
+
+export type DynamicUnionFormModel = DynamicFormModel | DynamicFormGroupModel;
+
+export class DynamicFormGroupModel extends DynamicFormControlModel {
+    @serializable() group: DynamicFormModel;
+    @serializable() legend: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_GROUP;
+
+    constructor(config: DynamicFormGroupModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.group = Array.isArray(config.group) ? config.group : [];
+      this.legend = config.legend ?? null;
+    }
+
+    get(index: number): DynamicFormControlModel {
+      return this.group[index];
+    }
+
+    set(index: number, controlModel: DynamicFormControlModel): void {
+      this.group[index] = controlModel;
+    }
+
+    add(controlModel: DynamicFormControlModel): void {
+      this.group.push(controlModel);
+    }
+
+    insert(index: number, controlModel: DynamicFormControlModel): void {
+      this.group.splice(index, 0, controlModel);
+    }
+
+    move(index: number, step: number): void {
+      this.group.splice(index + step, 0, ...this.group.splice(index, 1));
+    }
+
+    remove(index: number) {
+      this.group.splice(index, 1);
+    }
+
+    size(): number {
+      return this.group.length;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.spec.ts
new file mode 100644
index 00000000000..f4f48224b5f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.spec.ts
@@ -0,0 +1,116 @@
+import { AUTOCOMPLETE_ON } from '@ng-dynamic-forms/core/utils/autofill.utils';
+
+import { isString } from '../../utils/core.utils';
+import {
+  DYNAMIC_FORM_CONTROL_INPUT_TYPE_TEXT,
+  DYNAMIC_FORM_CONTROL_TYPE_INPUT,
+  DynamicInputModel,
+} from './dynamic-input.model';
+
+describe('DynamicInputModel test suite', () => {
+  let model: DynamicInputModel;
+  const config = {
+    id: 'input',
+    list: ['One', 'Two', 'Three'],
+    mask: '00/00',
+  };
+
+  beforeEach(() => {
+    model = new DynamicInputModel(config);
+  });
+
+  it('should initialize correctly', () => {
+    expect(model.asyncValidators).toBeNull();
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.validators).toBeNull();
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('tests if correct default type property is set', () => {
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_INPUT);
+  });
+
+  it('tests if correct default input type property is set', () => {
+    expect(model.inputType).toEqual(DYNAMIC_FORM_CONTROL_INPUT_TYPE_TEXT);
+  });
+
+  it('tests if correct default autoComplete property is set', () => {
+    expect(model.autoComplete).toEqual(AUTOCOMPLETE_ON);
+  });
+
+  it('tests if correct default autoFocus property is set', () => {
+    expect(model.autoFocus).toBe(false);
+  });
+
+  it('tests if correct default hint property is set', () => {
+    expect(model.hint).toBeNull();
+  });
+
+  it('tests if correct default label property is set', () => {
+    expect(model.label).toBeNull();
+  });
+
+  it('tests if correct default list property is set', () => {
+    expect(model.hasList).toBe(true);
+    expect(isString(model.listId)).toBe(true);
+    expect(model.list$).toBeDefined();
+  });
+
+  it('tests if correct default max property is set', () => {
+    expect(model.max).toBeNull();
+  });
+
+  it('tests if correct default maxLength property is set', () => {
+    expect(model.maxLength).toBeNull();
+  });
+
+  it('tests if correct default minLength property is set', () => {
+    expect(model.minLength).toBeNull();
+  });
+
+  it('tests if correct default min property is set', () => {
+    expect(model.min).toBeNull();
+  });
+
+  it('tests if correct default placeholder property is set', () => {
+    expect(model.placeholder).toEqual('');
+  });
+
+  it('tests if correct default readonly property is set', () => {
+    expect(model.readOnly).toBe(false);
+  });
+
+  it('tests if correct default required property is set', () => {
+    expect(model.required).toBe(false);
+  });
+
+  it('tests if correct default spellcheck property is set', () => {
+    expect(model.spellCheck).toBe(false);
+  });
+
+  it('tests if correct default step property is set', () => {
+    expect(model.step).toBeNull();
+  });
+
+  it('tests if correct default prefix property is set', () => {
+    expect(model.prefix).toBeNull();
+  });
+
+  it('tests if correct default suffix property is set', () => {
+    expect(model.suffix).toBeNull();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.disabled).toEqual(model.disabled);
+    expect(json.hidden).toEqual(model.hidden);
+    expect(json.mask).toEqual(config.mask);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_INPUT);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.ts
new file mode 100644
index 00000000000..685f18b08a3
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/input/dynamic-input.model.ts
@@ -0,0 +1,115 @@
+import {
+  IConfig,
+  initialConfig,
+} from 'ngx-mask';
+import {
+  isObservable,
+  Observable,
+  of,
+} from 'rxjs';
+import { tap } from 'rxjs/operators';
+
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isNumber,
+} from '../../utils/core.utils';
+import {
+  DynamicInputControlModel,
+  DynamicInputControlModelConfig,
+} from '../dynamic-input-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_INPUT = 'INPUT';
+
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_COLOR = 'color';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_DATE = 'date';
+// export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_DATETIME = "datetime";
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_DATETIME_LOCAL = 'datetime-local';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_EMAIL = 'email';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_FILE = 'file';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_MONTH = 'month';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_NUMBER = 'number';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_PASSWORD = 'password';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_RANGE = 'range';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_SEARCH = 'search';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_TEL = 'tel';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_TEXT = 'text';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_TIME = 'time';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_URL = 'url';
+export const DYNAMIC_FORM_CONTROL_INPUT_TYPE_WEEK = 'week';
+
+export interface DynamicInputModelConfig extends DynamicInputControlModelConfig<string | number | Date | string[]> {
+    accept?: string;
+    inputType?: string;
+    list?: any[] | Observable<any[]>;
+    mask?: string;
+    maskConfig?: Partial<IConfig>;
+    max?: number | string | Date;
+    min?: number | string | Date;
+    multiple?: boolean;
+    pattern?: string;
+    step?: number;
+}
+
+export class DynamicInputModel extends DynamicInputControlModel<string | number | Date | string[]> {
+    @serializable() accept: string | null;
+    @serializable() inputType: string;
+    files: FileList | null = null;
+    list$: Observable<any[]> | null = null;
+    @serializable() mask: string;
+    @serializable() maskConfig: IConfig;
+    @serializable() max: number | string | Date | null;
+    @serializable() min: number | string | Date | null;
+    @serializable() multiple: boolean | null;
+    @serializable() pattern: string | null;
+    @serializable() step: number | null;
+
+    @serializable('list') private _list: any[] | null = null;
+    private readonly _listId: string | null = null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_INPUT;
+
+    constructor(config: DynamicInputModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.accept = config.accept ?? null;
+      this.inputType = config.inputType ?? DYNAMIC_FORM_CONTROL_INPUT_TYPE_TEXT;
+      this.mask = config.mask ?? '';
+      this.maskConfig = config.maskConfig ? { ...initialConfig, ...config.maskConfig } : initialConfig;
+      this.max = config.max !== undefined ? config.max : null;
+      this.min = config.min !== undefined ? config.min : null;
+      this.multiple = isBoolean(config.multiple) ? config.multiple : null;
+      this.pattern = config.pattern ?? null;
+      this.step = isNumber(config.step) ? config.step : null;
+
+      if (config.list !== undefined) {
+        this.list = config.list;
+        this._listId = `${this.id}List`;
+      }
+    }
+
+    get listId(): string | null {
+      return this._listId;
+    }
+
+    get hasList(): boolean {
+      return isObservable(this.list$);
+    }
+
+    set list(list: any[] | Observable<any[]> | null) {
+      if (Array.isArray(list)) {
+        this._list = list;
+        this.list$ = of(this._list);
+
+      } else if (isObservable(list)) {
+        this.list$ = list.pipe(
+          tap(_list => this._list = _list),
+        );
+
+      } else {
+        this._list = null;
+        this.list$ = null;
+      }
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model.ts
new file mode 100644
index 00000000000..c45c4778be2
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model.ts
@@ -0,0 +1,24 @@
+export interface DynamicFormControlLayoutConfig {
+    children?: string;
+    container?: string;
+    control?: string;
+    errors?: string;
+    group?: string;
+    hint?: string;
+    host?: string;
+    label?: string;
+    option?: string;
+
+    [key: string]: string | undefined;
+}
+
+export interface DynamicFormControlLayout {
+    element?: DynamicFormControlLayoutConfig;
+    grid?: DynamicFormControlLayoutConfig;
+
+    [key: string]: DynamicFormControlLayoutConfig | undefined;
+}
+
+export type DynamicFormControlLayoutPlace = keyof DynamicFormControlLayoutConfig;
+
+export type DynamicFormControlLayoutContext = keyof DynamicFormControlLayout;
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-path.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-path.model.ts
new file mode 100644
index 00000000000..b199feac620
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-path.model.ts
@@ -0,0 +1,5 @@
+export interface DynamicPathable {
+    id?: string;
+    index?: number | null;
+    parent: DynamicPathable | null;
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model.ts
new file mode 100644
index 00000000000..e8b06b500bf
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-relation.model.ts
@@ -0,0 +1,12 @@
+export interface DynamicFormControlCondition {
+    id?: string;
+    rootPath?: string;
+    status?: string;
+    value?: any;
+}
+
+export interface DynamicFormControlRelation {
+    match: string;
+    operator?: string;
+    when: DynamicFormControlCondition[];
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-validation.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-validation.model.ts
new file mode 100644
index 00000000000..de0877f2336
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/misc/dynamic-form-control-validation.model.ts
@@ -0,0 +1,12 @@
+export interface DynamicValidatorDescriptor {
+    name: string;
+    args: any;
+}
+// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+export interface DynamicValidatorsConfig { [validatorKey: string]: any | DynamicValidatorDescriptor }
+
+export enum DynamicFormHook {
+    Blur = 'blur',
+    Change = 'change',
+    Submit = 'submit'
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.spec.ts
new file mode 100644
index 00000000000..9d7f5ddc440
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.spec.ts
@@ -0,0 +1,100 @@
+import { waitForAsync } from '@angular/core/testing';
+import {
+  isObservable,
+  of,
+} from 'rxjs';
+
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP,
+  DynamicRadioGroupModel,
+} from './dynamic-radio-group.model';
+
+describe('DynamicRadioModel test suite', () => {
+  let model: DynamicRadioGroupModel<string>;
+  const config = {
+    id: 'radio',
+    options: of([
+      {
+        value: '1',
+        label: 'One',
+      },
+      {
+        value: '2',
+        label: 'Two',
+      },
+    ]),
+  };
+
+  beforeEach(() => model = new DynamicRadioGroupModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.errorMessages).toBeNull();
+    expect(model.hasErrorMessages).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.legend).toBeNull();
+    expect(isObservable(model.options$)).toBe(true);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP);
+    expect(model.value).toBeNull();
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should select the correct option', waitForAsync(() => {
+    model.options$.subscribe(() => {
+      model.select(1);
+
+      expect(model.value).toEqual(model.get(1).value);
+    });
+  }));
+
+  it('should correctly create options Observable', waitForAsync(() => {
+    model.options$.subscribe(options => {
+      expect(options.length).toBe(2);
+    });
+  }));
+
+  it('should insert another option', waitForAsync(() => {
+    const option = { label: 'test option', value: 'test-option' };
+    const index = 1;
+
+    model.options$.subscribe(() => {
+      model.insert(index, option);
+
+      expect(model.options.length).toBe(3);
+      expect(model.get(index).value).toEqual(option.value);
+    });
+  }));
+
+  it('should remove a given option correctly', waitForAsync(() => {
+    model.options$.subscribe(() => {
+      model.remove(1);
+
+      expect(model.options.length).toBe(1);
+    });
+  }));
+
+  it('should get the correct option', () => {
+    expect(model.get(0)).toEqual(model.options[0]);
+    expect(model.get(1)).toEqual(model.options[1]);
+  });
+
+  it('should make options Observable deliver an empty array when options are set to non-expected value', waitForAsync(() => {
+    model.options = null;
+    model.options$.subscribe(options => {
+
+      expect(options.length).toBe(0);
+    });
+  }));
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.options.length).toBe(model.options.length);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.ts
new file mode 100644
index 00000000000..358628310b6
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/radio/dynamic-radio-group.model.ts
@@ -0,0 +1,28 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  DynamicOptionControlModel,
+  DynamicOptionControlModelConfig,
+} from '../dynamic-option-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP = 'RADIO_GROUP';
+
+export interface DynamicRadioGroupModelConfig<T> extends DynamicOptionControlModelConfig<T> {
+    legend?: string;
+}
+
+export class DynamicRadioGroupModel<T> extends DynamicOptionControlModel<T> {
+    @serializable() legend: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP;
+
+    constructor(config: DynamicRadioGroupModelConfig<T>, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.legend = config.legend ?? null;
+    }
+
+    select(index: number): void {
+      this.value = this.get(index).value;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.spec.ts
new file mode 100644
index 00000000000..739f0421b2c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.spec.ts
@@ -0,0 +1,35 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_RATING,
+  DynamicRatingModel,
+} from './dynamic-rating.model';
+
+describe('DynamicRatingModel test suite', () => {
+  let model: DynamicRatingModel;
+  const config = {
+    id: 'rating',
+    max: 5,
+    value: 2,
+  };
+
+  beforeEach(() => model = new DynamicRatingModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.max).toBe(config.max);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RATING);
+    expect(model.value).toBe(config.value);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_RATING);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.ts
new file mode 100644
index 00000000000..ed54d2c5d03
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/rating/dynamic-rating.model.ts
@@ -0,0 +1,24 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import { isNumber } from '../../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from '../dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_RATING = 'RATING';
+
+export interface DynamicRatingModelConfig extends DynamicFormValueControlModelConfig<number> {
+    max?: number;
+}
+
+export class DynamicRatingModel extends DynamicFormValueControlModel<number> {
+    @serializable() max: number | null;
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_RATING;
+
+    constructor(config: DynamicRatingModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.max = isNumber(config.max) ? config.max : 10;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.spec.ts
new file mode 100644
index 00000000000..32ebf2eafe5
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.spec.ts
@@ -0,0 +1,108 @@
+import { waitForAsync } from '@angular/core/testing';
+
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SELECT,
+  DynamicSelectModel,
+} from './dynamic-select.model';
+
+describe('DynamicSelectModel test suite', () => {
+  let model: DynamicSelectModel<string>;
+  const config = {
+    id: 'select',
+    multiple: false,
+    options: [
+      {
+        value: '1',
+        label: 'One',
+      },
+      {
+        value: '2',
+        label: 'Two',
+      },
+    ],
+  };
+
+  beforeEach(() => model = new DynamicSelectModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.filterable).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.multiple).toBe(config.multiple);
+    expect(model.options.length).toBe(config.options.length);
+    expect(model.placeholder).toEqual('');
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SELECT);
+    expect(model.value).toBeNull();
+    expect(model.compareWithFn).toBe(Object.is);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should get and set text property correctly', () => {
+    expect(model.get(0).text).toEqual('One');
+
+    model.get(0).text = 'Eins';
+
+    expect(model.get(0).text).toEqual('Eins');
+  });
+
+  it('should correctly create options Observable', waitForAsync(() => {
+    model.options$.subscribe(options => {
+      expect(options.length).toBe(config.options.length);
+    });
+  }));
+
+  it('should add another option', () => {
+    const option = { label: 'test option', value: 'test-option' };
+
+    model.add(option);
+
+    expect(model.options.length).toBe(config.options.length + 1);
+    expect(model.get(model.options.length - 1).value).toEqual(option.value);
+  });
+
+  it('should insert another option', () => {
+    const option = { label: 'test option', value: 'test-option' };
+    const index = 1;
+
+    model.insert(index, option);
+
+    expect(model.options.length).toBe(config.options.length + 1);
+    expect(model.get(index).value).toEqual(option.value);
+  });
+
+  it('should remove a given option', () => {
+    model.remove(1);
+
+    expect(model.options.length).toBe(config.options.length - 1);
+  });
+
+  it('should get the correct option', () => {
+    expect(model.get(0)).toEqual(model.options[0]);
+    expect(model.get(1)).toEqual(model.options[1]);
+  });
+
+  it('should select correct option', () => {
+    model.select(1);
+
+    expect(model.value).toEqual(model.get(1).value);
+  });
+
+  it('should select multiple options', () => {
+    model.multiple = true;
+    model.select(0, 1);
+
+    expect(model.value).toEqual([model.get(0).value, model.get(1).value]);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.options.length).toBe(model.options.length);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SELECT);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.ts
new file mode 100644
index 00000000000..e33880523fc
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/select/dynamic-select.model.ts
@@ -0,0 +1,47 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isFunction,
+} from '../../utils/core.utils';
+import {
+  DynamicOptionControlModel,
+  DynamicOptionControlModelConfig,
+} from '../dynamic-option-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_SELECT = 'SELECT';
+
+export interface DynamicSelectModelConfig<T> extends DynamicOptionControlModelConfig<T> {
+    compareWithFn?: (o1: any, o2: any) => boolean;
+    filterable?: boolean;
+    multiple?: boolean;
+    placeholder?: string;
+    prefix?: string;
+    suffix?: string;
+}
+
+export class DynamicSelectModel<T> extends DynamicOptionControlModel<T> {
+  compareWithFn: (value1: any, value2: any) => boolean;
+    @serializable() filterable: boolean;
+    @serializable() multiple: boolean;
+    @serializable() placeholder: string;
+    @serializable() prefix: string | null;
+    @serializable() suffix: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_SELECT;
+
+    constructor(config: DynamicSelectModelConfig<T>, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.compareWithFn = isFunction(config.compareWithFn) ? config.compareWithFn : Object.is;
+      this.filterable = isBoolean(config.filterable) ? config.filterable : false;
+      this.multiple = isBoolean(config.multiple) ? config.multiple : false;
+      this.placeholder = config.placeholder ?? '';
+      this.prefix = config.prefix ?? null;
+      this.suffix = config.suffix ?? null;
+    }
+
+    select(...indices: number[]): void {
+      this.value = this.multiple ? indices.map(index => this.get(index).value) : this.get(indices[0]).value;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.spec.ts
new file mode 100644
index 00000000000..7bda497724a
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.spec.ts
@@ -0,0 +1,48 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SLIDER,
+  DynamicSliderModel,
+} from './dynamic-slider.model';
+
+describe('DynamicSliderModel test suite', () => {
+  let model: DynamicSliderModel;
+  const config = {
+    id: 'slider',
+    min: 0,
+    max: 100,
+    step: 1,
+    value: 27,
+    additional: {
+      test: true,
+    },
+  };
+
+  beforeEach(() => model = new DynamicSliderModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.min).toBe(config.min);
+    expect(model.max).toBe(config.max);
+    expect(model.step).toBe(config.step);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SLIDER);
+    expect(model.value).toBe(config.value);
+    expect(model.vertical).toBe(false);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should get additional', () => {
+
+    expect(model.getAdditional('test', null)).toBe(true);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SLIDER);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.ts
new file mode 100644
index 00000000000..2101506dc8c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/slider/dynamic-slider.model.ts
@@ -0,0 +1,37 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  isBoolean,
+  isNumber,
+} from '../../utils/core.utils';
+import {
+  DynamicFormValueControlModel,
+  DynamicFormValueControlModelConfig,
+} from '../dynamic-form-value-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_SLIDER = 'SLIDER';
+
+export interface DynamicSliderModelConfig extends DynamicFormValueControlModelConfig<number> {
+    max?: number;
+    min?: number;
+    step?: number;
+    vertical?: boolean;
+}
+
+export class DynamicSliderModel extends DynamicFormValueControlModel<number> {
+    @serializable() max: number | null;
+    @serializable() min: number | null;
+    @serializable() step: number | null;
+    @serializable() vertical: boolean;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_SLIDER;
+
+    constructor(config: DynamicSliderModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.max = isNumber(config.max) ? config.max : 10;
+      this.min = isNumber(config.min) ? config.min : 0;
+      this.step = isNumber(config.step) ? config.step : 1;
+      this.vertical = isBoolean(config.vertical) ? config.vertical : false;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.spec.ts
new file mode 100644
index 00000000000..d86eca4b8a2
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.spec.ts
@@ -0,0 +1,35 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SWITCH,
+  DynamicSwitchModel,
+} from './dynamic-switch.model';
+
+describe('DynamicSwitchModel test suite', () => {
+  let model: DynamicSwitchModel;
+  const config = {
+    id: 'switch',
+  };
+
+  beforeEach(() => model = new DynamicSwitchModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.labelPosition).toBeNull();
+    expect(model.offLabel).toBeNull();
+    expect(model.onLabel).toBeNull();
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SWITCH);
+    expect(model.value).toBe(false);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_SWITCH);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.ts
new file mode 100644
index 00000000000..21e670fe317
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/switch/dynamic-switch.model.ts
@@ -0,0 +1,27 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import {
+  DynamicCheckControlModel,
+  DynamicCheckControlModelConfig,
+} from '../dynamic-check-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_SWITCH = 'SWITCH';
+
+export interface DynamicSwitchModelConfig extends DynamicCheckControlModelConfig {
+    offLabel?: string;
+    onLabel?: string;
+}
+
+export class DynamicSwitchModel extends DynamicCheckControlModel {
+    @serializable() offLabel: string | null;
+    @serializable() onLabel: string | null;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_SWITCH;
+
+    constructor(config: DynamicSwitchModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.offLabel = config.offLabel ?? null;
+      this.onLabel = config.onLabel ?? null;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.spec.ts
new file mode 100644
index 00000000000..b72be87ae8e
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.spec.ts
@@ -0,0 +1,48 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA,
+  DYNAMIC_FORM_TEXTAREA_WRAP_SOFT,
+  DynamicTextAreaModel,
+} from './dynamic-textarea.model';
+
+
+describe('DynamicTextAreaModel test suite', () => {
+  let model: DynamicTextAreaModel;
+  const config: any = {
+    id: 'textarea',
+    validators: { required: null, minLength: 5 },
+  };
+
+  beforeEach(() => model = new DynamicTextAreaModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.cols).toBe(20);
+    expect(model.disabled).toBe(false);
+    expect(model.errorMessages).toBeNull();
+    expect(model.hasErrorMessages).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.rows).toBe(2);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA);
+    expect(model.value).toBeNull();
+    expect(model.wrap).toEqual(DYNAMIC_FORM_TEXTAREA_WRAP_SOFT);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should set disabled property correctly', () => {
+    model.disabled = true;
+
+    expect(model.disabled).toBe(true);
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.cols).toBe(model.cols);
+    expect(Object.keys(json.validators).length).toBe(Object.keys(model.validators as any).length);
+    expect(json.value).toBe(model.value);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.ts
new file mode 100644
index 00000000000..9bbc0257d8b
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/textarea/dynamic-textarea.model.ts
@@ -0,0 +1,34 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import { isNumber } from '../../utils/core.utils';
+import {
+  DynamicInputControlModel,
+  DynamicInputControlModelConfig,
+} from '../dynamic-input-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA = 'TEXTAREA';
+
+export const DYNAMIC_FORM_TEXTAREA_WRAP_HARD = 'hard';
+export const DYNAMIC_FORM_TEXTAREA_WRAP_SOFT = 'soft';
+
+export interface DynamicTextAreaModelConfig extends DynamicInputControlModelConfig<string> {
+    cols?: number;
+    rows?: number;
+    wrap?: string;
+}
+
+export class DynamicTextAreaModel extends DynamicInputControlModel<string> {
+    @serializable() cols: number;
+    @serializable() rows: number;
+    @serializable() wrap: string;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA;
+
+    constructor(config: DynamicTextAreaModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.cols = isNumber(config.cols) ? config.cols : 20;
+      this.rows = isNumber(config.rows) ? config.rows : 2;
+      this.wrap = config.wrap ?? DYNAMIC_FORM_TEXTAREA_WRAP_SOFT;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.spec.ts b/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.spec.ts
new file mode 100644
index 00000000000..94cbc1cab3f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.spec.ts
@@ -0,0 +1,38 @@
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER,
+  DynamicTimePickerModel,
+} from './dynamic-timepicker.model';
+
+describe('DynamicTimePickerModel test suite', () => {
+  let model: DynamicTimePickerModel;
+  const config = {
+    id: 'timepicker',
+    value: new Date(),
+  };
+
+  beforeEach(() => model = new DynamicTimePickerModel(config));
+
+  it('should initialize correctly', () => {
+    expect(model.disabled).toBe(false);
+    expect(model.hidden).toBe(false);
+    expect(model.id).toEqual(config.id);
+    expect(model.label).toBeNull();
+    expect(model.format).toBeNull();
+    expect(model.max).toBeNull();
+    expect(model.meridian).toBe(false);
+    expect(model.min).toBeNull();
+    expect(model.showSeconds).toBe(false);
+    expect(model.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER);
+    expect(model.value).toBe(config.value);
+    expect(model.disabledChanges).toBeDefined();
+    expect(model.valueChanges).toBeDefined();
+  });
+
+  it('should serialize correctly', () => {
+    const json = JSON.parse(JSON.stringify(model));
+
+    expect(json.id).toEqual(model.id);
+    expect(json.type).toEqual(DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER);
+    expect(json.value).toBe((model.value as Date).toJSON());
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.ts b/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.ts
new file mode 100644
index 00000000000..feb6275f024
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model.ts
@@ -0,0 +1,28 @@
+import { serializable } from '../../decorator/serializable.decorator';
+import { isBoolean } from '../../utils/core.utils';
+import {
+  DynamicDateControlModel,
+  DynamicDateControlModelConfig,
+} from '../dynamic-date-control.model';
+import { DynamicFormControlLayout } from '../misc/dynamic-form-control-layout.model';
+
+export const DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER = 'TIMEPICKER';
+
+export interface DynamicTimePickerModelConfig extends DynamicDateControlModelConfig {
+    meridian?: boolean;
+    showSeconds?: boolean;
+}
+
+export class DynamicTimePickerModel extends DynamicDateControlModel {
+    @serializable() meridian: boolean;
+    @serializable() showSeconds: boolean;
+
+    @serializable() readonly type: string = DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER;
+
+    constructor(config: DynamicTimePickerModelConfig, layout?: DynamicFormControlLayout) {
+      super(config, layout);
+
+      this.meridian = isBoolean(config.meridian) ? config.meridian : false;
+      this.showSeconds = isBoolean(config.showSeconds) ? config.showSeconds : false;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.spec.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.spec.ts
new file mode 100644
index 00000000000..b69baaea0d2
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.spec.ts
@@ -0,0 +1,118 @@
+import {
+  ChangeDetectorRef,
+  ComponentRef,
+  ElementRef,
+  Injector,
+  Type,
+  ViewRef,
+} from '@angular/core';
+import {
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicInputModel } from '../model/input/dynamic-input.model';
+import { DynamicFormComponentService } from './dynamic-form-component.service';
+
+
+export class TestComponentRef extends ComponentRef<any> {
+  readonly changeDetectorRef!: ChangeDetectorRef;
+  readonly componentType!: Type<any>;
+  readonly hostView!: ViewRef;
+  readonly injector!: Injector;
+  readonly instance!: any;
+  readonly location!: ElementRef;
+
+  destroy(): void {
+  }
+
+  onDestroy(): void {
+  }
+
+  setInput(name: string, value: unknown) {
+  }
+
+  constructor() {
+    super();
+  }
+}
+
+describe('DynamicFormInstanceService test suite', () => {
+  let service: DynamicFormComponentService;
+  let model: DynamicFormControlModel;
+  let componentRef: TestComponentRef;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      providers: [DynamicFormComponentService],
+    });
+
+    model = new DynamicInputModel({ id: 'test' });
+    componentRef = new TestComponentRef();
+  });
+
+  beforeEach(inject([DynamicFormComponentService],
+    (componentService: DynamicFormComponentService) => service = componentService));
+
+  it('should return undefined when nothing is registered', () => {
+    expect(service.getFormControlRef(model.id)).toBeUndefined();
+  });
+
+  it('should return a component reference when registered', () => {
+    service.registerFormControl(model, componentRef);
+
+    expect(service.getFormControlRef(model.id)).toBe(componentRef);
+  });
+
+  it('should return undefined when index is invalid', () => {
+    service.registerFormControl(model, componentRef);
+
+    expect(service.getFormControlRef(model.id, 0)).toBeUndefined();
+  });
+
+  it('should return a component reference when index is valid', () => {
+    service.registerFormControl(model, componentRef, 0);
+
+    expect(service.getFormControlRef(model.id, 0)).toBe(componentRef);
+  });
+
+  it('should still have this reference at the given index, when deleting the first one', () => {
+    service.registerFormControl(model, componentRef, 0);
+    service.registerFormControl(model, componentRef, 1);
+    service.unregisterFormControl(model.id, 0);
+
+    expect(service.getFormControlRef(model.id, 0)).toBeDefined();
+  });
+
+  it('should no more have this reference at the given index, when deleting the first one two times', () => {
+    service.registerFormControl(model, componentRef, 0);
+    service.registerFormControl(model, componentRef, 1);
+    service.unregisterFormControl(model.id, 0);
+    service.unregisterFormControl(model.id, 0);
+
+    expect(service.getFormControlRef(model.id, 0)).toBeUndefined();
+  });
+
+  it('should warn when a model is registered with index for a non-array form control', () => {
+    spyOn(console, 'warn');
+
+    service.registerFormControl(model, componentRef);
+    service.registerFormControl(model, componentRef, 1);
+
+    expect(console.warn).toHaveBeenCalledWith(`registerFormControlRef is called with index for a non-array form control: ${model.id}`);
+  });
+
+  it('should unregister a component ref', () => {
+    service.registerFormControl(model, componentRef);
+    service.unregisterFormControl(model.id);
+
+    expect(service.getFormControlRef(model.id)).toBeUndefined();
+  });
+
+  it('should return a custom form control component type', () => {
+    const inputModel = new DynamicInputModel({ id: 'input' });
+
+    expect(service.getCustomComponentType(inputModel)).toBe(null);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.ts
new file mode 100644
index 00000000000..879cdcab40b
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-component.service.ts
@@ -0,0 +1,193 @@
+import {
+  ComponentRef,
+  EventEmitter,
+  Inject,
+  Injectable,
+  InjectionToken,
+  Optional,
+  QueryList,
+  Type,
+  ViewContainerRef,
+} from '@angular/core';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import {
+  DynamicFormControlCustomEvent,
+  DynamicFormControlEvent,
+} from '../component/dynamic-form-control-event';
+import { DynamicFormControl } from '../component/dynamic-form-control-interface';
+import { DynamicTemplateDirective } from '../directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormArrayGroupModel } from '../model/form-array/dynamic-form-array.model';
+import {
+  DynamicFormControlLayoutContext,
+  DynamicFormControlLayoutPlace,
+} from '../model/misc/dynamic-form-control-layout.model';
+import {
+  isFunction,
+  isNumber,
+} from '../utils/core.utils';
+import { DynamicFormLayout } from './dynamic-form-layout.service';
+
+export type DynamicFormControlRef = ComponentRef<DynamicFormControl>;
+export type DynamicFormControlMapFn = (model: DynamicFormControlModel) => Type<DynamicFormControl> | null;
+
+export const DYNAMIC_FORM_CONTROL_MAP_FN = new InjectionToken<DynamicFormControlMapFn>('DYNAMIC_FORM_CONTROL_MAP_FN');
+
+export interface IDynamicFormControlContainer {
+  context: DynamicFormArrayGroupModel | null;
+  control: UntypedFormControl;
+  group: UntypedFormGroup;
+  layout?: DynamicFormLayout;
+  model: DynamicFormControlModel;
+
+  contentTemplateList?: QueryList<DynamicTemplateDirective>;
+  inputTemplateList?: QueryList<DynamicTemplateDirective>;
+  templates?: QueryList<DynamicTemplateDirective>;
+  startTemplate?: DynamicTemplateDirective;
+  endTemplate?: DynamicTemplateDirective;
+
+  blur: EventEmitter<DynamicFormControlEvent>;
+  change: EventEmitter<DynamicFormControlEvent>;
+  focus: EventEmitter<DynamicFormControlEvent>;
+  customEvent?: EventEmitter<DynamicFormControlEvent>;
+
+  componentViewContainerRef: ViewContainerRef;
+
+  readonly id: string;
+  readonly hasFocus: boolean;
+  readonly isInvalid: boolean;
+  readonly isValid: boolean;
+  readonly errorMessages: string[];
+  readonly showErrorMessages: boolean;
+  readonly hasLabel: boolean;
+  readonly hasHint: boolean;
+  readonly hint: string | null;
+  readonly isCheckbox: boolean;
+
+  markForCheck(): void;
+  getClass(context: DynamicFormControlLayoutContext, place: DynamicFormControlLayoutPlace): string;
+
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+  onChange($event: Event | DynamicFormControlEvent | any): void;
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+  onBlur($event: FocusEvent | DynamicFormControlEvent | any): void;
+  // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
+  onFocus($event: FocusEvent | DynamicFormControlEvent | any): void;
+  onCustomEvent($event: DynamicFormControlEvent | DynamicFormControlCustomEvent): void;
+
+  onControlValueChanges(value: any): void;
+  onModelValueUpdates(value: any): void;
+  onModelDisabledUpdates(disabled: boolean): void;
+
+  onLayoutOrModelChange(): void;
+  onModelChange(): void;
+  onGroupOrModelChange(): void;
+
+  unsubscribe(): void;
+
+  readonly componentType?: Type<DynamicFormControl> | null;
+}
+
+interface IDynamicFormComponent {
+  // Core form properties
+  group: UntypedFormGroup;
+  model: any; // DynamicFormModel
+  layout?: DynamicFormLayout;
+
+  // Child components & templates
+  components: QueryList<IDynamicFormControlContainer>;
+  templates: QueryList<DynamicTemplateDirective>;
+
+  // Events
+  blur?: EventEmitter<DynamicFormControlEvent>;
+  change?: EventEmitter<DynamicFormControlEvent>;
+  focus?: EventEmitter<DynamicFormControlEvent>;
+
+  // Methods
+  trackByFn(_index: number, model: DynamicFormControlModel): string;
+
+  markForCheck(): void;
+  detectChanges(): void;
+
+  onBlur($event: DynamicFormControlEvent): void;
+  onChange($event: DynamicFormControlEvent): void;
+  onFocus($event: DynamicFormControlEvent): void;
+  onCustomEvent($event: DynamicFormControlEvent, customEventEmitter: EventEmitter<DynamicFormControlEvent>): void;
+}
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DynamicFormComponentService {
+  private forms: IDynamicFormComponent[] = [];
+  private formControls: { [key: string]: DynamicFormControlRef | DynamicFormControlRef[] } = {};
+  // eslint-disable-next-line @typescript-eslint/no-shadow
+  constructor(@Inject(DYNAMIC_FORM_CONTROL_MAP_FN) @Optional() private readonly DYNAMIC_FORM_CONTROL_MAP_FN: any) {
+    this.DYNAMIC_FORM_CONTROL_MAP_FN = DYNAMIC_FORM_CONTROL_MAP_FN as DynamicFormControlMapFn;
+  }
+
+  getForms(): IterableIterator<IDynamicFormComponent> {
+    return this.forms.values();
+  }
+
+  registerForm(component: IDynamicFormComponent): void {
+    this.forms.push(component);
+  }
+
+  unregisterForm(component: IDynamicFormComponent): void {
+    const indexOf = this.forms.indexOf(component);
+
+    if (indexOf !== -1) {
+      this.forms.splice(indexOf, 1);
+    }
+  }
+
+  getFormControlRef(modelId: string, index?: number): DynamicFormControlRef | undefined {
+    const ref: DynamicFormControlRef | DynamicFormControlRef[] = this.formControls[modelId];
+
+    if (isNumber(index)) {
+      return Array.isArray(ref) ? ref[index] : undefined;
+
+    } else {
+      return ref as DynamicFormControlRef;
+    }
+  }
+
+  registerFormControl(model: DynamicFormControlModel, ref: DynamicFormControlRef, index?: number): void {
+    if (isNumber(index)) { // threat model as array child
+      const arrayRef: DynamicFormControlRef[] = this.formControls[model.id] as DynamicFormControlRef[] || [];
+
+      if (Array.isArray(arrayRef)) {
+        arrayRef.splice(index, 0, ref);
+        this.formControls[model.id] = arrayRef;
+
+      } else {
+        console.warn(`registerFormControlRef is called with index for a non-array form control: ${model.id}`);
+      }
+
+    } else {
+      this.formControls[model.id] = ref;
+    }
+  }
+
+  unregisterFormControl(modelId: string, index?: number): void {
+    const componentRef = this.formControls[modelId];
+
+    if (isNumber(index)) {
+      if (Array.isArray(componentRef) && componentRef[index] !== undefined) {
+        componentRef.splice(index, 1);
+      }
+
+    } else if (componentRef !== undefined) {
+      delete this.formControls[modelId];
+    }
+  }
+
+  getCustomComponentType(model: DynamicFormControlModel): Type<DynamicFormControl> | null {
+    return isFunction(this.DYNAMIC_FORM_CONTROL_MAP_FN) ? this.DYNAMIC_FORM_CONTROL_MAP_FN(model) : null;
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.spec.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.spec.ts
new file mode 100644
index 00000000000..2af7bb6bb20
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.spec.ts
@@ -0,0 +1,85 @@
+import {
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+import { ReactiveFormsModule } from '@angular/forms';
+
+import { DynamicFormArrayModel } from '../model/form-array/dynamic-form-array.model';
+import { DynamicInputModel } from '../model/input/dynamic-input.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from './dynamic-form-layout.service';
+
+
+describe('DynamicFormLayoutService test suite', () => {
+  let service: DynamicFormLayoutService;
+  let formLayout: DynamicFormLayout;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [ReactiveFormsModule],
+      providers: [DynamicFormLayoutService],
+    });
+
+    formLayout = {
+      test1: {
+        element: {
+          label: 'element-test-class',
+          control: 'element-test-class',
+        },
+        grid: {
+          label: 'grid-test-class',
+          control: 'grid-test-class',
+        },
+      },
+      test2: {
+        element: {
+          label: 'element-test-class',
+          control: 'element-test-class',
+        },
+      },
+      test3: {
+        grid: {
+          label: 'grid-test-class',
+          control: 'grid-test-class',
+        },
+      },
+    };
+  });
+
+  beforeEach(inject([DynamicFormLayoutService],
+    (layoutService: DynamicFormLayoutService) => service = layoutService));
+
+  it('should find a form control layout in form layout', () => {
+    expect(service.findById('test', formLayout)).toBeNull();
+    expect(service.findById('test1', formLayout)).toBe(formLayout.test1);
+    expect(service.findById('test3', formLayout)).toBe(formLayout.test3);
+    expect(service.findById('test1', null)).toBeNull();
+  });
+
+  it('should extract a CSS class string from a form control layout', () => {
+    expect(service.getClass(null, 'element', 'control')).toEqual('');
+    expect(service.getClass(formLayout.test1, 'element', 'control')).toEqual('element-test-class');
+    expect(service.getClass(formLayout.test1, 'element', 'container')).toEqual('');
+    expect(service.getClass(formLayout.test2, 'grid', 'control')).toEqual('');
+    expect(service.getClass(formLayout.test3, 'grid', 'control')).toEqual('grid-test-class');
+  });
+
+  it('should return a unique element id', () => {
+    const testModel1 = new DynamicInputModel({ id: 'input' });
+    const testModel2 = new DynamicFormArrayModel({
+      id: 'formArray',
+      groupFactory: () => {
+        return [new DynamicInputModel({ id: 'formArrayInput' })];
+      },
+    });
+    const testModel3 = testModel2.get(0);
+    const testModel4 = testModel3.get(0);
+
+    testModel4.parent = testModel3;
+
+    expect(service.getElementId(testModel1)).toBe(testModel1.id);
+    expect(service.getElementId(testModel4)).toBe(`${testModel2.id}-${testModel3.index}-${testModel4.id}`);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.ts
new file mode 100644
index 00000000000..cfd5f85e774
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-layout.service.ts
@@ -0,0 +1,140 @@
+import {
+  Injectable,
+  QueryList,
+} from '@angular/core';
+
+import {
+  DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT,
+  DynamicTemplateDirective,
+} from '../directive/dynamic-template.directive';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormArrayGroupModel } from '../model/form-array/dynamic-form-array.model';
+import {
+  DynamicFormControlLayout,
+  DynamicFormControlLayoutConfig,
+  DynamicFormControlLayoutContext,
+  DynamicFormControlLayoutPlace,
+} from '../model/misc/dynamic-form-control-layout.model';
+import {
+  isObject,
+  isString,
+} from '../utils/core.utils';
+
+export interface DynamicFormLayout { [id: string]: DynamicFormControlLayout }
+
+export type DynamicFormControlTemplates = QueryList<DynamicTemplateDirective> | DynamicTemplateDirective[] | undefined;
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DynamicFormLayoutService {
+
+  findById(id: string, formLayout: DynamicFormLayout | null): DynamicFormControlLayout | null {
+    if (isObject(formLayout)) {
+      for (const key of Object.keys(formLayout)) {
+        if (key === id) {
+          return formLayout[key];
+        }
+      }
+    }
+
+    return null;
+  }
+
+  findByModel(model: DynamicFormControlModel, formLayout: DynamicFormLayout | null | undefined): DynamicFormControlLayout | null {
+    let controlLayout: DynamicFormControlLayout | null = null;
+
+    if (isObject(formLayout)) {
+      for (const key of Object.keys(formLayout)) {
+        key.split(',').forEach(substring => {
+          const selector = substring.trim();
+
+          if (selector === model.id || selector === model.type) {
+            controlLayout = formLayout[key];
+          }
+        });
+      }
+    }
+
+    return controlLayout;
+  }
+
+  filterTemplatesByModel(model: DynamicFormControlModel, templates: DynamicFormControlTemplates): DynamicTemplateDirective[] {
+    const filterCallback: (template: DynamicTemplateDirective) => boolean = (template: DynamicTemplateDirective) => {
+      return template.modelId === model.id || template.modelType === model.type;
+    };
+
+    if (templates instanceof QueryList) {
+      return templates.filter(filterCallback);
+
+    } else if (Array.isArray(templates)) {
+      return templates.filter(filterCallback);
+    }
+
+    return [];
+  }
+
+  getAlignedTemplate(model: DynamicFormControlModel, templates: DynamicFormControlTemplates,
+    alignment: DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT): DynamicTemplateDirective | undefined {
+
+    return this.filterTemplatesByModel(model, templates)
+      .find(template => template.as === null && template.align === alignment);
+  }
+
+  /*
+    getIndexedTemplates(model: DynamicFormControlModel, templates: DynamicFormControlTemplates): DynamicTemplateDirective[] | undefined {
+        return this.filterTemplatesByModel(model, templates).filter(template => template.as === null);
+    }
+    */
+  getStartTemplate(model: DynamicFormControlModel, templates: DynamicFormControlTemplates): DynamicTemplateDirective | undefined {
+    return this.getAlignedTemplate(model, templates, DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.Start);
+  }
+
+  getEndTemplate(model: DynamicFormControlModel, templates: DynamicFormControlTemplates): DynamicTemplateDirective | undefined {
+    return this.getAlignedTemplate(model, templates, DYNAMIC_TEMPLATE_DIRECTIVE_ALIGNMENT.End);
+  }
+
+  getClass(layout: DynamicFormControlLayout | null | undefined, context: DynamicFormControlLayoutContext,
+    place: DynamicFormControlLayoutPlace): string {
+
+    if (isObject(layout) && layout.hasOwnProperty(context)) {
+      const config = layout[context] as DynamicFormControlLayoutConfig;
+      if (config.hasOwnProperty(place)) {
+        return config[place] as string;
+      }
+    }
+
+    return '';
+  }
+
+  getHostClass(layout: DynamicFormControlLayout | null | undefined): string {
+    const keys: (keyof DynamicFormControlLayout)[] = ['element', 'grid'];
+    let cls = '';
+
+    if (isObject(layout)) {
+      keys.forEach(key => {
+        if (isObject(layout[key]) && isString(layout[key]?.host)) {
+          cls = cls + ` ${layout[key]?.host}`;
+        }
+      });
+    }
+
+    return cls;
+  }
+
+  getElementId(model: DynamicFormControlModel): string {
+    let id = model.id;
+    let parent = model.parent;
+
+    while (parent !== null) {
+      if (parent instanceof DynamicFormArrayGroupModel) {
+        id = `${parent.context.id}-${parent.index}-${model.id}`;
+        break;
+      }
+
+      parent = parent.parent;
+    }
+
+    return id;
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation-matchers.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation-matchers.ts
new file mode 100644
index 00000000000..0ab7f73222d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation-matchers.ts
@@ -0,0 +1,88 @@
+import {
+  InjectionToken,
+  Injector,
+  ValueProvider,
+} from '@angular/core';
+import { UntypedFormControl } from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicValidatorsConfig } from '../model/misc/dynamic-form-control-validation.model';
+import { isObject } from '../utils/core.utils';
+import { DynamicFormService } from './dynamic-form.service';
+import { DynamicFormValidationService } from './dynamic-form-validation.service';
+
+export const MATCH_DISABLED = 'DISABLED';
+export const MATCH_ENABLED = 'ENABLED';
+export const MATCH_HIDDEN = 'HIDDEN';
+export const MATCH_OPTIONAL = 'OPTIONAL';
+export const MATCH_REQUIRED = 'REQUIRED';
+export const MATCH_VISIBLE = 'VISIBLE';
+
+export const AND_OPERATOR = 'AND';
+export const OR_OPERATOR = 'OR';
+
+export interface DynamicFormControlMatcher {
+    match: string;
+    opposingMatch: string | null;
+
+    onChange(hasMatch: boolean, model: DynamicFormControlModel, control: UntypedFormControl, injector: Injector): void;
+}
+
+export const DYNAMIC_MATCHERS = new InjectionToken<DynamicFormControlMatcher>('DYNAMIC_MATCHERS');
+
+export const DISABLED_MATCHER: DynamicFormControlMatcher = {
+  match: MATCH_DISABLED,
+  opposingMatch: MATCH_ENABLED,
+  onChange(hasMatch, model) {
+    model.disabled = hasMatch;
+  },
+};
+
+export const HIDDEN_MATCHER: DynamicFormControlMatcher = {
+  match: MATCH_HIDDEN,
+  opposingMatch: MATCH_VISIBLE,
+  onChange(hasMatch, model) {
+    model.hidden = hasMatch;
+  },
+};
+
+export const REQUIRED_MATCHER: DynamicFormControlMatcher = {
+  match: MATCH_REQUIRED,
+  opposingMatch: MATCH_OPTIONAL,
+  onChange(hasMatch, model, control, injector) {
+    let validatorsConfig = null;
+
+    if (hasMatch) {
+      validatorsConfig = isObject(model.validators) ? { ...model.validators, required: null } : { required: null };
+
+    } else {
+      if (isObject(model.validators)) {
+        delete (model.validators as Pick<DynamicValidatorsConfig, 'required'>).required;
+        validatorsConfig = { ...model.validators };
+      }
+    }
+
+    injector.get(DynamicFormValidationService).updateValidators(validatorsConfig, control, model);
+    injector.get(DynamicFormService).detectChanges();
+  },
+};
+
+export const DISABLED_MATCHER_PROVIDER: ValueProvider = {
+  provide: DYNAMIC_MATCHERS,
+  useValue: DISABLED_MATCHER,
+  multi: true,
+};
+
+export const HIDDEN_MATCHER_PROVIDER: ValueProvider = {
+  provide: DYNAMIC_MATCHERS,
+  useValue: HIDDEN_MATCHER,
+  multi: true,
+};
+
+export const REQUIRED_MATCHER_PROVIDER: ValueProvider = {
+  provide: DYNAMIC_MATCHERS,
+  useValue: REQUIRED_MATCHER,
+  multi: true,
+};
+
+export const DYNAMIC_MATCHER_PROVIDERS = [DISABLED_MATCHER_PROVIDER, HIDDEN_MATCHER_PROVIDER, REQUIRED_MATCHER_PROVIDER];
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.spec.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.spec.ts
new file mode 100644
index 00000000000..884814fb35c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.spec.ts
@@ -0,0 +1,178 @@
+import {
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import { DynamicRadioGroupModel } from '../model/radio/dynamic-radio-group.model';
+import { DynamicSelectModel } from '../model/select/dynamic-select.model';
+import { DynamicTextAreaModel } from '../model/textarea/dynamic-textarea.model';
+import { DynamicFormService } from './dynamic-form.service';
+import { DynamicFormRelationService } from './dynamic-form-relation.service';
+import {
+  AND_OPERATOR,
+  DISABLED_MATCHER,
+  DISABLED_MATCHER_PROVIDER,
+  HIDDEN_MATCHER_PROVIDER,
+  MATCH_DISABLED,
+  MATCH_ENABLED,
+  MATCH_REQUIRED,
+  OR_OPERATOR,
+  REQUIRED_MATCHER,
+  REQUIRED_MATCHER_PROVIDER,
+} from './dynamic-form-relation-matchers';
+
+
+describe('DynamicFormRelationService test suite', () => {
+  let service: DynamicFormRelationService;
+  let group: UntypedFormGroup;
+
+  const model: DynamicTextAreaModel = new DynamicTextAreaModel({ id: 'testTextArea' });
+  const relDisabledOr23 = {
+    match: MATCH_DISABLED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-2' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relEnabledAnd32 = {
+    match: MATCH_ENABLED,
+    operator: AND_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-3' },
+      { id: 'testRadioGroup', value: 'option-2' },
+    ],
+  };
+  const relDisabledAnd23 = {
+    match: MATCH_DISABLED,
+    operator: AND_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-2' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relEnabledOr12 = {
+    match: MATCH_ENABLED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-1' },
+      { id: 'testRadioGroup', value: 'option-2' },
+    ],
+  };
+  const relDisabledOr13 = {
+    match: MATCH_DISABLED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-1' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relRequiredOr23 = {
+    match: MATCH_REQUIRED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-2' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relRequiredAnd23 = {
+    match: MATCH_REQUIRED,
+    operator: AND_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-2' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relRequiredOr13 = {
+    match: MATCH_REQUIRED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-1' },
+      { id: 'testRadioGroup', value: 'option-3' },
+    ],
+  };
+  const relDisabledOr32 = {
+    match: MATCH_DISABLED,
+    operator: OR_OPERATOR,
+    when: [
+      { id: 'testSelect', value: 'option-3' },
+      { id: 'testRadioGroup', value: 'option-2' },
+    ],
+  };
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [ReactiveFormsModule],
+      providers: [DynamicFormRelationService, DISABLED_MATCHER_PROVIDER, HIDDEN_MATCHER_PROVIDER, REQUIRED_MATCHER_PROVIDER],
+    });
+  });
+
+  beforeEach(inject([DynamicFormRelationService, DynamicFormService],
+    (relationService: DynamicFormRelationService, formService: DynamicFormService) => {
+      service = relationService;
+      group = formService.createFormGroup([
+        new DynamicSelectModel({
+          id: 'testSelect',
+          options: [{ value: 'option-1' }, { value: 'option-2' }, { value: 'option-3' }],
+          value: 'option-1',
+        }),
+        new DynamicRadioGroupModel({
+          id: 'testRadioGroup',
+          options: [{ value: 'option-1' }, { value: 'option-2' }, { value: 'option-3' }],
+          value: 'option-1',
+        }),
+        model,
+      ]);
+    }));
+
+  it('should find an activation relation correctly', () => {
+    model.relations = [relDisabledOr23];
+    expect(service.findRelationByMatcher(model.relations, DISABLED_MATCHER)).toBe(relDisabledOr23);
+
+    model.relations = [relEnabledAnd32];
+    expect(service.findRelationByMatcher(model.relations, DISABLED_MATCHER)).toBe(relEnabledAnd32);
+
+    model.relations = [relRequiredOr23];
+    expect(service.findRelationByMatcher(model.relations, REQUIRED_MATCHER)).toBe(relRequiredOr23);
+  });
+
+  it('should check if form control is to be disabled correctly', () => {
+    model.relations = [relDisabledOr23];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), DISABLED_MATCHER)).toBe(false);
+
+    model.relations = [relEnabledAnd32];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), DISABLED_MATCHER)).toBe(true);
+
+    model.relations = [relDisabledAnd23];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), DISABLED_MATCHER)).toBe(false);
+
+    model.relations = [relEnabledOr12];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), DISABLED_MATCHER)).toBe(false);
+
+    model.relations = [relDisabledOr13];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), DISABLED_MATCHER)).toBe(true);
+  });
+
+  it('should check if form control is to be required correctly', () => {
+    model.relations = [relRequiredOr23];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), REQUIRED_MATCHER)).toBe(false);
+
+    model.relations = [relRequiredAnd23];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), REQUIRED_MATCHER)).toBe(false);
+
+    model.relations = [relRequiredOr13];
+    expect(service.matchesCondition(model.relations[0], service.getRelatedFormControls(model, group), REQUIRED_MATCHER)).toBe(true);
+  });
+
+  it('should get all related form controls correctly', () => {
+    model.relations = [relDisabledOr32];
+
+    const relatedFormControls = service.getRelatedFormControls(model, group);
+
+    expect(Object.keys(relatedFormControls).length).toBe(relDisabledOr32.when.length);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.ts
new file mode 100644
index 00000000000..aabebffc7a6
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-relation.service.ts
@@ -0,0 +1,137 @@
+import {
+  Inject,
+  Injectable,
+  Injector,
+  Optional,
+} from '@angular/core';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import {
+  merge,
+  Subscription,
+} from 'rxjs';
+import {
+  distinctUntilChanged,
+  startWith,
+} from 'rxjs/operators';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import {
+  DynamicFormControlCondition,
+  DynamicFormControlRelation,
+} from '../model/misc/dynamic-form-control-relation.model';
+import { isString } from '../utils/core.utils';
+import {
+  AND_OPERATOR,
+  DYNAMIC_MATCHERS,
+  DynamicFormControlMatcher,
+  OR_OPERATOR,
+} from './dynamic-form-relation-matchers';
+
+export interface DynamicRelatedFormControls { [path: string]: UntypedFormControl }
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DynamicFormRelationService {
+
+  constructor(@Optional() @Inject(DYNAMIC_MATCHERS) private MATCHERS: DynamicFormControlMatcher[], private injector: Injector) {
+  }
+
+  getRelatedFormControls(model: DynamicFormControlModel, group: UntypedFormGroup): DynamicRelatedFormControls {
+    const conditionReducer = (controls: DynamicRelatedFormControls, condition: DynamicFormControlCondition) => {
+      const path = condition.rootPath ?? condition.id;
+
+      if (isString(path) && !controls.hasOwnProperty(path)) {
+        const control = condition.rootPath ? group.root.get(condition.rootPath) : group.get(condition.id!);
+        if (control instanceof UntypedFormControl) {
+          controls[path] = control;
+        } else {
+          console.warn(`No related form control with id ${condition.id} could be found`);
+        }
+      }
+
+      return controls;
+    };
+
+    const relationReducer = (controls: DynamicRelatedFormControls, relation: DynamicFormControlRelation) =>
+      relation.when.reduce(conditionReducer, controls);
+
+    return model.relations.reduce(relationReducer, {});
+  }
+
+  findRelationByMatcher(relations: DynamicFormControlRelation[],
+    matcher: DynamicFormControlMatcher): DynamicFormControlRelation | undefined {
+    return relations.find(relation => [matcher.match, matcher.opposingMatch].includes(relation.match));
+  }
+
+  matchesCondition(relation: DynamicFormControlRelation,
+    relatedFormControls: DynamicRelatedFormControls,
+    matcher: DynamicFormControlMatcher): boolean {
+    const operator = relation.operator ?? OR_OPERATOR;
+
+    return relation.when.reduce<boolean>((hasMatched, condition, index) => {
+      const path = condition.rootPath ?? condition.id;
+      let relatedFormControl;
+
+      for (const [key, control] of Object.entries(relatedFormControls)) {
+        if (key === path) {
+          relatedFormControl = control;
+          break;
+        }
+      }
+
+      if (relatedFormControl && relation.match === matcher.match) {
+        if (index > 0 && operator === AND_OPERATOR && !hasMatched) {
+          return false;
+        }
+
+        if (index > 0 && operator === OR_OPERATOR && hasMatched) {
+          return true;
+        }
+
+        return condition.value === relatedFormControl.value || condition.status === relatedFormControl.status;
+      }
+
+      if (relatedFormControl && relation.match === matcher.opposingMatch) {
+        if (index > 0 && operator === AND_OPERATOR && hasMatched) {
+          return true;
+        }
+
+        if (index > 0 && operator === OR_OPERATOR && !hasMatched) {
+          return false;
+        }
+
+        return !(condition.value === relatedFormControl.value || condition.status === relatedFormControl.status);
+      }
+
+      return false;
+
+    }, false);
+  }
+
+  subscribeRelations(model: DynamicFormControlModel, group: UntypedFormGroup, control: UntypedFormControl): Subscription[] {
+    const relatedFormControls = this.getRelatedFormControls(model, group);
+    const subscriptions: Subscription[] = [];
+
+    Object.values(relatedFormControls).forEach(relatedControl => {
+      const valueChanges = relatedControl.valueChanges.pipe(startWith(relatedControl.value), distinctUntilChanged());
+      const statusChanges = relatedControl.statusChanges.pipe(startWith(relatedControl.status), distinctUntilChanged());
+
+      subscriptions.push(merge(valueChanges, statusChanges).subscribe(() => {
+        this.MATCHERS.forEach(matcher => {
+          const relation = this.findRelationByMatcher(model.relations, matcher);
+
+          if (relation !== undefined) {
+            const hasMatch = this.matchesCondition(relation, relatedFormControls, matcher);
+            matcher.onChange(hasMatch, model, control, this.injector);
+          }
+        });
+      }));
+    });
+
+    return subscriptions;
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation-matchers.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation-matchers.ts
new file mode 100644
index 00000000000..017d3d30b67
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation-matchers.ts
@@ -0,0 +1,19 @@
+import { InjectionToken } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormHook } from '../model/misc/dynamic-form-control-validation.model';
+
+export type DynamicErrorMessagesMatcher = (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => boolean;
+
+export const DEFAULT_ERROR_STATE_MATCHER: DynamicErrorMessagesMatcher =
+    (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => {
+      return control.touched && !hasFocus;
+    };
+
+export const CHANGE_ERROR_STATE_MATCHER: DynamicErrorMessagesMatcher =
+    (control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean) => {
+      return (model.updateOn === DynamicFormHook.Change || model.updateOn === null) ? control.dirty : control.touched && !hasFocus;
+    };
+
+export const DYNAMIC_ERROR_MESSAGES_MATCHER = new InjectionToken<DynamicErrorMessagesMatcher>('DYNAMIC_ERROR_MESSAGES_MATCHER');
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.spec.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.spec.ts
new file mode 100644
index 00000000000..48fa5b6584b
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.spec.ts
@@ -0,0 +1,227 @@
+import {
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+import {
+  NG_ASYNC_VALIDATORS,
+  NG_VALIDATORS,
+  ReactiveFormsModule,
+  UntypedFormControl,
+  ValidationErrors,
+  Validators,
+} from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicInputModel } from '../model/input/dynamic-input.model';
+import { isFunction } from '../utils/core.utils';
+import { DynamicFormValidationService } from './dynamic-form-validation.service';
+import {
+  DYNAMIC_VALIDATORS,
+  Validator,
+  ValidatorFactory,
+} from './dynamic-form-validators';
+
+describe('DynamicFormValidationService test suite', () => {
+  let service: DynamicFormValidationService;
+
+  function testValidator(): ValidationErrors | null {
+    return { testValidator: { valid: true } };
+  }
+
+  function testValidatorFactory(): () => ValidationErrors | null {
+    return (): ValidationErrors | null => {
+      return { testValidatorFactory: { valid: true } };
+    };
+  }
+
+  function testAsyncValidator() {
+    return new Promise<boolean>(resolve => setTimeout(() => resolve(true), 0));
+  }
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [ReactiveFormsModule],
+      providers: [
+        DynamicFormValidationService,
+        {
+          provide: NG_VALIDATORS,
+          useValue: testValidator,
+          multi: true,
+        },
+        {
+          provide: NG_ASYNC_VALIDATORS,
+          useValue: testAsyncValidator,
+          multi: true,
+        },
+        {
+          provide: DYNAMIC_VALIDATORS,
+          useValue: new Map<string, Validator | ValidatorFactory>([
+            ['testValidatorFactory', testValidatorFactory],
+          ]),
+        },
+      ],
+    });
+  });
+
+  beforeEach(inject([DynamicFormValidationService],
+    (validationService: DynamicFormValidationService) => service = validationService));
+
+
+  it('should resolve a validator by name', () => {
+    expect(service.getValidator('required')).toBeTruthy();
+    expect(service.getValidator('testValidator')).toBeTruthy();
+    expect(service.getValidator('testValidatorFactory')).toBeTruthy();
+  });
+
+
+  it('should resolve a async validator by name correctly', () => {
+    expect(service.getAsyncValidator('testAsyncValidator')).toBeTruthy();
+  });
+
+
+  it('should resolve validators from config', () => {
+    const config: any = { required: null, maxLength: 7, minLength: 3 };
+    const validators = service.getValidators(config);
+
+    expect(validators.length === Object.keys(config).length).toBe(true);
+  });
+
+
+  it('should resolve custom validators from config', () => {
+    const config: any = { required: null, maxLength: 7, testValidator: null, testValidatorFactory: 'test' };
+    const validators = service.getValidators(config);
+
+    expect(validators.length === Object.keys(config).length).toBe(true);
+  });
+
+
+  it('should resolve custom validators from detailed config', () => {
+    const config: any = { testValidator: { name: testValidator.name, args: null } };
+    const validators = service.getValidators(config);
+
+    expect(validators.length === Object.keys(config).length).toBe(true);
+  });
+
+
+  it('should resolve custom async validators from config', () => {
+    const config: any = { testAsyncValidator: null };
+    const validators = service.getAsyncValidators(config);
+
+    expect(validators.length === Object.keys(config).length).toBe(true);
+  });
+
+
+  it('should throw when validator is not provided via NG_VALIDATORS', () => {
+    expect(() => service.getValidator('test', null))
+      .toThrow(new Error(`validator "test" is not provided via NG_VALIDATORS, NG_ASYNC_VALIDATORS or DYNAMIC_FORM_VALIDATORS`));
+  });
+
+
+  it('should update validators on control and model', () => {
+    const config: any = { testValidator: null };
+    const control: UntypedFormControl = new UntypedFormControl();
+    const model: DynamicFormControlModel = new DynamicInputModel({ id: 'input' });
+
+    expect(control.validator).toBeNull();
+    expect(model.validators).toBeNull();
+
+    service.updateValidators(config, control, model);
+
+    expect(isFunction(control.validator)).toBe(true);
+    expect((model.validators as object).hasOwnProperty('testValidator')).toBe(true);
+
+    service.updateValidators(null, control, model);
+
+    expect(control.validator).toBeNull();
+    expect(model.validators).toBeNull();
+  });
+
+
+  it('should update async validators on control and model', () => {
+    const config: any = { testAsyncValidator: null };
+    const control: UntypedFormControl = new UntypedFormControl();
+    const model: DynamicFormControlModel = new DynamicInputModel({ id: 'input' });
+
+    expect(control.asyncValidator).toBeNull();
+    expect(model.asyncValidators).toBeNull();
+
+    service.updateAsyncValidators(config, control, model);
+
+    expect(isFunction(control.asyncValidator)).toBe(true);
+    expect((model.asyncValidators as object).hasOwnProperty('testAsyncValidator')).toBe(true);
+
+    service.updateAsyncValidators(null, control, model);
+
+    expect(control.asyncValidator).toBeNull();
+    expect(model.asyncValidators).toBeNull();
+  });
+
+
+  it('should create error messages', () => {
+    const testControl: UntypedFormControl = new UntypedFormControl();
+    const testModel: DynamicFormControlModel = new DynamicInputModel({
+      id: 'testModel',
+      minLength: 5,
+      errorMessages: {
+        required: 'Field is required',
+        minLength: 'Field must contain at least {{ minLength }} characters',
+        custom1: 'Field {{ id }} has a custom error',
+        custom2: 'Field has a custom error: {{ validator.param }}',
+      },
+    });
+
+    let errorMessages;
+
+    errorMessages = service.createErrorMessages(testControl, testModel);
+    expect(errorMessages.length).toBe(0);
+
+    testControl.setErrors({ required: true, minlength: 5 });
+
+    errorMessages = service.createErrorMessages(testControl, testModel);
+    expect(errorMessages.length).toBe(2);
+    expect(errorMessages[0]).toEqual((testModel.errorMessages as any).required);
+    expect(errorMessages[1]).toEqual('Field must contain at least 5 characters');
+
+    testControl.setErrors({ custom1: true });
+
+    errorMessages = service.createErrorMessages(testControl, testModel);
+    expect(errorMessages.length).toBe(1);
+    expect(errorMessages[0]).toEqual(`Field ${testModel.id} has a custom error`);
+
+    testControl.setErrors({ custom2: { param: 42 } });
+
+    errorMessages = service.createErrorMessages(testControl, testModel);
+    expect(errorMessages.length).toBe(1);
+    expect(errorMessages[0]).toEqual('Field has a custom error: 42');
+  });
+
+
+  it('should check if error messages should be shown', () => {
+    const control: UntypedFormControl = new UntypedFormControl();
+    const model: DynamicFormControlModel = new DynamicInputModel({
+      id: 'testModel',
+      errorMessages: {
+        required: 'Field is required',
+      },
+    });
+
+    expect(service.showErrorMessages(control, model, false)).toBe(false);
+    expect(service.showErrorMessages(control, model, true)).toBe(false);
+
+    control.markAsTouched();
+    control.setValidators(Validators.required);
+    control.updateValueAndValidity();
+
+    expect(service.showErrorMessages(control, model, true)).toBe(false);
+    expect(service.showErrorMessages(control, model, false)).toBe(true);
+  });
+
+
+  it('should check form hooks', () => {
+    expect(service.isFormHook(null)).toBe(false);
+    expect(service.isFormHook('blur')).toBe(true);
+    expect(service.isFormHook('focus')).toBe(false);
+    expect(service.isFormHook('change')).toBe(true);
+    expect(service.isFormHook('submit')).toBe(true);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.ts
new file mode 100644
index 00000000000..1821a4d392f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validation.service.ts
@@ -0,0 +1,205 @@
+import {
+  Inject,
+  Injectable,
+  Optional,
+} from '@angular/core';
+import {
+  AbstractControl,
+  AsyncValidatorFn,
+  NG_ASYNC_VALIDATORS,
+  NG_VALIDATORS,
+  ValidatorFn,
+  Validators,
+} from '@angular/forms';
+
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import {
+  DynamicFormHook,
+  DynamicValidatorDescriptor,
+  DynamicValidatorsConfig,
+} from '../model/misc/dynamic-form-control-validation.model';
+import {
+  isObject,
+  isString,
+} from '../utils/core.utils';
+import {
+  DEFAULT_ERROR_STATE_MATCHER,
+  DYNAMIC_ERROR_MESSAGES_MATCHER,
+  DynamicErrorMessagesMatcher,
+} from './dynamic-form-validation-matchers';
+import {
+  DYNAMIC_VALIDATORS,
+  Validator,
+  ValidatorFactory,
+  ValidatorsToken,
+} from './dynamic-form-validators';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DynamicFormValidationService {
+
+  constructor(@Optional() @Inject(NG_VALIDATORS) private _NG_VALIDATORS: ValidatorFn[],
+                @Optional() @Inject(NG_ASYNC_VALIDATORS) private _NG_ASYNC_VALIDATORS: AsyncValidatorFn[],
+                @Optional() @Inject(DYNAMIC_VALIDATORS) private _DYNAMIC_VALIDATORS: Map<string, Validator | ValidatorFactory>,
+                @Optional() @Inject(DYNAMIC_ERROR_MESSAGES_MATCHER) private _DYNAMIC_ERROR_MESSAGES_MATCHER: DynamicErrorMessagesMatcher) {
+  }
+
+  private getValidatorFn(validatorName: string, validatorArgs: any = null,
+    validatorsToken: ValidatorsToken = this._NG_VALIDATORS): Validator | never {
+
+    let validatorFn: ValidatorFactory | Validator | undefined;
+
+    if (Validators.hasOwnProperty(validatorName)) { // Built-in Angular Validators
+      validatorFn = (Validators as any)[validatorName];
+
+    } else { // Custom Validators
+      if (this._DYNAMIC_VALIDATORS && this._DYNAMIC_VALIDATORS.has(validatorName)) {
+        validatorFn = this._DYNAMIC_VALIDATORS.get(validatorName);
+
+      } else if (validatorsToken) {
+        validatorFn = validatorsToken.find(validator => validator.name === validatorName);
+      }
+    }
+
+    if (validatorFn === undefined) { // throw when no validator could be resolved
+      throw new Error(
+        `validator "${validatorName}" is not provided via NG_VALIDATORS, NG_ASYNC_VALIDATORS or DYNAMIC_FORM_VALIDATORS`);
+    }
+
+    if (validatorArgs !== null) {
+      return (validatorFn as ValidatorFactory)(validatorArgs);
+    }
+
+    return validatorFn as Validator;
+  }
+
+  private getValidatorFns(validatorsConfig: DynamicValidatorsConfig,
+    validatorsToken: ValidatorsToken = this._NG_VALIDATORS): Validator[] {
+
+    let validatorFns: Validator[] = [];
+
+    if (isObject(validatorsConfig)) {
+
+      validatorFns = Object.keys(validatorsConfig).map(validatorConfigKey => {
+        const validatorConfigValue = (validatorsConfig as DynamicValidatorsConfig)[validatorConfigKey];
+
+        if (this.isValidatorDescriptor(validatorConfigValue)) {
+          const descriptor = validatorConfigValue as DynamicValidatorDescriptor;
+
+          return this.getValidatorFn(descriptor.name, descriptor.args, validatorsToken);
+        }
+
+        return this.getValidatorFn(validatorConfigKey, validatorConfigValue, validatorsToken);
+      });
+    }
+
+    return validatorFns;
+  }
+
+  getValidator(validatorName: string, validatorArgs: any = null): ValidatorFn {
+    return this.getValidatorFn(validatorName, validatorArgs) as ValidatorFn;
+  }
+
+  getAsyncValidator(validatorName: string, validatorArgs: any = null): AsyncValidatorFn {
+    return this.getValidatorFn(validatorName, validatorArgs, this._NG_ASYNC_VALIDATORS) as AsyncValidatorFn;
+  }
+
+  getValidators(validatorsConfig: DynamicValidatorsConfig): ValidatorFn[] {
+    return this.getValidatorFns(validatorsConfig) as ValidatorFn[];
+  }
+
+  getAsyncValidators(asyncValidatorsConfig: DynamicValidatorsConfig): AsyncValidatorFn[] {
+    return this.getValidatorFns(asyncValidatorsConfig, this._NG_ASYNC_VALIDATORS) as AsyncValidatorFn[];
+  }
+
+  updateValidators(validatorsConfig: DynamicValidatorsConfig | null, control: AbstractControl,
+    model: DynamicFormControlModel): void {
+
+    model.validators = validatorsConfig;
+
+    if (validatorsConfig === null) {
+      control.clearValidators();
+
+    } else {
+      control.setValidators(this.getValidators(validatorsConfig));
+    }
+
+    control.updateValueAndValidity();
+  }
+
+  updateAsyncValidators(asyncValidatorsConfig: DynamicValidatorsConfig | null, control: AbstractControl,
+    model: DynamicFormControlModel): void {
+
+    model.asyncValidators = asyncValidatorsConfig;
+
+    if (asyncValidatorsConfig === null) {
+      control.clearAsyncValidators();
+
+    } else {
+      control.setAsyncValidators(this.getAsyncValidators(asyncValidatorsConfig));
+    }
+
+    control.updateValueAndValidity();
+  }
+
+  showErrorMessages(control: AbstractControl, model: DynamicFormControlModel, hasFocus: boolean): boolean {
+    const precondition = control.invalid && model.hasErrorMessages;
+    const matcher = this._DYNAMIC_ERROR_MESSAGES_MATCHER ? this._DYNAMIC_ERROR_MESSAGES_MATCHER(control, model, hasFocus) :
+      DEFAULT_ERROR_STATE_MATCHER(control, model, hasFocus);
+
+    return precondition && matcher;
+  }
+
+  parseErrorMessageConfig(template: string, model: DynamicFormControlModel, error: any = null): string {
+    return template.replace(/{{\s*(.+?)\s*}}/mg, (_match: string, expression: string) => {
+      let propertySource: any = model;
+      let propertyName: string = expression;
+
+      if (expression.indexOf('validator.') >= 0 && error) {
+        propertySource = error;
+        propertyName = expression.replace('validator.', '');
+      }
+
+      return propertySource[propertyName] !== null && propertySource[propertyName] !== undefined ?
+        propertySource[propertyName] : null;
+    });
+  }
+
+  createErrorMessages(control: AbstractControl, model: DynamicFormControlModel): string[] {
+    const messages: string[] = [];
+
+    if (model.hasErrorMessages) {
+      const messagesConfig = model.errorMessages as DynamicValidatorsConfig;
+
+      Object.keys(control.errors || {}).forEach(validationErrorKey => {
+        let messageKey = validationErrorKey;
+
+        if (validationErrorKey === 'minlength' || validationErrorKey === 'maxlength') {
+          messageKey = messageKey.replace('length', 'Length');
+        }
+
+        if (messagesConfig.hasOwnProperty(messageKey)) {
+          const validationError = control.getError(validationErrorKey);
+          const messageTemplate = messagesConfig[messageKey] as string;
+
+          messages.push(this.parseErrorMessageConfig(messageTemplate, model, validationError));
+        }
+      });
+    }
+
+    return messages;
+  }
+
+  isFormHook(value: any): boolean {
+    return isString(value) && (Object.values(DynamicFormHook) as string[]).includes(value);
+  }
+
+  isValidatorDescriptor(value: any): boolean {
+    if (isObject(value)) {
+      return value.hasOwnProperty('name') && value.hasOwnProperty('args');
+    }
+
+    return false;
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validators.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validators.ts
new file mode 100644
index 00000000000..24dd45bad6f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form-validators.ts
@@ -0,0 +1,15 @@
+import { InjectionToken } from '@angular/core';
+import {
+  AsyncValidatorFn,
+  ValidatorFn,
+} from '@angular/forms';
+
+export type Validator = ValidatorFn | AsyncValidatorFn;
+
+export type ValidatorFactory = (args: any) => Validator;
+
+export type ValidatorsToken = Validator[];
+
+export type ValidatorsMap = Map<string, Validator | ValidatorFactory>;
+
+export const DYNAMIC_VALIDATORS = new InjectionToken<ValidatorsMap>('DYNAMIC_VALIDATORS');
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.spec.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.spec.ts
new file mode 100644
index 00000000000..01b6aac0894
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.spec.ts
@@ -0,0 +1,438 @@
+import {
+  inject,
+  TestBed,
+} from '@angular/core/testing';
+import {
+  NG_ASYNC_VALIDATORS,
+  NG_VALIDATORS,
+  ReactiveFormsModule,
+  UntypedFormArray,
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import { DynamicCheckboxModel } from '../model/checkbox/dynamic-checkbox.model';
+import { DynamicCheckboxGroupModel } from '../model/checkbox/dynamic-checkbox-group.model';
+import { DynamicColorPickerModel } from '../model/colorpicker/dynamic-colorpicker.model';
+import { DynamicDatePickerModel } from '../model/datepicker/dynamic-datepicker.model';
+import { DynamicDateControlModel } from '../model/dynamic-date-control.model';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormValueControlModel } from '../model/dynamic-form-value-control.model';
+import { DynamicEditorModel } from '../model/editor/dynamic-editor.model';
+import { DynamicFileUploadModel } from '../model/file-upload/dynamic-file-upload.model';
+import { DynamicFormArrayModel } from '../model/form-array/dynamic-form-array.model';
+import {
+  DynamicFormGroupModel,
+  DynamicFormModel,
+} from '../model/form-group/dynamic-form-group.model';
+import { DynamicInputModel } from '../model/input/dynamic-input.model';
+import { DynamicRadioGroupModel } from '../model/radio/dynamic-radio-group.model';
+import { DynamicRatingModel } from '../model/rating/dynamic-rating.model';
+import { DynamicSelectModel } from '../model/select/dynamic-select.model';
+import { DynamicSliderModel } from '../model/slider/dynamic-slider.model';
+import { DynamicSwitchModel } from '../model/switch/dynamic-switch.model';
+import { DynamicTextAreaModel } from '../model/textarea/dynamic-textarea.model';
+import { DynamicTimePickerModel } from '../model/timepicker/dynamic-timepicker.model';
+import { DynamicFormService } from './dynamic-form.service';
+import { DynamicFormComponentService } from './dynamic-form-component.service';
+import { DynamicFormValidationService } from './dynamic-form-validation.service';
+
+describe('DynamicFormService test suite', () => {
+  let testModel: DynamicFormModel;
+  let service: DynamicFormService;
+
+  function testValidator() {
+    return { testValidator: { valid: true } };
+  }
+
+  function testAsyncValidator() {
+    return new Promise<boolean>(resolve => setTimeout(() => resolve(true), 0));
+  }
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [ReactiveFormsModule],
+      providers: [
+        DynamicFormService,
+        DynamicFormComponentService,
+        DynamicFormValidationService,
+        { provide: NG_VALIDATORS, useValue: testValidator, multi: true },
+        { provide: NG_ASYNC_VALIDATORS, useValue: testAsyncValidator, multi: true },
+      ],
+    });
+
+    testModel = [
+      new DynamicSelectModel<string>(
+        {
+          id: 'testSelect',
+          options: [
+            { label: 'Option 1', value: 'option-1' },
+            { label: 'Option 2', value: 'option-2' },
+          ],
+          value: 'option-3',
+        },
+      ),
+      new DynamicInputModel(
+        {
+          id: 'testInput',
+          mask: '00/00/00',
+        },
+      ),
+      new DynamicCheckboxGroupModel(
+        {
+          id: 'testCheckboxGroup',
+          group: [
+            new DynamicCheckboxModel(
+              {
+                id: 'testCheckboxGroup1',
+                value: true,
+              },
+            ),
+            new DynamicCheckboxModel(
+              {
+                id: 'testCheckboxGroup2',
+                value: true,
+              },
+            ),
+          ],
+        },
+      ),
+      new DynamicRadioGroupModel<string>(
+        {
+          id: 'testRadioGroup',
+          options: [
+            { label: 'Option 1', value: 'option-1' },
+            { label: 'Option 2', value: 'option-2' },
+          ],
+          value: 'option-3',
+        },
+      ),
+      new DynamicTextAreaModel({ id: 'testTextArea' }),
+      new DynamicCheckboxModel({ id: 'testCheckbox' }),
+      new DynamicFormArrayModel(
+        {
+          id: 'testFormArray',
+          initialCount: 5,
+          groupFactory: () => {
+            return [
+              new DynamicInputModel({ id: 'testFormArrayGroupInput' }),
+              new DynamicFormArrayModel({
+                id: 'testNestedFormArray', groupFactory: () => [
+                  new DynamicInputModel({ id: 'testNestedFormArrayGroupInput' }),
+                ],
+              }),
+            ];
+          },
+        },
+      ),
+      new DynamicFormGroupModel(
+        {
+          id: 'testFormGroup',
+          group: [
+            new DynamicInputModel({ id: 'nestedTestInput' }),
+            new DynamicTextAreaModel({ id: 'nestedTestTextArea' }),
+          ],
+        },
+      ),
+      new DynamicSliderModel({ id: 'testSlider' }),
+      new DynamicSwitchModel({ id: 'testSwitch' }),
+      new DynamicDatePickerModel({ id: 'testDatepicker', value: new Date() }),
+      new DynamicFileUploadModel({ id: 'testFileUpload' }),
+      new DynamicEditorModel({ id: 'testEditor' }),
+      new DynamicTimePickerModel({ id: 'testTimePicker' }),
+      new DynamicRatingModel({ id: 'testRating' }),
+      new DynamicColorPickerModel({ id: 'testColorPicker' }),
+    ];
+  });
+
+
+  beforeEach(inject([DynamicFormService], (formService: DynamicFormService) => service = formService));
+
+
+  it('should create create a form group', () => {
+    const formGroup = service.createFormGroup(testModel);
+
+    expect(formGroup instanceof UntypedFormGroup).toBe(true);
+
+    expect(formGroup.get('testCheckbox') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testCheckboxGroup') instanceof UntypedFormGroup).toBe(true);
+    expect(formGroup.get('testDatepicker') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testFormArray') instanceof UntypedFormArray).toBe(true);
+    expect(formGroup.get('testInput') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testRadioGroup') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testSelect') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testTextArea') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testFileUpload') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testEditor') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testTimePicker') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testRating') instanceof UntypedFormControl).toBe(true);
+    expect(formGroup.get('testColorPicker') instanceof UntypedFormControl).toBe(true);
+  });
+
+
+  it('should parse dynamic form JSON', () => {
+    const json = JSON.stringify(testModel);
+    const formModel = service.fromJSON(json);
+
+    expect(Array.isArray(formModel) as boolean).toBe(true);
+
+    expect(formModel[0] instanceof DynamicSelectModel).toBe(true);
+    expect(formModel[1] instanceof DynamicInputModel).toBe(true);
+    expect(formModel[2] instanceof DynamicCheckboxGroupModel).toBe(true);
+    expect(formModel[3] instanceof DynamicRadioGroupModel).toBe(true);
+    expect(formModel[4] instanceof DynamicTextAreaModel).toBe(true);
+    expect(formModel[5] instanceof DynamicCheckboxModel).toBe(true);
+    expect(formModel[6] instanceof DynamicFormArrayModel).toBe(true);
+    expect(formModel[7] instanceof DynamicFormGroupModel).toBe(true);
+    expect(formModel[8] instanceof DynamicSliderModel).toBe(true);
+    expect(formModel[9] instanceof DynamicSwitchModel).toBe(true);
+    expect(formModel[10] instanceof DynamicDatePickerModel).toBe(true);
+    expect((formModel[10] as DynamicDateControlModel).value instanceof Date).toBe(true);
+    expect(formModel[11] instanceof DynamicFileUploadModel).toBe(true);
+    expect(formModel[12] instanceof DynamicEditorModel).toBe(true);
+    expect(formModel[13] instanceof DynamicTimePickerModel).toBe(true);
+    expect(formModel[14] instanceof DynamicRatingModel).toBe(true);
+    expect(formModel[15] instanceof DynamicColorPickerModel).toBe(true);
+  });
+
+
+  it('should throw when unknown DynamicFormControlModel id is specified in JSON', () => {
+    expect(() => service.fromJSON([{ id: 'test' }]))
+      .toThrow(new Error(`unknown form control model type defined on JSON object with id "test"`));
+  });
+
+
+  it('should find a dynamic form control model by id', () => {
+    expect(service.findById('testCheckbox', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testCheckboxGroup', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testDatepicker', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testFormArray', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testInput', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testRadioGroup', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testSelect', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testSlider', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testSwitch', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testTextArea', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testFileUpload', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testEditor', testModel) instanceof DynamicEditorModel).toBe(true);
+    expect(service.findById('testTimePicker', testModel) instanceof DynamicTimePickerModel).toBe(true);
+    expect(service.findById('testRating', testModel) instanceof DynamicRatingModel).toBe(true);
+    expect(service.findById('testColorPicker', testModel) instanceof DynamicColorPickerModel).toBe(true);
+  });
+
+
+  it('should find a nested dynamic form control model by id', () => {
+    expect(service.findById('testCheckboxGroup1', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('testCheckboxGroup2', testModel) instanceof DynamicFormControlModel).toBe(true);
+    expect(service.findById('nestedTestInput', testModel) instanceof DynamicFormControlModel).toBe(true);
+  });
+
+
+  it('should resolve array group path', () => {
+    service.createFormGroup(testModel);
+
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const nestedModel = (model.get(0).get(1) as DynamicFormArrayModel).get(0);
+
+    expect(service.getPath(model)).toEqual(['testFormArray']);
+    expect(service.getPath(nestedModel)).toEqual(['testFormArray', '0', 'testNestedFormArray', '0']);
+  });
+
+
+  it('should add a form control to an existing form group', () => {
+    const formGroup = service.createFormGroup(testModel);
+    const nestedFormGroup = formGroup.controls.testFormGroup as UntypedFormGroup;
+    const nestedFormGroupModel = testModel[7] as DynamicFormGroupModel;
+    const newModel1 = new DynamicInputModel({ id: 'newInput1' });
+    const newModel2 = new DynamicInputModel({ id: 'newInput2' });
+
+    service.addFormGroupControl(formGroup, testModel, newModel1);
+    service.addFormGroupControl(nestedFormGroup, nestedFormGroupModel, newModel2);
+
+    expect(formGroup.controls[newModel1.id]).toBeTruthy();
+    expect(testModel[testModel.length - 1] === newModel1).toBe(true);
+
+    expect((formGroup.controls.testFormGroup as UntypedFormGroup).controls[newModel2.id]).toBeTruthy();
+    expect(nestedFormGroupModel.get(nestedFormGroupModel.group.length - 1) === newModel2).toBe(true);
+  });
+
+
+  it('should insert a form control to an existing form group', () => {
+    const formGroup = service.createFormGroup(testModel);
+    const nestedFormGroup = formGroup.controls.testFormGroup as UntypedFormGroup;
+    const nestedFormGroupModel = testModel[7] as DynamicFormGroupModel;
+    const newModel1 = new DynamicInputModel({ id: 'newInput1' });
+    const newModel2 = new DynamicInputModel({ id: 'newInput2' });
+
+    service.insertFormGroupControl(4, formGroup, testModel, newModel1);
+    service.insertFormGroupControl(0, nestedFormGroup, nestedFormGroupModel, newModel2);
+
+    expect(formGroup.controls[newModel1.id]).toBeTruthy();
+    expect(testModel[4] === newModel1).toBe(true);
+    expect(service.getPath(testModel[4])).toEqual(['newInput1']);
+
+    expect((formGroup.controls.testFormGroup as UntypedFormGroup).controls[newModel2.id]).toBeTruthy();
+    expect(nestedFormGroupModel.get(0) === newModel2).toBe(true);
+    expect(service.getPath(nestedFormGroupModel.get(0))).toEqual(['testFormGroup', 'newInput2']);
+  });
+
+
+  it('should move an existing form control to a different group position', () => {
+    const formGroup = service.createFormGroup(testModel);
+    const nestedFormGroupModel = testModel[7] as DynamicFormGroupModel;
+    const model1 = testModel[0];
+    const model2 = nestedFormGroupModel.get(0);
+
+    service.moveFormGroupControl(0, 2, testModel);
+
+    expect(formGroup.controls[model1.id]).toBeTruthy();
+    expect(testModel[2] === model1).toBe(true);
+
+    service.moveFormGroupControl(0, 1, nestedFormGroupModel);
+
+    expect((formGroup.controls.testFormGroup as UntypedFormGroup).controls[model2.id]).toBeTruthy();
+    expect(nestedFormGroupModel.get(1) === model2).toBe(true);
+  });
+
+
+  it('should remove a form control from an existing form group', () => {
+    const formGroup = service.createFormGroup(testModel);
+    const nestedFormGroup = formGroup.controls.testFormGroup as UntypedFormGroup;
+    const nestedFormGroupModel = testModel[7] as DynamicFormGroupModel;
+    const length = testModel.length;
+    const size = nestedFormGroupModel.size();
+    const index = 1;
+    const id1 = testModel[index].id;
+    const id2 = nestedFormGroupModel.get(index).id;
+
+    service.removeFormGroupControl(index, formGroup, testModel);
+
+    expect(Object.keys(formGroup.controls).length).toBe(length - 1);
+    expect(formGroup.controls[id1]).toBeUndefined();
+
+    expect(testModel.length).toBe(length - 1);
+    expect(service.findById(id1, testModel)).toBeNull();
+
+    service.removeFormGroupControl(index, nestedFormGroup, nestedFormGroupModel);
+
+    expect(Object.keys(nestedFormGroup.controls).length).toBe(size - 1);
+    expect(nestedFormGroup.controls[id2]).toBeUndefined();
+
+    expect(nestedFormGroupModel.size()).toBe(size - 1);
+    expect(service.findById(id2, testModel)).toBeNull();
+  });
+
+
+  it('should create a form array', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    let formArray;
+
+    expect(service.createFormArray).toBeTruthy();
+
+    formArray = service.createFormArray(model);
+
+    expect(formArray instanceof UntypedFormArray).toBe(true);
+    expect(formArray.length).toBe(model.initialCount);
+  });
+
+
+  it('should add a form array group', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+
+    service.addFormArrayGroup(formArray, model);
+
+    expect(formArray.length).toBe(model.initialCount + 1);
+  });
+
+
+  it('should insert a form array group', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+
+    service.insertFormArrayGroup(0, formArray, model);
+
+    expect(formArray.length).toBe(model.initialCount + 1);
+  });
+
+
+  it('should move up a form array group', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+    const index = 3;
+    const step = 1;
+
+    (formArray.at(index) as UntypedFormGroup).controls.testFormArrayGroupInput.setValue('next test value 1');
+    (formArray.at(index + step) as UntypedFormGroup).controls.testFormArrayGroupInput.setValue('next test value 2');
+
+    (model.get(index).get(0) as DynamicFormValueControlModel<any>).value = 'next test value 1';
+    (model.get(index + step).get(0) as DynamicFormValueControlModel<any>).value = 'next test value 2';
+
+    service.moveFormArrayGroup(index, step, formArray, model);
+
+    expect(formArray.length).toBe(model.initialCount);
+
+    expect((formArray.at(index) as UntypedFormGroup).controls.testFormArrayGroupInput.value).toEqual('next test value 2');
+    expect((formArray.at(index + step) as UntypedFormGroup).controls.testFormArrayGroupInput.value).toEqual('next test value 1');
+
+    expect((model.get(index).get(0) as DynamicFormValueControlModel<any>).value).toEqual('next test value 2');
+    expect((model.get(index + step).get(0) as DynamicFormValueControlModel<any>).value).toEqual('next test value 1');
+  });
+
+
+  it('should move down a form array group', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+    const index = 3;
+    const step = -1;
+
+    (formArray.at(index) as UntypedFormGroup).controls.testFormArrayGroupInput.setValue('next test value 1');
+    (formArray.at(index + step) as UntypedFormGroup).controls.testFormArrayGroupInput.setValue('next test value 2');
+
+    (model.get(index).get(0) as DynamicFormValueControlModel<any>).value = 'next test value 1';
+    (model.get(index + step).get(0) as DynamicFormValueControlModel<any>).value = 'next test value 2';
+
+    service.moveFormArrayGroup(index, step, formArray, model);
+
+    expect(formArray.length).toBe(model.initialCount);
+
+    expect((formArray.at(index) as UntypedFormGroup).controls.testFormArrayGroupInput.value).toEqual('next test value 2');
+    expect((formArray.at(index + step) as UntypedFormGroup).controls.testFormArrayGroupInput.value).toEqual('next test value 1');
+
+    expect((model.get(index).get(0) as DynamicFormValueControlModel<any>).value).toEqual('next test value 2');
+    expect((model.get(index + step).get(0) as DynamicFormValueControlModel<any>).value).toEqual('next test value 1');
+  });
+
+
+  it('should throw when form array group is to be moved out of bounds', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+
+    expect(() => service.moveFormArrayGroup(2, -5, formArray, model))
+      .toThrow(new Error(`form array group cannot be moved due to index or new index being out of bounds`));
+  });
+
+
+  it('should remove a form array group', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+
+    service.removeFormArrayGroup(0, formArray, model);
+
+    const newCount = model.initialCount - 1;
+
+    expect(model.size).toBe(newCount);
+    expect(formArray.length).toBe(newCount);
+  });
+
+
+  it('should clear a form array', () => {
+    const model = service.findById('testFormArray', testModel) as DynamicFormArrayModel;
+    const formArray = service.createFormArray(model);
+
+    service.clearFormArray(formArray, model);
+
+    expect(model.size === 0).toBe(true);
+    expect(formArray.length === 0).toBe(true);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.ts b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.ts
new file mode 100644
index 00000000000..5fcaff12a7d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/service/dynamic-form.service.ts
@@ -0,0 +1,415 @@
+import { Injectable } from '@angular/core';
+import {
+  AbstractControl,
+  AbstractControlOptions,
+  UntypedFormArray,
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+
+import { DynamicFormComponent } from '../component/dynamic-form.component';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX,
+  DynamicCheckboxModel,
+} from '../model/checkbox/dynamic-checkbox.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP,
+  DynamicCheckboxGroupModel,
+} from '../model/checkbox/dynamic-checkbox-group.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER,
+  DynamicColorPickerModel,
+} from '../model/colorpicker/dynamic-colorpicker.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER,
+  DynamicDatePickerModel,
+} from '../model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlModel } from '../model/dynamic-form-control.model';
+import { DynamicFormValueControlModel } from '../model/dynamic-form-value-control.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_EDITOR,
+  DynamicEditorModel,
+} from '../model/editor/dynamic-editor.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD,
+  DynamicFileUploadModel,
+} from '../model/file-upload/dynamic-file-upload.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_ARRAY,
+  DynamicFormArrayGroupModel,
+  DynamicFormArrayModel,
+} from '../model/form-array/dynamic-form-array.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_GROUP,
+  DynamicFormGroupModel,
+  DynamicFormModel,
+  DynamicUnionFormModel,
+} from '../model/form-group/dynamic-form-group.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_INPUT,
+  DynamicInputModel,
+} from '../model/input/dynamic-input.model';
+import { DynamicPathable } from '../model/misc/dynamic-form-control-path.model';
+import {
+  DynamicFormHook,
+  DynamicValidatorsConfig,
+} from '../model/misc/dynamic-form-control-validation.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP,
+  DynamicRadioGroupModel,
+} from '../model/radio/dynamic-radio-group.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_RATING,
+  DynamicRatingModel,
+} from '../model/rating/dynamic-rating.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SELECT,
+  DynamicSelectModel,
+} from '../model/select/dynamic-select.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SLIDER,
+  DynamicSliderModel,
+} from '../model/slider/dynamic-slider.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_SWITCH,
+  DynamicSwitchModel,
+} from '../model/switch/dynamic-switch.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA,
+  DynamicTextAreaModel,
+} from '../model/textarea/dynamic-textarea.model';
+import {
+  DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER,
+  DynamicTimePickerModel,
+} from '../model/timepicker/dynamic-timepicker.model';
+import { isString } from '../utils/core.utils';
+import { parseReviver } from '../utils/json.utils';
+import { DynamicFormComponentService } from './dynamic-form-component.service';
+import { DynamicFormValidationService } from './dynamic-form-validation.service';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class DynamicFormService {
+
+  constructor(private componentService: DynamicFormComponentService, private validationService: DynamicFormValidationService) {
+  }
+
+  private createAbstractControlOptions(validatorsConfig: DynamicValidatorsConfig | null = null,
+    asyncValidatorsConfig: DynamicValidatorsConfig | null = null,
+    updateOn: DynamicFormHook | null = null): AbstractControlOptions {
+    return {
+      asyncValidators: asyncValidatorsConfig !== null ? this.validationService.getAsyncValidators(asyncValidatorsConfig) : null,
+      validators: validatorsConfig !== null ? this.validationService.getValidators(validatorsConfig) : null,
+      updateOn: updateOn !== null && this.validationService.isFormHook(updateOn) ? updateOn : DynamicFormHook.Change,
+    };
+  }
+
+  createFormArray(formArrayModel: DynamicFormArrayModel): UntypedFormArray {
+    const controls: AbstractControl[] = [];
+    const options = this.createAbstractControlOptions(formArrayModel.validators, formArrayModel.asyncValidators,
+      formArrayModel.updateOn);
+
+    for (let index = 0; index < formArrayModel.size; index++) {
+      const groupModel = formArrayModel.get(index);
+      const groupOptions = this.createAbstractControlOptions(formArrayModel.groupValidators,
+        formArrayModel.groupAsyncValidators, formArrayModel.updateOn);
+
+      controls.push(this.createFormGroup(groupModel.group, groupOptions, groupModel));
+    }
+
+    return new UntypedFormArray(controls, options);
+  }
+
+  createFormGroup(formModel: DynamicFormModel, options: AbstractControlOptions | null = null,
+    parent: DynamicPathable | null = null): UntypedFormGroup {
+    const controls: { [controlId: string]: AbstractControl; } = {};
+
+    formModel.forEach(model => {
+      model.parent = parent;
+
+      switch (model.type) {
+
+        case DYNAMIC_FORM_CONTROL_TYPE_ARRAY:
+          controls[model.id] = this.createFormArray(model as DynamicFormArrayModel);
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_GROUP:
+        case DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP: {
+          const groupModel = model as DynamicFormGroupModel;
+          const groupOptions = this.createAbstractControlOptions(groupModel.validators,
+            groupModel.asyncValidators, groupModel.updateOn);
+
+          controls[model.id] = this.createFormGroup(groupModel.group, groupOptions, groupModel);
+          break;
+        }
+
+        default: {
+          const controlModel = model as DynamicFormValueControlModel<any>;
+          const controlState = { value: controlModel.value, disabled: controlModel.disabled };
+          const controlOptions = this.createAbstractControlOptions(controlModel.validators,
+            controlModel.asyncValidators, controlModel.updateOn);
+
+          controls[model.id] = new UntypedFormControl(controlState, controlOptions);
+        }
+      }
+    });
+
+    return new UntypedFormGroup(controls, options);
+  }
+
+  getPathSegment(model: DynamicPathable): string {
+    return model instanceof DynamicFormArrayGroupModel ? model.index.toString() : (model as DynamicFormControlModel).id;
+  }
+
+  getPath(model: DynamicPathable, join: boolean = false): string[] | string {
+    const path = [this.getPathSegment(model)];
+    let parent = model.parent;
+
+    while (parent) {
+      path.unshift(this.getPathSegment(parent));
+      parent = parent.parent;
+    }
+
+    return join ? path.join('.') : path;
+  }
+
+  addFormGroupControl(formGroup: UntypedFormGroup, formModel: DynamicUnionFormModel, ...models: DynamicFormModel): void {
+    if (formModel instanceof DynamicFormGroupModel) {
+      this.insertFormGroupControl(formModel.size(), formGroup, formModel, ...models);
+
+    } else {
+      const model = formModel as DynamicFormModel;
+      this.insertFormGroupControl(model.length, formGroup, model, ...models);
+    }
+  }
+
+  moveFormGroupControl(index: number, step: number, formModel: DynamicUnionFormModel): void {
+    if (formModel instanceof DynamicFormGroupModel) {
+      formModel.move(index, step);
+
+    } else {
+      const model = formModel as DynamicFormModel;
+      model.splice(index + step, 0, ...model.splice(index, 1));
+    }
+  }
+
+  insertFormGroupControl(index: number, formGroup: UntypedFormGroup, formModel: DynamicUnionFormModel, ...models: DynamicFormModel): void {
+    const parent = formModel instanceof DynamicFormGroupModel ? formModel : null;
+    const controls = this.createFormGroup(models, null, parent).controls;
+
+    Object.keys(controls).forEach((controlName, idx) => {
+      const controlModel = models[idx];
+
+      if (formModel instanceof DynamicFormGroupModel) {
+        formModel.insert(index, controlModel);
+
+      } else {
+        (formModel as DynamicFormModel).splice(index, 0, controlModel);
+      }
+
+      formGroup.addControl(controlName, controls[controlName]);
+    });
+  }
+
+  removeFormGroupControl(index: number, formGroup: UntypedFormGroup, formModel: DynamicUnionFormModel): void {
+    if (formModel instanceof DynamicFormGroupModel) {
+      formGroup.removeControl(formModel.get(index).id);
+      formModel.remove(index);
+
+    } else {
+      formGroup.removeControl(formModel[index].id);
+      (formModel as DynamicFormModel).splice(index, 1);
+    }
+  }
+
+  addFormArrayGroup(formArray: UntypedFormArray, formArrayModel: DynamicFormArrayModel): void {
+    const groupModel = formArrayModel.addGroup();
+    formArray.push(this.createFormGroup(groupModel.group, null, groupModel));
+  }
+
+  insertFormArrayGroup(index: number, formArray: UntypedFormArray, formArrayModel: DynamicFormArrayModel): void {
+    const groupModel = formArrayModel.insertGroup(index);
+    formArray.insert(index, this.createFormGroup(groupModel.group, null, groupModel));
+  }
+
+  moveFormArrayGroup(index: number, step: number, formArray: UntypedFormArray, formArrayModel: DynamicFormArrayModel): void {
+    const newIndex = index + step;
+    const moveUp = step >= 0;
+
+    if ((index >= 0 && index < formArrayModel.size) && (newIndex >= 0 && newIndex < formArrayModel.size)) {
+      const movingGroups: AbstractControl[] = [];
+
+      for (let i = moveUp ? index : newIndex; i <= (moveUp ? newIndex : index); i++) {
+        movingGroups.push(formArray.at(i));
+      }
+
+      movingGroups.forEach((formControl, idx) => {
+        let position;
+
+        if (moveUp) {
+          position = idx === 0 ? newIndex : index + idx - 1;
+
+        } else {
+          position = idx === movingGroups.length - 1 ? newIndex : newIndex + idx + 1;
+        }
+
+        formArray.setControl(position, formControl);
+      });
+
+      formArrayModel.moveGroup(index, step);
+
+    } else {
+      throw new Error(`form array group cannot be moved due to index or new index being out of bounds`);
+    }
+  }
+
+  removeFormArrayGroup(index: number, formArray: UntypedFormArray, formArrayModel: DynamicFormArrayModel): void {
+    formArray.removeAt(index);
+    formArrayModel.removeGroup(index);
+  }
+
+  clearFormArray(formArray: UntypedFormArray, formArrayModel: DynamicFormArrayModel): void {
+    formArray.clear();
+    formArrayModel.clear();
+  }
+
+  findById(id: string, formModel: DynamicFormModel): DynamicFormControlModel | null {
+    const findByIdFn = (modelId: string, groupModel: DynamicFormModel): void => {
+      for (const controlModel of groupModel) {
+
+        if (controlModel.id === modelId) {
+          result = controlModel;
+          break;
+        }
+
+        if (controlModel instanceof DynamicFormGroupModel) {
+          findByIdFn(modelId, (controlModel as DynamicFormGroupModel).group);
+        }
+      }
+    };
+    let result = null;
+
+    findByIdFn(id, formModel);
+
+    return result;
+  }
+
+  findModelById<T extends DynamicFormControlModel>(id: string, formModel: DynamicFormModel): T | null {
+    return this.findById(id, formModel) as T;
+  }
+
+  findControlByModel<T extends AbstractControl>(model: DynamicFormControlModel, group: UntypedFormGroup): T | null {
+    return group.root.get(this.getPath(model, true)) as T;
+  }
+
+  detectChanges(formComponent?: DynamicFormComponent): void {
+    if (formComponent instanceof DynamicFormComponent) {
+      formComponent.markForCheck();
+      formComponent.detectChanges();
+
+    } else {
+      for (const form of this.componentService.getForms()) {
+        form.markForCheck();
+        form.detectChanges();
+      }
+    }
+  }
+
+  fromJSON(json: string | object[]): DynamicFormModel | never {
+    const formModelJSON = isString(json) ? JSON.parse(json, parseReviver) : json;
+    const formModel: DynamicFormModel = [];
+
+    formModelJSON.forEach((model: any) => {
+      const layout = model.layout ?? null;
+
+      switch (model.type) {
+
+        case DYNAMIC_FORM_CONTROL_TYPE_ARRAY: {
+          const formArrayModel = model as DynamicFormArrayModel;
+
+          if (Array.isArray(formArrayModel.groups)) {
+            formArrayModel.groups.forEach((groupModel: DynamicFormArrayGroupModel) => {
+              groupModel.group = this.fromJSON(groupModel.group) as DynamicFormModel;
+            });
+          }
+
+          formArrayModel.groupFactory = () => this.fromJSON(formArrayModel.groupPrototype);
+
+          formModel.push(new DynamicFormArrayModel(model, layout));
+          break;
+        }
+
+
+        case DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX:
+          formModel.push(new DynamicCheckboxModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_CHECKBOX_GROUP:
+          model.group = this.fromJSON(model.group) as DynamicCheckboxModel[];
+          formModel.push(new DynamicCheckboxGroupModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_COLORPICKER:
+          formModel.push(new DynamicColorPickerModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_DATEPICKER:
+          formModel.push(new DynamicDatePickerModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_EDITOR:
+          formModel.push(new DynamicEditorModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_FILE_UPLOAD:
+          model.value = null;
+          formModel.push(new DynamicFileUploadModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_GROUP:
+          model.group = this.fromJSON(model.group);
+          formModel.push(new DynamicFormGroupModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_INPUT:
+          formModel.push(new DynamicInputModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_RADIO_GROUP:
+          formModel.push(new DynamicRadioGroupModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_RATING:
+          formModel.push(new DynamicRatingModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_SELECT:
+          formModel.push(new DynamicSelectModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_SLIDER:
+          formModel.push(new DynamicSliderModel(model, layout));
+          break;
+
+
+        case DYNAMIC_FORM_CONTROL_TYPE_SWITCH:
+          formModel.push(new DynamicSwitchModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_TEXTAREA:
+          formModel.push(new DynamicTextAreaModel(model, layout));
+          break;
+
+        case DYNAMIC_FORM_CONTROL_TYPE_TIMEPICKER:
+          formModel.push(new DynamicTimePickerModel(model, layout));
+          break;
+
+        default:
+          throw new Error(`unknown form control model type defined on JSON object with id "${model.id}"`);
+      }
+    });
+
+    return formModel;
+  }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.spec.ts b/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.spec.ts
new file mode 100644
index 00000000000..603998a605c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.spec.ts
@@ -0,0 +1,87 @@
+import {
+  isAddressToken,
+  isContactField,
+  isContactToken,
+  isField,
+  isSectionToken,
+  validate,
+} from './autofill.utils';
+
+describe('Autofill utils test suite', () => {
+
+  it('should validate autofill expressions correctly', () => {
+
+    let value1 = 'section-test shipping mobile tel',
+      value2 = 'billing section-test mobile tel',
+      value3 = 'section-test shipping tel',
+      value4 = 'section-test work given-name',
+      value5 = 'billing cc-name',
+      value6 = 'home email',
+      value7 = 'section-test shipping work',
+      value8 = 'section-test work shipping tel',
+      value9 = 'billing country',
+      value10 = 'billing country name',
+      value11 = 'billing shipping name',
+      value12 = 'section-test1 section-test2 shipping name',
+      value13 = 'section-test1 blabla name',
+      value14 = 'section-test1 blabla mobile tel';
+
+    expect(validate(value1)).toBe(true);
+    expect(validate(value2)).toBe(false);
+    expect(validate(value3)).toBe(false);
+    expect(validate(value4)).toBe(false);
+    expect(validate(value5)).toBe(true);
+    expect(validate(value6)).toBe(true);
+    expect(validate(value7)).toBe(false);
+    expect(validate(value8)).toBe(false);
+    expect(validate(value9)).toBe(true);
+    expect(validate(value10)).toBe(false);
+    expect(validate(value11)).toBe(false);
+    expect(validate(value12)).toBe(false);
+    expect(validate(value13)).toBe(false);
+    expect(validate(value14)).toBe(false);
+  });
+
+  it('should validate address tokens correctly', () => {
+
+    expect(isAddressToken('shipping')).toBe(true);
+    expect(isAddressToken('billing')).toBe(true);
+    expect(isAddressToken('home')).toBe(false);
+  });
+
+  it('should validate contact tokens correctly', () => {
+
+    expect(isContactToken('home')).toBe(true);
+    expect(isContactToken('work')).toBe(true);
+    expect(isContactToken('mobile')).toBe(true);
+    expect(isContactToken('fax')).toBe(true);
+    expect(isContactToken('pager')).toBe(true);
+    expect(isContactToken('billing')).toBe(false);
+  });
+
+  it('should validate section tokens correctly', () => {
+
+    expect(isSectionToken('section-test')).toBe(true);
+    expect(isSectionToken('section')).toBe(false);
+  });
+
+  it('should validate contact fields correctly', () => {
+
+    expect(isContactField('tel')).toBe(true);
+    expect(isContactField('email')).toBe(true);
+    expect(isContactField('impp')).toBe(true);
+    expect(isContactField('name')).toBe(false);
+    expect(isContactField('country')).toBe(false);
+  });
+
+  it('should validate fields correctly', () => {
+
+    expect(isField('street-address')).toBe(true);
+    expect(isField('nickname')).toBe(true);
+    expect(isField('organization')).toBe(true);
+    expect(isField('postal-code')).toBe(true);
+    expect(isField('country')).toBe(true);
+    expect(isField('tel')).toBe(false);
+    expect(isField('email')).toBe(false);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.ts b/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.ts
new file mode 100644
index 00000000000..0598c6b4823
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/autofill.utils.ts
@@ -0,0 +1,136 @@
+export const AUTOCOMPLETE_OFF = 'off';
+export const AUTOCOMPLETE_ON = 'on';
+
+export const AUTOFILL_TOKEN_BILLING = 'billing';
+export const AUTOFILL_TOKEN_SHIPPING = 'shipping';
+
+export const AUTOFILL_TOKENS_ADDRESS = [AUTOFILL_TOKEN_BILLING, AUTOFILL_TOKEN_SHIPPING];
+
+export const AUTOFILL_TOKEN_HOME = 'home';
+export const AUTOFILL_TOKEN_WORK = 'work';
+export const AUTOFILL_TOKEN_MOBILE = 'mobile';
+export const AUTOFILL_TOKEN_FAX = 'fax';
+export const AUTOFILL_TOKEN_PAGER = 'pager';
+
+export const AUTOFILL_TOKENS_CONTACT = [
+  AUTOFILL_TOKEN_FAX, AUTOFILL_TOKEN_HOME, AUTOFILL_TOKEN_MOBILE, AUTOFILL_TOKEN_PAGER, AUTOFILL_TOKEN_WORK,
+];
+
+export const AUTOFILL_FIELD_STREET_ADDRESS = 'street-address';
+export const AUTOFILL_FIELD_ADDRESS_LINE_1 = 'address-line1';
+export const AUTOFILL_FIELD_ADDRESS_LINE_2 = 'address-line2';
+export const AUTOFILL_FIELD_ADDRESS_LINE_3 = 'address-line3';
+export const AUTOFILL_FIELD_ADDRESS_LEVEL_4 = 'address-level4';
+export const AUTOFILL_FIELD_ADDRESS_LEVEL_3 = 'address-level3';
+export const AUTOFILL_FIELD_ADDRESS_LEVEL_2 = 'address-level2';
+export const AUTOFILL_FIELD_ADDRESS_LEVEL_1 = 'address-level1';
+
+export const AUTOFILL_FIELD_NAME = 'name';
+export const AUTOFILL_FIELD_HONORIFIC_PREFIX = 'honorific-prefix';
+export const AUTOFILL_FIELD_GIVEN_NAME = 'given-name';
+export const AUTOFILL_FIELD_ADDITIONAL_NAME = 'additional-name';
+export const AUTOFILL_FIELD_FAMILY_NAME = 'family-name';
+export const AUTOFILL_FIELD_HONORIFIC_SUFFIX = 'honorific-suffix';
+export const AUTOFILL_FIELD_NICKNAME = 'nickname';
+export const AUTOFILL_FIELD_USERNAME = 'username';
+
+export const AUTOFILL_FIELD_NEW_PASSWORD = 'new-password';
+export const AUTOFILL_FIELD_CURRENT_PASSWORD = 'current-password';
+
+export const AUTOFILL_FIELD_ORGANIZATION_TITLE = 'organization-title';
+export const AUTOFILL_FIELD_ORGANIZATION = 'organization';
+
+export const AUTOFILL_FIELD_COUNTRY = 'country';
+export const AUTOFILL_FIELD_COUNTRY_NAME = 'country-name';
+export const AUTOFILL_FIELD_POSTAL_CODE = 'postal-code';
+
+export const AUTOFILL_FIELD_CC_NAME = 'cc-name';
+export const AUTOFILL_FIELD_CC_GIVEN_NAME = 'cc-given-name';
+export const AUTOFILL_FIELD_CC_ADDITIONAL_NAME = 'cc-additional-name';
+export const AUTOFILL_FIELD_CC_FAMILY_NAME = 'cc-family-name';
+export const AUTOFILL_FIELD_CC_NUMBER = 'cc-number';
+export const AUTOFILL_FIELD_CC_EXP = 'cc-exp';
+export const AUTOFILL_FIELD_CC_EXP_MONTH = 'cc-exp-month';
+export const AUTOFILL_FIELD_CC_EXP_YEAR = 'cc-exp-year';
+export const AUTOFILL_FIELD_CC_CSC = 'cc-csc';
+export const AUTOFILL_FIELD_CC_TYPE = 'cc-type';
+
+export const AUTOFILL_FIELD_TRANSACTION_CURRENCY = 'transaction-currency';
+export const AUTOFILL_FIELD_TRANSACTION_AMOUNT = 'transaction-amount';
+
+export const AUTOFILL_FIELD_LANGUAGE = 'language';
+
+export const AUTOFILL_FIELD_BDAY = 'bday';
+export const AUTOFILL_FIELD_BDAY_DAY = 'bday-day';
+export const AUTOFILL_FIELD_BDAY_MONTH = 'bday-month';
+export const AUTOFILL_FIELD_BDAY_YEAR = 'bday-year';
+
+export const AUTOFILL_FIELD_SEX = 'sex';
+
+export const AUTOFILL_FIELD_URL = 'url';
+
+export const AUTOFILL_FIELD_PHOTO = 'photo';
+
+export const AUTOFILL_FIELDS = [
+  AUTOFILL_FIELD_STREET_ADDRESS, AUTOFILL_FIELD_ADDRESS_LINE_1, AUTOFILL_FIELD_ADDRESS_LINE_2,
+  AUTOFILL_FIELD_ADDRESS_LINE_3, AUTOFILL_FIELD_ADDRESS_LEVEL_4, AUTOFILL_FIELD_ADDRESS_LEVEL_3,
+  AUTOFILL_FIELD_ADDRESS_LEVEL_2, AUTOFILL_FIELD_ADDRESS_LEVEL_1, AUTOFILL_FIELD_NAME,
+  AUTOFILL_FIELD_HONORIFIC_PREFIX, AUTOFILL_FIELD_GIVEN_NAME, AUTOFILL_FIELD_ADDITIONAL_NAME,
+  AUTOFILL_FIELD_FAMILY_NAME, AUTOFILL_FIELD_HONORIFIC_SUFFIX, AUTOFILL_FIELD_NICKNAME, AUTOFILL_FIELD_USERNAME,
+  AUTOFILL_FIELD_NEW_PASSWORD, AUTOFILL_FIELD_CURRENT_PASSWORD, AUTOFILL_FIELD_ORGANIZATION_TITLE,
+  AUTOFILL_FIELD_ORGANIZATION, AUTOFILL_FIELD_COUNTRY, AUTOFILL_FIELD_COUNTRY_NAME, AUTOFILL_FIELD_POSTAL_CODE,
+  AUTOFILL_FIELD_CC_NAME, AUTOFILL_FIELD_CC_GIVEN_NAME, AUTOFILL_FIELD_CC_ADDITIONAL_NAME,
+  AUTOFILL_FIELD_CC_FAMILY_NAME, AUTOFILL_FIELD_CC_NUMBER, AUTOFILL_FIELD_CC_EXP, AUTOFILL_FIELD_CC_EXP_MONTH,
+  AUTOFILL_FIELD_CC_EXP_YEAR, AUTOFILL_FIELD_CC_CSC, AUTOFILL_FIELD_CC_TYPE, AUTOFILL_FIELD_TRANSACTION_CURRENCY,
+  AUTOFILL_FIELD_TRANSACTION_AMOUNT, AUTOFILL_FIELD_LANGUAGE, AUTOFILL_FIELD_BDAY, AUTOFILL_FIELD_BDAY_DAY,
+  AUTOFILL_FIELD_BDAY_MONTH, AUTOFILL_FIELD_BDAY_YEAR, AUTOFILL_FIELD_SEX, AUTOFILL_FIELD_URL, AUTOFILL_FIELD_PHOTO,
+];
+
+export const AUTOFILL_FIELD_TEL = 'tel';
+export const AUTOFILL_FIELD_TEL_COUNTRY_CODE = 'tel-country-code';
+export const AUTOFILL_FIELD_TEL_NATIONAL = 'tel-national';
+export const AUTOFILL_FIELD_TEL_AREA_CODE = 'tel-area-code';
+export const AUTOFILL_FIELD_TEL_LOCAL = 'tel-local';
+export const AUTOFILL_FIELD_TEL_LOCAL_PREFIX = 'tel-local-prefix';
+export const AUTOFILL_FIELD_TEL_LOCAL_SUFFIX = 'tel-local-suffix';
+export const AUTOFILL_FIELD_TEL_LOCAL_EXTENSION = 'tel-extension';
+export const AUTOFILL_FIELD_EMAIL = 'email';
+export const AUTOFILL_FIELD_IMPP = 'impp';
+
+export const AUTOFILL_FIELDS_CONTACT = [
+  AUTOFILL_FIELD_TEL, AUTOFILL_FIELD_TEL_COUNTRY_CODE, AUTOFILL_FIELD_TEL_NATIONAL, AUTOFILL_FIELD_TEL_AREA_CODE,
+  AUTOFILL_FIELD_TEL_LOCAL, AUTOFILL_FIELD_TEL_LOCAL_PREFIX, AUTOFILL_FIELD_TEL_LOCAL_SUFFIX,
+  AUTOFILL_FIELD_TEL_LOCAL_EXTENSION, AUTOFILL_FIELD_EMAIL, AUTOFILL_FIELD_IMPP,
+];
+
+export function isAddressToken(token: string): boolean {
+  return AUTOFILL_TOKENS_ADDRESS.indexOf(token) > -1;
+}
+
+export function isContactField(token: string): boolean {
+  return AUTOFILL_FIELDS_CONTACT.indexOf(token) > -1;
+}
+
+export function isContactToken(token: string): boolean {
+  return AUTOFILL_TOKENS_CONTACT.indexOf(token) > -1;
+}
+
+export function isField(token: string): boolean {
+  return AUTOFILL_FIELDS.indexOf(token) > -1;
+}
+
+export function isSectionToken(token: string): boolean {
+  return token.startsWith('section-');
+}
+
+export function validate(tokens: string): boolean {
+
+  const toExpression = (total: string, currentValue: string) => `${total}|${currentValue}`;
+  const tokensAddress = AUTOFILL_TOKENS_ADDRESS.reduce(toExpression);
+  const tokensContact = AUTOFILL_TOKENS_CONTACT.reduce(toExpression);
+  const fields = AUTOFILL_FIELDS.reduce(toExpression);
+  const fieldsContact = AUTOFILL_FIELDS_CONTACT.reduce(toExpression);
+  const regex = new RegExp(`^(section-\\w+\\s{1})?((${tokensAddress}){1}\\s)?((${fields}){1}|((${tokensContact}){1}\\s{1}(${fieldsContact})))$`);
+
+  return regex.test(tokens);
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.spec.ts b/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.spec.ts
new file mode 100644
index 00000000000..e07f8cb5ee6
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.spec.ts
@@ -0,0 +1,79 @@
+import {
+  isBoolean,
+  isFunction,
+  isNumber,
+  isObject,
+  isString,
+} from './core.utils';
+
+describe('core utils test suite', () => {
+
+  let testValue1 = undefined,
+    testValue2 = null,
+    testValue3 = 42,
+    testValue4 = true,
+    testValue5 = false,
+    testValue6 = 'test',
+    testValue7 = {},
+    testValue8 = () => {};
+
+  it('should check if a given value is of type boolean', () => {
+
+    expect(isBoolean(testValue1)).toBe(false);
+    expect(isBoolean(testValue2)).toBe(false);
+    expect(isBoolean(testValue3)).toBe(false);
+    expect(isBoolean(testValue4)).toBe(true);
+    expect(isBoolean(testValue5)).toBe(true);
+    expect(isBoolean(testValue6)).toBe(false);
+    expect(isBoolean(testValue7)).toBe(false);
+    expect(isBoolean(testValue8)).toBe(false);
+  });
+
+  it('should check if a given value is of type function', () => {
+
+    expect(isFunction(testValue1)).toBe(false);
+    expect(isFunction(testValue2)).toBe(false);
+    expect(isFunction(testValue3)).toBe(false);
+    expect(isFunction(testValue4)).toBe(false);
+    expect(isFunction(testValue5)).toBe(false);
+    expect(isFunction(testValue6)).toBe(false);
+    expect(isFunction(testValue7)).toBe(false);
+    expect(isFunction(testValue8)).toBe(true);
+  });
+
+  it('should check if a given value is of type number', () => {
+
+    expect(isNumber(testValue1)).toBe(false);
+    expect(isNumber(testValue2)).toBe(false);
+    expect(isNumber(testValue3)).toBe(true);
+    expect(isNumber(testValue4)).toBe(false);
+    expect(isNumber(testValue5)).toBe(false);
+    expect(isNumber(testValue6)).toBe(false);
+    expect(isNumber(testValue7)).toBe(false);
+    expect(isNumber(testValue8)).toBe(false);
+  });
+
+  it('should check if a given value is of type object', () => {
+
+    expect(isObject(testValue1)).toBe(false);
+    expect(isObject(testValue2)).toBe(false);
+    expect(isObject(testValue3)).toBe(false);
+    expect(isObject(testValue4)).toBe(false);
+    expect(isObject(testValue5)).toBe(false);
+    expect(isObject(testValue6)).toBe(false);
+    expect(isObject(testValue7)).toBe(true);
+    expect(isObject(testValue8)).toBe(false);
+  });
+
+  it('should check if a given value is of type string', () => {
+
+    expect(isString(testValue1)).toBe(false);
+    expect(isString(testValue2)).toBe(false);
+    expect(isString(testValue3)).toBe(false);
+    expect(isString(testValue4)).toBe(false);
+    expect(isString(testValue5)).toBe(false);
+    expect(isString(testValue6)).toBe(true);
+    expect(isString(testValue7)).toBe(false);
+    expect(isString(testValue8)).toBe(false);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.ts b/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.ts
new file mode 100644
index 00000000000..926c2726116
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/core.utils.ts
@@ -0,0 +1,20 @@
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function isBoolean(value: any): value is boolean {
+  return typeof value === 'boolean';
+}
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function isFunction(value: any): value is Function {
+  return typeof value === 'function';
+}
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function isNumber(value: any): value is number {
+  return typeof value === 'number';
+}
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function isObject(value: any): value is object {
+  return typeof value === 'object' && value !== null;
+}
+// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type
+export function isString(value: any): value is string {
+  return typeof value === 'string';
+}
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.spec.ts b/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.spec.ts
new file mode 100644
index 00000000000..ad9f39c6921
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.spec.ts
@@ -0,0 +1,47 @@
+import {
+  maskFromString,
+  maskToString,
+  parseReviver,
+} from './json.utils';
+
+describe('JSON utils test suite', () => {
+
+  it('should convert a text mask to string correctly', () => {
+
+    let testValue1 = 'test',
+      testValue2 = /[1-9]/,
+      testValue3 = [testValue1, testValue2],
+      testResult3 = maskToString(testValue3) as string[];
+
+    expect(maskToString(testValue1)).toEqual(testValue1);
+    expect(maskToString(testValue2)).toEqual(testValue2.toString());
+
+    expect(testResult3[0]).toEqual(testValue1);
+    expect(testResult3[1]).toEqual(testValue2.toString());
+
+    expect(maskToString({} as string)).toBeNull();
+  });
+
+  it('should recreate a text mask from string correctly', () => {
+
+    let testValue1 = 'test',
+      testValue2 = '/[1-9]/',
+      testValue3 = [testValue1, testValue2],
+      testResult3 = maskFromString(testValue3) as (string | RegExp)[];
+
+    expect(maskFromString(testValue1)).toEqual(testValue1);
+    expect(maskFromString(testValue2)).toEqual(new RegExp('[1-9]'));
+
+    expect(testResult3[0]).toEqual(testValue1);
+    expect(testResult3[1]).toEqual(new RegExp('[1-9]'));
+
+    expect(maskFromString({} as string)).toBeNull();
+  });
+
+  it('should recreate a date from string correctly', () => {
+
+    let testValue1 = '2011-10-05T14:48:00.000Z';
+
+    expect(parseReviver('test', testValue1)).toEqual(new Date(testValue1));
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.ts b/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.ts
new file mode 100644
index 00000000000..a7f94242c4d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/core/utils/json.utils.ts
@@ -0,0 +1,32 @@
+import { isString } from './core.utils';
+
+export function maskToString(mask: string | RegExp | (string | RegExp)[]): string | string[] | null {
+  if (isString(mask)) {
+    return mask as string;
+
+  } else if (mask instanceof RegExp) {
+    return mask.toString();
+
+  } else if (Array.isArray(mask)) {
+    return mask.map(value => maskToString(value)) as string[];
+  }
+
+  return null;
+}
+
+export function maskFromString(mask: string | string[]): string | RegExp | (string | RegExp)[] | null {
+  if (isString(mask)) {
+    const isRegExp = (mask as string).startsWith('/') && (mask as string).endsWith('/');
+    return isRegExp ? new RegExp((mask as string).slice(1, mask.length - 1)) : mask;
+
+  } else if (Array.isArray(mask)) {
+    return (mask as string[]).map(value => maskFromString(value)) as string[];
+  }
+
+  return null;
+}
+
+export function parseReviver(_key: string, value: any): any {
+  const regexDateISO = /^(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2}(?:\.\d*))(?:Z|([+\-])([\d|:]*))?$/;
+  return isString(value) && regexDateISO.test(value) ? new Date(value) : value;
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/LICENSE b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/LICENSE
new file mode 100644
index 00000000000..2273c1e84cb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/LICENSE
@@ -0,0 +1,13 @@
+Copyright (c) 2016-2019, Udo Schöfer http://www.udos86.de
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.html
new file mode 100644
index 00000000000..790528a971d
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.html
@@ -0,0 +1,17 @@
+<ng-container [formGroup]="group">
+
+    <ngb-datepicker [displayMonths]="model.getAdditional('displayMonths', config['displayMonths'])"
+                    [firstDayOfWeek]="model.getAdditional('firstDayOfWeek', config['firstDayOfWeek'])"
+                    [formControlName]="model.id"
+                    [id]="id"
+                    [maxDate]="model.max"
+                    [minDate]="model.min"
+                    [navigation]="model.getAdditional('navigation', config['navigation'])"
+                    [ngClass]="getClass('element', 'control')"
+                    [outsideDays]="model.getAdditional('outsideDays', config['outsideDays'])"
+                    [showWeekNumbers]="model.getAdditional('showWeekNumbers', config['showWeekNumbers'])"
+                    [weekdays]="model.getAdditional('showWeekdays', config['weekdays'])"
+                    [startDate]="model.focusedDate"
+                    (select)="onChange($event)"></ngb-datepicker>
+
+</ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.spec.ts
new file mode 100644
index 00000000000..932e9c318bd
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.spec.ts
@@ -0,0 +1,99 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { NgbDatepicker } from '@ng-bootstrap/ng-bootstrap';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapCalendarComponent } from './dynamic-ng-bootstrap-calendar.component';
+
+
+describe('DynamicNGBootstrapCalendarComponent test suite', () => {
+  const testModel = new DynamicDatePickerModel({ id: 'calendar' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapCalendarComponent>;
+  let component: DynamicNGBootstrapCalendarComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapCalendarComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapCalendarComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`ngb-datepicker[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicDatePickerModel).toBe(true);
+    expect(component.ngbCalendar instanceof NgbDatepicker).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an ngb-datepicker element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+
+    expect(component.blur.emit).toHaveBeenCalled();
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+
+    expect(component.focus.emit).toHaveBeenCalled();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.ts
new file mode 100644
index 00000000000..24de0555888
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/calendar/dynamic-ng-bootstrap-calendar.component.ts
@@ -0,0 +1,56 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  ViewChild,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import {
+  NgbDatepicker,
+  NgbDatepickerConfig,
+  NgbDatepickerModule,
+} from '@ng-bootstrap/ng-bootstrap';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicDatePickerModel } from '@ng-dynamic-forms/core/model/datepicker/dynamic-datepicker.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-calendar',
+  templateUrl: './dynamic-ng-bootstrap-calendar.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    NgbDatepickerModule,
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapCalendarComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicDatePickerModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    @ViewChild(NgbDatepicker, { static: true }) ngbCalendar!: NgbDatepicker;
+
+    constructor(protected layoutService: DynamicFormLayoutService,
+                protected validationService: DynamicFormValidationService,
+                public config: NgbDatepickerConfig) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.html
new file mode 100644
index 00000000000..5d959214d61
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.html
@@ -0,0 +1,27 @@
+<ng-container [formGroup]="group">
+
+  <div class="btn-group btn-group-toggle" data-bs-toggle="buttons"
+    [formGroupName]="model.id"
+    [id]="id"
+    [ngClass]="getClass('element', 'control')">
+
+    @for (checkboxModel of model.group; track checkboxModel) {
+      <label
+        [hidden]="checkboxModel.hidden"
+        [ngClass]="getClass('element', 'control', checkboxModel)">
+        <input type="checkbox"
+          [checked]="checkboxModel.checked"
+          [formControlName]="checkboxModel.id"
+          [id]="getCheckboxId(checkboxModel)"
+          [name]="checkboxModel.name"
+          [required]="checkboxModel.required"
+          [tabindex]="checkboxModel.tabIndex"
+          [value]="checkboxModel.value"
+          (blur)="onBlur($event)"
+          (change)="onCheckboxChange($event, checkboxModel)"
+          (focus)="onFocus($event)"/><span [ngClass]="getClass('element', 'label', checkboxModel)"
+        [innerHTML]="checkboxModel.label"></span></label>
+      }
+    </div>
+
+  </ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.spec.ts
new file mode 100644
index 00000000000..aafd4be830b
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.spec.ts
@@ -0,0 +1,105 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicCheckboxGroupModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapCheckboxGroupComponent } from './dynamic-ng-bootstrap-checkbox-group.component';
+
+describe('DynamicNGBootstrapCheckboxGroupComponent test suite', () => {
+  const testModel = new DynamicCheckboxGroupModel({ id: 'checkboxGroup', group: [] });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapCheckboxGroupComponent>;
+  let component: DynamicNGBootstrapCheckboxGroupComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        ReactiveFormsModule,
+        NoopAnimationsModule,
+        DynamicTemplateDirective,
+        DynamicListDirective,
+        DynamicNGBootstrapCheckboxGroupComponent,
+      ],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapCheckboxGroupComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`div.btn-group`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormGroup).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicCheckboxGroupModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an div.btn-group element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+
+    expect(component.blur.emit).toHaveBeenCalled();
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+
+    expect(component.focus.emit).toHaveBeenCalled();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.ts
new file mode 100644
index 00000000000..bb0ad6ca68e
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox-group/dynamic-ng-bootstrap-checkbox-group.component.ts
@@ -0,0 +1,56 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicCheckboxGroupModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox-group.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-checkbox-group',
+  templateUrl: './dynamic-ng-bootstrap-checkbox-group.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapCheckboxGroupComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicCheckboxGroupModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+
+    getCheckboxId(model: DynamicCheckboxModel) {
+      return this.layoutService.getElementId(model);
+    }
+
+    onCheckboxChange($event: Event, model: DynamicCheckboxModel) {
+      this.onChange($event);
+      model.value = ($event.target as HTMLInputElement).checked;
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.html
new file mode 100644
index 00000000000..afe4ee13621
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.html
@@ -0,0 +1,20 @@
+<div [formGroup]="group" class="form-check" [class.disabled]="model.disabled">
+    <label class="form-check-label">
+        <input type="checkbox" class="form-check-input"
+               [checked]="model.checked"
+               [class.is-invalid]="showErrorMessages"
+               [formControlName]="model.id"
+               [id]="id"
+               [indeterminate]="model.indeterminate"
+               [name]="model.name"
+               [ngClass]="getClass('element', 'control')"
+               [required]="model.required"
+               [tabindex]="model.tabIndex"
+               [value]="model.value"
+               (blur)="onBlur($event)"
+               (change)="onChange($event)"
+               (focus)="onFocus($event)"/>
+        <span [innerHTML]="model.label"
+              [ngClass]="[getClass('element', 'label'), getClass('grid', 'label')]"></span>
+    </label>
+</div>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.spec.ts
new file mode 100644
index 00000000000..24519ce68a5
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.spec.ts
@@ -0,0 +1,99 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapCheckboxComponent } from './dynamic-ng-bootstrap-checkbox.component';
+
+
+describe('DynamicNGBootstrapCheckboxComponent test suite', () => {
+  const testModel = new DynamicCheckboxModel({ id: 'checkbox' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapCheckboxComponent>;
+  let component: DynamicNGBootstrapCheckboxComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapCheckboxComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapCheckboxComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`input[type="checkbox"][id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicCheckboxModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an checkbox element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should listen to and emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+    testElement.triggerEventHandler('blur', null);
+
+    expect(component.blur.emit).toHaveBeenCalledTimes(2);
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should listen to and emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+    testElement.triggerEventHandler('focus', null);
+
+    expect(component.focus.emit).toHaveBeenCalledTimes(2);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.ts
new file mode 100644
index 00000000000..ef84c3c3e4c
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/checkbox/dynamic-ng-bootstrap-checkbox.component.ts
@@ -0,0 +1,45 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicCheckboxModel } from '@ng-dynamic-forms/core/model/checkbox/dynamic-checkbox.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-checkbox',
+  templateUrl: './dynamic-ng-bootstrap-checkbox.component.html',
+  changeDetection: ChangeDetectionStrategy.Default,
+  imports: [
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapCheckboxComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicCheckboxModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.html
new file mode 100644
index 00000000000..97ab182d47f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.html
@@ -0,0 +1,94 @@
+<div [formGroup]="group" [class.input-group]="model.prefix || model.suffix">
+
+  @if (model.prefix) {
+    <span class="input-group-text" [innerHTML]="model.prefix"></span>
+  }
+
+  @if (model.inputType === 'file') {
+    <input class="form-control"
+      [attr.accept]="model.accept"
+      [attr.max]="model.max"
+      [attr.min]="model.min"
+      [attr.multiple]="model.multiple"
+      [attr.step]="model.step"
+      [autocomplete]="model.autoComplete"
+      [autofocus]="model.autoFocus"
+      [class.is-invalid]="showErrorMessages"
+      [dynamicList]="model.listId"
+      [formControlName]="model.id"
+      [id]="id"
+      [maxlength]="model.maxLength"
+      [minlength]="model.minLength"
+      [name]="model.name"
+      [ngClass]="getClass('element', 'control')"
+      [pattern]="model.pattern"
+      [placeholder]="model.placeholder"
+      [readonly]="model.readOnly"
+      [required]="model.required"
+      [spellcheck]="model.spellCheck"
+      [tabindex]="model.tabIndex"
+      [type]="model.inputType"
+      (blur)="onBlur($event)"
+      (change)="onChange($event)"
+      (focus)="onFocus($event)"/>
+  } @else {
+    <input class="form-control"
+      [attr.accept]="model.accept"
+      [attr.max]="model.max"
+      [attr.min]="model.min"
+      [attr.multiple]="model.multiple"
+      [attr.step]="model.step"
+      [autocomplete]="model.autoComplete"
+      [autofocus]="model.autoFocus"
+      [class.is-invalid]="showErrorMessages"
+      [dynamicList]="model.listId"
+      [formControlName]="model.id"
+      [id]="id"
+      [maxlength]="model.maxLength"
+      [minlength]="model.minLength"
+      [name]="model.name"
+      [ngClass]="getClass('element', 'control')"
+      [pattern]="model.pattern"
+      [placeholder]="model.placeholder"
+      [readonly]="model.readOnly"
+      [required]="model.required"
+      [spellcheck]="model.spellCheck"
+      [tabindex]="model.tabIndex"
+      [mask]="model.mask"
+      [specialCharacters]="model.maskConfig?.specialCharacters"
+      [patterns]="model.maskConfig?.patterns"
+      [prefix]="model.maskConfig?.prefix"
+      [suffix]="model.maskConfig?.suffix"
+      [thousandSeparator]="model.maskConfig?.thousandSeparator"
+      [decimalMarker]="model.maskConfig?.decimalMarker"
+      [dropSpecialCharacters]="model.maskConfig?.dropSpecialCharacters"
+      [hiddenInput]="model.maskConfig?.hiddenInput"
+      [showMaskTyped]="model.maskConfig?.showMaskTyped"
+      [placeHolderCharacter]="model.maskConfig?.placeHolderCharacter"
+      [shownMaskExpression]="model.maskConfig?.shownMaskExpression"
+      [showTemplate]="model.maskConfig?.showTemplate"
+      [clearIfNotMatch]="model.maskConfig.clearIfNotMatch"
+      [validation]="model.maskConfig.validation"
+      [separatorLimit]="model.maskConfig.separatorLimit"
+      [allowNegativeNumbers]="model.maskConfig.allowNegativeNumbers"
+      [leadZeroDateTime]="model.maskConfig.leadZeroDateTime"
+      [type]="model.inputType"
+      (blur)="onBlur($event)"
+      (change)="onChange($event)"
+      (focus)="onFocus($event)"/>
+  }
+
+
+  @if (model.suffix) {
+    <span class="input-group-text" [innerHTML]="model.suffix"></span>
+  }
+
+  @if (model.hasList) {
+    <datalist [id]="model.listId">
+      @for (option of model.list$ | async; track option) {
+        <option [value]="option">
+        }
+      </datalist>
+    }
+
+  </div>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.spec.ts
new file mode 100644
index 00000000000..aabc9c42c51
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.spec.ts
@@ -0,0 +1,100 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+import { NgxMaskModule } from 'ngx-mask';
+
+import { DynamicNGBootstrapInputComponent } from './dynamic-ng-bootstrap-input.component';
+
+describe('DynamicNGBootstrapInputComponent test suite', () => {
+  const testModel = new DynamicInputModel({ id: 'input' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapInputComponent>;
+  let component: DynamicNGBootstrapInputComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapInputComponent, NgxMaskModule.forRoot()],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapInputComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`input[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicInputModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an input element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should listen to and emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+    testElement.triggerEventHandler('blur', null);
+
+    expect(component.blur.emit).toHaveBeenCalledTimes(2);
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+    testElement.triggerEventHandler('change', null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should listen to and emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+    testElement.triggerEventHandler('focus', null);
+
+    expect(component.focus.emit).toHaveBeenCalledTimes(2);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.ts
new file mode 100644
index 00000000000..bed3b0ae02f
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/input/dynamic-ng-bootstrap-input.component.ts
@@ -0,0 +1,53 @@
+import {
+  AsyncPipe,
+  NgClass,
+} from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicInputModel } from '@ng-dynamic-forms/core/model/input/dynamic-input.model';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+import { NgxMaskModule } from 'ngx-mask';
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-input',
+  templateUrl: './dynamic-ng-bootstrap-input.component.html',
+  changeDetection: ChangeDetectionStrategy.Default,
+  imports: [
+    AsyncPipe,
+    DynamicListDirective,
+    NgClass,
+    NgxMaskModule,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapInputComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicInputModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.html
new file mode 100644
index 00000000000..befa674a147
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.html
@@ -0,0 +1,29 @@
+<ng-container [formGroup]="group">
+
+  <div class="btn-group" role="group"
+    ngDefaultControl
+    [formControlName]="model.id"
+    [id]="id"
+    [ngClass]="getClass('element', 'control')"
+    [tabindex]="model.tabIndex"
+    (change)="onChange($event)">
+
+    @if (model.legend) {
+      <legend [innerHTML]="model.legend"></legend>
+    }
+
+    @for (option of model.options$ | async; track option) {
+      <label
+        [ngClass]="[getClass('element', 'option'), getClass('grid', 'option')]">
+        <input type="radio"
+          [disabled]="option.disabled"
+          [name]="model.name"
+          [value]="option.value"
+          (blur)="onBlur($event)"
+          (focus)="onFocus($event)"/><span [innerHTML]="option.label"></span>
+        </label>
+      }
+
+    </div>
+
+  </ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.spec.ts
new file mode 100644
index 00000000000..47ccb86e2cd
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.spec.ts
@@ -0,0 +1,101 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { DynamicRadioGroupModel } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapRadioGroupComponent } from './dynamic-ng-bootstrap-radio-group.component';
+
+
+describe('DynamicNGBootstrapRadioGroupComponent test suite', () => {
+  const testModel = new DynamicRadioGroupModel({
+    id: 'radioGroup',
+    options: [{ value: 'One' }, { value: 'Two' }],
+    value: 'One',
+  });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapRadioGroupComponent>;
+  let component: DynamicNGBootstrapRadioGroupComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapRadioGroupComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapRadioGroupComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`div[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicRadioGroupModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an radio group element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+
+    expect(component.blur.emit).toHaveBeenCalled();
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+
+    expect(component.focus.emit).toHaveBeenCalled();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.ts
new file mode 100644
index 00000000000..9c53ecfaa57
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/radio-group/dynamic-ng-bootstrap-radio-group.component.ts
@@ -0,0 +1,50 @@
+import {
+  AsyncPipe,
+  NgClass,
+} from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicRadioGroupModel } from '@ng-dynamic-forms/core/model/radio/dynamic-radio-group.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-radio-group',
+  templateUrl: './dynamic-ng-bootstrap-radio-group.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    AsyncPipe,
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapRadioGroupComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicRadioGroupModel<string>;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.html
new file mode 100644
index 00000000000..2c3d7fc914e
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.html
@@ -0,0 +1,12 @@
+<ng-container [formGroup]="group">
+
+    <ngb-rating [formControlName]="model.id"
+                [id]="id"
+                [max]="model.max"
+                [ngClass]="getClass('element', 'control')"
+                [resettable]="model.getAdditional('resettable', config['resettable'])"
+                (hover)="onCustomEvent($event, 'hover')"
+                (leave)="onCustomEvent($event, 'leave')"
+                (rateChange)="onChange($event)"></ngb-rating>
+
+</ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.spec.ts
new file mode 100644
index 00000000000..3fed1f0b635
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.spec.ts
@@ -0,0 +1,98 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { NgbRating } from '@ng-bootstrap/ng-bootstrap';
+import { DynamicRatingModel } from '@ng-dynamic-forms/core/model/rating/dynamic-rating.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapRatingComponent } from './dynamic-ng-bootstrap-rating.component';
+
+describe('DynamicNGBootstrapRatingComponent test suite', () => {
+  const testModel = new DynamicRatingModel({ id: 'rating' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapRatingComponent>;
+  let component: DynamicNGBootstrapRatingComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapRatingComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapRatingComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`ngb-rating[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicRatingModel).toBe(true);
+    expect(component.ngbRating instanceof NgbRating).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an ngb-rating element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should listen to and emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+
+    expect(component.blur.emit).toHaveBeenCalled();
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should listen to and emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+
+    expect(component.focus.emit).toHaveBeenCalled();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.ts
new file mode 100644
index 00000000000..ef5ee9389bb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/rating/dynamic-ng-bootstrap-rating.component.ts
@@ -0,0 +1,59 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  ViewChild,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import {
+  NgbRating,
+  NgbRatingConfig,
+  NgbRatingModule,
+} from '@ng-bootstrap/ng-bootstrap';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlCustomEvent } from '@ng-dynamic-forms/core/component/dynamic-form-control-event';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicRatingModel } from '@ng-dynamic-forms/core/model/rating/dynamic-rating.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-rating',
+  templateUrl: './dynamic-ng-bootstrap-rating.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    NgbRatingModule,
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapRatingComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicRatingModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() customEvent: EventEmitter<DynamicFormControlCustomEvent> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    @ViewChild(NgbRating, { static: true }) ngbRating!: NgbRating;
+
+    constructor(protected layoutService: DynamicFormLayoutService,
+                protected validationService: DynamicFormValidationService,
+                public config: NgbRatingConfig) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.html
new file mode 100644
index 00000000000..daec18ed033
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.html
@@ -0,0 +1,24 @@
+<ng-container [formGroup]="group">
+
+  <select class="form-control"
+    [class.is-invalid]="showErrorMessages"
+    [compareWith]="model.compareWithFn"
+    [formControlName]="model.id"
+    [id]="id"
+    [name]="model.name"
+    [ngClass]="getClass('element', 'control')"
+    [required]="model.required"
+    [tabindex]="model.tabIndex"
+    (blur)="onBlur($event)"
+    (change)="onChange($event)"
+    (focus)="onFocus($event)">
+
+    @for (option of model.options$ | async; track option) {
+      <option
+        [disabled]="option.disabled"
+      [ngValue]="option.value">{{ option.label }}</option>
+    }
+
+  </select>
+
+</ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.spec.ts
new file mode 100644
index 00000000000..807a3369902
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.spec.ts
@@ -0,0 +1,98 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapSelectComponent } from './dynamic-ng-bootstrap-select.component';
+
+describe('DynamicNGBootstrapSelectComponent test suite', () => {
+  const testModel = new DynamicSelectModel({ id: 'select', options: [{ value: 'One' }, { value: 'Two' }], value: 'One' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapSelectComponent>;
+  let component: DynamicNGBootstrapSelectComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapSelectComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapSelectComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`select[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicSelectModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an select element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should listen to and emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+    testElement.triggerEventHandler('blur', null);
+
+    expect(component.blur.emit).toHaveBeenCalledTimes(2);
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should listen to and emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+    testElement.triggerEventHandler('focus', null);
+
+    expect(component.focus.emit).toHaveBeenCalledTimes(2);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.ts
new file mode 100644
index 00000000000..2f40bbee3df
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/select/dynamic-ng-bootstrap-select.component.ts
@@ -0,0 +1,48 @@
+import {
+  AsyncPipe,
+  NgClass,
+} from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicSelectModel } from '@ng-dynamic-forms/core/model/select/dynamic-select.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-select',
+  templateUrl: './dynamic-ng-bootstrap-select.component.html',
+  changeDetection: ChangeDetectionStrategy.Default,
+  imports: [
+    AsyncPipe,
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapSelectComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicSelectModel<string>;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.html
new file mode 100644
index 00000000000..d13384a73de
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.html
@@ -0,0 +1,23 @@
+<ng-container [formGroup]="group">
+
+    <textarea class="form-control"
+              [class.is-invalid]="showErrorMessages"
+              [cols]="model.cols"
+              [formControlName]="model.id"
+              [id]="id"
+              [maxlength]="model.maxLength"
+              [minlength]="model.minLength"
+              [name]="model.name"
+              [ngClass]="getClass('element', 'control')"
+              [placeholder]="model.placeholder"
+              [readonly]="model.readOnly"
+              [required]="model.required"
+              [rows]="model.rows"
+              [spellcheck]="model.spellCheck"
+              [tabindex]="model.tabIndex"
+              [wrap]="model.wrap"
+              (blur)="onBlur($event)"
+              (change)="onChange($event)"
+              (focus)="onFocus($event)"></textarea>
+
+</ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.spec.ts
new file mode 100644
index 00000000000..748b7f160c4
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.spec.ts
@@ -0,0 +1,100 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapTextAreaComponent } from './dynamic-ng-bootstrap-textarea.component';
+
+
+describe('DynamicNGBootstrapTextAreaComponent test suite', () => {
+  const testModel = new DynamicTextAreaModel({ id: 'textarea' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapTextAreaComponent>;
+  let component: DynamicNGBootstrapTextAreaComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [DynamicNGBootstrapTextAreaComponent],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapTextAreaComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`textarea[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicTextAreaModel).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an textarea element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should listen to and emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+    testElement.triggerEventHandler('blur', null);
+
+    expect(component.blur.emit).toHaveBeenCalledTimes(2);
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+    testElement.triggerEventHandler('change', null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should listen to and emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+    testElement.triggerEventHandler('focus', null);
+
+    expect(component.focus.emit).toHaveBeenCalledTimes(2);
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.ts
new file mode 100644
index 00000000000..bb033496839
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/textarea/dynamic-ng-bootstrap-textarea.component.ts
@@ -0,0 +1,45 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicTextAreaModel } from '@ng-dynamic-forms/core/model/textarea/dynamic-textarea.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-textarea',
+  templateUrl: './dynamic-ng-bootstrap-textarea.component.html',
+  changeDetection: ChangeDetectionStrategy.Default,
+  imports: [
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapTextAreaComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicTextAreaModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    constructor(protected layoutService: DynamicFormLayoutService, protected validationService: DynamicFormValidationService) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.html b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.html
new file mode 100644
index 00000000000..d5e51afca72
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.html
@@ -0,0 +1,14 @@
+<ng-container [formGroup]="group">
+
+    <ngb-timepicker [id]="id"
+                    [formControlName]="model.id"
+                    [hourStep]="model.getAdditional('hourStep', config['hourStep'])"
+                    [meridian]="model.meridian"
+                    [minuteStep]="model.getAdditional('minuteStep', config['minuteStep'])"
+                    [ngClass]="getClass('element', 'control')"
+                    [seconds]="model.showSeconds"
+                    [secondStep]="model.getAdditional('secondStep', config['secondStep'])"
+                    [size]="model.getAdditional('size', config['size'])"
+                    [spinners]="model.getAdditional('spinners', config['spinners'])"></ngb-timepicker>
+
+</ng-container>
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.spec.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.spec.ts
new file mode 100644
index 00000000000..d90a8297f8e
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.spec.ts
@@ -0,0 +1,112 @@
+import { DebugElement } from '@angular/core';
+import {
+  ComponentFixture,
+  inject,
+  TestBed,
+  waitForAsync,
+} from '@angular/core/testing';
+import {
+  ReactiveFormsModule,
+  UntypedFormControl,
+  UntypedFormGroup,
+} from '@angular/forms';
+import { By } from '@angular/platform-browser';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import {
+  NgbTimepicker,
+  NgbTimepickerModule,
+} from '@ng-bootstrap/ng-bootstrap';
+import { DynamicListDirective } from '@ng-dynamic-forms/core/directive/dynamic-list.directive';
+import { DynamicTemplateDirective } from '@ng-dynamic-forms/core/directive/dynamic-template.directive';
+import { DynamicTimePickerModel } from '@ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model';
+import { DynamicFormService } from '@ng-dynamic-forms/core/service/dynamic-form.service';
+
+import { DynamicNGBootstrapTimePickerComponent } from './dynamic-ng-bootstrap-timepicker.component';
+
+describe('DynamicNGBootstrapTimePickerComponent test suite', () => {
+  const testModel = new DynamicTimePickerModel({ id: 'timepicker' });
+  const formModel = [testModel];
+
+  let formGroup: UntypedFormGroup;
+  let fixture: ComponentFixture<DynamicNGBootstrapTimePickerComponent>;
+  let component: DynamicNGBootstrapTimePickerComponent;
+  let debugElement: DebugElement;
+  let testElement: DebugElement;
+
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        ReactiveFormsModule,
+        NoopAnimationsModule,
+        NgbTimepickerModule,
+        DynamicListDirective,
+        DynamicTemplateDirective,
+        DynamicNGBootstrapTimePickerComponent,
+      ],
+    }).compileComponents().then(() => {
+      fixture = TestBed.createComponent(DynamicNGBootstrapTimePickerComponent);
+
+      component = fixture.componentInstance;
+      debugElement = fixture.debugElement;
+    });
+  }));
+
+  beforeEach(inject([DynamicFormService], (service: DynamicFormService) => {
+    formGroup = service.createFormGroup(formModel);
+
+    component.group = formGroup;
+    component.model = testModel;
+
+    fixture.detectChanges();
+
+    testElement = debugElement.query(By.css(`ngb-timepicker[id="${testModel.id}"]`));
+  }));
+
+  it('should initialize correctly', () => {
+    expect(component.control instanceof UntypedFormControl).toBe(true);
+    expect(component.group instanceof UntypedFormGroup).toBe(true);
+    expect(component.model instanceof DynamicTimePickerModel).toBe(true);
+    expect(component.ngbTimePicker instanceof NgbTimepicker).toBe(true);
+
+    expect(component.blur).toBeDefined();
+    expect(component.change).toBeDefined();
+    expect(component.focus).toBeDefined();
+
+    expect(component.onBlur).toBeDefined();
+    expect(component.onChange).toBeDefined();
+    expect(component.onFocus).toBeDefined();
+
+    expect(component.hasFocus).toBe(false);
+    expect(component.isValid).toBe(true);
+    expect(component.isInvalid).toBe(false);
+    expect(component.showErrorMessages).toBe(false);
+  });
+
+  it('should have an ngb-timepicker element', () => {
+    expect(testElement instanceof DebugElement).toBe(true);
+  });
+
+  it('should emit blur event', () => {
+    spyOn(component.blur, 'emit');
+
+    component.onBlur(null);
+
+    expect(component.blur.emit).toHaveBeenCalled();
+  });
+
+  it('should emit change event', () => {
+    spyOn(component.change, 'emit');
+
+    component.onChange(null);
+
+    expect(component.change.emit).toHaveBeenCalled();
+  });
+
+  it('should emit focus event', () => {
+    spyOn(component.focus, 'emit');
+
+    component.onFocus(null);
+
+    expect(component.focus.emit).toHaveBeenCalled();
+  });
+});
diff --git a/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.ts b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.ts
new file mode 100644
index 00000000000..94b1ce272fb
--- /dev/null
+++ b/src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/timepicker/dynamic-ng-bootstrap-timepicker.component.ts
@@ -0,0 +1,56 @@
+import { NgClass } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  EventEmitter,
+  Input,
+  Output,
+  ViewChild,
+} from '@angular/core';
+import {
+  ReactiveFormsModule,
+  UntypedFormGroup,
+} from '@angular/forms';
+import {
+  NgbTimepicker,
+  NgbTimepickerConfig,
+  NgbTimepickerModule,
+} from '@ng-bootstrap/ng-bootstrap';
+import { DynamicFormControlComponent } from '@ng-dynamic-forms/core/component/dynamic-form-control.component';
+import { DynamicFormControlLayout } from '@ng-dynamic-forms/core/model/misc/dynamic-form-control-layout.model';
+import { DynamicTimePickerModel } from '@ng-dynamic-forms/core/model/timepicker/dynamic-timepicker.model';
+import {
+  DynamicFormLayout,
+  DynamicFormLayoutService,
+} from '@ng-dynamic-forms/core/service/dynamic-form-layout.service';
+import { DynamicFormValidationService } from '@ng-dynamic-forms/core/service/dynamic-form-validation.service';
+
+
+@Component({
+  selector: 'dynamic-ng-bootstrap-timepicker',
+  templateUrl: './dynamic-ng-bootstrap-timepicker.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [
+    NgbTimepickerModule,
+    NgClass,
+    ReactiveFormsModule,
+  ],
+})
+export class DynamicNGBootstrapTimePickerComponent extends DynamicFormControlComponent {
+    @Input() formLayout?: DynamicFormLayout;
+    @Input() group!: UntypedFormGroup;
+    @Input() layout?: DynamicFormControlLayout;
+    @Input() model!: DynamicTimePickerModel;
+
+    @Output() blur: EventEmitter<any> = new EventEmitter();
+    @Output() change: EventEmitter<any> = new EventEmitter();
+    @Output() focus: EventEmitter<any> = new EventEmitter();
+
+    @ViewChild(NgbTimepicker, { static: true }) ngbTimePicker!: NgbTimepicker;
+
+    constructor(protected layoutService: DynamicFormLayoutService,
+                protected validationService: DynamicFormValidationService,
+                public config: NgbTimepickerConfig) {
+      super(layoutService, validationService);
+    }
+}
diff --git a/tsconfig.json b/tsconfig.json
index 013a1e47937..2447cbc9e68 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -44,7 +44,9 @@
     "paths": {
       "@dspace/core/*": ["src/app/core/*"],
       "@dspace/config/*": ["src/config/*"],
-      "@dspace/shared/utils/*": ["src/app/utils/*"]
+      "@dspace/shared/utils/*": ["src/app/utils/*"],
+      "@ng-dynamic-forms/core/*": ["src/external-libraries/ng-dynamic-forms/core/*"],
+      "@ng-dynamic-forms/ui-ng-bootstrap/*": ["src/external-libraries/ng-dynamic-forms/ui-ng-bootstrap/*"],
     }
   },
   "angularCompilerOptions": {