@yoobic/yobi 8.6.0-3 → 8.6.0-5

package/dist/collection/components/1.atoms/breadcrumbs/breadcrumbs.js

@@ -3,25 +3,12 @@ import { forceUpdate, h } from '@stencil/core';
 import { compact, isString } from 'lodash-es';
 export class YooBreadcrumbsComponent {
   constructor() {
-    /**
-     * Set the separator between each items
-     */
     this.separator = '/';
-    /**
-     * Set the maximum number of item to display
-     */
     this.maxVisibleItems = 3;
-    /**
-     * Set to true to show the home icon
-     */
+    this.maxLengthItems = undefined;
     this.showHome = false;
-    /**
-     * Set to false to display long texts
-     */
+    this.homeName = undefined;
     this.truncate = true;
-    /**
-     * Set the path where the current file/folder is located
-     */
     this.items = [];
   }
   async forceUpdate() {

package/dist/collection/components/1.atoms/button/button.js

@@ -8,40 +8,14 @@ import { h, Host } from '@stencil/core';
 import { getAppContext } from '../../../utils/helpers/common-helpers';
 export class YooButtonComponent {
   constructor() {
-    /**
-     * Color to use from the palette.
-     * For more information on colors, see [theming](https://design.yoobic.com/d/0thDzyUFNm97/product#/guidelines/color).
-     */
     this.color = 'light';
-    /**
-     * Type.
-     */
     this.type = 'button';
-    /**
-     * Size.
-     */
     this.size = 'medium';
-    /**
-     * Shape.
-     */
     this.shape = 'rectangular';
-    /**
-     * Property used to control the transparency of the background.
-     */
     this.fill = 'solid';
-    /**
-     * Controls at which point the ripple point occurs:
-     * - If `bounded` the ripple will occur depending on location of click.
-     * - If `unbounded` ripple will be centered.
-     */
     this.rippleType = 'bounded';
-    /**
-     * If `true`, the user can see animations (hover, ripple).
-     */
     this.animated = false;
-    /**
-     * If `true`, the user cannot interact with the button.
-     */
+    this.customColor = undefined;
     this.disabled = false;
   }
   onClick(event) {

package/dist/collection/components/1.atoms/collapsible/collapsible.js

@@ -2,10 +2,6 @@ import { isRTL, translate } from '@shared/utils';
 import { h, Host } from '@stencil/core';
 export class YooCollapsibleComponent {
   constructor() {
-    this.header = '';
-    this.collapsed = true;
-    this.iconSize = 'small';
-    this.hasArrowIcon = true;
     this.showContent = false;
     this.toggleContent = () => {
       var _a, _b;
@@ -44,6 +40,19 @@ export class YooCollapsibleComponent {
         this.outerContainer.firstChild.firstChild.innerText = translate(this.showContent ? 'YOOBICLESS' : 'YOOBICMORE');
       }
     };
+    this.header = '';
+    this.icon = undefined;
+    this.useButton = undefined;
+    this.iconColor = undefined;
+    this.arrowColor = undefined;
+    this.isPdf = undefined;
+    this.collapsed = true;
+    this.iconSize = 'small';
+    this.hasArrowIcon = true;
+    this.toggleWithArrowOnly = undefined;
+    this.isDeletable = undefined;
+    this.size = undefined;
+    this.slotHeader = undefined;
   }
   deleteItem(ev) {
     ev === null || ev === void 0 ? void 0 : ev.stopPropagation();

package/dist/collection/components/1.atoms/empty-state/empty-state.js

@@ -1,6 +1,10 @@
 import { EMPTYSTATE_MAP } from '@shared/interfaces';
 import { getAssetPath, h } from '@stencil/core';
 export class YooEmptyStateComponent {
+  constructor() {
+    this.type = undefined;
+    this.content = undefined;
+  }
   async load() {
     const type = EMPTYSTATE_MAP[this.type] || 'error';
     const path = getAssetPath(`./assets/empty-state/${type}.svg`);

package/dist/collection/components/1.atoms/flag/flag.js

@@ -6,14 +6,9 @@ import { translate } from '@shared/utils';
 import { getAssetPath, h } from '@stencil/core';
 export class YooFlagComponent {
   constructor() {
-    /**
-     *  Country code
-     */
     this.country = 'GB';
-    /**
-     *  Select flag shape, either 'rectangular' | 'circle' | 'square'
-     */
     this.shape = 'square';
+    this.hasShadow = undefined;
   }
   get code() {
     return this.country.toLowerCase() === 'en' ? 'gb' : this.country.toLowerCase();

package/dist/collection/components/1.atoms/flip-card/flip-card.js

@@ -3,6 +3,8 @@ export class YooFlipCardComponent {
   constructor() {
     this.flipDirection = 'vertical';
     this.layout = 'card';
+    this.revealed = undefined;
+    this.cardLoaded = undefined;
   }
   async initCardSize() {
     var _a;

package/dist/collection/components/1.atoms/icon/assets/symbol-defs.svg

@@ -396,6 +396,9 @@
 <symbol id="icon-boost" viewBox="0 0 32 32">
 <path d="M16.011 22.862c2.466 0 4.466-2.031 4.466-4.537s-1.999-4.537-4.466-4.537c-0.868 0-1.802 0.294-2.803 0.881v-6.673c0.036-0.012 1.688-0.339 2.792-0.339 5.891 0 10.667 4.852 10.667 10.838s-4.776 10.838-10.667 10.838c-5.856 0-10.61-4.795-10.666-10.731-0-0.014-0-0.029-0-0.044v-15.892h0.409c3.203 0 5.799 2.61 5.799 5.83v9.916c0.052 2.465 2.033 4.45 4.47 4.45z"></path>
 </symbol>
+<symbol id="icon-pen" viewBox="0 0 32 32">
+<path d="M28 26.072c0.736 0 1.333 0.597 1.333 1.333s-0.597 1.333-1.333 1.333h-24c-0.736 0-1.333-0.597-1.333-1.333s0.597-1.333 1.333-1.333h24zM24.68 2.672c1.092-0.057 2.157 0.35 2.933 1.12 0.774 0.813 1.159 1.922 1.053 3.040-0.061 1.099-0.538 2.133-1.333 2.893v0l-11.827 11.84-0.070 0.057c-0.049 0.035-0.101 0.065-0.157 0.090v0l-0.24 0.133-5.333 1.56c-0.124 0.019-0.25 0.019-0.373 0-0.429 0.017-0.84-0.173-1.104-0.511s-0.35-0.783-0.229-1.195v0l1.667-5.44 0.060-0.123 0.073-0.117c0.036-0.083 0.086-0.16 0.147-0.227v0l11.84-11.787c0.76-0.796 1.795-1.272 2.893-1.333z"></path>
+</symbol>
 <symbol id="icon-brush" viewBox="0 0 32 32">
 <path d="M28 26.072c0.736 0 1.333 0.597 1.333 1.333s-0.597 1.333-1.333 1.333h-24c-0.736 0-1.333-0.597-1.333-1.333s0.597-1.333 1.333-1.333h24zM24.68 2.672c1.092-0.057 2.157 0.35 2.933 1.12 0.774 0.813 1.159 1.922 1.053 3.040-0.061 1.099-0.538 2.133-1.333 2.893v0l-11.827 11.84-0.070 0.057c-0.049 0.035-0.101 0.065-0.157 0.090v0l-0.24 0.133-5.333 1.56c-0.124 0.019-0.25 0.019-0.373 0-0.429 0.017-0.84-0.173-1.104-0.511s-0.35-0.783-0.229-1.195v0l1.667-5.44 0.060-0.123 0.073-0.117c0.036-0.083 0.086-0.16 0.147-0.227v0l11.84-11.787c0.76-0.796 1.795-1.272 2.893-1.333z"></path>
 </symbol>
@@ -855,9 +858,6 @@
 <symbol id="icon-pause" viewBox="0 0 32 32">
 <path d="M16 2.667c-7.36 0-13.333 5.973-13.333 13.333s5.973 13.333 13.333 13.333c7.36 0 13.333-5.973 13.333-13.333s-5.973-13.333-13.333-13.333zM18.667 21.333c-0.736 0-1.333-0.597-1.333-1.333v-8c0-0.736 0.597-1.333 1.333-1.333s1.333 0.597 1.333 1.333v8c0 0.736-0.597 1.333-1.333 1.333zM13.333 21.333c-0.736 0-1.333-0.597-1.333-1.333v-8c0-0.736 0.597-1.333 1.333-1.333s1.333 0.597 1.333 1.333v8c0 0.736-0.597 1.333-1.333 1.333z"></path>
 </symbol>
-<symbol id="icon-pen" viewBox="0 0 32 32">
-<path d="M6.643 20.567c0.103 0 0.199 0.031 0.279 0.085l0.074 0.061 4.286 4.291c0.091 0.091 0.146 0.216 0.146 0.354 0 0.185-0.1 0.346-0.251 0.433l-0.096 0.043-6.422 2.142c-0.047 0.016-0.101 0.025-0.156 0.025-0.139 0-0.265-0.056-0.356-0.146s-0.146-0.216-0.146-0.354l0.007-0.083 0.019-0.076 2.141-6.428c0.068-0.203 0.254-0.346 0.476-0.346zM19.235 7.858c0.102 0 0.198 0.030 0.278 0.082l0.075 0.059 4.281 4.287c0.090 0.090 0.146 0.216 0.146 0.354 0 0.104-0.031 0.2-0.085 0.28l-0.061 0.074-10.346 10.245c-0.090 0.090-0.215 0.146-0.353 0.146-0.104 0-0.199-0.031-0.279-0.085l-0.074-0.061-4.282-4.286c-0.090-0.090-0.146-0.216-0.146-0.354 0-0.104 0.031-0.2 0.085-0.28l0.061-0.074 10.346-10.247c0.092-0.087 0.218-0.141 0.354-0.141zM24.476 4c0.968 0 1.847 0.381 2.495 1 0.636 0.639 1.029 1.521 1.029 2.495s-0.393 1.856-1.029 2.495v0l-0.714 0.718c-0.090 0.090-0.215 0.146-0.353 0.146s-0.263-0.056-0.353-0.146v0l-4.28-4.286c-0.090-0.090-0.146-0.216-0.146-0.354s0.056-0.263 0.146-0.354v0l0.711-0.713c0.649-0.621 1.528-1.002 2.496-1.002z"></path>
-</symbol>
 <symbol id="icon-personal-development" viewBox="0 0 32 32">
 <path d="M4.303 23.34c0.415 0.001 0.814-0.151 1.116-0.425l7.172-6.474c0.213-0.194 0.549-0.19 0.756 0.011l2.412 2.323c1.508 1.385 3.88 1.385 5.388 0l4.038-3.886c0.051-0.049 0.12-0.077 0.192-0.077s0.141 0.028 0.192 0.077l1.912 1.834c0.204 0.196 0.481 0.305 0.769 0.305 0.601-0.001 1.088-0.469 1.089-1.047v-6.26c-0.001-0.579-0.488-1.047-1.089-1.047h-6.53c-0.442-0.002-0.841 0.254-1.010 0.648s-0.073 0.846 0.241 1.145l1.919 1.847c0.051 0.049 0.080 0.116 0.080 0.186s-0.029 0.136-0.080 0.185l-4.032 3.882c-0.213 0.203-0.557 0.203-0.77 0l-2.413-2.323c-1.447-1.407-3.797-1.447-5.294-0.089l-7.174 6.469c-0.487 0.441-0.645 1.124-0.399 1.722s0.846 0.992 1.515 0.994v0.002z"></path>
 </symbol>
@@ -1219,7 +1219,7 @@
 <path d="M21.439 2.996c1.145 0.106 1.981 1.129 1.882 2.281l-0.329 3.706h2.609c1.154 0 2.080 0.947 2.080 2.104s-0.926 2.104-2.080 2.104h-2.983l-0.498 5.607h2.414c1.154 0 2.080 0.947 2.080 2.104s-0.926 2.104-2.080 2.104h-2.788l-0.363 4.083c-0.096 1.080-0.991 1.915-2.072 1.915-0.589-0-1.15-0.253-1.543-0.693-0.389-0.436-0.58-1.015-0.528-1.599l0.329-3.706h-4.383l-0.362 4.073c-0.059 0.75-0.51 1.413-1.187 1.735-0.683 0.326-1.487 0.251-2.1-0.194-0.605-0.439-0.93-1.171-0.858-1.908l0.329-3.706h-2.609c-1.154 0-2.080-0.947-2.080-2.104s0.926-2.104 2.080-2.104h2.983l0.498-5.607h-2.414c-1.154 0-2.080-0.947-2.080-2.104s0.926-2.104 2.080-2.104h2.788l0.363-4.085c0.105-1.152 1.113-2.008 2.261-1.902 1.145 0.106 1.981 1.129 1.882 2.281l-0.329 3.706h4.383l0.363-4.085c0.105-1.152 1.113-2.008 2.261-1.902zM19.548 12.176h-6.418l-0.678 7.634h6.418l0.678-7.634z"></path>
 </symbol>
 <symbol id="icon-condition" viewBox="0 0 32 32">
-<path d="M20.852 29.024c-0.398 0.331-0.951 0.402-1.42 0.182s-0.767-0.691-0.767-1.209v-2.666h-9.333c-3.682 0-6.666-2.985-6.666-6.666v-13.332c0-1.473 1.194-2.666 2.666-2.666h2.666c1.473 0 2.666 1.194 2.666 2.666v11.999h7.999v-2.666c-0.001-0.518 0.298-0.989 0.767-1.209s1.022-0.149 1.42 0.182l6.773 5.64c0.611 0.507 0.965 1.259 0.965 2.053s-0.354 1.547-0.965 2.053l-6.773 5.64z"></path>
+<path d="M6.673 4.667l-0.007 14.627c0 0.184 0.149 0.333 0.333 0.333h13c0.184 0 0.333-0.149 0.333-0.333v-4c-0.003-0.542 0.322-1.031 0.822-1.239s1.077-0.092 1.458 0.293l6.333 6.333c0.252 0.25 0.394 0.591 0.394 0.947s-0.142 0.696-0.394 0.947l-6.373 6.36c-0.249 0.254-0.59 0.399-0.947 0.4-0.736 0-1.333-0.597-1.333-1.333v-4c0.011-0.089-0.013-0.178-0.069-0.248s-0.136-0.115-0.225-0.125h-14.053c-1.812 0-3.28-1.468-3.28-3.28l0.007-15.68c0-1.105 0.896-2 2.001-2s1.999 0.895 1.999 1.999c0 0 0 0.001 0 0.001z"></path>
 </symbol>
 <symbol id="icon-restriction" viewBox="0 0 32 32">
 <path d="M21.899 8.738v5.358c0 0.3-0.247 0.544-0.551 0.544s-0.551-0.244-0.551-0.544v-8.688c0-0.912-0.74-1.652-1.652-1.652s-1.652 0.74-1.652 1.652v7.6c0 0.3-0.247 0.544-0.551 0.544s-0.551-0.244-0.551-0.544v-8.688c0-0.912-0.74-1.652-1.652-1.652s-1.652 0.74-1.652 1.652v8.688c0 0.3-0.247 0.544-0.551 0.544s-0.551-0.244-0.551-0.544v-6.511c0-0.912-0.74-1.652-1.652-1.652s-1.652 0.74-1.652 1.652v11.954l-2.23-3.016c-0.661-1.007-1.95-1.344-2.895-0.767-0.942 0.59-1.175 1.876-0.523 2.88 0 0 3.597 5.38 5.129 7.683s4.016 4.104 8.66 4.104c7.689 0 8.508-5.912 8.508-7.662 0-4.311 0-8.622 0-12.933 0-0.948-0.769-1.717-1.717-1.717s-1.717 0.769-1.717 1.717z"></path>

package/dist/collection/components/1.atoms/icon/collection.js

@@ -710,7 +710,7 @@ export const icons = [
   {
     name: 'condition',
     paths: [
-      'M20.852 29.024c-0.398 0.331-0.951 0.402-1.42 0.182s-0.767-0.691-0.767-1.209v-2.666h-9.333c-3.682 0-6.666-2.985-6.666-6.666v-13.332c0-1.473 1.194-2.666 2.666-2.666h2.666c1.473 0 2.666 1.194 2.666 2.666v11.999h7.999v-2.666c-0.001-0.518 0.298-0.989 0.767-1.209s1.022-0.149 1.42 0.182l6.773 5.64c0.611 0.507 0.965 1.259 0.965 2.053s-0.354 1.547-0.965 2.053l-6.773 5.64z'
+      'M6.673 4.667l-0.007 14.627c0 0.184 0.149 0.333 0.333 0.333h13c0.184 0 0.333-0.149 0.333-0.333v-4c-0.003-0.542 0.322-1.031 0.822-1.239s1.077-0.092 1.458 0.293l6.333 6.333c0.252 0.25 0.394 0.591 0.394 0.947s-0.142 0.696-0.394 0.947l-6.373 6.36c-0.249 0.254-0.59 0.399-0.947 0.4-0.736 0-1.333-0.597-1.333-1.333v-4c0.011-0.089-0.013-0.178-0.069-0.248s-0.136-0.115-0.225-0.125h-14.053c-1.812 0-3.28-1.468-3.28-3.28l0.007-15.68c0-1.105 0.896-2 2.001-2s1.999 0.895 1.999 1.999c0 0 0 0.001 0 0.001z'
     ]
   },
   {
@@ -2156,7 +2156,7 @@ export const icons = [
   {
     name: 'pen',
     paths: [
-      'M6.643 20.567c0.103 0 0.199 0.031 0.279 0.085l0.074 0.061 4.286 4.291c0.091 0.091 0.146 0.216 0.146 0.354 0 0.185-0.1 0.346-0.251 0.433l-0.096 0.043-6.422 2.142c-0.047 0.016-0.101 0.025-0.156 0.025-0.139 0-0.265-0.056-0.356-0.146s-0.146-0.216-0.146-0.354l0.007-0.083 0.019-0.076 2.141-6.428c0.068-0.203 0.254-0.346 0.476-0.346zM19.235 7.858c0.102 0 0.198 0.030 0.278 0.082l0.075 0.059 4.281 4.287c0.090 0.090 0.146 0.216 0.146 0.354 0 0.104-0.031 0.2-0.085 0.28l-0.061 0.074-10.346 10.245c-0.090 0.090-0.215 0.146-0.353 0.146-0.104 0-0.199-0.031-0.279-0.085l-0.074-0.061-4.282-4.286c-0.090-0.090-0.146-0.216-0.146-0.354 0-0.104 0.031-0.2 0.085-0.28l0.061-0.074 10.346-10.247c0.092-0.087 0.218-0.141 0.354-0.141zM24.476 4c0.968 0 1.847 0.381 2.495 1 0.636 0.639 1.029 1.521 1.029 2.495s-0.393 1.856-1.029 2.495v0l-0.714 0.718c-0.090 0.090-0.215 0.146-0.353 0.146s-0.263-0.056-0.353-0.146v0l-4.28-4.286c-0.090-0.090-0.146-0.216-0.146-0.354s0.056-0.263 0.146-0.354v0l0.711-0.713c0.649-0.621 1.528-1.002 2.496-1.002z'
+      'M28 26.072c0.736 0 1.333 0.597 1.333 1.333s-0.597 1.333-1.333 1.333h-24c-0.736 0-1.333-0.597-1.333-1.333s0.597-1.333 1.333-1.333h24zM24.68 2.672c1.092-0.057 2.157 0.35 2.933 1.12 0.774 0.813 1.159 1.922 1.053 3.040-0.061 1.099-0.538 2.133-1.333 2.893v0l-11.827 11.84-0.070 0.057c-0.049 0.035-0.101 0.065-0.157 0.090v0l-0.24 0.133-5.333 1.56c-0.124 0.019-0.25 0.019-0.373 0-0.429 0.017-0.84-0.173-1.104-0.511s-0.35-0.783-0.229-1.195v0l1.667-5.44 0.060-0.123 0.073-0.117c0.036-0.083 0.086-0.16 0.147-0.227v0l11.84-11.787c0.76-0.796 1.795-1.272 2.893-1.333z'
     ]
   },
   {

package/dist/collection/components/1.atoms/icon/icon.js

@@ -3,10 +3,10 @@ import { h, Host } from '@stencil/core';
 import { icons } from './collection';
 export class YooIconComponent {
   constructor() {
-    /**
-     * Defines the icon size
-     */
     this.size = 'medium';
+    this.name = undefined;
+    this.color = undefined;
+    this.customColor = undefined;
   }
   render() {
     var _a, _b, _c;

package/dist/collection/components/1.atoms/img/img.js

@@ -9,68 +9,27 @@ import { getFromOfflineStorage } from '../../../utils/cache/localForage';
 import { cloudinary } from '../../../utils/helpers/common-helpers';
 export class YooImgComponent {
   constructor() {
-    /**
-     * set to true here to prevent from uploading to cloudinary
-     */
     this.allowCloudinary = true;
-    /**
-     * disable the aspect ratio calculation to leave the css doing instead
-     */
     this.disableAspectRatioCalc = false;
-    /**
-     * specify accepted image ratio, default to square, landscape, pano, protrait ..
-     */
     this.scaledUpRatios = [1, 1.33, 0.75, 3];
-    /**
-     * Options passed to the URL source.
-     *
-     * This property only applies for Cloudinary URL source.
-     */
+    this.mediaDimension = undefined;
     this.cloudinaryOptions = {};
-    /**
-     * If `true` and for `default` type, the CSS `object-fit` is set to `contain`, `cover` otherwise.
-     * If `true` and for `background` type, the CSS `background-size` is set to `contain`, `cover` otherwise.
-     */
     this.contained = false;
-    /**
-     * If `true`, it wont take the clientWidth of the component into account
-     *
-     */
+    this.fallbackIcon = undefined;
     this.ignoreWidth = false;
-    /**
-     * If `true`, it wont take the clientHeight of the component into account
-     *
-     */
     this.ignoreHeight = false;
-    /**
-     * If `true`, it entirely fits the parent while it preserves its aspect ratio.
-     *
-     * This property only applies for `default` type.
-     */
     this.scaledUp = false;
-    /**
-     * Options passed to the injected SVG.
-     * For more information, see [SVG options](https://github.com/iconfu/svg-inject#options).
-     *
-     * This property only applies for `default` type and SVG source.
-     */
+    this.scaledUpInWidth = undefined;
+    this.scaledUpHeightPortraitOnly = undefined;
+    this.scaledUpInHeight = undefined;
     this.svgOptions = {};
-    /**
-     * If `true`, it displays a grayish overlay, and the image is still slightly visible.
-     * For `background` type, it does not cover the slot.
-     */
     this.disabled = false;
-    /**
-     * If `true`, it loads the `src` file instantly.
-     */
     this.instant = false;
-    /**
-     * If `default`, it uses the standard `img` tag.
-     * If `background`, it uses a `div` along with a CSS `background-image`.
-     */
+    this.src = undefined;
     this.type = 'default';
+    this.url = undefined;
     this.loading = false;
-    // if the current image is zoom or not
+    this.imageHeightLowerThanContainer = undefined;
     this.zoomed = false;
   }
   get hasCloudinaryOptions() {

package/dist/collection/components/1.atoms/info-text/info-text.js

@@ -4,6 +4,10 @@
  */
 import { h } from '@stencil/core';
 export class YooInfoTextComponent {
+  constructor() {
+    this.text = undefined;
+    this.icon = undefined;
+  }
   render() {
     return h("div", { class: "outer-container" }, this.icon && h("yoo-icon", { name: this.icon, size: "small", color: "stable" }), this.text || '');
   }

package/dist/collection/components/1.atoms/items/items.js

@@ -1,13 +1,7 @@
 import { h } from '@stencil/core';
 export class YooItemsComponent {
   constructor() {
-    /**
-     * Flow.
-     */
     this.flow = 'column';
-    /**
-     * Spacing between each item.
-     */
     this.spacing = 8;
   }
   render() {

package/dist/collection/components/1.atoms/line-state/line-state.js

@@ -7,6 +7,9 @@ export class YooLineState {
       'finished': { iconName: 'check', iconColor: 'app-color', topLineColor: 'app-color', bottomLineColor: 'app-color' },
       'locked': { iconName: 'lock', iconColor: 'stable', topLineColor: 'stable', bottomLineColor: 'stable' }
     };
+    this.state = undefined;
+    this.previousState = undefined;
+    this.nextState = undefined;
   }
   componentWillRender() {
     this.state && this.initLineState();

package/dist/collection/components/1.atoms/link/link.js

@@ -1,14 +1,11 @@
 import { h } from '@stencil/core';
 export class YooLinkComponent {
   constructor() {
-    /**
-     *  If true, the user cannot click on the link
-     */
+    this.href = undefined;
     this.disabled = false;
-    /**
-     * Size of the link (small | medium | large)
-     */
+    this.rel = undefined;
     this.size = 'medium';
+    this.target = undefined;
   }
   render() {
     return (h("a", { href: this.href, rel: this.rel, target: this.target }, h("slot", { name: "start" }), h("yoo-truncate", { id: "text" }, h("slot", null))));

package/dist/collection/components/1.atoms/loader/loader.js

@@ -2,19 +2,11 @@ import { translate } from '@shared/utils';
 import { h, Host } from '@stencil/core';
 export class YooLoaderComponent {
   constructor() {
-    /**
-     * If `true`, it spins.
-     */
     this.animated = true;
-    /**
-     * Color to use from the palette.
-     * For more information on colors, see [theming](https://design.yoobic.com/d/0thDzyUFNm97/product#/guidelines/color).
-     */
     this.color = 'app-color';
-    /**
-     * Size.
-     */
     this.size = 'medium';
+    this.hideIcon = undefined;
+    this.text = undefined;
   }
   render() {
     var _a;

package/dist/collection/components/1.atoms/lottie/lottie.js

@@ -3,25 +3,6 @@ import { Build, getAssetPath, h, Host } from '@stencil/core';
 import lottie from 'lottie-web';
 export class YooLottieComponent {
   constructor() {
-    /**
-     * If `true`, it plays the animation as soon as it is loaded.
-     */
-    this.autoplay = false;
-    /**
-     * Animation will start only if animated is `true`
-     */
-    this.animated = !isChromatic();
-    /**
-     * If `true`, the animation runs infinitely.
-     * If a number, the animation runs for a specific amount of loops.
-     */
-    this.loop = false;
-    /**
-     * Renderer to use for the animation.
-     * For more information, see [Lottie Features](https://github.com/airbnb/lottie-web/wiki/Features).
-     */
-    this.renderer = 'svg';
-    this.shouldRenderPlaceholder = true;
     this.stableFrames = {
       areamanager: 50,
       battle: 50,
@@ -88,6 +69,13 @@ export class YooLottieComponent {
       }
       this.loaded.emit();
     };
+    this.autoplay = false;
+    this.animated = !isChromatic();
+    this.loop = false;
+    this.renderer = 'svg';
+    this.type = undefined;
+    this.initialFrame = undefined;
+    this.shouldRenderPlaceholder = true;
   }
   handleAutoplayChange() {
     this.initialFrame = null;

package/dist/collection/components/1.atoms/markdown/markdown.js

@@ -4,13 +4,10 @@ import { getFromLocalForage } from '../../../utils/cache/localForage';
 import { openImageDetailFromRTE } from '../../../utils/helpers/common-helpers';
 export class YooMarkdownComponent {
   constructor() {
+    this.treatedContent = this.content;
     this.linkPreviews = [];
-    /**
-     * The markdown content to display inside the component
-     */
     this.content = '';
     this.isVisible = true;
-    this.treatedContent = this.content;
   }
   onContentChanged() {
     this.treatedContent = this.content;

package/dist/collection/components/1.atoms/navbar/navbar.js

@@ -4,17 +4,8 @@ import { getAppContext, querySelectorDeep } from '../../../utils/helpers/common-
 import { getElementDimensions } from '../../../utils/helpers/dimensions-helpers';
 export class YooNavbarComponent {
   constructor() {
-    /**
-     * If `true` the title will be centered.
-     */
     this.centerTitle = true;
-    /**
-     * If `true` the navbar will have an extra height for the user to swipe up
-     */
     this.swipeable = false;
-    /**
-     * If `true`, CSS grid will be used.
-     */
     this.grid = false;
   }
   resetCenterStyles() {

package/dist/collection/components/1.atoms/progress-bar/progress-bar.js

@@ -5,79 +5,25 @@ import { getAppContext } from '../../../utils/helpers/common-helpers';
 import { DEFAULT_COLOR_THRESHOLDS, DEFAULT_SHAPES } from './progress-bar.constants';
 export class YooProgressBarComponent {
   constructor() {
-    /**
-     * Used to set custom colors based on custom range of percentage as following
-     * to 30% => var(--danger) || red || rgb(255, 0, 0) || #FF0000,
-     * to 70 => var(--warning) || etc ..
-     */
     this.colorsRepartition = DEFAULT_COLOR_THRESHOLDS;
-    /**
-     * If `true`, the user can see animations.
-     */
+    this.markers = undefined;
     this.animated = true;
-    /**
-     * Used for displaying the proper progressbar shape : can be a line or circle or a semi-circle
-     * This Prop is fundamental otherwise the component won't show
-     */
     this.shape = 'line';
-    /**
-     * This prop apply only for circle & semi-circle progress
-     * Set an angle from 0 to 360
-     * By default, the progress starts from an angle of 90, meaning from the top (eq 12h)
-     */
     this.angle = 90;
-    /**
-     * Used to set the proper unit for the value displayed with the progressbar
-     * the value comes by default in percentage but can be points, step or nothing to display
-     */
     this.metric = 'percentage';
-    /**
-     * Used to set the proper x-position of the value based on the progressbar
-     * the value can be either on the right or on the left of the bar
-     * or in center if in placed on the top or on the bottom of the bar
-     */
     this.horizontalAlign = 'right';
-    /**
-     * Used to set the proper y-position of the value based on the progressbar
-     * the value can be either on the top, the middle or the bottom of the bar
-     */
     this.verticalAlign = 'middle';
-    /**
-     * Used to either display a dynamic value color based on its value (if enabled)
-     * Do the same logic than for the percentProgressColorScheme property
-     */
     this.percentValueColorScheme = false;
-    /**
-     * Used to display or not null progress values
-     * If enabled, a null progress value will come to '-',
-     * if not it will be turn to 0
-     */
     this.allowNonAvailableValue = false;
-    /**
-     * This property allow to hide or not the value
-     */
+    this.maxValue = undefined;
     this.hideProgressValue = false;
-    /**
-     * This property will allow not to see the animation in case of a decreasing progress
-     */
     this.disableBackProgressAnimation = false;
-    /**
-     * This property will allow to receive a boolean type event once the progress has finished
-     */
     this.listenToCompleteProgress = false;
-    /**
-     * This property will allow to receive a number type event corresponding of the actual progress value
-     * in the progress animation
-     */
     this.listenToProgress = false;
-    /**
-     * This property allow to display a number of decimal after the coma in the progress value display
-     */
     this.numberDecimalAfterComaProgressValue = 0;
-    /**
-     * This property allows the progress to display as N/A when the progress is null
-     */
     this.displayNAValue = false;
+    this.progressAnimationDuration = undefined;
+    this.value = undefined;
   }
   onProgressAnimationDurationChanged() {
     this.setProgress();

package/dist/collection/components/1.atoms/progress-loader/progress-loader.js

@@ -7,10 +7,10 @@ import { translate } from '@shared/utils';
 import { h, Host } from '@stencil/core';
 export class YooProgressLoaderComponent {
   constructor() {
-    /**
-     * If `true`, the user can see animations.
-     */
     this.animated = true;
+    this.progress = undefined;
+    this.logo = undefined;
+    this.progressBarClass = undefined;
   }
   render() {
     return h(Host, { class: { [`${this.progressBarClass}-color`]: true } }, h("div", { class: "progress-loader-container" }, h("div", { class: "logo-container" }, h("img", { src: this.logo, height: "75", alt: "YOOBIC Logo" })), h("div", { class: "progress-bar-container" }, h("yoo-progress-bar", { animated: this.animated, value: this.progress })), h("div", { class: "progress-text-container" }, h("span", { class: "progress-text" }, translate('LIVEUPDATEPROGRESS')))));

package/dist/collection/components/1.atoms/range/range.js

@@ -3,65 +3,25 @@ import { clamp, createGesture } from '../../../utils/gesture';
 import { debounceEvent } from '../../../utils/helpers/common-helpers';
 export class YooRangeComponent {
   constructor() {
-    /**
-     * Specify wether the slider should start the min from the left (international)
-     * or from the right.
-     */
+    this.didLoad = false;
+    this.noUpdate = false;
     this.direction = 'ltr';
-    /**
-     * Specify here wether the slider should render horizontally (x)
-     * or vertically (y)
-     */
     this.orientation = 'horizontal';
-    /**
-     * How long, in milliseconds, to wait to trigger the
-     * `valueChanged` event after each change in the range value.
-     * This also impacts form bindings such as `ngModel` or `v-model`.
-     */
     this.debounce = 0;
-    /**
-     * Minimum integer value of the range.
-     */
     this.min = 0;
-    /**
-     * Maximum integer value of the range.
-     */
     this.max = 100;
-    /**
-     * If `true`, a pin with integer value is shown when the knob
-     * is pressed. This prop will only work with the horizontal range
-     */
     this.pin = false;
-    /**
-     * If `true`, the knob snaps to tick marks evenly spaced based
-     * on the step property value.
-     */
     this.snaps = false;
-    /**
-     * Specifies the value granularity.
-     */
     this.step = 1;
-    /**
-     * If `true`, tick marks are displayed based on the step value.
-     * Only applies when `snaps` is `true`.
-     */
     this.ticks = false;
-    /**
-     * If `true`, the user cannot interact with the range.
-     */
+    this.ticksLabels = undefined;
     this.readonly = false;
-    /**
-     * If `true`, the user cannot interact with the range.
-     */
     this.disabled = false;
-    /**
-     * the value of the range.
-     */
     this.value = 0;
+    this.isVisible = undefined;
     this.ratioA = 0;
     this.ratioB = 0;
-    this.didLoad = false;
-    this.noUpdate = false;
+    this.pressedKnob = undefined;
   }
   onDebounceChanged() {
     this.valueChanged = debounceEvent(this.valueChanged, this.debounce);

package/dist/collection/components/1.atoms/ripple-effect/ripple-effect.js

@@ -1,9 +1,6 @@
 import { h, Host, readTask, writeTask } from '@stencil/core';
 export class YooRippleEffectComponent {
   constructor() {
-    /**
-     * Duration of ripple effect in milliseconds.
-     */
     this.duration = 1050;
   }
   /**