@yoobic/yobi 8.4.0-1 → 8.4.0-4

package/dist/{esm/dom-26e7cb2c.js → design-system/dom-9794f747.js}

@@ -1,5 +1,5 @@
 /*
- Stencil Client Patch Browser v2.17.3 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.4 | 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/{esm/draggable-dots-helpers-6700d1de.js → design-system/draggable-dots-helpers-2f99fb20.js}

@@ -1,7 +1,7 @@
-import './index-0621f7f2.js';
+import './index-20e383f3.js';
 import { O as isFinite, V as inRange } from './lodash-653c0bcd.js';
-import { f as getBound, d as getElement, c as calcCoordPercentage, b as isAnnotationValid, e as getAnnotationPositionStyle, i as isAnnotationEmpty, h as isAnnotationDeleted } from './annotations-helpers-628a8ae3.js';
-import { aR as Draggable, a3 as getSession, aw as getCurrentLanguage, aQ as getUUID, K as getCssColor, bq as getContrastColor, aS as gsapTo, br as scaleUpAnimation, bs as convertSvgToBase64, bk as getMedia, z as showModal } from './overlays-54d1b9f8.js';
+import { e as getBound, b as getElement, c as calcCoordPercentage, a as isAnnotationValid, d as getAnnotationPositionStyle, i as isAnnotationEmpty, f as isAnnotationDeleted } from './annotations-helpers-f7b42b40.js';
+import { aR as Draggable, a3 as getSession, aw as getCurrentLanguage, aQ as getUUID, K as getCssColor, bq as getContrastColor, aS as gsapTo, br as scaleUpAnimation, bs as convertSvgToBase64, bk as getMedia, z as showModal } from './overlays-71ffe7eb.js';
 
 const EEditorActions = {
   typeTool: 'type-tool',

package/dist/{esm/draggable-tags-helpers-177c5425.js → design-system/draggable-tags-helpers-4471d773.js}

@@ -1,6 +1,6 @@
-import './index-0621f7f2.js';
+import './index-20e383f3.js';
 import { R as countBy } from './lodash-653c0bcd.js';
-import { t as translate } from './overlays-54d1b9f8.js';
+import { t as translate, A as isWeb, Q as findParent } from './overlays-71ffe7eb.js';
 
 function checkArray(array) {
   return !!((array === null || array === void 0 ? void 0 : array.length) && Array.isArray(array));
@@ -27,19 +27,14 @@ async function showWarningBanner(container, showBanner = true, messageKey = 'NOD
   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'));
   if (bannerElement) {
     const bannerStyle = {
-      width: '100%',
       transition: ['height', 'opacity'].map(prop => `${prop} .5s ease-in-out`).join(', '),
-      backgroundColor: `var(--${backgroundColor})`,
       height: 'auto',
       opacity: '1',
-      padding: `${showBanner ? 'var(--spacing-08)' : '0'}`
+      padding: `${showBanner ? 'var(--spacing-08)' : '0'}`,
+      fontWeight: 'var(--font-weight-700)'
     };
     const content = bannerElement.querySelector('p[slot="content"]');
     content.innerHTML = translate(messageKey);
-    Object.assign(content.style, {
-      color: 'var(--light)',
-      fontWeight: 'var(--font-weight-700)'
-    });
     await bannerElement.componentOnReady();
     const bannerHeight = bannerElement.firstElementChild.clientHeight;
     Object.assign(bannerElement.style, {
@@ -47,8 +42,23 @@ async function showWarningBanner(container, showBanner = true, messageKey = 'NOD
       height: `${showBanner ? bannerHeight : 0}px`,
       opacity: showBanner ? '1' : '0'
     });
+    bannerElement.style.setProperty('--main-color', `var(--${backgroundColor})`);
+    bannerElement.style.setProperty('--main-text-color', 'var(--light)');
     bannerElement.classList.add('sharp');
   }
 }
+function prepareAutoScroll(hostElement) {
+  if ((hostElement === null || hostElement === void 0 ? void 0 : hostElement.shadowRoot) && isWeb() && !(hostElement === null || hostElement === void 0 ? void 0 : hostElement['readonly'])) {
+    const wrapperElement = findParent(hostElement, 'yoo-form-input-container');
+    const mainElement = hostElement.shadowRoot.querySelector('main');
+    if (wrapperElement && mainElement && wrapperElement.offsetHeight < hostElement.offsetHeight) {
+      const { height } = wrapperElement.getBoundingClientRect();
+      height && Object.assign(mainElement.style, {
+        maxHeight: `${Math.floor(height - 16) - 32}px`,
+        overflowY: 'auto'
+      });
+    }
+  }
+}
 
-export { getDeletedValues as a, getDuplicatedValue as b, checkArray as c, filterDuplicateEntries as f, getNewValue as g, hasDuplicates as h, showWarningBanner as s };
+export { getDeletedValues as a, getDuplicatedValue as b, checkArray as c, filterDuplicateEntries as f, getNewValue as g, hasDuplicates as h, prepareAutoScroll as p, showWarningBanner as s };

package/dist/{esm/entities-helpers-314261d6.js → design-system/entities-helpers-9b73c439.js}

@@ -1,7 +1,7 @@
-import { M as MessageType } from './index-eec8505b.js';
-import './index-0621f7f2.js';
+import { M as MessageType } from './index-84768350.js';
+import './index-20e383f3.js';
 import { a as isNumber, n as compact } from './lodash-653c0bcd.js';
-import { a7 as getUserDisplayName, ar as pipes, ao as replaceAtTagToMentionTag, av as isCloudinaryLink, aw as getCurrentLanguage, P as getAsyncExtraData, ap as replaceAllLinks, ax as parseMarkDown, a3 as getSession, ay as isPhotoEdited, az as changeExtension, Z as translateMulti, aA as toButton, aB as toDate, aC as capitalizeFirstLetter, ah as isGif, t as translate, K as getCssColor, ag as isVideo } from './overlays-54d1b9f8.js';
+import { a7 as getUserDisplayName, ar as pipes, ao as replaceAtTagToMentionTag, av as isCloudinaryLink, aw as getCurrentLanguage, P as getAsyncExtraData, ap as replaceAllLinks, ax as parseMarkDown, a3 as getSession, ay as isPhotoEdited, az as changeExtension, Z as translateMulti, aA as toButton, aB as toDate, aC as capitalizeFirstLetter, ah as isGif, t as translate, K as getCssColor, ag as isVideo } from './overlays-71ffe7eb.js';
 
 const mentionRegex = /<yoo-mention-tag[^>]*>([\s\S]*?)<\/yoo-mention-tag>/g;
 /**

package/dist/{esm/filters-helpers-b534e8ed.js → design-system/filters-helpers-553d2b6c.js}

@@ -1,7 +1,7 @@
-import { c as FormFieldType } from './index-eec8505b.js';
-import './index-0621f7f2.js';
+import { c as FormFieldType } from './index-84768350.js';
+import './index-20e383f3.js';
 import { Q as set, n as compact } from './lodash-653c0bcd.js';
-import { aG as isTextField, t as translate, A as isWeb } from './overlays-54d1b9f8.js';
+import { aG as isTextField, t as translate, A as isWeb } from './overlays-71ffe7eb.js';
 
 function isWithValuesField(field) {
   var _a;
@@ -160,7 +160,7 @@ function filterRenderFormDynamic(filteredFields, filters, formAutocompletes, add
           newField.type = FormFieldType.filternumber;
         }
         if (filterIsText(field) || filterIsDate(field) || filterIsNumber(field)) {
-          newField.style = { ...(newField.style || {}), '--dialog-position': 'fixed', '--dialog-max-height': '25rem', '--dialog-width': '17.5rem' };
+          newField.style = { ...(newField.style || {}), '--dialog-position': 'absolute', '--dialog-max-height': '25rem', '--dialog-width': '17.5rem' };
         }
         if (filterIsAutocomplete(field)) {
           newField.type = FormFieldType.filterautocomplete;

package/dist/{esm/form-choice-helpers-fcef921a.js → design-system/form-choice-helpers-59ca0830.js}

@@ -1,10 +1,10 @@
-import './index-0621f7f2.js';
+import './index-20e383f3.js';
 import { S as findIndex, A as isEqual, n as compact, T as shuffle } from './lodash-653c0bcd.js';
-import { h as hasDuplicates, s as showWarningBanner } from './draggable-tags-helpers-177c5425.js';
-import { a as setValueAndValidateInput, s as setValidator } from './form-input-helpers-9d428369.js';
-import { h, r as registerInstance, i as createEvent, e as Host, g as getElement } from './index-24530c1f.js';
-import { s as setColorSVG } from './common-helpers-980d9808.js';
-import { Z as translateMulti, i as isChromatic, t as translate, X as isNullOrUndefined } from './overlays-54d1b9f8.js';
+import { h as hasDuplicates, s as showWarningBanner } from './draggable-tags-helpers-4471d773.js';
+import { a as setValueAndValidateInput, s as setValidator } from './form-input-helpers-87b417ac.js';
+import { h, r as registerInstance, i as createEvent, e as Host, g as getElement } from './index-53ad1641.js';
+import { s as setColorSVG } from './common-helpers-e3797466.js';
+import { Z as translateMulti, i as isChromatic, t as translate, X as isNullOrUndefined } from './overlays-71ffe7eb.js';
 import { h as highcharts } from './highcharts-c1be7540.js';
 
 const ReadonlyCard = ({ value, values, answer, valuesColor, classNames }) => {

package/dist/design-system/{form-helpers-f240cdd6.js → form-helpers-9fbd6983.js}

@@ -1,7 +1,7 @@
-import { c as FormFieldType } from './index-eec8505b.js';
-import { V as VALIDATORS, g as getReducedValidator } from './index-0621f7f2.js';
+import { c as FormFieldType } from './index-84768350.js';
+import { V as VALIDATORS, g as getReducedValidator } from './index-20e383f3.js';
 import { q as isString, i as isArray, v as isObject, d as concat, Q as set, C as get, W as sumBy, A as isEqual, c as cloneDeep, a as isNumber } from './lodash-653c0bcd.js';
-import { a3 as getSession, X as isNullOrUndefined, bt as evalInContext, bu as evalConditionsInContext, bv as getNameAndData, bw as getFieldsFromSlides, bx as getFieldValue, by as getFieldReplacement, P as getAsyncExtraData, bz as getSessionReplacementValue, bA as escapeRegExp, bB as slenderizeObject, bC as getFormulaReplacement, bD as isDateTimeField, t as translate } from './overlays-54d1b9f8.js';
+import { a3 as getSession, X as isNullOrUndefined, bt as evalInContext, bu as evalConditionsInContext, bv as getNameAndData, bw as getFieldsFromSlides, bx as getFieldValue, by as getFieldReplacement, P as getAsyncExtraData, bz as getSessionReplacementValue, bA as escapeRegExp, bB as slenderizeObject, bC as getFormulaReplacement, bD as isDateTimeField, t as translate } from './overlays-71ffe7eb.js';
 
 function isCreationAllowed(field, isVisible, isDisabled, isReadOnly = false) {
   return !!field.allowCreate && isVisible && !isDisabled && isReadOnly !== true;

package/dist/{esm/form-input-helpers-9d428369.js → design-system/form-input-helpers-87b417ac.js}

@@ -1,7 +1,7 @@
-import { X as isNullOrUndefined, Q as findParent, aH as dateIsValid, aI as isPresent, aB as toDate, j as isNativeMobile, ak as dateFormat, H as isIOS, aJ as dateSub, aK as dateAdd, k as isAndroid, aL as Keyboard } from './overlays-54d1b9f8.js';
-import { c as FormFieldType } from './index-eec8505b.js';
-import { g as getReducedValidator, a as getReducedAsyncValidator } from './index-0621f7f2.js';
-import { b as getActiveElementShadow, q as querySelectorDeep, c as querySelectorAllDeep } from './common-helpers-980d9808.js';
+import { X as isNullOrUndefined, Q as findParent, aH as dateIsValid, aI as isPresent, aB as toDate, j as isNativeMobile, ak as dateFormat, H as isIOS, aJ as dateSub, aK as dateAdd, k as isAndroid, aL as Keyboard } from './overlays-71ffe7eb.js';
+import { c as FormFieldType } from './index-84768350.js';
+import { g as getReducedValidator, a as getReducedAsyncValidator } from './index-20e383f3.js';
+import { b as getActiveElementShadow, q as querySelectorDeep, c as querySelectorAllDeep } from './common-helpers-e3797466.js';
 
 let inputBlur = true;
 function focusContentEditable(inputElement) {

package/dist/{esm/form-text-area-helpers-b3d3b975.js → design-system/form-text-area-helpers-343d8f20.js}

@@ -1,6 +1,6 @@
-import { d as getRange } from './index-0621f7f2.js';
+import { d as getRange } from './index-20e383f3.js';
 import { V as inRange } from './lodash-653c0bcd.js';
-import { a7 as getUserDisplayName, K as getCssColor } from './overlays-54d1b9f8.js';
+import { a7 as getUserDisplayName, K as getCssColor } from './overlays-71ffe7eb.js';
 
 /**
  * Safely insert element

package/dist/design-system/{grid-renderers-07cc0350.js → grid-renderers-4064d89d.js}

@@ -1,12 +1,12 @@
-import { c as FormFieldType, h as IncentiveStatus, n as IncentivePartType, i as IncentiveType } from './index-eec8505b.js';
-import './index-0621f7f2.js';
+import { c as FormFieldType, h as IncentiveStatus, n as IncentivePartType, i as IncentiveType } from './index-84768350.js';
+import './index-20e383f3.js';
 import { a5 as findKey, i as isArray, b as isFunction, a as isNumber, n as compact, q as isString, C as get, y as isEmpty, F as indexOf, v as isObject, k as keys, h as map, r as round } from './lodash-653c0bcd.js';
-import { a as getPositionText } from './incentive-helpers-5867649b.js';
-import { e as getWorkflowStepBadge } from './missions-helpers-dcdb142a.js';
-import { d as dateRangeState } from './common-helpers-980d9808.js';
-import { g as getJSONHighlighted } from './form-helpers-f240cdd6.js';
+import { a as getPositionText } from './incentive-helpers-585a13f1.js';
+import { e as getWorkflowStepBadge } from './missions-helpers-6a0de073.js';
+import { d as dateRangeState } from './common-helpers-e3797466.js';
+import { g as getJSONHighlighted } from './form-helpers-9fbd6983.js';
 import { f as formatDistance } from './geolocation-helpers-5126a3df.js';
-import { K as getCssColor, Z as translateMulti, t as translate, dX as groupsResolver, dY as aclRolesResolver, ar as pipes, ak as dateFormat, aB as toDate, bU as dateParse, al as dispatchCustomEvent, bI as dateDiff, dZ as toHours, d_ as utc, a7 as getUserDisplayName, cX as salesAIGetColorFromPattern, cY as salesAIFormatDemand, aA as toButton } from './overlays-54d1b9f8.js';
+import { K as getCssColor, Z as translateMulti, t as translate, dY as groupsResolver, dZ as aclRolesResolver, ar as pipes, ak as dateFormat, aB as toDate, bU as dateParse, al as dispatchCustomEvent, bI as dateDiff, d_ as toHours, d$ as utc, a7 as getUserDisplayName, cY as salesAIGetColorFromPattern, cZ as salesAIFormatDemand, aA as toButton } from './overlays-71ffe7eb.js';
 
 const countryFlag = (country) => {
   return getFlagEmoji(getCountryCode(country));

package/dist/{esm/incentive-helpers-5867649b.js → design-system/incentive-helpers-585a13f1.js}

@@ -1,7 +1,7 @@
-import { m as IncentiveStatusBadges, n as IncentivePartType } from './index-eec8505b.js';
-import './index-0621f7f2.js';
+import { m as IncentiveStatusBadges, n as IncentivePartType } from './index-84768350.js';
+import './index-20e383f3.js';
 import { r as round } from './lodash-653c0bcd.js';
-import { a4 as getIncentiveState, t as translate, a5 as appendIncentiveUnit, a6 as getParticipantsScore } from './overlays-54d1b9f8.js';
+import { a4 as getIncentiveState, t as translate, a5 as appendIncentiveUnit, a6 as getParticipantsScore } from './overlays-71ffe7eb.js';
 
 /**
  * @function getIncentiveStatusBadgeSettings

package/dist/design-system/index-11ad6fb9.js

@@ -0,0 +1 @@
+import './localForage-f05ec61c.js';

package/dist/{esm/index-0621f7f2.js → design-system/index-20e383f3.js}

@@ -1,4 +1,4 @@
-import { _ as __extends, c as __assign, d as __spreadArray, e as compareAsc, f as isSameDate } from './overlays-54d1b9f8.js';
+import { _ as __extends, c as __assign, d as __spreadArray, e as compareAsc, f as isSameDate } from './overlays-71ffe7eb.js';
 import { g as global$2, c as cloneDeep, i as isArray$1, a as isNumber$1 } from './lodash-653c0bcd.js';
 
 function shiftSlidesToNext(activeSlideIndex, slides, cachedSlides = 1) {
@@ -4810,7 +4810,7 @@ const toOptions$1 = (options) => ({
   byminute: 0,
   bysecond: 0,
   freq: toFreq(options === null || options === void 0 ? void 0 : options.frequency),
-  interval: options === null || options === void 0 ? void 0 : options.interval,
+  interval: (options === null || options === void 0 ? void 0 : options.interval) || 1,
   ...((options === null || options === void 0 ? void 0 : options.frequency) === 'MONTH' ? toMonthOptions(options === null || options === void 0 ? void 0 : options.monthOptions) : (options === null || options === void 0 ? void 0 : options.frequency) === 'YOOBICWEEK' ? toWeekOptions(options === null || options === void 0 ? void 0 : options.weekOptions) : {})
 });
 

package/dist/{esm/index-ac42012a.js → design-system/index-292fe310.js}

@@ -1,7 +1,7 @@
-import './index-0621f7f2.js';
+import './index-20e383f3.js';
 import { A as isEqual } from './lodash-653c0bcd.js';
-import { h as hasDuplicates, g as getNewValue, a as getDeletedValues } from './draggable-tags-helpers-177c5425.js';
-import { aQ as getUUID, aR as Draggable, Z as translateMulti, aS as gsapTo, aT as gsapSet, A as isWeb, Q as findParent, aU as gsapFromTo } from './overlays-54d1b9f8.js';
+import { h as hasDuplicates, g as getNewValue, a as getDeletedValues, p as prepareAutoScroll } from './draggable-tags-helpers-4471d773.js';
+import { aQ as getUUID, aR as Draggable, Z as translateMulti, aS as gsapTo, aT as gsapSet, aU as gsapFromTo } from './overlays-71ffe7eb.js';
 
 class Dropzone {
   constructor(config, element, index) {
@@ -10,6 +10,9 @@ class Dropzone {
     this.index = index;
     this.initTagZone();
   }
+  get tagElements() {
+    return Array.from(this.element.querySelectorAll('yoo-tag')) || [];
+  }
   get colorClass() {
     const { colorClass } = this.config || {};
     return ((colorClass === null || colorClass === void 0 ? void 0 : colorClass[this.index]) || colorClass);
@@ -21,8 +24,7 @@ class Dropzone {
     return this.element.hasAttribute('hit');
   }
   get tagsId() {
-    var _a;
-    return ((_a = Array.from(this.element.querySelectorAll('yoo-tag'))) === null || _a === void 0 ? void 0 : _a.map(e => e.id)) || [];
+    return this.tagElements.map(e => e.id) || [];
   }
   get tagsLimit() {
     const answers = this.element.getRootNode()['host']['answer'] || {};
@@ -33,8 +35,7 @@ class Dropzone {
     return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.id) === 'zone-tags';
   }
   get tagsCount() {
-    var _a, _b;
-    return ((_b = Array.from(((_a = this.element) === null || _a === void 0 ? void 0 : _a.querySelectorAll('yoo-tag')) || [])) === null || _b === void 0 ? void 0 : _b.length) || 0;
+    return this.tagElements.length || 0;
   }
   get isDropZoneFull() {
     return !this.isTagsZone && this.tagsCount === (this.tagsLimit || 1);
@@ -69,16 +70,11 @@ class Dropzones {
   }
   async hideOverflowingTagInZone(zoneElement, tagElement, onShowTag) {
     if (tagElement && zoneElement) {
-      const zoneBR = zoneElement.getBoundingClientRect();
-      const tagBR = tagElement.getBoundingClientRect();
-      const hasBounding = !!(top && zoneBR.top && zoneBR.height);
-      if (hasBounding && (tagBR.top >= (zoneBR.top + zoneBR.height))) {
-        tagElement.style.visibility = 'hidden';
-      }
-      else if (tagElement.style.visibility === 'hidden') {
-        tagElement.style.visibility = 'visible';
-        await (onShowTag === null || onShowTag === void 0 ? void 0 : onShowTag(tagElement));
-      }
+      const zoneTop = zoneElement.offsetTop;
+      const zoneHeight = zoneElement.offsetHeight;
+      const isTagOverflowing = !!zoneTop && !!zoneHeight && (tagElement.offsetTop >= (zoneTop + zoneHeight));
+      isTagOverflowing ? tagElement.style.visibility = 'hidden' : tagElement.style.removeProperty('visibility');
+      await (onShowTag === null || onShowTag === void 0 ? void 0 : onShowTag(tagElement));
     }
   }
   hideOverflowingTagsInZone(zoneElement, onShowTag) {
@@ -96,20 +92,12 @@ class Dropzones {
 
 class Tag {
   constructor(config, value, zone, zonesConfig) {
-    var _a, _b;
     this.config = config;
     this.value = value;
     this.zone = zone;
     this.zonesConfig = zonesConfig;
     this.id = getUUID();
-    this.lastZone = this.zone;
-    if ((_a = this.zone) === null || _a === void 0 ? void 0 : _a.element.id) {
-      this.element = this.createTagElement();
-      this.initDraggable();
-      if ((_b = this.zone.tagsId) === null || _b === void 0 ? void 0 : _b.includes(this.id)) {
-        this.zone.tagsId.push(this.id);
-      }
-    }
+    this.initTag();
   }
   get zones() {
     return Dropzones.getZones(this.zonesConfig);
@@ -120,13 +108,24 @@ class Tag {
   isTagOverlapping(zone) {
     return Draggable.hitTest(this.element, zone.element, zone.config.threshold || 0);
   }
+  initTag() {
+    this.lastZone = this.zone;
+    const { element, tagsId } = this.zone || {};
+    if (element.id) {
+      this.element = this.createTagElement();
+      this.initDraggable();
+      this.release();
+      if (tagsId === null || tagsId === void 0 ? void 0 : tagsId.includes(this.id)) {
+        tagsId.push(this.id);
+      }
+    }
+  }
   createTagElement() {
     const { getColorTag, extraTagsClasses } = this.config;
-    const { isTagsZone, element } = this.zone;
     const tagElement = document.createElement('yoo-tag');
     extraTagsClasses && tagElement.classList.add(extraTagsClasses);
-    !isTagsZone && tagElement.classList.add('dropped');
-    Object.assign(tagElement, {
+    !this.zone.isTagsZone && tagElement.classList.add('dropped');
+    return Object.assign(tagElement, {
       id: this.id,
       key: this.id,
       innerHTML: translateMulti(this.value),
@@ -134,14 +133,17 @@ class Tag {
       darkTheme: false,
       color: getColorTag(this.value, this.zone.index)
     });
-    element[isTagsZone ? 'prepend' : 'appendChild'](tagElement);
-    if (!isTagsZone) {
-      element.classList.add('has-tag');
-    }
-    if (this.zone.isDropZoneFull) {
-      element.classList.add('completed');
+  }
+  get droppedTagXPosition() {
+    const hostWidth = this.zonesConfig.hostElement.offsetWidth;
+    const tagWidth = this.element.offsetWidth;
+    const { offsetLeft, offsetWidth } = this.zone.element;
+    const zoneOffset = Math.min(offsetLeft, hostWidth - offsetLeft - offsetWidth);
+    if (this.config.dragAndScroll && !this.zone.isTagsZone && zoneOffset < tagWidth / 2 - offsetWidth / 2) {
+      const isLeft = offsetLeft < hostWidth * .5;
+      return (tagWidth / 2 - (zoneOffset + offsetWidth / 2)) * (isLeft ? 1 : -1);
     }
-    return tagElement;
+    return 0;
   }
   initDraggable() {
     const { hostElement } = this.zonesConfig;
@@ -178,9 +180,7 @@ class Tag {
           if (zone === null || zone === void 0 ? void 0 : zone.element) {
             if (this.isTagOverlapping(zone) && !zone.isDropZoneFull) {
               this.element.color = this.config.getColorTag(this.value, zone.index);
-              if (!zone.element.hasAttribute('hit') && zone.id !== this.zone.id) {
-                zone.element.setAttribute('hit', 'true');
-              }
+              zone.element.setAttribute('hit', 'true');
             }
             else if (!this.isTagOverlapping(zone)) {
               zone.element.removeAttribute('hit');
@@ -196,19 +196,16 @@ class Tag {
     });
   }
   addToZone(zone) {
-    const { tagsId, element, isDropZoneFull, isTagsZone, index } = zone || this.zone || {};
+    zone = zone || this.zone;
+    const { tagsId, element, isDropZoneFull, isTagsZone, index } = zone || {};
     const tagColor = this.config.getColorTag(this.value, index);
     if (this.element && element && !isDropZoneFull && !tagsId.includes(this.id)) {
       tagsId.unshift(this.id);
       if (!element.contains(this.element)) {
         element[isTagsZone ? 'prepend' : 'appendChild'](this.element);
         if (!isTagsZone) {
-          if (!element.classList.contains('has-tag') && (zone || this.zone).tagsCount > 0) {
-            element.classList.add('has-tag');
-          }
-          if ((zone || this.zone).isDropZoneFull) {
-            !element.classList.contains('completed') && element.classList.add('completed');
-          }
+          element.classList.toggle('has-tag', zone.tagsCount > 0);
+          element.classList.toggle('completed', zone.isDropZoneFull);
         }
       }
     }
@@ -261,7 +258,8 @@ class Tag {
     this.zones
       .map(z => z.element)
       .forEach(e => !e.firstChild && e.classList.remove('has-tag'));
-    gsapSet(this.element, { x: 0, y: 0 });
+    await this.element.componentOnReady();
+    gsapSet(this.element, { x: this.droppedTagXPosition, y: 0 });
     Tag.scaleUpDown(this.element);
   }
 }
@@ -296,7 +294,7 @@ class Tags extends Dropzones {
         element.color = 'danger';
         await Tag.scaleUpDown(element);
         zone.element.removeChild(element);
-        this.tags = this.tags.filter(t => t.id !== tag.id);
+        this.tags = this.tags.filter(({ id }) => id !== tag.id);
       }
       (_c = (_b = this.tagConfig).onTagDeleted) === null || _c === void 0 ? void 0 : _c.call(_b);
     }
@@ -321,31 +319,22 @@ class Tags extends Dropzones {
     hasDeletedValue && (deletedValues = getDeletedValues(oldValues, newValues));
     this.zonesConfig.tagZoneConfig.hasOverflow && (this.tagsZone.element.style.overflow = 'hidden');
     if (newValue) {
-      this.addTagFromValue(newValue);
+      await this.addTagFromValue(newValue);
     }
     else if (deletedValues === null || deletedValues === void 0 ? void 0 : deletedValues.length) {
-      deletedValues.forEach(v => this.deleteTagFromValue(v));
+      await Promise.all(deletedValues.map(v => this.deleteTagFromValue(v)));
     }
-    else if ((newValues === null || newValues === void 0 ? void 0 : newValues.length) === (oldValues === null || oldValues === void 0 ? void 0 : oldValues.length) && !isEqual(newValues, oldValues) && !hasDuplicates(newValues)) {
-      oldValues.forEach((ov, i) => {
-        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 === null || tag === void 0 ? void 0 : tag.value) !== newValue) {
-          tag.element.color = 'warning';
-          tag.element.textContent = newValue;
-          tag.value = newValue;
-          Tag.scaleUpDown(tag.element).then(() => {
-            tag.element.color = this.tagConfig.getColorTag(newValue, tag.zone.index);
-          });
-        }
-      });
+    else if ((newValues === null || newValues === void 0 ? void 0 : newValues.length) === (oldValues === null || oldValues === void 0 ? void 0 : oldValues.length) && !isEqual(newValues, oldValues) && !hasDuplicatedValues) {
+      oldValues.forEach((value) => this.deleteTagFromValue(value));
+      await Promise.all(newValues.map((value) => this.addTagFromValue(value)));
     }
     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));
+      formateValues(oldValues).forEach(v => this.deleteTagFromValue(v));
+      await Promise.all(formateValues(newValues).map(v => this.addTagFromValue(v)));
     }
+    this.checkOverflowingTags();
+    return this;
   }
   getElements(selector, containerElement) {
     var _a;
@@ -361,7 +350,7 @@ class Tags extends Dropzones {
       var _a;
       if ((_a = zone === null || zone === void 0 ? void 0 : zone.config) === null || _a === void 0 ? void 0 : _a.hasOverflow) {
         zone.isTagsZone && (zone.element.style.removeProperty('overflow'));
-        this.hideOverflowingTagsInZone(zone.element, (te) => Tag.scaleUpDown(te));
+        this.hideOverflowingTagsInZone(zone.element, (tagElement) => Tag.scaleUpDown(tagElement));
       }
     });
   }
@@ -372,19 +361,6 @@ class Tags extends Dropzones {
       await this.animate();
     }
   }
-  static prepareAutoScroll(hostElement) {
-    if ((hostElement === null || hostElement === void 0 ? void 0 : hostElement.shadowRoot) && isWeb() && !(hostElement === null || hostElement === void 0 ? void 0 : hostElement['readonly'])) {
-      const wrapperElement = findParent(hostElement, 'yoo-form-input-container');
-      const mainElement = hostElement.shadowRoot.querySelector('main');
-      if (wrapperElement && mainElement) {
-        const { height } = wrapperElement.getBoundingClientRect();
-        height && Object.assign(mainElement.style, {
-          maxHeight: `${Math.floor(height - 16) - 32}px`,
-          overflowY: 'auto'
-        });
-      }
-    }
-  }
   populate() {
     var _a, _b, _c, _d, _e, _f;
     const userAnswers = (_a = this.hostElement) === null || _a === void 0 ? void 0 : _a['value'];
@@ -400,6 +376,7 @@ class Tags extends Dropzones {
       const elements = (_a = this.droppableTagElements) === null || _a === void 0 ? void 0 : _a.filter(e => e);
       const { dragAndScroll, onFirstTagAnimationFinished, onTagsAnimationFinished } = this.tagConfig || {};
       const hideOverflowingTag = (tagElement) => this.hideOverflowingTagInZone(this.tagsZone.element, tagElement, () => Tag.scaleUpDown(tagElement));
+      const setupAutoScroll = () => dragAndScroll && prepareAutoScroll(this.hostElement);
       const firstElement = elements === null || elements === void 0 ? void 0 : elements[0];
       gsapFromTo(elements, .75, {
         x: (_b = this.hostElement) === null || _b === void 0 ? void 0 : _b.clientWidth,
@@ -414,10 +391,10 @@ class Tags extends Dropzones {
             const element = (_a = this.targets()) === null || _a === void 0 ? void 0 : _a[0];
             hideOverflowingTag(element);
             if (element.id === firstElement.id) {
-              dragAndScroll && Tags.prepareAutoScroll(this.hostElement);
               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)) {
+              setupAutoScroll();
               onTagsAnimationFinished === null || onTagsAnimationFinished === void 0 ? void 0 : onTagsAnimationFinished();
             }
           }
@@ -431,4 +408,4 @@ function initTags(tagConfig, zonesConfig) {
   return new Tags(tagConfig, zonesConfig);
 }
 
-export { Tags as T, initTags as i };
+export { initTags as i };

package/dist/{esm/index-55e1ad87.js → design-system/index-31d58974.js}

@@ -1,4 +1,4 @@
-import { v as IEntity, t as FormCreatorBulkActions } from './index-eec8505b.js';
+import { v as IEntity, t as FormCreatorBulkActions } from './index-84768350.js';
 import './workflow.interface-79064a52.js';
 import './form-field.instance-9dc4d638.js';
 import './item-sliding.interface-85f6790e.js';

package/dist/design-system/index-4b5b8ad0.js

@@ -0,0 +1,7 @@
+import { s as FormFieldCategory, c as FormFieldType } from './index-84768350.js';
+
+const ARROW_PAIR = ['arrow-down', 'arrow-up'];
+const NON_CONDITION_CATEGORIES = [FormFieldCategory.information, FormFieldCategory.multimedia];
+const NON_CONDITION_TYPES = [FormFieldType.ranking];
+
+export { ARROW_PAIR as A, NON_CONDITION_CATEGORIES as N, NON_CONDITION_TYPES as a };

package/dist/design-system/{index-24530c1f.js → index-53ad1641.js}

@@ -2131,7 +2131,7 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
                     BUILD.shadowDom &&
                     BUILD.shadowDomShim &&
                     cmpMeta.$flags$ & 8 /* needsShadowDomShim */) {
-                    style = await import('./shadow-css-8eba16c2.js').then((m) => m.scopeCss(style, scopeId, false));
+                    style = await import('./shadow-css-b45d2670.js').then((m) => m.scopeCss(style, scopeId, false));
                 }
                 registerStyle(scopeId, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
                 endRegisterStyles();