vviinn-widgets 2.32.1 → 2.34.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-fcf59d51.js → index-0547e502.js} +4 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{package-c346a8d8.js → package-bec51a19.js} +1 -1
- package/dist/cjs/search-filters_20.cjs.entry.js +1 -1
- package/dist/cjs/vviinn-button.cjs.entry.js +1 -1
- package/dist/cjs/{vviinn-carousel_3.cjs.entry.js → vviinn-carousel_4.cjs.entry.js} +146 -22
- package/dist/cjs/vviinn-recommendations-sidebar.cjs.entry.js +1 -1
- package/dist/cjs/vviinn-vpr-button.cjs.entry.js +2 -2
- package/dist/cjs/vviinn-vps-button.cjs.entry.js +2 -2
- package/dist/cjs/vviinn-vps-widget.cjs.entry.js +1 -1
- package/dist/cjs/vviinn-widgets.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/vviinn-carousel/vviinn-carousel.css +10 -9
- package/dist/collection/components/vviinn-carousel/vviinn-carousel.js +116 -13
- package/dist/collection/components/vviinn-icons/index.js +1 -0
- package/dist/collection/components/vviinn-product-card/vviinn-product-card.css +81 -10
- package/dist/collection/components/vviinn-product-card/vviinn-product-card.js +171 -6
- package/dist/collection/components/vviinn-skeleton/vviinn-skeleton.css +21 -0
- package/dist/collection/components/vviinn-skeleton/vviinn-skeleton.js +67 -0
- package/dist/collection/components/vviinn-vpr-button/recommendations-sidebar/recommendations-sidebar.js +1 -1
- package/dist/collection/components/vviinn-vpr-button/stories/args.js +1 -1
- package/dist/collection/components/vviinn-vpr-button/vviinn-vpr-button.js +2 -1
- package/dist/collection/components/vviinn-vpr-widget/stories/args.js +13 -0
- package/dist/collection/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.js +27 -0
- package/dist/collection/components/vviinn-vpr-widget/vviinn-vpr-vidget.js +48 -6
- package/dist/collection/components/vviinn-vpr-widget/vviinn-vpr-widget.css +26 -0
- package/dist/esm/{index-d1215e03.js → index-77a778fc.js} +4 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{package-8676448e.js → package-48870c30.js} +1 -1
- package/dist/esm/search-filters_20.entry.js +1 -1
- package/dist/esm/vviinn-button.entry.js +1 -1
- package/dist/esm/{vviinn-carousel_3.entry.js → vviinn-carousel_4.entry.js} +146 -23
- package/dist/esm/vviinn-recommendations-sidebar.entry.js +1 -1
- package/dist/esm/vviinn-vpr-button.entry.js +2 -2
- package/dist/esm/vviinn-vps-button.entry.js +2 -2
- package/dist/esm/vviinn-vps-widget.entry.js +1 -1
- package/dist/esm/vviinn-widgets.js +1 -1
- package/dist/types/components/vviinn-carousel/vviinn-carousel.d.ts +14 -1
- package/dist/types/components/vviinn-icons/index.d.ts +1 -0
- package/dist/types/components/vviinn-product-card/vviinn-product-card.d.ts +19 -1
- package/dist/types/components/vviinn-skeleton/vviinn-skeleton.d.ts +6 -0
- package/dist/types/components/vviinn-vpr-button/vviinn-vpr-button.d.ts +1 -0
- package/dist/types/components/vviinn-vpr-widget/stories/args.d.ts +12 -0
- package/dist/types/components/vviinn-vpr-widget/stories/vviinn-vpr-widget.stories.d.ts +13 -0
- package/dist/types/components/vviinn-vpr-widget/vviinn-vpr-vidget.d.ts +9 -0
- package/dist/types/components.d.ts +39 -2
- package/dist/types/recommendation/events.d.ts +5 -0
- package/dist/vviinn-widgets/{p-48a3c418.entry.js → p-40393244.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-774581dc.entry.js → p-46ed6352.entry.js} +1 -1
- package/dist/vviinn-widgets/p-8615ddd8.entry.js +1 -0
- package/dist/vviinn-widgets/{p-17b380b1.entry.js → p-87cb4c54.entry.js} +1 -1
- package/dist/vviinn-widgets/p-b58ea29c.js +1 -0
- package/dist/vviinn-widgets/p-c51bea44.entry.js +1 -0
- package/dist/vviinn-widgets/{p-a69d3568.js → p-dc7e96d7.js} +1 -1
- package/dist/vviinn-widgets/{p-4bcffaa8.entry.js → p-de571b44.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-c3bb5dc7.entry.js → p-f52d84e5.entry.js} +1 -1
- package/dist/vviinn-widgets/vviinn-widgets.esm.js +1 -1
- package/package.json +1 -1
- package/www/build/{p-48a3c418.entry.js → p-40393244.entry.js} +1 -1
- package/www/build/{p-774581dc.entry.js → p-46ed6352.entry.js} +1 -1
- package/www/build/p-8615ddd8.entry.js +1 -0
- package/www/build/{p-17b380b1.entry.js → p-87cb4c54.entry.js} +1 -1
- package/www/build/p-b58ea29c.js +1 -0
- package/www/build/p-c51bea44.entry.js +1 -0
- package/www/build/{p-a69d3568.js → p-dc7e96d7.js} +1 -1
- package/www/build/{p-4bcffaa8.entry.js → p-de571b44.entry.js} +1 -1
- package/www/build/{p-c3bb5dc7.entry.js → p-f52d84e5.entry.js} +1 -1
- package/www/build/vviinn-widgets.esm.js +1 -1
- package/www/index.html +7 -1
- package/dist/collection/slider/GridMode.js +0 -1
- package/dist/types/slider/GridMode.d.ts +0 -1
- package/dist/vviinn-widgets/p-bafae90c.entry.js +0 -1
- package/dist/vviinn-widgets/p-fa636cb1.js +0 -1
- package/dist/vviinn-widgets/p-fc88a6c2.entry.js +0 -1
- package/www/build/p-bafae90c.entry.js +0 -1
- package/www/build/p-fa636cb1.js +0 -1
- package/www/build/p-fc88a6c2.entry.js +0 -1
|
@@ -25,6 +25,9 @@ const VisualSearchIcon = () => (index.h("svg", { width: "20", height: "20", fill
|
|
|
25
25
|
index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M5 2C3.35 2 2 3.35 2 5v2H0V5c0-2.76 2.24-5 5-5h2v2H5Zm5 3c1.28 0 2.56.48 3.54 1.46h-.01a4.994 4.994 0 0 1 .64 6.29l3.05 3.05-1.41 1.41-3.05-3.05c-.84.55-1.8.83-2.76.83a4.98 4.98 0 0 1-3.54-1.46 5.003 5.003 0 0 1 0-7.07C7.44 5.49 8.72 5 10 5Zm-2.77 5c0 .74.29 1.44.81 1.96s1.22.81 1.96.81 1.44-.29 1.96-.81.81-1.22.81-1.96-.29-1.44-.81-1.96-1.22-.81-1.96-.81-1.44.29-1.96.81-.81 1.22-.81 1.96ZM2 15v-2H0v2c0 2.76 2.24 5 5 5h2v-2H5c-1.65 0-3-1.35-3-3ZM13 0h2c2.76 0 5 2.24 5 5v2h-2V5c0-1.65-1.35-3-3-3h-2V0Z", fill: "#161616" })));
|
|
26
26
|
const CrossIcon = () => (index.h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
27
27
|
index.h("path", { d: "M16 1.4L14.6 0L8 6.6L1.4 0L0 1.4L6.6 8L0 14.6L1.4 16L8 9.4L14.6 16L16 14.6L9.4 8L16 1.4Z", fill: "#161616" })));
|
|
28
|
+
const UpdateIcon = () => (index.h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
|
|
29
|
+
index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M23.5998 4.57C20.3898 4.19 19.8798 3.68 19.4198 0.37C19.3798 0.15 19.2198 0 19.0098 0C18.7998 0 18.6298 0.15 18.5898 0.37C18.1198 3.66 17.6298 4.13 14.4098 4.57C14.1698 4.61 14.0098 4.77 14.0098 5C14.0098 5.23 14.1698 5.39 14.4098 5.42C17.6298 5.81 18.1398 6.31 18.5898 9.62C18.6298 9.84 18.7998 10 19.0098 10C19.2198 10 19.3898 9.84 19.4198 9.62C19.8898 6.31 20.3898 5.81 23.5998 5.42C23.8398 5.38 23.9998 5.22 23.9998 5C23.9998 4.78 23.8298 4.6 23.5998 4.57Z", fill: "currentColor" }),
|
|
30
|
+
index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M19.93 13C19.43 13 19.01 13.37 18.95 13.86C18.52 17.36 15.51 20.06 11.89 20C8.24 19.94 5.15 16.92 5.01 13.27C4.92 10.79 6.13 8.58 8.01 7.27V11C8.01 11.55 8.46 12 9.01 12C9.56 12 10.01 11.55 10.01 11V5C10.01 4.45 9.56 4 9.01 4H3C2.45 4 2 4.45 2 5C2 5.55 2.45 6 3 6H6.35C4.24 7.71 2.91 10.35 3 13.3C3.15 17.98 7.06 21.87 11.74 22C16.45 22.13 20.37 18.65 20.93 14.13C21 13.53 20.53 13.01 19.93 13.01V13Z", fill: "currentColor" })));
|
|
28
31
|
|
|
29
32
|
exports.ArrowIcon = ArrowIcon;
|
|
30
33
|
exports.CameraIcon = CameraIcon;
|
|
@@ -33,4 +36,5 @@ exports.CrossIcon = CrossIcon;
|
|
|
33
36
|
exports.OnboardingCard1Icon = OnboardingCard1Icon;
|
|
34
37
|
exports.OnboardingCard2Icon = OnboardingCard2Icon;
|
|
35
38
|
exports.OnboardingCard3Icon = OnboardingCard3Icon;
|
|
39
|
+
exports.UpdateIcon = UpdateIcon;
|
|
36
40
|
exports.VisualSearchIcon = VisualSearchIcon;
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -14,7 +14,7 @@ const patchEsm = () => {
|
|
|
14
14
|
const defineCustomElements = (win, options) => {
|
|
15
15
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
16
16
|
return patchEsm().then(() => {
|
|
17
|
-
return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-
|
|
17
|
+
return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["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":[16],"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]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[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"],"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"],"imageLoaded":[32],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_20.cjs",[[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16],"exampleImagesTitle":[1,"example-images-title"]}],[1,"vviinn-image-view",{"basicEventData":[16],"cropper":[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"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-teaser"],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[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"],"slider":[32]}],[1,"vviinn-onboarding-card-1",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-2",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-3",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["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"],"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]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"secondaryActionClicked","trackSecondaryAction"]]]]],["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"],"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);
|
|
18
18
|
});
|
|
19
19
|
};
|
|
20
20
|
|
|
@@ -6,7 +6,7 @@ const index = require('./index-5619b5ec.js');
|
|
|
6
6
|
const imageSearch_store = require('./imageSearch.store-dc4e98b3.js');
|
|
7
7
|
const i18next = require('./i18next-74ff3413.js');
|
|
8
8
|
const customizedSlots = require('./customized-slots-0a8d663c.js');
|
|
9
|
-
const index$1 = require('./index-
|
|
9
|
+
const index$1 = require('./index-0547e502.js');
|
|
10
10
|
|
|
11
11
|
// -------------------------------------------------------------------------------------
|
|
12
12
|
// -------------------------------------------------------------------------------------
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const index$1 = require('./index-
|
|
6
|
+
const index$1 = require('./index-0547e502.js');
|
|
7
7
|
|
|
8
8
|
const vviinnButtonCss = ":host{display:block}.open-button{align-items:center;background:rgba(255, 255, 255, 0.8);border-radius:50%;border:none;box-shadow:0px 2px 6px rgba(0, 0, 0, 0.15);box-sizing:border-box;cursor:pointer;display:grid;height:40px;justify-items:center;padding:0;width:40px;transition:all 0.25s ease-in-out}.raw-open-button{background:none;border:none;cursor:pointer}.open-button:hover{box-shadow:0px 2px 6px rgba(0, 0, 0, 0.25)}.open-button:focus{border:2px solid rgba(15, 98, 254, 0.5);outline:none}.open-button:active{background:#f4f4f4;outline:none}";
|
|
9
9
|
|
|
@@ -4,13 +4,13 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
6
|
const imageSearch_store = require('./imageSearch.store-dc4e98b3.js');
|
|
7
|
-
const index$1 = require('./index-
|
|
7
|
+
const index$1 = require('./index-0547e502.js');
|
|
8
8
|
const i18next = require('./i18next-74ff3413.js');
|
|
9
9
|
const customizedSlots = require('./customized-slots-0a8d663c.js');
|
|
10
|
-
const _package = require('./package-
|
|
10
|
+
const _package = require('./package-bec51a19.js');
|
|
11
11
|
const index$2 = require('./index-7ff2ab5f.js');
|
|
12
12
|
|
|
13
|
-
const vviinnCarouselCss = ":host{--vviinn-progressbar-width:0;--vviinn-carousel-item-width:150px;--vviinn-carousel-columns-internal:var(--vviinn-carousel-columns, 4);--vviinn-carousel-image-width-system:140px}.body{display:flex;position:relative;width:var(--vviinn-carousel-content-width);flex-direction:column}.content-wrapper *{box-sizing:border-box}.content-wrapper{overflow-y:hidden;overflow-x:auto;flex-grow:1}.bullets{margin-top:16px;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;grid-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)
|
|
13
|
+
const vviinnCarouselCss = ":host{--vviinn-progressbar-width:0;--vviinn-carousel-item-width:150px;--vviinn-carousel-columns-internal:var(--vviinn-carousel-columns, 4);--vviinn-carousel-image-width-system:140px}.body{display:flex;position:relative;width:var(--vviinn-carousel-content-width);flex-direction:column}.content-wrapper *{box-sizing:border-box}.content-wrapper{overflow-y:hidden;overflow-x:auto;flex-grow:1}.bullets{margin-top:16px;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;grid-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}:host(.classic) vviinn-product-card::part(title),:host(.classic) vviinn-product-card::part(brand),:host(.classic) vviinn-product-card::part(type){text-align:center}@media (max-width: 480px){:host(.modern) button{display:none}.items-group{grid-template-columns:repeat(2, 1fr)}}";
|
|
14
14
|
|
|
15
15
|
const COLUMNS_NUMBER_CSS_VAR = "--vviinn-carousel-columns-internal";
|
|
16
16
|
const CAROUSEL_WIDTH_CSS_VAR = "--vviinn-carousel-content-width";
|
|
@@ -21,14 +21,36 @@ const VviinnCarousel = class {
|
|
|
21
21
|
index.registerInstance(this, hostRef);
|
|
22
22
|
this.columns = 0;
|
|
23
23
|
this.resizeObserver = new ResizeObserver(() => this.handleResize());
|
|
24
|
+
this.defaultAnimationInterval = 2000;
|
|
24
25
|
this.mutationObserver = new MutationObserver(() => this.cloneSlottedContent());
|
|
25
26
|
this.isLastGroup = () => this.activeContentGroup === this.getContentGroups().length - 1 &&
|
|
26
|
-
this.
|
|
27
|
-
this.isFirstGroup = () => this.activeContentGroup === 0 && this.
|
|
27
|
+
this.isGridMode;
|
|
28
|
+
this.isFirstGroup = () => this.activeContentGroup === 0 && this.isGridMode;
|
|
29
|
+
this.updateCard = (productId, step, animationInterval) => {
|
|
30
|
+
let clickedProduct = this.crossSellingRecommendations.find((item) => item.productId === productId);
|
|
31
|
+
const crossSellingIndex = this.crossSellingRecommendations.indexOf(clickedProduct);
|
|
32
|
+
const recommendationIndex = this.recommendations.indexOf(clickedProduct);
|
|
33
|
+
const newCrossSellingRecommendations = this.crossSellingRecommendations;
|
|
34
|
+
if (recommendationIndex + step < this.recommendations.length) {
|
|
35
|
+
newCrossSellingRecommendations[crossSellingIndex] =
|
|
36
|
+
this.recommendations[recommendationIndex + step];
|
|
37
|
+
let element = this.el.querySelector(`[data-id="${productId}"]`);
|
|
38
|
+
const button = element.shadowRoot.querySelector(".update-button");
|
|
39
|
+
button.classList.add("hidden");
|
|
40
|
+
this.crossSellingRecommendations = [...newCrossSellingRecommendations];
|
|
41
|
+
const animationTimer = setTimeout(() => {
|
|
42
|
+
if (recommendationIndex + step * 2 <= this.recommendations.length - 1) {
|
|
43
|
+
button.classList.remove("hidden");
|
|
44
|
+
}
|
|
45
|
+
clearTimeout(animationTimer);
|
|
46
|
+
}, animationInterval);
|
|
47
|
+
}
|
|
48
|
+
};
|
|
28
49
|
this.moveDirection = "right";
|
|
29
50
|
this.contentGroups = [];
|
|
30
51
|
this.activeContentGroup = 0;
|
|
31
52
|
this.isRTL = false;
|
|
53
|
+
this.crossSellingRecommendations = [];
|
|
32
54
|
this.mode = "continuity";
|
|
33
55
|
this.imageWidth = 140;
|
|
34
56
|
this.showScroll = true;
|
|
@@ -38,12 +60,22 @@ const VviinnCarousel = class {
|
|
|
38
60
|
this.recommendations = [];
|
|
39
61
|
this.widgetVersion = undefined;
|
|
40
62
|
this.addToBasketShow = undefined;
|
|
63
|
+
this.updatingAllCards = undefined;
|
|
64
|
+
this.updateButtonLocation = undefined;
|
|
41
65
|
}
|
|
42
66
|
componentWillLoad() {
|
|
43
67
|
this.isRTL = document.dir === "rtl";
|
|
44
68
|
}
|
|
45
69
|
connectedCallback() {
|
|
46
70
|
this.setItemWidth();
|
|
71
|
+
this.isSetMode = this.mode === "set";
|
|
72
|
+
this.isGridMode = this.mode === "grid";
|
|
73
|
+
this.isContinuityMode = this.mode === "continuity";
|
|
74
|
+
this.isGridLike = this.isGridMode || this.isSetMode;
|
|
75
|
+
const columnsNumber = this.getColumnsNumber();
|
|
76
|
+
if (this.isSetMode && this.recommendations.length >= columnsNumber) {
|
|
77
|
+
this.crossSellingRecommendations = this.recommendations.slice(0, columnsNumber);
|
|
78
|
+
}
|
|
47
79
|
}
|
|
48
80
|
disconnectedCallback() {
|
|
49
81
|
this.resizeObserver.disconnect();
|
|
@@ -56,6 +88,19 @@ const VviinnCarousel = class {
|
|
|
56
88
|
this.mutationObserver.observe(slot, { subtree: true, childList: true });
|
|
57
89
|
this.resizeObserver.observe(this.getHostParent());
|
|
58
90
|
}
|
|
91
|
+
updatingAllCardsWatcher() {
|
|
92
|
+
if (!this.updatingAllCards)
|
|
93
|
+
return;
|
|
94
|
+
const step = this.getColumnsNumber();
|
|
95
|
+
this.crossSellingRecommendations.forEach((item) => {
|
|
96
|
+
this.updateCard(item.productId, step, this.defaultAnimationInterval);
|
|
97
|
+
});
|
|
98
|
+
}
|
|
99
|
+
crossSellingClickListener({ detail }) {
|
|
100
|
+
const step = this.getColumnsNumber();
|
|
101
|
+
const { animationInterval, productData } = detail;
|
|
102
|
+
this.updateCard(productData.productId, step, animationInterval);
|
|
103
|
+
}
|
|
59
104
|
getItemWidthFromDocument() {
|
|
60
105
|
return parseInt(getComputedStyle(document.body).getPropertyValue(CAROUSEL_IMAGE_WIDTH_CSS_VAR));
|
|
61
106
|
}
|
|
@@ -70,7 +115,7 @@ const VviinnCarousel = class {
|
|
|
70
115
|
return {
|
|
71
116
|
content: true,
|
|
72
117
|
[this.moveDirection]: true,
|
|
73
|
-
[this.mode]: true,
|
|
118
|
+
[this.isSetMode ? "grid" : this.mode]: true,
|
|
74
119
|
"show-scrollbar": this.showScroll,
|
|
75
120
|
};
|
|
76
121
|
}
|
|
@@ -185,19 +230,19 @@ const VviinnCarousel = class {
|
|
|
185
230
|
this.activeContentGroup = this.getActiveGroupIndex();
|
|
186
231
|
}
|
|
187
232
|
showBullets() {
|
|
188
|
-
return this.
|
|
233
|
+
return this.isGridMode && this.showScroll;
|
|
189
234
|
}
|
|
190
235
|
showScrollbar() {
|
|
191
|
-
return this.
|
|
236
|
+
return this.isContinuityMode && this.showScroll;
|
|
192
237
|
}
|
|
193
238
|
getClassMap() {
|
|
194
239
|
return {
|
|
195
|
-
[this.mode]: true,
|
|
240
|
+
[this.isSetMode ? "grid" : this.mode]: true,
|
|
196
241
|
"show-scrollbar": this.showScrollbar(),
|
|
197
242
|
};
|
|
198
243
|
}
|
|
199
244
|
renderRecommendation(recommendation, rank) {
|
|
200
|
-
return (index.h("vviinn-product-card", { part: "product-part", productId: recommendation.productId, productTitle: recommendation.title, productType: recommendation.productType, deeplink: recommendation.deeplink, image: recommendation.image.thumbnail, brand: recommendation.brand, imageWidth: this.imageWidth, imageRatio: 1, price: recommendation.price.actual, salePrice: recommendation.price.sale, responsive: this.
|
|
245
|
+
return (index.h("vviinn-product-card", { part: "product-part", productId: recommendation.productId, productTitle: recommendation.title, productType: recommendation.productType, deeplink: recommendation.deeplink, image: recommendation.image.thumbnail, brand: recommendation.brand, imageWidth: this.imageWidth, imageRatio: 1, price: recommendation.price.actual, salePrice: recommendation.price.sale, responsive: this.isGridLike, dimmedBackground: this.isContinuityMode, campaignTypeId: this.campaignTypeId, index: rank, widgetElementId: this.widgetElementId, widgetVersion: this.widgetVersion, addToBasketShow: this.addToBasketShow, mode: this.mode, "data-id": recommendation.productId, updatingAllCards: this.updatingAllCards, defaultAnimationInterval: this.defaultAnimationInterval, updateButtonLocation: this.updateButtonLocation }));
|
|
201
246
|
}
|
|
202
247
|
renderRecommendationGroup(elements) {
|
|
203
248
|
return (index.h("div", { class: CONTENT_GROUP_CSS_CLASS, part: "items-group" }, ...elements));
|
|
@@ -206,12 +251,15 @@ const VviinnCarousel = class {
|
|
|
206
251
|
return elements.map((el) => this.renderRecommendationGroup(el));
|
|
207
252
|
}
|
|
208
253
|
renderRecommendations() {
|
|
209
|
-
return this.
|
|
254
|
+
return this.isGridLike
|
|
210
255
|
? this.renderGrid()
|
|
211
256
|
: this.renderRecommendationsElements();
|
|
212
257
|
}
|
|
213
258
|
renderRecommendationsElements() {
|
|
214
|
-
|
|
259
|
+
const recommendations = this.isSetMode
|
|
260
|
+
? this.crossSellingRecommendations
|
|
261
|
+
: this.recommendations;
|
|
262
|
+
return recommendations.map((r, i) => this.renderRecommendation(r, i));
|
|
215
263
|
}
|
|
216
264
|
renderGrid() {
|
|
217
265
|
const recommendations = this.renderRecommendationsElements();
|
|
@@ -227,9 +275,12 @@ const VviinnCarousel = class {
|
|
|
227
275
|
}, onClick: () => this.scroll(index$1) })));
|
|
228
276
|
}
|
|
229
277
|
render() {
|
|
230
|
-
return (index.h(index.Host, { class: this.getClassMap() }, index.h("div", { class: Object.assign({ body: true }, this.getClassMap()) }, index.h("button", { class: "prev", onClick: () => this.showPrev(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isFirstGroup() }, index.h(index$1.ChevronIcon, null)), index.h("div", { class: this.getContentClassMap(), onScroll: () => this.processScrollbarWidth() }, this.renderRecommendations()), index.h("button", { class: "next", onClick: () => this.showNext(), part: "carousel-button", disabled: this.gridArrowsDynamic && this.isLastGroup() }, index.h(index$1.ChevronIcon, null))), this.showBullets() && (index.h("div", { class: "bullets" }, this.renderBullets()))));
|
|
278
|
+
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(index$1.ChevronIcon, null))), 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(index$1.ChevronIcon, null)))), this.showBullets() && (index.h("div", { class: "bullets" }, this.renderBullets()))));
|
|
231
279
|
}
|
|
232
280
|
get el() { return index.getElement(this); }
|
|
281
|
+
static get watchers() { return {
|
|
282
|
+
"updatingAllCards": ["updatingAllCardsWatcher"]
|
|
283
|
+
}; }
|
|
233
284
|
};
|
|
234
285
|
VviinnCarousel.style = vviinnCarouselCss;
|
|
235
286
|
|
|
@@ -418,7 +469,7 @@ const Image = (props, onLoadEnd = () => undefined) => (index.h("picture", null,
|
|
|
418
469
|
const ResponsiveImage = (props, onLoadEnd = () => undefined) => (index.h("picture", null,
|
|
419
470
|
index.h("img", { loading: props.lazy ? "lazy" : "eager", part: "image", class: "image responsive", src: processWidth(props.src, props.width), alt: props.title, ref: props.ref, onLoad: onLoadEnd })));
|
|
420
471
|
|
|
421
|
-
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;gap:8px;height:100%}.price-container{display:flex;flex-direction:column
|
|
472
|
+
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%}.price-container{display:flex;flex-direction:column}.price-sale,.price-regular{font-style:normal;font-weight:normal;font-size:16px;line-height:24px;color:#161616}.price-outdated{font-style:normal;font-weight:normal;font-size:16px;line-height:24px;color:#757575;text-decoration:line-through}.product-type{word-wrap:anywhere}.image{display:grid;align-content:center;-o-object-position:50% 50%;object-position:50% 50%;-o-object-fit:contain;object-fit:contain;text-align:center;box-sizing:border-box}img.responsive{width:100%;height:auto;aspect-ratio:1}.brand,.type{display:none}.title{-webkit-box-orient:vertical;-webkit-line-clamp:2;color:#161616;display:-webkit-box;font-size:16px;font-style:normal;font-weight:500;line-height:24px;overflow:hidden}.deeplink{text-decoration:none;max-width:100%}.image-link{display:contents}picture{position:relative;width:100%}picture::before{content:\"\";opacity:0;width:100%;height:100%;box-sizing:border-box;display:block;top:0;left:0;position:absolute}.update-button{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:32px;height:32px;z-index:1;background:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button-container{margin-top:auto;width:100%}.basket-button{border:none;cursor:pointer;font-size:16px;padding:10px 12px}.basket-button.basket-button-grid{width:100%;background:none;border:1px solid #dddddd}.basket-button.basket-button-continuity{align-self:start;background:#f7f7f7}.basket-button-continuity:hover{background:#eaeaea}.basket-button-grid:hover{background:#f7f7f7}:host(.dimmed) picture::after{content:\"\";width:100%;height:100%;box-sizing:border-box;background:#f7f7f7;display:block;top:0;left:0;position:absolute;mix-blend-mode:multiply}:host(.animated) picture::before{opacity:1;animation:pulse 1.2s infinite}:host(.animated) picture::after{content:\"\";position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px);background-image:url(\"data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_810_154)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M64.7332 1.23333C66.2665 12.2667 67.9665 13.9667 78.6665 15.2333C79.4332 15.3333 79.9999 15.9333 79.9999 16.6667C79.9999 17.4 79.4665 17.9333 78.6665 18.0667C67.9665 19.3667 66.2999 21.0333 64.7332 32.0667C64.6332 32.8 64.0665 33.3333 63.3665 33.3333C62.6665 33.3333 62.0999 32.8 61.9665 32.0667C60.4665 21.0333 58.7665 19.3667 48.0332 18.0667C47.2332 17.9667 46.6999 17.4333 46.6999 16.6667C46.6999 15.9 47.2332 15.3667 48.0332 15.2333C58.7665 13.7667 60.3999 12.2 61.9665 1.23333C62.0999 0.5 62.6665 0 63.3665 0C64.0665 0 64.5999 0.5 64.7332 1.23333ZM38.5665 71.5667C38.3665 72.6 37.6665 73.3333 36.6665 73.3333C35.6665 73.3333 34.9665 72.6 34.7998 71.5667C31.9332 50.7 29.0998 47.9 8.49984 45.2C7.39984 45.1 6.6665 44.3 6.6665 43.3C6.6665 42.3 7.39984 41.5333 8.49984 41.4333C29.1332 39.1333 32.0998 35.9333 34.7998 15.0333C34.9665 14.0333 35.6665 13.3333 36.6665 13.3333C37.6665 13.3333 38.3665 14 38.5665 15.0333C41.2665 35.9333 44.1998 39.1333 64.8665 41.4333C65.9332 41.5333 66.6665 42.2667 66.6665 43.3C66.6665 44.3333 65.9332 45.1 64.8665 45.2C44.1998 47.5 41.2665 50.7 38.5665 71.5667Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_810_154'%3E%3Crect width='80' height='80' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E \")}@keyframes pulse{0%{background-color:rgb(244, 244, 244)}50%{background-color:rgb(232, 232, 232)}100%{background-color:rgba(244, 244, 244)}}";
|
|
422
473
|
|
|
423
474
|
const VviinnProductCard = class {
|
|
424
475
|
constructor(hostRef) {
|
|
@@ -428,6 +479,8 @@ const VviinnProductCard = class {
|
|
|
428
479
|
this.vviinnProductClick = index.createEvent(this, "vviinnProductClick", 7);
|
|
429
480
|
this.vviinnAddToBasket = index.createEvent(this, "vviinnAddToBasket", 7);
|
|
430
481
|
this.vviinnAuxClick = index.createEvent(this, "vviinnAuxClick", 7);
|
|
482
|
+
this.vviinnCrossSellingClick = index.createEvent(this, "vviinnCrossSellingClick", 7);
|
|
483
|
+
this.vviinnUpdatingAllCardsFinished = index.createEvent(this, "vviinnUpdatingAllCardsFinished", 7);
|
|
431
484
|
this.productData = null;
|
|
432
485
|
this.intersectionCallback = (data) => {
|
|
433
486
|
if (data.some((entry) => entry.isIntersecting)) {
|
|
@@ -453,12 +506,16 @@ const VviinnProductCard = class {
|
|
|
453
506
|
this.dimmedBackground = false;
|
|
454
507
|
this.mode = undefined;
|
|
455
508
|
this.addToBasketShow = undefined;
|
|
509
|
+
this.updateButtonLocation = undefined;
|
|
456
510
|
this.campaignTypeId = undefined;
|
|
457
511
|
this.widgetElementId = undefined;
|
|
458
512
|
this.buttonElementId = undefined;
|
|
459
513
|
this.widgetVersion = undefined;
|
|
460
514
|
this.index = 0;
|
|
515
|
+
this.updatingAllCards = undefined;
|
|
516
|
+
this.defaultAnimationInterval = undefined;
|
|
461
517
|
this.imageLoaded = false;
|
|
518
|
+
this.isTransitioning = false;
|
|
462
519
|
}
|
|
463
520
|
connectedCallback() {
|
|
464
521
|
this.productData = this.getProductData();
|
|
@@ -466,6 +523,27 @@ const VviinnProductCard = class {
|
|
|
466
523
|
componentWillLoad() {
|
|
467
524
|
customizedSlots.slotChangeListener(this, this.el);
|
|
468
525
|
}
|
|
526
|
+
crossSellingClickListener({ detail }) {
|
|
527
|
+
const { animationInterval } = detail;
|
|
528
|
+
this.isTransitioning = true;
|
|
529
|
+
const animationTimer = setTimeout(() => {
|
|
530
|
+
this.isTransitioning = false;
|
|
531
|
+
clearTimeout(animationTimer);
|
|
532
|
+
}, animationInterval);
|
|
533
|
+
}
|
|
534
|
+
updatingAllCardsWatcher() {
|
|
535
|
+
if (!this.updatingAllCards)
|
|
536
|
+
return;
|
|
537
|
+
this.isTransitioning = true;
|
|
538
|
+
const animationTimer = setTimeout(() => {
|
|
539
|
+
this.vviinnUpdatingAllCardsFinished.emit();
|
|
540
|
+
this.isTransitioning = false;
|
|
541
|
+
clearTimeout(animationTimer);
|
|
542
|
+
}, this.defaultAnimationInterval);
|
|
543
|
+
}
|
|
544
|
+
productIdWatcher() {
|
|
545
|
+
this.productData = this.getProductData();
|
|
546
|
+
}
|
|
469
547
|
getWidgetType() {
|
|
470
548
|
return this.campaignTypeId === "VPR" || this.campaignTypeId === "VCS"
|
|
471
549
|
? "VPR"
|
|
@@ -518,20 +596,58 @@ const VviinnProductCard = class {
|
|
|
518
596
|
};
|
|
519
597
|
return this.responsive ? ResponsiveImage(props) : Image(props);
|
|
520
598
|
}
|
|
599
|
+
generateRandomNumber(min, max) {
|
|
600
|
+
return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
601
|
+
}
|
|
521
602
|
render() {
|
|
522
603
|
var _a, _b, _c;
|
|
523
|
-
return (index.h(index.Host, { part: "product-card", class: {
|
|
604
|
+
return (index.h(index.Host, { part: "product-card", class: {
|
|
605
|
+
dimmed: this.dimmedBackground,
|
|
606
|
+
animated: this.isTransitioning,
|
|
607
|
+
}, exportparts: "brand, currency, deeplink, image, image-link, price-amount-sale, price-amount-outdated, price-amount-regular, price-container, price-outdated, price-regular, price-sale, price-prefix, title, basket-button, update-button-item" }, index.h(Linked, { deeplink: this.deeplink, part: "image-link" }, this.renderImage()), this.isTransitioning ? (index.h(index.Fragment, null, index.h("vviinn-skeleton", { height: 20 }), index.h("vviinn-skeleton", { height: 20, halfWidth: true }))) : (index.h(index.Fragment, null, index.h(Linked, { deeplink: this.deeplink, part: "deeplink" }, index.h("span", { class: "title", part: "title" }, this.productTitle)), index.h("span", { class: "brand", part: "brand" }, this.brand), index.h("span", { class: "type", part: "type" }, this.productType), index.h(Price, { prefix: (_a = this.pricePrefix) !== null && _a !== void 0 ? _a : imageSearch_store.state.pricePrefix, currency: (_b = this.currency) !== null && _b !== void 0 ? _b : imageSearch_store.state.currencySign, price: this.price, salePrice: this.salePrice, locale: (_c = this.locale) !== null && _c !== void 0 ? _c : imageSearch_store.state.locale }))), this.addToBasketShow && (index.h("div", { class: "basket-button-container" }, this.isTransitioning ? (index.h("vviinn-skeleton", { height: 40 })) : (index.h("button", { class: {
|
|
524
608
|
"basket-button": true,
|
|
525
|
-
"basket-button-grid": this.mode === "grid",
|
|
609
|
+
"basket-button-grid": this.mode === "grid" || this.mode === "set",
|
|
526
610
|
"basket-button-continuity ": this.mode === "continuity",
|
|
527
611
|
}, part: "basket-button", onClick: () => {
|
|
528
612
|
this.vviinnAddToBasket.emit(this.productData);
|
|
529
|
-
} }, index.h("slot", { name: "vviinn-basket-button-text" }, index.h("span", null, i18next.instance.t("basketButtonText")))))))
|
|
613
|
+
} }, index.h("slot", { name: "vviinn-basket-button-text" }, index.h("span", null, i18next.instance.t("basketButtonText"))))))), this.mode === "set" ? (index.h("button", { class: {
|
|
614
|
+
"update-button": true,
|
|
615
|
+
hidden: this.updateButtonLocation === "onTop",
|
|
616
|
+
}, part: "update-button-item", onClick: () => {
|
|
617
|
+
this.vviinnCrossSellingClick.emit({
|
|
618
|
+
animationInterval: this.generateRandomNumber(800, 1400),
|
|
619
|
+
productData: this.productData,
|
|
620
|
+
});
|
|
621
|
+
} }, index.h("slot", { name: "vviinn-update-icon-item" }, index.h(index$1.UpdateIcon, null)))) : null));
|
|
530
622
|
}
|
|
531
623
|
get el() { return index.getElement(this); }
|
|
624
|
+
static get watchers() { return {
|
|
625
|
+
"updatingAllCards": ["updatingAllCardsWatcher"],
|
|
626
|
+
"productId": ["productIdWatcher"]
|
|
627
|
+
}; }
|
|
532
628
|
};
|
|
533
629
|
VviinnProductCard.style = vviinnProductCardCss;
|
|
534
630
|
|
|
631
|
+
const vviinnSkeletonCss = ":host{display:block;width:100%;height:100%}.vviinn-skeleton{animation:pulse 1.2s infinite}@keyframes pulse{0%{background-color:rgb(244, 244, 244)}50%{background-color:rgb(232, 232, 232)}100%{background-color:rgba(244, 244, 244)}}";
|
|
632
|
+
|
|
633
|
+
const VviinnSkeleton = class {
|
|
634
|
+
constructor(hostRef) {
|
|
635
|
+
index.registerInstance(this, hostRef);
|
|
636
|
+
this.height = undefined;
|
|
637
|
+
this.halfWidth = false;
|
|
638
|
+
}
|
|
639
|
+
render() {
|
|
640
|
+
return (index.h(index.Host, null, index.h("div", { class: {
|
|
641
|
+
"vviinn-skeleton": true,
|
|
642
|
+
}, style: {
|
|
643
|
+
height: `${this.height.toString()}px`,
|
|
644
|
+
width: this.halfWidth ? "50%" : "100%",
|
|
645
|
+
} })));
|
|
646
|
+
}
|
|
647
|
+
get el() { return index.getElement(this); }
|
|
648
|
+
};
|
|
649
|
+
VviinnSkeleton.style = vviinnSkeletonCss;
|
|
650
|
+
|
|
535
651
|
function isFunction(value) {
|
|
536
652
|
return typeof value === 'function';
|
|
537
653
|
}
|
|
@@ -1217,7 +1333,7 @@ const resources = {
|
|
|
1217
1333
|
},
|
|
1218
1334
|
};
|
|
1219
1335
|
|
|
1220
|
-
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%}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}";
|
|
1336
|
+
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%}.title-container{display:flex;justify-content:space-between;align-items:center}.update-button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:rgb(244, 244, 244);border:none;color:white;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}";
|
|
1221
1337
|
|
|
1222
1338
|
var __rest = (undefined && undefined.__rest) || function (s, e) {
|
|
1223
1339
|
var t = {};
|
|
@@ -1273,6 +1389,7 @@ const VviinnVprWidget = class {
|
|
|
1273
1389
|
this.excluded = "";
|
|
1274
1390
|
this.productDetailNewTab = false;
|
|
1275
1391
|
this.addToBasketShow = false;
|
|
1392
|
+
this.updateButtonLocation = "topAndItem";
|
|
1276
1393
|
this.apiPath = "https://api.vviinn.com";
|
|
1277
1394
|
this.useCarousel = true;
|
|
1278
1395
|
this.showingInButton = false;
|
|
@@ -1282,6 +1399,7 @@ const VviinnVprWidget = class {
|
|
|
1282
1399
|
this.recommendations = [];
|
|
1283
1400
|
this.trackingDeactivated = false;
|
|
1284
1401
|
this.hasErrorOnLoad = false;
|
|
1402
|
+
this.updatingAllCards = false;
|
|
1285
1403
|
}
|
|
1286
1404
|
getBasicEventData() {
|
|
1287
1405
|
return {
|
|
@@ -1427,6 +1545,11 @@ const VviinnVprWidget = class {
|
|
|
1427
1545
|
.trackEvent(addToBasketEvent)
|
|
1428
1546
|
.then(this.setTrackingDeactivated);
|
|
1429
1547
|
}
|
|
1548
|
+
updatingAllCardsFinishedListener() {
|
|
1549
|
+
if (!this.updatingAllCards)
|
|
1550
|
+
return;
|
|
1551
|
+
this.updatingAllCards = false;
|
|
1552
|
+
}
|
|
1430
1553
|
trackWidgetEvent(action) {
|
|
1431
1554
|
if (this.trackingDeactivated)
|
|
1432
1555
|
return;
|
|
@@ -1511,14 +1634,14 @@ const VviinnVprWidget = class {
|
|
|
1511
1634
|
return (index.h(index.Host, { class: {
|
|
1512
1635
|
loaded: true,
|
|
1513
1636
|
empty: this.recommendations.length == 0,
|
|
1514
|
-
[this.mode]: true,
|
|
1515
|
-
}, "aria-hidden": "false" }, this.addToBasketShow && index.h(customizedSlots.SlotSkeleton, null), index.h(index.Fragment, null, this.renderExternalCSS(), index.h("style", null, imageSearch_store.state.fallbackStyles), index.h("h2", { part: "recommendations-title" }, this.blockTitle), this.recommendations.length > 0 &&
|
|
1637
|
+
[this.mode === "set" ? "grid" : this.mode]: true,
|
|
1638
|
+
}, "aria-hidden": "false" }, this.addToBasketShow && index.h(customizedSlots.SlotSkeleton, null), index.h(index.Fragment, null, this.renderExternalCSS(), index.h("style", null, imageSearch_store.state.fallbackStyles), index.h("div", { class: "title-container" }, index.h("h2", { part: "recommendations-title" }, this.blockTitle), this.mode === "set" && 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(index$1.UpdateIcon, null)))) : null), this.recommendations.length > 0 &&
|
|
1516
1639
|
(this.useCarousel ? this.renderCarousel() : this.renderResults()), this.recommendations.length === 0 && this.hasErrorOnLoad && (index.h("p", { class: "no-result-text" }, this.noResultText.length
|
|
1517
1640
|
? this.noResultText
|
|
1518
1641
|
: i18next.instance.t("noResultText"))))));
|
|
1519
1642
|
}
|
|
1520
1643
|
renderRecommendation(recommendation, index$1) {
|
|
1521
|
-
return (index.h("vviinn-product-card", { part: "product-part", productId: recommendation.productId, productTitle: recommendation.title, productType: recommendation.productType, deeplink: recommendation.deeplink, image: recommendation.image.thumbnail, brand: recommendation.brand, imageWidth: this.imageWidth, imageRatio: 1, price: recommendation.price.actual, salePrice: recommendation.price.sale, responsive: this.mode === "grid", addToBasketShow: this.addToBasketShow, mode: this.mode, dimmedBackground: this.useDimmedBackgroundInCard(), campaignTypeId: this.campaignType, index: index$1, widgetElementId: this.id, widgetVersion: _package.version }));
|
|
1644
|
+
return (index.h("vviinn-product-card", { part: "product-part", productId: recommendation.productId, productTitle: recommendation.title, productType: recommendation.productType, deeplink: recommendation.deeplink, image: recommendation.image.thumbnail, brand: recommendation.brand, imageWidth: this.imageWidth, imageRatio: 1, price: recommendation.price.actual, salePrice: recommendation.price.sale, responsive: this.mode === "grid" || this.mode === "set", addToBasketShow: this.addToBasketShow, mode: this.mode, dimmedBackground: this.useDimmedBackgroundInCard(), campaignTypeId: this.campaignType, index: index$1, widgetElementId: this.id, widgetVersion: _package.version }));
|
|
1522
1645
|
}
|
|
1523
1646
|
useDimmedBackgroundInCard() {
|
|
1524
1647
|
return this.mode === "continuity" || !this.useCarousel;
|
|
@@ -1527,7 +1650,7 @@ const VviinnVprWidget = class {
|
|
|
1527
1650
|
return (index.h("div", { class: "recommendations-grid", part: "recommendations-grid" }, this.recommendations.map((r, i) => this.renderRecommendation(r, i))));
|
|
1528
1651
|
}
|
|
1529
1652
|
renderCarousel() {
|
|
1530
|
-
return (index.h("vviinn-carousel", { mode: this.mode, campaignTypeId: this.campaignType, imageWidth: this.imageWidth, showScroll: this.showScroll, recommendations: this.recommendations, widgetElementId: this.id, widgetVersion: _package.version, gridArrowsDynamic: this.gridArrowsDynamic, addToBasketShow: this.addToBasketShow }));
|
|
1653
|
+
return (index.h("vviinn-carousel", { mode: this.mode, campaignTypeId: this.campaignType, imageWidth: this.imageWidth, showScroll: this.showScroll, recommendations: this.recommendations, widgetElementId: this.id, widgetVersion: _package.version, gridArrowsDynamic: this.gridArrowsDynamic, addToBasketShow: this.addToBasketShow, updatingAllCards: this.updatingAllCards, updateButtonLocation: this.updateButtonLocation }));
|
|
1531
1654
|
}
|
|
1532
1655
|
get el() { return index.getElement(this); }
|
|
1533
1656
|
static get watchers() { return {
|
|
@@ -1543,4 +1666,5 @@ VviinnVprWidget.style = vviinnVprWidgetCss;
|
|
|
1543
1666
|
|
|
1544
1667
|
exports.vviinn_carousel = VviinnCarousel;
|
|
1545
1668
|
exports.vviinn_product_card = VviinnProductCard;
|
|
1669
|
+
exports.vviinn_skeleton = VviinnSkeleton;
|
|
1546
1670
|
exports.vviinn_vpr_widget = VviinnVprWidget;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const index$1 = require('./index-
|
|
6
|
+
const index$1 = require('./index-0547e502.js');
|
|
7
7
|
|
|
8
8
|
const recommendationsSidebarCss = ":host{--vviinn-carousel-columns:4;box-sizing:border-box;display:block;display:flex;height:100vh;left:0;position:fixed;top:0;transition:background 0.1s ease-in-out;width:100vw}:host(.open){background:rgba(0, 0, 0, 0.2)}:host(.bottom){flex-direction:column;justify-content:end}:host(.right){flex-direction:row;justify-content:flex-end}:host [slot]{visibility:hidden;position:absolute}header{position:relative;text-align:center;padding:32px}header.contains-source-img{display:grid;justify-items:center;grid-gap:12px}img.source-image{width:64px;height:64px;border-radius:50%;box-shadow:0px 2px 4px rgba(0, 0, 0, 0.15);padding:8px}:host(.right) header{box-shadow:0px 2px 6px rgba(0, 0, 0, 0.1)}main{padding:0 24px;min-height:100px}:host(.right) main{overflow:auto}.sidebar{background:white;box-sizing:border-box;display:flex;flex-direction:column;max-height:100vh;overflow-y:auto}:host(.bottom.idle) .sidebar,:host(.bottom.closed) .sidebar{transform:translateY(100%)}:host(.bottom.closed) .sidebar{animation-name:slideOutFromBottom;animation-duration:0.5s;animation-fill-mode:forwards}:host(.bottom.open) .sidebar{animation-name:slideInFromBottom;animation-duration:0.5s;animation-fill-mode:forwards}:host(.right.idle) .sidebar{transform:translateX(100%)}:host(.right.closed) .sidebar{animation-name:slideOutFromRight;animation-duration:0.5s;animation-fill-mode:forwards}:host(.right.open) .sidebar{animation-name:slideInFromRight;animation-duration:0.5s;animation-fill-mode:forwards}:host(.right) .sidebar{max-width:480px}:host(.right) vviinn-vpr-widget::part(recommendations-grid){display:grid;grid-template-columns:repeat(2, 1fr);grid-gap:24px}:host(.right) vviinn-vpr-widget{overflow:auto}:host(.right) vviinn-vpr-widget::part(image){border:none}.title{font-style:normal;font-weight:500;font-size:28px;line-height:40px;text-align:center;color:#000000}vviinn-vpr-widget::part(title),vviinn-vpr-widget::part(brand),vviinn-vpr-widget::part(type){text-align:left}vviinn-vpr-widget::part(price-container){align-self:start}.close-sidebar{background:transparent;border:none;cursor:pointer;margin:0;padding:0;position:absolute;right:24px;top:24px}@keyframes slideInFromBottom{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slideOutFromBottom{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes slideInFromRight{from{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes slideOutFromRight{from{transform:translateX(0)}to{transform:translateX(100%)}}@media (max-width: 768px){:host{--vviinn-carousel-columns:2}}";
|
|
9
9
|
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const _package = require('./package-
|
|
7
|
-
const index$1 = require('./index-
|
|
6
|
+
const _package = require('./package-bec51a19.js');
|
|
7
|
+
const index$1 = require('./index-0547e502.js');
|
|
8
8
|
|
|
9
9
|
const vviinnVprButtonCss = ":host{display:block}";
|
|
10
10
|
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const _package = require('./package-
|
|
7
|
-
const index$1 = require('./index-
|
|
6
|
+
const _package = require('./package-bec51a19.js');
|
|
7
|
+
const index$1 = require('./index-0547e502.js');
|
|
8
8
|
const customizedSlots = require('./customized-slots-0a8d663c.js');
|
|
9
9
|
|
|
10
10
|
const vviinnVpsButtonCss = ":host{display:block}";
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
6
|
const imageSearch_store = require('./imageSearch.store-dc4e98b3.js');
|
|
7
7
|
const i18next = require('./i18next-74ff3413.js');
|
|
8
|
-
const _package = require('./package-
|
|
8
|
+
const _package = require('./package-bec51a19.js');
|
|
9
9
|
const customizedSlots = require('./customized-slots-0a8d663c.js');
|
|
10
10
|
const index$1 = require('./index-7ff2ab5f.js');
|
|
11
11
|
|
|
@@ -20,7 +20,7 @@ const patchBrowser = () => {
|
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
patchBrowser().then(options => {
|
|
23
|
-
return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["vviinn-
|
|
23
|
+
return index.bootstrapLazy([["vviinn-button.cjs",[[1,"vviinn-button",{"addStyle":[4,"add-style"]}]]],["vviinn-error.cjs",[[1,"vviinn-error"]]],["vviinn-preloader.cjs",[[1,"vviinn-preloader"]]],["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":[16],"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]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[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"],"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"],"imageLoaded":[32],"isTransitioning":[32]},[[0,"vviinnCrossSellingClick","crossSellingClickListener"]]],[1,"vviinn-skeleton",{"height":[2],"halfWidth":[4,"half-width"]}]]],["search-filters_20.cjs",[[1,"vviinn-onboarding"],[1,"vviinn-example-images",{"basicEventData":[16],"exampleImagesTitle":[1,"example-images-title"]}],[1,"vviinn-image-view",{"basicEventData":[16],"cropper":[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"]}],[1,"vviinn-empty-results"],[1,"vviinn-image-selector",{"basicEventData":[16],"startUpload":[4,"start-upload"],"resetVpsButton":[16]}],[1,"vviinn-server-error",{"handler":[16]}],[1,"vviinn-wrong-format",{"handler":[16]}],[1,"search-filters",{"filter":[16],"basicEventData":[16],"selectedFilter":[32],"hideFilters":[32]}],[1,"vviinn-privacy-badge",{"privacyBadgeText":[1,"privacy-badge-text"]}],[1,"vviinn-teaser"],[1,"vviinn-example-image",{"src":[1],"width":[2],"height":[2],"basicEventData":[16],"selected":[32]}],[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"],"slider":[32]}],[1,"vviinn-onboarding-card-1",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-2",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-onboarding-card-3",{"cardTitle":[1,"card-title"],"cardText":[1,"card-text"]}],[1,"vviinn-overlay"],[1,"vviinn-slide"],[1,"vviinn-slider",{"showBullets":[4,"show-bullets"],"position":[514],"showArrows":[4,"show-arrows"],"elementsCount":[32],"internalPosition":[32],"swipeStartPosition":[32],"isRTL":[32]}]]],["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"],"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]},[[0,"vviinnProductLoad","trackProductLoad"],[0,"vviinnProductView","trackProductView"],[0,"vviinnProductClick","trackProductClick"],[0,"vviinnAuxClick","trackAuxClick"],[0,"vviinnImageCrop","trachSearchAreaChanges"],[0,"vviinnSelectObject","trackDetectedObject"],[0,"vviinnSelectFilter","trackFilter"],[0,"secondaryActionClicked","trackSecondaryAction"]]]]],["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"],"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);
|
|
24
24
|
});
|
|
25
25
|
|
|
26
26
|
exports.setNonce = index.setNonce;
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
"entries": [
|
|
3
3
|
"./components/image-search/search-filters/search-filters.js",
|
|
4
4
|
"./components/vviinn-button/vviinn-button.js",
|
|
5
|
+
"./components/vviinn-vpr-widget/vviinn-vpr-vidget.js",
|
|
5
6
|
"./components/vviinn-carousel/vviinn-carousel.js",
|
|
6
7
|
"./components/vviinn-error/vviinn-error.js",
|
|
7
8
|
"./components/vviinn-error/vviinn-empty-results/vviinn-empty-results.js",
|
|
@@ -22,12 +23,12 @@
|
|
|
22
23
|
"./components/vviinn-preloader/vviinn-preloader.js",
|
|
23
24
|
"./components/vviinn-privacy-badge/vviinn-privacy-badge.js",
|
|
24
25
|
"./components/vviinn-product-card/vviinn-product-card.js",
|
|
26
|
+
"./components/vviinn-skeleton/vviinn-skeleton.js",
|
|
25
27
|
"./components/vviinn-slider/vviinn-slider.js",
|
|
26
28
|
"./components/vviinn-slider/vviinn-slide/vviinn-slide.js",
|
|
27
29
|
"./components/vviinn-teaser/vviinn-teaser.js",
|
|
28
30
|
"./components/vviinn-vpr-button/vviinn-vpr-button.js",
|
|
29
31
|
"./components/vviinn-vpr-button/recommendations-sidebar/recommendations-sidebar.js",
|
|
30
|
-
"./components/vviinn-vpr-widget/vviinn-vpr-vidget.js",
|
|
31
32
|
"./components/vviinn-vps-button/vviinn-vps-button.js",
|
|
32
33
|
"./components/vviinn-vps-widget/vviinn-vps-widget.js"
|
|
33
34
|
],
|