@yoobic/yobi 8.7.32 → 8.7.33

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

@@ -394,6 +394,171 @@ export class YooFormTextEditorComponent {
       }
     }
   }
+  getSimpleToolbarOptions() {
+    return {
+      moreText: {
+        buttons: ['bold', 'italic', 'underline', 'textColor', 'backgroundColor', 'fontSize', 'fontFamily', 'strikeThrough', 'subscript', 'superscript', 'clearFormatting'],
+        align: 'left',
+        buttonsVisible: 5
+      },
+      moreRich: {
+        buttons: ['emoticons'],
+        align: 'left',
+        buttonsVisible: 1
+      },
+      moreMisc: {
+        buttons: ['html'],
+        align: 'right',
+        buttonsVisible: 1
+      }
+    };
+  }
+  getWebToolbarOptions() {
+    return {
+      moreText: {
+        buttons: compact([
+          'yooTemplate',
+          'paragraphFormat',
+          'bold',
+          'textColor',
+          'italic',
+          'underline',
+          'strikeThrough',
+          'backgroundColor',
+          'fontSize',
+          'fontFamily',
+          'subscript',
+          'superscript',
+          'clearFormatting',
+          'paragraphStyle'
+        ]),
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 8 : 3
+      },
+      moreParagraph: {
+        buttons: [
+          'formatUL',
+          'formatOL',
+          'alignLeft',
+          'alignCenter',
+          'alignRight',
+          'alignJustify',
+          'lineHeight',
+          'indent',
+          'outdent',
+          'quote'
+        ],
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 6 : 1
+      },
+      moreRich: {
+        buttons: [
+          'yooUploadButton',
+          'emoticons',
+          'specialCharacters',
+          'yooDocumentImporterButton',
+          'insertLink',
+          'insertImage',
+          'insertTable',
+          'insertVideo',
+          'insertFile',
+          'insertHR',
+          'yooNoTranslate'
+          // this.hasAI() ? 'yooAIText' : null,
+          // this.hasAI() ? 'yooAIImage' : null,
+        ],
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 6 : 1
+      },
+      moreMisc: {
+        buttons: compact([
+          this.isFullscreen ? null : this.fullScreenButtonId,
+          'undo',
+          'redo',
+          //'spellChecker',
+          'selectAll',
+          'html',
+          this.isFullscreen ? 'yooFullscreenClose' : null
+          //'help'
+        ]),
+        align: 'right',
+        buttonsVisible: this.isFullscreen ? 5 : 1
+      }
+    };
+  }
+  getMobileToolbarOptions() {
+    return {
+      moreText: {
+        buttons: compact([
+          'paragraphFormat',
+          'bold',
+          'textColor',
+          'italic',
+          'underline',
+          'strikeThrough',
+          'backgroundColor',
+          'fontSize',
+          'fontFamily',
+          'subscript',
+          'superscript',
+          'clearFormatting',
+          'paragraphStyle'
+        ]),
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 3 : 2
+      },
+      moreParagraph: {
+        buttons: [
+          'formatUL',
+          'formatOL',
+          'alignLeft',
+          'alignCenter',
+          'alignRight',
+          'alignJustify',
+          'lineHeight',
+          'indent',
+          'outdent',
+          'quote'
+        ],
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 1 : 1
+      },
+      moreRich: {
+        buttons: [
+          'yooTemplate',
+          // 'yooUploadButton',
+          'emoticons',
+          'insertLink',
+          // 'insertImage',
+          'insertTable',
+          // 'insertVideo',
+          'insertFile',
+          'insertHR',
+          'specialCharacters',
+          'yooNoTranslate'
+          // this.hasAI() ? 'yooAIText' : null,
+          // this.hasAI() ? 'yooAIImage' : null,
+          //'yooDocumentImporterButton'
+        ],
+        align: 'left',
+        buttonsVisible: this.isFullscreen ? 1 : 0
+      },
+      moreMisc: {
+        buttons: compact([
+          this.isFullscreen ? null : this.fullScreenButtonId,
+          this.isFullscreen ? 'yooFullscreenClose' : null,
+          'undo',
+          'redo',
+          //'spellChecker',
+          'selectAll',
+          'html'
+          //'help'
+        ]),
+        align: 'right',
+        buttonsVisible: this.isFullscreen ? 1 : 1
+      }
+    };
+  }
   async getFroalaOptions(isWeb) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
     const maxFileUploadSize = 1024 * 1024 * 200; // 200MB
@@ -437,7 +602,25 @@ export class YooFormTextEditorComponent {
       linkInsertButtons: ['linkBack'],
       pastePlain: false,
       quickInsertEnabled: isWeb,
-      quickInsertButtons: compact(['yooUploadButtonQuick', 'yooDocumentImporterButtonQuick', 'yooNoTranslateButtonQuick', 'image', 'video', 'table', 'ul', 'ol', 'hr', 'emoticons', 'yooTemplateQuick']),
+      quickInsertButtons: compact([
+        'yooUploadButtonQuick',
+        'image',
+        'table',
+        'video',
+        'hr',
+        'yooNoTranslateButtonQuick'
+        // 'yooUploadButtonQuick',
+        // 'yooDocumentImporterButtonQuick',
+        // 'yooNoTranslateButtonQuick',
+        // 'image',
+        // 'video',
+        // 'table',
+        // 'ul',
+        // 'ol',
+        // 'hr',
+        // 'emoticons',
+        // 'yooTemplateQuick'
+      ]),
       quickInsertTags: ['', 'p', 'div', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'blockquote', 'br'],
       colorsBackground: hasTenantColors ? (_k = session === null || session === void 0 ? void 0 : session.tenant) === null || _k === void 0 ? void 0 : _k.rteColors : getColorSwatches(),
       colorsText: hasTenantColors ? (_l = session === null || session === void 0 ? void 0 : session.tenant) === null || _l === void 0 ? void 0 : _l.rteColors : getColorSwatches(),
@@ -464,77 +647,9 @@ export class YooFormTextEditorComponent {
       videoEditButtons: ['videoReplace', 'videoRemove'],
       imageEditButtons: ['imageReplace', 'imageAlign', 'imageRemove', '|', 'imageLink', 'linkOpen', 'linkEdit', 'linkRemove', '-', 'imageDisplay', 'imageStyle', 'imageSize'],
       toolbarInline: false,
-      toolbarButtons: this.simpleToolbar ? {
-        moreText: {
-          buttons: ['bold', 'italic', 'underline', 'textColor', 'backgroundColor', 'fontSize', 'fontFamily', 'strikeThrough', 'subscript', 'superscript', 'clearFormatting'],
-          align: 'left',
-          buttonsVisible: 5
-        },
-        moreRich: {
-          buttons: ['emoticons'],
-          align: 'left',
-          buttonsVisible: 1
-        },
-        moreMisc: {
-          buttons: [
-            'html'
-          ],
-          align: 'right',
-          buttonsVisible: 1
-        }
-      } : {
-        moreRich: {
-          buttons: compact(!isWeb
-            ? ['insertFile', 'emoticons', 'yooNoTranslate', 'insertTable', 'insertLink', 'specialCharacters', 'insertHR'] // 'insertImage', 'insertVideo', 'yooDocumentImporterButton',
-            : ['yooUploadButton', 'yooDocumentImporterButton', 'yooNoTranslate', this.hasAI() ? 'yooAIText' : null, this.hasAI() ? 'yooAIImage' : null, 'emoticons', 'insertImage', 'insertVideo', 'insertTable', 'insertLink', 'specialCharacters', 'insertFile', 'insertHR']),
-          align: 'left',
-          buttonsVisible: this.isFullscreen
-            ? isWeb ? 7 : 3
-            : 2
-        },
-        moreText: {
-          buttons: ['bold', 'italic', 'underline', 'textColor', 'backgroundColor', 'strikeThrough', 'subscript', 'superscript', 'fontFamily', 'fontSize', 'clearFormatting'],
-          align: 'left',
-          buttonsVisible: this.isFullscreen
-            ? isWeb ? 5 : 3
-            : 1
-        },
-        moreParagraph: {
-          buttons: [
-            'alignLeft',
-            'alignCenter',
-            'alignRight',
-            'alignJustify',
-            'formatOL',
-            'formatUL',
-            'paragraphFormat',
-            'paragraphStyle',
-            'lineHeight',
-            'outdent',
-            'indent',
-            'quote'
-          ],
-          align: 'left',
-          buttonsVisible: this.isFullscreen
-            ? isWeb ? 4 : 0
-            : isWeb ? 2 : 0
-        },
-        moreMisc: {
-          buttons: compact([
-            this.isFullscreen ? null : this.fullScreenButtonId,
-            this.isFullscreen ? 'yooFullscreenClose' : null,
-            'yooTemplate',
-            'undo',
-            'redo',
-            'spellChecker',
-            'selectAll',
-            'html',
-            'help'
-          ]),
-          align: 'right',
-          buttonsVisible: this.isFullscreen && isWeb ? 7 : 1
-        }
-      },
+      toolbarButtons: this.simpleToolbar
+        ? this.getSimpleToolbarOptions()
+        : isWeb ? this.getWebToolbarOptions() : this.getMobileToolbarOptions(),
       fullPage: false,
       language: this.getLocale(),
       events: {

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

@@ -19,6 +19,7 @@ export class YooFormTodoComponent {
     this.allowLibrary = undefined;
     this.values = undefined;
     this.linked = undefined;
+    this.translations = undefined;
     this.slidesTodo = undefined;
     this.slidesTodoTask = undefined;
   }
@@ -26,6 +27,7 @@ export class YooFormTodoComponent {
     var _a, _b;
     this.slidesTodo = data === null || data === void 0 ? void 0 : data.todo;
     this.slidesTodoTask = data === null || data === void 0 ? void 0 : data.todotask;
+    this.translations = data === null || data === void 0 ? void 0 : data.translations;
     if ((data === null || data === void 0 ? void 0 : data.customDataLoader) && ((_a = this.slidesTodo) === null || _a === void 0 ? void 0 : _a.length) > 0) {
       const assignToField = (_b = this.slidesTodo[0].items) === null || _b === void 0 ? void 0 : _b.find((f) => f.name === 'user' && f.type === 'autocomplete');
       assignToField.customDataLoader = data === null || data === void 0 ? void 0 : data.customDataLoader;
@@ -88,6 +90,7 @@ export class YooFormTodoComponent {
       dialog.allowLibrary = this.allowLibrary;
       dialog.values = isArray(this.values) ? this.values : [];
       dialog.linked = this.linked;
+      dialog.translations = this.translations;
       dialog.fieldFetchDataFn = (ev) => {
         this.fieldFetchData.emit(ev);
       };
@@ -423,6 +426,26 @@ export class YooFormTodoComponent {
         },
         "attribute": "linked",
         "reflect": false
+      },
+      "translations": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ITranslation[]",
+          "resolved": "ITranslation[]",
+          "references": {
+            "ITranslation": {
+              "location": "import",
+              "path": "@shared/interfaces"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
       }
     };
   }

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

@@ -12,6 +12,7 @@ export class YooFormTodoDialogComponent {
     this.allowLibrary = undefined;
     this.values = undefined;
     this.linked = undefined;
+    this.translations = undefined;
     this.validity = undefined;
   }
   onInternalFieldFetchData(ev) {
@@ -89,6 +90,8 @@ export class YooFormTodoDialogComponent {
     form.data = task;
     form.suffix = '.value';
     form.title = translate('YOOBICEDIT');
+    form.formType = 'form-todo';
+    form.translations = this.translations;
     showModal({ component: form }).then((ret) => {
       if (ret && ret.data) {
         task = ret.data;
@@ -320,6 +323,26 @@ export class YooFormTodoDialogComponent {
         },
         "attribute": "linked",
         "reflect": false
+      },
+      "translations": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "ITranslation[]",
+          "resolved": "ITranslation[]",
+          "references": {
+            "ITranslation": {
+              "location": "import",
+              "path": "@shared/interfaces"
+            }
+          }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        }
       }
     };
   }

package/dist/collection/components/form/form-todo-mission/form-todo-mission.js

@@ -1,5 +1,5 @@
-import { IUser } from '@shared/interfaces';
-import { dateFormat, fromToday, getCssColor, getMedia, getUserDisplayName, isDateAfter, isDateSame, isNativeMobile, isToday, isWeb, showActionSheet, translate, translateMulti } from '@shared/utils';
+import { FormFieldType, IUser } from '@shared/interfaces';
+import { dateFormat, fromToday, getCssColor, getMedia, getUserDisplayName, hideKeyboard, isDateAfter, isDateSame, isNativeMobile, isToday, isWeb, showActionSheet, translate, translateMulti } from '@shared/utils';
 import { forceUpdate, h, Host } from '@stencil/core';
 import { getAppContext } from '@yobi/utils/helpers/common-helpers';
 import { cloneDeep, compact, lowerFirst, pick } from 'lodash-es';
@@ -206,7 +206,7 @@ export class YooFormTodoMissionComponent {
     const readonlyComments = this.readonly || this.isAssignedToSomeoneElse(task) ? true : false;
     const renderComments = readonlyComments ? (((_a = task.showComments) === null || _a === void 0 ? void 0 : _a.value) && (userComments === null || userComments === void 0 ? void 0 : userComments.length)) : (_b = task.showComments) === null || _b === void 0 ? void 0 : _b.value;
     return (!!renderComments &&
-      h("section", { id: "comments", ...{ editModeComments: !readonlyComments } }, h("comments-header", null, h("p", { class: "comments-title" }, translate('COMMENTNOUN').toUpperCase()), h("p", { class: "comments-optional" }, "(", translate('OPTIONAL'), ")")), h("yoo-form-text-area", { onFocus: (e) => this.onCommentsFocused(e), value: userComments, resizable: "none", size: "small", placeholder: translate('ADDCOMMENTS'), disableEnter: true, validateInput: false, disableTab: true, onInputChanged: (ev) => {
+      h("section", { id: "comments", ...{ editModeComments: !readonlyComments } }, h("comments-header", null, h("p", { class: "comments-title" }, translate('COMMENTNOUN').toUpperCase()), h("p", { class: "comments-optional" }, "(", translate('OPTIONAL'), ")")), h("yoo-form-text-area", { onFocus: (e) => this.onCommentsFocused(e), value: userComments, resizable: "none", size: "small", placeholder: translate('ADDCOMMENTS'), disableEnter: true, validateInput: false, disableTab: true, onEnterPressed: (ev) => ev.detail && hideKeyboard(), onInputChanged: (ev) => {
           const updatedTask = this.values[index];
           updatedTask.userComments = ev.detail;
           this.emitUpdate({ task: updatedTask, index });
@@ -296,7 +296,12 @@ export class YooFormTodoMissionComponent {
       field.title = field.description || field.title;
       field.allowInvisibleDataInReadonly = true;
       delete field.condition;
-      return (h("section", { id: "previous" }, h("menu-left", null, h("yoo-icon", { name: "link", size: "medium", color: "app-color" }), h("div", { class: "border" })), h("menu-right", null, h("yoo-form-dynamic", { class: "inline transparent", slides: [{ title: 'YOOBICGENERAL', items: [field] }], data: { [field.name]: { value: task.fieldValue, ...task.fieldExtra } }, forceReadonly: true, onFormValidityChanged: (ev) => ev.stopPropagation(), suffix: ".value", animated: false, showRecap: false }))));
+      const extraData = [FormFieldType.photo, FormFieldType.multiphotos].includes(field.type) ? { ...task.fieldExtra } : null;
+      return (h("section", { id: "previous" }, h("menu-left", null, h("yoo-icon", { name: "link", size: "medium", color: "app-color" }), h("div", { class: "border" })), h("menu-right", null, h("yoo-form-dynamic", { class: "inline transparent", slides: [{ title: 'YOOBICGENERAL', items: [field] }], data: { [field.name]: {
+            value: task.fieldValue,
+            extraData,
+            ...task.fieldExtra
+          } }, forceReadonly: true, onFormValidityChanged: (ev) => ev.stopPropagation(), suffix: ".value", animated: false, showRecap: false }))));
     }
   }
   render() {

package/dist/collection/components/form-creator/form-creator-live-preview/form-creator-live-preview.css

@@ -15359,14 +15359,6 @@ mbsc-datetime {
   height: 1rem;
 }
 
-.royal-theme.fr-toolbar.fr-mobile .fr-command.fr-btn svg.fr-svg,
-.royal-theme.fr-popup.fr-mobile .fr-command.fr-btn svg.fr-svg,
-.royal-theme.fr-modal.fr-mobile .fr-command.fr-btn svg.fr-svg {
-  width: 1.5rem;
-  height: 1.5rem;
-  margin: 0;
-}
-
 .royal-theme.fr-toolbar .fr-btn-grp {
   margin: 0;
 }
@@ -15382,14 +15374,29 @@ mbsc-datetime {
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  min-width: 1.6875rem;
   height: 2rem;
   margin: 0;
   color: var(--dark, #000000);
   text-align: center;
 }
 
-.royal-theme.fr-toolbar.fr-mobile .fr-command.fr-btn,
+.royal-theme.fr-toolbar .fr-command.fr-btn:not(.fr-options),
+.royal-theme.fr-popup .fr-command.fr-btn:not(.fr-options),
+.royal-theme.fr-modal .fr-command.fr-btn:not(.fr-options) {
+  min-width: 1.6875rem;
+}
+
+.royal-theme.fr-toolbar.fr-mobile > .fr-btn-grp > .fr-command.fr-btn svg.fr-svg,
+.royal-theme.fr-toolbar.fr-mobile > .fr-btn-wrap > .fr-command.fr-btn:not(.fr-dropdown) svg.fr-svg,
+.royal-theme.fr-popup.fr-mobile .fr-command.fr-btn svg.fr-svg,
+.royal-theme.fr-modal.fr-mobile .fr-command.fr-btn svg.fr-svg {
+  width: 1.2rem;
+  height: 1.2rem;
+  margin: 0;
+}
+
+.royal-theme.fr-toolbar.fr-mobile > .fr-btn-grp > .fr-command.fr-btn,
+.royal-theme.fr-toolbar.fr-mobile > .fr-btn-grp > .fr-btn-wrap > .fr-command.fr-btn:not(.fr-dropdown),
 .royal-theme.fr-popup.fr-mobile .fr-command.fr-btn,
 .royal-theme.fr-modal.fr-mobile .fr-command.fr-btn {
   min-width: 1.5rem;
@@ -15434,22 +15441,27 @@ mbsc-datetime {
   font-family: var(--font-family, "Varela Round", "Lato");
 }
 
-.royal-theme.fr-toolbar {
+.royal-theme.fr-toolbar:not(.fr-mobile) {
   color: var(--dark, #000000);
   background: var(--light, #ffffff);
 }
-.royal-theme.fr-toolbar .fr-more-toolbar {
+.royal-theme.fr-toolbar:not(.fr-mobile) .fr-more-toolbar {
   background: var(--stable-light, #f1f1f1);
 }
+.royal-theme.fr-toolbar:not(.fr-mobile) .fr-command.fr-btn.fr-open {
+  margin-top: 0;
+}
+
 .royal-theme.fr-toolbar .fr-more-toolbar.fr-expanded {
   display: flex;
-  height: 32px;
-}
-.royal-theme.fr-toolbar .fr-command.fr-btn.fr-open {
-  margin-top: 0;
+  height: 2rem;
+  padding-left: 0 !important;
 }
 
-.royal-theme.fr-desktop .fr-command:hover:not(.fr-table-cell), .royal-theme.fr-desktop .fr-command:focus:not(.fr-table-cell), .royal-theme.fr-desktop .fr-command.fr-btn-hover:not(.fr-table-cell), .royal-theme.fr-desktop .fr-command.fr-expanded:not(.fr-table-cell) {
+.royal-theme.fr-desktop .fr-command:hover:not(.fr-table-cell),
+.royal-theme.fr-desktop .fr-command:focus:not(.fr-table-cell),
+.royal-theme.fr-desktop .fr-command.fr-btn-hover:not(.fr-table-cell),
+.royal-theme.fr-desktop .fr-command.fr-expanded:not(.fr-table-cell) {
   background: var(--stable-alt, #d0d0d0);
 }
 
@@ -15527,34 +15539,6 @@ yoo-button.fr-fullscreen-wrapper {
   font-family: var(--font-family, "Varela Round", "Lato") !important;
 }
 
-yoo-form-text-editor .fullscreen .fr-toolbar-open .fr-wrapper {
-  height: calc(100% - 6.25rem) !important;
-}
-yoo-form-text-editor .fullscreen .fr-wrapper {
-  height: calc(100% - 2.5625rem) !important;
-}
-yoo-form-text-editor .fullscreen .fr-wrapper iframe {
-  height: 100% !important;
-}
-yoo-form-text-editor .fullscreen .royal-theme.fr-toolbar.fr-top:not(.fr-desktop) {
-  padding-top: var(--safe-area-inset-top);
-}
-yoo-form-text-editor .fullscreen .royal-theme.fr-toolbar:not(.fr-mobile) .fr-command.fr-btn,
-yoo-form-text-editor .fullscreen .royal-theme.fr-popup:not(.fr-mobile) .fr-command.fr-btn,
-yoo-form-text-editor .fullscreen .royal-theme.fr-modal:not(.fr-mobile) .fr-command.fr-btn {
-  min-width: 2.2rem;
-  height: 4rem;
-}
-yoo-form-text-editor .fullscreen .royal-theme.fr-toolbar:not(.fr-mobile) .fr-command.fr-btn svg.fr-svg,
-yoo-form-text-editor .fullscreen .royal-theme.fr-popup:not(.fr-mobile) .fr-command.fr-btn svg.fr-svg,
-yoo-form-text-editor .fullscreen .royal-theme.fr-modal:not(.fr-mobile) .fr-command.fr-btn svg.fr-svg {
-  width: 1.2rem;
-  height: 1.2rem;
-}
-yoo-form-text-editor .fullscreen .royal-theme.fr-toolbar:not(.fr-mobile) .fr-more-toolbar.fr-expanded {
-  height: 4rem;
-}
-
 :host {
   display: flex;
   flex-direction: column;

package/dist/collection/components/grid/grid/grid-helper.js

@@ -1,6 +1,5 @@
+import { isNativeMobile } from '@shared/utils';
 export function shouldUseVirtualScroll(user, gridVirtualScrollEnabled, isFramedGrid) {
-  const enableVirtualScroll = user === null || user === void 0 ? void 0 : user.enableVirtualScroll;
-  const isLowEndDevice = user === null || user === void 0 ? void 0 : user.isLowEndDevice;
-  return !!(enableVirtualScroll ||
-    (enableVirtualScroll === undefined && isLowEndDevice)) && gridVirtualScrollEnabled && !isFramedGrid;
+  const enableVirtualScroll = !!((user === null || user === void 0 ? void 0 : user.enableVirtualScroll) || ((user === null || user === void 0 ? void 0 : user.enableVirtualScroll) === undefined && (isNativeMobile() || (user === null || user === void 0 ? void 0 : user.isLowEndDevice))));
+  return enableVirtualScroll && gridVirtualScrollEnabled && !isFramedGrid;
 }

package/dist/collection/components/grid/grid/grid-helper.spec.js

@@ -7,16 +7,17 @@ describe('form-capture-helper', () => {
     [true, undefined, true, true, false, true],
     [true, undefined, false, true, false, false],
     [true, false, false, true, false, false],
-    [true, undefined, false, true, false, false],
     [true, true, true, true, true, false],
     [true, true, true, false, true, false],
     [false, true, true, true, false, false],
     [false, undefined, null, false, false, false]
   ])('for userNotNull %s, enableVirtualScroll %s, isLowEndDevice %s, gridVirtualScrollEnabled %s, isFramedGrid %s shouldUseVirtualScroll should return : %s', (userNotNull, enableVirtualScroll, isLowEndDevice, gridVirtualScrollEnabled, isFramedGrid, expected) => {
-    const user = userNotNull ? {
-      isLowEndDevice,
-      enableVirtualScroll
-    } : null;
+    const user = userNotNull
+      ? {
+        isLowEndDevice,
+        enableVirtualScroll
+      }
+      : null;
     expect(shouldUseVirtualScroll(user, gridVirtualScrollEnabled, isFramedGrid)).toEqual(expected);
   });
 });

package/dist/collection/components/grid/grid/grid.js

@@ -407,7 +407,12 @@ export class YooGridComponent {
     }
   }
   async updateValues(values, total, gridCurrentSearch) {
-    this.items = values;
+    if (this.isFormField) {
+      this.items = [].concat(this.items || []).concat(values || []);
+    }
+    else {
+      this.items = values;
+    }
     if (total >= 0) {
       this.total = total;
     }
@@ -1104,9 +1109,11 @@ export class YooGridComponent {
           return [];
         }
       },
-      isServerSideGroup: this.isTree() ? (item) => {
-        return !(item === null || item === void 0 ? void 0 : item.isLeaf);
-      } : null,
+      isServerSideGroup: this.isTree()
+        ? (item) => {
+          return !(item === null || item === void 0 ? void 0 : item.isLeaf);
+        }
+        : null,
       getServerSideGroupKey: this.isTree()
         ? (dataItem) => {
           return dataItem._id;
@@ -2106,7 +2113,7 @@ export class YooGridComponent {
     return (this.showSearch !== false && [
       !isWeb(this.host) && this.shouldRenderToggleSelectAll() && !this.showAutocompleteHeader && h("yoo-button", { class: "select-all", disabled: !this.canSelectAll, shape: "circular", fill: "transparent", rippleType: "unbounded", color: this.isSelectAll ? 'app-color' : 'stable', onClick: () => this.onToggleSelectAll() }, h("yoo-icon", { name: "select-all", color: this.isSelectAll ? 'app-color' : 'stable' })),
       (isWeb(this.host) || this.hideAdvancedFilters || this.showFilters === false) ? null : h("yoo-button", { class: "margin-right filters", color: "light", onClick: () => this.onShowFilterAdvanced(), fill: "transparent", shape: "circular", rippleType: "bounded" }, h("yoo-icon", { name: "filter", color: "stable", slot: "start", size: "medium" }), this.getActiveFiltersCount() > 0 && (h("yoo-badge", { color: "app-color", slot: "end", class: "count floating", text: `${this.getActiveFiltersCount()}` }))),
-      h("yoo-form-input", { ref: (el) => (this.input = el), debounce: 1200, autocapitalize: "none", autocorrect: "off", disabled: this.isSelectAll, disableKeyboardResizing: true, class: {
+      h("yoo-form-input", { ref: (el) => (this.input = el), debounce: 1200, autocapitalize: "none", autocorrect: "off", disabled: this.isSelectAll && !this.searchText, disableKeyboardResizing: true, class: {
           search: true,
           flex: !isWeb(this.host),
           web: isWeb(this.host),
@@ -2752,7 +2759,7 @@ export class YooGridComponent {
         'no-padding full-width': !!((_a = this.gridExtraOptions) === null || _a === void 0 ? void 0 : _a.displaySubItemsAsSlides)
       };
     };
-    const tagTypeElement = h(ItemTagType, { class: "sub-item-container", options: (_f = this.gridExtraOptions) === null || _f === void 0 ? void 0 : _f.subItemSlideOptions }, this.hasSecondaryActions
+    const tagTypeElement = (h(ItemTagType, { class: "sub-item-container", options: (_f = this.gridExtraOptions) === null || _f === void 0 ? void 0 : _f.subItemSlideOptions }, this.hasSecondaryActions
       ? items.map((item, i) => {
         var _a;
         return this.showActionsAsMore
@@ -2766,7 +2773,7 @@ export class YooGridComponent {
             'no-padding': (_b = (_a = this.host) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('no-padding-item'),
             'item-visible': (_d = (_c = this.host) === null || _c === void 0 ? void 0 : _c.classList) === null || _d === void 0 ? void 0 : _d.contains('item-visible')
           }, disabled: this.areItemsDisabled }, ((_e = this.sequentialItemsStates) === null || _e === void 0 ? void 0 : _e[item === null || item === void 0 ? void 0 : item._id]) && this.renderSequentialEntityState(this.sequentialItemsStates[item === null || item === void 0 ? void 0 : item._id]), this.renderEntity(item, isLastHeader && idx === items.length - 1, idx)), isWeb(this.host) && (this.keepSelection || this.isSelectionMode) && (h("yoo-icon", { class: "position", onClick: (ev) => this.onItemSelect(item, true, ev), name: this.isSelected(item) ? 'check' : 'circle', color: this.isSelected(item) ? 'app-color' : 'stable' }))));
-      }));
+      })));
     return [
       h(TagType, { class: "no-padding", collapsed: this.gridExtraOptions && !(((_g = this.gridExtraOptions) === null || _g === void 0 ? void 0 : _g.expandFirstItem) && headerIndex === 0), slotHeader: true }, this.entityType === 'lessons' && this.displayType === 'card-list' ?
         h("yoo-collapsible", { class: "lesson-detail padding no-padding", slotHeader: true, iconSize: "medium", collapsed: false }, h("div", { ref: (el) => (this.collapsibleEl[headerIndex] = el), slot: "title" }, itemHeader), tagTypeElement) :
@@ -3278,12 +3285,14 @@ export class YooGridComponent {
   renderBaseContent() {
     const isEmpty = this.host.classList.contains('empty');
     const isRelative = true; // isFirefox() ? this.containerBase?.classList?.contains('dialog') : true;
-    return this.scrollable && !this.isAgGrid() && !this.isCalendar() ? ([
-      h("slot", { name: "before-scroll" }),
-      h("yoo-ion-scroll", { slotName: "grid-content-slot" // set a name to fix "A problem repeatedly occurred with..." on Safari
-        ,
-        class: { 'no-scrollbar': !isWeb(this.host) && !isForceScrollbar(), relative: isRelative, empty: isEmpty }, scrollEvents: true, onHideTabbar: (ev) => this.onHideShowSearchBar(ev), onIonScroll: (ev) => ev.stopPropagation() }, h("div", { class: "grid-content-slot", slot: "grid-content-slot" }, this.renderContent()))
-    ]) : (this.renderContent());
+    return this.scrollable && !this.isAgGrid() && !this.isCalendar()
+      ? [
+        h("slot", { name: "before-scroll" }),
+        h("yoo-ion-scroll", { slotName: "grid-content-slot" // set a name to fix "A problem repeatedly occurred with..." on Safari
+          ,
+          class: { 'no-scrollbar': !isWeb(this.host) && !isForceScrollbar(), relative: isRelative, empty: isEmpty }, scrollEvents: true, onHideTabbar: (ev) => this.onHideShowSearchBar(ev), onIonScroll: (ev) => ev.stopPropagation() }, h("div", { class: "grid-content-slot", slot: "grid-content-slot" }, this.renderContent()))
+      ]
+      : this.renderContent();
   }
   updateMainProgress() {
     if (this.showProgress && this.progressHandler) {

package/dist/collection/feature-communicate/feed/card-feed/default/card-feed.css

@@ -1818,7 +1818,14 @@ svg:not(:root) {
   position: absolute;
   bottom: var(--spacing-16, 1rem);
   display: flex;
+  width: 100%;
   height: var(--spacing-48, 3rem);
+  overflow-y: scroll;
+}
+:host(.detail-view.web) .outer-container .left-container .thumbnail-view-container .inner-container {
+  display: flex;
+  margin: 0 auto;
+  padding: 0 var(--spacing-16, 1rem);
 }
 :host(.detail-view.web) .outer-container .left-container .thumbnail-view-container yoo-img {
   margin-left: var(--spacing-08, 0.5rem);