@covet-pics/covet-pics-widget 0.134.3 → 0.134.5

package/dist/cjs/covet-pics-direct-buy_8.cjs.entry.js

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5415b8fd.js');
-const utils = require('./utils-07dcda6f.js');
+const utils = require('./utils-5dd2e2e5.js');
 const a11y = require('./a11y-c38c0cb2.js');
 const slider = require('./slider-c7104397.js');
 const popup = require('./popup-73ac7fd8.js');

package/dist/cjs/covet-pics-gallery-grid_3.cjs.entry.js

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5415b8fd.js');
-const utils$1 = require('./utils-07dcda6f.js');
+const utils$1 = require('./utils-5dd2e2e5.js');
 const _commonjsHelpers = require('./_commonjsHelpers-0cd0785e.js');
 const getters = require('./getters-c3c47af0.js');
 const popup = require('./popup-73ac7fd8.js');
@@ -3452,12 +3452,12 @@ const CovetPicsGalleryGrid = class {
     this.appStore.dispatch(popup.setPopupItems(newValue));
   }
   componentWillLoad() {
-    this.initFilters();
-    this.initPopup();
-    this.initUploadWidget();
     if (this.appStore !== undefined) {
       this.initStore();
     } // TODO temp check for pass spec.test, issue props function in stencil tests
+    this.initPopup();
+    this.initFilters();
+    this.initUploadWidget();
   }
   componentDidLoad() {
     if (this.layout === "collage")
@@ -3510,7 +3510,7 @@ const CovetPicsGalleryGrid = class {
     return (highlightOffset % every) === 0;
   }
   bindCustomUploadWidgetButtons() {
-    const selector = this.loader.data.settings.customer_photo_upload_button_selector;
+    const selector = this.appState.settings.customer_photo_upload_button_selector;
     if (selector !== "") {
       const nodes = document.querySelectorAll(selector);
       nodes.forEach(node => {
@@ -3519,7 +3519,7 @@ const CovetPicsGalleryGrid = class {
     }
   }
   initPopup() {
-    if (this.loader.previewMode) {
+    if (this.appState.preview.mode) {
       document.body.querySelectorAll("covet-pics-popup").forEach(node => node.remove());
     }
     this.appStore.dispatch(popup.setPopupItems(this.items)); // TODO move this to main component (double init in grid and slider)
@@ -3527,10 +3527,10 @@ const CovetPicsGalleryGrid = class {
     document.body.appendChild(this.popup);
   }
   initUploadWidget() {
-    if (this.loader.previewMode) {
+    if (this.appState.preview.mode) {
       document.querySelectorAll("covet-pics-upload").forEach(uploadWidget => uploadWidget.remove());
     }
-    if (this.loader.data.settings["customer_photo_item_position"] || this.loader.data.settings["customer_photo_upload_button_selector"] || this.showHeader) {
+    if (this.appState.settings.customer_photo_item_position !== null || this.appState.settings.customer_photo_upload_button_selector !== "" || this.showHeader) {
       this.upload = utils$1.createUploadPopup(this.loader, this.appStore);
       document.body.appendChild(this.upload);
     }
@@ -3564,7 +3564,7 @@ const CovetPicsGalleryGrid = class {
     }
   }
   emitGalleryReadyEvent() {
-    const galleryReadyEvent = utils$1.buildEvent("galleryReady:covetPics", { galleryId: this.loader.galleryId, itemsCount: this.items.length, el: this.el });
+    const galleryReadyEvent = utils$1.buildEvent("galleryReady:covetPics", { galleryId: this.appState.widgetId.galleryId, itemsCount: this.items.length, el: this.el });
     document.dispatchEvent(galleryReadyEvent);
   }
   setLoadMoreButtonVariables() {
@@ -3604,14 +3604,14 @@ const CovetPicsGalleryGrid = class {
     const previewFilters = this.loader.previewSettings["filters"];
     this.loader.data.filters.list.forEach(f => this.filters[f] = false);
     // restore selected filters between preview reloads
-    if (this.loader.previewMode && typeof previewFilters !== "undefined") {
+    if (this.appState.preview.mode && typeof previewFilters !== "undefined") {
       previewFilters.forEach(activeFilter => this.filters[activeFilter] = true);
     }
   }
   resetFilters() {
     Object.keys(this.filters).forEach(f => this.filters[f] = false);
     this.loader.setSelectedFilters([]);
-    if (this.loader.previewMode) {
+    if (this.appState.preview.mode) {
       delete this.loader.previewSettings["filters"];
     }
   }
@@ -3642,25 +3642,19 @@ const CovetPicsGalleryGrid = class {
     const itemWidth = this.isDesktopScreen
       ? (100 - (this.desktopItemPadding * (this.desktopPhotosPerRow - 1))) / this.desktopPhotosPerRow
       : (100 - (this.mobileItemPadding * (this.mobilePhotosPerRow - 1))) / this.mobilePhotosPerRow;
-    let caption = this.loader.data.settings.item_label_text;
-    if (item.links.length === 0) {
-      caption = this.loader.data.settings.item_without_product_label_text;
-    }
-    return (index.h("covet-pics-gallery-item", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, "animation-duration": this.loader.data.settings.item_animation_duration, highlighted: this.isHighlighted(idx), "hover-animation-style": this.loader.data.settings.item_animation_type, "hover-background-opacity": this.loader.data.settings.item_hover_background_opacity, "hover-border-color": this.loader.data.settings.item_hover_border_color, "hover-color-from": this.loader.data.settings.item_hover_color_from, "hover-color-to": this.loader.data.settings.item_hover_color_to, "hover-disabled": this.loader.data.settings.item_hover_disabled, "hover-preview": this.loader.previewHoverMode, "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow, this.isHighlighted(idx)), "item-id": item.id, "item-source": item.source, "item-index": idx, caption: item.caption, "item-type": item.data_type, "label-caption": caption, "label-caption-with-links": this.loader.data.settings.item_label_text, "label-color": this.loader.data.settings.item_label_color, "label-font-size": this.loader.data.settings.item_label_font_size, "label-font-style": this.loader.data.settings.item_label_font_style, links: item.links, layout: this.layout, "popup-disabled": this.loader.data.settings.popup_disable_modal, "popup-redirect-mode": this.loader.data.settings.item_open_link, "show-hover-icon": this.loader.data.settings.item_hover_icon, url: item.url, rating: item.rating !== null ? item.rating : 0, "user-name": item.username, "item-width": itemWidth, "created-time": item.created_time, role: "listitem", "aria-label": `${this.layout}-item ${idx + 1}/${itemsLength}, post created ${utils$1.getDateFromTimestamp(item.created_time)}`, "alt-tag": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time, this.layout), appStore: this.appStore }));
+    return (index.h("covet-pics-gallery-item", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, highlighted: this.isHighlighted(idx), "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow, this.isHighlighted(idx)), "item-id": item.id, "item-source": item.source, "item-index": idx, caption: item.caption, "item-type": item.data_type, links: item.links, layout: this.layout, url: item.url, rating: item.rating !== null ? item.rating : 0, "user-name": item.username, "item-width": itemWidth, "created-time": item.created_time, role: "listitem", "aria-label": `${this.layout}-item ${idx + 1}/${itemsLength}, post created ${utils$1.getDateFromTimestamp(item.created_time)}`, "alt-tag": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time, this.layout), appStore: this.appStore }));
   }
   renderStandardUploadItem(item, idx, itemsLength) {
-    return index.h("covet-pics-gallery-item", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, "animation-duration": item.animationDuration, "hover-background-opacity": item.hoverBackgroundOpacity, "hover-border-color": item.hoverBorderColor, "hover-color-from": item.hoverColorFrom, "hover-color-to": item.hoverColorTo, "image-url": item.imageUrl, "item-source": item.source, "item-index": idx, "label-caption": item.labelCaption, "label-color": item.labelColor, "label-font-size": item.labelFontSize, "label-font-style": item.labelFontStyle,
-      // TODO check do we use for upload widget END
-      appStore: this.appStore, "aria-label": `click on for upload image in gallery, ${this.layout}-item ${idx + 1}/${itemsLength},`, role: "listitem" });
+    return index.h("covet-pics-gallery-item", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, "image-url": item.imageUrl, "item-source": item.source, "item-index": idx, appStore: this.appStore, "aria-label": `click on for upload image in gallery, ${this.layout}-item ${idx + 1}/${itemsLength},`, role: "listitem" });
   }
   renderDetailUploadItem(item, idx, itemsLength) {
-    return index.h("covet-pics-gallery-item-detail", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, "image-url": item.imageUrl, "item-source": item.source, "item-index": idx, "label-caption": item.labelCaption, itemStyle: item.itemStyle, appStore: this.appStore, "aria-label": `click on for upload image in gallery, ${this.layout}-item ${idx + 1}/${itemsLength},`, role: "listitem" });
+    return index.h("covet-pics-gallery-item-detail", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage" }, "image-url": item.imageUrl, "item-source": item.source, "item-index": idx, appStore: this.appStore, "aria-label": `click on for upload image in gallery, ${this.layout}-item ${idx + 1}/${itemsLength},`, role: "listitem" });
   }
   renderDetailItem(item, idx, itemsLength) {
     const itemWidth = this.isDesktopScreen
       ? (100 - (this.desktopItemPadding * (this.desktopPhotosPerRow - 1))) / this.desktopPhotosPerRow
       : (100 - (this.mobileItemPadding * (this.mobilePhotosPerRow - 1))) / this.mobilePhotosPerRow;
-    return index.h("covet-pics-gallery-item-detail", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage", "highlighted": this.isHighlighted(idx) }, highlighted: this.isHighlighted(idx), "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-index": idx, "item-source": item.source, "item-style": this.itemStyle, "item-type": item.data_type, "item-width": itemWidth, links: item.links, "popup-disabled": this.loader.data.settings.popup_disable_modal, "popup-redirect-mode": this.loader.data.settings.item_open_link, url: item.url, "background-color": this.loader.data.settings.background_color, "primary-color": this.loader.data.settings.primary_color, "star-color": this.loader.data.settings.star_color, layout: this.layout, "user-name": item.username, caption: item.caption, "created-time": item.created_time, verified: item.verified, rating: item.rating !== null ? item.rating : 0, role: "listitem", "aria-label": `${this.layout}-item ${idx + 1}/${itemsLength}, post created ${utils$1.getDateFromTimestamp(item.created_time)}`, "alt-tag": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time, this.layout), appStore: this.appStore });
+    return index.h("covet-pics-gallery-item-detail", { class: { "grid-item": this.layout === "grid", "collage-item": this.layout === "collage", "highlighted": this.isHighlighted(idx) }, highlighted: this.isHighlighted(idx), "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-index": idx, "item-source": item.source, "item-type": item.data_type, "item-width": itemWidth, links: item.links, url: item.url, layout: this.layout, "user-name": item.username, caption: item.caption, "created-time": item.created_time, verified: item.verified, rating: item.rating !== null ? item.rating : 0, role: "listitem", "aria-label": `${this.layout}-item ${idx + 1}/${itemsLength}, post created ${utils$1.getDateFromTimestamp(item.created_time)}`, "alt-tag": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time, this.layout), appStore: this.appStore });
   }
   renderHeader() {
     return (index.h("covet-pics-gallery-header", { "product-title": this.productTitle, rating: this.rating, "rating-count": this.ratingCount, breakdown: this.breakdown, "header-type": this.headerType, "show-sort": this.headerShowSort.toString(), "show-average-star-rating": this.headerShowAverageRating.toString(), "show-breakdown": this.showBreakdown.toString(), appStore: this.appStore, "aria-hidden": `${this.isGridDisabled}` }));
@@ -4027,9 +4021,9 @@ const CovetPicsGallerySlider = class {
     }
   }
   componentWillLoad() {
+    this.initStore();
     this.initPopup();
     this.initUploadWidget();
-    this.initStore();
   }
   componentDidLoad() {
     this.initSwiper();
@@ -4056,7 +4050,7 @@ const CovetPicsGallerySlider = class {
     });
   }
   bindCustomUploadWidgetButtons() {
-    const selector = this.loader.data.settings.customer_photo_upload_button_selector;
+    const selector = this.appState.settings.customer_photo_upload_button_selector;
     if (selector !== "") {
       const nodes = document.querySelectorAll(selector);
       nodes.forEach(node => {
@@ -4065,7 +4059,7 @@ const CovetPicsGallerySlider = class {
     }
   }
   initPopup() {
-    if (this.loader.previewMode) {
+    if (this.appState.preview.mode) {
       document.body.querySelectorAll("covet-pics-popup").forEach(node => node.remove());
     }
     this.appStore.dispatch(popup.setPopupItems(this.items));
@@ -4073,10 +4067,10 @@ const CovetPicsGallerySlider = class {
     document.body.appendChild(this.popup);
   }
   initUploadWidget() {
-    if (this.loader.previewMode) {
+    if (this.appState.preview.mode) {
       document.querySelectorAll("covet-pics-upload").forEach(uploadWidget => uploadWidget.remove());
     }
-    if (this.loader.data.settings["customer_photo_item_position"] || this.loader.data.settings["customer_photo_upload_button_selector"]) {
+    if (this.appState.settings.customer_photo_item_position !== null || this.appState.settings.customer_photo_upload_button_selector !== "") {
       this.upload = utils$1.createUploadPopup(this.loader, this.appStore);
       document.body.appendChild(this.upload);
     }
@@ -4163,7 +4157,7 @@ const CovetPicsGallerySlider = class {
     swiperWrapper.style.removeProperty("height");
   }
   emitGalleryReadyEvent() {
-    const galleryReadyEvent = utils$1.buildEvent("galleryReady:covetPics", { galleryId: this.loader.galleryId, itemsCount: this.items.length, el: this.el });
+    const galleryReadyEvent = utils$1.buildEvent("galleryReady:covetPics", { galleryId: this.appState.widgetId.galleryId, itemsCount: this.items.length, el: this.el });
     document.dispatchEvent(galleryReadyEvent);
   }
   openPopup(itemId) {
@@ -4176,6 +4170,8 @@ const CovetPicsGallerySlider = class {
   setEnableControls(disabled) {
     const nextEl = this.el.querySelector(".gallery .swiper-button-next");
     const prevEl = this.el.querySelector(".gallery .swiper-button-prev");
+    if (nextEl === null || prevEl === null)
+      return false;
     prevEl.tabIndex = disabled ? -1 : 0;
     nextEl.tabIndex = disabled ? -1 : 0;
     return true;
@@ -4193,22 +4189,22 @@ const CovetPicsGallerySlider = class {
       : `slide ${idx + 1}/${itemsLength}, post created ${utils$1.getDateFromTimestamp(createdTime)}`;
   }
   renderStandardUploadItem(item, idx, itemsLength) {
-    return (index.h("covet-pics-gallery-item", { class: "swiper-slide slide", layout: "slider", "item-source": item.source, "animation-duration": item.animationDuration, "hover-background-opacity": item.hoverBackgroundOpacity, "hover-border-color": item.hoverBorderColor, "hover-color-from": item.hoverColorFrom, "hover-color-to": item.hoverColorTo, "image-url": item.imageUrl, "label-caption": item.labelCaption, "item-index": idx, "aria-label": `click on for upload image in slider, slide ${idx + 1}/${itemsLength},`, appStore: this.appStore }));
+    return (index.h("covet-pics-gallery-item", { class: "swiper-slide slide", layout: "slider", "item-source": item.source, "image-url": item.imageUrl, "item-index": idx, "aria-label": `click on for upload image in slider, slide ${idx + 1}/${itemsLength},`, appStore: this.appStore }));
   }
   renderDetailUploadItem(item, idx, itemsLength) {
-    return (index.h("covet-pics-gallery-item", { class: "swiper-slide slide", layout: "slider", "item-source": item.source, "image-url": item.imageUrl, "item-style": item.itemStyle, "label-caption": item.labelCaption, "item-index": idx, "aria-label": `click on for upload image in slider, slide ${idx + 1}/${itemsLength},`, appStore: this.appStore }));
+    return (index.h("covet-pics-gallery-item", { class: "swiper-slide slide", layout: "slider", "item-source": item.source, "image-url": item.imageUrl, "item-index": idx, "aria-label": `click on for upload image in slider, slide ${idx + 1}/${itemsLength},`, appStore: this.appStore }));
   }
   renderStandardItem(item, idx, itemsLength) {
     const itemWidth = this.isDesktopScreen
       ? (100 - (this.desktopItemPadding * (this.desktopPhotosPerRow - 1))) / this.desktopPhotosPerRow
       : (100 - (this.mobileItemPadding * (this.mobilePhotosPerRow - 1))) / this.mobilePhotosPerRow;
-    return (index.h("covet-pics-gallery-item", { class: "swiper-slide", layout: "slider", "animation-duration": this.loader.data.settings.item_animation_duration, "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-source": item.source, "hover-animation-style": this.loader.data.settings.item_animation_type, "hover-background-opacity": this.loader.data.settings.item_hover_background_opacity, "hover-border-color": this.loader.data.settings.item_hover_border_color, "hover-color-from": this.loader.data.settings.item_hover_color_from, "hover-color-to": this.loader.data.settings.item_hover_color_to, "hover-disabled": this.loader.data.settings.item_hover_disabled, "hover-preview": this.loader.previewHoverMode, "label-caption": this.loader.data.settings.item_without_product_label_text, "label-caption-with-links": this.loader.data.settings.item_label_text, "label-color": this.loader.data.settings.item_label_color, "label-font-size": this.loader.data.settings.item_label_font_size, "label-font-style": this.loader.data.settings.item_label_font_style, links: item.links, "popup-disabled": this.loader.data.settings.popup_disable_modal, "popup-redirect-mode": this.loader.data.settings.item_open_link, "show-hover-icon": this.loader.data.settings.item_hover_icon, url: item.url, "aria-label": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time), rating: item.rating !== null ? item.rating : 0, "user-name": item.username, "created-time": item.created_time, "item-type": item.data_type, caption: item.caption, "item-width": itemWidth, "item-index": idx, appStore: this.appStore }));
+    return (index.h("covet-pics-gallery-item", { class: "swiper-slide", layout: "slider", "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-source": item.source, links: item.links, url: item.url, "aria-label": this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time), rating: item.rating !== null ? item.rating : 0, "user-name": item.username, "created-time": item.created_time, "item-type": item.data_type, caption: item.caption, "item-width": itemWidth, "item-index": idx, appStore: this.appStore }));
   }
   renderDetailItem(item, idx, itemsLength) {
     const itemWidth = this.isDesktopScreen
       ? (100 - (this.desktopItemPadding * (this.desktopPhotosPerRow - 1))) / this.desktopPhotosPerRow
       : (100 - (this.mobileItemPadding * (this.mobilePhotosPerRow - 1))) / this.mobilePhotosPerRow;
-    return (index.h("covet-pics-gallery-item-detail", { class: "swiper-slide", layout: "slider", "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-source": item.source, "item-style": this.itemStyle, "item-type": item.data_type, "item-width": itemWidth, "lazy-load": true, links: item.links, "popup-disabled": this.loader.data.settings.popup_disable_modal, "popup-redirect-mode": this.loader.data.settings.item_open_link, url: item.url, "background-color": this.loader.data.settings.background_color, "primary-color": this.loader.data.settings.primary_color, "star-color": this.loader.data.settings.star_color, "user-name": item.username, caption: item.caption, "created-time": item.created_time, rating: item.rating !== null ? item.rating : 0, verified: item.verified, altTag: this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time), "aria-label": `slide ${idx + 1} of ${itemsLength} in main slider`, appStore: this.appStore, "item-index": idx }));
+    return (index.h("covet-pics-gallery-item-detail", { class: "swiper-slide", layout: "slider", "image-url": utils$1.getCoverImage(item.cover_images.medium_resolution, item.images.medium_resolution), "image-high-resolution-url": utils$1.getCoverImage(item.cover_images.high_resolution, item.images.high_resolution), "image-responsive-sizes": utils$1.getSizesForResponsiveImage(this.desktopPhotosPerRow, this.mobilePhotosPerRow), "item-id": item.id, "item-source": item.source, "item-style": this.itemStyle, "item-type": item.data_type, "item-width": itemWidth, "lazy-load": true, links: item.links, url: item.url, "user-name": item.username, caption: item.caption, "created-time": item.created_time, rating: item.rating !== null ? item.rating : 0, verified: item.verified, altTag: this.itemImgAltTag(item.caption, idx, itemsLength, item.created_time), "aria-label": `slide ${idx + 1} of ${itemsLength} in main slider`, appStore: this.appStore, "item-index": idx }));
   }
   render() {
     if (this.items !== undefined) {