@yoobic/yobi 8.5.0-60 → 8.5.0-61

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

@@ -3,12 +3,12 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
+require('./index-6f92bccb.js');
 const lodash = require('./lodash-a9050d79.js');
-const formInputHelpers = require('./form-input-helpers-2d988e31.js');
-const overlays = require('./overlays-e5d2ff76.js');
+const formInputHelpers = require('./form-input-helpers-4ad38e19.js');
+const index$1 = require('./index-0cfb67d1.js');
 require('./index-a1bbe627.js');
-require('./common-helpers-9f63a319.js');
+require('./common-helpers-44428bf7.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formRankingCss = "svg:not(:root){overflow:hidden}:host{position:relative;display:block;width:100%}:host ul{margin:0;padding:0;list-style:none}:host ul li{position:absolute;width:100%}:host ul li.active{-webkit-box-shadow:var(--shadow-04, 0 0.75rem 1.5rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-04, 0 0.75rem 1.5rem 0 rgba(0, 0, 0, 0.1));cursor:-webkit-grabbing;cursor:grabbing}:host ul li.active>div{background-color:var(--stable-ultralight, #fafafa)}:host ul li>div{display:grid;grid-template-columns:auto 1fr auto;gap:var(--spacing-08, 0.5rem);-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem);background-color:var(--light, #ffffff);border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}";
@@ -58,15 +58,15 @@ const YooFormRankingComponent = class {
   }
   async prepareItems() {
     !this.readonly && (this.sortables = await Promise.all(this.itemElements.map(element => element && this.initDraggable(element))));
-    this.itemElements.forEach((element, index) => overlays.gsapSet(element, { y: this.itemElements.slice(0, index).reduce((acc, el) => (acc += el.clientHeight), 0) }));
+    this.itemElements.forEach((element, index) => index$1.gsapSet(element, { y: this.itemElements.slice(0, index).reduce((acc, el) => (acc += el.clientHeight), 0) }));
   }
   async initDraggable(element) {
     let sortable = {};
-    const value = this.values.find(value => overlays.translateMulti(value) === element.firstElementChild.textContent);
-    const animation = (await overlays.gsapTimeline())({ force3D: true, paused: true });
+    const value = this.values.find(value => index$1.translateMulti(value) === element.firstElementChild.textContent);
+    const animation = (await index$1.gsapTimeline())({ force3D: true, paused: true });
     const layout = async () => {
       const itemPosition = this.sortables.slice(0, sortable.index).reduce((acc, { element }) => (acc += element.clientHeight), 0);
-      element && await overlays.gsapTo(element, .25, { y: itemPosition });
+      element && await index$1.gsapTo(element, .25, { y: itemPosition });
     };
     const changeIndex = (to) => {
       const { element, index } = sortable || {};
@@ -98,7 +98,7 @@ const YooFormRankingComponent = class {
         formInputHelpers.setValueAndValidateInput(this.value, this);
         element.classList.remove('active');
       };
-      const dragger = new overlays.Draggable(element, {
+      const dragger = new index$1.Draggable(element, {
         type: 'y',
         trigger: element.querySelector('yoo-icon'),
         onPress: () => element.classList.add('active'),
@@ -115,11 +115,11 @@ const YooFormRankingComponent = class {
     }
     return sortable;
   }
-  renderItem(value, index$1) {
+  renderItem(value, index$2) {
     var _a, _b, _c;
     const readonlyColor = (((_a = this.value) === null || _a === void 0 ? void 0 : _a.indexOf(value)) === ((_b = this.answer) === null || _b === void 0 ? void 0 : _b.indexOf(value))) ? 'success' : 'danger';
     const badgeColor = this.readonly ? readonlyColor : `app-color${!this.isDragging && ((_c = this.value) === null || _c === void 0 ? void 0 : _c.length) ? '' : '-60'}`;
-    return index.h("li", null, index.h("div", null, index.h("yoo-badge", { color: badgeColor, size: "small", text: `${index$1 + 1}` }), index.h("div", { class: "value" }, overlays.translateMulti(value)), !this.readonly && index.h("yoo-icon", { name: "ranking-toggle", color: "stable" })));
+    return index.h("li", null, index.h("div", null, index.h("yoo-badge", { color: badgeColor, size: "small", text: `${index$2 + 1}` }), index.h("div", { class: "value" }, index$1.translateMulti(value)), !this.readonly && index.h("yoo-icon", { name: "ranking-toggle", color: "stable" })));
   }
   renderList() {
     var _a;

package/dist/cjs/yoo-form-recap-step.cjs.entry.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const commonHelpers = require('./common-helpers-9f63a319.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-6f92bccb.js');
+const commonHelpers = require('./common-helpers-44428bf7.js');
+const index$1 = require('./index-0cfb67d1.js');
 require('./lodash-a9050d79.js');
 require('./index-a1bbe627.js');
 require('./_commonjsHelpers-94df2ea7.js');
@@ -50,8 +50,8 @@ const YooFormRecapStepComponent = class {
         locked: this.locked,
         valid: this.step.valid && !this.locked,
         invalid: this.step.valid === false && !this.locked,
-        step: overlays.isNullOrUndefined(this.step.valid) && !this.locked
-      } }, this.renderIcon())), index.h("div", { class: "text-container" }, index.h("div", { class: "text-container-main" }, !this.subTitle && index.h("div", { class: "step-container" }, overlays.translate('PAGE') + ' ' + this.stepNumber), !this.subTitle && index.h("div", { class: "title-container" }, index.h("yoo-truncate", { class: "form-recap", showEllipsisButton: true, content: overlays.translateMulti(this.mainTitle) })), this.subTitle && index.h("div", { class: "step-container", innerHTML: this.stepNumber + '. ' + overlays.translateMulti(this.mainTitle) }), this.subTitle && index.h("div", { class: "subtitle-container", innerHTML: overlays.translateMulti(this.subTitle) }), index.h("slot", null)), ((_a = this.users) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { class: "text-container-right" }, index.h("yoo-avatars", { users: this.users, size: "extra-small", layout: "stack" })))))));
+        step: index$1.isNullOrUndefined(this.step.valid) && !this.locked
+      } }, this.renderIcon())), index.h("div", { class: "text-container" }, index.h("div", { class: "text-container-main" }, !this.subTitle && index.h("div", { class: "step-container" }, index$1.translate('PAGE') + ' ' + this.stepNumber), !this.subTitle && index.h("div", { class: "title-container" }, index.h("yoo-truncate", { class: "form-recap", showEllipsisButton: true, content: index$1.translateMulti(this.mainTitle) })), this.subTitle && index.h("div", { class: "step-container", innerHTML: this.stepNumber + '. ' + index$1.translateMulti(this.mainTitle) }), this.subTitle && index.h("div", { class: "subtitle-container", innerHTML: index$1.translateMulti(this.subTitle) }), index.h("slot", null)), ((_a = this.users) === null || _a === void 0 ? void 0 : _a.length) > 0 && (index.h("div", { class: "text-container-right" }, index.h("yoo-avatars", { users: this.users, size: "extra-small", layout: "stack" })))))));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/yoo-form-recurrence-delay.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-6f92bccb.js');
+const index$1 = require('./index-0cfb67d1.js');
 require('./lodash-a9050d79.js');
 require('./index-a1bbe627.js');
 require('./_commonjsHelpers-94df2ea7.js');
@@ -73,7 +73,7 @@ const YooFormRecurrenceDelayComponent = class {
         this.quantifier = event.detail;
         this.internal = true;
         this.updateValue();
-      } }), index.h("yoo-form-autocomplete", { size: this.size, idOnly: true, value: this.unit, values: units.map((unit) => ({ _id: unit, title: overlays.translate(`YOOBIC${unit}`) })), onInputChanged: (event) => {
+      } }), index.h("yoo-form-autocomplete", { size: this.size, idOnly: true, value: this.unit, values: units.map((unit) => ({ _id: unit, title: index$1.translate(`YOOBIC${unit}`) })), onInputChanged: (event) => {
         event.stopPropagation();
         this.unit = event.detail;
         this.internal = true;

package/dist/cjs/yoo-form-recurrence-preview.cjs.entry.js

@@ -3,17 +3,17 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-const index$2 = require('./index-a1bbe627.js');
-const index$1 = require('./index-9aadeb94.js');
-const overlays = require('./overlays-e5d2ff76.js');
+const index$3 = require('./index-a1bbe627.js');
+const index$2 = require('./index-6f92bccb.js');
+const index$1 = require('./index-0cfb67d1.js');
 require('./lodash-a9050d79.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const formRecurrencePreviewCss = "svg:not(:root){overflow:hidden}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%;background-color:var(--light, #ffffff)}:host footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host header{font-weight:bold}:host main{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}:host main.empty{-ms-flex-pack:center;justify-content:center}:host main:not(.empty){padding:var(--spacing-16, 1rem) var(--spacing-48, 3rem);overflow:auto}:host h1{margin:0 0 var(--spacing-16, 1rem);font-size:inherit}:host p{margin:0;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem);text-align:center}:host table{width:100%;border-collapse:collapse}:host table,:host td,:host th{border:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0)}:host tbody tr:nth-child(odd){background:var(--stable-light, #f1f1f1)}:host td,:host th{width:50%;padding:var(--spacing-08, 0.5rem) var(--spacing-24, 1.5rem);text-align:left}:host yoo-empty-state+p{margin-top:var(--spacing-16, 1rem)}:host .schedule{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--spacing-24, 1.5rem);width:100%;margin-top:var(--spacing-24, 1.5rem)}:host .timezones{display:grid;grid-template-columns:repeat(2, 1fr);gap:var(--spacing-16, 1rem);max-width:34.5rem}:host .timezones h1{text-align:right}:host .timezones p{grid-column:1/-1}";
 
-const EmptyState = () => [index.h("yoo-empty-state", null), index.h("p", null, overlays.translate('LISTEMPTY'))];
-const Recurrences = ({ dates, label }) => (index.h("div", { class: "recurrences" }, index.h("h1", null, overlays.translate(label)), index.h("table", null, index.h("thead", null, index.h("tr", null, index.h("th", null, overlays.translate('YOOBICDATE')), index.h("th", null, overlays.translate('YOOBICHOUR')))), index.h("tbody", null, dates.map((date) => (index.h("tr", null, index.h("td", null, overlays.pipes.dateFormat.transform(date, 'ddd L')), index.h("td", null, overlays.pipes.dateFormat.transform(date, 'LT')))))))));
-const Timezones = ({ value, values, onUpdate }) => (index.h("div", { class: "timezones" }, index.h("p", { innerHTML: overlays.translate('RECURRENCEPREVIEWDETAILS') }), index.h("h1", null, overlays.translate('RECURRENCEPREVIEWTIMEZONE')), index.h("yoo-form-autocomplete", { size: "medium", value: value, values: values, onFetchData: (event) => { var _a; return (_a = event.detail.infiniteScroll) === null || _a === void 0 ? void 0 : _a.complete(); }, onInputChanged: (event) => {
+const EmptyState = () => [index.h("yoo-empty-state", null), index.h("p", null, index$1.translate('LISTEMPTY'))];
+const Recurrences = ({ dates, label }) => (index.h("div", { class: "recurrences" }, index.h("h1", null, index$1.translate(label)), index.h("table", null, index.h("thead", null, index.h("tr", null, index.h("th", null, index$1.translate('YOOBICDATE')), index.h("th", null, index$1.translate('YOOBICHOUR')))), index.h("tbody", null, dates.map((date) => (index.h("tr", null, index.h("td", null, index$1.pipes.dateFormat.transform(date, 'ddd L')), index.h("td", null, index$1.pipes.dateFormat.transform(date, 'LT')))))))));
+const Timezones = ({ value, values, onUpdate }) => (index.h("div", { class: "timezones" }, index.h("p", { innerHTML: index$1.translate('RECURRENCEPREVIEWDETAILS') }), index.h("h1", null, index$1.translate('RECURRENCEPREVIEWTIMEZONE')), index.h("yoo-form-autocomplete", { size: "medium", value: value, values: values, onFetchData: (event) => { var _a; return (_a = event.detail.infiniteScroll) === null || _a === void 0 ? void 0 : _a.complete(); }, onInputChanged: (event) => {
     event.stopPropagation();
     onUpdate(event.detail);
   } })));
@@ -28,16 +28,16 @@ const YooFormRecurrencePreviewComponent = class {
     /**
      * Selected timezone.
      */
-    this.timezone = overlays.guessCurrentTimezone();
+    this.timezone = index$1.guessCurrentTimezone();
   }
   finish() {
     this.close.emit();
   }
   render() {
     const start = new Date(new Date().setSeconds(0, 0));
-    const recurrences = index$1.getRecurrences(this.value, { max: this.max, start, timezone: this.timezone });
+    const recurrences = index$2.getRecurrences(this.value, { max: this.max, start, timezone: this.timezone });
     const hasRecurrences = !!(recurrences === null || recurrences === void 0 ? void 0 : recurrences.length);
-    return (index.h(index.Host, null, index.h("header", null, index.h("yoo-navbar", null, index.h("yoo-items", { slot: "start" }, index.h("yoo-button", { animated: true, color: "stable", fill: "transparent", rippleType: "unbounded", shape: "circular", onClick: () => this.finish() }, index.h("yoo-icon", { color: "stable", name: "close" }))), index.h("yoo-truncate", null, overlays.translate('RECURRENCEPREVIEWTITLE')))), index.h("main", { class: { empty: !hasRecurrences } }, hasRecurrences && index.h(Timezones, { value: this.timezone, values: [...index$2.TIMEZONES], onUpdate: (timezone) => (this.timezone = timezone) }), hasRecurrences && (index.h("div", { class: "schedule" }, index.h(Recurrences, { dates: index$1.getRecurrences(this.value, { max: this.max, start, timezone: overlays.guessCurrentTimezone() }), label: overlays.translate('RECURRENCEPREVIEWLEFT') }), index.h(Recurrences, { dates: recurrences, label: overlays.translate('RECURRENCEPREVIEWRIGHT') }))), !hasRecurrences && index.h(EmptyState, null)), index.h("footer", null, index.h("yoo-button", { animated: true, color: "app-color", onClick: () => this.finish() }, overlays.translate('YOOBICSAVE')))));
+    return (index.h(index.Host, null, index.h("header", null, index.h("yoo-navbar", null, index.h("yoo-items", { slot: "start" }, index.h("yoo-button", { animated: true, color: "stable", fill: "transparent", rippleType: "unbounded", shape: "circular", onClick: () => this.finish() }, index.h("yoo-icon", { color: "stable", name: "close" }))), index.h("yoo-truncate", null, index$1.translate('RECURRENCEPREVIEWTITLE')))), index.h("main", { class: { empty: !hasRecurrences } }, hasRecurrences && index.h(Timezones, { value: this.timezone, values: [...index$3.TIMEZONES], onUpdate: (timezone) => (this.timezone = timezone) }), hasRecurrences && (index.h("div", { class: "schedule" }, index.h(Recurrences, { dates: index$2.getRecurrences(this.value, { max: this.max, start, timezone: index$1.guessCurrentTimezone() }), label: index$1.translate('RECURRENCEPREVIEWLEFT') }), index.h(Recurrences, { dates: recurrences, label: index$1.translate('RECURRENCEPREVIEWRIGHT') }))), !hasRecurrences && index.h(EmptyState, null)), index.h("footer", null, index.h("yoo-button", { animated: true, color: "app-color", onClick: () => this.finish() }, index$1.translate('YOOBICSAVE')))));
   }
 };
 YooFormRecurrencePreviewComponent.style = formRecurrencePreviewCss;

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

@@ -2,10 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-9ca0e46c.js');
-const index$2 = require('./index-9aadeb94.js');
-const overlays = require('./overlays-e5d2ff76.js');
-const index$1 = require('./index-a1bbe627.js');
+const index$1 = require('./index-9ca0e46c.js');
+const index$3 = require('./index-6f92bccb.js');
+const index = require('./index-0cfb67d1.js');
+const index$2 = require('./index-a1bbe627.js');
 require('./lodash-a9050d79.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
@@ -20,20 +20,20 @@ const fromTimeString = (hour) => (parseInt(hour.substr(0, hour.indexOf('.'))) %
 const toTimeString = (hour) => (hour >= 12 && `${hour - 12 || 12}.00 pm`) || `${hour || 12}.00 am`;
 const allHours = Array.from({ length: 24 }).map((_, index) => toTimeString(index));
 const frequencies = [
-  { _id: 'YOOBICDAY', title: overlays.translate('YOOBICDAY') },
-  { _id: 'YOOBICWEEK', title: overlays.translate('YOOBICWEEK') },
-  { _id: 'MONTH', title: overlays.translate('YOOBICMONTH') }
+  { _id: 'YOOBICDAY', title: index.translate('YOOBICDAY') },
+  { _id: 'YOOBICWEEK', title: index.translate('YOOBICWEEK') },
+  { _id: 'MONTH', title: index.translate('YOOBICMONTH') }
 ];
-const Frequency = ({ frequency, hours, interval, withoutHours, onChange }) => (index.h("section", { class: "frequency" },
-  index.h("yoo-form-input", { clearable: false, hasIconPrefix: false, min: MIN_INTERVAL.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: interval, onInputChanged: (event) => {
+const Frequency = ({ frequency, hours, interval, withoutHours, onChange }) => (index$1.h("section", { class: "frequency" },
+  index$1.h("yoo-form-input", { clearable: false, hasIconPrefix: false, min: MIN_INTERVAL.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: interval, onInputChanged: (event) => {
       event.stopPropagation();
       onChange(frequency, hours, event.detail);
     }, onValidityChanged: (event) => event.stopPropagation() }),
-  index.h("yoo-form-autocomplete", { dynamicOrdering: false, idOnly: true, size: "medium", value: frequency, values: frequencies, onInputChanged: (event) => {
+  index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, idOnly: true, size: "medium", value: frequency, values: frequencies, onInputChanged: (event) => {
       event.stopPropagation();
       onChange(event.detail, hours, interval);
     }, onValidityChanged: (event) => event.stopPropagation() }),
-  index.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "slots", forceHideSearch: true, hidden: withoutHours, multiple: true, multipleSelectionSuffix: null, size: "medium", value: hours === null || hours === void 0 ? void 0 : hours.map((hour) => toTimeString(hour)), values: allHours, onInputChanged: (event) => {
+  index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "slots", forceHideSearch: true, hidden: withoutHours, multiple: true, multipleSelectionSuffix: null, size: "medium", value: hours === null || hours === void 0 ? void 0 : hours.map((hour) => toTimeString(hour)), values: allHours, onInputChanged: (event) => {
       event.stopPropagation();
       onChange(frequency, (event.detail || []).map((hour) => fromTimeString(hour)).sort((hour1, hour2) => hour1 - hour2), interval);
     }, onValidityChanged: (event) => event.stopPropagation() })));
@@ -49,20 +49,20 @@ const weeks = ['FIRST', 'SECOND', 'THIRD', 'YOOBICLAST'];
 const MonthOptions = ({ hidden, options, onChange }) => {
   const mode = options === null || options === void 0 ? void 0 : options.mode;
   const byweekday = options === null || options === void 0 ? void 0 : options.byweekday;
-  return (index.h("section", { class: "month", hidden: hidden },
-    index.h("yoo-form-autocomplete", { dynamicOrdering: false, size: "medium", value: toModeTranslationKey(mode), values: modes.map((mode) => toModeTranslationKey(mode)), onInputChanged: (event) => {
+  return (index$1.h("section", { class: "month", hidden: hidden },
+    index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, size: "medium", value: toModeTranslationKey(mode), values: modes.map((mode) => toModeTranslationKey(mode)), onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...options, mode: fromModeTranslationKey(event.detail) });
       }, onValidityChanged: (event) => event.stopPropagation() }),
-    index.h("yoo-form-autocomplete", { dynamicOrdering: false, forceHideSearch: true, hidden: mode !== 'MONTHDAY', size: "medium", value: options === null || options === void 0 ? void 0 : options.bymonthday, values: monthdays, onInputChanged: (event) => {
+    index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, forceHideSearch: true, hidden: mode !== 'MONTHDAY', size: "medium", value: options === null || options === void 0 ? void 0 : options.bymonthday, values: monthdays, onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...options, bymonthday: event.detail });
       }, onValidityChanged: (event) => event.stopPropagation() }),
-    index.h("yoo-form-autocomplete", { dynamicOrdering: false, hidden: mode !== 'WEEKDAY', size: "medium", value: toWeekTranslationKey(byweekday === null || byweekday === void 0 ? void 0 : byweekday.week), values: weeks.map((week) => toWeekTranslationKey(week)), onInputChanged: (event) => {
+    index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, hidden: mode !== 'WEEKDAY', size: "medium", value: toWeekTranslationKey(byweekday === null || byweekday === void 0 ? void 0 : byweekday.week), values: weeks.map((week) => toWeekTranslationKey(week)), onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...options, byweekday: { ...byweekday, week: fromWeekTranslationKey(event.detail) } });
       }, onValidityChanged: (event) => event.stopPropagation() }),
-    index.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "days", forceHideSearch: true, hidden: mode !== 'WEEKDAY', size: "medium", value: byweekday === null || byweekday === void 0 ? void 0 : byweekday.weekday, values: weekdays, onInputChanged: (event) => {
+    index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "days", forceHideSearch: true, hidden: mode !== 'WEEKDAY', size: "medium", value: byweekday === null || byweekday === void 0 ? void 0 : byweekday.weekday, values: weekdays, onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...options, byweekday: { ...byweekday, weekday: event.detail } });
       }, onValidityChanged: (event) => event.stopPropagation() })));
@@ -72,45 +72,45 @@ const translationKey = 'SCHEDULEEND';
 const End = ({ end, start, translationSuffix, withoutDynamic, onChange }) => {
   const selectedMode = end === null || end === void 0 ? void 0 : end.mode;
   const modes = [...withoutDynamic ? [] : ['DYNAMIC'], 'FIXEDBYCOUNT', 'FIXEDBYDATE'];
-  return (index.h("section", { class: "schedule-end" },
-    index.h("label", null, overlays.translate(translationKey)),
-    index.h("yoo-form-radio", { options: modes, size: "medium", value: selectedMode, onInputChanged: (event) => {
+  return (index$1.h("section", { class: "schedule-end" },
+    index$1.h("label", null, index.translate(translationKey)),
+    index$1.h("yoo-form-radio", { options: modes, size: "medium", value: selectedMode, onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...end, mode: event.detail });
-      } }, modes.map((mode, index$2) => (index.h("div", { slot: index$2.toString() },
-      overlays.translate(`${translationKey}${translationSuffix || ''}${mode}`),
-      mode === 'FIXEDBYCOUNT' && (index.h("yoo-form-input", { style: { visibility: selectedMode !== 'FIXEDBYCOUNT' ? 'hidden' : undefined }, hasIconPrefix: false, min: MIN_COUNT.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: end === null || end === void 0 ? void 0 : end.count, onInputChanged: (event) => {
+      } }, modes.map((mode, index$3) => (index$1.h("div", { slot: index$3.toString() },
+      index.translate(`${translationKey}${translationSuffix || ''}${mode}`),
+      mode === 'FIXEDBYCOUNT' && (index$1.h("yoo-form-input", { style: { visibility: selectedMode !== 'FIXEDBYCOUNT' ? 'hidden' : undefined }, hasIconPrefix: false, min: MIN_COUNT.toString(), size: "medium", type: "number", uiValidation: { valid: false, invalid: false }, value: end === null || end === void 0 ? void 0 : end.count, onInputChanged: (event) => {
           event.stopPropagation();
           onChange({ ...end, count: event.detail });
         }, onValidityChanged: (event) => event.stopPropagation() })),
-      mode === 'FIXEDBYDATE' && (index.h("yoo-form-date-time", { style: { visibility: selectedMode !== 'FIXEDBYDATE' ? 'hidden' : undefined }, clearable: false, minDate: getScheduleEndMinDate(start), size: "medium", type: index$1.FormFieldType.datetime, value: end === null || end === void 0 ? void 0 : end.date, onInputChanged: (event) => {
+      mode === 'FIXEDBYDATE' && (index$1.h("yoo-form-date-time", { style: { visibility: selectedMode !== 'FIXEDBYDATE' ? 'hidden' : undefined }, clearable: false, minDate: getScheduleEndMinDate(start), size: "medium", type: index$2.FormFieldType.datetime, value: end === null || end === void 0 ? void 0 : end.date, onInputChanged: (event) => {
           event.stopPropagation();
           onChange({ ...end, date: event.detail ? new Date(event.detail) : undefined });
         }, onValidityChanged: (event) => event.stopPropagation() }))))))));
 };
 
-const Start = ({ hidden, start, onChange }) => (index.h("section", { class: "schedule-start", hidden: hidden },
-  index.h("label", null, overlays.translate('SCHEDULESTART')),
-  index.h("yoo-form-date-time", { clearable: false, size: "medium", type: index$1.FormFieldType.datetime, value: start === null || start === void 0 ? void 0 : start.date, onInputChanged: (event) => {
+const Start = ({ hidden, start, onChange }) => (index$1.h("section", { class: "schedule-start", hidden: hidden },
+  index$1.h("label", null, index.translate('SCHEDULESTART')),
+  index$1.h("yoo-form-date-time", { clearable: false, size: "medium", type: index$2.FormFieldType.datetime, value: start === null || start === void 0 ? void 0 : start.date, onInputChanged: (event) => {
       event.stopPropagation();
       onChange({ ...start, date: event.detail ? new Date(event.detail) : undefined });
     }, onValidityChanged: (event) => event.stopPropagation() }),
-  index.h("yoo-tooltip", { content: overlays.translate('SCHEDULESTARTTOOLTIP'), placement: "right" },
-    index.h("yoo-icon", { color: "stable", name: "help", size: "small" }))));
+  index$1.h("yoo-tooltip", { content: index.translate('SCHEDULESTARTTOOLTIP'), placement: "right" },
+    index$1.h("yoo-icon", { color: "stable", name: "help", size: "small" }))));
 
 const Schedule = ({ endTranslationSuffix, schedule, withoutDynamicEnd, withoutStart, onChange }) => {
   const start = schedule === null || schedule === void 0 ? void 0 : schedule.start;
   const end = schedule === null || schedule === void 0 ? void 0 : schedule.end;
-  return (index.h("section", { class: "schedule" },
-    index.h(Start, { hidden: withoutStart, start: start, onChange: (start) => onChange({ start, end }) }),
-    index.h(End, { end: end, start: start, translationSuffix: endTranslationSuffix, withoutDynamic: withoutDynamicEnd, onChange: (end) => onChange({ start, end }) })));
+  return (index$1.h("section", { class: "schedule" },
+    index$1.h(Start, { hidden: withoutStart, start: start, onChange: (start) => onChange({ start, end }) }),
+    index$1.h(End, { end: end, start: start, translationSuffix: endTranslationSuffix, withoutDynamic: withoutDynamicEnd, onChange: (end) => onChange({ start, end }) })));
 };
 
 const allWeekdays = ['MONDAY', 'TUESDAY', 'WEDNESDAY', 'THURSDAY', 'FRIDAY', 'SATURDAY', 'SUNDAY'];
 const WeekOptions = ({ hidden, options, onChange }) => {
   const weekdays = (options === null || options === void 0 ? void 0 : options.byweekday) || [];
-  return (index.h("section", { class: "week", hidden: hidden },
-    index.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "weekdays", forceHideSearch: true, multiple: true, multipleSelectionSuffix: null, size: "medium", value: weekdays, values: allWeekdays, onInputChanged: (event) => {
+  return (index$1.h("section", { class: "week", hidden: hidden },
+    index$1.h("yoo-form-autocomplete", { dynamicOrdering: false, entityType: "weekdays", forceHideSearch: true, multiple: true, multipleSelectionSuffix: null, size: "medium", value: weekdays, values: allWeekdays, onInputChanged: (event) => {
         event.stopPropagation();
         onChange({ ...options, byweekday: event.detail.sort((weekday1, weekday2) => allWeekdays.indexOf(weekday1) - allWeekdays.indexOf(weekday2)) });
       }, onValidityChanged: (event) => event.stopPropagation() })));
@@ -169,9 +169,9 @@ const formRecurrenceCss = "svg:not(:root){overflow:hidden}:host{display:grid;gri
 
 const YooFormRecurrenceComponent = class {
   constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.inputChanged = index.createEvent(this, "inputChanged", 7);
-    this.validityChanged = index.createEvent(this, "validityChanged", 7);
+    index$1.registerInstance(this, hostRef);
+    this.inputChanged = index$1.createEvent(this, "inputChanged", 7);
+    this.validityChanged = index$1.createEvent(this, "validityChanged", 7);
     /**
      * If `true`, the user will see the content of advanced settings.
      */
@@ -211,7 +211,7 @@ const YooFormRecurrenceComponent = class {
         }
       });
     }
-    this.value = index$2.sanitizeRecurrence(this.value);
+    this.value = index$3.sanitizeRecurrence(this.value);
     this.updateValidity();
   }
   componentWillUpdate() {
@@ -226,14 +226,14 @@ const YooFormRecurrenceComponent = class {
     }
   }
   updateValue(value) {
-    this.value = index$2.getRecurrenceValue({ ...this.value, ...value });
+    this.value = index$3.getRecurrenceValue({ ...this.value, ...value });
     this.updateValidity();
     this.inputChanged.emit(this.value);
   }
   render() {
     const { options, schedule } = this.value || {};
     const { byhour, frequency, interval, monthOptions, weekOptions } = options || {};
-    return (index.h(index.Host, null, index.h("label", null, overlays.translate('REPEATSEVERY')), index.h(Frequency, { frequency: frequency, hours: byhour, interval: interval, withoutHours: this.withoutFrequencyHours, onChange: (frequency, byhour, interval) => this.updateValue({ options: { ...options, byhour, frequency, interval } }) }), index.h("label", { hidden: frequency !== 'YOOBICWEEK' && frequency !== 'MONTH' }, overlays.translate('REPEATSON')), index.h(WeekOptions, { hidden: frequency !== 'YOOBICWEEK', options: weekOptions, onChange: (weekOptions) => this.updateValue({ options: { ...options, weekOptions } }) }), index.h(MonthOptions, { hidden: frequency !== 'MONTH', options: monthOptions, onChange: (monthOptions) => this.updateValue({ options: { ...options, monthOptions } }) }), index.h("p", { innerHTML: overlays.translate('RECURRENCEHOURSTOOLTIP') }), index.h("yoo-collapsible", { class: "form", collapsed: !this.settingsExpanded, header: overlays.translate('ADVANCEDSETTINGS'), onContentShown: () => (this.settingsExpanded = !this.settingsExpanded) }, index.h(Schedule, { endTranslationSuffix: this.scheduleEndTranslationSuffix, schedule: schedule, withoutDynamicEnd: this.withoutScheduleDynamicEnd, withoutStart: this.withoutScheduleStart, onChange: (schedule) => this.updateValue({ schedule }) }))));
+    return (index$1.h(index$1.Host, null, index$1.h("label", null, index.translate('REPEATSEVERY')), index$1.h(Frequency, { frequency: frequency, hours: byhour, interval: interval, withoutHours: this.withoutFrequencyHours, onChange: (frequency, byhour, interval) => this.updateValue({ options: { ...options, byhour, frequency, interval } }) }), index$1.h("label", { hidden: frequency !== 'YOOBICWEEK' && frequency !== 'MONTH' }, index.translate('REPEATSON')), index$1.h(WeekOptions, { hidden: frequency !== 'YOOBICWEEK', options: weekOptions, onChange: (weekOptions) => this.updateValue({ options: { ...options, weekOptions } }) }), index$1.h(MonthOptions, { hidden: frequency !== 'MONTH', options: monthOptions, onChange: (monthOptions) => this.updateValue({ options: { ...options, monthOptions } }) }), index$1.h("p", { innerHTML: index.translate('RECURRENCEHOURSTOOLTIP') }), index$1.h("yoo-collapsible", { class: "form", collapsed: !this.settingsExpanded, header: index.translate('ADVANCEDSETTINGS'), onContentShown: () => (this.settingsExpanded = !this.settingsExpanded) }, index$1.h(Schedule, { endTranslationSuffix: this.scheduleEndTranslationSuffix, schedule: schedule, withoutDynamicEnd: this.withoutScheduleDynamicEnd, withoutStart: this.withoutScheduleStart, onChange: (schedule) => this.updateValue({ schedule }) }))));
   }
 };
 YooFormRecurrenceComponent.style = formRecurrenceCss;

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

@@ -3,10 +3,10 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
-const commonHelpers = require('./common-helpers-9f63a319.js');
-const formInputHelpers = require('./form-input-helpers-2d988e31.js');
-const overlays = require('./overlays-e5d2ff76.js');
+require('./index-6f92bccb.js');
+const commonHelpers = require('./common-helpers-44428bf7.js');
+const formInputHelpers = require('./form-input-helpers-4ad38e19.js');
+const index$1 = require('./index-0cfb67d1.js');
 require('./lodash-a9050d79.js');
 require('./index-a1bbe627.js');
 require('./_commonjsHelpers-94df2ea7.js');
@@ -55,13 +55,13 @@ const YooFormReorderComponent = class {
   resetKeys() {
     var _a, _b, _c, _d, _e;
     const activeKeys = [
-      overlays.getUUID(),
-      ...(((_b = (_a = this.definition) === null || _a === void 0 ? void 0 : _a.active) === null || _b === void 0 ? void 0 : _b.values) || []).map(() => overlays.getUUID())
+      index$1.getUUID(),
+      ...(((_b = (_a = this.definition) === null || _a === void 0 ? void 0 : _a.active) === null || _b === void 0 ? void 0 : _b.values) || []).map(() => index$1.getUUID())
     ];
     let availableKeys = [];
     if ((_c = this.definition) === null || _c === void 0 ? void 0 : _c.available) {
-      availableKeys.push(overlays.getUUID());
-      availableKeys = availableKeys.concat((((_e = (_d = this.definition) === null || _d === void 0 ? void 0 : _d.available) === null || _e === void 0 ? void 0 : _e.values) || []).map(() => overlays.getUUID()));
+      availableKeys.push(index$1.getUUID());
+      availableKeys = availableKeys.concat((((_e = (_d = this.definition) === null || _d === void 0 ? void 0 : _d.available) === null || _e === void 0 ? void 0 : _e.values) || []).map(() => index$1.getUUID()));
     }
     this.keys = this.reverseValueDimensions ? availableKeys.concat(activeKeys) : activeKeys.concat(availableKeys);
   }
@@ -157,7 +157,7 @@ const YooFormReorderComponent = class {
    * and can be moved into separate class and reused somewhere else.
    */
   sortable(value, element, index) {
-    if (!overlays.Draggable) {
+    if (!index$1.Draggable) {
       return;
     }
     const totalItems = this.listItems.length;
@@ -170,7 +170,7 @@ const YooFormReorderComponent = class {
       index,
       setIndex: null
     };
-    return overlays.gsapTimeline().then((timeline) => {
+    return index$1.gsapTimeline().then((timeline) => {
       const animation = timeline({
         boxShadow: 'rgba(40, 47, 54, 0.07) 0px 8px 16px 0px',
         force3D: true,
@@ -184,7 +184,7 @@ const YooFormReorderComponent = class {
         scope.update();
       };
       const moveAnimation = () => {
-        overlays.gsapTo(element, 0.3, { y: this.getListItemPosition(sortable.index) });
+        index$1.gsapTo(element, 0.3, { y: this.getListItemPosition(sortable.index) });
       };
       const releaseAction = () => {
         if (needReturn) {
@@ -193,7 +193,7 @@ const YooFormReorderComponent = class {
         animation.reverse();
         moveAnimation();
         this.checkItemClasses();
-        if (value.isHeader || !overlays.isWeb(this.host)) {
+        if (value.isHeader || !index$1.isWeb(this.host)) {
           sortable.dragger.disable();
         }
         this.changeOutput();
@@ -206,7 +206,7 @@ const YooFormReorderComponent = class {
           needReturn = !changed; // if index has not been changed, then need move to original position after item drop
         }
       };
-      const dragger = new overlays.Draggable(element, {
+      const dragger = new index$1.Draggable(element, {
         onDragStart() {
           dragStartAction(this);
         },
@@ -219,7 +219,7 @@ const YooFormReorderComponent = class {
         type: 'y',
         autoScroll: 1
       });
-      if (this.readonly || !this.allowDragAndDrop || value.isHeader || !overlays.isWeb(this.host)) {
+      if (this.readonly || !this.allowDragAndDrop || value.isHeader || !index$1.isWeb(this.host)) {
         dragger.disable(); // defaultly disabled, it is enabled by click/touch grip area (right part)
       }
       sortable.dragger = dragger;
@@ -235,14 +235,14 @@ const YooFormReorderComponent = class {
     });
   }
   setRowPosition(element, index) {
-    overlays.gsapSet(element, { y: this.getListItemPosition(index) });
+    index$1.gsapSet(element, { y: this.getListItemPosition(index) });
   }
   changeGroup(sortableItem, toGroup) {
     if (!toGroup) {
       toGroup = sortableItem.value.group === 'active' ? 'available' : 'active';
     }
     sortableItem.value.group = toGroup;
-    if (!overlays.isWeb(this.host)) {
+    if (!index$1.isWeb(this.host)) {
       if (!sortableItem.value.isHeader && toGroup === 'active') {
         sortableItem.dragger.enable();
       }
@@ -344,18 +344,18 @@ const YooFormReorderComponent = class {
     // clamps a value to a min/max
     return value < a ? a : value > b ? b : value;
   }
-  renderItem(value, index$1) {
-    const key = this.keys[index$1];
+  renderItem(value, index$2) {
+    const key = this.keys[index$2];
     const classList = {
       'list-item': true,
       header: value.isHeader,
       'always-active': value.locked
     };
     classList[value.group] = true;
-    return (index.h("div", { class: classList, key: key }, index.h("div", { class: "item-content" }, !value.isHeader && !value.locked && !this.readonly && index.h("yoo-icon", { class: "action-icon active", size: "small", name: "circle-plus", color: "app-color", onClick: () => this.moveToActive(value) }), !value.isHeader && !value.locked && !this.readonly && index.h("yoo-icon", { class: "action-icon available", size: "small", name: "circle-minor", color: "danger", onClick: () => this.openRemoving(value) }), !value.isHeader && (value.locked || this.readonly) && index.h("yoo-icon", { class: "lock-icon", color: "stable", name: "lock" }), !value.isHeader && value.icon && index.h("yoo-icon", { class: "item-icon", size: "small", name: value.icon }), index.h("span", { class: "value", "data-value": JSON.stringify(value) }, overlays.translate(value.title || value.name)), !value.isHeader && !this.readonly && this.allowDragAndDrop && (index.h("span", { class: "grip", onClick: () => this.unlockItem(value), onTouchStart: () => this.unlockItem(value) }, index.h("yoo-icon", { name: "ranking-toggle", color: "stable" })))), !value.isHeader && (index.h("div", { class: "remove", onClick: () => this.onRemove(value) }, overlays.translate('REMOVE')))));
+    return (index.h("div", { class: classList, key: key }, index.h("div", { class: "item-content" }, !value.isHeader && !value.locked && !this.readonly && index.h("yoo-icon", { class: "action-icon active", size: "small", name: "circle-plus", color: "app-color", onClick: () => this.moveToActive(value) }), !value.isHeader && !value.locked && !this.readonly && index.h("yoo-icon", { class: "action-icon available", size: "small", name: "circle-minor", color: "danger", onClick: () => this.openRemoving(value) }), !value.isHeader && (value.locked || this.readonly) && index.h("yoo-icon", { class: "lock-icon", color: "stable", name: "lock" }), !value.isHeader && value.icon && index.h("yoo-icon", { class: "item-icon", size: "small", name: value.icon }), index.h("span", { class: "value", "data-value": JSON.stringify(value) }, index$1.translate(value.title || value.name)), !value.isHeader && !this.readonly && this.allowDragAndDrop && (index.h("span", { class: "grip", onClick: () => this.unlockItem(value), onTouchStart: () => this.unlockItem(value) }, index.h("yoo-icon", { name: "ranking-toggle", color: "stable" })))), !value.isHeader && (index.h("div", { class: "remove", onClick: () => this.onRemove(value) }, index$1.translate('REMOVE')))));
   }
   unlockItem(value) {
-    if (!value.isHeader && !overlays.isWeb(this.host)) {
+    if (!value.isHeader && !index$1.isWeb(this.host)) {
       this.sortables.find((s) => s.value.name === value.name).dragger.enable();
     }
   }