@yoobic/yobi 8.1.0-13 → 8.1.0-14

package/dist/collection/components/app-operations/mission-details/mission-details.js

@@ -1,4 +1,4 @@
-import { dateFormat, fromToday, getAsyncExtraData, getCssColor, getMissionPublicationDate, getSession, isDateAfter, isDateSame, isIonic, isOffline, isPresent, isToday, isWeb, pipes, translate, translateMulti } from '@shared/utils';
+import { dateFormat, fromToday, getAsyncExtraData, getCssColor, getMissionPublicationDate, getSession, isDateAfter, isDateSame, isIonic, isPresent, isToday, isWeb, pipes, translate, translateMulti } from '@shared/utils';
 import { Component, Element, Event, h, Host, Prop, State, Watch } from '@stencil/core';
 import { getAppContext } from '../../../utils/helpers/common-helpers';
 import { getMissionAddress, getMissionDueDate, getMissionPriority, getMissionTags, mapMissionToCardInboxEntry } from '../../../utils/helpers/missions-helpers';
@@ -40,7 +40,14 @@ export class YooMissionDetailsComponent {
     var _a;
     if (((_a = this.mission) === null || _a === void 0 ? void 0 : _a.type) === 'todo' && this.mission.originalMissionId) {
       return getAsyncExtraData({ type: 'entity-detail', params: { collectionName: 'missions', id: this.mission.originalMissionId } })
-        .then((mission) => (this.originalMission = mission))
+        .then((mission) => {
+        if (mission._id === this.mission.originalMissionId) {
+          this.originalMission = mission;
+        }
+        else {
+          this.originalMission = null;
+        }
+      })
         .catch(() => (this.originalMission = null));
     }
     this.originalMission = null;
@@ -61,6 +68,10 @@ export class YooMissionDetailsComponent {
     ev.stopPropagation();
     this.preview.emit();
   }
+  onAssign(ev) {
+    ev.stopPropagation();
+    this.assign.emit();
+  }
   renderExtraActions(user) {
     var _a;
     if (((_a = this.extraActions) === null || _a === void 0 ? void 0 : _a.length) > 0) {
@@ -335,33 +346,51 @@ export class YooMissionDetailsComponent {
         h("yoo-card-inbox", { entry: entry })));
     }
   }
-  renderButtonFooter() {
-    let buttons;
-    if (this.isBookable || this.canParticipate) {
-      if (!this.mission.status && this.isBookable) {
-        buttons = [
-          { text: translate('PREVIEW'), size: isWeb(this.host) ? 'medium' : 'large', color: 'light', handler: (ev) => this.onPreview(ev) },
-          { text: translate('START'), size: isWeb(this.host) ? 'medium' : 'large', color: 'app-color', handler: (ev) => this.onBook('start', ev) }
-        ];
+  renderFooter() {
+    var _a, _b;
+    const buttons = [];
+    const size = (isWeb(this.host) ? 'medium' : 'large');
+    const buttonsConfig = {
+      assign: {
+        text: translate(this.mission.ownerRef ? 'REASSIGN' : 'ASSIGN'),
+        size,
+        handler: (ev) => this.onAssign(ev)
+      },
+      continue: {
+        text: translate('CONTINUE'),
+        size,
+        cssClass: 'continue',
+        handler: (ev) => this.onBook('continue', ev)
+      },
+      preview: {
+        text: translate('PREVIEW'),
+        size,
+        handler: (ev) => this.onPreview(ev)
+      },
+      start: {
+        text: translate('START'),
+        size,
+        handler: (ev) => this.onBook('start', ev)
+      },
+      unbook: {
+        text: translate('UNBOOK'),
+        size,
+        color: 'light',
+        cssClass: 'unbook',
+        handler: (ev) => this.onBook('unbook', ev)
       }
-      else {
-        buttons =
-          isOffline() || !this.isBookable
-            ? []
-            : [{ text: translate('UNBOOK'), size: isWeb(this.host) ? 'medium' : 'large', cssClass: 'unbook', color: 'light', handler: (ev) => this.onBook('unbook', ev) }];
-        buttons = [
-          ...buttons,
-          { text: translate('CONTINUE'), size: isWeb(this.host) ? 'medium' : 'large', cssClass: 'continue', color: 'app-color', handler: (ev) => this.onBook('continue', ev) }
-        ];
+    };
+    const lastIndex = ((_a = this.actions) === null || _a === void 0 ? void 0 : _a.length) - 1;
+    (_b = this.actions) === null || _b === void 0 ? void 0 : _b.forEach((item, index) => {
+      const config = buttonsConfig[item];
+      if (config) {
+        buttons.push({
+          ...buttonsConfig[item],
+          color: (index === lastIndex) ? 'app-color' : 'light'
+        });
       }
-    }
-    else {
-      buttons = [{ text: translate('PREVIEW'), size: isWeb(this.host) ? 'medium' : 'large', color: 'app-color', handler: (ev) => this.onPreview(ev) }];
-    }
-    if (buttons.length > 0) {
-      return h("yoo-form-footer", { buttons: buttons });
-    }
-    return null;
+    });
+    return !!buttons.length && h("yoo-form-footer", { buttons: buttons });
   }
   renderActionPlanDetails() {
     return (h("div", { class: 'mission-detail ' + (this.isMobile ? '' : 'web') },
@@ -421,7 +450,7 @@ export class YooMissionDetailsComponent {
             h("slot", null)),
           h("slot", { name: "end" }),
           h("div", { class: "scroll-spacer" }))),
-      this.renderButtonFooter()));
+      this.renderFooter()));
   }
   renderTodos() {
     var _a, _b;
@@ -448,9 +477,8 @@ export class YooMissionDetailsComponent {
   }
   renderResults() {
     var _a, _b, _c, _d;
-    const session = getSession();
     const excludedTabs = ['dueDate', 'category'];
-    const tags = getMissionTags(this.mission, session).filter((tag) => !excludedTabs.includes(tag._id));
+    const tags = getMissionTags(this.mission).filter((tag) => !excludedTabs.includes(tag._id));
     const reasonSectionTitle = this.mission.validated ? 'COMMENTNOUN' : 'REASON';
     return (h("div", { class: { 'mission-results': true, pdf: this.isPdf, ...getAppContext(this.host) } },
       this.isPdf && (h("div", { class: "header-photo-container" },
@@ -821,59 +849,45 @@ export class YooMissionDetailsComponent {
       "attribute": "is-pdf",
       "reflect": false
     },
-    "extraActions": {
+    "actions": {
       "type": "unknown",
       "mutable": false,
       "complexType": {
-        "original": "IEntityAction[]",
-        "resolved": "IEntityAction[]",
+        "original": "TMissionActionIds[]",
+        "resolved": "TMissionActionIds[]",
         "references": {
-          "IEntityAction": {
+          "TMissionActionIds": {
             "location": "import",
             "path": "@shared/interfaces"
           }
         }
       },
       "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      }
-    },
-    "isBookable": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
       "optional": false,
       "docs": {
         "tags": [],
         "text": ""
-      },
-      "attribute": "is-bookable",
-      "reflect": false
+      }
     },
-    "canParticipate": {
-      "type": "boolean",
+    "extraActions": {
+      "type": "unknown",
       "mutable": false,
       "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+        "original": "IEntityAction[]",
+        "resolved": "IEntityAction[]",
+        "references": {
+          "IEntityAction": {
+            "location": "import",
+            "path": "@shared/interfaces"
+          }
+        }
       },
       "required": false,
       "optional": true,
       "docs": {
         "tags": [],
         "text": ""
-      },
-      "attribute": "can-participate",
-      "reflect": false
+      }
     },
     "animated": {
       "type": "boolean",
@@ -945,6 +959,21 @@ export class YooMissionDetailsComponent {
         "resolved": "void",
         "references": {}
       }
+    }, {
+      "method": "assign",
+      "name": "assign",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "void",
+        "resolved": "void",
+        "references": {}
+      }
     }, {
       "method": "showUser",
       "name": "showUser",

package/dist/collection/components/app-operations/mission-heading/mission-heading.js

@@ -1,4 +1,4 @@
-import { canParticipate, canPerfomActionPlan, getAuthentication, getSession, isIonic, isMissionBookable, translate, translateMulti } from '@shared/utils';
+import { canParticipateTo, canPerformActionPlan, isIonic, isMissionBookable, translate, translateMulti } from '@shared/utils';
 import { Component, Element, h, Host, Prop } from '@stencil/core';
 import { getAppContext } from '../../../utils/helpers/common-helpers';
 import { getMissionTags } from '../../../utils/helpers/missions-helpers';
@@ -10,19 +10,16 @@ export class YooMissionHeadingComponent {
     this.isMobile = isIonic(this.host);
   }
   renderLock() {
-    const authentication = getAuthentication();
-    const session = getSession();
     const isActionPlan = this.mission.type === 'todo';
-    const isMissionLocked = !isActionPlan && !isMissionBookable(this.mission, authentication, session) && !canParticipate(this.mission, session);
-    const isActionPlanLocked = isActionPlan && !canPerfomActionPlan(this.mission, session) && !canParticipate(this.mission, session);
+    const isMissionLocked = !isActionPlan && !isMissionBookable(this.mission) && !canParticipateTo(this.mission);
+    const isActionPlanLocked = isActionPlan && !canPerformActionPlan(this.mission) && !canParticipateTo(this.mission);
     if ((!this.mission.status || this.mission.status === 'booked') && (isMissionLocked || isActionPlanLocked)) {
       return h("yoo-banner", { mode: "card", class: "mission-locked", leftIcon: "lock", leftIconColor: "warning", heading: translate('MISSIONLOCKEDBANNER') });
     }
   }
   render() {
-    const session = getSession();
     const excludedTabs = ['dueDate', 'category'];
-    const tags = getMissionTags(this.mission, session).filter((tag) => !excludedTabs.includes(tag._id));
+    const tags = getMissionTags(this.mission).filter((tag) => !excludedTabs.includes(tag._id));
     return (h(Host, { class: getAppContext(this.host) },
       h("div", { class: { 'background-container': true, pdf: this.isPdf } },
         h("div", { class: "content-container" },

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

@@ -43,6 +43,7 @@ export class YooFormAutocompleteComponent {
     this.shouldFetchDataOnTagSelect = true;
     this.gridIsExpanded = false;
     this.maxPage = 0;
+    this.infiniteScrollDisabled = false;
   }
   async onWebAutocompleteOpened() {
     if (this.showDropdownContent) {
@@ -353,6 +354,10 @@ export class YooFormAutocompleteComponent {
   onFetchData(ev) {
     var _a;
     ev.stopPropagation();
+    if (this.customDataLoader) {
+      this.onFetchDataCustom(ev);
+      return null;
+    }
     // If a user has selected items that are not on the first page and has searched for items then the selected items will be lost and only their ids kept
     // On the first load we must load the previous max items to ensure the selected items are loaded correctly
     if (this.idOnly && !ev.detail.search && ((_a = this.selection) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.maxPage > ev.detail.currentPage && ev.detail.currentPage === 0) {
@@ -362,6 +367,51 @@ export class YooFormAutocompleteComponent {
     this.gridCurrentSearch = ev.detail;
     this.refresh();
   }
+  onFetchDataCustom(ev) {
+    const search = ev.detail;
+    const finalPageSize = 20;
+    this.isLoading = true;
+    return this.customDataLoader({
+      currentPage: search.currentPage,
+      pageSize: finalPageSize,
+      startDate: search.startDate,
+      endDate: search.endDate,
+      sortAndFilters: this.sortsAndFilters,
+      search: search.search
+    }).then((ret) => {
+      var _a, _b;
+      if (search.currentPage === 0) {
+        this.values = [...(ret.data || [])];
+      }
+      else {
+        this.values = [...(this.values || []), ...(ret.data || [])];
+      }
+      this.isLoading = false;
+      const hasReachedMaxItem = (((_a = ret === null || ret === void 0 ? void 0 : ret.data) === null || _a === void 0 ? void 0 : _a.length) || 0) < finalPageSize;
+      if (ev && (search === null || search === void 0 ? void 0 : search.infiniteScroll)) {
+        search.infiniteScroll.complete();
+        if (search.infiniteScrollType === 'infiniteScroll' && hasReachedMaxItem) {
+          search.infiniteScroll.disabled = true;
+          this.infiniteScrollDisabled = true;
+        }
+        else {
+          this.infiniteScrollDisabled = false;
+        }
+      }
+      else {
+        this.infiniteScrollDisabled = hasReachedMaxItem;
+      }
+      if (this.dialog) {
+        this.dialog.values = this.values;
+        this.dialog.infiniteScrollDisabled = this.infiniteScrollDisabled;
+        this.dialog.isLoading = false;
+      }
+      if (!this.initialValueLength) {
+        this.initialValueLength = (_b = this.values) === null || _b === void 0 ? void 0 : _b.length;
+      }
+      return this.values;
+    });
+  }
   onFetchFieldFilterData(ev) {
     ev.stopPropagation();
     this.fetchFieldFilterData.emit(ev.detail);
@@ -523,6 +573,7 @@ export class YooFormAutocompleteComponent {
     this.dialog.dynamicOrdering = this.dynamicOrdering;
     this.dialog.secondaryActions = this.secondaryActions;
     this.dialog.origin = this.origin;
+    this.dialog.infiniteScrollDisabled = this.infiniteScrollDisabled;
     if (this.isLocal) {
       this.dialog.values = this.localValues;
       this.dialog.value = this.hideSelectionFromInput ? null : this.value;
@@ -948,7 +999,7 @@ export class YooFormAutocompleteComponent {
               'live-preview-dropdown': this.host.classList.contains('live-preview-autocomplete')
             }, items: this.values, currentPage: ((_b = this.selection) === null || _b === void 0 ? void 0 : _b.length) && this.currentPage !== 0 ? this.maxPage : this.currentPage, pageSize: this.pageSize, selectedTags: this.currentSelectedTags, isAutoComplete: true, isGridClosedWithSearchText: this.isGridClosedWithSearchText, keepSelection: true, dynamicOrdering: this.dynamicOrdering !== false, multiple: this.isMultiple(), displayType: this.displayType, displayTypes: this.displayType === 'card-cell' || this.entityType === 'files' ? ['card-cell', 'card-list'] : null, onSelected: (ev) => this.onItemSelect(ev), onRemoved: (ev) => this.onItemSelect(ev), onSelectallToggled: (ev) => this.onItemSelect(ev), collectionName: this.collectionName, entityType: this.getEntityType(), onSearchInputEnterPressed: (ev) => this.onCustomTagCreated(ev), onFetchData: (ev) => this.onFetchData(ev), onFieldFetchData: (ev) => this.onFetchFieldFilterData(ev), onSortsAndFiltersChange: (ev) => this.onSortsAndFiltersChange(ev), onCurrentPageChanged: (ev) => this.onCurrentPageChange(ev === null || ev === void 0 ? void 0 : ev.detail), hideHeader: isNullOrUndefined(this.hideHeader) ? false : this.hideHeader, showSearch: !this.forceHideSearch && (this.initialValueLength > minValuesForSearch || this.allowCustomTag || this.allowCustomValue || this.entityType === 'googlemaps'), isLocal: this.isLocal, onGridExpanded: () => this.onExpandGrid(), useTranslate: this.useTranslate, initialSelection: this.returnQuery ? null : this.value, idOnly: this.idOnly || this.allowCustomTag, idAttributeName: this.idAttributeName || '_id', emptyState: this.emptyState, allowCustomTag: (this.allowCustomTag || this.tag || this.allowCustomValue) && !this.forceDisableCustomTags, searchBarPlaceholder: (this.allowCustomTag || this.allowCustomValue) && !this.forceDisableCustomTags
               ? translate(this.isLocal ? 'AUTOCOMPLETESEARCHADD' : 'SEARCHORADD')
-              : translate('SEARCH'), tags: this.tags, forceHideSearch: this.forceHideSearch, maxSelectionNumber: this.max, customModel: this.customModel, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : this.searchText, model: this.model, hideAdvancedFilters: !this.model, hideRefreshButton: true, showFilters: false, onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, onAddNewTagPressed: (ev) => this.onCustomTagCreated(ev), disableSingleDeselection: this.disableSingleDeselection, idOnlyInitialSelection: this.idOnlyInitialSelection, isLoading: this.isLoading, valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_c = this.value) === null || _c === void 0 ? void 0 : _c.sortsAndFilters : null, onFileUpload: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.click(); }, isUploading: this.isUploading, showFormRadio: this.isFilter, selectedFilterOperator: this.filterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev.detail), onMaxPageCountChanged: (ev) => (this.maxPage = Math.max(ev.detail, this.maxPage)), onSearchedItemSelected: (ev) => this.getSearchedItemSelection(ev) }))))))));
+              : translate('SEARCH'), tags: this.tags, forceHideSearch: this.forceHideSearch, maxSelectionNumber: this.max, customModel: this.customModel, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : this.searchText, model: this.model, hideAdvancedFilters: !this.model, hideRefreshButton: true, showFilters: false, onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, onAddNewTagPressed: (ev) => this.onCustomTagCreated(ev), disableSingleDeselection: this.disableSingleDeselection, idOnlyInitialSelection: this.idOnlyInitialSelection, isLoading: this.isLoading, valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_c = this.value) === null || _c === void 0 ? void 0 : _c.sortsAndFilters : null, onFileUpload: () => { var _a; return (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.click(); }, isUploading: this.isUploading, showFormRadio: this.isFilter, selectedFilterOperator: this.filterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev.detail), onMaxPageCountChanged: (ev) => (this.maxPage = Math.max(ev.detail, this.maxPage)), onSearchedItemSelected: (ev) => this.getSearchedItemSelection(ev), infiniteScrollDisabled: this.infiniteScrollDisabled }))))))));
   }
   renderReadonly() {
     if (this.selection && this.selection.length > 0) {
@@ -2453,6 +2504,26 @@ export class YooFormAutocompleteComponent {
       },
       "attribute": "use-uploader",
       "reflect": false
+    },
+    "customDataLoader": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "TGridCustomDataLoader",
+        "resolved": "(options: IGridCustomDataLoaderOptions) => Promise<IGridCustomDataLoaderOptionsData<IEntity>>",
+        "references": {
+          "TGridCustomDataLoader": {
+            "location": "import",
+            "path": "@shared/interfaces"
+          }
+        }
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      }
     }
   }; }
   static get states() { return {

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

@@ -21,6 +21,7 @@ export class YooFormAutocompleteDialogComponent {
     this.showHeaderWeb = false;
     this.modalPlacement = 'below';
     this.values = [];
+    this.infiniteScrollDisabled = false;
     this.fullscreen = false;
     this.gridIsExpanded = false;
     this.initialValueLength = 0;
@@ -374,7 +375,7 @@ export class YooFormAutocompleteDialogComponent {
         'expanded-grid': true,
         'no-margin autocomplete': isWeb(this.host),
         'autocomplete-selection-mode': true
-      }, items: this.isLocal ? this.localValues : this.values, pageSize: this.pageSize, selectedTags: this.currentSelectedTags, dynamicOrdering: this.dynamicOrdering !== false, keepSelection: true, multiple: this.multiple, displayType: this.displayType, displayTypes: this.displayType === 'card-cell' || this.entityType === 'files' ? ['card-cell', 'card-list'] : null, collectionName: this.collectionName, entityType: this.getEntityType(), hideHeader: isNullOrUndefined(this.hideHeader) ? false : this.hideHeader, showSearch: this.forceHideSearch ? false : true, forceHideSearch: this.forceHideSearch, customModel: this.customModel, isLocal: this.isLocal, useTranslate: this.useTranslate, initialSelection: this.returnQuery ? null : this.value, onSelected: (ev) => this.onItemSelect(ev), onRemoved: (ev) => this.onItemSelect(ev), onSelectallToggled: (ev) => this.onItemSelect(ev), onFetchData: (ev) => this.onFetchGridData(ev), onFieldFetchData: (ev) => this.onFetchFieldFilterData(ev), onSortsAndFiltersChange: (ev) => this.onSortsAndFiltersChange(ev), allowCustomTag: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags, idOnly: this.idOnly || this.allowCustomTag || this.tag, idAttributeName: this.idAttributeName || '_id', onSearchInputEnterPressed: (ev) => this.onSearchInputValue(ev), onAddNewTagPressed: (ev) => this.addNewTag(ev), searchBarPlaceholder: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags ? translate(this.isLocal ? 'AUTOCOMPLETESEARCHADD' : 'SEARCHORADD') : translate('SEARCH'), emptyState: this.emptyState || this.entityType, tags: this.tags, model: this.model, maxSelectionNumber: this.max, hideAdvancedFilters: !this.gridIsExpanded, showFilters: this.gridIsExpanded, onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, isLoading: this.isLoading, clearTags: this.clearTags, extraClass: this.extraClass, isAutoComplete: true, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : null, idOnlyInitialSelection: this.idOnlyInitialSelection, hideRefreshButton: true, disableSingleDeselection: this.disableSingleDeselection, forceLocalInfiniteScroll: this.isLocal && ((_a = this.localValues) === null || _a === void 0 ? void 0 : _a.length) < ((_b = this.values) === null || _b === void 0 ? void 0 : _b.length), gridIsExpanded: this.gridIsExpanded, valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_c = this.value) === null || _c === void 0 ? void 0 : _c.sortsAndFilters : null, showFormRadio: this.isFilter, selectedFilterOperator: this.selectedFilterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev), gridExtraOptions: this.gridExtraOptions, secondaryActions: this.secondaryActions, origin: this.origin }));
+      }, items: this.isLocal ? this.localValues : this.values, pageSize: this.pageSize, selectedTags: this.currentSelectedTags, dynamicOrdering: this.dynamicOrdering !== false, keepSelection: true, multiple: this.multiple, displayType: this.displayType, displayTypes: this.displayType === 'card-cell' || this.entityType === 'files' ? ['card-cell', 'card-list'] : null, collectionName: this.collectionName, entityType: this.getEntityType(), hideHeader: isNullOrUndefined(this.hideHeader) ? false : this.hideHeader, showSearch: this.forceHideSearch ? false : true, forceHideSearch: this.forceHideSearch, customModel: this.customModel, isLocal: this.isLocal, useTranslate: this.useTranslate, initialSelection: this.returnQuery ? null : this.value, onSelected: (ev) => this.onItemSelect(ev), onRemoved: (ev) => this.onItemSelect(ev), onSelectallToggled: (ev) => this.onItemSelect(ev), onFetchData: (ev) => this.onFetchGridData(ev), onFieldFetchData: (ev) => this.onFetchFieldFilterData(ev), onSortsAndFiltersChange: (ev) => this.onSortsAndFiltersChange(ev), allowCustomTag: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags, idOnly: this.idOnly || this.allowCustomTag || this.tag, idAttributeName: this.idAttributeName || '_id', onSearchInputEnterPressed: (ev) => this.onSearchInputValue(ev), onAddNewTagPressed: (ev) => this.addNewTag(ev), searchBarPlaceholder: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags ? translate(this.isLocal ? 'AUTOCOMPLETESEARCHADD' : 'SEARCHORADD') : translate('SEARCH'), emptyState: this.emptyState || this.entityType, tags: this.tags, model: this.model, maxSelectionNumber: this.max, hideAdvancedFilters: !this.gridIsExpanded, showFilters: this.gridIsExpanded, onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, isLoading: this.isLoading, clearTags: this.clearTags, extraClass: this.extraClass, isAutoComplete: true, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : null, idOnlyInitialSelection: this.idOnlyInitialSelection, hideRefreshButton: true, disableSingleDeselection: this.disableSingleDeselection, forceLocalInfiniteScroll: this.isLocal && ((_a = this.localValues) === null || _a === void 0 ? void 0 : _a.length) < ((_b = this.values) === null || _b === void 0 ? void 0 : _b.length), gridIsExpanded: this.gridIsExpanded, valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_c = this.value) === null || _c === void 0 ? void 0 : _c.sortsAndFilters : null, showFormRadio: this.isFilter, selectedFilterOperator: this.selectedFilterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev), gridExtraOptions: this.gridExtraOptions, secondaryActions: this.secondaryActions, origin: this.origin, infiniteScrollDisabled: this.infiniteScrollDisabled }));
   }
   renderGrid() {
     var _a, _b, _c, _d;
@@ -384,7 +385,7 @@ export class YooFormAutocompleteDialogComponent {
         'no-margin autocomplete': isWeb(this.host),
         'autocomplete-selection-mode': true,
         'empty-tags': ((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) === 0 && this.allowCustomTag
-      }, items: this.isLocal ? this.localValues : this.values, pageSize: this.pageSize, selectedTags: this.currentSelectedTags, dynamicOrdering: this.dynamicOrdering !== false, keepSelection: true, multiple: this.multiple, displayType: this.displayType, displayTypes: this.displayType === 'card-cell' || this.entityType === 'files' ? ['card-cell', 'card-list'] : null, collectionName: this.collectionName, entityType: this.getEntityType(), hideHeader: isNullOrUndefined(this.hideHeader) ? false : this.hideHeader, showSearch: this.tag || this.showSearchOrTags(), forceHideSearch: this.forceHideSearch, customModel: this.customModel, isLocal: this.isLocal, useTranslate: this.useTranslate, onGridExpanded: () => this.onExpandGrid(), initialSelection: this.returnQuery ? null : this.value, onSelected: (ev) => this.onItemSelect(ev), onRemoved: (ev) => this.onItemSelect(ev), onFetchData: (ev) => this.onFetchGridData(ev), onFieldFetchData: (ev) => this.onFetchFieldFilterData(ev), onSortsAndFiltersChange: (ev) => this.onSortsAndFiltersChange(ev), allowCustomTag: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags, idOnly: this.idOnly || this.allowCustomTag || this.tag, idAttributeName: this.idAttributeName || '_id', onSearchInputEnterPressed: (ev) => this.onSearchInputValue(ev), onAddNewTagPressed: (ev) => this.addNewTag(ev), searchBarPlaceholder: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags ? translate(this.isLocal ? 'AUTOCOMPLETESEARCHADD' : 'SEARCHORADD') : translate('SEARCH'), emptyState: this.emptyState || this.entityType, tags: this.tags, model: this.model, maxSelectionNumber: this.max, hideAdvancedFilters: !this.model, showFilters: !this.tag && !this.hideTags && !this.isLocal && !isWeb(this.host) && this.showSearchOrTags(), onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, isLoading: this.isLoading, clearTags: this.clearTags, extraClass: this.extraClass, isAutoComplete: true, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : null, idOnlyInitialSelection: this.idOnlyInitialSelection, hideRefreshButton: true, disableSingleDeselection: this.disableSingleDeselection, forceLocalInfiniteScroll: this.isLocal && ((_b = this.localValues) === null || _b === void 0 ? void 0 : _b.length) < ((_c = this.values) === null || _c === void 0 ? void 0 : _c.length), valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_d = this.value) === null || _d === void 0 ? void 0 : _d.sortsAndFilters : null, showFormRadio: this.isFilter, selectedFilterOperator: this.selectedFilterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev), secondaryActions: this.secondaryActions, origin: this.origin }));
+      }, items: this.isLocal ? this.localValues : this.values, pageSize: this.pageSize, selectedTags: this.currentSelectedTags, dynamicOrdering: this.dynamicOrdering !== false, keepSelection: true, multiple: this.multiple, displayType: this.displayType, displayTypes: this.displayType === 'card-cell' || this.entityType === 'files' ? ['card-cell', 'card-list'] : null, collectionName: this.collectionName, entityType: this.getEntityType(), hideHeader: isNullOrUndefined(this.hideHeader) ? false : this.hideHeader, showSearch: this.tag || this.showSearchOrTags(), forceHideSearch: this.forceHideSearch, customModel: this.customModel, isLocal: this.isLocal, useTranslate: this.useTranslate, onGridExpanded: () => this.onExpandGrid(), initialSelection: this.returnQuery ? null : this.value, onSelected: (ev) => this.onItemSelect(ev), onRemoved: (ev) => this.onItemSelect(ev), onFetchData: (ev) => this.onFetchGridData(ev), onFieldFetchData: (ev) => this.onFetchFieldFilterData(ev), onSortsAndFiltersChange: (ev) => this.onSortsAndFiltersChange(ev), allowCustomTag: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags, idOnly: this.idOnly || this.allowCustomTag || this.tag, idAttributeName: this.idAttributeName || '_id', onSearchInputEnterPressed: (ev) => this.onSearchInputValue(ev), onAddNewTagPressed: (ev) => this.addNewTag(ev), searchBarPlaceholder: (this.allowCustomTag || this.allowCustomValue || this.tag) && !this.forceDisableCustomTags ? translate(this.isLocal ? 'AUTOCOMPLETESEARCHADD' : 'SEARCHORADD') : translate('SEARCH'), emptyState: this.emptyState || this.entityType, tags: this.tags, model: this.model, maxSelectionNumber: this.max, hideAdvancedFilters: !this.model, showFilters: !this.tag && !this.hideTags && !this.isLocal && !isWeb(this.host) && this.showSearchOrTags(), onTagsSelect: (ev) => this.onTagsSelect(ev), isCollapsible: false, isLoading: this.isLoading, clearTags: this.clearTags, extraClass: this.extraClass, isAutoComplete: true, addNewTagText: this.entityType === 'emails' ? translate('ADDNEWEMAIL') : null, idOnlyInitialSelection: this.idOnlyInitialSelection, hideRefreshButton: true, disableSingleDeselection: this.disableSingleDeselection, forceLocalInfiniteScroll: this.isLocal && ((_b = this.localValues) === null || _b === void 0 ? void 0 : _b.length) < ((_c = this.values) === null || _c === void 0 ? void 0 : _c.length), valuesColor: this.valuesColor, total: this.total, returnQuery: this.returnQuery, showSelectAll: this.returnQuery, initialQuery: this.returnQuery ? this.value : null, sortsAndFilters: this.returnQuery ? (_d = this.value) === null || _d === void 0 ? void 0 : _d.sortsAndFilters : null, showFormRadio: this.isFilter, selectedFilterOperator: this.selectedFilterOperator, onFormRadioToggled: (ev) => this.onFilterRadioToggled(ev), secondaryActions: this.secondaryActions, origin: this.origin, infiniteScrollDisabled: this.infiniteScrollDisabled }));
   }
   renderMobileContent() {
     return (h("div", { class: "outer-container" },
@@ -1205,6 +1206,24 @@ export class YooFormAutocompleteDialogComponent {
       },
       "defaultValue": "[]"
     },
+    "infiniteScrollDisabled": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "infinite-scroll-disabled",
+      "reflect": false,
+      "defaultValue": "false"
+    },
     "value": {
       "type": "any",
       "mutable": true,

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

@@ -3067,11 +3067,12 @@ export class YooFormDynamicComponent {
           isFilter: field.type === FormFieldType.filterautocomplete,
           forceDisableCustomTags: field.forceDisableCustomTags,
           extraData: this.getExtraData(field, data),
+          forceHideSearch: !!field.forceHideSearch,
           onFetchFieldFilterData: (ev) => this.onFetchFieldFilterData(ev),
           onFetchData: (ev) => this.onFetchData(field, ev),
           onFetchCustomData: (ev) => this.onFetchCustomData(field, ev),
           onExtraDataChanged: (ev) => this.onFieldExtraDataChanged(ev, field),
-          forceHideSearch: !!field.forceHideSearch
+          customDataLoader: field.customDataLoader
         };
         if (((field.min && field.min > 1) || (field.max && field.max > 0)) && attrs.validators) {
           attrs.validators.push({ name: field.type, options: { ...extraAttrs } });
@@ -3706,6 +3707,7 @@ export class YooFormDynamicComponent {
           values: field.values,
           linked: field.linked,
           disabled: this.isLivePreview(),
+          customDataLoader: field.customDataLoader,
           onFieldFetchData: (ev) => {
             ev.stopPropagation();
             this.fieldFetchData.emit(ev.detail);
@@ -3730,6 +3732,7 @@ export class YooFormDynamicComponent {
           linked: field.linked,
           type: field.type,
           hideTitle: true,
+          customDataLoader: field.customDataLoader,
           onFieldFetchData: (ev) => {
             ev.stopPropagation();
             this.fieldFetchData.emit(ev.detail);

package/dist/collection/components/form/form-image-tagging-creator/form-image-tagging-creator.js

@@ -1,5 +1,6 @@
 import { blobToBase64, debounce, Draggable, getUUID, gsapSet, gsapTo, isFile, isTranslationKey, scaleUpAnimation, translate } from '@shared/utils';
-import { Component, Element, Event, forceUpdate, h, Host, Listen, Prop, Watch } from '@stencil/core';
+import { Component, Element, Event, forceUpdate, h, Host, Listen, Prop, State, Watch } from '@stencil/core';
+import { cloneDeep } from 'lodash-es';
 import { getAnnotationPositionStyle, getElement, isAnnotationValid } from '../../../utils/helpers/annotations-helpers';
 import { getAppContext, showImageCropper } from '../../../utils/helpers/common-helpers';
 import { createDot, deleteDot, deleteEmptyDots, getDotInnerElement, getDotToolTipElement, hideAllDotTooltips, hideAllUnFocusedTooltips, reorderDotIndexes, saveTooltipContent, setDotIndexes, showDotTooltip } from '../../../utils/helpers/draggable-dots-helpers';
@@ -11,7 +12,8 @@ export class YooFormImageTaggingCreatorComponent {
   }
   validate() {
     var _a, _b;
-    const validity = !this.required || (!!this.value && !!this.value.imageUrl && !!((_b = (_a = this.value.annotations) === null || _a === void 0 ? void 0 : _a.filter((annotation) => isAnnotationValid(annotation))) === null || _b === void 0 ? void 0 : _b.length));
+    this.internalValue = cloneDeep(this.value);
+    const validity = !this.required || (!!this.internalValue && !!this.internalValue.imageUrl && !!((_b = (_a = this.internalValue.annotations) === null || _a === void 0 ? void 0 : _a.filter((annotation) => isAnnotationValid(annotation))) === null || _b === void 0 ? void 0 : _b.length));
     if (this.validity !== validity) {
       this.validity = validity;
       this.validityChanged.emit(this.validity);
@@ -24,25 +26,26 @@ export class YooFormImageTaggingCreatorComponent {
       const result = await showImageCropper({ file: ev.detail, preventBlob: true });
       const image = result === null || result === void 0 ? void 0 : result.data;
       if (isFile(image)) {
-        this.value.imageUrl = await blobToBase64(image);
+        this.internalValue.imageUrl = await blobToBase64(image);
       }
       else {
-        this.value = {
+        this.internalValue = {
           imageUrl: image,
           annotations: []
         };
         this.captureImageElement.value = image;
       }
-      this.inputChanged.emit(this.value);
+      this.inputChanged.emit(this.internalValue);
     }
-    else if (this.value && !((_a = ev.detail) === null || _a === void 0 ? void 0 : _a['imageUrl'])) {
+    else if (this.internalValue && !((_a = ev.detail) === null || _a === void 0 ? void 0 : _a['imageUrl'])) {
       this.captureImageElement.value = null;
     }
   }
   componentWillLoad() {
     var _a, _b;
-    if ((_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.annotations) === null || _b === void 0 ? void 0 : _b.length) {
-      this.value.annotations = this.value.annotations
+    this.internalValue = cloneDeep(this.value);
+    if ((_b = (_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.annotations) === null || _b === void 0 ? void 0 : _b.length) {
+      this.internalValue.annotations = this.internalValue.annotations
         .filter(a => { var _a; return (a === null || a === void 0 ? void 0 : a.text) && !((_a = a._local) === null || _a === void 0 ? void 0 : _a.isDeleted); })
         .map((a) => {
         var _a;
@@ -84,7 +87,7 @@ export class YooFormImageTaggingCreatorComponent {
   }
   initEditorSetup() {
     var _a, _b;
-    (_b = (_a = this.value) === null || _a === void 0 ? void 0 : _a.annotations) === null || _b === void 0 ? void 0 : _b.forEach((a) => this.getDotDraggableActions(a));
+    (_b = (_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.annotations) === null || _b === void 0 ? void 0 : _b.forEach((a) => this.getDotDraggableActions(a));
     this.resizeListener = debounce(() => forceUpdate(this), 100).bind(this);
     window.addEventListener('resize', this.resizeListener);
     setDotIndexes(this.dotElements);
@@ -96,12 +99,12 @@ export class YooFormImageTaggingCreatorComponent {
       const MAX_ALLOWED_DOTS = 9;
       const DOT_RADIUS = 12;
       (_a = this.dotElements) === null || _a === void 0 ? void 0 : _a.forEach((element) => gsapSet(element, { x: 0, y: 0 }));
-      if (((_b = this.value) === null || _b === void 0 ? void 0 : _b.imageUrl) && ((_c = this.dotElements) === null || _c === void 0 ? void 0 : _c.length) <= MAX_ALLOWED_DOTS) {
+      if (((_b = this.internalValue) === null || _b === void 0 ? void 0 : _b.imageUrl) && ((_c = this.dotElements) === null || _c === void 0 ? void 0 : _c.length) <= MAX_ALLOWED_DOTS) {
         hideAllDotTooltips(this.dotElements);
-        const newDot = createDot(ev, { radius: DOT_RADIUS, containerElement: this.imageContainerElement }, this.value.annotations);
+        const newDot = createDot(ev, { radius: DOT_RADIUS, containerElement: this.imageContainerElement }, this.internalValue.annotations);
         if (newDot) {
           this.hasDotBeenCreated = true;
-          this.value.annotations.push(newDot);
+          this.internalValue.annotations.push(newDot);
           forceUpdate(this);
         }
       }
@@ -109,9 +112,9 @@ export class YooFormImageTaggingCreatorComponent {
   }
   attachNewDot() {
     var _a, _b, _c;
-    if (((_a = this.value) === null || _a === void 0 ? void 0 : _a.imageUrl) && this.hasDotBeenCreated) {
-      const lastIndex = ((_b = this.value.annotations) === null || _b === void 0 ? void 0 : _b.length) - 1 || 0;
-      const newDot = this.value.annotations[lastIndex];
+    if (((_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.imageUrl) && this.hasDotBeenCreated) {
+      const lastIndex = ((_b = this.internalValue.annotations) === null || _b === void 0 ? void 0 : _b.length) - 1 || 0;
+      const newDot = this.internalValue.annotations[lastIndex];
       if (newDot) {
         const newElement = (_c = this.dotElements) === null || _c === void 0 ? void 0 : _c.filter(d => d).slice(-1)[0];
         if (newElement) {
@@ -139,7 +142,7 @@ export class YooFormImageTaggingCreatorComponent {
       hideAllUnFocusedTooltips(this.dotElements, dotElement);
     };
     const pressAction = () => {
-      this.activeDot = getAnnotation(dotElement.id, this.value.annotations);
+      this.activeDot = getAnnotation(dotElement.id, this.internalValue.annotations);
     };
     const dragStartAction = () => {
       hideAllDotTooltips(this.dotElements);
@@ -169,24 +172,24 @@ export class YooFormImageTaggingCreatorComponent {
         this.translationValueUpdated.emit({ key, value });
       }
       else {
-        this.inputChanged.emit(this.value);
+        this.inputChanged.emit(this.internalValue);
       }
     }
     else {
-      this.inputChanged.emit(this.value);
+      this.inputChanged.emit(this.internalValue);
     }
     validate && this.validate();
-    reorderDotIndexes(this.value.annotations, this.imageContainerElement);
+    reorderDotIndexes(this.internalValue.annotations, this.imageContainerElement);
   }
   setupImage() {
     this.dotElements.forEach((element) => gsapSet(element, { x: 0, y: 0, opacity: 1 }));
   }
   renderImageCapture() {
     var _a;
-    return h("yoo-form-capture", { type: "photo", required: true, value: ((_a = this.value) === null || _a === void 0 ? void 0 : _a.imageUrl) || '', ref: (el) => (this.captureImageElement = el), allowLibrary: true, allowUnsplash: true });
+    return h("yoo-form-capture", { type: "photo", required: true, value: ((_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.imageUrl) || '', ref: (el) => (this.captureImageElement = el), allowLibrary: true, allowUnsplash: true });
   }
   renderDots() {
-    return this.value.annotations.map((dot) => {
+    return this.internalValue.annotations.map((dot) => {
       return (h("div", { id: dot._id, class: "pa dot", onClick: (ev) => ev === null || ev === void 0 ? void 0 : ev.stopPropagation(), style: getAnnotationPositionStyle(dot) },
         h("yoo-tooltip", { clickable: false, hoverable: false, editable: true, placement: "auto", maxCharacters: 25, content: dot.text, onDeleteTooltip: (ev) => ev && deleteDot(dot, this.imageContainerElement).then(() => this.emitAnnotations()), onSaveTooltip: (ev) => ev && saveTooltipContent(ev, dot).then(() => this.emitAnnotations(true, dot._id, ev.detail.value)) },
           h("div", { class: "dot-container" }))));
@@ -194,17 +197,17 @@ export class YooFormImageTaggingCreatorComponent {
   }
   renderImage() {
     var _a, _b, _c;
-    return (((_a = this.value) === null || _a === void 0 ? void 0 : _a.imageUrl) && [
+    return (((_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.imageUrl) && [
       h("div", { class: "image-container", ref: (el) => (this.imageContainerElement = el) },
-        h("yoo-img", { disableAspectRatioCalc: true, scaledUp: true, onScaleUpDone: () => this.setupImage(), contained: true, onClick: (ev) => this.imageClick(ev), src: this.value.imageUrl }),
-        !!((_c = (_b = this.value) === null || _b === void 0 ? void 0 : _b.annotations) === null || _c === void 0 ? void 0 : _c.length) && this.renderDots()),
+        h("yoo-img", { disableAspectRatioCalc: true, scaledUp: true, onScaleUpDone: () => this.setupImage(), contained: true, onClick: (ev) => this.imageClick(ev), src: this.internalValue.imageUrl }),
+        !!((_c = (_b = this.internalValue) === null || _b === void 0 ? void 0 : _b.annotations) === null || _c === void 0 ? void 0 : _c.length) && this.renderDots()),
       h("div", { class: "instructions stable" },
         h("yoo-icon", { size: "small", name: "info", color: "stable" }),
         h("span", null, translate('ADDIMAGETAG')))
     ]);
   }
   render() {
-    return (h(Host, { onClick: (ev) => { var _a; return ev && deleteEmptyDots((_a = this.value) === null || _a === void 0 ? void 0 : _a.annotations, this.imageContainerElement); }, class: { ...getAppContext(this.host) } },
+    return (h(Host, { onClick: (ev) => { var _a; return ev && deleteEmptyDots((_a = this.internalValue) === null || _a === void 0 ? void 0 : _a.annotations, this.imageContainerElement); }, class: { ...getAppContext(this.host) } },
       h("div", { class: "outer-container" },
         this.renderImageCapture(),
         this.renderImage())));
@@ -293,6 +296,9 @@ export class YooFormImageTaggingCreatorComponent {
       }
     }
   }; }
+  static get states() { return {
+    "internalValue": {}
+  }; }
   static get events() { return [{
       "method": "inputChanged",
       "name": "inputChanged",