@yoobic/yobi 8.5.0-60 → 8.5.0-62

package/dist/cjs/yoo-photo-editor.cjs.entry.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-const overlays = require('./overlays-e5d2ff76.js');
-const index$1 = require('./index-9aadeb94.js');
+const index$1 = require('./index-4cdf7949.js');
+const index$2 = require('./index-7790c794.js');
 const lodash = require('./lodash-a9050d79.js');
-require('./index-d126a9fa.js');
+require('./index-5dd9199d.js');
 const annotationsHelpers = require('./annotations-helpers-fb554cca.js');
-const commonHelpers = require('./common-helpers-9f63a319.js');
-const draggableDotsHelpers = require('./draggable-dots-helpers-1e8c5d73.js');
-const formInputHelpers = require('./form-input-helpers-2d988e31.js');
-const localForage = require('./localForage-d0842cbe.js');
-require('./index-a1bbe627.js');
+const commonHelpers = require('./common-helpers-0724ae60.js');
+const draggableDotsHelpers = require('./draggable-dots-helpers-7fe723cd.js');
+const formInputHelpers = require('./form-input-helpers-fb275467.js');
+const localForage = require('./localForage-e47d3702.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const Textbox = ({ annotation, onAnnotationClick, onType, readonly, imageSize, hidden }) => {
@@ -21,7 +21,7 @@ const Textbox = ({ annotation, onAnnotationClick, onType, readonly, imageSize, h
 };
 const Dot = ({ annotation, tooltipProps, onAnnotationClick, onDotSave, readonly, imageSize, isWeb, disableTooltip, hidden }) => {
   var _a;
-  const dotTextColor = overlays.getContrastColorName((_a = annotation === null || annotation === void 0 ? void 0 : annotation.styles) === null || _a === void 0 ? void 0 : _a.backgroundColor);
+  const dotTextColor = index$1.getContrastColorName((_a = annotation === null || annotation === void 0 ? void 0 : annotation.styles) === null || _a === void 0 ? void 0 : _a.backgroundColor);
   return !annotationsHelpers.isAnnotationDeleted(annotation) &&
     index.h("div", { class: "annotation", key: annotation._id, id: annotation._id, ...{ hidden, type: 'dot' }, style: draggableDotsHelpers.getAnnotationStyle(annotation, { imageSize, readonly }) },
       index.h("yoo-tooltip", { placement: "top", content: annotation.text, ...{
@@ -168,7 +168,7 @@ const Button = ({ button, onButtonClick }) => {
     ...(!hasActionType && { 'animated-icon': iconName, 'animated-text': !iconName }),
     ...(hasActionType && { ref: (el) => (actionButtonElement[actionType] = el) })
   };
-  return (index.h("yoo-button", { rippleType: "unbounded", shape: buttonShape, ...buttonConf, onClick: (ev) => onButtonClick(ev, btnContent) }, iconName ? index.h("yoo-icon", { name: iconName, color: fill === 'transparent' ? color : 'light' }) : overlays.translate(textContent)));
+  return (index.h("yoo-button", { rippleType: "unbounded", shape: buttonShape, ...buttonConf, onClick: (ev) => onButtonClick(ev, btnContent) }, iconName ? index.h("yoo-icon", { name: iconName, color: fill === 'transparent' ? color : 'light' }) : index$1.translate(textContent)));
 };
 let navBarElement;
 const getNavbarElement = () => navBarElement;
@@ -321,7 +321,7 @@ const YooPhotoEditorComponent = class {
     return draggableDotsHelpers.getBoundingClient(this.canvasDrawingsElement);
   }
   get allowToggleEditTools() {
-    return overlays.isNativeMobile() ? this.isDrawMode || this.lastMode === 'draw' : !!this.canvasSrcElement;
+    return index$1.isNativeMobile() ? this.isDrawMode || this.lastMode === 'draw' : !!this.canvasSrcElement;
   }
   get isPreview() {
     return this.display === 'preview';
@@ -366,7 +366,7 @@ const YooPhotoEditorComponent = class {
     return this.isReadonly && ((_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.scaleFactor) < 1 && ((_b = this.zoomable) !== null && _b !== void 0 ? _b : !this.isPreview);
   }
   get isImageZoomed() {
-    return overlays.getTransformInfos(this.imageElement).scaleX > 1;
+    return index$1.getTransformInfos(this.imageElement).scaleX > 1;
   }
   get navBarElement() {
     return getNavbarElement();
@@ -509,7 +509,7 @@ const YooPhotoEditorComponent = class {
     };
   }
   get maxViewport() {
-    const { width, height } = overlays.getMaxViewPortImage(this.host, this.isPreview);
+    const { width, height } = index$1.getMaxViewPortImage(this.host, this.isPreview);
     return {
       width,
       height: height - (!this.isPreview && this.navbarVisiblity !== 'disabled' ? 112 : 0)
@@ -524,7 +524,7 @@ const YooPhotoEditorComponent = class {
     };
   }
   async overlayDismiss() {
-    if (overlays.isWeb(this.host)) {
+    if (index$1.isWeb(this.host)) {
       this.close(true);
     }
   }
@@ -532,7 +532,7 @@ const YooPhotoEditorComponent = class {
     this.isLoading = false;
   }
   async close(forceCheckForChanges) {
-    !this.isReadonly ? this.closeEditableMode(forceCheckForChanges) : overlays.closeModal(null);
+    !this.isReadonly ? this.closeEditableMode(forceCheckForChanges) : index$1.closeModal(null);
   }
   async closeEditableMode(forceCheckForChanges) {
     const hasCloseHandler = lodash.isFunction(this.closeHandler);
@@ -554,7 +554,7 @@ const YooPhotoEditorComponent = class {
   //This method is not part of the internal logic of the component for performance reason
   //This should be used externally when needed.
   async initResizeObserver() {
-    this.canvasDrawingsElement && overlays.isWeb(this.host) && index$1.resizeObserve(this.canvasDrawingsElement, () => this.displayDrawings());
+    this.canvasDrawingsElement && index$1.isWeb(this.host) && index$2.resizeObserve(this.canvasDrawingsElement, () => this.displayDrawings());
   }
   async prepareImageSize() {
     this.imageSize = null;
@@ -587,7 +587,7 @@ const YooPhotoEditorComponent = class {
   }
   disconnectedCallback() {
     this.toggleKeyboardListeners(false);
-    !this.isPreview && overlays.setStatusBarDarkMode(false);
+    !this.isPreview && index$1.setStatusBarDarkMode(false);
     [this.viewObserverSwitch,
       this.canvasDrawingsObserver,
       this.canvasSrcObserver]
@@ -597,14 +597,14 @@ const YooPhotoEditorComponent = class {
     this.initResizeObserver();
     this.initMutationObservers();
     this.toggleKeyboardListeners(true);
-    !this.isPreview && overlays.setStatusBarDarkMode(true);
+    !this.isPreview && index$1.setStatusBarDarkMode(true);
     this.savedAnnotationElements = lodash.cloneDeep(this.annotationElements);
     this.showSaveInitial && getActionButton().validate.classList.add('active');
     this.savedAnnotations = lodash.cloneDeep(this.annotations);
-    overlays.ScreenOrientation === null || overlays.ScreenOrientation === void 0 ? void 0 : overlays.ScreenOrientation.onChange().subscribe(() => index.forceUpdate(this));
+    index$1.ScreenOrientation === null || index$1.ScreenOrientation === void 0 ? void 0 : index$1.ScreenOrientation.onChange().subscribe(() => index.forceUpdate(this));
   }
   async prepareSrc() {
-    this.finalSrc = overlays.getMedia(this.resizeSrc(overlays.cleanupWKWebViewFilePath((await localForage.getFromOfflineStorage(this.src)))));
+    this.finalSrc = index$1.getMedia(this.resizeSrc(index$1.cleanupWKWebViewFilePath((await localForage.getFromOfflineStorage(this.src)))));
     this.drawings = this.resizeSrc(this.drawings, { jpg: false });
   }
   resizeSrc(sourceSrc, options) {
@@ -612,18 +612,18 @@ const YooPhotoEditorComponent = class {
     return sourceSrc && commonHelpers.cloudinary(sourceSrc, {
       ...this.cloudinaryOptions, fit: true, noRatio: true,
       ...options || {},
-      ...(!overlays.isWeb(this.host) && {
+      ...(!index$1.isWeb(this.host) && {
         width: ((_a = this.cloudinaryOptions) === null || _a === void 0 ? void 0 : _a.width) || this.maxImageSize.width
       })
     });
   }
   async getImageSize() {
     const { width, height } = this.maxViewport;
-    let imgSize = await overlays.getImageSize(this.finalSrc, !this.isPreview ? this.alertInvalidUrl.bind(this) : () => { return; });
-    imgSize.width > this.maxImageSize.width && (imgSize = await overlays.getResizedImageSize({ imgSize, maxWidth: this.maxImageSize.width, maxHeight: this.maxImageSize.height }));
+    let imgSize = await index$1.getImageSize(this.finalSrc, !this.isPreview ? this.alertInvalidUrl.bind(this) : () => { return; });
+    imgSize.width > this.maxImageSize.width && (imgSize = await index$1.getResizedImageSize({ imgSize, maxWidth: this.maxImageSize.width, maxHeight: this.maxImageSize.height }));
     const imgOptions = { imgSize, maxWidth: width, maxHeight: height };
-    const imgResizedSize = await overlays.getResizedImageSize(imgOptions);
-    const imgScaleFactor = await overlays.getImageScaleFactor(imgOptions);
+    const imgResizedSize = await index$1.getResizedImageSize(imgOptions);
+    const imgScaleFactor = await index$1.getImageScaleFactor(imgOptions);
     this.imageSize = {
       natural: imgSize,
       resized: imgResizedSize,
@@ -683,7 +683,7 @@ const YooPhotoEditorComponent = class {
     (_c = this.viewObserverSwitch) === null || _c === void 0 ? void 0 : _c.observe(this.zoomElement, { childList: true });
   }
   toggleKeyboardListeners(add) {
-    if (overlays.isNativeMobile() && !this.isPreview) {
+    if (index$1.isNativeMobile() && !this.isPreview) {
       ['DidHide', 'DidShow'].forEach((event) => window[`${add ? 'add' : 'remove'}EventListener`](`keyboard${event}`, this.keyboardActions[event]));
     }
   }
@@ -694,7 +694,7 @@ const YooPhotoEditorComponent = class {
     }
   }
   getDrawingsUrl() {
-    return !draggableDotsHelpers.isCanvasBlank(this.canvasDrawingsElement) ? overlays.getAsyncExtraData({ type: 'media-upload', params: { mediaData: this.currentDrawings } }) : Promise.resolve('');
+    return !draggableDotsHelpers.isCanvasBlank(this.canvasDrawingsElement) ? index$1.getAsyncExtraData({ type: 'media-upload', params: { mediaData: this.currentDrawings } }) : Promise.resolve('');
   }
   async displayDrawings(drawings = this.drawings) {
     try {
@@ -705,7 +705,7 @@ const YooPhotoEditorComponent = class {
     }
   }
   alertInvalidUrl() {
-    overlays.showAlert('ERROR', [overlays.translate('CONTINUE'), overlays.translate('CLOSE')], overlays.translate('INVALIDURLBODY')).then(ret => {
+    index$1.showAlert('ERROR', [index$1.translate('CONTINUE'), index$1.translate('CLOSE')], index$1.translate('INVALIDURLBODY')).then(ret => {
       ret ? this.closePhotoEditor() : (this.isLoading = false);
     });
   }
@@ -785,9 +785,9 @@ const YooPhotoEditorComponent = class {
       const dragAction = () => {
         this.clearFocus();
         this.hideAllTooltips();
-        isDeleting = overlays.Draggable.hitTest(annotationElement, getActionButton().delete, '35%');
+        isDeleting = index$1.Draggable.hitTest(annotationElement, getActionButton().delete, '35%');
         getActionButton().delete.classList.toggle('hit', isDeleting);
-        overlays.gsapTo(annotationElement, this.animationDelay, { scale: isDeleting ? .25 : 1 });
+        index$1.gsapTo(annotationElement, this.animationDelay, { scale: isDeleting ? .25 : 1 });
       };
       const dragEndAction = async (coords) => {
         var _a;
@@ -797,8 +797,8 @@ const YooPhotoEditorComponent = class {
         getActionButton().delete.classList.remove(...['active', 'hit']);
         this.activeAnnotation = draggableDotsHelpers.updateAnnotationLocal(this.activeAnnotation, Object.assign({ transform: { current: coords } }, isDeleting && { isDeleted: true, isFocused: false }));
         if (isDeleting) {
-          if (overlays.isNativeMobile()) {
-            await overlays.vibrateHapticMedium();
+          if (index$1.isNativeMobile()) {
+            await index$1.vibrateHapticMedium();
           }
           this.switchMode();
         }
@@ -809,7 +809,7 @@ const YooPhotoEditorComponent = class {
         }
         this.toggleSaveButton();
       };
-      const draggable = new overlays.Draggable(annotationElement, {
+      const draggable = new index$1.Draggable(annotationElement, {
         type: 'x,y',
         bounds: draggableDotsHelpers.getAnnotationDraggableBounds(annotationElement, this.hostBounds),
         zIndexBoost: false,
@@ -834,7 +834,7 @@ const YooPhotoEditorComponent = class {
         this.savedDots = lodash.cloneDeep(this.dots);
       }
       if ((_d = this.activeDotElement) === null || _d === void 0 ? void 0 : _d.tooltipElement) {
-        overlays.isIOS() && overlays.enableKeyboardResize();
+        index$1.isIOS() && index$1.enableKeyboardResize();
         this.switchMode('annotate');
       }
     }
@@ -854,7 +854,7 @@ const YooPhotoEditorComponent = class {
       const isTextBox = newAnnotation.type === 'text';
       const newElement = (_d = (_c = (_b = this[`${isTextBox ? 'textbox' : 'dot'}Elements`]) === null || _b === void 0 ? void 0 : _b.filter((el) => el)) === null || _c === void 0 ? void 0 : _c.slice(-1)) === null || _d === void 0 ? void 0 : _d[0];
       if (newElement && this.annotationsContainerElement) {
-        isTextBox && await overlays.scaleUpAnimation(newElement, this.animationDelay / 2);
+        isTextBox && await index$1.scaleUpAnimation(newElement, this.animationDelay / 2);
         if (newElement) {
           this.hasImageBeenCleaned = false;
           this.getDraggableActions(newElement);
@@ -870,7 +870,7 @@ const YooPhotoEditorComponent = class {
     if (annotationElement && this.imageBounds) {
       const elementBounds = draggableDotsHelpers.getBoundingClient(annotationElement);
       const getRelativePosition = (direction) => this.imageBounds[direction === 'left' ? 'width' : 'height'] * (parseFloat(annotationElement.style[direction]) || 0) / 100;
-      (_a = overlays.Draggable.get(annotationElement)) === null || _a === void 0 ? void 0 : _a.applyBounds({
+      (_a = index$1.Draggable.get(annotationElement)) === null || _a === void 0 ? void 0 : _a.applyBounds({
         minX: 0 - (this.imageBounds.x - this.hostBounds.x) - getRelativePosition('left'),
         maxX: this.imageBounds.width + this.imageBounds.x - this.hostBounds.x - elementBounds.width - getRelativePosition('left'),
         minY: this.hostBounds.y - this.imageBounds.y + 44 - getRelativePosition('top'),
@@ -917,7 +917,7 @@ const YooPhotoEditorComponent = class {
           if (coords) {
             this.canvasContext.lineWidth = this.size;
             this.canvasContext.lineTo(coords.x, coords.y);
-            this.canvasContext.strokeStyle = overlays.getCssColor(this.color, this.color);
+            this.canvasContext.strokeStyle = index$1.getCssColor(this.color, this.color);
             this.canvasContext.lineCap = 'round';
             this.canvasContext.stroke();
           }
@@ -935,7 +935,7 @@ const YooPhotoEditorComponent = class {
         }
       };
       // Web
-      if (overlays.isWeb(this.host)) {
+      if (index$1.isWeb(this.host)) {
         this.canvasDrawingsElement.onmousedown = startDraw;
         this.canvasDrawingsElement.onmousemove = draw;
         this.canvasDrawingsElement.onmouseup = stopDraw;
@@ -968,7 +968,7 @@ const YooPhotoEditorComponent = class {
       : draggableDotsHelpers.getRelativeCenter(this.activeElement, this.imageBounds);
     const getBoundAxis = () => (this.textEditorElement ? ['left', 'top'] : ['x', 'y']);
     this.activeElement &&
-      overlays.gsapSet(this.activeElement, {
+      index$1.gsapSet(this.activeElement, {
         [getBoundAxis()[0]]: centerCoords[getBoundAxis()[0]],
         [getBoundAxis()[1]]: centerCoords[getBoundAxis()[1]]
       });
@@ -980,9 +980,9 @@ const YooPhotoEditorComponent = class {
   }
   changeColor() {
     var _a;
-    const cssColor = overlays.getCssColor(this.color, this.color);
+    const cssColor = index$1.getCssColor(this.color, this.color);
     const el = ((_a = this.activeDotElement) === null || _a === void 0 ? void 0 : _a.dotInnerElement) || this.activeElement;
-    const defaultAnnotationTextColor = overlays.getContrastColor(cssColor);
+    const defaultAnnotationTextColor = index$1.getContrastColor(cssColor);
     const isBackgroundTextEnabled = this.isDotMode || this.backgroundText === 'on';
     const backgroundColor = isBackgroundTextEnabled ? cssColor : 'transparent';
     const color = isBackgroundTextEnabled ? defaultAnnotationTextColor : cssColor;
@@ -1029,7 +1029,7 @@ const YooPhotoEditorComponent = class {
       });
     };
     const leavePicker = () => this.leaveColorPickerMode();
-    if (overlays.isWeb(this.host)) {
+    if (index$1.isWeb(this.host)) {
       this.cursorPickerElement.onmousedown = leavePicker;
       this.canvasSrcElement.onmousemove = enterPicker;
     }
@@ -1057,7 +1057,7 @@ const YooPhotoEditorComponent = class {
   }
   async addPredefinedText() {
     var _a, _b;
-    const formatedText = await draggableDotsHelpers.showPredefinedTextsDialog(overlays.isWeb(this.host), ((_a = this.activeDotElement) === null || _a === void 0 ? void 0 : _a.tooltipElement) || this.activeElement);
+    const formatedText = await draggableDotsHelpers.showPredefinedTextsDialog(index$1.isWeb(this.host), ((_a = this.activeDotElement) === null || _a === void 0 ? void 0 : _a.tooltipElement) || this.activeElement);
     this.activeAnnotation && (this.activeAnnotation.text = formatedText);
     if (this.isTextMode) {
       this.activeElement.innerHTML = formatedText;
@@ -1123,14 +1123,14 @@ const YooPhotoEditorComponent = class {
   async showActionDialog(action, type) {
     await this.unfocusAnnotation();
     const translations = [type, 'YOOBICKEEP', 'DISCARD', 'AREYOUSURE'];
-    overlays.showAlert(overlays.translate(translations[0]), [overlays.translate(translations[1]), overlays.translate(translations[2])], overlays.translate(translations[3]), 'photo-editor-alert').then((discardChanges) => {
+    index$1.showAlert(index$1.translate(translations[0]), [index$1.translate(translations[1]), index$1.translate(translations[2])], index$1.translate(translations[3]), 'photo-editor-alert').then((discardChanges) => {
       if (discardChanges && lodash.isFunction(this.editorActions[action])) {
         this.editorActions[action]();
       }
     });
   }
   async restoreSavedAnnotations(type) {
-    await Promise.all([Promise.resolve(this.displayDrawings()), ...this.savedAnnotationElements.map(e => e && overlays.gsapSet(e, { clearProps: 'transform' }))]);
+    await Promise.all([Promise.resolve(this.displayDrawings()), ...this.savedAnnotationElements.map(e => e && index$1.gsapSet(e, { clearProps: 'transform' }))]);
     this.annotations = lodash.cloneDeep(draggableDotsHelpers.removeLocalsFromAnnotations(!type ? this.savedAnnotations : this.savedDots.concat(this.textboxes)));
     this.drawingsStackIndex = -1;
   }
@@ -1147,7 +1147,7 @@ const YooPhotoEditorComponent = class {
     }, draggableDotsHelpers.LOADING_DELAY);
   }
   closePhotoEditor(dataChanges) {
-    return overlays.closeModal(dataChanges || {
+    return index$1.closeModal(dataChanges || {
       annotations: this.savedAnnotations,
       drawings: this.drawings
     });
@@ -1167,11 +1167,11 @@ const YooPhotoEditorComponent = class {
       }
       if (extraAction === null || extraAction === void 0 ? void 0 : extraAction['subActions']) {
         const actions = extraAction['subActions'];
-        overlays.isWeb(this.host) ?
-          overlays.showContextMenu(ev, {
+        index$1.isWeb(this.host) ?
+          index$1.showContextMenu(ev, {
             hostElement: ev === null || ev === void 0 ? void 0 : ev.target,
             contentButtons: actions
-          }) : overlays.showActionSheet(actions, null, {}, null, ev);
+          }) : index$1.showActionSheet(actions, null, {}, null, ev);
       }
       switch (actionName) {
         // Main Actions
@@ -1242,7 +1242,7 @@ const YooPhotoEditorComponent = class {
       if (e) {
         e.classList.remove('hidden');
         e.classList.toggle('draggable', enableDraggable);
-        overlays.Draggable.get(e) ? overlays.Draggable.get(e)[enableDraggable ? 'enable' : 'disable']() : this.getDraggableActions(e)[enableDraggable ? 'enable' : 'disable']();
+        index$1.Draggable.get(e) ? index$1.Draggable.get(e)[enableDraggable ? 'enable' : 'disable']() : this.getDraggableActions(e)[enableDraggable ? 'enable' : 'disable']();
         //bypass fix gsap draggable auto-generating user-select on editing a focusing textbox
         ['user-select', '-webkit-user-select', '-moz-user-select'].forEach(us => e.style.removeProperty(us));
       }
@@ -1276,7 +1276,7 @@ const YooPhotoEditorComponent = class {
       this.switchBackToExtras();
     }
     else {
-      await Promise.all((_a = this.annotationElements) === null || _a === void 0 ? void 0 : _a.map(e => overlays.gsapSet(e, { clearProps: 'transform' })));
+      await Promise.all((_a = this.annotationElements) === null || _a === void 0 ? void 0 : _a.map(e => index$1.gsapSet(e, { clearProps: 'transform' })));
       this.isLoading = false;
       ((_b = this.submitButton) === null || _b === void 0 ? void 0 : _b.handler) ? this.submitButton.handler(savedChanges) : this.closePhotoEditor(savedChanges);
     }
@@ -1406,10 +1406,10 @@ const YooPhotoEditorComponent = class {
   renderDot(dot) {
     var _a;
     const disableTooltip = this.isPreview && !this.isImageZoomable;
-    return index.h(Dot, { annotation: dot, readonly: this.isReadonly, imageSize: (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.resized, isWeb: overlays.isWeb(this.host), disableTooltip: disableTooltip, tooltipProps: { showOnCreate: !disableTooltip && this.isDotMode }, hidden: this.isLoading, onAnnotationClick: (ev) => this.clickAnnotation(ev, dot), onDotSave: () => this.unfocusAnnotation() });
+    return index.h(Dot, { annotation: dot, readonly: this.isReadonly, imageSize: (_a = this.imageSize) === null || _a === void 0 ? void 0 : _a.resized, isWeb: index$1.isWeb(this.host), disableTooltip: disableTooltip, tooltipProps: { showOnCreate: !disableTooltip && this.isDotMode }, hidden: this.isLoading, onAnnotationClick: (ev) => this.clickAnnotation(ev, dot), onDotSave: () => this.unfocusAnnotation() });
   }
   renderOverlay() {
-    return this.isCreateMode && (index.h("div", { id: "overlay", style: this.imageSizeStyle.resized, onClick: (ev) => this.overlayClick(ev) }, this.isDotCreateMode && index.h("div", null, overlays.translate('TAPTOINSERTCOMMENT')), this.isTextCreateMode && this.renderTextEditor()));
+    return this.isCreateMode && (index.h("div", { id: "overlay", style: this.imageSizeStyle.resized, onClick: (ev) => this.overlayClick(ev) }, this.isDotCreateMode && index.h("div", null, index$1.translate('TAPTOINSERTCOMMENT')), this.isTextCreateMode && this.renderTextEditor()));
   }
   renderHeader() {
     return this.navbarVisiblity !== 'disabled' && !this.isPreview && index.h(Navbar, { visibility: this.navbarVisiblity, animated: this.mode !== this.lastMode, currentOptions: this.menuOptions.getOptions()[this.mode], onOptionClick: (ev, btnContent) => this.optionsClick(ev, btnContent) });

package/dist/cjs/yoo-pivot-table.cjs.entry.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-9ca0e46c.js');
-require('./index-9aadeb94.js');
+require('./index-7790c794.js');
 const _commonjsHelpers = require('./_commonjsHelpers-94df2ea7.js');
 const lodash = require('./lodash-a9050d79.js');
-const gridRenderers = require('./grid-renderers-853f422f.js');
-const overlays = require('./overlays-e5d2ff76.js');
-require('./index-a1bbe627.js');
-require('./incentive-helpers-a2954f55.js');
-require('./missions-helpers-c32f14f9.js');
-require('./common-helpers-9f63a319.js');
-require('./form-helpers-2fcb4674.js');
+const gridRenderers = require('./grid-renderers-1144c063.js');
+const index$1 = require('./index-4cdf7949.js');
+require('./index-cb8276bc.js');
+require('./incentive-helpers-920b03c3.js');
+require('./missions-helpers-36846610.js');
+require('./common-helpers-0724ae60.js');
+require('./form-helpers-7c18f9c4.js');
 require('./geolocation-helpers-4c8ccc80.js');
 
 var domToImage = _commonjsHelpers.createCommonjsModule(function (module) {
@@ -842,7 +842,7 @@ const YooPivotTableComponent = class {
       this.options.rowData = this.campaignsPivotTableKpiSortRows(this.options.rowData);
       if (this.isFullScreen) {
         this.options.columnDefs.unshift({
-          headerName: overlays.translate('YOOBICVIEW'),
+          headerName: index$1.translate('YOOBICVIEW'),
           colId: 'viewButton',
           groupId: 'view',
           width: 90,
@@ -857,7 +857,7 @@ const YooPivotTableComponent = class {
           cellRendererParams: {
             icon: 'eye',
             color: 'dark',
-            text: overlays.translate('YOOBICVIEW')
+            text: index$1.translate('YOOBICVIEW')
           },
           onCellClicked: (params) => {
             let keys;

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

@@ -3,10 +3,10 @@
 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 overlays = require('./overlays-e5d2ff76.js');
-require('./index-a1bbe627.js');
+const index$1 = require('./index-4cdf7949.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const podiumCss = "svg:not(:root){overflow:hidden}:host{--podium-height:30rem;display:block}:host .podium-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;height:100%}:host .podium-container yoo-icon{margin-right:0.75rem}:host .podium-container yoo-img{width:18.75rem;height:var(--podium-height);overflow:inherit}:host([hidden]){display:none}";
@@ -79,7 +79,7 @@ const YooPodiumComponent = class {
     if (usernameTextElement && firstName) {
       this.displayElement(usernameTextElement, true);
       const usernameTspanElement = usernameTextElement.querySelector('tspan');
-      usernameTspanElement.style.fill = overlays.getCssColor('dark');
+      usernameTspanElement.style.fill = index$1.getCssColor('dark');
       if (firstName.length >= MAX_USERNAME_LENGTH) {
         firstName = `${firstName.substring(0, MAX_USERNAME_LENGTH)}...`;
       }
@@ -108,7 +108,7 @@ const YooPodiumComponent = class {
         const usernameWidth = usernameTextElement.getBoundingClientRect().width;
         const translateYValue = prefixClass === 'right' ? 60 : prefixClass === 'left' ? -28 : 10;
         let translateXValue = (avatarWidth - usernameWidth) / 2;
-        overlays.isRTL() && (translateXValue += usernameWidth);
+        index$1.isRTL() && (translateXValue += usernameWidth);
         usernameTextElement.setAttribute('transform', `translate(${translateXValue}, ${translateYValue})`);
       }
     }
@@ -120,10 +120,10 @@ const YooPodiumComponent = class {
       this.displayElement(pointsContainerElement, true);
       if (pointsElement) {
         const pointLength = points.toString().length || 1;
-        const translateX = overlays.isRTL() ? 4 * (pointLength + 1) : 4 * (pointLength - 1);
+        const translateX = index$1.isRTL() ? 4 * (pointLength + 1) : 4 * (pointLength - 1);
         pointsElement.setAttribute('transform', pointsTransform.replace('#tslX', `${prefixClass === 'right'
-          ? overlays.isRTL() ? -translateX : translateX
-          : overlays.isRTL() ? translateX : -translateX}`));
+          ? index$1.isRTL() ? -translateX : translateX
+          : index$1.isRTL() ? translateX : -translateX}`));
       }
     }
     else {
@@ -139,7 +139,7 @@ const YooPodiumComponent = class {
       if (user) {
         let image = user.imageData;
         if (image) {
-          image = new overlays.Cloudinary(image)
+          image = new index$1.Cloudinary(image)
             .crop('crop')
             .aspectRatio(1, 1)
             .getUrl();
@@ -162,7 +162,7 @@ const YooPodiumComponent = class {
           const initialUsernameText = (lodash.get(user, 'firstName', false) && lodash.get(user, 'lastName', false)) ? `${getInitial(user.firstName)}${getInitial(user.lastName)}` : getInitial(user.username);
           if (noImageAvatarContainerElement) {
             this.displayElement(noImageAvatarContainerElement, true);
-            overlays.isRTL() && (noImageAvatarContainerElement.setAttribute('style', 'direction: ltr')); //* direction: rtl does some weird stuff and is not needed
+            index$1.isRTL() && (noImageAvatarContainerElement.setAttribute('style', 'direction: ltr')); //* direction: rtl does some weird stuff and is not needed
             const textElement = noImageAvatarContainerElement.querySelector('tspan');
             textElement.textContent = initialUsernameText;
             noImageAvatarContainerElement.addEventListener('click', () => {
@@ -204,7 +204,7 @@ const YooPodiumComponent = class {
   }
   onBeforeInjectSVG(svgElement) {
     if (svgElement) {
-      overlays.isWeb(this.host) && svgElement.setAttribute('height', window.innerHeight.toString());
+      index$1.isWeb(this.host) && svgElement.setAttribute('height', window.innerHeight.toString());
       svgElement.style.width = 'auto';
       const mainSVGElement = svgElement.querySelector('#main-svg');
       if (mainSVGElement) {
@@ -214,7 +214,7 @@ const YooPodiumComponent = class {
             const userRank = this.getUserOnPosition(posObj.rank);
             const user = userRank === null || userRank === void 0 ? void 0 : userRank.user;
             const points = Math.round((userRank === null || userRank === void 0 ? void 0 : userRank.points) || 0);
-            const username = user ? overlays.getUserDisplayName(user) : null;
+            const username = user ? index$1.getUserDisplayName(user) : null;
             this.setUsername(prefixClass, svgElement, username);
             this.setAvatar(prefixClass, svgElement, userRank);
             this.setPoint(prefixClass, svgElement, points);
@@ -244,7 +244,7 @@ const YooPodiumComponent = class {
     return index.h(index.Host, null, index.h("div", { class: "podium-container" }, index.h("yoo-icon", { name: "badge-crown", color: "app-color", size: "medium" }), index.h("yoo-img", { ref: (el) => this.image = el, src: index.getAssetPath('./assets/podium/leaderboard.svg'), svgOptions: {
         makeIdsUnique: false, beforeInject: (_, svg) => this.onBeforeInjectSVG(svg),
         afterInject: (_, svg) => this.onAfterInjectSVG(svg),
-        afterLoad: (_, svgString) => overlays.updateSVGCustomColors(svgString)
+        afterLoad: (_, svgString) => index$1.updateSVGCustomColors(svgString)
       } }), index.h("slot", null)));
   }
   static get assetsDirs() { return ["assets/podium"]; }

package/dist/cjs/yoo-profile-list.cjs.entry.js

@@ -3,11 +3,11 @@
 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-7790c794.js');
+const commonHelpers = require('./common-helpers-0724ae60.js');
+const index$1 = require('./index-4cdf7949.js');
 require('./lodash-a9050d79.js');
-require('./index-a1bbe627.js');
+require('./index-cb8276bc.js');
 require('./_commonjsHelpers-94df2ea7.js');
 
 const profileListCss = "svg:not(:root){overflow:hidden}:host yoo-grid{background-color:var(--light, #ffffff)}:host yoo-grid div[slot=header]{display:-ms-flexbox;display:flex;padding-top:var(--spacing-08, 0.5rem);padding-left:var(--spacing-16, 1rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem)}:host yoo-grid div[slot=header] .title{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}:host yoo-grid div[slot=header] .action{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;margin-left:auto;padding-right:1rem;cursor:pointer}:host .links-heading{padding:var(--spacing-16, 1rem);color:var(--dark, #000000);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-14, 0.875rem);text-transform:uppercase}:host yoo-links-menu{width:inherit;background-color:var(--light, #ffffff)}:host .profile-logout{margin-top:2.5rem;padding:var(--spacing-16, 1rem);color:var(--app-color, #5a30f4);text-align:center;background-color:var(--light, #ffffff)}:host .terms{padding:var(--spacing-32, 2rem) 0;color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem);text-align:center}:host .terms .links{text-decoration:underline}:host .terms .icons{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:var(--spacing-32, 2rem) 0 var(--spacing-16, 1rem) 0}:host .terms .icons a:first-of-type{margin-right:var(--spacing-24, 1.5rem)}:host .user-list-container{padding:var(--spacing-16, 1rem);background-color:var(--light, #ffffff)}:host .user-list-container .user-info-list{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;min-height:var(--spacing-48, 3rem)}:host .user-list-container .user-info-list .start-container{display:-ms-flexbox;display:flex}:host .user-list-container .user-info-list .start-container yoo-icon{margin-right:var(--spacing-16, 1rem)}:host .user-list-container .user-info-list.location{-ms-flex-pack:unset;justify-content:unset}:host .user-list-container .user-info-list.location yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .user-list-container yoo-collapsible div[slot=title]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2.25rem}:host .user-list-container yoo-collapsible div[slot=title] yoo-avatar{margin-right:var(--spacing-08, 0.5rem)}:host .user-list-container yoo-collapsible yoo-tag:not(:last-of-type){margin-right:var(--spacing-08, 0.5rem)}:host .user-list-container yoo-collapsible div:not([slot=title]) yoo-tag{margin-bottom:var(--spacing-08, 0.5rem)}:host(.web) .user-list-container{margin:0 var(--spacing-16, 1rem);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1))}:host(.web.personal-view) yoo-links-menu{background-color:unset}:host(.rtl) .user-list-container .user-info-list .start-container yoo-icon{margin-right:0;margin-left:var(--spacing-16, 1rem)}";
@@ -52,9 +52,9 @@ const YooProfileListComponent = class {
     this.avatarClicked.emit(item.detail);
   }
   onCopyClicked(content) {
-    overlays.copyToClipboard(content);
-    overlays.showToast({
-      message: overlays.translate('COPIEDTOCLIPBOARD'),
+    index$1.copyToClipboard(content);
+    index$1.showToast({
+      message: index$1.translate('COPIEDTOCLIPBOARD'),
       duration: 2000,
       cssClass: 'success header',
       closable: true
@@ -62,14 +62,14 @@ const YooProfileListComponent = class {
   }
   renderList(item, icon, extraContent) {
     if (item) {
-      const content = extraContent ? overlays.dateFormat(item, 'DD/MM/YY') : item;
-      return (index.h("div", { class: "user-info-list" }, index.h("div", { class: "start-container" }, index.h("yoo-icon", { name: icon, color: "dark" }), icon === 'email' && index.h("a", { href: `mailto:${content}` }, [overlays.translate(extraContent.toLocaleUpperCase()), ' ', content]), icon === 'phone' && index.h("a", { href: `tel:${content}` }, [overlays.translate(extraContent.toLocaleUpperCase()), ' ', content]), icon !== 'email' && icon !== 'phone' && index.h("span", null, [overlays.translate(extraContent.toLocaleUpperCase()), ' ', content])), (icon === 'email' || icon === 'phone') && index.h("div", { class: "end-container" }, index.h("yoo-button", { fill: "transparent", shape: "circular", onClick: (() => this.onCopyClicked(content)) }, index.h("yoo-icon", { name: "duplicate", color: "stable-alt", size: "medium" })))));
+      const content = extraContent ? index$1.dateFormat(item, 'DD/MM/YY') : item;
+      return (index.h("div", { class: "user-info-list" }, index.h("div", { class: "start-container" }, index.h("yoo-icon", { name: icon, color: "dark" }), icon === 'email' && index.h("a", { href: `mailto:${content}` }, [index$1.translate(extraContent.toLocaleUpperCase()), ' ', content]), icon === 'phone' && index.h("a", { href: `tel:${content}` }, [index$1.translate(extraContent.toLocaleUpperCase()), ' ', content]), icon !== 'email' && icon !== 'phone' && index.h("span", null, [index$1.translate(extraContent.toLocaleUpperCase()), ' ', content])), (icon === 'email' || icon === 'phone') && index.h("div", { class: "end-container" }, index.h("yoo-button", { fill: "transparent", shape: "circular", onClick: (() => this.onCopyClicked(content)) }, index.h("yoo-icon", { name: "duplicate", color: "stable-alt", size: "medium" })))));
     }
   }
   renderFooter() {
     var _a, _b, _c, _d, _e;
     if ((_a = this.config) === null || _a === void 0 ? void 0 : _a.terms) {
-      return index.h("div", { class: "terms" }, index.h("div", null, index.h("span", { class: "links", onClick: () => this.config.terms.handler() }, this.config.terms.title)), index.h("div", null, "Yoobic Ltd \u00A9 ", new Date().getFullYear()), index.h("div", { class: "icons" }, index.h("a", { href: ((_c = (_b = overlays.getSession()) === null || _b === void 0 ? void 0 : _b.tenant) === null || _c === void 0 ? void 0 : _c.twitterUrl) || 'https://twitter.com/YOOBIC', target: "_blank" }, index.h("yoo-icon", { name: "twitter", color: "stable" })), index.h("a", { href: ((_e = (_d = overlays.getSession()) === null || _d === void 0 ? void 0 : _d.tenant) === null || _e === void 0 ? void 0 : _e.linkedinUrl) || 'https://www.linkedin.com/company/yoobic', target: "_blank" }, index.h("yoo-icon", { name: "linkedin", color: "stable" }))));
+      return index.h("div", { class: "terms" }, index.h("div", null, index.h("span", { class: "links", onClick: () => this.config.terms.handler() }, this.config.terms.title)), index.h("div", null, "Yoobic Ltd \u00A9 ", new Date().getFullYear()), index.h("div", { class: "icons" }, index.h("a", { href: ((_c = (_b = index$1.getSession()) === null || _b === void 0 ? void 0 : _b.tenant) === null || _c === void 0 ? void 0 : _c.twitterUrl) || 'https://twitter.com/YOOBIC', target: "_blank" }, index.h("yoo-icon", { name: "twitter", color: "stable" })), index.h("a", { href: ((_e = (_d = index$1.getSession()) === null || _d === void 0 ? void 0 : _d.tenant) === null || _e === void 0 ? void 0 : _e.linkedinUrl) || 'https://www.linkedin.com/company/yoobic', target: "_blank" }, index.h("yoo-icon", { name: "linkedin", color: "stable" }))));
     }
   }
   renderUserInformation() {
@@ -78,10 +78,10 @@ const YooProfileListComponent = class {
       const icons = ['email', 'phone', 'group', 'comment', 'info', 'luxury-stars'];
       const extraContent = ['', '', '', '', 'MEMBERSINCE', 'BIRTHDAY'];
       return [
-        overlays.isWeb(this.host) && index.h("div", { class: "links-heading" }, overlays.translate('ACCOUNT')),
+        index$1.isWeb(this.host) && index.h("div", { class: "links-heading" }, index$1.translate('ACCOUNT')),
         index.h("div", { class: "user-list-container" }, info.map((link, index) => {
           if (this.user[link]) {
-            const content = link === 'role' ? overlays.translate(this.user[link]) : this.user[link];
+            const content = link === 'role' ? index$1.translate(this.user[link]) : this.user[link];
             const isBio = link === 'description';
             const renderLink = link === 'email' ? !this.hideEmails : true;
             return isBio ? this.renderTruncate(content, icons[index])
@@ -105,7 +105,7 @@ const YooProfileListComponent = class {
       const tags = [];
       const headerTags = this.user.tags.filter((tag) => {
         charLength += tag.length;
-        const stopCondition = (!overlays.isWeb(this.host) && charLength > 35) || (overlays.isWeb(this.host) && charLength > 70);
+        const stopCondition = (!index$1.isWeb(this.host) && charLength > 35) || (index$1.isWeb(this.host) && charLength > 70);
         if (stopCondition) {
           tags.push(tag);
         }
@@ -115,7 +115,7 @@ const YooProfileListComponent = class {
     }
   }
   renderTruncate(content, icon) {
-    const charLength = overlays.isWeb(this.host) ? 83 : 38;
+    const charLength = index$1.isWeb(this.host) ? 83 : 38;
     return (index.h("div", { class: "user-info-list" }, index.h("div", { class: "start-container" }, index.h("yoo-icon", { name: icon, color: "dark" }), index.h("yoo-truncate", { content: content, maxLength: charLength, showEllipsisIcon: true, ellipsisIconSize: "medium" }))));
   }
   renderCollapsible(header, content) {
@@ -138,12 +138,12 @@ const YooProfileListComponent = class {
         hideHeader: true,
         onSelected: (item) => this.onAvatarClicked(item)
       };
-      return (index.h("yoo-grid", { ...attrs }, index.h("div", { slot: "header", class: "profile-summary" }, index.h("div", { class: "title" }, ((_b = this.recentItems) === null || _b === void 0 ? void 0 : _b.length) + ' ' + overlays.translate('LATESTTENANTS')), index.h("div", { class: "action", onClick: () => this.onSeeAllClicked() }, overlays.translate('YOOBICSEEALL')))));
+      return (index.h("yoo-grid", { ...attrs }, index.h("div", { slot: "header", class: "profile-summary" }, index.h("div", { class: "title" }, ((_b = this.recentItems) === null || _b === void 0 ? void 0 : _b.length) + ' ' + index$1.translate('LATESTTENANTS')), index.h("div", { class: "action", onClick: () => this.onSeeAllClicked() }, index$1.translate('YOOBICSEEALL')))));
     }
   }
   renderAdminLinks() {
     var _a;
-    const adminLink = (_a = this.localConfig) === null || _a === void 0 ? void 0 : _a.links.filter(link => link.title === overlays.translate('YOOBICADMIN'));
+    const adminLink = (_a = this.localConfig) === null || _a === void 0 ? void 0 : _a.links.filter(link => link.title === index$1.translate('YOOBICADMIN'));
     if (adminLink === null || adminLink === void 0 ? void 0 : adminLink.length) {
       return [
         index.h("div", { class: "links-heading" }, adminLink[0].title),
@@ -159,9 +159,9 @@ const YooProfileListComponent = class {
     var _a, _b;
     return [
       this.renderAdminLinks(),
-      this.heading && index.h("div", { class: "links-heading" }, overlays.translate(this.heading)),
+      this.heading && index.h("div", { class: "links-heading" }, index$1.translate(this.heading)),
       (_a = this.localConfig) === null || _a === void 0 ? void 0 : _a.links.map((link) => {
-        if (link.title !== overlays.translate('YOOBICADMIN')) {
+        if (link.title !== index$1.translate('YOOBICADMIN')) {
           return this.renderLinksMenu(link.items);
         }
       }),