vviinn-widgets 2.49.2 → 2.50.0

package/dist/cjs/{customized-slots-67b24737.js → customized-slots-71029d3f.js}

@@ -16,6 +16,8 @@ function fromString(s) {
 }
 
 const defaultSlotsNames = [
+  "vviinn-recommendations-title",
+  "vviinn-recommendations-subtitle",
   "vviinn-teaser-text",
   "vviinn-image-upload-button-text",
   "vviinn-image-upload-icon",
@@ -23,10 +25,13 @@ const defaultSlotsNames = [
   "vviinn-camera-button-text-start",
   "vviinn-camera-button-text-stop",
   "vviinn-camera-icon",
+  "vviinn-text-search-icon",
   "vviinn-privacy-badge-text",
   "vviinn-image-search-modal-title",
   "vviinn-basket-button-text",
-  "vviinn-text-search-icon",
+  "vviinn-basket-button-icon",
+  "vviinn-update-button-icon",
+  "vviinn-update-button-text",
 ];
 const renderNamedSlot = (name) => index.h("slot", { name: name });
 const SlotSkeleton = () => defaultSlotsNames.map(renderNamedSlot);

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-carousel_4.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[1040],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32],"setModeDiscount":[32],"setModeAppliedDiscounts":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"],[0,"vviinnAddToBasket","trackAddToBasket"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"appliedDiscountPercentage":[2,"applied-discount-percentage"],"currentDiscountPercentage":[2,"current-discount-percentage"],"isSourceProduct":[4,"is-source-product"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_17.cjs",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-text-search",{"clearSearchQuery":[4,"clear-search-query"],"initialSearchQuery":[1,"initial-search-query"],"searchQuery":[32]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraInitializing":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32],"products":[32],"initialSearchQuery":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"vviinnTextSearchFinished","trackTextSearchFinished"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
+  return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-carousel_4.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32],"updatedCardsAmount":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[1040],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32],"setModeDiscount":[32],"setModeAppliedDiscounts":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"],[0,"vviinnAddToBasket","trackAddToBasket"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"appliedDiscountPercentage":[2,"applied-discount-percentage"],"currentDiscountPercentage":[2,"current-discount-percentage"],"isSourceProduct":[4,"is-source-product"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_17.cjs",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-text-search",{"clearSearchQuery":[4,"clear-search-query"],"initialSearchQuery":[1,"initial-search-query"],"searchQuery":[32]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraInitializing":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32],"products":[32],"initialSearchQuery":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"vviinnTextSearchFinished","trackTextSearchFinished"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
   });
 };
 

package/dist/cjs/{package-cc6cc310.js → package-ada5261a.js}

@@ -1,5 +1,5 @@
 'use strict';
 
-const version = "2.49.2";
+const version = "2.50.0";
 
 exports.version = version;

package/dist/cjs/search-filters_17.cjs.entry.js

@@ -6,7 +6,7 @@ const index = require('./index-5619b5ec.js');
 const search_store = require('./search.store-7605f369.js');
 const i18next = require('./i18next-74ff3413.js');
 const PlusIcon = require('./PlusIcon-5e585127.js');
-const customizedSlots = require('./customized-slots-67b24737.js');
+const customizedSlots = require('./customized-slots-71029d3f.js');
 
 const ArrowIcon = () => (index.h("svg", { width: "12", height: "20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
   index.h("path", { d: "M0 10 10 0l1.4 1.4L2.8 10l8.6 8.6L10 20 0 10Z" })));

package/dist/cjs/vviinn-carousel_4.cjs.entry.js

@@ -6,8 +6,8 @@ const index = require('./index-5619b5ec.js');
 const search_store = require('./search.store-7605f369.js');
 const i18next = require('./i18next-74ff3413.js');
 const PlusIcon = require('./PlusIcon-5e585127.js');
-const customizedSlots = require('./customized-slots-67b24737.js');
-const _package = require('./package-cc6cc310.js');
+const customizedSlots = require('./customized-slots-71029d3f.js');
+const _package = require('./package-ada5261a.js');
 const index$1 = require('./index-4445cb70.js');
 
 const BasketIcon = () => (index.h("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
@@ -43,7 +43,7 @@ const generateRandomNumber = (min, max) => {
   return Math.floor(Math.random() * (max - min + 1)) + min;
 };
 
-const vviinnCarouselCss = ":host{--vviinn-progressbar-width:0;--vviinn-carousel-columns-internal:var(--vviinn-carousel-columns, 4)}.body{display:flex;position:relative;width:var(--vviinn-carousel-content-width);flex-direction:column}.bullets{display:flex;flex-direction:row;grid-gap:24px;justify-content:center}.bullet{width:10px;height:10px;background:#e0e0e0;border-radius:50%;cursor:pointer}.bullet.active{background:#161616}.content:not(.show-scrollbar),.content.grid{scrollbar-color:#fff0 #fff0}.content:not(.show-scrollbar)::-webkit-scrollbar,.content.grid::-webkit-scrollbar{opacity:0}.content{display:flex;flex-direction:row;gap:8px;overflow-y:hidden;overflow-x:auto;flex-grow:1;padding-bottom:16px}.content.left>*{scroll-snap-align:start}.content.right>*{scroll-snap-align:end}:host(.continuity) .prev,:host(.continuity) .next{border-radius:2px}:host(.grid) .prev,:host(.grid) .next{border-radius:50%}.prev,.next{align-items:center;background-color:white;border:none;box-shadow:0px 2px 6px rgba(0, 0, 0, 0.15);fill:#525252;cursor:pointer;display:grid;height:40px;justify-items:center;position:absolute;top:calc(50% - 20px);width:40px;z-index:1;padding:0;margin:0}.next:disabled,.prev:disabled{display:none}.prev svg{transform:rotate(180deg);margin-left:-5px}.prev{left:0}.next{right:0}.items-group{display:grid;grid-gap:16px;grid-template-columns:repeat(var(--vviinn-carousel-columns-internal), 1fr);min-width:100%}vviinn-product-card::part(price-container){text-align:center}@media (max-width: 480px){.items-group{grid-template-columns:repeat(2, 1fr)}}.body.set{max-width:100%;justify-content:space-between;margin-left:auto;display:flex;flex-direction:row;gap:112px}.body.set::-webkit-scrollbar{display:none}@media (max-width: 768px){.body.set{gap:40px}}.content.set{grid-gap:20px;height:-moz-fit-content;height:fit-content;max-width:-moz-fit-content;max-width:fit-content;overflow:unset}";
+const vviinnCarouselCss = ":host{--vviinn-carousel-columns-internal:var(--vviinn-carousel-columns, 4)}.body{display:flex;position:relative;width:var(--vviinn-carousel-content-width);flex-direction:column}.bullets{display:flex;flex-direction:row;grid-gap:24px;justify-content:center}.bullet{width:10px;height:10px;background:#e0e0e0;border-radius:50%;cursor:pointer}.bullet.active{background:#161616}.content:not(.show-scrollbar),.content.grid{scrollbar-color:#fff0 #fff0}.content:not(.show-scrollbar)::-webkit-scrollbar,.content.grid::-webkit-scrollbar{opacity:0}.content{display:flex;flex-direction:row;gap:8px;overflow-y:hidden;overflow-x:auto;flex-grow:1;padding-bottom:16px}.content.left>*{scroll-snap-align:start}.content.right>*{scroll-snap-align:end}:host(.continuity) .prev,:host(.continuity) .next{border-radius:2px}:host(.grid) .prev,:host(.grid) .next{border-radius:50%}.prev,.next{align-items:center;background-color:white;border:none;box-shadow:0px 2px 6px rgba(0, 0, 0, 0.15);fill:#525252;cursor:pointer;display:grid;height:40px;justify-items:center;position:absolute;top:calc(50% - 20px);width:40px;z-index:1;padding:0;margin:0}.next:disabled,.prev:disabled{display:none}.prev svg{transform:rotate(180deg);margin-left:-5px}.prev{left:0}.next{right:0}.items-group{display:grid;grid-gap:16px;grid-template-columns:repeat(var(--vviinn-carousel-columns-internal), 1fr);min-width:100%}vviinn-product-card::part(price-container){text-align:center}@media (max-width: 480px){.items-group{grid-template-columns:repeat(2, 1fr)}}.body.set{max-width:100%;justify-content:space-between;margin-left:auto;display:flex;flex-direction:row;gap:112px}.body.set::-webkit-scrollbar{display:none}@media (max-width: 768px){.body.set{gap:40px}}.content.set{grid-gap:20px;height:-moz-fit-content;height:fit-content;max-width:-moz-fit-content;max-width:fit-content;overflow:unset}";
 
 const VviinnCarousel = class {
   constructor(hostRef) {
@@ -53,9 +53,9 @@ const VviinnCarousel = class {
     this.defaultAnimationInterval = 2000;
     this.mutationObserver = new MutationObserver(() => this.cloneSlottedContent());
     this.handleWindowResize = () => this.setImageWidthSetMode("100%");
-    this.isLastGroup = () => this.activeContentGroup === this.getContentGroups().length - 1 &&
-      this.isGridMode;
-    this.isFirstGroup = () => this.activeContentGroup === 0 && this.isGridMode;
+    this.isLastGroup = () => this.isGridMode &&
+      this.activeContentGroup === this.getContentGroups().length - 1;
+    this.isFirstGroup = () => this.isGridMode && this.activeContentGroup === 0;
     this.updateCard = (productId, step, animationInterval) => {
       let clickedProduct = this.crossSellingRecommendations.find((item) => item.productId === productId);
       const crossSellingIndex = this.crossSellingRecommendations.indexOf(clickedProduct);
@@ -121,11 +121,16 @@ const VviinnCarousel = class {
   }
   componentDidLoad() {
     this.setWidth();
-    this.processScrollbarWidth();
     this.columns = this.getColumnsNumber();
     const slot = this.el.querySelector(".content");
     this.mutationObserver.observe(slot, { subtree: true, childList: true });
     this.resizeObserver.observe(this.getHostParent());
+    if (this.isGridMode) {
+      const contentNode = this.getContentNode();
+      contentNode.addEventListener("scrollend", () => {
+        this.activeContentGroup = this.getActiveGroupIndex();
+      });
+    }
   }
   updatingAllCardsWatcher() {
     if (!this.updatingAllCards)
@@ -175,7 +180,6 @@ const VviinnCarousel = class {
   }
   handleResize() {
     this.setWidth();
-    this.processScrollbarWidth();
     this.setItemWidth();
     const newColumns = this.getColumnsNumber();
     if (newColumns !== this.columns) {
@@ -212,10 +216,6 @@ const VviinnCarousel = class {
     this.setWidth();
   }
   getActiveGroupIndex() {
-    var _a, _b;
-    const contentNodeLeft = (_b = (_a = this.getContentNode()) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
-    if (!contentNodeLeft)
-      return 0;
     const groups = this.getContentGroups();
     const groupsPositions = groups.map((g) => g.getBoundingClientRect().left);
     const indexedPositions = groupsPositions
@@ -243,24 +243,15 @@ const VviinnCarousel = class {
   getContentGroups() {
     return Array.from(this.el.querySelectorAll(`.${CONTENT_GROUP_CSS_CLASS}`));
   }
-  showNext() {
-    this.moveDirection = "right";
-    const contentContainer = this.getContentNode();
-    requestAnimationFrame(() => {
-      contentContainer.scrollTo({
-        top: 0,
-        left: contentContainer.scrollLeft + this.calculateMoveStep(),
-        behavior: "smooth",
-      });
-    });
-  }
-  showPrev() {
-    this.moveDirection = "left";
+  handleCarouselButtonClick(action) {
+    this.moveDirection = action;
     const contentContainer = this.getContentNode();
+    const { scrollLeft } = contentContainer;
+    const step = this.calculateMoveStep();
     requestAnimationFrame(() => {
       contentContainer.scrollTo({
         top: 0,
-        left: contentContainer.scrollLeft - this.calculateMoveStep(),
+        left: action === "right" ? scrollLeft + step : scrollLeft - step,
         behavior: "smooth",
       });
     });
@@ -275,15 +266,6 @@ const VviinnCarousel = class {
       });
     });
   }
-  processScrollbarWidth() {
-    const target = this.getContentNode();
-    if (!target)
-      return;
-    const scrollRatio = (target.scrollLeft + target.clientWidth) / target.scrollWidth;
-    const scrolledWidth = target.clientWidth * scrollRatio;
-    this.el.style.setProperty("--vviinn-progressbar-width", `${scrolledWidth}px`);
-    this.activeContentGroup = this.getActiveGroupIndex();
-  }
   showBullets() {
     return this.isGridMode && this.showScroll;
   }
@@ -336,7 +318,7 @@ const VviinnCarousel = class {
       }, onClick: () => this.scroll(index$1) })));
   }
   render() {
-    return (index.h(index.Host, { class: this.getClassMap() }, index.h("div", { class: Object.assign({ body: true }, this.getClassMap()) }, !this.isSetMode && (index.h("button", { class: "prev", onClick: () => this.showPrev(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isFirstGroup() }, index.h(ChevronIcon, null))), this.isSetMode && (index.h("vviinn-product-card", { part: "product-part", class: "set-mode product-card--source", productTitle: this.sourceProduct.title, image: this.sourceProduct.image.thumbnail, price: this.sourceProduct.price.actual, imageRatio: 1, imageWidth: 300, dimmedBackground: true, isSourceProduct: true })), index.h("div", { class: this.getContentClassMap(), onScroll: () => this.processScrollbarWidth() }, this.renderRecommendations()), !this.isSetMode && (index.h("button", { class: "next", onClick: () => this.showNext(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isLastGroup() }, index.h(ChevronIcon, null)))), this.showBullets() && (index.h("div", { class: "bullets" }, this.renderBullets()))));
+    return (index.h(index.Host, { class: this.getClassMap() }, index.h("div", { class: Object.assign({ body: true }, this.getClassMap()) }, !this.isSetMode && (index.h("button", { class: "prev", onClick: () => this.handleCarouselButtonClick("left"), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isFirstGroup() }, index.h(ChevronIcon, null))), this.isSetMode && (index.h("vviinn-product-card", { part: "product-part", class: "set-mode product-card--source", productTitle: this.sourceProduct.title, image: this.sourceProduct.image.thumbnail, price: this.sourceProduct.price.actual, imageRatio: 1, imageWidth: 300, dimmedBackground: true, isSourceProduct: true })), index.h("div", { class: this.getContentClassMap() }, this.renderRecommendations()), !this.isSetMode && (index.h("button", { class: "next", onClick: () => this.handleCarouselButtonClick("right"), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isLastGroup() }, index.h(ChevronIcon, null)))), this.showBullets() && (index.h("div", { class: "bullets" }, this.renderBullets()))));
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {
@@ -682,9 +664,7 @@ const VviinnProductCard = class {
         "applied-discount": !!this.appliedDiscountPercentage,
       }, part: "basket-button", onClick: () => {
         this.vviinnAddToBasket.emit(Object.assign(Object.assign({}, this.productData), { discount: this.currentDiscountPercentage }));
-      } }, this.isSetMode ? (index.h(index.Fragment, null, this.appliedDiscountPercentage ? (index.h(CheckCircleIcon, null)) : (index.h(BasketIcon, null)), index.h("slot", { name: "vviinn-basket-button-text" }, index.h("span", null, this.appliedDiscountPercentage
-      ? `${this.appliedDiscountPercentage}% ${i18next.instance.t("setMode.appliedDiscountText")}`
-      : i18next.instance.t("setMode.basketButtonText"))))) : (index.h("slot", { name: "vviinn-basket-button-text" }, index.h("span", null, i18next.instance.t("basketButtonText")))))))), this.isSetMode && !this.appliedDiscountPercentage && (index.h("button", { class: {
+      } }, this.isSetMode ? (index.h(index.Fragment, null, this.appliedDiscountPercentage ? (index.h(CheckCircleIcon, null)) : (index.h("slot", { name: "vviinn-basket-button-icon" }, index.h(BasketIcon, null))), index.h("span", null, this.appliedDiscountPercentage ? (`${this.appliedDiscountPercentage}% ${i18next.instance.t("setMode.appliedDiscountText")}`) : (index.h("slot", { name: "vviinn-basket-button-text" }, i18next.instance.t("setMode.basketButtonText")))))) : (index.h("slot", { name: "vviinn-basket-button-text" }, index.h("span", null, i18next.instance.t("basketButtonText")))))))), this.isSetMode && !this.appliedDiscountPercentage && (index.h("button", { class: {
         "update-button": true,
         hidden: this.updateButtonLocation === "onTop",
       }, part: "update-button-item", onClick: () => {
@@ -692,7 +672,7 @@ const VviinnProductCard = class {
           animationInterval: generateRandomNumber(800, 1400),
           productData: this.productData,
         });
-      } }, index.h("slot", { name: "vviinn-update-icon-item" }, index.h(UpdateIcon, null))))));
+      } }, index.h("slot", { name: "vviinn-update-button-icon" }, index.h(UpdateIcon, null))))));
   }
   get el() { return index.getElement(this); }
   static get watchers() { return {
@@ -1421,7 +1401,7 @@ const resources = {
   },
 };
 
-const vviinnVprWidgetCss = ":host{display:grid;grid-gap:1rem;width:100%}:host(:not(.loaded)){position:absolute;visibility:hidden}:host(.grid) vviinn-product-card::part(image){border:1px solid #dddddd;width:100%}:host(.set) vviinn-carousel{overflow-x:auto}:host(.set) vviinn-carousel{scrollbar-width:thin}.widget-header{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}.widget-header h3{margin-top:8px;margin-bottom:0;font-size:14px;font-weight:400;line-height:20px}.update-button{display:flex;align-items:center;justify-content:center;color:#525252;gap:8px;padding:8px 10px;background:rgb(244, 244, 244);border:none;cursor:pointer}.update-button:hover{background:rgb(234, 234, 234)}.update-button svg{color:#6f6f6f}h2{margin:0}vviinn-product-card::part(price-container){align-self:flex-start;text-align:left;display:flex}.results{display:grid;grid-gap:1rem}.no-result-text{font-size:20px}.visually-hidden{position:absolute;top:0;left:0;z-index:-1;height:0;width:0}h2{margin:0}:host(.grid) h2{justify-content:center}:host(.grid) vviinn-product-card::part(image){min-width:100%}:host(.grid) vviinn-product-card::part(image-link){width:100%}:host(.grid) vviinn-product-card::part(title),:host(.grid) vviinn-product-card::part(brand),:host(.grid) vviinn-product-card::part(type){text-align:center}:host(.grid) vviinn-product-card::part(price-container){align-self:center}:host(.continuity) vviinn-product-card::part(title),:host(.continuity) vviinn-product-card::part(brand),:host(.continuity) vviinn-product-card::part(type),:host(.continuity) vviinn-product-card::part(deeplink){text-align:left;max-width:unset;align-self:start}";
+const vviinnVprWidgetCss = ":host{display:grid;grid-gap:1rem;width:100%}:host(:not(.loaded)){position:absolute;visibility:hidden}:host(.grid) vviinn-product-card::part(image){border:1px solid #dddddd;width:100%}:host(.set) vviinn-carousel{overflow-x:auto}:host(.set) vviinn-carousel{scrollbar-width:thin}.widget-header{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}.widget-header h3{margin-top:8px;margin-bottom:0;font-size:14px;font-weight:400;line-height:20px}.update-button{display:flex;align-items:center;justify-content:center;color:#525252;gap:8px;padding:8px 10px;background:rgb(244, 244, 244);border:none;cursor:pointer}.update-button:hover{background:rgb(234, 234, 234)}.update-button svg{color:#6f6f6f;width:24px;height:24px}h2{margin:0}vviinn-product-card::part(price-container){align-self:flex-start;text-align:left;display:flex}.results{display:grid;grid-gap:1rem}.no-result-text{font-size:20px}.visually-hidden{position:absolute;top:0;left:0;z-index:-1;height:0;width:0}h2{margin:0}:host(.grid) h2{justify-content:center}:host(.grid) vviinn-product-card::part(image){min-width:100%}:host(.grid) vviinn-product-card::part(image-link){width:100%}:host(.grid) vviinn-product-card::part(title),:host(.grid) vviinn-product-card::part(brand),:host(.grid) vviinn-product-card::part(type){text-align:center}:host(.grid) vviinn-product-card::part(price-container){align-self:center}:host(.continuity) vviinn-product-card::part(title),:host(.continuity) vviinn-product-card::part(brand),:host(.continuity) vviinn-product-card::part(type),:host(.continuity) vviinn-product-card::part(deeplink){text-align:left;max-width:unset;align-self:start}";
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
   var t = {};
@@ -1488,6 +1468,7 @@ const VviinnVprWidget = class {
     this.trackingDeactivated = false;
     this.hasErrorOnLoad = false;
     this.updatingAllCards = false;
+    this.updatedCardsAmount = 0;
   }
   getBasicEventData() {
     return {
@@ -1571,6 +1552,7 @@ const VviinnVprWidget = class {
     if (this.excluded) {
       this.excluded = search_store.parseExcluded(this.excluded);
     }
+    customizedSlots.slotChangeListener(this, this.el);
   }
   trackProductLoad({ detail }) {
     this.productImageLoadedSubject.next(detail.productId);
@@ -1728,9 +1710,9 @@ const VviinnVprWidget = class {
         loaded: true,
         empty: this.recommendations.length == 0,
         [this.mode]: true,
-      }, "aria-hidden": "false" }, this.addToBasketShow && index.h(customizedSlots.SlotSkeleton, null), index.h(index.Fragment, null, this.renderExternalCSS(), index.h("style", null, search_store.state.fallbackStyles), index.h("div", { class: "widget-header" }, index.h("div", null, index.h("h2", { part: "recommendations-title" }, this.isSetMode
+      }, "aria-hidden": "false" }, index.h(index.Fragment, null, this.renderExternalCSS(), index.h(customizedSlots.SlotSkeleton, null), index.h("style", null, search_store.state.fallbackStyles), index.h("div", { class: "widget-header" }, index.h("div", null, index.h("h2", { part: "recommendations-title" }, index.h("slot", { name: "vviinn-recommendations-title" }, this.isSetMode
       ? i18next.instance.t("setMode.widgetTitle")
-      : this.blockTitle), this.isSetMode && index.h("h3", null, i18next.instance.t("setMode.widgetSubtitle"))), this.isSetMode && this.updateButtonLocation !== "onItem" ? (index.h("button", { class: "update-button", part: "update-button-top", onClick: () => (this.updatingAllCards = true) }, index.h("slot", { name: "vviinn-update-icon-top" }, index.h(UpdateIcon, null)), index.h("span", null, i18next.instance.t("setMode.updateButtonText")))) : null), this.recommendations.length > 0 &&
+      : this.blockTitle)), this.isSetMode && (index.h("h3", { part: "recommendations-subtitle" }, index.h("slot", { name: "vviinn-recommendations-subtitle" }, i18next.instance.t("setMode.widgetSubtitle"))))), this.isSetMode && this.updateButtonLocation !== "onItem" ? (index.h("button", { class: "update-button", part: "update-button-top", onClick: () => (this.updatingAllCards = true) }, index.h("slot", { name: "vviinn-update-button-icon" }, index.h(UpdateIcon, null)), index.h("slot", { name: "vviinn-update-button-text" }, index.h("span", null, i18next.instance.t("setMode.updateButtonText"))))) : null), this.recommendations.length > 0 &&
       (this.useCarousel ? this.renderCarousel() : this.renderResults()), this.recommendations.length === 0 && this.hasErrorOnLoad && (index.h("p", { class: "no-result-text" }, this.noResultText.length
       ? this.noResultText
       : i18next.instance.t("noResultText"))))));

package/dist/cjs/vviinn-vpr-button.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5619b5ec.js');
-const _package = require('./package-cc6cc310.js');
+const _package = require('./package-ada5261a.js');
 const VisualSearchIcon = require('./VisualSearchIcon-1180d079.js');
 
 const vviinnVprButtonCss = ":host{display:block}";

package/dist/cjs/vviinn-vps-button.cjs.entry.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-5619b5ec.js');
-const _package = require('./package-cc6cc310.js');
-const customizedSlots = require('./customized-slots-67b24737.js');
+const _package = require('./package-ada5261a.js');
+const customizedSlots = require('./customized-slots-71029d3f.js');
 const constants = require('./constants-7684cbfc.js');
 
 const CameraIcon = () => (index.h("svg", { width: "22", height: "20", fill: "none", xmlns: "http://www.w3.org/2000/svg" },

package/dist/cjs/vviinn-vps-widget.cjs.entry.js

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-5619b5ec.js');
 const search_store = require('./search.store-7605f369.js');
 const i18next = require('./i18next-74ff3413.js');
-const _package = require('./package-cc6cc310.js');
-const customizedSlots = require('./customized-slots-67b24737.js');
+const _package = require('./package-ada5261a.js');
+const customizedSlots = require('./customized-slots-71029d3f.js');
 const index$1 = require('./index-4445cb70.js');
 const constants = require('./constants-7684cbfc.js');
 

package/dist/cjs/vviinn-widgets.cjs.js

@@ -20,7 +20,7 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-carousel_4.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[1040],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32],"setModeDiscount":[32],"setModeAppliedDiscounts":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"],[0,"vviinnAddToBasket","trackAddToBasket"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"appliedDiscountPercentage":[2,"applied-discount-percentage"],"currentDiscountPercentage":[2,"current-discount-percentage"],"isSourceProduct":[4,"is-source-product"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_17.cjs",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-text-search",{"clearSearchQuery":[4,"clear-search-query"],"initialSearchQuery":[1,"initial-search-query"],"searchQuery":[32]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraInitializing":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32],"products":[32],"initialSearchQuery":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"vviinnTextSearchFinished","trackTextSearchFinished"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
+  return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-carousel_4.cjs",[[1,"vviinn-vpr-widget",{"blockTitle":[1,"block-title"],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"productId":[1,"product-id"],"token":[1],"currencySign":[1,"currency-sign"],"pricePrefix":[1,"price-prefix"],"mode":[1],"campaignType":[1,"campaign-type"],"locale":[1],"campaigns":[1],"color":[1],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"showScroll":[4,"show-scroll"],"cssUrl":[1,"css-url"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"apiPath":[1,"api-path"],"useCarousel":[4,"use-carousel"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"closed":[4],"opened":[4],"recommendations":[32],"trackingDeactivated":[32],"hasErrorOnLoad":[32],"updatingAllCards":[32],"updatedCardsAmount":[32]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnAddToBasket","trackAddToBasket"],[0,"vviinnUpdatingAllCardsFinished","updatingAllCardsFinishedListener"]]],[0,"vviinn-carousel",{"mode":[1],"imageWidth":[2,"image-width"],"showScroll":[4,"show-scroll"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"recommendations":[1040],"widgetVersion":[1,"widget-version"],"addToBasketShow":[4,"add-to-basket-show"],"updatingAllCards":[4,"updating-all-cards"],"updateButtonLocation":[1,"update-button-location"],"moveDirection":[32],"contentGroups":[32],"activeContentGroup":[32],"isRTL":[32],"crossSellingRecommendations":[32],"setModeDiscount":[32],"setModeAppliedDiscounts":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"],[0,"vviinnAddToBasket","trackAddToBasket"]]],[1,"vviinn-product-card",{"brand":[1],"currency":[1],"deeplink":[1],"image":[1],"imageRatio":[2,"image-ratio"],"imageWidth":[2,"image-width"],"locale":[1],"price":[2],"pricePrefix":[1,"price-prefix"],"productId":[1,"product-id"],"productTitle":[1,"product-title"],"productType":[1,"product-type"],"salePrice":[2,"sale-price"],"responsive":[4],"dimmedBackground":[4,"dimmed-background"],"mode":[1],"addToBasketShow":[4,"add-to-basket-show"],"updateButtonLocation":[1,"update-button-location"],"appliedDiscountPercentage":[2,"applied-discount-percentage"],"currentDiscountPercentage":[2,"current-discount-percentage"],"isSourceProduct":[4,"is-source-product"],"campaignTypeId":[1,"campaign-type-id"],"widgetElementId":[1,"widget-element-id"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"index":[2],"updatingAllCards":[4,"updating-all-cards"],"defaultAnimationInterval":[2,"default-animation-interval"],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_17.cjs",[[1,"vviinn-image-view",{"basicEventData":[16],"setShowAspectRatioError":[16],"showAspectRatioError":[4,"show-aspect-ratio-error"],"cropper":[32],"hidePreloader":[32]},[[0,"vviinnSelectObject","selectDetectedObject"]]],[1,"vviinn-overlayed-modal",{"active":[4],"resetState":[16],"buttonElementId":[1,"button-element-id"],"hideBackButton":[4,"hide-back-button"],"widgetVersion":[1,"widget-version"],"isFirstScreen":[4,"is-first-screen"]}],[1,"vviinn-empty-results",{"handler":[16]}],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"loading":[4],"accept":[1],"resetVpsButton":[16],"capture":[1]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-text-search",{"clearSearchQuery":[4,"clear-search-query"],"initialSearchQuery":[1,"initial-search-query"],"searchQuery":[32]}],[1,"vviinn-wrong-aspect-ratio",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-example-image",{"exampleImageSource":[1,"example-image-source"],"width":[2],"height":[2],"basicEventData":[16],"srcObject":[16],"cameraButtonClicked":[4,"camera-button-clicked"],"selected":[32],"videoInitialized":[32],"zoomCapabilities":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}],[1,"vviinn-teaser"],[1,"vviinn-detected-object",{"detectedObject":[16],"basicEventData":[16],"position":[32]}],[1,"vviinn-modal",{"active":[1540],"resetState":[16],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"hideBackButton":[4,"hide-back-button"],"isFirstScreen":[4,"is-first-screen"],"slider":[32]}],[1,"vviinn-overlay"]]],["vviinn-vps-widget.cjs",[[1,"vviinn-vps-widget",{"token":[1],"active":[1028],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"showingInButton":[4,"showing-in-button"],"buttonElementId":[1,"button-element-id"],"buttonPressed":[4,"button-pressed"],"mode":[1],"resetVpsButton":[16],"slidePosition":[32],"width":[32],"wrongImageFormat":[32],"trackingDeactivated":[32],"stream":[32],"cameraInitializing":[32],"cameraEnabled":[32],"cameraButtonClicked":[32],"uploadSource":[32],"showAspectRatioError":[32],"products":[32],"initialSearchQuery":[32]},[[0,"vviinnCameraEnabled","trackCameraEnabled"],[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"vviinnTextSearchFinished","trackTextSearchFinished"]]]]],["vviinn-vps-button.cjs",[[1,"vviinn-vps-button",{"token":[1],"currencySign":[1,"currency-sign"],"locale":[1],"campaignId":[1,"campaign-id"],"addStyle":[4,"add-style"],"mode":[1],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"imageResolutionWidth":[2,"image-resolution-width"],"exampleImageSource":[1,"example-image-source"],"textSearchShow":[4,"text-search-show"],"apiPath":[1,"api-path"],"buttonPressed":[32]},[[0,"vviinnWidgetClose","handleModalClosed"]]]]],["vviinn-recommendations-sidebar.cjs",[[1,"vviinn-recommendations-sidebar",{"sidebarTitle":[1,"sidebar-title"],"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"widgetScrollbar":[4,"widget-scrollbar"],"mode":[1],"campaigns":[1],"campaignType":[1,"campaign-type"],"color":[1],"locale":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"buttonChildren":[16],"apiPath":[1,"api-path"],"buttonElementId":[1,"button-element-id"],"widgetVersion":[1,"widget-version"],"showingInButton":[4,"showing-in-button"],"state":[32]},[[16,"click","bodyClickListener"]]]]],["vviinn-vpr-button.cjs",[[1,"vviinn-vpr-button",{"token":[1],"productId":[1,"product-id"],"position":[1],"sourceImage":[1,"source-image"],"sidebarTitle":[1,"sidebar-title"],"modalScrollbar":[4,"modal-scrollbar"],"campaigns":[1],"campaignType":[1,"campaign-type"],"locale":[1],"color":[1],"addStyle":[4,"add-style"],"mode":[1],"imageWidth":[2,"image-width"],"currencySign":[1,"currency-sign"],"noResultText":[1,"no-result-text"],"noResultShow":[4,"no-result-show"],"gridArrowsDynamic":[4,"grid-arrows-dynamic"],"excluded":[1],"productDetailNewTab":[4,"product-detail-new-tab"],"addToBasketShow":[4,"add-to-basket-show"],"apiPath":[1,"api-path"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/customized-slots.js

@@ -1,5 +1,7 @@
 import { h } from "@stencil/core";
 const defaultSlotsNames = [
+  "vviinn-recommendations-title",
+  "vviinn-recommendations-subtitle",
   "vviinn-teaser-text",
   "vviinn-image-upload-button-text",
   "vviinn-image-upload-icon",
@@ -7,10 +9,13 @@ const defaultSlotsNames = [
   "vviinn-camera-button-text-start",
   "vviinn-camera-button-text-stop",
   "vviinn-camera-icon",
+  "vviinn-text-search-icon",
   "vviinn-privacy-badge-text",
   "vviinn-image-search-modal-title",
   "vviinn-basket-button-text",
-  "vviinn-text-search-icon",
+  "vviinn-basket-button-icon",
+  "vviinn-update-button-icon",
+  "vviinn-update-button-text",
 ];
 const renderNamedSlot = (name) => h("slot", { name: name });
 export const SlotSkeleton = () => defaultSlotsNames.map(renderNamedSlot);

package/dist/collection/components/vviinn-carousel/vviinn-carousel.css

@@ -1,5 +1,4 @@
 :host {
-  --vviinn-progressbar-width: 0;
   --vviinn-carousel-columns-internal: var(--vviinn-carousel-columns, 4);
 }
 

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

@@ -14,9 +14,9 @@ export class VviinnCarousel {
     this.defaultAnimationInterval = 2000;
     this.mutationObserver = new MutationObserver(() => this.cloneSlottedContent());
     this.handleWindowResize = () => this.setImageWidthSetMode("100%");
-    this.isLastGroup = () => this.activeContentGroup === this.getContentGroups().length - 1 &&
-      this.isGridMode;
-    this.isFirstGroup = () => this.activeContentGroup === 0 && this.isGridMode;
+    this.isLastGroup = () => this.isGridMode &&
+      this.activeContentGroup === this.getContentGroups().length - 1;
+    this.isFirstGroup = () => this.isGridMode && this.activeContentGroup === 0;
     this.updateCard = (productId, step, animationInterval) => {
       let clickedProduct = this.crossSellingRecommendations.find((item) => item.productId === productId);
       const crossSellingIndex = this.crossSellingRecommendations.indexOf(clickedProduct);
@@ -82,11 +82,16 @@ export class VviinnCarousel {
   }
   componentDidLoad() {
     this.setWidth();
-    this.processScrollbarWidth();
     this.columns = this.getColumnsNumber();
     const slot = this.el.querySelector(".content");
     this.mutationObserver.observe(slot, { subtree: true, childList: true });
     this.resizeObserver.observe(this.getHostParent());
+    if (this.isGridMode) {
+      const contentNode = this.getContentNode();
+      contentNode.addEventListener("scrollend", () => {
+        this.activeContentGroup = this.getActiveGroupIndex();
+      });
+    }
   }
   updatingAllCardsWatcher() {
     if (!this.updatingAllCards)
@@ -136,7 +141,6 @@ export class VviinnCarousel {
   }
   handleResize() {
     this.setWidth();
-    this.processScrollbarWidth();
     this.setItemWidth();
     const newColumns = this.getColumnsNumber();
     if (newColumns !== this.columns) {
@@ -173,10 +177,6 @@ export class VviinnCarousel {
     this.setWidth();
   }
   getActiveGroupIndex() {
-    var _a, _b;
-    const contentNodeLeft = (_b = (_a = this.getContentNode()) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) === null || _b === void 0 ? void 0 : _b.left;
-    if (!contentNodeLeft)
-      return 0;
     const groups = this.getContentGroups();
     const groupsPositions = groups.map((g) => g.getBoundingClientRect().left);
     const indexedPositions = groupsPositions
@@ -204,24 +204,15 @@ export class VviinnCarousel {
   getContentGroups() {
     return Array.from(this.el.querySelectorAll(`.${CONTENT_GROUP_CSS_CLASS}`));
   }
-  showNext() {
-    this.moveDirection = "right";
+  handleCarouselButtonClick(action) {
+    this.moveDirection = action;
     const contentContainer = this.getContentNode();
+    const { scrollLeft } = contentContainer;
+    const step = this.calculateMoveStep();
     requestAnimationFrame(() => {
       contentContainer.scrollTo({
         top: 0,
-        left: contentContainer.scrollLeft + this.calculateMoveStep(),
-        behavior: "smooth",
-      });
-    });
-  }
-  showPrev() {
-    this.moveDirection = "left";
-    const contentContainer = this.getContentNode();
-    requestAnimationFrame(() => {
-      contentContainer.scrollTo({
-        top: 0,
-        left: contentContainer.scrollLeft - this.calculateMoveStep(),
+        left: action === "right" ? scrollLeft + step : scrollLeft - step,
         behavior: "smooth",
       });
     });
@@ -236,15 +227,6 @@ export class VviinnCarousel {
       });
     });
   }
-  processScrollbarWidth() {
-    const target = this.getContentNode();
-    if (!target)
-      return;
-    const scrollRatio = (target.scrollLeft + target.clientWidth) / target.scrollWidth;
-    const scrolledWidth = target.clientWidth * scrollRatio;
-    this.el.style.setProperty("--vviinn-progressbar-width", `${scrolledWidth}px`);
-    this.activeContentGroup = this.getActiveGroupIndex();
-  }
   showBullets() {
     return this.isGridMode && this.showScroll;
   }
@@ -297,7 +279,7 @@ export class VviinnCarousel {
       }, onClick: () => this.scroll(index) })));
   }
   render() {
-    return (h(Host, { class: this.getClassMap() }, h("div", { class: Object.assign({ body: true }, this.getClassMap()) }, !this.isSetMode && (h("button", { class: "prev", onClick: () => this.showPrev(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isFirstGroup() }, h(ChevronIcon, null))), this.isSetMode && (h("vviinn-product-card", { part: "product-part", class: "set-mode product-card--source", productTitle: this.sourceProduct.title, image: this.sourceProduct.image.thumbnail, price: this.sourceProduct.price.actual, imageRatio: 1, imageWidth: 300, dimmedBackground: true, isSourceProduct: true })), h("div", { class: this.getContentClassMap(), onScroll: () => this.processScrollbarWidth() }, this.renderRecommendations()), !this.isSetMode && (h("button", { class: "next", onClick: () => this.showNext(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isLastGroup() }, h(ChevronIcon, null)))), this.showBullets() && (h("div", { class: "bullets" }, this.renderBullets()))));
+    return (h(Host, { class: this.getClassMap() }, h("div", { class: Object.assign({ body: true }, this.getClassMap()) }, !this.isSetMode && (h("button", { class: "prev", onClick: () => this.handleCarouselButtonClick("left"), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isFirstGroup() }, h(ChevronIcon, null))), this.isSetMode && (h("vviinn-product-card", { part: "product-part", class: "set-mode product-card--source", productTitle: this.sourceProduct.title, image: this.sourceProduct.image.thumbnail, price: this.sourceProduct.price.actual, imageRatio: 1, imageWidth: 300, dimmedBackground: true, isSourceProduct: true })), h("div", { class: this.getContentClassMap() }, this.renderRecommendations()), !this.isSetMode && (h("button", { class: "next", onClick: () => this.handleCarouselButtonClick("right"), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isLastGroup() }, h(ChevronIcon, null)))), this.showBullets() && (h("div", { class: "bullets" }, this.renderBullets()))));
   }
   static get is() { return "vviinn-carousel"; }
   static get originalStyleUrls() {

package/dist/collection/components/vviinn-product-card/vviinn-product-card.js

@@ -27,10 +27,11 @@ import { generateRandomNumber } from "../../utils/number";
  * @part price-prefix - renders before price-amount. Can be set with "price-prefix" property or inherited from parent component.
  * @part title - Product title
  * @part basket-button - Add to Basket button.
- * @part update-button-item - Update button for Set mode.
+ * @part update-button-item - Update button in product card (Set mode).
  *
- * @slot vviinn-basket-button-text - Title of Add to Basket button.
- * @slot vviinn-update-icon-item - Icon of update button for Set mode.
+ * @slot vviinn-basket-button-text - Text of Add to Basket button.
+ * @slot vviinn-basket-button-icon - Icon of Add to Basket button.
+ * @slot vviinn-update-button-icon - Icon of update button (Set mode).
  */
 export class VviinnProductCard {
   constructor() {
@@ -171,9 +172,7 @@ export class VviinnProductCard {
         "applied-discount": !!this.appliedDiscountPercentage,
       }, part: "basket-button", onClick: () => {
         this.vviinnAddToBasket.emit(Object.assign(Object.assign({}, this.productData), { discount: this.currentDiscountPercentage }));
-      } }, this.isSetMode ? (h(Fragment, null, this.appliedDiscountPercentage ? (h(CheckCircleIcon, null)) : (h(BasketIcon, null)), h("slot", { name: "vviinn-basket-button-text" }, h("span", null, this.appliedDiscountPercentage
-      ? `${this.appliedDiscountPercentage}% ${i18next.t("setMode.appliedDiscountText")}`
-      : i18next.t("setMode.basketButtonText"))))) : (h("slot", { name: "vviinn-basket-button-text" }, h("span", null, i18next.t("basketButtonText")))))))), this.isSetMode && !this.appliedDiscountPercentage && (h("button", { class: {
+      } }, this.isSetMode ? (h(Fragment, null, this.appliedDiscountPercentage ? (h(CheckCircleIcon, null)) : (h("slot", { name: "vviinn-basket-button-icon" }, h(BasketIcon, null))), h("span", null, this.appliedDiscountPercentage ? (`${this.appliedDiscountPercentage}% ${i18next.t("setMode.appliedDiscountText")}`) : (h("slot", { name: "vviinn-basket-button-text" }, i18next.t("setMode.basketButtonText")))))) : (h("slot", { name: "vviinn-basket-button-text" }, h("span", null, i18next.t("basketButtonText")))))))), this.isSetMode && !this.appliedDiscountPercentage && (h("button", { class: {
         "update-button": true,
         hidden: this.updateButtonLocation === "onTop",
       }, part: "update-button-item", onClick: () => {
@@ -181,7 +180,7 @@ export class VviinnProductCard {
           animationInterval: generateRandomNumber(800, 1400),
           productData: this.productData,
         });
-      } }, h("slot", { name: "vviinn-update-icon-item" }, h(UpdateIcon, null))))));
+      } }, h("slot", { name: "vviinn-update-button-icon" }, h(UpdateIcon, null))))));
   }
   static get is() { return "vviinn-product-card"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/vviinn-vpr-button/vviinn-vpr-button.js

@@ -5,9 +5,6 @@ import { VisualSearchIcon } from "../vviinn-icons";
  *
  * @part button - Clickable button element.
  * @part vviinn-button - Button element container.
- *
- * @slot vviinn-basket-button-text - Title of Add to Basket button.
- * @slot vviinn-update-icon - Icon of update button for Set mode.
  */
 export class VviinnVprButton {
   constructor() {

package/dist/collection/components/vviinn-vpr-widget/vviinn-vpr-widget.css

@@ -60,6 +60,8 @@
 
 .update-button svg {
   color: #6f6f6f;
+  width: 24px;
+  height: 24px;
 }
 
 h2 {