vviinn-widgets 2.48.5 → 2.48.6
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/{package-d6dae17b.js → package-cbc9da18.js} +1 -1
- package/dist/cjs/vviinn-carousel_4.cjs.entry.js +8 -5
- package/dist/cjs/vviinn-vpr-button.cjs.entry.js +1 -1
- package/dist/cjs/vviinn-vps-button.cjs.entry.js +1 -1
- package/dist/cjs/vviinn-vps-widget.cjs.entry.js +1 -1
- package/dist/collection/components/vviinn-carousel/vviinn-carousel.css +1 -2
- package/dist/collection/components/vviinn-carousel/vviinn-carousel.js +3 -1
- package/dist/collection/components/vviinn-product-card/render-helpers.js +1 -1
- package/dist/collection/components/vviinn-product-card/vviinn-product-card.css +14 -3
- package/dist/esm/{index-ff13425d.js → index-76fe67d1.js} +1 -1
- package/dist/esm/{package-3c563a3a.js → package-2410255a.js} +1 -1
- package/dist/esm/search-filters_17.entry.js +1 -1
- package/dist/esm/{search.store-eaa5f165.js → search.store-44630818.js} +1 -1
- package/dist/esm/vviinn-carousel_4.entry.js +10 -7
- package/dist/esm/vviinn-preloader.entry.js +1 -1
- package/dist/esm/vviinn-vpr-button.entry.js +1 -1
- package/dist/esm/vviinn-vps-button.entry.js +1 -1
- package/dist/esm/vviinn-vps-widget.entry.js +3 -3
- package/dist/vviinn-widgets/p-122d8b8f.js +1 -0
- package/dist/vviinn-widgets/p-19798768.entry.js +1 -0
- package/{www/build/p-150f1108.js → dist/vviinn-widgets/p-1c1be428.js} +1 -1
- package/dist/vviinn-widgets/{p-ad25945b.entry.js → p-2f380e06.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-08ef6197.entry.js → p-3aef433a.entry.js} +2 -2
- package/dist/vviinn-widgets/{p-c99391f1.entry.js → p-709108d4.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-8589dbde.entry.js → p-8ef5d157.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-dc4d6669.entry.js → p-ada281af.entry.js} +1 -1
- package/dist/vviinn-widgets/{p-ec4782a6.js → p-dbcc6488.js} +1 -1
- package/dist/vviinn-widgets/vviinn-widgets.esm.js +1 -1
- package/package.json +1 -1
- package/www/build/p-122d8b8f.js +1 -0
- package/www/build/p-19798768.entry.js +1 -0
- package/{dist/vviinn-widgets/p-150f1108.js → www/build/p-1c1be428.js} +1 -1
- package/www/build/{p-ad25945b.entry.js → p-2f380e06.entry.js} +1 -1
- package/www/build/{p-08ef6197.entry.js → p-3aef433a.entry.js} +2 -2
- package/www/build/{p-c99391f1.entry.js → p-709108d4.entry.js} +1 -1
- package/www/build/{p-8589dbde.entry.js → p-8ef5d157.entry.js} +1 -1
- package/www/build/{p-dc4d6669.entry.js → p-ada281af.entry.js} +1 -1
- package/www/build/{p-ec4782a6.js → p-dbcc6488.js} +1 -1
- package/www/build/vviinn-widgets.esm.js +1 -1
- package/dist/vviinn-widgets/p-554d2c34.entry.js +0 -1
- package/dist/vviinn-widgets/p-909e2781.js +0 -1
- package/www/build/p-554d2c34.entry.js +0 -1
- package/www/build/p-909e2781.js +0 -1
|
@@ -7,7 +7,7 @@ const search_store = require('./search.store-7605f369.js');
|
|
|
7
7
|
const i18next = require('./i18next-74ff3413.js');
|
|
8
8
|
const PlusIcon = require('./PlusIcon-5e585127.js');
|
|
9
9
|
const customizedSlots = require('./customized-slots-67b24737.js');
|
|
10
|
-
const _package = require('./package-
|
|
10
|
+
const _package = require('./package-cbc9da18.js');
|
|
11
11
|
const index$1 = require('./index-4445cb70.js');
|
|
12
12
|
|
|
13
13
|
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) => {
|
|
|
43
43
|
return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
44
44
|
};
|
|
45
45
|
|
|
46
|
-
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{
|
|
46
|
+
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}";
|
|
47
47
|
|
|
48
48
|
const VviinnCarousel = class {
|
|
49
49
|
constructor(hostRef) {
|
|
@@ -185,7 +185,8 @@ const VviinnCarousel = class {
|
|
|
185
185
|
calculateMoveStep() {
|
|
186
186
|
const contentWidths = this.getContent().map((el) => el.getBoundingClientRect().width);
|
|
187
187
|
const sum = contentWidths.reduce((acc, val) => acc + val, 0);
|
|
188
|
-
|
|
188
|
+
const contentGap = search_store._function.pipe(window.getComputedStyle(this.getContentNode()), (computedStyle) => computedStyle.getPropertyValue("gap"), (contentGapString) => parseInt(contentGapString.split("px")[0]), (contentGap) => (isNaN(contentGap) ? 0 : contentGap));
|
|
189
|
+
return sum / contentWidths.length + contentGap;
|
|
189
190
|
}
|
|
190
191
|
getHostParent() {
|
|
191
192
|
const parent = this.el.parentNode;
|
|
@@ -509,7 +510,9 @@ const FormattedPrice = (props) => {
|
|
|
509
510
|
minimumFractionDigits: 2,
|
|
510
511
|
}).format(props.price);
|
|
511
512
|
const prefixElement = props.prefix ? (index.h("span", { part: "price-prefix" }, props.prefix + " ")) : null;
|
|
512
|
-
const currencyElement = props.currency ? (index.h("span", { part: "currency" },
|
|
513
|
+
const currencyElement = props.currency ? (index.h("span", { part: "currency" },
|
|
514
|
+
"\u00A0",
|
|
515
|
+
props.currency)) : null;
|
|
513
516
|
return (index.h("span", { class: "price-amount", part: `price-amount${priceType ? "-" + priceType : ""}` },
|
|
514
517
|
prefixElement,
|
|
515
518
|
formattedPrice,
|
|
@@ -530,7 +533,7 @@ const Image = (props, onLoadEnd = () => undefined) => (index.h("picture", null,
|
|
|
530
533
|
const ResponsiveImage = (props, onLoadEnd = () => undefined) => (index.h("picture", null,
|
|
531
534
|
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 })));
|
|
532
535
|
|
|
533
|
-
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%;--min-image-size-set-mode:155px}.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}.image.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;padding:6px;width:32px;height:32px;z-index:1;background-color:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button svg{width:20px;height:20px}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background-color:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button{
|
|
536
|
+
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%;--min-image-size-set-mode:155px}.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}.image.responsive{width:100%;height:auto;aspect-ratio:1}.brand,.type{display:none}.title{-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:anywhere;text-overflow:ellipsis;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;padding:6px;width:32px;height:32px;z-index:1;background-color:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button svg{width:20px;height:20px}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background-color:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button{font-size:16px;padding:10px 12px;box-sizing:border-box;border:none;cursor:pointer}.basket-button.basket-button-grid{width:100%;background-color:unset;border:1px solid #dddddd}.basket-button.basket-button-continuity{align-self:start;background-color:#f7f7f7}.basket-button-continuity:hover{background-color:#eaeaea}.basket-button-grid:hover{background-color:#f7f7f7}:host(.dimmed) picture::after{content:\"\";width:100%;height:100%;box-sizing:border-box;background-color:#f7f7f7;display:block;top:0;left:0;position:absolute;mix-blend-mode:multiply}:host(.animated) picture::after{mix-blend-mode:normal}:host(.animated) picture::before{opacity:1;animation:pulse 1.8s infinite}:host(.animated) picture::after{content: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\");background-color:transparent;position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px)}:host(.animated) .update-button{display:none}:host(.set-mode){line-height:20px;align-items:flex-start;height:auto}:host(.set-mode) .basket-button{display:flex;gap:8px;align-items:center;box-sizing:border-box;justify-content:center;border:none;background-color:#f4f4f4;font-weight:500;color:#525252}:host(.set-mode:not(.animated)) .basket-button{margin-top:auto}:host(.set-mode) .basket-button:hover{background-color:rgb(234, 234, 234)}:host(.set-mode) .title{font-weight:400}:host(.set-mode) .image{width:var(--vviinn-set-mode-image-width, 100%);height:auto;border:none;aspect-ratio:1;min-width:var(--min-image-size-set-mode);min-height:var(--min-image-size-set-mode)}:host(.set-mode.product-card--source){height:-moz-fit-content;height:fit-content;flex-grow:1}:host(.set-mode.product-card--source) .image{aspect-ratio:1;width:100%;height:100%}:host(.set-mode) picture .plus-icon{background-color:white;position:absolute;z-index:1;padding:16px;top:calc(50% - 32px);color:#a8a8a8;right:-88px;outline:1px solid #f4f4f4;border-radius:50%;width:32px;height:32px}@media (max-width: 768px){:host(.set-mode) picture .plus-icon{padding:8px;top:calc(50% - 24px);right:-24px}}:host(.set-mode) .basket-button.applied-discount{background:transparent;border:1px solid #e0e0e0}:host(.set-mode) .price-container{flex-direction:row;flex-wrap:wrap}:host(.set-mode) .price-amount{margin-right:12px}@media (max-width: 1080px){:host(.set-mode) .price-amount{margin-right:8px}}@keyframes pulse{0%{background-color:rgb(244, 244, 244)}50%{background-color:rgb(232, 232, 232)}100%{background-color:rgba(244, 244, 244)}}.discount-label{position:absolute;left:0;top:13px;line-height:20px;padding:2px 4px;border-radius:0px 4px 4px 0px;color:white;background-color:#ff3944;letter-spacing:0.5px}";
|
|
534
537
|
|
|
535
538
|
const VviinnProductCard = class {
|
|
536
539
|
constructor(hostRef) {
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const _package = require('./package-
|
|
6
|
+
const _package = require('./package-cbc9da18.js');
|
|
7
7
|
const VisualSearchIcon = require('./VisualSearchIcon-1180d079.js');
|
|
8
8
|
|
|
9
9
|
const vviinnVprButtonCss = ":host{display:block}";
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
|
-
const _package = require('./package-
|
|
6
|
+
const _package = require('./package-cbc9da18.js');
|
|
7
7
|
const customizedSlots = require('./customized-slots-67b24737.js');
|
|
8
8
|
const constants = require('./constants-7684cbfc.js');
|
|
9
9
|
|
|
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
const index = require('./index-5619b5ec.js');
|
|
6
6
|
const search_store = require('./search.store-7605f369.js');
|
|
7
7
|
const i18next = require('./i18next-74ff3413.js');
|
|
8
|
-
const _package = require('./package-
|
|
8
|
+
const _package = require('./package-cbc9da18.js');
|
|
9
9
|
const customizedSlots = require('./customized-slots-67b24737.js');
|
|
10
10
|
const index$1 = require('./index-4445cb70.js');
|
|
11
11
|
const constants = require('./constants-7684cbfc.js');
|
|
@@ -11,7 +11,6 @@
|
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
.bullets {
|
|
14
|
-
margin-top: 16px;
|
|
15
14
|
display: flex;
|
|
16
15
|
flex-direction: row;
|
|
17
16
|
grid-gap: 24px;
|
|
@@ -43,7 +42,7 @@
|
|
|
43
42
|
.content {
|
|
44
43
|
display: flex;
|
|
45
44
|
flex-direction: row;
|
|
46
|
-
|
|
45
|
+
gap: 8px;
|
|
47
46
|
overflow-y: hidden;
|
|
48
47
|
overflow-x: auto;
|
|
49
48
|
flex-grow: 1;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { Host, h, } from "@stencil/core";
|
|
2
2
|
import { chunksOf } from "fp-ts/lib/Array";
|
|
3
|
+
import { pipe } from "fp-ts/lib/function";
|
|
3
4
|
import { ChevronIcon } from "../vviinn-icons";
|
|
4
5
|
import { CAROUSEL_IMAGE_WIDTH_CSS_VAR, CAROUSEL_WIDTH_CSS_VAR, COLUMNS_NUMBER_CSS_VAR, CONTENT_GROUP_CSS_CLASS, SET_MODE_DISCOUNT_STEP, SET_MODE_IMAGE_WIDTH, SET_MODE_INITIAL_DISCOUNT, SET_MODE_MAX_DISCOUNT, } from "./constants";
|
|
5
6
|
import { calculateDiscount } from "../../utils/number";
|
|
@@ -145,7 +146,8 @@ export class VviinnCarousel {
|
|
|
145
146
|
calculateMoveStep() {
|
|
146
147
|
const contentWidths = this.getContent().map((el) => el.getBoundingClientRect().width);
|
|
147
148
|
const sum = contentWidths.reduce((acc, val) => acc + val, 0);
|
|
148
|
-
|
|
149
|
+
const contentGap = pipe(window.getComputedStyle(this.getContentNode()), (computedStyle) => computedStyle.getPropertyValue("gap"), (contentGapString) => parseInt(contentGapString.split("px")[0]), (contentGap) => (isNaN(contentGap) ? 0 : contentGap));
|
|
150
|
+
return sum / contentWidths.length + contentGap;
|
|
149
151
|
}
|
|
150
152
|
getHostParent() {
|
|
151
153
|
const parent = this.el.parentNode;
|
|
@@ -17,7 +17,7 @@ const FormattedPrice = (props) => {
|
|
|
17
17
|
minimumFractionDigits: 2,
|
|
18
18
|
}).format(props.price);
|
|
19
19
|
const prefixElement = props.prefix ? (h("span", { part: "price-prefix" }, props.prefix + " ")) : null;
|
|
20
|
-
const currencyElement = props.currency ? (h("span", { part: "currency" }, "
|
|
20
|
+
const currencyElement = props.currency ? (h("span", { part: "currency" }, "\u00A0", props.currency)) : null;
|
|
21
21
|
return (h("span", { class: "price-amount", part: `price-amount${priceType ? "-" + priceType : ""}` }, prefixElement, formattedPrice, currencyElement));
|
|
22
22
|
};
|
|
23
23
|
export const Price = (props) => {
|
|
@@ -61,6 +61,8 @@
|
|
|
61
61
|
.title {
|
|
62
62
|
-webkit-box-orient: vertical;
|
|
63
63
|
-webkit-line-clamp: 2;
|
|
64
|
+
overflow-wrap: anywhere;
|
|
65
|
+
text-overflow: ellipsis;
|
|
64
66
|
color: #161616;
|
|
65
67
|
display: -webkit-box;
|
|
66
68
|
font-size: 16px;
|
|
@@ -135,7 +137,6 @@ picture::before {
|
|
|
135
137
|
}
|
|
136
138
|
|
|
137
139
|
.basket-button {
|
|
138
|
-
height: 44px;
|
|
139
140
|
font-size: 16px;
|
|
140
141
|
padding: 10px 12px;
|
|
141
142
|
box-sizing: border-box;
|
|
@@ -145,7 +146,7 @@ picture::before {
|
|
|
145
146
|
|
|
146
147
|
.basket-button.basket-button-grid {
|
|
147
148
|
width: 100%;
|
|
148
|
-
background-color:
|
|
149
|
+
background-color: unset;
|
|
149
150
|
border: 1px solid #dddddd;
|
|
150
151
|
}
|
|
151
152
|
|
|
@@ -278,7 +279,17 @@ picture::before {
|
|
|
278
279
|
|
|
279
280
|
:host(.set-mode) .price-container {
|
|
280
281
|
flex-direction: row;
|
|
281
|
-
|
|
282
|
+
flex-wrap: wrap;
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
:host(.set-mode) .price-amount {
|
|
286
|
+
margin-right: 12px;
|
|
287
|
+
}
|
|
288
|
+
|
|
289
|
+
@media (max-width: 1080px) {
|
|
290
|
+
:host(.set-mode) .price-amount {
|
|
291
|
+
margin-right: 8px;
|
|
292
|
+
}
|
|
282
293
|
}
|
|
283
294
|
|
|
284
295
|
@keyframes pulse {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as commonjsGlobal, o as createCommonjsModule } from './search.store-
|
|
1
|
+
import { n as commonjsGlobal, o as createCommonjsModule } from './search.store-44630818.js';
|
|
2
2
|
|
|
3
3
|
// Unique ID creation requires a high quality random # generator. In the browser we therefore
|
|
4
4
|
// require the crypto API and do not support built-in fallback to lower quality random number
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-1f3eaf12.js';
|
|
2
|
-
import { s as searchState,
|
|
2
|
+
import { s as searchState, _ as _function, O as Option, q as fromAlt, r as foldValueObject, u as scaleWithSized, v as center, w as makeRectangularSearchRequest, x as detectedObjectEq, y as toFile, z as processSelectedFile, E as Either, B as match, o as createCommonjsModule, n as commonjsGlobal, C as sequenceToOption, D as fromImage, F as dimensionsFromImage, G as scaleByLargestSide, N as NonEmptyArray, H as processSelectedText } from './search.store-44630818.js';
|
|
3
3
|
import { i as instance } from './i18next-387f2b0a.js';
|
|
4
4
|
import { P as PlusIcon } from './PlusIcon-af795e23.js';
|
|
5
5
|
import { s as slotChangeListener, c as campaignTypeNames } from './customized-slots-e56251a2.js';
|
|
@@ -17388,4 +17388,4 @@ const processSelectedFile = async (file) => {
|
|
|
17388
17388
|
return session;
|
|
17389
17389
|
};
|
|
17390
17390
|
|
|
17391
|
-
export { Apply as A, match$1 as B, sequenceToOption as C, fromImage as D, Either as E, dimensionsFromImage as F, scaleByLargestSide as G, processSelectedText as H, NonEmptyArray as N, Option as O, Semigroup$1 as S, TaskEither as T,
|
|
17391
|
+
export { Apply as A, match$1 as B, sequenceToOption as C, fromImage as D, Either as E, dimensionsFromImage as F, scaleByLargestSide as G, processSelectedText as H, NonEmptyArray as N, Option as O, Semigroup$1 as S, TaskEither as T, _function as _, _Array as a, state$1 as b, chainW as c, createInitGetRequest as d, map$3 as e, fromEither as f, getApiPath as g, has as h, match as i, arrayToQueryString as j, parseExcluded as k, checkEmpryString as l, makeRequest as m, commonjsGlobal as n, createCommonjsModule as o, pipe as p, fromAlt as q, foldValueObject as r, searchState as s, tuple as t, scaleWithSized as u, center as v, makeRectangularSearchRequest as w, detectedObjectEq as x, toFile as y, processSelectedFile as z };
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { h, r as registerInstance, H as Host, g as getElement, c as createEvent, F as Fragment } from './index-1f3eaf12.js';
|
|
2
|
-
import { _ as _Array, O as Option, S as Semigroup,
|
|
2
|
+
import { _ as _function, a as _Array, O as Option, S as Semigroup, h as has, t as tuple, E as Either, s as searchState, b as state, p as pipe, c as chainW, m as makeRequest, f as fromEither, g as getApiPath, d as createInitGetRequest, A as Apply, e as map, i as match, j as arrayToQueryString, k as parseExcluded, T as TaskEither, l as checkEmpryString } from './search.store-44630818.js';
|
|
3
3
|
import { i as instance } from './i18next-387f2b0a.js';
|
|
4
4
|
import { P as PlusIcon } from './PlusIcon-af795e23.js';
|
|
5
5
|
import { s as slotChangeListener, c as campaignTypeNames, f as fromString, a as fold, S as SlotSkeleton } from './customized-slots-e56251a2.js';
|
|
6
|
-
import { v as version } from './package-
|
|
7
|
-
import { v as v4, c as createTrackingApi, a as createAddToBasketVpcEvent, b as createAddToBasketVprEvent, d as createWidgetVpcEvent, e as createWidgetVprEvent, f as createResultVpcEventByType, g as createResultVprEventByType, h as createProductVpcEventByType, i as createProductVprEventByType } from './index-
|
|
6
|
+
import { v as version } from './package-2410255a.js';
|
|
7
|
+
import { v as v4, c as createTrackingApi, a as createAddToBasketVpcEvent, b as createAddToBasketVprEvent, d as createWidgetVpcEvent, e as createWidgetVprEvent, f as createResultVpcEventByType, g as createResultVprEventByType, h as createProductVpcEventByType, i as createProductVprEventByType } from './index-76fe67d1.js';
|
|
8
8
|
|
|
9
9
|
const BasketIcon = () => (h("svg", { width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
10
10
|
h("path", { d: "M7.5 22C6.95 22 6.47917 21.8042 6.0875 21.4125C5.69583 21.0208 5.5 20.55 5.5 20C5.5 19.45 5.69583 18.9792 6.0875 18.5875C6.47917 18.1958 6.95 18 7.5 18C8.05 18 8.52083 18.1958 8.9125 18.5875C9.30417 18.9792 9.5 19.45 9.5 20C9.5 20.55 9.30417 21.0208 8.9125 21.4125C8.52083 21.8042 8.05 22 7.5 22ZM17.5 22C16.95 22 16.4792 21.8042 16.0875 21.4125C15.6958 21.0208 15.5 20.55 15.5 20C15.5 19.45 15.6958 18.9792 16.0875 18.5875C16.4792 18.1958 16.95 18 17.5 18C18.05 18 18.5208 18.1958 18.9125 18.5875C19.3042 18.9792 19.5 19.45 19.5 20C19.5 20.55 19.3042 21.0208 18.9125 21.4125C18.5208 21.8042 18.05 22 17.5 22ZM6.65 6L9.05 11H16.05L18.8 6H6.65ZM5.7 4H20.45C20.8333 4 21.125 4.17083 21.325 4.5125C21.525 4.85417 21.5333 5.2 21.35 5.55L17.8 11.95C17.6167 12.2833 17.3708 12.5417 17.0625 12.725C16.7542 12.9083 16.4167 13 16.05 13H8.6L7.5 15H18.5C18.7833 15 19.0208 15.0958 19.2125 15.2875C19.4042 15.4792 19.5 15.7167 19.5 16C19.5 16.2833 19.4042 16.5208 19.2125 16.7125C19.0208 16.9042 18.7833 17 18.5 17H7.5C6.75 17 6.18333 16.6708 5.8 16.0125C5.41667 15.3542 5.4 14.7 5.75 14.05L7.1 11.6L3.5 4H2.5C2.21667 4 1.97917 3.90417 1.7875 3.7125C1.59583 3.52083 1.5 3.28333 1.5 3C1.5 2.71667 1.59583 2.47917 1.7875 2.2875C1.97917 2.09583 2.21667 2 2.5 2H4.125C4.30833 2 4.48333 2.05 4.65 2.15C4.81667 2.25 4.94167 2.39167 5.025 2.575L5.7 4Z", fill: "#525252" })));
|
|
@@ -39,7 +39,7 @@ const generateRandomNumber = (min, max) => {
|
|
|
39
39
|
return Math.floor(Math.random() * (max - min + 1)) + min;
|
|
40
40
|
};
|
|
41
41
|
|
|
42
|
-
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{
|
|
42
|
+
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}";
|
|
43
43
|
|
|
44
44
|
const VviinnCarousel = class {
|
|
45
45
|
constructor(hostRef) {
|
|
@@ -181,7 +181,8 @@ const VviinnCarousel = class {
|
|
|
181
181
|
calculateMoveStep() {
|
|
182
182
|
const contentWidths = this.getContent().map((el) => el.getBoundingClientRect().width);
|
|
183
183
|
const sum = contentWidths.reduce((acc, val) => acc + val, 0);
|
|
184
|
-
|
|
184
|
+
const contentGap = _function.pipe(window.getComputedStyle(this.getContentNode()), (computedStyle) => computedStyle.getPropertyValue("gap"), (contentGapString) => parseInt(contentGapString.split("px")[0]), (contentGap) => (isNaN(contentGap) ? 0 : contentGap));
|
|
185
|
+
return sum / contentWidths.length + contentGap;
|
|
185
186
|
}
|
|
186
187
|
getHostParent() {
|
|
187
188
|
const parent = this.el.parentNode;
|
|
@@ -505,7 +506,9 @@ const FormattedPrice = (props) => {
|
|
|
505
506
|
minimumFractionDigits: 2,
|
|
506
507
|
}).format(props.price);
|
|
507
508
|
const prefixElement = props.prefix ? (h("span", { part: "price-prefix" }, props.prefix + " ")) : null;
|
|
508
|
-
const currencyElement = props.currency ? (h("span", { part: "currency" },
|
|
509
|
+
const currencyElement = props.currency ? (h("span", { part: "currency" },
|
|
510
|
+
"\u00A0",
|
|
511
|
+
props.currency)) : null;
|
|
509
512
|
return (h("span", { class: "price-amount", part: `price-amount${priceType ? "-" + priceType : ""}` },
|
|
510
513
|
prefixElement,
|
|
511
514
|
formattedPrice,
|
|
@@ -526,7 +529,7 @@ const Image = (props, onLoadEnd = () => undefined) => (h("picture", null,
|
|
|
526
529
|
const ResponsiveImage = (props, onLoadEnd = () => undefined) => (h("picture", null,
|
|
527
530
|
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 })));
|
|
528
531
|
|
|
529
|
-
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%;--min-image-size-set-mode:155px}.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}.image.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;padding:6px;width:32px;height:32px;z-index:1;background-color:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button svg{width:20px;height:20px}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background-color:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button{
|
|
532
|
+
const vviinnProductCardCss = ":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%;--min-image-size-set-mode:155px}.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}.image.responsive{width:100%;height:auto;aspect-ratio:1}.brand,.type{display:none}.title{-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:anywhere;text-overflow:ellipsis;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;padding:6px;width:32px;height:32px;z-index:1;background-color:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button svg{width:20px;height:20px}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background-color:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button{font-size:16px;padding:10px 12px;box-sizing:border-box;border:none;cursor:pointer}.basket-button.basket-button-grid{width:100%;background-color:unset;border:1px solid #dddddd}.basket-button.basket-button-continuity{align-self:start;background-color:#f7f7f7}.basket-button-continuity:hover{background-color:#eaeaea}.basket-button-grid:hover{background-color:#f7f7f7}:host(.dimmed) picture::after{content:\"\";width:100%;height:100%;box-sizing:border-box;background-color:#f7f7f7;display:block;top:0;left:0;position:absolute;mix-blend-mode:multiply}:host(.animated) picture::after{mix-blend-mode:normal}:host(.animated) picture::before{opacity:1;animation:pulse 1.8s infinite}:host(.animated) picture::after{content: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\");background-color:transparent;position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px)}:host(.animated) .update-button{display:none}:host(.set-mode){line-height:20px;align-items:flex-start;height:auto}:host(.set-mode) .basket-button{display:flex;gap:8px;align-items:center;box-sizing:border-box;justify-content:center;border:none;background-color:#f4f4f4;font-weight:500;color:#525252}:host(.set-mode:not(.animated)) .basket-button{margin-top:auto}:host(.set-mode) .basket-button:hover{background-color:rgb(234, 234, 234)}:host(.set-mode) .title{font-weight:400}:host(.set-mode) .image{width:var(--vviinn-set-mode-image-width, 100%);height:auto;border:none;aspect-ratio:1;min-width:var(--min-image-size-set-mode);min-height:var(--min-image-size-set-mode)}:host(.set-mode.product-card--source){height:-moz-fit-content;height:fit-content;flex-grow:1}:host(.set-mode.product-card--source) .image{aspect-ratio:1;width:100%;height:100%}:host(.set-mode) picture .plus-icon{background-color:white;position:absolute;z-index:1;padding:16px;top:calc(50% - 32px);color:#a8a8a8;right:-88px;outline:1px solid #f4f4f4;border-radius:50%;width:32px;height:32px}@media (max-width: 768px){:host(.set-mode) picture .plus-icon{padding:8px;top:calc(50% - 24px);right:-24px}}:host(.set-mode) .basket-button.applied-discount{background:transparent;border:1px solid #e0e0e0}:host(.set-mode) .price-container{flex-direction:row;flex-wrap:wrap}:host(.set-mode) .price-amount{margin-right:12px}@media (max-width: 1080px){:host(.set-mode) .price-amount{margin-right:8px}}@keyframes pulse{0%{background-color:rgb(244, 244, 244)}50%{background-color:rgb(232, 232, 232)}100%{background-color:rgba(244, 244, 244)}}.discount-label{position:absolute;left:0;top:13px;line-height:20px;padding:2px 4px;border-radius:0px 4px 4px 0px;color:white;background-color:#ff3944;letter-spacing:0.5px}";
|
|
530
533
|
|
|
531
534
|
const VviinnProductCard = class {
|
|
532
535
|
constructor(hostRef) {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-1f3eaf12.js';
|
|
2
|
-
import { s as searchState } from './search.store-
|
|
2
|
+
import { s as searchState } from './search.store-44630818.js';
|
|
3
3
|
|
|
4
4
|
const vviinnPreloaderCss = ":host{--preloader-size:24px;--preloader-width:calc(var(--preloader-size) / 6);transform-origin:center;animation:rotate 3s linear infinite;border:var(--preloader-width) solid currentColor;border-radius:50%;border-top-color:transparent;display:none;outline:0;width:var(--preloader-size);height:var(--preloader-size);box-sizing:border-box}:host(.active){display:flex}@keyframes rotate{from{transform:rotate(-360deg)}to{transform:rotate(360deg)}}";
|
|
5
5
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-1f3eaf12.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-2410255a.js';
|
|
3
3
|
import { V as VisualSearchIcon } from './VisualSearchIcon-13f7da6a.js';
|
|
4
4
|
|
|
5
5
|
const vviinnVprButtonCss = ":host{display:block}";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-1f3eaf12.js';
|
|
2
|
-
import { v as version } from './package-
|
|
2
|
+
import { v as version } from './package-2410255a.js';
|
|
3
3
|
import { c as campaignTypeNames, S as SlotSkeleton } from './customized-slots-e56251a2.js';
|
|
4
4
|
import { D as DEFAULT_EXAMPLE_IMAGE } from './constants-8bf233a9.js';
|
|
5
5
|
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { h, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-1f3eaf12.js';
|
|
2
|
-
import { s as searchState, b as state, k as parseExcluded, O as Option } from './search.store-
|
|
2
|
+
import { s as searchState, b as state, k as parseExcluded, O as Option } from './search.store-44630818.js';
|
|
3
3
|
import { i as instance } from './i18next-387f2b0a.js';
|
|
4
|
-
import { v as version } from './package-
|
|
4
|
+
import { v as version } from './package-2410255a.js';
|
|
5
5
|
import { c as campaignTypeNames, s as slotChangeListener, S as SlotSkeleton } from './customized-slots-e56251a2.js';
|
|
6
|
-
import { j as createSearchEvent, k as createFilterEvent, v as v4, c as createTrackingApi, l as createWidgetVpsEvent, m as createProductVpsEventByType, n as createResultVpsEventByType } from './index-
|
|
6
|
+
import { j as createSearchEvent, k as createFilterEvent, v as v4, c as createTrackingApi, l as createWidgetVpsEvent, m as createProductVpsEventByType, n as createResultVpsEventByType } from './index-76fe67d1.js';
|
|
7
7
|
import { D as DEFAULT_EXAMPLE_IMAGE } from './constants-8bf233a9.js';
|
|
8
8
|
|
|
9
9
|
const CameraActionIcon = () => (h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" },
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const o="2.48.6";export{o as v}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{h as t,r as i,H as e,g as s,c as n,F as r}from"./p-1e83e6ba.js";import{_ as o,a,O as h,S as c,h as d,t as l,E as u,s as p,b as g,p as v,c as m,m as b,f,g as w,d as x,A as C,e as y,i as k,j as T,k as I,T as S,l as P}from"./p-1c1be428.js";import{i as R}from"./p-2e76a5c3.js";import{P as j}from"./p-ff8db3d2.js";import{s as A,c as _,f as E,a as V,S as B}from"./p-49417192.js";import{v as L}from"./p-122d8b8f.js";import{v as z,c as O,a as M,b as W,d as $,e as N,f as D,g as H,h as Z,i as F}from"./p-dbcc6488.js";const U=()=>t("svg",{width:"25",height:"24",viewBox:"0 0 25 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t("path",{d:"M7.5 22C6.95 22 6.47917 21.8042 6.0875 21.4125C5.69583 21.0208 5.5 20.55 5.5 20C5.5 19.45 5.69583 18.9792 6.0875 18.5875C6.47917 18.1958 6.95 18 7.5 18C8.05 18 8.52083 18.1958 8.9125 18.5875C9.30417 18.9792 9.5 19.45 9.5 20C9.5 20.55 9.30417 21.0208 8.9125 21.4125C8.52083 21.8042 8.05 22 7.5 22ZM17.5 22C16.95 22 16.4792 21.8042 16.0875 21.4125C15.6958 21.0208 15.5 20.55 15.5 20C15.5 19.45 15.6958 18.9792 16.0875 18.5875C16.4792 18.1958 16.95 18 17.5 18C18.05 18 18.5208 18.1958 18.9125 18.5875C19.3042 18.9792 19.5 19.45 19.5 20C19.5 20.55 19.3042 21.0208 18.9125 21.4125C18.5208 21.8042 18.05 22 17.5 22ZM6.65 6L9.05 11H16.05L18.8 6H6.65ZM5.7 4H20.45C20.8333 4 21.125 4.17083 21.325 4.5125C21.525 4.85417 21.5333 5.2 21.35 5.55L17.8 11.95C17.6167 12.2833 17.3708 12.5417 17.0625 12.725C16.7542 12.9083 16.4167 13 16.05 13H8.6L7.5 15H18.5C18.7833 15 19.0208 15.0958 19.2125 15.2875C19.4042 15.4792 19.5 15.7167 19.5 16C19.5 16.2833 19.4042 16.5208 19.2125 16.7125C19.0208 16.9042 18.7833 17 18.5 17H7.5C6.75 17 6.18333 16.6708 5.8 16.0125C5.41667 15.3542 5.4 14.7 5.75 14.05L7.1 11.6L3.5 4H2.5C2.21667 4 1.97917 3.90417 1.7875 3.7125C1.59583 3.52083 1.5 3.28333 1.5 3C1.5 2.71667 1.59583 2.47917 1.7875 2.2875C1.97917 2.09583 2.21667 2 2.5 2H4.125C4.30833 2 4.48333 2.05 4.65 2.15C4.81667 2.25 4.94167 2.39167 5.025 2.575L5.7 4Z",fill:"#525252"})),G=()=>t("svg",{width:"25",height:"24",viewBox:"0 0 25 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t("path",{d:"M11.1 13.8L8.95 11.65C8.76667 11.4667 8.53333 11.375 8.25 11.375C7.96667 11.375 7.73333 11.4667 7.55 11.65C7.36667 11.8333 7.275 12.0667 7.275 12.35C7.275 12.6333 7.36667 12.8667 7.55 13.05L10.4 15.9C10.6 16.1 10.8333 16.2 11.1 16.2C11.3667 16.2 11.6 16.1 11.8 15.9L17.45 10.25C17.6333 10.0667 17.725 9.83333 17.725 9.55C17.725 9.26667 17.6333 9.03333 17.45 8.85C17.2667 8.66667 17.0333 8.575 16.75 8.575C16.4667 8.575 16.2333 8.66667 16.05 8.85L11.1 13.8ZM12.5 22C11.1167 22 9.81667 21.7375 8.6 21.2125C7.38333 20.6875 6.325 19.975 5.425 19.075C4.525 18.175 3.8125 17.1167 3.2875 15.9C2.7625 14.6833 2.5 13.3833 2.5 12C2.5 10.6167 2.7625 9.31667 3.2875 8.1C3.8125 6.88333 4.525 5.825 5.425 4.925C6.325 4.025 7.38333 3.3125 8.6 2.7875C9.81667 2.2625 11.1167 2 12.5 2C13.8833 2 15.1833 2.2625 16.4 2.7875C17.6167 3.3125 18.675 4.025 19.575 4.925C20.475 5.825 21.1875 6.88333 21.7125 8.1C22.2375 9.31667 22.5 10.6167 22.5 12C22.5 13.3833 22.2375 14.6833 21.7125 15.9C21.1875 17.1167 20.475 18.175 19.575 19.075C18.675 19.975 17.6167 20.6875 16.4 21.2125C15.1833 21.7375 13.8833 22 12.5 22ZM12.5 20C14.7333 20 16.625 19.225 18.175 17.675C19.725 16.125 20.5 14.2333 20.5 12C20.5 9.76667 19.725 7.875 18.175 6.325C16.625 4.775 14.7333 4 12.5 4C10.2667 4 8.375 4.775 6.825 6.325C5.275 7.875 4.5 9.76667 4.5 12C4.5 14.2333 5.275 16.125 6.825 17.675C8.375 19.225 10.2667 20 12.5 20Z",fill:"#0FC373"})),q=()=>t("svg",{width:"9",height:"16",xmlns:"http://www.w3.org/2000/svg"},t("path",{d:"m9 8-7.895 8L0 14.88 6.79 8 0 1.12 1.105 0 9 8Z"})),K=()=>t("svg",{xmlns:"http://www.w3.org/2000/svg",width:"24",height:"24",viewBox:"0 0 24 24",fill:"none"},t("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"}),t("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"})),J="--vviinn-carousel-image-width",Q="items-group";Object.assign(Object.assign({},{concat:(t,i)=>t/i}),{empty:1});const X=class{constructor(t){i(this,t),this.columns=0,this.resizeObserver=new ResizeObserver((()=>this.handleResize())),this.defaultAnimationInterval=2e3,this.mutationObserver=new MutationObserver((()=>this.cloneSlottedContent())),this.handleWindowResize=()=>this.setImageWidthSetMode("100%"),this.isLastGroup=()=>this.activeContentGroup===this.getContentGroups().length-1&&this.isGridMode,this.isFirstGroup=()=>0===this.activeContentGroup&&this.isGridMode,this.updateCard=(t,i,e)=>{let s=this.crossSellingRecommendations.find((i=>i.productId===t));const n=this.crossSellingRecommendations.indexOf(s),r=this.recommendations.indexOf(s),o=this.crossSellingRecommendations;if(r+i<this.recommendations.length){o[n]=this.recommendations[r+i],this.crossSellingRecommendations=[...o];let s=this.el.querySelector(`[data-id="${t}"]`);const a=s.shadowRoot.querySelector(".update-button");null==a||a.classList.add("hidden");const h=s.getBoundingClientRect().width;this.setImageWidthSetMode(`${h}px`);const c=setTimeout((()=>{r+2*i<=this.recommendations.length-1&&(null==a||a.classList.remove("hidden")),clearTimeout(c)}),e)}},this.moveDirection="right",this.contentGroups=[],this.activeContentGroup=0,this.isRTL=!1,this.crossSellingRecommendations=[],this.setModeDiscount=5,this.setModeAppliedDiscounts={},this.mode="continuity",this.imageWidth=140,this.showScroll=!0,this.campaignTypeId=void 0,this.widgetElementId=void 0,this.gridArrowsDynamic=void 0,this.recommendations=[],this.widgetVersion=void 0,this.addToBasketShow=void 0,this.updatingAllCards=void 0,this.updateButtonLocation=void 0}componentWillLoad(){this.isRTL="rtl"===document.dir}connectedCallback(){this.setItemWidth(),this.isSetMode="set"===this.mode,this.isGridMode="grid"===this.mode,this.isContinuityMode="continuity"===this.mode;const t=this.getColumnsNumber();this.isSetMode&&(window.addEventListener("resize",this.handleWindowResize),this.sourceProduct=this.recommendations[0],this.recommendations=this.recommendations.slice(1)),this.isSetMode&&this.recommendations.length>=t&&(this.crossSellingRecommendations=this.recommendations.slice(0,t))}disconnectedCallback(){this.resizeObserver.disconnect(),window.removeEventListener("resize",this.handleWindowResize)}componentDidLoad(){this.setWidth(),this.processScrollbarWidth(),this.columns=this.getColumnsNumber();const t=this.el.querySelector(".content");this.mutationObserver.observe(t,{subtree:!0,childList:!0}),this.resizeObserver.observe(this.getHostParent())}updatingAllCardsWatcher(){if(!this.updatingAllCards)return;const t=this.getColumnsNumber();this.crossSellingRecommendations.forEach((i=>{this.updateCard(i.productId,t,this.defaultAnimationInterval)}))}crossSellingClickListener({detail:t}){const i=this.getColumnsNumber(),{animationInterval:e,productData:s}=t;this.updateCard(s.productId,i,e)}getItemWidthFromDocument(){return parseInt(getComputedStyle(document.body).getPropertyValue(J))}async trackAddToBasket({detail:t}){if(!this.isSetMode)return;const{productId:i}=t;this.setModeAppliedDiscounts.hasOwnProperty(i)||(this.setModeAppliedDiscounts=Object.assign(Object.assign({},this.setModeAppliedDiscounts),{[i]:this.setModeDiscount}),15===this.setModeDiscount||(this.setModeDiscount+=5))}setItemWidth(){const t=this.getItemWidthFromDocument(),i=isNaN(t)?this.imageWidth:t;this.el.style.setProperty(J,`${i}px`)}setImageWidthSetMode(t){this.el.style.setProperty("--vviinn-set-mode-image-width",t)}getContentClassMap(){return{content:!0,[this.moveDirection]:!0,[this.mode]:!0,"show-scrollbar":!this.isSetMode&&this.showScroll}}handleResize(){this.setWidth(),this.processScrollbarWidth(),this.setItemWidth();const t=this.getColumnsNumber();t!==this.columns&&(this.columns=t)}calculateMoveStep(){const t=this.getContent().map((t=>t.getBoundingClientRect().width)),i=t.reduce(((t,i)=>t+i),0),e=o.pipe(window.getComputedStyle(this.getContentNode()),(t=>t.getPropertyValue("gap")),(t=>parseInt(t.split("px")[0])),(t=>isNaN(t)?0:t));return i/t.length+e}getHostParent(){return this.el.parentNode.host.parentElement}setWidth(){const t=this.getHostParent();if(!t)return;const i=getComputedStyle(t),e=t.getBoundingClientRect().width-(parseInt(i["padding-right"])+parseInt(i["padding-left"]));this.el.style.setProperty("--vviinn-carousel-content-width",`${e}px`)}getParent(){return this.el.parentNode.host.parentElement}cloneSlottedContent(){this.setWidth()}getActiveGroupIndex(){var t,i;if(!(null===(i=null===(t=this.getContentNode())||void 0===t?void 0:t.getBoundingClientRect())||void 0===i?void 0:i.left))return 0;const e=this.getContentGroups().map((t=>t.getBoundingClientRect().left)).map(((t,i)=>[t,i])).filter((t=>t[0]>=0));return e.length>0?this.isRTL?e[e.length-1][1]:e[0][1]:0}getContentNode(){return this.el.querySelector(".content")}getContent(){const t=this.getContentNode().children;return Array.from(t).map((t=>t))}getColumnsNumber(){const t=getComputedStyle(this.el).getPropertyValue("--vviinn-carousel-columns-internal"),i=parseInt(t);return i&&!isNaN(i)?i:4}getContentGroups(){return Array.from(this.el.querySelectorAll(`.${Q}`))}showNext(){this.moveDirection="right";const t=this.getContentNode();requestAnimationFrame((()=>{t.scrollTo({top:0,left:t.scrollLeft+this.calculateMoveStep(),behavior:"smooth"})}))}showPrev(){this.moveDirection="left";const t=this.getContentNode();requestAnimationFrame((()=>{t.scrollTo({top:0,left:t.scrollLeft-this.calculateMoveStep(),behavior:"smooth"})}))}scroll(t){const i=this.getContentNode();requestAnimationFrame((()=>{i.scrollTo({top:0,left:this.calculateMoveStep()*t,behavior:"smooth"})}))}processScrollbarWidth(){const t=this.getContentNode();t&&(this.el.style.setProperty("--vviinn-progressbar-width",t.clientWidth*((t.scrollLeft+t.clientWidth)/t.scrollWidth)+"px"),this.activeContentGroup=this.getActiveGroupIndex())}showBullets(){return this.isGridMode&&this.showScroll}showScrollbar(){return this.isContinuityMode&&this.showScroll}getClassMap(){return{[this.mode]:!0,"show-scrollbar":this.showScrollbar()}}renderRecommendation(i,e){var s;const n=this.setModeAppliedDiscounts[i.productId],r=(o=null===(s=i.price)||void 0===s?void 0:s.actual,Math.round(o*(1-(null!=n?n:this.setModeDiscount)/100)*100)/100);var o;return t("vviinn-product-card",{part:"product-part",productId:i.productId,productTitle:i.title,productType:i.productType,deeplink:i.deeplink,image:i.image.thumbnail,brand:i.brand,imageWidth:this.imageWidth,imageRatio:1,price:i.price.actual,salePrice:this.isSetMode?r:i.price.sale,responsive:this.isGridMode,dimmedBackground:this.isContinuityMode||this.isSetMode,campaignTypeId:this.campaignTypeId,index:e,widgetElementId:this.widgetElementId,widgetVersion:this.widgetVersion,addToBasketShow:this.addToBasketShow,mode:this.mode,"data-id":i.productId,updatingAllCards:this.updatingAllCards,defaultAnimationInterval:this.defaultAnimationInterval,updateButtonLocation:this.updateButtonLocation,appliedDiscountPercentage:n,currentDiscountPercentage:this.setModeDiscount})}renderRecommendationGroup(i){return t("div",{class:Q,part:"items-group"},...i)}renderRecommendationGroups(t){return t.map((t=>this.renderRecommendationGroup(t)))}renderRecommendations(){return this.isGridMode?this.renderGrid():this.renderRecommendationsElements()}renderRecommendationsElements(){return(this.isSetMode?this.crossSellingRecommendations:this.recommendations).map(((t,i)=>this.renderRecommendation(t,i)))}renderGrid(){const t=this.renderRecommendationsElements(),i=a.chunksOf(this.getColumnsNumber())(t);return this.renderRecommendationGroups(i)}renderBullets(){const i=Math.ceil(this.recommendations.length/this.getColumnsNumber());return Array.from(Array(i).keys()).map((i=>t("div",{class:{bullet:!0,active:this.activeContentGroup===i},onClick:()=>this.scroll(i)})))}render(){return t(e,{class:this.getClassMap()},t("div",{class:Object.assign({body:!0},this.getClassMap())},!this.isSetMode&&t("button",{class:"prev",onClick:()=>this.showPrev(),part:"carousel-button",disabled:this.gridArrowsDynamic&&this.isFirstGroup()},t(q,null)),this.isSetMode&&t("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:!0,isSourceProduct:!0}),t("div",{class:this.getContentClassMap(),onScroll:()=>this.processScrollbarWidth()},this.renderRecommendations()),!this.isSetMode&&t("button",{class:"next",onClick:()=>this.showNext(),part:"carousel-button",disabled:this.gridArrowsDynamic&&this.isLastGroup()},t(q,null))),this.showBullets()&&t("div",{class:"bullets"},this.renderBullets()))}get el(){return s(this)}static get watchers(){return{updatingAllCards:["updatingAllCardsWatcher"]}}};X.style=":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}";class Y{sendImpression(t){var i,e,s;gtag("event","view_item_list",{items:[{id:t.productId,name:t.title,brand:null!==(i=t.brand)&&void 0!==i?i:"",category:null!==(e=t.productType)&&void 0!==e?e:"",list_name:"VI VPR View",price:Math.min(t.price.actual,null!==(s=t.price.sale)&&void 0!==s?s:1/0)}]})}sendClick(t){var i,e,s;gtag("event","select_content",{content_type:"product",items:[{id:t.productId,name:t.title,brand:null!==(i=t.brand)&&void 0!==i?i:"",category:null!==(e=t.productType)&&void 0!==e?e:"",list_name:"VI VPR View",price:Math.min(t.price.actual,null!==(s=t.price.sale)&&void 0!==s?s:1/0)}]})}}class tt{constructor(){ga("require","ec")}convertProduct(t){var i,e,s;return{id:t.productId,name:t.title,brand:null!==(i=t.brand)&&void 0!==i?i:"",category:null!==(e=t.productType)&&void 0!==e?e:"",list:"VI VPR View",price:Math.min(t.price.actual,null!==(s=t.price.sale)&&void 0!==s?s:1/0)}}sendImpression(t){ga("ec:addImpression",this.convertProduct(t))}sendClick(t){var i,e,s;ga("ec:addProduct",{id:t.productId,name:t.title,brand:null!==(i=t.brand)&&void 0!==i?i:"",category:null!==(e=t.productType)&&void 0!==e?e:"",price:Math.min(t.price.actual,null!==(s=t.price.sale)&&void 0!==s?s:1/0)}),ga("ec:setAction","click",{list:"VI VPR View"})}}const it=h.getMonoid(c.first()).concat(o.pipe(h.fromNullable(window.gtag),h.map((()=>new Y))),o.pipe(h.fromNullable(window.ga),h.map((()=>new tt))));function et(t,i,e){return function(s){for(var n=Array(e.length+1),r=0;r<e.length;r++)n[r]=e[r];return n[e.length]=s,0===i?t.apply(null,n):et(t,i-1,n)}}var st={1:function(t){return[t]},2:function(t){return function(i){return[t,i]}},3:function(t){return function(i){return function(e){return[t,i,e]}}},4:function(t){return function(i){return function(e){return function(s){return[t,i,e,s]}}}},5:function(t){return function(i){return function(e){return function(s){return function(n){return[t,i,e,s,n]}}}}}};function nt(t){return d.call(st,t)||(st[t]=et(l,t-1,[])),st[t]}const rt=/fit\/\d+\//,ot=(t,i)=>o.pipe((t=>o.pipe(t.match(rt),u.fromNullable(t),u.map((()=>t))))(t),u.map((t=>t.replace(rt,`fit/${i}/`))),u.getOrElse((()=>t))),at=(i,e)=>i.deeplink?t("a",{class:i.part,part:i.part,href:i.deeplink},e):e,ht=i=>{const e=i.priceType,s=new Intl.NumberFormat(i.locale,{minimumFractionDigits:2}).format(i.price),n=i.prefix?t("span",{part:"price-prefix"},i.prefix+" "):null,r=i.currency?t("span",{part:"currency"}," ",i.currency):null;return t("span",{class:"price-amount",part:"price-amount"+(e?"-"+e:"")},n,s,r)},ct=i=>t("span",{class:"price-container",part:"price-container"},i.salePrice?[t("span",{class:"price-sale",part:"price-sale"},t(ht,{prefix:i.prefix,currency:i.currency,price:i.salePrice,locale:i.locale,priceType:"sale"})),t("span",{class:"price-outdated",part:"price-outdated"},t(ht,{prefix:i.prefix,currency:i.currency,price:i.price,locale:i.locale,priceType:"outdated"}))]:t("span",{class:"price-regular",part:"price-regular"},t(ht,{prefix:i.prefix,currency:i.currency,price:i.price,locale:i.locale,priceType:"regular"}))),dt=class{constructor(t){i(this,t),this.vviinnProductLoad=n(this,"vviinnProductLoad",7),this.vviinnProductView=n(this,"vviinnProductView",7),this.vviinnProductClick=n(this,"vviinnProductClick",7),this.vviinnAddToBasket=n(this,"vviinnAddToBasket",7),this.vviinnAuxClick=n(this,"vviinnAuxClick",7),this.vviinnCrossSellingClick=n(this,"vviinnCrossSellingClick",7),this.vviinnUpdatingAllCardsFinished=n(this,"vviinnUpdatingAllCardsFinished",7),this.productData=null,this.intersectionCallback=t=>{t.some((t=>t.isIntersecting))&&(o.pipe(it,h.map((t=>t.sendImpression(this.getProduct())))),this.vviinnProductView.emit(this.productData),this.intersectionObserver.disconnect())},this.brand=void 0,this.currency=void 0,this.deeplink=void 0,this.image=void 0,this.imageRatio=1,this.imageWidth=200,this.locale=void 0,this.price=void 0,this.pricePrefix=void 0,this.productId=void 0,this.productTitle=void 0,this.productType=void 0,this.salePrice=void 0,this.responsive=!1,this.dimmedBackground=!1,this.mode=void 0,this.addToBasketShow=void 0,this.updateButtonLocation=void 0,this.appliedDiscountPercentage=void 0,this.currentDiscountPercentage=void 0,this.isSourceProduct=!1,this.campaignTypeId=void 0,this.widgetElementId=void 0,this.buttonElementId=void 0,this.widgetVersion=void 0,this.index=0,this.updatingAllCards=void 0,this.defaultAnimationInterval=void 0,this.isTransitioning=!1}connectedCallback(){this.productData=this.getProductData(),this.isSetMode="set"===this.mode,this.isGridMode="grid"===this.mode,this.isContinuityMode="continuity"===this.mode}componentWillLoad(){A(this,this.el)}crossSellingClickListener({detail:t}){const{animationInterval:i}=t;this.isTransitioning=!0;const e=setTimeout((()=>{this.isTransitioning=!1,clearTimeout(e)}),i)}updatingAllCardsWatcher(){if(!this.updatingAllCards)return;this.isTransitioning=!0;const t=setTimeout((()=>{this.vviinnUpdatingAllCardsFinished.emit(),this.isTransitioning=!1,clearTimeout(t)}),this.defaultAnimationInterval)}productIdWatcher(){this.productData=this.getProductData()}getWidgetType(){return"VPR"===this.campaignTypeId||"VCS"===this.campaignTypeId?"VPR":"VPS"}getProductData(){var t;return{productId:this.productId,productRank:this.index,productName:this.productTitle,productType:this.productType,widgetType:this.getWidgetType(),campaignTypeId:this.campaignTypeId,campaignTypeName:_[this.campaignTypeId],widgetId:null!==(t=this.buttonElementId)&&void 0!==t?t:this.widgetElementId,widgetVersion:this.widgetVersion}}componentDidLoad(){this.vviinnProductLoad.emit(this.productData),this.intersectionObserver=new IntersectionObserver(this.intersectionCallback.bind(this.imageElement),{threshold:1}),this.intersectionObserver.observe(this.imageElement),this.el.shadowRoot.querySelectorAll("a").forEach((t=>{t.addEventListener("click",(t=>{t.preventDefault(),t.stopImmediatePropagation(),this.vviinnProductClick.emit(Object.assign(Object.assign({},this.productData),{clickEvent:t})),o.pipe(it,h.match((()=>null),(t=>t.sendClick(this.getProduct()))))})),t.addEventListener("auxclick",(()=>{this.vviinnAuxClick.emit(Object.assign({},this.productData))}))}))}getProduct(){return p.results.find((t=>t.productId===this.productId))}renderImage(){const i={width:this.imageWidth,height:this.imageWidth*this.imageRatio,src:this.image,title:this.productTitle,lazy:!1,ref:t=>{this.imageElement=t},isSource:this.isSourceProduct};return this.responsive?((i,e=(()=>{}))=>t("picture",null,t("img",{loading:i.lazy?"lazy":"eager",part:"image",class:"image responsive",src:ot(i.src,i.width),alt:i.title,ref:i.ref,onLoad:e})))(i):((i,e=(()=>{}))=>t("picture",null,t("img",{loading:i.lazy?"lazy":"eager",part:"image",class:"image",width:i.width,height:i.height,src:ot(i.src,i.width),alt:i.title,ref:i.ref,onLoad:e}),i.isSource&&t(j,null)))(i)}render(){var i,s,n;return t(e,{part:"product-card",class:{dimmed:this.dimmedBackground,animated:this.isTransitioning,"set-mode":this.isSetMode},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"},t(at,{deeplink:this.deeplink,part:"image-link"},this.renderImage()),this.isTransitioning?t(r,null,t("vviinn-skeleton",{height:20}),t("vviinn-skeleton",{height:20,halfWidth:!0})):t(r,null,t(at,{deeplink:this.deeplink,part:"deeplink"},t("span",{class:"title",part:"title"},this.productTitle)),t("span",{class:"brand",part:"brand"},this.brand),t("span",{class:"type",part:"type"},this.productType),t(ct,{prefix:null!==(i=this.pricePrefix)&&void 0!==i?i:g.pricePrefix,currency:null!==(s=this.currency)&&void 0!==s?s:g.currencySign,price:this.price,salePrice:this.salePrice,locale:null!==(n=this.locale)&&void 0!==n?n:g.locale}),this.isSetMode&&!this.appliedDiscountPercentage&&t("div",{class:"discount-label"},`-${this.currentDiscountPercentage}%`)),(this.addToBasketShow||this.isSetMode)&&t(r,null,this.isTransitioning?t("vviinn-skeleton",{height:44}):t("button",{class:{"basket-button":!0,"basket-button-grid":this.isGridMode||this.isSetMode,"basket-button-continuity ":this.isContinuityMode,"applied-discount":!!this.appliedDiscountPercentage},part:"basket-button",onClick:()=>{this.vviinnAddToBasket.emit(Object.assign(Object.assign({},this.productData),{discount:this.currentDiscountPercentage}))}},this.isSetMode?t(r,null,t(this.appliedDiscountPercentage?G:U,null),t("slot",{name:"vviinn-basket-button-text"},t("span",null,this.appliedDiscountPercentage?`${this.appliedDiscountPercentage}% ${R.t("setMode.appliedDiscountText")}`:R.t("setMode.basketButtonText")))):t("slot",{name:"vviinn-basket-button-text"},t("span",null,R.t("basketButtonText"))))),this.isSetMode&&!this.appliedDiscountPercentage&&t("button",{class:{"update-button":!0,hidden:"onTop"===this.updateButtonLocation},part:"update-button-item",onClick:()=>{this.vviinnCrossSellingClick.emit({animationInterval:(800,1400,Math.floor(601*Math.random())+800),productData:this.productData})}},t("slot",{name:"vviinn-update-icon-item"},t(K,null))))}get el(){return s(this)}static get watchers(){return{updatingAllCards:["updatingAllCardsWatcher"],productId:["productIdWatcher"]}}};dt.style=":host{align-items:center;display:flex;flex-direction:column;position:relative;gap:8px;height:100%;--min-image-size-set-mode:155px}.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}.image.responsive{width:100%;height:auto;aspect-ratio:1}.brand,.type{display:none}.title{-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow-wrap:anywhere;text-overflow:ellipsis;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;padding:6px;width:32px;height:32px;z-index:1;background-color:rgba(127, 127, 127, 0.4);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:none;color:white;cursor:pointer}.update-button svg{width:20px;height:20px}.update-button::after{content:\"\";position:absolute;top:-4px;right:-4px;width:calc(100% + 8px);height:calc(100% + 8px)}.update-button:hover{background-color:rgba(127, 127, 127, 0.5)}.update-button.hidden{display:none}.basket-button{font-size:16px;padding:10px 12px;box-sizing:border-box;border:none;cursor:pointer}.basket-button.basket-button-grid{width:100%;background-color:unset;border:1px solid #dddddd}.basket-button.basket-button-continuity{align-self:start;background-color:#f7f7f7}.basket-button-continuity:hover{background-color:#eaeaea}.basket-button-grid:hover{background-color:#f7f7f7}:host(.dimmed) picture::after{content:\"\";width:100%;height:100%;box-sizing:border-box;background-color:#f7f7f7;display:block;top:0;left:0;position:absolute;mix-blend-mode:multiply}:host(.animated) picture::after{mix-blend-mode:normal}:host(.animated) picture::before{opacity:1;animation:pulse 1.8s infinite}:host(.animated) picture::after{content: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\");background-color:transparent;position:absolute;width:80px;height:80px;left:calc(50% - 40px);top:calc(50% - 40px)}:host(.animated) .update-button{display:none}:host(.set-mode){line-height:20px;align-items:flex-start;height:auto}:host(.set-mode) .basket-button{display:flex;gap:8px;align-items:center;box-sizing:border-box;justify-content:center;border:none;background-color:#f4f4f4;font-weight:500;color:#525252}:host(.set-mode:not(.animated)) .basket-button{margin-top:auto}:host(.set-mode) .basket-button:hover{background-color:rgb(234, 234, 234)}:host(.set-mode) .title{font-weight:400}:host(.set-mode) .image{width:var(--vviinn-set-mode-image-width, 100%);height:auto;border:none;aspect-ratio:1;min-width:var(--min-image-size-set-mode);min-height:var(--min-image-size-set-mode)}:host(.set-mode.product-card--source){height:-moz-fit-content;height:fit-content;flex-grow:1}:host(.set-mode.product-card--source) .image{aspect-ratio:1;width:100%;height:100%}:host(.set-mode) picture .plus-icon{background-color:white;position:absolute;z-index:1;padding:16px;top:calc(50% - 32px);color:#a8a8a8;right:-88px;outline:1px solid #f4f4f4;border-radius:50%;width:32px;height:32px}@media (max-width: 768px){:host(.set-mode) picture .plus-icon{padding:8px;top:calc(50% - 24px);right:-24px}}:host(.set-mode) .basket-button.applied-discount{background:transparent;border:1px solid #e0e0e0}:host(.set-mode) .price-container{flex-direction:row;flex-wrap:wrap}:host(.set-mode) .price-amount{margin-right:12px}@media (max-width: 1080px){:host(.set-mode) .price-amount{margin-right:8px}}@keyframes pulse{0%{background-color:rgb(244, 244, 244)}50%{background-color:rgb(232, 232, 232)}100%{background-color:rgba(244, 244, 244)}}.discount-label{position:absolute;left:0;top:13px;line-height:20px;padding:2px 4px;border-radius:0px 4px 4px 0px;color:white;background-color:#ff3944;letter-spacing:0.5px}";const lt=class{constructor(t){i(this,t),this.height=void 0,this.halfWidth=!1}render(){return t(e,null,t("div",{class:{"vviinn-skeleton":!0},style:{height:`${this.height.toString()}px`,width:this.halfWidth?"50%":"100%"}}))}get el(){return s(this)}};function ut(t){return"function"==typeof t}function pt(t){const i=t((t=>{Error.call(t),t.stack=(new Error).stack}));return i.prototype=Object.create(Error.prototype),i.prototype.constructor=i,i}lt.style=":host{display:block;width:100%;height:100%;line-height:0}.vviinn-skeleton{display:inline-block;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)}}";const gt=pt((t=>function(i){t(this),this.message=i?`${i.length} errors occurred during unsubscription:\n${i.map(((t,i)=>`${i+1}) ${t.toString()}`)).join("\n ")}`:"",this.name="UnsubscriptionError",this.errors=i}));function vt(t,i){if(t){const e=t.indexOf(i);0<=e&&t.splice(e,1)}}class mt{constructor(t){this.initialTeardown=t,this.closed=!1,this._parentage=null,this._finalizers=null}unsubscribe(){let t;if(!this.closed){this.closed=!0;const{_parentage:i}=this;if(i)if(this._parentage=null,Array.isArray(i))for(const t of i)t.remove(this);else i.remove(this);const{initialTeardown:e}=this;if(ut(e))try{e()}catch(i){t=i instanceof gt?i.errors:[i]}const{_finalizers:s}=this;if(s){this._finalizers=null;for(const i of s)try{wt(i)}catch(i){t=null!=t?t:[],i instanceof gt?t=[...t,...i.errors]:t.push(i)}}if(t)throw new gt(t)}}add(t){var i;if(t&&t!==this)if(this.closed)wt(t);else{if(t instanceof mt){if(t.closed||t._hasParent(this))return;t._addParent(this)}(this._finalizers=null!==(i=this._finalizers)&&void 0!==i?i:[]).push(t)}}_hasParent(t){const{_parentage:i}=this;return i===t||Array.isArray(i)&&i.includes(t)}_addParent(t){const{_parentage:i}=this;this._parentage=Array.isArray(i)?(i.push(t),i):i?[i,t]:t}_removeParent(t){const{_parentage:i}=this;i===t?this._parentage=null:Array.isArray(i)&&vt(i,t)}remove(t){const{_finalizers:i}=this;i&&vt(i,t),t instanceof mt&&t._removeParent(this)}}mt.EMPTY=(()=>{const t=new mt;return t.closed=!0,t})();const bt=mt.EMPTY;function ft(t){return t instanceof mt||t&&"closed"in t&&ut(t.remove)&&ut(t.add)&&ut(t.unsubscribe)}function wt(t){ut(t)?t():t.unsubscribe()}const xt={onUnhandledError:null,onStoppedNotification:null,Promise:void 0,useDeprecatedSynchronousErrorHandling:!1,useDeprecatedNextContext:!1},Ct={setTimeout(t,i,...e){const{delegate:s}=Ct;return(null==s?void 0:s.setTimeout)?s.setTimeout(t,i,...e):setTimeout(t,i,...e)},clearTimeout(t){const{delegate:i}=Ct;return((null==i?void 0:i.clearTimeout)||clearTimeout)(t)},delegate:void 0};function yt(){}const kt=Tt("C",void 0,void 0);function Tt(t,i,e){return{kind:t,value:i,error:e}}function It(t){t()}class St extends mt{constructor(t){super(),this.isStopped=!1,t?(this.destination=t,ft(t)&&t.add(this)):this.destination=Vt}static create(t,i,e){return new At(t,i,e)}next(t){this.isStopped?Et(function(t){return Tt("N",t,void 0)}(t),this):this._next(t)}error(t){this.isStopped?Et(Tt("E",void 0,t),this):(this.isStopped=!0,this._error(t))}complete(){this.isStopped?Et(kt,this):(this.isStopped=!0,this._complete())}unsubscribe(){this.closed||(this.isStopped=!0,super.unsubscribe(),this.destination=null)}_next(t){this.destination.next(t)}_error(t){try{this.destination.error(t)}finally{this.unsubscribe()}}_complete(){try{this.destination.complete()}finally{this.unsubscribe()}}}const Pt=Function.prototype.bind;function Rt(t,i){return Pt.call(t,i)}class jt{constructor(t){this.partialObserver=t}next(t){const{partialObserver:i}=this;if(i.next)try{i.next(t)}catch(t){_t(t)}}error(t){const{partialObserver:i}=this;if(i.error)try{i.error(t)}catch(t){_t(t)}else _t(t)}complete(){const{partialObserver:t}=this;if(t.complete)try{t.complete()}catch(t){_t(t)}}}class At extends St{constructor(t,i,e){let s;if(super(),ut(t)||!t)s={next:null!=t?t:void 0,error:null!=i?i:void 0,complete:null!=e?e:void 0};else{let i;this&&xt.useDeprecatedNextContext?(i=Object.create(t),i.unsubscribe=()=>this.unsubscribe(),s={next:t.next&&Rt(t.next,i),error:t.error&&Rt(t.error,i),complete:t.complete&&Rt(t.complete,i)}):s=t}this.destination=new jt(s)}}function _t(t){var i;i=t,Ct.setTimeout((()=>{const{onUnhandledError:t}=xt;if(!t)throw i;t(i)}))}function Et(t,i){const{onStoppedNotification:e}=xt;e&&Ct.setTimeout((()=>e(t,i)))}const Vt={closed:!0,next:yt,error:function(t){throw t},complete:yt},Bt="function"==typeof Symbol&&Symbol.observable||"@@observable";function Lt(t){return t}class zt{constructor(t){t&&(this._subscribe=t)}lift(t){const i=new zt;return i.source=this,i.operator=t,i}subscribe(t,i,e){const s=(n=t)&&n instanceof St||function(t){return t&&ut(t.next)&&ut(t.error)&&ut(t.complete)}(n)&&ft(n)?t:new At(t,i,e);var n;return It((()=>{const{operator:t,source:i}=this;s.add(t?t.call(s,i):i?this._subscribe(s):this._trySubscribe(s))})),s}_trySubscribe(t){try{return this._subscribe(t)}catch(i){t.error(i)}}forEach(t,i){return new(i=Ot(i))(((i,e)=>{const s=new At({next:i=>{try{t(i)}catch(t){e(t),s.unsubscribe()}},error:e,complete:i});this.subscribe(s)}))}_subscribe(t){var i;return null===(i=this.source)||void 0===i?void 0:i.subscribe(t)}[Bt](){return this}pipe(...t){return(0===(i=t).length?Lt:1===i.length?i[0]:function(t){return i.reduce(((t,i)=>i(t)),t)})(this);var i}toPromise(t){return new(t=Ot(t))(((t,i)=>{let e;this.subscribe((t=>e=t),(t=>i(t)),(()=>t(e)))}))}}function Ot(t){var i;return null!==(i=null!=t?t:xt.Promise)&&void 0!==i?i:Promise}zt.create=t=>new zt(t);const Mt=pt((t=>function(){t(this),this.name="ObjectUnsubscribedError",this.message="object unsubscribed"}));class Wt extends zt{constructor(){super(),this.closed=!1,this.currentObservers=null,this.observers=[],this.isStopped=!1,this.hasError=!1,this.thrownError=null}lift(t){const i=new $t(this,this);return i.operator=t,i}_throwIfClosed(){if(this.closed)throw new Mt}next(t){It((()=>{if(this._throwIfClosed(),!this.isStopped){this.currentObservers||(this.currentObservers=Array.from(this.observers));for(const i of this.currentObservers)i.next(t)}}))}error(t){It((()=>{if(this._throwIfClosed(),!this.isStopped){this.hasError=this.isStopped=!0,this.thrownError=t;const{observers:i}=this;for(;i.length;)i.shift().error(t)}}))}complete(){It((()=>{if(this._throwIfClosed(),!this.isStopped){this.isStopped=!0;const{observers:t}=this;for(;t.length;)t.shift().complete()}}))}unsubscribe(){this.isStopped=this.closed=!0,this.observers=this.currentObservers=null}get observed(){var t;return(null===(t=this.observers)||void 0===t?void 0:t.length)>0}_trySubscribe(t){return this._throwIfClosed(),super._trySubscribe(t)}_subscribe(t){return this._throwIfClosed(),this._checkFinalizedStatuses(t),this._innerSubscribe(t)}_innerSubscribe(t){const{hasError:i,isStopped:e,observers:s}=this;return i||e?bt:(this.currentObservers=null,s.push(t),new mt((()=>{this.currentObservers=null,vt(s,t)})))}_checkFinalizedStatuses(t){const{hasError:i,thrownError:e,isStopped:s}=this;i?t.error(e):s&&t.complete()}asObservable(){const t=new zt;return t.source=this,t}}Wt.create=(t,i)=>new $t(t,i);class $t extends Wt{constructor(t,i){super(),this.destination=t,this.source=i}next(t){var i,e;null===(e=null===(i=this.destination)||void 0===i?void 0:i.next)||void 0===e||e.call(i,t)}error(t){var i,e;null===(e=null===(i=this.destination)||void 0===i?void 0:i.error)||void 0===e||e.call(i,t)}complete(){var t,i;null===(i=null===(t=this.destination)||void 0===t?void 0:t.complete)||void 0===i||i.call(t)}_subscribe(t){var i,e;return null!==(e=null===(i=this.source)||void 0===i?void 0:i.subscribe(t))&&void 0!==e?e:bt}}const Nt=o.flow((t=>`Bearer ${t}`),(t=>new Headers({Authorization:t})),(t=>({headers:t}))),Dt=(Ht=C,function(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];for(var e=t.length,s=nt(e),n=Ht.map(t[0],s),r=1;r<e;r++)n=Ht.ap(n,t[r]);return n});var Ht;const Zt=(t,i={})=>v(Dt(w(),x),f,m(b(t,i))),Ft=t=>i=>e=>s=>n=>{const r=o.pipe(s,y(encodeURIComponent),k((()=>{const s=[];i&&s.push(`color=${i}`),e&&s.push(e);const n=T(s);return`product/${t}/similar-products${n}`}),(s=>{const n=[];s&&n.push(`campaigns=${s}`),i&&n.push(`color=${i}`),e&&n.push(e);const r=T(n);return`product/${t}/similar-products${r}`})));return Zt(r,n)},Ut=t=>i=>e=>s=>n=>{const r=o.pipe(s,y(encodeURIComponent),k((()=>{const s=[];i&&s.push(`color=${i}`),e&&s.push(e);const n=T(s);return`product/${t}/cross-selling-products${n}`}),(s=>{const n=[];s&&n.push(`campaigns=${s}`),i&&n.push(`color=${i}`),e&&n.push(e);const r=T(n);return`product/${t}/cross-selling-products${r}`})));return Zt(r,n)},Gt={de:{translation:{noResultText:"Keine Ergebnisse! Versuche es bitte später erneut.",basketButtonText:"In den Warenkorb",setMode:{widgetTitle:"Kaufen Sie ein Set und erhalten Sie Rabatt",widgetSubtitle:"Sparen Sie bis zu 15% beim Kauf von Produkten aus der Liste",basketButtonText:"Als Set kaufen",appliedDiscountText:"gespart",updateButtonText:"Neues Set vorschlagen"}}},en:{translation:{noResultText:"No results! Please, try again later.",basketButtonText:"Add to Basket",setMode:{widgetTitle:"Buy a set to get discount",widgetSubtitle:"Save up to 15% for buying products from the list",basketButtonText:"Buy as set",appliedDiscountText:"saved",updateButtonText:"Suggest New Set"}}}};var qt=function(t,i){var e={};for(var s in t)Object.prototype.hasOwnProperty.call(t,s)&&i.indexOf(s)<0&&(e[s]=t[s]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(s=Object.getOwnPropertySymbols(t);n<s.length;n++)i.indexOf(s[n])<0&&Object.prototype.propertyIsEnumerable.call(t,s[n])&&(e[s[n]]=t[s[n]])}return e};const Kt=class{constructor(t){i(this,t),this.vviinnWidgetLoad=n(this,"vviinnWidgetLoad",7),this.vviinnProductLoad=n(this,"vviinnProductLoad",7),this.vviinnProductView=n(this,"vviinnProductView",7),this.vviinnProductClick=n(this,"vviinnProductClick",7),this.vviinnResultLoad=n(this,"vviinnResultLoad",7),this.vviinnResultView=n(this,"vviinnResultView",7),this.vviinnNoResult=n(this,"vviinnNoResult",7),this.vviinnAddToBasket=n(this,"vviinnAddToBasket",7),this.globalSlotsChanged=n(this,"globalSlotsChanged",7),this.vviinnRecommendationsLoaded=n(this,"vviinnRecommendationsLoaded",7),this.vviinnWidgetOpen=n(this,"vviinnWidgetOpen",7),this.vviinnWidgetClose=n(this,"vviinnWidgetClose",7),this.productImageLoadedSubject=new Wt,this.resultViewed=!1,this.setTrackingDeactivated=t=>{"rejected"===t.status&&(this.trackingDeactivated=!0)},this.blockTitle="Recommended products",this.imageRatio=1,this.imageWidth=300,this.productId=void 0,this.token=void 0,this.currencySign="€",this.pricePrefix="",this.mode="continuity",this.campaignType="VPR",this.locale="de-DE",this.campaigns="",this.color="",this.gridArrowsDynamic=!1,this.noResultText="",this.noResultShow=!0,this.showScroll=!0,this.cssUrl=null,this.excluded="",this.productDetailNewTab=!1,this.addToBasketShow=!1,this.updateButtonLocation="topAndItem",this.apiPath="https://api.vviinn.com",this.useCarousel=!0,this.showingInButton=!1,this.buttonElementId=void 0,this.closed=void 0,this.opened=void 0,this.recommendations=[],this.trackingDeactivated=!1,this.hasErrorOnLoad=!1,this.updatingAllCards=!1}getBasicEventData(){return{widgetType:"VPR",campaignTypeId:this.campaignType,campaignTypeName:_[this.campaignType],widgetId:this.id,widgetVersion:L}}handleOpenLink(t,i){if(this.productDetailNewTab||i.ctrlKey||i.metaKey){let i=window.open();i?i.location.href=t:window.location.href=t}else window.location.href=t}findProductById(t){return this.recommendations.find((i=>i.productId===t))}handleProductIdChange(){this.getRecommendations()}handleCampaignTypeChange(){this.getRecommendations()}handleCampaignsChange(){this.getRecommendations()}handleApiPathChange(t){g.apiPath=t,this.getRecommendations()}trackWidgetOpen(){this.opened&&(this.vviinnWidgetOpen.emit(this.getBasicEventData()),this.trackWidgetEvent("open"))}trackWidgetClose(){this.closed&&(this.vviinnWidgetClose.emit(this.getBasicEventData()),this.trackWidgetEvent("close"))}componentDidRender(){if(this.showingInButton&&this.closed)return;const t=this.el.querySelectorAll("[slot]");this.globalSlotsChanged.emit(Array.from(t))}connectedCallback(){var t;g.apiPath=this.apiPath,g.pricePrefix=this.pricePrefix,g.currencySign=this.currencySign,g.locale=this.locale,this.id=null!==(t=this.buttonElementId)&&void 0!==t?t:this.el.id,this.uiSessionId=z(),this.trackingApi=O(this.apiPath,this.token),this.getRecommendations(),this.vviinnWidgetLoad.emit(this.getBasicEventData()),this.trackWidgetEvent("load"),this.isSetMode="set"===this.mode,this.isGridMode="grid"===this.mode,this.isContinuityMode="continuity"===this.mode}async componentWillLoad(){await R.init({lng:this.locale,fallbackLng:"en",resources:Gt}),this.excluded&&(this.excluded=I(this.excluded))}trackProductLoad({detail:t}){this.productImageLoadedSubject.next(t.productId);const i=this.getProductTrackEvent(t,"load");i&&this.trackingApi.trackEvent(i).then(this.setTrackingDeactivated)}trackProductView({detail:t}){this.resultViewed||(this.resultViewed=!0,this.vviinnResultView.emit(this.getBasicEventData()),this.trackResultEvent("view"));const i=this.getProductTrackEvent(t,"view");i&&this.trackingApi.trackEvent(i).then(this.setTrackingDeactivated)}async trackProductClick({detail:t}){const{productId:i,clickEvent:e}=t,s=this.findProductById(i);if(!s||!s.deeplink)return;const n=this.getProductTrackEvent(t,"click");this.trackingDeactivated?this.handleOpenLink(s.deeplink,e):await this.trackingApi.trackEvent(n).then(this.setTrackingDeactivated).finally((()=>{this.handleOpenLink(s.deeplink,e)}))}async trackAuxClick({detail:t}){const{productId:i}=t,e=this.findProductById(i);if(!e||!e.deeplink)return;const s=this.getProductTrackEvent(t,"click");this.trackingDeactivated||await this.trackingApi.trackEvent(s).then(this.setTrackingDeactivated)}async trackAddToBasket({detail:t}){const{productRank:i,productId:e}=t,s=qt(t,["productRank","productId","campaignTypeId","widgetType"]);let n;const r=Object.assign({session_id:this.uiSessionId,rank:i,product:e},s);"VCS"===this.campaignType?n=M(r):"VPR"===this.campaignType&&(n=W(r)),this.trackingApi.trackEvent(n).then(this.setTrackingDeactivated)}updatingAllCardsFinishedListener(){this.updatingAllCards&&(this.updatingAllCards=!1)}trackWidgetEvent(t){if(this.trackingDeactivated)return;const i=this.getBasicEventData(),e=qt(i,["campaignTypeId","widgetType"]);let s;const n=Object.assign({action:t,session_id:this.uiSessionId},e);"VCS"===this.campaignType?s=$(n):"VPR"===this.campaignType&&(s=N(n)),this.trackingApi.trackEvent(s).then(this.setTrackingDeactivated)}trackResultEvent(t){if(this.trackingDeactivated)return;const i=this.getBasicEventData(),e=qt(i,["campaignTypeId","widgetType"]);let s;const n=Object.assign({session_id:this.uiSessionId},e);"VCS"===this.campaignType?s=D(t)(n):"VPR"===this.campaignType&&(s=H(t)(n)),this.trackingApi.trackEvent(s).then(this.setTrackingDeactivated)}getProductTrackEvent(t,i){if(this.trackingDeactivated)return null;const{productRank:e,productId:s,campaignTypeId:n}=t,r=qt(t,["productRank","productId","campaignTypeId","widgetType","clickEvent"]);let o;const a=Object.assign({session_id:this.uiSessionId,rank:e,product:s},r);return"VCS"===n?o=Z(i)(a):"VPR"===n&&(o=F(i)(a)),o}async getRecommendations(){if(void 0===this.productId||void 0===this.token)return;const t=this.campaignType.length>0?this.campaignType:"VPR",i=Nt(this.token),e=o.pipe(S.of((t=>o.pipe(E(t),V((()=>Ft),(()=>Ut))))(t)),S.ap(S.of(this.productId)),S.ap(S.of(this.color)),S.ap(S.of(this.excluded)),S.ap(S.of(P(this.campaigns))),S.ap(S.of(i)),S.flatten),s=await e();o.pipe(s,u.fold((t=>{this.handleError(t),this.vviinnNoResult.emit(this.getBasicEventData()),this.vviinnRecommendationsLoaded.emit()}),(t=>this.handleRecommendationsSuccess(t))))}handleError(t){this.hasErrorOnLoad=!0}handleRecommendationsSuccess(t){var i;this.vviinnResultLoad.emit(this.getBasicEventData()),this.trackResultEvent("load"),this.recommendations=null!==(i=null==t?void 0:t.extended)&&void 0!==i?i:t,p.results=this.recommendations,this.productIds=this.recommendations.map((t=>t.productId)),this.productImageLoadedSubject.subscribe((t=>{this.productIds=this.productIds.filter((i=>i!==t)),0===this.productIds.length&&this.vviinnRecommendationsLoaded.emit()}))}isExternalCSS(){return this.cssUrl&&this.cssUrl.length>0}renderExternalCSS(){return this.isExternalCSS()?t("link",{href:this.cssUrl,rel:"stylesheet"}):""}render(){return 0===this.recommendations.length&&!1===this.noResultShow?null:t(e,{class:{loaded:!0,empty:0==this.recommendations.length,[this.mode]:!0},"aria-hidden":"false"},this.addToBasketShow&&t(B,null),t(r,null,this.renderExternalCSS(),t("style",null,g.fallbackStyles),t("div",{class:"widget-header"},t("div",null,t("h2",{part:"recommendations-title"},this.isSetMode?R.t("setMode.widgetTitle"):this.blockTitle),this.isSetMode&&t("h3",null,R.t("setMode.widgetSubtitle"))),this.isSetMode&&"onItem"!==this.updateButtonLocation?t("button",{class:"update-button",part:"update-button-top",onClick:()=>this.updatingAllCards=!0},t("slot",{name:"vviinn-update-icon-top"},t(K,null)),t("span",null,R.t("setMode.updateButtonText"))):null),this.recommendations.length>0&&(this.useCarousel?this.renderCarousel():this.renderResults()),0===this.recommendations.length&&this.hasErrorOnLoad&&t("p",{class:"no-result-text"},this.noResultText.length?this.noResultText:R.t("noResultText"))))}renderRecommendation(i,e){return t("vviinn-product-card",{part:"product-part",productId:i.productId,productTitle:i.title,productType:i.productType,deeplink:i.deeplink,image:i.image.thumbnail,brand:i.brand,imageWidth:this.imageWidth,imageRatio:1,price:i.price.actual,salePrice:i.price.sale,responsive:this.isGridMode,addToBasketShow:this.addToBasketShow,mode:this.mode,dimmedBackground:this.useDimmedBackgroundInCard(),campaignTypeId:this.campaignType,index:e,widgetElementId:this.id,widgetVersion:L})}useDimmedBackgroundInCard(){return this.isContinuityMode||this.isSetMode||!this.useCarousel}renderResults(){return t("div",{class:"recommendations-grid",part:"recommendations-grid"},this.recommendations.map(((t,i)=>this.renderRecommendation(t,i))))}renderCarousel(){return t("vviinn-carousel",{mode:this.mode,campaignTypeId:this.campaignType,imageWidth:this.imageWidth,showScroll:this.showScroll,recommendations:this.recommendations,widgetElementId:this.id,widgetVersion:L,gridArrowsDynamic:this.gridArrowsDynamic,addToBasketShow:this.addToBasketShow,updatingAllCards:this.updatingAllCards,updateButtonLocation:this.updateButtonLocation})}get el(){return s(this)}static get watchers(){return{productId:["handleProductIdChange"],campaignType:["handleCampaignTypeChange"],campaigns:["handleCampaignsChange"],apiPath:["handleApiPathChange"],opened:["trackWidgetOpen"],closed:["trackWidgetClose"]}}};Kt.style=":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}";export{X as vviinn_carousel,dt as vviinn_product_card,lt as vviinn_skeleton,Kt as vviinn_vpr_widget}
|