@yoobic/yobi 8.5.0-60 → 8.5.0-62

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

@@ -3,13 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-const index$2 = require('./index-9aadeb94.js');
+const index$3 = require('./index-7790c794.js');
 const lodash = require('./lodash-a9050d79.js');
-const button_factory = require('./button.factory-604b2344.js');
-const commonHelpers = require('./common-helpers-9f63a319.js');
-const overlays = require('./overlays-e5d2ff76.js');
-const index$1 = require('./index-a1bbe627.js');
-require('./index-ec50fd6e.js');
+const button_factory = require('./button.factory-fc24ee93.js');
+const commonHelpers = require('./common-helpers-0724ae60.js');
+const index$1 = require('./index-4cdf7949.js');
+const index$2 = require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const EventActions = ({ actions, extraClasses }) => {
@@ -32,11 +31,11 @@ const EventAttendance = ({ info, count, handler }) => {
     var _a;
     let text = '';
     if (users.length === 1) {
-      const firstUsername = ((_a = users[0]) === null || _a === void 0 ? void 0 : _a._id) === overlays.getSession().userId ? overlays.translate('YOOBICYOU') : overlays.capitalizeFirstLetter(users[0].firstName);
-      text = overlays.translate(users[0]._id === overlays.getSession().userId ? 'YOOBICYOUAREGOING' : 'YOOBICISGOING', { name: firstUsername });
+      const firstUsername = ((_a = users[0]) === null || _a === void 0 ? void 0 : _a._id) === index$1.getSession().userId ? index$1.translate('YOOBICYOU') : index$1.capitalizeFirstLetter(users[0].firstName);
+      text = index$1.translate(users[0]._id === index$1.getSession().userId ? 'YOOBICYOUAREGOING' : 'YOOBICISGOING', { name: firstUsername });
     }
     else {
-      text = overlays.translate('YOOBICAREGOING', { count: users.length });
+      text = index$1.translate('YOOBICAREGOING', { count: users.length });
     }
     return [
       users.slice(0, 2).map(user => {
@@ -45,13 +44,13 @@ const EventAttendance = ({ info, count, handler }) => {
       index.h("span", { class: "text" }, text)
     ];
   };
-  return (index.h("div", { class: "attendance", onClick: (ev) => { commonHelpers.execHandlerAndStopEvent(ev, () => handler ? handler() : null); } }, users.length ? renderGoing() : index.h("span", { class: "text" }, overlays.translate('YOOBICEVENTUSERSINVITE', { count }))));
+  return (index.h("div", { class: "attendance", onClick: (ev) => { commonHelpers.execHandlerAndStopEvent(ev, () => handler ? handler() : null); } }, users.length ? renderGoing() : index.h("span", { class: "text" }, index$1.translate('YOOBICEVENTUSERSINVITE', { count }))));
 };
 
 const CardAnnouncement = ({ configs }) => {
   const announcementMission = lodash.cloneDeep(configs.missionDescription);
   announcementMission.description = announcementMission; // needed to display some infos into the mission-todo-page component, as it gets them from the description of the mission
-  return (index.h("yoo-announcement-heading", { class: { 'overlay': overlays.isCampaignFeed(announcementMission) }, mission: announcementMission, viewAllHandler: configs.viewAllHandler, layout: "feed" }));
+  return (index.h("yoo-announcement-heading", { class: { 'overlay': index$1.isCampaignFeed(announcementMission) }, mission: announcementMission, viewAllHandler: configs.viewAllHandler, layout: "feed" }));
 };
 const CardCampaign = ({ configs }) => {
   return (index.h("div", { class: "campaign-container" },
@@ -59,55 +58,55 @@ const CardCampaign = ({ configs }) => {
 };
 const CardIncentive = ({ configs }) => {
   if (configs.isEmpty) {
-    const customColor = overlays.getCssColor('app-color');
+    const customColor = index$1.getCssColor('app-color');
     return (index.h("div", { class: "outer-container empty incentive" },
       index.h("yoo-tag", { customColor: customColor, size: "extra-large", icon: "lock" }),
-      index.h("span", { class: "empty-text" }, overlays.translate('RESTRICTEDINCENTIVE'))));
+      index.h("span", { class: "empty-text" }, index$1.translate('RESTRICTEDINCENTIVE'))));
   }
   return ([
     index.h("div", { class: "incentives-container" },
       index.h("yoo-entity", { item: { ...configs.incentive, ...{ extraClasses: 'no-footer' } }, displayType: "card-incentive" })),
-    configs.viewHandler ? index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, configs.viewHandler) }, overlays.translate('VIEWINCENTIVE')) : null
+    configs.viewHandler ? index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, configs.viewHandler) }, index$1.translate('VIEWINCENTIVE')) : null
   ]);
 };
 const CardEvent = ({ configs }) => {
   var _a;
   const startDate = new Date(configs.recurrenceStart || configs.startDate);
   const endDate = new Date(configs.recurrenceEnd || configs.endDate);
-  const startDay = overlays.dateFormat(startDate, 'D');
-  const endDay = overlays.dateFormat(endDate, 'D');
+  const startDay = index$1.dateFormat(startDate, 'D');
+  const endDay = index$1.dateFormat(endDate, 'D');
   const isSameDay = startDay === endDay;
   const format = configs.allDay ? 'ddd DD MMM' : 'ddd DD MMM LT';
   const endformat = isSameDay ? (configs.allDay ? null : 'LT') : format;
-  const isPublic = configs.eventType === index$1.EventType.PUBLIC;
+  const isPublic = configs.eventType === index$2.EventType.PUBLIC;
   const isRecurring = configs.recurring;
   return ([
     index.h("div", { class: "row" },
       index.h("div", { class: "left-part" },
         index.h("div", { class: "box" },
-          index.h("div", { class: "month" }, overlays.dateFormat(startDate, 'MMM').toUpperCase()),
+          index.h("div", { class: "month" }, index$1.dateFormat(startDate, 'MMM').toUpperCase()),
           index.h("div", { class: "day" }, startDay),
-          !isSameDay && index.h("div", { class: "month end" }, overlays.dateFormat(endDate, 'MMM').toUpperCase()),
+          !isSameDay && index.h("div", { class: "month end" }, index$1.dateFormat(endDate, 'MMM').toUpperCase()),
           !isSameDay && index.h("div", { class: "day" }, endDay))),
       index.h("div", { class: "right-part" },
         index.h("span", { class: "heading" },
           index.h("yoo-icon", { size: "small", color: "text-color", name: isPublic ? 'feed' : 'email' }),
-          overlays.translate(`${isPublic ? 'PUBLICEVENT' : 'PRIVATEEVENT'}`),
-          isRecurring && index.h("yoo-tag", { innerHTML: overlays.translate('RECURRING'), color: "app-color-10" })),
+          index$1.translate(`${isPublic ? 'PUBLICEVENT' : 'PRIVATEEVENT'}`),
+          isRecurring && index.h("yoo-tag", { innerHTML: index$1.translate('RECURRING'), color: "app-color-10" })),
         index.h("span", { class: "title" },
-          overlays.translateMulti(configs.title),
+          index$1.translateMulti(configs.title),
           " "),
-        index.h("span", { class: "date dark" }, `${overlays.dateFormat(startDate, format)}${!isSameDay || !configs.allDay ? (` ${overlays.translate('YOOBICTO').toLowerCase()} ${overlays.dateFormat(endDate, endformat)}`) : ''}`),
+        index.h("span", { class: "date dark" }, `${index$1.dateFormat(startDate, format)}${!isSameDay || !configs.allDay ? (` ${index$1.translate('YOOBICTO').toLowerCase()} ${index$1.dateFormat(endDate, endformat)}`) : ''}`),
         configs.location && (index.h("div", { class: "preview-container" },
           index.h("yoo-avatar", { imgSrc: configs.location.imageData, iconText: configs.location.title, size: "extra-small" }),
           index.h("span", null, configs.location.title))),
         configs.address && index.h("span", { class: "address" }, configs.address),
-        configs.virtualRoomUrl && index.h("yoo-truncate", { class: "url", innerHTML: overlays.replaceAllLinks(configs.virtualRoomUrl) }),
-        configs.description && index.h("yoo-truncate", { class: "card-feeds", maxLength: 10, byWords: true, showEllipsisButton: true, content: overlays.replaceAllLinks(overlays.translateMulti(configs.description)) }),
-        ((_a = configs.tags) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { class: "feed-hashtags" }, configs.tags.map((a) => (a === null || a === void 0 ? void 0 : a.toLowerCase) && index.h("span", { class: "hashtag", innerHTML: `#${overlays.translateMulti(a.toUpperCase()).toLowerCase()} ` })))),
+        configs.virtualRoomUrl && index.h("yoo-truncate", { class: "url", innerHTML: index$1.replaceAllLinks(configs.virtualRoomUrl) }),
+        configs.description && index.h("yoo-truncate", { class: "card-feeds", maxLength: 10, byWords: true, showEllipsisButton: true, content: index$1.replaceAllLinks(index$1.translateMulti(configs.description)) }),
+        ((_a = configs.tags) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { class: "feed-hashtags" }, configs.tags.map((a) => (a === null || a === void 0 ? void 0 : a.toLowerCase) && index.h("span", { class: "hashtag", innerHTML: `#${index$1.translateMulti(a.toUpperCase()).toLowerCase()} ` })))),
         configs.type && index.h("span", { class: "dark flex" },
-          `${overlays.translate('YOOBICCATEGORY')}: `,
-          index.h("span", { class: "type", innerHTML: overlays.translate(configs.type) })),
+          `${index$1.translate('YOOBICCATEGORY')}: `,
+          index.h("span", { class: "type", innerHTML: index$1.translate(configs.type) })),
         (configs.totalUserCount > 0 || configs.eventInfo) && index.h(EventAttendance, { info: configs.eventInfo, count: configs.totalUserCount, handler: configs.eventHandler }),
         index.h("slot", { name: "event-document" }))),
     index.h("slot", { name: "event-action" })
@@ -146,10 +145,10 @@ const YooCardFeedComponent = class {
   componentWillLoad() {
     var _a;
     if ((_a = this.entry) === null || _a === void 0 ? void 0 : _a.description) {
-      this.entry.description = overlays.setSecuredContent(this.entry.description);
+      this.entry.description = index$1.setSecuredContent(this.entry.description);
     }
     this.isPhotos = this.host.classList.contains('photos');
-    if (overlays.isNullOrUndefined(this.preventAutoPlayMedia)) {
+    if (index$1.isNullOrUndefined(this.preventAutoPlayMedia)) {
       this.preventAutoPlayMedia = this.modalMode;
     }
     this.initView();
@@ -221,7 +220,7 @@ const YooCardFeedComponent = class {
   }
   isCreator() {
     var _a, _b;
-    return ((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.user) === null || _b === void 0 ? void 0 : _b._id) === overlays.getSession().userId;
+    return ((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.user) === null || _b === void 0 ? void 0 : _b._id) === index$1.getSession().userId;
   }
   onMediaClicked(ev) {
     if (!this.previewMode && this.host.classList.contains('shared-feed')) {
@@ -250,12 +249,12 @@ const YooCardFeedComponent = class {
     var _a;
     ev.stopPropagation();
     if (this.modalMode && this.isCreator() && ((_a = ev === null || ev === void 0 ? void 0 : ev.detail) === null || _a === void 0 ? void 0 : _a.keys)) {
-      overlays.getAsyncExtraData({ type: 'user-list', params: { keys: ev.detail.users } });
+      index$1.getAsyncExtraData({ type: 'user-list', params: { keys: ev.detail.users } });
     }
   }
   observeVisibility() {
-    if (index$2.isIntersectionObserverSupported()) {
-      this.observer = index$2.intersectionObserve(this.host, (nodes) => {
+    if (index$3.isIntersectionObserverSupported()) {
+      this.observer = index$3.intersectionObserve(this.host, (nodes) => {
         nodes.forEach((node) => {
           if (node.isIntersecting) {
             this.removeIntersectionObserver();
@@ -304,14 +303,14 @@ const YooCardFeedComponent = class {
       } }, index.h("yoo-empty-state", { type: "waiting" }), this.hasMediaTags() && this.renderMediaTags()));
   }
   renderMarkDescription() {
-    return (index.h("div", null, overlays.translate('DERIVEDFROM'), index.h("mark", null, " ", ' "' + overlays.translateMulti(this.entry.fieldTitle) + '" '), overlays.translate('YOOBICIN')));
+    return (index.h("div", null, index$1.translate('DERIVEDFROM'), index.h("mark", null, " ", ' "' + index$1.translateMulti(this.entry.fieldTitle) + '" '), index$1.translate('YOOBICIN')));
   }
   renderText() {
     var _a;
     const preventNewLine = (_a = this.entry.description) === null || _a === void 0 ? void 0 : _a.includes('name="slide"');
-    const content = overlays.parseMarkDown(overlays.replaceAllLinks(this.entry.description, preventNewLine), true);
+    const content = index$1.parseMarkDown(index$1.replaceAllLinks(this.entry.description, preventNewLine), true);
     return this.modalMode ? index.h("div", { ref: (el) => this.textElement = el, onClick: (ev) => { var _a; return commonHelpers.openImageDetailFromRTE(this.host, this.textElement, (_a = ev === null || ev === void 0 ? void 0 : ev.target) === null || _a === void 0 ? void 0 : _a['src']); }, innerHTML: content }) :
-      index.h("yoo-truncate", { class: "card-feeds", maxLength: 20, byWords: true, replaceBreakWithClosed: true, showEllipsisButton: !this.isBlog(), onContentToggled: (ev) => this.viewMoreToggled.emit(ev.detail), content: overlays.replaceAllLinks(this.entry.description, preventNewLine) });
+      index.h("yoo-truncate", { class: "card-feeds", maxLength: 20, byWords: true, replaceBreakWithClosed: true, showEllipsisButton: !this.isBlog(), onContentToggled: (ev) => this.viewMoreToggled.emit(ev.detail), content: index$1.replaceAllLinks(this.entry.description, preventNewLine) });
   }
   renderEntryDescription() {
     return (index.h("div", { class: {
@@ -345,7 +344,7 @@ const YooCardFeedComponent = class {
   }
   renderFeedTags() {
     var _a, _b, _c;
-    return (index.h("div", { class: "feed-hashtags" }, (_c = (_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.tags) === null || _b === void 0 ? void 0 : _b.map) === null || _c === void 0 ? void 0 : _c.call(_b, (a) => (a === null || a === void 0 ? void 0 : a.toLowerCase) && index.h("span", { class: "hashtag", onClick: (ev) => { var _a; return this.onEmbeddedEntityClicked({ tag: a, custom: true, communityRef: (_a = this.entry.community) === null || _a === void 0 ? void 0 : _a._id }, 'feeds', ev); }, innerHTML: `#${overlays.translateMulti(a).toLowerCase()} ` }))));
+    return (index.h("div", { class: "feed-hashtags" }, (_c = (_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.tags) === null || _b === void 0 ? void 0 : _b.map) === null || _c === void 0 ? void 0 : _c.call(_b, (a) => (a === null || a === void 0 ? void 0 : a.toLowerCase) && index.h("span", { class: "hashtag", onClick: (ev) => { var _a; return this.onEmbeddedEntityClicked({ tag: a, custom: true, communityRef: (_a = this.entry.community) === null || _a === void 0 ? void 0 : _a._id }, 'feeds', ev); }, innerHTML: `#${index$1.translateMulti(a).toLowerCase()} ` }))));
   }
   renderTopActions() {
     return (index.h("div", { class: "info-feed" }, this.entry.topActions.map((a) => (index.h("span", { onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, a.handler) }, a.text)))));
@@ -353,7 +352,7 @@ const YooCardFeedComponent = class {
   renderChart() {
     return (index.h("div", { class: "feed-chart" }, this.entry.chartDefinition.title && index.h("div", { class: "chart-title" }, this.entry.chartDefinition.title), index.h("yoo-kpi", { class: { 'allow-click': this.modalMode && this.isCreator() }, chartClass: "feed-chart", style: { height: this.entry.chartBarTotal * 70 + 'px' }, hideIfEmpty: true, definition: this.entry.chartDefinition, config: this.entry.chartConfig, isFullScreen: this.modalMode, onKpiClick: (ev) => this.onKpiClick(ev) }), this.entry.chartTotal > 0 && (index.h("div", { onClick: (ev) => {
         this.onPollVoteClicked(ev);
-      }, class: "chart-total" }, this.entry.chartTotal.toLocaleString(), " ", overlays.translate('VOTES').toLowerCase()))));
+      }, class: "chart-total" }, this.entry.chartTotal.toLocaleString(), " ", index$1.translate('VOTES').toLowerCase()))));
   }
   renderBottomActionText(item) {
     return (index.h("div", { class: 'action ' + (item.cssClass || '') }, item.icon && index.h("yoo-icon", { name: item.icon, color: item.iconColor, size: "medium" }), item.text));
@@ -403,13 +402,13 @@ const YooCardFeedComponent = class {
     const actions = icon.subIcons.map((subIcon) => {
       return { text: subIcon.text, icon: subIcon.icon, handler: () => subIcon.handler() };
     });
-    if (overlays.isWeb(this.host)) {
+    if (index$1.isWeb(this.host)) {
       return (index.h("span", { slot: "start", class: "feed-icon" }, index.h("yoo-context-menu", { contentButtons: actions }, index.h("yoo-icon", { name: icon.icon, color: icon.color || 'stable-alt', size: size || 'medium' }))));
     }
     else {
       return (index.h("span", { slot: "start", class: "feed-icon", onClick: (ev) => {
           ev.stopPropagation();
-          overlays.showActionSheet(actions);
+          index$1.showActionSheet(actions);
         } }, index.h("yoo-icon", { name: icon.icon, color: icon.color || 'stable-alt', size: size || 'medium' })));
     }
   }
@@ -424,11 +423,11 @@ const YooCardFeedComponent = class {
     ];
   }
   onShowActions(ev) {
-    if (!overlays.isWeb(this.host)) {
+    if (!index$1.isWeb(this.host)) {
       ev.stopPropagation();
       ev.preventDefault();
       if (this.hasActions()) {
-        overlays.showActionSheet(this.entry.actions);
+        index$1.showActionSheet(this.entry.actions);
       }
     }
   }
@@ -566,9 +565,9 @@ const YooCardFeedComponent = class {
   renderSharedIn() {
     const multiGroups = this.entry.groups.length > 1;
     return [
-      overlays.isWeb(this.host) ? '' : overlays.translate('SHAREDIN'),
+      index$1.isWeb(this.host) ? '' : index$1.translate('SHAREDIN'),
       index.h("span", { class: "feed-group" }, ` ${multiGroups ? this.entry.groups.length : this.entry.groups[0]} `),
-      multiGroups && overlays.translate('GROUPS')
+      multiGroups && index$1.translate('GROUPS')
     ];
   }
   renderFeedSubheading() {
@@ -577,7 +576,7 @@ const YooCardFeedComponent = class {
       this.hasSubheadings()
         ? this.entry.subheadings.map((sub) => (sub ? index.h("span", { class: "feed-subheading" }, sub) : null))
         : null,
-      ((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.groups) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("span", { class: "feed-subheading pointer truncate", onClick: () => this.onGroupClicked() }, overlays.isWeb(this.host) ? index.h("yoo-icon", { name: "group", size: "small", color: "text-color" }) : index.h("span", { class: "pre-wrap" }, ' • '), this.entry.sharedIn ? this.entry.sharedIn : this.renderSharedIn()))
+      ((_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.groups) === null || _b === void 0 ? void 0 : _b.length) > 0 && (index.h("span", { class: "feed-subheading pointer truncate", onClick: () => this.onGroupClicked() }, index$1.isWeb(this.host) ? index.h("yoo-icon", { name: "group", size: "small", color: "text-color" }) : index.h("span", { class: "pre-wrap" }, ' • '), this.entry.sharedIn ? this.entry.sharedIn : this.renderSharedIn()))
     ];
   }
   renderFeedDates() {
@@ -594,7 +593,7 @@ const YooCardFeedComponent = class {
     var _a;
     return (index.h("div", { class: "feed-top" }, index.h("div", { class: "feed-heading" }, ((_a = this.entry) === null || _a === void 0 ? void 0 : _a.heading) && (index.h("span", { class: "feed-title-container" }, this.renderAvatar('small'), index.h("span", { class: "text" }, this.entry.heading), this.hasActions() && (index.h("yoo-context-menu", { class: "flex", contentButtons: this.entry.actions, onClick: (ev) => ev.stopPropagation() }, index.h("yoo-icon", { name: "download", color: "stable-alt" }))))), index.h("div", { class: "feed-heading-inner-container" }, this.isPhotos ? this.renderPhotosSubheading() : this.renderFeedSubheading()), this.renderFeedDates())));
   }
-  renderAvatar(size = overlays.isWeb(this.host) ? 'large' : 'medium') {
+  renderAvatar(size = index$1.isWeb(this.host) ? 'large' : 'medium') {
     var _a, _b, _c;
     return (index.h("yoo-avatar", { onClick: (ev) => {
         this.onUserClicked(ev);
@@ -604,7 +603,7 @@ const YooCardFeedComponent = class {
     var _a, _b, _c, _d, _e, _f;
     return (index.h("div", { class: { 'feed-top': true, 'community': !!this.entry.community } }, index.h("div", { class: "left-part" }, ((_a = this.entry.community) === null || _a === void 0 ? void 0 : _a.name) && index.h("yoo-badge", { class: "community", color: "app-color", onClick: (ev) => this.onEmbeddedEntityClicked(this.entry.community, 'communities', ev), text: this.entry.community.name, shape: "rectangle" }), (((_b = this.entry) === null || _b === void 0 ? void 0 : _b.icon) || ((_c = this.entry) === null || _c === void 0 ? void 0 : _c.iconText) || ((_d = this.entry) === null || _d === void 0 ? void 0 : _d.user) || ((_e = this.entry) === null || _e === void 0 ? void 0 : _e.username)) && this.renderAvatar(), index.h("div", { class: "feed-heading" }, ((_f = this.entry) === null || _f === void 0 ? void 0 : _f.heading) && (index.h("span", { class: "feed-title-container" }, index.h("span", { class: "text" }, this.entry.heading))), index.h("div", { class: "feed-heading-inner-container" }, this.isPhotos ? this.renderPhotosSubheading() : this.renderFeedSubheading()), this.renderFeedDates())), this.hasActions() &&
       !this.detailView &&
-      (overlays.isWeb(this.host) ? (index.h("yoo-context-menu", { contentButtons: this.entry.actions, onClick: (ev) => ev.stopPropagation() }, this.renderMoreButton())) : (this.renderMoreButton()))));
+      (index$1.isWeb(this.host) ? (index.h("yoo-context-menu", { contentButtons: this.entry.actions, onClick: (ev) => ev.stopPropagation() }, this.renderMoreButton())) : (this.renderMoreButton()))));
   }
   renderFooterActions() {
     return index.h("div", { class: "feed-footer-actions" }, this.entry.footerActions.map((item) => button_factory.getButton(item)));
@@ -617,14 +616,14 @@ const YooCardFeedComponent = class {
       description = description.replace(/<br[^>]*>/g, '');
     }
     const mentionedBy = this.entry.firstComment.user || null;
-    const hasImage = overlays.isMedia(description) || description.includes('<ionic-chat-image');
+    const hasImage = index$1.isMedia(description) || description.includes('<ionic-chat-image');
     let firstCommentText = (_c = (_b = this.entry) === null || _b === void 0 ? void 0 : _b.firstComment) === null || _c === void 0 ? void 0 : _c.text;
     if (firstCommentText && this.entry.firstComment.mentions) {
-      firstCommentText = overlays.replaceAtTagToMentionTag(firstCommentText, this.entry.firstComment.mentions);
+      firstCommentText = index$1.replaceAtTagToMentionTag(firstCommentText, this.entry.firstComment.mentions);
     }
     return (index.h("div", { class: "feed-mention-actions", onClick: (ev) => {
         this.onFirstCommentClicked(ev);
-      } }, mentionedBy && index.h("yoo-avatar", { user: mentionedBy, size: "extra-small" }), hasImage ? index.h("span", { class: "app-color" }, overlays.translate('VIEWMEDIA')) : index.h("span", { class: "first-comment-text" }, overlays.removeTextStyle(firstCommentText))));
+      } }, mentionedBy && index.h("yoo-avatar", { user: mentionedBy, size: "extra-small" }), hasImage ? index.h("span", { class: "app-color" }, index$1.translate('VIEWMEDIA')) : index.h("span", { class: "first-comment-text" }, index$1.removeTextStyle(firstCommentText))));
   }
   renderFiles(documents) {
     return (index.h("div", { class: "feed-document-container" }, index.h("yoo-form-carousel", { mediaType: "document", allowSwipeDownDismiss: false, mediaSrc: documents, hideSecondaryActions: this.previewMode })));
@@ -632,7 +631,7 @@ const YooCardFeedComponent = class {
   renderPlan() {
     return (index.h("div", { class: "feed-plan" }, index.h("yoo-form-plan", { class: "dark", secondaryView: true, plan: this.entry.plan, planRef: this.entry.plan._id, feedRef: this.entry.feedRef, checkPermission: true, onClick: (ev) => {
         var _a;
-        if ((_a = overlays.getPermissions()) === null || _a === void 0 ? void 0 : _a.canViewMicrolearning) {
+        if ((_a = index$1.getPermissions()) === null || _a === void 0 ? void 0 : _a.canViewMicrolearning) {
           this.onEmbeddedEntityClicked(this.entry.plan, 'plans', ev);
         }
       } })));
@@ -644,14 +643,14 @@ const YooCardFeedComponent = class {
   }
   renderAttachment(extraClasses) {
     var _a;
-    return (index.h("div", { class: `attachment-container ${extraClasses ? extraClasses : ''}` }, index.h("div", { class: "header" }, index.h("yoo-icon", { name: "attachment", color: "dark", size: "small" }), overlays.translate('ATTACHMENTS')), index.h("div", { class: "attachment-inner-container" }, ((_a = this.entry.documents) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.renderFiles(this.entry.documents), this.entry.plan && Object.keys(this.entry.plan).length > 0 && this.renderPlan(), this.entry.question && this.renderWiki())));
+    return (index.h("div", { class: `attachment-container ${extraClasses ? extraClasses : ''}` }, index.h("div", { class: "header" }, index.h("yoo-icon", { name: "attachment", color: "dark", size: "small" }), index$1.translate('ATTACHMENTS')), index.h("div", { class: "attachment-inner-container" }, ((_a = this.entry.documents) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.renderFiles(this.entry.documents), this.entry.plan && Object.keys(this.entry.plan).length > 0 && this.renderPlan(), this.entry.question && this.renderWiki())));
   }
   renderPoll() {
     var _a, _b;
-    return (index.h("div", { class: "poll-container" }, index.h("div", { class: "header" }, this.entry.pollIsLong ? overlays.translate('POLLLINKEXISTING') : overlays.translate('POLLTITLE')), index.h("div", { class: "content" }, overlays.translateMulti(this.entry.pollTitle)), (_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.pollAnswers) === null || _b === void 0 ? void 0 :
+    return (index.h("div", { class: "poll-container" }, index.h("div", { class: "header" }, this.entry.pollIsLong ? index$1.translate('POLLLINKEXISTING') : index$1.translate('POLLTITLE')), index.h("div", { class: "content" }, index$1.translateMulti(this.entry.pollTitle)), (_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.pollAnswers) === null || _b === void 0 ? void 0 :
       _b.map((item) => {
         if (item) {
-          return [index.h("div", { class: "header" }, overlays.translate('ANSWER')), index.h("div", { class: "content" }, overlays.translate(item))];
+          return [index.h("div", { class: "header" }, index$1.translate('ANSWER')), index.h("div", { class: "content" }, index$1.translate(item))];
         }
       })));
   }
@@ -664,7 +663,7 @@ const YooCardFeedComponent = class {
         'no-tags': !((_b = this.entry) === null || _b === void 0 ? void 0 : _b.tags),
         'no-icons': !this.hasFeedIcons(),
         'no-first-comment': !((_c = this.entry) === null || _c === void 0 ? void 0 : _c.firstComment),
-        'has-translation-toggle': !overlays.isNullOrUndefined(this.entry.translationCallback)
+        'has-translation-toggle': !index$1.isNullOrUndefined(this.entry.translationCallback)
       } }, (_d = this.orderItem) === null || _d === void 0 ? void 0 : _d.map((item) => this.renderDynamic(item))));
   }
   onTranslateToggle(ev) {
@@ -691,11 +690,11 @@ const YooCardFeedComponent = class {
     return (index.h("div", { class: {
         'translate-container fr-view': true,
         active: this.showTranslatedText
-      } }, index.h("div", { class: "inner-container" }, this.isTranslating && index.h("yoo-loader", { class: "absolute backdrop-transparent" }), this.showTranslatedText && index.h("div", { class: "text-container", innerHTML: overlays.replaceAllLinks(this.translatedText, true) }), index.h("div", { class: "translation-button", onClick: (ev) => this.onTranslateToggle(ev) }, this.showTranslatedText ? index.h("span", null, overlays.translate('HIDETRANSLATION')) : overlays.translate('SEETRANSLATION')))));
+      } }, index.h("div", { class: "inner-container" }, this.isTranslating && index.h("yoo-loader", { class: "absolute backdrop-transparent" }), this.showTranslatedText && index.h("div", { class: "text-container", innerHTML: index$1.replaceAllLinks(this.translatedText, true) }), index.h("div", { class: "translation-button", onClick: (ev) => this.onTranslateToggle(ev) }, this.showTranslatedText ? index.h("span", null, index$1.translate('HIDETRANSLATION')) : index$1.translate('SEETRANSLATION')))));
   }
   renderSharedEvent(configs, slotName) {
     var _a, _b;
-    return (index.h("div", { class: "event-container", slot: slotName }, index.h(CardEvent, { configs: configs }), !!((_a = configs === null || configs === void 0 ? void 0 : configs.documents) === null || _a === void 0 ? void 0 : _a.length) && index.h("div", { slot: "event-document" }, this.renderFiles(configs.documents)), !!((_b = configs === null || configs === void 0 ? void 0 : configs.actions) === null || _b === void 0 ? void 0 : _b.length) && index.h("div", { slot: "event-action" }, index.h(EventActions, { extraClasses: { 'single-row': !overlays.isWeb(this.host) || (this.modalMode && this.eventMode) }, actions: configs.actions }))));
+    return (index.h("div", { class: "event-container", slot: slotName }, index.h(CardEvent, { configs: configs }), !!((_a = configs === null || configs === void 0 ? void 0 : configs.documents) === null || _a === void 0 ? void 0 : _a.length) && index.h("div", { slot: "event-document" }, this.renderFiles(configs.documents)), !!((_b = configs === null || configs === void 0 ? void 0 : configs.actions) === null || _b === void 0 ? void 0 : _b.length) && index.h("div", { slot: "event-action" }, index.h(EventActions, { extraClasses: { 'single-row': !index$1.isWeb(this.host) || (this.modalMode && this.eventMode) }, actions: configs.actions }))));
   }
   renderScheduledDate() {
     return (index.h("yoo-tag", { color: "energized", class: "scheduled-date" }, index.h("yoo-icon", { slot: "start", name: "calendar", size: "small", color: "light" }), this.entry.scheduledDate));
@@ -704,7 +703,7 @@ const YooCardFeedComponent = class {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     if (((_c = (_b = (_a = this.entry) === null || _a === void 0 ? void 0 : _a.uiFields) === null || _b === void 0 ? void 0 : _b.fields) === null || _c === void 0 ? void 0 : _c.length) > 0 &&
       !lodash.isEmpty((_e = (_d = this.entry) === null || _d === void 0 ? void 0 : _d.uiFields) === null || _e === void 0 ? void 0 : _e.data) &&
-      this.entry.uiFields.fields.some((f) => overlays.isFieldWithNoValue(f) || !overlays.isNullOrUndefined(this.entry.uiFields.data[f.name]))
+      this.entry.uiFields.fields.some((f) => index$1.isFieldWithNoValue(f) || !index$1.isNullOrUndefined(this.entry.uiFields.data[f.name]))
       && !((_g = (_f = this.host) === null || _f === void 0 ? void 0 : _f.classList) === null || _g === void 0 ? void 0 : _g.contains('map')) && !((_j = (_h = this.host) === null || _h === void 0 ? void 0 : _h.classList) === null || _j === void 0 ? void 0 : _j.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() })));
     }
@@ -740,7 +739,7 @@ const YooCardFeedComponent = class {
       case 'chart':
         return this.entry.chartDefinition && this.renderChart();
       case 'attachment':
-        return overlays.hasAttachment(this.entry) && this.renderAttachment(item.params);
+        return index$1.hasAttachment(this.entry) && this.renderAttachment(item.params);
       case 'bottom-actions':
         return this.entry.bottomActions && this.renderActions(this.entry.bottomActions);
       case 'middle-actions':
@@ -760,7 +759,7 @@ const YooCardFeedComponent = class {
       case 'shared-event':
         return this.entry.eventConfigs && this.renderSharedEvent(this.entry.eventConfigs);
       case 'shared-campaign': {
-        const isAnnouncement = overlays.isCampaignTodo((_f = this.entry.campaignConfigs) === null || _f === void 0 ? void 0 : _f.missionDescription) || overlays.isCampaignFeed((_g = this.entry.campaignConfigs) === null || _g === void 0 ? void 0 : _g.missionDescription);
+        const isAnnouncement = index$1.isCampaignTodo((_f = this.entry.campaignConfigs) === null || _f === void 0 ? void 0 : _f.missionDescription) || index$1.isCampaignFeed((_g = this.entry.campaignConfigs) === null || _g === void 0 ? void 0 : _g.missionDescription);
         return this.entry.campaignConfigs && (isAnnouncement ? this.renderCardAnnouncement() : this.renderCardCampaign());
       }
       case 'shared-incentive':
@@ -777,11 +776,11 @@ const YooCardFeedComponent = class {
   }
   renderCardCampaign() {
     return (index.h("div", { class: "card-container" }, index.h(CardCampaign, { configs: this.entry.campaignConfigs }), (!this.entry.campaignConfigs.isEmpty && this.entry.campaignConfigs.availableCount > 1 && !this.entry.campaignConfigs.isService) ?
-      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.viewAllHandler) }, overlays.translate('VIEWALL'))
+      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.viewAllHandler) }, index$1.translate('VIEWALL'))
       : null, (!this.entry.campaignConfigs.isEmpty && this.entry.campaignConfigs.availableMission && this.entry.campaignConfigs.missionDetailHandler) ?
-      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.missionDetailHandler) }, overlays.translate('VIEW'))
+      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.missionDetailHandler) }, index$1.translate('VIEW'))
       : null, (!this.entry.campaignConfigs.isEmpty && this.entry.campaignConfigs.isService && this.entry.campaignConfigs.createHandler) ?
-      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.createHandler) }, overlays.translate('CREATEREQUEST'))
+      index.h("yoo-button", { color: "app-color", size: "large", onClick: (ev) => commonHelpers.execHandlerAndStopEvent(ev, this.entry.campaignConfigs.createHandler) }, index$1.translate('CREATEREQUEST'))
       : null));
   }
   renderThumbnailView() {
@@ -815,19 +814,19 @@ const YooCardFeedComponent = class {
   renderMainView() {
     var _a, _b;
     const mediaSrc = ((_a = this.entry.mediaSrc) === null || _a === void 0 ? void 0 : _a[this.currentSlideIndex]) || ((_b = this.entry.mediaSrc) === null || _b === void 0 ? void 0 : _b[0]);
-    const isTypeVideo = overlays.isVideo(mediaSrc);
+    const isTypeVideo = index$1.isVideo(mediaSrc);
     return (index.h("div", { class: "main-view-container" }, isTypeVideo ? this.renderVideo(mediaSrc) : this.renderMainViewImage(mediaSrc)));
   }
   renderDetailView() {
     var _a;
     return [
-      index.h("div", { class: "left-container" }, index.h("yoo-icon", { name: "close", class: "close", color: "stable", onClick: () => overlays.closeModal(null) }), this.renderMainView(), ((_a = this.entry.mediaSrc) === null || _a === void 0 ? void 0 : _a.length) > 1 && this.renderThumbnailView()),
+      index.h("div", { class: "left-container" }, index.h("yoo-icon", { name: "close", class: "close", color: "stable", onClick: () => index$1.closeModal(null) }), this.renderMainView(), ((_a = this.entry.mediaSrc) === null || _a === void 0 ? void 0 : _a.length) > 1 && this.renderThumbnailView()),
       index.h("div", { class: "right-container" }, this.renderDetailViewHeader(), index.h("yoo-ion-content", null, this.renderContent()), index.h("slot", { name: "bottom" }))
     ];
   }
   renderSharedFeed() {
     const entry = this.entry.sharedFeed;
-    entry.heading = overlays.getUserDisplayName(entry.user);
+    entry.heading = index$1.getUserDisplayName(entry.user);
     return (index.h("div", { class: "shared-container" }, index.h("yoo-card-feed", { class: "shared-feed", previewMode: this.previewMode, detailView: this.detailView, modalMode: this.modalMode, entry: entry, onEmbeddedEntityClicked: (ev) => this.onEmbeddedEntityClicked(ev.detail.entity, ev.detail.entityType, ev), onSharedUserClicked: (ev) => {
         ev.stopPropagation();
         this.sharedUserClicked.emit(true);

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-7790c794.js');
+const index$1 = require('./index-4cdf7949.js');
 require('./lodash-a9050d79.js');
-require('./index-a1bbe627.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const cardFileCss = "svg:not(:root){overflow:hidden}: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 section:first-of-type{border-radius:var(--border-radius-04, 0.25rem)}:host section:first-of-type yoo-icon{margin:0 auto}:host section:first-of-type yoo-img{border-radius:var(--border-radius-04, 0.25rem)}:host section:last-of-type{display:inline-grid;padding-right:var(--spacing-08, 0.5rem);line-height:1.75;text-align:right}:host section:last-of-type #name{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host section:last-of-type #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))}:host([loading]){height:4.875rem}:host([loading]) div{-webkit-animation:pulseHolderShimmerGray 2s infinite ease-in-out;animation:pulseHolderShimmerGray 2s infinite ease-in-out}@-webkit-keyframes pulseHolderShimmerGray{0%{background-color:var(--stable-20, rgba(173, 173, 173, 0.2))}50%{background-color:var(--stable-40, rgba(173, 173, 173, 0.4))}100%{background-color:var(--stable-20, rgba(173, 173, 173, 0.2))}}@keyframes pulseHolderShimmerGray{0%{background-color:var(--stable-20, rgba(173, 173, 173, 0.2))}50%{background-color:var(--stable-40, rgba(173, 173, 173, 0.4))}100%{background-color:var(--stable-20, rgba(173, 173, 173, 0.2))}}:host([loading]) div#ph-icon{width:60%;height:var(--spacing-32, 2rem);margin:0 auto;border-radius:0 var(--spacing-16, 1rem) 0 0}:host([loading]) section{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;gap:var(--spacing-08, 0.5rem);-ms-flex-align:end;align-items:end;height:100%}:host([loading]) section div{height:45%}:host([loading]) section div:first-of-type{width:50%}:host([loading]) section div:last-of-type{width:25%}";
@@ -30,14 +30,14 @@ 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 overlays.pipes.fileSize.transform((file === null || file === void 0 ? void 0 : file.size) || this.localFile.size);
+    return index$1.pipes.fileSize.transform((file === null || file === void 0 ? void 0 : file.size) || this.localFile.size);
   }
   get isType() {
     var _a, _b, _c;
     return {
-      image: this.type === 'photo' || ((_a = this.fileType) === null || _a === void 0 ? void 0 : _a.includes('image')) || overlays.isImageUrl(this.fileSrc) || overlays.isImage(this.fileSrc),
-      video: this.type === 'video' || ((_b = this.fileType) === null || _b === void 0 ? void 0 : _b.includes('video')) || overlays.isVideo(this.fileSrc),
-      audio: this.type === 'audio' || ((_c = this.fileType) === null || _c === void 0 ? void 0 : _c.includes('audio')) || overlays.isAudio(this.fileSrc)
+      image: this.type === 'photo' || ((_a = this.fileType) === null || _a === void 0 ? void 0 : _a.includes('image')) || index$1.isImageUrl(this.fileSrc) || index$1.isImage(this.fileSrc),
+      video: this.type === 'video' || ((_b = this.fileType) === null || _b === void 0 ? void 0 : _b.includes('video')) || index$1.isVideo(this.fileSrc),
+      audio: this.type === 'audio' || ((_c = this.fileType) === null || _c === void 0 ? void 0 : _c.includes('audio')) || index$1.isAudio(this.fileSrc)
     };
   }
   get hasIcon() {
@@ -64,9 +64,9 @@ const YooCardFileComponent = class {
     else {
       this.localFile = this.file;
     }
-    this.fileType = this.type || overlays.getType(this.localFile);
-    this.iconName = overlays.getIconName(this.localFile);
-    this.iconColor = overlays.getIconColor(this.localFile);
+    this.fileType = this.type || index$1.getType(this.localFile);
+    this.iconName = index$1.getIconName(this.localFile);
+    this.iconColor = index$1.getIconColor(this.localFile);
     await new Promise((resolve) => {
       setTimeout(() => {
         this.isLoading = false;
@@ -84,7 +84,7 @@ const YooCardFileComponent = class {
     return index.h("section", null, this.fileName && index.h("span", { id: "name", innerHTML: this.fileName }), this.fileSize && index.h("span", { id: "size", innerHTML: this.fileSize }));
   }
   renderThumbnail() {
-    return index.h("section", null, this.hasIcon && !this.isType.image && !this.isType.video && index.h("yoo-icon", { size: "large", name: this.iconName, color: this.iconColor }), (this.isType.image || this.isType.video) && index.h("yoo-img", { src: this.isType.video ? overlays.toPng(this.fileSrc) : this.fileSrc }));
+    return index.h("section", null, this.hasIcon && !this.isType.image && !this.isType.video && index.h("yoo-icon", { size: "large", name: this.iconName, color: this.iconColor }), (this.isType.image || this.isType.video) && index.h("yoo-img", { src: this.isType.video ? index$1.toPng(this.fileSrc) : this.fileSrc }));
   }
   renderDocumentCard() {
     return [this.renderClose(),

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-7790c794.js');
+const index$1 = require('./index-4cdf7949.js');
 require('./lodash-a9050d79.js');
-require('./index-a1bbe627.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const cardImageCss = "svg:not(:root){overflow:hidden}:host{--description-align-items:center;--description-justify-content:center;--description-text-align:center;--description-background:initial;--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;--card-body-background:var(--stable, #adadad);position:relative;display:block;height:100%;color:var(--light, #ffffff);background:var(--card-body-background);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);background:var(--description-background)}: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(.empty){background:var(--stable-light, #f1f1f1);--description-background:var(--light, #ffffff)}:host(.empty) .description{margin:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host(.empty) .description h1{margin:var(--inner-spacing)}:host(.empty) yoo-avatar{--grayed-background:transparent;position:relative;left:unset;margin:0 auto}: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%}";
@@ -24,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, 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));
+    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));
   }
   get host() { return index.getElement(this); }
 };

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
+require('./index-7790c794.js');
 const lodash = require('./lodash-a9050d79.js');
-const overlays = require('./overlays-e5d2ff76.js');
-require('./index-a1bbe627.js');
+const index$1 = require('./index-4cdf7949.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const cardInboxCss = "svg:not(:root){overflow:hidden}: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.75rem) + 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:var(--spacing-16, 1rem);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.75rem) + 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)}:host(.rtl) yoo-avatar,:host(.rtl) yoo-avatars{margin-right:0;margin-left:var(--spacing-08, 0.5rem)}:host(.rtl) .header yoo-icon[name=circle1]{margin-right:0;margin-left:var(--spacing-04, 0.25rem)}:host(.rtl) .header yoo-truncate{margin-right:0;margin-left:var(--spacing-16, 1rem)}:host(.rtl) .header .sup{margin-right:auto;margin-left:0}:host(.rtl) .content{margin-right:calc(var(--icon-size-00, 0.75rem) + var(--spacing-04, 0.25rem) + var(--spacing-32, 2rem) + var(--spacing-08, 0.5rem));margin-left:0}:host(.rtl) .content .tags yoo-tag{margin-right:0;margin-left:var(--spacing-08, 0.5rem)}";
@@ -34,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 = overlays.isPresent(this.entry.progress);
+    const renderProgress = index$1.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() {
@@ -42,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 = overlays.isToday(this.entry.date);
+    const _isToday = index$1.isToday(this.entry.date);
     if (!_isToday) {
-      const time = overlays.pipes.dateFormat.transform(this.entry.date, 'LT');
-      return index.h("div", null, overlays.translate('SCHEDULEDATTIME', { time }));
+      const time = index$1.pipes.dateFormat.transform(this.entry.date, 'LT');
+      return index.h("div", null, index$1.translate('SCHEDULEDATTIME', { time }));
     }
     return null;
   }
   renderProgress() {
-    const renderProgress = overlays.isPresent(this.entry.progress);
+    const renderProgress = index$1.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, overlays.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, index$1.translate('ACTIONSCOMPLETED', { smart_count: value, total: max }))));
     }
     return null;
   }
@@ -75,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) => overlays.isFieldWithNoValue(f) || !overlays.isNullOrUndefined(this.entry.uiFields.data[f.name])) &&
+      this.entry.uiFields.fields.some((f) => index$1.isFieldWithNoValue(f) || !index$1.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() })));
@@ -84,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) ? overlays.getCssColor(this.entry.iconColor) : null;
-    return (index.h(index.Host, { class: { rtl: overlays.isRTL() } }, !!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') } })))));
+    const iconColor = ((_d = this.entry) === null || _d === void 0 ? void 0 : _d.iconColor) ? index$1.getCssColor(this.entry.iconColor) : null;
+    return (index.h(index.Host, { class: { rtl: index$1.isRTL() } }, !!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') } })))));
   }
   get host() { return index.getElement(this); }
 };