@yoobic/yobi 8.2.2 → 8.3.0-2

package/dist/cjs/yoo-card-file.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardFileCss = ":host{display:inline-grid;grid-gap:var(--spacing-08, 0.5rem);grid-template-columns:2.5rem calc(100% - 3rem);-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;padding:var(--spacing-16, 1rem) var(--spacing-08, 0.5rem);background:var(--stable-light, #f1f1f1);border-radius:var(--border-radius-08, 0.5rem);cursor:pointer}:host yoo-icon[name=close]{position:absolute;top:0;right:0;bottom:auto;left:auto}:host .thumbnail{border-radius:var(--border-radius-04, 0.25rem)}:host .thumbnail:first-child{margin:0 auto}:host .thumbnail yoo-img{border-radius:var(--border-radius-04, 0.25rem)}:host .details{display:inline-grid;padding-right:var(--spacing-08, 0.5rem);line-height:1.75;text-align:right}:host .details #file-name{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .details #file-size{color:var(--stable, #adadad);font-size:var(--font-size-12, 0.75rem)}:host([type=audio]){display:block;padding:var(--spacing-16, 1rem)}:host([type=audio]) yoo-audio-player{--range-trail-color:var(--stable-20, rgba(173, 173, 173, 0.2))}";
 
@@ -25,16 +26,16 @@ const YooCardFileComponent = class {
   get fileSize() {
     var _a, _b, _c, _d;
     const file = typeof ((_b = (_a = this.localFile) === null || _a === void 0 ? void 0 : _a['name']) === null || _b === void 0 ? void 0 : _b[0]) !== 'string' ? (_d = (_c = this.localFile) === null || _c === void 0 ? void 0 : _c['name']) === null || _d === void 0 ? void 0 : _d[0] : this.localFile;
-    return index$1.pipes.fileSize.transform(file === null || file === void 0 ? void 0 : file.size);
+    return overlays.pipes.fileSize.transform(file === null || file === void 0 ? void 0 : file.size);
   }
   get isImage() {
-    return this.type === 'photo' || index$1.isImage(this.fileSrc);
+    return this.type === 'photo' || overlays.isImage(this.fileSrc);
   }
   get isVideo() {
-    return this.type === 'video' || index$1.isVideo(this.fileSrc);
+    return this.type === 'video' || overlays.isVideo(this.fileSrc);
   }
   get isAudio() {
-    return this.type === 'audio' || index$1.isAudio(this.localFile);
+    return this.type === 'audio' || overlays.isAudio(this.localFile);
   }
   get hasIcon() {
     return !!this.iconName && this.iconName !== 'image';
@@ -48,11 +49,11 @@ const YooCardFileComponent = class {
     await this.localFile && this.prepareFile();
   }
   async prepareFile() {
-    this.iconName = index$1.getIconName(this.localFile);
-    this.iconColor = index$1.getIconColor(this.localFile);
+    this.iconName = overlays.getIconName(this.localFile);
+    this.iconColor = overlays.getIconColor(this.localFile);
     this.fileSrc = this.localFile['_downloadURL'] || this.localFile;
     if (typeof this.localFile === 'string') {
-      const mimeType = index$1.getMimeType(this.localFile);
+      const mimeType = overlays.getMimeType(this.localFile);
       try {
         const response = await fetch(this.localFile);
         const blobData = await response.blob();
@@ -76,7 +77,7 @@ const YooCardFileComponent = class {
   renderThumbnail() {
     let thumbnail = null;
     if (this.isVideo) {
-      thumbnail = index$1.toPng(this.fileSrc);
+      thumbnail = overlays.toPng(this.fileSrc);
     }
     if (this.isImage) {
       thumbnail = this.fileSrc;
@@ -96,7 +97,7 @@ const YooCardFileComponent = class {
     return this.isAudio ? this.renderAudioCard() : this.renderDocumentCard();
   }
   render() {
-    return (index.h(index.Host, { ...{ type: this.type || index$1.getType(this.localFile) } }, this.renderContent()));
+    return (index.h(index.Host, { ...{ type: this.type || overlays.getType(this.localFile) } }, this.renderContent()));
   }
   get host() { return index.getElement(this); }
   static get watchers() { return {

package/dist/cjs/yoo-card-image.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardImageCss = ":host{--description-align-items:center;--description-justify-content:center;--description-text-align:center;--image-overlay:var(--dark-40, rgba(0, 0, 0, 0.4));--inner-spacing:var(--spacing-16, 1rem);--subtitle-font-size:var(--font-size-12, 0.75rem);--subtitle-font-weight:normal;--subtitle-line-clamp:1;--subtitle-line-height:1.5;--title-font-size:var(--font-size-16, 1rem);--title-font-weight:bold;--title-line-clamp:1;--title-line-height:1.5;position:relative;display:block;height:100%;color:var(--light, #ffffff);background:var(--stable, #adadad);border-radius:var(--border-radius-08, 0.5rem);cursor:pointer}:host yoo-img,:host .outer-container{border-radius:inherit}:host yoo-img,:host yoo-img::after,:host .description{position:absolute;top:0;right:0;bottom:0;left:0}:host p,:host h1{margin:0}:host p{overflow:hidden;font-weight:var(--subtitle-font-weight);font-size:var(--subtitle-font-size);line-height:var(--subtitle-line-height)}@supports (display: -webkit-box){:host p{display:-webkit-box;-webkit-line-clamp:var(--subtitle-line-clamp);-webkit-box-orient:vertical}}:host h1{overflow:hidden;font-weight:var(--title-font-weight);font-size:var(--title-font-size);line-height:var(--title-line-height)}@supports (display: -webkit-box){:host h1{display:-webkit-box;-webkit-line-clamp:var(--title-line-clamp);-webkit-box-orient:vertical}}:host yoo-badge{position:absolute;top:var(--inner-spacing);right:var(--inner-spacing)}:host yoo-icon{position:absolute;top:var(--inner-spacing);left:var(--inner-spacing)}:host yoo-avatar{position:absolute;top:var(--inner-spacing);left:var(--inner-spacing)}:host yoo-img{background-image:-webkit-gradient(linear, left top, left bottom, color-stop(50%, var(--dark-10)), color-stop(99%, rgba(0, 0, 0, 0.7)));background-image:linear-gradient(to bottom, var(--dark-10) 50%, rgba(0, 0, 0, 0.7) 99%)}:host yoo-img::after{background:var(--image-overlay);content:\"\"}:host .description{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:var(--description-align-items);align-items:var(--description-align-items);-ms-flex-pack:var(--description-justify-content);justify-content:var(--description-justify-content);margin:var(--inner-spacing);text-align:var(--description-text-align)}:host([heading-position]){background-color:var(--light, #ffffff);-webkit-box-shadow:var(--card-shadow, 0 0.125rem 0.25rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow, 0 0.125rem 0.25rem 0 rgba(40, 47, 54, 0.08))}:host([heading-position]) yoo-img{height:60%}:host([heading-position]) yoo-icon{left:50%;padding:var(--inner-spacing);background-color:var(--app-color, #5a30f4);border:var(--border-width-04, 0.25rem) solid var(--light, #ffffff);border-radius:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host([heading-position]) .description{padding-top:var(--inner-spacing);text-align:center}:host([heading-position]) .description h1{display:block;margin:auto;color:var(--dark, #000000);font-weight:var(--title-font-weigh);font-size:var(--title-font-size);line-height:inherit}:host([heading-position=below]) yoo-img{border-radius:var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem) 0 0}:host([heading-position=below]) yoo-icon{top:60%}:host([heading-position=below]) .description{top:60%}:host([heading-position=above]) yoo-img{top:40%;border-radius:0 0 var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem)}:host([heading-position=above]) yoo-icon{top:40%}:host([heading-position=above]) .description{height:40%}";
 
@@ -23,7 +24,7 @@ const YooCardImageComponent = class {
     const hasHeading = !!this.heading;
     const hasSubheading = !!this.subheading && !this.headingPosition;
     const hasDescription = hasHeading || hasSubheading;
-    return (index.h(index.Host, null, !!src && index.h("yoo-img", { instant: instant, src: src }), hasDescription && (index.h("div", { class: "description" }, hasHeading && index.h("h1", null, index$1.translateMulti(this.heading)), hasSubheading && index.h("p", null, index$1.translateMulti(this.subheading)))), !!this.icon && index.h("yoo-icon", { size: this.iconSize, color: "light", name: this.icon }), this.count > 0 && index.h("yoo-badge", { size: "small", text: `${this.count}` }), !!this.avatar && this.avatar));
+    return (index.h(index.Host, null, !!src && index.h("yoo-img", { instant: instant, src: src }), hasDescription && (index.h("div", { class: "description" }, hasHeading && index.h("h1", null, overlays.translateMulti(this.heading)), hasSubheading && index.h("p", null, overlays.translateMulti(this.subheading)))), !!this.icon && index.h("yoo-icon", { size: this.iconSize, color: "light", name: this.icon }), this.count > 0 && index.h("yoo-badge", { size: "small", text: `${this.count}` }), !!this.avatar && this.avatar));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-card-inbox.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
 const lodash = require('./lodash-597bda6d.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardInboxCss = ":host .outer-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .outer-container .header{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start}:host .outer-container .header .unread-state{opacity:1}:host .outer-container .header .unread-state.read{opacity:0}:host .outer-container .header yoo-truncate{margin-right:var(--spacing-16, 1rem);padding-top:var(--spacing-04, 0.25rem)}:host .outer-container .header yoo-truncate.with-margin-bottom{margin-bottom:var(--spacing-08, 0.5rem)}:host .outer-container .header yoo-truncate span{word-break:break-word}:host .outer-container .header .sup{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:end;align-items:flex-end;margin-left:auto;padding-top:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem)}:host .outer-container .header .sup div{display:-ms-flexbox;display:flex;grid-gap:var(--spacing-04, 0.25rem);-ms-flex-align:center;align-items:center}:host .outer-container .header yoo-icon[name=circle1]{height:var(--spacing-32, 2rem);margin-right:var(--spacing-04, 0.25rem)}:host .outer-container .content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:calc(var(--icon-size-00, 0.8rem) + var(--spacing-04, 0.25rem) + var(--spacing-32, 2rem) + var(--spacing-08, 0.5rem))}:host .outer-container .content yoo-progress-bar{--font-size-16:var(--font-size-12, 0.75rem);--progress-bar-color:var(--app-color, #5a30f4);--svg-width:1rem;--stroke-width-circle:2;margin:0}:host .outer-container .content .tags{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}:host .outer-container .content .tags yoo-tag{margin-right:var(--spacing-08, 0.5rem);margin-bottom:var(--spacing-08, 0.5rem)}:host .outer-container .content .sub-item-detail{display:grid;grid-gap:var(--spacing-08, 0.5rem);grid-template-columns:1.5rem 1fr;-ms-flex-align:center;align-items:center;width:100%;margin-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content .note{color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem)}:host .outer-container .highlight{position:absolute;top:calc(var(--spacing-32, 2rem) + var(--spacing-08, 0.5rem));bottom:var(--spacing-08, 0.5rem);left:calc(var(--icon-size-00, 0.8rem) + var(--spacing-04, 0.25rem) + var(--spacing-16, 1rem));width:1px}:host .outer-container yoo-avatar,:host .outer-container yoo-avatars{margin-right:var(--spacing-08, 0.5rem)}";
 
@@ -33,7 +34,7 @@ const YooCardInboxComponent = class {
   renderTitle() {
     var _a;
     const renderTags = !!((_a = this.entry.tags) === null || _a === void 0 ? void 0 : _a.length);
-    const renderProgress = index$1.isPresent(this.entry.progress);
+    const renderProgress = overlays.isPresent(this.entry.progress);
     return (index.h("yoo-truncate", { class: { 'with-margin-bottom': renderTags || !renderProgress }, style: { cssText: '--max-lines: 2' } }, index.h("span", { innerHTML: this.entry.title })));
   }
   renderFlags() {
@@ -41,18 +42,18 @@ const YooCardInboxComponent = class {
     return (index.h("div", { class: "icons" }, (_a = this.entry.icons) === null || _a === void 0 ? void 0 : _a.map((flag) => (index.h("yoo-icon", { name: flag.icon, size: flag.size || 'small', color: flag.color || 'app-color' })))));
   }
   renderDatePrecision() {
-    const _isToday = index$1.isToday(this.entry.date);
+    const _isToday = overlays.isToday(this.entry.date);
     if (!_isToday) {
-      const time = index$1.pipes.dateFormat.transform(this.entry.date, 'LT');
-      return index.h("div", null, index$1.translate('SCHEDULEDATTIME', { time }));
+      const time = overlays.pipes.dateFormat.transform(this.entry.date, 'LT');
+      return index.h("div", null, overlays.translate('SCHEDULEDATTIME', { time }));
     }
     return null;
   }
   renderProgress() {
-    const renderProgress = index$1.isPresent(this.entry.progress);
+    const renderProgress = overlays.isPresent(this.entry.progress);
     if (renderProgress) {
       const { value, unit, max } = this.entry.progress;
-      return renderProgress && index.h("div", { class: "sub-item-detail" }, index.h("yoo-progress-bar", { shape: "circle", hideProgressValue: true, value: value, metric: unit, maxValue: max }), index.h("yoo-truncate", { style: { cssText: '--max-lines: 1' } }, index.h("span", null, index$1.translate('ACTIONSCOMPLETED', { smart_count: value, total: max }))));
+      return renderProgress && index.h("div", { class: "sub-item-detail" }, index.h("yoo-progress-bar", { shape: "circle", hideProgressValue: true, value: value, metric: unit, maxValue: max }), index.h("yoo-truncate", { style: { cssText: '--max-lines: 1' } }, index.h("span", null, overlays.translate('ACTIONSCOMPLETED', { smart_count: value, total: max }))));
     }
     return null;
   }
@@ -74,7 +75,7 @@ const YooCardInboxComponent = class {
     var _a, _b, _c, _d, _e, _f, _g;
     if (((_b = (_a = this.entry.uiFields) === null || _a === void 0 ? void 0 : _a.fields) === null || _b === void 0 ? void 0 : _b.length) > 0 &&
       !lodash.isEmpty((_c = this.entry.uiFields) === null || _c === void 0 ? void 0 : _c.data) &&
-      this.entry.uiFields.fields.some((f) => index$1.isFieldWithNoValue(f) || !index$1.isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
+      this.entry.uiFields.fields.some((f) => overlays.isFieldWithNoValue(f) || !overlays.isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
       !((_e = (_d = this.host) === null || _d === void 0 ? void 0 : _d.classList) === null || _e === void 0 ? void 0 : _e.contains('map')) &&
       !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('grid-cell'))) {
       return (index.h("div", { class: "uifield-container" }, index.h("yoo-form-dynamic", { class: "inline in-card secondary", scrollable: false, forceReadonly: true, slides: [{ title: '', items: this.entry.uiFields.fields }], data: this.entry.uiFields.data, suffix: this.entry.uiFieldsSuffix, showTabs: false, formInputSize: "medium", showRecap: false, onDataChanged: (ev) => ev.stopPropagation() })));
@@ -83,8 +84,8 @@ const YooCardInboxComponent = class {
   render() {
     var _a, _b, _c, _d, _e;
     const renderSup = !!((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.icons) === null || _b === void 0 ? void 0 : _b.length) || !!((_c = this.entry) === null || _c === void 0 ? void 0 : _c.date);
-    const iconColor = ((_d = this.entry) === null || _d === void 0 ? void 0 : _d.iconColor) ? index$1.getCssColor(this.entry.iconColor) : null;
-    return (!!this.entry && (index.h("div", { class: "outer-container" }, index.h("div", { class: "header" }, index.h("yoo-icon", { class: { 'unread-state': true, 'read': !this.entry.unread }, name: "circle1", size: "extra-small", color: "app-color" }), this.renderAvatar(), this.renderTitle(), renderSup && (index.h("div", { class: "sup" }, index.h("div", null, !!((_e = this.entry.icons) === null || _e === void 0 ? void 0 : _e.length) && this.renderFlags(), !!this.entry.date && index$1.fromToday(this.entry.date)), !this.entry.hideDatePrecision && !!this.entry.date && this.renderDatePrecision()))), index.h("div", { class: "content" }, this.renderTags(), this.renderProgress(), this.renderIdentities(), this.renderNote(), this.renderUIFields()), this.highlight && index.h("div", { class: "highlight", style: { 'background-color': iconColor || index$1.getCssColor('stable') } }))));
+    const iconColor = ((_d = this.entry) === null || _d === void 0 ? void 0 : _d.iconColor) ? overlays.getCssColor(this.entry.iconColor) : null;
+    return (!!this.entry && (index.h("div", { class: "outer-container" }, index.h("div", { class: "header" }, index.h("yoo-icon", { class: { 'unread-state': true, 'read': !this.entry.unread }, name: "circle1", size: "extra-small", color: "app-color" }), this.renderAvatar(), this.renderTitle(), renderSup && (index.h("div", { class: "sup" }, index.h("div", null, !!((_e = this.entry.icons) === null || _e === void 0 ? void 0 : _e.length) && this.renderFlags(), !!this.entry.date && overlays.fromToday(this.entry.date)), !this.entry.hideDatePrecision && !!this.entry.date && this.renderDatePrecision()))), index.h("div", { class: "content" }, this.renderTags(), this.renderProgress(), this.renderIdentities(), this.renderNote(), this.renderUIFields()), this.highlight && index.h("div", { class: "highlight", style: { 'background-color': iconColor || overlays.getCssColor('stable') } }))));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-card-incentive-rank.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardIncentiveRankCss = ":host .row{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;height:var(--spacing-48, 3rem);margin-left:var(--spacing-24, 1.5rem);border-bottom:1px solid var(--stable-40, rgba(173, 173, 173, 0.4))}:host .row.web{padding-right:var(--spacing-16, 1rem)}:host .row .pointer{position:absolute;left:-3.5rem;width:3px;height:var(--spacing-48, 3rem);background-color:var(--app-color, #5a30f4);visibility:hidden}:host .row.active{color:var(--app-color, #5a30f4)}:host .row.active .pointer{visibility:visible}:host .row.active .name,:host .row.active .result{color:var(--app-color, #5a30f4)}:host .row .place{width:var(--spacing-24, 1.5rem);margin-left:-2rem;text-align:center}:host .row .avatar{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:50px}:host .row .avatar.winner{width:70px}:host .row .avatar yoo-avatar{margin-left:var(--spacing-04, 0.25rem)}:host .row .name{max-width:70%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .row .name,:host .row .result{color:var(--dark, #000000)}:host .row .result{-ms-flex:1;flex:1;white-space:nowrap;text-align:right}:host .row .progress{-ms-flex:1;flex:1;text-align:right}";
 
@@ -16,16 +17,16 @@ const YooCardIncentiveComponentRank = class {
     this.groups = [];
   }
   componentWillLoad() {
-    const session = index$1.getSession();
+    const session = overlays.getSession();
     this.userId = session.userId;
     this.groups = session.groups;
   }
   renderGroup(group) {
     var _a, _b, _c;
-    return (index.h("div", { class: { row: true, web: index$1.isWeb(this.host), active: group && ((_a = this.groups) === null || _a === void 0 ? void 0 : _a.includes(group._id)) } }, index.h("div", { class: "place" }, this.entry.position), index.h("div", { class: this.entry.isWinner ? 'avatar winner' : 'avatar' }, this.entry.isWinner && index.h("yoo-icon", { size: "small", name: "star", color: "energized" }), ((_b = group === null || group === void 0 ? void 0 : group.icon) === null || _b === void 0 ? void 0 : _b._downloadURL) && index.h("yoo-avatar", { instant: this.entry.isGridCell, imgSrc: group.icon._downloadURL, size: "medium" }), !((_c = group === null || group === void 0 ? void 0 : group.icon) === null || _c === void 0 ? void 0 : _c._downloadURL) && index.h("yoo-avatar", { size: "medium" })), index.h("div", { class: "name" }, group === null || group === void 0 ? void 0 : group.title), index.h("div", { class: "result" }, this.entry.textResult)));
+    return (index.h("div", { class: { row: true, web: overlays.isWeb(this.host), active: group && ((_a = this.groups) === null || _a === void 0 ? void 0 : _a.includes(group._id)) } }, index.h("div", { class: "place" }, this.entry.position), index.h("div", { class: this.entry.isWinner ? 'avatar winner' : 'avatar' }, this.entry.isWinner && index.h("yoo-icon", { size: "small", name: "star", color: "energized" }), ((_b = group === null || group === void 0 ? void 0 : group.icon) === null || _b === void 0 ? void 0 : _b._downloadURL) && index.h("yoo-avatar", { instant: this.entry.isGridCell, imgSrc: group.icon._downloadURL, size: "medium" }), !((_c = group === null || group === void 0 ? void 0 : group.icon) === null || _c === void 0 ? void 0 : _c._downloadURL) && index.h("yoo-avatar", { size: "medium" })), index.h("div", { class: "name" }, group === null || group === void 0 ? void 0 : group.title), index.h("div", { class: "result" }, this.entry.textResult)));
   }
   renderUser(user) {
-    return (index.h("div", { class: { row: true, web: index$1.isWeb(this.host), active: user && this.userId === user._id } }, !index$1.isWeb(this.host) && index.h("div", { class: "pointer" }), index.h("div", { class: "place" }, this.entry.position), index.h("div", { class: this.entry.isWinner ? 'avatar winner' : 'avatar' }, this.entry.isWinner && index.h("yoo-icon", { size: "small", name: "star", color: "energized" }), user && index.h("yoo-avatar", { instant: this.entry.isGridCell, user: user, size: "medium" }), !user && index.h("yoo-avatar", { size: "medium" })), index.h("div", { class: "name" }, index$1.getUserDisplayName(user)), index.h("div", { class: "result" }, this.entry.textResult)));
+    return (index.h("div", { class: { row: true, web: overlays.isWeb(this.host), active: user && this.userId === user._id } }, !overlays.isWeb(this.host) && index.h("div", { class: "pointer" }), index.h("div", { class: "place" }, this.entry.position), index.h("div", { class: this.entry.isWinner ? 'avatar winner' : 'avatar' }, this.entry.isWinner && index.h("yoo-icon", { size: "small", name: "star", color: "energized" }), user && index.h("yoo-avatar", { instant: this.entry.isGridCell, user: user, size: "medium" }), !user && index.h("yoo-avatar", { size: "medium" })), index.h("div", { class: "name" }, overlays.getUserDisplayName(user)), index.h("div", { class: "result" }, this.entry.textResult)));
   }
   render() {
     const group = this.entry.participant;

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

@@ -2,13 +2,14 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
 const lodash = require('./lodash-597bda6d.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
-const incentiveHelpers = require('./incentive-helpers-7c50738b.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+const incentiveHelpers = require('./incentive-helpers-a7243401.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardIncentiveCss = ":host .outer-container{margin-top:var(--spacing-16, 1rem);background-color:var(--light, #ffffff);border-radius:var(--spacing-08, 0.5rem);-webkit-box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-03, 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1))}:host .outer-container .image{height:270px;border-top-left-radius:var(--spacing-08, 0.5rem);border-top-right-radius:var(--spacing-08, 0.5rem)}:host .outer-container .inner-container{padding:var(--spacing-16, 1rem)}:host .outer-container .inner-container .title{padding-bottom:var(--spacing-08, 0.5rem);color:var(--dark, #000000);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-24, 1.5rem);line-height:var(--font-size-28, 1.75rem)}:host .outer-container .inner-container .description{display:-webkit-box;margin:var(--spacing-04, 0.25rem) 0 var(--spacing-08, 0.5rem) 0;overflow:hidden;font-size:var(--font-size-16, 1rem);line-height:var(--font-size-18, 1.125rem);-webkit-line-clamp:2;-webkit-box-orient:vertical}:host .outer-container .inner-container .types{display:-ms-flexbox;display:flex;font-size:var(--font-size-16, 1rem)}:host .outer-container .inner-container .types>div,:host .outer-container .inner-container .date{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host .outer-container .inner-container .types>div yoo-icon,:host .outer-container .inner-container .date yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .inner-container .date{color:var(--app-color, #5a30f4);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .footer{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;padding:var(--spacing-16, 1rem);font-size:var(--font-size-14, 0.875rem);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .outer-container .footer .position{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--dark, #000000);font-weight:var(--font-weight-700, 700)}:host .outer-container .footer .position yoo-tag{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .footer .progress{-ms-flex:1;flex:1;color:var(--dark, #000000);text-align:right}:host(.no-footer) .footer{display:none}";
 
@@ -21,7 +22,7 @@ const YooCardIncentiveComponent = class {
     this.updateUserScore();
   }
   componentWillLoad() {
-    const session = index$1.getSession();
+    const session = overlays.getSession();
     this.groups = session.groups;
     this.userId = session.userId;
     this.updateUserScore();
@@ -38,7 +39,7 @@ const YooCardIncentiveComponent = class {
   }
   renderTypes() {
     var _a, _b, _c, _d;
-    return (index.h("div", { class: "types" }, index.h("div", null, index.h("yoo-icon", { name: "group", color: "app-color", size: "small" }), index$1.translate((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.partType) === null || _b === void 0 ? void 0 : _b.toUpperCase())), index.h("div", null, index.h("yoo-icon", { name: "instant-play", color: "app-color", size: "small" }), index$1.translate((_d = (_c = this.entry) === null || _c === void 0 ? void 0 : _c.type) === null || _d === void 0 ? void 0 : _d.toUpperCase()))));
+    return (index.h("div", { class: "types" }, index.h("div", null, index.h("yoo-icon", { name: "group", color: "app-color", size: "small" }), overlays.translate((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.partType) === null || _b === void 0 ? void 0 : _b.toUpperCase())), index.h("div", null, index.h("yoo-icon", { name: "instant-play", color: "app-color", size: "small" }), overlays.translate((_d = (_c = this.entry) === null || _c === void 0 ? void 0 : _c.type) === null || _d === void 0 ? void 0 : _d.toUpperCase()))));
   }
   renderDate() {
     return (index.h("div", { class: "date" }, index.h("yoo-icon", { name: "recent", color: "app-color", size: "small" }), this.getDate()));

package/dist/cjs/yoo-card-kanban.cjs.entry.js

@@ -2,12 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
-require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
+require('./index-de8540eb.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-1fdbd9b3.js');
 
 const cardKanbanCss = ":host .outer-container:hover{background-color:var(--dark-10, rgba(0, 0, 0, 0.1));cursor:pointer}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-width:15.5rem;padding:var(--spacing-08, 0.5rem);line-height:1.9;background-color:var(--light, #ffffff);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-02, 0 0.25rem 0.5rem 0 rgba(0, 0, 0, 0.1))}:host .outer-container yoo-icon{padding-right:var(--spacing-04, 0.25rem)}:host .outer-container yoo-truncate{-ms-flex:1;flex:1;color:var(--dark, #000000);line-height:1.65;--max-lines:2}:host .outer-container .row{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .outer-container .row.infos{color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .row.ref{color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem)}:host .outer-container .row.left{-ms-flex:1;flex:1}:host .outer-container .row.left .sub-info{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-right:var(--spacing-08, 0.5rem)}:host .outer-container .row.right{padding-left:var(--spacing-16, 1rem)}";
 

package/dist/cjs/yoo-card-lesson.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-fc264952.js');
-const index$2 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+const index$1 = require('./index-de8540eb.js');
+require('./index-1fdbd9b3.js');
 const lodash = require('./lodash-597bda6d.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const cardLessonCss = ":host{position:relative;display:-ms-flexbox;display:flex;min-height:4.25rem;border-left:transparent solid var(--border-width-04, 0.25rem);cursor:pointer}:host yoo-truncate{--line-height:1.875rem !important;--max-lines:2}:host .info-container{width:100%;padding:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) var(--spacing-04, 0.25rem) 0;word-break:break-word}:host .info-container .title-container{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .info-container .title-container .title{display:-ms-flexbox;display:flex;-ms-flex-pack:start;justify-content:flex-start}:host .info-container .title-container .title yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .info-container .bottom-info-container{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;padding-left:var(--spacing-32, 2rem)}:host .info-container .bottom-info-container .remaining-points-container{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center}:host .info-container .bottom-info-container .remaining-points-container yoo-tag{margin-right:var(--spacing-08, 0.5rem)}:host .info-container .bottom-info-container .extra-icon-container{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;padding-bottom:var(--spacing-04, 0.25rem)}:host(.underline) .info-container{border-bottom:0.0625rem solid var(--stable-light, #f1f1f1)}:host(.item-disabled){cursor:default}:host([highlighted]){background-color:var(--app-color-10, rgba(90, 48, 244, 0.1));border-left:var(--app-color, #5a30f4) solid var(--border-width-04, 0.25rem)}:host([state=finished]),:host([state=locked]){color:var(--stable, #adadad)}:host([state=locked]){cursor:default}";
@@ -32,8 +33,8 @@ const YooCardLessonComponent = class {
   }
   get displayRetry() {
     var _a, _b, _c, _d, _e, _f, _g;
-    return index$2.canBeRetried(this.lesson, this.earnedPoints) &&
-      !index$2.isContentOnly((_a = this.lesson) === null || _a === void 0 ? void 0 : _a.lessonType) &&
+    return overlays.canBeRetried(this.lesson, this.earnedPoints) &&
+      !overlays.isContentOnly((_a = this.lesson) === null || _a === void 0 ? void 0 : _a.lessonType) &&
       (((_b = this.lesson) === null || _b === void 0 ? void 0 : _b.points) < ((_d = (_c = this.lesson) === null || _c === void 0 ? void 0 : _c.description) === null || _d === void 0 ? void 0 : _d.points) || ((_f = (_e = this.lesson) === null || _e === void 0 ? void 0 : _e.score) === null || _f === void 0 ? void 0 : _f.completed) < ((_g = this.lesson) === null || _g === void 0 ? void 0 : _g.minValue));
   }
   getBadgeText() {
@@ -58,8 +59,8 @@ const YooCardLessonComponent = class {
     const parentPlan = lodash.get(this.lesson, 'plan', lodash.get(this.lesson, 'plans[0]', null));
     if (this.lesson && this.lesson.description && parentPlan) {
       const lessonOrder = lodash.get(this.lesson, 'description.order', 0) + '';
-      const courseTitle = index$2.translateMulti(lodash.get(parentPlan, 'title', ''));
-      return index$2.translate('LESSONOFCOURSE', { lesson: index$2.translate('LESSON') + ' ' + lessonOrder, course: courseTitle });
+      const courseTitle = overlays.translateMulti(lodash.get(parentPlan, 'title', ''));
+      return overlays.translate('LESSONOFCOURSE', { lesson: overlays.translate('LESSON') + ' ' + lessonOrder, course: courseTitle });
     }
     return '';
   }
@@ -71,12 +72,12 @@ const YooCardLessonComponent = class {
     return lessonType;
   }
   getTagColor() {
-    return index$2.isLessonCompleted(this.lesson) ? 'light' : this.lesson.locked ? 'stable' : 'app-color';
+    return overlays.isLessonCompleted(this.lesson) ? 'light' : this.lesson.locked ? 'stable' : 'app-color';
   }
   renderLessonDuration(tagColor, iconColor) {
     var _a, _b;
     if ((_a = this.lesson) === null || _a === void 0 ? void 0 : _a.duration) {
-      return (index.h("yoo-tag", { class: "menu-item", color: tagColor, noBackground: true, size: "medium" }, index.h("yoo-icon", { slot: "start", size: "small", name: "recent", color: iconColor }), `${(_b = this.lesson) === null || _b === void 0 ? void 0 : _b.duration} ${index$2.translate('MIN')}`));
+      return (index.h("yoo-tag", { class: "menu-item", color: tagColor, noBackground: true, size: "medium" }, index.h("yoo-icon", { slot: "start", size: "small", name: "recent", color: iconColor }), `${(_b = this.lesson) === null || _b === void 0 ? void 0 : _b.duration} ${overlays.translate('MIN')}`));
     }
   }
   renderLessonBadge() {
@@ -87,7 +88,7 @@ const YooCardLessonComponent = class {
               icon="${((_b = this.lesson) === null || _b === void 0 ? void 0 : _b.validated) ? this.lesson.badge.icon : 'lock'}"
               icon-only-color="light"
               size="small"
-              ></yoo-tag> ${index$2.translate((_c = this.lesson.badge) === null || _c === void 0 ? void 0 : _c.title)}` }, index.h("yoo-icon", { size: "small", color: this.completedColor, name: "badge" })));
+              ></yoo-tag> ${overlays.translate((_c = this.lesson.badge) === null || _c === void 0 ? void 0 : _c.title)}` }, index.h("yoo-icon", { size: "small", color: this.completedColor, name: "badge" })));
     }
   }
   renderBadge() {
@@ -98,7 +99,7 @@ const YooCardLessonComponent = class {
   }
   renderRetryButton() {
     if (this.displayRetry) {
-      return (index.h("div", { class: "extra-icon-container" }, index.h("yoo-tag", { color: "app-color-10", size: "small" }, index.h("yoo-icon", { name: "restart", size: "small", slot: "start", color: "app-color" }), index$2.translate('RESTART').toUpperCase())));
+      return (index.h("div", { class: "extra-icon-container" }, index.h("yoo-tag", { color: "app-color-10", size: "small" }, index.h("yoo-icon", { name: "restart", size: "small", slot: "start", color: "app-color" }), overlays.translate('RESTART').toUpperCase())));
     }
   }
   renderCheckLines() {
@@ -106,15 +107,15 @@ const YooCardLessonComponent = class {
   }
   renderTitle() {
     var _a;
-    const lessonTitle = index$2.translateMulti(lodash.get(this.lesson, 'description.title', '')) || index$2.translateMulti((_a = this.lesson) === null || _a === void 0 ? void 0 : _a.title);
-    return (index.h("div", { class: "title-container" }, index.h("div", { class: "title" }, index.h("div", { class: "type-icon-container" }, index.h("yoo-icon", { name: index$2.getLessonTypeIcon(this.getLessonType()), color: this.completedColor })), index.h("yoo-truncate", { class: "title", content: lessonTitle })), !index$2.isWeb() && this.renderRetryButton()));
+    const lessonTitle = overlays.translateMulti(lodash.get(this.lesson, 'description.title', '')) || overlays.translateMulti((_a = this.lesson) === null || _a === void 0 ? void 0 : _a.title);
+    return (index.h("div", { class: "title-container" }, index.h("div", { class: "title" }, index.h("div", { class: "type-icon-container" }, index.h("yoo-icon", { name: overlays.getLessonTypeIcon(this.getLessonType()), color: this.completedColor })), index.h("yoo-truncate", { class: "title", content: lessonTitle })), !overlays.isWeb() && this.renderRetryButton()));
   }
   renderLessonInfos() {
-    return (index.h("div", { class: "bottom-info-container" }, index.h("div", { class: "remaining-points-container" }, this.renderBadge(), index$2.isWeb() && this.renderLessonDuration(this.completedColor, this.completedColor), index$2.isWeb() && this.renderLessonBadge()), index$2.isWeb() && this.renderRetryButton()));
+    return (index.h("div", { class: "bottom-info-container" }, index.h("div", { class: "remaining-points-container" }, this.renderBadge(), overlays.isWeb() && this.renderLessonDuration(this.completedColor, this.completedColor), overlays.isWeb() && this.renderLessonBadge()), overlays.isWeb() && this.renderRetryButton()));
   }
   render() {
     var _a, _b, _c;
-    return (index.h(index.Host, { state: (_a = this.states) === null || _a === void 0 ? void 0 : _a.current, class: { ...commonHelpers.getAppContext(this.host), underline: !index$2.isWeb() || !((_b = this.states) === null || _b === void 0 ? void 0 : _b.current) } }, ((_c = this.states) === null || _c === void 0 ? void 0 : _c.current) && this.renderCheckLines(), index.h("div", { class: "info-container" }, this.renderTitle(), this.renderLessonInfos())));
+    return (index.h(index.Host, { state: (_a = this.states) === null || _a === void 0 ? void 0 : _a.current, class: { ...commonHelpers.getAppContext(this.host), underline: !overlays.isWeb() || !((_b = this.states) === null || _b === void 0 ? void 0 : _b.current) } }, ((_c = this.states) === null || _c === void 0 ? void 0 : _c.current) && this.renderCheckLines(), index.h("div", { class: "info-container" }, this.renderTitle(), this.renderLessonInfos())));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-card-list-collapsible.cjs.entry.js

@@ -2,12 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
-const commonHelpers = require('./common-helpers-6970c46c.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
+const commonHelpers = require('./common-helpers-a4efe957.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./lodash-597bda6d.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardListCollapsibleCss = ":host{display:block;height:100%;background:var(--card-list-background);cursor:pointer}:host yoo-tag.distance{--padding:0;margin-left:var(--spacing-08, 0.5rem)}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.25rem;border-bottom:var(--border-bottom-outer-container);-webkit-transition:background-color 0.3s ease, padding 0.3s ease;transition:background-color 0.3s ease, padding 0.3s ease}:host .outer-container .content-container{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:var(--justify-content-content-container);justify-content:var(--justify-content-content-container);-ms-flex-pack:center;justify-content:center;width:100%;margin-right:var(0);margin-left:var(0);overflow:hidden}:host .outer-container .content-container.has-image{margin-left:0}:host .outer-container .content-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:start;align-items:flex-start;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-02, 0.125rem);font-size:var(--font-size-16, 1rem);line-height:1.5}:host .outer-container .content-container .heading-container .margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .content-container .heading-container yoo-avatars{margin-right:0.125rem}:host .outer-container .content-container .heading-container .card-heading{-ms-flex:1;flex:1;min-width:0;color:var(--dark, #000000)}:host .outer-container .content-container .heading-container .card-heading .heading-title{display:-webkit-box;max-height:calc((var(--font-size-16, 1rem) + 0.125rem) * 2);overflow:hidden;line-height:calc(var(--font-size-16, 1rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host .outer-container .content-container .heading-container .card-heading .heading-title span{display:block;overflow:hidden;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .card-heading .heading-circle{display:inline-block;width:0.5rem;height:0.5rem;margin-right:0.2rem;border-radius:50%}:host .outer-container .content-container .heading-container .card-heading *{-webkit-margin-before:0;margin-block-start:0;-webkit-margin-after:0;margin-block-end:0}:host .outer-container .content-container .heading-container .card-heading .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:var(--spacing-02, 0.125rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .outer-container .content-container .subheading-container html,:host .outer-container .content-container .subheading-container body,:host .outer-container .content-container .subheading-container div:not([class^=fr-]),:host .outer-container .content-container .subheading-container span:not([class^=fr-]),:host .outer-container .content-container .subheading-container img:not([class^=fr-]),:host .outer-container .content-container .subheading-container applet,:host .outer-container .content-container .subheading-container object,:host .outer-container .content-container .subheading-container iframe,:host .outer-container .content-container .subheading-container h1,:host .outer-container .content-container .subheading-container h2,:host .outer-container .content-container .subheading-container h3,:host .outer-container .content-container .subheading-container h4,:host .outer-container .content-container .subheading-container h5,:host .outer-container .content-container .subheading-container h6,:host .outer-container .content-container .subheading-container p,:host .outer-container .content-container .subheading-container blockquote,:host .outer-container .content-container .subheading-container pre,:host .outer-container .content-container .subheading-container a,:host .outer-container .content-container .subheading-container abbr,:host .outer-container .content-container .subheading-container acronym,:host .outer-container .content-container .subheading-container address,:host .outer-container .content-container .subheading-container big,:host .outer-container .content-container .subheading-container cite,:host .outer-container .content-container .subheading-container code,:host .outer-container .content-container .subheading-container del,:host .outer-container .content-container .subheading-container dfn,:host .outer-container .content-container .subheading-container em,:host .outer-container .content-container .subheading-container font,:host .outer-container .content-container .subheading-container ins,:host .outer-container .content-container .subheading-container kbd,:host .outer-container .content-container .subheading-container q,:host .outer-container .content-container .subheading-container s,:host .outer-container .content-container .subheading-container samp,:host .outer-container .content-container .subheading-container small,:host .outer-container .content-container .subheading-container strike,:host .outer-container .content-container .subheading-container strong,:host .outer-container .content-container .subheading-container sub,:host .outer-container .content-container .subheading-container sup,:host .outer-container .content-container .subheading-container tt,:host .outer-container .content-container .subheading-container var,:host .outer-container .content-container .subheading-container dl,:host .outer-container .content-container .subheading-container dt,:host .outer-container .content-container .subheading-container dd,:host .outer-container .content-container .subheading-container ol,:host .outer-container .content-container .subheading-container ul,:host .outer-container .content-container .subheading-container li,:host .outer-container .content-container .subheading-container fieldset,:host .outer-container .content-container .subheading-container form,:host .outer-container .content-container .subheading-container label,:host .outer-container .content-container .subheading-container legend,:host .outer-container .content-container .subheading-container table,:host .outer-container .content-container .subheading-container caption,:host .outer-container .content-container .subheading-container tbody,:host .outer-container .content-container .subheading-container tfoot,:host .outer-container .content-container .subheading-container thead,:host .outer-container .content-container .subheading-container tr,:host .outer-container .content-container .subheading-container th{margin:0;padding:0;font-weight:inherit;font-size:100%;font-family:inherit;font-style:inherit;vertical-align:baseline;border:0;outline:0;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0}:host .outer-container .content-container .subheading-container .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .avatar-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;margin-top:0.5rem;padding-right:0.3rem}:host .outer-container .content-container .avatar-container yoo-avatar{margin-right:0.75rem;margin-left:0.15rem}:host .outer-container .content-container .action-button-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .content-container .slot-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:justify;justify-content:space-between;color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem)}:host .outer-container .content-container .slot-container .inner-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host(.firefox) .content-container{margin-bottom:0}:host(.web):not(.framed) .outer-container{padding-top:1rem;padding-bottom:1rem;background-color:transparent}:host(.web) .outer-container .card-list-image-container.large{min-width:3.875rem}:host(.web) .outer-container .card-list-image-container.medium{min-width:2.875rem}:host(.web) .outer-container .card-list-image-container.small{min-width:2.375rem}:host(.web) .outer-container .content-container .top-container .badges-container.show-more{position:relative;overflow:visible}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button{position:absolute;top:0;right:0;bottom:auto;left:auto;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;width:2rem;height:1.125rem;font-size:var(--font-size-18, 1.125rem)}:host(.web) .outer-container .content-container .top-container .badges-container.show-more .more-button yoo-icon{padding-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host(.locations) .outer-container .content-container .top-container .heading-container .date-card-text{padding-right:var(--spacing-16, 1rem)}:host(.locations.map) .outer-container{-ms-flex-align:center;align-items:center;background:var(--light, #ffffff)}:host(.collapsible) .outer-container,:host(.locations.no-kpi:not(.framed)) .outer-container{-ms-flex-align:start;align-items:flex-start;width:auto;border-bottom:none;border-radius:0.5rem}:host(.collapsible) .outer-container .content-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container{margin:0.5rem 0 0;border:none}:host(.collapsible) .outer-container .content-container .top-container .heading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .heading-container{-ms-flex-pack:justify;justify-content:space-between;padding-top:0 !important;padding-right:var(--spacing-08, 0.5rem)}:host(.collapsible) .outer-container .content-container .top-container .subheading-container,:host(.locations.no-kpi:not(.framed)) .outer-container .content-container .top-container .subheading-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.collapsible) .outer-container .content-container{margin-top:0}:host(.locations.no-kpi.map) .outer-container{-ms-flex-align:start;align-items:flex-start;max-width:18.75rem}:host(.locations.no-kpi:not(.framed)) yoo-tag.distance{margin-right:0.75rem}:host(.web.framed) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.android) .outer-container .content-container .top-container .heading-container .heading-title{display:-webkit-box;max-height:calc((var(--font-size-18, 1.125rem) + 0.25rem) * 2);overflow:hidden;line-height:calc(var(--font-size-18, 1.125rem) + 0.125rem);text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2;}:host{--border-bottom-outer-container:var(--border-radius-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));--card-list-background:none;--justify-content-content-container:center}:host yoo-kpi-card{--grid-auto-flow:inherit;--grid-template-columns:repeat(4, minmax(0, 1fr));--value-font-size:var(--font-size-14, 0.875rem);--value-font-weight:var(--font-weight-400, 400);--value-margin:var(--spacing-04, 0.25rem) 0 0;--value-title-color:var(--text-color, #807f83);--value-title-font-size:var(--font-size-12, 0.75rem);--variation-font-size:var(--font-size-12, 0.75rem);margin-top:var(--spacing-08, 0.5rem)}:host .outer-container .content-container{padding-top:var(--spacing-04, 0.25rem)}:host .outer-container .content-container .heading-container .card-heading{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .outer-container .content-container .heading-container .collapse-container{display:-ms-flexbox;display:flex;-ms-flex-align:end;align-items:flex-end;height:1.375rem;color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem)}:host .kpi-containers{height:0}:host(.vip) .outer-container{padding:var(--spacing-04, 0.25rem) 0}:host(.vip) .outer-container .subheading-container{line-height:1.75}:host(.vip) .outer-container .subheading-container yoo-tag{margin-right:var(--spacing-08, 0.5rem)}:host(.locations.collapsible){margin-right:var(--spacing-08, 0.5rem)}:host(.locations.collapsible) .outer-container{padding:var(--spacing-04, 0.25rem) 0}:host(.locations.collapsible) .outer-container .heading-container{padding-right:var(--spacing-08, 0.5rem)}:host(.locations.web) .outer-container{padding:0;border-radius:var(--border-radius-16, 1rem)}:host(.locations.web) .outer-container .top-container{padding-right:var(--spacing-16, 1rem)}:host(.locations.web.collapsible) .outer-container{background-color:var(--light, #ffffff)}:host(.locations.web.collapsible) .outer-container .content-container .top-container .heading-container{font-size:var(--font-size-16, 1rem)}:host(.locations.web.collapsible) .outer-container .content-container .top-container .subheading-container{font-size:var(--font-size-14, 0.875rem)}:host(.open) .outer-container{border-radius:var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem) 0 0}:host(.open) .outer-container .content-container{width:100%;border:none}:host(.open) .kpi-containers{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;width:100%;height:auto;padding-top:0;border-radius:0 0 var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem)}@media only screen and (min-width: 415px){:host(.open) .kpi-containers .kpi-container{-ms-flex-preferred-size:16%;flex-basis:16%}:host(.open) .kpi-containers .kpi-container.chromatic{-ms-flex-preferred-size:33%;flex-basis:33%}:host(.open) .kpi-containers div.separator:nth-child(12n){display:none}}@media only screen and (min-width: 321px) and (max-width: 414px){:host(.open) .kpi-containers .kpi-container{-ms-flex-preferred-size:33%;flex-basis:33%}:host(.open) .kpi-containers div.separator:nth-child(6n){display:none}}@media only screen and (max-width: 320px){:host(.open) .kpi-containers div.separator:nth-child(4n){display:none}:host(.open) .kpi-containers .kpi-container{-ms-flex-preferred-size:49%;flex-basis:49%}}:host(.locations.map.collapsed) .outer-container,:host(.locations.map.no-kpi) .outer-container{border-radius:3.1875rem}:host(.locations.map.collapsed) .outer-container .subheading-container:first-child,:host(.locations.map.no-kpi) .outer-container .subheading-container:first-child{max-width:60%}:host(.locations.map.collapsed) .outer-container .subheading-container:last-child,:host(.locations.map.no-kpi) .outer-container .subheading-container:last-child{max-width:90%}:host(.locations.map.collapsed) .outer-container{height:var(--spacing-64, 4rem);padding:0 var(--spacing-08, 0.5rem)}:host(.locations.map.collapsed) .outer-container .content-container{padding-top:0}:host(.locations.map.collapsed) .outer-container .content-container .top-container .heading-container{margin-bottom:var(--spacing-04, 0.25rem)}:host(.locations.map.collapsed) .outer-container .content-container .top-container .subheading-container{color:var(--stable, #adadad)}:host(.locations.map.open) .outer-container{border-radius:var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem) 0 0}:host(.locations.map.open) .outer-container .subheading-container{padding-right:var(--spacing-08, 0.5rem)}:host(.locations.map.open) .kpi-containers{margin:0;padding:var(--spacing-08, 0.5rem) 0;background:var(--light, #ffffff);border-radius:0 0 var(--border-radius-08, 0.5rem) var(--border-radius-08, 0.5rem)}";
 
@@ -28,7 +29,7 @@ const YooCardListCollapsibleComponent = class {
     return !!((_a = this.entry.kpiData) === null || _a === void 0 ? void 0 : _a.length);
   }
   renderKpiContainer() {
-    const kpis = index$1.mapKpiData(this.entry.kpiData);
+    const kpis = overlays.mapKpiData(this.entry.kpiData);
     return (index.h("div", { class: "kpi-containers", style: { height: this.isCollapsed ? '0px' : 'auto' }, ref: (el) => (this.containerElement = el) }, index.h("yoo-kpi-card", { hideEmptyState: true, class: "content-only", kpiData: kpis })));
   }
   imageClicked(imagePath) {
@@ -43,7 +44,7 @@ const YooCardListCollapsibleComponent = class {
       const emitDetails = () => this.listCollapsed.emit({ collapsed: this.isCollapsed, item: this.entry, cardHeight: this.host.clientHeight });
       const onToggling = () => (this.isCollapsed = !this.isCollapsed);
       const onUpdateCardHeight = () => emitDetails();
-      index$1.gsapTo(this.containerElement, 0.25, { height: !this.isCollapsed ? 0 : 'auto', [this.isCollapsed ? 'onStart' : 'onComplete']: onToggling, onUpdate: onUpdateCardHeight });
+      overlays.gsapTo(this.containerElement, 0.25, { height: !this.isCollapsed ? 0 : 'auto', [this.isCollapsed ? 'onStart' : 'onComplete']: onToggling, onUpdate: onUpdateCardHeight });
       setTimeout(() => emitDetails(), 500);
     }
   }
@@ -60,14 +61,14 @@ const YooCardListCollapsibleComponent = class {
     var _a;
     return [
       index.h("div", { class: "heading-container" }, this.entry.heading && this.renderHeading(), this.entry.distance && this.renderDistance(), this.entry.isCollapsible && !this.isFormChoice ? this.renderCollapsibleControls() : null),
-      (_a = this.entry.subheadings) === null || _a === void 0 ? void 0 : _a.map((item, index$2) => {
+      (_a = this.entry.subheadings) === null || _a === void 0 ? void 0 : _a.map((item, index$1) => {
         if (item) {
           const itemText = item.replace(/<\/?[^>]+(>|$)/g, ''); // remove all html tags
-          if (index$1.isCloudinaryLink(item)) {
+          if (overlays.isCloudinaryLink(item)) {
             return index.h("yoo-img", { instant: this.entry.isGridCell, type: "background", class: "subheading-container", onClick: () => this.imageClicked(item), src: item });
           }
-          else if (!this.isCollapsed || !this.isMap || index$2 === 0) {
-            return (index.h("div", { class: "subheading-container" }, this.entry.tagElements && this.entry.vip && !index$2 && this.renderTags(), this.host.classList.contains('courseselection') && index.h("yoo-icon", { name: "todo-boost" }), itemText));
+          else if (!this.isCollapsed || !this.isMap || index$1 === 0) {
+            return (index.h("div", { class: "subheading-container" }, this.entry.tagElements && this.entry.vip && !index$1 && this.renderTags(), this.host.classList.contains('courseselection') && index.h("yoo-icon", { name: "todo-boost" }), itemText));
           }
         }
       })
@@ -83,11 +84,11 @@ const YooCardListCollapsibleComponent = class {
       open: this.entry.isCollapsible && !this.isCollapsed,
       map: this.isMap,
       vip: this.entry.vip,
-      firefox: index$1.isFirefox()
+      firefox: overlays.isFirefox()
     };
   }
   render() {
-    return (this.entry && (index.h(index.Host, { style: { width: this.isMap ? `${index$1.isWeb(this.host) ? 350 : window.innerWidth * 0.9}px` : 'auto' }, class: { ...commonHelpers.getAppContext(this.host), ...this.getClassList() } }, index.h("div", { class: "outer-container" }, (this.entry.imgSrc || this.entry.users || this.entry.icon || this.entry.iconText) && (index.h("yoo-card-list-image", { entry: this.entry, isMap: this.isMap, isCollapsed: this.isCollapsed, class: { collapsible: true, ...this.getClassList() } })), index.h("div", { class: { 'content-container': true, 'has-image ': !!(this.entry.imgSrc || this.entry.icon), center: !this.entry.heading && !this.entry.subheadings } }, index.h("div", { class: { 'top-container': true, leaderboard: !!(this.entry.rank >= 0 && this.entry.points >= 0) } }, this.renderHeadingContainerContent(), this.entry.tagElements && !this.entry.vip && this.renderTags()))), this.hasKpis && this.renderKpiContainer())));
+    return (this.entry && (index.h(index.Host, { style: { width: this.isMap ? `${overlays.isWeb(this.host) ? 350 : window.innerWidth * 0.9}px` : 'auto' }, class: { ...commonHelpers.getAppContext(this.host), ...this.getClassList() } }, index.h("div", { class: "outer-container" }, (this.entry.imgSrc || this.entry.users || this.entry.icon || this.entry.iconText) && (index.h("yoo-card-list-image", { entry: this.entry, isMap: this.isMap, isCollapsed: this.isCollapsed, class: { collapsible: true, ...this.getClassList() } })), index.h("div", { class: { 'content-container': true, 'has-image ': !!(this.entry.imgSrc || this.entry.icon), center: !this.entry.heading && !this.entry.subheadings } }, index.h("div", { class: { 'top-container': true, leaderboard: !!(this.entry.rank >= 0 && this.entry.points >= 0) } }, this.renderHeadingContainerContent(), this.entry.tagElements && !this.entry.vip && this.renderTags()))), this.hasKpis && this.renderKpiContainer())));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-card-list-color.cjs.entry.js

@@ -2,11 +2,12 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-c8609d4f.js');
-const index$1 = require('./index-f3d7c03d.js');
+const index = require('./index-e182c32d.js');
+require('./index-1fdbd9b3.js');
 const lodash = require('./lodash-597bda6d.js');
+const overlays = require('./overlays-b6c94fc8.js');
 require('./_commonjsHelpers-94df2ea7.js');
-require('./index-fc264952.js');
+require('./index-de8540eb.js');
 
 const cardListColorCss = ":host{--title-padding-top:0;--title-margin-bottom:var(--spacing-16, 1rem);--card-border-radius:var(--border-radius-08, 0.5rem);--align-items:normal;--flex-direction:row;display:block}:host p{margin:0}:host yoo-tooltip{height:100%}:host .outer-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:var(--title-margin-bottom);padding:var(--spacing-16, 1rem);color:var(--dark, #000000);background:var(--light, #ffffff);border-radius:var(--card-border-radius);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));cursor:pointer}:host .outer-container .heading-container{display:-ms-flexbox;display:flex;-ms-flex-direction:var(--flex-direction);flex-direction:var(--flex-direction);-ms-flex-align:var(--align-items);align-items:var(--align-items);font-weight:bold;background:var(--test-color)}:host .outer-container .heading-container .icon-left{margin-right:var(--spacing-08, 0.5rem)}:host .outer-container .heading-container .icon-left yoo-icon:not([color]){fill:inherit}:host .outer-container .heading-container .icon-right{margin-left:var(--spacing-08, 0.5rem)}:host .outer-container .heading-container .icon-right yoo-icon:not([color]){fill:inherit}:host .outer-container .heading-container .icon-middle yoo-icon:not([color]){fill:inherit}:host .outer-container .heading-container .heading{-ms-flex:1;flex:1;overflow:hidden}@supports (display: -webkit-box){:host .outer-container .heading-container .heading{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}:host .outer-container .progress-container{padding-bottom:var(--spacing-04, 0.25rem)}:host .outer-container .progress-container yoo-progress-bar{--progress-bar-color:var(--success, #3aa76d);--progress-value-color:var(--success, #3aa76d)}:host .outer-container .subheading-container{overflow:hidden;padding-top:var(--title-padding-top);color:var(--dark, #000000);text-align:left}@supports (display: -webkit-box){:host .outer-container .subheading-container{display:-webkit-box;-webkit-line-clamp:var(--subheading-line-clamp);-webkit-box-orient:vertical}}:host .outer-container .subheading-container-description{overflow:hidden;color:var(--stable, #adadad);text-align:left}@supports (display: -webkit-box){:host .outer-container .subheading-container-description{display:-webkit-box;-webkit-line-clamp:var(--subheading-description-line-clamp);-webkit-box-orient:vertical}}:host .outer-container .subheading-container-description .flex{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-align:center;align-items:center}:host .outer-container .tags-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;padding-top:var(--spacing-04, 0.25rem);padding-bottom:var(--spacing-04, 0.25rem);overflow:hidden;line-height:0.9372rem}:host .outer-container .tags-container yoo-tag,:host .outer-container .tags-container .card-icon{margin-top:0.2rem;margin-right:var(--spacing-08, 0.5rem);margin-left:0.0625rem}:host .outer-container .tags-container .hashtag{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-right:0.4375rem;color:var(--text-color, #807f83);font-size:var(--font-size-12, 0.75rem);-webkit-transform:translateY(0.125rem);transform:translateY(0.125rem)}:host .outer-container .tags-container .card-icon{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .outer-container .tags-container .card-icon yoo-icon{margin-right:0.4375rem}:host .outer-container .tags-container .row-action{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;line-height:1rem}:host .outer-container yoo-badge{position:absolute;top:0.8rem;left:0.8rem}:host.last-of-row .outer-container{width:0.0625rem;padding:0;visibility:hidden}:host(.horizontal) .outer-container{width:10.5rem;max-width:10.5rem;min-height:4.5rem;margin-bottom:0}:host(.horizontal[size=small]) .outer-container{width:9rem;max-width:9rem;min-height:3rem;padding:var(--spacing-08, 0.5rem)}:host(.horizontal[size=small]) .outer-container .heading-container{font-weight:normal;font-size:var(--font-size-14, 0.875rem);background:var(--test-color)}:host(.horizontal[size=medium]) .outer-container .heading-container{font-weight:normal;font-size:var(--font-size-16, 1rem);background:var(--test-color)}:host(:not(.horizontal)) .outer-container{-webkit-box-sizing:border-box;box-sizing:border-box;height:100%}:host(.card-list) .outer-container{margin-bottom:0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-alt-40, rgba(208, 208, 208, 0.4));border-radius:0}:host(.dashboards) .outer-container,:host(.missiondescriptions) .outer-container{margin-bottom:0;border:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1);-webkit-box-shadow:none;box-shadow:none}:host(.dashboards) .outer-container .heading-container,:host(.missiondescriptions) .outer-container .heading-container{font-weight:normal;background:var(--test-color)}:host(.dashboards) .outer-container .heading-container .heading,:host(.missiondescriptions) .outer-container .heading-container .heading{overflow:hidden;white-space:unset;text-align:left}@supports (display: -webkit-box){:host(.dashboards) .outer-container .heading-container .heading,:host(.missiondescriptions) .outer-container .heading-container .heading{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}:host(.dashboards.cell) .outer-container,:host(.missiondescriptions.cell) .outer-container{-ms-flex-pack:center;justify-content:center;padding:0 var(--spacing-16, 1rem)}:host(.dashboards.cell) .outer-container .heading-container,:host(.missiondescriptions.cell) .outer-container .heading-container{display:grid;grid-template-columns:minmax(0, 1fr) auto;gap:var(--spacing-08, 0.5rem);background:var(--test-color)}:host(.dashboards.cell) .outer-container .heading-container .heading,:host(.missiondescriptions.cell) .outer-container .heading-container .heading{grid-column-start:1;grid-column-end:3}:host(.dashboards.cell) .outer-container .heading-container .icon-right,:host(.missiondescriptions.cell) .outer-container .heading-container .icon-right{grid-row:1;grid-column:2}:host(.dashboards.cell) .outer-container .heading-container [class^=icon],:host(.missiondescriptions.cell) .outer-container .heading-container [class^=icon]{margin:0}:host(.missiondescriptions.framed) .outer-container{margin-bottom:0}:host(.missiondescriptions.framed) .progress-container,:host(.missiondescriptions.framed) .subheading-container-description,:host(.missiondescriptions.framed) .tags-container{display:none}@media (max-width: 370px){:host(.dashboards.framed) .outer-container .heading-container .heading,:host(.missiondescriptions.framed) .outer-container .heading-container .heading{overflow:hidden}@supports (display: -webkit-box){:host(.dashboards.framed) .outer-container .heading-container .heading,:host(.missiondescriptions.framed) .outer-container .heading-container .heading{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}}}:host(.campaigntypes) .outer-container,:host(.missiondescriptiontemplates) .outer-container{position:relative;min-height:15rem;border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0);-webkit-box-shadow:none;box-shadow:none}:host(.campaigntypes) .outer-container .heading-container .heading,:host(.missiondescriptiontemplates) .outer-container .heading-container .heading{font-size:var(--font-size-24, 1.5rem)}:host(.campaigntypes) .outer-container .subheading-container,:host(.missiondescriptiontemplates) .outer-container .subheading-container{color:var(--text-color, #807f83)}:host(.campaigntypes) .outer-container .image-container,:host(.missiondescriptiontemplates) .outer-container .image-container{position:absolute;right:0;bottom:0;height:9.375rem;margin:1rem}:host(.campaigntypes) .outer-container .image-container yoo-img,:host(.missiondescriptiontemplates) .outer-container .image-container yoo-img{height:9.375rem}@media only screen and (max-width: 1024px){:host(.campaigntypes) .outer-container .image-container,:host(.missiondescriptiontemplates) .outer-container .image-container{height:6.25rem}:host(.campaigntypes) .outer-container .image-container yoo-img,:host(.missiondescriptiontemplates) .outer-container .image-container yoo-img{height:6.25rem}}:host(.missiondescriptiontemplates) .outer-container .heading-container .heading{white-space:normal}";
 
@@ -20,15 +21,15 @@ const YooCardListColorComponent = class {
     var _a, _b, _c, _d;
     const { iconTopMiddle, iconTopMiddleColor, iconTopRight, iconTopRightColor, iconTopLeft, iconTopLeftColor, color, heading } = this.entry;
     const bigIcon = ((_b = (_a = this.host) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('campaigntypes')) || ((_d = (_c = this.host) === null || _c === void 0 ? void 0 : _c.classList) === null || _d === void 0 ? void 0 : _d.contains('missiondescriptiontemplates'));
-    return (index.h("div", { class: "heading-container", style: { '--align-items': iconTopMiddle ? 'center' : 'normal', '--flex-direction': iconTopMiddle ? 'column-reverse' : 'row', fill: color } }, !!iconTopLeft && (index.h("div", { class: "icon-left" }, index.h("yoo-icon", { size: bigIcon ? 'large' : 'medium', name: iconTopLeft, color: iconTopLeftColor }), this.notif && index.h("yoo-badge", { shape: "dot" }))), index.h("div", { class: "heading", innerHTML: index$1.translateMulti(heading || '') }), !!iconTopRight && (index.h("div", { class: "icon-right" }, index.h("yoo-icon", { size: "medium", name: iconTopRight, color: iconTopRightColor }), this.notif && index.h("yoo-badge", { shape: "dot" }))), !!iconTopMiddle && (index.h("div", { class: "icon-middle" }, index.h("yoo-icon", { size: "medium", name: iconTopMiddle, color: iconTopMiddleColor }), this.notif && index.h("yoo-badge", { shape: "dot" })))));
+    return (index.h("div", { class: "heading-container", style: { '--align-items': iconTopMiddle ? 'center' : 'normal', '--flex-direction': iconTopMiddle ? 'column-reverse' : 'row', fill: color } }, !!iconTopLeft && (index.h("div", { class: "icon-left" }, index.h("yoo-icon", { size: bigIcon ? 'large' : 'medium', name: iconTopLeft, color: iconTopLeftColor }), this.notif && index.h("yoo-badge", { shape: "dot" }))), index.h("div", { class: "heading", innerHTML: overlays.translateMulti(heading || '') }), !!iconTopRight && (index.h("div", { class: "icon-right" }, index.h("yoo-icon", { size: "medium", name: iconTopRight, color: iconTopRightColor }), this.notif && index.h("yoo-badge", { shape: "dot" }))), !!iconTopMiddle && (index.h("div", { class: "icon-middle" }, index.h("yoo-icon", { size: "medium", name: iconTopMiddle, color: iconTopMiddleColor }), this.notif && index.h("yoo-badge", { shape: "dot" })))));
   }
   renderSubHeader() {
     const { subHeading } = this.entry;
-    return subHeading && index.h("p", { class: "subheading-container", innerHTML: index$1.translateMulti(subHeading) });
+    return subHeading && index.h("p", { class: "subheading-container", innerHTML: overlays.translateMulti(subHeading) });
   }
   renderSubHeaderDescription() {
     const { subHeadingDescription } = this.entry;
-    return subHeadingDescription && index.h("p", { class: "subheading-container-description", innerHTML: index$1.translateMulti(subHeadingDescription) });
+    return subHeadingDescription && index.h("p", { class: "subheading-container-description", innerHTML: overlays.translateMulti(subHeadingDescription) });
   }
   renderProgress() {
     const { progress } = this.entry;
@@ -49,7 +50,7 @@ const YooCardListColorComponent = class {
     return (index.h(index.Host, { style: {
         ...(((_b = this.entry) === null || _b === void 0 ? void 0 : _b.subHeading) && { '--subheading-line-clamp': this.entry.subHeadingDescription ? '1' : '2' }),
         ...(((_c = this.entry) === null || _c === void 0 ? void 0 : _c.subHeadingDescription) && { '--subheading-description-line-clamp': this.entry.subHeading ? '1' : '2' })
-      } }, this.entry && (index.h(TagType, { hoverable: index$1.isWeb(this.host), placement: "bottom", content: index$1.translate(this.entry.tooltip) }, index.h("div", { class: { 'outer-container': true, 'has-image': !!this.entry.imgSrc } }, index.h("div", null, this.renderHeader(), this.renderProgress(), this.renderSubHeader(), this.renderSubHeaderDescription(), this.renderImage()), this.renderTags())))));
+      } }, this.entry && (index.h(TagType, { hoverable: overlays.isWeb(this.host), placement: "bottom", content: overlays.translate(this.entry.tooltip) }, index.h("div", { class: { 'outer-container': true, 'has-image': !!this.entry.imgSrc } }, index.h("div", null, this.renderHeader(), this.renderProgress(), this.renderSubHeader(), this.renderSubHeaderDescription(), this.renderImage()), this.renderTags())))));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-card-list-image.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 cardListImageCss = ":host .image-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;height:100%;padding-right:var(--spacing-04, 0.25rem)}:host .image-container yoo-form-checkbox{position:absolute;top:0.5rem;left:0.5rem}:host .image-container .bottom-left,:host .image-container .bottom-right,:host .image-container .top-left,:host .image-container .top-right{position:absolute;z-index:1}:host .image-container .bottom-left{bottom:0.5rem;left:0}:host .image-container .bottom-right{right:0.5rem;bottom:0}:host .image-container .top-left{top:0;left:0}:host .image-container .top-left.active{top:2rem}:host .image-container .top-right{top:-0.2rem;right:0.1rem}:host .image-container yoo-avatar,:host .image-container yoo-avatars,:host .image-container yoo-img{margin-left:var(--spacing-08, 0.5rem)}:host .image-container yoo-avatar[size=large],:host .image-container yoo-avatars,:host .image-container yoo-img{margin-right:var(--spacing-08, 0.5rem)}:host .image-container yoo-avatar:not([size=large]){margin-right:var(--spacing-08, 0.5rem)}:host(.selected-content) .image-container{width:2rem;padding-right:0}:host(.locations) .image-container .top-left{left:0}:host(.collapsible) .image-container,:host(.locations.no-kpi:not(.framed)) .image-container{margin:var(--spacing-08, 0.5rem);padding-right:0}:host(.collapsible) .image-container yoo-avatar,:host(.locations.no-kpi:not(.framed)) .image-container yoo-avatar{margin:0}:host(.locations.no-kpi.map) .image-container{margin:var(--spacing-08, 0.5rem)}:host(.vip) .image-container yoo-avatar{--border-initial:var(--border-width-02, 0.125rem) solid var(--light, #ffffff);--image-shadow:0 0 0 3px var(--energized, #ffc043);margin-left:3px}:host(.open) .image-container{max-height:4.375rem;margin:var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0 var(--spacing-08, 0.5rem)}:host(.open) .image-container yoo-avatar{-ms-flex-item-align:start;align-self:flex-start;margin:0}:host(.questionsAnswers) .image-container,:host(.feedsComments) .image-container,:host(.entitycomments) .image-container{padding-right:var(--spacing-04, 0.25rem)}:host(.questionsAnswers) .image-container yoo-avatar,:host(.feedsComments) .image-container yoo-avatar,:host(.entitycomments) .image-container yoo-avatar{-ms-flex-item-align:start;align-self:flex-start;margin-right:var(--spacing-04, 0.25rem);margin-left:0}:host(.catalog-display) .image-container yoo-avatar,:host(.charttype) .image-container yoo-avatar{display:-ms-flexbox;display:flex;-ms-flex-line-pack:center;align-content:center;-ms-flex-pack:center;justify-content:center;margin-left:0 !important}:host(.productbatch.archived) .image-container{opacity:0.5}:host(.productbatch.archived) .image-container .top-left{left:2.1rem}:host(.notifications) .image-container{-ms-flex-direction:column;flex-direction:column}:host(.files.autocomplete-selection-mode) .image-container{-ms-flex-align:center;align-items:center}:host(.autocomplete) .image-container{-ms-flex-align:center;align-items:center}:host(.autocomplete) .image-container .play{position:absolute;margin-right:var(--spacing-08, 0.5rem)}:host(.notes) yoo-avatar{margin-left:0}:host(.chat) .image-container{padding-right:0}:host(.chat) .image-container yoo-avatar,:host(.chat) .image-container yoo-avatars{margin-right:var(--spacing-08, 0.5rem)}";