@yoobic/yobi 8.3.3 → 8.4.0-0

package/dist/cjs/{dom-39eaa8e4.js → dom-43e82252.js}

@@ -1,7 +1,7 @@
 'use strict';
 
 /*
- Stencil Client Patch Browser v2.17.2 | MIT Licensed | https://stenciljs.com
+ Stencil Client Patch Browser v2.17.3 | 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-ca7dfa13.js → draggable-dots-helpers-0bcedddd.js}

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

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

@@ -1,8 +1,8 @@
 'use strict';
 
-require('./index-ce31bddc.js');
+require('./index-32730381.js');
 const lodash = require('./lodash-72d493b9.js');
-const overlays = require('./overlays-24592dac.js');
+const overlays = require('./overlays-f7624b4d.js');
 
 function checkArray(array) {
   return !!((array === null || array === void 0 ? void 0 : array.length) && Array.isArray(array));
@@ -26,10 +26,10 @@ function getDeletedValues(oldValues, newValues) {
 }
 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'));
   if (bannerElement) {
     const bannerStyle = {
+      width: '100%',
       transition: ['height', 'opacity'].map(prop => `${prop} .5s ease-in-out`).join(', '),
       backgroundColor: `var(--${backgroundColor})`,
       height: 'auto',

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

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

package/dist/cjs/{filters-helpers-02442474.js → filters-helpers-1a158015.js}

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

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

@@ -1,12 +1,12 @@
 'use strict';
 
-require('./index-ce31bddc.js');
+require('./index-32730381.js');
 const lodash = require('./lodash-72d493b9.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 draggableTagsHelpers = require('./draggable-tags-helpers-c3b45c50.js');
+const formInputHelpers = require('./form-input-helpers-ec57d25a.js');
+const index = require('./index-001d2377.js');
+const commonHelpers = require('./common-helpers-b5dffbf0.js');
+const overlays = require('./overlays-f7624b4d.js');
 const highcharts = require('./highcharts-874d9bd2.js');
 
 const ReadonlyCard = ({ value, values, answer, valuesColor, classNames }) => {

package/dist/cjs/{form-helpers-24796572.js → form-helpers-1199447d.js}

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

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

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

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

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

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

@@ -1,14 +1,14 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-ce31bddc.js');
+require('./index-32730381.js');
 const lodash = require('./lodash-72d493b9.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 incentiveHelpers = require('./incentive-helpers-c1138c8f.js');
+const missionsHelpers = require('./missions-helpers-c4b61bde.js');
+const commonHelpers = require('./common-helpers-b5dffbf0.js');
+const formHelpers = require('./form-helpers-1199447d.js');
 const geolocationHelpers = require('./geolocation-helpers-cb286aab.js');
-const overlays = require('./overlays-24592dac.js');
+const overlays = require('./overlays-f7624b4d.js');
 
 const countryFlag = (country) => {
   return getFlagEmoji(getCountryCode(country));

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

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

package/dist/cjs/{index-819e2530.js → index-001d2377.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-039bd9c5.js'); }).then((m) => m.scopeCss(style, scopeId, false));
+                    style = await Promise.resolve().then(function () { return require('./shadow-css-156bae30.js'); }).then((m) => m.scopeCss(style, scopeId, false));
                 }
                 registerStyle(scopeId, style, !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */));
                 endRegisterStyles();

package/dist/cjs/index-0b986d6b.js

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

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

@@ -1,6 +1,6 @@
 'use strict';
 
-const overlays = require('./overlays-24592dac.js');
+const overlays = require('./overlays-f7624b4d.js');
 const lodash = require('./lodash-72d493b9.js');
 
 function shiftSlidesToNext(activeSlideIndex, slides, cachedSlides = 1) {

package/dist/cjs/index-360cbd7d.js

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

package/dist/cjs/{index-d66b8726.js → index-45ec9de9.js}

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

package/dist/cjs/{index-e9c33e18.js → index-5790c953.js}

@@ -1,10 +1,10 @@
 'use strict';
 
 const index = require('./index-50ff0b20.js');
-require('./index-ce31bddc.js');
+require('./index-32730381.js');
 const lodash = require('./lodash-72d493b9.js');
 const annotationsHelpers = require('./annotations-helpers-6cf88388.js');
-const overlays = require('./overlays-24592dac.js');
+const overlays = require('./overlays-f7624b4d.js');
 
 const starRatingMaxDefault = 5;
 function filterSequentialFields(fieldCondition) {

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

@@ -1,9 +1,9 @@
 'use strict';
 
-require('./index-ce31bddc.js');
+require('./index-32730381.js');
 const lodash = require('./lodash-72d493b9.js');
-const draggableTagsHelpers = require('./draggable-tags-helpers-7e00b3d9.js');
-const overlays = require('./overlays-24592dac.js');
+const draggableTagsHelpers = require('./draggable-tags-helpers-c3b45c50.js');
+const overlays = require('./overlays-f7624b4d.js');
 
 class Dropzone {
   constructor(config, element, index) {
@@ -49,7 +49,7 @@ class Dropzone {
         const zoneBR = this.element.getBoundingClientRect();
         const calculateTagZoneHeight = window.innerHeight - (zoneBR.top + footerHeight);
         if (calculateTagZoneHeight) {
-          this.element.parentElement.style.height = `${calculateTagZoneHeight * .75}px`;
+          this.element.style.height = `${calculateTagZoneHeight * .75}px`;
         }
       }
     }
@@ -162,6 +162,7 @@ class Tag {
     };
     return this.element && !hostElement['readonly'] && new overlays.Draggable(this.element, {
       bound: hostElement,
+      autoScroll: 1,
       onClick: async function () {
         if (this.pointerEvent.type === 'pointerup') {
           clickOnTag();
@@ -373,6 +374,19 @@ class Tags extends Dropzones {
       await this.animate();
     }
   }
+  static prepareAutoScroll(hostElement) {
+    if ((hostElement === null || hostElement === void 0 ? void 0 : hostElement.shadowRoot) && overlays.isWeb() && !(hostElement === null || hostElement === void 0 ? void 0 : hostElement['readonly'])) {
+      const wrapperElement = overlays.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'];
@@ -386,7 +400,7 @@ class Tags extends Dropzones {
     var _a, _b;
     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 { dragAndScroll, 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, {
@@ -402,6 +416,7 @@ 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)) {
@@ -418,4 +433,5 @@ function initTags(tagConfig, zonesConfig) {
   return new Tags(tagConfig, zonesConfig);
 }
 
+exports.Tags = Tags;
 exports.initTags = initTags;