PrimeNG chips with fixed size not working

I am currently working in a form using Reactive Forms in Angular and PrimeNG for some styling. What I am currently doing (it is already working), is opening a modal with a button, select some data and pass that data through an EventEmitter, and then displaying that data using Chips from PrimeNG

But what I am struggling to do is when I try to remove one chip, the cursor goes at the end of the input and does not go back. I am adding some pictures of it next.

And when I try to remove one of those, this happens.

As you can see, the cursor goes to the end of the input, and I can not go back.

I have added some styles because I do not want the input to be resized when I select a lot of data.

styles.css

::ng-deep p-chips .p-chips-multiple-container {
  min-width: 272px;
  max-width: 272px;
  max-height: 40px;
  min-height: 40px;
}

component.html

<p-chips formControlName="dataInput" field="name" ngDefaultControl></p-chips>

I do not really know if this is the proper way to do that, but it meets my requierements so I will try to keep it as long as I can. PrimeNG's documentation does not give enough info (in my honest opinion) and this is what I can do.

My question is, since I am unable to delete a single chip clicking on the cross when the size of the input is fixed, is there a way to do what I want?

PS: I can actually remove a single chip if I do not put a max/min width/heigth, so I guess the problem comes with that.

PS2: It actually deletes the chip when the cross is clicked, but then the cursor goes as I said, to the end of the input and the data is no longer visible.