Custom ag-grid angular cell edit component using ngx-bootstrap typeahead not displaying properly

Question

I created a ngx-bootstrap typeahead component to use as a drop down in an ag-grid application. The problem is the drop down is not filling the cell.

Here is a demo

<form [formGroup]="myForm">
<input formControlName="item"
     [typeahead]="items"
     [typeaheadScrollable]="true"
     [typeaheadMinLength]="0"
     (focusin)="$event.target.value = ''"
     placeholder="Typeahead inside a form"
     class="form-control">
 </form>

Answer 1

You need to add a class to form and input with height and width 100%, also need to remove padding for .ag-theme-balham .ag-cell

::ng-deep .ag-theme-balham .ag-cell {
  padding-left: 0px;
  padding-right: 0px;
}

I tried it on your stackblitz but can't save those changes.