@yoobic/yobi 8.2.0-24 → 8.2.0-27

package/dist/cjs/yoo-range.cjs.entry.js

@@ -257,7 +257,7 @@ const YooRangeComponent = class {
     const values = Array.from({ length: this.max - this.min + 1 }, (_, i) => this.min + i).filter(v => !(v % this.step));
     return (this.ticks || this.ticksLabels) && values.map(v => {
       const showTickLabel = filterPattern(v);
-      return (this.ticks || showTickLabel) && index.h("div", { class: { 'tick': true, 'hidden': !this.ticks }, style: { [start]: `${this.valueToRatio(v) * 100}%` }, ...(this.ticksLabels && showTickLabel && { i: v }) });
+      return (this.ticks || showTickLabel) && index.h("div", { class: { tick: true, hidden: !this.ticks }, style: { [start]: `${this.valueToRatio(v) * 100}%` }, ...(this.ticksLabels && showTickLabel && { i: v }) });
     });
   }
   renderBar(start, end) {

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

@@ -240,7 +240,7 @@ export class YooRangeComponent {
     const values = Array.from({ length: this.max - this.min + 1 }, (_, i) => this.min + i).filter(v => !(v % this.step));
     return (this.ticks || this.ticksLabels) && values.map(v => {
       const showTickLabel = filterPattern(v);
-      return (this.ticks || showTickLabel) && h("div", { class: { 'tick': true, 'hidden': !this.ticks }, style: { [start]: `${this.valueToRatio(v) * 100}%` }, ...(this.ticksLabels && showTickLabel && { i: v }) });
+      return (this.ticks || showTickLabel) && h("div", { class: { tick: true, hidden: !this.ticks }, style: { [start]: `${this.valueToRatio(v) * 100}%` }, ...(this.ticksLabels && showTickLabel && { i: v }) });
     });
   }
   renderBar(start, end) {

package/dist/collection/components/2.molecules/audio-player/audio-player.js

@@ -22,12 +22,12 @@ export class YooAudioPlayerComponent {
     this.currentTime = 0;
     this.currentTimeDisplay = '00:00';
   }
-  onSrcChanged() {
-    return this.initPlayer(true);
-  }
   onVisibilityChanged() {
     this.pause();
   }
+  onSrcChanged() {
+    return this.initPlayer(true);
+  }
   async getAudio() {
     return this.audio;
   }
@@ -36,7 +36,7 @@ export class YooAudioPlayerComponent {
     return (_a = this.audio) === null || _a === void 0 ? void 0 : _a.pause();
   }
   async componentWillLoad() {
-    return await this.initPlayer();
+    await this.initPlayer();
   }
   disconnectedCallback() {
     this.pause();
@@ -94,7 +94,7 @@ export class YooAudioPlayerComponent {
       .map((v) => v.toString().padStart(2, '0'))
       .join(':');
   }
-  async togglePlay(ev) {
+  togglePlay(ev) {
     if (ev && this.audio) {
       ev.stopPropagation();
       const { paused, ended, currentTime } = this.audio;
@@ -108,7 +108,11 @@ export class YooAudioPlayerComponent {
       }
     }
   }
-  render() {
+  renderPlayButton() {
+    return h("yoo-button", { disabled: this.disabled, animated: isWeb(this.host), shape: "circular", fill: "transparent", onClick: (ev) => this.togglePlay(ev) },
+      h("yoo-icon", { name: `${this.audio.paused ? 'play' : 'pause'}-audio`, size: "large" }));
+  }
+  renderRange() {
     const pausePlay = (ev) => {
       this.isDragging = !ev;
       this.pause();
@@ -118,12 +122,21 @@ export class YooAudioPlayerComponent {
       this.currentTime = this.audio.currentTime = value !== null && value !== void 0 ? value : 0;
       this.audio.play();
     };
-    return (h(Host, null, [
-      h("yoo-button", { disabled: this.disabled, animated: isWeb(this.host), shape: "circular", fill: "transparent", onClick: (ev) => this.togglePlay(ev) },
-        h("yoo-icon", { name: `${this.audio.paused ? 'play' : 'pause'}-audio`, size: "large" })),
-      h("yoo-range", { max: this.duration, value: this.currentTime, disabled: this.disabled, onValueChanged: (ev) => this.currentTimeDisplay = this.formateTime(ev === null || ev === void 0 ? void 0 : ev.detail), onKnobPressed: () => pausePlay(), onMouseDown: (ev) => pausePlay(ev), onKnobReleased: (ev) => resumePlay(ev === null || ev === void 0 ? void 0 : ev.detail) }),
-      h("div", { class: { 'audio-info': true, 'only-time': this.displayTimeOnly } }, [!this.displayTimeOnly && h("span", null, translate('AUDIO')), h("span", null, this.currentTimeDisplay)])
-    ]));
+    return h("yoo-range", { max: this.duration, value: this.currentTime, disabled: this.disabled, onValueChanged: ({ detail }) => this.currentTimeDisplay = this.formateTime(detail), onKnobPressed: () => pausePlay(), onKnobReleased: ({ detail }) => resumePlay(detail) });
+  }
+  renderInfo() {
+    return h("div", { class: { 'audio-info': true, 'only-time': this.displayTimeOnly } }, [!this.displayTimeOnly &&
+        h("span", null, translate('AUDIO')), h("span", null, this.currentTimeDisplay)
+    ]);
+  }
+  render() {
+    return (h(Host, null,
+      " ",
+      [
+        this.renderPlayButton(),
+        this.renderRange(),
+        this.renderInfo()
+      ]));
   }
   static get is() { return "yoo-audio-player"; }
   static get encapsulation() { return "shadow"; }
@@ -316,10 +329,10 @@ export class YooAudioPlayerComponent {
   }; }
   static get elementRef() { return "host"; }
   static get watchers() { return [{
-      "propName": "src",
-      "methodName": "onSrcChanged"
-    }, {
       "propName": "isVisible",
       "methodName": "onVisibilityChanged"
+    }, {
+      "propName": "src",
+      "methodName": "onSrcChanged"
     }]; }
 }

package/dist/collection/components/2.molecules/calendar/calendar.css

@@ -202,8 +202,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 /* spacing for padding, margin, etc... */
 /* shadow */
 :host {
-  --active-day-circle-size: 2rem;
-  --mobile-days-height: 100%;
   display: block;
   opacity: 1;
 }
@@ -254,7 +252,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   font-weight: var(--font-weight-400, 400);
   font-size: var(--font-size-16, 1rem);
   font-style: normal;
-  line-height: normal;
   text-align: center;
 }
 :host .calendar-container.modern yoo-ion-slide {
@@ -264,6 +261,7 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   display: flex;
   flex: 1;
   flex-direction: row;
+  padding: var(--spacing-04, 0.25rem) 0;
   border-bottom: var(--border-width-01, 0.0625rem) solid var(--stable-40, rgba(173, 173, 173, 0.4));
 }
 :host .week .day {
@@ -273,10 +271,20 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   align-content: center;
   align-items: center;
   justify-content: center;
-  height: 3.75rem;
+  height: 3.5rem;
   text-align: center;
   cursor: pointer;
 }
+:host .week .day.active .day-number {
+  width: 50%;
+  max-width: var(--spacing-24, 1.5rem);
+  padding: 5%;
+}
+:host .week .day:not(.in-range) .day-number:after {
+  display: block;
+  padding-top: 100%;
+  content: "";
+}
 :host .week .day.grey-day {
   opacity: 0.3;
 }
@@ -304,13 +312,10 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   align-content: center;
   align-items: center;
   justify-content: center;
-  width: var(--active-day-circle-size);
-  height: var(--active-day-circle-size);
   font-weight: var(--font-weight-400, 400);
   font-size: var(--font-size-18, 1.125rem);
   font-style: normal;
   line-height: normal;
-  border-radius: 50%;
 }
 :host .week .marker {
   width: 0.375rem;
@@ -392,7 +397,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   font-weight: var(--font-weight-400, 400);
   font-size: var(--font-size-20, 1.25rem);
   font-style: normal;
-  line-height: normal;
 }
 :host .mobile-calendar-header .done {
   margin-right: var(--spacing-08, 0.5rem);
@@ -408,7 +412,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   font-weight: var(--font-weight-400, 400);
   font-size: var(--font-size-16, 1rem);
   font-style: normal;
-  line-height: normal;
 }
 :host .mobile-calendar-header .calendar-tools .calendar-toggle:last-child {
   padding-right: 0.4375rem;
@@ -425,8 +428,12 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   width: 100%;
   color: var(--dark, #000000);
 }
+:host .mobile-days .day-number {
+  width: var(--spacing-16, 1rem);
+  border-radius: 50%;
+}
 :host .mobile-days .in-range .day-number {
-  width: 1.25rem;
+  width: 100%;
   color: var(--light, #ffffff) !important;
   background: var(--app-color, #5a30f4);
   border-radius: 0;
@@ -437,28 +444,11 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   background: none;
 }
 :host .mobile-days .in-range.first-day .day-number {
-  display: flex;
-  flex-direction: row;
-  align-content: center;
-  align-items: center;
-  justify-content: center;
-  width: var(--active-day-circle-size);
-  height: var(--active-day-circle-size);
-  font-weight: var(--font-weight-400, 400);
-  font-size: var(--font-size-18, 1.125rem);
-  font-style: normal;
-  line-height: normal;
-  border-radius: 50%;
-  z-index: 1;
-  color: var(--light, #ffffff);
-  background: var(--app-color, #5a30f4);
-  opacity: 1;
+  border-radius: var(--spacing-08, 0.5rem) 0 0 var(--spacing-08, 0.5rem);
 }
 :host .mobile-days .in-range.first-day:after {
   position: absolute;
   right: 0;
-  left: calc(50% - var(--active-day-circle-size) / 2);
-  height: var(--active-day-circle-size);
   margin-left: 0.8125rem;
   background: var(--app-color, #5a30f4);
   opacity: 0.6;
@@ -469,33 +459,30 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   background: none;
 }
 :host .mobile-days .in-range.last-day .day-number {
+  border-radius: 0 var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0;
+}
+:host .mobile-days .in-range.last-day:before {
+  position: absolute;
+  margin-right: var(--spacing-16, 1rem);
+  background: var(--app-color, #5a30f4);
+  opacity: 0.6;
+  content: "";
+}
+:host .mobile-days .in-range.first-day .day-number, :host .mobile-days .in-range.last-day .day-number {
   display: flex;
   flex-direction: row;
   align-content: center;
   align-items: center;
   justify-content: center;
-  width: var(--active-day-circle-size);
-  height: var(--active-day-circle-size);
   font-weight: var(--font-weight-400, 400);
   font-size: var(--font-size-18, 1.125rem);
   font-style: normal;
   line-height: normal;
-  border-radius: 50%;
   z-index: 1;
   color: var(--light, #ffffff);
   background: var(--app-color, #5a30f4);
   opacity: 1;
 }
-:host .mobile-days .in-range.last-day:before {
-  position: absolute;
-  right: calc(50% - var(--active-day-circle-size) / 2);
-  left: 0;
-  height: var(--active-day-circle-size);
-  margin-right: var(--spacing-16, 1rem);
-  background: var(--app-color, #5a30f4);
-  opacity: 0.6;
-  content: "";
-}
 
 :host([hidden]) {
   display: none;
@@ -529,9 +516,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   background: var(--stable-light, #f1f1f1);
 }
 
-:host(.web) {
-  --active-day-circle-size: 1.625rem;
-}
 :host(.web) .days {
   height: 100%;
 }
@@ -623,7 +607,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   }
 }
 :host([size=extra-small]) {
-  --active-day-circle-size: 1rem;
   width: 100%;
   min-height: unset;
   border: solid 0.0625rem var(--stable-light, #f1f1f1);
@@ -673,7 +656,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
 }
 
 :host([size=small]) {
-  --active-day-circle-size: 1.25rem;
   width: 100%;
   min-height: unset;
   border: solid 0.0625rem var(--stable-light, #f1f1f1);
@@ -714,8 +696,7 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 0.75rem;
-  border-radius: 50%;
+  font-size: var(--font-size-12, 0.75rem);
 }
 :host([size=small]) .week .day.active .day-number {
   background: var(--app-color, #5a30f4);

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

@@ -391,7 +391,7 @@ export class YooFormAutocompleteComponent {
       endDate: search.endDate,
       sortAndFilters: this.sortsAndFilters,
       search: search.search,
-      data: formDynamic.data
+      data: formDynamic === null || formDynamic === void 0 ? void 0 : formDynamic.data
     }).then((ret) => {
       var _a, _b;
       if (search.currentPage === 0) {

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

@@ -1,7 +1,7 @@
 import { StatusBar } from '@capacitor/status-bar';
 import { MediaType, PictureSourceType } from '@ionic-native/camera';
 import { MediaCapture } from '@ionic-native/media-capture';
-import { addFilePrefix, asyncWaterfall, audios, changeExtension, downloadFile, getAsyncExtraData, getFormCapturedFileSize, getMimeType, getSession, hasLargeFile, images, isAndroid, isAudio, isCloudinaryLink, isFile, isGif, isImage, isImageUrl, isIOS, isIphoneX, isLenovo, isNativeFilePath, isNativeMobile, isNullOrUndefined, isOffline, isPhotoEdited, isSafari, isUnsplashUrl, isVideo, isWeb, moveToImageDirectory, pipes, read, showActionSheet, showAlert, showContextMenu, showModal, showToast, translate, translateMulti, updatePathSessionId, videos } from '@shared/utils';
+import { addFilePrefix, asyncWaterfall, audios, changeExtension, downloadFile, getAsyncExtraData, getFormCapturedFileSize, getMimeType, getSession, hasLargeFile, images, isAndroid, isAudio, isCloudinaryLink, isFile, isGif, isImage, isIOS, isIphoneX, isLenovo, isNativeFilePath, isNativeMobile, isNullOrUndefined, isOffline, isPhotoEdited, isSafari, isUnsplashUrl, isVideo, isWeb, moveToImageDirectory, pipes, read, showActionSheet, showAlert, showContextMenu, showModal, showToast, translate, translateMulti, updatePathSessionId, videos } from '@shared/utils';
 import { Build, Component, Element, Event, h, Host, Method, Prop, State, Watch } from '@stencil/core';
 import { assign, assignInWith, clone, compact, intersection, isArray, isNumber, isUndefined, keys } from 'lodash-es';
 import { getPicture, getVideo, getVideoDevices, importMultipleFromLibrary, showAudioRecorder } from '../../../utils/helpers/camera-helpers';
@@ -1166,7 +1166,7 @@ export class YooFormCaptureComponent {
           return file;
         },
         (file) => {
-          if (isImage(file) && !isImageUrl(file)) {
+          if (isImage(file) && typeof file !== 'string') {
             return read(file, 'blob');
           }
           else if (isAudio(file) && !isNativeMobile()) {

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

@@ -229,7 +229,7 @@ export class YooFormCarouselComponent {
       return this.renderVideo(src, index);
     }
     else if (type === 'audio') {
-      return h("yoo-audio-player", { class: "audio-player", src: src });
+      return h("yoo-audio-player", { onClick: ev => ev === null || ev === void 0 ? void 0 : ev.stopPropagation(), class: "audio-player", src: src });
     }
     else if (type === 'document') {
       return h("yoo-form-document", { class: "expanded", isPdf: this.isPdf, extraClass: "feed", showDialog: true, showActionSheet: isNativeMobile() && isPdf(src), document: src });

package/dist/collection/components/form/form-filter-date/form-filter-date.css

@@ -212,8 +212,9 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   font-size: inherit;
 }
 :host yoo-calendar {
-  width: 12.5rem;
-  height: 11.875rem;
+  width: 13rem;
+  height: 13rem;
+  padding: var(--spacing-08, 0.5rem);
 }
 :host yoo-form-input {
   width: 5rem;

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

@@ -1,4 +1,4 @@
-import { debounce, getUUID, isValueATranslationKey, isWeb, translate } from '@shared/utils';
+import { getUUID, isValueATranslationKey, isWeb, translate } from '@shared/utils';
 import { Component, Element, Event, forceUpdate, h, Host, Method, Prop, State, Watch } from '@stencil/core';
 import { isEqual } from 'lodash-es';
 import Sortable from 'sortablejs';
@@ -31,13 +31,6 @@ export class YooFormMultiInputComponent {
     this.dragAndDropPendingEvent = null;
     this.dragAndDropPendingEventTimeout = null;
     this.sortables = [];
-    this.setValueAndEmitChanges = (value, skipValueAssignment = false) => {
-      if (!skipValueAssignment) {
-        this.value = value;
-      }
-      const finalValue = this.isSimpleArray ? this.value[0] : this.value;
-      setValueAndValidateInput(finalValue, this, false, true, true);
-    };
   }
   async reset(keys) {
     this.cells = this.getCells();
@@ -403,13 +396,19 @@ export class YooFormMultiInputComponent {
     if (this.reverseValueDimensions) {
       values = this.arrayTransposing(values);
     }
-    // use debounce to prevent performance issue while typing
-    debounce(this.setValueAndEmitChanges.bind(this), 500)(values);
+    this.setValueAndEmitChanges(values);
   }
   onTranslationValueUpdated(ev) {
     ev.stopPropagation();
     this.translationValueUpdated.emit(ev.detail);
   }
+  setValueAndEmitChanges(value, skipValueAssignment = false) {
+    if (!skipValueAssignment) {
+      this.value = value;
+    }
+    const finalValue = this.isSimpleArray ? this.value[0] : this.value;
+    setValueAndValidateInput(finalValue, this, false, true, true);
+  }
   isLinkedList() {
     return this.columns.some((c) => c.linkedRow);
   }
@@ -516,6 +515,7 @@ export class YooFormMultiInputComponent {
         onFetchCustomData: (ev) => this.onFetchEvent(ev, cell.rowIndex, cell.colIndex, this.fetchCustomData),
         onTranslationValueUpdated: (ev) => this.onTranslationValueUpdated(ev),
         clearable: false,
+        debounce: TagType === 'yoo-form-input' && 500,
         maxHeight: this.host.classList.contains('image-collection') ? 60 : undefined,
         minHeight: this.host.classList.contains('image-collection') ? 60 : undefined,
         customZIndex: TagType === 'yoo-form-text-editor' && 20000 - cell.rowIndex,

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

@@ -3655,11 +3655,6 @@ null: CSS defaults to use the ltr css, and adds [dir=rtl] selectors to override
   height: 100%;
 }
 
-:host(.plans.empty),
-:host(.productbatch.empty) {
-  height: auto;
-}
-
 :host(.photos-tab) .container-base .search-toggle-container {
   display: flex;
   justify-content: center;

package/dist/design-system/yoo-audio-player.entry.js

@@ -31,12 +31,12 @@ const YooAudioPlayerComponent = class {
     this.currentTime = 0;
     this.currentTimeDisplay = '00:00';
   }
-  onSrcChanged() {
-    return this.initPlayer(true);
-  }
   onVisibilityChanged() {
     this.pause();
   }
+  onSrcChanged() {
+    return this.initPlayer(true);
+  }
   async getAudio() {
     return this.audio;
   }
@@ -45,7 +45,7 @@ const YooAudioPlayerComponent = class {
     return (_a = this.audio) === null || _a === void 0 ? void 0 : _a.pause();
   }
   async componentWillLoad() {
-    return await this.initPlayer();
+    await this.initPlayer();
   }
   disconnectedCallback() {
     this.pause();
@@ -103,7 +103,7 @@ const YooAudioPlayerComponent = class {
       .map((v) => v.toString().padStart(2, '0'))
       .join(':');
   }
-  async togglePlay(ev) {
+  togglePlay(ev) {
     if (ev && this.audio) {
       ev.stopPropagation();
       const { paused, ended, currentTime } = this.audio;
@@ -117,7 +117,10 @@ const YooAudioPlayerComponent = class {
       }
     }
   }
-  render() {
+  renderPlayButton() {
+    return h("yoo-button", { disabled: this.disabled, animated: isWeb(this.host), shape: "circular", fill: "transparent", onClick: (ev) => this.togglePlay(ev) }, h("yoo-icon", { name: `${this.audio.paused ? 'play' : 'pause'}-audio`, size: "large" }));
+  }
+  renderRange() {
     const pausePlay = (ev) => {
       this.isDragging = !ev;
       this.pause();
@@ -127,16 +130,24 @@ const YooAudioPlayerComponent = class {
       this.currentTime = this.audio.currentTime = value !== null && value !== void 0 ? value : 0;
       this.audio.play();
     };
-    return (h(Host, null, [
-      h("yoo-button", { disabled: this.disabled, animated: isWeb(this.host), shape: "circular", fill: "transparent", onClick: (ev) => this.togglePlay(ev) }, h("yoo-icon", { name: `${this.audio.paused ? 'play' : 'pause'}-audio`, size: "large" })),
-      h("yoo-range", { max: this.duration, value: this.currentTime, disabled: this.disabled, onValueChanged: (ev) => this.currentTimeDisplay = this.formateTime(ev === null || ev === void 0 ? void 0 : ev.detail), onKnobPressed: () => pausePlay(), onMouseDown: (ev) => pausePlay(ev), onKnobReleased: (ev) => resumePlay(ev === null || ev === void 0 ? void 0 : ev.detail) }),
-      h("div", { class: { 'audio-info': true, 'only-time': this.displayTimeOnly } }, [!this.displayTimeOnly && h("span", null, translate('AUDIO')), h("span", null, this.currentTimeDisplay)])
+    return h("yoo-range", { max: this.duration, value: this.currentTime, disabled: this.disabled, onValueChanged: ({ detail }) => this.currentTimeDisplay = this.formateTime(detail), onKnobPressed: () => pausePlay(), onKnobReleased: ({ detail }) => resumePlay(detail) });
+  }
+  renderInfo() {
+    return h("div", { class: { 'audio-info': true, 'only-time': this.displayTimeOnly } }, [!this.displayTimeOnly &&
+        h("span", null, translate('AUDIO')), h("span", null, this.currentTimeDisplay)
+    ]);
+  }
+  render() {
+    return (h(Host, null, " ", [
+      this.renderPlayButton(),
+      this.renderRange(),
+      this.renderInfo()
     ]));
   }
   get host() { return getElement(this); }
   static get watchers() { return {
-    "src": ["onSrcChanged"],
-    "isVisible": ["onVisibilityChanged"]
+    "isVisible": ["onVisibilityChanged"],
+    "src": ["onSrcChanged"]
   }; }
 };
 YooAudioPlayerComponent.style = audioPlayerCss;

package/dist/design-system/yoo-calendar.entry.js

@@ -4,7 +4,7 @@ import { a as isArray, n as capitalize } from './lodash-b0ad17f3.js';
 import './_commonjsHelpers-f4d11124.js';
 import './index-da54e081.js';
 
-const calendarCss = ":host{--active-day-circle-size:2rem;--mobile-days-height:100%;display:block;opacity:1}:host .unavailable{color:var(--stable, #adadad)}:host .toolbar-tools{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .toolbar-tools yoo-tooltip{padding:0.25rem}:host .toolbar-tools yoo-tooltip yoo-button{padding:0}:host .toolbar-tools h2{font-weight:var(--font-weight-400, 400);text-transform:capitalize}:host .toolbar-tools yoo-button{padding:0.25rem}:host .toolbar-tools .active-day{-ms-flex:1 2 auto;flex:1 2 auto;text-align:center}:host .days{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .week-header{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;min-height:1.875rem;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-14, 0.875rem)}:host .week-header .day{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:0.3125rem;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem);font-style:normal;line-height:normal;text-align:center}:host .calendar-container.modern yoo-ion-slide{width:auto !important}:host .week{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-40, rgba(173, 173, 173, 0.4))}:host .week .day{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.75rem;text-align:center;cursor:pointer}:host .week .day.grey-day{opacity:0.3}:host .week .day.today.active .day-number{color:var(--light, #ffffff);background:var(--app-color, #5a30f4)}:host .week .day.today .day-number{color:var(--app-color, #5a30f4)}:host .week .day.today .marker{background:var(--app-color, #5a30f4)}:host .week .day.single-range .day-number{color:var(--light, #ffffff);background:var(--app-color, #5a30f4)}:host .week .day.active .day-number{color:var(--light, #ffffff);background:var(--dark, #000000)}:host .week .day .day-number{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:var(--active-day-circle-size);height:var(--active-day-circle-size);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-18, 1.125rem);font-style:normal;line-height:normal;border-radius:50%}:host .week .marker{width:0.375rem;height:0.375rem;margin-top:0;margin-bottom:var(--spacing-04, 0.25rem);background:var(--app-color-10, rgba(90, 48, 244, 0.1));border-radius:50%}:host .week.modern .day{-ms-flex-pack:center;justify-content:center;height:auto;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host .week.modern .day .day-inner{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;min-width:var(--spacing-32, 2rem);max-width:var(--spacing-32, 2rem);padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);background-color:var(--light, #ffffff);border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-04, 0.25rem)}:host .week.modern .day .day-inner .title{font-size:var(--font-size-24, 1.5rem)}:host .week.modern .day .day-inner .secondary-title{font-size:var(--font-size-14, 0.875rem)}:host .week.modern .day .day-inner.unavailable{color:var(--stable, #adadad);background-color:var(--stable-light, #f1f1f1)}:host .week.modern .day.active{color:var(--light, #ffffff)}:host .week.modern .day.active .day-inner{background-color:var(--app-color, #5a30f4);border-color:var(--app-color, #5a30f4)}:host .week.modern .day.active .day-inner.unavailable{color:var(--light, #ffffff)}:host .week.modern .day.grey-day{color:var(--stable, #adadad);opacity:1}:host .ion-slide{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .mobile-calendar-header{position:-webkit-sticky;position:sticky;top:0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;width:100%;margin-bottom:1.25rem;background:var(--light, #ffffff);border-top:0.625rem solid var(--light, #ffffff)}:host .mobile-calendar-header .active-month-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .mobile-calendar-header .active-month-container.flex{-ms-flex:1;flex:1}:host .mobile-calendar-header .active-month-container .prev-month{height:1.5rem;padding:0rem 0.3125rem 0rem 1rem}:host .mobile-calendar-header .active-month-container .active-month{color:var(--dark, #000000);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-20, 1.25rem);font-style:normal;line-height:normal}:host .mobile-calendar-header .done{margin-right:var(--spacing-08, 0.5rem)}:host .mobile-calendar-header .calendar-tools{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:end;justify-content:flex-end}:host .mobile-calendar-header .calendar-tools .calendar-toggle{padding-right:var(--spacing-16, 1rem);color:var(--stable-alt, #d0d0d0);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem);font-style:normal;line-height:normal}:host .mobile-calendar-header .calendar-tools .calendar-toggle:last-child{padding-right:0.4375rem}:host .mobile-calendar-header .calendar-tools .calendar-toggle.today:hover{color:var(--app-color, #5a30f4)}:host .mobile-calendar-header .calendar-tools .calendar-toggle.active{color:var(--app-color, #5a30f4)}:host .mobile-days{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;color:var(--dark, #000000)}:host .mobile-days .in-range .day-number{width:1.25rem;color:var(--light, #ffffff) !important;background:var(--app-color, #5a30f4);border-radius:0;opacity:0.6}:host .mobile-days .in-range.first-day{position:relative;background:none}:host .mobile-days .in-range.first-day .day-number{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:var(--active-day-circle-size);height:var(--active-day-circle-size);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-18, 1.125rem);font-style:normal;line-height:normal;border-radius:50%;z-index:1;color:var(--light, #ffffff);background:var(--app-color, #5a30f4);opacity:1}:host .mobile-days .in-range.first-day:after{position:absolute;right:0;left:calc(50% - var(--active-day-circle-size) / 2);height:var(--active-day-circle-size);margin-left:0.8125rem;background:var(--app-color, #5a30f4);opacity:0.6;content:\"\"}:host .mobile-days .in-range.last-day{position:relative;background:none}:host .mobile-days .in-range.last-day .day-number{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:var(--active-day-circle-size);height:var(--active-day-circle-size);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-18, 1.125rem);font-style:normal;line-height:normal;border-radius:50%;z-index:1;color:var(--light, #ffffff);background:var(--app-color, #5a30f4);opacity:1}:host .mobile-days .in-range.last-day:before{position:absolute;right:calc(50% - var(--active-day-circle-size) / 2);left:0;height:var(--active-day-circle-size);margin-right:var(--spacing-16, 1rem);background:var(--app-color, #5a30f4);opacity:0.6;content:\"\"}:host([hidden]){display:none}:host([display-mode=week]) .week{border-bottom:none}:host([display-mode=month]) .calendar-container .swiper-control{padding-top:var(--spacing-16, 1rem)}:host([is-date-picker]){min-height:28.75rem}:host([modern-date-picker]){min-height:0}:host([is-range]) .week .day.grey-day:not(.diff-month){pointer-events:none}:host(.date) .mobile-days .week:last-child{border-bottom:none}:host(.stable-light) .mobile-days .week-header .day{background:var(--stable-light, #f1f1f1)}:host(.web){--active-day-circle-size:1.625rem}:host(.web) .days{height:100%}:host(.web) .days .week-header{margin-right:0.75rem;margin-left:0.75rem}:host(.web) .days yoo-ion-scroll .web-days{margin-bottom:var(--spacing-16, 1rem)}:host(.web) .days yoo-ion-scroll .web-days.hidden{display:none;opacity:0}:host(.web) .days yoo-ion-scroll .web-days.space .week{padding-bottom:var(--spacing-08, 0.5rem)}:host(.web) .days yoo-ion-scroll .active-month{margin-left:var(--spacing-16, 1rem);font-size:var(--font-size-18, 1.125rem)}:host(.web) .days yoo-ion-scroll .active-month.flex{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:0 var(--spacing-04, 0.25rem);font-size:var(--font-size-16, 1rem)}:host(.web) .days yoo-ion-scroll .week .day .day-number{font-size:var(--font-size-14, 0.875rem)}:host(.web) .days yoo-ion-scroll .week .marker{width:0.375rem;height:0.375rem}:host(.web[modern-date-picker]){display:-ms-flexbox;display:flex}:host(.web[modern-date-picker]) .next-month,:host(.web[modern-date-picker]) .prev-month{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.web[modern-date-picker]) .next-month yoo-tag,:host(.web[modern-date-picker]) .prev-month yoo-tag{-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));cursor:pointer}:host(.web[modern-date-picker]) .prev-month{padding-right:var(--spacing-08, 0.5rem)}:host(.web[modern-date-picker]) .next-month{padding-left:var(--spacing-08, 0.5rem)}:host(.web.calendar-picker){min-height:17.3125rem}:host(.web.calendar-picker) .mobile-calendar-header .active-month-container .prev-month{padding:0rem 0.3125rem 0rem 0rem}:host(.web.calendar-picker) .week-header{margin-bottom:var(--spacing-04, 0.25rem)}:host(.web.calendar-picker) .week-header .day{font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day{height:2rem;font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day .day-number{font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day .marker{display:none}:host(.web.calendar-picker) .week .day.active .day-number{background:var(--app-color, #5a30f4)}@media only screen and (max-width: 350px){:host .mobile-calendar-header .calendar-tools .calendar-toggle{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:4rem}}:host([size=extra-small]){--active-day-circle-size:1rem;width:100%;min-height:unset;border:solid 0.0625rem var(--stable-light, #f1f1f1);border-radius:0.125rem}:host([size=extra-small]) div.mobile-calendar-header{margin:1rem 0 0 0;border-top:none}:host([size=extra-small]) div.active-month-container{-ms-flex-pack:justify;justify-content:space-between;width:100%}:host([size=extra-small]) .active-month-container span.prev-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=extra-small]) .active-month-container span.active-month{font-weight:bold;font-size:0.75rem}:host([size=extra-small]) .active-month-container span.next-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=extra-small]) .day-text{color:var(--text-color, #807f83);font-size:0.75rem}:host([size=extra-small]) .week{padding-top:var(--spacing-08, 0.5rem)}:host([size=extra-small]) .week .day{height:unset}:host([size=extra-small]) .week .day div.day-number{font-size:0.75rem;border-radius:0.125rem}:host([size=extra-small]) .week .day.active .day-number{background:var(--app-color, #5a30f4)}:host([size=extra-small]) .in-range.first-day:after,:host([size=extra-small]) .in-range.last-day:before{background:none}:host([size=small]){--active-day-circle-size:1.25rem;width:100%;min-height:unset;border:solid 0.0625rem var(--stable-light, #f1f1f1);border-radius:0.125rem}:host([size=small]) div.mobile-calendar-header{margin:1rem 0 0 0;border-top:none}:host([size=small]) div.active-month-container{-ms-flex-pack:justify;justify-content:space-between;width:100%}:host([size=small]) .active-month-container span.prev-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=small]) .active-month-container span.active-month{font-size:0.75rem}:host([size=small]) .active-month-container span.next-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=small]) .day-text{color:var(--text-color, #807f83);font-size:0.75rem}:host([size=small]) .week{border-bottom:none}:host([size=small]) .week .day{height:unset}:host([size=small]) .week .day div.day-number{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-size:0.75rem;border-radius:50%}:host([size=small]) .week .day.active .day-number{background:var(--app-color, #5a30f4)}:host([size=small]) .in-range.first-day:after,:host([size=small]) .in-range.last-day:before{background:none}:host(.no-border){border:none}:host(.no-margin-top) .mobile-calendar-header{margin-top:0 !important}:host(.padding-bottom){padding-bottom:var(--spacing-08, 0.5rem)}";
+const calendarCss = ":host{display:block;opacity:1}:host .unavailable{color:var(--stable, #adadad)}:host .toolbar-tools{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}:host .toolbar-tools yoo-tooltip{padding:0.25rem}:host .toolbar-tools yoo-tooltip yoo-button{padding:0}:host .toolbar-tools h2{font-weight:var(--font-weight-400, 400);text-transform:capitalize}:host .toolbar-tools yoo-button{padding:0.25rem}:host .toolbar-tools .active-day{-ms-flex:1 2 auto;flex:1 2 auto;text-align:center}:host .days{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .week-header{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;min-height:1.875rem;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-14, 0.875rem)}:host .week-header .day{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:0.3125rem;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem);font-style:normal;text-align:center}:host .calendar-container.modern yoo-ion-slide{width:auto !important}:host .week{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;padding:var(--spacing-04, 0.25rem) 0;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-40, rgba(173, 173, 173, 0.4))}:host .week .day{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;height:3.5rem;text-align:center;cursor:pointer}:host .week .day.active .day-number{width:50%;max-width:var(--spacing-24, 1.5rem);padding:5%}:host .week .day:not(.in-range) .day-number:after{display:block;padding-top:100%;content:\"\"}:host .week .day.grey-day{opacity:0.3}:host .week .day.today.active .day-number{color:var(--light, #ffffff);background:var(--app-color, #5a30f4)}:host .week .day.today .day-number{color:var(--app-color, #5a30f4)}:host .week .day.today .marker{background:var(--app-color, #5a30f4)}:host .week .day.single-range .day-number{color:var(--light, #ffffff);background:var(--app-color, #5a30f4)}:host .week .day.active .day-number{color:var(--light, #ffffff);background:var(--dark, #000000)}:host .week .day .day-number{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-18, 1.125rem);font-style:normal;line-height:normal}:host .week .marker{width:0.375rem;height:0.375rem;margin-top:0;margin-bottom:var(--spacing-04, 0.25rem);background:var(--app-color-10, rgba(90, 48, 244, 0.1));border-radius:50%}:host .week.modern .day{-ms-flex-pack:center;justify-content:center;height:auto;margin-right:var(--spacing-08, 0.5rem);color:var(--dark, #000000)}:host .week.modern .day .day-inner{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;min-width:var(--spacing-32, 2rem);max-width:var(--spacing-32, 2rem);padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);background-color:var(--light, #ffffff);border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-04, 0.25rem)}:host .week.modern .day .day-inner .title{font-size:var(--font-size-24, 1.5rem)}:host .week.modern .day .day-inner .secondary-title{font-size:var(--font-size-14, 0.875rem)}:host .week.modern .day .day-inner.unavailable{color:var(--stable, #adadad);background-color:var(--stable-light, #f1f1f1)}:host .week.modern .day.active{color:var(--light, #ffffff)}:host .week.modern .day.active .day-inner{background-color:var(--app-color, #5a30f4);border-color:var(--app-color, #5a30f4)}:host .week.modern .day.active .day-inner.unavailable{color:var(--light, #ffffff)}:host .week.modern .day.grey-day{color:var(--stable, #adadad);opacity:1}:host .ion-slide{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .mobile-calendar-header{position:-webkit-sticky;position:sticky;top:0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;width:100%;margin-bottom:1.25rem;background:var(--light, #ffffff);border-top:0.625rem solid var(--light, #ffffff)}:host .mobile-calendar-header .active-month-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .mobile-calendar-header .active-month-container.flex{-ms-flex:1;flex:1}:host .mobile-calendar-header .active-month-container .prev-month{height:1.5rem;padding:0rem 0.3125rem 0rem 1rem}:host .mobile-calendar-header .active-month-container .active-month{color:var(--dark, #000000);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-20, 1.25rem);font-style:normal}:host .mobile-calendar-header .done{margin-right:var(--spacing-08, 0.5rem)}:host .mobile-calendar-header .calendar-tools{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-pack:end;justify-content:flex-end}:host .mobile-calendar-header .calendar-tools .calendar-toggle{padding-right:var(--spacing-16, 1rem);color:var(--stable-alt, #d0d0d0);font-weight:var(--font-weight-400, 400);font-size:var(--font-size-16, 1rem);font-style:normal}:host .mobile-calendar-header .calendar-tools .calendar-toggle:last-child{padding-right:0.4375rem}:host .mobile-calendar-header .calendar-tools .calendar-toggle.today:hover{color:var(--app-color, #5a30f4)}:host .mobile-calendar-header .calendar-tools .calendar-toggle.active{color:var(--app-color, #5a30f4)}:host .mobile-days{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;color:var(--dark, #000000)}:host .mobile-days .day-number{width:var(--spacing-16, 1rem);border-radius:50%}:host .mobile-days .in-range .day-number{width:100%;color:var(--light, #ffffff) !important;background:var(--app-color, #5a30f4);border-radius:0;opacity:0.6}:host .mobile-days .in-range.first-day{position:relative;background:none}:host .mobile-days .in-range.first-day .day-number{border-radius:var(--spacing-08, 0.5rem) 0 0 var(--spacing-08, 0.5rem)}:host .mobile-days .in-range.first-day:after{position:absolute;right:0;margin-left:0.8125rem;background:var(--app-color, #5a30f4);opacity:0.6;content:\"\"}:host .mobile-days .in-range.last-day{position:relative;background:none}:host .mobile-days .in-range.last-day .day-number{border-radius:0 var(--spacing-08, 0.5rem) var(--spacing-08, 0.5rem) 0}:host .mobile-days .in-range.last-day:before{position:absolute;margin-right:var(--spacing-16, 1rem);background:var(--app-color, #5a30f4);opacity:0.6;content:\"\"}:host .mobile-days .in-range.first-day .day-number,:host .mobile-days .in-range.last-day .day-number{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-weight:var(--font-weight-400, 400);font-size:var(--font-size-18, 1.125rem);font-style:normal;line-height:normal;z-index:1;color:var(--light, #ffffff);background:var(--app-color, #5a30f4);opacity:1}:host([hidden]){display:none}:host([display-mode=week]) .week{border-bottom:none}:host([display-mode=month]) .calendar-container .swiper-control{padding-top:var(--spacing-16, 1rem)}:host([is-date-picker]){min-height:28.75rem}:host([modern-date-picker]){min-height:0}:host([is-range]) .week .day.grey-day:not(.diff-month){pointer-events:none}:host(.date) .mobile-days .week:last-child{border-bottom:none}:host(.stable-light) .mobile-days .week-header .day{background:var(--stable-light, #f1f1f1)}:host(.web) .days{height:100%}:host(.web) .days .week-header{margin-right:0.75rem;margin-left:0.75rem}:host(.web) .days yoo-ion-scroll .web-days{margin-bottom:var(--spacing-16, 1rem)}:host(.web) .days yoo-ion-scroll .web-days.hidden{display:none;opacity:0}:host(.web) .days yoo-ion-scroll .web-days.space .week{padding-bottom:var(--spacing-08, 0.5rem)}:host(.web) .days yoo-ion-scroll .active-month{margin-left:var(--spacing-16, 1rem);font-size:var(--font-size-18, 1.125rem)}:host(.web) .days yoo-ion-scroll .active-month.flex{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;margin:0;padding:0 var(--spacing-04, 0.25rem);font-size:var(--font-size-16, 1rem)}:host(.web) .days yoo-ion-scroll .week .day .day-number{font-size:var(--font-size-14, 0.875rem)}:host(.web) .days yoo-ion-scroll .week .marker{width:0.375rem;height:0.375rem}:host(.web[modern-date-picker]){display:-ms-flexbox;display:flex}:host(.web[modern-date-picker]) .next-month,:host(.web[modern-date-picker]) .prev-month{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.web[modern-date-picker]) .next-month yoo-tag,:host(.web[modern-date-picker]) .prev-month yoo-tag{-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));cursor:pointer}:host(.web[modern-date-picker]) .prev-month{padding-right:var(--spacing-08, 0.5rem)}:host(.web[modern-date-picker]) .next-month{padding-left:var(--spacing-08, 0.5rem)}:host(.web.calendar-picker){min-height:17.3125rem}:host(.web.calendar-picker) .mobile-calendar-header .active-month-container .prev-month{padding:0rem 0.3125rem 0rem 0rem}:host(.web.calendar-picker) .week-header{margin-bottom:var(--spacing-04, 0.25rem)}:host(.web.calendar-picker) .week-header .day{font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day{height:2rem;font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day .day-number{font-size:var(--font-size-14, 0.875rem)}:host(.web.calendar-picker) .week .day .marker{display:none}:host(.web.calendar-picker) .week .day.active .day-number{background:var(--app-color, #5a30f4)}@media only screen and (max-width: 350px){:host .mobile-calendar-header .calendar-tools .calendar-toggle{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;max-width:4rem}}:host([size=extra-small]){width:100%;min-height:unset;border:solid 0.0625rem var(--stable-light, #f1f1f1);border-radius:0.125rem}:host([size=extra-small]) div.mobile-calendar-header{margin:1rem 0 0 0;border-top:none}:host([size=extra-small]) div.active-month-container{-ms-flex-pack:justify;justify-content:space-between;width:100%}:host([size=extra-small]) .active-month-container span.prev-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=extra-small]) .active-month-container span.active-month{font-weight:bold;font-size:0.75rem}:host([size=extra-small]) .active-month-container span.next-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=extra-small]) .day-text{color:var(--text-color, #807f83);font-size:0.75rem}:host([size=extra-small]) .week{padding-top:var(--spacing-08, 0.5rem)}:host([size=extra-small]) .week .day{height:unset}:host([size=extra-small]) .week .day div.day-number{font-size:0.75rem;border-radius:0.125rem}:host([size=extra-small]) .week .day.active .day-number{background:var(--app-color, #5a30f4)}:host([size=extra-small]) .in-range.first-day:after,:host([size=extra-small]) .in-range.last-day:before{background:none}:host([size=small]){width:100%;min-height:unset;border:solid 0.0625rem var(--stable-light, #f1f1f1);border-radius:0.125rem}:host([size=small]) div.mobile-calendar-header{margin:1rem 0 0 0;border-top:none}:host([size=small]) div.active-month-container{-ms-flex-pack:justify;justify-content:space-between;width:100%}:host([size=small]) .active-month-container span.prev-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=small]) .active-month-container span.active-month{font-size:0.75rem}:host([size=small]) .active-month-container span.next-month{padding:0 0.5rem;color:var(--dark, #000000);cursor:pointer}:host([size=small]) .day-text{color:var(--text-color, #807f83);font-size:0.75rem}:host([size=small]) .week{border-bottom:none}:host([size=small]) .week .day{height:unset}:host([size=small]) .week .day div.day-number{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-size:var(--font-size-12, 0.75rem)}:host([size=small]) .week .day.active .day-number{background:var(--app-color, #5a30f4)}:host([size=small]) .in-range.first-day:after,:host([size=small]) .in-range.last-day:before{background:none}:host(.no-border){border:none}:host(.no-margin-top) .mobile-calendar-header{margin-top:0 !important}:host(.padding-bottom){padding-bottom:var(--spacing-08, 0.5rem)}";
 
 const MONTHS_TO_ADD = 3;
 const YooCalendarComponent = class {

package/dist/design-system/yoo-form-autocomplete.entry.js

@@ -407,7 +407,7 @@ const YooFormAutocompleteComponent = class {
       endDate: search.endDate,
       sortAndFilters: this.sortsAndFilters,
       search: search.search,
-      data: formDynamic.data
+      data: formDynamic === null || formDynamic === void 0 ? void 0 : formDynamic.data
     }).then((ret) => {
       var _a, _b;
       if (search.currentPage === 0) {

package/dist/design-system/yoo-form-capture.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, i as createEvent, h, j as Build, e as Host, g as getElement } from './index-019c1b1a.js';
-import { t as translate, aZ as showToast, dC as getFormCapturedFileSize, ae as showAlert, W as pipes, R as isNullOrUndefined, ai as isImage, ag as isVideo, dv as isAudio, d as isNativeMobile, cb as addFilePrefix, e as isAndroid, ce as moveToImageDirectory, _ as getSession, n as showModal, v as isIOS, u as isIphoneX, bP as StatusBar, dD as isLenovo, af as showActionSheet, dE as updatePathSessionId, o as isWeb, bG as isSafari, E as getAsyncExtraData, dw as isUnsplashUrl, ah as isGif, dg as asyncWaterfall, cc as read, F as isNativeFilePath, aj as downloadFile, am as isFile, dF as getMimeType, bd as isOffline, dG as hasLargeFile, T as translateMulti, dh as showContextMenu, av as isPhotoEdited, aN as isImageUrl, dd as images, dH as audios, de as videos, aw as changeExtension, ar as isCloudinaryLink } from './index-60d331ff.js';
+import { t as translate, aZ as showToast, dC as getFormCapturedFileSize, ae as showAlert, W as pipes, R as isNullOrUndefined, ai as isImage, ag as isVideo, dv as isAudio, d as isNativeMobile, cb as addFilePrefix, e as isAndroid, ce as moveToImageDirectory, _ as getSession, n as showModal, v as isIOS, u as isIphoneX, bP as StatusBar, dD as isLenovo, af as showActionSheet, dE as updatePathSessionId, o as isWeb, bG as isSafari, E as getAsyncExtraData, dw as isUnsplashUrl, ah as isGif, dg as asyncWaterfall, cc as read, F as isNativeFilePath, aj as downloadFile, am as isFile, dF as getMimeType, bd as isOffline, dG as hasLargeFile, T as translateMulti, dh as showContextMenu, av as isPhotoEdited, dd as images, dH as audios, de as videos, aw as changeExtension, ar as isCloudinaryLink } from './index-60d331ff.js';
 import { P as PictureSourceType, M as MediaType, i as importMultipleFromLibrary, g as getPicture, b as getVideo, s as showAudioRecorder, c as MediaCapture, a as getVideoDevices } from './camera-helpers-8ab083cd.js';
 import { k as keys, x as intersection, l as isNumber, a as isArray, a1 as assignInWith, N as assign, c as compact, q as clone, C as isUndefined } from './lodash-b0ad17f3.js';
 import { f as querySelectorAllDeep, q as querySelectorDeep, m as showImageCropper, h as showPhotoEditor, c as showSlidesMedia, b as getAppContext } from './common-helpers-7760f0f6.js';
@@ -1186,7 +1186,7 @@ const YooFormCaptureComponent = class {
           return file;
         },
         (file) => {
-          if (isImage(file) && !isImageUrl(file)) {
+          if (isImage(file) && typeof file !== 'string') {
             return read(file, 'blob');
           }
           else if (isAudio(file) && !isNativeMobile()) {

package/dist/design-system/yoo-form-carousel.entry.js

@@ -240,7 +240,7 @@ const YooFormCarouselComponent = class {
       return this.renderVideo(src, index);
     }
     else if (type === 'audio') {
-      return h("yoo-audio-player", { class: "audio-player", src: src });
+      return h("yoo-audio-player", { onClick: ev => ev === null || ev === void 0 ? void 0 : ev.stopPropagation(), class: "audio-player", src: src });
     }
     else if (type === 'document') {
       return h("yoo-form-document", { class: "expanded", isPdf: this.isPdf, extraClass: "feed", showDialog: true, showActionSheet: isNativeMobile() && isPdf(src), document: src });

package/dist/design-system/yoo-form-filter-date.entry.js

@@ -25,7 +25,7 @@ const isNonRangeAbsolute = (operator) => [FormFilterDateOperator.absoluteOn, For
 const isAbsolute = (operator) => isRangeAbsolute(operator) || isNonRangeAbsolute(operator);
 const isRelative = (operator) => !isAbsolute(operator);
 
-const formFilterDateCss = ":host{--dialog-max-height:initial;--dialog-position:initial;--dialog-width:initial}:host h1{margin:0;color:var(--dark, #000000);font-size:inherit}:host yoo-calendar{width:12.5rem;height:11.875rem}:host yoo-form-input{width:5rem;padding-left:1rem}:host yoo-calendar,:host .input{grid-column:2/2}:host .input:not([hidden]){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .option{display:grid;grid-template-rows:repeat(2, auto);grid-template-columns:auto 1fr;-ms-flex-align:center;align-items:center;-webkit-column-gap:var(--spacing-08, 0.5rem);-moz-column-gap:var(--spacing-08, 0.5rem);column-gap:var(--spacing-08, 0.5rem)}:host .options{display:grid;margin-bottom:var(--spacing-08, 0.5rem)}:host([size=small]) yoo-calendar,:host([size=small]) .input,:host([size=medium]) yoo-calendar,:host([size=medium]) .input{margin-top:var(--spacing-04, 0.25rem)}:host([size=small]) .options,:host([size=medium]) .options{gap:var(--spacing-08, 0.5rem)}:host([size=large]) yoo-calendar,:host([size=large]) .input{margin-top:var(--spacing-08, 0.5rem)}:host([size=large]) .options{gap:var(--spacing-16, 1rem)}";
+const formFilterDateCss = ":host{--dialog-max-height:initial;--dialog-position:initial;--dialog-width:initial}:host h1{margin:0;color:var(--dark, #000000);font-size:inherit}:host yoo-calendar{width:13rem;height:13rem;padding:var(--spacing-08, 0.5rem)}:host yoo-form-input{width:5rem;padding-left:1rem}:host yoo-calendar,:host .input{grid-column:2/2}:host .input:not([hidden]){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .option{display:grid;grid-template-rows:repeat(2, auto);grid-template-columns:auto 1fr;-ms-flex-align:center;align-items:center;-webkit-column-gap:var(--spacing-08, 0.5rem);-moz-column-gap:var(--spacing-08, 0.5rem);column-gap:var(--spacing-08, 0.5rem)}:host .options{display:grid;margin-bottom:var(--spacing-08, 0.5rem)}:host([size=small]) yoo-calendar,:host([size=small]) .input,:host([size=medium]) yoo-calendar,:host([size=medium]) .input{margin-top:var(--spacing-04, 0.25rem)}:host([size=small]) .options,:host([size=medium]) .options{gap:var(--spacing-08, 0.5rem)}:host([size=large]) yoo-calendar,:host([size=large]) .input{margin-top:var(--spacing-08, 0.5rem)}:host([size=large]) .options{gap:var(--spacing-16, 1rem)}";
 
 const suffixes = {
   [FormFilterDateOperator.relativeDay]: 'YOOBICD',