@yoobic/yobi 8.2.0-15 → 8.2.0-16

package/dist/collection/components/form/form-input-container/form-input-container.js

@@ -268,7 +268,7 @@ export class YooFormInputContainerComponent {
       h("span", { class: "extra-options-container" },
         this.renderOptional(),
         this.renderPdfDownload(),
-        this.renderRightSide())));
+        this.renderRightSide(!!this.field.title && !!this.field.help))));
   }
   renderPdfDownload() {
     return (isPdf(this.field.document) &&
@@ -280,7 +280,7 @@ export class YooFormInputContainerComponent {
       translate('OPTIONAL'),
       ")");
   }
-  renderRightSide() {
+  renderRightSide(hideTooltip) {
     let fieldhelp = this.field.help;
     if (!fieldhelp && this.field.title) {
       const fieldhelpAuto = translate(this.field.title + 'HELP');
@@ -294,8 +294,8 @@ export class YooFormInputContainerComponent {
       this.markAsInvalid && h("yoo-tag", { size: "extra-small", class: "not-compliant", color: "danger" }, translate('NOTSATISFACTORY')),
       this.time && (h("yoo-tooltip", { hoverable: isWeb(this.host), content: translate('LASTEDIT') + ': ' + pipes.dateFormat.transform(this.time, 'L LT'), placement: "top-end" },
         h("yoo-icon", { size: isWeb(this.host) ? 'small' : 'medium', class: "recent", name: "recent" }))),
-      fieldhelp && !this.field.hideTooltip && (h("yoo-tooltip", { hoverable: isWeb(this.host), content: this.getHelpContent(fieldhelp), placement: "top-end" },
-        h("yoo-icon", { size: isWeb(this.host) ? 'small' : 'medium', name: "help", color: "stable" }))))));
+      fieldhelp && !this.field.hideTooltip && !hideTooltip && (h("yoo-tooltip", { hoverable: isWeb(this.host), content: this.getHelpContent(fieldhelp), placement: "top-end" },
+        h("yoo-icon", { size: this.field.tooltipSize ? this.field.tooltipSize : isWeb(this.host) ? 'small' : 'medium', name: "help", color: this.field.tooltipColor ? this.field.tooltipColor : 'stable' }))))));
   }
   renderOriginalMarkAsInvalid() {
     return !this.markAsInvalid && !this.hideComplianceTags && this.originalMarkAsInvalid &&
@@ -363,9 +363,10 @@ export class YooFormInputContainerComponent {
       this.renderInnerContent()));
   }
   renderRemovable() {
-    return (this.field.removable && (h("div", { class: "removable", onClick: () => this.onRemove() },
+    return (this.field.removable && (h("div", { class: "removable", onClick: () => this.onRemove() }, isWeb(this.host) ?
       h("yoo-tooltip", { content: translate('REMOVEFIELD'), placement: "top-end" },
-        h("yoo-icon", { size: this.size || 'medium', color: "danger", name: "cross" })))));
+        h("yoo-icon", { size: this.size || 'medium', color: "danger", name: "cross" }))
+      : h("yoo-icon", { size: this.size || 'medium', color: "danger", name: "cross" }))));
   }
   renderHint() {
     return h("div", { class: "hint-container", innerHTML: this.field.hint });

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

@@ -213,6 +213,7 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
+  box-sizing: border-box;
   width: 100%;
   word-break: break-word;
 }

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

@@ -364,9 +364,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: 26rem;
 }
 :host .container .content .form-content .scoring-empty-state div {
-  color: var(--text-color, #807f83);
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
   padding: var(--spacing-16, 1rem);
 }
 :host .container .content .form-content .form-content-blocks-container {

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

@@ -1,5 +1,5 @@
 import { ALL_MOBILE_FORM_FIELDS, CONDITION_TYPES, FEEDBACK_SCORING_VALUES, FormCreatorBulkActions, FormCreatorOptions, FormFieldCategory, FormFieldType, ScoringCategory } from '@shared/interfaces';
-import { calculateScoringTotal, changeSelectedScoring, checkIfKeyIsInField, checkIfKeyIsInPage, closeModal, CURVE_EASE_OUT_QUAD, findField, findMultiMaxScore, formatScoringValuePairs, formatSlides, getCurrentLanguage, getCustomName, getScoringCategory, getSession, getUUID, isFieldNameUnique, isNullOrUndefined, populateScoringFields, removeParentCondition, removeScoringSelectedFields, serializeScores, setFieldIconAndCategory, showAlert, showModal, showToast, translate, translateMulti, updateTranslationKey } from '@shared/utils';
+import { calculateScoringTotal, changeSelectedScoring, checkIfKeyIsInField, checkIfKeyIsInPage, closeModal, CURVE_EASE_OUT_QUAD, findField, findMultiMaxScore, formatScoringValuePairs, formatSlides, getCurrentLanguage, getCustomName, getScoringCategory, getSession, getUUID, hasImageRecognitionFields, isFieldNameUnique, isNullOrUndefined, populateScoringFields, removeParentCondition, removeScoringSelectedFields, serializeScores, setFieldIconAndCategory, showAlert, showModal, showToast, translate, translateMulti, updateTranslationKey } from '@shared/utils';
 import { Component, Element, Event, forceUpdate, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';
 import { cloneDeep, compact, isArray, orderBy } from 'lodash-es';
 import Sortable from 'sortablejs';
@@ -624,15 +624,20 @@ export class YooFormCreatorComponent {
   }
   onTranslateFieldClicked(event, selectedFieldLocation = null) {
     var _a;
-    //If there are already translations then they are updated by google translate to fill in any missing ones
-    //Note existing translations are NOT overridden
-    if (((_a = this.translations) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-      this.loadNewTranslations.emit();
-      selectedFieldLocation = findField(this.currentSlides, event.detail.name);
-      this.reloadTranslationModalOnUpdate = selectedFieldLocation;
+    if (isNullOrUndefined(this.missionDescription.lockTranslations) && hasImageRecognitionFields(this.slides)) {
+      showAlert(translate('YOOBICWARNING'), [translate('YOOBICOK')], translate('LOCKEDTRANSLATIONWARNING'));
     }
     else {
-      this.showTranslationDialog(event);
+      //If there are already translations then they are updated by google translate to fill in any missing ones
+      //Note existing translations are NOT overridden
+      if (((_a = this.translations) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+        this.loadNewTranslations.emit();
+        selectedFieldLocation = findField(this.currentSlides, event.detail.name);
+        this.reloadTranslationModalOnUpdate = selectedFieldLocation;
+      }
+      else {
+        this.showTranslationDialog(event);
+      }
     }
   }
   onCreateNewRestriction(event) {

package/dist/collection/components/form-creator/form-creator-translate/form-creator-translate.js

@@ -1,4 +1,4 @@
-import { cleanUnusedTranslations, closeModal, formatSlides, getLanguageKey, getTranslateLanguageKeys, isNullOrUndefined, showAlert, showModal, translate, updateAuditWithTranslations, updateScoringWithTranslations } from '@shared/utils';
+import { cleanUnusedTranslations, closeModal, formatSlides, getLanguageKey, getTranslateLanguageKeys, hasImageRecognitionFields, isNullOrUndefined, showAlert, showModal, translate, updateAuditWithTranslations, updateScoringWithTranslations } from '@shared/utils';
 import { Component, Event, h, Host, Prop, State, Watch } from '@stencil/core';
 import { cloneDeep, isEqual, remove } from 'lodash-es';
 import { addRow, isAlreadyTranslated, resetFieldTranslations, resetKey, translateAll } from '../helpers';
@@ -66,6 +66,9 @@ export class YooFormCreatorTranslateComponent {
     if (this.baseLanguage && ((_a = this.selectedLanguages) === null || _a === void 0 ? void 0 : _a.length) > 0) {
       this.selectedLanguages = this.selectedLanguages.filter((language) => language !== this.baseLanguage);
     }
+    if (this.missionDescription) {
+      this.missionDescription.lockTranslations = (hasImageRecognitionFields(this.slides) && isNullOrUndefined(this.missionDescription.lockTranslations)) || this.missionDescription.lockTranslations;
+    }
     this.hasTranslations = ((_b = this.items) === null || _b === void 0 ? void 0 : _b.length) > 0;
     this.updateGridConfig();
   }

package/dist/collection/components/form-creator/workflow/workflow.css

@@ -348,9 +348,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   margin-bottom: unset;
 }
 :host .empty-state-with-text div {
-  color: var(--text-color, #807f83);
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
   max-width: 25rem;
   padding: var(--spacing-08, 0.5rem);
   text-align: center;

package/dist/collection/components/grid/grid/grid.css

@@ -279,13 +279,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 :host .grid-progress yoo-progress-bar {
   --progress-bar-color: var(--app-color, #5a30f4);
 }
-:host yoo-empty-state {
-  height: var(--empty-state-height, 10rem);
-}
-:host yoo-empty-state + yoo-button {
-  max-width: 15rem;
-  margin: 0 auto;
-}
 :host yoo-lottie {
   max-width: 31rem;
 }
@@ -357,20 +350,22 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   width: 100%;
   padding: 0 var(--spacing-24, 1.5rem);
 }
-:host .empty-state h4 {
-  justify-self: center;
-  margin: unset;
+:host .empty-state yoo-empty-state {
+  height: var(--empty-state-height, 10rem);
 }
-:host .empty-state div {
-  color: var(--text-color, #807f83);
+:host .empty-state .empty-state-details {
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
+  display: flex;
+  flex-direction: column;
+  grid-gap: var(--spacing-08, 0.5rem);
+  width: 100%;
   padding-bottom: var(--spacing-16, 1rem);
   text-align: center;
 }
-:host .empty-state yoo-empty-state {
-  height: 10rem;
-  padding-top: var(--spacing-16, 1rem);
+:host .empty-state h4 {
+  justify-self: center;
+  margin: unset;
 }
 :host .entity-container-map {
   overflow: hidden;
@@ -3342,6 +3337,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   display: flex;
   flex-direction: column;
   grid-gap: var(--spacing-08, 0.5rem);
+  align-items: center;
+  width: unset;
 }
 
 :host(.card-cell.small.channel) yoo-empty-state,

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

@@ -2423,11 +2423,10 @@ export class YooGridComponent {
       h("yoo-button", { animated: false, color: "app-color", fill: "transparent", size: isWeb(this.host) ? 'small' : 'medium', shape: "rectangular", onClick: () => this.onForceSelectAll(showClear) }, translate(showClear ? 'CLEAR' : 'SELECTALL'))));
   }
   renderEmptyStateButton(customStyle) {
-    const buttonSize = isWeb(this.host) || (!this.extraClass || this.extraClass === 'large') ? 'large' : 'medium';
+    const buttonSize = (!this.extraClass && isWeb(this.host)) || this.extraClass.includes('large') ? 'large' : this.extraClass.includes('small') ? 'small' : 'medium';
     return (h("yoo-button", { class: { 'empty-button': true, expanded: customStyle }, size: buttonSize, color: "app-color", onClick: () => this.emptyStateHandler() }, translate(this.emptyStateButtonText)));
   }
   renderEmptyState() {
-    const isLarge = !this.extraClass || this.extraClass === 'large';
     const type = this.emptyState || this.entityType || 'error';
     const displayEmptyState = type && type !== 'none' && !this.hideEmptyState;
     const header = translate(this.emptyStateHeader || EMPTYSTATE_TITLE_MAP[type]);
@@ -2438,12 +2437,11 @@ export class YooGridComponent {
       h("slot", { name: "before" }),
       displayEmptyState && (h("div", { class: `empty-state-container ${this.extraClass}` },
         h("div", { class: { 'empty-state': true, padding: customStyle, ...getAppContext(this.host) } },
-          this.emptyStateTextPosition === 'top' && [!!header && h("h4", null, header), h("div", null, text)],
+          !this.emptyStateNoDescription && this.emptyStateTextPosition === 'top' && [!!header && h("h4", null, header), h("div", null, text)],
           this.emptyStateAnimated ? (h("yoo-lottie", { autoplay: true, loop: true, type: type })) : (h("yoo-empty-state", { class: { [this.displayType]: true, [this.extraClass || 'large']: true, 'with-button': hasButton }, style: { height: this.isAutoComplete && !this.host.classList.contains('expanding-grid') && '5rem' }, type: type })),
           h("div", { class: "empty-state-details" },
-            this.emptyStateTextPosition === 'bottom' && [!!header && h("h4", { innerHTML: header }), h("div", { class: { 'with-button': hasButton }, innerHTML: text })],
-            hasButton && !isLarge && this.renderEmptyStateButton(customStyle)),
-          hasButton && isLarge && this.renderEmptyStateButton(customStyle)))),
+            !this.emptyStateNoDescription && this.emptyStateTextPosition === 'bottom' && [!!header && h("h4", { innerHTML: header }), h("div", { class: { 'with-button': hasButton }, innerHTML: text })],
+            hasButton && this.renderEmptyStateButton(customStyle))))),
       h("slot", { name: "after" })
     ];
   }
@@ -3057,7 +3055,8 @@ export class YooGridComponent {
           'collapsed': this.isMap(),
           'selected card-template': this.displayType === 'card-template' && this.isSelected(item),
           'form': this.host.classList.contains('form'),
-          'table': this.host.classList.contains('table')
+          'table': this.host.classList.contains('table'),
+          'block': this.host.classList.contains('radio-button-choice')
         }, item: item, items: this.entityType === 'photos' ? this.filteredItems : undefined, displayType: this.displayType, entityType: this.entityType, profileSummary: this.profileSummary, icons: this.icons, topActions: this.topActions, bottomActions: this.bottomActions, secondaryActions: this.secondaryActions, customModel: this.customModel, isCollapsible: this.isCollapsibleCheck(), isMap: this.isMap(), isFramed: this.isFramed, isPdf: this.isPdf, unreadCounts: this.unreadCounts, playerCommand: this.currentActivePlayerId, secondaryActionsDropdown: this.secondaryActionsDropdown, selected: this.isSelected(item), valuesColor: (_d = this.valuesColor) === null || _d === void 0 ? void 0 : _d.find((e) => (item._id ? e.key === item._id : item.icon ? e.key === item.title : e.key === item)), highlighted: this.entityType === 'lessons' && this.getLessonHighlight(item), hideUIFields: this.hideUIFields })));
     if (isWeb(this.host) && this.columns && this.columns.length) {
       return this.renderEntityWithColumns(item, content, index);
@@ -4188,6 +4187,23 @@ export class YooGridComponent {
       "attribute": "empty-state-description",
       "reflect": false
     },
+    "emptyStateNoDescription": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "empty-state-no-description",
+      "reflect": false
+    },
     "emptyStateHeader": {
       "type": "string",
       "mutable": false,

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

@@ -1642,10 +1642,12 @@ span.fr-img-caption.fr-view {
   box-shadow: var(--card-shadow-2, 0 0.3125rem 0.9375rem 0 rgba(40, 47, 54, 0.08));
 }
 
-:host(.preview-mode.modal-mode) .outer-container > * {
+:host(.preview-mode.modal-mode) .outer-container > *,
+:host(.no-pointer) .outer-container > * {
   pointer-events: none;
 }
-:host(.preview-mode.modal-mode) .event-container .event-action-container {
+:host(.preview-mode.modal-mode) .event-container .event-action-container,
+:host(.no-pointer) .event-container .event-action-container {
   pointer-events: none;
 }
 

package/dist/collection/feature-platform/insight/chart/chart.css

@@ -249,12 +249,11 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: 100%;
 }
 .empty-state yoo-empty-state {
-  padding: 32px 0;
+  padding: var(--spacing-16, 1rem) 0;
 }
 .empty-state div {
-  color: var(--text-color, #807f83);
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
   padding: 0px;
   padding-bottom: var(--spacing-16, 1rem);
   text-align: center;

package/dist/collection/feature-platform/insight/kpi/kpi.css

@@ -223,7 +223,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: 6.25rem;
 }
 :host .empty-state div {
-  color: var(--text-color, #807f83);
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
 }

package/dist/collection/feature-platform/insight/kpi-container/kpi-container.css

@@ -300,9 +300,8 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: 6.25rem;
 }
 :host .empty-state div {
-  color: var(--text-color, #807f83);
+  color: var(--text-color-80, rgba(128, 127, 131, 0.8));
   font-size: var(--font-size-16, 1rem);
-  opacity: 0.7;
   text-align: center;
 }
 

package/dist/collection/utils/helpers/common-helpers.js

@@ -22,7 +22,7 @@ export function showPhotoEditor(photoEditorParams, modalOptions) {
 }
 export function onRTEClick(el, currentImageSrc) {
   var _a;
-  const imgSrcs = (_a = Array.from(el.querySelectorAll('img'))) === null || _a === void 0 ? void 0 : _a.map((e) => e === null || e === void 0 ? void 0 : e.src);
+  const imgSrcs = (_a = Array.from(el === null || el === void 0 ? void 0 : el.querySelectorAll('img'))) === null || _a === void 0 ? void 0 : _a.map((e) => e === null || e === void 0 ? void 0 : e.src);
   const items = (imgSrcs === null || imgSrcs === void 0 ? void 0 : imgSrcs.map(value => ({ value }))) || [];
   if (items === null || items === void 0 ? void 0 : items.length) {
     showSlidesMedia({ items, isTagging: false, isReadonly: true, canAnnotate: false, currentSlideIndex: imgSrcs.indexOf(currentImageSrc) });