@yoobic/yobi 8.7.4 → 8.7.5

package/dist/collection/components/grid/ag-grid/grid-renderers.js

@@ -1159,43 +1159,6 @@ function courseGridStatusRenderer(params) {
     return container;
   }
 }
-function courseGridKpiRenderer(params) {
-  const courseList = params.data;
-  const kpis = [
-    {
-      title: translate('YOOBICASSIGNEDUSERS'),
-      type: 'number',
-      value: courseList === null || courseList === void 0 ? void 0 : courseList.usersCount
-    },
-    {
-      title: translate('COMPLETED'),
-      type: 'number',
-      value: courseList === null || courseList === void 0 ? void 0 : courseList.completedCount
-    },
-    {
-      title: translate('COMPLETION'),
-      type: 'percent',
-      value: courseList === null || courseList === void 0 ? void 0 : courseList.completionRate
-    },
-    {
-      title: translate('CORRECTANSWERS'),
-      type: 'percent',
-      value: courseList === null || courseList === void 0 ? void 0 : courseList.averageScore
-    }
-  ];
-  const kpiCard = document.createElement('yoo-kpi-card');
-  kpiCard.kpiData = kpis;
-  kpiCard.hideIllustration = true;
-  kpiCard.classList.add('content-only');
-  kpiCard.style.setProperty('--value-font-weight', 'normal');
-  kpiCard.style.setProperty('--value-font-size', '0.875rem');
-  kpiCard.style.setProperty('--value-separator', ` 0.0625rem solid ${getCssColor('stable-light')}`);
-  kpiCard.style.setProperty('--value-title-color', getCssColor('text-color'));
-  kpiCard.style.setProperty('--value-title-font-size', '0.75rem');
-  const container = document.createElement('div');
-  container.appendChild(kpiCard);
-  return container;
-}
 export function getColorFromKey(key) {
   if (key === 'finished') {
     return 'dark';
@@ -1247,6 +1210,76 @@ export function getKeyTemplate(key, count, suffix = '', hideKey = false, hideCol
   }
   return `<yoo-tag color=${circleColor}>${(hideKey ? '' : displayName + ':') + count + (suffix || '')}</yoo-tag>`;
 }
+class CourseGridKpiRenderer {
+  getGui() {
+    return this.eGui;
+  }
+  getKpisData(params) {
+    var _a, _b, _c, _d;
+    const plan = params.data;
+    const kpis = [
+      {
+        title: translate('YOOBICASSIGNEDUSERS'),
+        type: 'number',
+        value: (_a = plan === null || plan === void 0 ? void 0 : plan.planStats) === null || _a === void 0 ? void 0 : _a.usersCount
+      },
+      {
+        title: translate('COMPLETED'),
+        type: 'number',
+        value: (_b = plan === null || plan === void 0 ? void 0 : plan.planStats) === null || _b === void 0 ? void 0 : _b.completedCount
+      },
+      {
+        title: translate('COMPLETION'),
+        type: 'percent',
+        value: (_c = plan === null || plan === void 0 ? void 0 : plan.planStats) === null || _c === void 0 ? void 0 : _c.completionRate
+      },
+      {
+        title: translate('CORRECTANSWERS'),
+        type: 'percent',
+        value: (_d = plan === null || plan === void 0 ? void 0 : plan.planStats) === null || _d === void 0 ? void 0 : _d.averageScore
+      }
+    ];
+    return kpis;
+  }
+  isLoading(params) {
+    var _a;
+    const plan = params.data;
+    return (_a = plan === null || plan === void 0 ? void 0 : plan.planStats) === null || _a === void 0 ? void 0 : _a.loading;
+  }
+  init(params) {
+    const kpis = this.getKpisData(params);
+    const kpiCard = document.createElement('yoo-kpi-card');
+    kpiCard.kpiData = kpis;
+    kpiCard.hideIllustration = true;
+    kpiCard.classList.add('content-only');
+    kpiCard.style.setProperty('--value-font-weight', 'normal');
+    kpiCard.style.setProperty('--value-font-size', '0.875rem');
+    kpiCard.style.setProperty('--value-separator', ` 0.0625rem solid ${getCssColor('stable-light')}`);
+    kpiCard.style.setProperty('--value-title-color', getCssColor('text-color'));
+    kpiCard.style.setProperty('--value-title-font-size', '0.75rem');
+    this.kpiCard = kpiCard;
+    const container = document.createElement('div');
+    container.appendChild(kpiCard);
+    if (this.isLoading(params)) {
+      container.classList.add('loading');
+    }
+    this.eGui = container;
+  }
+  refresh(params) {
+    var _a, _b;
+    if (this.isLoading(params)) {
+      (_a = this.getGui()) === null || _a === void 0 ? void 0 : _a.classList.add('loading');
+    }
+    else {
+      (_b = this.getGui()) === null || _b === void 0 ? void 0 : _b.classList.remove('loading');
+    }
+    const kpis = this.getKpisData(params);
+    if (this.kpiCard) {
+      this.kpiCard.kpiData = kpis;
+    }
+    return true;
+  }
+}
 class EntityRenderer {
   getGui() {
     return this.eGui;
@@ -1560,7 +1593,7 @@ export function getRenderer(renderer) {
     case 'courseGridStatusRenderer':
       return courseGridStatusRenderer;
     case 'courseGridKpiRenderer':
-      return courseGridKpiRenderer;
+      return CourseGridKpiRenderer;
     case 'entityRenderer':
       return EntityRenderer;
     case 'actionsRenderer':

package/dist/collection/components/grid/grid/grid.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/grid/grid/grid.js

@@ -4303,7 +4303,7 @@ export class YooGridComponent {
         "mutable": false,
         "complexType": {
           "original": "TIllustration",
-          "resolved": "\"activity\" | \"aisles\" | \"barcode\" | \"battle\" | \"calendar\" | \"campaign\" | \"chart\" | \"chat\" | \"check\" | \"comment\" | \"contact\" | \"courses\" | \"database\" | \"feed\" | \"file\" | \"filter\" | \"folder\" | \"group\" | \"image\" | \"inbox\" | \"journey\" | \"leaderboard\" | \"lock\" | \"map\" | \"mission\" | \"note\" | \"offline\" | \"password\" | \"plugin\" | \"poll\" | \"publish\" | \"questions\" | \"request\" | \"scoring\" | \"search\" | \"security\" | \"settings\" | \"store\" | \"tag\" | \"upload\" | \"user\" | \"visit\" | \"workflow\" | \"aclRole\" | \"blog\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"emails\" | \"feeds\" | \"files\" | \"geofilters\" | \"groups\" | \"hierarchy\" | \"htmltemplates\" | \"incentives\" | \"lessons\" | \"locations\" | \"locationtypes\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"plans\" | \"productbatch\" | \"products\" | \"tenants\" | \"translations\" | \"userranks\" | \"users\" | \"photo\" | \"reject\" | \"none\" | \"inventory\" | \"kanban\" | \"knowledgelibrary\" | \"admin\" | \"service\" | \"field\" | \"dashboard\" | \"pharmaone\" | \"score\" | \"team\" | \"todo\" | \"trial\" | \"videocall\" | \"allowcamera\" | \"areamanager\" | \"category\" | \"empty\" | \"error\" | \"faceid\" | \"form\" | \"template\" | \"location\" | \"newsletter\" | \"nodata\" | \"notification\" | \"offlinemode\" | \"requestraised\" | \"robot\" | \"robotfailed\" | \"robotgenerating\" | \"robotsleeping\" | \"role\" | \"storemanager\" | \"touchid\" | \"usertrial\" | \"waiting\" | \"hq\" | \"missionstovalidate\" | \"wiki\" | \"goto\" | \"archived\" | \"allstores\" | \"analytics\" | \"artificialintelligence\" | \"availablestores\" | \"barcodelong\" | \"barcodeold\" | \"communitiestodiscover\" | \"courseqrcode\" | \"createannouncement\" | \"createmission\" | \"createpoll\" | \"createrequest\" | \"customformfield\" | \"enrol\" | \"fielduser\" | \"generalscoring\" | \"generic_chart\" | \"geocoding\" | \"magic-link\" | \"new-user\" | \"oneoff\" | \"page\" | \"paperplane\" | \"payments\" | \"pdfauditexport\" | \"pdfclassic\" | \"pdfcontract\" | \"pdfphotoreport\" | \"photosplaceholder\" | \"recurring\" | \"robot2\" | \"robotgenerated\" | \"robotsuccess\" | \"selectedstores\" | \"sending\" | \"sent\" | \"shopping\" | \"subscription\" | \"todoold\" | \"welcomeuser\" | \"answers\" | \"barcodealert\" | \"briefcase\" | \"emailblocked\" | \"memo\" | \"podium\" | \"subplans\" | \"widgetcourses\" | \"wikis\"",
+          "resolved": "\"activity\" | \"aisles\" | \"barcode\" | \"battle\" | \"calendar\" | \"campaign\" | \"chart\" | \"chat\" | \"check\" | \"comment\" | \"contact\" | \"courses\" | \"database\" | \"feed\" | \"file\" | \"filter\" | \"folder\" | \"group\" | \"image\" | \"inbox\" | \"journey\" | \"leaderboard\" | \"lock\" | \"map\" | \"mission\" | \"note\" | \"offline\" | \"password\" | \"plugin\" | \"poll\" | \"publish\" | \"questions\" | \"request\" | \"scoring\" | \"search\" | \"security\" | \"settings\" | \"store\" | \"tag\" | \"upload\" | \"user\" | \"visit\" | \"workflow\" | \"aclRole\" | \"blog\" | \"campaignfilters\" | \"channel\" | \"communities\" | \"custommodels\" | \"emails\" | \"feeds\" | \"files\" | \"geofilters\" | \"groups\" | \"hierarchy\" | \"htmltemplates\" | \"incentives\" | \"lessons\" | \"locations\" | \"locationtypes\" | \"memos\" | \"missiondescriptions\" | \"missiondescriptiontemplates\" | \"missions\" | \"plans\" | \"productbatch\" | \"products\" | \"tenants\" | \"translations\" | \"userranks\" | \"users\" | \"photo\" | \"reject\" | \"none\" | \"inventory\" | \"kanban\" | \"knowledgelibrary\" | \"admin\" | \"service\" | \"field\" | \"dashboard\" | \"pharmaone\" | \"score\" | \"team\" | \"todo\" | \"trial\" | \"videocall\" | \"allowcamera\" | \"areamanager\" | \"category\" | \"empty\" | \"error\" | \"faceid\" | \"form\" | \"template\" | \"location\" | \"newsletter\" | \"nodata\" | \"notification\" | \"offlinemode\" | \"requestraised\" | \"robot\" | \"robotfailed\" | \"robotgenerating\" | \"robotsleeping\" | \"role\" | \"storemanager\" | \"touchid\" | \"usertrial\" | \"waiting\" | \"hq\" | \"missionstovalidate\" | \"wiki\" | \"goto\" | \"archived\" | \"allstores\" | \"analytics\" | \"approval\" | \"artificialintelligence\" | \"availablestores\" | \"barcodelong\" | \"barcodeold\" | \"communitiestodiscover\" | \"courseqrcode\" | \"createannouncement\" | \"createmission\" | \"createpoll\" | \"createrequest\" | \"customformfield\" | \"enrol\" | \"fielduser\" | \"generalscoring\" | \"generic_chart\" | \"geocoding\" | \"magic-link\" | \"new-user\" | \"oneoff\" | \"page\" | \"paperplane\" | \"payments\" | \"pdfauditexport\" | \"pdfclassic\" | \"pdfcontract\" | \"pdfphotoreport\" | \"photosplaceholder\" | \"recurring\" | \"robot2\" | \"robotgenerated\" | \"robotsuccess\" | \"selectedstores\" | \"sending\" | \"sent\" | \"shopping\" | \"subscription\" | \"todoold\" | \"welcomeuser\" | \"answers\" | \"barcodealert\" | \"briefcase\" | \"emailblocked\" | \"memo\" | \"podium\" | \"subplans\" | \"widgetcourses\" | \"wikis\"",
           "references": {
             "TIllustration": {
               "location": "import",

package/dist/collection/components/grid/grid-calendar/grid-calendar.css

@@ -483,8 +483,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/grid/grid-calendar/grid-calendar.js

@@ -509,9 +509,9 @@ export class YooGridCalendarComponent {
           else {
             const allDay = get(i, 'allDay') === true; //!!get(i, 'rrule') ||;
             let title = this.getEventTitle(i);
-            if (!isWeb(this.host)) {
-              title = title === null || title === void 0 ? void 0 : title.substring(0, 50);
-            }
+            //if (!isWeb(this.host)) {
+            title = title === null || title === void 0 ? void 0 : title.substring(0, 50);
+            //}
             const eventData = {
               title,
               start,

package/dist/collection/components/grid/grid-stack/grid-stack.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/grid/kanban/kanban.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/layout/layout-one-column/layout-one-column.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/layout/layout-sections/layout-sections.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/layout/layout-tabs/layout-tabs.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/layout/layout-two-columns/layout-two-columns.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/map/amap/amap.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/map/map/map.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/map/map-gl/map-gl.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/map/map-legend/map-legend.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/scanner/barcode/barcode.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/scanner/barcode-dialog/barcode-dialog.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/components/scanner/scandit/scandit.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/chat/card-chat/card-chat.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/chat/chat/chat.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/chat/chat/chat.js

@@ -199,11 +199,23 @@ export class YooChatComponent {
       this.hideControls = true;
     }
   }
+  get areAllMessagesLoaded() {
+    var _a;
+    return ((_a = this.messageElements) === null || _a === void 0 ? void 0 : _a.length) === this.messages.length;
+  }
   componentDidLoad() {
     this.initChat();
+    this.shouldScrollBottom = !this.areAllMessagesLoaded;
   }
   componentDidUpdate() {
+    var _a;
     this.updateChat();
+    const forceScroll = !this.lastUpdateElementsCount && !!this.messageElements.length;
+    if (this.shouldScrollBottom || forceScroll) {
+      this.initMessagesAndScrollToBottom();
+      this.shouldScrollBottom = false;
+    }
+    this.lastUpdateElementsCount = (_a = this.messageElements) === null || _a === void 0 ? void 0 : _a.length;
   }
   disconnectedCallback() {
     if (this.requestIntervalID) {

package/dist/collection/feature-communicate/chat/chat-message/chat-message.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/chat/chat-message/chat-message.js

@@ -4,7 +4,7 @@ import { forceUpdate, h, Host } from '@stencil/core';
 import { assignPressActions } from '@yobi/utils/gesture';
 import { convertTags, getDateFormats } from '@yobi/utils/helpers/chat-helpers';
 import { debounce } from 'lodash-es';
-const DEFAULT_VIDEO_DIMENSIONS = { width: 240, height: 175 };
+const DEFAULT_MEDIA_DIMENSIONS = { width: 240, height: 175 };
 export class YooChatMessageComponent {
   constructor() {
     this.lockAssignPress = false;
@@ -144,43 +144,25 @@ export class YooChatMessageComponent {
     }
     if (this.isVideo) {
       getResizedImageSize({
-        imgSize: dimensionData || await this.getVideoDimensions(),
+        imgSize: dimensionData || DEFAULT_MEDIA_DIMENSIONS,
         maxWidth: this.maxWidth
       }).then((dimensions) => {
         this.mediaSize = dimensions;
       }).catch(() => {
-        this.mediaSize = DEFAULT_VIDEO_DIMENSIONS;
+        this.mediaSize = DEFAULT_MEDIA_DIMENSIONS;
       });
     }
     if (this.isImage) {
-      const imgOptions = { ...(dimensionData ? { imgSize: dimensionData } : { src: this.mediaUrl }) };
       getResizedImageSize({
-        ...imgOptions,
+        imgSize: dimensionData || DEFAULT_MEDIA_DIMENSIONS,
         maxWidth: this.maxWidth
       }).then((dimensions) => {
         this.mediaSize = dimensions;
       }).catch(() => {
-        this.mediaSize = DEFAULT_VIDEO_DIMENSIONS;
+        this.mediaSize = DEFAULT_MEDIA_DIMENSIONS;
       });
     }
   }
-  async getVideoDimensions() {
-    const video = document.createElement('video');
-    video.preload = 'metadata';
-    video.src = this.mediaUrl;
-    video.muted = true;
-    video.load();
-    if (isNativeMobile() && isIOS()) {
-      return Promise.resolve(DEFAULT_VIDEO_DIMENSIONS);
-    }
-    return new Promise((resolve) => {
-      video.onloadeddata = () => resolve({
-        width: video.videoWidth,
-        height: video.videoHeight
-      });
-      video.onerror = () => resolve(DEFAULT_VIDEO_DIMENSIONS);
-    });
-  }
   onClickMessageContent(ev) {
     var _a;
     if ((_a = this.message) === null || _a === void 0 ? void 0 : _a.readonly) {
@@ -272,7 +254,7 @@ export class YooChatMessageComponent {
   }
   renderPreviewLinks() {
     var _a;
-    return this.hasPreviewLinks && (h("section", { class: "preview" }, this.renderMoreOptions(), h("yoo-links-preview", { links: [(_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a[0]], showErrors: false, showLinks: false })));
+    return this.hasPreviewLinks && (h("section", { class: "preview" }, this.renderMoreOptions(), h("yoo-links-preview", { links: [(_a = this.linkPreviews) === null || _a === void 0 ? void 0 : _a[0]], inline: true, showErrors: false, showLinks: false })));
   }
   renderGroupMessage() {
     return !this.isMe ? (h("section", { id: "group" }, h("section", { class: "left-column" }, this.renderUser()), h("section", { class: "right-column" }, this.renderUsername(), this.renderDirectMessage()))) : this.renderDirectMessage();

package/dist/collection/feature-communicate/chat/chat-message-dialog/chat-message-dialog.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/chat/chat-message-preview/chat-message-preview.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/document/card-file/card-file.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/document/card-file/card-file.js

@@ -28,9 +28,9 @@ export class YooCardFileComponent {
   get isType() {
     var _a, _b, _c;
     return {
-      image: this.type === 'photo' || ((_a = this.fileType) === null || _a === void 0 ? void 0 : _a.includes('image')) || isImageUrl(this.fileSrc) || isImage(this.fileSrc),
-      video: this.type === 'video' || ((_b = this.fileType) === null || _b === void 0 ? void 0 : _b.includes('video')) || isVideo(this.fileSrc),
-      audio: this.type === 'audio' || ((_c = this.fileType) === null || _c === void 0 ? void 0 : _c.includes('audio')) || isAudio(this.fileSrc)
+      image: this.type === 'photo' || ((_a = this.type) === null || _a === void 0 ? void 0 : _a.includes('image')) || isImageUrl(this.fileSrc) || isImage(this.fileSrc),
+      video: this.type === 'video' || ((_b = this.type) === null || _b === void 0 ? void 0 : _b.includes('video')) || isVideo(this.fileSrc),
+      audio: this.type === 'audio' || ((_c = this.type) === null || _c === void 0 ? void 0 : _c.includes('audio')) || isAudio(this.fileSrc)
     };
   }
   get cardFileActions() {
@@ -60,7 +60,7 @@ export class YooCardFileComponent {
     else {
       this.localFile = this.file;
     }
-    this.fileType = this.type || getType(this.localFile);
+    this.type = this.type || getType(this.localFile);
     this.iconName = getIconName(this.localFile);
     this.iconColor = getIconColor(this.localFile);
   }
@@ -97,7 +97,7 @@ export class YooCardFileComponent {
   }
   render() {
     var _a, _b;
-    return h(Host, { class: { ['with-more']: !!((_a = this.cardFileActions) === null || _a === void 0 ? void 0 : _a.length) }, ...{ type: this.fileType, loading: this.isLoading } }, this.isLoading ? this.renderLoading() : this.renderContent(), !!((_b = this.cardFileActions) === null || _b === void 0 ? void 0 : _b.length) && this.renderMoreIcon());
+    return h(Host, { class: { ['with-more']: !!((_a = this.cardFileActions) === null || _a === void 0 ? void 0 : _a.length) }, ...{ loading: this.isLoading } }, this.isLoading ? this.renderLoading() : this.renderContent(), !!((_b = this.cardFileActions) === null || _b === void 0 ? void 0 : _b.length) && this.renderMoreIcon());
   }
   static get is() { return "yoo-card-file"; }
   static get encapsulation() { return "shadow"; }
@@ -192,7 +192,7 @@ export class YooCardFileComponent {
       },
       "type": {
         "type": "string",
-        "mutable": false,
+        "mutable": true,
         "complexType": {
           "original": "string",
           "resolved": "string",
@@ -205,7 +205,7 @@ export class YooCardFileComponent {
           "text": ""
         },
         "attribute": "type",
-        "reflect": false
+        "reflect": true
       },
       "hideActionSheet": {
         "type": "boolean",

package/dist/collection/feature-communicate/document/card-media/card-media.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/document/card-video/card-video.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/feed/card-feed/default/card-feed.css

@@ -483,8 +483,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/feed/card-feed/row/card-feed-row.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/feed/community-detail/community-detail.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/feed/feed-detail/feed-detail.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-communicate/feed/user-wizard/user-wizard.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-learn/incentive/card-incentive/card-incentive.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-learn/incentive/card-incentive-rank/card-incentive-rank.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.

package/dist/collection/feature-learn/incentive/card-lesson/card-lesson.css

@@ -112,8 +112,6 @@ ________________________________________________________________________________
 /* used for logos */
 /* spacing for padding, margin, etc... */
 /* shadow */
-/* https://web-design-weekly.com/2013/05/12/handy-sass-mixins/ */
-/* Single side border-radius */
 /* Text Direction - ltr / rtl
 $app-direction: multi | rtl | ltr | null (default)
 multi: Both [dir=ltr] and [dir=rtl] are applied to css selectors.