ng-miam 3.7.3 → 3.7.4

package/fesm2015/ng-miam.js

@@ -1,4 +1,4 @@
-import { InjectionToken, ɵɵdefineInjectable, ɵsetClassMetadata, Injectable, ɵɵinject, Inject, EventEmitter, ApplicationRef, ɵɵelementStart, ɵɵelement, ɵɵelementEnd, ɵɵnextContext, ɵɵproperty, ɵɵpureFunction2, ɵɵadvance, ɵɵsanitizeUrl, ɵɵpureFunction1, ɵɵelementContainerStart, ɵɵnamespaceSVG, ɵɵelementContainerEnd, ɵɵattribute, ɵɵelementContainer, ɵɵtemplate, ɵɵdirectiveInject, ChangeDetectorRef, ɵɵdefineComponent, ɵɵNgOnChangesFeature, ɵɵtemplateRefExtractor, ɵɵreference, Component, ChangeDetectionStrategy, Input, ɵɵtext, ElementRef, ɵɵdefineDirective, ɵɵlistener, Directive, HostListener, ɵɵdefinePipe, Pipe, ɵɵtextInterpolate, ɵɵgetCurrentView, ɵɵrestoreView, ɵɵpropertyInterpolate1, ɵɵpipe, ɵɵpipeBind1, ɵɵtextInterpolate1, Output, ɵɵviewQuery, ɵɵqueryRefresh, ɵɵloadQuery, ViewEncapsulation, ViewChild, ɵɵgetInheritedFactory, ɵɵprojection, TemplateRef, ɵɵprojectionDef, ɵɵcontentQuery, ContentChild, ɵɵclassProp, ContentChildren, ɵɵpropertyInterpolate, ɵɵdefineNgModule, ɵɵdefineInjector, ɵɵsetNgModuleScope, NgModule, ɵɵresolveDocument, Injector, ɵɵresolveWindow, ɵɵpureFunction3, ɵɵtextInterpolate2, ViewChildren, ɵɵpipeBind2, ɵɵInheritDefinitionFeature, ɵɵstyleProp, ɵɵsanitizeHtml, ɵɵsanitizeResourceUrl, ɵɵpureFunction0, ɵɵsetComponentScope, ComponentFactoryResolver, LOCALE_ID } from '@angular/core';
+import { InjectionToken, ɵɵdefineInjectable, ɵsetClassMetadata, Injectable, ɵɵinject, Inject, EventEmitter, ApplicationRef, ɵɵelementStart, ɵɵelement, ɵɵelementEnd, ɵɵnextContext, ɵɵproperty, ɵɵpureFunction2, ɵɵadvance, ɵɵsanitizeUrl, ɵɵpureFunction1, ɵɵelementContainerStart, ɵɵnamespaceSVG, ɵɵelementContainerEnd, ɵɵattribute, ɵɵelementContainer, ɵɵtemplate, ɵɵdirectiveInject, ChangeDetectorRef, ɵɵdefineComponent, ɵɵNgOnChangesFeature, ɵɵtemplateRefExtractor, ɵɵreference, Component, ChangeDetectionStrategy, Input, ɵɵtext, ElementRef, ɵɵdefineDirective, ɵɵlistener, Directive, HostListener, ɵɵdefinePipe, Pipe, ɵɵtextInterpolate, ɵɵgetCurrentView, ɵɵrestoreView, ɵɵpipe, ɵɵpipeBind1, ɵɵpropertyInterpolate1, ɵɵtextInterpolate1, Output, ɵɵviewQuery, ɵɵqueryRefresh, ɵɵloadQuery, ViewEncapsulation, ViewChild, ɵɵgetInheritedFactory, ɵɵprojection, TemplateRef, ɵɵprojectionDef, ɵɵcontentQuery, ContentChild, ɵɵclassProp, ContentChildren, ɵɵpropertyInterpolate, ɵɵdefineNgModule, ɵɵdefineInjector, ɵɵsetNgModuleScope, NgModule, ɵɵresolveDocument, Injector, ɵɵresolveWindow, ɵɵpureFunction3, ɵɵtextInterpolate2, ViewChildren, ɵɵpipeBind2, ɵɵInheritDefinitionFeature, ɵɵstyleProp, ɵɵsanitizeHtml, ɵɵsanitizeResourceUrl, ɵɵpureFunction0, ɵɵsetComponentScope, ComponentFactoryResolver, LOCALE_ID } from '@angular/core';
 import { NgIf, NgStyle, NgSwitch, NgSwitchCase, NgSwitchDefault, NgForOf, NgClass, AsyncPipe, DatePipe, NgTemplateOutlet, CommonModule, TitleCasePipe, NgComponentOutlet, NgPlural, NgPluralCase, UpperCasePipe, LowerCasePipe, JsonPipe, SlicePipe, DecimalPipe, PercentPipe, CurrencyPipe, I18nPluralPipe, I18nSelectPipe, KeyValuePipe, registerLocaleData } from '@angular/common';
 import { Resource, DocumentCollection, Service, DocumentResource, NgxJsonapiModule } from 'ngx-jsonapi';
 import { skipWhile, take, map, tap, switchMap, debounceTime, startWith, catchError, finalize, filter } from 'rxjs/operators';
@@ -10,7 +10,7 @@ import pullAt from 'lodash-es/pullAt';
 import { flatten, unionBy } from 'lodash-es';
 import { MediaMatcher, BreakpointObserver } from '@angular/cdk/layout';
 import { moveItemInArray, CdkDropList, CdkDrag, CdkDragHandle, CdkDragPlaceholder, CdkDragPreview, CdkDropListGroup, DragDropModule } from '@angular/cdk/drag-drop';
-import { FormArray, FormControl, Validators, FormBuilder, NgControlStatusGroup, FormGroupDirective, DefaultValueAccessor, NgControlStatus, FormControlDirective, FormControlName, FormGroupName, FormGroup, ɵangular_packages_forms_forms_y, NgModel, CheckboxControlValueAccessor, SelectControlValueAccessor, NgSelectOption, ɵangular_packages_forms_forms_x, FormsModule, ReactiveFormsModule, NumberValueAccessor, FormArrayName, MaxLengthValidator, RangeValueAccessor, SelectMultipleControlValueAccessor, RadioControlValueAccessor, RequiredValidator, MinLengthValidator, PatternValidator, CheckboxRequiredValidator, EmailValidator, NgModelGroup, NgForm } from '@angular/forms';
+import { FormArray, FormControl, Validators, FormBuilder, NgControlStatusGroup, FormGroupDirective, DefaultValueAccessor, NgControlStatus, FormControlDirective, FormControlName, FormGroupName, NgSelectOption, ɵangular_packages_forms_forms_x, FormGroup, ɵangular_packages_forms_forms_y, NgModel, CheckboxControlValueAccessor, SelectControlValueAccessor, FormsModule, ReactiveFormsModule, NumberValueAccessor, FormArrayName, MaxLengthValidator, RangeValueAccessor, SelectMultipleControlValueAccessor, RadioControlValueAccessor, RequiredValidator, MinLengthValidator, PatternValidator, CheckboxRequiredValidator, EmailValidator, NgModelGroup, NgForm } from '@angular/forms';
 import { CdkTextareaAutosize, TextFieldModule } from '@angular/cdk/text-field';
 import { DomSanitizer } from '@angular/platform-browser';
 import isWithinInterval from 'date-fns/isWithinInterval';
@@ -1297,6 +1297,18 @@ class IngredientsService extends Service {
         this.fetchReviewedNames();
         this.fetchReviewedUnits();
     }
+    getReviewedNames() {
+        if (!this.reviewedNames) {
+            this.fetchReviewedNames();
+        }
+        return this.reviewedNames;
+    }
+    getReviewedUnits() {
+        if (!this.reviewedUnits) {
+            this.fetchReviewedUnits();
+        }
+        return this.reviewedUnits;
+    }
     fetchReviewedNames() {
         return this.http.get(`${MIAM_API_HOST}ingredients-definitions/reviewed_names`).subscribe((reviewedNames) => {
             this.reviewedNames = reviewedNames;
@@ -1332,10 +1344,11 @@ class IngredientsService extends Service {
             return this.http.get(`${MIAM_API_HOST}quantity-units/reviewed_names`).pipe(switchMap(reviewedUnits => {
                 this.reviewedUnits = [...reviewedUnits.map(unitObject => unitObject['name'])];
                 // check if unit is in the list
-                return of(this.reviewedUnits.some(el => el === unit));
+                // rem: the case is not always lowered for all units
+                return of(this.reviewedUnits.some(el => el.toLowerCase() === unit.toLowerCase()));
             }));
         }
-        return of(this.reviewedUnits.some(el => el === unit));
+        return of(this.reviewedUnits.some(el => el.toLowerCase() === unit.toLowerCase()));
     }
     formatIngredients(listIngredient) {
         return forkJoin(listIngredient.map(el => this.get(`from_s?ingredient_str=${el}`)));
@@ -2561,6 +2574,28 @@ UserService.ɵprov = ɵɵdefineInjectable({ token: UserService, factory: UserSer
             }]
     }], function () { return [{ type: HttpClient }, { type: RecipeProviderService }, { type: ToastrService }, { type: SuppliersService }]; }, null); })();
 
+const MIAM_API_HOST$5 = `${environment.miamAPI}/api/v1/`;
+class UserFavoriteItemsService {
+    constructor(http, suppliersService) {
+        this.http = http;
+        this.suppliersService = suppliersService;
+    }
+    set_from_ext_ids(favoriteProductIds) {
+        return this.suppliersService.supplier$.asObservable().pipe(skipWhile(supp => !supp), take(1), switchMap(supplier => {
+            const body = { item_ext_ids: favoriteProductIds, supplier_id: supplier.id };
+            return this.http.post(`${MIAM_API_HOST$5}user-favorite-items/set_from_ext_ids`, body);
+        }));
+    }
+}
+UserFavoriteItemsService.ɵfac = function UserFavoriteItemsService_Factory(t) { return new (t || UserFavoriteItemsService)(ɵɵinject(HttpClient), ɵɵinject(SuppliersService)); };
+UserFavoriteItemsService.ɵprov = ɵɵdefineInjectable({ token: UserFavoriteItemsService, factory: UserFavoriteItemsService.ɵfac, providedIn: 'root' });
+/*@__PURE__*/ (function () { ɵsetClassMetadata(UserFavoriteItemsService, [{
+        type: Injectable,
+        args: [{
+                providedIn: 'root'
+            }]
+    }], function () { return [{ type: HttpClient }, { type: SuppliersService }]; }, null); })();
+
 var Icon;
 (function (Icon) {
     Icon[Icon["Calendar"] = 0] = "Calendar";
@@ -3198,11 +3233,12 @@ class BasketWrapper {
 const SMALL_SCREEN_BP = '(min-width: 1023px)';
 // Context shared between Miam SDK & host app
 class ContextService {
-    constructor(posService, listsService, basketsService, userService, recipesProvidersService, analyticsService, recipesService, mediaMatcher, suppliersService, breakpointObserver) {
+    constructor(posService, listsService, basketsService, userService, userFavoriteItemsService, recipesProvidersService, analyticsService, recipesService, mediaMatcher, suppliersService, breakpointObserver) {
         this.posService = posService;
         this.listsService = listsService;
         this.basketsService = basketsService;
         this.userService = userService;
+        this.userFavoriteItemsService = userFavoriteItemsService;
         this.recipesProvidersService = recipesProvidersService;
         this.analyticsService = analyticsService;
         this.recipesService = recipesService;
@@ -3325,6 +3361,9 @@ class ContextService {
                     this.listsService.refreshCurrentList();
                     this.userService.resetUserInfo();
                 },
+                setFavoriteItems: (favoriteProductIds) => {
+                    return this.userFavoriteItemsService.set_from_ext_ids(favoriteProductIds);
+                },
                 device: this.mediaMatcher,
                 isSmallScreen$: this.isSmallScreen$.asObservable()
             },
@@ -3369,14 +3408,14 @@ class ContextService {
         return this.userService.setUserInfo(forbidProfiling);
     }
 }
-ContextService.ɵfac = function ContextService_Factory(t) { return new (t || ContextService)(ɵɵinject(PointOfSalesService), ɵɵinject(GroceriesListsService), ɵɵinject(BasketsService), ɵɵinject(UserService), ɵɵinject(RecipeProviderService), ɵɵinject(AnalyticsService), ɵɵinject(RecipesService), ɵɵinject(MediaMatcher), ɵɵinject(SuppliersService), ɵɵinject(BreakpointObserver)); };
+ContextService.ɵfac = function ContextService_Factory(t) { return new (t || ContextService)(ɵɵinject(PointOfSalesService), ɵɵinject(GroceriesListsService), ɵɵinject(BasketsService), ɵɵinject(UserService), ɵɵinject(UserFavoriteItemsService), ɵɵinject(RecipeProviderService), ɵɵinject(AnalyticsService), ɵɵinject(RecipesService), ɵɵinject(MediaMatcher), ɵɵinject(SuppliersService), ɵɵinject(BreakpointObserver)); };
 ContextService.ɵprov = ɵɵdefineInjectable({ token: ContextService, factory: ContextService.ɵfac, providedIn: 'root' });
 /*@__PURE__*/ (function () { ɵsetClassMetadata(ContextService, [{
         type: Injectable,
         args: [{
                 providedIn: 'root'
             }]
-    }], function () { return [{ type: PointOfSalesService }, { type: GroceriesListsService }, { type: BasketsService }, { type: UserService }, { type: RecipeProviderService }, { type: AnalyticsService }, { type: RecipesService }, { type: MediaMatcher }, { type: SuppliersService }, { type: BreakpointObserver }]; }, null); })();
+    }], function () { return [{ type: PointOfSalesService }, { type: GroceriesListsService }, { type: BasketsService }, { type: UserService }, { type: UserFavoriteItemsService }, { type: RecipeProviderService }, { type: AnalyticsService }, { type: RecipesService }, { type: MediaMatcher }, { type: SuppliersService }, { type: BreakpointObserver }]; }, null); })();
 
 const _c0 = function (a0, a1) { return { "width": a0, "height": a1 }; };
 const _c1 = function (a0) { return { "width": a0 }; };
@@ -4902,70 +4941,83 @@ function ListInputComponent_ul_4_ng_container_1_Template(rf, ctx) { if (rf & 1)
     ɵɵadvance(1);
     ɵɵproperty("ngForOf", ctx_r4.list.controls)("ngForTrackBy", ctx_r4.trackByIndex);
 } }
+function ListInputComponent_ul_4_ng_template_2_li_0_option_9_Template(rf, ctx) { if (rf & 1) {
+    ɵɵelement(0, "option", 37);
+    ɵɵpipe(1, "capitalizeFirstLetter");
+} if (rf & 2) {
+    const ing_r26 = ctx.$implicit;
+    ɵɵproperty("value", ɵɵpipeBind1(1, 1, ing_r26));
+} }
+function ListInputComponent_ul_4_ng_template_2_li_0_option_14_Template(rf, ctx) { if (rf & 1) {
+    ɵɵelement(0, "option", 37);
+} if (rf & 2) {
+    const unit_r27 = ctx.$implicit;
+    ɵɵproperty("value", unit_r27);
+} }
 const _c0$1 = function (a0) { return { clickable: a0 }; };
-function ListInputComponent_ul_4_ng_template_2_li_0_label_12_img_1_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelement(0, "img", 39);
+function ListInputComponent_ul_4_ng_template_2_li_0_label_16_img_1_Template(rf, ctx) { if (rf & 1) {
+    ɵɵelement(0, "img", 41);
 } if (rf & 2) {
     const row_r18 = ɵɵnextContext(2).$implicit;
-    const ctx_r24 = ɵɵnextContext(3);
-    ɵɵproperty("ngClass", ɵɵpureFunction1(2, _c0$1, ctx_r24.ingredientsPictures.editable))("src", row_r18.controls.attributes.controls["picture-url"].value, ɵɵsanitizeUrl);
+    const ctx_r28 = ɵɵnextContext(3);
+    ɵɵproperty("ngClass", ɵɵpureFunction1(2, _c0$1, ctx_r28.ingredientsPictures.editable))("src", row_r18.controls.attributes.controls["picture-url"].value, ɵɵsanitizeUrl);
 } }
-function ListInputComponent_ul_4_ng_template_2_li_0_label_12_ng_miam_icon_2_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelement(0, "ng-miam-icon", 40);
+function ListInputComponent_ul_4_ng_template_2_li_0_label_16_ng_miam_icon_2_Template(rf, ctx) { if (rf & 1) {
+    ɵɵelement(0, "ng-miam-icon", 42);
 } if (rf & 2) {
-    const ctx_r25 = ɵɵnextContext(5);
-    ɵɵproperty("iconName", ctx_r25.icon.Picture);
+    const ctx_r29 = ɵɵnextContext(5);
+    ɵɵproperty("iconName", ctx_r29.icon.Picture);
 } }
-function ListInputComponent_ul_4_ng_template_2_li_0_label_12_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "label", 36);
-    ɵɵtemplate(1, ListInputComponent_ul_4_ng_template_2_li_0_label_12_img_1_Template, 1, 4, "img", 37);
-    ɵɵtemplate(2, ListInputComponent_ul_4_ng_template_2_li_0_label_12_ng_miam_icon_2_Template, 1, 1, "ng-miam-icon", 38);
+function ListInputComponent_ul_4_ng_template_2_li_0_label_16_Template(rf, ctx) { if (rf & 1) {
+    ɵɵelementStart(0, "label", 38);
+    ɵɵtemplate(1, ListInputComponent_ul_4_ng_template_2_li_0_label_16_img_1_Template, 1, 4, "img", 39);
+    ɵɵtemplate(2, ListInputComponent_ul_4_ng_template_2_li_0_label_16_ng_miam_icon_2_Template, 1, 1, "ng-miam-icon", 40);
     ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r27 = ɵɵnextContext();
-    const i_r19 = ctx_r27.index;
-    const row_r18 = ctx_r27.$implicit;
-    const ctx_r20 = ɵɵnextContext(3);
+    const ctx_r31 = ɵɵnextContext();
+    const i_r19 = ctx_r31.index;
+    const row_r18 = ctx_r31.$implicit;
+    const ctx_r22 = ɵɵnextContext(3);
     ɵɵpropertyInterpolate1("for", "ing-picture-", i_r19, "");
     ɵɵadvance(1);
     ɵɵproperty("ngIf", row_r18.controls.attributes.controls["picture-url"] == null ? null : row_r18.controls.attributes.controls["picture-url"].value);
     ɵɵadvance(1);
-    ɵɵproperty("ngIf", !(row_r18.controls.attributes.controls["picture-url"] == null ? null : row_r18.controls.attributes.controls["picture-url"].value) && ctx_r20.ingredientsPictures.editable);
+    ɵɵproperty("ngIf", !(row_r18.controls.attributes.controls["picture-url"] == null ? null : row_r18.controls.attributes.controls["picture-url"].value) && ctx_r22.ingredientsPictures.editable);
 } }
-function ListInputComponent_ul_4_ng_template_2_li_0_input_13_Template(rf, ctx) { if (rf & 1) {
-    const _r29 = ɵɵgetCurrentView();
-    ɵɵelementStart(0, "input", 41);
-    ɵɵlistener("change", function ListInputComponent_ul_4_ng_template_2_li_0_input_13_Template_input_change_0_listener($event) { ɵɵrestoreView(_r29); const row_r18 = ɵɵnextContext().$implicit; const ctx_r28 = ɵɵnextContext(3); return ctx_r28.uploadIngredientPicture($event.target.files, row_r18.controls.attributes.controls["picture-url"]); });
+function ListInputComponent_ul_4_ng_template_2_li_0_input_17_Template(rf, ctx) { if (rf & 1) {
+    const _r33 = ɵɵgetCurrentView();
+    ɵɵelementStart(0, "input", 43);
+    ɵɵlistener("change", function ListInputComponent_ul_4_ng_template_2_li_0_input_17_Template_input_change_0_listener($event) { ɵɵrestoreView(_r33); const row_r18 = ɵɵnextContext().$implicit; const ctx_r32 = ɵɵnextContext(3); return ctx_r32.uploadIngredientPicture($event.target.files, row_r18.controls.attributes.controls["picture-url"]); });
     ɵɵelementEnd();
 } if (rf & 2) {
     const i_r19 = ɵɵnextContext().index;
     ɵɵpropertyInterpolate1("id", "ing-picture-", i_r19, "");
 } }
-function ListInputComponent_ul_4_ng_template_2_li_0_div_15_Template(rf, ctx) { if (rf & 1) {
+function ListInputComponent_ul_4_ng_template_2_li_0_div_19_Template(rf, ctx) { if (rf & 1) {
     ɵɵelement(0, "div", 23);
 } }
-function ListInputComponent_ul_4_ng_template_2_li_0_div_16_Template(rf, ctx) { if (rf & 1) {
+function ListInputComponent_ul_4_ng_template_2_li_0_div_20_Template(rf, ctx) { if (rf & 1) {
     ɵɵelementStart(0, "div", 24);
-    ɵɵelement(1, "ng-miam-icon", 42);
-    ɵɵelementStart(2, "span", 43);
+    ɵɵelement(1, "ng-miam-icon", 44);
+    ɵɵelementStart(2, "span", 45);
     ɵɵtext(3);
     ɵɵpipe(4, "capitalizeFirstLetter");
     ɵɵelementEnd();
-    ɵɵelementStart(5, "span", 43);
+    ɵɵelementStart(5, "span", 45);
     ɵɵtext(6);
     ɵɵelementEnd();
-    ɵɵelementStart(7, "span", 43);
+    ɵɵelementStart(7, "span", 45);
     ɵɵtext(8);
     ɵɵelementEnd();
     ɵɵelementEnd();
 } if (rf & 2) {
     const row_r18 = ɵɵnextContext().$implicit;
-    const ctx_r23 = ɵɵnextContext(3);
+    const ctx_r25 = ɵɵnextContext(3);
     var tmp_1_0 = null;
     var tmp_2_0 = null;
     var tmp_3_0 = null;
     ɵɵadvance(1);
-    ɵɵproperty("iconName", ctx_r23.icon.Grip);
+    ɵɵproperty("iconName", ctx_r25.icon.Grip);
     ɵɵadvance(2);
     ɵɵtextInterpolate(ɵɵpipeBind1(4, 4, row_r18 == null ? null : (tmp_1_0 = row_r18.get("attributes")) == null ? null : tmp_1_0.get("name").value));
     ɵɵadvance(3);
@@ -4974,7 +5026,7 @@ function ListInputComponent_ul_4_ng_template_2_li_0_div_16_Template(rf, ctx) { i
     ɵɵtextInterpolate(row_r18 == null ? null : (tmp_3_0 = row_r18.get("attributes")) == null ? null : tmp_3_0.get("unit").value);
 } }
 function ListInputComponent_ul_4_ng_template_2_li_0_Template(rf, ctx) { if (rf & 1) {
-    const _r34 = ɵɵgetCurrentView();
+    const _r38 = ɵɵgetCurrentView();
     ɵɵelementStart(0, "li", 14);
     ɵɵelementStart(1, "div", 27);
     ɵɵelementStart(2, "div", 28);
@@ -4984,21 +5036,27 @@ function ListInputComponent_ul_4_ng_template_2_li_0_Template(rf, ctx) { if (rf &
     ɵɵelement(5, "input", 30);
     ɵɵpipe(6, "async");
     ɵɵpipe(7, "capitalizeFirstLetter");
-    ɵɵelementStart(8, "input", 31);
-    ɵɵlistener("ngModelChange", function ListInputComponent_ul_4_ng_template_2_li_0_Template_input_ngModelChange_8_listener($event) { ɵɵrestoreView(_r34); const i_r19 = ctx.index; const ctx_r33 = ɵɵnextContext(3); return ctx_r33.updateQuantityValue($event, i_r19); });
+    ɵɵelementStart(8, "datalist");
+    ɵɵtemplate(9, ListInputComponent_ul_4_ng_template_2_li_0_option_9_Template, 2, 3, "option", 31);
+    ɵɵelementEnd();
+    ɵɵelementStart(10, "input", 32);
+    ɵɵlistener("ngModelChange", function ListInputComponent_ul_4_ng_template_2_li_0_Template_input_ngModelChange_10_listener($event) { ɵɵrestoreView(_r38); const i_r19 = ctx.index; const ctx_r37 = ɵɵnextContext(3); return ctx_r37.updateQuantityValue($event, i_r19); });
+    ɵɵelementEnd();
+    ɵɵelement(11, "input", 33);
+    ɵɵpipe(12, "async");
+    ɵɵelementStart(13, "datalist");
+    ɵɵtemplate(14, ListInputComponent_ul_4_ng_template_2_li_0_option_14_Template, 1, 1, "option", 31);
     ɵɵelementEnd();
-    ɵɵelement(9, "input", 32);
-    ɵɵpipe(10, "async");
     ɵɵelementEnd();
     ɵɵelementEnd();
-    ɵɵelementStart(11, "div", 33);
-    ɵɵtemplate(12, ListInputComponent_ul_4_ng_template_2_li_0_label_12_Template, 3, 3, "label", 34);
-    ɵɵtemplate(13, ListInputComponent_ul_4_ng_template_2_li_0_input_13_Template, 1, 1, "input", 35);
-    ɵɵelementStart(14, "ng-miam-icon", 20);
-    ɵɵlistener("click", function ListInputComponent_ul_4_ng_template_2_li_0_Template_ng_miam_icon_click_14_listener() { ɵɵrestoreView(_r34); const i_r19 = ctx.index; const ctx_r35 = ɵɵnextContext(3); return ctx_r35.delete(i_r19); });
+    ɵɵelementStart(15, "div", 34);
+    ɵɵtemplate(16, ListInputComponent_ul_4_ng_template_2_li_0_label_16_Template, 3, 3, "label", 35);
+    ɵɵtemplate(17, ListInputComponent_ul_4_ng_template_2_li_0_input_17_Template, 1, 1, "input", 36);
+    ɵɵelementStart(18, "ng-miam-icon", 20);
+    ɵɵlistener("click", function ListInputComponent_ul_4_ng_template_2_li_0_Template_ng_miam_icon_click_18_listener() { ɵɵrestoreView(_r38); const i_r19 = ctx.index; const ctx_r39 = ɵɵnextContext(3); return ctx_r39.delete(i_r19); });
     ɵɵelementEnd();
-    ɵɵtemplate(15, ListInputComponent_ul_4_ng_template_2_li_0_div_15_Template, 1, 0, "div", 21);
-    ɵɵtemplate(16, ListInputComponent_ul_4_ng_template_2_li_0_div_16_Template, 9, 6, "div", 22);
+    ɵɵtemplate(19, ListInputComponent_ul_4_ng_template_2_li_0_div_19_Template, 1, 0, "div", 21);
+    ɵɵtemplate(20, ListInputComponent_ul_4_ng_template_2_li_0_div_20_Template, 9, 6, "div", 22);
     ɵɵelementEnd();
     ɵɵelementEnd();
 } if (rf & 2) {
@@ -5010,12 +5068,22 @@ function ListInputComponent_ul_4_ng_template_2_li_0_Template(rf, ctx) { if (rf &
     ɵɵadvance(2);
     ɵɵproperty("iconName", ctx_r17.icon.Grip);
     ɵɵadvance(2);
-    ɵɵproperty("ngClass", ɵɵpipeBind1(6, 12, ctx_r17.isIngredientReviewed(row_r18["controls"]["attributes"]["controls"]["name"].value)) ? "alert-success" : "alert-danger")("ngModel", ɵɵpipeBind1(7, 14, row_r18["controls"]["attributes"]["controls"]["name"].value))("formControl", row_r18["controls"]["attributes"]["controls"]["name"]);
+    ɵɵproperty("ngClass", ɵɵpipeBind1(6, 18, ctx_r17.isIngredientReviewed(row_r18["controls"]["attributes"]["controls"]["name"].value)) ? "alert-success" : "alert-danger")("ngModel", ɵɵpipeBind1(7, 20, row_r18["controls"]["attributes"]["controls"]["name"].value))("formControl", row_r18["controls"]["attributes"]["controls"]["name"]);
+    ɵɵattribute("list", "miam-list-input-dropdown-ingredients-id" + i_r19);
     ɵɵadvance(3);
+    ɵɵattribute("id", "miam-list-input-dropdown-ingredients-id" + i_r19);
+    ɵɵadvance(1);
+    ɵɵproperty("ngForOf", ctx_r17.getFilteredNameFromIndex(i_r19));
+    ɵɵadvance(1);
     ɵɵproperty("ngModel", row_r18["controls"]["attributes"]["controls"]["quantity"].value)("formControl", row_r18["controls"]["attributes"]["controls"]["quantity"]);
     ɵɵadvance(1);
-    ɵɵproperty("ngClass", ɵɵpipeBind1(10, 16, ctx_r17.isQuantityReviewed(row_r18["controls"]["attributes"]["controls"]["unit"].value)) ? "alert-success" : "alert-danger")("formControl", row_r18["controls"]["attributes"]["controls"]["unit"]);
-    ɵɵadvance(3);
+    ɵɵproperty("ngClass", ɵɵpipeBind1(12, 22, ctx_r17.isQuantityReviewed(row_r18["controls"]["attributes"]["controls"]["unit"].value)) ? "alert-success" : "alert-danger")("formControl", row_r18["controls"]["attributes"]["controls"]["unit"]);
+    ɵɵattribute("list", "miam-list-input-dropdown-units-id" + i_r19);
+    ɵɵadvance(2);
+    ɵɵattribute("id", "miam-list-input-dropdown-units-id" + i_r19);
+    ɵɵadvance(1);
+    ɵɵproperty("ngForOf", ctx_r17.getFilteredUnitsFromIndex(i_r19));
+    ɵɵadvance(2);
     ɵɵproperty("ngIf", ctx_r17.ingredientsPictures.visible);
     ɵɵadvance(1);
     ɵɵproperty("ngIf", ctx_r17.ingredientsPictures.visible && ctx_r17.ingredientsPictures.editable);
@@ -5023,15 +5091,15 @@ function ListInputComponent_ul_4_ng_template_2_li_0_Template(rf, ctx) { if (rf &
     ɵɵproperty("iconName", ctx_r17.icon.Trash);
 } }
 function ListInputComponent_ul_4_ng_template_2_Template(rf, ctx) { if (rf & 1) {
-    ɵɵtemplate(0, ListInputComponent_ul_4_ng_template_2_li_0_Template, 17, 18, "li", 13);
+    ɵɵtemplate(0, ListInputComponent_ul_4_ng_template_2_li_0_Template, 21, 24, "li", 13);
 } if (rf & 2) {
     const ctx_r6 = ɵɵnextContext(2);
     ɵɵproperty("ngForOf", ctx_r6.list.controls)("ngForTrackBy", ctx_r6.trackByIndex);
 } }
 function ListInputComponent_ul_4_Template(rf, ctx) { if (rf & 1) {
-    const _r37 = ɵɵgetCurrentView();
+    const _r41 = ɵɵgetCurrentView();
     ɵɵelementStart(0, "ul", 10);
-    ɵɵlistener("cdkDropListDropped", function ListInputComponent_ul_4_Template_ul_cdkDropListDropped_0_listener($event) { ɵɵrestoreView(_r37); const ctx_r36 = ɵɵnextContext(); return ctx_r36.drop($event); });
+    ɵɵlistener("cdkDropListDropped", function ListInputComponent_ul_4_Template_ul_cdkDropListDropped_0_listener($event) { ɵɵrestoreView(_r41); const ctx_r40 = ɵɵnextContext(); return ctx_r40.drop($event); });
     ɵɵtemplate(1, ListInputComponent_ul_4_ng_container_1_Template, 2, 2, "ng-container", 11);
     ɵɵtemplate(2, ListInputComponent_ul_4_ng_template_2_Template, 1, 2, "ng-template", null, 12, ɵɵtemplateRefExtractor);
     ɵɵelementEnd();
@@ -5042,9 +5110,9 @@ function ListInputComponent_ul_4_Template(rf, ctx) { if (rf & 1) {
     ɵɵproperty("ngIf", !ctx_r0.ingredientMode)("ngIfElse", _r5);
 } }
 function ListInputComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 44);
-    ɵɵelement(1, "ng-miam-icon", 45);
-    ɵɵelementStart(2, "span", 46);
+    ɵɵelementStart(0, "div", 46);
+    ɵɵelement(1, "ng-miam-icon", 47);
+    ɵɵelementStart(2, "span", 48);
     ɵɵtext(3);
     ɵɵelementEnd();
     ɵɵelementEnd();
@@ -5056,7 +5124,7 @@ function ListInputComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
     ɵɵtextInterpolate1("Oups... c\u2019est vide, commencez \u00E0 ajouter des ", ctx_r2.hint, " !");
 } }
 function ListInputComponent_div_13_Template(rf, ctx) { if (rf & 1) {
-    ɵɵelementStart(0, "div", 47);
+    ɵɵelementStart(0, "div", 49);
     ɵɵtext(1);
     ɵɵelementEnd();
 } if (rf & 2) {
@@ -5077,6 +5145,7 @@ class ListInputComponent {
         this.deleteId = new EventEmitter();
         this.orderHasChanged = new EventEmitter();
         this.previousQuantities = [];
+        this.maxSelectionNumber = 5;
     }
     delete(index) {
         var _a;
@@ -5178,9 +5247,47 @@ class ListInputComponent {
             this.cdr.detectChanges();
         };
     }
+    /**
+     * filter using the input the possible ingredient name the user might want
+     * @param index
+     */
+    getFilteredNameFromIndex(index) {
+        const input = this.list.controls[index].value.attributes.name.toLowerCase();
+        const possibleSelection = this.ingredientService.getReviewedNames();
+        return this.filterPossibleSelectionFromInput(input, possibleSelection);
+    }
+    /**
+     * filter using the input the possible unit the user might want
+     * @param index
+     */
+    getFilteredUnitsFromIndex(index) {
+        const input = this.list.controls[index].value.attributes.unit.toLowerCase();
+        const possibleSelection = this.ingredientService.getReviewedUnits();
+        return this.filterPossibleSelectionFromInput(input, possibleSelection);
+    }
+    /**
+     * Generic method to filter the name and the unit
+     * @param input user input
+     * @param possibleSelection possible selection to display to the user
+     * @private
+     */
+    filterPossibleSelectionFromInput(input, possibleSelection) {
+        const filteredSelection = [];
+        const inputLC = input.toLowerCase();
+        for (const selection of possibleSelection) {
+            const selectionLC = selection.toLowerCase();
+            if (selectionLC.includes(inputLC) && selectionLC !== inputLC) {
+                filteredSelection.push(selection);
+            }
+            if (filteredSelection.length >= this.maxSelectionNumber) {
+                break;
+            }
+        }
+        return filteredSelection;
+    }
 }
 ListInputComponent.ɵfac = function ListInputComponent_Factory(t) { return new (t || ListInputComponent)(ɵɵdirectiveInject(IngredientsService), ɵɵdirectiveInject(FormBuilder), ɵɵdirectiveInject(ChangeDetectorRef)); };
-ListInputComponent.ɵcmp = ɵɵdefineComponent({ type: ListInputComponent, selectors: [["ng-miam-list-input"]], inputs: { hint: "hint", placeholder: "placeholder", label: "label", instructions: "instructions", ingredientMode: "ingredientMode", list: "list", ingredientsPictures: "ingredientsPictures" }, outputs: { deleteId: "deleteId", orderHasChanged: "orderHasChanged" }, decls: 14, vars: 7, consts: [[1, "miam-list-input"], [1, "miam-list-input__list", 3, "formGroup"], [1, "miam-list-input__list__label"], ["class", "miam-list-input__container m-default-card", "cdkDropList", "", 3, "cdkDropListDropped", 4, "ngIf", "ngIfElse"], ["hintPlaceholder", ""], [1, "miam-list-input__actions"], ["matInput", "", "cdkTextareaAutosize", "", "cdkAutosizeMinRows", "4", "cdkAutosizeMaxRows", "4", 1, "m-input", 3, "formControl", "keydown.enter"], [1, "m-button-primary", 3, "mousedown", "mouseup"], [1, "miam-list-input__instructions__direction"], ["class", "miam-list-input__actions__instructions", 4, "ngIf"], ["cdkDropList", "", 1, "miam-list-input__container", "m-default-card", 3, "cdkDropListDropped"], [4, "ngIf", "ngIfElse"], ["ingredientRow", ""], ["cdkDrag", "", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", ""], [3, "formGroup"], [1, "miam-list-input__container__row", "m-default-card"], ["primaryColor", "var(--m-color-grey05)", "cdkDragHandle", "", 1, "miam-list-input__row__grip", 3, "iconName"], ["cdkTextareaAutosize", "true", "cdkAutosizeMinRows", "1", "cdkAutosizeMaxRows", "50", "formControlName", "description", 1, "m-input", 3, "blur"], ["autosize", "cdkTextareaAutosize"], ["primaryColor", "var(--m-color-grey05)", 1, "miam-list-input__row__trash", 3, "iconName", "click"], ["class", "miam-list-input__row__placeholder", 4, "cdkDragPlaceholder"], ["class", "miam-list-input__row__preview m-default-card", 4, "cdkDragPreview"], [1, "miam-list-input__row__placeholder"], [1, "miam-list-input__row__preview", "m-default-card"], ["primaryColor", "var(--m-color-grey05)", "cdkDragHandle", "", 3, "iconName"], [1, "miam-list-input__preview__text", "m-body-typo"], [1, "miam-list-input__container__row", "m-default-card", 3, "formGroupName"], [1, "miam-list-input__row__left"], [1, "miam-list-input__row__right"], [1, "m-input", 3, "ngClass", "ngModel", "formControl"], ["maxSize", "4", "autoWidthInput", "", 1, "m-input", 3, "ngModel", "formControl", "ngModelChange"], ["maxSize", "8", "autoWidthInput", "", 1, "m-input", 3, "ngClass", "formControl"], [1, "miam-list-input__row__controls"], [3, "for", 4, "ngIf"], ["type", "file", "accept", "image/jpeg, image/png, image/webp", 3, "id", "change", 4, "ngIf"], [3, "for"], ["class", "miam-list-input__row__picture", 3, "ngClass", "src", 4, "ngIf"], ["class", "miam-list-input__row__trash", "primaryColor", "var(--m-color-grey05)", 3, "iconName", 4, "ngIf"], [1, "miam-list-input__row__picture", 3, "ngClass", "src"], ["primaryColor", "var(--m-color-grey05)", 1, "miam-list-input__row__trash", 3, "iconName"], ["type", "file", "accept", "image/jpeg, image/png, image/webp", 3, "id", "change"], ["primaryColor", "var(--m-color-grey-text-dark)", "cdkDragHandle", "", 3, "iconName"], [1, "m-body-typo"], [1, "miam-list-input__placeholder", "miam-list-input__container", "m-default-card"], ["primaryColor", "var(--m-color-grey-text-dark)", 3, "width", "height", "iconName"], [1, "miam-list-input__placeholder__hint", "m-body-typo"], [1, "miam-list-input__actions__instructions"]], template: function ListInputComponent_Template(rf, ctx) { if (rf & 1) {
+ListInputComponent.ɵcmp = ɵɵdefineComponent({ type: ListInputComponent, selectors: [["ng-miam-list-input"]], inputs: { hint: "hint", placeholder: "placeholder", label: "label", instructions: "instructions", ingredientMode: "ingredientMode", list: "list", ingredientsPictures: "ingredientsPictures" }, outputs: { deleteId: "deleteId", orderHasChanged: "orderHasChanged" }, decls: 14, vars: 7, consts: [[1, "miam-list-input"], [1, "miam-list-input__list", 3, "formGroup"], [1, "miam-list-input__list__label"], ["class", "miam-list-input__container m-default-card", "cdkDropList", "", 3, "cdkDropListDropped", 4, "ngIf", "ngIfElse"], ["hintPlaceholder", ""], [1, "miam-list-input__actions"], ["matInput", "", "cdkTextareaAutosize", "", "cdkAutosizeMinRows", "4", "cdkAutosizeMaxRows", "4", 1, "m-input", 3, "formControl", "keydown.enter"], [1, "m-button-primary", 3, "mousedown", "mouseup"], [1, "miam-list-input__instructions__direction"], ["class", "miam-list-input__actions__instructions", 4, "ngIf"], ["cdkDropList", "", 1, "miam-list-input__container", "m-default-card", 3, "cdkDropListDropped"], [4, "ngIf", "ngIfElse"], ["ingredientRow", ""], ["cdkDrag", "", 4, "ngFor", "ngForOf", "ngForTrackBy"], ["cdkDrag", ""], [3, "formGroup"], [1, "miam-list-input__container__row", "m-default-card"], ["primaryColor", "var(--m-color-grey05)", "cdkDragHandle", "", 1, "miam-list-input__row__grip", 3, "iconName"], ["cdkTextareaAutosize", "true", "cdkAutosizeMinRows", "1", "cdkAutosizeMaxRows", "50", "formControlName", "description", 1, "m-input", 3, "blur"], ["autosize", "cdkTextareaAutosize"], ["primaryColor", "var(--m-color-grey05)", 1, "miam-list-input__row__trash", 3, "iconName", "click"], ["class", "miam-list-input__row__placeholder", 4, "cdkDragPlaceholder"], ["class", "miam-list-input__row__preview m-default-card", 4, "cdkDragPreview"], [1, "miam-list-input__row__placeholder"], [1, "miam-list-input__row__preview", "m-default-card"], ["primaryColor", "var(--m-color-grey05)", "cdkDragHandle", "", 3, "iconName"], [1, "miam-list-input__preview__text", "m-body-typo"], [1, "miam-list-input__container__row", "m-default-card", 3, "formGroupName"], [1, "miam-list-input__row__left"], [1, "miam-list-input__row__right"], [1, "m-input", 3, "ngClass", "ngModel", "formControl"], [3, "value", 4, "ngFor", "ngForOf"], ["maxSize", "4", "autoWidthInput", "", 1, "m-input", 3, "ngModel", "formControl", "ngModelChange"], ["maxSize", "8", "autoWidthInput", "", 1, "m-input", 3, "ngClass", "formControl"], [1, "miam-list-input__row__controls"], [3, "for", 4, "ngIf"], ["type", "file", "accept", "image/jpeg, image/png, image/webp", 3, "id", "change", 4, "ngIf"], [3, "value"], [3, "for"], ["class", "miam-list-input__row__picture", 3, "ngClass", "src", 4, "ngIf"], ["class", "miam-list-input__row__trash", "primaryColor", "var(--m-color-grey05)", 3, "iconName", 4, "ngIf"], [1, "miam-list-input__row__picture", 3, "ngClass", "src"], ["primaryColor", "var(--m-color-grey05)", 1, "miam-list-input__row__trash", 3, "iconName"], ["type", "file", "accept", "image/jpeg, image/png, image/webp", 3, "id", "change"], ["primaryColor", "var(--m-color-grey-text-dark)", "cdkDragHandle", "", 3, "iconName"], [1, "m-body-typo"], [1, "miam-list-input__placeholder", "miam-list-input__container", "m-default-card"], ["primaryColor", "var(--m-color-grey-text-dark)", 3, "width", "height", "iconName"], [1, "miam-list-input__placeholder__hint", "m-body-typo"], [1, "miam-list-input__actions__instructions"]], template: function ListInputComponent_Template(rf, ctx) { if (rf & 1) {
         ɵɵelementStart(0, "div", 0);
         ɵɵelementStart(1, "div", 1);
         ɵɵelementStart(2, "div", 2);
@@ -5216,7 +5323,7 @@ ListInputComponent.ɵcmp = ɵɵdefineComponent({ type: ListInputComponent, selec
         ɵɵattribute("placeholder", ctx.placeholder);
         ɵɵadvance(5);
         ɵɵproperty("ngIf", ctx.instructions);
-    } }, directives: [NgControlStatusGroup, FormGroupDirective, NgIf, CdkTextareaAutosize, DefaultValueAccessor, NgControlStatus, FormControlDirective, CdkDropList, NgForOf, CdkDrag, IconComponent, CdkDragHandle, FormControlName, CdkDragPlaceholder, CdkDragPreview, FormGroupName, NgClass, AutowidthInputDirective], pipes: [AsyncPipe, CapitalizeFirstLetterPipe], styles: [".miam-list-input[_ngcontent-%COMP%]{padding:8px}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]{width:calc(100% - 16px)}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]{margin-top:50px;position:relative}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]{width:55%}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__list__label[_ngcontent-%COMP%]{background-color:var(--m-color-secondary-light);border-radius:8px 8px 0 0;color:var(--m-color-secondary);font-weight:700;left:0;padding:8px 24px;position:absolute;top:-33px;width:200px;z-index:0}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;height:400px;margin-bottom:32px;overflow-x:hidden;overflow-y:auto;position:inherit;z-index:1}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]{height:55vh;margin-bottom:16px;width:unset}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-button{height:20px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-track{background:var(--m-color-grey)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar{cursor:-webkit-grab;height:7px;width:5px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--m-color-primary);border-radius:5px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;row-gap:8px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-column-gap:16px;align-items:center;column-gap:16px;display:flex;list-style:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-column-gap:0;column-gap:0}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;display:flex;flex:1;flex-direction:row;gap:16px;user-select:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]{margin-right:4px}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{max-width:unset;padding:inherit}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin:unset;max-width:unset;min-width:unset}@media (max-width:359px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{max-width:60vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]{align-items:center;display:flex;flex-direction:row}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .miam-list-input__row__grip[_ngcontent-%COMP%]{cursor:move}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .miam-list-input__row__grip[_ngcontent-%COMP%]{margin-left:4px}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin-left:8px;margin-right:8px;width:200px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{align-items:center;display:flex;flex:1;flex-direction:row}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin-right:8px;width:80px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]:first-child{flex:1}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]:last-child{margin-right:0;text-align:right}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{flex-wrap:wrap}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{flex:1;margin-bottom:8px;margin-right:4px}}@media (max-width:359px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{max-width:60vw}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{max-width:58vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .alert-success[_ngcontent-%COMP%]{background:var(--m-color-white);border:1px solid var(--m-color-success);border-radius:8px;box-shadow:0 0 4px var(--m-color-success)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .alert-danger[_ngcontent-%COMP%]{background:var(--m-color-white);border:1px solid var(--m-color-danger);border-radius:8px;box-shadow:0 0 4px var(--m-color-danger)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]{align-items:center;display:flex;gap:8px;justify-content:space-between}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{display:flex;justify-content:center;width:50px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   .miam-list-input__row__picture[_ngcontent-%COMP%]{-webkit-tap-highlight-color:transparent;width:50px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   .miam-list-input__row__picture.clickable[_ngcontent-%COMP%]{cursor:pointer}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{display:none}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   .miam-list-input__row__trash[_ngcontent-%COMP%]{-webkit-tap-highlight-color:transparent;cursor:pointer}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{border-radius:var(--m-border-radius);flex:1;margin:0;max-width:none;outline:none;padding:5px;resize:none}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea.warnning[_ngcontent-%COMP%]{background-color:var(--m-color-secondary-light);color:var(--m-color-secondary)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea.error[_ngcontent-%COMP%]{background-color:var(--m-color-danger);color:var(--m-color-danger-text)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea[cdktextareaautosize][_ngcontent-%COMP%]{overflow:hidden}.miam-list-input[_ngcontent-%COMP%]   .hint[_ngcontent-%COMP%]{border-radius:var(--m-border-radius);flex:1;font-size:12px;font-weight:600;padding-bottom:10px}.miam-list-input[_ngcontent-%COMP%]   .hint.warnning[_ngcontent-%COMP%]{color:var(--m-color-secondary)}.miam-list-input[_ngcontent-%COMP%]   .hint.error[_ngcontent-%COMP%]{color:var(--m-color-danger)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__placeholder[_ngcontent-%COMP%]{align-items:center;justify-content:center}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__placeholder[_ngcontent-%COMP%]   .miam-list-input__placeholder__hint[_ngcontent-%COMP%]{color:var(--m-color-secondary);margin-top:40px;opacity:.5;text-align:center}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{-moz-column-gap:32px;column-gap:32px;display:flex;justify-content:space-between}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{width:calc(45% - 32px)}}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{flex-direction:column}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{flex:1;margin-top:0;outline:none;resize:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{width:90vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__actions__instructions[_ngcontent-%COMP%]{background-color:var(--m-color-info);border-radius:8px;color:var(--m-color-info-text);max-width:calc(98vw - 776px);padding:8px;position:absolute;top:315px;white-space:pre-line;width:400px}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__actions__instructions[_ngcontent-%COMP%]{margin-top:16px;max-width:unset;position:unset;width:unset}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__instructions__direction[_ngcontent-%COMP%]{margin-left:4px}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__instructions__direction[_ngcontent-%COMP%]{display:none}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.miam-list-input__row__preview[_ngcontent-%COMP%]{align-items:center;display:flex;width:530px}@media (max-width:1023px){.miam-list-input__row__preview[_ngcontent-%COMP%]{flex-wrap:wrap;width:80vw}}.miam-list-input__row__preview[_ngcontent-%COMP%]   .miam-list-input__preview__text[_ngcontent-%COMP%]{padding:5px}.miam-list-input__row__preview[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type{flex:1;flex-shrink:1;margin-left:8px}.miam-list-input__row__preview[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:nth-of-type(2n){margin-right:8px}.miam-list-input__row__placeholder[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;background:var(--m-color-grey07);border-radius:8px;margin-right:24px;min-height:60px;user-select:none}.cdk-drag-animating[_ngcontent-%COMP%], .miam-list-input__row__placeholder[_ngcontent-%COMP%], ul.cdk-drop-list-dragging[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}"] });
+    } }, directives: [NgControlStatusGroup, FormGroupDirective, NgIf, CdkTextareaAutosize, DefaultValueAccessor, NgControlStatus, FormControlDirective, CdkDropList, NgForOf, CdkDrag, IconComponent, CdkDragHandle, FormControlName, CdkDragPlaceholder, CdkDragPreview, FormGroupName, NgClass, AutowidthInputDirective, NgSelectOption, ɵangular_packages_forms_forms_x], pipes: [AsyncPipe, CapitalizeFirstLetterPipe], styles: [".miam-list-input[_ngcontent-%COMP%]{padding:8px}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]{width:calc(100% - 16px)}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]{margin-top:50px;position:relative}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]{width:55%}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__list__label[_ngcontent-%COMP%]{background-color:var(--m-color-secondary-light);border-radius:8px 8px 0 0;color:var(--m-color-secondary);font-weight:700;left:0;padding:8px 24px;position:absolute;top:-33px;width:200px;z-index:0}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]{display:flex;flex-direction:column;height:400px;margin-bottom:32px;overflow-x:hidden;overflow-y:auto;position:inherit;z-index:1}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]{height:55vh;margin-bottom:16px;width:unset}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-button{height:20px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-track{background:var(--m-color-grey)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar{cursor:-webkit-grab;height:7px;width:5px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   .miam-list-input__container[_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--m-color-primary);border-radius:5px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]{display:flex;justify-content:flex-start;row-gap:8px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-column-gap:16px;align-items:center;column-gap:16px;display:flex;list-style:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]{-moz-column-gap:0;column-gap:0}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;align-items:center;display:flex;flex:1;flex-direction:row;gap:16px;user-select:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]{margin-right:4px}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{max-width:unset;padding:inherit}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin:unset;max-width:unset;min-width:unset}@media (max-width:359px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{max-width:60vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]{align-items:center;display:flex;flex-direction:row}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .miam-list-input__row__grip[_ngcontent-%COMP%]{cursor:move}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .miam-list-input__row__grip[_ngcontent-%COMP%]{margin-left:4px}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__left[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin-left:8px;margin-right:8px;width:200px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{align-items:center;display:flex;flex:1;flex-direction:row}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{margin-right:8px;width:80px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]:first-child{flex:1}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]:last-child{margin-right:0;text-align:right}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{flex-wrap:wrap}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{flex:1;margin-bottom:8px;margin-right:4px}}@media (max-width:359px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]{max-width:60vw}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .m-input[_ngcontent-%COMP%]{max-width:58vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .alert-success[_ngcontent-%COMP%]{background:var(--m-color-white);border:1px solid var(--m-color-success);border-radius:8px;box-shadow:0 0 4px var(--m-color-success)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__container__row[_ngcontent-%COMP%]   .miam-list-input__row__right[_ngcontent-%COMP%]   .alert-danger[_ngcontent-%COMP%]{background:var(--m-color-white);border:1px solid var(--m-color-danger);border-radius:8px;box-shadow:0 0 4px var(--m-color-danger)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]{align-items:center;display:flex;gap:8px;justify-content:space-between}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]{display:flex;justify-content:center;width:50px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   .miam-list-input__row__picture[_ngcontent-%COMP%]{-webkit-tap-highlight-color:transparent;width:50px}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]   .miam-list-input__row__picture.clickable[_ngcontent-%COMP%]{cursor:pointer}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   input[_ngcontent-%COMP%]{display:none}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   .miam-list-input__row__controls[_ngcontent-%COMP%]   .miam-list-input__row__trash[_ngcontent-%COMP%]{-webkit-tap-highlight-color:transparent;cursor:pointer}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{border-radius:var(--m-border-radius);flex:1;margin:0;max-width:none;outline:none;padding:5px;resize:none}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea.warnning[_ngcontent-%COMP%]{background-color:var(--m-color-secondary-light);color:var(--m-color-secondary)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea.error[_ngcontent-%COMP%]{background-color:var(--m-color-danger);color:var(--m-color-danger-text)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__list[_ngcontent-%COMP%]   ul[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]   textarea[cdktextareaautosize][_ngcontent-%COMP%]{overflow:hidden}.miam-list-input[_ngcontent-%COMP%]   .hint[_ngcontent-%COMP%]{border-radius:var(--m-border-radius);flex:1;font-size:12px;font-weight:600;padding-bottom:10px}.miam-list-input[_ngcontent-%COMP%]   .hint.warnning[_ngcontent-%COMP%]{color:var(--m-color-secondary)}.miam-list-input[_ngcontent-%COMP%]   .hint.error[_ngcontent-%COMP%]{color:var(--m-color-danger)}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__placeholder[_ngcontent-%COMP%]{align-items:center;justify-content:center}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__placeholder[_ngcontent-%COMP%]   .miam-list-input__placeholder__hint[_ngcontent-%COMP%]{color:var(--m-color-secondary);margin-top:40px;opacity:.5;text-align:center}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{-moz-column-gap:32px;column-gap:32px;display:flex;justify-content:space-between}@media (min-width:1024px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{width:calc(45% - 32px)}}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]{flex-direction:column}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{flex:1;margin-top:0;outline:none;resize:none}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   textarea[_ngcontent-%COMP%]{width:90vw}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__actions__instructions[_ngcontent-%COMP%]{background-color:var(--m-color-info);border-radius:8px;color:var(--m-color-info-text);max-width:calc(98vw - 776px);padding:8px;position:absolute;top:315px;white-space:pre-line;width:400px}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__actions__instructions[_ngcontent-%COMP%]{margin-top:16px;max-width:unset;position:unset;width:unset}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__instructions__direction[_ngcontent-%COMP%]{margin-left:4px}@media (max-width:1023px){.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   .miam-list-input__instructions__direction[_ngcontent-%COMP%]{display:none}}.miam-list-input[_ngcontent-%COMP%]   .miam-list-input__actions[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]{height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}.miam-list-input__row__preview[_ngcontent-%COMP%]{align-items:center;display:flex;width:530px}@media (max-width:1023px){.miam-list-input__row__preview[_ngcontent-%COMP%]{flex-wrap:wrap;width:80vw}}.miam-list-input__row__preview[_ngcontent-%COMP%]   .miam-list-input__preview__text[_ngcontent-%COMP%]{padding:5px}.miam-list-input__row__preview[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:first-of-type{flex:1;flex-shrink:1;margin-left:8px}.miam-list-input__row__preview[_ngcontent-%COMP%]   span[_ngcontent-%COMP%]:nth-of-type(2n){margin-right:8px}.miam-list-input__row__placeholder[_ngcontent-%COMP%]{-moz-user-select:none;-webkit-touch-callout:none;-webkit-user-select:none;background:var(--m-color-grey07);border-radius:8px;margin-right:24px;min-height:60px;user-select:none}.cdk-drag-animating[_ngcontent-%COMP%], .miam-list-input__row__placeholder[_ngcontent-%COMP%], ul.cdk-drop-list-dragging[_ngcontent-%COMP%]   li[_ngcontent-%COMP%]:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}"] });
 /*@__PURE__*/ (function () { ɵsetClassMetadata(ListInputComponent, [{
         type: Component,
         args: [{
@@ -13207,7 +13314,7 @@ function RecipeDetailsComponent_div_0_div_54_Template(rf, ctx) { if (rf & 1) {
     ɵɵadvance(4);
     ɵɵproperty("ngForOf", ctx_r22.recipe == null ? null : ctx_r22.recipe.modifiedIngredients);
     ɵɵadvance(5);
-    ɵɵproperty("ngForOf", ctx_r22.steps);
+    ɵɵproperty("ngForOf", ctx_r22.recipe.steps);
 } }
 function RecipeDetailsComponent_div_0_ng_template_55_ng_container_7_div_9_Template(rf, ctx) { if (rf & 1) {
     ɵɵelementStart(0, "div", 77);
@@ -13298,7 +13405,7 @@ function RecipeDetailsComponent_div_0_ng_template_55_ng_template_8_Template(rf,
 } if (rf & 2) {
     const ctx_r55 = ɵɵnextContext(3);
     ɵɵadvance(1);
-    ɵɵproperty("ngForOf", ctx_r55.steps);
+    ɵɵproperty("ngForOf", ctx_r55.recipe.steps);
 } }
 const _c4 = function (a0) { return { "active": a0 }; };
 function RecipeDetailsComponent_div_0_ng_template_55_Template(rf, ctx) { if (rf & 1) {
@@ -13544,7 +13651,6 @@ class RecipeDetailsComponent {
         this.isMobile = false;
         this.tab = 0;
         this.showDetail = true;
-        this.steps = [];
         this.activeStep = 0;
         this.icon = Icon;
         this.ingredientsChecked = {};
@@ -13566,7 +13672,6 @@ class RecipeDetailsComponent {
         this.cdr.detectChanges();
         this.showVideo = this.contextService.videoRecipesEnabled && ((_a = this.recipe) === null || _a === void 0 ? void 0 : _a.videoId);
         if (this.recipe) {
-            this.steps = this.recipe.steps;
             this.activeStep = 0;
             this.cdr.detectChanges();
         }
@@ -15920,7 +16025,7 @@ MiamInterceptor.ɵprov = ɵɵdefineInjectable({ token: MiamInterceptor, factory:
         type: Injectable
     }], function () { return [{ type: Injector }]; }, null); })();
 
-const MIAM_API_HOST$5 = `${environment.miamAPI}/api/v1/`;
+const MIAM_API_HOST$6 = `${environment.miamAPI}/api/v1/`;
 const MIAM_WEB_URL = `${environment.miamWeb}/fr/app`;
 const MIAM_BASKET_URL = `${MIAM_WEB_URL}/mon-panier`;
 registerLocaleData(localeFr, 'fr');
@@ -15964,7 +16069,7 @@ NgMiamModule.ɵinj = ɵɵdefineInjector({ factory: function NgMiamModule_Factory
         { provide: MIAM_BASKET_PATH, useValue: MIAM_BASKET_URL },
         { provide: LOCALE_ID, useValue: 'fr' }
     ], imports: [[
-            NgxJsonapiModule.forRoot({ url: MIAM_API_HOST$5 }),
+            NgxJsonapiModule.forRoot({ url: MIAM_API_HOST$6 }),
             ComponentsModule,
             WebComponentsModule,
             BrowserAnimationsModule
@@ -15978,7 +16083,7 @@ NgMiamModule.ɵinj = ɵɵdefineInjector({ factory: function NgMiamModule_Factory
         type: NgModule,
         args: [{
                 imports: [
-                    NgxJsonapiModule.forRoot({ url: MIAM_API_HOST$5 }),
+                    NgxJsonapiModule.forRoot({ url: MIAM_API_HOST$6 }),
                     ComponentsModule,
                     WebComponentsModule,
                     BrowserAnimationsModule