@yoobic/yobi 8.4.0-1 → 8.4.0-2

package/dist/collection/components/entities/entity-query-builder/entity-query-builder.js

@@ -306,7 +306,7 @@ export class YooEntityQueryBuilderComponent {
       const filteredFields = this.getFilterFields();
       if (filteredFields && filteredFields.length > 0) {
         const { slides, data } = filterRenderFormDynamic(filteredFields, ((_b = this.values) === null || _b === void 0 ? void 0 : _b.filters) || [], this.formFilter, null, null, true, null, !this.floating);
-        return (h("yoo-form-dynamic", { class: { floating: this.floating, inline: true, 'inline-narrow': this.floating, 'inline-row': !this.floating }, ref: (el) => (this.formFilter = el), formInputSize: this.floating ? 'small' : 'medium', animated: false, showRecap: false, scrollable: false, slides: slides, forceReadonly: this.readonly, data: data, hideOptional: true, onExtraDataChanged: (ev) => this.onAutocompleteChange(ev), onFieldChanged: (ev) => this.onAutocompleteChange(ev), onFieldFetchData: (ev) => this.onFieldFetchData(ev), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomData(ev), onFormValidityChanged: (ev) => ev.stopImmediatePropagation(), onDataChanged: (ev) => ev.stopPropagation() }));
+        return (h("yoo-form-dynamic", { class: { floating: this.floating, inline: true, 'inline-narrow': this.floating, 'inline-row': !this.floating, 'overflow-visible': true }, ref: (el) => (this.formFilter = el), formInputSize: this.floating ? 'small' : 'medium', animated: false, showRecap: false, scrollable: false, slides: slides, forceReadonly: this.readonly, data: data, hideOptional: true, onExtraDataChanged: (ev) => this.onAutocompleteChange(ev), onFieldChanged: (ev) => this.onAutocompleteChange(ev), onFieldFetchData: (ev) => this.onFieldFetchData(ev), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomData(ev), onFormValidityChanged: (ev) => ev.stopImmediatePropagation(), onDataChanged: (ev) => ev.stopPropagation() }));
       }
     }
   }
@@ -321,7 +321,7 @@ export class YooEntityQueryBuilderComponent {
           const contentButtons = this.getContextMenuButtons(index);
           const finalData = { ...data, operator: operatorValue };
           return [
-            h("yoo-form-dynamic", { class: "inline inline-row inline-row-narrow transparent fill-width", ref: (el) => (this.formFiltersAdvanced[index] = el), animated: false, showRecap: false, slides: slides, scrollable: false, forceReadonly: this.readonly, data: finalData, hideOptional: true, formInputSize: this.size || 'medium', formInputcolor: this.alwaysShow ? 'light' : 'stable-light', onFieldChanged: (ev) => this.onAutocompleteChangeAdvanced(ev, index), onFieldFetchData: (ev) => this.onFieldFetchDataAdvanced(ev, index), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomDataAdvanced(ev, index), onFieldRemoved: (ev) => this.onRemoveFormFieldFromAdvancedSegment(ev, index), onFormValidityChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => ev.stopPropagation() },
+            h("yoo-form-dynamic", { class: "inline inline-row inline-row-narrow transparent fill-width overflow-visible", ref: (el) => (this.formFiltersAdvanced[index] = el), animated: false, showRecap: false, slides: slides, scrollable: false, forceReadonly: this.readonly, data: finalData, hideOptional: true, formInputSize: this.size || 'medium', formInputcolor: this.alwaysShow ? 'light' : 'stable-light', onFieldChanged: (ev) => this.onAutocompleteChangeAdvanced(ev, index), onFieldFetchData: (ev) => this.onFieldFetchDataAdvanced(ev, index), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomDataAdvanced(ev, index), onFieldRemoved: (ev) => this.onRemoveFormFieldFromAdvancedSegment(ev, index), onFormValidityChanged: (ev) => ev.stopPropagation(), onDataChanged: (ev) => ev.stopPropagation() },
               !this.readonly && isWeb(this.host) && h("yoo-context-menu", { contentButtons: contentButtons, placement: "below", slot: "end" },
                 h("yoo-button", { color: "app-color", class: "margin-right", shape: "square", size: this.size || 'medium' },
                   h("yoo-icon", { color: "light", name: "plus", class: "add", size: "small" }))),

package/dist/collection/components/entities/entity-search-filters/entity-search-filters.js

@@ -186,7 +186,7 @@ export class YooEntitySearchFiltersComponent {
     const filteredFields = fields.filter((f) => filterIsAutocomplete(f) || filterIsRadio(f));
     if (filteredFields === null || filteredFields === void 0 ? void 0 : filteredFields.length) {
       const { slides, data } = filterRenderFormDynamic(filteredFields, this.filters, this.formAutocompletes);
-      return (h("yoo-form-dynamic", { class: "inline margin-top", ref: (el) => (this.formAutocompletes = el), animated: false, showRecap: false, slides: slides, data: data, hideOptional: true, onFieldChanged: (ev) => this.onAutocompleteChange(ev), onFieldFetchData: (ev) => this.onFieldFetchData(ev), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomData(ev) }));
+      return (h("yoo-form-dynamic", { class: "inline margin-top overflow-visible", ref: (el) => (this.formAutocompletes = el), animated: false, showRecap: false, slides: slides, data: data, hideOptional: true, onFieldChanged: (ev) => this.onAutocompleteChange(ev), onFieldFetchData: (ev) => this.onFieldFetchData(ev), onFieldFetchCustomData: (ev) => this.onFieldFetchCustomData(ev) }));
     }
   }
   renderUl(field) {

package/dist/collection/components/form/form-autocomplete/form-autocomplete.js

@@ -1691,7 +1691,7 @@ export class YooFormAutocompleteComponent {
       "mutable": false,
       "complexType": {
         "original": "EntityType",
-        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notes\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
+        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"notes\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
         "references": {
           "EntityType": {
             "location": "import",
@@ -2004,7 +2004,7 @@ export class YooFormAutocompleteComponent {
       "mutable": false,
       "complexType": {
         "original": "EntityType",
-        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notes\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
+        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"notes\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
         "references": {
           "EntityType": {
             "location": "import",

package/dist/collection/components/form/form-autocomplete-dialog/form-autocomplete-dialog.js

@@ -471,7 +471,7 @@ export class YooFormAutocompleteDialogComponent {
       "mutable": false,
       "complexType": {
         "original": "EntityType",
-        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notes\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
+        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"notes\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
         "references": {
           "EntityType": {
             "location": "import",

package/dist/collection/components/form/form-dynamic/form-dynamic.css

@@ -675,15 +675,21 @@ span.fr-img-caption.fr-view {
   --inputs-margin: 0 var(--spacing-16, 1rem);
   --video-container-height: 9.375rem;
   --footer-height: var(--spacing-56, 3.5rem);
+  --main-container-overflow-x: visible;
+  --main-container-overflow-y: auto;
+  --inputs-container-parent-overflow-x: visible;
+  --inputs-container-parent-overflow-y: auto;
   display: flex;
   flex-direction: column;
 }
 :host .main-container {
   flex: 1;
-  overflow-y: auto;
+  overflow-x: var(--main-container-overflow-x);
+  overflow-y: var(--main-container-overflow-y);
 }
 :host .main-container .inputs-container-parent {
-  overflow-y: auto;
+  overflow-x: var(--inputs-container-parent-overflow-x);
+  overflow-y: var(--inputs-container-parent-overflow-y);
 }
 :host .main-container .inputs-container-parent.gridstack {
   margin: var(--spacing-16, 1rem);
@@ -1645,9 +1651,11 @@ span.fr-img-caption.fr-view {
   background-color: transparent;
 }
 
+:host(.mission-form.pdf) {
+  --main-container-overflow-y: initial;
+}
 :host(.mission-form.pdf) .main-container {
   flex: initial;
-  overflow-y: initial;
 }
 :host(.mission-form.pdf) .inputs-container-parent {
   margin: initial;
@@ -1753,6 +1761,12 @@ span.fr-img-caption.fr-view {
   padding: 0 0 var(--spacing-16, 1rem);
 }
 
+:host(.web:not(.inline):not(.inline-row):not(.force-mobile)) {
+  --main-container-overflow-x: hidden;
+  --main-container-overflow-y: hidden;
+  --inputs-container-parent-overflow-x: hidden;
+  --inputs-container-parent-overflow-y: auto;
+}
 :host(.web:not(.inline):not(.inline-row):not(.force-mobile)) yoo-tabs {
   min-height: 3rem;
 }
@@ -1760,7 +1774,6 @@ span.fr-img-caption.fr-view {
   display: flex;
   flex: 1;
   flex-direction: row;
-  overflow: hidden;
 }
 :host(.web:not(.inline):not(.inline-row):not(.force-mobile)) .left-panel-secondary {
   width: 12.5rem;
@@ -1799,8 +1812,6 @@ span.fr-img-caption.fr-view {
 }
 :host(.web:not(.inline):not(.inline-row):not(.force-mobile)) .inputs-container-parent {
   flex: 1;
-  overflow-x: hidden;
-  overflow-y: auto;
   /* Track */
   /* Handle */
 }
@@ -2091,6 +2102,8 @@ span.fr-img-caption.fr-view {
 }
 
 :host(.inline) {
+  --main-container-overflow-x: hidden;
+  --main-container-overflow-y: hidden;
   position: initial;
   top: initial;
   right: initial;
@@ -2100,8 +2113,6 @@ span.fr-img-caption.fr-view {
 }
 :host(.inline) .main-container {
   flex: 1;
-  overflow-x: hidden;
-  overflow-y: hidden;
 }
 :host(.inline) .main-container .inputs-container-parent {
   margin: 0;
@@ -2294,11 +2305,10 @@ span.fr-img-caption.fr-view {
 }
 
 :host(.toolbar-form) {
+  --inputs-container-parent-overflow-x: hidden;
+  --inputs-container-parent-overflow-y: hidden;
   max-height: 4.125rem;
 }
-:host(.toolbar-form) .main-container .inputs-container-parent {
-  overflow: hidden;
-}
 
 :host(.quickview.web.readonly) .main-container {
   background: var(--stable-ultralight, #fafafa);
@@ -2536,13 +2546,15 @@ span.fr-img-caption.fr-view {
   color: inherit;
 }
 
+:host(.live-preview-form.mobile:not(.inline):not(.inline-row)) {
+  --inputs-container-parent-overflow-y: scroll;
+}
 :host(.live-preview-form.mobile:not(.inline):not(.inline-row)) .inputs-container-parent {
   display: flex;
   flex-direction: column;
   box-sizing: border-box;
   height: 100%;
   padding-bottom: var(--spacing-64, 4rem);
-  overflow-y: scroll;
 }
 :host(.live-preview-form.mobile:not(.inline):not(.inline-row)) .inputs-container {
   box-sizing: border-box;
@@ -2616,6 +2628,9 @@ span.fr-img-caption.fr-view {
   padding: 0;
 }
 
-:host(.form-creator-preview-lesson) {
-  margin-top: var(--safe-area-inset-top);
+:host(.overflow-visible) {
+  --main-container-overflow-x: visible;
+  --main-container-overflow-y: visible;
+  --inputs-container-parent-overflow-x: visible;
+  --inputs-container-parent-overflow-y: visible;
 }

package/dist/collection/components/form/form-dynamic/form-dynamic.js

@@ -945,7 +945,7 @@ export class YooFormDynamicComponent {
     else if (getTypeValidation(field, this.currentData) !== undefined) {
       fieldState.validity = getTypeValidation(field, this.currentData);
     }
-    else if ((this.isLesson() || this.isLessonDetail()) && (field.type === 'videoplayer' || field.type === 'document' || field.type === 'podcast')) {
+    else if ((this.isLesson() || this.isLessonDetail()) && (field.type === 'videoplayer' || field.type === 'document' || field.type === 'podcast' || field.type === 'url')) {
       fieldState.validity = false;
     }
     else {
@@ -1386,9 +1386,7 @@ export class YooFormDynamicComponent {
       if (data.mentions) {
         this.currentData['mentions'] = data.mentions;
       }
-      if (data.linkPreviews) {
-        this.currentData['linkPreviews'] = data.linkPreviews;
-      }
+      this.currentData['linkPreviews'] = (data === null || data === void 0 ? void 0 : data.linkPreviews) || [];
       this.extraDataChanged.emit(this.currentData);
     }
     else if (field.type === FormFieldType.filterautocomplete) {

package/dist/collection/components/form/form-entity-value-pairs/form-entity-value-pairs.js

@@ -196,7 +196,7 @@ export class YooFormEntityValuePairsComponent {
       "mutable": false,
       "complexType": {
         "original": "EntityType",
-        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notes\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
+        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"notes\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
         "references": {
           "EntityType": {
             "location": "import",

package/dist/collection/components/form/form-recurrence/options/frequency.js

@@ -10,7 +10,7 @@ const frequencies = [
   { _id: 'MONTH', title: translate('YOOBICMONTH') }
 ];
 export const Frequency = ({ frequency, hours, interval, onChange }) => (h("section", { class: "frequency" },
-  h("yoo-form-input", { hasIconPrefix: false, min: MIN_INTERVAL.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: interval, onInputChanged: (event) => {
+  h("yoo-form-input", { clearable: false, hasIconPrefix: false, min: MIN_INTERVAL.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: interval, onInputChanged: (event) => {
       event.stopPropagation();
       onChange(frequency, hours, event.detail);
     }, onValidityChanged: (event) => event.stopPropagation() }),

package/dist/collection/components/form/form-swipe-cards/form-swipe-cards.css

@@ -350,6 +350,9 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 :host(:not([readonly])) [direction=right] .current {
   transform: translate(0%, 9%) scale(1) rotate(3.5deg) !important;
 }
+:host(:not([readonly])) #game {
+  position: relative;
+}
 :host(:not([readonly])) #game #background {
   position: relative;
   display: flex;
@@ -683,26 +686,24 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   transition: transform 0.8s linear;
 }
 
-:host([live-preview][view=instructions]) #instructions #header,
 :host(.mobile[view=instructions]) #instructions #header {
   padding: var(--spacing-16, 1rem);
   background: var(--dark, #000000);
   border-radius: var(--border-radius-04, 0.25rem);
 }
-:host([live-preview][view=instructions]) #instructions #header #title,
 :host(.mobile[view=instructions]) #instructions #header #title {
   color: var(--light, #ffffff);
   font-weight: bold;
   font-size: var(--font-size-28, 1.75rem);
 }
 
-:host(.web:not([live-preview])) #cards {
+:host(.web) #cards {
   transform: translate(-50%, 0);
 }
-:host(.web:not([live-preview])) .action:nth-child(2) {
+:host(.web) .action:nth-child(2) {
   margin-top: calc(10% + 3rem);
 }
-:host(.web:not([live-preview])) #header {
+:host(.web) #header {
   display: flex;
   flex-direction: column;
   padding: var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);
@@ -710,29 +711,29 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   text-align: center;
   background-color: var(--stable-ultralight, #fafafa);
 }
-:host(.web:not([live-preview])) #header #title {
+:host(.web) #header #title {
   color: var(--dark, #000000) !important;
   font-weight: bold;
   font-size: var(--font-size-28, 1.75rem);
 }
 
-:host(.web:not([live-preview])[view=game]) main {
+:host(.web[view=game]) main {
   grid-template-rows: auto 1fr;
 }
-:host(.web:not([live-preview])[view=game]) main #actions {
+:host(.web[view=game]) main #actions {
   top: 109%;
   min-width: 32rem;
   margin-top: 0;
 }
 
-:host(.web:not([live-preview])[view=instructions]) yoo-icon[name=swipe-explanation] {
+:host(.web[view=instructions]) yoo-icon[name=swipe-explanation] {
   width: 5rem;
   height: 5rem;
   margin: auto;
   --inner-width: 5rem;
   --inner-height: 5rem;
 }
-:host(.web:not([live-preview])[view=instructions]) yoo-button {
+:host(.web[view=instructions]) yoo-button {
   margin-right: var(--spacing-16, 1rem);
   margin-left: auto;
 }
@@ -750,6 +751,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 :host([view=instructions]) main #instructions #categories {
   display: inline-grid;
   grid-template-columns: 1fr 0.5fr 1fr;
+  align-items: center;
+  justify-items: center;
   width: 100%;
   margin: var(--spacing-24, 1.5rem) 0;
   text-align: center;

package/dist/collection/components/form/form-swipe-cards/form-swipe-cards.js

@@ -419,7 +419,7 @@ export class YooFormSwipeCardsComponent {
     var _a;
     const isUndo = direction === SwipeCardsDirection.undo;
     const isLeft = direction === SwipeCardsDirection.left;
-    const isMobile = !isWeb(this.host) || this.livePreview;
+    const isMobile = !isWeb(this.host);
     const actionColor = isUndo ? (isWeb(this.host) ? 'light' : 'stable-alt') : isLeft ? 'app-color' : 'warning';
     const swipeIcon = isUndo ? 'undo' : `big-arrow-${direction}`;
     const categoryIndex = isLeft ? 0 : 1;
@@ -438,7 +438,7 @@ export class YooFormSwipeCardsComponent {
   }
   renderGame() {
     return [
-      isWeb(this.host) && !this.livePreview && this.renderTopDescription(),
+      isWeb(this.host) && this.renderTopDescription(),
       h("section", { id: "game", ref: (element) => (this.gameContainerElement = element) },
         this.renderBackground(),
         this.renderCards())
@@ -446,7 +446,7 @@ export class YooFormSwipeCardsComponent {
   }
   renderStartButton() {
     return (!this.readonly &&
-      this.showInstructionView && (h("yoo-button", { disabled: !this.hasData || !this.isDataValid, size: isWeb(this.host) && !this.livePreview ? 'medium' : 'large', color: "app-color", onClick: () => {
+      this.showInstructionView && (h("yoo-button", { disabled: !this.hasData || !this.isDataValid, size: isWeb(this.host) ? 'medium' : 'large', color: "app-color", onClick: () => {
         this.revealCards = true;
         this.showInstructionView = false;
         this.displayFooterElement();
@@ -717,7 +717,7 @@ export class YooFormSwipeCardsComponent {
         "text": ""
       },
       "attribute": "live-preview",
-      "reflect": true
+      "reflect": false
     },
     "showInstructionView": {
       "type": "boolean",

package/dist/collection/components/form/form-table/form-table.js

@@ -382,7 +382,7 @@ export class YooFormTableComponent {
       "mutable": false,
       "complexType": {
         "original": "EntityType",
-        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notes\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
+        "resolved": "\"aisles\" | \"community\" | \"courses\" | \"dashboards\" | \"operations\" | \"pages\" | \"questions\" | \"scoring\" | \"tableau\" | \"tag\" | \"user\" | \"weekdays\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"geofilters\" | \"hierarchy\" | \"incentives\" | \"locationtypes\" | \"plans\" | \"translations\" | \"aclRole\" | \"blog\" | \"emails\" | \"feeds\" | \"files\" | \"groups\" | \"htmltemplates\" | \"lessons\" | \"locations\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"productbatch\" | \"products\" | \"tenants\" | \"userranks\" | \"users\" | \"notes\" | \"type\" | \"aclPermission\" | \"aclPermissionList\" | \"aislelist\" | \"algorithm\" | \"apps\" | \"arexperience\" | \"armodel\" | \"audiences\" | \"badges\" | \"broadcasts\" | \"calendarEvents\" | \"creationtypes\" | \"catalogs\" | \"certificates\" | \"channels\" | \"charttype\" | \"contacts\" | \"coursecategories\" | \"courses-small\" | \"courseselection\" | \"currencies\" | \"customapps\" | \"customforms\" | \"days\" | \"entitycomments\" | \"environnement\" | \"feedsComments\" | \"filesFolders\" | \"folders\" | \"formfield\" | \"giphy\" | \"googlemaps\" | \"hashtags\" | \"icons\" | \"journeys\" | \"language\" | \"lessondescriptions\" | \"liveshoppings\" | \"locationsaudience\" | \"locationspublic\" | \"markas\" | \"mediacapturedevices\" | \"memolist\" | \"missiondatas\" | \"missiondescriptioncategories\" | \"missiondescriptionreviewhistories\" | \"missionfield\" | \"notifications\" | \"photos\" | \"productbatchlist\" | \"productweightpair\" | \"publicAPITokens\" | \"questionsAnswers\" | \"regex\" | \"reporttemplates\" | \"reviewapps\" | \"salesdata\" | \"scorms\" | \"scormcloud\" | \"slots\" | \"tableauShared\" | \"tagGroups\" | \"topusers\" | \"unsplash\" | \"useraudience\" | \"userlearningmanager\" | \"usercourseinfo\" | \"violetproducts\" | \"violetproductofferskus\" | \"violetbasketitems\" | \"violetshippingmethods\" | \"version\" | \"videocallusers\" | \"visits\" | \"waitlistvisit\" | \"waitlistcustomer\" | \"waitliststats\" | \"plansorlessons\" | \"widgets\"",
         "references": {
           "EntityType": {
             "location": "import",

package/dist/collection/components/form/form-text-area/form-text-area.js

@@ -1,5 +1,5 @@
 import { Keyboard } from '@capacitor/keyboard';
-import { containsUrls, debounce, enableKeyboardResize, findParent, getAsyncExtraData, isFirefox, isIOS, isNativeMobile, isNullOrUndefined, isWeb, replaceAndGetAllLinks, replaceAtTagToMentionTag, safeScrollIntoView, translate, translateMulti } from '@shared/utils';
+import { debounce, enableKeyboardResize, findParent, getAsyncExtraData, isFirefox, isIOS, isNativeMobile, isNullOrUndefined, isWeb, replaceAtTagToMentionTag, safeScrollIntoView, translate, translateMulti, updateLinkPreviews } from '@shared/utils';
 import { Component, Element, Event, forceUpdate, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';
 import { isString } from 'lodash-es';
 import { getAppContext, sanitizeHTML } from '../../../utils/helpers/common-helpers';
@@ -230,16 +230,9 @@ export class YooFormTextAreaComponent {
         setTimeout(() => {
           this.allowLinkUpdate = true;
           const content = this.inputEl.innerHTML || '';
-          if (!containsUrls(content) && !(ev.inputType === 'deleteContentBackward' || ev.key === 'Backspace')) {
-            return;
-          }
-          const { links } = replaceAndGetAllLinks(content.replace(/ /g, ' '), ' ') || {};
-          if (links === null || links === void 0 ? void 0 : links.length) {
-            this.linkPreviews = links.map((link) => {
-              var _a;
-              const preview = (_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a.find((item) => item.originalURL === link);
-              return preview ? preview : { isLoading: true, url: link, title: link };
-            });
+          const updatedLinks = updateLinkPreviews(content, this.linkPreviews, (ev === null || ev === void 0 ? void 0 : ev.inputType) === 'deleteContentBackward' || (ev === null || ev === void 0 ? void 0 : ev.key) === 'Backspace');
+          if (updatedLinks === null || updatedLinks === void 0 ? void 0 : updatedLinks.hasChanges) {
+            this.linkPreviews = [...updatedLinks.previews];
           }
         }, 1000);
       }
@@ -381,8 +374,7 @@ export class YooFormTextAreaComponent {
       this.segmentsCount.toLocaleString());
   }
   renderLinkPreviews() {
-    var _a;
-    return (h("yoo-links-preview", { closeable: true, links: [(_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a[0]], showErrors: false, onLinkPreviewChanged: (ev) => this.onLinkPreviewChanged(ev) }));
+    return (h("yoo-links-preview", { closeable: true, inline: true, links: this.linkPreviews, showErrors: false, onLinkPreviewChanged: (ev) => this.onLinkPreviewChanged(ev) }));
   }
   renderMentionContainer() {
     const maxRowsHeight = `${this.maxRows * LINE_HEIGHT}px`;
@@ -678,7 +670,7 @@ export class YooFormTextAreaComponent {
     },
     "linkPreviews": {
       "type": "unknown",
-      "mutable": false,
+      "mutable": true,
       "complexType": {
         "original": "ILinkPreview[]",
         "resolved": "ILinkPreview[]",
@@ -690,7 +682,7 @@ export class YooFormTextAreaComponent {
         }
       },
       "required": false,
-      "optional": false,
+      "optional": true,
       "docs": {
         "tags": [],
         "text": ""

package/dist/collection/components/form/form-text-editor/form-text-editor.js

@@ -45,7 +45,7 @@ import 'froala-editor/js/languages/tr';
 import 'froala-editor/js/languages/uk';
 import 'froala-editor/js/languages/zh_cn';
 import 'froala-editor/js/languages/zh_tw';
-import { asyncWaterfall, closeModal, containsUrls, debounce as _debounce, getAsyncExtraData, getColorSwatches, getCurrentLanguage, getCustomApp, getSession, getUUID, getVideoPoster, images, isCloudinaryLink, isImageUrl, isVideo, isWeb, MODAL_BASE_ZINDEX, replaceAndGetAllLinks, replaceAtTagToMentionTag, showContextMenu, showModal, translate, translateMulti, videos } from '@shared/utils';
+import { asyncWaterfall, closeModal, debounce as _debounce, getAsyncExtraData, getColorSwatches, getCurrentLanguage, getCustomApp, getSession, getUUID, getVideoPoster, images, isCloudinaryLink, isImageUrl, isVideo, isWeb, MODAL_BASE_ZINDEX, replaceAtTagToMentionTag, showContextMenu, showModal, translate, translateMulti, updateLinkPreviews, videos } from '@shared/utils';
 import { Component, Element, Event, h, Host, Method, Prop, Watch } from '@stencil/core';
 import FroalaEditor from 'froala-editor';
 import { assign, compact, isArray, isString } from 'lodash-es';
@@ -657,16 +657,9 @@ export class YooFormTextEditorComponent {
         var _a, _b;
         this.allowLinkUpdate = true;
         const content = ((_b = (_a = this.editor) === null || _a === void 0 ? void 0 : _a.html) === null || _b === void 0 ? void 0 : _b.get()) || '';
-        if (!containsUrls(content) && !((ev === null || ev === void 0 ? void 0 : ev.inputType) === 'deleteContentBackward' || (ev === null || ev === void 0 ? void 0 : ev.key) === 'Backspace')) {
-          return;
-        }
-        const { links } = replaceAndGetAllLinks(content.replace(/ /g, ' '), ' ');
-        if (links === null || links === void 0 ? void 0 : links.length) {
-          this.linkPreviews = links.map((link) => {
-            var _a;
-            const preview = (_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a.find((item) => item.originalURL === link);
-            return preview ? preview : { isLoading: true, url: link, title: link };
-          });
+        const updatedLinks = updateLinkPreviews(content, this.linkPreviews, (ev === null || ev === void 0 ? void 0 : ev.inputType) === 'deleteContentBackward' || (ev === null || ev === void 0 ? void 0 : ev.key) === 'Backspace');
+        if (updatedLinks === null || updatedLinks === void 0 ? void 0 : updatedLinks.hasChanges) {
+          this.linkPreviews = [...updatedLinks.previews];
         }
       }, 1000);
     }
@@ -752,8 +745,7 @@ export class YooFormTextEditorComponent {
     }
   }
   renderLinkPreviews() {
-    var _a;
-    return (h("yoo-links-preview", { closeable: true, inline: true, links: [(_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a[0]], showErrors: false, onLinkPreviewChanged: (ev) => this.onLinkPreviewChanged(ev) }));
+    return (h("yoo-links-preview", { closeable: true, inline: true, links: this.linkPreviews, showErrors: false, onLinkPreviewChanged: (ev) => this.onLinkPreviewChanged(ev) }));
   }
   renderEditable() {
     return [h("div", { class: { container: true, fullscreen: this.isFullscreen }, ref: (el) => (this.containerEl = el) }), this.allowLinkPreview && this.renderLinkPreviews()];

package/dist/collection/components/form/links-preview/links-preview.css

@@ -295,14 +295,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: auto;
 }
 
-:host([closeable]) yoo-icon[name=cross] {
-  position: absolute;
-  top: 50%;
-  right: var(--spacing-04, 0.25rem);
-  z-index: 15;
-  transform: translateY(-50%);
-}
-
 :host(:not([inline])) #preview yoo-img {
   border-top-left-radius: var(--border-radius-04, 0.25rem);
   border-top-right-radius: var(--border-radius-04, 0.25rem);
@@ -313,7 +305,7 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   margin: auto var(--spacing-08, 0.5rem);
 }
 :host([inline]) #preview:not(.no-image) {
-  grid-template-columns: 1fr 2fr;
+  grid-template-columns: 1fr 1.8fr 0.2fr;
   gap: var(--spacing-16, 1rem);
 }
 :host([inline]) #preview #image yoo-img {

package/dist/collection/components/form/links-preview/links-preview.js

@@ -1,5 +1,6 @@
 import { getAsyncExtraData, isDeeplink, isImage, replaceAndGetAllLinks, screenOrientationLock, screenOrientationUnlock } from '@shared/utils';
 import { Component, Element, Event, forceUpdate, h, Host, Prop, Watch } from '@stencil/core';
+import { uniqBy } from 'lodash-es';
 import { setValidator } from '../../../utils/helpers/form-input-helpers';
 export class YooLinksPreviewComponent {
   constructor() {
@@ -68,6 +69,7 @@ export class YooLinksPreviewComponent {
       if ((linkPromises === null || linkPromises === void 0 ? void 0 : linkPromises.length) || forceLinkPreviewChanged) {
         Promise.all(linkPromises).then(() => {
           forceUpdate(this);
+          this.retrievedLinkPreviews = uniqBy(this.retrievedLinkPreviews, link => link.url);
           this.linkPreviewChanged.emit({ linkPreviews: this.retrievedLinkPreviews });
         });
       }
@@ -82,6 +84,7 @@ export class YooLinksPreviewComponent {
         link.url = 'https://' + url;
       }
       this.ref = window.open(url, target || '_system', 'location=no,toolbar=yes');
+      this.validityChanged.emit(true);
       if (this.ref) {
         this.ref.addEventListener('loadstart', this.unlockScreen.bind(this));
         this.ref.addEventListener('exit', this.lockScreen.bind(this));
@@ -131,17 +134,16 @@ export class YooLinksPreviewComponent {
     const showTitleOnly = isDeeplink(url) || !isImage(image);
     return h("section", { id: "preview", class: { 'no-image': showTitleOnly }, onClick: (ev) => this.onLinkPreviewClicked(ev, link) },
       isLoading && h("yoo-loader", { class: "absolute backdrop-transparent" }),
-      this.closeable && this.renderCloseIcon(link),
       !showTitleOnly && image && this.renderImage(image),
-      this.showDescription && this.renderLinkDescription(url || originalURL, title, showTitleOnly, target));
+      this.showDescription && this.renderLinkDescription(url || originalURL, title, showTitleOnly, target),
+      this.closeable && this.renderCloseIcon(link));
   }
   renderPreviews() {
     var _a, _b;
     return (_b = (_a = this.retrievedLinkPreviews) === null || _a === void 0 ? void 0 : _a.filter((item) => item && (!item.error || this.showErrors))) === null || _b === void 0 ? void 0 : _b.map((link) => this.renderPreview(link));
   }
   render() {
-    var _a, _b;
-    return h(Host, null, (_b = (_a = this.retrievedLinkPreviews) === null || _a === void 0 ? void 0 : _a.filter((item) => item && (!item.error || this.showErrors))) === null || _b === void 0 ? void 0 : _b.map((link) => this.renderPreview(link)));
+    return h(Host, null, this.renderPreviews());
   }
   static get is() { return "yoo-links-preview"; }
   static get encapsulation() { return "shadow"; }
@@ -184,7 +186,7 @@ export class YooLinksPreviewComponent {
         "text": ""
       },
       "attribute": "closeable",
-      "reflect": true,
+      "reflect": false,
       "defaultValue": "false"
     },
     "inline": {
@@ -334,6 +336,21 @@ export class YooLinksPreviewComponent {
           }
         }
       }
+    }, {
+      "method": "validityChanged",
+      "name": "validityChanged",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      }
     }]; }
   static get elementRef() { return "host"; }
   static get watchers() { return [{

package/dist/collection/components/form-creator/constants/index.js

@@ -1,3 +1,4 @@
-import { FormFieldCategory } from '@shared/interfaces';
+import { FormFieldCategory, FormFieldType } from '@shared/interfaces';
 export const ARROW_PAIR = ['arrow-down', 'arrow-up'];
 export const NON_CONDITION_CATEGORIES = [FormFieldCategory.information, FormFieldCategory.multimedia];
+export const NON_CONDITION_TYPES = [FormFieldType.ranking];