@yoobic/yobi 8.5.0-60 → 8.5.0-62

package/dist/cjs/yoo-form-time.cjs.entry.js

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const formInputHelpers = require('./form-input-helpers-2d988e31.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-7790c794.js');
+const formInputHelpers = require('./form-input-helpers-fb275467.js');
+const index$1 = require('./index-4cdf7949.js');
 require('./lodash-a9050d79.js');
-require('./index-a1bbe627.js');
-require('./common-helpers-9f63a319.js');
+require('./index-cb8276bc.js');
+require('./common-helpers-0724ae60.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formTimeCss = "svg:not(:root){overflow:hidden}:host{--margin:var(--spacing-16, 1rem);--spacing:var(--spacing-16, 1rem);display:-ms-flexbox;display:flex}:host .outer-container{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:row;flex-direction:row;margin:0 var(--spacing-16, 1rem);border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-04, 0.25rem)}:host .outer-container.focused{border:var(--border-width-01, 0.0625rem) solid var(--dark, #000000)}:host .outer-container .flex{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1}:host .outer-container .input-container input{display:inline-block;-webkit-box-sizing:content-box;box-sizing:content-box;min-width:0;margin:0;padding:0;font-family:var(--font-family, \"Lato\");line-height:1;white-space:normal;vertical-align:middle;background:none;border:0;width:100%;height:2.5rem;padding-left:var(--spacing-16, 1rem);color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem);line-height:1.5;vertical-align:unset;background:var(--light, #ffffff);border:none;border-radius:var(--border-radius-04, 0.25rem)}:host .outer-container .input-container input:focus{outline:0}:host .outer-container .input-container input[type=reset],:host .outer-container .input-container input[type=button],:host .outer-container .input-container input[type=submit],:host .outer-container .input-container input[type=checkbox],:host .outer-container .input-container input[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box}:host .outer-container .input-container input[type=search]{-webkit-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}:host .outer-container .input-container input.native{padding:0 var(--spacing-16, 1rem)}:host .outer-container .icon-prefix,:host .outer-container .icon-suffix{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;color:var(--dark, #000000)}:host .outer-container .icon-prefix{-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);font-size:var(--font-size-16, 1rem)}:host .outer-container .icon-suffix{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding-right:var(--spacing-16, 1rem)}:host .outer-container .icon-suffix.clear{padding-right:var(--spacing-08, 0.5rem)}:host .time-input-container{margin:var(--margin)}:host .time-input-container .time-input-header{padding-bottom:var(--spacing-08, 0.5rem)}:host .time-input-container .time-inputs{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-wrap:wrap;flex-wrap:wrap}:host .time-input-container .time-inputs .hours-container,:host .time-input-container .time-inputs .minutes-container,:host .time-input-container .time-inputs .am-pm-container{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:4.375rem;height:2.5rem;padding:var(--spacing-08, 0.5rem);border:solid var(--border-width-01, 0.0625rem) var(--stable-alt, #d0d0d0);border-radius:0.3125rem}:host .time-input-container .time-inputs .hours-container input,:host .time-input-container .time-inputs .minutes-container input,:host .time-input-container .time-inputs .am-pm-container input{text-align:center}:host .time-input-container .time-inputs .hours-container .time-controls-container,:host .time-input-container .time-inputs .minutes-container .time-controls-container,:host .time-input-container .time-inputs .am-pm-container .time-controls-container{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;font-size:var(--font-size-12, 0.75rem)}:host .time-input-container .time-inputs .hours-container .time-controls-container .time-control-up,:host .time-input-container .time-inputs .hours-container .time-controls-container .time-control-down,:host .time-input-container .time-inputs .minutes-container .time-controls-container .time-control-up,:host .time-input-container .time-inputs .minutes-container .time-controls-container .time-control-down,:host .time-input-container .time-inputs .am-pm-container .time-controls-container .time-control-up,:host .time-input-container .time-inputs .am-pm-container .time-controls-container .time-control-down{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;color:var(--dark, #000000);cursor:pointer}:host .time-input-container .time-inputs .hours-container .time-controls-container .time-control-up yoo-icon,:host .time-input-container .time-inputs .hours-container .time-controls-container .time-control-down yoo-icon,:host .time-input-container .time-inputs .minutes-container .time-controls-container .time-control-up yoo-icon,:host .time-input-container .time-inputs .minutes-container .time-controls-container .time-control-down yoo-icon,:host .time-input-container .time-inputs .am-pm-container .time-controls-container .time-control-up yoo-icon,:host .time-input-container .time-inputs .am-pm-container .time-controls-container .time-control-down yoo-icon{font-weight:var(--font-weight-700, 700)}:host .time-input-container .time-inputs .hours-container .input-hours,:host .time-input-container .time-inputs .hours-container .input-minutes,:host .time-input-container .time-inputs .hours-container .input-am-pm,:host .time-input-container .time-inputs .minutes-container .input-hours,:host .time-input-container .time-inputs .minutes-container .input-minutes,:host .time-input-container .time-inputs .minutes-container .input-am-pm,:host .time-input-container .time-inputs .am-pm-container .input-hours,:host .time-input-container .time-inputs .am-pm-container .input-minutes,:host .time-input-container .time-inputs .am-pm-container .input-am-pm{display:inline-block;-webkit-box-sizing:content-box;box-sizing:content-box;min-width:0;margin:0;padding:0;font-family:var(--font-family, \"Lato\");line-height:1;white-space:normal;vertical-align:middle;background:none;border:0;max-width:2.0625rem;color:var(--dark, #000000)}:host .time-input-container .time-inputs .hours-container .input-hours:focus,:host .time-input-container .time-inputs .hours-container .input-minutes:focus,:host .time-input-container .time-inputs .hours-container .input-am-pm:focus,:host .time-input-container .time-inputs .minutes-container .input-hours:focus,:host .time-input-container .time-inputs .minutes-container .input-minutes:focus,:host .time-input-container .time-inputs .minutes-container .input-am-pm:focus,:host .time-input-container .time-inputs .am-pm-container .input-hours:focus,:host .time-input-container .time-inputs .am-pm-container .input-minutes:focus,:host .time-input-container .time-inputs .am-pm-container .input-am-pm:focus{outline:0}:host .time-input-container .time-inputs .hours-container .input-hours[type=reset],:host .time-input-container .time-inputs .hours-container .input-hours[type=button],:host .time-input-container .time-inputs .hours-container .input-hours[type=submit],:host .time-input-container .time-inputs .hours-container .input-hours[type=checkbox],:host .time-input-container .time-inputs .hours-container .input-hours[type=radio],:host .time-input-container .time-inputs .hours-container .input-minutes[type=reset],:host .time-input-container .time-inputs .hours-container .input-minutes[type=button],:host .time-input-container .time-inputs .hours-container .input-minutes[type=submit],:host .time-input-container .time-inputs .hours-container .input-minutes[type=checkbox],:host .time-input-container .time-inputs .hours-container .input-minutes[type=radio],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=reset],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=button],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=submit],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=checkbox],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=radio],:host .time-input-container .time-inputs .minutes-container .input-hours[type=reset],:host .time-input-container .time-inputs .minutes-container .input-hours[type=button],:host .time-input-container .time-inputs .minutes-container .input-hours[type=submit],:host .time-input-container .time-inputs .minutes-container .input-hours[type=checkbox],:host .time-input-container .time-inputs .minutes-container .input-hours[type=radio],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=reset],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=button],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=submit],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=checkbox],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=radio],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=reset],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=button],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=submit],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=checkbox],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=radio],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=reset],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=button],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=submit],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=checkbox],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=radio],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=reset],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=button],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=submit],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=checkbox],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=radio],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=reset],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=button],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=submit],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=checkbox],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=radio]{-webkit-box-sizing:border-box;box-sizing:border-box}:host .time-input-container .time-inputs .hours-container .input-hours[type=search],:host .time-input-container .time-inputs .hours-container .input-minutes[type=search],:host .time-input-container .time-inputs .hours-container .input-am-pm[type=search],:host .time-input-container .time-inputs .minutes-container .input-hours[type=search],:host .time-input-container .time-inputs .minutes-container .input-minutes[type=search],:host .time-input-container .time-inputs .minutes-container .input-am-pm[type=search],:host .time-input-container .time-inputs .am-pm-container .input-hours[type=search],:host .time-input-container .time-inputs .am-pm-container .input-minutes[type=search],:host .time-input-container .time-inputs .am-pm-container .input-am-pm[type=search]{-webkit-box-sizing:content-box;box-sizing:content-box;-webkit-appearance:textfield}:host .time-input-container .time-inputs yoo-button{margin-top:var(--spacing-16, 1rem)}:host .time-input-container .time-inputs .minutes-container{margin:0 var(--spacing)}";
@@ -37,7 +37,7 @@ const YooFormTimeComponent = class {
       date.setHours(+selectedHours + hourDelay);
       date.setMinutes(+selectedMinutes);
       this.setAmPm(date);
-      formInputHelpers.setValueAndValidateInput(overlays.dateFormat(date, 'YYYY-MM-DDTHH:mm'), this);
+      formInputHelpers.setValueAndValidateInput(index$1.dateFormat(date, 'YYYY-MM-DDTHH:mm'), this);
       this.closePicker.emit(true);
     };
   }
@@ -46,67 +46,67 @@ const YooFormTimeComponent = class {
   }
   componentWillLoad() {
     formInputHelpers.setValidator(this);
-    this.is24Hour = overlays.is24Hour();
+    this.is24Hour = index$1.is24Hour();
     if (!this.value) {
       this.value = new Date();
     }
     if (this.minuteInterval === 60) {
-      this.value = overlays.setDateMinutes(this.value, 0);
-      this.value = overlays.setDateSeconds(this.value, 0);
-      this.value = overlays.setDateMilliseconds(this.value, 0);
+      this.value = index$1.setDateMinutes(this.value, 0);
+      this.value = index$1.setDateSeconds(this.value, 0);
+      this.value = index$1.setDateMilliseconds(this.value, 0);
     }
     this.setAmPm(this.value);
   }
   incrementValue(date = new Date(), timePortion = 'h') {
     let incrementedTime;
     const minutesIncr = this.minuteInterval;
-    date = overlays.roundToNearestMinutes(date, minutesIncr);
+    date = index$1.roundToNearestMinutes(date, minutesIncr);
     if (timePortion === 'ampm') {
       incrementedTime = this.toggleAmPm(date);
     }
     else if (timePortion === 'h') {
-      incrementedTime = overlays.dateAdd(date, 'h', 1);
+      incrementedTime = index$1.dateAdd(date, 'h', 1);
     }
     else if (timePortion === 'min') {
-      incrementedTime = overlays.dateAdd(date, 'mm', minutesIncr);
+      incrementedTime = index$1.dateAdd(date, 'mm', minutesIncr);
     }
     // Need to check whether we have a max date when incrementing and only set the value
     // if we are not going over, otherwise we set the maxDate
-    const maxDate = this.maxDate ? overlays.roundToNearestMinutes(this.maxDate, minutesIncr, true) : null;
-    if (maxDate && overlays.isDateAfter(incrementedTime, maxDate)) {
+    const maxDate = this.maxDate ? index$1.roundToNearestMinutes(this.maxDate, minutesIncr, true) : null;
+    if (maxDate && index$1.isDateAfter(incrementedTime, maxDate)) {
       incrementedTime = maxDate;
     }
     if (['h', 'min'].includes(timePortion)) {
       this.setAmPm(incrementedTime);
     }
-    formInputHelpers.setValueAndValidateInput(overlays.dateFormat(incrementedTime, 'YYYY-MM-DDTHH:mm'), this);
+    formInputHelpers.setValueAndValidateInput(index$1.dateFormat(incrementedTime, 'YYYY-MM-DDTHH:mm'), this);
   }
   decrementValue(date = new Date(), timePortion = 'h') {
     let decrementedTime;
     const minutesIncr = this.minuteInterval;
-    date = overlays.roundToNearestMinutes(date, minutesIncr);
+    date = index$1.roundToNearestMinutes(date, minutesIncr);
     if (timePortion === 'ampm') {
       decrementedTime = this.toggleAmPm(date);
     }
     else if (timePortion === 'h') {
-      decrementedTime = overlays.dateSub(date, 'h', 1);
+      decrementedTime = index$1.dateSub(date, 'h', 1);
     }
     else if (timePortion === 'min') {
-      decrementedTime = overlays.dateSub(date, 'mm', minutesIncr);
+      decrementedTime = index$1.dateSub(date, 'mm', minutesIncr);
     }
     // Need to check whether we have a min date when decrementing and only set the value
     // if we are not going under, otherwise we set the minDate
-    const minDate = this.minDate ? overlays.roundToNearestMinutes(this.minDate, minutesIncr) : null;
-    if (minDate && overlays.isDateBefore(decrementedTime, minDate)) {
+    const minDate = this.minDate ? index$1.roundToNearestMinutes(this.minDate, minutesIncr) : null;
+    if (minDate && index$1.isDateBefore(decrementedTime, minDate)) {
       decrementedTime = minDate;
     }
     if (['h', 'min'].includes(timePortion)) {
       this.setAmPm(decrementedTime);
     }
-    formInputHelpers.setValueAndValidateInput(overlays.dateFormat(decrementedTime, 'YYYY-MM-DDTHH:mm'), this);
+    formInputHelpers.setValueAndValidateInput(index$1.dateFormat(decrementedTime, 'YYYY-MM-DDTHH:mm'), this);
   }
   isAm(date) {
-    return overlays.getHours(date) < 12;
+    return index$1.getHours(date) < 12;
   }
   setAmPm(date) {
     if (!this.is24Hour) {
@@ -118,11 +118,11 @@ const YooFormTimeComponent = class {
     if (!this.is24Hour) {
       if (this.timePeriod === 'AM') {
         this.timePeriod = 'PM';
-        result = overlays.dateAdd(date, 'h', 12);
+        result = index$1.dateAdd(date, 'h', 12);
       }
       else if (this.timePeriod === 'PM') {
         this.timePeriod = 'AM';
-        result = overlays.dateSub(date, 'h', 12);
+        result = index$1.dateSub(date, 'h', 12);
       }
       this.amPmToggled.emit(this.timePeriod);
     }
@@ -138,10 +138,10 @@ const YooFormTimeComponent = class {
     return (index.h("div", { class: "am-pm-container" }, index.h("input", { name: "time", class: "input-am-pm", type: "text", value: this.timePeriod, required: this.required, readonly: true }), this.renderTimeControls('ampm')));
   }
   getDisplayHours(value) {
-    let hours = overlays.getHours(value);
+    let hours = index$1.getHours(value);
     if (!this.is24Hour) {
       // e.g. 03:30 PM
-      const amPmTime = overlays.dateFormat(this.value ? this.value : new Date(), 'hh:mm a');
+      const amPmTime = index$1.dateFormat(this.value ? this.value : new Date(), 'hh:mm a');
       if (amPmTime) {
         const splitTime = amPmTime.split(':');
         hours = splitTime[0];
@@ -150,19 +150,19 @@ const YooFormTimeComponent = class {
     return hours;
   }
   renderMinutesInput() {
-    return (index.h("div", { class: "minutes-container" }, index.h("input", { name: "minutes", ref: (el) => (this.minutesInput = el), class: "input-minutes", type: "text", value: overlays.getRoundedMinutes(this.value || new Date(), this.minuteInterval), required: this.required, readonly: true }), this.minuteInterval < 60 && this.renderTimeControls('min')));
+    return (index.h("div", { class: "minutes-container" }, index.h("input", { name: "minutes", ref: (el) => (this.minutesInput = el), class: "input-minutes", type: "text", value: index$1.getRoundedMinutes(this.value || new Date(), this.minuteInterval), required: this.required, readonly: true }), this.minuteInterval < 60 && this.renderTimeControls('min')));
   }
   renderHoursInput() {
     return (index.h("div", { class: "hours-container" }, index.h("input", { name: "hours", ref: (el) => (this.hoursInput = el), class: "input-hours", type: "text", value: this.value ? this.getDisplayHours(this.value) : this.getDisplayHours(new Date()), required: this.required, readonly: true }), this.renderTimeControls('h')));
   }
   renderAddButton() {
-    return (index.h("yoo-button", { color: "app-color", class: "expanded", onClick: this.setCurrentTime }, overlays.translate('YOOBICADD')));
+    return (index.h("yoo-button", { color: "app-color", class: "expanded", onClick: this.setCurrentTime }, index$1.translate('YOOBICADD')));
   }
   renderReadonly() {
-    return index.h("div", { class: "readonly" }, overlays.pipes.dateFormat.transform(this.value, 'LT'));
+    return index.h("div", { class: "readonly" }, index$1.pipes.dateFormat.transform(this.value, 'LT'));
   }
   renderEditable() {
-    return (index.h("div", { class: "time-input-container" }, index.h("div", { class: "time-input-header" }, overlays.translate('YOOBICTIME')), index.h("div", { class: "flex time-inputs" }, this.renderHoursInput(), this.renderMinutesInput(), !this.is24Hour && this.renderAmPmContainer(), this.type === 'time' && this.renderAddButton())));
+    return (index.h("div", { class: "time-input-container" }, index.h("div", { class: "time-input-header" }, index$1.translate('YOOBICTIME')), index.h("div", { class: "flex time-inputs" }, this.renderHoursInput(), this.renderMinutesInput(), !this.is24Hour && this.renderAmPmContainer(), this.type === 'time' && this.renderAddButton())));
   }
   render() {
     return this.readonly ? this.renderReadonly() : this.renderEditable();

package/dist/cjs/yoo-form-timeslots.cjs.entry.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9ca0e46c.js');
-const index$1 = require('./index-a1bbe627.js');
-require('./index-9aadeb94.js');
-const formInputHelpers = require('./form-input-helpers-2d988e31.js');
-const overlays = require('./overlays-e5d2ff76.js');
+const index$1 = require('./index-9ca0e46c.js');
+const index$2 = require('./index-cb8276bc.js');
+require('./index-7790c794.js');
+const formInputHelpers = require('./form-input-helpers-fb275467.js');
+const index = require('./index-4cdf7949.js');
 require('./lodash-a9050d79.js');
-require('./common-helpers-9f63a319.js');
+require('./common-helpers-0724ae60.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 /**
@@ -20,10 +20,10 @@ function closingDays(openingHours) {
   const days = ['sun', 'mon', 'tue', 'wed', 'thu', 'fri', 'sat'];
   const result = [];
   if (openingHours) {
-    days.forEach((day, index) => {
+    days.forEach((day, index$1) => {
       const value = openingHours[day];
-      if (!overlays.isPresent(value) || value.isOpen === false) {
-        result.push(index);
+      if (!index.isPresent(value) || value.isOpen === false) {
+        result.push(index$1);
       }
     });
   }
@@ -34,11 +34,11 @@ const formTimeslotsCss = "svg:not(:root){overflow:hidden}:host .title{display:-m
 
 const YooFormTimeslotsComponent = class {
   constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.validityChanged = index.createEvent(this, "validityChanged", 7);
-    this.inputBlurred = index.createEvent(this, "inputBlurred", 7);
-    this.inputFocused = index.createEvent(this, "inputFocused", 7);
-    this.inputChanged = index.createEvent(this, "inputChanged", 7);
+    index$1.registerInstance(this, hostRef);
+    this.validityChanged = index$1.createEvent(this, "validityChanged", 7);
+    this.inputBlurred = index$1.createEvent(this, "inputBlurred", 7);
+    this.inputFocused = index$1.createEvent(this, "inputFocused", 7);
+    this.inputChanged = index$1.createEvent(this, "inputChanged", 7);
     this.waitlistOptions = { locationId: null, use24HourTime: false, openingHours: null, firstAvailableSlot: null, slots: [] };
     this.validators = [];
     this.calendarDisplayMode = 'week';
@@ -64,13 +64,13 @@ const YooFormTimeslotsComponent = class {
   }
   getAvailableSlots(ev) {
     ev === null || ev === void 0 ? void 0 : ev.stopPropagation();
-    const fromDate = overlays.startOf(this.selectedDate, 'd');
-    const toDate = overlays.dateFormat(overlays.endOf(fromDate, 'd'), index$1.WaitlistAPIDateFormat);
-    const minDate = this.waitlistOptions.firstAvailableSlot ? overlays.dateParse(this.waitlistOptions.firstAvailableSlot.date, index$1.WaitlistAPIDateFormat) : new Date();
-    const params = { locationId: this.waitlistOptions.locationId, fromDate: overlays.dateFormat(fromDate > minDate ? fromDate : minDate, index$1.WaitlistAPIDateFormat), toDate };
+    const fromDate = index.startOf(this.selectedDate, 'd');
+    const toDate = index.dateFormat(index.endOf(fromDate, 'd'), index$2.WaitlistAPIDateFormat);
+    const minDate = this.waitlistOptions.firstAvailableSlot ? index.dateParse(this.waitlistOptions.firstAvailableSlot.date, index$2.WaitlistAPIDateFormat) : new Date();
+    const params = { locationId: this.waitlistOptions.locationId, fromDate: index.dateFormat(fromDate > minDate ? fromDate : minDate, index$2.WaitlistAPIDateFormat), toDate };
     this.isLoadingState = true;
     this.isErrorState = false;
-    overlays.getAsyncExtraData({ type: 'waitlist-timeslots', params })
+    index.getAsyncExtraData({ type: 'waitlist-timeslots', params })
       .then((slots) => {
       const noAvailableSlot = !(slots === null || slots === void 0 ? void 0 : slots.length) || slots.every((slot) => !slot.numAvailableSpots);
       this.waitlistOptions.slots = slots || [];
@@ -94,7 +94,7 @@ const YooFormTimeslotsComponent = class {
   }
   onSwitchCalendarDisplayMode(ev) {
     ev.stopPropagation();
-    if (overlays.isWeb(this.host)) {
+    if (index.isWeb(this.host)) {
       if (!this.calendarModalElmt) {
         const dateChangedListener = (ev) => {
           ev.stopPropagation();
@@ -102,7 +102,7 @@ const YooFormTimeslotsComponent = class {
         };
         const dayClickedListener = (ev) => {
           ev.stopPropagation();
-          overlays.closeModal(null);
+          index.closeModal(null);
         };
         this.calendarModalElmt = document.createElement('yoo-calendar');
         this.calendarModalElmt.size = 'small';
@@ -111,14 +111,14 @@ const YooFormTimeslotsComponent = class {
         this.calendarModalElmt.closingDays = closingDays(this.waitlistOptions.openingHours);
         this.calendarModalElmt.addEventListener('dateChanged', dateChangedListener);
         this.calendarModalElmt.addEventListener('dayClicked', dayClickedListener);
-        overlays.showModal(this.calendarModalElmt, { width: '448', height: 'small' }, 'calendar').then(() => {
+        index.showModal(this.calendarModalElmt, { width: '448', height: 'small' }, 'calendar').then(() => {
           this.calendarModalElmt.removeEventListener('dayClicked', dateChangedListener);
           this.calendarModalElmt.removeEventListener('dayClicked', dayClickedListener);
           this.calendarModalElmt = null;
         });
       }
       else {
-        overlays.closeModal(null);
+        index.closeModal(null);
       }
     }
     else {
@@ -132,7 +132,7 @@ const YooFormTimeslotsComponent = class {
       this.selectedDate = ev.detail.date;
       // avoid to erase any pre-selected slot during the loading of the component,
       //  when the calendar is set to the initial selected date
-      const day = overlays.dateFormat(this.selectedDate, 'YYYY-MM-DD');
+      const day = index.dateFormat(this.selectedDate, 'YYYY-MM-DD');
       if (this.value && this.value.indexOf(day) < 0) {
         this.value = null;
       }
@@ -146,32 +146,32 @@ const YooFormTimeslotsComponent = class {
   }
   renderCalendar() {
     var _a;
-    const minDate = this.waitlistOptions.firstAvailableSlot ? overlays.dateParse(this.waitlistOptions.firstAvailableSlot.date, index$1.WaitlistAPIDateFormat) : new Date();
-    const activeDay = ((_a = this.waitlistOptions.slots) === null || _a === void 0 ? void 0 : _a.length) ? overlays.dateParse(this.waitlistOptions.slots[0].date, index$1.WaitlistAPIDateFormat) : minDate;
+    const minDate = this.waitlistOptions.firstAvailableSlot ? index.dateParse(this.waitlistOptions.firstAvailableSlot.date, index$2.WaitlistAPIDateFormat) : new Date();
+    const activeDay = ((_a = this.waitlistOptions.slots) === null || _a === void 0 ? void 0 : _a.length) ? index.dateParse(this.waitlistOptions.slots[0].date, index$2.WaitlistAPIDateFormat) : minDate;
     const iconName = this.isWeekDisplay() ? 'calendar' : 'grid-view';
-    return (index.h("div", { class: "calendar-container" }, index.h("div", { class: "title-container" }, index.h("div", { class: "title" }, index.h("yoo-icon", { name: "calendar", size: "small" }), overlays.translate('BOOKINGSELECTDATEANDSLOT')), index.h("yoo-button", { shape: "circular", size: "medium", fill: "transparent", color: "stable", onClick: (ev) => this.onSwitchCalendarDisplayMode(ev) }, index.h("yoo-icon", { name: iconName, size: overlays.isWeb(this.host) ? 'small' : 'medium', color: overlays.isWeb(this.host) ? 'app-color' : 'stable' }))), index.h("yoo-calendar", { ref: (el) => (this.calendarElmt = el), displayMode: this.calendarDisplayMode, isDatePicker: true, modernDatePicker: true, minDate: minDate, activeDay: activeDay, onDateChanged: (ev) => this.onDateSelected(ev), closingDays: closingDays(this.waitlistOptions.openingHours) })));
+    return (index$1.h("div", { class: "calendar-container" }, index$1.h("div", { class: "title-container" }, index$1.h("div", { class: "title" }, index$1.h("yoo-icon", { name: "calendar", size: "small" }), index.translate('BOOKINGSELECTDATEANDSLOT')), index$1.h("yoo-button", { shape: "circular", size: "medium", fill: "transparent", color: "stable", onClick: (ev) => this.onSwitchCalendarDisplayMode(ev) }, index$1.h("yoo-icon", { name: iconName, size: index.isWeb(this.host) ? 'small' : 'medium', color: index.isWeb(this.host) ? 'app-color' : 'stable' }))), index$1.h("yoo-calendar", { ref: (el) => (this.calendarElmt = el), displayMode: this.calendarDisplayMode, isDatePicker: true, modernDatePicker: true, minDate: minDate, activeDay: activeDay, onDateChanged: (ev) => this.onDateSelected(ev), closingDays: closingDays(this.waitlistOptions.openingHours) })));
   }
   renderSlots() {
     var _a;
     const isLoadingOrErrorState = this.isLoadingState || this.isErrorState;
     const noAvailableSlot = !isLoadingOrErrorState && (!((_a = this.waitlistOptions.slots) === null || _a === void 0 ? void 0 : _a.length) || this.waitlistOptions.slots.every((slot) => !slot.numAvailableSpots));
-    return (index.h("div", { class: "slots-container" }, index.h("div", { class: "title" }, index.h("yoo-icon", { name: "recent", size: "small" }), overlays.translate(noAvailableSlot ? 'BOOKINGNOAVAILABLESLOT' : 'BOOKINGSELECTSLOT')), this.isLoadingState && index.h("yoo-loader", { size: "large" }), this.isErrorState && (index.h("yoo-button", { color: "light", size: "large", rippleType: "unbounded", onClick: (ev) => this.getAvailableSlots(ev) }, overlays.translate('RETRY'))), !isLoadingOrErrorState &&
+    return (index$1.h("div", { class: "slots-container" }, index$1.h("div", { class: "title" }, index$1.h("yoo-icon", { name: "recent", size: "small" }), index.translate(noAvailableSlot ? 'BOOKINGNOAVAILABLESLOT' : 'BOOKINGSELECTSLOT')), this.isLoadingState && index$1.h("yoo-loader", { size: "large" }), this.isErrorState && (index$1.h("yoo-button", { color: "light", size: "large", rippleType: "unbounded", onClick: (ev) => this.getAvailableSlots(ev) }, index.translate('RETRY'))), !isLoadingOrErrorState &&
       !noAvailableSlot &&
-      index.h("div", { class: { ['time-slots-container']: true, 'web': overlays.isWeb(this.host) } }, this.waitlistOptions.slots.map((slot) => {
+      index$1.h("div", { class: { ['time-slots-container']: true, 'web': index.isWeb(this.host) } }, this.waitlistOptions.slots.map((slot) => {
         const buttonColor = this.value === slot.date ? 'app-color' : 'light';
         const hourFormat = this.waitlistOptions.use24HourTime ? 'HH:mm' : 'hh:mm a';
-        return (index.h("yoo-button", { color: buttonColor, size: overlays.isWeb(this.host) ? 'medium' : 'large', rippleType: "unbounded", disabled: !slot.numAvailableSpots, onClick: (ev) => this.onSlotSelected(ev, slot) }, overlays.dateFormat(overlays.dateParse(slot.date, index$1.WaitlistAPIDateFormat), hourFormat)));
-      })), !isLoadingOrErrorState && noAvailableSlot && index.h("yoo-empty-state", { type: "visit" })));
+        return (index$1.h("yoo-button", { color: buttonColor, size: index.isWeb(this.host) ? 'medium' : 'large', rippleType: "unbounded", disabled: !slot.numAvailableSpots, onClick: (ev) => this.onSlotSelected(ev, slot) }, index.dateFormat(index.dateParse(slot.date, index$2.WaitlistAPIDateFormat), hourFormat)));
+      })), !isLoadingOrErrorState && noAvailableSlot && index$1.h("yoo-empty-state", { type: "visit" })));
   }
   renderReadonly() {
     if (this.value) {
-      return (index.h("yoo-form-input-container", { field: { title: overlays.translate('YOOBICDATETIME') }, required: true }, index.h("yoo-form-input", { readonly: true, value: overlays.dateFormat(overlays.dateParse(this.value, index$1.WaitlistAPIDateFormat), 'L LT') })));
+      return (index$1.h("yoo-form-input-container", { field: { title: index.translate('YOOBICDATETIME') }, required: true }, index$1.h("yoo-form-input", { readonly: true, value: index.dateFormat(index.dateParse(this.value, index$2.WaitlistAPIDateFormat), 'L LT') })));
     }
   }
   render() {
     return this.readonly ? this.renderReadonly() : [this.renderCalendar(), this.renderSlots()];
   }
-  get host() { return index.getElement(this); }
+  get host() { return index$1.getElement(this); }
   static get watchers() { return {
     "required": ["onRequireChanged"]
   }; }

package/dist/cjs/yoo-form-todo-dialog.cjs.entry.js

@@ -3,11 +3,11 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
+require('./index-7790c794.js');
 const lodash = require('./lodash-a9050d79.js');
-const commonHelpers = require('./common-helpers-9f63a319.js');
-const overlays = require('./overlays-e5d2ff76.js');
-require('./index-a1bbe627.js');
+const commonHelpers = require('./common-helpers-0724ae60.js');
+const index$1 = require('./index-4cdf7949.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formTodoDialogCss = "svg:not(:root){overflow:hidden}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;opacity:1}:host .task{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;width:100%;line-height:2.4375rem}:host .task .task-part{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .task .task-part yoo-avatar{margin-right:0.5rem}:host .task .task-part .text{font-size:var(--font-size-18, 1.125rem)}:host .task .task-part .date{margin-right:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .border{width:100%;height:0;border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .task .task-part{margin:0 1rem}:host yoo-ion-content{position:relative}:host yoo-ion-content.web{-ms-flex:1;flex:1}:host .tasks{margin-bottom:0.5rem;padding:1rem 0;background:var(--light, #ffffff)}:host .tasks .field-placeholder{margin-bottom:0.625rem}:host .tasks .field-placeholder .input-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .tasks .field-placeholder .input-container .icon{margin-left:var(--spacing-08, 0.5rem)}:host .menu{margin:0;padding:0;font-size:100%;vertical-align:baseline;list-style:none outside none;background:none repeat scroll 0 0 transparent;border:0 none;outline:0 none;-webkit-tap-highlight-color:transparent;margin:0.5rem;padding:0;list-style:none}:host .menu .menu-item{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .menu .menu-item:not(:last-child) .menu-content{margin-bottom:var(--spacing-24, 1.5rem)}:host .menu .menu-item .menu-left{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}:host .menu .menu-item .menu-left.with-dot{width:2rem;margin-left:0.0313rem}:host .menu .menu-item .menu-left .menu-icon{z-index:2;width:1.875rem;height:1.875rem;text-align:center}:host .menu .menu-item .menu-left .menu-icon.menu-dot{width:1rem;height:1rem}:host .menu .menu-item .menu-left .menu-icon yoo-icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:1.875rem;height:1.875rem;padding:0;color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem);line-height:1.875rem;background-color:var(--app-color, #5a30f4);border-radius:50%}:host .menu .menu-item .menu-left .menu-icon yoo-icon.dark{background-color:var(--dark, #000000)}:host .menu .menu-item .menu-left .menu-icon yoo-icon.info{background-color:var(--info, #d84c96)}:host .menu .menu-item .menu-left .menu-icon yoo-icon.danger{background-color:var(--danger, #d44333)}:host .menu .menu-item .menu-left .border{width:0.0625rem;height:100%;background-color:var(--stable-alt, #d0d0d0)}:host .menu .menu-item .menu-left .border.border-pre{height:2.5rem}:host .menu .menu-item .menu-left .border.border-pre.last{height:1rem}:host .menu .menu-item .menu-left .border.dark{background-color:var(--dark, #000000)}:host .menu .menu-item .menu-left .border.danger{background-color:var(--danger, #d44333)}:host .menu .menu-item .menu-left .border.info{background-color:var(--info, #d84c96)}:host .menu .menu-item .menu-right{width:100%;margin-left:var(--spacing-08, 0.5rem);overflow:hidden}:host .menu .menu-item .menu-right .menu-title{font-weight:bold;line-height:1}:host .menu .menu-item .menu-right .menu-content{color:var(--text-color, #807f83)}:host .menu .menu-item .menu-right .menu-content.menu-chart{margin-bottom:0}:host .menu .menu-item .menu-right .menu-title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2rem}:host .menu .menu-item .menu-right .menu-content span{margin-right:0.5rem}:host .menu .menu-item .menu-right .menu-content yoo-avatar{margin-right:0.3125rem}:host .menu .menu-item .menu-right .menu-content .font-medium{font-size:var(--font-size-14, 0.875rem)}:host .menu .menu-item .menu-right .menu-content .font-small{font-size:var(--font-size-12, 0.75rem)}:host .menu .menu-item .menu-right .menu-content .dark{color:var(--dark, #000000)}:host .menu .menu-item .menu-right .menu-content .success{color:var(--success, #3aa76d)}:host .menu .menu-item .menu-right .menu-content .danger{color:var(--danger, #d44333)}:host .menu .menu-item .menu-right .menu-content .text-color{color:var(--text-color, #807f83)}:host .menu .menu-item .menu-right .menu-content table{width:100%;table-layout:fixed}:host .menu .menu-item .menu-right .menu-content table td{overflow:hidden;text-overflow:ellipsis}:host(.web) .tasks,:host(.web) .tasks-container{max-width:28rem;margin:auto !important}";
@@ -35,15 +35,15 @@ const YooFormTodoDialogComponent = class {
   }
   componentWillLoad() {
     this.todo = this.todo || {};
-    if (overlays.isNativeMobile()) {
-      this.isKeyboardResizeModeInactive = overlays.isKeyboardResizeModeInactive();
-      overlays.enableKeyboardResize();
+    if (index$1.isNativeMobile()) {
+      this.isKeyboardResizeModeInactive = index$1.isKeyboardResizeModeInactive();
+      index$1.enableKeyboardResize();
     }
   }
   disconnectedCallback() {
-    if (overlays.isNativeMobile()) {
+    if (index$1.isNativeMobile()) {
       if (this.isKeyboardResizeModeInactive) {
-        overlays.disableKeyboardResize();
+        index$1.disableKeyboardResize();
       }
     }
   }
@@ -54,11 +54,11 @@ const YooFormTodoDialogComponent = class {
     return this.validity && this.todo.values && this.todo.values.length > 0;
   }
   onCancel() {
-    overlays.closeModal(null);
+    index$1.closeModal(null);
   }
   onSave() {
     if (this.isValid()) {
-      overlays.closeModal(this.todo);
+      index$1.closeModal(this.todo);
     }
   }
   onAddTask(preventBlur) {
@@ -68,7 +68,7 @@ const YooFormTodoDialogComponent = class {
     if (this.currentTask) {
       this.todo.values = this.todo.values || [];
       this.todo.values.push({
-        _id: overlays.getUUID(),
+        _id: index$1.getUUID(),
         text: { value: this.currentTask },
         finished: { value: null },
         isphotorequired: { value: this.allPhotosRequired === true },
@@ -87,8 +87,8 @@ const YooFormTodoDialogComponent = class {
     form.showRecap = false;
     form.data = task;
     form.suffix = '.value';
-    form.title = overlays.translate('YOOBICEDIT');
-    overlays.showModal(form).then((ret) => {
+    form.title = index$1.translate('YOOBICEDIT');
+    index$1.showModal(form).then((ret) => {
       if (ret && ret.data) {
         task = ret.data;
         index.forceUpdate(this);
@@ -97,7 +97,7 @@ const YooFormTodoDialogComponent = class {
     });
   }
   onRemoveTask(task) {
-    overlays.showAlert(overlays.translate('DELETE'), [overlays.translate('CANCEL'), overlays.translate('YOOBICOK')], overlays.translate('DELETEACTIONCONFIRM')).then((ret) => {
+    index$1.showAlert(index$1.translate('DELETE'), [index$1.translate('CANCEL'), index$1.translate('YOOBICOK')], index$1.translate('DELETEACTIONCONFIRM')).then((ret) => {
       if (ret === true) {
         lodash.remove(this.todo.values, (t) => t === task);
         index.forceUpdate(this);
@@ -108,12 +108,12 @@ const YooFormTodoDialogComponent = class {
     return [
       {
         actionType: 'edit',
-        text: overlays.translate('YOOBICEDIT'),
+        text: index$1.translate('YOOBICEDIT'),
         handler: () => this.onEditTask(task)
       },
       {
         actionType: 'delete',
-        text: overlays.translate('DELETE'),
+        text: index$1.translate('DELETE'),
         cssClass: 'danger',
         handler: () => this.onRemoveTask(task)
       }
@@ -144,25 +144,25 @@ const YooFormTodoDialogComponent = class {
     if (((_b = (_a = this.todo) === null || _a === void 0 ? void 0 : _a.field) === null || _b === void 0 ? void 0 : _b.name) && ((_c = this.todo) === null || _c === void 0 ? void 0 : _c.fieldValue)) {
       const field = lodash.cloneDeep(this.todo.field);
       field.title = this.todo.field.description || this.todo.field.title;
-      return (index.h("div", { class: "menu" }, index.h("li", { class: "menu-item" }, index.h("div", { class: "menu-left" }, index.h("span", { class: "menu-icon" }, index.h("yoo-icon", { name: "link" })), index.h("div", { class: "border" })), index.h("div", { class: "menu-right" }, index.h("div", { class: "menu-title" }, overlays.translate('LINKEDTO')), index.h("div", { class: "menu-content menu-requestor" }, index.h("yoo-form-dynamic", { class: "inline transparent", slides: [{ title: 'YOOBICGENERAL', items: [field] }], data: { [field.name]: { value: this.todo.fieldValue, ...this.todo.fieldExtra } }, forceReadonly: true, onFormValidityChanged: (ev) => ev.stopPropagation(), suffix: ".value", animated: false, showRecap: false }))))));
+      return (index.h("div", { class: "menu" }, index.h("li", { class: "menu-item" }, index.h("div", { class: "menu-left" }, index.h("span", { class: "menu-icon" }, index.h("yoo-icon", { name: "link" })), index.h("div", { class: "border" })), index.h("div", { class: "menu-right" }, index.h("div", { class: "menu-title" }, index$1.translate('LINKEDTO')), index.h("div", { class: "menu-content menu-requestor" }, index.h("yoo-form-dynamic", { class: "inline transparent", slides: [{ title: 'YOOBICGENERAL', items: [field] }], data: { [field.name]: { value: this.todo.fieldValue, ...this.todo.fieldExtra } }, forceReadonly: true, onFormValidityChanged: (ev) => ev.stopPropagation(), suffix: ".value", animated: false, showRecap: false }))))));
     }
   }
   renderTasks() {
     var _a;
-    return (index.h("div", { slot: "end" }, index.h("div", { class: "tasks" }, index.h("div", { class: "field-placeholder" }, index.h("yoo-form-input-container", { field: { title: overlays.translate('YOOBICACTIONS') }, hideOptional: true }, index.h("div", { class: "input-container" }, index.h("yoo-form-input", { ref: (el) => (this.formInputTaskEditEl = el), class: "task-edit", onInputChanged: (event) => this.onInputChanged(event), onValidityChanged: (ev) => ev.stopPropagation(), onEnterPressed: () => this.onEnterPressed(), size: overlays.isWeb(this.host) ? 'medium' : 'large' }), index.h("div", { class: "icon" }, index.h("yoo-icon", { name: "plus", color: "app-color", onClick: () => this.onAddTask() }))))), !!((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) && (index.h("div", { class: "field-placeholder" }, index.h("yoo-form-input-container", { field: { title: overlays.translate('ADDPREDEFINEDTASKS') }, hideOptional: true }, index.h("yoo-form-autocomplete", { ref: (el) => (this.autocompleteEl = el), class: "predefined", displayType: "card-list", values: this.values.map((v) => ({ _id: v, title: v })), multiple: true, onValidityChanged: (ev) => ev.stopPropagation(), onInputChanged: (ev) => this.onSelect(ev), size: overlays.isWeb(this.host) ? 'medium' : 'large' }))))), index.h("div", { class: "tasks-container" }, index.h("div", { class: "title" }, overlays.translate('LISTOFACTIONS')), this.todo &&
+    return (index.h("div", { slot: "end" }, index.h("div", { class: "tasks" }, index.h("div", { class: "field-placeholder" }, index.h("yoo-form-input-container", { field: { title: index$1.translate('YOOBICACTIONS') }, hideOptional: true }, index.h("div", { class: "input-container" }, index.h("yoo-form-input", { ref: (el) => (this.formInputTaskEditEl = el), class: "task-edit", onInputChanged: (event) => this.onInputChanged(event), onValidityChanged: (ev) => ev.stopPropagation(), onEnterPressed: () => this.onEnterPressed(), size: index$1.isWeb(this.host) ? 'medium' : 'large' }), index.h("div", { class: "icon" }, index.h("yoo-icon", { name: "plus", color: "app-color", onClick: () => this.onAddTask() }))))), !!((_a = this.values) === null || _a === void 0 ? void 0 : _a.length) && (index.h("div", { class: "field-placeholder" }, index.h("yoo-form-input-container", { field: { title: index$1.translate('ADDPREDEFINEDTASKS') }, hideOptional: true }, index.h("yoo-form-autocomplete", { ref: (el) => (this.autocompleteEl = el), class: "predefined", displayType: "card-list", values: this.values.map((v) => ({ _id: v, title: v })), multiple: true, onValidityChanged: (ev) => ev.stopPropagation(), onInputChanged: (ev) => this.onSelect(ev), size: index$1.isWeb(this.host) ? 'medium' : 'large' }))))), index.h("div", { class: "tasks-container" }, index.h("div", { class: "title" }, index$1.translate('LISTOFACTIONS')), this.todo &&
       this.todo.values &&
       this.todo.values.map((todoValue) => [
-        index.h("div", { class: "task" }, index.h("div", { class: "task-part" }, index.h("span", { class: "text" }, overlays.translateMulti(todoValue.text.value))), index.h("div", { class: "task-part" }, todoValue.duedate && todoValue.duedate.value && index.h("span", { class: "date" }, overlays.pipes.dateFormat.transform(todoValue.duedate.value, 'L')), overlays.isWeb(this.host) ?
+        index.h("div", { class: "task" }, index.h("div", { class: "task-part" }, index.h("span", { class: "text" }, index$1.translateMulti(todoValue.text.value))), index.h("div", { class: "task-part" }, todoValue.duedate && todoValue.duedate.value && index.h("span", { class: "date" }, index$1.pipes.dateFormat.transform(todoValue.duedate.value, 'L')), index$1.isWeb(this.host) ?
           index.h("yoo-context-menu", { contentButtons: this.getContextMenuActions(todoValue) }, index.h("yoo-icon", { name: "more" })) :
-          index.h("yoo-button", { fill: "transparent", color: "dark", shape: "circular", onClick: (ev) => overlays.showActionSheet(this.getContextMenuActions(todoValue), '', {}, ev.composedPath()[0], ev) }, index.h("yoo-icon", { name: "more" })))),
+          index.h("yoo-button", { fill: "transparent", color: "dark", shape: "circular", onClick: (ev) => index$1.showActionSheet(this.getContextMenuActions(todoValue), '', {}, ev.composedPath()[0], ev) }, index.h("yoo-icon", { name: "more" })))),
         index.h("div", { class: "border" })
       ]))));
   }
   render() {
-    return (index.h(index.Host, { class: { ...commonHelpers.getAppContext(this.host) } }, index.h("yoo-header", null, index.h("yoo-navbar", null, index.h("yoo-items", { slot: "start" }, index.h("yoo-button", { color: "text-color", fill: "transparent", shape: "circular", rippleType: "unbounded", onClick: () => this.onCancel() }, index.h("yoo-icon", { name: "close" }))), index.h("yoo-truncate", null, overlays.translate('YOOBICTODO')), !overlays.isWeb(this.host) && index.h("yoo-items", { slot: "end" }, this.renderSaveButton()))), index.h("yoo-ion-content", { scrollEnabled: false, class: { 'bg-light': true, web: overlays.isWeb(this.host) } }, index.h("yoo-form-dynamic", { ref: (el) => (this.formDynamicEl = el), slides: this.slidesTodo, data: this.todo, showRecap: false, showTabs: false, isKeyboardStateLocked: true, onDataChanged: (ev) => this.onDataChanged(ev), onFormValidityChanged: (ev) => this.onValidityChanged(ev), onFieldFetchData: (ev) => this.onInternalFieldFetchData(ev) }, index.h("div", { slot: "start" }, this.todo && this.todo.field && overlays.isPresent(this.todo.fieldValue) && this.renderLinkedField()), index.h("div", { slot: "end" }, this.renderTasks()), overlays.isWeb(this.host) && index.h("div", { slot: "footer" }, this.renderSaveButton())))));
+    return (index.h(index.Host, { class: { ...commonHelpers.getAppContext(this.host) } }, index.h("yoo-header", null, index.h("yoo-navbar", null, index.h("yoo-items", { slot: "start" }, index.h("yoo-button", { color: "text-color", fill: "transparent", shape: "circular", rippleType: "unbounded", onClick: () => this.onCancel() }, index.h("yoo-icon", { name: "close" }))), index.h("yoo-truncate", null, index$1.translate('YOOBICTODO')), !index$1.isWeb(this.host) && index.h("yoo-items", { slot: "end" }, this.renderSaveButton()))), index.h("yoo-ion-content", { scrollEnabled: false, class: { 'bg-light': true, web: index$1.isWeb(this.host) } }, index.h("yoo-form-dynamic", { ref: (el) => (this.formDynamicEl = el), slides: this.slidesTodo, data: this.todo, showRecap: false, showTabs: false, isKeyboardStateLocked: true, onDataChanged: (ev) => this.onDataChanged(ev), onFormValidityChanged: (ev) => this.onValidityChanged(ev), onFieldFetchData: (ev) => this.onInternalFieldFetchData(ev) }, index.h("div", { slot: "start" }, this.todo && this.todo.field && index$1.isPresent(this.todo.fieldValue) && this.renderLinkedField()), index.h("div", { slot: "end" }, this.renderTasks()), index$1.isWeb(this.host) && index.h("div", { slot: "footer" }, this.renderSaveButton())))));
   }
   renderSaveButton() {
-    return index.h("yoo-button", { color: "app-color", fill: overlays.isWeb(this.host) ? 'solid' : 'transparent', animated: false, disabled: !this.isValid(), onClick: () => this.onSave() }, overlays.translate('YOOBICSAVE'));
+    return index.h("yoo-button", { color: "app-color", fill: index$1.isWeb(this.host) ? 'solid' : 'transparent', animated: false, disabled: !this.isValid(), onClick: () => this.onSave() }, index$1.translate('YOOBICSAVE'));
   }
   get host() { return index.getElement(this); }
 };