@yoobic/yobi 8.2.2 → 8.3.0-2

package/dist/cjs/yoo-img.cjs.entry.js

@@ -2,13 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
+const index = require('./index-e182c32d.js');
 const _commonjsHelpers = require('./_commonjsHelpers-94df2ea7.js');
-const index$1 = require('./index-f3d7c03d.js');
-const localForage = require('./localForage-f618f824.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
+const index$1 = require('./index-1fdbd9b3.js');
+const localForage = require('./localForage-e52707b9.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 var svgInject = _commonjsHelpers.createCommonjsModule(function (module) {
 /**
@@ -820,7 +821,7 @@ const YooImgComponent = class {
       }, 500);
     }
     if (isFinite(this.containerWidth)) {
-      const imageRatio = index$1.getClosestImageRatio(imageWidth || ((_b = this.image) === null || _b === void 0 ? void 0 : _b.naturalWidth), imageHeight || ((_c = this.image) === null || _c === void 0 ? void 0 : _c.naturalHeight), this.scaledUpRatios);
+      const imageRatio = overlays.getClosestImageRatio(imageWidth || ((_b = this.image) === null || _b === void 0 ? void 0 : _b.naturalWidth), imageHeight || ((_c = this.image) === null || _c === void 0 ? void 0 : _c.naturalHeight), this.scaledUpRatios);
       if (this.scaledUpInWidth && imageRatio === 0.75) {
         this.host.style.height = `${this.containerWidth / 2 / imageRatio}px`;
         this.host.style.width = `${this.containerWidth / 2}px`;
@@ -855,8 +856,8 @@ const YooImgComponent = class {
     if (index.Build.isServer) {
       return;
     }
-    if (this.scaledUp && index$1.isWeb(this.host)) {
-      this.resizeListener = index$1.debounce(this.onScreenResize, 500).bind(this);
+    if (this.scaledUp && overlays.isWeb(this.host)) {
+      this.resizeListener = overlays.debounce(this.onScreenResize, 500).bind(this);
       window.addEventListener('resize', this.resizeListener);
       window.addEventListener('screenSizeWillChange', this.resizeListener);
     }
@@ -872,7 +873,7 @@ const YooImgComponent = class {
         ...this.svgOptions,
         afterLoad: (svg, path) => {
           var _a, _b;
-          svg = index$1.applyViewBox(svg);
+          svg = overlays.applyViewBox(svg);
           path = new XMLSerializer().serializeToString(svg);
           return ((_b = (_a = this.svgOptions) === null || _a === void 0 ? void 0 : _a.afterLoad) === null || _b === void 0 ? void 0 : _b.call(_a, svg, path)) || svg;
         }
@@ -902,8 +903,8 @@ const YooImgComponent = class {
   async updateURL() {
     var _a, _b, _c, _d;
     let finalUrl = this.src;
-    if (((_a = this.cloudinaryOptions) === null || _a === void 0 ? void 0 : _a.jpg) && index$1.isCloudinaryLink(finalUrl)) {
-      finalUrl = index$1.changeExtension(finalUrl, 'jpg');
+    if (((_a = this.cloudinaryOptions) === null || _a === void 0 ? void 0 : _a.jpg) && overlays.isCloudinaryLink(finalUrl)) {
+      finalUrl = overlays.changeExtension(finalUrl, 'jpg');
     }
     finalUrl = await localForage.getFromOfflineStorage(finalUrl);
     const couldinaryOptions = {
@@ -911,7 +912,7 @@ const YooImgComponent = class {
       ...(!this.ignoreWidth && { width: ((_b = this.cloudinaryOptions) === null || _b === void 0 ? void 0 : _b.width) || this.host.clientWidth * (((_c = this.cloudinaryOptions) === null || _c === void 0 ? void 0 : _c.widthFactor) || 1) }),
       ...((!this.ignoreHeight && !this.scaledUp) && { height: ((_d = this.cloudinaryOptions) === null || _d === void 0 ? void 0 : _d.height) || this.host.clientHeight })
     };
-    finalUrl = !index$1.isGif(finalUrl) && (this.allowCloudinary || this.hasCloudinaryOptions) ? commonHelpers.cloudinary(this.isDefaultType() ? finalUrl : index$1.getFormattedImageURL(finalUrl), couldinaryOptions) : finalUrl;
+    finalUrl = !overlays.isGif(finalUrl) && (this.allowCloudinary || this.hasCloudinaryOptions) ? commonHelpers.cloudinary(this.isDefaultType() ? finalUrl : overlays.getFormattedImageURL(finalUrl), couldinaryOptions) : finalUrl;
     if (this.url !== finalUrl && !this.disconnected) {
       const image = new Image();
       if (!this.disconnected) {
@@ -920,7 +921,7 @@ const YooImgComponent = class {
       this.loading = true;
       image.onload = this.onLoad.bind(this);
       image.onerror = this.onError.bind(this);
-      image.src = index$1.getMedia(finalUrl);
+      image.src = overlays.getMedia(finalUrl);
     }
     else {
       this.loading = false;
@@ -932,7 +933,7 @@ const YooImgComponent = class {
       this.url = undefined;
       this.loading = false;
     }
-    else if (!index$1.getSession().forceInstantImages && !this.instant && index$1.isIntersectionObserverSupported()) {
+    else if (!overlays.getSession().forceInstantImages && !this.instant && index$1.isIntersectionObserverSupported()) {
       this.addIntersectionObserver();
     }
     else {
@@ -982,10 +983,10 @@ const YooImgComponent = class {
     var _a, _b;
     const options = this.cloudinaryOptions || {};
     let finalUrl = this.src;
-    if (((_a = this.cloudinaryOptions) === null || _a === void 0 ? void 0 : _a.jpg) && index$1.isCloudinaryLink(finalUrl)) {
-      finalUrl = index$1.changeExtension(finalUrl, 'jpg');
+    if (((_a = this.cloudinaryOptions) === null || _a === void 0 ? void 0 : _a.jpg) && overlays.isCloudinaryLink(finalUrl)) {
+      finalUrl = overlays.changeExtension(finalUrl, 'jpg');
     }
-    const url = commonHelpers.cloudinary(this.isDefaultType() ? finalUrl : index$1.getFormattedImageURL(finalUrl), {
+    const url = commonHelpers.cloudinary(this.isDefaultType() ? finalUrl : overlays.getFormattedImageURL(finalUrl), {
       ...options,
       width: this.ignoreWidth ? null : this.host.clientWidth || ((_b = this.mediaDimension) === null || _b === void 0 ? void 0 : _b.width),
       height: this.scaledUp || this.ignoreHeight ? null : this.host.clientHeight
@@ -999,11 +1000,11 @@ const YooImgComponent = class {
       this.preserveAspectRatio((_a = this.host) === null || _a === void 0 ? void 0 : _a.clientWidth, this.mediaDimension.width, this.mediaDimension.height);
     }
     const hostClass = {
-      gif: index$1.isGif(this.src),
+      gif: overlays.isGif(this.src),
       'scale-up-width': this.scaledUpInWidth
     };
     const hostStyle = {
-      backgroundImage: !this.isDefaultType() && this.url ? `url("${index$1.getFormattedImageURL(this.url)}")` : null,
+      backgroundImage: !this.isDefaultType() && this.url ? `url("${overlays.getFormattedImageURL(this.url)}")` : null,
       height: this.host.style.height
     };
     if (index.Build.isServer && ((_b = this.mediaDimension) === null || _b === void 0 ? void 0 : _b.width)) {

package/dist/cjs/yoo-incentive-detail.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$2 = require('./index-fc264952.js');
-const index$1 = require('./index-f3d7c03d.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
-const incentiveHelpers = require('./incentive-helpers-7c50738b.js');
+const index = require('./index-e182c32d.js');
+const index$1 = require('./index-de8540eb.js');
+require('./index-1fdbd9b3.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+const incentiveHelpers = require('./incentive-helpers-a7243401.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
@@ -22,7 +23,7 @@ const YooIncentiveDetailComponent = class {
     this.init();
   }
   componentWillLoad() {
-    const session = index$1.getSession();
+    const session = overlays.getSession();
     this.groups = session.groups;
     this.userId = session.userId;
     this.init();
@@ -40,14 +41,14 @@ const YooIncentiveDetailComponent = class {
         var _a;
         return ({
           target: target,
-          milestone: index$1.getIncentiveTargetHighestMilestone(target),
+          milestone: overlays.getIncentiveTargetHighestMilestone(target),
           isOpened: (length === 1) || (target.id === ((_a = this.participant) === null || _a === void 0 ? void 0 : _a.target))
         });
       }).sort((item1, item2) => item2.milestone - item1.milestone)) || [];
     }
     else if (this.participant) {
       const target = (_c = this.incentive.targets) === null || _c === void 0 ? void 0 : _c.find((target) => target.id === this.participant.target);
-      this.targets = target ? [{ target, milestone: index$1.getIncentiveTargetHighestMilestone(target), isOpened: true }] : [];
+      this.targets = target ? [{ target, milestone: overlays.getIncentiveTargetHighestMilestone(target), isOpened: true }] : [];
     }
   }
   getDate() {
@@ -58,7 +59,7 @@ const YooIncentiveDetailComponent = class {
     var _a, _b;
     const isMilestoneReached = ((_a = this.score) === null || _a === void 0 ? void 0 : _a.progress) >= milestone.value;
     const reached = !this.showManagerView && (((_b = this.participant) === null || _b === void 0 ? void 0 : _b.target) === tagetId) && isMilestoneReached;
-    return (index.h("tr", { class: { reached } }, index.h("th", null, milestone.reward), index.h("td", null, !this.showManagerView && index.h("yoo-icon", { name: "check", color: "app-color", class: { 'unvisible': !isMilestoneReached }, size: "small" }), index$1.appendIncentiveUnit(milestone.value, this.incentive.unit, this.incentive.isUnitCurrency, false))));
+    return (index.h("tr", { class: { reached } }, index.h("th", null, milestone.reward), index.h("td", null, !this.showManagerView && index.h("yoo-icon", { name: "check", color: "app-color", class: { 'unvisible': !isMilestoneReached }, size: "small" }), overlays.appendIncentiveUnit(milestone.value, this.incentive.unit, this.incentive.isUnitCurrency, false))));
   }
   renderTargets() {
     return [
@@ -70,15 +71,15 @@ const YooIncentiveDetailComponent = class {
     let milestones;
     let dataEl;
     const toggleData = () => {
-      index$1.gsapTo(dataEl, 0.2, { height: collapsible.isOpened ? 0 : 'auto' });
+      overlays.gsapTo(dataEl, 0.2, { height: collapsible.isOpened ? 0 : 'auto' });
       collapsible.isOpened = !collapsible.isOpened;
       index.forceUpdate(this);
     };
     if ((_a = collapsible.target.milestones) === null || _a === void 0 ? void 0 : _a.length) {
       milestones = collapsible.target.milestones.sort((a, b) => b.value - a.value);
     }
-    const milestoneText = index$1.appendIncentiveUnit(collapsible.milestone, this.incentive.unit, this.incentive.isUnitCurrency, false);
-    return (index.h("div", { class: "target" }, index.h("div", { class: "target-title", onClick: toggleData }, index.h("div", { class: "name" }, collapsible.target.title), index.h("div", { class: "reach" }, this.showManagerView ? milestoneText : index$1.translate('REACHTARGET', { n: milestoneText }), index.h("yoo-icon", { name: collapsible.isOpened ? 'arrow-up' : 'arrow-down', color: "stable" }))), index.h("div", { class: "target-data", ref: el => dataEl = el }, index.h("table", null, milestones === null || milestones === void 0 ? void 0 : milestones.sort((m1, m2) => m2.value - m1.value).map(m => this.renderTargetMilestone(collapsible.target.id, m))))));
+    const milestoneText = overlays.appendIncentiveUnit(collapsible.milestone, this.incentive.unit, this.incentive.isUnitCurrency, false);
+    return (index.h("div", { class: "target" }, index.h("div", { class: "target-title", onClick: toggleData }, index.h("div", { class: "name" }, collapsible.target.title), index.h("div", { class: "reach" }, this.showManagerView ? milestoneText : overlays.translate('REACHTARGET', { n: milestoneText }), index.h("yoo-icon", { name: collapsible.isOpened ? 'arrow-up' : 'arrow-down', color: "stable" }))), index.h("div", { class: "target-data", ref: el => dataEl = el }, index.h("table", null, milestones === null || milestones === void 0 ? void 0 : milestones.sort((m1, m2) => m2.value - m1.value).map(m => this.renderTargetMilestone(collapsible.target.id, m))))));
   }
   renderMobileMilestones() {
     var _a;
@@ -86,22 +87,22 @@ const YooIncentiveDetailComponent = class {
       return;
     const progressText = incentiveHelpers.getProgressText(this.score);
     const targetLeft = this.score.milestone - this.score.progress;
-    const leftOverText = index$1.appendIncentiveUnit(targetLeft > 0 ? targetLeft : 0, this.incentive.unit, this.incentive.isUnitCurrency);
-    return (index.h("div", { class: "milestones" }, index.h("div", { class: "summary" }, index.h("div", { class: "progress" }, progressText), index.h("div", { class: "leftover" }, leftOverText + ' ' + index$1.translate('INCENTIVELEFT'))), index.h("yoo-progress-bar", { class: "progress-bar app-color", value: (this.score.result || 0) * 100 }), !!((_a = this.targets) === null || _a === void 0 ? void 0 : _a.length) && [
-      index.h("div", { class: "subtitle" }, index$1.translate('MILESTONES')),
+    const leftOverText = overlays.appendIncentiveUnit(targetLeft > 0 ? targetLeft : 0, this.incentive.unit, this.incentive.isUnitCurrency);
+    return (index.h("div", { class: "milestones" }, index.h("div", { class: "summary" }, index.h("div", { class: "progress" }, progressText), index.h("div", { class: "leftover" }, leftOverText + ' ' + overlays.translate('INCENTIVELEFT'))), index.h("yoo-progress-bar", { class: "progress-bar app-color", value: (this.score.result || 0) * 100 }), !!((_a = this.targets) === null || _a === void 0 ? void 0 : _a.length) && [
+      index.h("div", { class: "subtitle" }, overlays.translate('MILESTONES')),
       this.renderTargets()
     ]));
   }
   renderTypes() {
     var _a, _b, _c, _d, _e;
-    const size = index$1.isWeb(this.host) ? 'medium' : 'small';
+    const size = overlays.isWeb(this.host) ? 'medium' : 'small';
     let top = '';
-    if (((_a = this.incentive) === null || _a === void 0 ? void 0 : _a.type) === index$2.IncentiveType.competition) {
-      top = ' ' + index$1.translate('INCENTIVESTOPWINNERS', { n: this.incentive.winners });
+    if (((_a = this.incentive) === null || _a === void 0 ? void 0 : _a.type) === index$1.IncentiveType.competition) {
+      top = ' ' + overlays.translate('INCENTIVESTOPWINNERS', { n: this.incentive.winners });
     }
     return [
-      index.h("div", null, index.h("yoo-icon", { name: "group", color: "app-color", size: size }), index$1.translate((_c = (_b = this.incentive) === null || _b === void 0 ? void 0 : _b.partType) === null || _c === void 0 ? void 0 : _c.toUpperCase())),
-      index.h("div", null, index.h("yoo-icon", { name: "instant-play", color: "app-color", size: size }), index$1.translate((_e = (_d = this.incentive) === null || _d === void 0 ? void 0 : _d.type) === null || _e === void 0 ? void 0 : _e.toUpperCase()) + top)
+      index.h("div", null, index.h("yoo-icon", { name: "group", color: "app-color", size: size }), overlays.translate((_c = (_b = this.incentive) === null || _b === void 0 ? void 0 : _b.partType) === null || _c === void 0 ? void 0 : _c.toUpperCase())),
+      index.h("div", null, index.h("yoo-icon", { name: "instant-play", color: "app-color", size: size }), overlays.translate((_e = (_d = this.incentive) === null || _d === void 0 ? void 0 : _d.type) === null || _e === void 0 ? void 0 : _e.toUpperCase()) + top)
     ];
   }
   renderDate() {
@@ -109,11 +110,11 @@ const YooIncentiveDetailComponent = class {
   }
   renderOwner() {
     var _a, _b, _c;
-    return (index.h("div", null, index.h("span", { class: "owner-title" }, `${index$1.translate('OWNER')}:`), index.h("yoo-avatar", { size: "small", imgSrc: (_a = this.incentive.owner) === null || _a === void 0 ? void 0 : _a.imageData }), index.h("span", { class: "owner" }, `${(_b = this.incentive.owner) === null || _b === void 0 ? void 0 : _b.firstName} ${(_c = this.incentive.owner) === null || _c === void 0 ? void 0 : _c.lastName}`)));
+    return (index.h("div", null, index.h("span", { class: "owner-title" }, `${overlays.translate('OWNER')}:`), index.h("yoo-avatar", { size: "small", imgSrc: (_a = this.incentive.owner) === null || _a === void 0 ? void 0 : _a.imageData }), index.h("span", { class: "owner" }, `${(_b = this.incentive.owner) === null || _b === void 0 ? void 0 : _b.firstName} ${(_c = this.incentive.owner) === null || _c === void 0 ? void 0 : _c.lastName}`)));
   }
   renderSaleBreakdown(item) {
     var _a, _b, _c;
-    const value = index$1.appendIncentiveUnit(item.amount, this.incentive.unit, this.incentive.isUnitCurrency, false);
+    const value = overlays.appendIncentiveUnit(item.amount, this.incentive.unit, this.incentive.isUnitCurrency, false);
     return (index.h("div", { class: "item" }, index.h("yoo-img", { src: (_b = (_a = item.product) === null || _a === void 0 ? void 0 : _a.image) === null || _b === void 0 ? void 0 : _b._downloadURL }), index.h("div", { class: "product" }, (_c = item.product) === null || _c === void 0 ? void 0 : _c.title), index.h("div", { class: "values" }, index.h("span", null, value), index.h("span", null, "x", item.weight))));
   }
   renderSalesBreakdown() {
@@ -121,27 +122,27 @@ const YooIncentiveDetailComponent = class {
     if (!((_a = this.salesBreakdown) === null || _a === void 0 ? void 0 : _a.length)) {
       return;
     }
-    const total = index$1.appendIncentiveUnit(incentiveHelpers.getTotalSalesBreakdown(this.salesBreakdown), this.incentive.unit, this.incentive.isUnitCurrency, false);
-    return (index.h("div", { class: "box-content sale-breakdowns" }, this.salesBreakdown.map((item) => this.renderSaleBreakdown(item)), index.h("div", { class: "total" }, index.h("div", null, index$1.translate('TOTAL'), ":"), index.h("div", { class: "value" }, total))));
+    const total = overlays.appendIncentiveUnit(incentiveHelpers.getTotalSalesBreakdown(this.salesBreakdown), this.incentive.unit, this.incentive.isUnitCurrency, false);
+    return (index.h("div", { class: "box-content sale-breakdowns" }, this.salesBreakdown.map((item) => this.renderSaleBreakdown(item)), index.h("div", { class: "total" }, index.h("div", null, overlays.translate('TOTAL'), ":"), index.h("div", { class: "value" }, total))));
   }
   renderChart() {
     return (index.h("yoo-chart", { class: "kpichart", config: this.kpiChartConfig }));
   }
   renderDateRange() {
-    return (index.h("div", { class: "date-range" }, this.incentive.startDate && index$1.dateFormat(this.incentive.startDate, 'L LT'), "\u00A0 - \u00A0", this.incentive.endDate && index$1.dateFormat(this.incentive.endDate, 'L LT')));
+    return (index.h("div", { class: "date-range" }, this.incentive.startDate && overlays.dateFormat(this.incentive.startDate, 'L LT'), "\u00A0 - \u00A0", this.incentive.endDate && overlays.dateFormat(this.incentive.endDate, 'L LT')));
   }
   renderTags() {
     var _a;
     const statusBadgeSetting = incentiveHelpers.getIncentiveStatusBadgeSettings(this.incentive);
     return [
-      index.h("yoo-tag", { color: statusBadgeSetting.color }, index$1.translate(statusBadgeSetting.text)),
+      index.h("yoo-tag", { color: statusBadgeSetting.color }, overlays.translate(statusBadgeSetting.text)),
       (_a = this.incentive.tags) === null || _a === void 0 ? void 0 : _a.map(tag => index.h("yoo-tag", { class: "app-color" }, tag))
     ];
   }
   renderMobile() {
     var _a;
     const positionText = ((_a = this.score) === null || _a === void 0 ? void 0 : _a.position) && incentiveHelpers.getPositionText(this.score.position);
-    return (index.h("div", { class: "outer-container mobile" }, index.h("div", { class: "title" }, this.incentive.title), index.h("div", { class: "types" }, this.renderTypes()), this.incentive.description && index.h("div", { class: "description" }, this.incentive.description), index.h("div", { class: "dates" }, this.renderDate(), this.renderDateRange()), positionText && index.h("div", { class: "position" }, index.h("yoo-tag", { color: "energized-10", icon: "award-trophy-star", size: "medium" }), positionText), this.incentive.type === index$2.IncentiveType.milestones && this.renderMobileMilestones(), index.h("div", { class: "subtitle" }, index$1.translate('PERFORMANCEEVOLUTIONINCENTIVES')), this.renderChart(), index.h("div", { class: "subtitle" }, index$1.translate('INCENTIVELEADERBOARD')), index.h("slot", null)));
+    return (index.h("div", { class: "outer-container mobile" }, index.h("div", { class: "title" }, this.incentive.title), index.h("div", { class: "types" }, this.renderTypes()), this.incentive.description && index.h("div", { class: "description" }, this.incentive.description), index.h("div", { class: "dates" }, this.renderDate(), this.renderDateRange()), positionText && index.h("div", { class: "position" }, index.h("yoo-tag", { color: "energized-10", icon: "award-trophy-star", size: "medium" }), positionText), this.incentive.type === index$1.IncentiveType.milestones && this.renderMobileMilestones(), index.h("div", { class: "subtitle" }, overlays.translate('PERFORMANCEEVOLUTIONINCENTIVES')), this.renderChart(), index.h("div", { class: "subtitle" }, overlays.translate('INCENTIVELEADERBOARD')), index.h("slot", null)));
   }
   renderWebTopContainer() {
     var _a, _b;
@@ -149,21 +150,21 @@ const YooIncentiveDetailComponent = class {
   }
   renderWebMiddleContainer() {
     var _a;
-    const isMilestones = this.incentive.type === index$2.IncentiveType.milestones;
+    const isMilestones = this.incentive.type === index$1.IncentiveType.milestones;
     const positionText = ((_a = this.score) === null || _a === void 0 ? void 0 : _a.position) && incentiveHelpers.getPositionText(this.score.position);
-    const progressBaseValue = index$1.getIncentiveProgressBase(this.incentive, this.score, this.showManagerView);
-    const progressBaseText = index$1.appendIncentiveUnit(progressBaseValue, isMilestones ? null : this.incentive.unit, this.incentive.isUnitCurrency, false);
-    const progressOfValue = index$1.getIncentiveProgressOf(this.incentive, this.score, this.showManagerView);
-    const progressOfText = progressOfValue && index$1.appendIncentiveUnit(progressOfValue, this.incentive.unit, this.incentive.isUnitCurrency, false);
-    const progressPercent = index$1.getIncentiveProgress(this.incentive, this.score, this.showManagerView);
+    const progressBaseValue = overlays.getIncentiveProgressBase(this.incentive, this.score, this.showManagerView);
+    const progressBaseText = overlays.appendIncentiveUnit(progressBaseValue, isMilestones ? null : this.incentive.unit, this.incentive.isUnitCurrency, false);
+    const progressOfValue = overlays.getIncentiveProgressOf(this.incentive, this.score, this.showManagerView);
+    const progressOfText = progressOfValue && overlays.appendIncentiveUnit(progressOfValue, this.incentive.unit, this.incentive.isUnitCurrency, false);
+    const progressPercent = overlays.getIncentiveProgress(this.incentive, this.score, this.showManagerView);
     const leftOverValue = (progressOfValue - progressBaseValue);
-    const progressLeftOver = index$1.appendIncentiveUnit(leftOverValue > 0 ? leftOverValue : null, this.incentive.unit, this.incentive.isUnitCurrency);
-    return (index.h("div", { class: "middle-container" }, index.h("div", { class: "left-container" }, !this.showManagerView && isMilestones && positionText && index.h("div", { class: "position" }, index.h("yoo-tag", { color: "app-color-10", icon: "award-trophy-star", size: "extra-large" }), positionText), index.h("span", { class: "title-category" }, index$1.translate(this.showManagerView ? 'TOTALSALES' : 'SALES')), index.h("span", { class: "total-number" }, progressBaseText), isMilestones && progressOfText && index.h("span", { class: "total-description" }, index$1.translate('INCENTIVESOF'), " ", progressOfText), isMilestones && progressLeftOver && index.h("yoo-tag", { color: "app-color-10" }, progressLeftOver, " ", index$1.translate('LEFT')), isMilestones &&
-      index.h("div", { class: "progress-container" }, index.h("yoo-progress-bar", { value: (progressPercent || 0) * 100, shape: "line", percentValueColorScheme: true }))), index.h("div", { class: "right-container" }, index.h("span", { class: "title-category" }, index$1.translate('PERFORMANCEEVOLUTIONINCENTIVES')), this.renderChart())));
+    const progressLeftOver = overlays.appendIncentiveUnit(leftOverValue > 0 ? leftOverValue : null, this.incentive.unit, this.incentive.isUnitCurrency);
+    return (index.h("div", { class: "middle-container" }, index.h("div", { class: "left-container" }, !this.showManagerView && isMilestones && positionText && index.h("div", { class: "position" }, index.h("yoo-tag", { color: "app-color-10", icon: "award-trophy-star", size: "extra-large" }), positionText), index.h("span", { class: "title-category" }, overlays.translate(this.showManagerView ? 'TOTALSALES' : 'SALES')), index.h("span", { class: "total-number" }, progressBaseText), isMilestones && progressOfText && index.h("span", { class: "total-description" }, overlays.translate('INCENTIVESOF'), " ", progressOfText), isMilestones && progressLeftOver && index.h("yoo-tag", { color: "app-color-10" }, progressLeftOver, " ", overlays.translate('LEFT')), isMilestones &&
+      index.h("div", { class: "progress-container" }, index.h("yoo-progress-bar", { value: (progressPercent || 0) * 100, shape: "line", percentValueColorScheme: true }))), index.h("div", { class: "right-container" }, index.h("span", { class: "title-category" }, overlays.translate('PERFORMANCEEVOLUTIONINCENTIVES')), this.renderChart())));
   }
   renderWebBottomContainer() {
     var _a, _b;
-    return (index.h("div", { class: "bottom-container" }, !!((_a = this.salesBreakdown) === null || _a === void 0 ? void 0 : _a.length) && index.h("div", { class: "box" }, index.h("div", { class: "subtitle" }, index$1.translate('SALESBREAKDOWN')), this.renderSalesBreakdown()), !!this.targets.length && index.h("div", { class: "box milestones" }, index.h("div", { class: "subtitle" }, index$1.translate('MILESTONES')), this.renderTargets()), index.h("div", { class: "box" }, index.h("div", { class: "subtitle" }, index$1.translate('INCENTIVELEADERBOARD')), index.h("div", { class: "box-content leaderboard" }, index.h("slot", null))), !((_b = this.salesBreakdown) === null || _b === void 0 ? void 0 : _b.length) && index.h("div", { class: "box" })));
+    return (index.h("div", { class: "bottom-container" }, !!((_a = this.salesBreakdown) === null || _a === void 0 ? void 0 : _a.length) && index.h("div", { class: "box" }, index.h("div", { class: "subtitle" }, overlays.translate('SALESBREAKDOWN')), this.renderSalesBreakdown()), !!this.targets.length && index.h("div", { class: "box milestones" }, index.h("div", { class: "subtitle" }, overlays.translate('MILESTONES')), this.renderTargets()), index.h("div", { class: "box" }, index.h("div", { class: "subtitle" }, overlays.translate('INCENTIVELEADERBOARD')), index.h("div", { class: "box-content leaderboard" }, index.h("slot", null))), !((_b = this.salesBreakdown) === null || _b === void 0 ? void 0 : _b.length) && index.h("div", { class: "box" })));
   }
   renderWeb() {
     return (index.h("div", { class: "outer-container web" }, this.renderWebTopContainer(), this.renderWebMiddleContainer(), this.renderWebBottomContainer()));
@@ -172,7 +173,7 @@ const YooIncentiveDetailComponent = class {
     if (!this.incentive) {
       return;
     }
-    return (index.h(index.Host, { class: commonHelpers.getAppContext(this.host) }, index$1.isWeb(this.host) ? this.renderWeb() : this.renderMobile()));
+    return (index.h(index.Host, { class: commonHelpers.getAppContext(this.host) }, overlays.isWeb(this.host) ? this.renderWeb() : this.renderMobile()));
   }
   get host() { return index.getElement(this); }
   static get watchers() { return {

package/dist/cjs/yoo-info-text.cjs.entry.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
+const index = require('./index-e182c32d.js');
 
 const infoTextCss = ":host{--info-text-color:var(--text-color, #807f83)}:host .outer-container{display:-ms-flexbox;display:flex;padding:0.5rem 1rem;color:var(--info-text-color);font-size:var(--font-size-16, 1rem)}:host yoo-icon{margin:auto 0.5rem}:host(.no-padding-bottom) .outer-container{padding-bottom:0}:host(.no-padding-horizontal) .outer-container{padding-right:0;padding-left:0}:host(.margin-bottom) .outer-container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-40, rgba(173, 173, 173, 0.4))}:host(.no-padding) .outer-container{padding:0}";