@yoobic/yobi 8.2.0-41 → 8.2.0-42

package/dist/collection/components/3.organisms/mobile-tabbar-more/mobile-tabbar-more.js

@@ -1,63 +1,15 @@
 import { translate } from '@shared/utils';
-import { Component, Event, h, Host, Prop, State, Watch } from '@stencil/core';
+import { Component, Event, h, Host, Prop, State } from '@stencil/core';
 export class YooMobileTabbarMoreComponent {
-  constructor() {
-    this.searchedItems = [];
-  }
-  componentWillLoad() {
-    this.retrievedItems = this.items;
-  }
-  watchItems() {
-    this.retrievedItems = this.items;
-  }
-  onSearchInputChanged(ev) {
-    const searchText = ev.toLowerCase();
-    this.searchedItems = this.items;
-    const searchResults = this.searchedItems.filter((item) => item.text.toLowerCase().includes(searchText));
-    return this.retrievedItems = [...searchResults];
-  }
-  onItemClick(item) {
-    this.itemClicked.emit({ item });
-  }
-  renderSearchInput() {
-    return (h("div", { class: "input" },
-      ' ',
-      h("yoo-form-input", { size: "large", class: "menu", "icon-prefix": "search", hideOptional: true, clearable: false, forceValueUpdate: true, placeholder: translate('SEARCHMODULES'), onInputChanged: (ev) => this.onSearchInputChanged(ev.detail) })));
-  }
-  renderItem(item) {
-    const color = 'app-color';
-    const entry = {
-      subHeading: item.text,
-      iconTopLeft: item.icon,
-      iconTopLeftColor: color
-    };
-    return (h("yoo-card-list-color", { onClick: () => this.onItemClick(item), entry: entry, notif: item.notif }));
-  }
-  renderSuggestedItems() {
-    var _a;
-    return (h("div", { class: "section" },
-      h("div", { class: "section-header" },
-        h("div", { class: "section-title" }, translate('SUGGESTED'))),
-      h("div", { class: "items single suggested", style: { 'grid-template-columns': `repeat(${this.recentItems.length}, 38%) 1px` } }, (_a = this.recentItems) === null || _a === void 0 ? void 0 : _a.map((item) => this.renderItem(item)))));
-  }
-  renderItems() {
-    var _a, _b;
-    return (h("div", { class: "container" },
-      h("div", { class: "section" },
-        !(((_a = this.items) === null || _a === void 0 ? void 0 : _a.length) > 10) && h("div", { class: "section-header empty" }, " "),
-        h("div", { class: { items: true } }, (_b = this.retrievedItems) === null || _b === void 0 ? void 0 : _b.map((item) => {
-          return this.renderItem(item);
-        })))));
-  }
-  renderTopContainer() {
-    var _a;
-    return ((_a = this.items) === null || _a === void 0 ? void 0 : _a.length) > 10 &&
-      h("div", { class: "top-container" }, this.renderSearchInput());
-  }
   render() {
-    return h(Host, null,
-      this.renderTopContainer(),
-      this.renderItems());
+    const items = this.items ? [...this.items.filter((_, index) => index % 2 === 0), ...this.items.filter((_, index) => index % 2 === 1)] : [];
+    return (h(Host, null,
+      items.length > 10 && (h("yoo-form-input", { size: "large", class: "menu", "icon-prefix": "search", hideOptional: true, clearable: false, forceValueUpdate: true, placeholder: translate('SEARCHMODULES'), onInputChanged: ({ detail }) => (this.search = detail) })),
+      h("ul", { hidden: !items.length }, items.map((item) => {
+        var _a;
+        return (h("li", { hidden: this.search && !((_a = item.text) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(this.search.toLowerCase())) },
+          h("yoo-card-list-color", { onClick: () => this.itemClicked.emit(item), entry: { subHeading: item.text, iconTopLeft: item.icon, iconTopLeftColor: 'app-color' }, notif: item.notif })));
+      }))));
   }
   static get is() { return "yoo-mobile-tabbar-more"; }
   static get encapsulation() { return "shadow"; }
@@ -68,26 +20,6 @@ export class YooMobileTabbarMoreComponent {
     "$": ["mobile-tabbar-more.css"]
   }; }
   static get properties() { return {
-    "recentItems": {
-      "type": "unknown",
-      "mutable": false,
-      "complexType": {
-        "original": "IPage[]",
-        "resolved": "IPage[]",
-        "references": {
-          "IPage": {
-            "location": "import",
-            "path": "@shared/interfaces"
-          }
-        }
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Most viewed menu items"
-      }
-    },
     "items": {
       "type": "unknown",
       "mutable": false,
@@ -110,7 +42,7 @@ export class YooMobileTabbarMoreComponent {
     }
   }; }
   static get states() { return {
-    "retrievedItems": {}
+    "search": {}
   }; }
   static get events() { return [{
       "method": "itemClicked",
@@ -123,8 +55,8 @@ export class YooMobileTabbarMoreComponent {
         "text": "When item clicked re routes to item page"
       },
       "complexType": {
-        "original": "{ item: IPage }",
-        "resolved": "{ item: IPage; }",
+        "original": "IPage",
+        "resolved": "IPage",
         "references": {
           "IPage": {
             "location": "import",
@@ -133,8 +65,4 @@ export class YooMobileTabbarMoreComponent {
         }
       }
     }]; }
-  static get watchers() { return [{
-      "propName": "items",
-      "methodName": "watchItems"
-    }]; }
 }

package/dist/collection/components/entities/card-list/color/card-list-color.css

@@ -212,26 +212,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 :host p {
   margin: 0;
 }
-:host p.multi-truncated {
-  overflow: hidden;
-}
-@supports (display: -webkit-box) {
-  :host p.multi-truncated {
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
-  }
-}
-:host p:not(.multi-truncated) {
-  overflow: hidden;
-}
-@supports (display: -webkit-box) {
-  :host p:not(.multi-truncated) {
-    display: -webkit-box;
-    -webkit-line-clamp: 1;
-    -webkit-box-orient: vertical;
-  }
-}
 :host yoo-tooltip {
   height: 100%;
 }
@@ -289,14 +269,30 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   --progress-value-color: var(--success, #3aa76d);
 }
 :host .outer-container .subheading-container {
+  overflow: hidden;
   padding-top: var(--title-padding-top);
   color: var(--dark, #000000);
   text-align: left;
 }
+@supports (display: -webkit-box) {
+  :host .outer-container .subheading-container {
+    display: -webkit-box;
+    -webkit-line-clamp: var(--subheading-line-clamp);
+    -webkit-box-orient: vertical;
+  }
+}
 :host .outer-container .subheading-container-description {
+  overflow: hidden;
   color: var(--stable, #adadad);
   text-align: left;
 }
+@supports (display: -webkit-box) {
+  :host .outer-container .subheading-container-description {
+    display: -webkit-box;
+    -webkit-line-clamp: var(--subheading-description-line-clamp);
+    -webkit-box-orient: vertical;
+  }
+}
 :host .outer-container .subheading-container-description .flex {
   display: flex;
   flex-wrap: nowrap;

package/dist/collection/components/entities/card-list/color/card-list-color.js

@@ -1,5 +1,5 @@
 import { isWeb, translate, translateMulti } from '@shared/utils';
-import { Component, Element, h, Prop } from '@stencil/core';
+import { Component, Element, h, Host, Prop } from '@stencil/core';
 import { isFinite } from 'lodash-es';
 export class YooCardListColorComponent {
   constructor() {
@@ -23,12 +23,12 @@ export class YooCardListColorComponent {
         this.notif && h("yoo-badge", { shape: "dot" })))));
   }
   renderSubHeader() {
-    const { subHeading, subHeadingDescription } = this.entry;
-    return subHeading && h("p", { class: { 'subheading-container': true, 'multi-truncated': !subHeadingDescription }, innerHTML: translateMulti(subHeading) });
+    const { subHeading } = this.entry;
+    return subHeading && h("p", { class: "subheading-container", innerHTML: translateMulti(subHeading) });
   }
   renderSubHeaderDescription() {
-    const { subHeading, subHeadingDescription } = this.entry;
-    return subHeadingDescription && h("p", { class: { 'subheading-container-description': true, 'multi-truncated': !subHeading }, innerHTML: translateMulti(subHeadingDescription) });
+    const { subHeadingDescription } = this.entry;
+    return subHeadingDescription && h("p", { class: "subheading-container-description", innerHTML: translateMulti(subHeadingDescription) });
   }
   renderProgress() {
     const { progress } = this.entry;
@@ -46,9 +46,12 @@ export class YooCardListColorComponent {
       h("yoo-img", { src: imgSrc }))));
   }
   render() {
-    var _a;
+    var _a, _b, _c;
     const TagType = ((_a = this.entry) === null || _a === void 0 ? void 0 : _a.tooltip) ? 'yoo-tooltip' : 'Fragment';
-    return (this.entry && (h(TagType, { hoverable: isWeb(this.host), placement: "bottom", content: translate(this.entry.tooltip) },
+    return (h(Host, { style: {
+        ...(((_b = this.entry) === null || _b === void 0 ? void 0 : _b.subHeading) && { '--subheading-line-clamp': this.entry.subHeadingDescription ? '1' : '2' }),
+        ...(((_c = this.entry) === null || _c === void 0 ? void 0 : _c.subHeadingDescription) && { '--subheading-description-line-clamp': this.entry.subHeading ? '1' : '2' })
+      } }, this.entry && (h(TagType, { hoverable: isWeb(this.host), placement: "bottom", content: translate(this.entry.tooltip) },
       h("div", { class: { 'outer-container': true, 'has-image': !!this.entry.imgSrc } },
         h("div", null,
           this.renderHeader(),
@@ -56,7 +59,7 @@ export class YooCardListColorComponent {
           this.renderSubHeader(),
           this.renderSubHeaderDescription(),
           this.renderImage()),
-        this.renderTags()))));
+        this.renderTags())))));
   }
   static get is() { return "yoo-card-list-color"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/form/form-input/form-input.js

@@ -684,7 +684,7 @@ export class YooFormInputComponent {
     },
     "step": {
       "type": "number",
-      "mutable": false,
+      "mutable": true,
       "complexType": {
         "original": "number",
         "resolved": "number",

package/dist/collection/components/form/form-ranking/form-ranking.js

@@ -222,7 +222,7 @@ export class YooFormRankingComponent {
   }
   render() {
     const values = this.readonly ? this.value : this.values;
-    return ((values === null || values === void 0 ? void 0 : values.length) && (h(Host, { class: getAppContext(this.host) },
+    return (!!(values === null || values === void 0 ? void 0 : values.length) && (h(Host, { class: getAppContext(this.host) },
       h("div", { class: "outer-container", ref: (el) => (this.outerContainerElement = el) }, values.map((value, index) => this.renderItem(value, index))))));
   }
   static get is() { return "yoo-form-ranking"; }

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

@@ -101,7 +101,12 @@ export class YooMapGlComponent {
   disconnectedCallback() {
     this.isDestroyed = true;
     if (this.map) {
-      this.map.remove();
+      try {
+        this.map.remove();
+      }
+      catch (e) {
+        //
+      }
     }
   }
   onToggleFilterGroup(event) {

package/dist/collection/components/map/map-js/map-js.js

@@ -71,7 +71,12 @@ export class YooMapJsComponent {
   disconnectedCallback() {
     this.isDestroyed = true;
     if (this.map) {
-      this.map.remove();
+      try {
+        this.map.remove();
+      }
+      catch (e) {
+        //
+      }
     }
   }
   onToggleFilterGroup(event) {

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

@@ -263,14 +263,27 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 :host .outer-container .top-container .information-container .description-container yoo-button {
   padding: 0 1rem;
 }
-:host .outer-container .tab-container {
-  position: relative;
+:host .outer-container .tab-outer-container {
+  display: flex;
+  flex-direction: column;
   width: 100%;
   max-width: 20rem;
+  height: 100%;
   background: var(--light, #ffffff);
   border-left: 0.0625rem solid var(--stable-40, rgba(173, 173, 173, 0.4));
   transition: 0.3s;
 }
+:host .outer-container .tab-outer-container.collapsed {
+  width: 0;
+  min-width: var(--spacing-48, 3rem) !important;
+}
+:host .outer-container .tab-outer-container:not(.collapsed) {
+  min-width: 15rem;
+}
+:host .outer-container .tab-container {
+  position: relative;
+  width: 100%;
+}
 :host .outer-container .tab-container .collapsible-icon-container {
   position: absolute;
   top: 0.5rem;
@@ -280,14 +293,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   z-index: 10;
   cursor: pointer;
 }
-:host .outer-container .tab-container.collapsed {
-  width: 0;
-  min-width: 48px !important;
-}
-:host .outer-container .tab-container:not(.collapsed) {
-  flex: 1 1 15rem;
-  min-width: 15rem;
-}
 :host .outer-container .bottom-container {
   display: flex;
   height: 100%;

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

@@ -2,6 +2,18 @@ import { debounce, isWeb, pipes, translate, translateMulti } from '@shared/utils
 import { Component, Element, Event, h, Host, Prop } from '@stencil/core';
 import { getAppContext } from '../../../utils/helpers/common-helpers';
 export class YooCommunityDetailComponent {
+  constructor() {
+    this.tabs = [
+      {
+        title: 'MEMBERSCAPITAL',
+        value: 'members'
+      },
+      {
+        title: 'MANAGERS',
+        value: 'managers'
+      }
+    ];
+  }
   componentWillLoad() {
     this.isMobile = !isWeb();
   }
@@ -47,20 +59,12 @@ export class YooCommunityDetailComponent {
         this.renderDescriptionContainer()));
   }
   renderTabSelection() {
-    return h("div", { class: { 'tab-container': true, 'collapsed': this.hideMembersList } },
-      h("div", { class: "collapsible-icon-container", onClick: () => { this.toggleList(); } },
-        h("yoo-icon", { size: "medium", name: "sidebar-right", color: this.hideMembersList ? 'app-color' : 'stable' })),
-      !this.hideMembersList && h("yoo-tabs", { class: "no-margin", tabs: [
-          {
-            title: 'MEMBERSCAPITAL',
-            value: 'members'
-          },
-          {
-            title: 'MANAGERS',
-            value: 'managers'
-          }
-        ], onTabSelected: (ev) => this.membersListChanged.emit({ manager: ev.detail.nextIndex === 1 }) }),
-      !this.hideMembersList && h("slot", { name: "members-grid" }));
+    return (h("div", { class: { 'tab-outer-container': true, 'collapsed': this.hideMembersList } },
+      h("div", { class: "tab-container" },
+        h("div", { class: "collapsible-icon-container", onClick: () => { this.toggleList(); } },
+          h("yoo-icon", { size: "medium", name: "sidebar-right", color: this.hideMembersList ? 'app-color' : 'stable' })),
+        !this.hideMembersList && h("yoo-tabs", { class: "no-margin", tabs: this.tabs, onTabSelected: (ev) => this.membersListChanged.emit({ manager: ev.detail.nextIndex === 1 }) })),
+      !this.hideMembersList && h("slot", { name: "members-grid" })));
   }
   renderBottomContent() {
     return h("div", { class: "bottom-container" },

package/dist/collection/feature-learn/learning/section-list/section-list.css

@@ -356,9 +356,17 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   font-size: var(--font-size-18, 1.125rem);
 }
 :host .sections .section .items .item .item-container .title-container .description {
+  overflow: hidden;
   color: var(--text-color, #807f83);
   font-size: var(--font-size-16, 1rem);
 }
+@supports (display: -webkit-box) {
+  :host .sections .section .items .item .item-container .title-container .description {
+    display: -webkit-box;
+    -webkit-line-clamp: 4;
+    -webkit-box-orient: vertical;
+  }
+}
 :host .sections .section .items .item .item-container .item-actions yoo-context-menu {
   padding: var(--spacing-16, 1rem);
 }

package/dist/collection/feature-learn/learning/section-list/section-list.js

@@ -433,10 +433,8 @@ export class YooSectionListComponent {
       h("div", { class: "item-container", onClick: () => this.itemClicked.emit(item) },
         h("div", { class: "title-container" },
           item.user && h("yoo-avatars", { layout: "list", users: [item.user], size: "small" }),
-          item.title && h("div", { class: "title" },
-            h("yoo-truncated-line", { content: translateMulti(item.title) })),
-          item.text && h("div", { class: "description" },
-            h("yoo-truncated-line", { content: translateMulti(item.text) }))),
+          item.title && h("div", { class: "title" }, translateMulti(item.title)),
+          item.text && h("div", { class: "description" }, translateMulti(item.text))),
         h("div", { class: "info-container" }, item.columns && item.columns.map((column) => this.renderSectionItemColumn(column))),
         !this.disableSortable && !this.isReadonly && h("div", { class: "draggable" },
           h("yoo-icon", { name: "draggable", color: "text-color", size: "medium" })),

package/dist/{esm/button.factory-f5e1bfac.js → design-system/button.factory-9d3f28f4.js}

@@ -1,6 +1,6 @@
-import './index-e34aebe7.js';
+import './index-e1d32573.js';
 import { h } from './index-019c1b1a.js';
-import { T as translateMulti } from './index-0f847c4c.js';
+import { T as translateMulti } from './index-5d0b9eac.js';
 
 const getButton = (button) => {
   return !button.isVisible || button.isVisible() ? (h("yoo-button", { class: button.cssClass, color: button.color || 'light', type: button.type || 'button', size: button.size || 'medium', shape: button.shape || 'rectangular', fill: button.fill || 'solid', rippleType: button.rippleType || 'bounded', disabled: button.disabled === null ? false : button.disabled, animated: button.animated === null ? true : button.animated, onClick: button.handler },

package/dist/design-system/{camera-helpers-e06051d4.js → camera-helpers-1eb72249.js}

@@ -1,4 +1,4 @@
-import { c3 as cordova, c4 as IonicNativePlugin, cf as cordovaPropertyGet, cg as cordovaPropertySet, ch as registerPlugin, _ as getSession, ci as isIonic, d as isNativeMobile, cj as Device, e as isAndroid, v as isIOS, ck as getMediaDevices, n as showModal, m as getModalAnimation, o as isWeb } from './index-0f847c4c.js';
+import { c3 as cordova, c4 as IonicNativePlugin, cf as cordovaPropertyGet, cg as cordovaPropertySet, ch as registerPlugin, _ as getSession, ci as isIonic, d as isNativeMobile, cj as Device, e as isAndroid, v as isIOS, ck as getMediaDevices, n as showModal, m as getModalAnimation, o as isWeb } from './index-5d0b9eac.js';
 
 var __extends$2 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
@@ -205,7 +205,7 @@ var CameraResultType;
 })(CameraResultType || (CameraResultType = {}));
 
 const Camera = registerPlugin('Camera', {
-    web: () => import('./web-e5d5bd5b.js').then(m => new m.CameraWeb()),
+    web: () => import('./web-03ab374a.js').then(m => new m.CameraWeb()),
 });
 
 var __extends = (undefined && undefined.__extends) || (function () {

package/dist/{esm/chat-helpers-f7ca5471.js → design-system/chat-helpers-9510f4a3.js}

@@ -1,4 +1,4 @@
-import { al as is24Hour, am as isFile, n as showModal, o as isWeb } from './index-0f847c4c.js';
+import { al as is24Hour, am as isFile, n as showModal, o as isWeb } from './index-5d0b9eac.js';
 import { a as isArray } from './lodash-b0ad17f3.js';
 
 /**

package/dist/{esm/common-helpers-a1391bcf.js → design-system/common-helpers-39dfc32d.js}

@@ -1,4 +1,4 @@
-import { m as getModalAnimation, t as translate, n as showModal, o as isWeb, p as debounce, q as querySelectorDeep$1, d as isNativeMobile, S as ScreenOrientation, r as findParent, u as isIphoneX, f as isIpadPro, j as isTablet, c as isFullScreenFalse, v as isIOS, e as isAndroid, w as setAnimation, x as animations, y as getCssColor, Y as YOOBICON_ENTITIES_MAP, z as startOf, A as isDateBefore, B as dateDiffInCalendarDays, D as isDateAfter, E as getAsyncExtraData, F as isNativeFilePath, G as cleanupWKWebViewFilePath, k as Cloudinary, H as getProtocol, C as CloudinaryGradientLayer } from './index-0f847c4c.js';
+import { m as getModalAnimation, t as translate, n as showModal, o as isWeb, p as debounce, q as querySelectorDeep$1, d as isNativeMobile, S as ScreenOrientation, r as findParent, u as isIphoneX, f as isIpadPro, j as isTablet, c as isFullScreenFalse, v as isIOS, e as isAndroid, w as setAnimation, x as animations, y as getCssColor, Y as YOOBICON_ENTITIES_MAP, z as startOf, A as isDateBefore, B as dateDiffInCalendarDays, D as isDateAfter, E as getAsyncExtraData, F as isNativeFilePath, G as cleanupWKWebViewFilePath, k as Cloudinary, H as getProtocol, C as CloudinaryGradientLayer } from './index-5d0b9eac.js';
 import { A as get } from './lodash-b0ad17f3.js';
 
 function getDefaultModalAnimation() {