Item values exceeds input-box
Issue description
When using the style "outline" (from Ionic) for an ion-item containing an ionic-selectable (with multiple selections enabled and the Multiple values with ellipsis template), the values exceeds from the box borders.
Versions
- Ionic: 6.19.1
- Angular: 13.2.6
- Capacitor: 3.5.1
- NodeJS: 16.15.0
- npm: 8.5.5
Stackblitz example
* Currently not working...
Error in /turbo_modules/@angular/[email protected]/fesm2015/core.mjs (1150:15) Type L does not have 'ɵmod' property.
Seems to be coming from this import:
import { IonicModule } from '@ionic/angular';
Had to update imports versions because otherwise the fill="outline" style wouldn't exist. But these new imports have caused the problem.
Anyway, all the code and dependencies are in here: https://stackblitz.com/edit/ionic-selectable-grouping-ab49zt?file=app/pages/home/home.html
Code to reproduce
<ion-item fill="outline">
<ion-label position="floating">{{"students" | translate}}</ion-label>
<ionic-selectable item-content [(ngModel)]="selectedstudents" [items]="students" itemValueField="id" temTextField="name" [isMultiple]="true" [canClear]="true">
<ng-template ionicSelectableValueTemplate let-students="value">
<div class="ionic-selectable-value-item">
{{formatMultipleValues(students)}}
</div>
</ng-template>
</ionic-selectable>
</ion-item>