Removed form.component ViewEncapsulation

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.scss

@@ -0,0 +1,16 @@
+:host ::ng-deep {
+  // For proper scoping, do not include the .css file suffix here
+  @import "../../form.component";
+}
+
+:host {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+:host /deep/ .custom-select {
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form-control-container.component.ts

@@ -131,7 +131,7 @@ export function dsDynamicFormControlMapFn(model: DynamicFormControlModel): Type<
 
 @Component({
   selector: 'ds-dynamic-form-control',
-  styleUrls: ['./ds-dynamic-form.component.scss', '../../form.component.scss'],
+  styleUrls: ['./ds-dynamic-form-control-container.component.scss'],
   templateUrl: './ds-dynamic-form-control-container.component.html',
   changeDetection: ChangeDetectionStrategy.Default
 })

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.scss

@@ -1,5 +0,0 @@
-:host {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-}

src/app/shared/form/builder/ds-dynamic-form-ui/ds-dynamic-form.component.ts

@@ -1,20 +1,12 @@
-import {
-  Component,
-  ContentChildren,
-  EventEmitter,
-  Input,
-  Output,
-  QueryList,
-  ViewChildren
-} from '@angular/core';
+import { Component, ContentChildren, EventEmitter, Input, Output, QueryList, ViewChildren } from '@angular/core';
 import { FormGroup } from '@angular/forms';
 import {
-  DynamicFormComponent, DynamicFormControlContainerComponent,
+  DynamicFormComponent,
+  DynamicFormControlContainerComponent,
   DynamicFormControlEvent,
   DynamicFormControlModel,
   DynamicFormLayout,
   DynamicFormLayoutService,
-  DynamicFormService,
   DynamicTemplateDirective,
 } from '@ng-dynamic-forms/core';
 import { DsDynamicFormControlContainerComponent } from './ds-dynamic-form-control-container.component';
@@ -22,7 +14,6 @@ import { FormBuilderService } from '../form-builder.service';
 
 @Component({
   selector: 'ds-dynamic-form',
-  styleUrls: ['../../form.component.scss'],
   templateUrl: './ds-dynamic-form.component.html'
 })
 export class DsDynamicFormComponent extends DynamicFormComponent {

src/app/shared/form/form.component.ts

@@ -31,8 +31,7 @@ import { FormEntry, FormError } from './form.reducer';
   exportAs: 'formComponent',
   selector: 'ds-form',
   styleUrls: ['form.component.scss'],
-  templateUrl: 'form.component.html',
-  encapsulation: ViewEncapsulation.ShadowDom
+  templateUrl: 'form.component.html'
 })
 export class FormComponent implements OnDestroy, OnInit {