@yoobic/yobi 8.3.1-8 → 8.3.2

package/dist/cjs/{dom-232b4df0.js → dom-39eaa8e4.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 /*
- Stencil Client Patch Browser v2.17.1 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.2 | MIT Licensed | https://stenciljs.com
  */
 (function(){
 var aa=new Set("annotation-xml color-profile font-face font-face-src font-face-uri font-face-format font-face-name missing-glyph".split(" "));function g(a){var b=aa.has(a);a=/^[a-z][.0-9_a-z]*-[\-.0-9_a-z]*$/.test(a);return !b&&a}function l(a){var b=a.isConnected;if(void 0!==b)return b;for(;a&&!(a.__CE_isImportDocument||a instanceof Document);)a=a.parentNode||(window.ShadowRoot&&a instanceof ShadowRoot?a.host:void 0);return !(!a||!(a.__CE_isImportDocument||a instanceof Document))}

package/dist/cjs/{draggable-dots-helpers-c77b695d.js → draggable-dots-helpers-ca7dfa13.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
 const annotationsHelpers = require('./annotations-helpers-6cf88388.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 const EEditorActions = {
   typeTool: 'type-tool',

package/dist/cjs/{draggable-tags-helpers-4cad01da.js → draggable-tags-helpers-7e00b3d9.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 function checkArray(array) {
   return !!((array === null || array === void 0 ? void 0 : array.length) && Array.isArray(array));
@@ -24,7 +24,7 @@ function getDeletedValues(oldValues, newValues) {
   var _a;
   return (_a = (oldValues || [])) === null || _a === void 0 ? void 0 : _a.filter(v => { var _a; return !((_a = (newValues || [])) === null || _a === void 0 ? void 0 : _a.includes(v)); });
 }
-async function showWarningAlert(container, showBanner = true, messageKey = 'NODUPLICATEVALUES', backgroundColor = 'danger') {
+async function showWarningBanner(container, showBanner = true, messageKey = 'NODUPLICATEVALUES', backgroundColor = 'danger') {
   var _a;
   showBanner = showBanner && !!messageKey;
   const bannerElement = (container === null || container === void 0 ? void 0 : container.querySelector('yoo-banner')) || ((_a = container === null || container === void 0 ? void 0 : container.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('yoo-banner'));
@@ -59,4 +59,4 @@ exports.getDeletedValues = getDeletedValues;
 exports.getDuplicatedValue = getDuplicatedValue;
 exports.getNewValue = getNewValue;
 exports.hasDuplicates = hasDuplicates;
-exports.showWarningAlert = showWarningAlert;
+exports.showWarningBanner = showWarningBanner;

package/dist/cjs/{entities-helpers-8687b06a.js → entities-helpers-e434bdad.js}

@@ -1,9 +1,9 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 const mentionRegex = /<yoo-mention-tag[^>]*>([\s\S]*?)<\/yoo-mention-tag>/g;
 /**

package/dist/cjs/{filters-helpers-18a6d61d.js → filters-helpers-02442474.js}

@@ -1,9 +1,9 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 function isWithValuesField(field) {
   var _a;

package/dist/cjs/{form-choice-helpers-26117ce2.js → form-choice-helpers-f02f241f.js}

@@ -1,12 +1,12 @@
 'use strict';
 
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const draggableTagsHelpers = require('./draggable-tags-helpers-4cad01da.js');
-const formInputHelpers = require('./form-input-helpers-dc29cbf8.js');
-const index = require('./index-2e1afd31.js');
-const commonHelpers = require('./common-helpers-ab740e35.js');
-const overlays = require('./overlays-0cf588e0.js');
+const draggableTagsHelpers = require('./draggable-tags-helpers-7e00b3d9.js');
+const formInputHelpers = require('./form-input-helpers-4bd02994.js');
+const index = require('./index-819e2530.js');
+const commonHelpers = require('./common-helpers-a58df3d7.js');
+const overlays = require('./overlays-24592dac.js');
 const highcharts = require('./highcharts-874d9bd2.js');
 
 const ReadonlyCard = ({ value, values, answer, valuesColor, classNames }) => {
@@ -93,7 +93,7 @@ const YooFormChoiceCardComponent = class {
     return (index.h("section", { class: { 'card-grid': true, selected: this.selected } }, this.choices && this.choices.map((item, index) => this.renderSelect(item, index))));
   }
   renderBanner() {
-    return this.livePreview && index.h("yoo-banner", null, index.h("p", { slot: "content" }));
+    return this.livePreview && !this.readonly && index.h("yoo-banner", null, index.h("p", { slot: "content" }));
   }
   render() {
     var _a, _b, _c;
@@ -161,7 +161,7 @@ function prepareChoice(choiceElement) {
 function hasWarnings(values, choiceElement, warningMsgs) {
   const duplicateMessage = 'NODUPLICATEVALUES';
   const hasDuplicatedValues = draggableTagsHelpers.hasDuplicates(values === null || values === void 0 ? void 0 : values.map(v => (v === null || v === void 0 ? void 0 : v.text) || v));
-  draggableTagsHelpers.showWarningAlert(choiceElement.host, hasDuplicatedValues || !!(warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs.length), hasDuplicatedValues ? duplicateMessage : warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs[0]);
+  draggableTagsHelpers.showWarningBanner(choiceElement.host, hasDuplicatedValues || !!(warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs.length), hasDuplicatedValues ? duplicateMessage : warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs[0]);
   return hasDuplicatedValues && (warningMsgs === null || warningMsgs === void 0 ? void 0 : warningMsgs.length) > 0;
 }
 function updateChoices(values, shuffled) {

package/dist/cjs/{form-helpers-0c7f353b.js → form-helpers-24796572.js}

@@ -1,9 +1,9 @@
 'use strict';
 
 const index$1 = require('./index-50ff0b20.js');
-const index = require('./index-49d083a4.js');
+const index = require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 function isCreationAllowed(field, isVisible, isDisabled, isReadOnly = false) {
   return !!field.allowCreate && isVisible && !isDisabled && isReadOnly !== true;

package/dist/cjs/{form-input-helpers-dc29cbf8.js → form-input-helpers-4bd02994.js}

@@ -1,9 +1,9 @@
 'use strict';
 
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 const index$1 = require('./index-50ff0b20.js');
-const index = require('./index-49d083a4.js');
-const commonHelpers = require('./common-helpers-ab740e35.js');
+const index = require('./index-ce31bddc.js');
+const commonHelpers = require('./common-helpers-a58df3d7.js');
 
 let inputBlur = true;
 function focusContentEditable(inputElement) {

package/dist/cjs/{form-text-area-helpers-99821851.js → form-text-area-helpers-3d955519.js}

@@ -1,8 +1,8 @@
 'use strict';
 
-const index = require('./index-49d083a4.js');
+const index = require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 /**
  * Safely insert element

package/dist/cjs/{grid-renderers-a625c29b.js → grid-renderers-4341e33a.js}

@@ -1,14 +1,14 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const incentiveHelpers = require('./incentive-helpers-ba3c54f8.js');
-const missionsHelpers = require('./missions-helpers-678065c9.js');
-const commonHelpers = require('./common-helpers-ab740e35.js');
-const formHelpers = require('./form-helpers-0c7f353b.js');
+const incentiveHelpers = require('./incentive-helpers-4d4c7a66.js');
+const missionsHelpers = require('./missions-helpers-1ed7851e.js');
+const commonHelpers = require('./common-helpers-a58df3d7.js');
+const formHelpers = require('./form-helpers-24796572.js');
 const geolocationHelpers = require('./geolocation-helpers-cb286aab.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 const countryFlag = (country) => {
   return getFlagEmoji(getCountryCode(country));

package/dist/cjs/{incentive-helpers-ba3c54f8.js → incentive-helpers-4d4c7a66.js}

@@ -1,9 +1,9 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 /**
  * @function getIncentiveStatusBadgeSettings

package/dist/cjs/index-168a20dc.js

@@ -0,0 +1,4 @@
+'use strict';
+
+require('./localForage-a2b56735.js');
+

package/dist/cjs/{index-2e1afd31.js → index-819e2530.js}

@@ -2153,7 +2153,7 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
                     BUILD.shadowDom &&
                     BUILD.shadowDomShim &&
                     cmpMeta.$flags$ & 8 /* needsShadowDomShim */) {
-                    style = await Promise.resolve().then(function () { return require('./shadow-css-02dc932f.js'); }).then((m) => m.scopeCss(style, scopeId, false));
+                    style = await Promise.resolve().then(function () { return require('./shadow-css-039bd9c5.js'); }).then((m) => m.scopeCss(style, scopeId, false));
                 }
                 registerStyle(scopeId, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
                 endRegisterStyles();

package/dist/cjs/index-86f9c0ed.js

@@ -0,0 +1,4 @@
+'use strict';
+
+require('./overlays-24592dac.js');
+

package/dist/cjs/{index-49d083a4.js → index-ce31bddc.js}

@@ -1,6 +1,6 @@
 'use strict';
 
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 const lodash = require('./lodash-72d493b9.js');
 
 function shiftSlidesToNext(activeSlideIndex, slides, cachedSlides = 1) {
@@ -4911,7 +4911,15 @@ const getNextRecurrences = (value, options) => {
   }
   return result;
 };
-const getNextRecurrence = (value) => toRRule(value).after(new Date(), true);
+const getNextRecurrence = (value, timezone) => {
+  let result;
+  if (value) {
+    const rule = toRRule(value, timezone);
+    const date = rule.after(toUTC(new Date()), true);
+    result = fromUTC(date);
+  }
+  return result;
+};
 
 function combineAsyncValidators(x, y) {
   return async (a) => (await x(a)) && (await y(a));

package/dist/cjs/{index-f79d4a78.js → index-d32ba294.js}

@@ -1,16 +1,16 @@
 'use strict';
 
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
-const draggableTagsHelpers = require('./draggable-tags-helpers-4cad01da.js');
-const overlays = require('./overlays-0cf588e0.js');
+const draggableTagsHelpers = require('./draggable-tags-helpers-7e00b3d9.js');
+const overlays = require('./overlays-24592dac.js');
 
 class Dropzone {
   constructor(config, element, index) {
     this.config = config;
     this.element = element;
     this.index = index;
-    this.setDynamicTagZoneHeight();
+    this.initTagZone();
   }
   get colorClass() {
     const { colorClass } = this.config || {};
@@ -20,7 +20,7 @@ class Dropzone {
     return this.element.id;
   }
   get hit() {
-    return this.element.classList.contains('hit');
+    return this.element.hasAttribute('hit');
   }
   get tagsId() {
     var _a;
@@ -31,7 +31,8 @@ class Dropzone {
     return !this.isTagsZone && (Array.isArray(answers === null || answers === void 0 ? void 0 : answers[this.index]) && answers[this.index].length) || 1;
   }
   get isTagsZone() {
-    return this.element.id === 'zone-tags';
+    var _a;
+    return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.id) === 'zone-tags';
   }
   get tagsCount() {
     var _a, _b;
@@ -40,13 +41,16 @@ class Dropzone {
   get isDropZoneFull() {
     return !this.isTagsZone && this.tagsCount === (this.tagsLimit || 1);
   }
-  setDynamicTagZoneHeight() {
-    if (this.element && this.isTagsZone && this.config.dynamicZoneHeight) {
-      const footerHeight = 92;
-      const zoneBR = this.element.getBoundingClientRect();
-      const calculateTagZoneHeight = window.innerHeight - (zoneBR.top + footerHeight);
-      if (calculateTagZoneHeight) {
-        this.element.parentElement.style.height = `${calculateTagZoneHeight * .75}px`;
+  initTagZone() {
+    if (this.isTagsZone) {
+      const { dynamicZoneHeight } = this.config;
+      if (dynamicZoneHeight) {
+        const footerHeight = 92;
+        const zoneBR = this.element.getBoundingClientRect();
+        const calculateTagZoneHeight = window.innerHeight - (zoneBR.top + footerHeight);
+        if (calculateTagZoneHeight) {
+          this.element.parentElement.style.height = `${calculateTagZoneHeight * .75}px`;
+        }
       }
     }
   }
@@ -58,7 +62,14 @@ class Dropzones {
   get tagsZone() {
     return Dropzones.getZones(this.zonesConfig).find(zone => zone.id === 'zone-tags');
   }
-  hideOverflowingTagInZone(zoneElement, tagElement) {
+  setTagsZoneOverflow(set) {
+    var _a, _b;
+    const { element } = this.tagsZone || {};
+    if (element && ((_b = (_a = this.zonesConfig) === null || _a === void 0 ? void 0 : _a.tagZoneConfig) === null || _b === void 0 ? void 0 : _b.hasOverflow)) {
+      set ? element.style.overflow = 'hidden' : element.style.removeProperty('overflow');
+    }
+  }
+  async hideOverflowingTagInZone(zoneElement, tagElement, onShowTag) {
     if (tagElement && zoneElement) {
       const zoneBR = zoneElement.getBoundingClientRect();
       const tagBR = tagElement.getBoundingClientRect();
@@ -68,27 +79,20 @@ class Dropzones {
       }
       else if (tagElement.style.visibility === 'hidden') {
         tagElement.style.visibility = 'visible';
-        Tag.scaleUpDown(tagElement);
+        await (onShowTag === null || onShowTag === void 0 ? void 0 : onShowTag(tagElement));
       }
     }
   }
-  hideOverflowingTagsInZone(zoneElement) {
-    if (zoneElement) {
-      const tagElements = Array.from(zoneElement.querySelectorAll('yoo-tag'));
-      tagElements === null || tagElements === void 0 ? void 0 : tagElements.forEach(tagElement => {
-        this.hideOverflowingTagInZone(zoneElement, tagElement);
-      });
-    }
+  hideOverflowingTagsInZone(zoneElement, onShowTag) {
+    Array.from((zoneElement === null || zoneElement === void 0 ? void 0 : zoneElement.querySelectorAll('yoo-tag')) || []).forEach(tagElement => {
+      this.hideOverflowingTagInZone(zoneElement, tagElement, (tagElement) => onShowTag(tagElement));
+    });
   }
   static getZones(config) {
     const { tagZoneConfig, dropZoneConfig, hostElement } = config;
     return (Array.from(hostElement.shadowRoot.querySelectorAll('.dropzone')) || [])
       .sort((a, b) => a.id > b.id ? 1 : -1)
-      .map((e, i) => {
-      const isTagsZone = e.id === 'zone-tags';
-      const localConfig = isTagsZone ? tagZoneConfig : dropZoneConfig;
-      return new Dropzone(localConfig, e, i);
-    }) || [];
+      .map((e, i) => new Dropzone(e.id === 'zone-tags' ? tagZoneConfig : dropZoneConfig, e, i)) || [];
   }
 }
 
@@ -116,7 +120,7 @@ class Tag {
     await this.dropToZone(this.zones.find(zone => zone.isTagsZone));
   }
   isTagOverlapping(zone) {
-    return overlays.Draggable.hitTest(this.element, zone.element.parentElement, zone.config.threshold || 0);
+    return overlays.Draggable.hitTest(this.element, zone.element, zone.config.threshold || 0);
   }
   createTagElement() {
     const { getColorTag, extraTagsClasses } = this.config;
@@ -143,7 +147,7 @@ class Tag {
   }
   initDraggable() {
     const { hostElement } = this.zonesConfig;
-    const { clickToDrop, clickTagExtraAction, pressTagExtraAction, releaseTagExtraAction, resetTagExtraAction, dragTagExtraAction } = this.config || {};
+    const { clickToDrop, clickTagExtraAction, pressTagExtraAction, dragStartTagExtraAction, releaseTagExtraAction, resetTagExtraAction, dragTagExtraAction } = this.config || {};
     const clickOnTag = async () => {
       var _a;
       const freeZones = this.zones.filter(zone => !(zone === null || zone === void 0 ? void 0 : zone.isTagsZone) && !(zone === null || zone === void 0 ? void 0 : zone.isDropZoneFull));
@@ -163,6 +167,9 @@ class Tag {
           clickOnTag();
         }
       },
+      onDragStart: () => {
+        dragStartTagExtraAction === null || dragStartTagExtraAction === void 0 ? void 0 : dragStartTagExtraAction(this);
+      },
       onPress: () => {
         Tag.scale('up', this.element);
         pressTagExtraAction === null || pressTagExtraAction === void 0 ? void 0 : pressTagExtraAction(this);
@@ -170,15 +177,14 @@ class Tag {
       onDrag: () => {
         this.zones.forEach(zone => {
           if (zone === null || zone === void 0 ? void 0 : zone.element) {
-            const { element } = zone;
             if (this.isTagOverlapping(zone) && !zone.isDropZoneFull) {
               this.element.color = this.config.getColorTag(this.value, zone.index);
-              if (!element.classList.contains('hit') && zone.id !== this.zone.id) {
-                element.classList.add('hit');
+              if (!zone.element.hasAttribute('hit') && zone.id !== this.zone.id) {
+                zone.element.setAttribute('hit', 'true');
               }
             }
-            else if (zone.hit) {
-              element.classList.remove('hit');
+            else if (!this.isTagOverlapping(zone)) {
+              zone.element.removeAttribute('hit');
             }
           }
         });
@@ -231,15 +237,15 @@ class Tag {
   }
   static async scale(scaleType, element) {
     const isScaledDown = scaleType === 'down';
-    await overlays.gsapTo(element, .25, {
-      scale: isScaledDown ? 1 : 1.125,
+    await overlays.gsapTo(element, .2, {
+      scale: isScaledDown ? 1 : 1.065,
       zIndex: isScaledDown ? 'auto' : 200
     });
+    element.classList.toggle('active', !isScaledDown);
   }
-  static scaleUpDown(element, callback) {
-    this.scale('up', element).then(() => {
-      this.scale('down', element).then(() => callback === null || callback === void 0 ? void 0 : callback());
-    });
+  static async scaleUpDown(element) {
+    await this.scale('up', element);
+    await this.scale('down', element);
   }
   async release(fromReset = false) {
     if (!fromReset) {
@@ -248,7 +254,7 @@ class Tag {
           this.lastZone = this.zone;
           this.zone = zone;
         }
-        this.zone.element.classList.remove('hit');
+        this.zone.element.removeAttribute('hit');
       });
     }
     this.addToZone();
@@ -287,26 +293,23 @@ class Tags extends Dropzones {
     if (tag) {
       const { element, zone } = tag;
       tag.removeFromZone(zone);
-      if (zone.element.contains(element)) {
+      if (zone.element.contains(element) && zone.tagsCount) {
         element.color = 'danger';
-        Tag.scaleUpDown(element, () => {
-          zone.element.removeChild(element);
-          this.tags = this.tags.filter(t => t.id !== tag.id);
-        });
+        await Tag.scaleUpDown(element);
+        zone.element.removeChild(element);
+        this.tags = this.tags.filter(t => t.id !== tag.id);
       }
-      this.checkOverflowingTags();
       (_c = (_b = this.tagConfig).onTagDeleted) === null || _c === void 0 ? void 0 : _c.call(_b);
     }
   }
   async addTagFromValue(value) {
+    var _a, _b;
     const newTag = new Tag(Object.assign(this.tagConfig, { extraTagsClasses: 'new' }), value, this.tagsZone, this.zonesConfig);
     this.tags.push(newTag);
     newTag.element.color = 'success';
-    Tag.scaleUpDown(newTag.element, () => {
-      var _a, _b;
-      (_b = (_a = this.tagConfig).onTagAdded) === null || _b === void 0 ? void 0 : _b.call(_a);
-      newTag.element.color = this.tagConfig.getColorTag(value, newTag.zone.index);
-    });
+    await Tag.scaleUpDown(newTag.element);
+    (_b = (_a = this.tagConfig).onTagAdded) === null || _b === void 0 ? void 0 : _b.call(_a);
+    newTag.element.color = this.tagConfig.getColorTag(value, newTag.zone.index);
   }
   async updateTags(opts) {
     let newValue;
@@ -314,8 +317,10 @@ class Tags extends Dropzones {
     const { newValues, oldValues } = opts;
     const hasNewValue = (((newValues === null || newValues === void 0 ? void 0 : newValues.length) || 0) > ((oldValues === null || oldValues === void 0 ? void 0 : oldValues.length) || 0)) || draggableTagsHelpers.hasDuplicates(oldValues);
     const hasDeletedValue = ((newValues === null || newValues === void 0 ? void 0 : newValues.length) || 0) < ((oldValues === null || oldValues === void 0 ? void 0 : oldValues.length) || 0);
+    const hasDuplicatedValues = draggableTagsHelpers.hasDuplicates(newValues);
     hasNewValue && (newValue = draggableTagsHelpers.getNewValue(oldValues, newValues));
     hasDeletedValue && (deletedValues = draggableTagsHelpers.getDeletedValues(oldValues, newValues));
+    this.zonesConfig.tagZoneConfig.hasOverflow && (this.tagsZone.element.style.overflow = 'hidden');
     if (newValue) {
       this.addTagFromValue(newValue);
     }
@@ -327,14 +332,21 @@ class Tags extends Dropzones {
         var _a;
         const tag = (_a = this.tags) === null || _a === void 0 ? void 0 : _a.find(t => t.value === ov);
         const newValue = newValues[i];
-        if (tag && tag.value !== newValue) {
+        if ((tag === null || tag === void 0 ? void 0 : tag.value) !== newValue) {
           tag.element.color = 'warning';
           tag.element.textContent = newValue;
           tag.value = newValue;
-          Tag.scaleUpDown(tag.element, () => tag.element.color = this.tagConfig.getColorTag(newValue, tag.zone.index));
+          Tag.scaleUpDown(tag.element).then(() => {
+            tag.element.color = this.tagConfig.getColorTag(newValue, tag.zone.index);
+          });
         }
       });
     }
+    else if (hasDuplicatedValues) {
+      const formateValues = (values) => (values === null || values === void 0 ? void 0 : values.filter((e, i, a) => a.indexOf(e) === i)) || [];
+      await Promise.all(formateValues(oldValues).map(v => this.deleteTagFromValue(v)));
+      formateValues(newValues).forEach(v => this.addTagFromValue(v));
+    }
   }
   getElements(selector, containerElement) {
     var _a;
@@ -349,19 +361,16 @@ class Tags extends Dropzones {
     this.zones.forEach(zone => {
       var _a;
       if ((_a = zone === null || zone === void 0 ? void 0 : zone.config) === null || _a === void 0 ? void 0 : _a.hasOverflow) {
-        this.hideOverflowingTagsInZone(zone.element);
+        zone.isTagsZone && (zone.element.style.removeProperty('overflow'));
+        this.hideOverflowingTagsInZone(zone.element, (te) => Tag.scaleUpDown(te));
       }
     });
   }
   async init() {
-    if (this === null || this === void 0 ? void 0 : this.tagConfig) {
+    if (this.tagConfig) {
       this.populate();
-      if (this.hostElement['animated'] && this.hostElement['isVisible'] && this.tagsZone) {
-        await this.animate();
-      }
-      else {
-        this.checkOverflowingTags();
-      }
+      this.setTagsZoneOverflow(true);
+      await this.animate();
     }
   }
   populate() {
@@ -375,31 +384,33 @@ class Tags extends Dropzones {
   }
   async animate() {
     var _a, _b;
-    const elements = (_a = this.droppableTagElements) === null || _a === void 0 ? void 0 : _a.filter(e => e);
-    const hideOverflowingTag = (te) => this.hideOverflowingTagInZone(this.tagsZone.element, te);
-    const firstTagAnimationFinishedCB = () => { var _a, _b; return (_b = (_a = this.tagConfig).onFirstTagAnimationFinished) === null || _b === void 0 ? void 0 : _b.call(_a); };
-    const firstElement = elements === null || elements === void 0 ? void 0 : elements[0];
-    overlays.gsapFromTo(elements, .75, {
-      x: (_b = this.hostElement) === null || _b === void 0 ? void 0 : _b.clientWidth,
-      opacity: 0
-    }, {
-      x: 0,
-      opacity: 1,
-      stagger: {
-        each: .25,
-        onStart() {
-          const element = this.targets()[0];
-          if (element.id === firstElement.id) {
-            firstTagAnimationFinishedCB();
+    if (this.hostElement['animated'] && this.hostElement['isVisible'] && this.tagsZone) {
+      const elements = (_a = this.droppableTagElements) === null || _a === void 0 ? void 0 : _a.filter(e => e);
+      const { onFirstTagAnimationFinished, onTagsAnimationFinished } = this.tagConfig || {};
+      const hideOverflowingTag = (tagElement) => this.hideOverflowingTagInZone(this.tagsZone.element, tagElement, () => Tag.scaleUpDown(tagElement));
+      const firstElement = elements === null || elements === void 0 ? void 0 : elements[0];
+      overlays.gsapFromTo(elements, .75, {
+        x: (_b = this.hostElement) === null || _b === void 0 ? void 0 : _b.clientWidth,
+        opacity: 0
+      }, {
+        x: 0,
+        opacity: 1,
+        stagger: {
+          each: .25,
+          onStart() {
+            var _a, _b;
+            const element = (_a = this.targets()) === null || _a === void 0 ? void 0 : _a[0];
+            hideOverflowingTag(element);
+            if (element.id === firstElement.id) {
+              onFirstTagAnimationFinished === null || onFirstTagAnimationFinished === void 0 ? void 0 : onFirstTagAnimationFinished();
+            }
+            if (element.id === ((_b = elements === null || elements === void 0 ? void 0 : elements[(elements === null || elements === void 0 ? void 0 : elements.length) - 1]) === null || _b === void 0 ? void 0 : _b.id)) {
+              onTagsAnimationFinished === null || onTagsAnimationFinished === void 0 ? void 0 : onTagsAnimationFinished();
+            }
           }
-          hideOverflowingTag(element);
         }
-      },
-      onComplete: () => {
-        var _a, _b;
-        (_b = (_a = this.tagConfig).onTagsAnimationFinished) === null || _b === void 0 ? void 0 : _b.call(_a);
-      }
-    });
+      });
+    }
   }
 }
 

package/dist/cjs/{index-8a95cd3e.js → index-d66b8726.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-require('./index-49d083a4.js');
-const overlays = require('./overlays-0cf588e0.js');
+require('./index-ce31bddc.js');
+const overlays = require('./overlays-24592dac.js');
 
 class GestureController {
   constructor() {

package/dist/cjs/{index-65296b89.js → index-e9c33e18.js}

@@ -1,10 +1,10 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-49d083a4.js');
+require('./index-ce31bddc.js');
 const lodash = require('./lodash-72d493b9.js');
 const annotationsHelpers = require('./annotations-helpers-6cf88388.js');
-const overlays = require('./overlays-0cf588e0.js');
+const overlays = require('./overlays-24592dac.js');
 
 const starRatingMaxDefault = 5;
 function filterSequentialFields(fieldCondition) {
@@ -1141,7 +1141,8 @@ function addRow(items, { title, order, entity, location, path, slideIndex, field
   else if (isValueTooLong) {
     const valueRemovedHTML = (_a = entity === null || entity === void 0 ? void 0 : entity.title) === null || _a === void 0 ? void 0 : _a.replace(/(<([^>]+)>)/ig, '');
     const titleTranslation = (_b = items.find((t) => ('%' + t.key + '%' === (entity === null || entity === void 0 ? void 0 : entity.title) || '%' + t.key + '%' === valueRemovedHTML))) === null || _b === void 0 ? void 0 : _b.value;
-    errorMessages.push(`• ${lessonTitle ? `${overlays.translateMulti(lessonTitle)} -` : ''} ${overlays.translateMulti(location)} - ${overlays.translateMulti(titleTranslation || (entity === null || entity === void 0 ? void 0 : entity.title))} - ${path}`);
+    const titleTruncated = overlays.truncateMarkdown(overlays.translateMulti(titleTranslation || (entity === null || entity === void 0 ? void 0 : entity.title)), 50, '...');
+    errorMessages.push(`• ${lessonTitle ? `${overlays.translateMulti(lessonTitle)} -` : ''} ${overlays.translateMulti(location)} - ${titleTruncated} - ${path}`);
   }
   return hasBeenEdited;
 }